@charset "utf-8";
/* ===================================================
	Web Fonts
	※ 公式サイトと同じく Noto Sans JP は読み込まず、
	　日本語は端末のゴシック体（Mac：ヒラギノ角ゴ など）で表示します。
====================================================== */
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Quattrocento:wght@400;700&display=swap");

/* コンテナクエリ単位をpxに換算するための登録（公式サイトと同じ仕組み） */
@property --1cqi { syntax: "<length>"; inherits: true; initial-value: 0px; }
@property --1cqw { syntax: "<length>"; inherits: true; initial-value: 0px; }


/* ===================================================
	Reset
====================================================== */
#customer_header *,
#customer_header *::before,
#customer_header *::after,
#customer_footer *,
#customer_footer *::before,
#customer_footer *::after { -webkit-box-sizing: border-box; box-sizing: border-box; background-repeat: no-repeat; }

#customer_header :where(h1, h2) { margin: 0; font-size: 100%; line-height: inherit; }

#customer_header :where(ul, ol, li),
#customer_footer :where(ul, li) { padding: 0; margin: 0; list-style: none; }

#customer_header :where(p),
#customer_footer :where(p) { padding: 0; margin: 0; }

#customer_header :where(small),
#customer_footer :where(small) { font-size: 80%; }

#customer_header :where(img),
#customer_footer :where(img) { max-width: 100%; vertical-align: middle; border: 0; }
#customer_header :where(img[width][height]),
#customer_footer :where(img[width][height]) { height: auto; }

#customer_header a:focus,
#customer_footer a:focus { outline: none; }


/* ===================================================
	Custom CSS
	※ 予約番自体のコンテンツに影響するのを避けるため、
	　必ず #customer_header または #customer_footer からの継承で記述してください。
====================================================== */
#customer_header,
#customer_footer {
	--base: 14;
	--header-height: 85;
	display: flow-root; position: relative;
	font-size: calc(var(--base) * 1px); font-weight: 500; line-height: 2;
	font-family: "Noto Sans JP", sans-serif;
	color: #857d6e; background: #f9f8f2;
	font-feature-settings: "halt"; font-variant-east-asian: proportional-width; font-kerning: normal; overflow-wrap: break-word;
	-webkit-text-size-adjust: 100%; text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 47.9375em) {
	#customer_header,
	#customer_footer { --base: 15; }
}

#customer_header :where(a),
#customer_footer :where(a) {
	color: #857d6e; transition: .15s;
	text-decoration: underline calc(1 / var(--base) * 1em) currentColor; text-underline-offset: calc(5 / var(--base) * 1em);
}
#customer_header :where(a):focus-visible,
#customer_footer :where(a):focus-visible { outline: .25rem solid rgba(0, 125, 250, .6); outline-offset: 1px; }

/* コンテナクエリ用の変数（各コンテナの直下要素で計算） */
#customer_header #header > *, #customer_header #header::before, #customer_header #header::after,
#customer_header .box_nav > *, #customer_header .box_nav::before, #customer_header .box_nav::after,
#customer_header .box_fv_lower > *, #customer_header .box_fv_lower::before, #customer_header .box_fv_lower::after,
#customer_header .abi-container-breadcrumbs > *,
#customer_header .box_site_info > *, #customer_header .box_site_info::before, #customer_header .box_site_info::after,
#customer_header .box_page_list > *, #customer_header .box_page_list::before, #customer_header .box_page_list::after,
#customer_footer #footer > *, #customer_footer #footer::before, #customer_footer #footer::after,
#customer_footer .box_site_info > *, #customer_footer .box_site_info::before, #customer_footer .box_site_info::after,
#customer_footer .box_page_list > *, #customer_footer .box_page_list::before, #customer_footer .box_page_list::after,
#customer_footer .c-heading[data-size=sm] .c-heading__heading > * {
	--1cqi: 1cqi; --cqi-to-px: calc(tan(atan2(var(--1cqi), 1px)));
	--1cqw: 1cqw; --cqw-to-px: calc(tan(atan2(var(--1cqw), 1px)));
}

/* 予約番 */
#webc_con.webc_clr_blk .webc_language { background: #fff; }

@media screen and (max-width: 600px) {
	#customer_footer > p { display: none; pointer-events: none; }
}


/* ---------------------------------------------------
	Utility
------------------------------------------------------ */
#customer_header .visually-hidden {
	position: absolute !important; clip: rect(1px, 1px, 1px, 1px);
	padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden;
}

#customer_header [data-text]::before,
#customer_footer [data-text]::before { content: attr(data-text) ""; }

/* アイコン（mask で currentColor に着色）
   ※ mask-image は別ドメインの画像だとブロックされるため、SVG を data URI で埋め込んでいます */
#customer_header [class*=ico_],
#customer_header [data-icon],
#customer_footer [class*=ico_] { display: block; position: relative; }

#customer_header [class*=ico_]::before,
#customer_header [data-icon]::before,
#customer_footer [class*=ico_]::before {
	display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;
	-webkit-mask: center / contain no-repeat; mask: center / contain no-repeat;
	background-color: currentColor; content: "";
}

/* 矢印（右） */
#customer_header .ico_arrow-right::before,
#customer_header .ico_arrow_right::before,
#customer_header [data-icon=arrow-right]::before,
#customer_footer .ico_arrow-right::before {
	aspect-ratio: 18 / 6;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='6' fill='none' viewBox='0 0 18 6'%3E%3Cpath stroke='%23000' stroke-miterlimit='10' stroke-width='.8' d='M0 3h17.3M18 3c-3 0-5.5 1.3-5.5 3M18 3c-3 0-5.5-1.3-5.5-3'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='6' fill='none' viewBox='0 0 18 6'%3E%3Cpath stroke='%23000' stroke-miterlimit='10' stroke-width='.8' d='M0 3h17.3M18 3c-3 0-5.5 1.3-5.5 3M18 3c-3 0-5.5-1.3-5.5-3'/%3E%3C/svg%3E");
}

