@charset "utf-8";

.spNone{ display:none!important;}
.pcNone{ display:block!important;}
p,li,dt,dd{ font-size: 100%;}

.dispFlex{ display:block;}
img{width:100%;height: auto;}
p{line-height: 2;}

#pageHeader {padding-bottom: 0.4em; padding-top: 0.2em;}
#pageHeader .headerInner h1 img{height:auto; width:100%; padding: 0; padding-right: 3%;}
#pageHeader .headerInner h1 { float:none; width:13%; margin:0 0 0 10px; padding:0.5em 0;}
#pageHeader .headerInner h1 img{ width:100%; height:auto;}
header .headerInner nav.naviBox{
		width:100%;
		height:auto;
		margin:0 auto;
		padding:20px 0 0 0;
		position:fixed;
		top:0;
		right:0;
		background:rgba(0,0,0,0.8);
		text-align:center;
		transform:translateX(100%);
		z-index: 9999;
		transition:all .6s;
}
header .headerInner #menuBtn{
	display:block;
	right: 7px;
	top: 10px;
	width:45px;
	height: 35px;
	cursor:pointer;
	margin:0;
	z-index:10000;
	position:absolute;
	background: url("/files/user/_/suite-room25-26/img/menu_open.png")no-repeat;
	background-size: contain;
		
}
 
header #menuBtn.active{
	top: 10px;
	background: url("/files/user/_/suite-room25-26/img/menu_close.png")no-repeat;
	background-size: contain;
}
.back_topbg{background: rgba(0,0,0,0.8); z-index: 100; bottom: 0; padding: 1em 0; width: 100%; right: 0;}
.back_top{width: 35%; margin: 0 auto; display: block;}

header .headerInner nav.naviBox.active{transform: translateX(0%);overflow-y:scroll;-ms-overflow-style:none;/* IE, Edge 対応 */scrollbar-width:none;}
header .headerInner nav.naviBox.active::-webkit-scrollbar{ display:none;}
#pageHeader .headerInner ul{width: 100%;flex-wrap: wrap;justify-content: center;padding: 55px 0 23px 1%;}
#pageHeader .headerInner li{ width:45%; text-align:center; padding:1em 0; border-right: none;}
#pageHeader .headerInner li img{width: auto;height: 40px;}

#pageHeader #inner_linkBox{width: 95%;margin: auto;justify-content: center;}
#pageHeader #inner_linkBox div{width:106px;margin: 5px;}
#pageHeader #inner_linkBox div.top{width: 335px;}
#pageHeader #inner_linkBox div.top a{background: #000;color: #FFFFFF;padding: 10px;height: 50px;}
#pageHeader #inner_linkBox div.top a p{font-size: 20px;}
#pageHeader #inner_linkBox div a{padding:60px 5px 5px 5px;height: 106px;}
#pageHeader #inner_linkBox div a::before{width: 45px;height: 32px;left: 0;right: 0;top: 17px;bottom: auto;}
#pageHeader #inner_linkBox div a p{text-align: center;display: flex;justify-content: center;align-items: center;height: 30px;}
#pageHeader #inner_linkBox div.tennouhai,
#pageHeader #inner_linkBox div.hg{width: 100%;}
#pageHeader #inner_linkBox div.tennouhai a,
#pageHeader #inner_linkBox div.hg a{padding:20px 5px 20px 40px;height: auto;}
#pageHeader #inner_linkBox div.tennouhai a::before{content: "";display: block;width: 90px;height: 35px;position: absolute;left: 15px;top: 0;bottom: 0;margin: auto;right: auto;}
#pageHeader #inner_linkBox div.hg a::before{content: "";display: block;width: 90px;height: 35px;position: absolute;left: 0px;top: 0;bottom: 0;margin: auto;right: auto;}
#pageHeader #inner_linkBox div.tennouhai p,
#pageHeader #inner_linkBox div.hg p{height: auto;}

/*----------------------------------------------------------------------------
 ***                                                                 mainBox
----------------------------------------------------------------------------*/
.mainBox{background: url(/files/user/_/suite-room25-26/img/img_bg01_sp.jpg); background-size: 100%; background-repeat: no-repeat; background-position: bottom center;}
.mainBox h2{width: 90%;padding: 15% 0% 20% 0%;}

