@charset "utf-8";


@media screen and (max-width: 767px) {
	
.pc-display{
display: none!important		
}


.sp-display{
display: block!important
}

.sp-none{
display: none!important	
}
	

/*===========================
#super-top
===========================*/
#super-top{

position:relative;
z-index:1000000;
}

#super-top .inner{
width:98%;
margin:0 auto;
padding:11px 1% 11px 1%;
text-align:center;
}



#super-top .inner h1{
float:none;
display:inline;
width:180px;
}


#super-top .inner h1 img{
width:150px;
height:auto;
}


#super-top .inner h2{
display:none;
}



/*===========================
#main-img
===========================*/
#main-img{
width:100%;
margin:0 auto;
position:relative;
height:auto;
}

#main-img .main-img-slider{
width:100%;
position:static;
top:0;
right:0;
}

#main-img .title{
width:200px;
height:180px;
position:relative;
bottom:0;
left:20px;
margin:-140px 0 0 0;
}

#main-img .title p.semi{
font-size:19px;
padding:28px 0 0 0;
text-indent:-10px;
}

#main-img .title p.normal{
font-size:25px;
text-indent:-10px;
letter-spacing:-2px; 
}

#main-img .title p.big{
font-family: source-han-sans-japanese, sans-serif;
font-weight: 700;
font-style:italic;
font-size:42px;
letter-spacing:-2px;
text-indent:-10px;
}



/*===========================
.apply-btn
===========================*/

.top-apply {
width:100%;
padding:0px 0 40px 0;
margin:40px auto 0px;
position:relative;

}

.middle-apply{
width:90%;
margin:0 auto;
padding:30px 0 30px 0;
}



.top-apply .inner{
width:270px;
position:relative;
top:0px;
right:0;
margin:0 auto;
z-index:71;
}

.top-apply .btn-bg,
.middle-apply .btn-bg{
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
	 -o-box-sizing: border-box;
	-ms-box-sizing: border-box;
		box-sizing: border-box;
}

.top-apply .btn-bg,
.middle-apply .btn-bg{
padding:13px 5px 17px;
}


.top-apply a .btn .circle,
.middle-apply a .btn .circle{
width:55px;
height:52px;
top:-40px;
left:-15px;
border-radius:100px;
padding:3px 0 0 0;
line-height:0.75;
}


.top-apply a .btn .circle span.normal,
.middle-apply a .btn .circle span.normal{
font-size:11px;
letter-spacing:-1px;
}


.top-apply a .btn .circle span.big,
.middle-apply a .btn .circle span.big{
font-size:19px;
letter-spacing:-1px;
position:relative;
top:6px;
}


.top-apply a .btn .text,
.middle-apply a .btn .text{
text-align:center;
font-size:22px;
text-shadow:0px 0px 5px #d97000;
}



.top-apply .suggest,
.middle-apply .suggest{
width:94%;
margin:0 auto 0;
color:#f47301;
text-align:center;
font-family: source-han-sans-japanese, sans-serif;
font-weight: 700;
font-style: normal;
padding:0 0 30px 0;
position:relative;

}

.top-apply .suggest:before,
.middle-apply .suggest:before{
content:"";
display: inline-block;
height:16px;
border-left:solid 3px #f47301;
border-radius:2px;
padding:0 0 0 0px;
transform:rotate(-25deg);
position:relative;
top:3px;
left:-10px;
}

.top-apply .suggest:after,
.middle-apply .suggest:after{
content:"";
display: inline-block;
height:16px;
border-left:solid 3px #f47301;
border-radius:2px;
padding:0 0px 0 0px;
transform:rotate(25deg);
position:relative;
top:3px;
left:10px;
}


/*===========================
#what
===========================*/
#what{
width:100%;
margin:-50px auto 0px;
position:relative;
z-index:70;
}

#what .inner{
width:100%;
height:260px;
position:relative;
overflow-y:hidden;
}

#what img{
width:100%;
height:auto;
position:absolute;
left:0;
top:0;
z-index:3;
box-shadow:none;
}



#what .copy{
padding:40px 0 0 0;
position:absolute;
right:15px;
top:10px;
z-index:4;
}

#what .copy .semi{
font-size:18px;
letter-spacing:0px;
}


#what .copy .catch{
font-size:22px;
letter-spacing:-2px;
}


/*===========================
#target
===========================*/

#target{
margin:80px 0 0 0;
}



