.mt-100{margin-top: -100px!important}
.mt-95{margin-top: -95px!important}
.mt-90{margin-top: -90px!important}
.mt-85{margin-top: -85px!important}
.mt-80{margin-top: -80px!important}
.mt-75{margin-top: -75px!important}
.mt-70{margin-top: -70px!important}
.mt-65{margin-top: -65px!important}
.mt-60{margin-top: -60px!important}
.mt-55{margin-top: -55px!important}
.mt-50{margin-top: -50px!important}
.mt-45{margin-top: -45px!important}
.mt-40{margin-top: -40px!important}
.mt-35{margin-top: -35px!important}
.mt-30{margin-top: -30px!important}
.mt-25{margin-top: -25px!important}
.mt-20{margin-top: -20px!important}
.mt-15{margin-top: -15px!important}
.mt-10{margin-top: -10px!important}
.mt-5{margin-top: -5px!important}
.mt5{margin-top: 5px!important}
.mt6{margin-top: 6px!important}
.mt7{margin-top: 7px!important}
.mt8{margin-top: 8px!important}
.mt9{margin-top: 9px!important}
.mt10{margin-top: 10px!important}
.mt15{margin-top: 15px!important}
.mt20{margin-top: 20px!important}
.mt25{margin-top: 25px!important}
.mt30{margin-top: 30px!important}
.mt35{margin-top: 35px!important}
.mt40{margin-top: 40px!important}
.mt45{margin-top: 45px!important}
.mt50{margin-top: 50px!important}

.mb-15{margin-bottom: -15px!important}
.mb-10{margin-bottom: -10px!important}
.mb-5{margin-bottom: -5px!important}
.mb-4{margin-bottom: -4px!important}
.mb-3{margin-bottom: -3px!important}
.mb-2{margin-bottom: -2px!important}
.mb-1{margin-bottom: -1px!important}
.mb0{margin-bottom: 0px!important}
.mb1{margin-bottom: 1px!important}
.mb2{margin-bottom: 2px!important}
.mb3{margin-bottom: 3px!important}
.mb4{margin-bottom: 4px!important}
.mb5{margin-bottom: 5px!important}
.mb6{margin-bottom: 6px!important}
.mb7{margin-bottom: 7px!important}
.mb8{margin-bottom: 8px!important}
.mb9{margin-bottom: 9px!important}
.mb10{margin-bottom: 10px!important}
.mb11{margin-bottom: 11px!important}
.mb12{margin-bottom: 12px!important}
.mb13{margin-bottom: 13px!important}
.mb14{margin-bottom: 14px!important}
.mb15{margin-bottom: 15px!important}
.mb16{margin-bottom: 16px!important}
.mb17{margin-bottom: 17px!important}
.mb18{margin-bottom: 18px!important}
.mb19{margin-bottom: 19px!important}
.mb20{margin-bottom: 20px!important}
.mb25{margin-bottom: 25px!important}
.mb30{margin-bottom: 30px!important}
.mb35{margin-bottom: 35px!important}
.mb40{margin-bottom: 40px!important}
.mb45{margin-bottom: 45px!important}
.mb50{margin-bottom: 50px!important}
.mb55{margin-bottom: 55px!important}
.mb60{margin-bottom: 60px!important}
.mb65{margin-bottom: 65px!important}
.mb70{margin-bottom: 70px!important}
.mb75{margin-bottom: 75px!important}
.mb80{margin-bottom: 80px!important}
.mb85{margin-bottom: 85px!important}
.mb90{margin-bottom: 90px!important}
.mb95{margin-bottom: 95px!important}
.mb100{margin-bottom: 100px!important}
.mb110{margin-bottom: 110px!important}
.mb120{margin-bottom: 120px!important}
.mb130{margin-bottom: 130px!important}
.mb140{margin-bottom: 140px!important}
.mb150{margin-bottom: 150px!important}

