@charset "UTF-8";


html,body { height: auto; }
#main-content{ overflow: hidden; }
#main-content .hero{ position: relative; }
#main-content .hero .ttl-body{ position: relative; width: 100%; text-align: center; z-index: 50; background-color: #ffffff; padding: 20px 0; }
#main-content .hero .ttl-body > *{ color: #6b6b6b; }
#main-content .hero .ttl-body .en{ font-size: 28px; line-height: 1.2; font-weight: bold; letter-spacing: 0.4em; padding-left: 0.4em; }
#main-content .hero .ttl-body .ttl{ font-size: 16px; line-height: 1.5; font-weight: normal; margin-top: 10px; }
#main-content .hero .photo{ width: 100%; }
#main-content .hero .photo img{ width: 100%; height: auto; }
#main-content .hero .caption01{ position: absolute; left: 0; bottom: 0; padding: 2px 7px; color: #ffffff; z-index: 10; background-color: rgba(0,0,0,0.8); }
#main-content .hero .caption02{ position: absolute; right: 0; bottom: 0; padding: 2px 7px; color: #ffffff; z-index: 10; background-color: rgba(0,0,0,0.8); }
#main-content .intro{ background: url(../images/img_commonarea/bg01.jpg) center center no-repeat; background-size: cover; text-align: center; padding: 120px 5% 100px; }
#main-content .intro .copy{ padding-bottom: 70px; }
#main-content .intro .txt{ font-size: 16px; line-height: 2.375; color: #1f2123; }
#main-content .sec01{ position: relative; }
#main-content .sec01 .photo-body{ position: relative; }
#main-content .sec01 .photo-body .photo img{ max-width: none; width: 100%; height: auto; }
#main-content .sec01 .photo-body .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 7px; color: #ffffff; z-index: 10; background-color: rgba(0,0,0,0.8); }
#main-content .sec01 .txt-body{ position: absolute; border: 1px solid #af8a75; background-color: rgba(32,23,21,0.8); left: 0; bottom: 0; padding: 20px; box-sizing: border-box; width: 370px; margin: 0 0 3% 3%; }
#main-content .sec01 .txt-body .head{ font-size: 24px; line-height: 1.2; color: #af8a75; border-bottom: 1px solid #af8a75; padding-bottom: 10px; margin-bottom: 10px; }
#main-content .sec01 .txt-body .txt{ font-size: 14px; line-height: 1.71; color: #ffffff; }
#main-content .sec02{ margin: 70px auto 0; max-width: 1112px; }
#main-content .sec02 .sec-ttl{ font-size: 32px; line-height: 1.5; color: #6b6b6b; font-weight: normal; text-align: center; }
#main-content .sec02 .photo-wrap{ margin: 50px auto 0; position: relative; }
#main-content .sec02 .photo-wrap .photo-list{ display: flex; display: -ms-flex; justify-content: space-between; flex-wrap: wrap; }
#main-content .sec02 .photo-wrap .photo-list .photo-body{ position: relative; }
#main-content .sec02 .photo-wrap .photo-list .photo-body01{ width: 100%; }
#main-content .sec02 .photo-wrap .photo-list .photo-body02{ width: 61.0611%; margin-top: 0.7195%; }
#main-content .sec02 .photo-wrap .photo-list .photo-body03{ width: 38.2194%; margin-top: 0.7195%; }
#main-content .sec02 .photo-wrap .photo-list .photo-body .photo img{ max-width: none; width: 100%; height: auto; }
#main-content .sec02 .photo-wrap .photo-list .photo-body .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 7px; color: #ffffff; z-index: 10; background-color: rgba(0,0,0,0.8); }
#main-content .sec02 .photo-wrap .txt-body{ position: absolute; border: 1px solid #af8a75; background-color: rgba(32,23,21,0.8); left: 0; top: 0; padding: 20px; box-sizing: border-box; width: 370px; margin: 45.8633% 0 0 3%; transform: translateY(-86px); }
#main-content .sec02 .photo-wrap .txt-body .head{ font-size: 24px; line-height: 1.2; color: #af8a75; border-bottom: 1px solid #af8a75; padding-bottom: 10px; margin-bottom: 10px; }
#main-content .sec02 .photo-wrap .txt-body .txt{ font-size: 14px; line-height: 1.71; color: #ffffff; }
#main-content .sec03{ margin: 70px auto 0; max-width: 1112px; }
#main-content .sec03 .sec-ttl{ font-size: 40px; line-height: 1.2; color: #af8a75; font-weight: normal; text-align: center; }
#main-content .sec03 .txt{ margin-top: 10px; font-size: 16px; line-height: 1.5; text-align: center; }
#main-content .sec03 .photo-body{ position: relative; margin: 30px auto 0; }
#main-content .sec03 .photo-body .photo img{ max-width: none; width: 100%; height: auto; }
#main-content .sec03 .photo-body .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 7px; color: #ffffff; z-index: 10; background-color: rgba(0,0,0,0.8); }
#main-content .sec04{ position: relative; z-index: 10; max-width: 1112px; margin: 70px auto 0; }
#main-content .sec04 .photo-body{ position: relative; }
#main-content .sec04 .photo-body .photo img{ max-width: none; width: 100%; height: auto; }
#main-content .sec04 .photo-body .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 7px; color: #ffffff; z-index: 10; background-color: rgba(0,0,0,0.8); }
#main-content .sec04 .txt-body{ position: absolute; border: 1px solid #af8a75; background-color: rgba(32,23,21,0.8); right: 0; top: 0; padding: 20px; box-sizing: border-box; width: 370px; margin: 3% 3% 0 0; }
#main-content .sec04 .txt-body .head{ font-size: 20px; line-height: 1.3; color: #ffffff; border-bottom: 1px solid #af8a75; padding-bottom: 10px; margin-bottom: 10px; }
#main-content .sec04 .txt-body .txt{ font-size: 14px; line-height: 1.71; color: #ffffff; }
#main-content .sec05{ position: relative; margin: -250px auto 0; }
#main-content .sec05 .photo-body{ position: relative; }
#main-content .sec05 .photo-body .photo img{ max-width: none; width: 100%; height: auto; }
#main-content .sec05 .photo-body .caption{ position: absolute; right: 0; bottom: 0; padding: 2px 7px; color: #ffffff; z-index: 10; background-color: rgba(0,0,0,0.8); }
#main-content .sec06{ margin: 70px auto 0; max-width: 1112px; }
#main-content .sec06 .ttl-body .sec-ttl{ font-size: 32px; line-height: 1.5; color: #6b6b6b; font-weight: normal; text-align: center; }
#main-content .sec06 .ttl-body .head{ font-size: 18px; line-height: 1.5; border-bottom: 1px solid #cccccc; padding-bottom: 10px; margin-bottom: 10px; margin-top: 30px; }
#main-content .sec06 .ttl-body .txt{ font-size: 16px; line-height: 1.75; }
#main-content .sec06 .map-wrap{ margin-top: 50px; }
#main-content .sec06 .map-wrap .local-navi{ border-bottom: 1px solid #98694c; display: flex; display: -ms-flex; justify-content: center; }
#main-content .sec06 .map-wrap .local-navi .navi{ width: 22.7%; text-align: center; display: flex; display: -ms-flex; justify-content: center; align-items: flex-end; }
#main-content .sec06 .map-wrap .local-navi .navi:nth-child(n+2){ margin-left: 1%; }
#main-content .sec06 .map-wrap .local-navi .navi .inner{ border: 1px solid #98694c; border-bottom: none; width: 100%; padding: 15px 0; background-color: #ffffff; color: #98694c; font-size: 36px; line-height: 1.2; border-radius: 8px 8px 0 0; cursor: pointer; transition: background-color 0.5s; }
#main-content .sec06 .map-wrap .local-navi .navi.active .inner{ padding: 20px 0; background-color: #98694c; color: #ffffff; cursor: auto; }
#main-content .sec06 .map-wrap .map-body{ height: 0; overflow: hidden; opacity: 0; text-align: center; }
#main-content .sec06 .map-wrap .map-body.active{ height: auto; opacity: 1; transition: opacity 0.5s; }
#main-content .sec06 .map-wrap .map-body .inner-body{ padding-top: 30px; }
#main-content .sec06 .map-wrap .map-body03 .inner-body,
#main-content .sec06 .map-wrap .map-body04 .inner-body{ width: 34.0827%; margin: 0 auto; }
#main-content .sec06 .map-wrap .map-body .inner-body .caption{ text-align: right; margin-top: 5px; padding: 0 10px; }
#main-content .sec06 .map-wrap .map-body02 .inner-body .caption,
#main-content .sec06 .map-wrap .map-body03 .inner-body .caption,
#main-content .sec06 .map-wrap .map-body04 .inner-body .caption{ margin-top: -30px; }
#main-content .sec06 .map-wrap .map-body .txt-body{ display: inline-block; margin-top: 20px; text-align: left; }
#main-content .sec06 .map-wrap .map-body .txt-body .head{ font-size: 18px; line-height: 1.5; }
#main-content .sec06 .map-wrap .map-body .txt-body .head~.head{ margin-top: 10px; }
#main-content .sec06 .map-wrap .map-body .txt-body .list-item{ display: flex; display: -ms-flex; flex-wrap: wrap; }
#main-content .sec06 .map-wrap .map-body .txt-body .list-item .item{ margin-right: 1em; display: flex; display: -ms-flex; align-items: center; font-size: 16px; line-height: 1.5; margin-bottom: 2px; }
#main-content .sec06 .map-wrap .map-body .txt-body .list-item .item .num{ font-size: 87.5%; width: 22px; height: 22px; line-height: 22px; text-align: center; display: flex; display: -ms-flex; justify-content: center; align-items: center; margin-right: 0.2em; }
#main-content .sec06 .map-wrap .map-body .txt-body .list-item01 .item .num{ background-color: #c29f28; color: #ffffff; }
#main-content .sec06 .map-wrap .map-body .txt-body .list-item02 .item .num{ background-color: #98694c; color: #ffffff; }
#main-content .sec06 .map-wrap .map-body .txt-body .list-item03 .item .num{ background-color: #ffffff; color: #666666; border: 1px solid #666666; box-sizing: border-box; }