/* 矢印（下） */
#customer_header .ico_arrow_down::before {
	aspect-ratio: 1 / 1;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='.5' d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='.5' d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

/* スキップリンク内の矢印サイズ */
#customer_header .btn_skip a [class*=ico_] { width: 1.2em; height: 1em; }

#customer_footer .ico_external::before {
	aspect-ratio: 1 / 1;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m11.27.13.6.6-6.42 6.43-.6-.6z'/%3E%3Cpath d='M12 4.29h-.86V.86H7.71V0H12zM9.86 12H1.29C.56 12 0 11.44 0 10.71V2.14C0 1.41.56.86 1.29.86H6v.85H1.29c-.26 0-.43.18-.43.43v8.57q.02.41.43.43h8.57c.25 0 .43-.17.43-.43V6h.85v4.71c0 .73-.55 1.29-1.28 1.29'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m11.27.13.6.6-6.42 6.43-.6-.6z'/%3E%3Cpath d='M12 4.29h-.86V.86H7.71V0H12zM9.86 12H1.29C.56 12 0 11.44 0 10.71V2.14C0 1.41.56.86 1.29.86H6v.85H1.29c-.26 0-.43.18-.43.43v8.57q.02.41.43.43h8.57c.25 0 .43-.17.43-.43V6h.85v4.71c0 .73-.55 1.29-1.28 1.29'/%3E%3C/svg%3E");
}

/* スキップリンク（フォーカス時のみ表示） */
#customer_header .btn_skip { position: absolute; top: calc(.25rem + 1px); left: calc(.25rem + 1px); right: calc(.25rem + 1px); }
#customer_header .btn_skip a {
	position: absolute; top: 0; left: 0; z-index: 10;
	display: flex; align-items: center; justify-content: center; gap: 1em;
	padding: 1em; max-width: 100%; width: max-content; height: 3em;
	color: #000; text-decoration: none; border-radius: 1.5em; transform: translateY(-100%); transition: 0s;
}
#customer_header .btn_skip a:not(:focus) {
	position: absolute !important; clip: rect(1px, 1px, 1px, 1px);
	padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden;
}
#customer_header .btn_skip a:focus-visible { color: #857d6e; background: #fff; transform: translateY(0); }

@media screen and (max-width: 47.9375em) {
	#customer_header .btn_skip a { font-size: .75em; }
}


/* ---------------------------------------------------
	Button : 宿泊予約
------------------------------------------------------ */
#customer_header .btn_reservation a,
#customer_footer .btn_reservation a {
	display: grid; place-content: center;
	text-decoration: none; color: #fff; background: #3a6a4b;
	border-radius: calc(4 / var(--base) * 1em); border: calc(1 / var(--base) * 1em) solid #3a6a4b; transition: .15s;
}
#customer_header .btn_reservation a .txt,
#customer_footer .btn_reservation a .txt { display: grid; place-content: center; gap: calc(8 / var(--base) * 1em); font-family: "Noto Sans JP", sans-serif; text-align: center; }
#customer_header .btn_reservation a .txt span:first-child,
#customer_footer .btn_reservation a .txt span:first-child { font-size: calc(var(--fsz) / var(--base) * 1em); line-height: 1; font-weight: 400; }
#customer_header .btn_reservation a .txt span:last-child,
#customer_footer .btn_reservation a .txt span:last-child { --fsz: 11; font-size: calc(var(--fsz) / var(--base) * 1em); line-height: 1; font-weight: 300; }
#customer_header .btn_reservation a:hover,
#customer_footer .btn_reservation a:hover { color: #3a6a4b; background: #fff; border-color: currentColor; }

@container header (calc(960 / 16 * 1em) <= inline-size) {
	#customer_header .btn_reservation a { padding: calc(8 / var(--base) * 1em) calc(40 / var(--base) * 1em); }
	#customer_header .btn_reservation a .txt { grid-template-rows: auto auto; }
	#customer_header .btn_reservation a .txt span:first-child { --fsz: 14; }
}
@container header (inline-size < calc(960 / 16 * 1em)) {
	#customer_header .btn_reservation a { padding: calc(12.5 / var(--base) * 1em); }
	#customer_header .btn_reservation a .txt { align-items: center; grid-template-columns: auto auto; }
	#customer_header .btn_reservation a .txt span:first-child { --fsz: 15; }
}


/* ===================================================
	Header
====================================================== */
#customer_header #header {
	container: header / inline-size;
	position: absolute; top: 0; left: 0; right: 0; z-index: 100;
}
#customer_header #header:has(#menu:target) { z-index: 10000; }
#customer_header:target #header { transition: z-index 0s .5s; }

#customer_header #header::before {
	position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 7;
	background: #3a6a4b; opacity: 0; visibility: hidden; pointer-events: none;
	content: "";
}
#customer_header #header:has(#menu:target)::before { opacity: .6; visibility: visible; transition: opacity .3s, visibility 0s; }
#customer_header:target #header::before { transition: opacity .3s, visibility 0s .3s; }

#customer_header #header .box_header {
	display: grid; gap: calc(24 / var(--base) * 1em); align-items: center;
	height: calc(var(--header-height) / var(--base) * 1em);
}
@container header (calc(960 / 16 * 1em) <= inline-size) {
	#customer_header #header .box_header { grid-template-columns: auto 1fr auto; padding: calc(25 / var(--base) * 1em) calc(51 / var(--base) * 1em); }
}
@container header (inline-size < calc(960 / 16 * 1em)) {
	#customer_header #header .box_header { grid-template-columns: auto auto; padding: calc(20 / var(--base) * 1em) calc(20 / var(--base) * 1em); }
}

