@charset "utf-8";
#landing{font-size:1.1em;}

h1{width:1200px; margin:12px auto 0; padding:0; text-align:center; line-height:0;}
h1 img{width:100%;}
h3{ clear:both;}
h4{margin:0 0 10px; padding:8px 10px; font-size:1.2em; color:#990000; background: -moz-linear-gradient(top,#FFF 0%,#FDE4DF); background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#FDE4DF)); border-bottom:2px solid #FF6699;}
h5{font-size:120%; font-weight:bold; color:#ff3d79; border-left:12px solid #ff3d79; padding:0 0 0 4px; margin:12px 0 0 0;}


.T30{margin-top:30px;}
.T60{margin-top:60px;}
.clr{clear:both;}
img.rights{float:right; padding-bottom:20px; padding-left:12px;}


.link{ background-color:#FFCCFF; text-align:center; margin:2px 0 50px; font-size:1.2em;}
.link a{ font-weight:bold; color:#CC0000; padding:6px 0; text-decoration:none; display:block;}


#read h2{text-align:left; font-size:2em;}
#read span{display:block;}
#read strong{font-size:1.4em;}
#read:after{content:""; display:block; float:none; clear:both;}
.readL{float:left; width:55%;}
.readR{float:right;}

/*クマや目の下のたるみはこうして現れる*/
#cause h3{background:none; border:none; text-align:left; color:#0066CC; box-shadow:none; text-shadow:none; padding:0; margin:0; font-size:1.4em;}ul.flow{list-style:none; margin:0; padding:0;}
ul.flow li{background-color:#D8EAF8; margin:0; padding:12px; margin-bottom:30px; position: relative;}
ul.flow li:after{position: absolute; border:16px solid transparent; bottom: -40px; border-top-color:#999999; content:""; display:block;}

ul.flow li:last-child:after{border:none;}

ul.illust_cause{margin:0; padding:0; list-style:none;}
ul.illust_cause li{display:table-cell; width:46%; margin:0; padding:0;}

p.str strong{font-size:1.4em; display:block; margin:12px 0;}

p.point{padding:20px; background-color:#E4007F; color:#FFFFFF; font-size:1.6em; text-align:center;}
p.point strong{color:#FFFF99;}
p.point span{display:block;}

/**/
#what{margin-top:120px;}
#what h2{text-align:left; font-size:2.1em; line-height:1;}
#what h3{ clear:both; display:block; text-align:left; background-color:#F39806;}
#what h3.sub{background:none; color:#FF3399; border:none; box-shadow:none; text-shadow:none; font-size:1.6em; padding:0; margin:0;}
#what p{margin-top:0; padding:0;}

.whats:after{float:none; clear:both; content:""; display:block;}
.whatL{width:76%; float: left;}
.whatR{float:right;}

#what ul.list{list-style:none; margin:0; padding:0;}
#what ul.list li{border-bottom:1px dashed #FFCCFF; padding-top:8px;}
#what ul.list li:before{content:"■"; color:#FF99CC;}

#what h4{background:none; border:none; color:#F30181; padding:0; clear:both;}
#what h4.mr{ margin-left:-8px;}
#what hr{border:none; border-top:1px solid #FF99CC; float:none; clear:both; display:block;}

/*施術・アフターケアについて*/
dl.after{border-bottom:1px solid #CCCCCC; margin:0; padding:0 12px; list-style:none;}
dl.after dt, dl.after dd{ border-top:1px solid #CCCCCC; padding:8px 18px;}
dl.after dt{width:140px; float:left; color:#FF6699; font-weight:bold; text-align:right;}
dl.after dd{margin-left:150px;}


/******************/
/*ヒアルロン酸注入による切らない治療*/
/******************/
.reads{margin:0 0 12px;}
.reads:after{content:""; clear:both; display:block;}
.reads div.left{width:70%; float: left;}
.reads div.right{text-align:right; float:right;}
.reads div.left p{margin:0;}
.reads strong{font-size:1.2em;}

.read{margin-top:30px;}
.read dt, .read dd{margin:0; padding:0;}
.read dt{background-color:#CC3366; width:26%; color:#FFFFFF; padding:2px 8px; display:inline-block; margin-top:20px;}
.read dd{border-bottom:1px dotted #FF99CC; line-height:2em;}
.read dt:first-child{margin-top:0;}
.read dd:before{content:"■"; color:#FF99CC;}


ul.point{list-style:none;}
ul.point li{ margin:12px 0; position: relative; border-bottom:1px dotted #CCCCCC; padding-left:18px;} 
ul.point li:before {
    content: "";
    position: absolute;
    top: .1em;
    left: 0;
    -webkit-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    transform: rotate(50deg);
    width: 5px;
    height: 10px;
    border-right: 3px solid #8b6b4e;
    border-bottom: 3px solid #8b6b4e;
  }
	
/*目の下のたるみの原因*/
ul.illust{margin:0; padding:0; list-style:none;}
ul.illust:after{content:""; display:block; clear:both;}
ul.illust li{ float:left; width:47%; margin:0; padding:0; text-align:center;}

/*目の下の治療に適した厚生労働省認可のヒアルロン酸*/
div.volmellaL{float:left; width:79%;}
div.volmellaR{float:right;}
div.volmella:after{content:""; display:block; clear:both;}
div.volmellaL p{margin:0;}

ul.volmella_point{list-style:none; margin:0; padding:0; font-weight:bold; font-size:1.2em;}
ul.volmella_point li{text-indent:-1em; padding-left:1em;}
ul.volmella_point li:before{content:"●"; color:#FF0066;}

/**/
.movie{background-color:#CCCCCC; width:80%; height:150px; margin:30px auto; text-align:center;}


/*症例*/
.ex ul{margin:0 0 24px; padding:10px; list-style:none; background-color:#FAF3F5; border:1px solid #CCCCCC; display:inline-block;}
.ex ul li{ display:inline-block; vertical-align:middle; margin:0; padding:0;}
.ex ul li.arrow{width: 0; height: 0; margin-left:1px; border-top: solid 30px transparent;
border-right: solid 1px transparent;
border-bottom: solid 30px transparent;
border-left: solid 30px #FAABB3;}
.ex ul li.note{display:block; font-size:0.9em;}

/*リンク*/
p.link_contents{margin:0 0 20px; padding:20px 0;}
p.link_contents a{border:1px solid #CC0033; color:#CC0033; padding:8px 12px;}
p.link_contents a:hover{text-decoration:none; background-color:#FF9999; color:#FFFFFF;}


/*適応*/
.adap{border:2px solid #FF0066; padding:12px 20px;}
.adap img{float:right;}
.adap p{ color:#FF0066; margin:0; padding:0 0 8px 0;}
.adap strong{font-size:120%; vertical-align:middle; margin-right:4px;}
.adap ul{margin:0; padding:0; list-style:none;}
.adap li:before{content:"●";}
.adap:after{content:""; display:block; clear:both;}


/*症例*/
.ex{margin:40px auto 0; text-align:center;}
.ex ul{margin:0 0 24px; padding:10px; list-style:none; background-color:#FAF3F5; border:1px solid #CCCCCC; display:inline-block; vertical-align:top;}
.ex ul li{ display:inline-block; vertical-align:middle; margin:0; padding:0;}
.ex ul li.arrow{width: 0; height: 0; margin-left:1px; border-top: solid 30px transparent;
border-right: solid 1px transparent;
border-bottom: solid 30px transparent;
border-left: solid 30px #FAABB3;}
.ex ul li.note{display:block; font-size:0.9em;}

/*リンク*/
p.link_contents{margin:0 0 20px; padding:20px 0;}
p.link_contents a{border:1px solid #CC0033; color:#CC0033; padding:8px 12px;}
p.link_contents a:hover{text-decoration:none; background-color:#FF9999; color:#FFFFFF;}


/**/
dl.price{font-size:1.4em; border-bottom:1px solid #CCCCCC; font-weight:bold; margin:0; padding:0;}
dl.price dt{float:left;}
dl.price dd{float:right;}
dl.price:after{float:none; clear:both; content:""; display:block;}

/*QA*/
dl.faq{margin:0; padding:0;}
dl.faq dt{color:#FF0099; padding:12px 12px 0 12px; font-weight:bold;}
dl.faq dt:before{content:"Q."; font-size:2.4em; color:#FF0099; margin-right:8px;}
dl.faq dd{background-color:#FFE6F3; padding:8px 12px;}
dl.faq dd:before{ content:"A."; font-size:2.4em; color:#FF0099; margin-right:8px;}

/*病院*/
p.dial{display:table; text-align:center; margin:0 auto 16px;}
p.dial img{ vertical-align:middle; margin-right:8px;}
p.dial strong{color:#FF3366; vertical-align:middle;}

.Maps{ clear:both; margin:0 auto; margin-bottom:60px; border:1px solid #FFCCCC; padding:8px 20px; width:90%;}
.Maps .left{width:70%; float:left; text-align:left;}
.Maps .right{width:29%;	float:right;}
.Maps .right iframe{width:100%; height:220px;}
.Maps h4{padding:0; margin:12px 0; background:none; color:#ff3d79;	font-size:130%;}

.osaka{ clear:both; margin:0 auto; margin-bottom:60px; border:none; padding:8px 20px; width:auto;}


@media screen and (max-width:1218px) {
div#news{width:94%;}

h1{width:100%;}

/****************/
#headerspace{padding-top:200px;}

.readL{float:none; width:auto;}
.readR{float:none;}

.whatL{width:70%;}

p.ph img{max-width:100%;}
}

@media screen and (max-width:1060px) {
img{max-width:100%;}
.read dt{width:auto;}

.reads div.left{width:66%; float: left;}
.reads div.right{width:30%;}

ul.illust li img{width:90%;}

div.volmellaL{float:left; width:75%;}
div.volmellaR{float:right; width:23%;}

}

@media screen and (max-width:970px) {
.whatL{width:68%;}
}
@media screen and (max-width:920px) {
.whatL{width:62%;}
}

@media screen and (max-width:860px) {
.whatL{width:auto; float:none;}
.whatR{float:none; text-align:center;}
.ex{text-align:center;}

ul.illust_cause li img{width:90%;}

}

@media screen and (max-width:768px) {
/****************/
#headerspace{padding-top:140px;}
}

@media screen and (max-width:724px) {
#landing{font-size:1em;}

h3{font-size:1em; padding:8px;}
h3 span{display:block;}

dl.faq dt, dl.faq dd{margin:0; padding:0;}
dl.faq dd{margin-bottom:20px;}

#read span{display:inline;}
#read h2{font-size:1.6em;}
#read strong{font-size:1.2em;}
.readL img{max-width:100%;}
.readR img{max-width:100%;}

#what h3.sub{font-size:1.2em; line-height:1.4;}

p.point{text-align:left; font-size:1.4em;}
p.point span{display:inline;}



ul.illust_cause li img{width:auto;}
ul.illust_cause li{display:block; width:auto; margin:0; padding:0;}


#what h2{font-size:1.6em;}

.Maps{width:84%;}
.Maps div.left{margin-bottom:40px;	width:auto; float:none;	text-align:left;}
.Maps div.right{width:auto;	float:none;	text-align:center;}
.Maps .map{width:100%;}
}

@media screen and (max-width:680px) {
/****************/
#headerspace{padding-top:130px;}
}

@media screen and (max-width:620px) {
div.volmellaL{float:none; width:auto;}
div.volmellaR{float:none; width:auto; text-align:center;}
ul.volmella_point{font-size:1.1em;}

.ex{text-align:center;}
.ex ul{margin:0 12px 24px 0; padding:10px; list-style:none; vertical-align:top;}
.ex ul li{margin:0 auto; padding:0; text-align:center; display:block;}
.ex ul li.arrow{ margin:0 auto;
    width:0;
    height: 0; margin-top:6px;
    border-top: solid 20px #FAABB3;
    border-right: solid 27px transparent;
    border-bottom: solid 6px transparent;
    border-left: solid 27px transparent;
}

ul.illust li{ display:block; float:none; width:auto; padding-bottom:20px;}
ul.illust li img{width:auto; max-width:100%;}

}


@media screen and (max-width:612px) {
.ex ul{margin:0 12px 24px 0; padding:10px; list-style:none; vertical-align:top;}
.ex ul li{margin:0 auto; padding:0; text-align:center; display:block;}
.ex ul li.arrow{ margin:0 auto;
    width:0;
    height: 0; margin-top:6px;
    border-top: solid 20px #FAABB3;
    border-right: solid 27px transparent;
    border-bottom: solid 6px transparent;
    border-left: solid 27px transparent;
}
}

@media screen and (max-width:560px) {
/****************/
#headerspace{padding-top:120px;}

h4{padding:0; margin:0; line-height:1;}
img.rights{float:none; padding-bottom:0; padding-left:0; display:block; margin:0 auto;}

ul.illust_cause li img{max-width:100%;}

.link{width:92%;}
.reads div.left{width:auto; float: none;}
.reads div.right{width:auto; float:none; text-align:center;}

ul.point{list-style:none; margin:8px; padding:0;}

.adap img{float:none; clear:both; display:none;}
}

@media screen and (max-width:480px) {
.link{ line-height:1.3; margin:2px 0 30px; font-size:1em;}

.link span{display:block;}
p.dial span{display:block;}
p.tel span{display:block;}
}

@media screen and (max-width:360px) {
img.rights{float:none; clear:both; display:block; padding-bottom:20px; padding-left:12px; width:auto; margin:0 auto;}


dl.after dt{float:none; padding:0;}
dl.after dd{margin:0 0 0 12px; padding:0;}
dl.after dt{width:auto; float:none; color:#FF6699; font-weight:bold; text-align:left; padding:8px 0 0;}
dl.after dd{margin-left:0; border-top:none; padding:0;}
}


/****************************************************/
/**印刷*****************************************/
/****************************************************/
/****************************************************/
@media screen and (max-width:1218px) {
}
