@charset "UTF-8";
/* Scss Document */
/* Scss Document */
/*color*/
/*font*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap");
/*layout*/
/*----------------------------------------------------
	楽天パーツ
----------------------------------------------------*/
#htlRmSrch { top: 1292px; }

#upfrntPlans { top: 2175px; }

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

/*----------------------------------------------------
	メインビジュアル
----------------------------------------------------*/
/*#mv{
	width: 1190px;
	@include ma;
	
	#mv_bg{
		width: 2000px;
		margin-left: -405px;
		
		iframe{
			width: 2000px;
			height:950px;
		}
	}
}*/
#mv { height: 950px; position: relative; }
#mv .logo { position: absolute; top: 50%; left: 0; width: 100%; text-align: center; z-index: 1; transform: translateY(-50%); }
#mv iframe { width: 2000px; height: 950px; margin-left: -405px; }

/*----------------------------------------------------
	緊急ニュース
----------------------------------------------------*/
#special-news { border-bottom: 1px solid #8e8e8e; margin-top: 30px; }
#special-news a { display: block; text-align: center; padding: 20px 30px; }
#special-news a:hover { opacity: .7; }

/*----------------------------------------------------
	導入
----------------------------------------------------*/
#concept { margin-top: 130px; }
#concept .wrp { position: relative; }
#concept .wrp:after { content: ''; display: block; background: url("../idx/concept_bg.png") no-repeat; width: 800px; height: 800px; position: absolute; top: 60px; left: 0; right: 0; margin: 0 auto; }
#concept .flex .cont_l { margin-right: 50px; }
#concept .flex .cont_l .text { max-width: 520px; margin-left: 20px; margin-bottom: 110px; }
#concept .flex .cont_l .text h4 { margin-bottom: 40px; }
#concept .flex .cont_l .text h4 span { display: block; }
#concept .flex .cont_l .text h4 span.en { font-size: 40px; font-weight: 300; margin-bottom: 15px; }
#concept .flex .cont_l .text h4 span.jp { font-size: 30px; }
#concept .flex .cont_l .img01 { max-width: 617px; }
#concept .flex .cont_r { margin-right: -195px; margin-top: 45px; }
#concept .flex .cont_r .img02 { max-width: 650px; margin-bottom: 90px; margin-left: -170px; }
#concept .flex .cont_r .img03 { max-width: 400px; margin-left: -10px; }

/*----------------------------------------------------
	客室
----------------------------------------------------*/
#t_room { padding-top: 160px; }
#t_room h3 { text-align: center; font-size: 40px; font-weight: 500; margin-bottom: 60px; }
#t_room iframe { width: 2000px; height: 1148px; margin-left: -405px; }

