@charset "UTF-8";

/*
* Last Update 2023-08-22
*
* 0-1.Clearfix
*
* 1-1.General
* 1-2.Structure
*
* 2-1.INDEX
* 2-2.ROOMS
* 2-3.STAY
* 2-4.ACCESS
* 2-5.SPA
* 2-6.VIEW
* 2-7.CONTACT
*
* 3-1.OVERWRITING
*
*/

/*
* Media query Setting
*SMP > below 559px
*TB > below 560px - 959px
*PC > over 960px;
*/

/*======================================

0-1.Clearfix

=======================================*/
.clearfix:after {
clear: both;
content: "";
display: block;
}

/*======================================

1-1.General

=======================================*/
*, *:before, *:after {
box-sizing: border-box;
}

html {
font-size: 62.5%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
overflow:auto;
}

body {
background-color: #fff;
color: #000;
font-family: 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN W3', HiraMinProN-W3,
'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'ヒラギノ明朝 Pro',
'Hiragino Mincho Pro', '游明朝体', 'YuMincho', '游明朝', 'Yu Mincho',
'HGS明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', Georgia, serif;
-webkit-font-feature-settings: "palt";
font-feature-settings: "palt";
font-size: 1.4rem;
line-height: 2;
overflow: hidden;
}

/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
}

/*===== for   OVER - 960px =====*/
@media screen and (min-width:960px){
body {
font-size: 1.6rem;
}
}


img {
max-width: 100%;
height: auto;
width
/***/
: auto;
border: none;
border-style: none;
}

img.image-full {
display: block;
width: 100%;
margin: auto;
}

img[src$=".svg"] {
width: 100%;
height: auto;
}

input,
button,
textarea,
select {
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

figure {
position: relative;
line-height: 0;
}

hr {
border: none;
clear: both;
height: 2.5em;
}

/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
figcaption {font-size: 1.2rem;}

hr {height: 4em;}
}

em,i {font-style: normal;}

a {
color: #000;
text-decoration: none;
}

a:hover,
a:focus {}

