@charset "utf-8";
/* ===================================================
	Home CSS
====================================================== */

body { line-height: 2.5;}
#g_header .hd_sns a .bk { display: block; }
#g_header .hd_sns a .wh { display: none;}

:root {
	--btn_width: min(275px, 100%);
}

@media screen and (max-width: 600px) {
	:root {
		--btn_width: 70%;
	}
	body { line-height: 1.875;}
}


/* ---------------------------------------------------
	Header
------------------------------------------------------ */

#g_header .hd_nav li a { color: #1b1b1b; }
#g_header .lang_btn a,
#g_header .lang_btn span { color: #1b1b1b; }
#g_header .hd_sns .wh { display: none; }
#g_header .hd_sns .bk { display: block; }
#g_header .hd_h1 { opacity: 0; pointer-events: none; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#g_header.fixed .hd_nav li a { color: #fff; }
	#g_header.fixed .lang_btn a,
	#g_header.fixed .lang_btn span { color: #fff; }
	#g_header.fixed .hd_h1 { opacity: 1; pointer-events: auto; }
}
@media screen and (max-width: 600px) {
}

/* ---------------------------------------------------
	Main_img
------------------------------------------------------ */
#main_img { background: var(--color-bg); padding: 80px 20px 20px; }
#main_img .slick { overflow: hidden; opacity: 0; transition: opacity .2s;}
#main_img .slick.slick-initialized{ opacity: 1; }
#main_img .slick .slick-dots { z-index: 10; }
#main_img .slick-slide div { vertical-align: bottom;}
#main_img .slick-slide img { width: 100%; transform: scale(1.1); height: calc(100vh - 90px); transition: transform 8s linear;}
#main_img .slick-animate img { transform: scale(1);}
#main_img .main_tit { background: transparent; display: flex; align-items: center; justify-content: center; flex-direction: column; position: absolute; top: 0; left: 0; height: 100vh; width: 100%; }
#main_img .main_tit h2 { display: flex; align-items: center; justify-content: center; flex-direction: column; }
body:not(.loading) #main_img .main_tit h2 { filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.7)); }
#main_img .main_tit h2 .logo { position: relative; transition: 1s all; opacity: 1; }
#main_img .main_tit h2 .logo img { opacity: 1; transition: 1s all; }
#main_img .main_tit h2 .logo .bk { opacity: 0; position: absolute; top: 0; left: 0; }
#main_img .main_tit h2 .txt { margin-top: 25px; display: flex; align-items:flex-end; font-size: 0; list-style: none; }
#main_img .main_tit h2 .txt span { display: block; margin: 0 5px; position: relative; width: 280px; }
#main_img .main_tit h2 .txt span img { transition: 1s all; }
#main_img .main_tit h2 .txt span .bk { opacity: 0; position: absolute; top: 0; left: 0; }

#main_img .main_move { position: absolute; bottom: 85px; right: 50px; filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.4)); }
#main_img .main_move a { display: block; position: relative; color: #fff; }
#main_img .main_move a::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--color-txt01); z-index: 0; border-radius: 5px;  }
#main_img .main_move a img { position: relative; border-radius: 5px; }
#main_img .main_move a > span { display: flex; flex-direction: column; align-items: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: opacity .5s; }
#main_img .main_move .txt {  margin-top: 15px; line-height: 1;}
#main_img .main_move .arrow { position: relative; display: block; width: 65px; height: 65px;}
#main_img .main_move .arrow::before { content: ''; position: absolute; top: 0; left: 0; border: 1px solid #fff; border-radius: 100px; height: 100%; width: 100%; box-sizing: border-box; }
#main_img .main_move .arrow::after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-left: 13px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; box-sizing: border-box; }
#movie_area { display: none; width:100%; height: 100%; position: fixed; z-index: 10000; text-align: center; background: #000; overflow: hidden;}
#movie { position: static; top: 0; left: 0; width: 100% !important; height: 100%; margin: 0;overflow: hidden;}
#movie_close { position: fixed; top: 20px; right: 20px;}
#movie_close img { width: 50px;}

@media screen and (hover: hover) {
	#main_img .main_move a:hover { opacity: 1; }
	#main_img .main_move a:hover::before { opacity: 1; }
	#main_img .main_move a:hover img { opacity: 0.8;}
	#main_img .main_move a:hover > span { opacity: 0.6; }
}

