@charset "utf-8";

html,body{height:100%;}
body{
font-family:Helvetica ,"游ゴシック","Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
-webkit-text-size-adjust:100%;
position:relative;
}
/****clearfix****/
.clearfix:after{
content:"";
display:block;
clear:both;
}
.clearfix{
zoom:1;
}

/*common*/
#wrapper{width:100%;}
.textL{
font-size:220%;
color:#4D4D4D;
letter-spacing:2px;
line-height:1.5em;
}
.textM{
font-size:160%;
color:#4D4D4D;
letter-spacing:2px;
line-height:2.0em;
}
.small{font-size:140%;}
.colorPink{color:#FF668F;}
.bold{font-weight:bold;}
.red{color:#E61C24;}
a.topBtn{
position:fixed;
bottom:0;
right:20%;
z-index:2;
display:inline-block;
-webkit-transform:translate(0, -50%);
transform:translate(0, -50%);
text-decoration:none;
text-indent:-9999px;
}
a.topBtn{padding-top:60px;}
a.topBtn span {
background:#FF668F;
position:absolute;
top:0;
left:50%;
width:80px;
height:80px;
margin-left:-23px;
border:2px solid #fff;
border-radius:100%;
box-sizing:border-box;
}
a.topBtn span:after {
position: absolute;
top:50%;
left:50%;
content:'';
width:16px;
height:16px;
margin:-5px 0 0 -9px;
border-left:2px solid #fff;
border-bottom:2px solid #fff;
-webkit-transform:rotate(135deg);
transform:rotate(135deg);
box-sizing:border-box;
}

/*head*/
header{
width:100%;
padding:20px 0;
display:flex;
justify-content:space-between;
}
header h1{
width:50%;
display:flex;
justify-content:flex-start;
margin-left:20px;
}
#logo{
background:url("../img/logo.png") left top no-repeat;
width:355px;
height:66px;
display:block;
margin-right:30px;
text-indent:-9999px;
}
p.add{
font-size:140%;
line-height:2.0em;
}
#headInfo{
width:50%;
display:flex;
justify-content:flex-end;
margin-right:20px;
}
p.infoImg:first-child{margin-right:30px;}

/*message*/
#message{display:none;}

/*top image*/
#topImg{
background:url("../img/top.jpg") center top no-repeat;
background-size:cover;
position:relative;
width:100%;
height:820px;
}
#imgText{
width:100%;
height:160px;
font-size:220%;
font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","メイリオ",Meiryo,serif;
font-weight:bold;
color:#E6388C;
text-shadow:0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 4px #fff,
0px 0px 2px #fff;
line-height:2.0em;
text-align:center;
letter-spacing:5px;
top:0;
bottom:0;
left:0;
right:0;
position:absolute;
margin:auto;
}


/*What is pill?*/
div.whtWrap{
background:url("../img/wht_pill_bg.png") left top repeat;
width:100%;
padding:70px 0;
text-align:center;
}
section.whtPill{
background:url("../img/wht_pill_moyou.png") center 20px no-repeat;
width:100%;
height:420px;
margin:0 auto;
}
p.whtPrice{
color:#754C24;
font-size:140%;
line-height:1.8em;
letter-spacing:2px;
font-weight:bold;
margin-top:20px;
}
#whtTitle{
background:url("../img/wht_pill_title.png") center top no-repeat;
width:100%;
height:91px;
text-indent:-9999px;
overflow:hidden;
}
p.whtText{
width:685px;
margin:30px auto 0 auto;
font-size:140%;
font-weight:500;
color:#666666;
}

/*middle comment*/
#midComment{
width:1100px;
margin:60px auto;
padding:20px;
border:2px solid #FF668F;
border-radius:5px;
color:#FF668F;
font-weight:bold;
text-align:center;
}