/* ロゴ */
#customer_header #header .box_header > .title { --fsz: 11; font-size: calc(var(--fsz) / var(--base) * 1em); font-weight: 400; }
#customer_header #header .box_header > .title a {
	--gap: 21; display: grid; gap: calc(var(--gap) / var(--fsz) * 1em); align-items: center;
	width: fit-content; text-decoration: none; color: #696357;
}
#customer_header #header .box_header > .title a .txt { order: 2; display: block; }
#customer_header #header .box_header > .title a .logo { order: 1; display: block; }
#customer_header #header .box_header > .title a .logo img {
	display: block;
	filter: brightness(0) saturate(100%) invert(35%) sepia(12%) saturate(1479%) hue-rotate(88deg) brightness(94%) contrast(84%);
}
#customer_header #header .box_header > .title a:hover img { opacity: .7; }

@container header (calc(960 / 16 * 1em) <= inline-size) {
	#customer_header #header .box_header > .title a { grid-template-columns: auto auto; }
}
@container header (inline-size < calc(960 / 16 * 1em)) {
	#customer_header #header .box_header > .title { --fsz: 10; }
	#customer_header #header .box_header > .title a { --gap: 16; grid-template-rows: auto auto; }
	#customer_header #header .box_header > .title a .logo { max-width: calc(140 / var(--fsz) * 1em); }
}

/* MENUボタン */
#customer_header #header .box_header > .btn_menu { margin-left: auto; width: fit-content; }
#customer_header #header .box_header > .btn_menu a {
	--line-size: 1;
	display: grid; column-gap: calc(10 / var(--base) * 1em); grid-template-columns: min-content min-content; align-items: center;
	padding-block: calc(15 / var(--base) * 1em); text-decoration: none; transition: .15s;
}
#customer_header #header .box_header > .btn_menu a .ico {
	display: flex; align-items: center;
	width: calc(52 / var(--base) * 1em); height: calc(17 / var(--base) * 1em);
	border-block: calc(var(--line-size) / var(--base) * 1em) solid currentColor;
}
#customer_header #header .box_header > .btn_menu a .ico::before { display: block; width: 100%; height: calc(var(--line-size) / var(--base) * 1em); background: currentColor; content: ""; }
#customer_header #header .box_header > .btn_menu a .txt { line-height: 1; }
#customer_header #header .box_header > .btn_menu a .txt [data-text] { --fsz: 15; font-size: calc(var(--fsz) / var(--base) * 1em); font-family: "EB Garamond", serif; white-space: nowrap; }
#customer_header #header .box_header > .btn_menu a:active .ico { transform: scale(.9); transition: 0s; }

/* 宿泊予約ボタン：SPでは予約番の操作を妨げないよう非表示（メニュー内のボタンを利用） */
@container header (inline-size < calc(960 / 16 * 1em)) {
	#customer_header #header .box_header > .btn_reservation { display: none; }
}


/* ---------------------------------------------------
	Menu（JSなしで動作するよう :target で開閉）
------------------------------------------------------ */
#customer_header .box_nav {
	container: menu / inline-size;
	display: flex; flex-direction: column;
	position: fixed; top: 0; right: 0; left: 0; bottom: 0; z-index: 8;
	width: 100%; overflow-y: auto; overscroll-behavior: contain;
	transform: translateY(-100%);
}
#customer_header .box_nav[data-display=hide] { display: flex; visibility: hidden; }
#customer_header .box_nav:target { visibility: visible; transform: translateY(0); transition: transform .5s, visibility 0s; }
#customer_header:target .box_nav {  transition: none; }

@media (prefers-reduced-motion: reduce) {
	#customer_header .box_nav:target,
	#customer_header:target .box_nav { transition: none; }
}

#customer_header .box_nav .box_nav_inner { position: relative; background: #f3f1ea; }
@container header (calc(960 / 16 * 1em) <= inline-size) {
	#customer_header .box_nav .box_nav_inner { padding-block: calc(110 / var(--base) * 1em) calc(130 / var(--base) * 1em); }
}
@container header (inline-size < calc(960 / 16 * 1em)) {
	#customer_header .box_nav .box_nav_inner { padding-block: calc(76 / var(--base) * 1em) calc(60 / var(--base) * 1em); }
}

#customer_header .box_nav .box_nav_inner .box_menu_contents {
	display: grid; align-items: center; margin-inline: auto;
	max-width: calc(1466.6666666667 / var(--base) * 1em); width: 90%;
}
#customer_header .box_nav .box_nav_inner .box_menu_contents .box_site_info { order: 1; }
#customer_header .box_nav .box_nav_inner .box_menu_contents .box_site_info .box_info .title .txt { text-align: center; }
#customer_header .box_nav .box_nav_inner .box_menu_contents .box_site_info .box_info .txt_tel,
#customer_header .box_nav .box_nav_inner .box_menu_contents .box_site_info .box_info .txt_address,
#customer_header .box_nav .box_nav_inner .box_menu_contents .box_site_info .box_info .box_links { display: none; }
#customer_header .box_nav .box_nav_inner .box_menu_contents .box_site_info .box_related_links .box_social { margin-inline: auto; }
#customer_header .box_nav .box_nav_inner .box_menu_contents .box_site_info .box_related_links .box_social + p { display: none; }
#customer_header .box_nav .box_nav_inner .box_menu_contents .box_page_list { order: 3; }
#customer_header .box_nav .box_nav_inner .box_menu_contents::before {
	order: 2; align-self: stretch; width: 100%;
	border: calc(.5 / var(--base) * 1em) solid #bebcbc; content: "";
}