@media screen and (min-width: 601px) {
	[lang=en] #main_img .main_tit h2 .txt span { width: fit-content; }
}
@media screen and (max-width: 600px) {
	#main_img { padding: 0; }
	#main_img .slick img { height: 100svh; }
	#main_img .main_tit { height: 100svh; }
	#main_img .main_tit h2 { width: 70%; }
	#main_img .main_tit h2 .logo { width: 30%; margin: 0 auto;}
	#main_img .main_tit h2 .txt { margin-top: 25px; width: 100%; }
	#main_img .main_tit h2 .txt span { margin: 0 3px; width: 100%; }

	#main_img .main_move { bottom: 30px; right: 4%; width: 50%; }
	#main_img .main_move a > span { width: 80%; font-size: 10px; }
	#main_img .main_move .txt { margin-top: 10px; }
	#main_img .main_move .arrow { width:  30%; height: auto; padding-bottom: 30%;}
	#main_img .main_move .arrow::after { border-left: 10px solid #fff; border-top: 6px solid transparent; border-bottom: 6px solid transparent; }

	#main_img .lang_btn { position: absolute; top: 20px; right: 20px; display: flex; align-items: center; filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.7)); }
	#main_img .lang_btn li + li { margin-left: 15px; }
	#main_img .lang_btn a,
	#main_img .lang_btn span { color: #fff; display: block; line-height: 1; font-size: 15px; }
	#main_img .lang_btn span { text-decoration: underline;  }
	#main_img .lang_btn li { margin: 0;}
}


/* ---------------------------------------------------
	Search_col
------------------------------------------------------ */
#search_col { padding: 50px 0 65px; }
#search_col .inner { width: 1300px; max-width: 92%; margin: 0 auto; padding: 30px 55px 25px; background: #dcdcdc; }
#search_col .inner > div { display: flex; align-items: flex-start; justify-content: space-between; }

#search_col .tit { padding: 15px 35px 15px 0; font-size: 20px; line-height: 1.25; letter-spacing: 0; box-sizing: border-box; flex-shrink: 0; display: flex; align-items: center; }
#search_col .tit::before { content: ''; display: block; width: 19px; height: 19px; margin: 0 10px 0 0; background: url(../../../img/icon_serch.svg)no-repeat center/cover; }
#search_col .tit + div { flex-grow: 1; }

/* form */
.ui-widget.ui-widget-content { z-index: 10!important; }
#search_489ban form { display: flex; justify-content: flex-end; }
#search_489ban input[type="text"],
#search_489ban select {
	margin: 0; padding: 0 20px 0 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 32px; line-height: 60px; outline: none; font-family: 'EB Garamond', serif; color: #435243;}
#search_489ban input[type="text"]:disabled,
#search_489ban select:disabled { color: #888; opacity: 1; -webkit-text-fill-color: #888;}
#search_489ban .date_489ban,
#search_489ban .inbox_489ban { position: relative; box-sizing: border-box; background: #fff; border-bottom: 1px solid #898989; }
#search_489ban .date_489ban { width: 48%; }
#search_489ban .inbox_489ban { width: 22.5%; }
#search_489ban .date_489ban,
#search_489ban .inbox_489ban .stay_489ban { display: flex; align-items: center; }
#search_489ban .date_489ban dt,
#search_489ban .inbox_489ban dt { position: absolute; top: 10px; left: 18.5%; width: auto; z-index: 1; font-size: 15px; letter-spacing: 0; line-height: 1; text-align: center; }
#search_489ban .date_489ban dt { left: 8.7%;}
#search_489ban .date_489ban dd { display: flex; flex-grow: 1; height: 80px; font-size: 16px; }
#search_489ban .date_489ban dd label { width: 34%; display:flex; align-items: center; justify-content: center; letter-spacing:0; border-left: 1px solid #b7b7b7; }
#search_489ban .date_489ban dd label input { transform: scale(1.05); }
#search_489ban input[name="date"] { width: 66%; padding: 20px 0 0 8.7%; background: url(../img/icon_calendar_bk.svg) no-repeat right 15% center/19px, #fff; }
#search_489ban .inbox_489ban { display: flex; align-items: center; justify-content: space-between; margin-left: 20px; }
#search_489ban button { width: 22.5%; outline: none; height: 80px; margin-left: 35px; padding: 0; font-size: 20px; border: 0; color: #fff; background: var(--color05); letter-spacing: .1em; font-family: 'EB Garamond', serif; transition: background .5s; }
#search_489ban .stay_489ban dd { position: relative; flex-grow: 1; flex-shrink: 0; }
#search_489ban .inbox_489ban .stay_489ban { flex-grow: 1; padding-top: 20px; }
#search_489ban .stay_489ban select { position: absolute; left: 0; top: 0; width: 100%; height: 100%; font-size: 16px; opacity: 0; }
#search_489ban .stay_489ban select option { background: #1c1c1c; color: #ececec; }
#stay_label { display: flex; align-items: center; justify-content: flex-start; height: 60px; padding: 0 14% 0 18.5%; font-size: 26px; background: url(../img/arrow01_bk.svg)no-repeat right 15px center/14px, #fff; letter-spacing: 0; color: #435243; }

