@charset "UTF-8";
/* Scss Document */
/* Scss Document */
/*color*/
/*font*/
@import url("https://fonts.googleapis.com/css2?family=Zen+Old+Mincho&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;700&display=swap");
@font-face { font-family: "Optima LT Std"; src: url("../fonts/optimaltstd.woff2") format("woff2"), url("../fonts/optimaltstd.woff") format("woff"); }
/*layout*/
/*----------------------------------------------------
	楽天パーツ
----------------------------------------------------*/
#htlRmSrch { top: 1100px; }

#upfrntPlans { top: 1780px; }

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

/*----------------------------------------------------
	メインビジュアル
----------------------------------------------------*/
/*#mv{
	width: 100%;
	height: 950px;
	position: relative;
	iframe{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
}*/
#mv #mv_bg { position: relative; width: 2000px; height: 791px; margin-left: -405px; overflow: hidden; }
#mv #mv_bg iframe { width: 2000px; height: 791px; }
#mv #mv_bg .mv-wave { position: absolute; bottom: -90px; z-index: 0; }

.sample_mv { width: 2000px; margin-left: -405px; position: relative; }
.sample_mv img { max-width: 2000px; }
.sample_mv .logo { position: absolute; top: 40px; left: 415px; }

/*iframe mv.html内*/
.video_wrp { position: relative; }
.video_wrp .logo { position: absolute; top: 50%; left: 0; width: 100%; text-align: center; z-index: 1; transform: translateY(-50%); display: none; }

#video { width: 100%; height: 950px; position: relative; z-index: 0; object-fit: cover; object-position: center center; font-family: 'object-fit: cover; object-position: center center;'; }

.top-mv { position: relative; position: relative; width: 2000px; margin-left: -405px; }
.top-mv .sticky-bg { width: 2000px; height: 100%; position: sticky; top: 2vw; margin-left: -405px; padding-bottom: 100px; }
.top-mv .sticky-bg .video-bg.pt01 { padding-top: 1px; }
.top-mv .sticky-bg .video-bg iframe { width: 1070px; height: 830px; margin-left: auto; margin-right: auto; display: block; }
.top-mv .mv02 img { display: block; margin-left: auto; margin-top: -155px; }
.top-mv .mv-s-box { position: absolute; top: -50px; width: 2000px; margin-left: -405px; }
.top-mv .mv-text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 1190px; font-size: 170px; font-family: "Optima LT Std", serif; white-space: nowrap; }

.parallax { position: relative; width: 1050px; height: 670px; margin-left: auto; margin-right: auto; }
.parallax .bg-img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; clip-path: inset(0); /*&:before{
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url("../../anpr/html/idx/lead01.jpg") no-repeat;
	background-size: cover;
	background-position: top center;
}*/ }

.parallax .bg-video { position: relative; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; clip-path: inset(0); }

.parallax .bg-video iframe { position: fixed; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1; }

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

/*----------------------------------------------------
	導入
----------------------------------------------------*/
.lead { padding-top: 200px; position: relative; }
.lead .wrp { padding-left: 20px; padding-right: 20px; }
.lead .parallax { border-top-left-radius: 50%; border-top-right-radius: 50%; width: 2000px; height: 910px; margin-left: -405px; overflow: hidden; position: relative; }
.lead .parallax .bg-img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; clip-path: inset(0); /*&:before{
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url("../../anpr/html/idx/lead01.jpg") no-repeat;
	background-size: cover;
	background-position: top center;
}*/ }
.lead .pra_cont { position: absolute; width: 800px; position: absolute; display: flex; flex-direction: column; top: 115px; left: 50%; translate: -50%; }
.lead .pra_cont .header { padding-bottom: 30px; }
.lead .pra_cont .header span { letter-spacing: .0em; }
.lead .maru { display: flex; }
.lead .maru div:first-child { position: relative; margin-top: -590px; }
.lead .maru div:last-child { position: relative; margin-top: -370px; margin-left: 120px; }
.lead .lead_content { padding-top: 50px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; position: relative; z-index: 1; /*	&:after{
		@include content;
		width: 2000px;
		height: 1418px;
		background: url("../idx/bg_01.png") no-repeat center/cover;
		position: absolute;
		top: 0;
		left: -405px;
		z-index: -1;
	}*/ }
.lead .lead_content .btn-01 { margin-right: 45px; }
.lead .lead_content .text { display: flex; gap: 25px; }

