@charset "utf-8";
/* ===================================================
	Home CSS
====================================================== */
/* ---------------------------------------------------
	#loading
------------------------------------------------------ */
@keyframes fade-anim {
	0% { opacity: 0;}
	40% { opacity: 1; }
	100% { opacity: 0; }
}

#loading {
	opacity: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100vh;
	background: #fff;
	transition: transform 0.8s ease-in-out, height 0.8s;
}
#loading .bg {
	width: 100%;
    height: 100%;
	display: flex;
    align-items: center;
    justify-content: center;
    background: url(/common/img/bg_pattern_grad.webp) no-repeat center / cover;
    transform: translate(0, 100%);
    transition: transform 0.8s ease-in-out;
}
#loading .logo {
	opacity: 0;
	transition: opacity 0.5s 3s;
}

.load_start #loading {
	opacity: 1;
	z-index: 101;
}
.load_start #loading.load_anim .bg {
	transform: translate(0, 0);
}
.load_start #loading.load_anim .logo {
	animation: fade-anim 2.5s 2s;
}
.load_start #g_header,
.load_start #side_menu,
.load_start #main_img .main_area {
	opacity: 0;
	transition: 0.8s ease-in-out 1.5s;
}
.load_start #main_img .slick {
	opacity: 1;
}

.load_end #loading {
	height: 0;
}
.load_end #g_header,
.load_end #side_menu,
.load_end #main_img .main_area {
	opacity: 1;
}

@media screen and (max-width: 960px) {
	#loading {
		height: 100svh;
	}
	#loading .bg{
		background-position: center left 25%;
	}
}
@media screen and (max-width: 768px) {
	#loading .bg {
		background-image: url(/common/img/bg_pattern_grad_sp.webp);
	}
	#loading .logo {
		width: min(65vw, 280px);
	}
}


/* ---------------------------------------------------
	#main_img
------------------------------------------------------ */
#contents_wrap {
	position: relative;
}
main {
	padding-top: 100vh;
}

/* ↓↓ふわっと出現↓↓ */
#main_img::before {
	opacity: 0;
}
#main_img .slick {
	opacity: 0;
	transition: opacity 1s;
}
#main_img:has(.slick-initialized)::before,
#main_img .slick-initialized {
	opacity: 1;
}
/* ↑↑ふわっと出現↑↑ */

#main_img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100svh;
}
#main_img::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.25);
	transition: opacity 0.5s;
}
#main_img .slick .ofi {
	width: 100%;
	height: 100svh;
}
#main_img>picture .ofi {
	width: 100%;
	min-height: 240px;
}
#main_img .main_area {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 35px;
	padding-right: 125px;
	z-index: 1;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	width: 100%;
}
#main_img .bestrate {
	display: flex;
	align-items: center;
	gap: 0 12px;
	line-height: 1.6;
	color: #fff;
}
#main_img .bestrate .lg {
	display: block;
	font-size: var(--f24);
}

@media screen and (min-width: 961px) {
	#main_img>picture .ofi {
		height: 600px;
	}
}
@media screen and (max-width: 960px) {
	#main_img {
		height: 100svh;
	}
	#main_img .main_area {
		padding-right: calc(35px + max(40px, 5.2vw));
	}
	main {
		padding-top: 100svh;
	}
}
@media screen and (min-width: 769px) {
	#main_img .bestrate {
		font-size: var(--f17);
	}
}
@media screen and (max-width: 768px) {
	#main_img h1 {
		width: min(65vw, 280px);
		margin-left: max(-40px, -5.2vw);
	}
	#main_img .main_area {
		justify-content: flex-start;
		padding: 0 calc(40px + 3%) 20px 4%;
	}
	#main_img .main_area p {
		width: max(80px,18%);
	}
	#main_img .bestrate {
		width: 100%;
        padding: 0;
	}
	#main_img .bestrate span:has(img) {
		max-width: 18%;
	}
}
@media screen and (max-width: 600px) {
	#main_img .main_area {
		gap: 10px 0;
		flex-direction: column-reverse;
	}
}


/* ---------------------------------------------------
	#sec_search
------------------------------------------------------ */
/* UI calendar */
.ui-widget,
.ui-widget button {
	font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif !important;
}

#sec_search {
	padding: 80px 0 60px;
}
#sec_search h2 {
	font-size: var(--f30);
    text-align: center;
}

@media screen and (max-width: 768px) {
	#sec_search {
		max-width: 100%;
		padding: 40px 5% 30px;
		background: url(../../img/bg_grad_sp.webp) no-repeat center top / cover;
	}
}