@media screen and (hover: hover) {
	#search_489ban input[type="text" i]:hover { cursor: default; }
	#search_col .reserve_links a:hover { opacity: .5; }
	#search_489ban button:hover { opacity: .6; }
}

@media screen and (max-width: 600px) {
	#search_col { padding: 35px 0;}
	#search_col .inner { padding: 25px 7%; max-width: 86%; }
	#search_col .inner > div { flex-direction: column; align-items: center; }

	#search_col .tit { padding: 0 0 20px; }
	#search_col .tit::before { display: block; margin: 0 10px 0 0; }
	#search_col .tit + div { width: 100%; box-sizing: border-box; }

	#search_489ban form { flex-wrap: wrap; align-items: stretch; justify-content: space-between; }
	#search_489ban input[type="text"],
	#search_489ban select { font-size: 22px; }
	#search_489ban .date_489ban,
	#search_489ban .inbox_489ban .stay_489ban { flex-direction: column; align-items: flex-start; }
	#search_489ban .date_489ban dt,
	#search_489ban .inbox_489ban dt { font-size: 12px; top: 0; left: 0; padding: 10px 10px 0; text-align: left; box-sizing: border-box; }
	#search_489ban input[name="date"] { width: 62%; height: auto; padding: 25px 10px 0 10px; background-size: 16px; margin-bottom: 0; background-position: right 9% bottom calc(50% - 13px);}
	#search_489ban .date_489ban { width: 100%; }
	#search_489ban .date_489ban dd { width: 100%; height: 70px; }
	#search_489ban .date_489ban dd label { font-size: 12px; width: 38%; }
	#search_489ban .inbox_489ban { width: max(130px, 43%); height: auto; margin: 10px 0 0; }
	#search_489ban .stay_489ban dd { width: 100%; }
	#search_489ban .inbox_489ban .stay_489ban { padding: 25px 0 0;}
	#stay_label { width: 100%; font-size: 20px; height: 40px; padding: 0 20px 0 0;  justify-content: center; background-position: right 10px center; background-size: 10px; }
	#search_489ban .stay_489ban { width: 100%; background-size: 12px; background-position: right 12% center;}
	#search_489ban .stay_489ban select { padding: 0 20px 0 0; }
	#search_489ban button { height: auto; margin: 10px 0 0; font-size: 15px; width: min(calc(97% - 130px), 54%); }
}


/* ---------------------------------------------------
	Sec_concept
------------------------------------------------------ */
#sec_concept { padding-bottom: 165px; background: var(--color-bg02); /* background: url(../../../img/concept_img07.jpg) no-repeat bottom center/100%, var(--color-bg02); */}
#sec_concept #concept01 { position: relative; background: #fff; }
#sec_concept #concept01 .txt { color: #ececec; }
#sec_concept #concept01 .txt .tit { font-size: 38px; line-height: 1.8; margin-bottom: 20px; }
#sec_concept #concept01 .txt .tit .font_en { color: #939393; display: block; font-size: 26px;  }
#sec_concept #concept01 .txt p { font-size: 18px; line-height: 2.2; }
#sec_concept #concept02 { display: flex; justify-content: space-between; align-items: flex-end; position: relative; }
#sec_concept #concept02 .photo01 { position: absolute; top: -70px; left: 0; z-index: 2; width: max(27%, 400px); }
#sec_concept #concept02 .txt { padding: 330px 0 0 max(4%, calc(50vw - 650px)); color: #ececec; }
#sec_concept #concept02 .txt .tit { font-size: 40px; line-height: 1.6; }
#sec_concept #concept02 .txt p { margin-top: 25px; }
#sec_concept #concept02 .txt a {  display: block; margin: 65px 0 0 auto; text-align: center; width: var(--btn_width); padding: 5px; color: #fff; }
#sec_concept #concept02 .photo { width: 40%; }
#sec_concept .photo02 { margin-top: 150px; display: flex; }
#sec_concept .photo02 > div { flex: 1; }
#sec_concept #map { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-start; width: min(1300px, 92%); margin: -280px auto 0; position: relative; z-index: 1; color: #ececec;}
#sec_concept #map .map_img { position: relative;}
#sec_concept #map .map_img:nth-child(1) { width: 50%; }
#sec_concept #map .map_img:nth-child(1)::before { content: ''; position: absolute; bottom: 5.5%; right: -9.3%; width: 9.3%; height: 30px; aspect-ratio: 1/cos(30deg); clip-path: polygon(0 0,100% 100%,0 100%); background: #fff;}
#sec_concept #map .map_img:nth-child(2) { width: 45%; }
#sec_concept #map .txt { margin-top: 75px; }
#sec_concept #map .txt dl div { display: flex; font-size: 20px; line-height: 1.5; letter-spacing: 0; }
#sec_concept #map .txt dl div + div { margin-top: 30px;}
#sec_concept #map .txt dl div dt { flex-shrink: 0; width: 105px; padding-left: 1em; text-indent: -1em; box-sizing: border-box; }
#sec_concept #map .txt dl div dt::before { content: '・'; }
#sec_concept #map .txt dl div dd { flex-grow: 1;}
#sec_concept #map .txt dl div:last-child dt { width: 100%;}
#sec_concept #map .txt a { margin-top: 35px; display: block; text-align: center; width: var(--btn_width); padding: 5px; color: #fff}

