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

:root {
	--color01: #f8f4ea;
	--color02: #968660;
	--color03: #394869;
	--color04: #313f60;
	--txt_color01: #413f39;
	--hdheight: 70px;
}

/* eb-garamond-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/eb-garamond-v32-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

body {
	min-width: 1200px; min-height: 100vh; background: var(--color01); color: var(--txt_color01);
	font-size: 17px; font-weight: normal; line-height: 1.5;
	font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Times New Roman", "MS PMincho", serif;
	-webkit-text-size-adjust: 100%; position: relative;
	letter-spacing: 0.05em; -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}

.font_en { font-family: 'EB Garamond'; }
.v_rl{ -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }
.v_rl .num { text-combine-upright: all; letter-spacing: 0; }

input,
select,
textarea { font-size: 16px; }

*, *::before, *::after { box-sizing: border-box; }

a { color: var(--txt_color01); text-decoration: none; transition: opacity .5s; }

@media screen and (hover: hover) {
	a:hover { color: var(--txt_color01); opacity: .7; }
}

#lineup-font-size-sampler { bottom: 0; left: 0;}
.fixed { width: 100%; min-width: 1100px; position: fixed; top:0; left: 0; z-index: 999;}
.pos_fix { overflow: hidden; }

.ofi { object-fit: cover; width: 100%; height: 100%;}
.view_sp { display: none;}

@media screen and (min-width: 601px) {
}
@media screen and (max-width: 600px) {
	:root {
		--hdheight: 60px;
	}
	body { font-size: 15px;}
	input,
	select,
	textarea { font-size: 16px;}

	body { min-width: 0;}
	.v_rl.sp { -ms-writing-mode: inherit; writing-mode: inherit; }
	.view_sp { display: block;}
	.view_pc { display: none !important;}
}


/* ---------------------------------------------------
	Base Layout
------------------------------------------------------ */
.inner_lg { width: min(1400px, 96%); margin: 0 auto;}
.inner_md { width: min(1200px, 92%); margin: 0 auto;}
.inner_sm { width: min(1000px, 88%); margin: 0 auto;}