/*.wrapper{
	.tab{
		display: flex;
		flex-wrap: wrap;
		width: 1150px;
		@include ma;
		margin-bottom: 30px;
		li{
			width: 190px;
			text-align: center;
			display: flex;
			align-items: center;
			justify-content: center;
			line-height: 1.2;
			padding-bottom: 10px;
			border-bottom: 3px solid #bdbdbd;
			transition: 0.5s;
			a{
				display: block;
				font-family: $qutfit;
				font-size: 26px;
				font-weight: 300;
			}
			&.active{//liにactiveクラスがついた時のタブの形状
				border-bottom: 3px solid $accent-color;
				a{
					
				}
			}
		}
	}

	//エリアの表示非表示と形状
	.area {
		display: none;//はじめは非表示
		opacity: 0;
		&.is-active{//areaにis-activeというクラスがついた時の形状
			display: block;//表示
			animation-name: displayAnime;//ふわっと表示させるためのアニメーション
			animation-duration: 0.5s;
			animation-fill-mode: forwards;
		}
		.img{
			position: relative;
			.arrow{
				width: 2000px;
			    height: 618px;
				position: absolute;
				top: 0;
				left: 0;
				.prev{
					height: 60px;
					position: absolute;
					top: 0;
					bottom: 0;
					margin: auto 0;
					left: 405px;
				}
				.next{
					height: 60px;
					position: absolute;
					top: 0;
					bottom: 0;
					margin: auto 0;
					right: 405px;
				}
			}
		}
		.wrp{
			padding-left: 20px;
			padding-right: 20px;
		}
		.spec{
			margin-top: 40px;
			.text{
				h3{
					margin-bottom: 30px;
					span{
						display: block;
						&.en{
							font-size: 30px;
							font-weight: 500;
							margin-bottom: 10px;
						}
						&.jp{
							
						}
					}
				}
			}
		}
		.accordion{
			margin-top: 40px;
		}
	}
}

@keyframes displayAnime{
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}*/
/*タブ切り替え全体のスタイル*/
.tabs { /*タブのスタイル*/ /*タブ切り替えの中身のスタイル*/ }
.tabs .tab_item { width: 190px; height: 70px; border-bottom: 3px solid #bdbdbd; line-height: 1.2; font-size: 26px; text-align: center; display: flex; align-content: center; align-items: center; justify-content: center; float: left; font-family: "Outfit", sans-serif; transition: all 0.2s ease; margin-bottom: 30px; }
.tabs .tab_item:hover { opacity: 0.75; }
.tabs .tab_item:first-of-type { margin-left: 20px; }
.tabs .tab_content { display: none; clear: both; }
.tabs .tab_content .img { position: relative; margin-left: -405px; width: 2000px; }
.tabs .tab_content .img .arrow { width: 2000px; height: 618px; position: absolute; top: 0; left: 0; }
.tabs .tab_content .img .arrow .prev { height: 60px; position: absolute; top: 0; bottom: 0; margin: auto 0; left: 405px; }
.tabs .tab_content .img .arrow .next { height: 60px; position: absolute; top: 0; bottom: 0; margin: auto 0; right: 405px; }
.tabs .tab_content .wrp { padding-left: 20px; padding-right: 20px; }
.tabs .tab_content .spec { margin-top: 40px; }
.tabs .tab_content .spec .text h4 { margin-bottom: 30px; }
.tabs .tab_content .spec .text h4 span { display: block; }
.tabs .tab_content .spec .text h4 span.en { font-size: 30px; font-weight: 500; margin-bottom: 10px; }
.tabs .tab_content .spec .text h4 span.jp { font-size: 16px; }
.tabs .tab_content .accordion { margin-top: 40px; }

/*ラジオボタンを全て消す*/
input[name="tab_item"] { display: none; }

/*選択されているタブのコンテンツのみを表示*/
#ro01:checked ~ #ro001, #ro02:checked ~ #ro002, #ro03:checked ~ #ro003, #ro04:checked ~ #ro004, #ro05:checked ~ #ro005, #ro06:checked ~ #ro006 { display: block; animation-name: displayAnime; animation-duration: 0.5s; animation-fill-mode: forwards; }

@keyframes displayAnime { from { opacity: 0; }
  to { opacity: 1; } }
/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item { border-bottom: 3px solid #003a50; }

/*----------------------------------------------------
	ラウンジ
----------------------------------------------------*/
#t_lounge { padding-top: 80px; padding-left: 20px; padding-right: 20px; }
#t_lounge .text { margin-top: 40px; }
#t_lounge .text h3 { margin-bottom: 30px; }
#t_lounge .text h3 span { display: block; }
#t_lounge .text h3 span.en { font-size: 30px; font-weight: 500; margin-bottom: 10px; }

/*----------------------------------------------------
	t_features
----------------------------------------------------*/
#t_features { padding-top: 150px; }
#t_features h3 { text-align: center; font-size: 40px; font-weight: 500; margin-bottom: 60px; }
#t_features .img_left { display: flex; justify-content: space-between; }
#t_features .img_left img { width: 615px; height: 474px; padding-left: 20px; }
#t_features .img_left .cont_r { margin-top: 40px; margin-left: 40px; padding-right: 20px; max-width: 535px; }
#t_features .img_left .cont_r .text { margin-bottom: 30px; padding-left: 20px; }
#t_features .img_left .cont_r .text h4 { margin-bottom: 30px; }
#t_features .img_left .cont_r .text h4 span { display: block; }
#t_features .img_left .cont_r .text h4 span.en { font-size: 30px; font-weight: 500; letter-spacing: 2px; margin-bottom: 15px; }
#t_features .img_right { display: flex; justify-content: space-between; }
#t_features .img_right .cont_l { margin-top: 40px; margin-right: 40px; padding-left: 20px; max-width: 535px; }
#t_features .img_right .cont_l .text { margin-bottom: 30px; padding-right: 20px; }
#t_features .img_right .cont_l .text h4 { margin-bottom: 30px; }
#t_features .img_right .cont_l .text h4 span { display: block; }
#t_features .img_right .cont_l .text h4 span.en { font-size: 30px; font-weight: 500; letter-spacing: 2px; margin-bottom: 15px; }
#t_features .img_right img { width: 615px; height: 474px; padding-right: 20px; }
#t_features .accordion .title { padding: 20px 0; }
#t_features .accordion .title:after { right: 0; }
#t_features .accordion .content ul { padding-bottom: 10px; width: 100%; }
#t_features .accordion .content ul.menu { display: flex; flex-wrap: wrap; }
#t_features .accordion .content ul.menu li { position: relative; padding-left: 20px; line-height: 1.6; width: 40%; }
#t_features .accordion .content ul.menu li.w60 { width: 60%; }
#t_features .accordion .content ul.menu li:after { content: ''; display: block; background-color: #000; width: 3px; height: 3px; border-radius: 3px; position: absolute; top: 0; bottom: 0; margin: auto 0; left: 7px; }
#t_features .accordion .content p { padding-bottom: 20px; }
#t_features .other { padding-left: 20px; padding-right: 20px; margin-top: 60px; display: flex; }
#t_features .other .box { max-width: 370px; margin-left: 20px; }
#t_features .other .box:first-child { margin-left: 0; }
#t_features .other .box .text { margin-top: 30px; }
#t_features .other .box .text h4 { font-size: 20px; font-weight: bold; margin-bottom: 25px; }

/*----------------------------------------------------
	インフォメーション
----------------------------------------------------*/
#t_infomation { padding-top: 150px; padding-left: 20px; padding-right: 20px; }
#t_infomation h3 { text-align: center; font-size: 40px; font-weight: 500; margin-bottom: 60px; }
#t_infomation .imgs { display: flex; }
#t_infomation .imgs img { margin-left: 10px; }
#t_infomation .imgs img:first-child { margin-left: 0; }
#t_infomation .accordion .title { padding: 20px 0; }
#t_infomation .accordion .content p { padding-bottom: 20px; }
#t_infomation .accordion .content p a { border-bottom: 1px solid #000; padding-bottom: 5px; transition: 0.3s; }
#t_infomation .accordion .content p a:hover { opacity: 0.7; }
#t_infomation .accordion .content.detail dl { padding-bottom: 20px; }
#t_infomation .accordion .content.detail dt { flex-basis: 235px; max-width: 235px; margin-right: 0; padding-right: 0; }
#t_infomation .accordion .content.detail dd { flex-basis: calc(100% - 235px); max-width: calc(100% - 235px); margin-bottom: 50px; }
#t_infomation .accordion .content.detail dd:last-child { margin-bottom: 0; }
#t_infomation .accordion .content.detail span { display: block; font-size: 14px; position: relative; padding-left: 1em; }
#t_infomation .accordion .content.detail span:after { content: "※"; display: block; position: absolute; top: 0; bottom: 0; margin: auto 0; left: 0; }
#t_infomation .accordion .content .btn_arw { margin-bottom: 20px; }

/*----------------------------------------------------
	アクセス
----------------------------------------------------*/
#t_access { padding-top: 150px; }
#t_access h3 { text-align: center; font-size: 40px; font-weight: 500; margin-bottom: 60px; }
#t_access #map_box { width: 2000px; height: 600px; margin-left: -405px; }
#t_access #map_box iframe { width: 2000px; height: 600px; margin-left: -405px; }
#t_access .text { margin-top: 30px; padding-left: 20px; padding-right: 20px; }
#t_access .text .btn_arw { margin-top: 30px; }

/*----------------------------------------------------
	クーポン
----------------------------------------------------*/
#coupon { padding-top: 50px; padding-left: 20px; padding-right: 20px; text-align: center; }
#coupon .bnr { margin-top: 30px; }
#coupon .bnr:first-child { margin-top: 0; }

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