/*--レスポンシブ追加プロパティ--------------------------------------*/
@media screen and (min-width: 1400px){ /*1400px以上のcss*/
}
@media screen and (max-width: 1112px){ /*1112px以下のcss*/
}
@media screen and (max-width: 768px){ /*768px以下のcss*/
	#main-content .intro{ padding: 10% 5%; }
	#main-content .intro .copy{ padding-bottom: 5%; }
	#main-content .intro .txt{ font-size: 14px; line-height: 2; text-align: left; }
	#main-content .sec01 .txt-body{ position: relative; width: auto; margin: 5% 5% 0; padding: 7% 5%; }
	#main-content .sec01 .txt-body .head{ font-size: 20px; }
	#main-content .sec02{ margin: 10% auto 0; }
	#main-content .sec02 .sec-ttl{ font-size: 24px; }
	#main-content .sec02 .photo-wrap{ margin: 5% auto 0; }
	#main-content .sec02 .photo-wrap .photo-list{ display: flex; display: -ms-flex; justify-content: space-between; flex-wrap: wrap; }
	#main-content .sec02 .photo-wrap .photo-list .photo-body{ position: relative; }
	#main-content .sec02 .photo-wrap .txt-body{ position: relative; width: auto; margin: 5% 5% 0; padding: 7% 5%; transform: none; }
	#main-content .sec02 .photo-wrap .txt-body .head{ font-size: 20px; }
	#main-content .sec03{ margin: 10% auto 0; }
	#main-content .sec03 .sec-ttl{ font-size: 34px; }
	#main-content .sec03 .txt{ font-size: 14px; }
	#main-content .sec03 .photo-body{ margin: 5% auto 0; }
	#main-content .sec04{ margin: 10% auto 0; }
	#main-content .sec04 .txt-body{ position: relative; width: auto; margin: 5% 5% 0; padding: 7% 5%; transform: none; }
	#main-content .sec04 .txt-body .head{ font-size: 16px; }
	#main-content .sec05{ margin: -15% auto 0; }
	#main-content .sec06{ margin: 10% auto 0; }
	#main-content .sec06 .ttl-body{ padding: 0 5%; }
	#main-content .sec06 .ttl-body .sec-ttl{ font-size: 24px; }
	#main-content .sec06 .ttl-body .head{ font-size: 16px; margin-top: 5%; }
	#main-content .sec06 .map-wrap{ margin-top: 10%; }
	#main-content .sec06 .map-wrap .local-navi .navi .inner{ font-size: 24px; }
	#main-content .sec06 .map-wrap .map-body .inner-body{ padding-top: 5%; }
	#main-content .sec06 .map-wrap .map-body03 .inner-body,
	#main-content .sec06 .map-wrap .map-body04 .inner-body{ width: 60%; }
	#main-content .sec06 .map-wrap .map-body02 .inner-body .caption,
	#main-content .sec06 .map-wrap .map-body03 .inner-body .caption,
	#main-content .sec06 .map-wrap .map-body04 .inner-body .caption{ margin-top: -3.9577vw; }
	#main-content .sec06 .map-wrap .map-body .txt-body{ margin-top: 5%; padding: 0 5%; }
	#main-content .sec06 .map-wrap .map-body .txt-body .head{ font-size: 16px; }
	#main-content .sec06 .map-wrap .map-body .txt-body .list-item .item{ font-size: 14px; }
}
@media screen and (max-width: 480px){ /*480px以下のcss*/
}