@charset "utf-8";

body{margin:0; padding:0;}

#headerspace{padding-top:90px;}

.img{max-width:100%;}
.img_right{float:right; margin-left:12px;}

#TitleLine{background-color:#36BEF0; margin:0 auto; padding:2px 4px; width:980px; box-sizing: border-box;}
#TitleLine .line{color:#FFFFFF; margin:0 auto;}
#TitleLine p{text-align:left; font-weight:bold; margin:0; padding:0;}
#TitleLine span:after{content:"：";}

#HeaderContents{text-align:center;}
#HeaderContents p.days{text-align:right; width:980px; margin:0 auto; padding-top:4px; line-height:1;}
#HeaderContents p.banar{margin:20px auto 30px; clear:both; width:960px;}

/*ページメニュー目次*/
div#pagemenuBox{margin:30px auto 30px; padding:12px 0 0; width:720px; border:3px solid #EAF3FD; background-color:#FBFDFF;}
div#pagemenuBox p{color:#666666; text-align:left; margin:0 1.4em 0 1.4em; padding:0; font-size:120%; border-bottom:1px solid #CCCCCC;}
ul#pagemenu{ list-style:none; text-align:left; margin:0; padding:8px 0; width:100%;}
ul#pagemenu li{ display:block; padding:0;}
ul#pagemenu a{background:none; color:#003399; padding:0; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0;}
ul#pagemenu a:hover{color:#3366CC; border-bottom:1px solid #99CCFF;}

ul#pagemenu li{
  margin:5px 12px 5px 3em;
	text-indent:-1.2em;
}
ul#pagemenu li:before{
  content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border: transparent solid 6px;
    border-left-color:#006699;
}

/*上に戻る*/
#bck {position:fixed; right:5%; bottom:30px; display:none; z-index: 100;}

#title{padding:0; line-height:0;}

