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

/*文字の装飾*/
.orangeText{color:#df5b04;}

/*ホテルロゴサイズ修正*/
.pointer-default{cursor:default;}
/*ホテルロゴサイズ修正*/
.header-inner #header-logo img { max-width: 230px;}
#footerLogo img { width: 300px;}

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

/*表デザイン追加*/
table.simpleTable{
	border: 1px solid #333;
	margin: 1em 0;
	text-align: center;
}
table.simpleTable tr{
	border-bottom: 1px solid #333;
} 
table.simpleTable th,table.simpleTable td{
	padding: 0.5em;
	border-right:1px solid #333; 
}
table.simpleTable tr:last-child,table.simpleTable th:last-child,table.simpleTable td:last-child{border-bottom: none;}

/*表デザイン追加 背景あり*/
table.backTable{
	width: 100%;
	border: 1px solid #999;
	margin: 1em 0;
	text-align: center;
	background: #fff;
}
table.backTable tr{
	border-bottom: 1px solid #999;
} 
table.backTable th,table.backTable td{
	padding: 0.5em;
	border-right:1px solid #999; 
}
table.backTable th{background: #f4e9c5; vertical-align: middle;}
table.backTable tr:last-child,table.backTable th:last-child,table.backTable td:last-child{border-bottom: none;}
table.backTable td.right{text-align: right;}

.priceTitle{font-weight: bold;}
.priceTable {padding-bottom: 5%;}
.priceTable dt{margin-bottom: 1%; color: #C00;}
.priceTable dd{margin-bottom: 3%;}

.pdfBtn01{
	width: 20%;
	background: #333;
	margin: 1em 0;
	text-align: center;
}
.pdfBtn01 a{
	width: 100%;
	display: block;
	color: #fff;
}

.access-box01{
	width: 100%;
	margin: 50px 0;
	padding: 0 5%;
	text-align: center;
}
.access-box01 img{
	width: 100%;
	max-width: 700px;	
}
/*文章囲み枠*/
.infoBox01{
	border:1px solid #ccc; padding:1em;	margin: 0.5em 0;
}
/*料理ページの見出し*/
h3.lineTitle { color: #333;font-size: 135%; line-height: 140%; letter-spacing: 0.05em; margin-bottom: 1%;}
.titleLine{width: 60%; border-bottom:0.2px solid #C00; display: block; color: #333;font-size:90%;padding: 0.2em 0.2em 0em 1em; margin-bottom: 0.2em; text-align: left; }
.titleLine i{color: #C00;}
/*料理ページおしながき*/
.oshinagakiBox-nankaiso{ background: #fff;}
.oshinagaki-nankaiso { display: block; width: 100%; background: #fff; /*padding: 1em;*/}
.oshinagaki-nankaiso dl { margin-bottom: 50px; /*float: left;*/}
.buffet-map{width: 100%;}
.buffet-map img{width: 100%; height: 100%; object-fit: cover;}
/*観光ページの各スポット画像　右下あわせ*/
.threePiece .imgBox img {
	width: 100%;
	object-fit: cover;
	object-position: right bottom;
}
.threePiece .imgBox{
	align-items: flex-end;
}
/*観光ページの一番上の大きい画像　右下あわせ*/
article #mainImageS {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	overflow: hidden;
	height: 35vh;
	margin: 0 auto 0;
}
article #mainImageS img { width: 100%; height:100%; min-width: 530px;
object-fit: cover;
object-position: right bottom;}
/*温泉ページ　くどりの湯説明*/
#onsen-kudori{
	width:100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	background-image: url("../img/onsen/onsen-kudori-bg.jpg");
	background-size:cover;
	background-position: left bottom;
	background-repeat: no-repeat;
	border-radius: 60px;
	padding: 45px 2em;
	
}
.kudoriTitle{
	width:100%;
	display: block;
	font-size:150%;
	letter-spacing: 2px;
}
.kudoriTxt{
	width:100%;
	display: block;
	line-height: 150%;
    letter-spacing: 2px;
}
/*TOPページおしらせ　写真複数の時*/
.newsImgBox{
	display: flex;
	flex-direction: column;
	justify-content: center;
	width:100%;	
}
.newsImgBoxIn{
	display: flex;
	flex-direction: column;
	color: #333;
	margin-bottom: 10px;
}
.newsImgBoxIn img{
	width:100%;
}
.newsImgBoxIn p{
	width: 100%;
}
/*イベントページ*/
.orangeLine{border-bottom:2px solid #df5b04;}
#event h2.border-stripe{ position: relative;padding: 0.3em; color: #d84106;}
#event h2.border-stripe:after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
  background: repeating-linear-gradient(-45deg, #f4936d, #f4936d 4px, #fff 4px, #fff 8px);}
.eventBox01 {display:inline-block;background: #df5b04; padding:0.1em 0.2em; margin-right: 0.3em; color: #fff;}
.eventBox02 {display:inline-block;background: #C00;  padding:0.1em 0.2em; margin-right: 0.3em; color: #fff;}
.eventBox03 {display:inline-block;background: #007700;  padding:0.1em 0.2em; margin-right: 0.3em; color: #fff;}
#event .twoPiece .imgBox{justify-content: flex-start; align-items: baseline;}
#event .twoPiece .imgBox img{object-fit: contain; width: 100%; height: 100%; object-position: center top;}

#event section h2 { margin: 0% 0 1% ; z-index: 2;}
#event #planBox ul { width: 100%; display: flex; flex-direction: column; align-items: stretch;}
#event #planBox li { width: 250px; height: auto!important; display: flex; flex-direction: column; justify-content:space-between; background: #000000;}
#event #planBox .imgBox {
	display: flex;
	justify-content: center;
	align-items: center;
	/*overflow: hidden;*/
	height: 165px;
	}
#event #planBox .imgBox img { width: 100%; height: 100%; object-fit: contain;}
#event #planBox .planTitle { display: flex; justify-content: start; height: 100px; margin: 0 0 0; padding: 7%; color: white;}
#event #planBox .planBtn { background:#942148; color:#FFF; text-align:center; margin-top: auto; padding: 5px; align-items: flex-end;}
#event #planBox .planBtn:hover { opacity: 0.8;}
#event .arrow-white { color:#FFF;}
#event .planLead{margin: 0 0 1% ; }

#event #planBox ul.noSliderBnr{display: flex;flex-direction: row;flex-wrap: wrap;justify-content: center;}
#event #planBox ul.noSliderBnr li{margin-bottom: 2%;}
/*プラン3つの場合;*/
#event .planBox ul.recommendP{ width: 100%; display: flex; flex-direction: column; align-items: stretch;} 
#event .planBox ul.recommendP li{ width: 100%; height: auto!important; display: flex; flex-direction: row; 
align-items:flex-start;background:url(../img/stay/beigeBg-stay.jpg) ; color:#333; overflow: hidden; margin: 0 0 
5%;} 
#event .planBox ul.recommendP li a.planPhoto{width:34%; margin-right: 3%;} 
#event .planBox ul.recommendP .imgBox {display:flex; width:100%;margin: 0 0 0 0; padding: 0 0 0 0; flex-direction: column;justify-content: center;align-items: flex-start;} 
#event .planBox ul.recommendP .imgBox img { width: 100%; } 
#event .planBox ul.recommendP a.planWord {display: block; width: 61%;} 
#event .planBox ul.recommendP .planTitle{ display:block; width:100%; padding: 3% 0; color:#333; } 

/* プラン一覧ページ */
#stayplan section h2 { margin: 15% 0 1% ; z-index: 2;}
#stayplan #planBox ul { width: 100%; display: flex; flex-direction: column; align-items: stretch;}
#stayplan #planBox li { width: 250px; height: auto!important; display: flex; flex-direction: column; justify-content:space-between; background: #000000;}
#stayplan #planBox .imgBox {
	display: flex;
	justify-content: center;
	align-items: center;
	/*overflow: hidden;*/
	height: 165px;
	}
#stayplan #planBox .imgBox img { width: 100%; height: 100%; object-fit: contain;}
#stayplan #planBox .planTitle { display: flex; justify-content: start; height: 100px; margin: 0 0 0; padding: 7%; color: white;}
#stayplan #planBox .planBtn { background:#942148; color:#FFF; text-align:center; margin-top: auto; padding: 5px; align-items: flex-end;}
#stayplan #planBox .planBtn:hover { opacity: 0.8;}
#stayplan .arrow-white { color:#FFF;}
#stayplan .planLead{margin: 0 0 1% ; }

/*1～3プランでスライダーさせない場合*/
#stayplan #planBox ul.noSliderBnr{display: flex;flex-direction: row;flex-wrap: wrap;justify-content: center;}
#stayplan #planBox ul.noSliderBnr li{margin-bottom: 2%;}








@media (min-width: 768px) {
/*ホテルロゴサイズ修正*/
.header-inner #header-logo img { max-width: 250px;}

/*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; }	
/* お料理 おしながき */
.titleLine{width: 25%; border-bottom:0.1px solid #C00; display: inline-block; color: #333;font-size:80%;padding: 0.2em 0.2em 0em ; margin-bottom: 0em; margin-right: 1em; text-align: center; }
.titleLine i{display: none;}

/*観光ページの一番上の大きい画像　右下あわせ*/
article #mainImageS { height: 55vh; margin: 0 auto 0; align-items: center;}	

/*温泉ページ　くどりの湯説明*/
#onsen-kudori{
	width:100%;
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	position: relative;
	background-image: url("../img/onsen/onsen-kudori-bg.jpg");
	background-size:cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 60px;
	padding: 45px;
}
.kudoriTitle{
	font-size:150%;
	writing-mode: vertical-rl;
	letter-spacing: 2px;
}
.kudoriTxt{
	line-height: 200%;
	writing-mode: vertical-rl;
    letter-spacing: 2px;
}
/*TOPページおしらせ　写真複数の時*/
.newsImgBox{
	display: flex;
	flex-direction: column;
	justify-content: center;
	width:30%;
}
.newsImgBoxIn img{
	width:100%;
}
.newsImgBoxIn{font-size:80%;}
/* 夏イベントページ プランが3つの場合*/
#event .planBox ul.recommendP{ flex-direction: row; justify-content: center;} 
#event .planBox ul.recommendP li{ width:32%; margin: 1% 1% 1%; flex-direction:column; } 
#event .planBox ul.recommendP li:first-child { width:32%; margin: 1% 1% 1% 0%; flex-direction:column;} 
#event .planBox ul.recommendP li:last-child { width:32%; margin: 1% 0% 1% 1%; flex-direction:column;} 
 
#event .planBox ul.recommendP li a.planPhoto{width:100%;margin-right: 0%;} 
#event .planBox ul.recommendP .imgBox {width:100%; height: auto; display: flex;justify-content: center;align-items: center;padding: 0 0 0 0;} 
#event .planBox ul.recommendP .imgBox img { width: 100%; height: 100%; object-fit: cover; } 
#event .planBox ul.recommendP a.planWord{width:100%;} 
#event .planBox ul.recommendP .planTitle {width:100%; padding: 3% 3%; text-align: center;} 
	
/* プラン一覧ページ */
#stayplan #planBox .planTitle { height: 120px; padding: 5%;} 
#stayplan #planBox ul { width: 100%;}
/*1～3プランでスライダーさせない場合*/
#stayplan #planBox ul.noSliderBnr{display: flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start;}
#stayplan #planBox ul.noSliderBnr li{ margin-bottom: 0%;margin-right: 1%;}
/* イベントページ */	
#event #planBox .planTitle { height: 120px; padding: 5%;} 
#event #planBox ul { width: 100%;}
#event #planBox ul.noSliderBnr{display: flex;flex-direction: row;flex-wrap: wrap;justify-content: space-between;}
#event #planBox ul.noSliderBnr li{ margin-bottom: 0%;margin-right: 1%;}
#event #planBox li { width: 23.5%;}
	

	
}
@media (min-width: 1010px) {
/*ホテルロゴサイズ修正*/
.header-inner #header-logo img { max-width: 300px;}

/*TOPページ　英語タイトルが長い時の改行用*/
.separate-rightBox02 { width: 35%;}
/*観光ページの一番上の大きい画像　右下あわせ*/
article #mainImageS { height: 60vh;}	
	
	

}