#target h2{
width:100%;
font-size:27px;
line-height:1.25;
padding:45px 0 20px 0;
letter-spacing:-1px;
}


#target h2 img{
width:280px;
height:auto;
margin:-105px auto 10px;
}


/* box-wrapper01 */

#target .box-wrapper01{
width:100%;
margin:40px auto 0;
}

#target .box-wrapper02{
width:100%;
margin:30px auto 0;
}



/* all box */
#target .box-wrapper01 .box,
#target .box-wrapper02 .box{
width:92%;
float:none;
margin:40px auto 40px;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
	 -o-box-sizing: border-box;
	-ms-box-sizing: border-box;
		box-sizing: border-box;
}

#target .box-wrapper01 .box:nth-child(3),
#target .box-wrapper02 .box:nth-child(2){
margin:40px auto 40px;
}

#target .box-wrapper01 .box ul li,
#target .box-wrapper02 .box ul li{
padding:2px 8px;
}

#target .explain{
width:92%;
font-size:16px;
}


/*===========================
#checklist
===========================*/


#checklist{
padding:40px 0 50px 0;
}

#checklist h2{
width:100%;
margin:0px auto -30px;
position:relative;
}

#checklist h2 img{
width:96%;
height:auto;
display:block;
margin:0 auto;
}

#checklist .bg{
padding:40px 0 110px 0;
}


#checklist .inner{
width:100%;
}



#checklist ul li{
width:95%;
color:#23185;
list-style-type:none;
background:#fff url(../images/icon-target.png) no-repeat 20px 25px;
background-size:25px 25px;
font-size:17px;
line-height:1.35;
padding:22px 20px 22px 55px;
margin:25px auto 0;
float:none;
border:solid 2px #b8b8b8;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
	 -o-box-sizing: border-box;
	-ms-box-sizing: border-box;
		box-sizing: border-box;
box-shadow:5px 5px 0px 0px #e3e2e2;
position:relative;
left:-3px;
}

#checklist ul li:nth-child(2n){
margin:25px auto 0;
}

#checklist ul li:nth-child(5){
width:95%;
}


/*===========================
#offer
===========================*/

#offer{
position:relative;
width:100%;
margin:0 auto;
padding:100px 0 20px;
}


#offer .title{
width:250px;
height:250px;
text-align:center;
border:solid 4px #b4b4b4;
background-color:rgba(255,255,255,0.8);
position:absolute;
z-index:20000;
top:-100px;
left: 50%;
transform:translateX(-50%);
-webkit-transform:translateX(-50%);

}

#offer .title p.semi{
font-family:futura-pt, sans-serif;
font-weight: 500;
font-style:italic;
color:#898989;
font-size:23px;
padding:50px 0 0 0;
text-indent:-10px;
}

#offer .title p.catch{
font-family: source-han-sans-japanese, sans-serif;
font-weight: 700;
font-style:normal;
font-size:38px;

}

#offer img{
width:100%;
height:auto;
position:relative;
left:0;
top:15px;
}


/*===========================
#feature
===========================*/


#feature{
margin:50px auto 0;
}

#feature h2.title{
background:#efefef;
}

#feature h2.title .inner{
width:100%;
margin:0 auto;
height:170px;
position:relative;
}

#feature h2.title .inner .img{
width:50%;
text-align:right;
position:relative;
margin:-15px 0px 0 0;
display:block;
float:left;
}

#feature h2.title .inner img{
height:185px;
width:auto;
display:block;
margin:0 auto;
line-height:0;
}


#feature h2.title .inner .text{
width:50%;
position:relative;
display:inline;
float:right;
padding:25px 0 0 0;
top:0;
}


#feature h2.title .inner .text span.semi{
font-size: 18px;
}

#feature h2.title .inner .text span.catch{
font-size: 30px;
letter-spacing:-1px;
}


#feature .box-wrapper{
width:100%;
margin:0 auto;
padding:25px 0px 25px;
}


#feature .box-wrapper .box{
width:92%;
margin:65px auto 0;
background:#f8f8f8;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
	 -o-box-sizing: border-box;
	-ms-box-sizing: border-box;
		box-sizing: border-box;
float:none;
}


#feature .box-wrapper .box:nth-child(2n){
margin:65px auto 0;
}



#feature .box-wrapper .box .sentence{
font-size: 15px;
line-height:1.5;
padding:10px 25px 10px;
}



