@charset "utf-8";
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; background: transparent; }

body { color: #333; position: relative; line-height: 1.8; font-size: 1.4rem; letter-spacing: .06rem; font-family: "游明朝体","YuMincho","游明朝","Yu Mincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","HGS明朝E","ＭＳ Ｐ明朝","MS PMincho",'sans-serif'; font-weight: 500; }

table { border-collapse: collapse; border-spacing: 0; }

a { color: inherit; outline: none; text-decoration: none; }
a:link { color: #000; }
a:visited { color: #000; }
a:hover { color: #000; text-decoration: none; }
a:active { color: #000; }

span.bl{display:block;}

.T60{margin-top:60px;}

/*上にもどる*/
#bck {position:fixed; right:4%; bottom:100px; display:none; z-index:100;}
#bck a { display:block; background:url(../backtotop.png) no-repeat; width:65px; height:30px; }
#bck a:hover{ background-position:bottom left;}
@media screen and (max-width:840px){
#bck{width:100%; margin-left:0; right:0; bottom:0;}
#bck a{position:absolute;  right:4px; bottom:8px;}
}

/**動画*****************/
div.movie{ text-align:center; border:1px solid #EEEEEE; box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .3); padding:12px; width:60%; margin:12px auto 30px;}
div.movie p{margin:0; padding:0; font-size:0.85em;}

.video-container {
	position: relative;
	padding-bottom: 50%;
	padding-top: 30px;
	height: 0;
	overflow: hidden; margin-bottom:8px;
}

.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width:684px) {
div.movie{float:none; width:90%; margin:18px auto 60px;}
}
/******************/


#title{background:#E3F4FC; width:100%; text-align:center; padding:117px 0 0 0; line-height:0;}
#title img{margin:0 auto;}
#title p.news{margin:12px auto; font-size:0.75em; line-height:1.6; background-color:#FAE4EA; color:#CC0000;}

/*リード文*/
#Point{background-color:#C8D6FF; font-size:1em; padding:12px 4px;}
h2.read{color:#660000; text-align:center; text-shadow: 1px 1px 0 rgba(255,255,255,0.3);}
h2.read span{ display:block;}
#Point p{text-align:center; color:#660000; font-weight:800;}
#Point p span{display:block;}

p.links{font-size:0.9em; margin-top:12px;}


/*------------------------------*/

div.Details{width:1033px; margin:12px auto;}

div.blue{background-color:#F0F3FF;}

h2{font-size:1.5em; color:#000066; padding:26px 0 30px;}

h3{font-size:1.1em; font-weight:800; color:#FF6600; text-align:center; margin-bottom:12px;}
h3 strong{background: linear-gradient(transparent 30%, #FFFFCC 30%);}
h3 span{display:block;}

/*****************/
/*リンク*/
/*------------------------------------------*/
/***************/
.arrowSite{text-align:right;}
.arrowSite a{
position:relative;
color:#000066;
display:inline-block;
border-width: 1px;
border-style: solid;
text-transform: uppercase;
background-color:#A4B1EA;
border-radius: 22px;
border:none;
-webkit-border-radius: 22px;
-moz-border-radius: 22px;
padding:0 2em 0 1em;
}
.arrowSite a::after{display: block;
  content: '';
  position: absolute;
  top: 0.6em;
  right:1em;
  width: 6px;
  height: 6px;
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);}
.arrowSite a:hover{background-color:#BFC8F0; text-decoration:none;}

/*特徴*/
p.movielink{text-align:center;}
p.movielink a{background-color:#999999; color:#FFFFFF; font-size:0.8em; padding:0 5px;}

#whatis{background-color:#FFFEE6; padding:20px 0; margin:0;}
h2#what{text-align:center;}
.whats, .downtime, .retreatment{ margin:20px auto 70px; border:3px solid #99CCFF; width:88%; padding:23px; background-color:#FFFFFF;}
.whats .txt{float:left; width:74%; font-size:0.8em;}
.whats .ph{float:right;}
.whats .ph img{display:inline-block;}
.whats:after{content:""; display:block; clear:both;}

.downtime .txt{ float:left; width:50%; font-size:0.8em;}
.downtime .ph{float:right;}

.whats .txt p:first-child:first-letter{
  float: left; 
  color:#0099CC;
  font-size: 50px;
  line-height:60px;
  padding-right: 8px;
  font-family: Georgia, serif;
}

.downtime .txt p:first-child:first-letter{
  float: left; 
  color:#0099CC;
  font-size: 50px;
  line-height:60px;
  padding-right: 8px;
  font-family: Georgia, serif;
}

/*ミラドライ経験者の再治療について*/
.retreatment .txt{float:left; width:74%; font-size:0.8em;}
.retreatment .ph{float:right;}
.retreatment:after{content:""; display:block; clear:both;}


/**子供のわきが**/
#child{background:url(background_child.jpg) top center no-repeat #E6EAEB; padding:20px 0 60px; margin:0; text-align:left;}
#child h2{color:#006600; text-shadow: 1px 1px 0 rgba(255,255,255,0.3);}
#child h2 span{font-size:0.8em; vertical-align:middle;}
#child p{width:66%; font-size:0.8em;}
#child p.note{font-size:0.7em; margin-bottom:20px;}

#child ul.marg{margin:0 0 0 20px; line-height:1.6em;}
#child ul.marg span::after{content:'/';}

#child p.link{text-align:right;}
#child p.link a{display:inline-block; background-color:#99D5CA; padding:2px 8px; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;}
#child p.link a:hover{background-color:#75C6B8;}

/*治療の目安*/
#schedule{padding:60px 0;}
#schedules p{float:left; width:48%; font-size:0.8em; padding-top:20px;}
#schedules p.photo{margin-top:-30px;}
#schedule h2{text-align:center;}

/*治療の流れ*/
#step{background-color:#FFF7AA; padding:60px 0;}
#step h2{text-align:center; color:#CC3300;}
#step p{text-align:center; font-size:0.9em;}

#Main ul.flow{margin:20px 0 0 0; list-style:none;}
#Main ul.flow strong{color:#FF6600; font-size:1.2em;}
#Main ul.flow li{background-color:#FFFFFF; border-radius: 6px; border:none; -webkit-border-radius: 6px; -moz-border-radius: 6px; padding:16px; overflow:hidden; zoom:1; font-size:0.9em;}

#Main ul.flow li{display:table-cell; vertical-align:top;}
#Main ul.flow li.move{display:block;}
#Main ul.flow li.move img{float:left; padding-right:12px;}

#Main ul.flow li.arrow_r{background-color:#FFF7AA; padding:0; margin:0; vertical-align:middle;}
#Main ul.flow li.arrow_r div{background-color:#FFF7AA; padding:0; margin:0 0 0 12px; width: 0px; height:0px; border:none; border:30px solid; border-color:transparent transparent transparent #FFCCCC;}

#Main ul.flow li.movie video{float:left; margin:0 2%;}

#Main ul.flow li.none{ display:block; background-color:#FFF7AA; padding:0; margin:20px auto 0;}

#Main ul.flow li.arrow{ display:block; background-color:#FFF7AA; padding:0; margin:20px auto 0; width: 0px; height:0px; border: 30px solid; border-color: #FFCCCC transparent transparent  transparent;}


/*比較*/
#compare{padding:60px 0;}
#compare h2{text-align:center;}

h2.compare{text-align:center;}

div.comparescroll{width:100%; margin:0 auto; padding:0;}
div.comparescroll table{width:100%; border-collapse:collapse; border-bottom:1px solid #CCCCCC; border-right:1px solid #CCCCCC; font-size:0.75em; line-height:1.3em;}
div.comparescroll table th, div.comparescroll table td{border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; padding:4px 2px;}
div.comparescroll table th{background-color:#3D76B6; color:#FFFFFF; white-space:nowrap; font-weight:normal; vertical-align:middle;}
div.comparescroll table td{vertical-align:top; background-color:#FFFFFF;}
div.comparescroll table td.center{text-align:center; vertical-align:middle;}
div.comparescroll table th.sentence{width:16%;}
div.comparescroll table th.child{font-size:0.8em;}

/*すそわきが*/
#suso{background-color:#F5FCF5; padding:60px 0;}
#suso h2{text-align:center; color:#006600;}
#suso p{font-size:0.9em;}

/*費用について*/
#price{padding:60px 0;}
#price h2{text-align:center;}
table.prices{border-left:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; border-collapse:collapse; width:99%; margin:0 auto;}
table.prices th, table.prices td{border-right:1px solid #CCCCCC; border-top:1px solid #CCCCCC; padding:8px;}
table.prices th{background-color:#ECF0FD; color:#003399;}
table.prices td{background-color:#F8F9FE; text-align:center; }
table.prices td.yen{text-align:right; background-color:#FFFFFF;}
#price p{font-size:0.8em;}
#price p.tax{text-align:right; width:98%;}
p.notes{margin:12px 0 30px; color:#CC0000;}
#price p.risk{font-size:0.75em; color:#666666; margin-top:12px;}

/***QA***********/
#qanda{padding:60px 0; background-color:#FFFFCC;}
#qanda h2{text-align:center; color:#660000;}
dl.qa{margin:0; font-size:0.8em;}
dl.qa dt{background:url(qa_q.gif) left top no-repeat; color:#FF6600; font-weight:bold; margin:20px 0 10px 0; padding:0 0 4px 30px;}
dl.qa dd{background:url(qa_a.gif) left top no-repeat; margin:0 0 40px 0; padding:0 0 0 30px;}

/*体験者の声*/
#voice{padding:60px 0; background-color:#FFEAF8;}
#voice h2{text-align:center; color:#990033;}
div.voiceD{margin-bottom:80px; border:3px solid #FFCCCC; padding:48px 48px 0 48px; background-color:#FFFFFF;}
div.voiceD h3{ text-align:left;
color:#FF0066;
padding: 0 0 0 6px;
vertical-align: middle;
text-decoration: none;
font-size:1.1em;
border-left:12px solid #FF0066;
}

div.voiceD img{float:left; width:20%;}
div.voiceD p{font-size:0.9em;}
div.voiceD p.age{text-align:right; color:#006699; border-bottom:1px dotted #000066; padding:0 4px; font-weight:bold; font-size:0.8em;}

@media screen and (max-width:1058px) {
div.Details{width:98%;}
#title{width:100%;}
#title img{ width:100%;}
}

@media screen and (max-width:1030px){
.downtime .txt{ width:44%;}
}

@media screen and (max-width:980px){
#Title img{width:100%;}
#Title .bn{width:auto;}

#Point p span{display:inline;}

.downtime .txt{width:68%;}
.downtime .ph img{display:block;}

.retreatment .txt{width:68%;}


#logodial div{width:99%;}

#Frame{width:98%;}

h2{width:auto;}
.contents{width:94%;}
div.comparescroll{width:94%;}

#schedules p.photo img{width:100%;}

#Main ul.flow li{font-size:0.7em;}

}

@media screen and (max-width:920px){
#Main ul.flow li{display:block; vertical-align:top;}
#Main ul.flow li.move{display:block;}

#Main ul.flow li.arrow_r{background-color:#FFF7AA; padding:0; margin:0; vertical-align:middle;}
#Main ul.flow li.arrow_r div{display:block; background-color:#FFF7AA; padding:0; margin:20px auto 0; width: 0px; height:0px; border: 30px solid; border-color: #FFCCCC transparent transparent  transparent;}
}

@media screen and (max-width:896px){
#Point p{text-align:left;}
#Point p.links{text-align:center;}
}

@media screen and (max-width:866px){
#Title .bn{width:auto;}
#logodial img{width:100%;}
.whats .txt{width:64%;}
.downtime .txt{width:60%;}
.retreatment .txt{width:60%;}
}

@media screen and (max-width:830px){
#Main ul.flow li.movie video{float:none; width:80%;}
}

@media screen and (max-width:840px){
h2 span{display:block;}
h2.read{text-align:left;}
h2.read span{display:inline;}
.whats .txt{width:64%;}
}

@media screen and (max-width:760px){
.whats .txt{width:60%;}
#schedules p{float:none; width:auto;}
#schedules p.photo img{max-width:100%;}
#schedules p.photo{margin-top:auto; text-align:center;}

#step p{text-align:left;}
span.bl{display:inline;}

/*子供の*/
#child{background-size: contain; padding:0;}
#child #childFrame{background: rgba(255,255,255,0.7); margin-top:-20px;}
#child .Details{width:90%; padding-bottom:30px;}
#child p{width:auto; color:#000000; text-shadow: 1px 1px 0 rgba(255,255,255,0.3);}
#child ul{font-size:0.9em;}
}

@media screen and (max-width:740px){
p.links img{width:100%;}
div.comparescroll table th span{display:block;}
table.prices{font-size:0.8em;}
}

@media screen and (max-width:720px){
#title{padding-top:100px;}
}

@media screen and (max-width:640px){
.whats .txt, .downtime .txt, .retreatment .txt{float:none; width:auto;}
.whats .ph, .downtime .ph, .retreatment .ph{float:none; text-align:center; padding-top:20px;}
.downtime .ph img{display:inline-block;}

div.voiceD{padding:12px;}

#detailes{width:100%;}

body { font-size: 1.2rem;}
h2{font-size:1.1em;}

h3{font-size:0.9em;}
h3 span{display:inline;}

#Point p{font-size:0.8em;}
h2.read{margin:0; padding:0; font-size:1em;}

.whats{padding-bottom:0;}
.whats .txt p:first-child:first-letter {
  float: left; 
  color:#0099CC;
  font-size: 40px;
  line-height:50px;
  padding-right: 8px;
  font-family: Georgia, serif;
}

div.comparescroll table th span{display:block;}
}

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

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

#schedules p.photo img{width:100%;}

#logodial{text-align:center; line-height:0;}
#logodial .sc{float:none; margin:0 auto; padding:0; width:60%;}
#logodial .dial{float:none; margin:0 auto; padding:0; width:60%;}
div.comparescroll table{width:790px;}
div.comparescroll { width:94%;  overflow-x:auto;}
div.comparescroll::-webkit-scrollbar{
	width: 5px;
	background:#333333;
}
div.comparescroll::-webkit-scrollbar:horizontal{
	height: 5px;
	background: #CCCCCC;
}
div.comparescroll::-webkit-scrollbar-thumb{
	background: #333333;
	border-radius: 2px;
}
div.comparescroll::-webkit-scrollbar-thumb:horizontal{
	background: #333333;
	border-radius: 2px;
}


#Main ul.flow li.move img{float:none; display:block;}
/*子供の*/
#child ul.marg span{display:block;}
#child ul.marg span::after{content:'';}
#child p.link{text-align:center;}
}

@media screen and (max-width:520px){
table.prices th span{display:block;}
}

@media screen and (max-width:480px){
#logodial .sc{ width:50%;}
#logodial .dial{ width:60%;}
h2{font-size:1em;}

h3 span.down{display:block;}

#Main ul.flow li{padding:8px;}
#Main ul.flow li.arrow{margin:12px 0;}

#detailes{width:100%;}

h3.what_l{text-align:left;}
h3 span{display:inline;}

}

@media screen and (max-width:440px){
table.prices th, table.prices td{padding:8px 1px;}
}

@media screen and (max-width:420px){
.whats, .downtime, .retreatment{width:78%;}
}
@media screen and (max-width:400px){
#Point{font-size:0.65em;}
#Main dl.price{width:auto;}
#Main dl.price dt{width:auto; float:none;}
#Main dl.price dd{width:auto; float:none; margin:0;}
#Main dl.price span{margin:0;}
table.prices{font-size:0.65em;}
}

@media screen and (max-width:380px){
#child p.link span{display:block;}
#child p.link a{padding:2px 24px;}
}

/**************************/
/*clinic*/
#clinic{padding:60px 0;}
#clinic h2{text-align:center;}

h3.drstitle{border:1px solid #003366; color:#003366; background-color:#EEEEEE; padding:2px 6px; margin:12px 0;}

/**院長*/
#director{ margin-bottom:60px;}
#director .ph{float:left; font-size:0.8em;}
#director .txt{float:right; width:70%; font-size:0.8em;}
#director ul{list-style:none; margin:12px 0; font-size:0.8em; line-height:1.3em;}
#director .cc li{color:#336699;}
#director p.name{font-size:1.2em; font-weight:bold; font-size:1em; margin-top:0; line-height:1.3em;}
#director p.name strong{font-weight:bold; font-size:1.2em;}

/*Dr*/

#detailes{margin:0 auto;}
#detailes h3{ font-weight:700; font-size:1.6em; border-bottom:1px dotted #336699; line-height:130%; padding-bottom:6px; margin:0 0 12px 0;}
#detailes h3.data{font-size:0.8em; font-weight:normal; color:#FF6600; margin:0; padding:0; border:none;}

.drs{margin:40px 0 50px 0; border:1px solid #CCCCCC; padding:6px; overflow:hidden; zoom:1;}
.drs .txt{font-size:0.8em;}
.drs .txt ul{list-style:none; margin:12px 0;}
.drs .txt .cc li{color:#336699;}


/*病院案内*/
div.cln h3{text-align:left; color:#333333;}
div.cln h3 span{display:inline-block;}

div.cln{line-height:1.6em; margin:12px 0 40px; overflow:hidden; zoom:1;}
div.cln .add{float:left; width:55%; font-size:0.8em;}
div.cln .ph{float:right;}

div.cln dl{line-height:1.6em; margin:0;}
div.cln dt{color:#0066CC; margin-top:20px; border-left:12px solid #0066CC; padding-left:6px;}
div.cln dd{ margin:0 0 8px 16px; padding:0;}


@media screen and (max-width:980px){
#director .txt{width:63%; float:left; padding-left:2%;}
}

@media screen and (max-width:840px){
#director .ph{padding-right:30px;}
#director .txt{float:none; width:auto;}

div.cln .add{float:none; width:auto;}
div.cln .ph{float:none; padding:0 0 0 12px;}
div.cln .ph img{display:inline;}
	
div.cln dt{width:auto; float:none;}
div.cln dd{float:none; padding:0 0 12px 4px; margin-left:0;}
iframe{width:98%;}
}

@media screen and (max-width:580px) {
#director .ph{ float:none; text-align:center;}
#director .txt{float:none; width:auto;}
}

@media screen and (max-width:480px){
#director .ph{width:80%; margin:0 auto;}
#director .ph img{width:90%;}
.drs .txt{float:none; width:100%;}
}