@charset "utf-8";
/* ===================================================
	Access CSS
====================================================== */

#contents_wrap{ background: #f3efe9;}

/* ---------------------------------------------------
Section Lead
------------------------------------------------------ */
.sec_lead{ padding: 100px 0 0; text-align: center; background-image: url("../../contents/img/bg_01.webp"); background-repeat: no-repeat; background-position: calc( 50% - 50px ) calc( 0% - 20px ); overflow: hidden;}
.sec_lead .tit_01{ font-size: 30px; line-height: 1.4; padding: 0 0 30px; color:rgba(96,50,25,0.6);}
.sec_lead .txt_01{ font-size: 16px; line-height: 1.8;}
.sec_lead .box_map{ width: 100%; max-width: 1480px; margin: 0 auto;}
.sec_lead .box_map img{ width: 100%; height: auto;}

@media screen and (max-width: 600px) {
.sec_lead{ padding: 50px 0 0; text-align: center;}
.sec_lead .tit_01{ font-size: 22px; line-height: 1.4; padding: 0 5% 20px;}
.sec_lead .txt_01{ font-size: 15px; line-height: 1.7; padding: 0 5% 10px; text-align: left;}
.sec_lead .box_map{ width: 100%; max-width: 100%; margin: 0;}
}

/* ---------------------------------------------------
Section Shuttle
------------------------------------------------------ */
.sec_shuttle{ background: rgba(255,255,255,0.7); padding: 90px; margin: 0 auto 140px; box-sizing: border-box;}
.sec_shuttle .tit_01{ font-size: 40px; line-height: 1.1; text-align: center; color: #ac8a40;}
.sec_shuttle .box_in{ display: flex; justify-content: space-between; align-items: center; margin: 50px 0 0;}
.sec_shuttle .box_img{ width: 48%; max-width: 490px; }
.sec_shuttle .box_img img{ width: 100%; height: auto;}
.sec_shuttle .box_txt{ width: 48%; max-width: 490px;}
.sec_shuttle .tit_02{ font-size: 22px; color:rgba(96,50,25,0.6); line-height: 1.4; padding: 0 0 20px;}
.sec_shuttle .txt_01{ font-size: 16px; line-height: 1.9; padding: 0 0 20px;}
.sec_shuttle .btn_01{ font-size: 16px; line-height: 1.1; width: 100%; display: block; background: #a48242; color: #fff; padding: 15px 0; text-align: center; border-radius: 50px; transition: all 0.5s;}
.sec_shuttle .btn_01:hover{ background-color: #BD9C5D; text-decoration: none;}
.sec_shuttle .btn_02{ font-size: 16px; line-height: 1.1; width: 100%; display: block; padding: 15px 0; text-align: center; border-radius: 50px; border: solid 1px #ccbeb5; transition: all 0.5s; box-sizing: border-box;}
.sec_shuttle .btn_02:hover{ background-color:rgba(235,235,235,1.00); text-decoration: none;}

@media screen and (max-width: 600px) {
.sec_shuttle{ padding: 0 5%; margin: 0 auto 40px;}
.sec_shuttle .tit_01{ font-size: 20px; padding: 30px 0 20px;}
.sec_shuttle .box_in{ flex-direction: column; margin: 0;}
.sec_shuttle .box_img{ width: 100%; max-width: 100%; }
.sec_shuttle .box_txt{ width: 100%; max-width: 100%; padding: 10px 0 30px;}
.sec_shuttle .tit_02{ font-size: 18px; line-height: 1.4; padding: 0 0 10px;}
.sec_shuttle .txt_01{ font-size: 15px; line-height: 1.7; padding: 0 0 10px;}
.sec_shuttle .btn_01{ font-size: 15px; line-height: 1.1;}
.sec_shuttle .btn_02{ font-size: 16px; line-height: 1.4;}
}

/* ---------------------------------------------------
Box GoogleMaps
------------------------------------------------------ */
.box_gmap,
.box_gmap iframe{ width: 100%; height: 600px;}

@media screen and (max-width: 600px) {
.box_gmap,
.box_gmap iframe{ height: 300px;}
}

/* ---------------------------------------------------
Section Basic
------------------------------------------------------ */
.sec_basic{ background: #fff; padding: 100px 0;}
.sec_basic .box_in{ display: flex; justify-content: space-between; align-items: center;}
.sec_basic .box_img{ width: 41.6%; max-width: 500px;}
.sec_basic .box_txt{ width: 53.33%; max-width: 640px;}
.sec_basic .tit_01{ font-size: 26px; line-height: 1.4;}
.sec_basic .list_01 > div{ border-bottom: solid 1px #d6c9bf; display: flex; width: 100%;}
.sec_basic .list_01 dt,
.sec_basic .list_01 dd{ padding: 20px; box-sizing: border-box;}
.sec_basic .list_01 dt{ width: 25%; color:rgba(96,50,25,0.6);}
.sec_basic .list_01 dd{ width: 75%; padding: 20px 0;}
.sec_basic .list_02 li{ padding: 0 0 0 0.5em; text-indent: -0.5em;}
.sec_basic .list_02 li::before{ content: "・";}
.sec_basic .btn_01{ text-align: right;}
.sec_basic .btn_01 a{ display: inline-block; padding: 10px 0 10px 30px; margin: 10px 0 0; background: url("../img/ico_marker_01.svg") no-repeat left center; background-size: 21px; border-bottom: solid 1px #fff;}
.sec_basic .btn_01 a:hover{ text-decoration: none; border-bottom: solid 1px #ccc;}

@media screen and (max-width: 600px) {
.sec_basic{ background: #fff; padding: 40px 0;}
.sec_basic .box_in{ flex-direction: column;}
.sec_basic .box_img{ width: 100%; max-width: 100%;}
.sec_basic .box_txt{ width: 100%; max-width: 100%; padding: 20px 0 0;}
.sec_basic .tit_01{ font-size: 20px;}
.sec_basic .list_01 > div{ flex-direction: column; width: 100%;}
.sec_basic .list_01 dt,
.sec_basic .list_01 dd{ padding: 10px 10px 5px; font-size: 15px; line-height: 1.5;}
.sec_basic .list_01 dt{ width: 100%;}
.sec_basic .list_01 dd{ width: 100%; padding: 0 10px 10px;}
.sec_basic .btn_01 a{ font-size: 15px;}
}

/* ---------------------------------------------------
Section Traffic
------------------------------------------------------ */
.sec_traffic{ padding: 90px 0 0;}
.sec_traffic:last-of-type{ padding: 90px 0 150px;}
.sec_traffic .tit_01{ text-align: center; font-size: 40px; line-height: 1.1; padding: 55px 0 40px; background-repeat: no-repeat;}
.sec_traffic#plane .tit_01{ background-image: url("../img/ico_plane_01.svg"); background-size: 38px; background-position: center top;}
.sec_traffic#bus .tit_01{ background-image: url("../img/ico_bus_01.svg"); background-size: 28px; background-position: center top 5px;}
.sec_traffic#train .tit_01{ background-image: url("../img/ico_train_01.svg"); background-size: 30px; background-position: center top 5px;}
.sec_traffic#car .tit_01{ background-image: url("../img/ico_car_01.svg"); background-size: 36px; background-position: center top 10px;}
.sec_traffic .list_01{ border-top: solid 1px #d6c9bf;}
.sec_traffic .list_01 > div{ border-bottom: solid 1px #d6c9bf; display: flex; width: 100%;}
.sec_traffic .list_01 dt,
.sec_traffic .list_01 dd{ padding: 20px 30px; box-sizing: border-box;}
.sec_traffic .list_01 dt{ width: 20%; background: rgba(255,255,255,0.6); font-weight: bold; display: flex; align-items: center; font-size: 17px;}
.sec_traffic .list_01 dd{ width: 80%; padding: 20px 40px; font-size: 16px;}
.sec_traffic .list_02 li{ padding: 0 0 0 0.5em; text-indent: -0.5em;}
.sec_traffic .list_02 li::before{ content: "・";}
.sec_traffic .txt_02{ color:rgba(96,50,25,0.7);}
.sec_traffic .btn_gmap{ width: 100%; display: flex; justify-content: center; padding: 40px 0 0;}
.sec_traffic .btn_gmap a{ background-color: rgba(255,255,255,0.7); background-image: url("../img/ico_marker_01.svg"); background-repeat: no-repeat; background-position: 30px calc( 50% ); background-size: 21px; padding: 15px 30px 15px 60px; box-sizing: border-box; border-radius: 80px; text-align: center; font-size: 16px; line-height: 1.5; color:rgba(96,50,25,0.6); transition: all 0.5s;}
.sec_traffic .btn_gmap a:hover{ text-decoration: none; background-color: #fff;}
.sec_traffic .btns{ display: flex; justify-content: center; padding: 20px 0 0;}
.sec_traffic .btns a{ margin: 0 10px; color:rgba(96,50,25,0.6);}

@media screen and (max-width: 600px) {
.sec_traffic{ padding: 40px 0 0;}
.sec_traffic:last-of-type{ padding: 40px 0 90px;}
.sec_traffic .tit_01{ font-size: 22px; line-height: 1.1; padding: 55px 0 20px;}
.sec_traffic .list_01 > div{ flex-direction: column; width: 100%;}
.sec_traffic .list_01 dt,
.sec_traffic .list_01 dd{ padding: 10px 15px;}
.sec_traffic .list_01 dt{ width: 100%; font-size: 16px;}
.sec_traffic .list_01 dd{ width: 100%; padding: 10px 15px; font-size: 15px;}
.sec_traffic .btn_gmap{ padding: 20px 0 0;}
.sec_traffic .btn_gmap a{ font-size: 15px; line-height: 1.5; color:rgba(96,50,25,0.7);}
.sec_traffic .btns{ padding: 20px 0 0; flex-direction: column;}
.sec_traffic .btns a{ margin: 0 0 10px;}
}
