@charset "utf-8";
/* CSS Document */
/* 複数モーダル表示 --------------------------------------------------------- */
/* ボタンのデザイン */
.works_modal_open {
    position: relative;
    font-size: 0.9em;
    line-height: 1;
    letter-spacing: 0.19em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 54px;
	background: #293140;
    color: #fff;
	cursor: pointer;
}

.works_modal_open::before {
    content: "";
    position: absolute;
    right: 15px;
    top: 21px;
    width: 9px;
    height: 9px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: right 0.3s ease;
    -moz-transition: right 0.3s ease;
    -o-transition: right 0.3s ease;
    transition: right 0.3s ease;
}

.works_modal_open:hover::before{
	right: 12px;
}
.works_modal_open p { margin-bottom: 0; }
.works_modal_content{
    text-align: center;
}
.room-name {
	text-align: left;
    display: block;
    font-size: 150%;
	margin-bottom: 0;
}

/* ------works_modal css------ */
.works_modal_wrapper {
    position: fixed;
    display: flex;
    align-items: center;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border: none;
    opacity: 0;
    z-index: -1;
/* ↓背景スクロールさせない */
    overscroll-behavior: contain;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
    touch-action: none;
}
.works_modal_window {
    width: 90vw;
	height:84vh;
    margin: auto;
	overflow-y: auto;
    z-index: 1;
	background-color: #fffcfa;
    background-image: url(../img/common/subtle-white-feathers.png);
}
/* ↓背景スクロールさせない */
.works_modal_window::before,
.works_modal_window::after {
    content: "";
    width: 1px;
    display: flex;
}
.works_modal_window::-webkit-scrollbar { display: none; }

/* ↓モーダル中身 */
.works_modal_content {
    margin: 0 auto;
    width: 100%;
    height: 100%;
	color: #272624;
}
.works_modal_mask {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
	background-color: rgb(73 49 30 / 100%);
	background-image: url(../img/common/subtle-white-feathers.png);
	overflow-x: hidden;
    overflow-y: hidden;
}

.modal-flex {
	width: 100%;
    height: auto;
    display: flex;
    flex-flow: column;
	flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
	align-items: flex-start;
    padding: 0;
}