#inner_linkBox{margin: 2em auto; flex-wrap: wrap;}
#inner_linkBox div{width: calc(85% / 2);}

/*#vipBox*/
#vipBox{width: 100%; padding: 0.5em;}
#vipBox h3{width: 100%;}
#vipBox .innerBox{padding: 5.5em 2em 3.5em;}
#vipBox .firstBox .flexBox{font-size: 90%;}
#vipBox .firstBox .txt{text-align: left;}

#vipBox .slideBox li{margin: 0 0.5em;}
#vipBox .slide-arrow{width: 10px; height: 20px;}
#vipBox .next-arrow{right: -4%;}
#vipBox .prev-arrow{left: -4%;}

#vipBox .overviewBox{margin: 5em auto 0;}
#vipBox .overviewBox .flexBox{display: block;}
#vipBox .overviewBox .flexBox .imgBox{width: 100%;}
#vipBox .overviewBox .flexBox .txtBox{width: 100%; margin-top: 2em;}
#vipBox .overviewBox .flexBox .txtBox h4{padding-bottom: 0.5em; font-size: 190%;}
#vipBox .overviewBox .flexBox .txtBox dl{display: block; padding: 1.5em 0em; line-height: 2;}
#vipBox .overviewBox .flexBox .txtBox dl dt{margin-bottom: 1em; width: 100%; display: flex;}
#vipBox .overviewBox .flexBox .txtBox dl span{margin: 0 0 0 1em;}

#vipBox .benefitBox{width: 100%; margin: 5em auto 0;}
#vipBox .benefitBox .flexBox{display: block;}
#vipBox .benefitBox .flexBox div{width: 100%; margin-bottom: 1em;}
#vipBox .benefitBox h4{font-size: 190%;}
#vipBox .benefitBox .flexBox div .img{width: 20%;}
#vipBox .benefitBox .flexBox div p{font-size: 80%;}
#vipBox .benefitBox .txt{width: 100%;}

#vipBox .applyBox{width: 100%; margin: 5em auto 0;}
#vipBox .applyBox h4{font-size: 190%;}
#vipBox .applyBox .txt{text-align: left;}
#vipBox .applyBox .btn{font-size: 110%;}


/*#suiteABOX*/
#suiteABOX{width: 100%; padding: 0.5em;}
#suiteABOX h3{width: 100%;}
#suiteABOX .innerBox{padding: 5.5em 2em 3.5em;}
#suiteABOX .firstBox .flexBox{font-size: 90%; flex-wrap: wrap;}
#suiteABOX .firstBox .flexBox p{margin: 0 0.4em 0.6em;}
#suiteABOX .firstBox .txt{text-align: left;}

#suiteABOX .slideBox li{margin: 0 0.5em;}
#suiteABOX .slide-arrow{width: 10px; height: 20px;}
#suiteABOX .next-arrow{right: -4%;}
#suiteABOX .prev-arrow{left: -4%;}

#suiteABOX .overviewBox{margin: 5em auto 0;}
#suiteABOX .overviewBox .flexBox{display: block;}
#suiteABOX .overviewBox .flexBox .imgBox{width: 100%;}
#suiteABOX .overviewBox .flexBox .txtBox{width: 100%; margin-top: 2em;}
#suiteABOX .overviewBox .flexBox .txtBox h4{padding-bottom: 0.5em; font-size: 190%;}
#suiteABOX .overviewBox .flexBox .txtBox dl{display: block; padding: 1.5em 0em; line-height: 2;}
#suiteABOX .overviewBox .flexBox .txtBox dl dt{margin-bottom: 1em; width: 100%; display: flex;}
#suiteABOX .overviewBox .flexBox .txtBox dl dt span{margin: 0 0 0 1em;}

#suiteABOX .benefitBox{width: 100%; margin: 5em auto 0;}
#suiteABOX .benefitBox .flexBox{display: block;}
#suiteABOX .benefitBox .flexBox div{width: 100%; margin-bottom: 1em;}
#suiteABOX .benefitBox h4{font-size: 190%;}
#suiteABOX .benefitBox .flexBox div .img{width: 20%;}
#suiteABOX .benefitBox .flexBox div p{font-size: 80%;}
#suiteABOX .benefitBox .txt{width: 100%;}