.lang_list { position: relative; align-content: center; }
.lang_list dt { cursor: pointer; padding: 5px 5px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #afada9; }
.lang_list dt::after { content: ''; background: url(../img/arrow01_bk.svg) no-repeat center/contain; width: 9px; height: 5px; display: block; margin-left: 15px; }
.lang_list dd { display: none; position: absolute; width: 100%; font-size: 15px; text-align: center; background: var(--color01); }
.lang_list dd ul li { border-bottom: 1px solid #ece8df;}
.lang_list dd ul li a { display: block; padding: 10px; }

@media screen and (max-width: 600px) {
	.inner_lg { width: 100%; }
	.inner_md,
	.inner_sm { width: 88%; }

	.lang_list dt { padding: 5px 5px; }
	.lang_list dt::after { margin-left: 10px; }
	.lang_list dd { font-size: 13px; }
	.lang_list dd ul li a { padding: 8px 10px; }
}

/* ---------------------------------------------------
	Header
------------------------------------------------------ */
#g_header { padding: 0 0 0 25px; background: transparent; position: absolute; width: 100%; min-width: 1200px; z-index: 999; }
#g_header a { color: #fff; }
#g_header .hd_inner{ display: flex; justify-content: space-between; }
#g_header .hd_tit { align-content: center; }
#g_header .hd_tit .hd_logo { display: block; width: 180px; position: relative; }
#g_header .hd_tit .hd_logo .bk { opacity: 0; }
#g_header .hd_tit .hd_logo .wh { opacity: 1; position: absolute; inset: 0; }

#g_header .hd_nav { margin: 0 0 0 auto; display: flex; align-items: center; justify-content: center; gap: 40px; }
#g_header .hd_nav li a { position: relative; padding: 5px 0; }
#g_header .hd_nav li a::after { content: ''; width: 100%; height: 1px; background: currentColor; position: absolute; bottom: 0; left: 0; opacity: .7; transform: scale(0); transform-origin: left center; transition: transform .5s; }

#g_header .hd_lang { color: #fff; margin: 0 30px 0 50px; }
#g_header .hd_lang dt { border-color: rgba(255,255,255,0.6); }
#g_header .hd_lang dt::after { background-image: url(../img/arrow01_wh.svg); }
#g_header .hd_lang dd { background: rgba(255,255,255,0.2); }
#g_header .hd_lang dd ul li { border-color: rgba(255,255,255,0.4); }

#g_header .open_menu { width: 80px; background: #ddd8cb; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; transition: gap .5s, opacity .5s; z-index: 10; }
#g_header .open_menu .bar { font-size: 0; letter-spacing: 0; line-height: 0; background: #4f4f4f; width: 30px; height: 1px; transition: transform .5s; }

.pos_fix #g_header .open_menu { gap: 0!important; }
.pos_fix #g_header .open_menu .bar:nth-child(1) { transform: rotate(45deg); }
.pos_fix #g_header .open_menu .bar:nth-child(2) { transform: rotate(-45deg); }

@keyframes h-top {
	0% { position: fixed; transform: translateY(0); }
	80% { transform: translateY(-100%); }
}
@keyframes h-fixed {
	0% { transform: translateY(-100%); }
	100% { transform: translateY(0); }
}

@media screen and (hover: hover) {
	#g_header .hd_nav li a:hover { opacity: 1; }
	#g_header .hd_nav li a:hover::after { transform: scale(1); }
	#g_header .hd_rsv:hover,
	#g_header .open_menu:hover { opacity: .9; }
}
@media screen and (min-width: 601px) {
	#g_header .sp_menu { display: contents; }
	#g_header .hd_rsv { width: min(10%, 150px); height: var(--hdheight); align-content: center; text-align: center; display: block; background: var(--color02 ); }

	#g_header.fixed { animation: h-fixed 1s; }
	#g_header.top { animation: h-top 1s; left: 0 !important; transition: left 0s 0.5s, background 0s 0.7s; left: 0!important; }
	#g_header.fixed { background: var(--color01); }
	#g_header.fixed .hd_nav li a { color: var(--txt_color01); }
	#g_header.fixed .hd_tit .hd_logo .bk { opacity: 1; }
	#g_header.fixed .hd_tit .hd_logo .wh { opacity: 0; }
	#g_header.fixed .hd_lang { color: var(--txt_color01);}
	#g_header.fixed .hd_lang dt { border-color: #afada9; }
	#g_header.fixed .hd_lang dt::after { background-image: url(../img/arrow01_bk.svg);}
	#g_header.fixed .hd_lang dd { background: var(--color01); }
	#g_header.fixed .hd_lang dd ul li { border-color: #ece8df;}
	#g_header.fixed .hd_lang dd ul li a { color: var(--txt_color01); }

}
@media screen and (max-width: 1420px) {
	#g_header .hd_tit .hd_logo { width: 150px; }
	#g_header { font-size: 16px; }
	#g_header .hd_nav { gap: 25px; }
	#g_header .hd_lang { margin: 0 20px 0 35px; }
}
@media screen and (max-width: 600px) {
	#g_header { padding: 10px 4%; display: block; min-width: auto; }
	#g_header .hd_inner { display: contents; }
	#g_header .hd_tit .hd_logo { width: min(35vw, 150px); }
	#g_header .open_menu { width: 70px; }

	#g_header .sp_menu { position: fixed; bottom: 0; left: 0; z-index: 999; display: flex; width: 100%; padding-bottom: env(safe-area-inset-bottom); background: var(--color01); }
	#g_header .sp_menu a { align-content: center; text-align: center; flex: 1; color: var(--txt_color01); background: #ddd8cb; border-right: 1px solid #8a7b5a55; height: var(--hdheight); }
	#g_header .sp_menu .hd_rsv { flex: 2.5; width: 48%; background: var(--color02); color: #fff; }
	#g_header .sp_menu .icon_btn { font-size: 12px; letter-spacing: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; }
	#g_header .sp_menu .icon_btn .icon { width: 18px; height: 18px; }
	#g_header .sp_menu .icon_btn .icon img { object-fit: contain; height: 100%; }
	#g_header .sp_menu .open_menu { border-right: none; gap: 8px; }
	#g_header .sp_menu .open_menu .bar { width: 40%; }
}


/* ---------------------------------------------------
	G-nav
------------------------------------------------------ */
#gnav_wrap {
	width: 100%; height: 100%; position: fixed; top: 0; left: 0;
	background: rgba(0, 0, 0, 0.6);
	transition: 0.75s; pointer-events: none; opacity: 0; z-index: 10;
}
#gnav_wrap.active { pointer-events: auto; opacity: 1; }

#gnav { width: min(725px, 100%); height: 100%; overflow-y: auto; padding: 120px 150px 85px; background: var(--color01); margin-left: auto; }
#gnav a { color: var(--txt_color01); }
#gnav .gnav_lang { position: absolute; top: 0; right: 90px; height: var(--hdheight); }
#gnav .open_menu{ position: fixed; top: 0; right: 0; height: var(--hdheight); }
#gnav .gnav_lang dd ul li a { color: var(--txt_color01); }
#gnav .gnav_logo { display: block; margin: 0 auto 55px; width: 234px; }
#gnav .gnav_nav { column-count: 2; margin-bottom: 15px; }
#gnav .gnav_nav li { display: inline-block; width: 100%; margin: 0 0 40px; break-inside: avoid; }
#gnav .gnav_nav li a { color: var(--txt_color01);}
#gnav .gnav_rsv li a { display: block; text-align: center; align-content: center; }
#gnav .gnav_rsv li:nth-child(1) a { color: #fff; background: var(--color02); height: 60px; }
#gnav .gnav_rsv li:nth-child(2) a { border: 1px solid var(--color02); color: var(--color02); height: 40px; }
#gnav .gnav_rsv li + li { margin-top: 15px;}
#gnav .gnav_tel { margin-top: 25px; }
#gnav .gnav_tel .tel-link { font-size: 23px; }
#gnav .gnav_tel .tel-link span { font-size: 27px; }
#gnav .gnav_tel .txt { font-size: 14px; }
#gnav .gnav_sns { margin-top: 40px; display: flex; justify-content: center; align-items: center; gap: 25px; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
}
@media screen and (max-width: 600px) {
	#gnav_wrap { height: 100dvh; }
	#gnav { padding: 0; margin: 0 auto; padding: 100px 6% calc(40px + var(--hdheight)); }
	#gnav .gnav_lang { right: 6vw; }
	#gnav .gnav_logo { margin: 0 auto 45px; width: min(75%, 234px); }
	#gnav .gnav_nav { margin-bottom: 10px; }
	#gnav .gnav_nav li { margin: 0 0 25px; }
	#gnav .gnav_rsv li:nth-child(1) a { height: 55px; }
	#gnav .gnav_rsv li:nth-child(2) a { height: 40px; }
	#gnav .gnav_rsv li + li { margin-top: 10px;}
	#gnav .gnav_tel { margin-top: 15px; text-align: center; }
	#gnav .gnav_tel .tel-link { font-size: 20px; }
	#gnav .gnav_tel .tel-link span { font-size: 28px; }
	#gnav .gnav_tel .txt { font-size: 14px; display: block; }
	#gnav .gnav_sns { margin-top: 25px; gap: 15px; }
}