.works_modal_close {
    z-index: 300;
    position: absolute;
    top: 0.3rem;
    right: 0;
    font-size: 1.8rem;
    cursor: pointer;
	-webkit-padding-top: 3.6rem;
    padding: 0 0.6rem;
}
.works_modal_close:hover {
    color: #000;
    transition: all .5s;
}
html.is_open, body.is_open {
    overflow: hidden;
}
.works_modal_wrapper.is_open {
    animation: works_modal_wrapper_open .5s ease forwards;
}
.works_modal_wrapper.is_open .works_modal_window {
    animation: works_modal_window_open .5s ease forwards;
}
.works_modal_wrapper.is_close {
    animation: works_modal_wrapper_close .5s ease forwards;
}
.works_modal_wrapper.is_close .works_modal_window {
    animation: works_modal_window_close .5s ease forwards;
}
/* ボタンの色変更 */
.mustard { background: #b3862b; }
.grey { background: #898989; }


@keyframes works_modal_wrapper_open {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
      z-index: 300;
    }
  }
  @keyframes works_modal_window_open {
    0% {
      opacity: 0;
      transform: translateY(-30px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  @keyframes works_modal_wrapper_close {
    0% {
      z-index: 300;
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes works_modal_window_close {
    0% {
      opacity: 1;
      transform: translateY(0);
    }
    100% {
      transform: translateY(-30px);
      opacity: 0;
    }
  }

/* 複数モーダルここまで --------------------------------------------------------- */

/* アコーディオン --------------------------------------------------------- */
/*ベース*/
.toggle-s {
	display: none;
}
.summary-label {		/*タイトル*/
	padding: 0.6rem 1em;
	display: block;
	/*color: #fff;*/
	background: #bfb29838;
	cursor: pointer;
}
.summary-label::before{		/*タイトル横の矢印*/
	content:"";
	width: 12px;
	height: 12px;
	border-top: 2px solid #C9AA6A;
	border-right: 2px solid #C9AA6A;
	-webkit-transform: rotate(45deg);
	position: absolute;
	top:calc( 50% - 6px );
	right: 20px;
	transform: rotate(135deg);
}
.summary-label,
.summary-content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}
.summary-content {		/*本文*/
	height: 0;
	margin-bottom:10px;
	padding:0 20px;
	overflow: hidden;
}
.toggle-s:checked + .summary-label + .summary-content {	/*開閉時*/
	height: auto;
	padding:20px ;
	transition: all .3s;
}
.toggle-s:checked + .summary-label::before {
	transform: rotate(-45deg) !important;
}

/*概要アコーディオン ボタンデザイン*/

.accordion-area {
	width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}
.accordion-area dl {
	width: 90%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 0;
}
.accordion-area dt {
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.2rem;
    padding-bottom: 0.3rem;
}
.accordion-area dd {
	text-align: left;
	font-size: 90%;
}

.item-title {
	width: 90%;
    margin: 0;
}
.item-eng {
	position: relative;
    font-size: 120%;
    display: block;
    line-height: 1.5rem;
    word-break: break-all;
}
.item-jp {
	font-size: 87%;
	color: #b05505;
    display: block;
	line-height: 1.5rem;
    letter-spacing: 0.13em;
}
.summary-content span {
	font-size: 81%;
    padding-top: 1.2rem;
    display: inline-block;
}

/* アコーディオンここまで --------------------------------------------------------- */

/* 各ページのメインビジュアル --------------------------------------------------------- */

.main-visual {
	width: 90%;
    margin: 0 auto;
	position: relative;
}

/* 客室ページ --------------------------------------------------------- */
.position-room { object-position: 90% 30%; }


.position-twin-room { object-position: 0% 50%; } 
.position-connecting { object-position: 100% 50%; }
.position-connecting2 { object-position: 30% 50%; }
.position-creston-suite { object-position: 72% 50%; }


.beginning { margin-bottom: 3rem; }

.category {
	position: relative;
    top: 0;
    left: 0;
}
.category-title {
	text-align: left;
    position: absolute;
    top: 330px;
    left: 0;
	color: #a38c5f;
}
.category-title span {
	font-size: 1.8rem;
    padding: 1.11rem 1.8rem;
	letter-spacing: 0.18em;
    display: inline-block;
	background-color: #fffcfa;
    background-image: url(../img/common/subtle-white-feathers.png);
}
.title-frame { padding: 3rem 1.8rem 1.8rem; }


/* 客室紹介 --------------------------------------------------------- */

.slider-area {
    position: relative;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
	overflow: hidden;
}
.flex-slider-container {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: center;
	align-items: center;
}
.picture-frame { width: 100%; }
.text-frame {
    width: 90%;
    margin: 0 auto;
}
.text-frame-flex {
	width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    align-content: center;
    padding: 3rem 0 1.5rem;
}

.outline-title,
.overview {
	flex: 0 0 100%;
    max-width: 100%;
    padding-bottom: 1.2rem;
}
.eng-name {
    position: relative;
    font-size: 1.8rem;
    display: block;
    line-height: 1.8rem;
    word-break: break-all;
}
.jp-name {
    font-size: 69%;
    display: block;
    letter-spacing: 0.3em;
}

/*客室スペック（モーダルウィンドウ）*/
.modal-title {
    width: 75%;
    margin: 0 auto;
	padding: 0.9rem 0 0.6rem;
}
.modal-photo {
	width: 100%;
    height: 100%;
}

.modal-spec { padding: 1.5rem; }
.alongside {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
	margin-bottom: 1.8rem;
}
.alongside dt,
.modal-info dt {
	width: 30%;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
	font-weight: 500;
	font-style: normal;
	text-align: justify;
}
.alongside dd { width: 70%; font-weight: 400; }

.alongside dt:first-child,
.modal-info dt:first-child {
	width: 100%;
    border-bottom: 1px solid #24180f;
    padding-bottom: 0.3rem;
    margin-bottom: 1.2rem;
    font-size: 1.2rem;
    color: #24180f;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
	font-weight: 500;
	font-style: normal;
}
.modal-info dd { padding-bottom: 30px;}
.alongside dt,
.alongside dd,
.modal-info dd { font-size: 81%; }


/* 客室概要欄 --------------------------------------------------------- */
.summary-container { margin: 3rem 0; }
.summary-container-inner {
	width: 90%;
	max-width: 1800px;
    height: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    padding-bottom: 1.5rem;
	margin: 0 auto;
}
.summary-container-inner p { font-size: 90%; }

.tax dl {
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
    font-weight: 500;
    font-style: normal;
	font-size: 1.08rem;
}
.tax dt:first-child {
    width: 100%;
    border-bottom: 1px solid #3d495f;
    padding-bottom: 0.3rem;
    margin-bottom: 1.2rem;
    font-size: 1.2rem;
    color: #3d495f;
}
.tax dt {
    width: 80%;
    padding-bottom: 0.3rem;
	font-size: 1.08rem;
}
.tax dd {
    text-align: right;
    width: 20%;
	font-size: 1.2rem;
}

/* SDGs --------------------------------------------------------- */

.SDGs-area  {
	max-width: 1000px;
	width:90%;
    margin: 0 auto;
	padding: 3rem 0 6rem;
}
.SDGsLogo {
    width: 300px;
}
.SDGs h2 { font-size: 1.38rem; }
.SDGs {
    margin-top: 10px;
}
.SDGs dt {
    font-weight: bold;
}


/* レストラン --------------------------------------------------------- */
.position-restaurant {
    object-position: 50% 50%;
}
.position-nigome {
    object-position: -180px 0;
}
.action-button {
	width: 90%;
    margin: 0 1.8rem;
}
.action-button a {
	position: relative;
    color: #272624;
    padding: 0 0 0 1.2rem;
	display: inline-block;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1.17rem;
}
.action-button a::before {
	content:"";
	position: absolute;
	left: 0;
	top: 14px;
	width: 6px;
	height: 6px;
	border-top: 2px solid #c3983a;
	border-right: 2px solid #c3983a;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transition: left 0.2s ease;
    -moz-transition: left 0.2s ease;
    -o-transition: left 0.2s ease;
    transition: left 0.2s ease;
}

.action-button a:hover::before{
	left: 3px;
}


.action-button a:hover { color: #C9AA6A; }
.action-button p { margin-bottom: 0.3rem; }

.restaurant-area {
	position: relative;
    margin: 0 auto;
    padding: 3rem 0 0;
    box-sizing: border-box;
	background: linear-gradient(180deg, transparent 0%, transparent 20%, #202733 50%, #202733 100%);
}
.photo-loop {
	margin: 0 auto;
    padding: 0 0 9rem;
}

/* 朝食 */
.breakfast { padding: 0 0 3rem; }
/* 朝食タグ */
.ribbon {
    position: absolute;
    top: 0;
    font-size: 15px;
    background: #b05505;
    color: white;
    width: auto;
}
.ribbon span {
    display: block;
    font-size: 90%;
    padding: 10px;
}
/* ランチ */
.lunch-area {
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0;
}
.lunch-menu {
	width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 1.5rem 0 0;
}
.lunch-menu li { margin-bottom: 0.9rem; }

.lunch-menu dl {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 0;
}
.lunch-menu dt {
    font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.2rem;
    padding-bottom: 0.3rem;
}
.lunch-menu dd {
    text-align: left;
    font-size: 90%;
}


/* しゃぶ禅 */
.shabuzen { padding: 1.5rem 0 6rem; }
.shabuzen img {
	width: 90%;
	max-width: 900px;
	margin: 0 auto;
    display: block;
	padding-top: 1.5rem;
}


/* 宴会・会議 --------------------------------------------------------- */
.position-banquet { object-position: 51% 50%; }
.bitter-chocolate {
    background: #35271d;
    color: #ede6d7;
}
.dark-green {
	background: #203329;
    color: #ede6d7;
}
.venue-detail {
	display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 1.8rem 0 0 0;
}
.venue-detail dt:first-child {
    width: 100%;
    border-bottom: 1px solid #C6AC87;
    padding-bottom: 0.3rem;
    margin-bottom: 1.2rem;
    font-size: 1.2rem;
    color: #C6AC87;
    font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
    font-weight: 500;
    font-style: normal;
}
.venue-detail dt, .venue-detail dd { 
	color: #C6AC87;
    font-weight: 400;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
}
.venue-detail dt { width: 70%; }
.venue-detail dd { width: 30%; }


/*宴会場 料金表*/
.banquet-list-wrap { overflow-x: scroll; }
.banquet-list {
	width:100%;
	margin: 0 auto;
	border-collapse: collapse;
	white-space: nowrap;
}
.banquet-list table , td, th {
	border-top: 1px solid #a38a7c;
	border-left: 1px solid #a38a7c;
	border-right: 1px solid #a38a7c;
	border-bottom: 1px solid #a38a7c;
	border-collapse: collapse;
	vertical-align: middle;
    text-align: center;
}
.banquet-list th {
	background: #d9c8b7;
}
.banquet-list td {
	background: #ffffff59;
}
.tableitem th {
	background: #382d29;
	font-weight: normal;
	color: #fff;
	text-align: center;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
}
.banquet-list td, th { padding: 15px; }
.banquet-list .fixed {
	position: sticky;
    left: 0;
}
.banquet-list .fixed:before {
    content: "";
    position: absolute;
    top: 0;
    left: -1px;
    right: -1px;
    height: 100%;
    border-left: 1px solid #a38a7c;
    border-right: 1px solid #a38a7c;
}

/*宴会場 備品など*/
.equipment-list-wrap { overflow-x: scroll; }
.equipment-list {
	width:100%;
	margin: 0 auto;
	border-collapse: collapse;
	white-space: nowrap;
}
.equipment-list td, th {
	padding: 15px;
	width: auto;
	text-align: left;
}
.equipment-list th {
	background: #bfb29838;
	font-weight: 400;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
}


/* 施設案内 --------------------------------------------------------- */
.position-about {
    object-position: 50% 50%;
}
.camel {     /* フロントデスク背景 */
	background: #4f3316;
    color: #ede6d7;
}

/* クレジットカード */
.card-detail {
	display: flex;
	flex-direction: row;
	align-items: center;
}
.card-detail li {
	width: 60px;
	padding-right: 6px;
}
.card-detail li img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* 注意事項 */
.hints {
	font-size: 75%;
	margin: 1.5rem 0 0.3rem;
}
/* ホテルサービス */
.right-space {   /* Font Awesome */
	padding-right: 9px;
	-webkit-padding-right: 9px;
	color: #3d495f;
	/*font-size: 0.75rem;*/
}

.other-services dl {
	width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 1.5rem 0;
}
.other-services dt h4 {
	border-bottom: solid 1px #3d495f;
	color: #3d495f;
    padding-bottom: 0.39rem;
    margin-bottom: 1.2rem;
}
.other-services dd::before {
    font-family: "Font Awesome 5 Free";
    content: '\f111';
    font-size: 12px;
    font-weight: 900;
    margin-right: 4px;
    color: #C9AA6A;
}

.accordion-area .hotel-info {
	width: 100%;
	padding: 0.9rem 0 0;
}


/* アクセス --------------------------------------------------------- */
.access-area { padding: 6rem 0 0; }

.map-area { padding: 1.8rem 0 4.5rem; }
.map-address {
	width: 90%;
    margin: 0 auto;
    padding: 1.2rem 0;
	}
.guide-book {
	flex: 0 0 100%;
    max-width: 100%;
    padding: 5%;
    margin: 0;
}
.parking-container {
	width: 90%;
	max-width: 1200px;
    margin: 0 auto;
    margin-top: 2.1rem;
}
.parking {
	font-size: 150%;
	text-align: left;
	}
.parking-address {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
}
.parking-name {
	flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
    margin: 0;
}
.parking-name dd { text-align: left; }
.guide-contents dt {
	font-size: 120%;
    padding-bottom: 0.9rem;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
    font-weight: 500;
    font-style: normal;
}
.guide-contents li,
.guide-contents dd,
.parking-info li { padding-bottom: 0.9rem; }
.guide-contents a {
	font-size: 90%;
	color: #47556f;
}


/* 駐車場の説明 */
.translucent-b { background: #bfb29838; }
.parking-lot {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}
.map-box,
.guide-contents,
.parking-info {
	width: 100%;
    height: 100%;
    padding: 1.2rem 0;
}
.parking-info li::before {
	font-family: "Font Awesome 5 Free";
	content: '\f111';
	font-size: 15px;
	font-weight: 900;
	margin-right: 4px;
	color:#C9AA6A;
}
.guide-contents { padding: 1.2rem 0; }
.parking-map {
	width: 90%;
    margin: 0 auto;
    position: relative;
    height: 0;
    padding-top: 100%;
}
.parking-map iframe {
	border: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* 公共交通機関の説明 */
.access-container {
    width: 90%;
    max-width: 1200px;
	padding: 3rem 0 0;
    margin: 0 auto;
}
.traffic-info {
	position: relative;
    display: block;
    font-size: 1.5rem;
    text-align: left;
	letter-spacing: 0.13em;
    padding-bottom: 0.6rem;
    border-bottom: solid 2px #7e889a;
	line-height: 2.1rem;
}
.traffic-info:after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 2px rgba(3, 3, 3, 0.3);
    bottom: -2px;
    width: 30%;
}

.description,
.parking-guide { margin-bottom: 3rem; }
.description dt,
.parking-guide dt  {
    font-size: 1.2rem;
    margin: 2.4rem 0 0.6rem 0;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
    font-style: normal;
	color: #594200;
}
.description dd,
.parking-guide dd {
	font-size: 0.99rem;
    margin-bottom: 0.9rem;
    text-align: left;
}
.description dd::before {
	font-family: "Font Awesome 5 Free";
	content: '\f3c5';
	font-size: 15px;
	font-weight: 900;
	margin-right: 4px;
	color:#C9AA6A;
}
.parking-guide dd::before {
	font-family: "Font Awesome 5 Free";
	content: '\f111';
	font-size: 12px;
	font-weight: 900;
	margin-right: 4px;
	color:#C9AA6A;
}
.external-sites a {
    font-size: 90%;
    color: #3290d5;
}

/* ダイナミックパッケージ */
.dinamic-package {
	width: 90%;
    max-width: 350px;
    margin: 2.1rem auto 0;
}


/* よくあるご質問 --------------------------------------------------------- */
.position-faq { object-position: 90% 50%; }
.question-box { padding: 6rem 0 0; }
.faq-area {
	width: 100%;
    max-width: 1000px;
    margin: 2.1rem auto 0;
}
.faq-list {
	padding: 3rem 0;
    margin-top: -3rem;
    background: #bfb29838;
}
.faq-list ul {
	width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 0.6rem; /* marginと違い外側の余白は設定できない */
}
.faq-list li {
	width: 100%;
    text-align: center;
    background: #293140;
    margin-bottom: 0.6rem;
}
.faq-list a {
	width: 100%;
    color: #ede6d7;
    display: block;
    padding: 0.6rem 0;
}
.faq-list a:hover {
	width: 100%;
    background: #3d495f;
    display: block;
    padding: 0.6rem 0;
}

.query {
	font-size: 100%;
	color: #49311E;
    display: block;
    line-height: 1.5rem;
	padding-left: 2rem;
}
.query::before {
	content: 'Q';
    display: block;
    font-size: 1.5rem;
    position: absolute;
    left: 0.6rem;
	color: #C9AA6A;
}
.answer { padding-left: 2rem; }
.answer::before {
	content: 'A';
    display: block;
    font-size: 1.5rem;
    position: absolute;
    left: 0.75rem;
	color: #b05505;
	margin-top: -0.21rem;
}
.a-hints {
    font-size: 75%;
    margin: 1.5rem 0 0.3rem 2rem;
}
.faq-area dl {
	width: 90%;
    margin: 0 0 1.2rem 2rem;
}
.faq-area dt {
    font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
    font-weight: 500;
    font-style: normal;
    font-size: 1.2rem;
    padding-bottom: 0.3rem;
}



/* 宿泊約款 --------------------------------------------------------- */
/*.position-stipulation { object-position: 30% 50%; }*/

.stipulation-area {
	padding: 0 0 3rem;
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}
.stipulation-area dt {
	font-size: 120%;
    font-weight: 400;
    color: #3d495f;
    padding-bottom: 0.3rem;
}
.stipulation-area dd {
	padding-bottom: 0.9rem;
	font-size: 90%;
	letter-spacing: 0.06rem;
}
.stipulation-area li { padding-bottom: 0.39rem; }


/* 宿泊約款の表 */
.stipulation-area table {
	width: 100%;
	margin-bottom: 1.5rem;
}
.stipulation-area tbody {
    width: 100%;
    margin-bottom: 1.5rem;
    background: #fff;
	letter-spacing: normal;
    text-align: center;
	font-size: 90%;
}
.stipulation-area td {
	height: 75px;
	padding: 0 0.3rem 0 0.3rem;
	vertical-align: middle;
	border-right: solid 1px #999;
    border-bottom: solid 1px #999;
}
.stipulation-area td:first-child { border-left: solid 1px #999; }
.breakdown {
	background: #49311E;
    color: #fff;
    text-align: center;
    display: table-row;
}
.breakdown td {
	padding: 0.9rem;
    vertical-align: middle;
	border-right: solid 1px #b05505;
	border-bottom: none;
}
.text-left { text-align: left; }
/* 宿泊約款の表ここまで */

.revision {
	padding-top: 2.1rem;
    font-size: 90%;
    letter-spacing: 0.06rem;
    font-weight: 400;
    text-align: right;
}




/* 周辺スポット --------------------------------------------------------- */
.position-sightseeing { object-position: 30% 50%; }

.sightseeing-area {
	padding: 0;
	background-color: #fffcfa;
    background-image: url(../img/common/subtle-white-feathers.png);
}

.front_content{
	padding: 3.9rem 0;
}

.sightseeing-list {
	padding: 3rem 0;
    margin-top: -3rem;
}
.sightseeing-list a {
    width: 100%;
    color: #fff;
    display: block;
    padding: 0.6rem 0;
}
.sightseeing-list ul {
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 0.6rem;
}
.sightseeing-list li {
	width: 100%;
    text-align: center;
	background: #352c22;
    margin-bottom: 0.6rem;
}

.sightseeing-photo {
	width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0;
    height: 420px;
    object-fit: cover;
	filter: brightness(119%)saturate(194%)contrast(84%);
}

/* カード */
.card-area {
	max-width: 1200px;
    display: flex;
    justify-content: flex-start;
	flex-flow: column;
	z-index: 9;
	gap: 0 0.6rem;
}
.card-area li {
	width: 90%;
    margin: 0 auto 1.5rem;
}
.card-wrapper {
	margin: 1rem auto;
	width: 90%;
}

.card-wrapper:hover {
	transform: translateY(-5px);
	box-shadow: 0 7px 34px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08);
	transition: all .5s;
}
.card { background: #fff; }
.card-img {
	max-width: 100%;
    height: auto;
	vertical-align: bottom;
}
.card-content {
	width: 100%;
	height: 240px;
    margin: 0 auto;
}
.card-title {
	max-width: 100%;
    display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 0.9rem;
	padding: 0;
    color: #eceae8;
	background: #352c22;
	font-weight: 700;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
}
.card-title span { padding: 0.6rem 5%; }
.card-type {
    background: #279b35;
    font-family: source-han-sans-japanese, sans-serif;
    font-weight: 400;
    font-size: 75%;
    line-height: 1.9rem;
    text-align: center;
}
.turquoise { background: #0175ff; }
.vermilion { background: #e52c0c; }
.orange { background: #fd9a00; }
.magenta { background: #ca339b; }
.amber { background: #de5800; }
.peacock { background: #00a496; }
.larimar { background: #00a9d6; }
.card-content dd {
	width: 90%;
    margin: 0 auto;
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 0.9rem;
    font-family: source-han-sans-japanese, sans-serif;
}
.card-content dd b {
	font-size: 1.02rem;
	padding-right: 0.6rem;
	line-height: 1.8rem;
}
.card-content dd a { margin: 0 -0.24rem; }
.card-link ul {
	width: 100%;
	margin-bottom: 1.2rem;
}
.card-link li {
	font-weight: 400;
    font-size: 14px;
	margin: 0;
	display: table-row;
}
.card-link a {
	text-decoration: none;
	color: #352c22;
	font-size: 81%;
}
.card-link a:hover {
	color: #3290d5;
}
/* カードここまで */

.attention {
	width: 90%;
    max-width: 1000px;
    margin: 0 auto 1.5rem;
	display: flex;
    justify-content: center;
	font-family: source-han-serif-japanese, 'Shippori Mincho', serif;
    font-weight: 500;
    font-style: normal;
}

/* アテンション --------------------------------------------------------- */
.attention-btn {
    background: #202733;
    color: #cfcdc9;
}
.attention-btn::before {
	border-top: 2px solid #cfcdc9;
    border-right: 2px solid #cfcdc9;
}

/* プラン一覧ページ--------------------------------------------------------------------------------------------------------------------- */
.food-type01,
.food-type02,
.food-type03 {
	width:100%;
	background: #948973; /* 基本色 */
	padding: 1% ;
	margin-bottom: 0;
	text-align: center;
	color: #fff;
	font-size: smaller;
	z-index: 2;
}
.food-type02 { background: #a07249; }/*朝食付*/
.food-type03 { background: #935b5b; }/* 2食付など、赤系 */
.food-type04 { background: #92935b; }/* その他、黄緑系 */
.food-type05 { background: #6c8668; }/* その他、青緑系 */
.stay-area { padding: 6rem 0 0; }
.recommended-container {
    width: 90%;
	max-width: 1000px;
    margin: 2.4rem auto;
}
.recommended-container li {
	width: 100%;
    background: #2c2c2c;
}
.recommended-container ul,
.recommended-container .list-card {
	width: 100%;
    display: flex;
    flex-direction: column;
	flex-wrap: wrap;
    align-items: stretch;
    gap: 1.2rem;
}
.recommended-container li a {
	display: flex;
    flex-direction: row;
    align-items: center;
}
.plan-photo,
.plan-photo-s {
    width: 40%;
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin: 0;
    padding: 0;
	overflow: hidden;
}
.plan-photo img,
.plan-photo-s img {
	width: 100%;
    vertical-align: bottom;
	transition: transform .6s ease;
}
.plan-photo:hover img,
.plan-photo-s:hover img  {transform: scale(1.1); }
.plan-title,
.plan-title-s {
    width: 60%;
	padding: 0.6rem;
    color: #efeae8;
	font-size: 0.99rem;
}
.plan-photo-s { width: 30%; }
.plan-title-s { width: 70%; }


/* プレミアムクラブバナー欄--------------------------------------------------------------------------------------------------------------------- */
.premiumclub-contener {
	width: 100%;
    max-width: 1350px;
    margin: 0 auto;
	overflow: hidden;
}
.premiumclub-contener img {
	width: 100%;
    vertical-align: bottom;
	transition: transform .6s ease;
}
.premiumclub-contener:hover img { transform: scale(1.1); }

.premiumclub-banner { opacity: 0; }
.premiumclub-banner.visible {
  -webkit-animation: scale-in-center 0.5s forwards;
          animation: scale-in-center 0.5s forwards;
  opacity: 1;
}
@-webkit-keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}

/*プレミアムクラブ会員募集ページ-------------------------------------------------------------------------*/
.premium-club-area { padding: 0; font-family: source-han-serif-japanese, 'Shippori Mincho', serif; font-weight: 400; font-style: normal; }
.premiumBox{display: flex; flex-direction: column; justify-content: center; width:90%; max-width: 1000px; margin: 0 auto; }
.premiumBoxInner img{width: 100%; vertical-align: bottom; }
.premiumBoxInner02{ margin: 6% 0 6.9%;}
.premiumBtn{width: 100%; max-width: 1000px; display: block; margin: 10% auto 0; }
.premiumBtn .catchphrase{color:#49311E; width: 100%;display: block; font-size: 140%; text-align: center; margin: 0 auto;}
.pBtn-con{ width: 100%; display: flex;flex-direction: column;justify-content: center; }
.pBtn-con div{ width: 90%; color: #fff; background: #293140; margin:2% auto 5%;text-align: center; letter-spacing: 0.09em; }/*ボタン1つ*/
.pBtn-con div a{color: #fff;display:block; width:100%;padding:3%;}/*ボタン1つ*/
.pBtn-con div a:hover{background:#dcd5d7;color:#49311E;}/*ボタン1つ*/
.pBtn-con02{ width: 100%; display: flex;flex-direction: column;justify-content: center; }
.pBtn-con02 div{ width: 90%; background: #898989; margin:0% auto 5%;text-align: center; letter-spacing: 0.09em; }/*ボタン2つ*/
.pBtn-con02 div a{color: #fff; display:block; width:100%;padding:3%;}/*ボタン2つ*/
.pBtn-con02 div a:hover{background:#dcd5d7; color:#49311E;}/*ボタン2つ*/
.p-nav01{background:#dcd5d7;}
.p-nav02{margin:0 5% 5%;}

/*会員特典表組---------------*/
h2.TokutenTit{color: #222; font-size: 120%; font-weight: 600; margin-bottom: 2em;text-align: center; margin:0 0 1em; }
h2.TokutenTit .underColor{display: inline-block; background: linear-gradient(transparent 90%, #D8CC9C 90%); padding: 0 2em 0.99em; line-height: 1.5rem; }
#kaiinTokuten tr, #kaiinTokuten th, #kaiinTokuten td { border: 1px solid #888888; padding: 0.5em;}
#kaiinTokuten { width: 100%; text-align: center; line-height: 120%;}
#kaiinTokuten th { background-color: #01436f; text-align: center; white-space: normal; }/*元の紺色#172C68*/
#kaiinTokuten td { vertical-align:middle; text-align: center;background: #fffef9;}
#kaiinTokuten th.left , #kaiinTokuten td.left {text-align: left; }
.whiteTxt { color: #fff;}
.blackTxt { color: #000;}
.goldBack{
	background: linear-gradient(-20deg, #D3A900 0%, #D8CC9C 100%);
}
.diaBack{
  background: #E8B92F;/* 枠線の色*/
	background: linear-gradient(-20deg, #7A98D3 0%, #E5EBF9 100%);
}

/* プラン一覧のpremiumclubバナー -------------------------------------------------------------------------*/
.premiumclub-banner-area {
	width: 90%;
    max-width: 1000px;
}

/* スマホ 会員ログイン、HMIプレミアムプランボタン追加 -------------------------------------------------------------------------*/
.member-login a { background: #293140; }
.hmi-pc-info a {
	background: none;
	color: initial;
	border: 1px solid #C9AA6A;
}
.member-login a:hover,
.hmi-pc-info a:hover {
	background: #dcd5d7;
	color: #49311E;
}
.hmi-pc-info a:hover { border: none; }






/*====================================================================================
ここからタブレット
======================================================================================*/

@media (min-width: 768px) {

/* 各ページのメインビジュアル --------------------------------------------------------- */

.main-visual {
	width: 96%;
    margin: 0 auto;
	position: relative;
}

/* 客室・ホテル概要アコーディン --------------------------------------------------------- */
/*概要ボタンデザイン*/
.accordion-area { width: 90%; }
.accordion-area dl { width: 100%; }

/* ------works_modal css------ */
.works_modal_window {
    width: 84vw;
    height: 84vh;
}
.modal-spec {
    width: 90%;
    margin: 1.2rem auto;
}
.alongside dt, .alongside dd, .modal-info dd { font-size: 0.9rem; }
.alongside dt { width: 30%; }
.alongside dd { width: 70%; }
	
	
	
/* 客室ページ --------------------------------------------------------- */
.category-title { top: 350px; }
.category-title span {
	font-size: 180%;
	padding: 1.11rem 2.1rem;
	display: inline-block;
}
.title-frame { padding: 3.9rem 2.1rem 2.1rem; }


/* 客室紹介 --------------------------------------------------------- */
.text-frame-flex {
	width: 100%;
    height: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 3rem 0;
}

.text-frame { width: 100%; }
.outline-title {
	flex: 0 0 50%;
    max-width: 50%;
    padding: 0 3rem;
}
.overview {
	flex: 0 0 50%;
    max-width: 50%;
    padding: 0 3rem 0 0;
}
.eng-name {
	font-size: 1.8rem;
	line-height: 1.98rem;
	text-align: center;
	}
.jp-name {
    font-size: 69%;
    display: block;
    letter-spacing: 0.3em;
    text-align: center;
}

/* 客室概要 --------------------------------------------------------- */
.tax dt { width: 50%; }
.tax dd { width: 50%; text-align: left; }

/* レストラン --------------------------------------------------------- */
.position-restaurant {
    object-position: 96% 50%;
}
.position-nigome {
    object-position: 30% 50%;
}
.action-button ul { justify-content: center; }

/* ランチ */
.lunch-area {
	display: flex;
    align-items: center;
    padding: 0;
    margin: 1.5rem auto 0;
}


/* アクセス --------------------------------------------------------- */
.map-area { padding: 3rem 0 6rem; }
.map-address {
	display: flex;
	align-items: center;
	padding: 1.2rem 0 0;
    margin: 0 auto -0.9rem;
    max-width: 690px;
}

.map-box { padding: 1.2rem; }
.parking-map {
	width: 100%;
	padding-top: 60%;
}

/* 公共交通機関の説明 */
.traffic-info { padding-bottom: 0; }



/* よくあるご質問 --------------------------------------------------------- */
.faq-list li {
    width: 32%;
    text-align: center;
    background: #293140;
    margin-bottom: 0.6rem;
}

	

/* 宿泊約款 --------------------------------------------------------- */
.stipulation-area dt { padding: 1.5rem 0 0.6rem; }



/* 周辺スポット --------------------------------------------------------- */
.sightseeing-photo { height: auto; }
.sightseeing-list li {
    width: 36%;
    text-align: center;
    margin-bottom: 0.6rem;
}


/* カード */
.card-area {
    width: 90%;
    margin: 1.8rem auto;
    flex-flow: row wrap;
}
.card-content { height: 270px; }
.card-area li {
	width: 49.3%;
	margin: 0 0 1.5rem;
}
/* カードここまで */
	
	
/* プラン一覧ページ-------------------------------------------------------------------------------------------------- */
.recommended-container { margin: 3rem auto; }
.recommended-container ul { flex-direction: row; }
.recommended-container .plans-4-rows {
	flex-direction: row;
	justify-content: start;
}
.recommended-container .plans-3-rows {
	flex-direction: row;
	justify-content: center;
}
.recommended-container li { width: 31.2%; }
.recommended-container .list-card li { width: 22.8%; }
.recommended-container li a { flex-direction: column; }
.plan-photo,
.plan-photo-s { width: 100%; }
.plan-title,
.plan-title-s {
    width: 100%;
    padding: 0.99rem;
}
.food-type01,
.food-type02,
.food-type03 { font-size: initial; }
	
	/* タブレット 会員ログイン、HMIプレミアムプランボタン追加 -------------------------------------------------------------------------*/
	.premium-club-tablet { margin-top: 0.6rem; }
	
	/*プレミアムクラブ会員募集ページ-------------------------------------------------------------------------*/
	.premiumBoxInner02{ background: #fffef9; padding: 3%; margin: 0 0 6%;}
	.premiumBtn{ width: 90%; }
	h2.TokutenTit .underColor { padding: 0 2em 0.6em; }
	.pBtn-con{ flex-direction: row; justify-content: space-between; flex-wrap: nowrap; }
	.pBtn-con div{width:48%; margin: 1.2rem auto 0.3rem; font-size: 120%; }
	.pBtn-con02{ flex-direction: row; justify-content: space-between; flex-wrap: nowrap; font-size: 120%; }
	.pBtn-con02 div{width:48%;background:#9f978d; margin:2% 0% 2% 0;text-align: center;}
	.pBtn-con02 .p-nav02{margin:2% 0 2% 0;}
	.premiumBtn .catchphrase{font-size: 200%; }
	h2.TokutenTit{font-size: 140%; }
	#kaiinTokuten tr, #kaiinTokuten th, #kaiinTokuten td { padding: 20px 10px;}
	#kaiinTokuten th.left , #kaiinTokuten td.left {text-align: left; padding-left: 20px;}

}

/*====================================================================================
ここからPC
======================================================================================*/

@media (min-width: 1000px) {

/* 客室ページ --------------------------------------------------------- */
.position-access { object-position: 50% 30%; }
.category-title { top: 470px; }
.category-title span {
    font-size: 300%;
    padding: 2.4rem;
}

/* 客室紹介 --------------------------------------------------------- */
.flex-slider-container {
    flex-direction: row;
	height: 600px;
}
.picture-frame {
	flex: 0 0 65%;
    max-width: 65%;
	padding:0;
    margin: 0;
}	
.text-frame {
    flex: 0 0 35%;
    max-width: 35%;
    padding: 0;
    margin: 0;
}	
.text-frame-flex {
    width: 100%;
	max-width: 480px;
    margin: 0 auto;
    height: auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 0 3rem;
}	
.outline-title,
.overview {
	flex: 0 0 100%;
    max-width: 100%;
	padding: 0 0 1.2rem 0;
}
.eng-name { font-size: 1.5rem; }
.between-s { font-size: 93%; }


/*客室スペック（モーダルウィンドウ）*/
.works_modal_window {
    width: 81vw;
    height: 81vh;
}
.room-name { font-size: 240%; }
	
.modal-photo,
.modal-spec {
	width: 50%;
    height: 100%;
}
.modal-photo { padding-left: 2.1rem; }
.modal-spec {
	padding: 0 2.1rem;
	margin: 0 auto;
}

/* 客室概要欄 --------------------------------------------------------- */
.summary-container-inner p { font-size: 100%; }

	

/* レストラン --------------------------------------------------------- */
.position-restaurant {
    object-position: 50% 70%;
}
.action-button {
    width: 93%;
    margin: 0 auto;
}

.restaurant-area { padding: 1.2rem 0 0; }

/* しゃぶ禅 */
.shabuzen { padding: 6rem 0; }
.shabuzen img { padding-top: 3rem; }

/* 宴会・会議 --------------------------------------------------------- */
/*宴会場 料金表*/
.banquet-list-wrap::-webkit-scrollbar,
.equipment-list-wrap::-webkit-scrollbar { display: none; }
.banquet-list-wrap,
.equipment-list-wrap {
	overflow-x: scroll;
	/*IE(Internet Explorer)・Microsoft Edgeへの対応*/
	-ms-overflow-style: none;
	/*Firefoxへの対応*/
	scrollbar-width: none;
}
.equipment-list th { font-weight: 500; }



/* 施設案内 --------------------------------------------------------- */
.position-about {
    object-position: 50% 24%;
}


/* アクセス --------------------------------------------------------- */
.access-area { padding: 6rem 0 3rem; }
.guide-book {
	flex: 0 0 50%;
    max-width: 50%;
    padding: 1.8rem 2.1rem 1.8rem;
    margin: 0;
}


/* よくあるご質問 --------------------------------------------------------- */
.question-box { padding: 6rem 0 3rem; }



/* 宿泊約款 --------------------------------------------------------- */
.position-stipulation { object-position: 50% 45%; }

/* 周辺スポット --------------------------------------------------------- */
.position-sightseeing { object-position: 50% 100%; }
.card-area { margin: 4.5rem auto; }
.card-area li { width: 32.6%; }


/* パララックスここから */
.parallax-shibuya {
	padding: 180px 0;
    background: url(../img/sightseeing/shibuya-cityscape.jpg);
	filter: brightness(114%)saturate(180%)contrast(69%);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: right 66% top 0%;
}
.parallax-tokyo {
	padding: 180px 0;
    background: url(../img/sightseeing/tokyo-cityscape.jpg);
	filter: brightness(114%)saturate(180%)contrast(69%);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: right 33% top 0%;
}

.parallax-shibuya,
.parallax-tokyo	{
	padding: 390px 0;
}

/* パララックスここまで */



/* プラン一覧ページ-------------------------------------------------------------------------------------------------- */
.recommended-container li { width: 31.8%; }
.recommended-container .list-card li { width: 23.4%; }

}


@media (min-width: 1300px) {

/* モーダル表示上から --------------------------------------------------------- */
.modal_content { width: 54%; }

/* 客室ページ --------------------------------------------------------- */
.position-connecting2 { object-position: 10% 50%; }
.position-creston-suite { object-position: 81% 50%; }

.category-title { top: 540px; }
.category-title span {
    font-size: 330%;
    padding: 2.7rem 3.6rem;
}
.title-frame { padding: 6rem 3.6rem 3rem; }	
.text-frame-flex { padding: 0 3rem; }


/* 客室紹介 --------------------------------------------------------- */
.flex-slider-container {
    flex-direction: row;
	height: 533px;
}

/* 客室概要 --------------------------------------------------------- */
.summary-container { margin: 6rem 0; }
.summary-container-inner {
	width: 90%;
	max-width: 1800px;
    height: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    padding-bottom: 1.5rem;
	margin: 0 auto;
}


/* レストラン --------------------------------------------------------- */
.position-nigome { height: 900px; }

/* レストラン一覧リンクボタン */
.action-button a { font-size: 1.5rem; }
.action-button a::before {
	top: 18px;
	width: 6px;
    height: 6px;
}
.restaurant-area { padding: 2.1rem 0 0; }

/* 朝食 */
.breakfast { padding: 1.5rem 0 3rem; }


/* 宴会・会議 --------------------------------------------------------- */
.position-banquet { object-position: 50% 100%; }


/* アクセス --------------------------------------------------------- */
.parking-container {
    display: flex;
    align-items: center;
}
.parking-name {
	flex: 0 0 50%;
    max-width: 50%;
    padding: 0;
    margin: 0;
}
.parking {
	text-align: center;
	font-size: 150%;
}
.parking-name dd { text-align: center; }
.parking-address {
    flex: 0 0 50%;
    max-width: 50%;
}
	
	


}

@media (min-width: 1500px) {

.flex-slider-container { height: 810px; }
.eng-name {
	font-size: 2.4rem;
	line-height: 2.4rem;
}
/*客室スペック（モーダルウィンドウ）*/
.works_modal_window {
    width: 60vw;
    height: 75vh;
}
	
	/* プレミアムクラブバナー欄--------------------------------------------------------------------------------------------------------------------- */
	.premiumclub-contener { margin: 3rem auto -1.5rem; }

}


@media (min-width: 1800px) {
/* 客室紹介 --------------------------------------------------------- */	
.picture-frame {
	flex: 0 0 70%;
    max-width: 70%;
	padding:0;
    margin: 0;
}	
.text-frame {
    flex: 0 0 30%;
    max-width: 30%;
    padding: 0;
    margin: 0;
}


/* プラン一覧ページ-------------------------------------------------------------------------------------------------- */
.recommended-container li { width: 32%; }
.recommended-container .list-card li { width: 23.5%; }
	
}