@charset "utf-8";


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

.pc-display2{
display: none!important		
}

.sp-display{
display: block!important
}
	
/*===========================
.super-top
===========================*/
.super-top{
padding:4px 0 4px 0;
font-size:17px;
}	
.super-top .inner{
width:94%;
padding: 10px 2% 10px 2%;
}


/*===========================
.sample
===========================*/
section.sample{
width:95%;
margin:20px auto 20px;

}

section.sample img{
width:100%;
height:auto;
}



/*===========================
.apply-btn
===========================*/
section.apply-btn{
width:90%;
margin:20px auto 20px;

}

section.apply-btn img{
width:100%;
height:auto;
}



/*===========================
.top-text
===========================*/
	
.icon-media{
width:100px;
left: 10px;		
}

.top-text{
width:100%;
margin: -50px auto 0;
left: 0px;	
}


h1.main-img{
width:96%;
margin:0 auto;
padding:10px 0 10px 0;
}

h1.main-img img{
width:100%;
height: auto;
}


#main-img-wrapper{
background-size:50% auto;
padding:0 0 0 0;
}

/*===========================
h2,h3
===========================*/

.caption{
font-size:14px;
margin:0 0 0 0;
padding:0 0px 5px 0px;
}

.caption-border {
width:90px;
margin:0 auto;
text-align:center;
background-color: #000; /* 線色 */
border-radius: 5px; /* 線幅の半分 */
content: "";
display: block;
height: 3px; /* 線幅 */
}

/*===========================
.title
===========================*/

.title{
background:#ffd500;
padding:20px 0 20px 0;
text-align:center;
}


/*===========================
#icon-now
===========================*/

#icon-now .inner{
width:100%;
}

#icon-now .inner img{
display:block;
position:absolute;
width:110px;
height:auto;
right:10px;
top:-80px;
}


#icon-now .inner h3{
font-size:20px;
margin:10px 0 20px 0;
padding:0 2% 0 2%;
}

#icon-now .inner h2{
font-size:33px;
margin:0 0 0 0;
line-height: 1.5;
padding:0 2% 0 2%;
}

/*===========================
#what
===========================*/
section#what .inner{
width:100%;
margin:0 auto;
padding:0px 0 0 0;
}

section#what img.what-img{
width:100%;
height: auto;
display: block;
margin:0px auto 0px;
float:none;
}

section#what p{
width:90%;
float:none;
margin:0 auto;
padding:20px 3% 0px 3%;
line-height:2.0;
font-size:15px;	
font-family: source-han-sans-japanese, sans-serif;
font-weight: 500;
font-style: normal;
color:#000;
}


/*===========================
#suitable
===========================*/
#suitable{
margin:30px auto 0;
}

#suitable .title h2{
font-size:28px;
margin:20px 0 0 0;
line-height:1.35;
}


#suitable .inner{
width:94%;
margin:0 auto;
padding:40px 0 0 0;
}

#suitable ul.target li{
width:100%;
float:none;
padding: 17px 20px 17px 20px;
margin: 20px 0px 0 0;
text-indent:30px;
font-size:18px;
background: url(../images/icon-target.png) no-repeat 15px 15px;
background-size: 25px 25px;
position:relative;
right:2px;
}

#suitable ul.target li:nth-child(5){
width:100%;
}

#suitable .inner img{
width:85%;
}


/*===========================
#reason
===========================*/
#reason .title h3{
font-size:22px;
margin:10px 0 0 0;
line-height:1.35;
}



#reason .title h2{
font-size:31px;
margin:20px 0 0 0;
line-height:1.35;
}


#reason .inner{
width:96%;
margin:0 auto;
}

#reason ul.strong li{
width:100%;
min-height:100%;
margin:20px 0 0 0;
}

#reason ul.strong li:nth-child(2n){
margin:20px 0px 0 0;
}


#reason ul.strong li .number{
font-size:23px;
}

#reason ul.strong li .number-border{
width: 80px;
height: 6px;
}

#reason ul.strong li h4{
font-size:22px;
line-height:1.45;
}

#reason ul.strong li img{
width:100%;
}

#reason ul.strong li p.sentence{
font-size:15px;
}




/*===========================
#backup
===========================*/

#backup{
margin:100px auto 0;
}

#backup .title h3{
font-size:21px;
margin:10px 0 0 0;
line-height:1.35;
}



#backup .title h2{
font-size:25px;
margin:20px 0 0 0;
line-height:1.35;
letter-spacing:-1px;
}