#feature .point{
font-size:25px;
text-indent:-4px;
line-height:1.35;
padding:20px 2% 20px;
}


/*===========================
#publish
===========================*/
#publish{
padding:90px 0 10px 0;
}
#publish h2{
border-top:solid 1px #8c8c8c;
position:relative;
width:100%;
margin:0 auto;
text-align: center;
}



#publish h2 .inner{
position:absolute;
top:-60px;
padding:10px 20px 10px 20px;
}

#publish h2 .inner .semi{
font-size: 45px;
line-height:1.4;
}



#publish h2 .inner .catch{
font-size:17px;
}

#publish .box{
width:100%;
margin:90px auto 0;

}
#publish .box p.text{
display:block;
position:relative;
z-index:20;
margin:0 0px 0 0;
top:0;
padding:40px 0 0 20px;
}

#publish .box p.text .semi{
font-family: futura-pt-bold, sans-serif;
font-weight: 700;
font-style: normals;
color: #231815;
font-size: 22px;
line-height:1.5;

} 

#publish .box img{
display:block;
width:100%;
height:auto;
position:relative;
top:-15px;
z-index:10;
box-shadow:0px 0px 0px 0px #fff;
}

#publish .box p.text .catch{
font-family: source-han-sans-japanese, sans-serif;
font-weight: 700;
font-style:normal;
font-size:25px;
color:#231815;
line-height:1.4;
letter-spacing:-2px;
}

/*===========================
#media
===========================*/

#media .media-bg{
width:100%;
margin:190px auto 0;
background-position:center 0px;
}



#media .media-bg:after{
content:"";
background-color:rgba(232, 232, 232, 0.8);
position: absolute;
width:100%;
height:100%;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index:9;
}

#media h2{
width:96%;
margin:-170px auto 0;
position:relative;
z-index:10;
}

#media h2 img{
width:100%;
height:auto;
}



#media .box{
width:100%;
padding:0 0 0 0;
}

#media .box:after {
content: "";
clear: both;
height: 0;
display: block;
visibility: hidden;
}

#media .box img.mock{
display:block;
width:75%;
margin:0 auto;
height:auto;
float:none;
}

#media .box img.chart{
display:block;
width:98%;
height:auto;
margin:0 auto;
float:none;
padding:25px 0 20px 0;
}

#media .sentence{
width:94%;

}

#media .sentence p{
font-size: 15px;
line-height: 1.75;
padding: 10px 0 10px;
letter-spacing:1px;
}




/*===========================
#flow
===========================*/

#flow {
margin:45px auto 0;
}

#flow .title-wrapper{
    margin: 0 auto 70px;
}

#flow .title-wrapper h2.title{
width:195px;
height:195px;
text-align:center;
border:solid 4px #b4b4b4;
background-color:rgba(255,255,255,0.8);
display:inline-block;
position:relative;
z-index:21;
}

#flow .title-wrapper img{
width:100%;

}

#flow .title-wrapper h2.title p.semi{
font-size:19px;
padding:30px 0 0 0;
text-indent:-10px;
}

#flow .title-wrapper h2.title p.catch{
font-size:34px;
}

#flow .step {

line-height: 0.6;
font-size: 45px;
}
#flow .box {
width:90%;
margin:0 auto;
padding:25px 25px 25px 25px;

}

#flow .box h3 {
font-size: 24px;
padding:20px 0 20px 0;
}



#flow .left .text{
float:none;
width:100%;
height:auto;
}

#flow .box .text p {
font-size:15px;
}

#flow .left img{
float:none;
width:100%;
height:auto;
}

#flow .right .text{
float:none;
width:100%;
height:auto;
}


#flow .right img{
float:none;
width:100%;
height:auto;
}



#flow .addtional{
width:98%;
margin:30px auto 0;
}
#flow .addtional .text{
display:block;
position: relative;
top:0px;
}

#flow .addtional .text .semi{

}
#flow .addtional .text .catch{

}


#flow .addtional img{
width:240px;
display:block;
margin:0 auto;
}


/*===========================
.white-paper
===========================*/