@container menu (calc(1280 / 16 * 1em) <= inline-size) {
	#customer_header .box_nav .box_nav_inner .box_menu_contents {
		grid-template-columns: calc(310 / var(--base) * 1em) calc(1 / var(--base) * 1em) minmax(calc(540 / var(--base) * 1em), 1fr);
		gap: calc(80 / var(--base) * 1em);
	}
}
@container menu (calc(640 / 16 * 1em) <= inline-size < calc(1280 / 16 * 1em)) {
	#customer_header .box_nav .box_nav_inner .box_menu_contents { gap: calc(60 / var(--base) * 1em); }
}
@container menu (inline-size < calc(1280 / 16 * 1em)) {
	#customer_header .box_nav .box_nav_inner .box_menu_contents { grid-template-rows: auto calc(1 / var(--base) * 1em) auto; justify-items: center; }
	#customer_header .box_nav .box_nav_inner .box_menu_contents .box_site_info .box_related_links .box_social { display: none; }
}
@container menu (inline-size < calc(960 / 16 * 1em)) {
	#customer_header .box_nav .box_nav_inner { padding-block: calc(76 / var(--base) * 1em) calc(60 / var(--base) * 1em); }
	#customer_header .box_nav .box_nav_inner .box_menu_contents { grid-template-rows: auto auto; gap: calc(60 / var(--base) * 1em); }
	#customer_header .box_nav .box_nav_inner .box_menu_contents::before { display: none; }
}

/* CLOSEボタン */
#customer_header .box_nav .box_nav_inner .btn_menu {
	--margin-top: 40; --margin-right: 50;
	position: absolute; top: 0; right: 0;
	margin-top: calc(var(--margin-top) / var(--base) * 1em); margin-right: calc(var(--margin-right) / var(--base) * 1em);
}
@container menu (inline-size < calc(640 / 16 * 1em)) {
	#customer_header .box_nav .box_nav_inner .btn_menu { --margin-right: 20; }
}
#customer_header .box_nav .box_nav_inner .btn_menu a {
	--line-size: 1;
	display: grid; column-gap: calc(10 / var(--base) * 1em); grid-template-columns: min-content min-content; align-items: center;
	text-decoration: none; color: #696357; transition: .15s;
}
#customer_header .box_nav .box_nav_inner .btn_menu a .ico { position: relative; width: calc(50 / var(--base) * 1em); height: calc(20 / var(--base) * 1em); }
#customer_header .box_nav .box_nav_inner .btn_menu a .ico::before,
#customer_header .box_nav .box_nav_inner .btn_menu a .ico::after {
	display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;
	width: 100%; height: calc(var(--line-size) / var(--base) * 1em); background: currentColor; content: "";
}
#customer_header .box_nav .box_nav_inner .btn_menu a .ico::before { transform: rotate(-20deg); }
#customer_header .box_nav .box_nav_inner .btn_menu a .ico::after { transform: rotate(20deg); }
#customer_header .box_nav .box_nav_inner .btn_menu a [data-text] { --fsz: 15; font-size: calc(var(--fsz) / var(--base) * 1em); font-family: "EB Garamond", serif; white-space: nowrap; }
#customer_header .box_nav .box_nav_inner .btn_menu a:active .ico { transform: scale(.9); transition: 0s; }


/* ---------------------------------------------------
	Site info（メニュー・フッター共通）
------------------------------------------------------ */
#customer_header .box_site_info,
#customer_footer .box_site_info { container: box_site_info / inline-size; min-width: calc(310 / var(--base) * 1em); }

#customer_header .box_site_info .box_info,
#customer_footer .box_site_info .box_info { margin-bottom: calc(26 / var(--base) * 1em); }
#customer_header .box_site_info .box_info .title,
#customer_footer .box_site_info .box_info .title { margin-bottom: calc(26 / var(--base) * 1em); }
#customer_header .box_site_info .box_info .title a,
#customer_footer .box_site_info .box_info .title a { display: inline-grid; gap: calc(16 / var(--base) * 1em); width: fit-content; text-decoration: none; }
#customer_header .box_site_info .box_info .title a .txt,
#customer_footer .box_site_info .box_info .title a .txt { --fsz: 13; order: 2; line-height: 1; font-size: calc(var(--fsz) / var(--base) * 1em); }
#customer_header .box_site_info .box_info .title a .logo,
#customer_footer .box_site_info .box_info .title a .logo { order: 1; }
#customer_header .box_site_info .box_info .title a .logo img,
#customer_footer .box_site_info .box_info .title a .logo img {
	filter: brightness(0) saturate(100%) invert(37%) sepia(1%) saturate(3622%) hue-rotate(2deg) brightness(102%) contrast(92%);
}
#customer_header .box_site_info .box_info .title a:hover img,
#customer_footer .box_site_info .box_info .title a:hover img { opacity: .7; }

#customer_footer .box_site_info .box_info .txt_tel { --fsz: 14; line-height: 1.6; font-size: calc(var(--fsz) / var(--base) * 1em); }
#customer_footer .box_site_info .box_info .txt_tel a { text-decoration: none; }
#customer_footer .box_site_info .box_info .txt_tel small { font-size: calc(11 / var(--fsz) * 1em); }
#customer_footer .box_site_info .box_info .txt_address { --fsz: 14; line-height: 1.6; margin-bottom: calc(26 / var(--fsz) * 1em); font-size: calc(var(--fsz) / var(--base) * 1em); }

#customer_footer .box_site_info .box_info .box_links { display: flex; column-gap: calc(40 / var(--base) * 1em); margin-bottom: calc(26 / var(--base) * 1em); }
#customer_footer .box_site_info .box_info .box_links p a {
	--fsz: 11; display: inline-grid; grid-template-columns: auto auto; align-items: center;
	gap: calc(10 / var(--fsz) * 1em); font-size: calc(var(--fsz) / var(--base) * 1em); text-decoration: none;
}
#customer_footer .box_site_info .box_info .box_links p a .ico_arrow-right { width: calc(14 / var(--fsz) * 1em); height: 1em; }