/* ___________

#tab_list
___________*/
#tab_list {
	display: flex;
	margin: 30px auto 35px;
    font-size: var(--f14);
}
#tab_list li {
	width: 100%;
}
#tab_list li+li a {
	border-left: 1px solid #dfdfdf;
}
#tab_list li a {
	border-top: 1px solid #dfdfdf;
	border-bottom: 1px solid #dfdfdf;
	line-height: 55px;
	display: block;
	text-align: center;
}
#tab_list li a.active {
	color: #fff;
	background: linear-gradient(to top, var(--cl-grad));
}

@media screen and (min-width: 769px) {
	#tab_list {
		border-right: 1px solid #dfdfdf;
		border-left: 1px solid #dfdfdf;
	}
}
@media screen and (max-width: 768px) {
	#tab_list {
		flex-wrap: wrap;
		margin: 30px 0 0;
		background-color: #fff;
	}
	#tab_list li {
		width: 50%;
	}
	#tab_list li a {
		line-height: 40px;
	}
	#tab_list li:nth-last-child(-n+2) a {
		border-top: 0;
	}
	#tab_list #tab_03 a {
		border-left: 0;
	}
}


/* ___________

#search_489ban 
___________*/
/* 仮 */
[id^="panel_"]:not(#panel_01) {
	padding: 20px;
	text-align: center;
}

[id^="panel_"] input[type="text"],
[id^="panel_"] input[type="submit"],
[id^="panel_"] select,
[id^="panel_"] button {
	font-size: var(--f15);
	margin: 0;
    appearance: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
    font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
    outline: none;
}
[id^="panel_"] input[type="text"]:disabled,
[id^="panel_"] select:disabled {
	color: #888;
	opacity: 1;
}
#panel_01 {
	display: flex;
	align-items: center;
	font-size: var(--f13);
}
#panel_01 .reserve {
	display: flex;
    flex-wrap: wrap;
	gap: 10px 1%;
	width: min(25%, 299px);
	padding: 0 2%;
}
#panel_01 .reserve li {
	width: 49.5%;
	min-width: 145px;
}

#search_489ban {
	flex-grow: 1;
	width: 75%;
}
#search_489ban form {
	display: flex;
}
#search_489ban form [class$="_489ban"] dt {
	margin-bottom: 5px;
	font-size: var(--f14);
	text-align: center;
}
#search_489ban input[type="checkbox"] {
	margin: 0 3px 0 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #aaa;
    position: relative;
    vertical-align: text-bottom;
    border-radius: 0;
    height: 15px;
    width: 15px;
}
#search_489ban input[type="text"]:disabled+label input[type="checkbox"]::after {
	content: "";
    display: block;
    position: absolute;
    top: -2px;
    left: 3px;
    width: 5px;
    height: 10px;
    transform: rotate(40deg);
    border-bottom: 3px solid var(--cl-point);
    border-right: 3px solid var(--cl-point);
}
#search_489ban .date_489ban {
	flex: 1;
	width: 25%;
	border-right: 1px solid #dfdfdf;
}
#search_489ban .date_489ban dd {
	display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px 0;
}
#search_489ban .date_489ban dd input[type="text"] {
	width: 155px;
	padding: 0 20px 0 10px;
	font-size: var(--f21);
	background: url(/common/img/ico_calender.svg) no-repeat center right / 19px;
}
#search_489ban .date_489ban dd label {
	display: block;
}
#search_489ban .inbox_489ban {
	align-content: center;
	width: 18%;
	border-right: 1px solid #dfdfdf;
}
#search_489ban .stay_489ban,
#search_489ban .person_489ban {
	position: relative;
}
#search_489ban .stay_489ban select,
#search_489ban .person_489ban select {
	position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.select_label {
    display: flex;
    align-items: center;
    justify-content: center;
	padding-right: 15%;
    background: url(/common/img/select_stay.svg) no-repeat center right 15% / 12px #fff;
	font-size: var(--f21);
}
#search_489ban .person_489ban dd>span {
	display: none;
}
#search_489ban button {
	align-self: center;
	width: 19%;
    line-height: 44px;
	margin: 0 4.65%;
    color: #fff;
    background: linear-gradient(to top, var(--cl-grad));
	font-size: var(--f15);
	transition: opacity 0.5s;
}