@media screen and (hover: hover) {
	#sec_concept #map .txt a:hover { color: #313131; }
}
@media screen and (min-width: 601px) {
	#sec_concept #concept01 .photo img { height: 850px; }
	#sec_concept #concept02 .photo img { min-height: 740px;}
	#sec_concept .photo02 { width: 80%; }
	#sec_concept #concept02 { margin-top: -275px; }
	#sec_concept #concept02 .txt p { width: 625px; }
	#sec_concept #concept01 .txt { width: min(1300px, 92%); position: absolute; top: 180px; left: max(calc(50vw - 650px), 4%); z-index: 1; }
	#sec_concept #map .txt { width: 60%; }
}
@media screen and (max-width: 600px) {
	#sec_concept { padding-bottom: 80px; background-size: 250vw; }
	#sec_concept #concept01 .txt { width: 86%; margin: 0 auto; padding: 50px 0 calc(6vw + 30px); z-index: 1; position: relative;}
	#sec_concept #concept01 .txt .tit { font-size: 22px; line-height: 1.5; margin-bottom: 15px; }
	#sec_concept #concept01 .txt .tit .font_en { font-size: 18px; }
	#sec_concept #concept01 .txt p { font-size: 14px; line-height: 2; }
	#sec_concept #concept01 .photo { position: absolute; top: 0; left: 0; z-index: 0; height: 100%; width: 100%; }
	#sec_concept #concept02 { flex-direction: column; align-items: flex-start; }
	#sec_concept #concept02 .photo01 { position: static; margin-top: -6vw; width: 53%; order: 1; }
	#sec_concept #concept02 .txt { margin-top: 40px; padding: 0 7%; order: 3; }
	#sec_concept #concept02 .txt .tit { font-size: 20px; }
	#sec_concept #concept02 .txt p { line-height: 2; margin-top: 15px; }
	#sec_concept #concept02 .txt a { margin: 30px 0 0 auto; }
	#sec_concept #concept02 .photo { width: 80%; order: 2; margin: 40px 0 0 auto; }
	#sec_concept .photo02 { margin: 60px 7% 0 0; }
	#sec_concept #map { flex-direction: column; align-items: flex-start; width: 86%; margin: 30px auto 0; }
	#sec_concept #map .map_img:nth-child(1) { width: 100%; order: 2; margin-top: 20px;}
	#sec_concept #map .map_img:nth-child(1)::before { display: none;}
	#sec_concept #map .map_img:nth-child(2) { width: 100%; order: 1; }
	#sec_concept #map .txt { margin-top: 30px; order: 3; }
	#sec_concept #map .txt dl div { font-size: 16px; flex-direction: column; }
	#sec_concept #map .txt dl div + div { margin-top: 15px;}
	#sec_concept #map .txt dl div dt { width: 100%; }
	#sec_concept #map .txt dl div dd { padding-left: 1em; }
	#sec_concept #map .txt a { margin-top: 35px; display: block; text-align: center; width: var(--btn_width); padding: 5px; color: #fff}
}