/*----------------------------------------------------
	導入
----------------------------------------------------*/
.lead02 { padding-top: 200px; position: relative; position: relative; width: 2000px; margin-left: -405px; /*.sticky-bg + .sticky-bg{
	padding-top: 150px;
}*/ }
.lead02 .sticky-bg { width: 2000px; position: sticky; top: 5vw; margin-left: -405px; padding-bottom: 100px; }
@media (max-width: 1250px) { .lead02 .sticky-bg { top: 10vw; } }
.lead02 .sticky-bg .video-bg.pt01 { padding-top: 1px; }
.lead02 .sticky-bg .video-bg iframe { width: 2000px; height: 800px; }
.lead02 .pra_cont { width: 800px; display: flex; flex-direction: column; position: relative; z-index: 1; margin: 0 auto; padding-top: 130px; }
.lead02 .pra_cont .header { padding-bottom: 30px; }
.lead02 .pra_cont .header span { letter-spacing: .0em; }
.lead02 .maru { margin-top: 50px; display: flex; position: relative; z-index: 1; justify-content: space-between; align-items: flex-end; }
.lead02 .maru div:last-of-type { margin-bottom: -130px; }

#video01 { width: 100%; height: 697px; object-fit: cover; object-position: center center; font-family: 'object-fit: cover; object-position: center center;'; }

/*----------------------------------------------------
	導入
----------------------------------------------------*/
.lead_content { padding-top: 50px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; position: relative; z-index: 1; }
.lead_content .btn-01 { margin-right: 45px; }
.lead_content .text { display: flex; gap: 25px; }

/*----------------------------------------------------
	ホテルマップ
----------------------------------------------------*/
#hotel-map { margin-top: 100px; width: 2000px; margin-left: -405px; position: relative; }
#hotel-map .deco01 { position: absolute; bottom: 119px; left: 0; width: 18%; }
#hotel-map .deco02 { position: absolute; right: 0; width: 30%; bottom: 0; }
#hotel-map .deco03 { position: absolute; bottom: -134px; left: 0; width: 35%; }