@media screen and (hover: hover) and (min-width: 769px) {
	#search_489ban button:hover {
		cursor: pointer;
		opacity: 0.7;
	}
}
@media screen and (min-width: 769px) {
	[id^="panel_"] {
		border-right: 1px solid #dfdfdf;
		border-left: 1px solid #dfdfdf;
	}
	#search_489ban {
		border-right: 1px solid #dfdfdf;
	}
}
@media screen and (max-width: 768px) {
	#panel_01 {
		display: block;
		font-size: var(--f14);
	}
	#panel_01 .reserve {
		width: 100%;
		margin-top: 20px;
	}
	#search_489ban {
		width: 100%;
		padding: 20px 5% 30px;
		background: #fff;
	}
	#search_489ban form {
		flex-wrap: wrap;
	}
	#search_489ban form [class$="_489ban"] dt {
		text-align: left;
	}
	.select_label {
		border: 1px solid #dfdfdf;
		padding: 12px 15% 12px 4%;
		background-position: center right 7%;
		background-size: 0.6rem;
	}
	#search_489ban .date_489ban {
		flex: auto;
		width: 100%;
		margin-bottom: 1rem;
		border-right: 0;
	}
	#search_489ban .date_489ban dd {
		align-items: flex-start;
	}
	#search_489ban .date_489ban dd input[type="text"] {
		width: 100%;
		border: 1px solid #dfdfdf;
		padding: 12px 4%;
        background-position: center left max(115px, 50%);
		background-size: 1rem;
	}
	#search_489ban .inbox_489ban {
		width: 50%;
		border-right: 0;
	}
	#search_489ban .inbox_489ban:nth-of-type(2) .select_label {
		border-left: 0;
	}
	#search_489ban button {
		width: 100%;
		margin: 20px 0 0;
	}
}


/* ---------------------------------------------------
	#sec_lead
------------------------------------------------------ */
#sec_lead {
	position: relative;
	padding-bottom: min(25vw, 350px);
	background: url(/common/img/point_flower.webp)no-repeat top left min(4vw,65px)/min(18.75vw,300px),
	url(/common/img/point_leaf.webp)no-repeat top right/min(31.15vw,405px),
	url(/lg_common/img/lead_bg.webp)no-repeat center bottom/100%;
}
#sec_lead .cmn_tit_02 {
	padding: clamp(40px,4vw,80px) 0;
}
#sec_lead h2 {
	margin-top: 25px;
	font-size: var(--f44);
}
#sec_lead .flex {
    display: grid;
    flex-wrap: wrap;
    grid-template-rows: repeat(3, auto);
    grid-template-columns: 1fr 50%;
    gap: 0 2%;
	margin-top: min(4vw,60px);
}
#sec_lead [class^="txt_"] {
	line-height: 1.8;
}
#sec_lead [class^="txt_"] p+p {
	margin-top: 2em;
}
#sec_lead [class^="txt_"] a {
	text-decoration: underline;
}
#sec_lead .txt_01 {
	grid-column: 2;
    grid-row: 1;
    color: #092b3b;
}
#sec_lead .detail {
    grid-column: 1;
    grid-row: 1 / 3;
	align-self: center;
	position: absolute;
	left: max(0vw, calc(50vw - 755px));
	z-index: 1;
    width: 48%;
}
#sec_lead .wide {
	position: relative;
    grid-column: 2 / 3;
    grid-row: 2;
	margin-top: 30px;
}
#sec_lead .wide::before {
	position: absolute;
    top: 25%;
    left: -28%;
    z-index: 0;
	content: '';
	display: block;
    width: min(26vw, 350px);
    height: clamp(50px,9vw, 120px);
	background: url(/lg_common/img/map_arrow.svg)no-repeat center right/contain;
}
#sec_lead .txt_02 {
	grid-column: 1 / 3;
    grid-row: 4;
	margin-top: 30px;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	z-index: 98;
}

@media screen and (max-width: 960px) {
	#sec_lead .flex {
		display: flex;
		gap: 0;
		margin-top: 0;
	}
	#sec_lead .detail {
		position: static;
		width: 59.7%;
		margin: 40px 0 0 -2%;
	}
	#sec_lead .wide {
		align-self: center;
		width: 42%;
	}
	#sec_lead .wide::before {
		width: 20vw;
		background-size: cover;
        background-position: bottom right;
	}
	#sec_lead #map_wrap {
		width: 100%;
		margin-top: 30px;
		border: 1px solid #ccc;
	}
	#sec_lead #map {
		width: 100%;
	}
	#sec_lead .leaflet-left {
		left: auto;
		right: 0;
	}
	#sec_lead .leaflet-left .leaflet-control { margin: 3vw; }
	#sec_lead .txt_02 {
		width: 100%;
		margin-top: 30px;
	}
}