#suiteABOX .applyBox{width: 100%; margin: 5em auto 0;}
#suiteABOX .applyBox h4{font-size: 190%;}
#suiteABOX .applyBox .txt{text-align: left;}
#suiteABOX .applyBox .btn{font-size: 85%;}

/*#suiteBBOX*/
#suiteBBOX{width: 100%; padding: 0.5em;}
#suiteBBOX h3{width: 100%;}
#suiteBBOX .innerBox{padding: 5.5em 2em 3.5em;}
#suiteBBOX .firstBox .flexBox{font-size: 90%; flex-wrap: wrap;}
#suiteBBOX .firstBox .txt{text-align: left;}

#suiteBBOX .slideBox li{margin: 0 0.5em;}
#suiteBBOX .slide-arrow{width: 10px; height: 20px;}
#suiteBBOX .next-arrow{right: -4%;}
#suiteBBOX .prev-arrow{left: -4%;}

#suiteBBOX .overviewBox{margin: 5em auto 0;}
#suiteBBOX .overviewBox .flexBox{display: block;}
#suiteBBOX .overviewBox .flexBox .imgBox{width: 100%;}
#suiteBBOX .overviewBox .flexBox .txtBox{width: 100%; margin-top: 2em;}
#suiteBBOX .overviewBox .flexBox .txtBox h4{padding-bottom: 0.5em; font-size: 190%;}
#suiteBBOX .overviewBox .flexBox .txtBox dl{display: block; padding: 1.5em 0em; line-height: 2;}
#suiteBBOX .overviewBox .flexBox .txtBox dl dt{margin-bottom: 1em; width: 100%; display: flex;}
#suiteBBOX .overviewBox .flexBox .txtBox dl dt span{margin: 0 0 0 1em;}

#suiteBBOX .benefitBox{width: 100%; margin: 5em auto 0;}
#suiteBBOX .benefitBox h4{font-size: 190%;}
#suiteBBOX .benefitBox .flexBox{display: block;}
#suiteBBOX .benefitBox .flexBox div{width: 100%; margin-bottom: 1em;}
#suiteBBOX .benefitBox .flexBox div .img{width: 20%;}
#suiteBBOX .benefitBox .flexBox div p{font-size: 80%;}
#suiteBBOX .benefitBox .txt{width: 100%;}

/*#entranceBOX*/
#entranceBOX{width: 100%; padding: 0.5em;}
#entranceBOX h3{width: 100%;}
#entranceBOX .innerBox{padding: 5.5em 2em 3.5em;}
#entranceBOX .firstBox{width: 100%;}

/*#restroomBOX*/
#restroomBOX{width: 100%; padding: 0.5em;}
#restroomBOX h3{width: 100%;}
#restroomBOX .innerBox{padding: 5.5em 2em 3.5em;}
#restroomBOX .firstBox{width: 100%;}

/*#faqBOX*/
#faqBOX{width: 100%; padding: 0.5em;}
#faqBOX .innerBox{padding: 3.5em 2em;}
#faqBOX .innerBox h3{font-size: 190%;}
#faqBOX .Label{padding: 0.8em 1em;}
#faqBOX .Label::before{width: 10px; height: 10px;}
#faqBOX .Label p{font-size: 100%;}
#faqBOX .Label p::before{width: 16px; height: 21px; margin-right: 0.5em;}
/*----------------------------------------------------------------------------
 ***                                                                 footer
----------------------------------------------------------------------------*/
/* linkbox */
#linkBox{padding:5% 0;margin: 0 auto 00px;}
#linkBox dt{ width:85.5%; margin:0 auto 1em;}
#linkBox dd{ font-weight:bold; line-height:2em; text-align:center; color:#FFF; font-size:80%;}
#linkBox dd img{ width:15%; padding:0 2%; height:auto;}


/* footer */
#pageFooter .footerInner{ padding:1% 1%;}
#pageFooter dl{ float:none; width:100%; text-align:center;}
#pageFooter dt{ width:15%; float:none; display:block;margin: auto}
#pageFooter dd{ float:none; display:inline-block; font-size:70%; color:#FFF; padding:2% 0 0 2%;}
#pageFooter  p{ float:none; font-size:70%; color:#FFF; padding-top:2.3%; text-align:center;}


@media screen and (max-width: 950px) and (min-width: 500px){
	#sponsor ul:nth-of-type(2) li img{width: 100%;}
}


