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

/*---------------------------------
	基本設定： ページ全体
---------------------------------*/
/* 共通 */
.marginbottom-10sp { margin-bottom: 10% !important;}

/* アコーディオン */
.summary-label { padding-left: 2em;}

.redlogoText { color: #942147;}
.greenText { color: #387f00;}

.linkunderline a { text-decoration: underline; color: #942147;}

/*ページトップへあがるボタン トリップAIコンシェルジュ*/
.pagetop {
  height: 55px;
  width: 55px;
  position: fixed;
  right: 11px;/*10px*/
  bottom: 140px;/*70px*/
  background-color:#555555;
  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);
}

/*予約追従ボタン*/
.reserve_folliwing {
  height: 55px;
  width: 55px;
  position: fixed;
  right: 11px;/*10px*/
  bottom: 85px;/*15px*/
  background: #942148;
  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;}

/*---------------------------------
	コンテンツ sp
---------------------------------*/
/* ヘッダ */
.header-inner #header-logo { margin: 5px 0 0 5px;}
.header-inner #header-logo img { max-width: 290px;}

/* hamburgermenu */
p.hgmtitle { text-align: center; width: 75%; margin: 5% 10% 0 9%;}
p.hgmtitle img { width: 100%;}

/* 宿泊予約とお問合せ */
.hgBox01{ padding: 2%; width:100%;}

/* フッター *//* 施設によって変える※別ファイル（施設名.css） */
#footerLogo img { width: 80%;}

/* TOP おしらせ タイトル */
.summary-label { padding: 5px 35px 8px 8px;}

/* TOPページ 英語タイトルが長い時の改行用 */
.separate-rightBox02 {
	width: 100%;
	margin-top: 0;
	background: none;
	display: flex;
	flex-direction: column;
	justify-content: start;
}

/* TOP おすすめプラン */
#planBox .planTitle { height: 120px;}

/* TOP おしらせ */
div.newsImg { line-height: 1.5; font-size: 0.9em;}

/* 温泉 詳細情報のアコーディオン */
.DetailAccordion02 { max-width: 400px; margin-top: 25px;}

/* お料理 おしながき */
.oshinagakiTitle {
	font-size: 180%;
	margin-bottom: 20px;
	color: white;
	font-family: 'Noto Serif JP', serif;
	padding: 5px 10px 0 10px;
}

/* 施設について 360度パノラマビュー */
.sp-360view { display: block !important;}
.pc-360view { display: none !important;}

/* 周辺スポット バナー */
#sightseeing_bnr { width: 100%; margin-top: 5%; text-align: center; padding: 0 5%;}
#sightseeing_bnr img { width: 100%;}
#sightseeing_bnr a { font-size: 90%;}

/* 周辺スポット アクティビティ4選 */
.sightseeing .separate-box {
	display:flex;
	flex-direction: column;
	margin: 8% auto 10%;
	justify-content: space-between;
}
.sightseeing .separate-box:last-child { margin: 0 auto 0;}
.sightseeing .separate-leftBox { width: 100%; font-size: 0; line-height: 0;}
.sightseeing .separate-leftBox img { height: 35vh;}
.sightseeing .separate-rightBox { width: 100%; display:flex; flex-direction: column; padding: 5% 0 8% 0;}
.sightseeing .separate-img img { width: 100%;}
.sightseeing .separate-text { }
.sightseeing .separate-text h2 { margin-top: 1%;}
.sightseeing .separate-text p { line-height: 1.6; margin-bottom: 5%;}
.sightseeing .separate-text a:hover {opacity: 0.7; color: #942148;}
.redBacktxtwhite {
	background-color: #942147;
	color: #fff;
	width: auto;
	padding: 2% 4%;
	border-radius: 5px;
	text-align: center;
}
.redBacktxtwhite02 {
	background-color: #942147;
	color: #fff;
	width: auto;
	padding: 4%;
	border-radius: 5px;
	text-align: center;
	font-size: 110%;
}
.redBacktxtwhite02 a {color: #fff;}

/*スマホアクセス お車でお越しの場合--*/
.row {margin-right: -15px; margin-left: -15px; font-family: "ヒラギノ明朝 ProN W6","HiraMinProN-W6","HG明朝E","ＭＳ Ｐ明朝","MS PMincho","MS 明朝",serif;}
.row::before {display: table; content: " "; box-sizing: border-box;}
.col-sm-4 {position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px;}
.access_point.start {background: #942148; display: block; padding: 12px; border-radius: 0; border: none; color: #FFF; width: 100%; font-size: 16px; text-align: center; display: table; content: " ";line-height: 2;}
.access_point {height: 50px;}
.access_point.start::before {font-family: "FontAwesome"; content: "\f0ab"; margin-right: 0.5em; box-sizing: border-box;}
.access_caption {padding: 12px 5px; min-height: 50px; margin-left: 20px; color: #666; border-left: 2px #999 dotted; font-size: 16px;}
.access_point {display: block; padding: 12px; height: 50px; color: #333; width: 100%; border: 2px #666 solid; text-align: center; border-radius: 25px; background: #eee; font-size: 16px;}
.access_point.goal {background: #7e655a; border-radius: 25px; margin-bottom: 80px; padding: 12px; border: none; color: #FFF; width: 100%; font-size: 16px; text-align: center; display: table; content: " ";line-height: 2;}
.access_point.goal::before {font-family: "FontAwesome"; content: "\f024"; margin-right: 0.5em;}
.visible-xs {display: none !important;}
.col-sm-12 {width: 100%; float: left; position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px;}


/*---------------------------------
	コンテンツ pc
---------------------------------*/
@media (min-width: 768px) {

/*ページトップへあがるボタン トリップAIコンシェルジュ*/
.pagetop {
  height: 55px;
  width: 55px;
  position: fixed;
  right: 34px;/*10px*/
  bottom: 140px;/*15px*/
  background-color:#555555;
  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);
}
/*予約追従ボタン
.reserve_folliwing { display: none!important;}
*/
/*予約追従ボタン*/
.reserve_folliwing {
  height: 55px;
  width: 55px;
  position: fixed;
  right: 34px;/*10px*/
  bottom: 85px;/*70px*/
  background: #942148;
  border: none;/*線なし*/
  border-radius: 50%;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 2;
  cursor: pointer;
  opacity: 0.8;
}

/* 共通 */
.marginbottom-10sp { margin-bottom: 5% !important;}

/* アコーディオン */
.summary-label { padding-left: 1em;}

/* ヘッダ */
.header-inner #header-logo img { max-width: 400px;}

/* hamburgermenu */
p.hgmtitle { width: 50%; text-align: center; margin: 10px auto 0;}
p.hgmtitle img { width: 100%;}

/* 宿泊予約とお問合せ */
.hgBox01{ padding: 2% 2% 0; width:100%;}

/* フッター */
#footerLogo img { width: 400px;}

/*TOPページ ホテルの魅力 セパレートボックス*/
.separate-rightBox { width: 55%;}

/*TOPページ ホテルの魅力 英語タイトルが長い時の改行用*/
.separate-rightBox02 { width: 55%; margin-top: -130px;}
.separate-rightBox02 .bigText {	text-align: right;}	
.separate-rightBox02 { width: 33%; background: none; display: flex; flex-direction: column; }

/* TOP おすすめプラン */
#planBox .planTitle { height: 140px;}

/* 温泉 詳細情報のアコーディオン */
.DetailAccordion02 { max-width: 1000px; margin-top: 25px;}

/* お料理 おしながき */
.iframe-wrapper { padding: 0 5%; height: 1500px; overflow: hidden;}
.oshinagaki { width: 100%;}
.oshinagaki dl { margin-bottom: 50px; float: left;}

/* 施設について 360度パノラマビュー */
.pc-360view { display: block !important;}
.sp-360view { display: none !important;}

/* 周辺スポット バナー */
#sightseeing_bnr { max-width: 1000px; margin-top: 5%;}
#sightseeing_bnr img { width: auto;}

/* 周辺スポット アクティビティ4選 */
.sightseeing .separate-box { flex-direction: row;}
.sightseeing .separate-leftBox { width: 50%; flex-direction: column; background: none; padding:0;}
.sightseeing .separate-leftBox img { height: 400px;}
.sightseeing .separate-rightBox { width: 48%; flex-direction: column; background: none; padding:0;}
.sightseeing .separate-img { display: flex;	justify-content: center; align-items: center; overflow: hidden;}
.sightseeing .separate-img img{ height: 100%;}
.sightseeing .separate-text { margin-bottom: 0;}
.sightseeing .separate-text h2 { margin-top: 0;}

.redBacktxtwhite02 {
	background-color: #942147;
	color: #fff;
	width: auto;
	padding: 2% 4%;
	border-radius: 5px;
	text-align: center;
}

/*PCアクセス お車でお越しの場合--*/
.accesspointBox{display: block;width: 100%; }
.row {margin-right: -15px; margin-left: -15px; font-family: "ヒラギノ明朝 ProN W6","HiraMinProN-W6","HG明朝E","ＭＳ Ｐ明朝","MS PMincho","MS 明朝",serif;}
.row::before {display: table; content: " "; box-sizing: border-box;}
.col-sm-4 {width: 33.33333333%; float: left; position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px;}
.access_point.start {background: #942148; display: block; padding: 12px; border-radius: 0; border: none; color: #FFF; width: 100%; font-size: 16px; text-align: center; display: table; content: " "; line-height: 2; }
.access_point {height: 50px;}
.access_point.start::before {font-family: "FontAwesome"; content: "\f0ab"; margin-right: 0.5em; box-sizing: border-box;}
.access_caption {padding: 12px 5px; min-height: 50px; margin-left: 20px; color: #666; border-left: 2px #999 dotted; font-size: 16px;}
.access_point {display: block; padding: 12px; height: 50px; color: #333; width: 100%; border: 2px #666 solid; text-align: center; border-radius: 25px; background: #eee; font-size: 16px;line-height: 1.4;}
.access_point.goal {background: #7e655a; border-radius: 25px; margin-bottom: 80px; padding: 12px; border: none; color: #FFF; width: 100%; font-size: 16px; text-align: center; display: table; content: " "; line-height: 2;}
.access_point.goal::before {font-family: "FontAwesome"; content: "\f024"; margin-right: 0.5em;}
.visible-xs {display: none !important;}
.col-sm-12 {width: 100%; float: left; position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px;}


}

@media (min-width: 1010px) {

/*TOPページ　英語タイトルが長い時の改行用*/
.separate-rightBox02 { width: 35%;}

}