h2{ border:0; text-align:left; background:none; background-color:#0066CC; color:#FFFFFF; position:relative; z-index:-10; display:block; clear:both; margin:20px 0 12px; padding:4px 6px; line-height:1.5em;}
h3{background:none; border:2px solid #0066CC; color:#003399; margin:0 auto;}

/*リード文*/
p.read{text-align:left; border:1px solid #CCCCCC; padding:8px;}

/*リード文*/
.read{text-align:left; margin:20px auto;}
.read strong{color:#0066CC; margin:0; padding:0; line-height:1; font-size:1.2em;}
.read h2{border:none; background:none; color:#141414; padding:0; margin:0; text-indent:0; font-size:1.5em;}
.read h2 span{display:block;}
.read p{margin:0; padding:0;}


/*適応*/
#adapt{ margin-top:40px;}
#adapt h3{border:none; margin:12px 0 0; padding:6px; background-color:#EBF5FF;}
#adapt dl dt, #adapt dl dd{margin:0; padding:16px 0 0;}
#adapt dl dt{font-weight:bold; font-size:1.1em;}
#adapt dl dt:first-child{padding:0;}
#adapt dl dd{padding:0;}
#adapt dl dd:before{content:"■"; color:#0066CC;}
#adaptL{float:left; width:53%;}
#adaptR{float:right; width:46%;}
#adapt:after{content:""; display:block; clear:both;}

ul.adapt_photo{display:flex; flex-wrap: wrap; column-gap:10px; row-gap:10px; list-style:none; padding:0;}
ul.adapt_photo li{max-width:48%;}
ul.adapt_photo li img{width:100%;}

ul.adapt_photo02{display:flex; flex-wrap: wrap; column-gap:10px; row-gap:10px; list-style:none; padding:0;}
ul.adapt_photo02 li{max-width:100%;}
ul.adapt_photo02 li img{width:100%;}

p.adapt_notes{background-color:#333333; color:#FFFFFF; padding:8px;}


div.Box_item{border:2px solid #2E77BC; margin-top:40px; padding:12px; border-radius:12px; -webkit-border-radius:12px; -moz-border-radius:12px;}
div.Box_item h3{ color:#2E77BC; border:none;}

/*当院の治療内容*/
.regimens{clear:both;}

/*治療の流れ*/
/**/
dl.step{margin:30px 0; padding:0;}
dl.step dt{background-color:#EEEEEE; color:#990000; padding:12px 18px 0 18px; margin:0;}
dl.step dt strong{font-weight:bold; color:#003399; font-size:1.2em; border-bottom:1px dashed #3399CC; display:block; padding-left:4px;}
dl.step dd{margin:0; padding:6px 18px 18px; background-color:#EEEEEE;}
dl.step dd strong{}
dl.step dd.arrow{background-color:#FFFFFF;}

dl.step dd.arrow{
  position: relative; z-index:-10;
  display: inline-block;
  margin:1em 0 1.5em 0;
  padding:0;
  min-width:60px;
  max-width: 100%;
  color: #555;
  font-size: 16px;
}
dl.step dd.arrow:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  border:40px solid transparent;
  border-top:20px solid #3399CC;
}


dl.ope_list{margin:60px 0 30px 0; border-bottom:1px solid #BDDCF2;}
dl.ope_list dt{float:left; clear:left; border-top:1px solid #BDDCF2; width:120px; white-space:nowrap; margin:0; padding:6px 0; color:#006699; font-weight:bold;}
dl.ope_list dd{margin:0; padding:6px 0; padding-left:120px; border-top:1px solid #BDDCF2;}
dl.ope_list dd.listno{border:none;}

/*治療例*/
ul.ex_photo{list-style:none; margin:16px 0; padding:0;}
ul.ex_photo li{margin:0; padding:0; display:inline-block; position: relative; display: inline-block; padding: 0 20px 0 0 ; color: #000; vertical-align: middle; text-decoration: none;}
ul.ex_photo li::after{position: absolute; top: 0; bottom: 0; margin:auto 4px; content: ""; vertical-align: middle; box-sizing: border-box; width:12px; height:30px; border:30px solid transparent; border-left:18px solid #999999;}
ul.ex_photo li:last-child::after{border:none;}
ul.ex_photo li.only{width:23%;}
ul.ex_photo li.arrow{display:none;}
@media screen and (max-width:1020px) {
ul.ex_photo li{position: relative; display: inline-block; padding: 0 20px 0 0 ; color: #000; vertical-align: middle; text-decoration: none; width:auto;}
ul.ex_photo li img{width:auto;}
ul.ex_photo li.aut{width:auto;}
}

@media screen and (max-width:650px) {
ul.ex_photo li{margin:0; padding:0; display:inline-block; position: relative; display: inline-block; padding: 0 20px 0 0 ; color: #000; vertical-align: middle; text-decoration: none;}
ul.ex_photo li img{width:auto;}

ul.ex_photo li::after{position: absolute; top: 0; bottom: 0; margin:auto 4px; content: ""; vertical-align: middle; box-sizing: 
border-box; width:12px; height:30px; border:30px solid transparent; border-left:18px solid #999999;}

ul.ex_photo li::after{position:absolute; display:inline-block; clear:none; top:0; bottom:0; margin:auto 4px; content: ""; vertical-align: middle; box-sizing:border-box; width:12px; height:30px; border-width:24px 60px 8px 60px;  border-color:#999999 transparent transparent transparent; border:30px solid transparent; border-left:18px solid #999999;}


ul.ex_photo li:last-child::after{border:none; width:auto;}
ul.ex_photo li.aut{width:auto;}
ul.ex_photo li.arrow{display:none;}
ul.ex_photo li.zoom{width:45%;}
ul.ex_photo li.zoom img{width:100%;}
ul.ex_photo li.only{width:33%;}
}

@media screen and (max-width:560px) {
ul.ex_photo li{width:45%;}
ul.ex_photo li img{width:100%;}
ul.ex_photo li.zoom{width:50%;}
ul.ex_photo li.only{width:36%;}
}

@media screen and (max-width:480px) {
ul.ex_photo li{position:static; display:block; padding: 0 0 0 0 ; color: #000; vertical-align: middle; text-decoration: none; width:auto;}
ul.ex_photo li img{width:auto;}
ul.ex_photo li::after{position:static; display:block; clear:both; top:0; bottom:0; margin:auto 26px; content: ""; vertical-align: middle; box-sizing:border-box; width:60px; height:auto; border-width:24px 60px 8px 60px;  border-color:#999999 transparent transparent transparent;}
ul.ex_photo li:last-child::after{border:none; width:0;}
ul.ex_photo li.aut{width:auto;}
ul.ex_photo li.arrow{display:block;}
ul.resize li::after{display:none;}
ul.ex_photo li.zoom{width:auto;}
ul.ex_photo li.zoom img{width:auto;}
ul.ex_photo li.only{width:auto;}
}


/*費用について*/

table.prices{width:100%; font-size:1.1em; border-bottom:1px solid #0099FF;}
table.prices th, table.prices td{vertical-align:top; padding:6px; border-top:1px solid #0099FF;}
table.prices th{text-align:left; color:#0066CC; font-weight:normal; font-size:1.2em;}
table.prices th p{font-size:70%;}
table.prices td.yen{text-align:right; font-weight:bold;}
table.prices td span{font-size:80%;}
table.prices p{font-size:80%; margin:0;}
table.bottom{border-bottom:1px solid #0099FF;}

p.tax{font-size:0.8em; text-align:right; margin:0;}

table.option{border-bottom:1px solid #0099FF; width:100%;}
table.option caption{text-align:left; padding:6px; color:#0066CC; font-weight:bold;}
table.option th{text-align:left; padding:6px; border-top:1px solid #C7E0F5; font-weight:normal;}
table.option span{font-size:80%;}
table.option td{text-align:right; padding:6px; border-top:1px solid #C7E0F5; font-weight:bold;}


div.price_ex{border:2px solid #0099FF; padding:18px; margin:30px 0; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px;}
div.price_ex h4{background-color:#0066CC; color:#FFFFFF; margin:0; padding:2px 18px; border:none; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; display:inline-block;}
div.price_ex strong{color:#0066CC; display:block; margin:12px 0;}
div.price_ex table{width:100%; margin-bottom:0;}
div.price_ex th{text-align:left;}
div.price_ex th, div.price_ex td{padding:3px; border-top:1px dashed #CCCCCC;}
div.price_ex th.total, div.price_ex td.total{border-top:1px solid #333333; font-weight:bold; padding-bottom:0; padding-top:8px; line-height:1;}
div.price_ex th span{font-size:90%; font-weight:normal; margin-left:8px;}
div.price_ex td{text-align:right;}
div.price_ex th:before{content:"●"; font-size:80%;}

dl.price_example{margin:0; padding:0;}
dl.price_example dt{border:1px solid #0066CC; background-color:#E9F8FA; color:#0066CC;}
dl.price_example dt, dl.price_example dd{display:inline-block; margin:0; padding:0 4px;}
dl.price_example dd{margin-right:12px; padding-left:0;}


@media screen and (max-width:1020px) {
#TitleLine{width:auto;}
table.prices th span{display:block;}
}
@media screen and (max-width:996px) {
#TitleLine .line, #HeaderContents p.days{width:auto;}
}

@media screen and (max-width:880px) {
dl.price_list03 dt span.laser{display:block;}
dl.price_list03 dt span.laser:after{content:"";}
}

@media screen and (max-width:850px) {
#adaptL{float:none; width:auto;}
#adaptR{float:none; width:auto;}
ul.adapt_photo{display:flex; flex-wrap: wrap;  justify-content: flex-start; row-gap:10px; list-style:none;}
ul.adapt_photo li{width:auto;}

ul.ex_list span{display:block; float:none; clear:both;}
ul.ex_list img{margin-bottom:8px;}

dl.price_list dt{width:60%;}
dl.price_list dd{margin-left:60%;}

dl.price_list02 dt{width:50%;}
dl.price_list02 dd{margin-left:50%;}
}
@media screen and (max-width:880px) {
table.prices td span, table.option span{display:block;}
table.prices td.yen, table.option td.yen{white-space:nowrap;}
}

@media screen and (max-width:720px) {
table.prices, table.option{width:98%; margin:0 auto; font-size:0.9em;}
}

@media screen and (max-width:650px) {
.img_right{float:none; margin-left:0; display:block;}

dl.price_list{font-size:1em;}
dl.price_list div.price_ex{line-height:1.6; font-size:0.9em;}
dl.price_list div.price_ex dl{margin:0 40px 0 0;}

dl.price_list03{font-size:1em;}
}

@media screen and (max-width:620px) {
table.prices{width:98%; margin:0 auto; font-size:1em;}
table.prices th, table.prices td{padding:2px; display:block; float:none; font-size:1em;}
table.prices th{background-color:#F0F9FD;}
table.prices td.yen{border-top:none; padding-top:0;}
table.prices th span, table.prices td span, table.option span{display:inline-block;}
table.prices th:before{content:"■";}
table.prices th p{font-size:80%;}
}

@media screen and (max-width:580px) {
.box ul{margin-top:0; margin-bottom:0; margin-left:24px; padding:0; color:#003399;}

dl.ope_list dd span{display:block;}

dl.price_example dt{ clear:both; display:block; float:left; margin:0; padding:0 4px;}
dl.price_example dd{ display:block; padding:4px 0 4px 12px; float:left;}
dl.price_example:after{content:""; display:block; clear:both;}

ul.ex_list img{float:none; display:block;}

dl.price_list dt{width:auto; float:none; padding:2px;}
dl.price_list dd{margin-left:auto; border:none; padding:2px;}
dl.price_list dd span{display:inline;}

dl.price_list02 dt{width:auto;}
dl.price_list02 dd{margin-left:auto;}
}

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


table.prices{width:98%; margin:0 auto; border-bottom:none;}
table.prices th, table.prices td{padding:2px; display:block; float:none;}
table.prices td.yen{border-top:none; padding-top:0;}
table.prices td span, table.option span{display:inline-block;}
table.prices th:before{content:"■";}
table.option caption:before{content:"■";}

table.option{margin-top:30px;}

.about .aboutR{float:none; width:auto;}
.about .aboutR img{max-width:100%;}
.about .aboutL{float:none; width:auto;}

.box ul{margin-left:24px;}

dl.price_example dt{ clear:both; display:block; float:left; margin:0; padding:0 4px;}
dl.price_example dd{ display:block; padding:4px 0 4px 12px; float:left;}
dl.price_example:after{content:""; display:block; clear:both;}
}


@media screen and (max-width:520px) {
dl.price_list div.price_ex dl{display:block; margin:auto;}
dl.price_list div.price_ex dt{background-color:#EEEEEE;}
}

@media screen and (max-width:440px) {
.read h2{font-size:1.1em;}
.read h2 span{display:inline;}
}


@media screen and (max-width:400px) {
div.price_ex span{display:block;}
}

@media screen and (max-width:380px) {
#TitleLine p{font-size:0.75em;}
#TitleLine span{display:block;}
#TitleLine span:after{content:"";}

table.prices th, table.prices td{padding:2px; display:block; float:none;}
table.prices td.yen{border-top:none; padding-top:0;}
}