#backup .inner{
width:100%;
padding:25px 0 0 0;
}

#backup .inner img{
display:block;
width:92%;
height:auto;
margin:0 auto;
}

#backup .inner .sentence{
width:96%;
margin:0px auto 0;
padding:0px 0 0 0;
}

#backup .inner .sentence p{
font-size:15px;
padding:10px 0 10px 0;
line-height:1.8;
}


#backup　.inner img{
width:500px;
height:auto;
display: block;
float:right;
}



/*===========================
#works
===========================*/

#works{
margin:30px auto 0;
}

#works .title h3{
font-size:21px;
margin:10px 0 0 0;
line-height:1.35;
}

#works .title h2{
font-size:30px;
margin:15px 0 0 0;
line-height:1.35;
}


.works-slider-wrapper{
width:100%;
margin:30px auto 0;
}


.works-slider li{
margin:0 10px 0 10px;	
}


.works-slider-wrapper .slick-next {
right: 20px!important;
z-index: 99;
top:50px!important;	
}

.works-slider-wrapper .slick-prev {
left: 20px!important;
z-index: 100;
top:50px!important;	
}

.works-slider-wrapper .slick-prev,
.works-slider-wrapper .slick-next{
width:30px!important;
height: 30px!important;
border:solid 3px #ffd500!important;
border-radius:60px!important;
opacity: 0.8;
color:#ffd500!important;
font-size: 20px!important;
font-weight:bold!important;
line-height: 32px!important;    
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
background: transparent;
text-align: center;
text-decoration:none;	
}

#works .inner{
width:92%;
margin:20px auto;
}

#works .inner p.sentence{
font-size:14px;
}

/*===========================
#support
===========================*/

#support{
margin:30px auto 0;
}

#support .title h3{
font-size:21px;
margin:10px 0 0 0;
line-height:1.35;
}



#support .title h2{
font-size:28px;
margin:20px 0 0 0;
line-height:1.35;
}


#support .inner{
width:94%;
margin:0 auto;
padding:30px 0 0 0;
}

#support .inner img{
width:100%;
height:auto;
display: block;
float:none;
}

#support .inner .sentence{
float:none;
width:100%;
padding:0 0 0 0;
}

#support .inner .sentence p{

font-size:15px;
}


/*===========================
#for-future
===========================*/

#for-future{
margin:30px auto 0;
}

#for-future .title h2{
font-size:26px;
margin:20px 0 0 0;
line-height:1.35;
}

.future-slider-wrapper{
margin:30px auto 0;
width:100%;
}


.future-slider2{

}

.future-slider2 li{
margin:0 0px 0 0px;
padding:0 10px 0 10px;

}


.future-slider2 li img{
width:100%;
height:auto;
display:block;
}


.future-slider-wrapper .slick-dots li{
 width: 20px;
 height: 20px;
margin:0 0px 0 0px;	
}

.future-slider-wrapper .slick-dots li button:before{
 font-size: 20px;
 line-height: 20px;
 width: 0px;
 height: 20px; 
}

.future-slider-wrapper .slick-dots li button{
width:20px;
height:20px;
}
.future-slider-wrapper .slick-dots li.slick-active button:before{
 opacity: .75;
 color:#ffd500;
}


#for-future .inner .because{
width:94%;
margin:60px auto 0;
}

#for-future .inner .because img{
width:35%;
}

#for-future .inner .because p{
width:62%;
float:right;
font-size: 20px;
line-height: 1.7;
padding: 15px 0 0 3%;
}


/*===========================
#for-future
===========================*/

#offer{
margin:30px auto 0;
}

#offer .title h2{
font-size:22px;
margin:20px 0 0 0;
line-height:1.35;
}

#offer .inner{
width:92%;
margin:20px auto 0;
}

#offer .inner p.sentence{
line-height:2.0;
font-size:14px;	
font-family: source-han-sans-japanese, sans-serif;
font-weight: 500;
font-style: normal;
color:#000;
}

#offer .message{
margin: 30px 0 0px 0;
}

#offer .message h3{
padding:0 2%;
}

/*===========================
#mail_form
===========================*/

#form-wrapper{
padding: 0px 0 60px 0
}

form#mail_form{
padding:0px 0;
margin:0px 0 0 0;
}

form#mail_form dl dt{
padding:20px 0 10px 0;
margin:20px 0 0 0;
}

form#mail_form dl dd{
padding:0;
border:none;
}

} /* responsive-closed */


@media screen and (max-width: 481px) { 


	

} 


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

}

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

}