﻿@charset "utf-8";

@media screen and (max-width:1000px){

body{	
background: #FFF;}

.bg_header{
background: #FFF;}

.header,.sec01,.sec02,.sec03,.sec05,.sec06,.sec07,.sec08{
border: none;
margin-bottom:0;} 

.sec03{
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;}

.unit{
position: absolute;
top: 30px;
left: 40px;}       

.unit h1{
font-size: 3.2rem;}

.h1_1stline{ 
font-size: 2.5rem;}

.unit .usp1{
margin-top: 45px;
font-size: 1.7rem;
width: 430px;
padding: 25px 16px;}    

.unit .usp2{
margin-top: 20px;
font-size: 1.5rem;
width: 430px;
padding: 10px 24px 10px 16px;}

.btn{
width: 90%;}

.bg_outer{
margin: 0 5%}

.caution h2{
font-size: 2.7rem;}

.caution hr{
width: 95%;}

.circle{
width:120px;
height:150px;}

.incircle{
width:120px;
top: 22%;
left: 0%;
font-size: 2.5rem;}

.incircle-1line{
width:120px;
top: 35%;
left: -1%;
font-size: 2.5rem;}

.number h3{
font-size: 2.2rem;}

.sec07 .circle{
width:120px;
height:150px;
margin: 0 10px;
padding: 0;}

.sec07 .incircle-3line{
width:120px;
top: 22%;
left: -3%;
font-size: 1.7rem;}

.sec07 .incircle{
width:120px;
top: 27%;
left: -3%;
font-size: 1.9rem;}

.offer{
font-size: 2.5rem;}

.flex_summary{
width: 55%;}

.flex_price{
width: 45%;}

.trial_summary_ttl{
font-size: 1.5rem;}   

.trial_price1{
font-size: 4.5rem;}  
 
.trial_price2{
font-size: 1.4rem;}   

.footer_inner{
max-width: 1000px;
margin: 0 auto;	
padding: 15px 98px;}

.address{
line-height: 1.8em;}

.link{
text-align: center;	
margin: 0;
width: 100%;
line-height: 1.8em;}

footer a{
margin-left: 0;
margin-right: 1.5em;}

}




@media screen and (max-width:900px){

.unit{
top: 25px;
left: 4%;}       

.unit h1{
font-size: 3.0rem;}

.unit .usp1{
margin-top: 30px;
font-size: 1.6rem;
width: 400px;
padding: 25px 16px;}    

.unit .usp2{
margin-top: 15px;
font-size: 1.4rem;
width: 400px;
padding: 10px 24px 10px 16px;}

.header p.notes{
bottom: 1%;}       

.bg_outer{
margin-bottom: 35px;}

.caution h2{
font-size: 2.4rem;}

.caution hr{
width: 95%;}

.sec01{
padding: 20px 5% 80px;}

.sec02{
padding: 20px 5% 40px;}

.sec02 h2{
font-size: 2.7rem;}

.circle{
width:120px;
height:150px;}

.incircle{
width:120px;
top: 22%;
left: 0%;
font-size: 2.5rem;}

.incircle-1line{
width:120px;
top: 35%;
left: -1%;
font-size: 2.5rem;}

.number{
margin: 40px 30px;
padding: 15px 0 15px 60px;}

.number:before{
font-size: 6rem;}

.number h3{
font-size: 2.1rem;}

.sec04 p{
margin: 1em 8%;}

.sec04_figure_ttl{
margin: 1em 8% 0;
font-weight: bold;}

.sec04_figure{
margin: 0 8%; 
width: auto;
height: auto;}

dl.sec04_notes{
padding: 1.5em 8% 0;}   

dl.sec04_notes_asterisk{
padding: 1.5em 8% 0;}   

.sec05{
padding: 45px 8% 40px;}

.sec06{
padding: 45px 8% 40px;}

.sec07{
padding: 45px 5% 40px;}

.offer{
font-size: 2.2rem;}

.sec08{
padding: 45px 8% 0;}

.sec08 h3{
font-size: 2.5rem;}

.infomation{
margin 0;
padding: 0;
margin-bottom: 1.2em;}

.infomation h4{
margin: 30px 3%;}

.consultation_dial{
margin: 5px  3% 0; 
padding-top: 3px;
padding-left: 52px;}

.servicehours{
font-size: 1.5rem;}   

.footer_inner{
padding: 0 0 15px 0;}

}




@media screen and (max-width:800px){

.unit{
top: 20px;
left: 3%;}       

.unit h1{
font-size: 2.5rem;}

.h1_1stline{ 
font-size: 2.2rem;}

.unit .usp1{
margin-top: 30px;
font-size: 1.4rem;
width: 350px;
padding: 10px;}    

.unit .usp2{
margin-top: 15px;
font-size: 1.3rem;
width: 350px;
padding: 10px;}

.header p.notes{
left: 3%;
font-size: 1.0rem;
text-align: left;
bottom: 0%;}       

.btn{
font-size: 1.7rem;}

.caution{
padding: 40px 5%;}

.caution_circle{
width:80px;
height:80px;
font-size: 5rem;
line-height: 80px;}

.caution h2{
font-size: 2.2rem;}

.caution hr{
margin: 2em auto 3em;}

.sec01_float_left{
width: 60%;}

.sec01_float_right{
width: 40%;}

.sec02 h2{
font-size: 2.5rem;}

.circle{
width:100px;
height:120px;}

.incircle{
width:120px;
top: 22%;
left: -8%;
font-size: 2.0rem;}

.incircle-1line{
width:120px;
top: 40%;
left: -10%;
font-size: 2.0rem;}

.number h3{
font-size: 1.9rem;}

.sec05 h2{
font-size: 2.5rem;}

.sec05 h3{
font-size: 2.3rem;}

.sec06 h2{
font-size: 2.5rem;}

.faq_q{
padding: 10px 5px 10px 60px;
font-size: 1.6rem;}

.faq_a p{
padding: 0 10px 1em 60px;
margin: 0;}

.sec07 .circle{
width:100px;
height:120px;
margin: 0 10px;
padding: 0;}

.sec07 .incircle-3line{
width:100px;
top: 15%;
left: -2%;
font-size: 1.4rem;}

.sec07 .incircle{
width:100px;
top: 27%;
left: -3%;
font-size: 1.5rem;}

.offer{
font-size: 2.0rem;}

.flex_trial_summary{
padding: 10px;}

.flex_summary{
padding: 0;
width: 55%;}

.flex_price{
width: 45%;}

.trial_summary_ttl{
font-size: 1.5rem;}   

.trial_price1{
font-size: 4.0rem;}  
 
.trial_price2{
font-size: 1.2rem;}   

.consultation_dial{
font-size: 35px;}

.servicehours{
font-size: 1.3rem;}   

.sec08 .notes{
font-size: 1.3rem;} 

}




@media screen and (max-width:700px){

.pc{
display: none !important;} 

.mb{
display: block !important;} 

.tb{
display: block !important;} 

.pc_mb{
display: block !important;} 

.mb_sp{
display: none !important;} 

.sp{
display: none !important;} 

.unit{
top: 30px;
left: 5%;}       

.unit h1{
font-size: 3.7rem;}

.h1_1stline{ 
font-size: 2.6rem;}

.usp1{
width: 90%;
margin: 5px auto;
background: #C3292E;
font-size: 2.2rem;
font-weight: bold; 
color: #FFF;
box-sizing: border-box; 
padding: 20px;
border: 1px solid #C3292E;}    

.usp2{
width: 90%;
margin: 20px auto;
background: rgba(255,255,255,0.8);
color: #D12C30;
font-size: 1.6rem;
line-height: 1.6em;
font-weight: bold; 
box-sizing: border-box; 
padding: 20px;
border: 1px solid #C3292E;}

.asterisk1{
vertical-align: super;
margin: 0 6px;	
font-size: 70%;
letter-spacing: 3px; 
line-height: 1;}

.asterisk2{
vertical-align: super;
margin: 0 6px;	
font-size: 80%;
letter-spacing: 3px; 
line-height: 1;}

p.header_notes{
font-size: 1.3rem;
line-height: 1.8em;
text-align: right;
margin:20px 5%;}       

.btn{
font-size: 2rem;}

.caution h2{
font-size: 2.6rem;
line-height: 1.8em;}

.sec02 h2{
font-size: 3rem;
padding-bottom: .5em;
border-bottom: solid 2px #D1171C;}

.reason{
margin: 40px 2% 50px;}

.circle{
width:130px;
height:160px;}

.incircle{
width:130px;
top: 25%;
left: 2%;
font-size: 2.6rem;}

.incircle-1line{
width:130px;
top: 38%;
left: -2%;
font-size: 2.6rem;}

.sec04{
position: relative;
margin: 40px 0;
padding: 0 0 25px;
border: 1px solid #ccc;
border-radius: 10px;
background: #FFF;}

.number_sp{
display: block;
width: 100px;
height: 100px;
font-size: 5rem;
font-weight: bold; 
color: #FFF;
text-align:center;
margin: 30px auto;
line-height: 100px;
border-radius: 50%;
background: #D70909;}

.number{
margin: 1em 5% 2em;
padding: 0 0 5px;
text-align: center;
font-size: 2rem;}

.number:before{
display: none !important;} 

.number h3{
font-size: 2.6rem;}

dl.sec04_notes{
font-size: 1.2rem;	
padding: 1.5em 6% 0;}   

dl.sec04_notes dt{	
float: none;
line-height: 1.8em; 	
width: 6em;}

dl.sec04_notes dd{
line-height: 1.8em; 	
padding-bottom: 1.5em;	
padding-left: 1em;}

.sec05 h2{
font-size: 2.8rem;}

.sec05 h3{
font-size: 2.6rem;
margin: 3em 0 1em;
border-bottom: solid 2px #D1171C;}

.sec05 p{
margin: 0 1em;
padding: 0 0 1em;}

.flex_text-figure{
display:block;
flex-direction: row;
justify-content: space-between;}

.flex_text60{
width: 100%;
padding-right: 0;}

.flex_figure40{
width: 70%;
margin: 2em auto 0;}

.sec06{
background: #FBFAF7;}

.sec06 h2{
font-size: 3.2rem;}

.faq_q{
font-size: 1.6rem;}

.faq_q:before{
font-size: 3.0rem;}

.faq_a{
position: relative;
margin: 1em 0;}

.faq_a:before{
font-size: 3.8rem;}

.faq_a p{
padding: 0 5% 1em 50px;
margin: 0;}

.sec07 .circle{
width:140px;
height:190px;}

.sec07 .incircle-3line{
width:150px;
top: 22%;
left: -3%;
font-size: 2.0rem;}

.sec07 .incircle{
width:150px;
top: 27%;
left: -3%;
font-size: 2.1rem;}

.offer{
font-size: 2.2rem;}

.flex_trial_summary{
display:block;
padding: 15px;
margin: 20px auto 0;
border: dashed 1px #CCC;}

.flex_summary{
width: 100%;
text-align: center;
padding: 0 0 1em;}

.flex_price{
width: 100%;
text-align: center;
margin: 0;}

.trial_summary_ttl{
font-size: 1.6rem;}   

.trial_price1{
margin: 0.1em 0.1em 0;
font-size: 5rem;}  
 
.trial_price2{
color: #CD090B;
font-size: 1.6rem;
line-height: 1;
font-weight: bold;}   

.trial_notes{
font-size: 1.5rem;}   

.infomation{
text-align: center;}

.consultation_dial{
font-size: 48px;
margin: 5px  auto; 
padding-left: 60px;}

h4::after{
left: 45%;}

.servicehours{
padding-top: .5em;
font-size: 1.5rem;}   

}




@media screen and (max-width:600px){

.pc{
display: none !important;} 

.mb{
display: block !important;} 

.tb{
display: block !important;} 

.pc_mb{
display: none !important;} 

.mb_sp{
display: block !important;} 

.sp{ 
display: none !important;} 

.unit{
top: 20px;
left: 5%;}

.unit h1{
font-size: 3.0rem;}

.h1_1stline{ 
font-size: 2.3rem;
line-height: 2.2em;}

.usp1{
font-size: 1.8rem;
padding: 20px;}    

.usp2{
font-size: 1.45rem;
padding: 20px;}

p.header_notes{
font-size: 1.2rem;
line-height: 1.6em;}       

.btn{
font-size: 1.8rem;
margin: 30px auto 60px;}

.btn a:after{
width: 8%;}

.bg_outer{
margin: 0;
margin-bottom: 10px;
padding: 0;
border: none;
border-top: 1px solid #CCC;
border-bottom: 1px solid #CCC;
border-radius: 0;}

.caution{
padding: 40px 9%;}

.caution h2{
font-size: 2.4rem;}

.sec01{
padding: 60px 8% 80px;}

.sec01 h2{
font-size: 2.5rem;
line-height: 2.5em;}

.underline{ /*span*/
line-height: 1.5em;
border-bottom: solid 2px #D1171C;}

.sec01_float_left{
float: none;
padding: 0 ;
margin: 0;
width: 100%;}

.sec01_float_left p{
margin: 1em 0;
padding: 0;}

.sec01_float_right{
float: none;
margin: 0 auto;
padding: 0;
width: 80%;}

.sec02{
padding: 20px 8% 40px;}

.sec02 h2{
font-size: 2.5rem;}

.circle{
width:100px;
height:120px;}

.incircle{
width:120px;
top: 22%;
left: -8%;
font-size: 2.0rem;}

.incircle-1line{
width:120px;
top: 40%;
left: -10%;
font-size: 2.0rem;}

.sec03{
padding: 1px 3% 0;}

.sec04{
margin: 20px 0;}

.number_sp{
width: 80px;
height: 80px;
font-size: 4.2rem;
line-height: 80px;}

.sec05{
padding: 80px 8% 40px;}

.sec05 h2{
font-size: 2.8rem;}

.flex_figure40{
width: 75%;
margin: 2em auto 0;}

.sec06 h2{
font-size: 3.0rem;}

.sec06 hr{
margin: 2em auto 6em;}

.faq_q{
margin: 1em 0 5em;
padding: 10px 0px;
font-size: 1.5rem;
text-align: center;
color: #CD090B;}

.faq_q:before{
font-size: 2.4rem;
width: 50px;
height: 50px;
line-height: 50px;
left: 45%;
top: -30px;}

.faq_a:before{
font-size: 3rem;
width: 50px;
height: 50px;
line-height: 50px;
left: 44%;
top: -25px;}

.faq_a p{
padding: 0 5% 1em;
margin: 0;}

.sec07 .circle{
width:120px;
height:150px;}

.sec07 .incircle-3line{
width:120px;
top: 22%;
left: -3%;
font-size: 1.7rem;}

.sec07 .incircle{
width:120px;
top: 27%;
left: -3%;
font-size: 1.9rem;}

.offer{
font-size: 2.3rem;}

.trial h2{
font-size: 2.6rem;
line-height: 1.8;em}

.trial hr{
clear: both;
display:none;}


.trial_figure{
margin: 30px auto 0;}

.infomation h4{
font-size: 1.8rem;
padding: .5em 1.5em;}

}




@media screen and (max-width:500px){

.pc{
display: none !important;} 

.mb{
display: block !important;} 

.tb{
display: none !important;} 

.pc_mb{
display: none !important;} 

.mb_sp{
display: block !important;} 

.sp{
display: block !important;} 

.unit{
top: 30px;
left: 5%;}

.unit h1{
font-size: 3.4rem;
line-height: 1.5em; }

.h1_1stline{ 
font-size: 2.1rem;
line-height: 2.8em; }

.h1_2ndline{
display: block;
font-size: 3.2rem;}

.usp1{
font-size: 1.5rem;
padding: 16px;}    

.usp2{
font-size: 1.35rem;
padding: 16px;}

.btn{
font-size: 1.6rem;}

.caution h2{
font-size: 2.1rem;
line-height: 2.2em;}

.sec01 h2{
font-size: 2.6rem;
line-height: 2.5em;}

.underline{ /*span*/
font-size: 2.2rem;}

.sec02 h2{
font-size: 2.5rem;
line-height: 2.0em;}

.circle{
width:92px;
height:110px;
margin: 0 5px;}

.incircle{
width:90px;
top: 26%;
left: 2%;
font-size: 1.8rem;}

.incircle-1line{
width:90px;
top: 36%;
left: 1%;
font-size: 1.7rem;}

.sec02 h3{
font-size: 3.0rem;}

.number h3{
font-size: 2.4rem;}

.sec05 h2{
font-size: 2.5rem;}

.flex_figure40{
width: 90%;}

.faq_q:before{
left: 44%;}

.faq_a:before{
left: 43%;}

.sec07{
padding: 45px 0 40px;}

.sec07 h3{
font-size: 2.6rem;
margin: 0 20px;}

.sec07 .reason{
display: none !important;}

.reason_sp{
display: block !important;
text-align: center;
margin: 40px 2% 50px;}

.sec07 .circle{
width:110px;
height:140px;
margin: 0 8px;}

.sec07 .incircle{
width:120px;
top: 22%;
left: -4%;
font-size: 2.0rem;}

.sec07 .incircle-1line{
width:120px;
top: 40%;
left: -10%;
font-size: 2.0rem;}

.offer{
font-size: 2.2rem;}

.bg_trial{
margin: 30px 0;
padding: 0;
border: none;
border-top: 1px solid #CCC;
border-bottom: 1px solid #CCC;
border-radius: 0;}

.sec08 h3{
font-size: 2.2rem;}

.infomation h4{
font-size: 1.6rem;
padding: .5em 0;}

.footer_inner{
padding: 0 0 15px 0;}

footer a{
margin-right: 1em;}

}




@media screen and (max-width:415px){

body{	
font-size: 1.4rem;}

.unit{
top: 25px;
left: 5%;}

.unit h1{
font-size: 2.8rem;
line-height: 1.5em; }

.h1_1stline{ 
font-size: 1.9rem;
line-height: 2.5em; }

.h1_2ndline{
display: block;
font-size: 2.8rem;}

.usp1{
font-size: 1.4rem;
padding: 13px;}    

.usp2{
font-size: 1.35rem;
padding: 13px;}

.caution h2{
font-size: 1.9rem;}

.sec01 h2{
font-size: 2.6rem;
line-height: 2.5em;}

.underline{ /*span*/
font-size: 2.1rem;}

.sec02{
padding: 20px 5% 40px;}

.number h3{
font-size: 2.2rem;}

.sec05 h2{
font-size: 2.3rem;}

.faq_q:before{
left: 42%;}

.faq_a:before{
left: 41%;}

.sec05 h3{
font-size: 2.4rem;
margin: 3em 0 1em;}

.sec07 .circle{
width:100px;
height:130px;
margin: 0 5px;}

.sec07 .incircle{
width:120px;
top: 22%;
left: -6%;
font-size: 1.9rem;}

.offer{
font-size: 2.0rem;}

.sec08 h3{
font-size: 2.1rem;}

.consultation_dial{
font-size: 32px;}

.link{
margin-top: 10px;
padding-top: 10px;
border-top: 1px solid #ccc;}

}




@media screen and (max-width:390px){

.unit{
top: 25px;
left: 5%;}

.unit h1{
font-size: 2.7rem;
line-height: 1.4em; }

.h1_1stline{ 
font-size: 1.9rem;
line-height: 2.2em; }

.h1_2ndline{
display: block;
font-size: 2.7rem;}

.usp1{
font-size: 1.3rem;
padding: 13px;}    

.usp2{
font-size: 1.30rem;
padding: 13px;}

p.header_notes{
font-size: 1.1rem;
line-height: 1.6em;}      

.btn{
font-size: 1.4rem;}

.caution h2{
font-size: 1.8rem;}

.faq_q:before{
left: 41%;}

.faq_a:before{
left: 40%;}

.footer_inner{
padding: 0 0 15px 0;}

.link{
margin-top: 15px;}

}




@media screen and (max-width:375px){

.unit h1{
font-size: 2.6rem;
line-height: 1.4em; }

.h1_1stline{ 
font-size: 1.9rem;
line-height: 2.2em; }

.h1_2ndline{
font-size: 2.6rem;}

.usp1{
font-size: 1.4rem;
padding: 10px;}    

.usp2{
font-size: 1.2rem;
padding: 10px;}

.asterisk2{
display: none;}

.underline{
font-size: 2.0rem;}

.reason{
margin: 40px 0 50px;}

.sec02 h3{
font-size: 2.8rem;}

.number h3{
font-size: 2.1rem;}

.sec05 p{
margin: 0;
padding: 0 0 1em;}

.faq_a p{
padding: 0 0 1em;
margin: 0;}

.offer{
font-size: 1.8rem;}

.trial_summary_ttl{
font-size: 1.5rem;}   

.trial_price1{
margin: 0.1em 0.1em 0;
font-size: 4.5rem;}  
 
.trial_price2{
font-size: 1.4rem;}   

.trial_notes{
font-size: 1.4rem;}   

.servicehours{
font-size: 1.4rem;}   

#copyright{
font-size: .8rem;}

}




@media screen and (max-width:360px){

.unit h1{
font-size: 2.2rem;}

.h1_1stline{ 
font-size: 1.7rem;}

.h1_2ndline{
font-size: 2.2rem;}

.usp1{
font-size: 1.2rem;
padding: 10px;}    

.usp2{
font-size: 1.2rem;
padding: 10px;}


p.header_notes{
font-size: 1.0rem;
line-height: 1.9em;}      

.btn{
font-size: 1.3rem;}

.caution{
padding: 40px 5%;}

.caution h2{
font-size: 1.7rem;}

.sec01{
padding: 60px 5% 80px;}

.underline{
font-size: 1.9rem;}

.sec02 h2{
font-size: 2.3rem;
line-height: 2.0em;}

.circle{
width:80px;
height:110px;
margin: 0 5px;}

.incircle{
width:85px;
top: 26%;
left: 1%;
font-size: 1.7rem;}

.incircle-1line{
width:90px;
top: 33%;
left: -8%;
font-size: 1.7rem;}

.sec02 h3{
font-size: 2.6rem;}

.number_sp{
width: 60px;
height: 60px;
font-size: 4.0rem;
line-height: 60px;}

.number h3{
font-size: 1.9rem;}

.sec05{
padding: 80px 5% 40px;}

.faq_q:before{
left: 40%;}

.faq_a:before{
left: 39%;}

.sec07 .circle{
width:80px;
height:110px;
margin: 0 5px;}

.sec07 .incircle{
width:85px;
top: 26%;
left: 1%;
font-size: 1.7rem;}

.sec07 .incircle-1line{
width:90px;
top: 33%;
left: -8%;
font-size: 1.7rem;}

.offer{
font-size: 1.7rem;}

.flex_trial_summary{
padding: 5px;}

.trial_summary_ttl{
font-size: 1.4rem;}   

.trial_price1{
font-size: 4.3rem;}  
 
.trial_price2{
font-size: 1.2rem;}   

.trial_notes{
font-size: 1.2rem;}   

.servicehours{
font-size: 1.2rem;}   

.sec08{
padding: 45px 5% 0;}

.sec08 h3{
font-size: 2.0rem;}

.infomation h4{
font-size: 1.5rem;
margin: 30px 0;}

.sec08 .notes{
font-size: 1.2rem;} 

footer{	
font-size: 1.2rem;}

.footer_inner{
padding: 0 0 15px 0;}

}




@media screen and (max-width:321px){

html{
font-size: 55%;
height: 100%;}

.unit h1{
font-size: 2.6rem;
line-height: 1.68em; }

.h1_2ndline{
font-size: 2.6rem;}

.usp1{
font-size: 1.4rem;
padding: 10px;}    

.incircle{
top: 30%;
left: -3%;
font-size: 1.7rem;}

.incircle-1line{
top: 38%;
left: -8%;
font-size: 1.7rem;}

.sec07 .incircle{
top: 30%;
left: -3%;}

.sec07 .incircle-1line{
top: 38%;
left: -8%;}

}