.white-paper{
	padding:10px 0  0;
	margin:0 0 0px 0;
	}
	
	.white-paper h2{
	padding:0px 2% 0px 2%;
	}
	
	.white-paper h2 span.small {
	font-size: 20px;
	display:block;
	}
	
	.white-paper h2 span.big {
	font-size: 31px;
	}
	
	
	.white-paper{
	width:92%;
	margin:0 auto;
	}
	
	.white-paper .box .left{
	float:none;
	width:100%;
	}
	
	
	.white-paper .box .left img{
	width:80%;
	height:auto;
	display:block;
	margin:0 auto 20px;
	}
	
	
	.white-paper .box .right{
	float:none;
	width:100%;
	padding:0px 0 0 0;
	}
	
	.white-paper .box .right h4{
	padding:10px 5% 10px 5%;
	width:75%;
	text-align:center;
	background: #f8f8f8;
	border:solid 2px #aaa;
	font-size:16px;
	margin:0 auto 20px;
	}
	
	.white-paper .box .right h3{
	margin:0 0 20px 0;
	}
	
	.white-paper .box .right h3 .semi{
	font-size:20px;
	
	}
	
	.white-paper .box .right h3 .big{
	font-size:20px;
	
	}
	
	.white-paper .box .right h5{
	font-size:18px;
	margin:0 0 20px 0;
	}
	
	.white-paper .box .right p{
	font-size:14px;
	}
	
	
	.white-paper .catch {
	font-style: normal;
	font-size: 26px;
	padding:20px 3% 20px 3%;
	text-align:center;
	}
/*===========================
#message
===========================*/
#message h3 {
background-size:contain;
margin: -40px 0 0 0;
padding: 80px 0 60px 0;
font-size: 34px;
letter-spacing: 3px;
} 


#message h3 span.sp-small{
font-size: 26px;
}

#message .sentence {
width:94%;
margin:10px auto 0;
text-align:left;
}

#message .sentence p {
padding: 10px 0 10px 0;
font-size: 15px;
line-height: 1.6;
}


/*===========================
#lets
===========================*/


#lets .box{
width:100%;
margin:10px auto 0;
padding:0 0 0px 0;
position:relative;
}
#lets .box .text{
display:block;
position:absolute;
z-index:20;
margin:0 0 0 0px;
top:10px;
right:10px;
}

#lets .box .text .semi{
font-family: futura-pt-bold, sans-serif;
font-weight: 700;
font-style: normals;
color: #231815;
font-size: 28px;
line-height:1.5;

} 

#lets .box img{
display:inline-block;
width:100%;
height:auto;
position:relative;
z-index:10;
box-shadow:0 0px 0px 0px #fff;
padding:0px 0 0 0;
}



#lets .box .text .semi{
font-family: futura-pt-bold, sans-serif;
font-weight: 700;
font-style: normals;
color: #231815;
font-size: 22px;
line-height:1.5;
} 



#lets .box .text .catch{
font-size:23px;
line-height:1.4;
letter-spacing:-2px;
}



/*===========================
.follow
===========================*/


.follow h3{
padding:10px 20px 20px 20px;
font-size:18px;
line-height:1.2;
text-align:center;
}

/*===========================
.btn-wrapper
===========================*/



.btn-wrapper{
width:90%;
margin:0 auto;

}


.view-btn{
float:none;
width:100%;
margin:10px auto 0;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
	 -o-box-sizing: border-box;
	-ms-box-sizing: border-box;
		box-sizing: border-box;
padding:0 5px;
}

.info-btn{
float:none;
width:100%;
margin:10px auto 0;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
	 -o-box-sizing: border-box;
	-ms-box-sizing: border-box;
		box-sizing: border-box;
padding:0 5px;
}

.view-btn .btn-bg,
.info-btn .btn-bg{
padding:8px 0px 12px;
}


.view-btn a .btn .text,
.info-btn a .btn .text{
text-align:center;
font-size:16px;
text-shadow:0px 0px 5px #005681;
}



/*===========================
footer
===========================*/

footer{
margin:60px auto 0;
background:#efefef;
padding:5px 2% 7px;
color:#231815;
font-family: fot-tsukuardgothic-std, sans-serif;
font-weight: 700;
font-style: normal;
font-size:12px;
line-height:1.2;
text-align:center;
}



}/* responsive-closed */


@media screen and (min-width:767px) and ( max-width:1024px) {

html,body{
    width: 100%;
}
}


/* 960px〜1279px：小型PC
------------------------------ */
@media screen and (min-width:960px) and (max-width:2980px) {

}

/* 1280px〜：大型PC
------------------------------ */
@media screen and (min-width:2980px) {

}