/* ---------------------------------------------------
	Sec_room
------------------------------------------------------ */
#sec_room { background: var(--color-bg02); padding-bottom: 150px; }
#sec_room .contents { margin-top: 60px; }
#sec_room .sec_main { position: relative;}
#sec_room .sec_main .tit { position: absolute; bottom: 50px; left: max(3%, calc(50vw - 650px)); font-size: 40px; line-height: 1.5; filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.5)); color: #ececec; }
#sec_room .txt { color: #ececec; }
#sec_room .txt > div { width: 100%; }
#sec_room .txt > div p { line-height: 2.5; }
#sec_room .detail_col { width: 900px; margin: 75px auto 0; }
#sec_room .detail_col dt { text-align: center; font-size: 18px; color: var(--color02); line-height: 1.5; margin-bottom: 10px; }
#sec_room .detail_col > div + div { margin-top: 35px; }
#sec_room .detail_col dt .ja { font-size: 28px; margin-right: 20px; }
#sec_room .detail_col dd ul li + li { margin-top: 20px; }
#sec_room .detail_col dd ul li a { display: block; position: relative; filter: drop-shadow(0 0 4px rgba(11, 41, 61, 0.4)); color: #fff; }
#sec_room .detail_col dd ul li a::after { content: ''; width: 100%; height: 100%; background: var(--color-txt01); opacity: 0.4; position: absolute; top: 0; left: 0; z-index: 3; border-radius: 5px;}
#sec_room .detail_col dd ul li a .detail_txt { width: 100%; height: 100%;  padding: 0 105px 0 120px; position: absolute; left: 0; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; }
#sec_room .detail_col dd ul li a .detail_txt .room_name { font-size: 14px; }
#sec_room .detail_col dd ul li a .detail_txt .room_name span:nth-child(1) { font-size: 30px; margin-right: 20px; line-height: 1; }
#sec_room .detail_col dd ul li a .detail_txt .room_name span:nth-child(2) { letter-spacing: 0.3em; }
#sec_room .detail_col dd ul li a .detail_txt .cmn_btn03 { opacity: 0; transition: .5s; flex-shrink: 0; }
#sec_room .detail_col dd ul li a .detail_txt .cmn_btn03::after { background: #999; opacity: .5; }
#sec_room .detail_col dd ul li a .detail_txt .cmn_btn03::before { display: none; }
#sec_room .detail_col dd ul li a .detail_photo { overflow: hidden; border-radius: 5px; }
#sec_room .detail_col dd ul li a .detail_photo img { transition: transform .8s; }

@media screen and (hover: hover) {
	#sec_room .detail_col dd ul li a:hover,
	#sec_room .detail_col dd ul li a:hover img { opacity: 1; }
	#sec_room .detail_col dd ul li a:hover .detail_txt .cmn_btn03 { opacity: 1; }
	#sec_room .detail_col dd ul li a:hover .detail_photo img { transform: scale(1.03); }
}
@media screen and (min-width: 601px) {
	#sec_room .contents { width: 1300px; max-width: 92%; }
}
@media screen and (max-width: 600px) {
	#sec_room { padding-bottom: 80px; }
	#sec_room .contents { margin-top: 40px; flex-direction: column; }
	#sec_room .txt { margin-top: 0; width: 100%; }
	#sec_room .sec_main img { min-height: 270px; }
	#sec_room .sec_main .tit { font-size: 22px; bottom: 25px; left: 7%; width: 86%; }
	#sec_room .txt > div { margin-top: 20px; }
	#sec_room .txt > div p { line-height: 2; }
	#sec_room .detail_col { width: 100%; margin-top: 40px; }
	#sec_room .detail_col dt { font-size: 12px; margin-bottom: 7px; }
	#sec_room .detail_col > div + div { margin-top: 30px; }
	#sec_room .detail_col dt .ja { font-size: 18px; margin-right: 15px; }
	#sec_room .detail_col dd ul li + li { margin-top: 15px; }
	#sec_room .detail_col dd ul li a .detail_txt { padding: 10px 10% 0; }
	#sec_room .detail_col dd ul li a .detail_txt .room_name { font-size: 12px; }
	#sec_room .detail_col dd ul li a .detail_txt .room_name span:nth-child(1) { font-size: 20px; margin-right: 5px; }
	#sec_room .detail_col dd ul li a .detail_txt .cmn_btn03 { opacity: 1; }
}

/* ---------------------------------------------------
	Sec_breakfast
------------------------------------------------------ */
#sec_breakfast { background: var(--color-bg02); padding-bottom: 110px; }
#sec_breakfast .sec_main { position: relative; }
#sec_breakfast .sec_main .tit { position: absolute; bottom: 50px; left: max(3%, calc(50vw - 650px)); font-size: 40px; line-height: 1.5; color: #ececec;  filter: drop-shadow(0px 0px 5px black);}
#sec_breakfast .txt { width: min(1300px, 94%);  margin: 40px auto 0; color: #ececec;  }