.wt10{width: 10px}
.wt15{width: 15px}
.wt20{width: 20px}
.wt25{width: 25px}
.wt30{width: 30px}
.wt35{width: 35px}
.wt40{width: 40px}
.wt45{width: 45px}
.wt50{width: 50px}
.wt55{width: 55px}
.wt60{width: 60px}
.wt65{width: 65px}
.wt70{width: 70px}
.wt75{width: 75px}
.wt80{width: 80px}
.wt85{width: 85px}
.wt90{width: 90px}
.wt95{width: 95px}
.wt100{width: 100px}
.wt110{width: 110px}
.wt120{width: 120px}
.wt130{width: 130px}
.wt140{width: 140px}
.wt150{width: 150px}
.wt160{width: 160px}
.wt170{width: 170px}
.wt180{width: 180px}
.wt190{width: 190px}
.wt200{width: 200px}
.wt210{width: 210px}
.wt220{width: 220px}
.wt230{width: 230px}
.wt240{width: 240px}
.wt250{width: 250px}
.wt300{width: 300px}
.wt350{width: 350px}
.wt400{width: 400px}
.wt450{width: 450px}
.wt500{width: 500px}
.wt550{width: 550px}
.wt600{width: 600px}
.wt650{width: 650px}
.wt700{width: 700px}
.wt750{width: 750px}
.wt800{width: 800px}
.wt850{width: 850px}
.wt900{width: 900px}

.wt100per{width: 100%}
.wt95per{width: 95%!important}
.wt90per{width: 90%!important}
.wt85per{width: 85%!important}
.wt80per{width: 80%!important}
.wt75per{width: 75%!important}
.wt70per{width: 70%!important}
.wt65per{width: 65%!important}
.wt60per{width: 60%!important}
.wt55per{width: 55%!important}
.wt50per{width: 50%!important}
.wt45per{width: 45%!important}
.wt40per{width: 40%!important}
.wt35per{width: 35%!important}
.wt30per{width: 30%!important}
.wt25per{width: 25%!important}
.wt20per{width: 20%!important}
.wt15per{width: 15%!important}
.wt10per{width: 10%!important}
.wt5per{width: 5%!important}

.mwt600{max-width: 600px!important;width: 100%;}

.ht10{height: 10px}
.ht15{height: 15px}
.ht20{height: 20px}
.ht25{height: 25px}
.ht30{height: 30px}
.ht35{height: 35px}
.ht40{height: 40px}
.ht45{height: 45px}
.ht50{height: 50px}
.ht55{height: 55px}
.ht60{height: 60px}
.ht65{height: 65px}
.ht70{height: 70px}
.ht75{height: 75px}
.ht80{height: 80px}
.ht85{height: 85px}
.ht90{height: 90px}
.ht95{height: 95px}
.ht100{height: 100px}
.ht150{height: 150px}
.ht200{height: 200px}
.ht250{height: 250px}
.ht300{height: 300px}
.ht350{height: 350px}
.ht400{height: 400px}
.ht450{height: 450px}
.ht500{height: 500px}
.ht550{height: 550px}
.ht600{height: 600px}
.ht650{height: 650px}
.ht700{height: 700px}
.ht750{height: 750px}

.ml5{margin-left: 5px}
.ml10{margin-left: 10px}
.ml15{margin-left: 15px}

.fw100{font-weight: 100}
.fw200{font-weight: 200}
.fw300{font-weight: 300}
.fw400{font-weight: 400}
.fw500{font-weight: 500}
.fw600{font-weight: 600}
.fw700{font-weight: 700}

.fs0_9em{font-size: 0.9em}
.fs0_95em{font-size: 0.95em}
.fs1_05em{font-size: 1.05em}
.fs1_1em{font-size: 1.1em}
.fs1_2em{font-size: 1.2em}


.ta-ctr{text-align: center}
.ta-lft{text-align: left}
.ta-rgt{text-align: right}

.br-cont{display: inline-block}

