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

/*ホテルロゴサイズ修正*/
.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;
}
/*観光ページの各スポット画像　右下あわせ*/
.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;}

/*イベントページ*/
.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;}

/*団体宴会ページ*/
#group h2.border-stripe{ position: relative;padding: 0.3em; color: #330000;}
#group h2.border-stripe:after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7px;
  background: repeating-linear-gradient(-45deg, #330000, #330000 4px, #fff 4px, #fff 8px);}

.aboutDetail .twoPiece li{margin: 0%;}
.br-width{width: 100%;}

/*ページ最初の写真　左上あわせ*/
article #mainImageT {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	overflow: hidden;
	height: 35vh;
	margin: 0 auto 0;
}
article #mainImageT img { width: 100%; height:100%; min-width: 530px;
object-fit: cover;
object-position: left top;}

/*TOPページ　クーポン説明-------------------------------------------------------------------------*/
#coupon .titPhoto{width: 100%;}
#coupon .titPhoto img{width:100%; height: 100%; object-fit: cover; }
#coupon .summary-label{margin-bottom: 3%; background:url(../img/top/bnr/couponBnr_sp03.jpg) no-repeat 0 0 / cover;padding-top:54.25%;} /*ここの高さはpadding-topで画像の高さ/横の長さの％　56.25%を入れる*/
#coupon .summary-label::before{
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	top:auto; bottom: 9px;
}
#coupon .summary-content{background: #fff;}
#coupon .process{width: 100%; max-width:685px; margin: 0 0 1em; border: 1px solid #ccc;}
#coupon .couponTit{width: 100%;}
#coupon .couponTxt{color:#fff;text-align: center; font-size:120%;}
#coupon .reserve{width: 100%;}
#coupon .btn-reserve{width: 250px;margin: 1em auto;}
#coupon .btn {
  display: inline-block;
  width: 250px;
  text-align: center;
  text-decoration: none;
  line-height: 50px;
  outline: none;
  color: #fff;
  background-color:#942148 ;
  position: relative;
  border: 1px solid #942148;
  transition: color 0.5s ease;
}
#coupon .btn:hover {
  color: #942148;
}
#coupon .btn:hover::before {
  transform: scaleX(1);
  transform-origin: left;
}
#coupon .btn::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
  transform: scaleX(0);
  transform-origin: right;
  transition: all 0.5s ease;
  transition-property: transform;
}
#coupon .text {
  position: relative;
}

#top_coupon{display: flex; justify-content: center; margin: 5%; }
#top_coupon img{width: 100%;}


/*料理ページの見出し*/
h3.lineTitle { color: #333;font-size: 135%; line-height: 140%; letter-spacing: 0.05em; margin-bottom: 1%;}
.titleLine{width: 100%; 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;}
/* 無限ループアニメーション */
@keyframes img-scroll-left {
  from {
  transform: translateX(0);
  }
  to {
  transform: translateX(-100%);
  }
}
.scroll-img__list--left {
  animation: img-scroll-left 80s infinite linear 0.5s both;
}
.scroll-img__wrap {
  display: flex;
  overflow: hidden;
}
.scroll-img__list {
  display: flex;
  list-style: none;
  padding: 0;
}

.scroll-img__item {
  width: calc(100vw / 1.5);
}
.scroll-img__item>img {
  width: 100%;
}
.scroll-img__item04 {
  width: calc(100vw / 2.5);
}
.scroll-img__item04>img {
  width: 100%;
}
/* ここまで 無限ループアニメーション */
.menu-discription{margin: 2% 0;}
.menu-discription h4{position: relative;padding: 5px 10px;margin: 0 0 10px; color: #000;border-radius:10px;background: #f4dcd7;}
.menu-discription h4:after{content: ""; position: absolute;bottom: -9px;left:1em;width: 0;height: 0;border-width:10px 10px 0px 10px;border-style:solid;border-color: #f4dcd7 transparent transparent transparent;}
.menu-discription p{margin: 0 0 20px;}
#cuisine .twoPiece .imgBox {height:auto;}
#cuisine .threePiece .imgBox {height:auto;}


@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; }	
/* お料理 おしながき */
.oshinagaki { width: 100%;}
.oshinagaki dl { margin-bottom: 50px; float: left;}
.iframe-wrapper{height: 1650px;overflow: hidden;}
/* お料理 おしながき縦書きの中の数字 */
span.number {
text-orientation: upright;	
}
/* お料理 おしながき縦書きの中の数字 二桁の時 */
span.number2 {
  text-combine-upright: all;
  letter-spacing: normal;
}	
/*観光ページの一番上の大きい画像　右下あわせ*/
article #mainImageS { height: 55vh; margin: 0 auto 0; align-items: center;}	
/*ページ最初の写真　左上あわせ*/
article #mainImageT { height: 55vh; margin: 0 auto 0; align-items: center;}	
/*宴会ページ*/	
.br-width{width: 50%;}

/*TOPページ　クーポン説明-------------------------------------------------------------------------*/
#coupon .summary-label{margin-bottom: 0%;background:url(../img/top/bnr/couponBnr03.jpg) no-repeat 0 0 / cover;padding-top:17.46%;}/*ここの高さはpadding-topで画像の高さ/横の長さの％を入れる*/
#top_coupon{display: flex;justify-content: center; margin: 3% auto; max-width: 1200px;}
#top_coupon img{width: 100%;}
	
/* 無限ループアニメーション */
.scroll-img__item {
  width: calc(100vw / 3); /*pc３枚表示*/
}
.scroll-img__item>img {
  width: 100%;
}
.scroll-img__item04 {
  width: calc(100vw / 4); /*pc4枚表示*/
}
.scroll-img__item04>img {
  width: 100%;
}
/* ここまで 無限ループアニメーション */


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

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


	

}