/* ---------------------------------------------------
	Common Parts
------------------------------------------------------ */
.bg_grad {
	background: url(/common/img/bg_grad_gr.png)repeat;
}
.cmn_tit {
	position: relative;
	font-size: var(--f18);
	letter-spacing: 0.15em;
}
.cmn_tit::before {
	position: absolute;
	left: 75%;
    bottom: 42%;
	content: '';
	display: block;
	width: clamp(9rem,19.5vw,15.6rem);
	height: 1px;
	background-color: #181818;
	transition: transform 0.8s 0.5s;
	transform: scaleX(0);
	transform-origin: left;
}
.cmn_tit.show::before {
	transform: scaleX(1);
}
.cmn_tit .en {
	display: block;
	font-size: var(--f66);
	line-height: 1.35;
}
@media screen and (min-width: 769px) {
	.cmn_layout_01 .layout .txt_wrap {
		padding-top: 80px;
	}
}
@media screen and (max-width: 768px) {
	.cmn_layout_01 .cmn_tit::before {
		content: none;
	}
}

/* ---------------------------------------------------
	.cmn_table
------------------------------------------------------ */
.cmn_table>div {
	border-bottom: 1px solid #d3cbb6;
}
.cmn_table>div>dt {
	background-color: #e9eae0;
}
@media screen and (min-width: 769px) {
	.cmn_table>div {
		display: flex;
	}
	.cmn_table>div>dt {
		align-content: center;
		width: 160px;
		padding: min(3vw, 25px) 1rem;
		text-align: center;
	}
	.cmn_table>div>dd {
		flex: 1;
		padding: min(3vw, 25px) var(--f27);
	}
}
@media screen and (max-width: 768px) {
	.cmn_table>div>dt,
	.cmn_table>div>dd {
		padding: 12px 4%;
	}
}


/* ---------------------------------------------------
	#sec_spa
------------------------------------------------------ */
#sec_spa {
	padding: clamp(3.8rem,13.2vw,9.4rem) 0 min(15vw,240px);
}
#sec_spa .slick {
	margin-bottom: 0;
}
#sec_spa .slick .ofi {
	width: 100%;
}
#sec_spa .center_slider .slick-slide {
	margin: 0 15px;
}
#sec_spa .center_slider .slick-dots {
	text-align: center;
}
#sec_spa .cmn_tit {
	padding: calc(clamp(2.5rem,3.9vw,3.1rem) + 30px) 0 clamp(2.5rem,3.9vw,3.1rem);
	text-align: center;
}
#sec_spa .cmn_tit::before {
	top: 0;
	left: 50%;
	width: 1px;
	height: clamp(2.5rem,3.9vw,3.1rem);
	transform: scaleY(0);
	transform-origin: top;
}
#sec_spa .cmn_tit.show::before {
	transform: scaleY(1);
}

.spa_01 {
	position: relative;
	display: flex;
	gap: 0 5%;
	padding: min(6.25vw,80px) 0 min(7vw,90px);
}
.spa_01 p {
	line-height: 2.2;
}
.spa_01 .box_1 .sub {
	font-size: var(--f33);
	line-height: 1.65;
	letter-spacing: 0.15em;
}
[lang="en"] .spa_01 .box_1 .sub {
	letter-spacing: 0;
}
.spa_01 .box_1 .sub+p {
	margin-top: 50px;
}
.spa_01 .box_1 .photo {
	margin-top: 90px;
}
.spa_01 .box_1 .photo p:nth-child(1) .ofi {
	max-width: 76%;
}
.spa_01 .box_1 .photo p:nth-child(2) {
	margin-top: -25px;
    text-align: right;
}
.spa_01 .box_1 .photo p:nth-child(2) .ofi {
    max-width: 66.6%;
}
.spa_01 .box_1 .inner>p+p {
	margin-top: 2rem;
}
.spa_01 .box_2 .photo .ofi {
	width: 100%;
}
.spa_01 .box_2 .photo+p {
	margin-top: 60px;
}
.spa_02 {
	padding-top: min(8.6vw,110px);
}
.spa_02 .inner_md {
	display: flex;
	border: 1px solid rgba(132,132,132,0.5);
	border-radius: 20px;
	padding: 40px 0;
}
.spa_02 .txt_wrap {
	flex: 1;
	border-left: 1px solid rgba(132,132,132,0.3);
	padding: 15px 2.5%;
}
.spa_02 h3 {
	font-size: var(--f21);
}
.spa_02 .txt_wrap ul {
	display: flex;
	flex-wrap: wrap;
	gap: 5px 4%;
	margin-top: 20px;
}
.spa_02 .txt_wrap li {
	position: relative;
	padding-left: calc(var(--f15) + 15px);
}
.spa_02 .txt_wrap li::before {
	position: absolute;
	top: 0.25rem;
	left: 0;
	content: '';
	display: block;
	width: var(--f15);
	height: var(--f15);
	background: url(/common/img/icon_check.svg)no-repeat center/contain;
}
.spa_02 .txt_wrap li span {
	font-size: var(--f18);
	color: #e4654c;
}
.spa_02 .txt_wrap>p {
	margin-top: 35px;
}
.spa_02 .stamp {
	flex-shrink: 0;
	align-content: center;
	width: 22.9%;
	padding: 0 4%;
	text-align: center;
}