/*about*/
section.about{
background:url("../img/about_bg.jpg") center 180px no-repeat;
width:100%;
text-align:center;
padding:1px 0 20px 0;
}
h2.abTitle{
width:100%;
height:207px;
text-indent:-9999px;
overflow:hidden;
margin-bottom:40px;
}
h2.chara{background:url("../img/chara.jpg") center top no-repeat;}
h2.comparison{
background:url("../img/comparison.jpg") center top no-repeat;
margin-top:100px;
}
p.abText{
width:1100px;
margin:0 auto 20px auto;
}
#graph{
width:100%;
display:flex;
justify-content:center;
margin-top:50px;
}
#graph p:first-child{margin-right:30px;}
p.anotation{
width:100%;
margin-top:20px;
font-size:110%;
letter-spacing:2px;
line-height:2.0em;
text-align:center;
}
/*caution*/
section.caution{
background:#F3F3F3;
width:100%;
padding:60px 0;
border-top:1px solid #CFCFCF;
border-bottom:1px solid #CFCFCF;
text-align:center;
margin:40px 0;
}
h2.cauText{margin-bottom:20px;}

/*fee*/
section.fee{
width:100%;
text-align:center;
margin-bottom:60px;
}
section.fee p{margin-bottom:20px;}
h2.feeText{
color:#754C24;
margin-bottom:20px;
}
span.price,span.price2{
font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","メイリオ",Meiryo,serif;
line-height:2.0em;
letter-spacing:2px;
}
span.price{font-size:300%;}
/*qa*/

dl.qa{
background:#FF668F;
width:700px;
margin:0 auto 60px auto;
padding:20px;
text-align:center;
border-radius:10px;
}
dl.qa dt{
margin-bottom:20px;
border-bottom:1px dashed #fff;
padding-bottom:5px;
}
dd.qaText{
color:#fff;
font-size:140%;
margin-bottom:20px;
}
a.qaBtn{
background:#fff;
width:300px;
padding:10px;
border-radius:5px;
display:block;
font-size:130%;
font-weight:bold;
color:#FF668F;
margin:0 auto;
text-decoration:none;
transition:all 0.5s ease;
-webkit-transition:all 0.5s ease;
-moz-transition:all 0.5s ease;
}
a.qaBtn:link{color:#FF668F;}
a.qaBtn:visited{color:#FF668F;}
a.qaBtn:hover{opacity:0.8;}

/*another*/
div.anoPill{
background:url("../img/other_pill_bg.png") center top no-repeat;
width:100%;
margin-bottom:60px;
}
div.anoPill p{text-align:center;}
ul.ano{
width:100%;
display:flex;
justify-content:center;
margin-top:50px;
}
ul.ano li:first-child{margin-right:30px;}
ul.ano li{
background:#F7F6F4;
width:310px;
padding:20px 15px 20px 15px;
border-radius:10px;
}
ul.ano p{margin-bottom:15px;}
ul.ano p img{border-radius:5px;}
dl.pillExp dt{
font-size:140%;
font-weight:bold;
color:#FF668F;
text-align:center;
border-bottom:1px dashed #FF668F;
padding-bottom:10px;
margin-bottom:20px;
}
dd.exp{
height:200px;
font-size:120%;
color:#4D4D4D;
line-height:2.0em;
margin-bottom:20px;
}
a.expBtn{
background:#FF668F;
padding:10px;
border-radius:5px;
display:block;
font-size:120%;
font-weight:bold;
color:#fff;
margin:0 auto;
text-align:center;
text-decoration:none;
transition:all 0.5s ease;
-webkit-transition:all 0.5s ease;
-moz-transition:all 0.5s ease;
}
a.expBtn:link{color:#fff;}
a.expBtn:visited{color:#fff;}
a.expBtn:hover{opacity:0.5;}

/*map*/
div.map{text-align:center;}
div.map iframe{
width:100%;
height:500px;
margin-bottom:40px;
}
div.map p{margin-bottom:20px;}
a.mail{
color:#FF668F;
text-decoration:underline;
}
a.mail:visited{color:#FF668F;}
a.mail:hover{text-decoration:none;}
a.phoneBtn{
background:#FF668F;
width:310px;
padding:10px;
border-radius:5px;
display:block;
font-size:130%;
font-weight:bold;
color:#fff;
margin:30px auto 50px auto;
text-align:center;
text-decoration:none;
transition:all 0.5s ease;
-webkit-transition:all 0.5s ease;
-moz-transition:all 0.5s ease;
}
a.phoneBtn:link{color:#fff;}
a.phoneBtn:visited{color:#fff;}
a.phoneBtn:hover{opacity:0.5;}

ul.typeBox{
width:100%;
margin:60px 0 60px 0;
display: flex;
justify-content:center;
flex-wrap:wrap;
}
li.box{
width:350px;
background:#FFE5EB;
border-radius:10px;
margin:0 20px 20px 0;
}
dl.boxBlock{
margin-top:10px;
padding:20px;
}
dt.name{
font-size:155%;
font-weight:bold;
color:#FF668F;
line-height:1.5em;
letter-spacing:5px;
text-align:center;
padding-bottom:5px;
border-bottom:1px dashed #FF668F;
}
dd.boxText{
margin:20px 0 10px 0;
font-size:130%;
font-weight:bold;
height:250px;
color:#FF668F;
text-align:center;
line-height:2.0em;
}

/*slider*/
.list_carousel{
position:relative;
width:100%;
margin-left:0;
}
.list_carousel ul  {
margin: 0;
padding: 0;
list-style: none;
display: block;
}
.list_carousel li {
padding:0;
display:block;
float:left;
text-align:center;
}
.list_carousel li {
width:317px;
height:200px;
}
.list_carousel li img{width:100%;}
.responsive {
width:auto;
margin-left:0;
}

/*footer*/
footer{
font-size:150%;
color:#FF668F;
letter-spacing:3px;
text-align:center;
padding:50px 0;
}

@media screen and (max-width:1650px){
p.add,p.time{display:none;}
p.infoImg:first-child{margin-right:0;}

#topImg{height:500px;}
#topImg p{
width:90%;
padding:0 10px;
}

#midComment{width:600px;}

section.whtPill{min-height:420px;}
p.whtText{width:600px;}

p.abText{width:600px;}

#graph{
flex-wrap:wrap;
flex-direction:column;
}
#graph p:first-child{margin:0 0 30px 0;}
p.anotation{
width:98%;
padding:0 10px;
}


dl.qa{width:600px;}

ul.ano{flex-wrap:wrap;}
ul.ano li{margin:20px 20px;}

section.caution p{
width:95%;
padding:0 10px;
}

div.map p{
width:600px;
margin:20px auto;
}
ul.typeBox li{
margin:20px 20px;
}

}

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

.textL{font-size:180%;}
.textM{font-size:120%;}

header h1{width:100%;}
#logo{
background-size:cover;
width:220px;
height:40px;
margin:0 auto;
}	
#headInfo{display:none;}

#message{
background:#FF668F;
width:100%;
display:block;
padding:5px 0;
}
#message p{
color:#fff;
text-align:center;
}
#message a:link{
text-decoration:none;
color:#fff;
}
#message a:visited{
text-decoration:none;
color:#fff;
}