/*----------------------------------------------------
	header
----------------------------------------------------*/
.header { display: flex; flex-direction: column; align-items: center; color: #ffa634; }
.header h2 { font-size: 160px; font-family: "Roboto", sans-serif; color: #ffa634; font-weight: 500; }
.header span { font-family: "Optima LT Std", serif; font-size: 25px; letter-spacing: .1em; }

.wrp .text h3 { font-size: 40px; font-weight: 600; letter-spacing: .1em; padding-bottom: 35px; line-height: 1.3em; }

.lead .wrp p, .room .wrp p { width: 680px; }

#other { padding-top: 160px; }
#other .t-head { margin-bottom: 100px; }
#other .panel { margin-left: -305px; width: 1510px; display: flex; gap: 110px; align-items: center; }
#other .panel .panel01 { width: 900px; position: relative; }
#other .panel .panel01::after { content: ''; position: absolute; background: url("../idx/illust01.png"); background-size: contain; width: 1162px; height: 479px; right: -980px; bottom: -50px; }
#other .panel .panel02 { width: 500px; }

.check { margin-left: -165px; width: 1366px; display: flex; gap: 110px; align-items: flex-end; }
.check .panel01 { width: 650px; position: relative; }
.check .panel01::after { content: ''; position: absolute; background: url("../idx/illust02.png"); background-size: contain; width: 1650px; height: 430px; left: -261px; bottom: -50px; z-index: -1; }
.check .panel02 { width: 395px; margin-bottom: 100px; }

.other02 { margin-top: -100px; text-align: right; }
.other02 img { display: block; margin-left: auto; margin-right: -100px; }

.n04 { margin-top: -100px; position: relative; overflow: hidden; width: 2000px; margin-left: -405px; }

.deco { width: 20%; position: absolute; right: 0; /* top: 610px; */ bottom: 150px; }

.home-other__wave { z-index: 3; width: 8100px; position: absolute; top: -900px; left: -10vw; transform-origin: left top; transform: translateX(-50%); }
.home-other__wave img { position: absolute; top: 0; left: 0; }
.home-other__wave--01 { aspect-ratio: 8100/93; transform: rotate(30deg); }
.home-other__wave--01 img { animation: wave 20s linear 0s infinite; }
.home-other__wave--02 { aspect-ratio: 8100/107; transform: rotate(33deg) translateY(-50%); }
.home-other__wave--02 img { animation: wave 21s linear 0s infinite; }

@keyframes wave { 100% { transform: translateX(-4050px) translateZ(0); } }
@keyframes waveSp { 100% { transform: translateX(-2025px) translateZ(0); } }
/*----------------------------------------------------
	loop
----------------------------------------------------*/
#loop { padding-block: 110px 150px; }
#loop iframe { width: 2000px; height: 485px; margin-left: -405px; }

/*----------------------------------------------------
	room
----------------------------------------------------*/
#room .ro-lead { border: 1px solid; padding: 15px; max-width: 640px; margin-left: auto; margin-right: auto; margin-bottom: 80px; }
#room .ro-lead h3 { font-size: 20px; font-family: "游ゴシック", "Yu Gothic", sans-serif; text-align: center; font-weight: 500; }
#room iframe { width: 2000px; height: 893px; margin-left: -405px; }

/*----------------------------------------------------
	cuisine
----------------------------------------------------*/
#cu { margin-top: 125px; }
#cu iframe { width: 2000px; height: 893px; margin-left: -405px; }

/*----------------------------------------------------
	インスタ
----------------------------------------------------*/
#insta { margin-top: 100px; margin-bottom: 100px; }
#insta iframe { width: 2000px; height: 300px; margin-left: -405px; margin-top: 37px; }

/*----------------------------------------------------
	ROOM
----------------------------------------------------*/
.room { padding-top: 170px; position: relative; z-index: 1; }
.room iframe { /*width: 2000px;
height: 760px;*/ margin-left: -405px; }
.room .room_content { padding-top: 35px; padding-bottom: 65px; display: flex; align-items: center; position: relative; z-index: 1; }
.room .room_content .t_box { display: flex; align-items: flex-start; gap: 135px; }
.room .room_content .header { padding-right: 75px; }
.room .room_content .header span { letter-spacing: .0em; }
.room .bg { position: absolute; z-index: -1; bottom: 0; width: 2000px; margin-left: -405px; }

/*iframe内*/
#sl_to_room { /* 中央以外のスライド */ /* 中央のスライド */ }
#sl_to_room .img { position: relative; }
#sl_to_room .img img { height: auto; /*transform: scale(.8);*/ transition: transform 1s; /*width: 100%;*/ margin-right: 30px; margin-left: 30px; }
#sl_to_room .img span { position: absolute; right: 30px; bottom: 0; background: #6a5e5e; padding-top: 12px; padding-bottom: 12px; color: #fff; font-size: 14px; width: 186px; height: 59px; display: flex; justify-content: center; align-items: center; text-align: center; line-height: 1.1em; }
#sl_to_room .slider .slick-center img { opacity: 1; /*transform: scale(1);*/ }

/*----------------------------------------------------
	breakfast
----------------------------------------------------*/
.bf { padding-top: 80px; position: relative; z-index: 2; }
.bf iframe { margin-left: 315px; }
.bf .bf_content { margin-top: -205px; }
.bf .bf_content .header { width: 185px; padding-bottom: 42px; }
.bf .bf_content .t_box { display: flex; justify-content: space-between; align-items: center; padding-bottom: 45px; }
.bf .bg { position: absolute; bottom: 0; z-index: -1; width: 2000px; margin-left: -405px; }

/*----------------------------------------------------
	stay
----------------------------------------------------*/
.stay { margin-top: 85px; }
.stay .stay_content { width: 1151px; margin-right: auto; margin-left: auto; padding-top: 25px; display: flex; align-items: center; position: relative; z-index: 1; }
.stay .stay_content .header { padding-right: 75px; }
.stay .stay_content .text { width: 635px; margin-right: 61px; padding-top: 15px; }

/*----------------------------------------------------
	access
----------------------------------------------------*/
.access { padding-top: 60px; }
.access h2 { font-size: 70px; color: #ffa634; text-align: center; padding-bottom: 30px; font-family: "Optima LT Std", serif; }
.access .map { text-align: center; }
.access .text { width: 880px; margin-right: auto; margin-left: auto; margin-top: 55px; }
.access .text h3 { text-align: center; }
.access .text .detail { display: flex; align-items: flex-start; justify-content: space-between; }

/*----------------------------------------------------
	news
----------------------------------------------------*/
.news { width: 2000px; margin-left: -405px; margin-top: 38px; border-top: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; }
.news .ne_cont { width: 1070px; margin-left: auto; margin-right: auto; display: flex; justify-content: space-between; align-items: center; column-gap: 100px; }
.news .ne_cont h3 { letter-spacing: .13em; font-family: "Optima LT Std", serif; font-size: 30px; margin-left: 120px; }
.news .ne_cont ul { width: 850px; }
.news .ne_cont ul li { padding-top: 28px; padding-bottom: 28px; border-bottom: 1px solid #f0f0f0; }
.news .ne_cont ul li:last-of-type { border: none; }

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