@media screen and (min-width: 769px) {
	.spa_01 .ofi {
		width: 100%;
	}
	.spa_01 .box_1 {
		width: 50.6%;
	}
	.spa_01 .box_1 .inner {
		width: min(100%,465px);
	}
	.spa_01 .box_2 {
		width: 47.5%;
	}
	.spa_01 .box_1 .photo p:nth-child(2) {
		margin-top: -25px;
		text-align: right;
	}
	.spa_01 .box_1 .photo p:nth-child(2) .ofi {
		max-width: 66.6%;
	}
	.spa_02 .inner_md  {
		flex-direction: row-reverse;
	}
	.spa_02 .txt_wrap li {
		width: 48%;
	}
}
@media screen and (max-width: 768px) {
	#sec_spa {
		background-position: top 40px right;
	}
	#sec_spa .dot_slider .ofi {
		aspect-ratio: 20/21;
	}
	#sec_spa .center_slider .slick-slide {
		margin: 0 8px;
	}
	#sec_spa .center_slider .ofi {
		min-height: 220px;
	}
	.spa_01 {
		flex-direction: column;
	}
	.spa_01 .box_1 .inner {
		padding: 0 5%;
	}
	.spa_01 .box_1 .sub+p {
		margin-top: 2rem;
	}
	.spa_01 .box_1 .photo {
		margin-top: 50px;
	}
	.spa_01 .box_2 {
		margin-top: 40px;
		padding: 0 5%;
	}
	.spa_01 .box_2 .photo+p {
		margin-top: 1.5rem;
	}
	.spa_01 .box_2 div:has(.--circle) {
		margin-top: 15px;
		text-align: center;
	}
	.spa_02 .inner_md {
		flex-direction: column;
		padding: 30px 5% 20px;
	}
	.spa_02 h3 {
		text-align: center;
	}
	.spa_02 .txt_wrap {
		border-left: none;
		border-bottom: 1px solid rgba(132,132,132,0.3);
		padding: 0 0 15px;
	}
	.spa_02 .txt_wrap>p {
		margin-top: 20px;
	}
	.spa_02 .txt_wrap ul {
		flex-direction: column;
	}
	.spa_02 .stamp {
		width: min(44.8%, 136px);
		margin: 15px auto 0;
		padding: 0;
	}
}


/* ---------------------------------------------------
	#sec_meal
------------------------------------------------------ */
#sec_meal {
	position: relative;
	padding-bottom: min(7.9vw,100px);
}
#sec_meal::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 94%;
	height: 100%;
	background: url(/common/img/point_flower_wh.webp)no-repeat right -4% bottom -15%/20%,
	url(/common/img/bg_grad_gr.png)no-repeat left/cover;
}

@media screen and (min-width: 769px) {
	#sec_meal .layout .slick {
		margin: min(-4vw,-60px) 0 40px 0;
	}
}
@media screen and (max-width: 768px) {
	#sec_meal::before {
		width: 100%;
		background-position: right -8% bottom -6%, center;
        background-size: max(125px, 27%), cover;
		background-image: url(/common/img/point_flower_wh.webp), url(../../img/bg_grad_sp.webp);
	}
}


/* ---------------------------------------------------
	#sec_room
------------------------------------------------------ */
#sec_room {
	padding: min(17vw,215px) 0;
	background: url(/common/img/point_leaf_03.webp) no-repeat top right 4% / clamp(13vw, 29vw, 23.3rem);
}
#sec_room .layout .slick {
	align-self: center;
}
#sec_room .v_rl {
    display: flex;
    align-items: center;
	font-size: var(--f24);
}
#sec_room .txt_wrap .inner>div {
	text-align: right;
}
#sec_room .slick_wrap {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	margin-left: max(4%, calc(50vw - 700px));
	padding-top: clamp(40px,4vw,80px);
}
.slick_count .slick-list {
	order: 1;
    width: 100%;
}
.slick_count .slick-track {
	display: flex !important;
}
.slick_count .slick-slide {
	margin: 0 5px;
	line-height: 1.8;
}
.slick_count .item {
	position: relative
}
.slick_count .item span {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	padding: 8px 15px;
	color: #fff;
}
.slick_bottom {
	display: flex;
    flex-wrap: wrap;
    align-items: center;
	justify-content: center;
	gap: 0 10px;
}
.slick_count .slick-prev,
.slick_count .slick-next {
	opacity: 1;
	z-index: 1;
}
.slick_count .slick-prev::before,
.slick_count .slick-next::before {
	content: '<';
	color: #8c8c8c;
}
.slick_count .slick-next {
	transform: translateY(-50%) scale(-1, 1);
}
.slick_count .slick_bottom {
	position: relative;
}
.slick_count .ofi {
	min-height: 220px;
}
.slick_bottom .count_current {
	font-size: var(--f44);
	color: #87a45b;
}
.slick_bottom .count_total {
	margin-bottom: -12px;
	padding-top: 55px;
	font-size: var(--f24);
}
.slick_bottom .count_total::before {
	content: '';
	position: absolute;
    bottom: 0;
    display: block;
    width: 1px;
    height: clamp(3rem,4vw,3rem);
    background-color: #8c8c8c;
    transform: rotate(40deg) translate(0px, 30%);
}