#customer_header .box_site_info .box_related_links,
#customer_footer .box_site_info .box_related_links { margin-bottom: calc(38.4 / var(--base) * 1em); }
#customer_header .box_site_info .box_related_links .box_social,
#customer_footer .box_site_info .box_related_links .box_social {
	display: inline-flex; gap: calc(30 / var(--base) * 1em); margin-bottom: calc(26 / var(--base) * 1em);
	padding-block: calc(5 / var(--base) * 1em); width: fit-content;
}
#customer_footer .box_site_info .box_related_links p a {
	--fsz: 13; display: inline-grid; grid-template-columns: auto auto; align-items: center;
	gap: calc(15 / var(--fsz) * 1em); line-height: 1; font-size: calc(var(--fsz) / var(--base) * 1em);
	font-family: "EB Garamond", serif; text-decoration: none;
}
#customer_footer .box_site_info .box_related_links p a [class*=ico_] { width: calc(8 / var(--base) * 1em); aspect-ratio: 1; }

#customer_header .box_site_info .btn_reservation a,
#customer_footer .box_site_info .btn_reservation a { padding-block: calc(16 / var(--base) * 1em); }

@container footer (inline-size < calc(1280 / 16 * 1em)) {
	#customer_footer .box_site_info { text-align: center; }
}


/* ---------------------------------------------------
	Page list（メニュー・フッター共通）
------------------------------------------------------ */
#customer_header .box_page_list,
#customer_footer .box_page_list { container: box_page_list / inline-size; width: 100%; }

#customer_header .box_page_list ul,
#customer_footer .box_page_list ul { display: grid; gap: calc(34 / var(--base) * 1em); margin-inline: auto; max-width: calc(630 / var(--base) * 1em); }

@container box_page_list (calc(640 / 16 * 1em) <= inline-size) {
	#customer_header .box_page_list ul,
	#customer_footer .box_page_list ul { grid-template-columns: max-content max-content; justify-content: space-between; }
}
@container footer (calc(1280 / 16 * 1em) <= inline-size) {
	#customer_footer .box_page_list ul { padding-block: calc(43 / var(--base) * 1em); }
}

#customer_header .box_page_list ul li a,
#customer_footer .box_page_list ul li a {
	display: inline-grid; grid-template-columns: auto auto 1fr; align-items: center; align-content: center;
	gap: calc(10 / var(--base) * 1em); width: 100%; text-decoration: none; transition: .15s;
}
#customer_header .box_page_list ul li a .txt,
#customer_footer .box_page_list ul li a .txt {
	--fsz: 11; order: 2; line-height: 1; font-size: calc(var(--fsz) / var(--base) * 1em);
	font-family: "Noto Sans JP", sans-serif; font-weight: 300;
}
#customer_header .box_page_list ul li a .txt_deco,
#customer_footer .box_page_list ul li a .txt_deco {
	--fsz: 24; order: 1; line-height: 1; letter-spacing: .03em;
	font-family: "Quattrocento", serif; font-size: calc(var(--fsz) / var(--base) * 1em); font-weight: 700; color: #696357;
}
#customer_header .box_page_list ul li a .ico_arrow-right,
#customer_footer .box_page_list ul li a .ico_arrow-right { order: 3; width: calc(12 / var(--base) * 1em); height: 1em; transition: inherit; }
#customer_header .box_page_list ul li a:hover .ico_arrow-right,
#customer_footer .box_page_list ul li a:hover .ico_arrow-right { transform: translateX(.5em); }


/* ---------------------------------------------------
	Page title
------------------------------------------------------ */
#customer_header .box_fv_lower { container: fv / inline-size; isolation: isolate; margin-bottom: calc(57.56 / var(--base) * 1em); }
#customer_header .box_fv_lower .box_fv_lower_inner { display: grid; position: relative; }
#customer_header .box_fv_lower .box_fv_lower_inner::before {
	position: absolute; top: 0; left: 0; right: 0; z-index: -1;
	height: calc(337 / var(--base) * 1em); content: "";
}
#customer_header .box_fv_lower .box_fv_lower_inner .title_page { display: grid; order: 2; text-align: center; font-weight: 400; }
#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt { order: 2; margin-top: calc(var(--margin-top) / var(--fsz) * 1em); color: #696357; }
#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt_deco {
	order: 1; margin-inline: auto; width: fit-content;
	text-transform: uppercase; letter-spacing: .03em; line-height: 1.5; font-family: "EB Garamond", serif;
}
#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt_deco [data-text] {
	display: block;
	background: #8aa892 url("../img/bg_txt.avif") center / 100% 100% repeat;
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent; color: transparent;
}
#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt_deco::before {
	display: block; margin-inline: auto;
	margin-bottom: calc(var(--margin-bottom) / var(--fsz) * 1em); width: calc(var(--width) / var(--fsz) * 1em);
	aspect-ratio: 477 / 77; background: url("../img/deco_sketch_1.svg") center / contain no-repeat; content: "";
}
#customer_header .box_fv_lower .box_fv_lower_inner:not(:has(.img)) { padding-top: calc(var(--padding-top) / var(--base) * 1em); }