#topImg{height:300px;}
#imgText{
font-size:150%;
letter-spacing:1px;
}

section.whtPill{
background:none;
height:auto;
min-height:auto;
padding:20px 0;
}
section.whtPill img{width:80%;}
div.whtWrap{padding:40px 0;}
#whtTitle{
background:none;
height:auto;
margin-bottom:40px;
text-indent:0;
font-size:180%;
font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","メイリオ",Meiryo,serif;
font-weight:bold;
letter-spacing:5px;
color:#9C7C52;
}
p.whtPrice{font-size:130%;}
p.whtText{
width:90%;
padding:0 10px;
}

#midComment{
width:80%;
margin:40px auto 60px auto;
}

p.abText{
width:90%;
padding:0 10px;
}
#graph img{
width:250px;
height:auto;
}
p.anotation{
width:95%;
padding:0 10px;
}

span.price{font-size:220%;}

dl.qa{
width:80%;
}
a.qaBtn{width:80%;}

p.anoTitle img{display:none;}
p.anoTitle:before{
width:90%;
padding:0 10px;
content:attr(data-label);
font-size:180%;
font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","メイリオ",Meiryo,serif;
font-weight:bold;
color:#FF668F;
line-height:2.0em;
}
ul.ano{margin-top:20px;}
ul.ano li{width:80%;}
dd.exp{
height:auto;
padding-bottom:20px;
}

div.map p{
width:90%;
padding:0 10px;
}
div.map img{width:90%;}
div.map iframe{height:350px;}
p.ohori img{display:none;}
p.ohori:before{
width:90%;
padding:0 10px;
content:attr(data-label);
font-size:180%;
font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","メイリオ",Meiryo,serif;
font-weight:bold;
color:#FF668F;
line-height:2.0em;
}

dd.boxText{
font-size:120%;
height:auto;
}
}