@media screen and (min-width: 961px) {
	.slick_count {
		width: calc(100% - 150px);
	}
	.slick_count .slick-list {
        padding-right: 35.8% !important;
    }
	.slick_count .ofi {
		min-height: 350px;
	}
	.slick_count .slick-slide {
		margin: 0 18px;
	}
	.slick_count .slick-prev {
		left: -150px;
		top: auto;
		bottom: 20px;
		transform: none;
	}
	.slick_count .slick-next {
		right: auto;
		left: -1rem;
		top: auto;
		bottom: 20px;
		transform: translateX(-100%) scale(-1, 1);
	}
	.slick_bottom {
		align-items: flex-end;
		position: absolute;
		left: 0;
		bottom: 10px;
		width: 150px;
		margin-top: auto;
		margin-left: -0.5%;
	}
	#sec_room .v_rl {
		width: 150px;
		padding-right: 1rem;
	}
}
@media screen and (max-width: 960px) {
	#sec_room .slick_wrap {
		flex-direction: column;
	}
	#sec_room .box_2 {
		padding-top: 0;
	}
	#sec_room .v_rl {
		writing-mode: horizontal-tb;
		margin-bottom: 0.5rem;
	}
	.slick_count {
		width: 100%;
	}
	.slick_count .slick-prev {
		top: auto;
		bottom: -60px;
		left: calc(50% - 60px);
	}
	.slick_count .slick-next {
		top: auto;
		bottom: -60px;
		right: calc(50% - 60px);
	}
	.slick_bottom {
		line-height: 1;
		margin-top: -10px;
	}
	.slick_bottom .count_total::before {
		height: 40px;
	}
}


/* ---------------------------------------------------
	.cmn_style_02
------------------------------------------------------ */
.cmn_style_02 {
	display: flex;
}
.cmn_style_02 .cmn_tit_03 {
	flex: 1;
	font-size: var(--f37);
}
.cmn_style_02 .contents {
	flex-shrink: 0;
	line-height: 1.8;
}
.cmn_style_02 div.photo {
	display: flex;
	gap: 0 1px;
}
.cmn_style_02 div.photo>p,
.cmn_style_02 div.photo .ofi {
	width: 100%;
}
.cmn_style_02 .photo+p {
	padding: 30px 0;
}
.cmn_style_02 .list_note {
	margin-top: 2em;
}
.cmn_style_02 .list_note li {
	padding-left: 1em;
	text-indent: -1em;
}
.cmn_style_02 .list_note li::before {
	content: '※';
}

@media screen and (min-width: 769px) {
	.cmn_style_02 {
		align-items: flex-start;
		justify-content: space-between;
		gap: 0 8%;
	}
	.cmn_style_02 .contents {
		width: 88%;
	}
}
@media screen and (max-width: 768px) {
	.cmn_style_02 {
		flex-direction: column;
	}
	.cmn_style_02 .cmn_tit_03 {
		margin-bottom: 1rem;
	}
	.cmn_style_02 .photo+p {
		padding: 20px 0;
	}
}


/* ---------------------------------------------------
	#sec_facility
------------------------------------------------------ */
#sec_facility {
	position: relative;
	padding-bottom: min(6vw,110px);
}
#sec_facility::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 94%;
	height: 100%;
	background: url(/common/img/bg_grad_gr.png)repeat;
}
#sec_facility .cmn_tit::before {
	left: 100%;
}
@media screen and (min-width: 769px) {
	#sec_facility .layout .slick {
		margin: min(-4vw,-60px) 0 0;
	}
}
@media screen and (max-width: 768px) {
	#sec_facility::before {
		width: 100%;
	}
}