@container fv (calc(640 / 16 * 1em) <= inline-size) {
	#customer_header .box_fv_lower .box_fv_lower_inner::before { background: url("../img/bg_top.avif") top center / 100% auto no-repeat; }
}
@container fv (inline-size < calc(640 / 16 * 1em)) {
	#customer_header .box_fv_lower .box_fv_lower_inner::before { background: url("../img/bg_top-sp.avif") top center / 100% 100% no-repeat; }
}
@container fv (calc(960 / 16 * 1em) <= inline-size) {
	#customer_header .box_fv_lower .box_fv_lower_inner:not(:has(.img)) { --padding-top: 140; }
	#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt {
		--fsz: 20; --margin-top: calc(20 - 35);
		font-size: clamp(16 / var(--base) * 1em, 16 / var(--base) * 1em + calc(var(--fsz) - 16) / 540 * (var(--cqi-to-px) - 960 / 100) * 100 / var(--base) * 1em, var(--fsz) / var(--base) * 1em);
	}
	#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt_deco {
		--fsz: 100;
		font-size: clamp(70 / var(--base) * 1em, 70 / var(--base) * 1em + calc(var(--fsz) - 70) / 540 * (var(--cqi-to-px) - 960 / 100) * 100 / var(--base) * 1em, var(--fsz) / var(--base) * 1em);
	}
	#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt_deco::before { --margin-bottom: calc(20 - 35); --width: 477; }
}
@container fv (inline-size < calc(960 / 16 * 1em)) {
	#customer_header .box_fv_lower .box_fv_lower_inner:not(:has(.img)) { --padding-top: 124; }
	#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt {
		--fsz: 16; --margin-top: calc(8 - 15.6);
		font-size: clamp(calc(var(--fsz) / 428 * 320) / var(--base) * 1em, calc(var(--fsz) / 428 * 320) / var(--base) * 1em + calc(var(--fsz) / 428 * 767 - var(--fsz) / 428 * 320) / 640 * (var(--cqi-to-px) - 320 / 100) * 100 / var(--base) * 1em, calc(var(--fsz) / 428 * 767) / var(--base) * 1em);
	}
	#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt_deco {
		--fsz: 48;
		font-size: clamp(calc(var(--fsz) / 428 * 320) / var(--base) * 1em, calc(var(--fsz) / 428 * 320) / var(--base) * 1em + calc(var(--fsz) / 428 * 767 - var(--fsz) / 428 * 320) / 640 * (var(--cqi-to-px) - 320 / 100) * 100 / var(--base) * 1em, calc(var(--fsz) / 428 * 767) / var(--base) * 1em);
	}
	#customer_header .box_fv_lower .box_fv_lower_inner .title_page .txt_deco::before { --margin-bottom: calc(8 - 15.6); --width: 238; }
}


/* ---------------------------------------------------
	Breadcrumb
------------------------------------------------------ */
#customer_header .abi-container-breadcrumbs {
	container: breadcrumb / inline-size;
	margin-inline: auto; margin-bottom: calc(40 / var(--base) * 1em);
	max-width: calc(1260 / 14 * 1em); width: 90%;
}
#customer_header .abi-container-breadcrumbs .c-breadcrumb__heading,
#customer_header .abi-container-breadcrumbs .c-breadcrumb__label {
	position: absolute !important; clip: rect(1px, 1px, 1px, 1px);
	padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden;
}
#customer_header .abi-container-breadcrumbs .c-breadcrumb__scrollbox {
	--mask-padding: calc(20 / var(--base) * 1em);
	display: flex; align-items: flex-start; justify-content: flex-start;
	margin-inline: calc(var(--mask-padding) * -1); padding-inline: var(--mask-padding);
	overflow-x: auto; overscroll-behavior: none; scrollbar-width: none; -ms-overflow-style: none;
	-webkit-mask-image: linear-gradient(to right, transparent 0%, #000 var(--mask-padding), #000 calc(100% - var(--mask-padding)), transparent 100%);
	mask-image: linear-gradient(to right, transparent 0%, #000 var(--mask-padding), #000 calc(100% - var(--mask-padding)), transparent 100%);
}
#customer_header .abi-container-breadcrumbs .c-breadcrumb__scrollbox::-webkit-scrollbar { display: none; }
#customer_header .abi-container-breadcrumbs .c-breadcrumb__scrollbox > * { flex-shrink: 0; }
#customer_header .abi-container-breadcrumbs .c-breadcrumb__list {
	display: flex; gap: calc(10 / var(--base) * 1em); justify-content: flex-end;
	margin-left: auto; max-width: 100%; min-width: max-content;
}
#customer_header .abi-container-breadcrumbs .c-breadcrumb__list .c-breadcrumb__item {
	--fsz: 13; flex-shrink: 0; display: flex; align-items: center;
	gap: calc(10 / var(--fsz) * 1em); height: calc(20 / var(--fsz) * 1em); font-size: calc(var(--fsz) / var(--base) * 1em);
}
#customer_header .abi-container-breadcrumbs .c-breadcrumb__list .c-breadcrumb__link,
#customer_header .abi-container-breadcrumbs .c-breadcrumb__list .c-breadcrumb__current {
	display: flex; gap: calc(10 / var(--fsz) * 1em); align-items: center; text-decoration: none; font-weight: 400; color: #d8d1c4;
}
#customer_header .abi-container-breadcrumbs .c-breadcrumb__list .c-breadcrumb__current[aria-current=page] { color: #696357; pointer-events: none; }
#customer_header .abi-container-breadcrumbs .c-breadcrumb__list .c-breadcrumb__deco { --fsz-en: 15; font-family: "EB Garamond", serif; font-size: calc(var(--fsz-en) / var(--fsz) * 1em); letter-spacing: .03em; }
#customer_header .abi-container-breadcrumbs .c-breadcrumb__list .c-breadcrumb__separator { display: block; width: calc(9 / var(--fsz) * 1em); aspect-ratio: 9 / 4; color: #d8d1c4; }

@container breadcrumb (inline-size < calc(960 / 16 * 1em)) {
	#customer_header .abi-container-breadcrumbs .c-breadcrumb__list .c-breadcrumb__item { --fsz: 11; }
	#customer_header .abi-container-breadcrumbs .c-breadcrumb__list .c-breadcrumb__deco { --fsz-en: 11; }
}


/* ===================================================
	Footer
====================================================== */
#customer_footer #footer { container: footer / inline-size; position: relative; isolation: isolate; }

#customer_footer #footer .box_footer { display: grid; grid-template-columns: 100%; grid-template-rows: auto auto; gap: 0; grid-auto-flow: row; }