@media screen and (hover: hover) {
}
@media screen and (max-width: 600px) {
	#sec_breakfast { padding-bottom: 70px; }
	#sec_breakfast .sec_main .tit { bottom: 25px; width: 80%; left: 7%; font-size: 22px; width: 86%; }
	#sec_breakfast .sec_main .tit .font_en { font-size: 14px; margin-left: 5px; }
	#sec_breakfast .txt { margin: 30px auto 0; }
	#sec_breakfast .sec_main img { min-height: 270px; }
}

/* ---------------------------------------------------
	Sec_experience
------------------------------------------------------ */
#sec_experience { padding: 0 0 290px; background: var(--color-bg02); /* background: url(../../../img/experience_img04.jpg) no-repeat bottom center/cover, var(--color-bg02); */ }
#sec_experience > div { display: flex; justify-content: space-between; flex-direction: row-reverse; position: relative; }
#sec_experience .txt { width: clamp(310px, 28%, 410px); display: flex; flex-direction: column; margin: 45px auto 350px; color: #ececec;  }
#sec_experience .txt .tit { font-size: 40px; line-height: 1.5; }
#sec_experience .txt > div { margin-top: 25px; }
#sec_experience .txt > div p { line-height: 2.5; }
#sec_experience .txt > div a {  display: block; margin: 35px auto 0 0 ; text-align: center; width: var(--btn_width); padding: 5px; color: #ececec; }
#sec_experience .photo { width: 60%; }
#sec_experience .photo02 { width: min(1330px, 89%); display: flex; justify-content: flex-end; position: absolute; bottom: -50px; left: 50%; transform: translateX(-50%); margin-top: -75px; }
#sec_experience .photo02 div:nth-child(2) { margin-top: -90px; margin-left: 35px; }

@media screen and (hover: hover) {
	#sec_experience .txt > div a:hover { color: #313131; }
}
@media screen and (min-width: 601px) {
	#sec_experience .photo img { min-height: 880px;}
}
@media screen and (max-width: 600px) {
	#sec_experience { padding: 0 0 145px; }
	#sec_experience > div { flex-direction: column; }
	#sec_experience .txt { width: 100%; margin: 0 auto 50px; }
	#sec_experience .txt .tit { font-size: 26px; padding: 0 7%;}
	#sec_experience .txt .tit .font_en { font-size: 14px; margin-left: 15px; }
	#sec_experience .txt > div { margin-top: 20px; }
	#sec_experience .txt > div p { line-height: 2; padding: 0 7%; }
	#sec_experience .txt > div a { margin: 30px 7% 0 auto; }
	#sec_experience .photo { width: 64%; margin-top: 0; }
	#sec_experience .photo02 { width: 100%; bottom: -17.333vw; margin: 0; }
	#sec_experience .photo02 div:nth-child(1) { width: 38%; }
	#sec_experience .photo02 div:nth-child(2) { width: 26%; margin-top: -8vw; margin-left: 10px; }
}