/* ---------------------------------------------------
	#sec_access
------------------------------------------------------ */
#sec_access {
	padding: min(8.6vw,110px) 0;
}
.google_map iframe {
	width: 100%;
}
.google_map+p:has(.pin) {
	padding: 20px 0 40px;
	text-align: right;
}
#sec_access .pin {
	position: relative;
    padding-left: clamp(25px, 3vw, 35px);
}
#sec_access .pin::before {
	position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    content: '';
    display: block;
    width: var(--f18);
    height: var(--f27);
    background: url(/common/img/icon_pin.svg) no-repeat center / contain;
}
#sec_access .pin .link_run {
	border-bottom: none;
}
[id^="by_"] {
	padding: min(5vw,65px) 0;
}
#sec_access .cmn_tit {
	margin-bottom: 30px;
	text-align: center;
}
#sec_access .cmn_tit .en {
	font-size: var(--f30);
}
#sec_access .cmn_table dd span {
	display: block;
	color: #856744;
}
#sec_access .route_point {
	width: min(100%,648px);
	margin: 35px auto 0;
}
#sec_access .route_point li+li {
	margin-top: 22px;
}
#sec_access .route_point li a {
	position: relative;
	display: block;
	padding: 15px 1rem;
	font-size: var(--f14);
	color: #fff;
	background: linear-gradient(to top, var(--cl-grad2));
	text-align: center;
}
#sec_access .route_point li a::after {
	position: absolute;
	top: 50%;
	right: min(4vw,55px);
    content: '';
    display: block;
    width: 7px;
    height: 7px;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    transform: rotate(-45deg) skew(5deg, 5deg) translateY(-50%);
}
#sec_access .route_point li span {
	display: inline-block;
}
#sec_access .route_point .lg {
	font-size: var(--f18);
}
#sec_access .route_point .md {
	font-size: var(--f15);
}
#sec_access .route_link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0 var(--f21);
    width: min(100%,648px);
	margin: 30px auto 0;
	padding: var(--f30) 1rem;
    background-color: #f1f5ef;
    border-radius: var(--f66);
	transition: background-color 0.5s;
}
#sec_access .route_link::before,
#sec_access .route_link::after {
	flex-shrink: 0;
}
#sec_access .route_link::before {
	position: static;
	transform: none;
	width: 1rem;
}
#sec_access .route_link::after {
	content: '';
	display: block;
	width: 7px;
	height: 7px;
	border-right: 1.5px solid #999;
	border-bottom: 1.5px solid #999;
	transform: rotate(-45deg) skew(5deg,5deg);
}
.ex_link_col {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px min(7vw, 100px);
	margin-top: 30px;
	font-size: var(--f14);
}
.ex_link_col li a {
	position: relative;
	padding-right: var(--f55);
	line-height: 1.8;
}
.ex_link_col li a::after {
	position: absolute;
	top: 0;
	right: 0;
	content: '';
	display: block;
	width: var(--f17);
	height: var(--f17);
	background: url(/access/img/icon_link.svg)no-repeat center/contain;
}
#by_car {
	padding-top: min(7.8vw,110px);
}
#by_car .cmn_tit+p {
	text-align: center;
}

@media screen and (hover: hover) and (min-width: 769px) {
	#sec_access .route_link:hover {
		opacity: 1;
		background-color: #fff;
	}
}
@media screen and (min-width: 769px) {
	#sec_access .cmn_tit_03 {
		padding-top: 1em;
	}
	#sec_route .cmn_tit+p {
		text-align: center;
	}
}
@media screen and (max-width: 768px) {
	.google_map iframe {
		height: clamp(250px, 46vw, 590px);
	}
	#sec_access .route_point li+li {
		margin-top: 12px;
	}
	#sec_access .route_link {
		padding: 20px 1rem;
		line-height: 1.5;
	}
}
@media screen and (max-width: 600px) {
	#sec_access .route_point .lg {
		font-size: var(--f17);
	}
	#sec_access .route_point li a::after {
		right: 10px;
	}
}
@media screen and (max-width: 375px) {
	#sec_access .route_point li a::after {
		content: none;
	}
}

#sec_access .info_col {
	display: flex;
	gap: 0 min(4.3vw,55px);
	width: 100%;
	border: 1px solid #9f9f9f;
	padding: 30px 3vw 30px 0;
	line-height: 1.8;
}
#sec_access .info_col dd>span {
	display: block;
	margin-bottom: 0.75rem;
	color: #b84141;
}
#sec_access .info_col dd span .sm {
	font-size: var(--f13);
}

