@charset "UTF-8";
/* Scss Document */
/* Scss Document */
/*color*/
/*$base-color: #000000;*/
/*$black: #000000;*/
/*font*/
@import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&family=Zen+Old+Mincho:wght@400;500;600&display=swap");
/*layout*/
/*----------------------------------------------------
	楽天パーツ
----------------------------------------------------*/
#htlRmSrch { top: 980px; }

#upfrntPlans { top: 1640px; }

#htlSide-A #latest_cstm_review { top: 1910px !important; }

/*----------------------------------------------------
	メインビジュアル
----------------------------------------------------*/
#mv { width: 1128px; /*width: 100%;*/ height: 600px; /*height: 800px;*/ position: relative; }
#mv iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/*----------------------------------------------------
	緊急ニュース
----------------------------------------------------*/
#special-news { background-color: #FFF; }
#special-news a { display: block; text-align: center; padding: 10px 20px; color: #222222; }
#special-news a:hover { opacity: .7; }

/*----------------------------------------------------
	導入
----------------------------------------------------*/
#contents p { font-size: 18px; }

#lead { padding-top: 110px; padding-bottom: 100px; position: relative; }
#lead:before { content: ''; display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; /*background: url("../idx/lead_bg.jpg") no-repeat left top / cover;*/ }
#lead .wrp { display: flex; /*justify-content: flex-end;*/ justify-content: center; }
#lead .inner { width: 1400px; margin-right: -405px; margin-left: auto; }
@media (max-width: 1366px) { #lead .inner { margin-left: 250px; margin-right: -250px; } }
#lead figure { position: relative; z-index: 1; margin-left: 70px; }
#lead .flex { gap: 6%; position: relative; margin-top: 36px; /*max-width: calc(100vw - 250px);*/ /*padding-right: 300/2000*100vw;*/ /*justify-content: space-between;*/ /*@media (max-width:1366px){
	padding-right: 110/2000*100vw;
}*/ }
#lead .title { /*width: 100%;
max-width: 720px;*/ width: 400px; /*width: 385px;*/ }
#lead .title h3 { font-size: 32px; line-height: 2; position: relative; margin-bottom: 45px; padding-bottom: 40px; font-feature-settings: "palt"; letter-spacing: .2em; /*&:before{
	@include content;
	background-color:#758a95;
	opacity: 0.2;
	width: 1500px;
	height: 400px;
	position: absolute;
	bottom: 0;
	left: -140px;
}*/ }
#lead .title h3::before { display: block; width: 0; height: 0; margin-top: calc((1 - 1.7) * .5em); content: ""; }
#lead .title h3::after { display: block; width: 0; height: 0; margin-bottom: calc((1 - 1.7) * .5em); content: ""; }
#lead .text { width: 590px; /*width: 512px;*/ /*max-width: 490px;*/ position: relative; line-height: 108; }
#lead .text p { font-size: 14px; font-feature-settings: "palt"; letter-spacing: 1.4px; line-height: 2.5em; }
#lead .text p::before { display: block; width: 0; height: 0; margin-top: calc((1 - 2) * .5em); content: ""; }
#lead .text p::after { display: block; width: 0; height: 0; margin-bottom: calc((1 - 2) * .5em); content: ""; }

/*----------------------------------------------------
	REDRESH & INSPIRE
----------------------------------------------------*/
#room { /*background: url("../idx/re_in_bg.jpg") no-repeat center center / cover;*/ position: relative; z-index: 1; }
#room .flex { gap: 20px; justify-content: space-between; }
#room .flex > div { width: 570px; text-align: center; }
#room .flex > div img { display: block; margin-bottom: 20px; }
#room .flex > div p { font-size: 15px; line-height: 1.6666666667; font-feature-settings: "palt"; width: 100%; max-width: 486px; margin: 0 auto; }
#room .flex > div p::before { display: block; width: 0; height: 0; margin-top: calc((1 - 1.6666666667) * .5em); content: ""; }
#room .flex > div p::after { display: block; width: 0; height: 0; margin-bottom: calc((1 - 1.6666666667) * .5em); content: ""; }
#room .flex h4 { font-size: 20px; font-family: "Libre Baskerville", serif; padding-bottom: 25px; }

