@charset "utf-8";

/*------------------------------------------------
   ２丁目だより
------------------------------------------------*/

/*------------------------------------------------
   一覧ページ
------------------------------------------------*/

#tayori {
  width: 100%;
}

#tayori .tayoriBlock {
  width: 100%;
}

.tayoriList {
	width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.tayoriBox {
	width: 48%;
	box-shadow: 0 10px 10px -6px rgba(0,0,0,.2);
  position: relative;
	
  padding: 10px;
  border: 1px solid var(--line-color);
  background: var(--bg-color);
  transition: all 0.5s;
  margin-bottom: 40px;
}

.tayoriBox a {
	display: block;
  text-decoration: none;
  transition: all 0.5s;
}

.tayoriBox a:hover {
  opacity: 0.8;
}

.tayoriBox .imageBlock {
  margin-bottom: 10px;
}

.tayoriBox .imageBlock .image {
	width: 100%;
}

.tayoriBox .imageBlock .image img {
	width: 100%;
  height: auto;
  border: 1px solid var(--line-color);
}

.tayoriBox .textBlock {
	position: relative;
  padding: 0.8em;
}

.tayoriBox .textBlock .tayoriTitle {
	font-size: 1.3rem;
  color: var(--main-color);
  text-align: center;
  font-weight: 400;
}

.tayoriBox:hover {
	box-shadow: 0 6px 10px -6px rgba(0,0,0,.2);
}

.tayoriBox:hover .imageBlock img {
	opacity: 0.8;
}

@media print, screen and (min-width: 601px) {

  #tayori .tayoriBlock {
    width: 100%;
  }
	
  .tayoriList {
	}

	/* ボックスが２つ余るときのため */
  .tayoriList::after {
    display: block;
    content:"";
    width: 280px;
  }
	
  .tayoriBox {
    width: 280px;
	  margin-bottom: 30px;
  }

  .tayoriBox .textBlock .tayoriTitle {
    font-size : 1.6rem;
  }

}