a:focus {
outline: thin dotted;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
a:hover img {opacity: .8;}

.disable {
color: #ccc;
display: block;
/* IE対応 */
pointer-events: none !important;
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
a[href*="tel:"] {
pointer-events: none!important;
cursor: default;
text-decoration: none;
}
}

.inner {
margin: 0 auto;
max-width: 1200px;
width: 92%;
}

.bg_pat {
background: url(../img/common/bg_pat.jpg);
background-size: contain;
}

.bg_gradient {
/*background-color: #333229;*/
background: rgb(88,88,81);
background: linear-gradient(45deg, rgba(88,88,81,1) 0%, rgba(51,50,41,1) 100%);
color:#fff;
margin-top:2em;
padding: 2em 0;
}

.fx {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.fx_just {justify-content: space-between;}
.fx_center {justify-content: center;}
.fx_start {justify-content: flex-start;}
.fx_end {justify-content: flex-end;}
.fx_around {justify-content: space-around;}

.fx_row_2 > * {width:100%;}
.fx_row_3 > * {width:100%;}
.fx_row_4 > * {width:100%;}

.full .summary,
.full .images {width:100%}

.only_sp,
.visible_sp {display: block;}

.only_md,
.only_lg,
.visible_tbpc,
.visible_pc {display: none;}

.btn {
background-color: #000;
color:#fff;
display: block;
font-size:2rem;
line-height: 72px;
margin: 0 4%;
text-align: center;
transition:.3s all;
-webkit-transition:.3s all ;
-ms-transition:.3s all ;
text-align: center;
}
.btn:hover {background-color: #222;}

.cv_btn {
background-color: #b59d5b;
color:#fff;
display: block;
font-size:2rem;
line-height: 72px;
margin: 0 4%;
text-align: center;
transition:.3s all;
-webkit-transition:.3s all ;
-ms-transition:.3s all ;
}
.cv_btn:hover {background-color: #71665c;}

.detail_btn {
font-family: 'EB Garamond', serif;
font-size:2rem;
position: relative;
}
.detail_btn::before {
background-color: #fff;
content:'';
display: block;
height: 1px;
width: 8em;
position: absolute;
bottom:-.5em;
left: 0;
transition: all .3s;
-webkit-transition: all .3s;
-ms-transition: all .3s;
}
.detail_btn::after {
background-color: #fff;
content:'';
display: block;
height: 1px;
width: 1em;
position: absolute;
bottom:-.25em;
left: 7em;
transition: all .3s;
transform: rotate(30deg);
-webkit-transform: rotate(30deg);
-ms-transform: rotate(30deg);
-webkit-transition: all .3s;
-ms-transition: all .3s;
}
.detail_btn:hover::before {width:10em;}
.detail_btn:hover::after {left: 9em;}

.links_btn {
border:1px solid #999;
display: block;
font-size:1.6rem;
line-height: 40px;
margin-top: .5em;
text-align: center;
transition: all .3s;
}
.links_btn:hover {
background-color: #999;
color:#fff;
}


/*===== for   OVER - 560px =====*/
@media screen and (min-width: 560px) {
.only_sp,
.visible_sp {display: none;}

.only_md,
.visible_tb {display: block;}

.btn {
font-size:2.4rem;
line-height: 80px;
margin: 0 auto;
max-width: 480px;
}

.cv_btn {
font-size:2.4rem;
line-height: 80px;
margin: 0 auto;
max-width: 480px;
}

.links_btn {font-size:1.8rem;}
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width: 800px) {
.bg_gradient {padding: 4em 0;}

.full .summary {
margin: auto;
width: 28.12%;
}
.full .images {width:62.5%}

.visible_tbpc {display: block;}

.fx_row_2 > * {width:50%;}
.fx_row_3 > * {width:33.33%;}
.fx_row_4 > * {width:25%;}
}

/*===== for   OVER - 960px =====*/
@media screen and (min-width: 960px) {
.container {width: 92%;}

.visible_tb {display: none;}

.only_lg,
.visible_pc {display: block;}

.btn {
font-size:2.8rem;
line-height: 88px;
}

.cv_btn {
font-size:2.8rem;
line-height: 88px;
}
}


/*======================================

1-2.Structure

=======================================*/
/*==========
HEADER
==========*/
header {
height:64px;
padding: 8px 4%;
-webkit-transition: all, 0.5s;
transition: all, 0.5s;
width: 100%;
position: fixed;
top:0;
z-index: 99;
}
header.is-fixed { background-color: rgba(0,0,0,.5);}

.hd_inner {
display: flex;
align-items: center;
justify-content: space-between;
z-index: 99;
position: relative;
}
h1 {
display: block;
line-height: 0;
width:175px;
}

.hd_utility {
display: flex;
align-items: center;
justify-content: space-between;
}

.hd_nav {display: none;}


/*========== GLOBAL NAVI ==========*/
.g_nav {
width: 40px;
position: fixed;
top:56px;
right:24px;
}
.g_nav .checkbox-toggle {
position: absolute;
top: -18px;
left: 0;
z-index: 2;
cursor: pointer;
width: 40px;
height: 40px;
opacity: 0;
}
.g_nav .checkbox-toggle:checked + .drawer_menu > div {transform: rotate(135deg);}
.g_nav .checkbox-toggle:checked + .drawer_menu > div:before,
.g_nav .checkbox-toggle:checked + .drawer_menu > div:after {
top: 0;
transform: rotate(90deg);
}
.g_nav .checkbox-toggle:checked + .drawer_menu > div:after {opacity: 0;}
.g_nav .drawer_menu span {
color:#fff;
font-size:1.4rem;
padding-left: .5em;
}
.g_nav .checkbox-toggle:checked ~ .g_nav_menu {
pointer-events: auto;
visibility: visible;
}
.g_nav .checkbox-toggle:checked ~ .g_nav_menu > div {
transform: scale(1);
transition-duration: .75s;
}
.g_nav .checkbox-toggle:checked ~ .g_nav_menu > div > div {
opacity: 1;
transition: opacity .4s ease .4s;
}
.g_nav .checkbox-toggle:hover + .drawer_menu {
box-shadow: inset 0 0 10px rgba(0,0,0,0.1);
}
.g_nav .checkbox-toggle:checked:hover + .drawer_menu > div {
transform: rotate(225deg);
}
.g_nav .drawer_menu {
position: absolute;
z-index: 1;
width: 40px;
/*height: 60px;*/
cursor: pointer;
transition: box-shadow .4s ease;
backface-visibility: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.g_nav .drawer_menu > div {
position: relative;
flex: none;
width: 40px;
height: 3px;
background: #FEFEFE;
transition: all .4s ease;
display: flex;
align-items: center;
justify-content: center;
}
.g_nav .drawer_menu > div:before,
.g_nav .drawer_menu > div:after {
content: '';
position: absolute;
z-index: 1;
top: -10px;
left: 0;
width: 100%;
height: 3px;
background: inherit;
transition: all .4s ease;
}
.g_nav .drawer_menu > div:after {
top: 10px;
}
.g_nav .g_nav_menu {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
visibility: hidden;
overflow: hidden;
backface-visibility: hidden;
outline: 1px solid transparent;
display: flex;
align-items: center;
justify-content: center;
}
.g_nav .g_nav_menu > div {
width: 250vw;
height: 250vw;
color: #FEFEFE;
background: rgba(0,0,0,1);
border-radius: 50%;
transition: all .4s ease;
flex: none;
transform: scale(0);
backface-visibility: hidden;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.g_nav .g_nav_menu > div > div {
text-align: center;
max-width: 90vw;
max-height: 100vh;
opacity: 0;
transition: opacity .4s ease;
overflow-y: auto;
flex: none;
display: flex;
align-items: stretch;
justify-content: center;
}
.g_nav .g_nav_menu > div > div > ul {
list-style: none;
padding: 0 1em;
margin: 0;
display: block;
text-align: left;
max-height: 100vh;
}

.g_nav .g_nav_menu .logo {
border-right:1px solid #fff;
max-width: 240px;
padding: 1em 32px 0 0;
width: 90%;
}

/*.g_nav li:nth-child(7) {margin-top:2.5em;}*/
.g_nav li.cv_reserve {
margin:3em 0 0;
text-align: center;
}
.g_nav li a {
color:#fff;
display: block;
font-size:1.4rem;
}
.g_nav li a > span {
font-family: 'EB Garamond', serif;
font-size:2.8rem;
padding-right: 16px;
}
.g_nav li.cv_reserve a {
background-color: #b59d5b;
font-size:1.4rem;
line-height: 1.4;
}
.g_nav li.cv_reserve a > span {
font-family: 'EB Garamond', serif;
font-size:2.8rem;
padding-right: 0;
}

/*===== for   BELOW - 799px =====*/
@media screen and (max-width:799px){
.g_nav {top:32px;}
.g_nav .g_nav_menu > div > div {
 align-items: center;
 flex-wrap: wrap;
 }
.g_nav .g_nav_menu .logo {
 border-bottom:1px solid #fff;
 border-right: none;
 margin-bottom: 1em;
 padding: 0 0 1em;
 width: 100%;
 }
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
header {
height:112px;
padding:24px;
}
h1 {
width:276px;
}
.hd_nav {
display: block;
margin-right:56px;
min-width: 480px;
width: 100%;
}
.hd_nav ul {
display: flex;
align-items: center;
justify-content: space-between;
}
.hd_nav li {
letter-spacing: .2em;
width:42.42%;
}
.hd_nav li:last-child {width:57.57%;}
.hd_nav li a {
background-color: rgba(0,0,0,.8);
color:#fff;
display: block;
font-size:1.8rem;
text-align: center;
}
.hd_nav li:last-child a {background-color: rgba(181,157,91,.8);}
.hd_nav li a > span {
font-family: 'EB Garamond', serif;
font-size:116%;
}

/*========== GLOBAL NAVI ==========*/
/*.drawer {font-size:1.6rem;}
.drawer span {
margin-right: 16px;
width: 40px;
}
.drawer span i { margin:4px 0;}

.g_nav ul {width: 30em;}
.g_nav li a {font-size:2rem;}
.g_nav li a > span {
font-size:3.8rem;
padding-right: 16px;
}
.g_nav li.cv_reserve a {font-size:2rem;}
.g_nav li.cv_reserve a > span {font-size:3.8rem;}*/
}

/*===== for   OVER - 960px =====*/
@media screen and (min-width:960px){
}

/*===== for   BELOW - 959px =====*/
@media screen and (max-width:959px){
}



/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
}

/*===== for   OVER - 960px =====*/
@media screen and (min-width:960px){
}

/*===== for   BELOW - 959px =====*/
@media screen and (max-width:959px){
}

/*==========
FOOTER
==========*/
footer {
padding-bottom: 40px;
position: relative;
}
.footer_inner {
display: flex;
justify-content: space-between;
margin:auto;
max-width: 1200px;
width: 92%;
}

.address {margin:auto}
.address h2 {
margin:auto;
max-width: 280px;
width: 100%;
}
.address dl {margin-top:1.5em;}

.ft_nav {display: none;}

.sp_nav {
width: 100%;
position: absolute;
bottom:0;
}
.sp_nav ul {
display: flex;
align-items: center;
justify-content: space-between;
}
.sp_nav li {width:28%;}
.sp_nav li:last-child {width:44%;}
.sp_nav li:not(:last-child) {border-right:1px solid #fff;}
.sp_nav li a {
background-color: #222;
color:#fff;
display: block;
line-height: 40px;
text-align: center;
}
.sp_nav li.cv_reserve a {background-color: #b59d5b;}

.copyright {
border-top:1px solid #000;
font-family: 'EB Garamond', serif;
margin:1em 0;
padding: 1em 0 0;
text-align: center;
}

.cv {
background-color: #e5e4df;
margin: 4em 0 2em;
padding: 1em 0 2em;
text-align: center;
}
.cv h2 {
font-size:1.6rem;
margin-bottom: 1em;
}
.cv h2 > em {
display: block;
font-family: 'EB Garamond', serif;
font-size:4rem;
}

/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
.cv h2 {font-size:2rem;}
.cv h2 > em {font-size:4.8rem;}
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
.address h2 {
margin-left: 0;
width:276px;
}

.ft_nav {display: block;}
.ft_nav ul {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 320px;
}
.ft_nav li {
line-height: 40px;
width: 50%;
}
.ft_nav .cv_reserve a {color:#b59d5b}

.sp_nav {display: none;}

.cv {margin:6em 0 3em}
}

/*===== for   OVER - 960px =====*/
@media screen and (min-width:960px){
.cv h2 {font-size:2.4rem;}
.cv h2 > em {font-size:7.2rem;}
}


/*==========
MARGIN
==========*/
.mgt_1em {margin-top:1em;}
.mgt_2em {margin-top:2em;}
.mgt_3em {margin-top:3em;}
.mgt_4em {margin-top:4em;}
.mgt_5em {margin-top:5em;}
.mgt_0-5em {margin-top:.5em;}
.mgt_1-5em {margin-top:1.5em;}
.mgt_2-5em {margin-top:2.5em;}
.mgt_3-5em {margin-top:3.5em;}
.mgt_4-5em {margin-top:4.5em;}

.mgb_1em {margin-bottom:1em;}
.mgb_2em {margin-bottom:2em;}
.mgb_3em {margin-bottom:3em;}
.mgb_4em {margin-bottom:4em;}
.mgb_5em {margin-bottom:5em;}
.mgb_0-5em {margin-bottom:.5em;}
.mgb_1-5em {margin-bottom:1.5em;}
.mgb_2-5em {margin-bottom:2.5em;}
.mgb_3-5em {margin-bottom:3.5em;}
.mgb_4-5em {margin-bottom:4.5em;}

/*==========
FONT
==========*/

h1, h2, h3, h4, h5 {
font-weight: normal;
line-height: 1.4;
}

/*h1 {font-size:6.4vw;}
h2 {
font-size:4.8vw;
}
h2 > span {
font-family: 'EB Garamond', serif;
}
h3 {font-size:4vw;}
h4 {font-size:3.2vw;}
*/
.headline {
font-size:2.4rem;
margin-bottom: 1em;
}
.headline > em {
color:#b59d5b;
display: block;
font-family: 'EB Garamond', serif;
font-size:4.8rem;
margin: .25em 0;
}
.headline > span {
color:#b59d5b;
display: block;
font-size:1.4rem;
}

.subttl {
font-size:2rem;
margin-bottom: .5em;
}

.tx_lead {font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;}
.tx_note {
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
font-size: 1rem;
text-align: right;
}
.tx_extend {
display: block;
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
font-size: 1rem;
}
.tx_center {text-align: center;}


.mv {position:relative;}
.mv_headline {
color:#fff;
font-size:1.2rem;
line-height: 1.4;
text-align: center;
position: absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
z-index: 2;
}
.mv_headline > em {
display: block;
font-family: 'EB Garamond', serif;
font-size:4rem;
}
.mv figure img {width:100%;}


@media screen and (min-width:560px){
/*h1 {font-size:4rem;}
h2 {font-size:3.2rem;}
h3 {font-size:2.4rem;}
h4 {font-size:1.8rem;}*/

.tx_note,
.tx_extend {font-size: 1.2rem;}

.headline {font-size:3.2rem;}
.headline > em {font-size:4.8rem;}
.headline > span {font-size:1.6rem;}

.subttl {font-size:2.4rem;}


.mv_headline {font-size:1.8rem;}
.mv_headline > em {font-size:6.4rem;}
}

@media screen and (min-width:960px){
/*h1 {font-size:5.6rem;}
h2 {font-size:4rem;}
h3 {font-size:3.2rem;}
h4 {font-size:2.4rem;}*/

.tx_note {font-size: 1.4rem;}

.headline {font-size:4.8rem;}
.headline > em {font-size:7.2rem;}
.headline > span {font-size:2.4rem;}

.subttl {font-size:3.2rem;}

.mv_headline {
font-size:2.4rem;
max-width: 1200px;
text-align: left;
width: 92%;
}
.mv_headline > em {font-size:8.8rem;}
}



/*/////////////////////////////////////
INDEX
/////////////////////////////////////*/
.kv {line-height: 0;}
.info {
background-color: #000;
color:#fff;
padding: 2em 0;
}
.info h2 {
font-family: 'EB Garamond', serif;
font-size:1.8rem;
}
.info ul {
border-top:1px solid #fff;
margin-top: 8px;
padding:8px 0;
width: 100%;
}

.concept {padding: 4em 0;}
.concept .summary {margin:0 4% 32px;}

.lnav {
background: #000 url(../img/home/bg_lnav.jpg) no-repeat 0 0;
background-size: contain;
padding: 4em 0;
}
.lnav .lnav_inner {margin:0 4% 3em;}
.lnav .lnav_inner:last-child {margin-bottom:0;}
.lnav a {
color:#fff;
font-family: 'EB Garamond', serif;
font-size:1.8rem;
}
.lnav .summary {margin-bottom:1.5em;}
.lnav .headline > em {line-height: 0;}
.lnav .tx_lead {
color:#fff;
margin:3em 0 .75em;
}

.lnav_secondary {
background: rgb(88,88,81);
background: linear-gradient(45deg, rgba(88,88,81,1) 0%, rgba(51,50,41,1) 100%);
padding: 4em 0;
}
.lnav_secondary .lnav_inner {margin:0 4% 3em;}
.lnav_secondary .lnav_inner:last-child {margin-bottom:0;}
.lnav_secondary a {
color:#fff;
font-size:1.8rem;
}
.lnav_secondary .headline {
padding-left: 2em;
position: relative;
}
.lnav_secondary .headline::before {
background-color: #fff;
content:'';
display: block;
height:4em;
width: 1px;
position: absolute;
left:1em;
top:-2em;
}
.lnav_secondary .headline > em {
color:#fff;
display: inline-block;
margin: 0;
}
.lnav_secondary .headline > span {
color:#fff;
display: inline-block;
margin-left: 1em;
}
.lnav_secondary .tx_lead {
color:#fff;
margin-bottom:.75em;
}

.map {margin:auto;}
.map.home_map {margin-bottom:4em;}
.map h2 {
font-size:1.6rem;
margin:3em auto 1em;
text-align: center;
}
.map h2 > em {
display: block;
font-size:4rem;
}

.map_wrap {
margin-bottom: 2em;
padding-top: 75%; /* = height ÷ width × 100 */
width: 100%;
position: relative;
}
.map_wrap iframe {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
}

/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
.concept .headline {font-size:2.6rem;}

.map h2 {font-size:2rem;}
.map h2 > em {font-size:4.8rem;}
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
.info {
background-color: #000;
color:#fff;
padding: 2em 0;
}
.info h2 {
font-size:2.4rem;
line-height: 2;
width: 4em;
}
.info ul {
border-top:none;
border-left:1px solid #fff;
margin-top: 0;
padding:8px 0 8px 2em;
width: calc(100% - 7em);
}

.concept {padding: 7.5em 0;}
.concept .summary {
margin:auto;
width: 28.12%;
}
.concept figure {width:62.5%;}
.concept .headline {font-size:3.2rem;}

.lnav {padding: 7.5em 0;}
.lnav .lnav_inner {
display: flex;
align-items: flex-start;
flex-direction: row-reverse;
margin:0 0 5em;
}
.lnav .lnav_inner.ref {
flex-direction: row;
}
.lnav .summary {
margin:0 auto;
width: 28.12%;
position: relative;
}
.lnav .summary::before {
background-color: #b59d5b;
content: '';
display: block;
height: 1px;
width: 8em;
position: absolute;
left:-9em;
top:4em;
z-index: 2;
}
.lnav .lnav_inner.ref .summary::before {
left:auto;
right:-9em;
}
.lnav figure {width:62.5%;}
.lnav .headline {
font-size:3.2rem;
margin-bottom: 2em;
}

.lnav_secondary_inner {
display: flex;
justify-content: space-between;
margin:auto;
max-width: 1200px;
width: 92%;
}


.map.home_map {margin-bottom:5em;}
.map_wrap {padding-top: 33.33%;}
}


/*===== for   OVER - 960px =====*/
@media screen and (min-width:960px){
.lnav a {font-size:2rem;}

.map h2 {font-size:2.4rem;}
.map h2 > em {font-size:7.2rem;}
}


/*/////////////////////////////////////
ROOMS
/////////////////////////////////////*/
.rooms_intro {padding: 4em 0;}
.rooms_intro .summary {margin: 2em 4%;}

.rooms_intro .spec {margin:3em 4% 0;}
.rooms_intro .spec .headline {text-align: center;}
.rooms_intro .spec table {
border-top:1px solid #000;
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
width: 100%;
}
.rooms_intro .spec th,
.rooms_intro .spec td {
display: block;
font-weight: normal;
text-align: left;
width: 100%;
}
.rooms_intro .spec th {padding-top:.5em;}
.rooms_intro .spec td {
border-bottom:1px solid #000;
padding-bottom: .5em;
}
/*.rooms_intro .images {width:100%;}*/

.rooms_intro .spec h4 {
margin:1em auto 0;
text-align: center;
width: 10em;
}
.rooms_intro .spec h4 span {
display: block;
font-size:1.2rem;
margin-top: 4px;
}
.rooms_intro .spec h4 a {
background-color: #000;
color:#fff;
display: block;
margin: auto;
padding: .5em 1em;
}

.guide {padding: 4em 0;}
.guide .headline {text-align: center;}
.guide .full {
flex-direction: column-reverse;
margin:0 4%;
}
.guide .full figure {margin-bottom:1em;}

.guide .gallery_inner {
margin:0 auto;
width: 92%;
}
.guide .gallery_inner .full {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
flex-direction: column;
margin:0 0 2em;
}

/*.guide .gallery .slider {
width:100%;
}
.guide .gallery .images {width:100%;}
*/
.guide .gallery .summary {
color:#fff;
margin-bottom:2em;
width:100%;
}
.guide .gallery .images {width:100%;}


.guide .gallery_inner .thumb ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.guide .gallery_inner .thumb .swiper-slide {
margin-top: 1em;
width:24%!important;
}


.modal-open{
border: none;
cursor: pointer;
}
.modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
background: rgba(0,0,0,.8);
padding: 40px 16px;
/*overflow: auto;*/
opacity: 0;
visibility: hidden;
transition: .3s;
box-sizing: border-box;
z-index: 99;
}
.modal:before{
content: "";
display: inline-block;
vertical-align: middle;
height: 100%;
margin-left: -0.2em;
}
.modal.is-active{
opacity: 1;
visibility: visible;
}

.modal-container{
position: relative;
display: inline-block;
vertical-align: middle;
overflow-y:scroll;
height: 90%;
width: 90%;
}

.modal-close{
position: absolute;
display: flex;
align-items: center;
justify-content: center;
top: 7%;
right: 4%;
width: 40px;
height: 40px;
color: #fff;
background: #000;
border-radius: 50%;
cursor: pointer;
z-index: 9;
}
.modal-content{
background: #fff;
padding: 24px;
}
.modal-content dl {
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
text-align: left;
}
.modal-content dt {
border-bottom:1px solid #000;
font-weight: 700;
margin-bottom: 8px;
padding-bottom: 4px;
}
.modal-content dd + dt {margin-top:1.5em}



/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
.rooms_intro .spec {
margin:3em auto;
max-width: 1200px;
width: 92%;
}

.rooms_intro .spec th,
.rooms_intro .spec td {
display: table-cell;
width: auto;
}
.rooms_intro .spec th {
border-bottom:1px solid #000;
width:8em;
}
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
.rooms_intro .full {flex-direction: row-reverse;}

.guide {padding: 6em 0;}
.guide .full {
flex-direction: row-reverse;
margin: 0;
}
.guide .full figure {margin-bottom:0;}

.guide .gallery_inner .full {flex-direction: row-reverse;}
/*.guide .gallery .slider {width:62.5%;}*/

.guide .gallery_inner .thumb .swiper-slide {width: 12%!important;}
}

/*===== for   OVER - 1800px =====*/
@media screen and (min-width:1800px){

.guide .gallery .summary {
margin: auto;
width: 28.12%;
}
.guide .gallery .images {width:62.5%;}
}


/*/////////////////////////////////////
STAY
/////////////////////////////////////*/
.stay_intro {padding: 4em 0;}

.stay_intro .tx_stay {
 font-size:2.4rem;
 margin-bottom:2.5em;
 text-align: center;
 }

.stay_detail {margin-bottom: 4em;}
.stay_detail figure {width:100%;}
.stay_detail .summary {
margin-top:2em;
width: 100%;
}
.stay_detail table {
border-top:1px solid #000;
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
margin: -1em auto 2em;
width: 100%;
}
.stay_detail table caption {
font-family: 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN W3', HiraMinProN-W3,
'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'ヒラギノ明朝 Pro',
'Hiragino Mincho Pro', '游明朝体', 'YuMincho', '游明朝', 'Yu Mincho',
'HGS明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', Georgia, serif;
font-size:1.6rem;
font-weight: 700;
margin-bottom: 8px;
text-align: left;
}
.stay_detail th,
.stay_detail td {
display: block;
font-weight: normal;
text-align: left;
width: 100%;
}
.stay_detail th {padding-top:.5em;}
.stay_detail td {
border-bottom:1px solid #000;
padding-bottom: .5em;
}

.stay_intro .cancel {
border:1px solid #000;
padding: 16px;
}
.stay_intro .cancel h2 {
background-color: #000;
color:#fff;
font-size:1.6rem;
font-weight: 700;
line-height: 2.4;
margin-bottom: 1em;
text-align: center;
width: 100%;
}
.stay_intro .cancel ul {width:100%;}
.stay_intro .cancel li {
line-height: 1.6;
width: 48%;
}
.stay_intro .cancel li:nth-child(1),
.stay_intro .cancel li:nth-child(2) {
border-bottom:1px solid #000;
margin-bottom: .5em;
padding-bottom: .5em;
}
.stay_intro .cancel p {
line-height: 2.4;
width:100%;
}
.stay_intro .cancel p > a {
font-weight: bold;
text-decoration: underline;
}

.stay_amenity {margin:4em auto;}
.stay_amenity .headline,
.stay_amenity .subttl {text-align: center;}

.stay_amenity .fx_row_3 > * {
width: 48%;
}
.stay_amenity li {
margin-bottom: 2em;
position: relative;
}
.stay_amenity li span {
background-color: #444;
color:#fff;
display: inline-block;
font-size:1.2rem;
padding: 0 .5em;
position: absolute;
z-index: 2;
}
.stay_amenity li .label_std {background-color: #000;}
.stay_amenity li .label_pay {background-color: #830522;}
.stay_amenity li figcaption {
font-size:1.6rem;
margin-top: 16px;
text-align: center;
}

.stay_other_amenity {margin-top:4em;}
.stay_other_amenity dl {border-top:1px solid #000;}
.stay_other_amenity dt {padding-top: .5em;}
.stay_other_amenity dd {
border-bottom:1px solid #000;
padding-bottom: .5em;
}

/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
.stay_intro .tx_stay {font-size:3.2rem;}

.stay_detail {margin-bottom: 6em;}
.stay_detail .fx {
justify-content: space-between;
margin-bottom: 2em;
}
.stay_detail figure {width:50%;}
.stay_detail .summary {
margin-top:0;
width: 43.33%;
}

.stay_detail table caption {font-size:2rem;}
.stay_detail th,
.stay_detail td {
display: table-cell;
width: auto;
}
.stay_detail th {
border-bottom:1px solid #000;
width: 8em;
}

.stay_intro .cancel {
border-left:none;
border-right:none;
}
.stay_intro .cancel .fx {
align-items: stretch;
margin:auto;
max-width: 1024px;
}
.stay_intro .cancel h2 {
display: flex;
align-items: center;
justify-content: center;
font-size:2.4rem;
line-height: 3;
margin-bottom: 0;
width: 31.25%;
}
.stay_intro .cancel ul {width:62.5%;}
.stay_intro .cancel li {
width: 21%;
}
.stay_intro .cancel li:nth-child(1),
.stay_intro .cancel li:nth-child(2) {
border-bottom:none;
margin-bottom: 0;
padding-bottom: 0;
}
.stay_intro .cancel li:not(:last-child) {border-right:1px solid #000;}

.stay_intro .cancel p {width:62.5%;}

.stay_amenity {margin:4em auto 6em;}
.stay_amenity .fx_row_3 > * {
width: 31.33%;
}
}


/*/////////////////////////////////////
ACCESS
/////////////////////////////////////*/
.access_method {padding:4em 0;}
.access_method .headline {margin: 0;}
.access_method .access_address {
border-bottom:1px solid #000;
margin-bottom: 2em;
padding-bottom: 2em;
}
.access_method .access_address dt {
font-size:1.8rem;
font-weight: 700;
}
.access_method .access_address dd {font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;}

.access_method .access_info + .access_info {margin-top:2em;}
.access_method .access_info h3 {
font-size:1.8rem;
font-weight: 700;
margin-bottom: 1em;
}
.access_method .access_info h3 > span {
color:#555;
font-size:1.4rem;
padding-left: 1em;
}
.access_method figcaption {
background-color: #fff;
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
line-height: 1.5;
margin: 1em 0 2em;
padding: .5em 1em;
}

.access_method .howto_root {
overflow:auto;
padding: 0 1em;
width: 720px;
}
.access_method .howto_root img {width:100%;}


.access_method .courtesy_car {
 background-color: #fff;
 line-height: 1.5;
 margin: 1.5em auto 0;
 max-width: 640px;
 padding: 1em;
 width: 100%;
}
.access_method .courtesy_car.fx {
 justify-content: center;
 align-items: center;
 justify-content: space-between;
}
.access_method .courtesy_car h4 {
border-bottom:1px solid #000;
font-size:2rem;
font-weight: 700;
margin-bottom: .5em;
padding-bottom: .5em;
}
.access_method .courtesy_car p { font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;}
.access_method .courtesy_car figure {
 max-width: 240px;
 width: 100%;
}

.access_method .thumbnail_bus {
margin:1em auto;
max-width: 400px;
width: 100%;
}

.spot {
margin-bottom: -2em;
padding: 4em 0;
}
.spot .headline {text-align: center;}

.spot li figure {margin-bottom: 1em;}
.spot li h3 {
font-size:1.8rem;
margin-bottom: .25em;
}
.spot li .tx_info {
border-top:1px solid #ccc;
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
margin-top:.5em;
padding-top: .5em;
}

.spot .fx_row_3 li:not(:last-child) {margin-bottom:2em;}

/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
.access_method .access_address dt {font-size:2rem;}

.access_method .access_info h3 {font-size:2rem;}
.access_method .access_info h3 > span {font-size:1.6rem;}

.access_method figcaption {font-size:1.4rem;}

.spot .fx_row_3 > * {width: 48.6%;}
}

/*===== for   OVER - 724px =====*/
@media screen and (min-width:724px){
.access_method .howto_root {
    overflow:auto;
    padding: 0 1em;
    width: 100%;
    }
}
/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
.access_method .access_address dt {font-size:2.4rem;}

.access_method .access_info h3 {font-size:2.4rem;}
.access_method .access_info h3 > span {font-size:1.8rem;}

.access_method figcaption {font-size:1.6rem;}

.access_method .courtesy_car .courtesy_summary {width:59.5%;}
.access_method .courtesy_car figure {width:37.5%;}

.spot {margin-bottom: -3em; }
.spot .fx_row_3 > * {width: 31.33%;}
.spot .fx_row_3 li:not(:last-child) {margin-bottom:3em;}
}

/*===== for   OVER - 960px =====*/
@media screen and (min-width:960px){
}

/*===== for   BELOW - 959px =====*/
@media screen and (max-width:959px){
}


/*/////////////////////////////////////
SPA
/////////////////////////////////////*/
.spa_intro {
margin-bottom: 4em;
padding:4em 0;
}
.spa_intro figure {margin-top:2em;}

.spa_guide .fx + .fx {margin-top:2.5em;}
.spa_guide .summary {margin:1.25em 4% 0;}
.spa_guide .worktime {
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
font-size:1.2rem;
line-height: 1.8;
margin-top: .5em;
}

.spa_amenity {margin: 2em 0;}
.spa_amenity .headline {text-align: center;}
.spa_amenity .fx_row_4 > * {width:30%;}
.spa_amenity li {
display: flex;
align-items: center;
}
.spa_amenity li {
border-bottom:1px solid #fff;
margin-bottom: 1em;
padding-bottom: 8px;
}
.spa_amenity li span {padding-left: 8px;}
/*.spa_amenity .fx_row_2 > * {width:100%;}

.spa_amenity li {
display: flex;
justify-content: space-between;
}
.spa_amenity li:nth-child(even) {flex-direction: row-reverse;}
.spa_amenity li:not(:last-child) {margin-bottom: 2em;}
.spa_amenity li figure {width:40.5%;}
.spa_amenity li .summary {width:55.1%;}
*/

.spa_gallery .headline {text-align: center;}

.spa_gallery table {
border-top:1px solid #000;
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
margin: -1em auto 2em;
width: 100%;
}
.spa_gallery th,
.spa_gallery td {
display: block;
font-weight: normal;
text-align: left;
width: 100%;
}
.spa_gallery th {padding-top:.5em;}
.spa_gallery td {
border-bottom:1px solid #000;
padding-bottom: .5em;
}

/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
.spa_guide .fx.ref {flex-direction: row-reverse;}

.spa_amenity {margin: 4em 0;}
.spa_amenity .fx_row_4 > * {width:14%;}
.spa_amenity .fx_row_4 li:nth-child(5) {width:20%;}
/*
.spa_amenity .fx_row_2 > * {width:48.6%;}
.spa_amenity li:nth-child(even) {flex-direction: row;}
.spa_amenity li:not(:last-child) {margin-bottom: 0;}
*/

.spa_gallery th,
.spa_gallery td {
display: table-cell;
width: auto;
}
.spa_gallery th {
border-bottom:1px solid #000;
width: 12em;
}
}

/*===== for   BELOW - 639px =====*/
@media screen and (max-width:639px){
 
.spa_amenity .fx_row_4 > * {width:48%;}
}


/*/////////////////////////////////////
VIEW
/////////////////////////////////////*/
.view_intro {padding: 4em 0;}
.view_intro figure {margin-top:2em;}

.view_gallery {margin-top: 4em;}
.view_gallery .fx_row_2 > * {
line-height: 0;
width:50%;
}

/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
.view_intro {padding: 6em 0;}
.view_intro figure {margin-top:3em;}

.view_gallery {margin-top: 6em;}
.view_gallery .fx_row_2 > * {width:48.6%;}
.view_gallery li {margin-bottom:2em}
/*.view_gallery li:nth-child(even) {margin-top:4em;}*/
}


/*/////////////////////////////////////
CONTACT
/////////////////////////////////////*/
.contact_caution {
padding: 4em 0;
}
.contact_caution p {font-size:125%;}
.contact_caution li {
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
list-style: disc outside;
margin-left: 1em;
}

.form .headline {text-align: center;}
.form .tx_note {
color:#830522;
margin-bottom: 8px;
text-align: left;
}
.form dt {
background-color: #e6e6dd;
padding: .5em 1em;
}
.form dd {
margin:1px 0 8px;
}

.form input[type='text'],
.form input[type='textarea'] {
background-color: #eee;
font-size:1.4rem;
padding: 1em;
width: 100%;
}
.form input[type='textarea'] {height: 12em;}
.form input[type='text']:focus,
.form input[type='textarea']:focus {
background-color: #fff;
outline: 0;
box-shadow: 0 0 0 1px rgb(33, 150, 243) inset;
}
.form input[type='submit'] {
background-color: #000;
border: 2px solid transparent;
color: #fff;
cursor: pointer;
display: block;
font-family: 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN W3', HiraMinProN-W3,
'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'ヒラギノ明朝 Pro',
'Hiragino Mincho Pro', '游明朝体', 'YuMincho', '游明朝', 'Yu Mincho',
'HGS明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', Georgia, serif;
font-size:1.6rem;
line-height: 48px;
margin:2em auto 0;
max-width: 480px;
width: 100%;
}
.preview_btn {
background-color: #666;
border: 2px solid transparent;
color: #fff;
cursor: pointer;
display: block;
font-family: 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN W3', HiraMinProN-W3,
'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'ヒラギノ明朝 Pro',
'Hiragino Mincho Pro', '游明朝体', 'YuMincho', '游明朝', 'Yu Mincho',
'HGS明朝E', 'ＭＳ Ｐ明朝', 'MS PMincho', Georgia, serif;
font-size:1.4rem;
line-height: 40px;
margin:1em auto 0;
max-width: 480px;
width: 100%;
}


/*===== for   OVER - 560px =====*/
@media screen and (min-width:560px){
.form input[type='submit'] {
font-size:2rem;
line-height: 64px;
}
}

/*===== for   OVER - 800px =====*/
@media screen and (min-width:800px){
.contact_caution {
padding: 6em 0 4em;
}

.form_inner {
margin:auto;
max-width: 900px;
}
.form dl {
display: inline-flex;
justify-content: space-between;
flex-wrap: wrap;
}
.form dt {
display: flex;
align-items: center;
margin-bottom: 1px;
width:25%
}
.form dd {
margin:0;
padding: .25em 0 .25em 1em;
width: 75%;
}

.form input[type='text'],
.form input[type='textarea'] {
background-color: #eee;
font-size:1.6rem;
}
.form input[type='submit'] {
font-size:2.4rem;
line-height: 80px;
}
.preview_btn {
font-size:2rem;
line-height: 64px;
}
}

/*===== for   OVER - 960px =====*/
@media screen and (min-width:960px){
}

/*===== for   BELOW - 959px =====*/
@media screen and (max-width:959px){
}



/*/////////////////////////////////////
3-1.OVERWRITING
/////////////////////////////////////*/
.slider_wrap {
position: relative;
}

.swiper-button-next,
.swiper-button-prev {color:rgba(0,0,0,.5);}

.swiper-pagination-bullet-active {
background:#000;
position:relative;
}

.slider_wrap .swiper-pagination {
bottom:-1em;
}