.clr-blue { color: #00a7d3!important;}
.clr-navy { color: #001a28!important;}

.box-room {
	width:100%;
	margin: 0 auto;
	overflow:hidden;
	text-align:center;
	position: relative;
	padding: 5% 0 5% 0;
	z-index: 1;
	pointer-events:all;
}


.box-room-b {
	width:100%;
	margin: 0 auto;
	overflow:hidden;
	text-align:center;
	position: relative;
	padding: 5% 0 5% 0;
	z-index: 1;
	pointer-events:all;
}

.box-befor {
	width: 100%;
	margin-bottom: -2px;
	filter: drop-shadow(0px 0px 10px rgba(20,35,63,.15));
}

.box-after {
	width: 100%;
	margin-top: -2px;
	filter: drop-shadow(0px 0px 10px rgba(20,35,63,.15));
}

.box-befor img {
	width: 110%;
}

.box-after img {
	width: 110%;
	transform:rotate(180deg);
}

@media (max-width:600px){
	
	.box-after {
		margin-top: -8px;
	}
	
	.box-room {
		padding: 13% 0 10% 0!important;
	}
	
	.box-room-b {
		padding: 13% 0 10% 0!important;
	}
	
}




.box::before {
    content: url('../images/box-pic.svg');
    display: block;
	width: 100%;
	position:absolute;
	top:-0px;
	left: 0;
	right: 0;
	z-index: 1;
	background: none;
}


.box-room-top {
	width:100%;
	margin: 0 auto;
	overflow:hidden;
	text-align:center;
	position: relative;
	padding: 5% 0 3% 0;
	z-index: -1;
	pointer-events:none;
}

.about-room {
	width:100%;
	margin: 0 auto;
	overflow:hidden;
	text-align:center;
	position: relative;
	padding: 5% 0 5% 0;
	color: #fff;
	z-index: 1;
	pointer-events:none;
	background-image:url("../images/bg_about.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.zenkoku-room {
	width:100%;
	margin: 0 auto;
	overflow:hidden;
	text-align:center;
	position: relative;
	padding: 5% 0 5% 0;
	color: #fff;
	z-index: 1;
	pointer-events:none;
	background-image:url("../images/bg_zenkoku.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: bottom 30% center;
}

@media (max-width:600px){
	
	.zenkoku-room {
		background-size: 200%;
		background-position: top right;
	}
	
}

.about-screen {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(29,13,53,0.75)!important;
	z-index: -1;
}

.feature-box { 
	width:100%;
	margin: 0 auto;
	overflow:hidden;
	text-align:center;
	position: relative;
	background-color: #001a28;
	color: #fff;
	padding: 4% 0 2% 0;
	z-index: 1;
}

.feature-tit {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 240px;
	padding: 2.5% 3% 2% 3%;
	background-color: #fff;
	color: #00a7d3;
	z-index: 3;
	text-align: left;
	box-shadow: 7px 7px 0px rgba(0,0,0,0.15);
	font-size: 0.9em;
	letter-spacing: 0.1em;
}

.feature-tit img {
	width: 100%;
	max-width: 230px;
}

.feature-inner {
	position: relative;
	width:100%;
}

.feature-case { 
	width:100%;
	max-width: 1300px;
	margin: auto;
	padding: 2% 3% 1.5% 3%;
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.feature-case-bg { 
	position: absolute;
	z-index: -1;
	top: 0;
	right: 0;
	width:85%;
	height: 100%;
	background-color: #00a7d3;
}

.feature-pic {
	position: relative;
	width: 47%;
	z-index: 2;
}

.feature-txt { 
	width: 47%;
	text-align: left;
	line-height: 1.8em;
}

.feature-txt p { 
	font-size: 1.05em;
	font-weight: 600;
	margin: 0.3em 0;
}

@media (max-width:768px){
	

	.feature-tit {
		padding: 4%;
	}
	
	.feature-case {
		padding: 10% 3%;
		display: block;
	}
	
	.feature-pic,
	.feature-txt { 
		width: 100%;
		max-width: 600px;
		margin: auto;
		margin-bottom: 10px;
	}
	
	.feature-case-bg {
		width: 100%;
	}

}

@media (max-width:600px){
	
	.feature-box { 
		padding: 4% 0 10% 0;
	}
	
	.feature-tit {
		padding: 5% 4% 4% 4%;
	}
	
	.feature-tit img {
		max-width: 200px;
	}
}

.box-pic {
	width:100%;
	height:100%;
	display: block;
	overflow: hidden;
	background: rgba(0,0,0,0.5)!important;
	line-height: 0;
	background-position: center top 40%;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 1;
}


.bg-mark {
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.07;
	background-image:url("../images/logo_mark.png");
	background-repeat: no-repeat;
	background-size: 500px;
	background-position: right -100px bottom -100px;
	z-index: 1;
}

@media (max-width:600px){
	
	.bg-mark {
		background-size: 350px;
		background-position: right -100px bottom -100px;
	}
	
}

.form-bg {
	width:100%;
	height:100%;
	display: block;
	overflow: hidden;
	position:absolute;
	padding: 0;
	top:0;
	line-height: 0;
	background-image:url("../images/form_bg.gif");
	z-index: 2;
}

.stripe-bg {
	width:100%;
	height:100%;
	display: block;
	overflow: hidden;
	position:absolute;
	padding: 0;
	top:0;
	line-height: 0;
	background-image:url("../images/stripe_bg.png");
	opacity: 0.15;
	z-index: 2;
}

.over-small {
	width:100%;
	height:100%;
	display: block;
	background: rgba(0,0,0,0.4)!important;
	z-index: 1;
}


@media (max-width:600px){
	
	
	.box-room-top {
		padding: 10% 0 10% 0;
	}
	
}

.set-pic{
	color: #fff;
	position:relative;
	z-index: 0;
}

.set-fff{
	background-color: #fff;
	position:relative;
	z-index: 1;
}

.set-f7{
	background-color: #f7f7f7;
	color: #262626;
	position:relative;
	z-index: 1;
}

.set-l-blue{
	background-color: #e9f0ff;
	color: #262626;
	position:relative;
	z-index: 1;
}

.set-bk{
	background-color: #262626;
	color: #fff;
	position:relative;
	z-index: 1;
}

.set-navy {
	background-color: #001a28;
	color: #fff;
	position:relative;
	z-index: 1;
}

.set-blue {
	background-color: #00a7d3;
	position:relative;
	z-index: 1;
	color: #fff;
}

.bg-dot {
	position: absolute;
	 top:0;
	 left: 0;
	 width: 100%;
	 height: 100%;
	 opacity: 0.07;
	 background-image:url("../images/bg_dot.png") 
}


/*.bg-sea {
	 position: absolute;
	 top:0;
	 left: 0;
	 width: 100%;
	 height: 100%;
	 opacity: 0.8;
	 background-image:url("../images/sea.png");
	 background-repeat: no-repeat;
	 background-size: 100%;
}*/

.btw3 {
	border-top: solid 3px #fff;
}

.bg-sea {
	 position: absolute;
	 top:0;
	 left: 0;
	 width: 100%;
	 height: 100%;
	 opacity: 0.8;
	 background:url("../images/sea.png") left 0 top 0 / 100% auto no-repeat,
		 url("../images/flag.png") left 50% bottom 0 / 100% auto no-repeat;
}

 .bg-flag {
	 position: absolute;
	 top:0;
	 left: 0;
	 width: 100%;
	 height: 100%;
	 opacity: 0.8;
	 background:url("../images/flag_01.png") left -20% top 0 / 50% auto no-repeat,
		 url("../images/flag_02.png") right -20% top 0 / 50% auto no-repeat;
}



@media (max-width:600px){
	 .bg-flag {
		 background:url("../images/flag_01.png") left -50% top 0 / 60% auto no-repeat,
		 url("../images/flag_02.png") right -50% top 0 / 60% auto no-repeat;
	}
	
	 .bg-sea {
		 
		 background:url("../images/sea.png") left 0 top 0 / 200% auto no-repeat,
		 url("../images/flag.png") left 50% bottom 0 / 200% auto no-repeat;
		 
	}
}




.top-border{
	border-top: solid 1px #fff;
}

.inner-foot, .inner-1200, .inner-1100, .inner-1000, .inner-900, .inner-800, .inner-600{
	width:94%;
	margin: auto;
	text-align:center;
	position: relative;
	pointer-events:all;
	z-index: 4;
}

.inner-sps {
	width:100%;
	padding: 0 0 0 3%;
	margin: auto;
	text-align:center;
	position: relative;
	pointer-events:all;
	z-index: 4;
}

.inner-sps{
	display: flex;
	justify-content: space-between;
}

.inner-1200{
	max-width: 1200px;
}

.inner-1100{
	max-width: 1100px;
}

.inner-1000{
	max-width: 1000px;
}

.inner-900{
	max-width: 900px;
}

.inner-800{
	max-width: 800px;
}

.inner-600{
	max-width: 600px;
}

@media (max-width:600px){
	
	.inner-sps, .inner-1200, .inner-1100, .inner-1000, .inner-900, .inner-800, .inner-600,{
		width:92%;
	}
	
	.inner-sps {
		padding: 0 0 0 4%;
	}
}