/* ---------------------------------------------------
	Main img
------------------------------------------------------ */
#main_img { width: 100%; margin: 0 auto; text-align: center; position: relative; }
#main_img::before { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.35); z-index: 2; }
#main_img .txt_col { font-size: 50px; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; text-align: center; }
#main_img .txt_col p { color: var(--color02); font-size: 18px; text-transform: uppercase; letter-spacing: 0.2em; }
#main_img .txt_col h1 { letter-spacing: 0.1em; }

@media screen and (max-width: 600px) {
	#main_img .txt_col { font-size: 26px; width: 100%; }
	#main_img .txt_col p { font-size: 14px; letter-spacing: 0.2em; }
	#main_img .txt_col h1 { letter-spacing: 0.1em; }
}


/* ---------------------------------------------------
	Contents
------------------------------------------------------ */
#contents_wrap { overflow: hidden; }

/* lead_col */
#lead_col { padding: 95px 0 125px; position: relative; }
#lead_col::before { content: ''; background: url(../img/lead_bg01.png) no-repeat left top/contain; width: 674px; height: 746px; position: absolute; top: -230px; left: -220px; z-index: -1; }
#lead_col > div { display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 1; }
#lead_col > div .txt { display: flex; flex-direction: column; align-items: center; line-height: 1.8; }
#lead_col > div .txt h2 { font-size: 32px; margin-bottom: 60px;  line-height: 1.7;}