@media screen and (min-width: 769px) {
	#sec_access .info_col dt {
		display: flex;
		align-items: center;
		justify-content: center;
		width: min(20vw,260px);
		/* line-height: min(8.5vw,110px); */
		border-right: 1px solid #9f9f9f;
		padding: 0 3vw;
	}
}
@media screen and (max-width: 768px) {
	#sec_access .info_col {
		flex-direction: column;
		padding: 20px 6%;
	}
	#sec_access .info_col dt {
		border-bottom: 1px solid #9f9f9f;
		margin-bottom: 1rem;
		padding-bottom: 0.75rem;
		text-align: center;
	}
}


/* ---------------------------------------------------
	#sec_spot
------------------------------------------------------ */
#sec_spot {
	padding: min(11vw,150px) 0 min(7.4vw,95px);
}
#sec_spot .item {
	display: flex !important;
	gap: 0 2.5%;
	line-height: 1.8;
	padding: min(3.5vw, 45px);
	background-color: #fff;
}
#sec_spot .item .photo {
	flex-shrink: 0;
	width: 41.7%;
}
#sec_spot .item .name {
	border-image: linear-gradient(0deg, #ccc 1px, transparent 0) fill 0 / / 0 1.5rem;
	padding-bottom: 0.5rem;
	font-size: var(--f21);
}
#sec_spot .slick .slick-dots {
	position: static;
	padding: 0;
	line-height: 50px;
}
#sec_spot .slick .slick-dots li:last-child {
	margin-right: 0;
}
#sec_spot .time {
	display: flex;
	gap: 0 8px;
	margin: 0.75rem 0 1rem;
}
#sec_spot .time::before {
	content: '';
	display: block;
}
#sec_spot .time.foot::before {
	width: 15px;
	height: 22px;
	background: url(/access/img/icon_foot.webp)no-repeat center/contain;
}
#sec_spot .time.car::before {
	width: 20px;
	height: 15px;
    margin-top: 1.5%;
	background: url(/access/img/icon_car.svg)no-repeat center/contain;
}
#sec_spot .txt {
	padding: 0 1.5rem;
}
#sec_spot .txt p:not(.time) {
	line-height: 1.8;
	font-size: var(--f14);
}
#sec_spot .link_col {
	display: flex;
    justify-content: flex-end;
	gap: 5px 1rem;
    margin-top: 25px;
}
#sec_spot .link_col a {
	display: block;
	padding: 5px 1rem;
	box-sizing: border-box;
	text-align: center;
}
#sec_spot .link_col .map {
	width: 170px;
	color: #fff;
	background: linear-gradient(to top, var(--cl-grad2));
}
#sec_spot .link_col .web {
	outline: 1px solid #000;
	outline-offset: -1px;
}

@media screen and (min-width: 769px) {
	#sec_spot .item .photo {
		flex-shrink: 0;
		width: min(47.3%, 440px);
	}
}
@media screen and (max-width: 768px) {
	#sec_spot .item {
		flex-direction: column;
		height: 100%;
		padding: 4vw 4vw 6vw;
	}
	#sec_spot .item .name {
		padding: 1rem 0 0.5rem;
	}
	#sec_spot .dot_slider .slick-track {
		display: flex !important;
	}
	#sec_spot .dot_slider .slick-slide {
		height: auto;
	}
	#sec_spot .dot_slider .slick-slide>div {
		height: 100%;
	}
	#sec_spot .item .photo {
		width: 100%;
	}
	#sec_spot .item .photo .ofi {
		height: 100%;
	}
	#sec_spot .txt {
		flex: 1;
		display: flex;
		flex-direction: column;
		padding: 0 1rem;
	}
	#sec_spot .time::before {
		transform: scale(0.85);
	}
	#sec_spot .txt p:not(.time) {
		margin-bottom: 15px;
	}
	#sec_spot .link_col {
		margin-top: auto;
	}
	#sec_spot .link_col li:has(.map) {
		flex: 1;
	}
	#sec_spot .link_col .map {
		width: auto;
	}
}


/* ---------------------------------------------------
	#sec_info
------------------------------------------------------ */
#sec_info {
	padding: min(12.5vw,160px) 0 min(12vw,130px);
}
#sec_info .summary>div {
	display: flex;
	border-bottom: 1px solid #ccc;
	padding: var(--f33) 0;
}

@media screen and (min-width: 601px) {
	#sec_info .summary dt {
		align-content: center;
		width: max(150px, 24.5%);
		padding: 0 1rem;
	}
	#sec_info .summary dd {
		flex: 1;
	}
	#sec_info .summary>div:first-of-type {
		padding-top: 0;
	}
}
@media screen and (max-width: 600px) {
	#sec_info .summary>div {
		flex-direction: column;
	}
	#sec_info .summary dt {
		font-weight: bold;
	}
}