/* スローガン */
#customer_footer #footer .box_footer .box_slogan { grid-area: footer_top; margin-top: calc(160 / var(--base) * 1em); }
#customer_footer #footer .box_footer .box_slogan .txt_slogan { position: relative; text-align: center; font-weight: 400; }
#customer_footer #footer .box_footer .box_slogan .txt_slogan .txt {
	position: relative; display: block; margin-inline: auto; width: fit-content;
	text-transform: uppercase; letter-spacing: .03em; line-height: .8; font-family: "EB Garamond", serif;
}
#customer_footer #footer .box_footer .box_slogan .txt_slogan .txt [data-text] {
	display: block; margin-inline: auto; width: fit-content;
	background: #8aa892 center / cover no-repeat; -webkit-background-clip: text; background-clip: text; /* 色は画像が読めないときの代替 */
	-webkit-text-fill-color: transparent; color: transparent;
}
#customer_footer #footer .box_footer .box_slogan .txt_slogan .txt [data-text]::before { white-space: pre; }
#customer_footer #footer .box_footer .box_slogan .txt_slogan .txt::before {
	display: block; margin-inline: auto;
	margin-bottom: calc(var(--margin-bottom) / var(--fsz) * 1em); width: calc(var(--width) / var(--fsz) * 1em);
	aspect-ratio: 477 / 60; background: center / contain no-repeat; content: "";
}
#customer_footer #footer .box_footer .box_slogan .txt_slogan::before,
#customer_footer #footer .box_footer .box_slogan .txt_slogan::after {
	display: block; margin-top: calc(var(--margin-top) / var(--fsz) * 1em); width: 100%;
	aspect-ratio: var(--aspect-ratio); background: var(--bg-image) center / cover no-repeat; content: "";
}
#customer_footer #footer .box_footer .box_slogan .txt_slogan::before { position: absolute; bottom: 0; left: 0; right: 0; z-index: -2; }
#customer_footer #footer .box_footer .box_slogan .txt_slogan::after { position: relative; z-index: -1; transition: 2s 1s; }
#customer_footer #footer .box_footer .box_slogan .txt_slogan.lazyloaded .txt [data-text] { background-image: url("../img/bg_txt.avif"); }
#customer_footer #footer .box_footer .box_slogan .txt_slogan.lazyloaded .txt::before { background-image: url("../img/deco_sketch_2.svg"); }
#customer_footer #footer .box_footer .box_slogan .txt_slogan.lazyloaded::before { --bg-image: url("../img/bg_bottom_illust.avif"); }
#customer_footer #footer .box_footer .box_slogan .txt_slogan.lazyloaded::after { --bg-image: url("../img/bg_bottom_illust.avif"); }

/* 下部リンク（よくあるご質問／ご利用ルール／お問い合わせ） */
#customer_footer #footer .box_footer .box_bottom_links { display: grid; position: relative; border-block: calc(1 / var(--base) * 1em) solid #bebcbc; }
#customer_footer #footer .box_footer .box_bottom_links li a { display: grid; grid-template-columns: 1fr auto; height: 100%; text-decoration: none; transition: .15s; }
#customer_footer #footer .box_footer .box_bottom_links li a .ico_arrow-right {
	display: block; align-self: flex-end;
	width: calc(36 / var(--base) * 1em); height: calc(20 / var(--base) * 1em);
	border-radius: 999px; background: #696357; border: calc(1 / var(--base) * 1em) solid #696357; transition: inherit;
}
#customer_footer #footer .box_footer .box_bottom_links li a .ico_arrow-right::before { width: calc(18 / var(--base) * 1em); color: #fff; background-color: #fff; transition: inherit; }
#customer_footer #footer .box_footer .box_bottom_links li a:hover .ico_arrow-right { background: #fff; border-color: #c6c0b1; }
#customer_footer #footer .box_footer .box_bottom_links li a:hover .ico_arrow-right::before { background-color: #857d6e; }

/* 見出し（c-heading sm） */
#customer_footer .c-heading[data-size=sm] { margin-top: auto; }
#customer_footer .c-heading[data-size=sm] .c-heading__heading { container: c-heading-sm / inline-size; display: grid; }
#customer_footer .c-heading[data-size=sm] .c-heading__heading-text {
	--margin-block-start: 16; order: 2; margin-block-start: calc(var(--margin-block-start) / var(--fsz) * 1em);
	line-height: 1; font-size: calc(var(--fsz) / var(--base) * 1em);
	font-family: "Noto Sans JP", sans-serif; font-weight: 300; word-break: auto-phrase; overflow-wrap: anywhere;
}
#customer_footer .c-heading[data-size=sm] .c-heading__heading-deco {
	order: 1; line-height: .85; letter-spacing: .03em;
	font-family: "Quattrocento", serif; font-weight: 700; color: #696357;
}

@container c-heading-sm (calc(960 / 16 * 1em) <= inline-size) {
	#customer_footer .c-heading[data-size=sm] .c-heading__heading-text { --fsz: 13; }
	#customer_footer .c-heading[data-size=sm] .c-heading__heading-deco {
		--fsz: 36;
		font-size: clamp(30 / var(--base) * 1em, 30 / var(--base) * 1em + calc(var(--fsz) - 30) / 540 * (var(--cqi-to-px) - 960 / 100) * 100 / var(--base) * 1em, var(--fsz) / var(--base) * 1em);
	}
}
@container c-heading-sm (inline-size < calc(960 / 16 * 1em)) {
	#customer_footer .c-heading[data-size=sm] .c-heading__heading-text { --fsz: 15; }
	#customer_footer .c-heading[data-size=sm] .c-heading__heading-deco {
		--fsz: 30;
		font-size: clamp(calc(var(--fsz) / 428 * 320) / var(--base) * 1em, calc(var(--fsz) / 428 * 320) / var(--base) * 1em + calc(var(--fsz) - var(--fsz) / 428 * 320) / 108 * (var(--cqi-to-px) - 320 / 100) * 100 / var(--base) * 1em, var(--fsz) / var(--base) * 1em);
	}
}

