.common-header{width: 100%; max-width: 1000px; margin: 0 auto; background:#000; border-bottom: solid 1px #444444;}
.common-header img{width:100%;}
.common-header-res{width: 100%; max-width: 173px; float: left; padding:0; margin: 0;}



.header-box{width: 100%; max-width: 1000px; margin: 0 auto;}
.header-box img{width: 100%;}
.cont-box{width: 100%; max-width: 1000px; margin: 0 auto; background:url(/haruka6/gentourondo/landing/img/cont-bg.jpg) top center repeat-y; -moz-background-size:100% auto; background-size:100% auto; }

.tra-box{ width: 95%; max-width: 1000px; padding: 2% 2.5%; background:#000;}

.tra-box li{width: calc(49% - 10px); float: left; margin: 0 0.5%; border: solid 5px #fff; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; overflow:hidden;}
.tra-box a{width: 100%; text-align: center;}
.tra-box a:hover{filter:alpha(opacity=65); -moz-opacity:0.65; -khtml-opacity:0.65; opacity:0.65;}
.tra-box a img{width: 100%;}

.lead-title{font-size: 37.2px;}
.lead-box{color: #f4c5a5; width: 80%; max-width: 950px; padding: 5px 0 20px 0; margin: 0 auto; font-size: 18px; line-height:1.61; font-feature-settings : "palt";}
.lead-in-box-title{font-size: 47.123px; padding-bottom: 32px; line-height:1.20; padding-top: 16px;}
.lead-in-box-title2{font-size: 47.123px; padding-bottom: 32px; line-height:1.20; padding-top: 16px;}
.lead-in-box-title2 br{display: none;}

.lead-in-box-title3{font-size: 38.123px; padding-bottom: 32px; line-height:1.20; padding-top: 16px;}
.lead-in-box-title3 br{display: none;}

.of-btn a br{display: none;}
.lead-box span{color: #f4a4a4; font-size: 130%;}

hr.line-bk{width: 88%; max-width: 950px; margin: 10px auto; padding: 0; border:none; border-top: 10px solid #000;}
hr.line-bk2{width: 88%; max-width: 950px; margin: 0 auto; padding: 0; border:none; border-top: 10px solid #000;}
hr.line-bk3{width: 100%; max-width: 1000px; margin: 0 auto; padding: 0; border:none; border-top: 10px solid #000;}

.cst-box{border: solid 1px #f4a4a4; background: #f4a4a4; background-color:rgba(244,164,164,0.70); padding: 10px; margin: 10px 0; color: #51464a;}

.landing-box-title{width: 95%; font-size: 47.123px; padding: 36px 0 12px 0; color: #d8c2f3; margin: 0 auto;}

.chara-box{width: 86%; max-width: 1000px; margin: 0 auto;}
.chara{width: 100%;}

.banner{width: 86%; max-width: 1000px; margin: 0 auto;}
.banner img{width: 100%;}

.banner2{width: 86%; max-width: 1000px; margin: 0 auto;}
.banner2 img{width: 100%;}

.haruka-info{width: 81%; max-width: 890px; margin: 0 auto 0 auto;
padding:18px 2.5%;
background:url(/haruka6/gentourondo/landing/img/harula-info.png) top center no-repeat; -moz-background-size:100% auto; background-size:100% auto; 
}
.haruka-info-title{color: #cdbaef; font-size: 24px; font-feature-settings : "palt"; padding-bottom: 16px; text-shadow: 0 -1px 1px #000, -1px 0 1px #000, 1px 0 1px #000;}
.haruka-info p{max-width: 500px; color: #f4c5a5; text-shadow: 0 -1px 1px #000, -1px 0 1px #000, 1px 0 1px #000;}


.ss-box{width: 86%; max-width: 1000px; margin: 0 auto;}
.ss-box li{width: 25%; float: left;}
.ss-box img{width: 100%;}

.left-chara-box{
width: calc(50.3% - 10px);
border: solid 5px #000;
margin: 0 auto;
text-align: left;
padding: 0;
float: left;
}
.right-chara-box{
width: calc(49.7% - 5px);
border: solid 5px #000;
border-left: none;
margin: 0 auto;
text-align: left;
padding: 0;
float: right;
}

.of-btn{width: calc(70% - 20px); max-width: 1000px; margin: 32px auto; text-align: center;}
.of-btn img{width: auto; max-width:100%;}
.of-btn a:hover{background: #8d3639; color: #f4c5a5;}

.left-chara-box img, .right-chara-box img{width: 100%;}


.landing-footer-box{width: calc(88% - 20px); max-width: 1000px; margin: 0 auto; text-align: center; color: #fff; padding: 10px 0;}


.tra-box2{
	background: #8d3639;
	color: #f4c5a5;
	width: calc(86% - 10px);
	margin: 0 auto;
	padding: 5px;
	
}
.tra-box2 dl{ width: 100%; margin: 0 auto;}
.tra-box2 dt{ width: 38%; margin: 0 auto; text-align: left; float: left; font-size: 25px; padding-top: 1%; text-align: center; padding-left: 1%;}
.tra-box2 dd{ width: 59%; margin: 0 auto; text-align: left; float: right;}

.tra-box2 dd li{width: 49%; margin: 0 0.5%; text-align: left; float: left;}
.tra-box2 dd li img{width: 100%;}
.tra-box2 img{width: auto; max-width: 100%;}

.tra-box2 dt a{width: 100%; text-align: center; background: #f4c5a5; color: #51464a; display: block; border-radius: 5px; padding: 10px 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; font-size: 18px;  width: 80%; margin: 5px auto;}
.tra-box2 dt a:hover{background: #51464a; color: #f4c5a5;}

.tra-box2 dt .info-link a{width: 99%; display:inline-block;}

.at{width: 85%; max-width: 890px; margin: 0 auto; color: #f4c5a5; font-size: 12px; padding-top: 4px;}

@media screen and (max-width: 640px) {
.lead-box{font-size: 16px;}
.lead-title{font-size:5.375vw; letter-spacing: 0.1em;}
.lead-in-box-title{font-size:8.375vw; text-align: center; padding-bottom: 24px; padding-top: 0px;}
.lead-in-box-title2{font-size:7.375vw; text-align: center; padding-bottom: 24px; padding-top: 0px;}
.lead-in-box-title2 br{display: block;}
.brno br{display: none;}

.lead-in-box-title3{font-size:7.375vw; text-align: center; padding-bottom: 24px; padding-top: 0px;}
.lead-in-box-title3 br{display: block;}

,lead-in-box-title span{color: #f4a4a4; font-size:10.375vw;}
.lead-box span.titlespan{color: #f4a4a4; font-size:10.375vw;}
.lead-box span{color: #f4a4a4; font-size:130%;}
.landing-box-title{font-size:7.375vw;}
.tra-box li{width: calc(100% - 10px); float: none; margin-bottom: 5px;}
hr.line-bk,hr.line-bk2{border-top: 5px solid #000;}

.left-chara-box{ width: calc(100% - 10px); border: solid 5px #000; float: none; }
.right-chara-box{ width: calc(100% - 10px); border: solid 5px #000; float: none; }

.ss-box li{width: 50%; float: left;}

.tra-box2 dt{ width: 100%; float: none; font-size: 25px; padding-top: 20px; text-align: center; padding-bottom: 10px;  padding-left: 0; font-size:6.875vw;}
.tra-box2 dt div{padding-top: 10px;}
.tra-box2 dd{ width: 100%; margin: 0 auto; text-align: left; float: none; padding-bottom: 10px;}
.tra-box2 dd li{width: 99%; float: none; padding-bottom: 5px;}

.of-btn a br{display: block;}
.of-btn{width: calc(80% - 20px);}

.haruka-info-title{font-size:6.000vw;}


.haruka-info{width: 81%; max-width: 890px; margin: 0 auto 0 auto;
padding:18px 2.5%;
background:url(/haruka6/gentourondo/landing/img/harula-info.png) -400px 0 no-repeat; background-color:rgba(0,0,0,2.00);
}

}