/*----------------------------------------------------
	ROOM
----------------------------------------------------*/
/*----------------------------------------------------
	food
----------------------------------------------------*/
#food .images { width: 1280px; margin-left: -45px; display: flex; }
#food .images > div { width: 50%; }
#food .images > div img { display: block; }
#food .text_lr { /*justify-content: space-around;*/ /*gap:32px;*/ /*align-items: flex-end;*/ /*width: 950px;*/ margin-left: auto; margin-right: auto; }
#food .text_lr .text { flex-basis: auto; max-width: auto; }
#food .text_lr .text .img2 { margin-top: 60px; margin-left: 25px; position: relative; }
#food .text_lr .text .img2::before { content: 'Breakfast'; position: absolute; top: 0; left: -30px; z-index: 1; writing-mode: vertical-rl; font-size: 20px; font-family: "Libre Baskerville", serif; font-weight: 200; color: #222222; }
#food .text_lr .img { position: relative; margin-bottom: 43px; margin-top: 60px; }
#food .text_lr .img::before { content: 'BBQ'; position: absolute; top: 0; left: -25px; z-index: 1; writing-mode: vertical-rl; font-family: "Libre Baskerville", serif; font-size: 20px; }
#food .text_lr .img::after { content: 'Dinner'; position: absolute; top: 57px; left: -27px; z-index: 1; writing-mode: vertical-rl; font-family: "Libre Baskerville", serif; font-size: 20px; }
#food .img3 { position: relative; margin-left: 392px; margin-top: -232px; }
#food .img3 span { position: absolute; top: 0; left: -30px; z-index: 1; writing-mode: vertical-rl; font-family: "Libre Baskerville", serif; font-size: 20px; }

/*----------------------------------------------------
	Pool & Sauna
----------------------------------------------------*/
#spa { /*background: url("../idx/re_in_bg.jpg") no-repeat center center / cover;*/ position: relative; z-index: 1; }
#spa .flex { gap: 20px; justify-content: space-between; }
#spa .flex > div { width: 570px; text-align: center; }
#spa .flex > div img { display: block; /*margin-bottom: 20px;*/ }
#spa .arw_btn { margin: 0 auto; margin-top: 60px; }

/*----------------------------------------------------
	アクセス
----------------------------------------------------*/
#access .text { /*width: 950px;*/ margin-left: auto; margin-right: auto; margin-top: 35px; }
#access .text_lr .img { width: 100%; max-width: 595px; }
#access .arw_btn { margin: 0; margin-top: 60px; }

/*----------------------------------------------------
	インスタ
----------------------------------------------------*/
#insta { width: 1128px; margin-left: auto; margin-right: auto; }
#insta iframe { width: 1128px; /*width: 2000px;*/ height: 347px; /*margin-left: -405px;*/ }

/*insta.html内*/
.instafeed { display: flex; padding-top: 10px; padding-bottom: 10px; border-top: 1px solid #FFF; border-bottom: 1px solid #FFF; }
.instafeed > div { width: 274px; /*width: 325px;*/ height: 274px; /*height: 325px;*/ flex-shrink: 0; flex-grow: 0; }
.instafeed > div + div { margin-left: 10px; }
.instafeed > div.text { background-color: #FFF; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.instafeed > div.text p { line-height: 1; font-family: "Libre Baskerville", serif; }
.instafeed > div.text .account { font-size: 18px; }
.instafeed > div.text .account:before { content: ''; display: block; background: url("../idx/ist_logo.png") no-repeat center center/contain; width: 30px; height: 30px; margin-left: auto; margin-right: auto; margin-bottom: 20px; }
.instafeed > div.text .follow { margin-top: 20px; font-size: 15px; }
.instafeed > div.insta-slider .insta { width: 274px; height: 274px; /*width: 325px;
height: 325px;*/ position: relative; overflow: hidden; }
.instafeed > div.insta-slider .insta img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; object-fit: cover; }
.instafeed > div.insta-slider .insta p { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; background-color: rgba(34, 34, 34, 0.5); color: #FFF; opacity: 0; transition: .5s; padding: 30px; display: flex; flex-direction: column; justify-content: center; }
.instafeed > div.insta-slider .insta p span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 8; overflow: hidden; }
.instafeed > div.insta-slider .insta:hover p { opacity: 1; }

/*# sourceMappingURL=top.css.map */