@charset "UTF-8";
@import url("grid_sp.css");
@import url("ress.min.css");
@import url("02-footer.css");
@import url("03-bg.css");
@import url("style_privacy.css");
@import url("style_privacy_law.css");
@media only screen and (max-width :768px ){
	
.pc { display: none !important;}
.sp { display: block !important;}  
p, a, h1, h2, h3, h4, h5, h6, th, td, li, ul, dd ,summary{
font-family:"M PLUS Rounded 1c";
transform: rotate(0.05deg);	
}
.br-sp {
display: none;
}		

a {
display:block;
color: #333;
text-decoration-line: none;
}
a:hover { 
color: #999;
text-decoration-line: none;
}  
a.anchor{
    display: block;
    padding-top: 70px;
    margin-top: -70px;
}
p{
font-size: 110%;				
}	
hr{
margin: 0rem auto 1rem auto;
}
.red{
color: #A60000;	
}
	
/*コンテンツ----------------------*/	
	
.contents {
max-width: 100%;
margin: 0rem auto 3rem auto;
}
.contents img{
width: 100%;
height: auto;	
margin: 0rem auto 0rem auto;
vertical-align:middle;		
}
.contents h3{
color: #333;	
text-align: center;  
padding: 0rem 0rem 0rem 0rem;	
margin: 2rem auto 1rem auto;
font-size: 2.2rem;
line-height: 2.8rem;	
font-weight: 600;
letter-spacing: 0rem;
}	
	
.flex-img{
width: 96%;	
display: flex;
margin: 5rem auto 0rem auto;
}	
.flex-img img{
width: 45px;
height: 45px;
margin:1.5rem 0rem 0rem 0rem;	
}		
.flex-img h3{
color: #333;	
text-align: center;  
padding: 0rem 0rem 0rem 0rem;	
margin: 1rem auto 1rem auto;
font-size: 2.2rem;
line-height: 2.8rem;	
font-weight: 600;
letter-spacing: -0.1rem;	
white-space: nowrap;
}		
/*FAQ-------------------*/	
.contents .obi1{
padding: 1rem 0rem 0.75rem 0rem;
margin: 0rem auto 0rem auto;
background-color: #0D5284; 
color: #fefef6;
width: 100%;
}
.contents .obi1 h3{
color: #fefef6;	
text-align: center;  
padding: 0rem 0rem 0rem 0rem;	
margin: 0rem auto 0rem auto;
font-size: 2.5rem;
line-height: 2.5rem;	
font-weight: bold;
}		
.contents .obi2{
padding: 1rem 0rem 0.75rem 0rem;
margin: 0rem auto 0rem auto;
background-color: #238190; 
color: #fefef6;
width: 100%;
}
.contents .obi2 h3{
color: #fefef6;	
text-align: center;  
padding: 0rem 0rem 0rem 0rem;	
margin: 0rem auto 0rem auto;
font-size: 2.5rem;
line-height: 3rem;	
font-weight: bold;
}		
.contents .faq {
max-width: 96%;
padding: 1rem 1.5rem 1rem 1.5rem;  	
margin: 0rem auto 5rem auto ;
background-color: rgba(192, 244, 255,0.3);	
}
.contents .faq h5 {
width: 100%;	
color: #333;
text-align: left;
font-size: 1.6rem;
line-height: 2.5rem;	
font-weight: 600;
padding: 0rem 1rem 0rem 1rem;	
margin: 2rem auto 2rem auto;
	
}
.designed{
max-width: 100%;	
line-height: 2.5rem;
font-size: 1.6rem; 
font-weight: 400;
margin: 3rem auto -5rem auto;
text-align: left;
}
summary{
background-color:rgba(0,153,255,0.1);
color: #0D5284;
font-size: 1.7rem;	
line-height: 2rem;	
font-weight: 600;	
padding: 0.7rem 0.7rem 0.7rem 3rem;
margin: 1rem 0rem 0rem 0rem;
text-indent: -1.8rem;	
}	
.s-1{
background-color:#0D5284;
color: #fefef6;
font-size: 1.7rem;	
line-height: 2rem;	
font-weight: 600;	
padding: 0.7rem 0.7rem 0.7rem 3rem;
margin: 1rem 0rem 0rem 0rem;
text-indent: -1.8rem;	
}	
.s-2{
background-color:rgba(35, 129, 144,1);
color: #fefef6;
font-size: 1.7rem;	
line-height: 2rem;	
font-weight: 600;	
padding: 0.7rem 0.7rem 0.7rem 3rem;
margin: 1rem 0rem 0rem 0rem;
text-indent: -1.8rem;	
}		
.s-3{
background-color:rgba(35, 129, 144,0.2);
color: rgba(35, 129, 144,1);
font-size: 1.7rem;	
line-height: 2rem;	
font-weight: 600;	
padding: 0.7rem 0.7rem 0.7rem 3rem;
margin: 1rem 0rem 0rem 0rem;
text-indent: -1.8rem;	
}
.designed{
margin: 0rem auto 0rem auto;
}
.designed p{
max-width: 96%;	
margin: 1rem auto 3rem auto;
text-align: left;
text-align: justify;
font-size: 1.7rem;	
font-weight: 500;	
color: #333;	
}
.designed img{
margin: 1rem auto 2rem auto;
width: 70%;	
}

/*online------------------*/
.online {
width: 92%;	
display: block;	
text-align: center;
margin: 2rem auto 1rem auto;
}		
.online p{
text-align: left;
text-align: justify;
margin: 2rem auto 1rem auto;
}	
.merit h3{
width: 90%;	
text-align: center;	
margin: 1rem auto 2rem auto;
padding: 1rem;	
font-size: 2rem;	
line-height: 2.1rem;	
font-weight: 600;	
border: 1px solid #318C97;	
color: #318C97;
white-space: nowrap;
border-radius: 1rem;
}	
	
.merit-efect{
text-align: left;	
width: 90%;	
margin: 0rem 0rem ;
padding: 0rem;	
display: flex	
}	
	
.merit-efect h4{
text-align: left;
height: 30px;	
width: 30px;		
margin: 0rem 0 0rem 3rem;
padding: 1.25rem 0rem 0rem 0.75rem;	
font-size: 2rem;	
font-weight: bold;	
color: #318C97;
border-radius:5rem;
border: 1px solid #318C97;	
	
}	
.flex-merit .merit-efect p{
text-align: left;	
margin: 0.25rem 0rem 3rem 1rem;	
padding: 0rem 0rem 0rem 0rem;	
	
}	
.prevention{
margin: 1rem auto 5rem auto;	
width: 96%;
}	
.prevention p{
margin: 1rem auto 5rem auto;	
width: 94%;
}	
	
.btn-purchase{
margin: 0rem auto 5rem auto;	
width: 90%;
background-color: #FF8600;
color: #fefef6;
padding: 1rem;	
border: 3px solid #FF6700;
border-radius: 	6px;
box-shadow: #999 0px 2px 2px;	
		
}	
.btn-purchase h3{
margin: 0rem auto 0rem auto;	
color: #fefef6;
text-shadow: #CB6B00 1px 3px 2px;	
}

.prevention h4{
width: 96%;	
font-size: 1.8rem;	
line-height: 2.5rem;	
text-align: center;
margin: 2rem auto 1rem auto;	
padding: 2rem;	
color: #238190;
border: solid 1px #238190; 
}	
	
.prevention li{
text-indent: -2.1rem;
margin: 0rem 3rem 1rem 4rem;	
line-height: 2rem;	
text-align: justify;	
color: #333;	
}

	
.prevention-2{
text-align: center;
margin: 5rem auto 1rem auto;	
}	
.prevention-2 h4{
width: 94%;	
font-size: 2rem;	
text-align: center;
margin: 5rem auto 1rem auto;	
padding: 1rem;	
color: #fefef6;
background-color: #238190; 
line-height: 2.5rem;
}	
.prevention-2 p{
width: 92%;	
text-align: left;
text-align: justify;
margin: 0rem auto 0rem auto;	
color: #333;
font-size: 100%;	
}	
.prevention-2 li{
width: 96%;	
text-align: left;
text-align: justify;
margin: 0rem 1.5rem 0rem 1.25rem;
padding: 0rem 2.5rem;		
color: #333;
font-size: 100%;	
text-indent: -2rem;	
}
.prevention-3{
margin: 0rem auto 5rem auto;
padding: 0rem 0rem;		

}	
.prevention-3 h4{
width: 94%;	
font-size: 2rem;
line-height: 2.5rem;	
text-align: center;
margin: 2rem auto 1rem auto;	
padding: 1rem;	
color: #000;
background-color: #EFC100;
border: 2px solid #000;
font-weight: 600;	
}		
.prevention-3 li{
width: 96%;	
text-align: left;
text-align: justify;
margin: 0rem 1.5rem 0rem 1.25rem;
padding: 0rem 2.5rem;		
color: #333;
font-size: 100%;	
text-indent: -2rem;	
}	
.prevention-3 p{
width: 92%;	
text-align: left;
text-align: justify;
margin: 0rem auto 0rem auto;	
color: #333;
font-size: 100%;	
}	
		
/*line*/	
.line {
margin: 5rem auto 5rem auto;	
text-align: center;	
width: 90%;	
}	
.line p{
color: #555;
margin: 1rem auto 1rem auto;	
text-align: left;	
}	
.line img{
color: #555;
margin: 3rem auto 3rem auto;	
text-align: center;
width: 80%;	
}		

.flex-line  a img{
width: 50%;	
height: auto;	
margin: 2rem auto  0 auto;
padding: 0;	
}	


}