#container {
  max-width: 1200px;
  margin: 0 auto;
}
#main {
  width: 100%;
}


.mainContents {
  font-family: Meiryo;/*フォント種類*/
  font-size: 15px;
  color:#333333;/*文字色*/
}





.display_sp {
    display: none !important;
}

.display_pc{
		display: block !important;
}

@media (max-width: 767px) {
    .mainContents {
        width: 100%;
    }
	.display_sp {
    display: block !important;
	}
	.display_pc{
		display: none !important;
	}
}




h2 {
  padding: 0.25em 1em;/*上下 左右の余白*/
  background: #ffc5d3;
  font-size: 18px;
  font-family: Meiryo;/*フォント種類*/
  color:#3a2d30;/*文字色*/
  font-weight: bold;
}




/* ボタン */

a.button {
    background-color: #f46c64; /* 背景色 */
    color: #ffffff; /* 文字色 */
    padding: 15px 32px; /* パディング */
    text-align: center; /* 文字のアライメント */
    text-decoration: none; /* 文字装飾 */
    display: inline-block; /* ボタンの表示方法 */
    font-size: 16px; /* フォントサイズ */
    font-family: Arial, sans-serif; /* フォント */
    margin: 4px 2px; /* 外側の余白 */
    cursor: pointer; /* カーソル */
    border: none; /* ボーダーなし */
    border-radius: 10px; /* 角丸 */
}

a.button:hover {
    background-color: #c15452;
}



/* Flexbox PC↓ */
 .wrapper-2501_huku {
    width: 100%;
    margin: 0 auto;
    padding: 10px 20px;
    background-color: #ddd;
    box-sizing: border-box;
 }
 .archive-list {
    display: flex;
    justify-content:space-between;
    padding: 0;
 }
 .archive-item {
   width: 22%; /*基本左寄せだからここの数字で場所を調整 */
   padding: 20px;
   background-color: #fff;
   display: flex;
   flex-direction: column;
 }
 .archive-img-wrap {
   width: 100%;
   height: auto;
   margin-bottom: 10px;
 }
 .archive-img-wrap img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }
 .archive-item:not(:nth-child(3n)) {
   margin-right: 20px;
 }
 .archive-ttl {
   margin-bottom: 10px;
   line-height: 1.5;
   background-color: #fff;
   flex-grow: 1;
 }



/* Flexbox SP↓ */

 .wrapper-2501_huku-sp {
    width: 100%;
    margin: 0 auto;
    padding: 5px 20px;
    background-color: #ddd;
    box-sizing: border-box;
 }
 .archive-list-sp {
    display: flex;
    padding: 0;
    flex-flow: column;
 }
 .archive-item-sp {
   width: 100%; /*基本左寄せだからここの数字で場所を調整 */
   padding: 20px;
   background-color: #fff;
   display: flex;
   flex-direction: column;
 }
 .archive-img-wrap-sp {
   width: 100%;
   height: auto;
   margin-bottom: 10px;
 }
 .archive-img-wrap-sp img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }
 .archive-item-sp:not(:nth-child(3n)) {
   margin-right: 20px;
 }
 .archive-ttl-sp {
   margin-bottom: 10px;
   line-height: 1.5;
   background-color: #fff;
   flex-grow: 1;
 }