/* ---------------------------------------------------
	Sec_access
------------------------------------------------------ */
#sec_access { padding-top: 100px; }
#sec_access > div { position: relative; z-index: 2; }
#sec_access .txt { display: flex; flex-direction: column; align-items: center; margin: 0 auto 60px; }
#sec_access .txt .tit { display: flex; flex-direction: column; align-items: center; }
#sec_access .txt .tit .font_en { font-size: 50px; color: var(--color02); line-height: 1; }
#sec_access .txt p { margin-top: 40px; }
#sec_access .txt p + p { margin-top: 1em; }
#sec_access .txt a { margin: 45px 0 0 auto; display: block; text-align: center; width: var(--btn_width); padding: 5px; }
#sec_access .googlemap { position: relative; padding-bottom: max(600px, 38%); }
#sec_access .googlemap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#sec_access .photo { z-index: 1; margin-top: 125px; }
/* access3 */
.access_layout_03 { margin-top: 60px; }
.access_layout_03 .sb_tit { margin-bottom: 25px; font-size: 30px; position: relative; display: flex; align-items: center; line-height: 1.6; }
.access_layout_03 .sb_tit::before { content: ''; width: 25px; height: 26px; background: url(../img/icon_plane.svg) no-repeat center/contain; margin-right: 15px; }
.access_layout_03 .sb_tit:after { content: ''; width: 13px; height: 8px; background: url(../img/arrow01_gr.svg) no-repeat center/contain; position: absolute; bottom: -20px; right: calc(50% - 6px); display: none; transition: transform .5s;}
.access_layout_03 .sb_tit.plane::before { background-image: url(../img/icon_plane.svg); }
.access_layout_03 .sb_tit.train::before { background-image: url(../img/icon_train.svg); width: 24px; height: 32px;}
.access_layout_03 .layout3 { gap: 60px 6%; flex-wrap: wrap; display: flex; }
.access_layout_03 div > div { display: flex; flex-direction: column; }
.access_layout_03 div > div > div { display: flex; flex-direction: row; justify-content: space-between; flex-grow: 1; gap: var(--gap);; position: relative; }
.access_layout_03 div > div > div > p { position: absolute; top: -28px; left: 50%; transform: translateX(-50%); width: 100%; text-align: center; }
.access_layout_03 div > div > div > div { display: flex; flex-direction: column; }
.access_layout_03 ol { display: flex; list-style: none; flex-direction: column; flex-grow: 1; }
.access_layout_03 ol span { width: 100%; background: var(--color-bg); position: relative; font-size: 15px; text-align: center; line-height: 1.3; padding: 3px 0; }
.access_layout_03 .point { font-size: 16px; position: relative; padding: 10px 0; text-align: center; background: #ddd; color: #313131; line-height: 1.6; }
.access_layout_03 .way { padding: 40px 0; position: relative; display: flex; flex-grow: 1; align-items: center; }
.access_layout_03 .way::before { content: ''; width: 5px; height: 100%; position: absolute; left: calc(50% - 2.5px); top: 0; background: #5d6c7e; background-size: 13px 13px; }
.access_layout_03 .way.walk::before { content: ''; width: 5px; height: 100%; position: absolute; left: calc(50% - 2.5px); top: 0; background: linear-gradient(to bottom, #5d6c7e 5px, transparent 5px); background-size: 5px 10px; background-position: center top -2px; }
.access_layout_03 .min_height { min-height: 188px; }
.access_layout_03 .flex_box dl { display: flex; justify-content: space-between; gap: clamp(35px, 3vw, 40px); }
.access_layout_03 .flex_box dl div { flex-grow: 1; display: flex; flex-direction: column; flex: 1; }
.access_layout_03 .flex_box dl div dt { position: relative; padding: 40px 0 0; position: relative; display: flex; align-items: center; }
.access_layout_03 .flex_box dl div dt::before { content: ''; width: 5px; height: 100%; position: absolute; left: calc(50% - 2.5px); top: 0; background: #5d6c7e; background-size: 13px 13px; }
.access_layout_03 .flex_box dl div dd { display: flex; flex-direction: column; flex-grow: 1; }
.access_layout_03 .point.last { padding: 10px 0; background: #5d6c7e; color: #ececec; }
.access_layout_03 .layout3 + p { margin-top: 60px; }
.access_layout_03 .bottom_link { margin-top: 70px; display: flex; justify-content: flex-end; flex-wrap: wrap; }
.access_layout_03 .bottom_link li { margin: 20px 30px 0 0; }
.access_layout_03 .bottom_link li a { display: block; font-size: 14px; }
.access_layout_03 .bottom_link li a span { display: flex; align-items: center; }
.access_layout_03 .bottom_link li a span::after { content: ""; width: 14px; height: 14px; margin: 0 0 0 5px; display: block; background: url(../img/ico_tab.svg) no-repeat center center/contain; flex-shrink: 0; }

@media screen and (hover: hover) {
}

@media screen and (min-width: 601px){
	.access_layout_03 { --gap: calc(clamp(1104px, 92vw, 1200px) * (50 / 1200));; --unit: calc((clamp(1104px, 92vw, 1200px) - (var(--gap) * 2)) / 3.5); }
	.access_layout_03 div > div > div > div { width: var(--unit); }
	.access_layout_03 div > div > div > div:has(.flex_box) { width: calc(var(--unit) * 1.5); }
	.access_layout_03 .col2_2 { width: calc(var(--unit) * 2.5 + var(--gap)); }
	.access_layout_03 .col3 { width: 100%; }
}


@media screen and (max-width: 600px) {
	#sec_access { padding-top: 40px; }
	#sec_access > div { flex-direction: column; }
	#sec_access .txt { width: 100%; margin: 15px auto 40px; padding: 0 7%; }
	#sec_access .txt .tit .font_en { font-size: 26px; margin-top: 15px; }
	#sec_access .txt p { margin-top: 30px; }
	#sec_access .txt a { margin: 20px 0 0 auto; }
	#sec_access .googlemap { width: 93%; margin: 0 auto; padding-bottom: 65vw; }
	#sec_access .photo { margin-top: 70px; }
	.access_layout_03 .layout3 { flex-direction: column; gap: 0; }
	.access_layout_03 div > div > div { gap: 0; }
	.access_layout_03 > div > div > div { padding: 20px 7% 0; flex-wrap: wrap; }
	.access_layout_03 div > div > div > p { position: static; transform: none; font-size: 14px; }
	.access_layout_03 ol span { font-size: 14px; }
	.access_layout_03 .sb_tit { margin: 20px 0; font-size: 18px; padding: 5px 0; border-bottom: 1px solid #c1c1c1; line-height: 1.5; justify-content: center; }
	.access_layout_03 .sb_tit::before { width: 20px; }
	.access_layout_03 .sb_tit.train::before { width: 18px; }
	.access_layout_03 .sb_tit:after { display: block; }
	.access_layout_03 .point { font-size: 15px; }
	.access_layout_03 .way { font-size: 14px; padding: 20px 0; }
	.access_layout_03 .layout3 + p { margin-top: 40px; }
	.access_layout_03 .bottom_link { flex-direction: column; margin-top: 40px; }
	.access_layout_03 .bottom_link li + li { margin: 20px 0 0;}
	.access_layout_03 .bottom_link li a { width: fit-content; }

	.access_layout_03 div > div > div > div + div { padding-top: 40px; margin-top: 40px; border-top: 1px solid #c1c1c1;}
	.access_layout_03 .flex_box dl div dt { padding: 20px 0 0;}
	.access_layout_03 .flex_box dl div dd .point { font-size: 14px; }
	.access_layout_03 .flex_box dl div dd ol span { font-size: 13px; }
	.access_layout_03 .layout3 > div + div { margin-top: 20px; }
	.access_layout_03 .flex_box dl { gap: 5%; }
}


/* ---------------------------------------------------
	info
------------------------------------------------------ */
#sec_info { padding: 105px 0 120px; }
#sec_info h2 { text-align: center; line-height: 1; margin-bottom: 45px; }
#sec_info h2 .font_en { display: block; font-size: 50px; color: var(--color02); }
#sec_info .table > div { display: flex;  }
#sec_info .table > div > dt { flex-shrink: 0; padding: 25px 0 25px 25px; box-sizing: border-box; }
#sec_info .table > div > dd { flex-grow: 1; border-bottom: 1px solid #cecece; padding: 25px 0 25px 70px; box-sizing: border-box; }
#sec_info .table > div dd div { display: flex; }
#sec_info .table > div dd dl dt { width: 180px; box-sizing: border-box; font-weight: normal; text-align: left; }
#sec_info .table > div dd dl dd { text-indent: -0.8em; padding-left: 0.8em; box-sizing: border-box; }

@media screen and (min-width: 601px) {
	#sec_info .table > div > dt { width: 225px; border-bottom: 1px solid #70746f; }
}

@media screen and (max-width: 600px) {
	#sec_info { padding: 60px 0 80px; }
	#sec_info h2 { margin-bottom: 15px; }
	#sec_info h2 .font_en { font-size: 22px; }
	#sec_info .table > div { flex-direction: column; position: relative; line-height: 1.7; }
	#sec_info .table > div::before { content: ''; position: absolute; bottom: 0; left: 0; width: 10%; height: 1px; background: #70746f;}
	#sec_info .table > div > dt { padding: 20px 0 5px 15px; }
	#sec_info .table > div > dd { padding: 0 0 20px 15px; }
	#sec_info .table > div dd div { flex-direction: column; margin-top: 0.5em;}
	#sec_info .table > div dd div .sp { display: inline;}
	#sec_info .table > div dd dl dt { width: auto;}
	#sec_info .table > div dd dl dd { text-indent: 0; padding-left: 0.8em; }
}


/* ---------------------------------------------------
	Ticker_col
------------------------------------------------------ */
#ticker_col .ticker,
#ticker_col .ticker ul { display: flex; }
#ticker_col .ticker { width: 100%; position: relative; z-index: 0; overflow: hidden; }
#ticker_col .ticker ul { animation: loop 350s -175s linear infinite; backface-visibility: hidden; will-change: transform; }
#ticker_col .ticker ul + ul { animation: loop2 350s -350s linear infinite; }
#ticker_col .ticker li { width: 600px; position: relative; z-index: 0; }
#ticker_col .ticker li .ofi { width: 100%; }

@keyframes loop {
	0% {
		-webkit-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
	}
	100% {
		-webkit-transform: translateX(-100%);
		-ms-transform: translateX(-100%);
		transform: translateX(-100%);
	}
}
@keyframes loop2 {
	0% {
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
	100% {
		-webkit-transform: translateX(-200%);
		-ms-transform: translateX(-200%);
		transform: translateX(-200%);
	}
}

@media screen and (hover: hover) and (min-width: 601px) {
	#ticker_col .box .txt .link:hover {
		border-bottom: none;
	}
}
@media screen and (max-width: 600px) {
	#ticker_col .ticker li { width: 45vw; }
}