@charset "utf-8";
/*************************************************
 top.css
**************************************************/

/* gnav*/
.sec_01{z-index: 50;position: relative;}
.sec_02{z-index: 200;position: absolute;margin-top: -20px;left: 0;right: 0;}
.sec_02 nav{width: 1024px;margin:0 auto;}
#menu{border-radius:5pt;}
.contents nav ul{background:#FFFDF2;}

.contents{background:#FFFDF2;margin-bottom:0;}

/* 館林の紹介 */
.sec_03{margin-top:133px;}
.sec_03 .wrap{display: flex;}
.sec_03 .wrap .flex_item_left,.sec_03 .wrap .flex_item_right{width:50%;padding: 1em;margin-top: 30px;}
.sec_03 .wrap .flex_item_left{text-align: center;}
.sec_03 .wrap .flex_item_right h2{text-align: center;border-bottom: 2px solid #C7DE78;font-size: 1.2em;font-weight: 300;} 


/*イメージバナー*/
.contents_under{padding-bottom:95px;overflow:visible;background:url("../img/bg_color01.jpg");}
.sec_04 .wrap{width:1024px;margin:auto;}
.sec_04 .top_image_banner { display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; margin-top: 30px; margin-bottom: 30px; padding: 0;}
.sec_04 .top_image_banner li {width: 29.999999999%;margin: 10px 1.6%;text-align:ceter;}
.sec_04 .top_image_banner li a img{border: solid 5px #fff;max-width: 100%;height: auto;}

/*************************************************
 レスポンシブ　1024 + 20 
**************************************************/
@media screen and (max-width:1044px) {
    .sec_04 .wrap{width:auto;}
	.sec_03 {margin-top: 0;}
	.sec_03 .wrap {flex-direction: column-reverse;}
	.sec_03 .wrap .flex_item_left, .sec_03 .wrap .flex_item_right {width: 100%;}
	.contents nav ul{background: none;}
	
}

/*************************************************
 レスポンシブ　940 + 20 
**************************************************/
@media screen and (max-width:960px) {
	.sec_03 {margin-top: 0;}
	.sec_03 .wrap {flex-direction: column-reverse;}
	.sec_03 .wrap .flex_item_left, .sec_03 .wrap .flex_item_right {width: 100%;}

	.sec_04 .top_image_banner li {width: 46.8%;margin: 10px 1.6%;text-align: center;}
}



/*************************************************
 レスポンシブ　560 + 20 
**************************************************/
@media screen and (max-width:580px) {
.sec_04 .top_image_banner {flex-direction: column;}
.sec_04 .top_image_banner li {width: 96.8%;margin: 10px 1.6%;text-align: center;}
}

