@charset "utf-8";
/* CSS Document */


/* 基本設定： ページ全体 */

img[src$=".svg"] {
    width: 100%;
	line-height: 0;
	font-size: 0;
}

* {-webkit-box-sizing: border-box;
   -ms-box-sizing: border-box;
   -moz-box-sizing: border-box;
   -o-box-sizing: border-box;
   box-sizing: border-box;
  }
  
html {
  scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans",sans-serif;
	font-weight: 500;
	line-height: 30px;
	font-size:0.9em;
	line-height: normal;
	color:#333;
	width:100%;
	-webkit-text-size-adjust: 100%;
}

.mincho { font-family: 'Shippori Mincho', serif;}
.gothic { font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans",sans-serif;}

/*.bnr { filter: drop-shadow( 2px 2px 2px  rgba(33, 33, 33, 0.6));}
.bnr-wrap { box-shadow: 2px 2px 2px rgba(33, 33, 33, 0.3);}*/

.bnr , .bnr-wrap {
  margin: 0;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
}

/*----文字の装飾・マージン等----*/
.font-60 { font-size:60% !important;}
.font-70 { font-size:70% !important;}
.font-80 { font-size:80% !important;}
.font-90 { font-size:90% !important;}
.font-110 { font-size:110% !important;}
.font-120 { font-size:120% !important;}
.font-130 { font-size:130% !important;}
.font-140 { font-size:140% !important;}
.redText { color: #C00;}
.bold { font-weight: bold;}
.whiteText { color: #fff;}

.margintop-1 { margin-top: 1% !important;}
.margintop-2 { margin-top: 2% !important;}
.margintop-3 { margin-top: 3% !important;}
.margintop-4 { margin-top: 4% !important;}
.margintop-5 { margin-top: 5% !important;}
.marginbottom-1 { margin-bottom: 1% !important;}
.marginbottom-2 { margin-bottom: 2% !important;}
.marginbottom-3 { margin-bottom: 3% !important;}
.marginbottom-4 { margin-bottom: 4% !important;}
.marginbottom-5 { margin-bottom: 5% !important;}
.marginbottom-10 { margin-bottom: 10% !important;}

.center { text-align: center;}

.wavy { text-decoration:#f00 wavy underline;}

a.arrow-white p{
	text-decoration:none;
	color:#fff;
	display:inline-block;
	padding-right:16px !important;
	position:relative;
}
a.arrow-white p:before,
a.arrow-white p:after{
	content:"";
	display:block;
	position:absolute;
}
a.arrow-white p:before{
	border-right:1px solid #fff;
	border-top:1px solid #fff;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	width:8px;height:8px;
	right:0;top:50%;
	margin-top:-4px;
}
a.arrow-white p:after{
	width:12px;
	border-bottom:1px solid #fff;
	right:0;top:50%;
}

a.arrow-black p{
	text-decoration:none;
	color: #333;
	display:inline-block;
	padding-right:16px !important;
	position:relative;
}
a.arrow-black p:before,
a.arrow-black p:after{
	content:"";
	display:block;
	position:absolute;
}
a.arrow-black p:before{
	border-right:1px solid #333;
	border-top:1px solid #333;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	width:8px;height:8px;
	right:0;top:52.5%;
	margin-top:-4px;
}
a.arrow-black p:after{
	width:12px;
	border-bottom:1px solid #333;
	right:0;top:50%;
}
a.arrow-black p:hover { text-decoration:underline;}

/*----文字の装飾・マージン等----*/

#attention { background-color:#FFF; background-size:cover; border-radius: 10px; margin-top: 3%; padding: 5%;}
.blueBack { background-color:#3FF; background-size:cover; padding: 0.5% 1%!important;}
.underline { text-decoration: underline;}

/*ホバーエフェクト*/
.bnr img , .bnr-wrap img {
  transform: scale(1);
  transition: .4s ease-in-out;
}
.bnr:hover img , .bnr-wrap:hover img {
  transform: scale(1.05);
}

/* java： fadeInUp fadeInDown */

.animation {
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
	visibility:hidden;
}

.fadeInUp {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:2s;
 -ms-animation-duration:2s;
 animation-duration:2s;
 -webkit-animation-name: fadeInDown;
 animation-name: fadeInDown;
 visibility: visible !important;
}

@-webkit-keyframes fadeInDown {
 0% {  opacity: 0; -webkit-transform: translateY(40px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

/*----youtube----*/

.frame-wrapper__video {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
  margin-bottom: 10px;
}

.frame-wrapper__video iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

/*----clearfix----*/

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix {
	display: inline-table;
	min-height: 1%;
}

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */


/*外国語リンク*/
.languageBtn {}
.languageBtn select{
	padding:8.25px;
	background: none; border: #999 1px solid; border-radius: 0; color:#666;
}
.languageBtn option{
	padding:9px;
	background: #FFF; border: #999 1px solid; border-radius: 0; color:#666;
}

/*よくある質問リンク*/
.faqBtn { width:180px; padding: 0 15px 0; background-color: #ceb68d; font-size: 85%; height: 36px; line-height:36px; color:#FFF; border-radius: 0 30px 30px 0;}
.faqBtn:hover { opacity:0.8;}
.faqBtn a { color:#FFF;}

/* グローバルナビ */

/*サイドメニュー*/

#slideMenu-top { display: block;}

.side-open #mainContainer,
.side-open .overlay {
	-webkit-transform: translate3d(-300px, 0, 0);
	transform: translate3d(-300px, 0, 0);
}

.overlay {
	content: '';
	visibility: hidden;
	position: fixed;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0);
	-webkit-transition: all .5s ease;
	transition: all .5s ease;
	z-index: 100;
}

.side-open .overlay {
	visibility: visible;
	cursor: pointer;
	background: rgba(0,0,0,.7);
}

.overlay::after {
	content: "";
	visibility: hidden;
	position: fixed;
	top: 40%;
	left: 0;
	display: block;
	width: 100%;
	height: 50px;
	color: rgba(255,255,255,0);
	font-size: 40px;
	font-weight: bold;
	text-align: center;
	-webkit-transition: all .5s ease;
	transition: all .5s ease;
}

.side-open .overlay::after {
	visibility: visible;
	color: rgba(255,255,255,.8);
}

/* margin打消し */

.noMargin dl.table {
	margin: 0 !important;
	}
	
.noMargin dl {
	margin: 0 !important;
	}
	
.noMargin-bottom {
	margin-bottom: 0 !important;
	}

/* --------------------------------------------------- btn */
.btn__box {
	position: relative;
	text-align: center;
	z-index: 1;
}

.btn__box a {
	display: block;
	width: 198px;
	height: 38px;
	margin: 0 auto;
	line-height: 40px;
	font-size: 13px;
	color: #1a1e24;
	-webkit-transition: all .3s ease;
	transition: all .3s ease;
	border: 1px solid #1a1e24;
}

.btn__box a:hover {
	color: #fff !important;
	background: #1a1e24;
}

.btn__box--svg {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 214px;
	height: 54px;
	margin: auto;
	z-index: -1;
}

.btn__box--svg rect {
	fill: transparent;
	stroke: #1a1e24;
	stroke-width: 1px;
	stroke-dasharray: 242px;
	stroke-dashoffset: 256px;
	-webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

.btn__box a:hover + .btn__box--svg rect {
	stroke-width: 2px;
	stroke-dasharray: 600px;
	stroke-dashoffset: 0;
}

/* --------------------------------------------------- side menu */
.side-menu {
	position: absolute;
	top: 0;
	right: 0;
	box-sizing: border-box;
	width: 300px;
	height: 100%;
	padding: 100px 0 2000px;
	text-align: left;
	background: linear-gradient(rgba(0,0,0,1),rgba(0,0,0,0));
	z-index: 1;
}

.side-menu__ul {
	width: 100%;
	height: 100%;
	display: block ;
	overflow: visible;
}

.side-menu__ul--child {
	display: none;
}

.active .side-menu__ul--child {
	display: block;
}

.side-menu__ul--child li a {
	display: block;
	padding: 8px 0 8px 32px;
	font-size: 15px;
	color: #eee;
}

.side-menu__ul > li > a,
.side-menu__ul > li h4 {
	display: block;
	padding: 10px 0 10px 20px;
	color: #fff;
}

.side-menu__ul h4 {
	cursor: pointer;
	-webkit-transition: all .5s;
	transition: all .5s;
	text-align:left !important;
}


.side-menu__ul > li h5 {
	display: block;
	padding: 10px 0 10px 20px;
	color: #fff;
}


.side-menu__ul > li > h4:after {
	content: ' +';
	color: #C00;
	font-size: 24px;
}

.side-menu__ul > li.active h4:after {
	content: ' -';
}

.side-menu__ul > li > h4:hover,
.side-menu__ul > li a:hover {
	background: #f26964;
	color: #fff;
}

.children {
	padding-left: 10px !important;
	}

.login_btn { background: #f26964; margin-bottom: 2px; padding: 3px 0 3px; }/*会員ログインボタン追加202509*/
.hg_premium { background: #535353; margin-bottom: 10px; padding: 3px 0 3px; }

/* --------------------------------------------------- ellipsis btn 右上開閉ボタン*/
.side-menu-btn {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 40px;
	height: 40px;
	padding: 0px;
	cursor: pointer;
	z-index: 4;
}

.ellipsis-v {
	position: relative;
	display: block;
	cursor: pointer;
	width: 40px;
	height: 30px;/* ハンバーグの高さ */
}

.ellipsis-v .point {
	position: absolute;
	left: 0;
	right: 0;
	display: block;
	width: 40px;
	height: 5px;
	margin: auto;
	background: #036;
	transition: all .3s;
}

.ellipsis-v .point.top {
	top: 0;
}

.ellipsis-v .point.mid {
	top: 0;
	bottom: 0;
}

.ellipsis-v .point.bot {
	bottom: 0;
}

.side-menu-btn:hover .top {
	-webkit-transform: translateY(-2px);
	-ms-transform: translateY(-2px);
	transform: translateY(-2px);
}

.side-menu-btn:hover .bot {
	-webkit-transform: translateY(2px);
	-ms-transform: translateY(2px);
	transform: translateY(2px);
}

.side-open .side-menu-btn:hover .top,
.side-open .top {
	width: 42px;/* ×の長さ */
	height: 2px;
	background: #fff;
	-webkit-transform-origin: left top;
	-ms-transform-origin: left top;
	transform-origin: left top;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.side-open .mid {
	opacity: 0;
}

.side-open .side-menu-btn:hover .bot,
.side-open .bot {
	width: 42px;/* ×の長さ */
	height: 2px;
	background: #fff;
	-webkit-transform-origin: left bottom;
	-ms-transform-origin: left bottom;
	transform-origin: left bottom;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.side-open .side-menu-btn:hover .bot,
.side-open .side-menu-btn:hover .top {
	background: #ccc;
}
/*----サイドメニューここまで----*/

nav#globalNavi { display:none;}
/*----topnav----

/* グローバルナビここまで*/

#mainContainer {
	scroll-snap-type: y mandatory;
	position: relative;
	width: 100%;
	-webkit-transition: all .5s ease;
	transition: all .5s ease;
	z-index: 2;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	background-color:#f8f2de;
}

header {
	width: 100%;
	height: auto;
	background: #f8f2de;
	}

.header-inner {
	max-width: 100%;
	display: flex;
	justify-content:space-between;
	padding: 2%;
}

#header-logo { margin-top: 12px;}
	
.header-inner img {
	max-width: 230px;
}

.header-items { display: none;}

.header-items img:hover { opacity: 0.8;}

main { width:100%;}

article #mainImage {
	display: flex;
	justify-content: center;
	align-items: end;
	overflow: hidden;
	height: 40vh;
	margin: 0 auto 0;
}

article #mainImage img { width: 100%; height:auto; min-width: 530px;}

#h1-back { position: relative; max-width: 1000px; margin: 0 auto;}
#h1-back img{ width: 30%; position:absolute; top: 20px; left: 10px; z-index: -1; aspect-ratio: 1 / 1;}

#h2-back { position: relative; max-width: 1000px; margin: 0 auto;}
#h2-back img{ width: 30%; position:absolute; top: 0px; left: 20px; z-index: -1; }

.onePoint-back { position: relative; max-width: 1000px; margin: 0 auto;}

.onePoint-back img{ width: 54px; height: 54px; position:absolute; top: -10px; left: -10px; z-index: -1; opacity: 0.7;}

h1 { margin: 15% 0 8% ; font-size: 160%; letter-spacing: 0.1em;}

#h1-text { font-size: 110%; margin: -2% 0 5% 2%; line-height: 150%;}

h2 { font-size: 140%; line-height: 150%; letter-spacing: 0.05em;}
h3 { font-size: 135%; line-height: 140%; letter-spacing: 0.05em;}
section h2 { margin: 2% 0 3% ;}


section { width: 90%; height:auto; margin: 0 auto 10%;}
section:last-child { margin: 0 auto 0;}

#nami  {
    width: 100%;
    height: 50px;
    padding-top: 10%;
		background:url(../img/svg/nami.svg) center center no-repeat;
    background-size: cover;
}

#bg-gry { background-color: #e3dfdd; margin-top: -2%;}


/*ページトップへあがるボタンここから*/

.pagetop {
  height: 55px;
  width: 55px;
  position: fixed;
  right: 10px;
  bottom: 205px;/*元70pxから変更*/
	background-color:#c29859;
  border: none;/*線なし*/
  border-radius: 50%;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 2;
  cursor: pointer;
  opacity: 0.6;
}
.pagetop__arrow {
  display: block;
  height: 15px;
  width: 15px;
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
  transform: translateY(20%) rotate(-45deg);
}

/*ページトップへあがるボタンここまで*/

/* ダイレクトインボタンここから*/

#goyoyakuBtn {
	position: -webkit-sticky; /* Safariに対応する */
	position: sticky; /* 要素を固定/解除する */
	bottom: 0; 
	z-index: 1;
}

#goyoyakuBtn a { text-decoration:none;}

.goyoyakuBtnInner {
	width:120px;
	height:60px;
	border-radius: 100px 100px 0 0;
	background:#dd0000;
	margin: 0 auto ;
	padding: 20px 10px 0;
	color:#FFF;
	text-align:center;
	font-size: 120%;
    display: block;
}

/* ダイレクトインボタンここまで*/

/*予約追従ボタンここから*/

.reserve_folliwing {
  height: 55px;
  width: 55px;
  position: fixed;
  right: 10px;
  bottom: 150px; /*元15pxから変更*/
  background: #D02C1F;
  border: none;/*線なし*/
  border-radius: 50%;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 2;
  cursor: pointer;
  opacity: 0.8;
}
.reserve_folliwingInner{
  display: block;
  font-size:16px;
	font-weight: 600;
}
.reserve_folliwingInner a{color:#fff;}

/*予約追従ボタンここまで*/

footer { background:#e3dfdd; position:relative;}

#footer-top {
	background:url(../img/svg/footerBg.svg) center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 50px;
    padding-top: 0%;
}

.editorial2 {
  display: block;
  width: 100%;
  height: 200px;
  margin: 0 0 ;
  z-index:5;
  position:absolute;
  left:0px;
  float:left;
}

#footer-inner { background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9)) ,url(../img/common/navBg.png);}

#footer-box { width: 90%; margin: 0 auto 0;}
#hmiLogo { width: 40%; margin-bottom: 2%;}
#footerLogo { width: 65%; margin-bottom: 1.5%;}
#hmiLogo img , #footerLogo img { width: 100%;}
address dl { color:#FFF; }
address dl dt { font-size: 120%; font-weight: 600; margin: 0 0 1%;}
address dl dd#add { font-size: 110%;}
address dl dd#tel { font-size: 160%; font-family: 'Noto Sans JP', sans-serif; font-weight:bold; letter-spacing: 2px;}
address dl dd#tel a{ color:#FFF;}
address dl dd#tel-reserve { display:flex; margin-top: 3%; font-size: 130%; font-family: 'Noto Sans JP', sans-serif; font-weight:bold; letter-spacing: 2px;}
address dl dd#tel-reserve a{ color:#FFF;}
address dl dd#tel-reserve dt { background-color:#FFF; font-size: 90%; margin:0 5px 0 0; display:inline; color:#000; padding: 0 6px 2px;}
address dl dd#tel-reserve dd { display:block; margin-top: 2%; font-size: 125%;}
address dl dd#tel-reserve dd.time { font-size: 80%;  margin-top: 0%;}
#sns-btn { float:right; display: flex; margin-top: 20px;}
#sns-btn li { width: 30px; margin-right: 10px;}
#sns-btn li img { width: 100%;}
#sns-btn:after { clear:both;}
#hmiLink img { width: 100%;}

#siteMap { margin-top: 20px;}

#footerLink { display: flex; width: 90%; margin: 20px auto; align-items: center;}
#footerLink #footerLink-hmiLogo { width: 27%; margin-right: 3%;}
#footerLink #hmiLink { width: 70%;}
#footerLink #hmiLink dl { display: flex; align-items: center;}
#footerLink #hmiLink dt { width: 55%; margin-right: 5%;}
#footerLink #hmiLink dd { width: 40%;}
#footerLink img { width: 100%;}

/* アコーディオン --------------------------------------------------------- */
/*ベース*/
.toggle-s {
	display: none;
}
.summary-label {		/*タイトル*/
	padding: 0.6rem 1em;
	display: block;
	color: #000;
	background:rgba(26,26,26,0.2);
	cursor: pointer;
}
.summary-label::before{		/*タイトル横の矢印*/
	content:"";
	width: 12px;
	height: 12px;
	border-top: 2px solid #942148;
	border-right: 2px solid #942148;
	-webkit-transform: rotate(45deg);
	position: absolute;
	top:calc( 50% - 8px );
	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;
}
.summary-content:last-child {/*本文*/
	margin-bottom:0;
}
.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 {
  width: 100%;
  margin: 0 auto 0;
  background: #FFF;
 }

.accordion .link {
  cursor: pointer;
  display: block;
  padding: 15px 15px 15px 42px;
  color: #4D4D4D;
  font-size: 14px;
  font-weight: 700;
  border-bottom: 1px solid #CCC;
  position: relative;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.accordion li i {
  position: absolute;
  top: 16px;
  left: 12px;
  font-size: 18px;
  color: #595959;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.accordion li i.fa-chevron-down {
  right: 12px;
  left: auto;
  font-size: 16px;
}

.accordion li.open .link {
  color:#C00;
}

.accordion li.open i {
  color:#C00;
}
.accordion li.open i.fa-chevron-down {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.accordion li.default .submenu {display: block;}
/**
 * Submenu
 -----------------------------*/
 .submenu {
  display: none;
	background: #777; 
	background-image: linear-gradient(45deg, rgba(90,90,90,0.25) 25%, transparent 25%, transparent 75%, rgba(90,90,90,0.25) 75%, rgba(90,90,90,0.25)), linear-gradient(-45deg, rgba(90,90,90,0.25) 25%, transparent 25%, transparent 75%, rgba(90,90,90,0.25) 75%, rgba(100,100,100,0.25));
	background-size: 20px 20px;
	background-position: 0 0, 10px 10px;
  font-size: 14px;
 }

 .submenu li {
  border-bottom: 1px solid #4b4a5e;
 }

 .submenu a {
  display: block;
  text-decoration: none;
  color: #fff;
  padding: 12px;
  padding-left: 42px;
  -webkit-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
 }

 .submenu a:hover {
  background: #b63b4d;
  color: #FFF;
 }
 
 .submenu li i {
	display: none;
 }
 
/**
 * フッターのアコーディオンここまで
 -----------------------------*/

#Copyright { color:#CCC; font-size: 90%; text-align:center; background-image:url(../img/common/navBg.png);}

/**
 * ニュース各ページ用
 -----------------------------*/
ul.news { max-height:400px; padding: 3%; margin: 20px 0;}
ul.news li { display:flex; border-bottom: #ddd 1px solid; padding-bottom: 3%; margin-bottom: 3%;}
ul.news li:last-child {  border-bottom: none; padding-bottom: 0; margin-bottom: 0%;}
ul.news li dl dt{ margin-bottom: 10px;}
ul.news li dl dd{ line-height: 150%;}
ul.news li div.newsImg { width: 30%;}
ul.news li div.newsImg img { width: 100%; height:auto;}
ul.news li div.newsText { width: 68%; margin-left: 2%;}
ul.news li p { padding: 0 0 0 2%;}
ul.news li a { text-decoration:underline;}
/**
 * ニュース各ページ用ここまで
 -----------------------------*/
 
/**
 * attention-box
 -----------------------------*/
.attention-box {  width: 100%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
	background-color: #fff;
    padding: 40px;}
	
.attention-box-inner{
	width: 1000px;
	margin: 0 auto;
}

.attention-box-inner dt{
	font-weight: 600;
	margin-bottom: 15px;
}
 /**
 * attention-box
 -----------------------------*/
 
.pc-view { display: none;}
.pc-view-inline { display: none;}
.sp-view { display: block;}
.sp-view-inline { display: inline;}
.pc-view1000 { display: none;}
.pc-view680 { display: none;}

/*NEWアコーディオン*/

details img { width: 100%;}
summary {
	margin-top: 10px;
	padding: 5px;
    cursor: pointer;
	background-color:#B43A4D;
	color:#FFF;
}

summary:hover { opacity: 0.6;}

/* Firefox用 */
details summary {
    list-style: none; /* デフォルト矢印削除 */
    cursor: pointer;
}
 
/* Chrome, Safari用 */
details summary::-webkit-details-marker {
    display: none; /* デフォルト矢印削除 */
}
 
/* 閉じている時はFont Awesomeのプラスアイコン使用 */
details summary::before {
	content: ' ▶';
    margin: 0 5px 0 5px;
    color:#FFF;
}
 
/* 開いている時はFont Awesomeのマイナスアイコン使用 */
details[open] summary::before {
	content: ' ▼';
}
/*NEWアコーディオン*/

/*色付きリンク*/
.colorLink a:hover { color:#B43A4D;}
.colorLink:hover { color:#B43A4D;}

/* TOP青い箱文字*/
.blue_box { background-color:#06F; margin-bottom: 20px; padding: 5px; text-align:center; font-weight:bold; color:#FFF;}
.blue_box a { color:#FFF;}

@media (min-width: 680px) {

.pc-view680 { display: block;}

}

@media (min-width: 768px) {

body {
	font-size:1.05em;
	letter-spacing: 0.05em;
}

.pc-view { display: block !important;}
.pc-view-inline { display: inline-block !important;}
.sp-view { display: none !important;}
.sp-view-inline { display: none !important;}

#slideMenu-premium , #slideMenu-top , #slideMenu-stipulation , #slideMenu-stay , #slideMenu-spa , #slideMenu-sightseeing , #slideMenu-room , #slideMenu-others , #slideMenu-faq , #slideMenu-facilities , #slideMenu-dish , #slideMenu-access, #slideMenu-language , #slideMenu-others-inner { display: none;}

.header-inner {
	max-width: 1000px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
  align-items: center;
	padding: 1%;
}

#header-logo { margin-top: 5px;}
	
.header-inner img {
	max-width: 250px;
	
}

.header-items { display:flex; width:auto; margin-left:auto; padding: 5px 2% 0 0; }
	
.header-items li { flex:auto; float:left; margin-left: 2%; }

.header-items li img { width: 50px;}

.header-items li #reserve-btn { position: relative; background: #c8a063; height: 36px; line-height: 40px; padding: 0 20px 0 0; font-size: 85%;}

.header-items li #reserve-btn:hover { background: #c19044;}

.header-items li .triangle1{
	display:inline-block;
	width: 30px;
	height: 0;
	border-left: 25px solid #deba83;
	border-top: 17.8px solid transparent;
	border-bottom: 17.8px solid transparent;
	filter: drop-shadow( 2px 0px 2px  rgba(33, 33, 33, 0.2));
}

article #mainImage { height: 50vh; margin: 0 auto 0; align-items: center;}

section { margin: 0 auto 7%;}

#attention { padding: 3%;}

#reserve-btn a { display:block; color:#FFF; font-weight:500; font-size: 105%; text-decoration:none; width: 150px; height:35px;}
#reserve-btn span { position:absolute; padding-left: 5px; line-height:35px;}

nav#globalNavi { display: block;}
nav#globalNavi {
	width:100%;
	height:auto;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9)) ,url(../img/common/navBg.png);
	border-bottom: #ccc 5px solid;
	filter: drop-shadow( 1px 1px 1px  rgba(33, 33, 33, 0.6));
	position: -webkit-sticky;
	position: sticky;
	top: -1px;
	z-index:100;
	}

nav#globalNavi ul{
	display: flex; flex-wrap:wrap; max-width:1000px;  margin: 0px auto 0;}
	
nav#globalNavi ul li{
	flex:1; height:100%; text-align:center; padding: 20px 0;}
	
nav#globalNavi ul li:hover {
	background: linear-gradient(0deg, rgba(100, 100, 100, 0.2), rgba(100, 100, 100, 0.7)) ,url(../img/common/navBg.png);}

nav#globalNavi a {
	color:#FFF;
	font-size: 0.9em;
	text-decoration:none;
	font-weight:300;
	position: relative;
	display: inline-block;
	transition: .3s;
	}
	
nav#globalNavi a::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  content: '';
  width: 0;
  height: 2px;
  background-color: #C00;
  transition: .3s;
  transform: translateX(-50%);
}

nav#globalNavi a:hover::after{
  width: 100%;
}

h1 { margin: 15% 0 8% ; font-size: 160%; letter-spacing: 0.1em;}
h1 { margin: 10% 0 5%; font-size: 180%;}
#h1-text { font-size: 125%; margin: -2% 0 5% 2%;}
h2 { font-size: 150%; line-height: 150%;}
h3 { font-size: 140%; line-height: 160%;}

.onePoint-back img {
	width: 70px;
	height: 70px;
    top: -20px;
    left: -20px;
	aspect-ratio: 1 / 1;
}

#nami { height: 10px; padding-top: 45%; margin-bottom: -150px;}

#footer-top {
	background:url(../img/svg/footerBg.svg) center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 50px;
    padding-top: 10%;
}
#hmiLogo { width: 25%; margin-bottom: 1%;}
#footer-inner { width: 100%;}
#footer-box { max-width: 1000px; margin: 0 auto 0;}
#footerLogo { width: 350px;}
address dl dt { font-size: 140%;}
address dl dd#add { font-size: 120%;}
address dl dd#tel-reserve {  margin-top: 1%;}
address dl dd#tel-reserve dt { font-size: 90%;}
address dl dd#tel-reserve dd { display:inline-block; margin-top: 0%; font-size: 100%;}
address dl dd#tel-reserve dd.time { font-size: 90%;}
#footerLink { width: 60%; }


/**
 * フッターのアコーディオンをリセット
 -----------------------------*/
 .accordion {
  width: initial;
  margin: initial;
  background: initial;
 }

.accordion .link {
  cursor: initial;
  display: initial;
  padding: initial;
  color: initial;
  font-size: initial;
  font-weight: initial;
  border-bottom: initial;
  position: initial;
  -webkit-transition: initial;
  -o-transition: initial;
  transition: initial;
}


.accordion li i {
	color: #FFF;
	padding: 0 10px 0 0;
  position: initial;
  top: initial;
  left: initial;
  font-size: initial;
  -webkit-transition: initial;
  -o-transition: initial;
  transition: initial;
}

.accordion li i.fa-chevron-down {
  right: initial;
  left: initial;
  font-size: initial;
}

.accordion li.open .link {
  color: initial;
}

.accordion li.open i {
  color: initial;
}
.accordion li.open i.fa-chevron-down {
  -webkit-transform: initial;
  -ms-transform: initial;
  -o-transform: initial;
  transform: initial;
}

.accordion li.default .submenu {display: initial;}
/**
 * Submenu
 -----------------------------*/
 .submenu {
  display: initial;
	background: initial; 
	background-image: initial;
	background-size:  initial;
	background-position:  initial;
  font-size:  initial;
 }

 .submenu li {
  border-bottom:  initial;
 }

 .submenu a {
  display:  initial;
  text-decoration:  initial;
  color: initial;
  padding:  initial;
  padding-left:  initial;
  -webkit-transition:  initial;
  -o-transition: initial;
  transition:  initial;
 }

 .submenu a:hover {
  background:  initial;
  color:  initial;
 }
 
 .submenu li i {
	 display:inline;
 }
 
/**
 * フッターのアコーディオンここまで
 -----------------------------*/

#footer-inner #siteMap ul.pc-ul li.pc-li a {
	color:#FFF;
	font-size: 1.2em;
	text-decoration:none;
	font-weight:300;
	position: relative;
	display: inline-block;
	transition: .3s;
	}
	
#footer-inner #siteMap ul.pc-ul li.pc-li a::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  content: '';
  width: 0;
  height: 1px;
  background-color: #fff;
  transition: .3s;
  transform: translateX(-50%);
}

#footer-inner #siteMap { display:flex; flex-direction: row; width: 100%; margin: 5% 0 1%;}
#footer-inner #siteMap ul.pc-ul { flex :1;}
#footer-inner #siteMap ul.pc-ul li.pc-li { border: none; padding: 2% 0;}
#footer-inner #siteMap ul.pc-ul li.pc-li:hover { background-color:rgba(250, 250, 250, 0);}
#footer-inner #siteMap ul.pc-ul li.pc-li a:hover::after{ width: 100%;}
#footer-inner .list-inner { padding-left: 15px !important;}

#footer-inner #siteMap { 
	border-top: #666 1px solid;
	border-bottom: #666 1px solid;
	padding: 5% 0;
}

ul.news { max-height:600px;}
ul.news li div.newsImg { width: 20%;}
ul.news li div.newsText { width: 78%;}

.sp-view .fa, .sp-view .fab, .sp-view .fal, .sp-view .far, .sp-view .fas { display:none !important; line-height: 0 !important;}

}

@media (min-width: 800px) {

#nami  { padding-top: 40%; }

}

@media (min-width: 1000px) {
	
.pc-view1000 { display: block;}
section { max-width: 1000px;}
#nami { padding-top: 35%;}
#bg-gry { margin: -15% auto 0;}
#h1-back img{ left: -60px; top: 40px;}
#h2-back img{ left: -60px; top: -10px;}
}

@media (min-width: 1300px) {

#nami { padding-top: 30%;}

}