/* slick */
div[class*="slick"] .slick-track { display: flex; height: 100%; }
div[class*="slick"] .slick-slide { height: auto !important; }
div[class*="slick"] .slick-list,
div[class*="slick"] .slick-slide > div { height: 100%; line-height: 0; }
div[class*="slick"] p { line-height: 1; }
.dot_slick01.slick-dotted.slick-slider { margin: 0; margin-bottom: 20px; }
.dot_slick01 .slick-dots { bottom: -20px; display: flex; justify-content: center; align-items: center; }
.dot_slick01 .slick-dots li { width: 8px; height: 8px; }
.dot_slick01 .slick-dots li button { width: 100%; height: 100%; padding: 0; background: #dccfad; border-radius: 50%; transition: background .5s, opacity .5s; }
.dot_slick01 .slick-dots li.slick-active button { background: #5d6d90; }
.dot_slick01 .slick-dots li button::before { display: none; }

/* cmn_tit */
.cmn_tit01 { text-align: center; }
.cmn_tit01 .stit { color: var(--color02); font-size: 18px; text-transform: uppercase; letter-spacing: 0.2em; margin-bottom: 5px; }
.cmn_tit01 .tit { font-size: 32px; letter-spacing: 0.1em; }
.cmn_tit01.wh .tit { color: #fff; }

/* cmn_btn */
.cmn_btn01 { width: 195px; padding: 10px 0; border-bottom: 1px solid #636361; display: flex; align-items: center; justify-content: space-between; }
.cmn_btn01:after { content: ''; background: url(../img/arrow01_bk.svg) no-repeat center/contain; width: 11px; height: 6px; transform: rotate(-90deg); transition: transform .5s;  }
.cmn_btn01.wh { border-color: #cbcbcb; color: #fff; }
.cmn_btn01.wh:after { background-image: url(../img/arrow01_wh.svg);}

/* cmn_bg */
.cmn_bg > * { position: relative; z-index: 1; }
.cmn_bg { position: relative; overflow: hidden; }
.cmn_bg::before { content: ''; z-index: -1; background: url(../img/bg04.webp) no-repeat bottom left/2384px; mix-blend-mode: multiply; z-index: 0; pointer-events: none; width: 100%; height: 750px; position: absolute; top: 0; left: 0; }

@media screen and (hover: hover) {
	.dot_slick01 .slick-dots li button:hover { opacity: .8; }
	.cmn_btn01:hover { opacity: 1; }
	.cmn_btn01:hover:after { transform: rotate(-90deg) translateY(5px); }
}
@media screen and (min-width: 601px) {
	#lead_col > div .txt { width: min(34.6%, 415px);}
	#lead_col > div .photo { width: min(58.3%, 700px); }

}
@media screen and (max-width: 600px) {

	/* lead_col */
	#lead_col { padding: 60px 0 80px; }
	#lead_col::before { width: 90vw; height: 95vw; top: -25vw; left: -25vw; }
	#lead_col > div { flex-direction: column; }
	#lead_col > div .txt { margin-bottom: 30px; }
	#lead_col > div .txt h2 { font-size: 22px; margin-bottom: 20px; filter: drop-shadow(0 0 3px var(--color01)) drop-shadow(0 0 3px var(--color01)); }

	/* cmn_tit */
	.cmn_tit01 .stit { font-size: 15px;  }
	.cmn_tit01 .tit { font-size: 24px; }

	.cmn_btn01 { width: 170px; }
}


/* breadcrumb */
#contents_wrap #breadcrumb { margin: 5px 50px 25px; font-size: 15px; display: flex; align-items: center;}
#contents_wrap #breadcrumb li { display: flex; align-items: center; line-height: 1.3; margin: calc(1em * 0.3) 0;}
#contents_wrap #breadcrumb li:before { content: '>'; margin: 0 5px;}
#contents_wrap #breadcrumb li:first-child:before { display: none; }

@media screen and (hover: hover) {
}
@media screen and (max-width: 600px) {
	#contents_wrap #breadcrumb { margin: 15px 4% 10px; font-size: 12px; flex-wrap: wrap; }
}


/* ---------------------------------------------------
	Footer
------------------------------------------------------ */
#ft_reserve { display: flex; }
#ft_reserve a { color: #fff; }
#ft_reserve .txt { background: url(../img/ft_bg01.jpg) no-repeat center left/cover, #3d4a69; color: #fff; text-align: center; align-content: center; padding: 60px 10px; }
#ft_reserve .txt > p:nth-of-type(1) { color: var(--color02); font-size: 40px; letter-spacing: 0.1em; }
#ft_reserve .txt .rsv_btn { display: block; background:var(--color02); color: #fff; width: min(100%, 310px); height: 70px; text-align: center; align-content: center; margin: 40px auto 0; font-size: 20px; }
#ft_reserve .txt dl { margin-top: 25px; font-size: 16px; }
#ft_reserve .txt dl dt { font-size: 18px; letter-spacing: 0.1em; }
#ft_reserve .txt dl dd .tel-link { font-size: 30px; }
#ft_reserve .txt dl dd .tel-link span { font-size: 34px; letter-spacing: 0.05em; }
#ft_reserve .txt dl dd .tel_txt { display: inline-block; }

#footer { background: url(../img/bg01.jpg); padding: 95px 0 25px; color: var(--txt_color01); }
#footer_inner { display: flex; flex-wrap: wrap; justify-content: space-between; }

#f_logo { width: 385px; }
#f_logo .logo { width: 280px; display: block; margin: 0 0 20px; }
#f_logo address { line-height: 1.7; }
#f_logo address span { display: inline-block; }
#f_logo .f_sns { margin-top: 30px; display: flex; align-items: center; gap: 20px; }
#f_logo .f_lang { margin-top: 30px; width: fit-content; font-size: 19px; }
#f_logo .f_lang dt { border-color: #333;}
#f_logo .f_lang dd { background: #f8f4ea40; }
#f_logo .f_lang  dd ul li { border-color: #afada980; }

#f_nav { padding: 15px 0 0; width: 465px; }
#f_nav #fnav { column-count: 2; }
#f_nav #fnav li { display: inline-block; width: 100%; margin: 0 0 15px; break-inside: avoid; }
#f_nav .g_link { margin-top: 45px; display: flex; justify-content: flex-end; align-items: center; }
#f_nav .g_link > p { font-size: 15px; margin-right: 15px; }
#f_nav .g_link > a { display: block; width: 175px; }

#copyright { padding: 65px 0 0; text-align: center; font-size: 12px; }

@media screen and (hover: hover) {
}
@media screen and (min-width: 601px) {
	#ft_reserve .photo { width: 50%; }
	#ft_reserve .txt { width: 50%;  }
}
@media screen and (max-width: 600px) {
	#ft_reserve { flex-direction: column; }
	#ft_reserve .txt { padding: 40px 10px 50px; }
	#ft_reserve .txt > p:nth-of-type(1) { font-size: 30px; }
	#ft_reserve .txt .rsv_btn { width: min(80%, 320px); margin: 20px auto 0; font-size: 18px; }
	#ft_reserve .txt dl { font-size: 14px;}
	#ft_reserve .txt dl dt { font-size: 16px; }
	#ft_reserve .txt dl dd .tel-link { font-size: 20px; }
	#ft_reserve .txt dl dd .tel-link span { font-size: 28px; }
	#ft_reserve .txt dl dd .tel_txt { display: block; line-height: 1; }

	#footer { padding: 45px 6% calc(20px + var(--hdheight) + env(safe-area-inset-bottom)); font-size: 16px; }

	#f_logo { width: 100%; }
	#f_logo .logo { width: min(70%, 280px); margin: 0 0 15px; }
	#f_logo address a { display: inline-block; }
	#f_logo .f_sns { margin-top: 20px; gap: 15px; }
	#f_logo .f_lang { margin-top: 25px; font-size: 15px; }
	#f_logo .f_lang dd { position: static;}

	#f_nav { padding: 35px 0 0; width: 100%; }
	#f_nav .g_link { margin-top: 20px; justify-content: center; }
	#f_nav .g_link > p { font-size: 13px; margin-right: 10px; }
	#f_nav .g_link > a { width: auto; }
	#f_nav .g_link > a img { width: auto; height: 25px; }

	#copyright { padding: 30px 0 0;}
}



/* ---------------------------------------------------
	更新履歴
------------------------------------------------------

------------------------------------------------------ */