@charset "UTF-8";
@media only screen and (max-width : 767px ){
.pc { display: none !important;}
.sp { display: block !important;}  
.tab { display: none !important;}
	
h1,h2,h3,h4,h5,p,a,li,th,td,label {
font-family: "M PLUS 1p", sans-serif;
transform: rotate(0.05deg);	
}
p{
text-align: left;	
text-align: justify;		
font-size: 1rem;
line-height: 1.4rem;	
color: #333;	
margin: 0.25rem auto 0.5rem auto;	
}
a{
text-decoration: none;	
color: #555	
}
a:hover{
opacity:0.7;	
}
li{
list-style: none;
}
.small{
font-size: 80%;
vertical-align: middle;
}
.blue{
color: #10589e;	
}

.small-li{
font-size: 70%;
color: #555;
vertical-align: 1.5px;	
}	
	
.wf-notosansjapanese { font-family: "Noto Sans JP";
}
	

.contents-std{
width: 96%; 
margin: 0 auto;
}		
.contents-std p{
margin: 0rem auto 2rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;
text-align: center;
text-align: justify;
color: #333;	
}	
.contents-std h3{
color: #333;	
text-align: center;  
padding: 0rem 0rem 0rem 0rem;	
margin: 0rem auto 0rem auto;
font-size: 1.2rem;
line-height: 1.5rem;	
font-weight: bold;
}	
.contents-std .obi1{
color: #fefef6;	
padding: 0rem;
margin: 0rem auto 0.5rem auto;
background-color: #0D5284; 
max-width: 100%;
}
.contents-std .obi1 h3{
color: #fefef6;	
text-align: center;
padding: 0.5rem 0rem 0.5rem 0rem;	
margin: 0rem auto 0rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;

}
.obi-g{
padding: 0rem;
margin: 0rem auto 0.5rem auto;
background-color: rgba(35, 129, 144,1);
}
.obi-g h3{
color: #fefef6;	
text-align: center;
padding: 0.5rem 0rem 0.5rem 0rem;	
margin: 0rem auto 0rem auto;
line-height: 1.5rem;
font-size: 1.2rem;
font-weight: bold;
}	

.bk{
color: #333;
font-weight: 600;
padding: 1rem 0rem 0.5rem 0rem;	
margin: 0rem auto 1rem auto;
line-height: 2rem
}
/*症状ボタン--------*/
.std-flex{
max-width: 96%;	
flex-wrap: wrap; /* 画面幅に合わせてカラム落ちさせる */
display: flex;
justify-content: space-between;
align-items: top;
margin: 1rem auto;
}	
/* 最後のコンテンツを左寄せにする指定 */
.std-flex:after {
content: "";
display: block;
width: 96%;  /* .boxに指定したwidthと同じ幅を指定する */
height: 0rem;
}
.std-efect{
text-align: center;	
width: 96%;	
margin: 0rem auto  1rem auto;
padding: 0rem 0rem 0rem 0rem;	
border:solid 1px #0D5284;
border-radius: 	6px;
background-color: rgba(0,153,255,0.05);
}	
	
.std-efect p {
text-align: center;	
text-decoration: none;	
color:#0D5284;	
font-weight: 600;
margin: 0rem auto  0rem auto;
padding: 0.5rem 0rem 0.5rem 0rem;
font-size: 1.2rem;
line-height: 1.75rem;
}
.std-efect a {
color:#0D5284;	
}
		
/*-----flex-2----*/
.flex-2{
display: block;	
flex-shrink: 0;	
margin: 2rem auto 2rem auto;
max-width: 100%;	
}
.flex-2 img{
width: 100%;	
}	
.flex-2 p{
font-size: 1rem;
line-height: 1.4rem;
margin: 0.5rem auto 2rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;	
text-align: left;
text-align: justify;
color: #333;	
}	
.flex-2 h4{
color: #333;	
font-size: 1.2rem;	
font-weight: 600;	
line-height: 1.5rem;	
text-align: center;
margin: 0rem auto 0.5rem auto;
padding: 0.25rem 0rem 0.35rem 0rem;	
}	
.flex-2 li{
color: #555;	
text-align: left;
text-align: justify;	
list-style: none;	
margin: 0rem 0rem 0rem 0rem;
padding: 0rem 1rem 1rem 1.5rem;	
text-indent: -0.9rem;	
line-height: 1.35rem	
}		
.flex-2 .flex-50{
width: 100%;	
margin: 0rem auto 2rem auto;
justify-content: center;	
flex-wrap: wrap;
}	
.flex-2 .flex-50 img{
width: 100%;	
margin: 0rem auto 2rem auto;
	
}	
.flex-2 .flex-50 h4{
color: #333;	
font-size: 1.2rem;	
font-weight: 600;	
line-height: 1.5rem;	
text-align: center;
margin: 0rem auto 0.5rem auto;
padding: 0.25rem 0rem 0.35rem 0rem;	
}	
.men{
color: #0D5284;	
}	
.women{
color: #C74B64;	
}		
	
	
.flex-left{
width: 96%;	
text-align: center;	
margin: 0rem auto  0rem auto;
padding: 0rem 0rem 0rem 0rem;	
}	
.flex-right{
width: 96%;	
text-align: center;	
margin: 0rem auto  0rem auto;
padding: 0rem 0rem 0rem 0rem;	
}	
.flex-right h4{
color: #333;	
font-size: 1.2rem;	
font-weight: 600;	
line-height: 1.5rem;	
text-align: center;
margin: 0rem auto 0.5rem auto;
padding: 0.25rem 0rem 0.35rem 0rem;	
}		


.flex-left-50{
width: 100%;	
text-align: center;	
margin: 0rem auto  0rem auto;
padding: 0rem 0rem 0rem 0rem;	
}	
.flex-right-50{
width:100%;	
text-align: center;	
margin: 0rem auto  0rem auto;
padding: 0rem 0rem 0rem 0rem;	
}	
.symptoms-risk h4{
width: 100%;	
color: #333;	
background-color:#F4BD00;
font-size: 1.2rem;	
font-weight: 600;	
line-height: 1.5rem;	
text-align: center;
margin: 0rem auto 0.5rem auto;
padding: 0.25rem 0rem 0.35rem 0rem;	
}	
.symptoms-m h4{
background-color:#0D5284;
color: #fefef6;	
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;		
}
.symptoms-w h4{
background-color:#e5909d;
color: #fefef6;	
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;	
}
.symptoms-mw h4{
background-color:#9959be;
color: #fefef6;	
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;		
}	
	
.symptoms-t h4{
background-color:#33a98b;
color: #fefef6;	
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;	
}
.symptoms-t h3{
width: 98%;	
color: #333;	
text-align: center;
margin: 0rem auto 1rem auto;
padding: 0.5rem 0rem 0.15rem 0rem;	
font-size: 1.1rem;
line-height: 1.5rem;	
font-weight: 600;
}	
.symptoms-s h4{
background-color:#5C75AB;
color: #fefef6;	
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;			
}
.symptoms-e h4{
background-color:#2AA8C1;
color: #fefef6;	
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;	
}
.symptoms h5{
width: 94%;	
color: #444;
font-size: 110%;	
line-height: 2rem;	
text-align: center;
margin: 0rem auto 1rem auto;
padding: 1rem 0 0.5rem 0;	
font-weight: 600;	
border:solid 1px #999;
}			
.symptoms p{
text-align: left;
text-align: justify;
margin: 0rem 0rem 2rem 0rem;
padding: 0rem 2rem 0rem 2rem;	
color: #333;
}	
.stage h5{
width: 98%;	
color: #444;
font-size: 100%;	
line-height: 1.5rem;	
text-align: center;
margin: 0rem auto 1rem auto;
padding: 0.25rem 0 0.35rem 0;	
font-weight: 600;	
border:solid 1px #999;
}			
.stage p{
text-align: left;
text-align: justify;
margin: 0rem auto 2rem auto ;
padding: 0rem 0.25rem 0rem 0.25rem;	
color: #333;
}	
.symptoms-m.stage{
text-align: left;
text-align: justify;
margin: 0rem 0rem 2rem 0rem;
padding: 0rem 2rem 0rem 2rem;	
color: #333;
width: 100%;	
}		
.symptoms-m.stage p{
text-align: left;
text-align: justify;
margin: 0rem 0rem 0rem 0rem;
padding: 0rem 0rem 0rem 0rem;	
color: #333;
}		
.symptoms-time h4{
background-color:#777777;
color: #fefef6;	
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;

}	
/*online------------------*/
.online {
display: block;	
margin: 0rem auto 1rem auto;
}	
.online p{
font-size: 1rem;
line-height: 1.4rem;
margin: 0rem auto 2rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;
text-align: left;
text-align: justify;
color: #333;
}			
	
/*--メリット------------------*/
.merit h3{
max-width: 94%;	
text-align: center;
margin: 2rem auto 1rem auto;
padding: 0rem 0 0rem 0;
font-size: 1.5rem;	
line-height: 0rem;	
font-weight: bold;	
color: #009396;

}	
.flex-merit{
display: flex;	
flex-shrink: 0;	
margin: 2rem auto 2rem auto;
max-width: 94%;	
}
.flex-merit{
max-width: 94%;	
flex-wrap: wrap; /* 画面幅に合わせてカラム落ちさせる */
display: block;
justify-content: space-between;
align-items: top;
margin: 3rem auto;
}	
/* 最後のコンテンツを左寄せにする指定 */
.flex-merit:after {
content: "";
display: block;
width: 94%;  /* .boxに指定したwidthと同じ幅を指定する */
height: 0;
}
.merit-efect{
text-align: center;	
width: 94%;	
margin: -2rem auto  0rem auto;
padding: 0rem;	
}	
.merit-efect:hover{
text-align: center;	
width: 94%;	
margin: -2rem auto  0rem auto;
padding: 0rem;	
}	
.merit-efect img{
text-align: center;	
width: 100%;	
margin: 1rem auto  0rem auto;
padding: 0rem;	
}	
.flex-merit .merit-efect h4{
color: #333;	
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;
}	
.flex-merit .merit-efect p{
font-size: 1rem;
line-height: 1.4rem;
margin: 0.5rem auto 2rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;	
text-align: left;
text-align: justify;
color: #333;
}	
.flex-merit .merit-efect li{
text-align: left;	
text-align: justify;	
margin: 0.25rem 1rem 1rem 1rem;	
font-size: 1rem;
line-height: 1.4rem;
text-indent: -1rem;	
}	
/*--流れ------------------*/
.nagare h2{
max-width: 94%;	
text-align: center;
margin: 5rem auto 2rem auto;
padding: 0.5rem 0 0rem 0;
font-size: 1.5rem;	
font-weight: bold;	
color: #fefef6;
background-color: #009394;
border: solid 1px #009394;
}	
.flex-nagare{
display: block;	
flex-shrink: 0;	
margin: 2rem auto 2rem auto;
max-width: 94%;	
}
.flex-nagare{
max-width: 94%;	
flex-wrap: wrap; /* 画面幅に合わせてカラム落ちさせる */
display: flex;
justify-content: space-between;
align-items: top;
margin: 3rem auto;
}	
/* 最後のコンテンツを左寄せにする指定 */
.flex-nagare:after {
content: "";
display: block;
width: 19%;  /* .boxに指定したwidthと同じ幅を指定する */
height: 0;
}
.nagare-efect{
text-align: center;	
width: 94%;	
margin: -2rem auto  0rem auto;
padding: 0rem;	
}	
.nagare-efect:hover{
text-align: center;	
width: 94%;	
margin: -2rem auto  0rem auto;
padding: 0rem;	
}	
.nagare-efect img{
text-align: center;	
width: 100%;	
margin: 1rem auto  0rem auto;
padding: 0rem;	
}	

.flex-nagare .nagare-efect p{
font-size: 1rem;
line-height: 1.4rem;
margin: 0.5rem auto 2rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;	
text-align: left;
text-align: justify;
color: #333;
}	



	
	
/*FAQ-------------------*/	

.contents .obi2{
padding: 1rem 0rem 0.5rem 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;
}		
 .faq {
width: 100%;
padding: 0rem 0rem 1rem 0rem;  	
margin: 0rem auto 5rem auto ;
background-color: rgba(192, 244, 255,0.1);	
}	
.faq p{
font-size: 1rem;
line-height: 1.4rem;
margin: 0.5rem auto 2rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;	
text-align: center;
color: #333;
}
.faq .inner h5 {
width: 100%;	
color: #333;
text-align: left;
font-size: 1rem;
line-height: 1.3rem;	
padding: 0rem 0rem 0rem 0rem;	
margin: 0rem auto 1rem auto;
}	
	

.designed{
max-width: 100%;	
line-height: 2.5rem;
font-size: 1.6rem; 
font-weight: 400;
margin: 3rem auto 0rem auto;
text-align: left;
}
.designed p{
font-size: 1rem;
line-height: 1.4rem;
margin: 0.5rem auto 1rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;	
text-align: left;
text-align: justify;
color: #333;

} 	
summary{
background-color:rgba(0,153,255,0.1);
color: #0D5284;
font-size: 1.1rem;	
line-height: 1.5rem;	
padding: 0.5rem 0.25rem 0.5rem 1.8rem;
margin: 1rem 0rem 0rem 0rem;
text-indent: -1.1rem;	
font-weight: 600;	
}	
.s-1{
background-color:#0D5284;
color: #fefef6;
font-size: 1.1rem;	
line-height: 1.5rem;	
padding: 0.5rem 0.5rem 0.5rem 2.5rem;
margin: 1rem 0rem 0rem 0rem;
text-indent: -1.8rem;	
}	
.s-2{
background-color:rgba(35, 129, 144,1);
color: #fefef6;
font-size: 1.1rem;	
line-height: 1.5rem;	
font-weight: 600;	
padding: 0.5rem 0.5rem 0.5rem 2.5rem;
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.1rem;	
line-height: 1.5rem;	
padding: 0.5rem 0.25rem 0.5rem 1.8rem;
margin: 1rem 0rem 0rem 0rem;
text-indent: -1.2rem;	
font-weight: 600;	
}
.designed{
margin: 0rem auto 0rem auto;
}
.designed p{
font-size: 1rem;
line-height: 1.4rem;
margin: 0.5rem auto 2rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;	
text-align: left;
text-align: justify;
color: #333;
}
.designed img{
margin: 1rem auto 2rem auto;
width: 95%;	
}
.designed .details_content p{
font-size: 1rem;
line-height: 1.4rem;
margin: 0.5rem auto 2rem auto;
padding: 0rem 0.3rem 0rem 0.3rem;	
text-align: left;
text-align: justify;
color: #333;
}	
.risk {
margin: 3rem auto 5rem auto;
padding: 0rem 0rem 0rem 0rem;	
max-width: 960px;
border: solid 2px #f6c23b ;
}	

.risk h4 {
color: #333;	
background-color:#f6c23b;
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;		
}	
.risk ul{
color: #333;	
text-align: left;
display: flex;	
margin: 0rem 0rem 0rem 0rem;
padding: 0rem 2rem 0rem 2rem;	
}
		
.contents-std .risk li{
color: #333;	
text-align: left;
list-style: none;	
margin: 0rem 0rem 0rem 0rem;
padding: 0rem 5rem 0rem 2rem;	
text-indent: -2rem;	
font-size: 1.1rem;	
}
.risk p{
color: #555;	
text-align: left;
list-style: none;	
margin: 0rem auto 0rem auto;
padding: 1rem 0.5rem 1rem 0.5rem;	
font-weight: 600;
font-size: 1.1rem;
line-height: 1.5rem;		
}	
		
/*--感染経路------------------*/
.flex-keiro{
display: block;	
flex-shrink: 0;	
margin: 2rem auto 5rem auto;
max-width: 96%;	
}	
.flex-keiro h3{
text-align: center;
padding: 0.5rem 0rem 0.5rem 0rem;	
margin: 0rem auto 0rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;	
color: #fefef6;
background-color: rgba(100, 90, 150,1);
border: solid 1px rgba(100, 90, 150,1);
}	
.flex-keiro h5{
text-align: center;
margin: 0rem auto 1rem auto;
padding: 1rem 0 0rem 0;
font-size: 1.3rem;	
line-height: 1.6rem;	
font-weight: 600;
color: #333;
}		
.flex-keiro h4{
border: solid 1px rgba(100, 90, 150,0.5);
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;		
}		
.flex-keiro-keiro{
display: block;	
flex-shrink: 0;	
margin: 2rem auto 5rem auto;
max-width: 96%;	
}
/*--ブライダル------------------*/
.select-3{
margin: -1rem 0rem 1rem 0rem;	
}	
.select-3 li{
text-align: left;
margin: 0rem auto 0rem auto;
padding: 0rem 0rem 0rem 1rem;
font-size: 1rem;
line-height: 2rem;	
font-weight: bold;	
color: #009396;
}
/* 最後のコンテンツを左寄せにする指定 */
.flex-keiro:after {
content: "";
display: block;
width: 19%;  /* .boxに指定したwidthと同じ幅を指定する */
height: 0;
}
.keiro-efect{
text-align: center;	
width: 96%;	
margin: 0rem auto  0rem auto;
padding: 0rem;	
}	
	
.keiro-efect h4{
border: solid 1px rgba(100, 90, 150,1);
color: rgba(100, 90, 150,1);
text-align: center;
padding: 0.25rem 0rem 0.35rem 0rem;	
margin: 0rem auto 0.5rem auto;
line-height: 1.5rem;
font-size: 1.3rem;
font-weight: bold;
letter-spacing: 0.1rem;
}
/*--予防------------------*/
.yobou li{
text-align: left;
margin: 1rem auto 1rem auto;
padding: 0rem 1rem 0rem 2rem;
font-size: 1.1rem;	
line-height: 1.5rem;
text-indent: -1.3rem;	
font-weight: bold;	
color: #009396;
}	

	
	
/*---性病予防薬　BTN-----*/	
.purchase p{
font-size: 1rem;
line-height: 1.4rem;
margin: 1rem auto 2rem auto;
padding: 0rem 1rem 0rem 1rem;	
text-align: left;
text-align: justify;
}	
.std-btn{
width:94%;
background-color: rgba(35, 129, 144,0.8);
color: #fefef6;
margin: 1.5rem auto 3rem auto;	
padding: 0rem 0rem 0rem 0rem;	
border: 3px solid #238190;
border-radius: 	6px;
		
}	
.purchase .std-btn h3{
color: #fefef6;	
font-weight: 600;	
text-align: center;
margin: 0rem auto 0rem auto;	
padding: 1rem 0.25rem 1rem 0.25rem ;		
font-size: 1.4rem;	
text-shadow: #238190 1px 3px 2px;	
}
/*--費用一覧ページへリンクボタン-------------------*/
.std-price-btn h3{
margin:3rem auto 5rem auto;
padding: 1rem 0rem 0.85rem 0rem;
text-align: center;	
text-decoration: none;
color: #fff;	
border:solid 2px rgba(35, 129, 144,1);
border-radius: 	6px;
background-color: rgba(35, 129, 144,0.7);
width: 94%;	
}

.std-price-btn a {
text-decoration: none;	
color:#fff;	
padding: 0.5rem 0rem 0.25rem 0rem;
font-weight: 600;	
font-size: 1.3rem;
line-height: 2rem;		
}


}