/* フッター本体 */
#customer_footer #footer .box_footer .box_footer_inner { grid-area: footer_bottom; background: center top / cover no-repeat; }
#customer_footer #footer .box_footer .box_footer_inner.lazyloaded { background-image: url("../img/bg_footer.avif"); }
#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents {
	display: grid; margin-inline: auto; max-width: calc(1466.6666666667 / var(--base) * 1em); width: 90%;
}
#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents .box_site_info { order: 1; }
#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents .box_page_list { order: 3; }
#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents::before {
	order: 2; align-self: stretch; width: 100%;
	border: calc(.5 / var(--base) * 1em) solid #bebcbc; content: "";
}
#customer_footer #footer .box_footer .box_footer_inner .con_copyright .txt_copyright { padding-block: calc(80 / var(--base) * 1em) calc(50 / var(--base) * 1em); text-align: center; }
#customer_footer #footer .box_footer .box_footer_inner .con_copyright .txt_copyright small {
	--fsz: 10; line-height: 1; font-size: calc(var(--fsz) / var(--base) * 1em);
	font-weight: 500; font-family: "EB Garamond", serif; color: #696357;
}

/* PC */
@container footer (calc(960 / 16 * 1em) <= inline-size) {
	#customer_footer #footer .box_footer { grid-template-areas: "footer_top" "footer_bottom"; }
	#customer_footer #footer .box_footer .box_slogan .txt_slogan {
		--fsz: 120;
		font-size: clamp(70 / var(--base) * 1em, 70 / var(--base) * 1em + calc(var(--fsz) - 70) / 540 * (var(--cqi-to-px) - 960 / 100) * 100 / var(--base) * 1em, var(--fsz) / var(--base) * 1em);
	}
	#customer_footer #footer .box_footer .box_slogan .txt_slogan .txt::before { --margin-bottom: 26.7; --width: 477; }
	#customer_footer #footer .box_footer .box_slogan .txt_slogan::before,
	#customer_footer #footer .box_footer .box_slogan .txt_slogan::after { --margin-top: -50; --aspect-ratio: 1440 / 560; }

	#customer_footer #footer .box_footer .box_bottom_links { grid-area: footer_top; align-self: flex-end; aspect-ratio: 1440 / 260; grid-template-columns: repeat(3, 1fr); }
	#customer_footer #footer .box_footer .box_bottom_links li a {
		padding-block: clamp(25 / var(--base) * 1em, 25 / var(--base) * 1em + 25 / 480 * (var(--cqi-to-px) - 960 / 100) * 100 / var(--base) * 1em, 50 / var(--base) * 1em);
		padding-inline: clamp(30 / var(--base) * 1em, 30 / var(--base) * 1em + 30 / 480 * (var(--cqi-to-px) - 960 / 100) * 100 / var(--base) * 1em, 60 / var(--base) * 1em);
	}
	#customer_footer #footer .box_footer .box_bottom_links li + li { border-left: calc(1 / var(--base) * 1em) solid #bebcbc; }
}
/* PC（1280px以上）：サイト情報｜区切り線｜ページ一覧 の3カラム */
@container footer (calc(1280 / 16 * 1em) <= inline-size) {
	#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents {
		grid-template-columns: clamp(310 / var(--base) * 1em, 28.1818181818%, 413.3333333333 / var(--base) * 1em) calc(1 / var(--base) * 1em) minmax(calc(540 / var(--base) * 1em), 1fr);
		gap: calc(80 / var(--base) * 1em); padding-top: calc(119 / var(--base) * 1em);
	}
}
/* タブレット */
@container footer (calc(960 / 16 * 1em) <= inline-size < calc(1280 / 16 * 1em)) {
	#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents { grid-template-rows: auto calc(1 / var(--base) * 1em) auto; gap: calc(60 / var(--base) * 1em); }
}
@container footer (inline-size < calc(1280 / 16 * 1em)) {
	#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents { justify-items: center; padding-top: calc(70 / var(--base) * 1em); }
}
/* SP */
@container footer (inline-size < calc(960 / 16 * 1em)) {
	#customer_footer #footer .box_footer { grid-template-areas: "footer_top" "footer_middle" "footer_bottom"; }
	#customer_footer #footer .box_footer .box_slogan .txt_slogan {
		--fsz: 51;
		font-size: clamp(calc(var(--fsz) / 428 * 320) / var(--base) * 1em, calc(var(--fsz) / 428 * 320) / var(--base) * 1em + calc(var(--fsz) / 428 * 767 - var(--fsz) / 428 * 320) / 640 * (var(--cqi-to-px) - 320 / 100) * 100 / var(--base) * 1em, calc(var(--fsz) / 428 * 767) / var(--base) * 1em);
	}
	#customer_footer #footer .box_footer .box_slogan .txt_slogan .txt::before { --margin-bottom: 18.74; --width: 238; }
	#customer_footer #footer .box_footer .box_slogan .txt_slogan::before,
	#customer_footer #footer .box_footer .box_slogan .txt_slogan::after { --margin-top: -17.55; --aspect-ratio: 428 / 220; }

	#customer_footer #footer .box_footer .box_bottom_links { grid-area: footer_middle; }
	#customer_footer #footer .box_footer .box_bottom_links li a {
		padding-block: clamp(35.8878504673 / var(--base) * 1em, 35.8878504673 / var(--base) * 1em + 50.1308411215 / 320 * (var(--cqi-to-px) - 640 / 100) * 100 / var(--base) * 1em, 86.0186915888 / var(--base) * 1em);
		padding-inline: clamp(25.4205607477 / var(--base) * 1em, 25.4205607477 / var(--base) * 1em + 35.5093457944 / 320 * (var(--cqi-to-px) - 640 / 100) * 100 / var(--base) * 1em, 60.9299065421 / var(--base) * 1em);
	}
	#customer_footer #footer .box_footer .box_bottom_links li + li { border-top: calc(1 / var(--base) * 1em) solid #bebcbc; }

	#customer_footer #footer .box_footer .box_footer_inner { padding-bottom: calc(35 / var(--base) * 1em); }
	#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents .box_page_list,
	#customer_footer #footer .box_footer .box_footer_inner .box_footer_contents::before { display: none; }
}