@charset "utf-8";

img{max-width:100%;}

span.bl{display:block;}

/*肌を土台からレベルアップさせることができる治療*/
#about h2 span.blk{ display:block;}
#about:after{content:""; clear:both; display:block;}
#aboutT{}
#aboutP{float:right; padding-top:80px;}

#about ul{list-style:none; padding-left:1em;}
#about ul li{text-indent:-1em;}
#about ul li:before{content:"●"; color:#0066CC; padding-left:-1em;}

.osusume{margin-top:20px;}
#Main .osusume h3{border:none; background-color:#176FC5; color:#FFFFFF; padding-left:12px; border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px;}
.osusume ul{ padding-left:2em;}

p.img{text-align:center;}


/*効果の出現が早い治療*/
div.trouble{border:2px solid #999999; padding:12px; text-align:center; background-color:#FFFFFF; margin-top:20px; border-radius: 12px;}
#Second div.trouble h3{background:none; background-color: #F1DAE9; display:inline-block; font-size:1.3em; border:none; margin:0; padding:0 8px; color:#E4108A; border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px;}
div.trouble ul{list-style:none;	 margin-top:10px; display:inline-block; vertical-align:top;}
div.trouble ul li{margin:0 auto; margin-bottom:12px; position: relative; display:inline-block; margin-left:22px; margin-right:12px;}
div.trouble ul li.now{width:auto;}
div.trouble ul li::after {
  content: '';
  display: block;
  position: absolute;
  top: .3em;
  left: -1em;
  width: 10px;
  height: 5px;
  border-left: 2px solid #E95C86;
  border-bottom: 2px solid #E95C86;
  transform: rotate(-45deg);
}


dl.result{ display:block; clear:both; margin-bottom:20px;}
dl.result dt{ font-size:1.3em; padding:12px; text-align:center;}
dl.result dd{background-color:#C774AB; font-size:120%; color:#FFFFFF; text-align:center; padding:12px; border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px;}

.result_arrow{text-align:center; margin-top:12px;}
.result_arrow p{display:inline-block; border-style: solid; border-width: 30px 44px 0 44px; text-align:center; margin-bottom:-12px; border-color: #C774AB transparent transparent transparent;}


/*施術の痛み・ダウンタイムがない明日、美肌になりたいときに駆け込める！*/
.soon{}
.soon p.arrow{text-align:center; padding-top:12px; display:block;}
.soon p.arrow span{display:inline-block; border-style: solid; border-width: 30px 44px 0 44px; text-align:center; border-color:#CCCCCC transparent transparent transparent; margin-bottom:-12px;}
.soon p.osusume{background-color:#CFEAF5; font-size:110%; padding:12px; margin-bottom:12px; border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px; text-align:center;}
.soon p.osusume span{display:block;}

/*他の美容皮膚科治療の併用にも適した施術*/
.togetherL{float:left; width:60%;}
.togetherR{ float:right; width:38%;}
.together:after{clear:both; content:""; display:block;}

/*【マシュマロリフトと併用可能な治療例】*/
div.ex{background-color:#EFEBF5; padding:12px 4px;}
div.ex:after{content:""; clear:both; display:block;}
#Main div.ex h3{color:#972887; border:none; background:none; margin:0;}
div.exL{float:left; width:70%;}
div.exR{float:right; width:28%;}
div.exR img{max-width:100%;}
div.ex dl{margin:0 12px;}
div.ex dt{border:2px solid #D9AACD; display:inline-block; padding:0 6px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;}
div.ex dl dd dt:before{content:"■";}
div.ex dl dd dt{border:none; color:#972887; margin-left:-12px;}

div.ex hr{border:none; border-bottom:1px solid #666666; margin-left:12px;}
div.ex p{margin-left:12px;}

/*間隔を空けずに治療ができる*/
#Main .treatment h3{ border:1px solid #C774AB; color:#C774AB; background-color:#EFEFEF; padding:0 6px;}
.treatment h3 span:after{content:"：";}
.treatment h4{text-indent:-7.4em; margin-left:7.3em;}
.treatment h4 span{background-color:#C774AB; color:#FFFFFF; padding:0 0.2em; margin-right:0.2em;}
.treatment p.case{color:#AE0985; padding:0 0.2em;}
.treatment hr{border:1px dashed #C774AB; margin:12px 0;}

ul.modelcase{margin:0; padding:0; font-size:0.85em; font-family:"	Meiryo","メイリオ", Osaka, "ヒラギノ角ゴ Pro W3"; line-height:1.4em;}
ul.modelcase li{ border:1px solid #C774AB; background-color:#EEEEEE; font-size:0.9em; display:inline-block; vertical-align: middle; text-align:center; margin:12px 0; padding:2px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;}
ul.modelcase li.ultra{background-color:#EDF4FA; border:1px solid #3366CC;}

ul.modelcase li span.ttl{ background-color:#C774AB; color:#FFFFFF; display:inline-block; width:100%; border-radius:6px 6px 0 0; -webkit-border-radius:6px 6px 0 0; -moz-border-radius:6px 6px 0 0;}
ul.modelcase li.ultra span.ttl{background-color:#3366CC;}

ul.modelcase li strong{color:#C46FA6; display:block;}
ul.modelcase li.ultra strong{color:#3366CC;}

ul.modelcase li.arrow{position: relative; border:none; background:none; padding:0 4px; font-size:4px; margin:0; display:inline-block; text-decoration: none;}
ul.modelcase li.arrow_s{box-sizing:border-box; border:1px solid #C774AB; background-color:#C774AB; padding:1px; margin:0; height:7px; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0;}
ul.modelcase li.arrow::before, ul.modelcase li.arrow::after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
}

ul.modelcase li.arrow::before{
    left:3px;
    box-sizing: border-box;
    width:9px;
    height:9px;
    border:9px solid transparent;
    border-left:9px solid #C774AB;
}
ul.modelcase li.arrow::after{
    left:-3px;
    width:9px;
    height:10px;
    border-left:9px solid #C774AB;
}

/*治療について*/

dl.step{margin-bottom:12px;}
dl.step dt{font-size:1.25em; padding:12px 12px 0; background-color:#DEEAF8;}
dl.step dd{padding:0 12px 12px; background-color:#DEEAF8;}
dl.step dd dt{font-size:1.1em; color:#2769D8; padding:0;}
dl.step dd dt:before{content:"■";}
dl.step dd dd{border:none; padding:0; padding-bottom:12px;}
dl.step dd ul{list-style:none; font-size:0.9em;}
dl.step dd ul li:before{content:"●"; color:#D89DC4;}

dl.step dd.arrow{height:18px; background:url(../images/arrow_down.png) no-repeat bottom left; background-color:#FFFFFF; padding:0; margin:6px 0;}


.flow ul{list-style:none; font-size:0.9em;}
.flow ul li:before{content:"●"; color:#D89DC4;}

/*ベイビーリフトについて*/
.marsh{ background-color:#FFFFFF; color:#CC0099; padding:6px; font-size:0.9em;}
.marsh h4{background:none; padding-left:0; font-size:1.1em;}
.marsh p.notes{color:#333333;}

/*アフターケア*/
#aftercare{padding:60px 0 40px; margin:0;}
#aftercare .box{border:1px solid #993300; padding:20px; background-color:#FFFFFF;}
#aftercare dl{}
#aftercare dt{float:left; width:190px; text-align:center; background-color:#A18C74; color:#FFFFFF; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;}
#aftercare dd{margin-left:200px; padding-top:0; margin-bottom:24px;}


/*費用について*/
p.price_ttl{display:none;}
table.price{width:100%; border-collapse:collapse; border:1px solid #003366; margin-bottom:20px;}
table.price th, table.price td{padding:12px; border-top:1px solid #7C6754; border-right:1px solid #003366; padding:8px 4px;}
table.price th{background-color:#B6C4E9; color:#003366; vertical-align:top;}
table.price th.ttl{font-size:1.1em;}
table.price th span{display:block;}
table.price td.times{background-color:#E1E9FB; text-align:right;}
table.price td{text-align:right;}
p.pnote span{ margin-right:12px;}

/**/
div.contraindications{border:1px solid #83A9F1; padding:12px;}
div.contraindications ul{font-size:0.9em; margin-left:24px;}


@media screen and (max-width:1070px){
.soonL{width:64%;}
div.trouble ul.long{width:auto;}
}

@media screen and (max-width:988px){
h2 span{display:block;}

#about h2 span{display:inline;}

dl.result dd span.bl{display:block;}

.treatment h4{text-indent:0; margin-left:0; padding:0;}
.treatment h4 span{display:block; margin-right:0;}
}

@media screen and (max-width:860px){
#about h2 span.b{ display:block;}

.soonL{float:none; width:auto;}
.soonR{float:none; text-align:center; padding-top:20px;}

}

@media screen and (max-width:760px) {
div.exL{ float:none; width:auto;}
div.exR{float:none; width:auto; text-align:center; padding-top:20px;}

ul.modelcase{font-size:0.9em;}

.treatment hr{margin:28px 0 6px;}

#aftercare dt{ width:160px;}
#aftercare dt span{display:block;}
#aftercare dt span.dot{line-height:0;}
#aftercare dd{margin-left:170px;}
}

@media screen and (max-width:720px){
div.trouble span.bl{display:block;}
}

@media screen and (max-width:690px){
p.pnote span{ margin-right:0; display:block;}
}

@media screen and (max-width:660px){
dl.result dd span.bl{display:inline;}

.togetherL{float:none; width:auto;}
.togetherR{ float:none; width:auto; text-align:center;}


p.price_ttl{display:block; color:#663300;}
table.price th.ttl{display:none;}
table.price th{}
table.price th, table.price td.yen{white-space:nowrap;}
}

@media screen and (max-width:560px){
div.trouble{padding:12px 0;}
dl.result dd{text-align:left;}

ul.modelcase{font-size:0.8em;}

.treatment h3{font-size:1em;}

div.ex{padding:12px 2px;}
div.ex dl{margin:0 8px;}

#aftercare dt{ width:auto; display:block; float:none;}
#aftercare dt span{display:inline;}
#aftercare dt span.dot{line-height:inherit;}
#aftercare dd{margin-left:0;}
}

@media screen and (max-width:520px){
dl.result dt{font-size:1.1em;}

#about h2 span.blk, #about h2 span.b{ display:inline;}

dl.step dd{padding:0 4px;}

p.pnote{font-size:70%;}
}

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

.marsh{padding:8px;}
.marsh h4{background-color:#EFEBF5; padding:0 4px;}

.treatment h3 span{display:block;}
.treatment h3 span:before{content:"<";}
.treatment h3 span:after{content:">";}
}

@media screen and (max-width:420px){
dl.result dt{ font-size:1.1em;}
ul.modelcase{font-size:0.9em;}
ul.modelcase li span{display:block;}
table.price{font-size:90%; margin-bottom:0;}
table.price th, table.price td{padding:12px 4px;}
table.price td span{display:block;}
}

@media screen and (max-width:412px){
.soonL p.osusume span{display:inline;}

ul.modelcase li{width:22%;}
ul.modelcase li.arrow, ul.modelcase li.arrow_s{width:auto;}
}