@charset "utf-8";
/* ===================================================
	Base CSS
====================================================== */
@font-face {
font-display: swap;
font-family: 'Cormorant Garamond';
font-style: normal;
font-weight: 400;
src: url('../fonts/cormorant-garamond-v16-latin-regular.woff2') format('woff2');
}
@font-face {
font-display: swap;
font-family: 'EB Garamond';
font-style: normal;
font-weight: 400;
src: url('../fonts/eb-garamond-v30-latin-regular.woff2') format('woff2');
}
body { min-width: 1280px; min-height: 100vh; background: #fff; color: #4f443a; font-size: 16px; font-weight: normal; line-height: 1.5; font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif; -webkit-text-size-adjust: 100%; position: relative; font-feature-settings: "palt"; letter-spacing: 0.05em; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;}
body.noscroll{ overflow: hidden;}

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

div { box-sizing: border-box;}

a { color: #6e6e6e; text-decoration: none;}
a:hover { color: #6e6e6e; text-decoration: underline;}
a img { transition: opacity 0.5s;}
a:hover img { opacity: 0.75;}

.v_rl{ writing-mode: vertical-rl; font-feature-settings: "palt" 0;}
.ofi { object-fit: cover; width: 100%; height: 100%;}
.view_sp { display: none;}

.mincho{ font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif; }
.gothic{ font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;}
.num{ font-family: 'EB Garamond';}
.en{ font-family: 'Cormorant Garamond';}

.post-password-form{ margin: 200px auto 0;}

@media screen and (max-width: 600px) {
body { min-width: 0; font-size: 15px; }
.br_sp,
.view_sp { display: block;}
.br_pc,
.view_pc { display: none !important;}
}

/* ---------------------------------------------------
	Global Header
------------------------------------------------------ */
#g_header { position: absolute; top: 0; left: 0; width: 100%; height: 110px; z-index: 50; color: #fff;}
.hd_inner{ width: 100%; height: 100%; display: flex; justify-content: flex-end;}
.hd_logo{ width: 130px; height: auto; margin: 30px auto 0 40px; filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.8));}
.hd_logo img{ width: 100%; height: auto;}
.hd_btns{ display: flex; justify-content: flex-end; align-items: center; font-size: 16px; line-height: 1.1; filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.8)); margin: 0 280px 0 0; }
.hd_btns li{ margin: 0 8px;}
.hd_btns li a{ color: #fff; padding: 10px 5px; display: block; position: relative; white-space: nowrap;}
.hd_btns li a:hover{ text-decoration: none;}
.hd_btns li a::after { position: absolute; left: 0; content: ''; width: 100%; height: 1px; background: #fff; bottom: -1px; transform: scale(0, 1); transform-origin: center top; transition: transform 0.3s; }

#about .hd_btns li.hd_btn_00 a::after,
#rooms .hd_btns li.hd_btn_01 a::after,
#cuisine .hd_btns li.hd_btn_02 a::after,
#hotspring .hd_btns li.hd_btn_03 a::after,
#facilities .hd_btns li.hd_btn_04 a::after,
#restaurant .hd_btns li.hd_btn_05 a::after,
#sightseeing .hd_btns li.hd_btn_06 a::after,
#access .hd_btns li.hd_btn_07 a::after,
.hd_btns li a:hover::after { transform: scale(1, 1); }

.hd_lang{ font-size: 18px; line-height: 1.1; position: absolute; top: 125px; right: 25px;}
#lang_btn{ padding: 10px 20px 10px 10px; position: relative; cursor: pointer; box-sizing: border-box; display: flex; justify-content: center; align-items: center; filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.8));}
#lang_btn::after{ content: ""; display: block; width: 6px; height: 6px; border-bottom: solid 1px #fff; border-right: solid 1px #fff; position: absolute; top: 15px; right: 5px; transform: rotate(45deg); transition: all, 0.5s;}
#lang_btn.on::after{ top: 18px; transform: rotate(-135deg);}
#lang_list{ width: 100%; position: absolute; top: calc( 1.1em + 22px ); left: 0; opacity: 0; z-index: 100; visibility: hidden; height: auto; transition: all, 0.5s; box-sizing: border-box; font-size: 16px;}
#lang_list.on{ opacity: 1; visibility: visible; height: auto;}
#lang_list li{ margin: 0 0 1px;}
#lang_list li a{ display: block; padding: 7px 10px; text-align: center; background: rgba(255,255,255,0.8); color: #000; transition: background .5s;}
#lang_list li a:hover{ background: #E6E6E6; text-decoration: none;}
.hd_book{ width: 150px; height: 110px; position: fixed; top: 0; right: 110px; z-index: 100;}
.hd_book a{ width: 100%; height: 100%; padding: 0; background-color: #666362; font-size: 16px; color: #fff; display: flex; justify-content: center; align-items: center; box-sizing: border-box; transition: background 0.5s;}
.hd_book a:hover{ text-decoration: none; background-color:#84807F;}

@media screen and (max-width: 600px) {
#g_header { height: 70px;}
.hd_inner{ justify-content: space-between;}
.hd_logo{ width: 80px; margin: 15px 0 0 5%;}
.hd_lang{ font-size: 18px; top: 15px; right: 15px;}
#lang_btn { padding: 5px 20px 5px 10px; }
#lang_btn::after { top: 11px; }
#lang_list{ font-size: 15px;}
.hd_btns,
.hd_book{ display: none;}
}

/* ---------------------------------------------------
	Side Menu
------------------------------------------------------ */
#sidemenu { box-sizing: border-box; cursor: pointer; position: fixed; z-index: 121; top: 0; right: 0; height: 110px; width: 110px; background: #282623;}
#sidemenu > .bar{ transition: all 0.3s; box-sizing: border-box; position: absolute; height: 1px; width: 100%; text-indent: 100%; white-space: nowrap; overflow: hidden; z-index: 2; transform-origin: center center; left: 36px;}
#sidemenu > .bar::after{ content: ""; height: 1px; width: 40px; display: block; background: #adadad; position: absolute; top: 0; left: 0;}
#sidemenu > .bar:nth-of-type(1) { top: 43px;}
#sidemenu > .bar:nth-of-type(2) { top: 54px;}
#sidemenu > .bar:nth-of-type(3) { top: 65px; width: 40px;}
#sidemenu:hover > .bar:nth-of-type(3) { width: 20px;}
#sidemenu.on > .bar:nth-of-type(1) { transform: rotate(135deg); top: 79px; left: -21px; }
#sidemenu.on > .bar:nth-of-type(2) { opacity: 0; }
#sidemenu.on > .bar:nth-of-type(3) { transform: rotate(-135deg); top: 54px; left: 38px; width: 40px;}
#sidemenu .txt{ display: none;}

@media screen and (max-width: 600px) {
#sidemenu { height: 60px; width: 75px; top: inherit; bottom: 0; right: 0;}
#sidemenu > .bar{ left: 23px;}
#sidemenu > .bar::after{ width: 30px; background: #adadad;}
#sidemenu > .bar:nth-of-type(1) { top: 20px;}
#sidemenu > .bar:nth-of-type(2) { top: 29px;}
#sidemenu > .bar:nth-of-type(3) { top: 38px; width: 30px;}
#sidemenu:hover > .bar:nth-of-type(3) { width: 15px;}
#sidemenu.on > .bar:nth-of-type(1) { top: 48px; left: -16px; }
#sidemenu.on > .bar:nth-of-type(3) { top: 32px; left: 23px; width: 30px;}
#sidemenu .txt{ display: block; padding: 50px 0 0; text-align: center; font-size: 13px; line-height: 1;}
}

/* ---------------------------------------------------
	Global Navigation
------------------------------------------------------ */
#gnav { position: fixed; top: 0; right: 0; bottom: 0; overflow: auto; width: 100%; padding: 0; box-sizing: border-box; opacity: 0; /*z-index: -1;*/ transition: opacity 0.5s, visibility 1s; visibility: hidden; color: #4f443a;}
#gnav.on { opacity: 1; visibility: visible; z-index: 100;}
.overlay{ width: 100vw; height: 100vh; background: rgba(0,0,0,0.5); position: fixed; top: 0; left: 0; z-index: 99;}
.gnav_inner{ padding: 60px 140px 40px; width: 690px; min-height: 100%; margin: 0 0 0 auto; background: #fbfaf9; box-sizing: border-box; position: relative; z-index: 101;}
.gn_logo{ width: 120px; height: auto; margin: 0 auto;}
.gn_logo img{ width: 100%; height: auto;}
.gn_btns{ width: 100%; column-count: 2; font-size: 16px; margin: 20px 0 40px; list-style: none;}
.gn_btns li{ width: 100%; break-inside: avoid; padding: 0 0 20px;}
.gn_btns li a{ padding: 10px 0; display: inline-block; position: relative; color: #4f443a;}
.gn_btns li a::after { position: absolute; left: 0; content: ''; width: 100%; height: 1px; background: #4f443a; bottom: 0; transform: scale(0, 1); transform-origin: center top; transition: transform 0.3s; }
#home .gn_btns li.gn_btn_home a::after,
#about .gn_btns li.gn_btn_00 a::after,
#rooms .gn_btns li.gn_btn_01 a::after,
#cuisine .gn_btns li.gn_btn_02 a::after,
#hotspring .gn_btns li.gn_btn_03 a::after,
#facilities .gn_btns li.gn_btn_04 a::after,
#restaurant .gn_btns li.gn_btn_05 a::after,
#sightseeing .gn_btns li.gn_btn_06 a::after,
#access .gn_btns li.gn_btn_07 a::after,
#blog .gn_btns li.gn_btn_08 a::after,
#privacy .gn_btns li.gn_btn_09 a::after,
.gn_btns li a:hover::after { transform: scale(1, 1); }

.gn_btns li a:hover{ text-decoration: none;}
.gn_book{ width: 100%;}
.gn_book a{ width: 100%; height: 65px; padding: 0; background-color: #666362; font-size: 16px; color: #fff; display: flex; justify-content: center; align-items: center; box-sizing: border-box; transition: background 0.5s;}
.gn_book a:hover{ text-decoration: none; background-color:#84807F; color: #fff;}
.gn_conf{ padding: 20px 0; text-align: center;}
.gn_conf a{ width: fit-content; font-size: 16px; display: inline-block; position: relative; padding: 10px 2px; color: #4f443a;}
.gn_conf a::after { display: none; }
.gn_conf a::after { background: #4f443a; }
.gn_conf a:hover{ text-decoration: none;}
.gn_tel{ text-align: center; font-size: 18px; line-height: 1.1; letter-spacing: 0.1em;}
.gn_tel .tel-link{ font-size: 28px;}
.gn_open{ text-align: center; font-size: 14px; line-height: 1.1; padding: 10px 0 30px;}
.gn_lang { display: flex; justify-content: center; flex-wrap: wrap; text-align: center; margin: 0;}
.gn_lang li { margin: 5px; }
.gn_lang li a{ color: #4f443a; display: inline-block; padding: 10px 25px; font-size: 15px; line-height: 1.1; border: solid 1px #ccc7c3; background: #fff; transition: background 0.5s;}
.gn_lang li a:hover{ background: transparent; text-decoration: none;}

@media screen and (max-width: 600px) {
.gnav_inner{ padding: 30px 10% 80px; width: 100%; margin: 0;}
.gn_logo{ width: 120px;}
.gn_btns{ font-size: 15px; margin: 20px 0;}
.gn_btns li{ margin: 0; padding: 0 0 10px;}
.gn_btns li a { padding: 5px 0; }
.gn_book a{ height: 60px; font-size: 15px;}
.gn_conf{ padding: 10px 0;}
.gn_conf a{ font-size: 15px;}
.gn_tel{ font-size: 18px; letter-spacing: 0.1em;}
.gn_tel .tel-link{ font-size: 28px;}
.gn_open{ font-size: 12px; padding: 10px 0 20px;}
.gn_lang li { margin: 3px; }
.gn_lang li a{ padding: 10px 10px; font-size: 12px;}
}

/* ---------------------------------------------------
	Contents
------------------------------------------------------ */
#contents_wrap { overflow: hidden;}
.inner{ width: 90%; max-width: 1200px; margin: 0 auto;}
.inner_lg{ width: 100%; max-width: 1300px; margin: 0 auto;}
@media screen and (max-width: 600px) {
	.inner { width: 85%; }
}
/* ---------------------------------------------------
	Main Title
------------------------------------------------------ */
.main_tit{ position: relative; width: 100%; z-index: 1; /*margin: 0 0 75px;*/}
.main_tit::after{ content: ""; display: block; width: 1px; height: 150px; background: rgba(156,147,125,0.6); position: absolute; bottom: -75px; left: 50%;}
.main_tit .tit{ position: absolute; width: 100%; height: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.main_tit .en{ font-size: 30px; color: #9c937d; letter-spacing: 0.2em;}
.main_tit .ja{ font-size: 28px; color: #fff; letter-spacing: 0.2em;}
.main_tit img{ width: 100%; height: 700px; object-fit: cover;}

@media screen and (max-width: 600px) {
.main_tit{ /*margin: 0 0 30px;*/}
.main_tit::after{ height: 76px; bottom: -38px;}
.main_tit .en{ font-size: 24px;}
.main_tit .ja{ font-size: 20px;}
.main_tit img{ height: 320px;}
}

/* ---------------------------------------------------
	Background Pattern 01
------------------------------------------------------ */
.bg_01{ background-image: url("../img/bg_pattern_01.jpg"); background-size: 100px;}
.bg_02{ background-color: #3f3e3b; color: #fff;}

@media screen and (max-width: 600px) {
.bg_02{ background-color: #121211;}
}

/* ---------------------------------------------------
	Common Section Lead
------------------------------------------------------ */
.cmn_sec_lead{ padding: 150px 0 100px; position: relative;}
.cmn_sec_lead::before{ content: ""; display: block; width: 1378px; height: 75px; background:url("../img/bg_maintit_01.webp") no-repeat 0 0; background-size: 1378px; position: absolute;top: 0; left: calc( 50% + 90px );}
.cmn_sec_lead .box_in{ width: 80%; max-width: 830px; margin: 0 auto;}
.cmn_sec_lead .tit_01{ font-size: 26px; line-height: 1.5; text-align: center; padding: 0 0 40px; letter-spacing: 0.2em;}
.cmn_sec_lead .txt_01{ font-size: 17px; line-height: 2; letter-spacing: 0.15em;}

@media screen and (max-width: 600px) {
.cmn_sec_lead{ padding: 60px 0 40px;}
.cmn_sec_lead::before{ width: 689px; height: 38px; background:url("../img/bg_maintit_01.webp") no-repeat 0 0; background-size: 689px; left: calc( 50% - 60px );}
.cmn_sec_lead .tit_01{ font-size: 20px; padding: 0 0 15px; letter-spacing: 0.15em;}
.cmn_sec_lead .txt_01{ font-size: 15px; }
}

/* ---------------------------------------------------
	Common Title type01
------------------------------------------------------ */
.cmn_tit_01{ display: flex; flex-direction: column; justify-content: center; align-items: center; padding-bottom: 40px; }
.cmn_tit_01 .en{ font-size: 26px; line-height: 1.5; color: #9c937d; letter-spacing: 0.2em;}
.cmn_tit_01 .ja{ font-size: 26px; line-height: 1.5; letter-spacing: 0.15em; margin-top: 5px; }

@media screen and (max-width: 600px) {
.cmn_tit_01 { padding-bottom: 30px; }
.cmn_tit_01 .en{ font-size: 20px;}
.cmn_tit_01 .ja{ font-size: 20px;}
}

/* ---------------------------------------------------
	Common Title type02
------------------------------------------------------ */
.cmn_tit_02{ letter-spacing: 0.15em; padding: 80px 0 75px; display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 1.1;}
.cmn_tit_02 .en{ font-size: 26px; letter-spacing: 0.3em; color: #9c937d; display: block; padding: 0 0 25px;}
.cmn_tit_02 .ja{ font-size: 26px; letter-spacing: 0.2em; color: #50453b; display: block;}

@media screen and (max-width: 600px) {
.cmn_tit_02{ letter-spacing: 0.15em; padding: 60px 0 30px; display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 1.1;}
.cmn_tit_02 .en{ font-size: 20px; letter-spacing: 0.2em; color: #9c937d; display: block; padding: 0 0 15px;}
.cmn_tit_02 .ja{ font-size: 20px; letter-spacing: 0.2em; color: #50453b; display: block;}
}


/* ---------------------------------------------------
	Common Table type01
------------------------------------------------------ */
.cmn_table_01 { line-height: 2.2; letter-spacing: 0.15em; }
.cmn_table_01 div { display: flex; border-bottom: 1px solid #b2ac9e; }
.cmn_table_01 dt { width: 215px; }
.cmn_table_01 dd { width: calc(100% - 215px); }
.cmn_table_01 dt { padding: 15px 0 10px; }
.cmn_table_01 dd { padding: 0 0 15px; }

@media screen and (min-width: 601px) {
    .cmn_table_01 dt,
    .cmn_table_01 dd { padding: 20px 0; }
}

@media screen and (max-width: 600px) {
    .cmn_table_01 { line-height: 1.8; }
	.cmn_table_01 div { flex-direction: column; }
	.cmn_table_01 dt,
	.cmn_table_01 dd { width: 100%; }
    .cmn_table_01 dt { font-weight: bold; }
}


/* ---------------------------------------------------
	Line type01 下線が動くボタンで使用
------------------------------------------------------ */
.line_01{ padding: 10px 0; display: inline-block; position: relative; color: #4f443a;}
.line_01::after { position: absolute; left: 0; content: ''; width: 100%; height: 1px; background: #4f443a; bottom: 0; transform: scale(1, 1); transform-origin: center top; transition: transform 0.3s; }
.line_01:hover{ text-decoration: none;}
.line_01:hover::after { transform: scale(0, 1); }

/* ---------------------------------------------------
	Common Link type01 & 02 矢印付きボタン（01が暗めの背景用）
------------------------------------------------------ */
.cmn_link_01,
.cmn_link_02{ position: relative; z-index: 0; display: flex; align-items: center; justify-content: space-between; width: 190px; max-width: 100%; letter-spacing: 0.1em; padding: 10px 0; color: #d4d1ca; border-bottom: 1px solid #4f4d48; }
.cmn_link_02{ color: #50453b; }
.cmn_link_01::before,
.cmn_link_02::before{ position: absolute; bottom: -1px; left: 0; width: 0; height: 1px; content: ""; background: #d4d1ca; transition: width 0.5s; }
.cmn_link_01 { border-bottom-color: #a0a0a0; }
.cmn_link_01::after,
.cmn_link_02::after{ position: relative; right: 0; width: 14px; height: 10px; content: ""; background: url("../img/ico_arrow_01.svg"); transition: right 0.5s; }
.cmn_link_02::after{ background: url("../img/ico_arrow_02.svg"); }
.cmn_link_01:hover,
.cmn_link_02:hover{ text-decoration: none; color: #d4d1ca;}
.cmn_link_02:hover{ color: #50453b;}
.cmn_link_01:hover::before,
.cmn_link_02:hover::before{ width: 100%; }
.cmn_link_01:hover::after,
.cmn_link_02:hover::after{ right: -5px; }

@media screen and (max-width: 600px) {
	.cmn_link_01,
	.cmn_link_02 { font-size: 15px; }
}

/* ---------------------------------------------------
	Slick Slider
------------------------------------------------------ */
/*標準スライダー共通スタイル*/
.box_slide .slick-slide{ position: relative; overflow: hidden; /*margin: 0 30px;*/}
.box_slide .caption{ position: absolute; right: 40px; bottom: 20px; font-size: 14px; line-height: 1.4; letter-spacing: 0.2em; color: #fff; filter: drop-shadow(0px 0px 3px rgba(0,0,0,1));}
/*.box_slide .caption .en{ font-size: 20px;}*/
.box_slide .slick-arrow,
.box_slide .slick-arrow:hover{ z-index: 2; display: block; width: 70px; height: 70px;}
.box_slide .slick-next{ right: 10px; }
.box_slide .slick-prev{ left: 10px; }
.box_slide .slick-arrow::before{ content: ""; display: block; width: 30px; height: 30px; border-bottom: solid 1px #fff; border-right: solid 1px #fff; position: absolute; top: 0; bottom: 0; margin: auto 0;}
.box_slide .slick-next::before{ transform: rotate(-45deg); right: 25px;}
.box_slide .slick-prev::before{ transform: rotate(135deg); left: 25px;}
.box_slide .slick-dots{ bottom: -25px;}
.box_slide .slick-dots li{ margin: 0; width: 60px;}
.box_slide .slick-dots li button{ width: 100%;}
.box_slide .slick-dots li button:before{ content: ''; opacity: 1; width: 100%; height: 1px; background: #bcb8b4; top: 10px;}
.box_slide .slick-dots li.slick-active button:before{ background: #715949;}

/*横幅最大1300pxの標準スライダー*/
.slide_basic{ opacity: 0; transition: opacity .3s linear; width: 100%; max-width: 1300px; line-height: 0; margin-bottom: 50px !important;}
.slide_basic.slick-initialized{ opacity: 1; }
.slide_basic .slick-slide{ margin: 0 30px;}

@media screen and (max-width: 600px) {
.box_slide .caption{ right: 20px; bottom: 10px; font-size: 12px;}
/*.box_slide .caption .en{ font-size: 18px;}*/

/*横幅最大1300pxの標準スライダー*/
.slide_basic{ margin-bottom: 30px !important;}
.slide_basic.slick-initialized{ opacity: 1; }
.slide_basic .slick-slide{ margin: 0 5vw;}
}

/* ---------------------------------------------------
	BreadCrumb
------------------------------------------------------ */
.breadcrumb{ background-image: url("../img/bg_pattern_01.jpg"); background-size: 100px; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; list-style-type: none; padding: 35px 50px; font-size: 14px; line-height: 1.2;}
.breadcrumb li:nth-child(n+2) a{ padding: 0 0 0 40px; position: relative;}
.breadcrumb li:nth-child(n+2) a::before{ content: ""; display: block; width: 15px; height: 1px; background: #4f443a; position: absolute; top: 0; bottom: 0; left: 13px; margin: auto 0;}

@media screen and (max-width: 600px) {
.breadcrumb{ padding: 20px 5vw; font-size: 12px;}
/*.breadcrumb li:nth-child(n+2) a::before{ top: 5px;}*/
}

/* ---------------------------------------------------
	Global Footer
------------------------------------------------------ */
#g_footer{ letter-spacing: 0.1em;}
.ft_box_01{ background: url("../img/ft_bg_01.webp") no-repeat center center; background-size: cover; color: #dedede; padding: 90px 0 70px; text-align: center;letter-spacing: 0.2em;}
.ft_txt{ font-size: 22px; line-height: 1.1; padding: 0 0 40px;}
.ft_book{ width: 400px; margin: 0 auto;}
.ft_book a{ width: 100%; height: 65px; padding: 0; background-color: #fff; font-size: 16px; color: #2c2a2a; display: flex; justify-content: center; align-items: center; box-sizing: border-box; transition: all 0.5s; }
.ft_book a:hover{ text-decoration: none; background-color: #84807F; color: #fff}
.ft_conf{ padding: 10px 0 20px; text-align: center;}
.ft_conf a{ font-size: 14px; display: inline-block; position: relative; padding: 10px 2px; color: #dedede;}
.ft_conf a::after { background: #6d6762; }
.ft_conf a:hover{ text-decoration: none; color: #dedede;}
.ft_tel{ text-align: center; font-size: 20px; line-height: 1.1; }
.ft_tel .tel-link{ font-size: 34px; color: #dedede;}
.ft_open{ text-align: center; font-size: 14px; line-height: 1.1; padding: 5px 0 0; letter-spacing: 0.1em;}
.ft_box_02{ background: url("../img/bg_pattern_01.jpg"); background-size: 100px; padding: 70px 0 60px; text-align: center; color: #4f443a;}
.ft_logo{ padding: 0 0 30px; width: 221px; margin: 0 auto;}
.ft_logo img{ width: 100%; height: auto;}
.ft_name{ font-size: 18px; padding: 0 0 5px; letter-spacing: 0.3em; }
.ft_addr{ font-size: 16px; padding: 0 0 30px;}
.ft_btns{ display: flex; justify-content: center; flex-wrap: wrap; gap: 5px 0; font-size: 16px; width: 1100px; margin: 0 auto;}
.ft_btns li{ margin: 0 15px;}
.ft_btns li a{ padding: 10px 5px 5px; display: inline-block; position: relative; color: #4f443a;}
.ft_btns li a::after { position: absolute; left: 0; content: ''; width: 100%; height: 1px; background: #4f443a; bottom: 0; transform: scale(0, 1); transform-origin: center top; transition: transform 0.3s; }
.ft_btns .ft_btn_13,
.ft_btns .ft_btn_14,
.ft_btns .ft_btn_15 { width: 100%; }
.ft_btns .ft_btn_14 { margin-top: 30px; margin-bottom: 10px; }
.ft_btns .ft_btn_14 a { padding: 0; }
.ft_btns .ft_btn_14 a::after { display: none;}

#home .ft_btns li.ft_btn_home a::after,
#about .ft_btns li.ft_btn_00 a::after,
#rooms .ft_btns li.ft_btn_01 a::after,
#cuisine .ft_btns li.ft_btn_02 a::after,
#hotspring .ft_btns li.ft_btn_03 a::after,
#facilities .ft_btns li.ft_btn_04 a::after,
#restaurant .ft_btns li.ft_btn_05 a::after,
#sightseeing .ft_btns li.ft_btn_06 a::after,
#access .ft_btns li.ft_btn_07 a::after,
#blog .ft_btns li.ft_btn_08 a::after,
#privacy .ft_btns li.ft_btn_09 a::after,
.ft_btns li a:hover::after { transform: scale(1, 1); }

.ft_btns li a:hover{ text-decoration: none;}
.ft_copyright{ display: inline-block; font-size: 10px; padding: 20px 0 0;}

@media screen and (max-width: 600px) {
.ft_box_01{ padding: 40px 0 30px;}
.ft_txt{ font-size: 18px; padding: 0 0 15px;}
.ft_book{ width: 225px;}
.ft_book a{ height: 50px;}
.ft_conf{ padding: 10px 0;}
.ft_conf a{ font-size: 13px; padding: 5px 2px;}
.ft_tel{ font-size: 16px;}
.ft_tel .tel-link{ font-size: 28px;}
.ft_open{ font-size: 13px; padding: 5px 0 0;}
.ft_box_02{ padding: 70px 0 100px;}
.ft_logo{ padding: 0 0 15px; width: 135px;}
.ft_name{ font-size: 16px; padding: 0 0 5px;}
.ft_addr{ font-size: 15px; padding: 0 0 20px;}
.ft_btns{ display: block; column-count: 2; padding: 0 7%; font-size: 14px; width: 100%; margin: 0;}
.ft_btns li{ margin: 0; /*width: 50%;*/ text-align: left;}
.ft_btns li.ft_btn_09{ width: 100%;}
.ft_btns li a{ padding: 10px 5px 5px; margin-bottom: 5px; text-align: left;}
.ft_btns + .ft_btns { display: flex; flex-direction: column; align-items: center; }
.ft_btns .ft_btn_14 { margin-top: 20px; margin-bottom: 5px; width: min(300px, 60%); }
.ft_btns .ft_btn_13,
.ft_btns .ft_btn_15 { text-align: center; }
.ft_copyright{ font-size: 10px; padding: 20px 0 0;}
}

/* ---------------------------------------------------
	sp_nav
------------------------------------------------------ */
#sp_nav { display: none;}

@media screen and (max-width: 600px) {
#sp_nav { display: block; width: calc( 100% - 75px ); height: 60px; position: fixed; bottom: 0; left: 0; z-index: 10;}
#sp_nav ul{ display: flex; width: 100%; height: 100%;}
#sp_nav li.reservation{ width: 50%; background: #666362;}
#sp_nav li.tel,
#sp_nav li.access{ width: 25%; background: #282623; border-right: solid 1px #666362;}
#sp_nav li a { height: 100%; font-size: 13px; color: #adadad; display: flex; justify-content: center; align-items: center;}
#sp_nav li.reservation a{ color: #fff;}
#sp_nav a:hover { text-decoration: none;}
}
