@charset "UTF-8";

*{
  font-size:20px;
  font-family: 'Noto Sans Japanese',   sans-serif;
  font-weight: 500;
  line-height: 1.75;
  box-sizing: border-box;
}

body{
  margin:0px;
  padding:0px;
  min-width:1000px;
}

img{
  max-width:100%;
  height:auto;
  display:block;
}

a img:hover{
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
}
article{
    width: 100%;
}

h1{
    margin: 0px;
}
h2{
    margin: 0px;
}
h3{
    margin: 0px;
}

p{
    margin: 0 0 20px 0;
    font-size: 15px;
    font-weight: normal;
}


.bold{
    font-weight: bold;
}
.underline{
    text-decoration: underline;
}
.text-center{
    text-align: center;
}
.sp-box{
  display: none;
}

.main img{
    margin:0 auto;
}

.contact{
    width: 864px;
    margin: 25px auto;
    position: relative;
}

.contact a{
    position: absolute;
    bottom: 10px;
    right: 18px;
}

.content{
    width: 954px;
    margin: 0 auto;
    border: solid 1px #ccc;
}

.about{
    border-top: solid 10px #0599cd;
    padding: 10px 50px 0;
}

.about .double{
    margin: 25px auto;
    overflow: hidden;
}

.about .left{
    float: left;
    width:30%;
}

.about  .right{
    float: right;
    width:68%;
}

.enjoy{
    position: relative;
    margin: 90px 0 30px 0;
}

.enjoy-title{
    padding: 20px;
}

.enjoy-explain{
    padding: 20px 330px 20px 30px;
    color: #FFF;
}

.enjoy-title-back{
    background-color:#fff100;
}

.enjoy-explain-back{
    background-color:#0599cc;
}

.enjoy-human{
    position: absolute;
    right: -30px;
    bottom: 0;
}

.machine{
    width: 859px;
    margin: 0 auto;
}

.machinebox img{
    margin: 20px auto;
}

.machinebox h2{
    text-align: center;
    color: #0599cc;
    font-size: 36px;
    margin: 30px auto;
}

.doctor-explain{

}

.float-box {
    overflow: hidden;
}

.float-box .left{
    float: left;
    width:30%;
}

.float-box .right{
    float: right;
    width: 66%;
}

.float-box .right table{
    margin-bottom: 20px;
}

.float-box .right table tr{

}

.float-box .right table th,
.float-box .right table td{
    font-size: 15px;
    padding: 10px 0;
    font-weight: normal;
    border-top: dashed 1px #0599cd;
}

.float-box .right table tr:last-child th,
.float-box .right table tr:last-child td{
    border-bottom: dashed 1px #0599cd;
}

.float-box .right table th{
    width: 25%;
    
}

.float-box .right table td{

}

.float-box .right span{
    color: #784d9e;
    font-size: 16px;
    display: block;
    text-align: left;
    margin-left: 10px;
}

.float-box .right ul{
    margin:0 0 20px;
    padding: 0 35px;
}

.float-box .right  ul li{
    font-weight: normal;
    font-size:15px;
}

.beforeafter{

}

.beforeafter img{
    margin: 35px auto;
}

.care{
    padding: 0px 40px;
}

.care img{

}

.care p{
    margin: 20px 0;
}

.care p.orange-text{
    color:#fe9569;
}

.quetion{
    background: #0599cc;
    color: #FFF;
    margin: 40px 0px;
}

.quetion h2{
    text-align: center;
    font-size: 62px;
    margin-bottom: 25px;
    border-bottom: solid 1px #FFF;
}

.quetion table{
    display: block;
    padding: 0px 45px 25px 45px;
}

.quetion table tr{

}

.quetion table th{

}

.quetion table td{
    padding: 0 0 0 10px;
    font-size: 15px;
}

.quetion table tr:nth-of-type(even) td{
    color: #fff898;   
}

.plus{
    padding: 0 40px;
}

.plus img{
    margin: 20px 0;
}

.exsample{
    list-style: none;
    padding: 0;
    overflow: hidden;
    margin: 0;
}

.exsample li{
    float: left;
    width:48%;
}

.exsample li:nth-of-type(odd){
    margin-right:4%;
}

.exsample li img{

}

.doctor{
    background-color: #d1e0e8;
    position: relative;
    margin: 55px 0 20px;
    padding: 179px 40px 40px;
}

.doctor-intro{
    border: solid 1px #ccc;
    background-color: #FFF;
}

.doctor-intro h2{
    background-image: url(img/doctor-intro-titleback.png);
    padding: 10px;
    border: solid 1px #ccc;
    margin-bottom: 20px;
}

.doctor-intro h2 img{
    margin:0 auto;
}

.doctor-intro p{
    padding: 0px 20px;
    font-weight: normal;
}

.doctor-title{
    top: -35px;
    position: absolute;
    left: 0;
}

/*----------------------------------レスポンシブ----------------------------------*/
@media screen and (max-width: 500px) {
    .pc-box{
      display: none;
    }
    *{
      font-size: 15px;
      line-height: 1.5;
    }
    body {
        margin: 0px;
        padding: 0px;
        min-width: 100%;
    }

    .contact{
        width:100%;
    }

    .content{
        width:100%;
    }

    .machine{
        width:100%;
    }

    .enjoy-human{
        right:0;
    }

    .main{
        padding: 80px 10px 0;
    }

    .contact{
        padding:0 10px;
    }

    .contact a {
        position: relative;
        bottom: 0px;
        right: 0px;
        display: block;
        margin: 0 auto;
        padding:0 10px;
    }

    .contact a img{
        margin: 15px auto;
    }

    .about{
        padding: 10px 10px 0;
    }

    .about .left {
        float: none;
        width: 100%;
    }

    .about .right {
        float: none;
        width: 100%;
    }

    .enjoy {
        position: relative;
        margin: 30px 0 30px 0;
    }

    .enjoy-title {
        padding: 10px;
    }

    .enjoy-explain {
        padding: 10px;
        color: #FFF;
    }

    .enjoy-human{
        display: none;
    }

    .machine{
        padding:10px;
    }

    .machinebox h2{
        font-size: 20px;
    }

    .doctor {
        margin: 55px 0 20px;
        padding: 55px 10px 10px;
    }

    .float-box .left {
        float: none;
        width: 70%;
        margin: 0 auto 20px auto;
    }

    .float-box .right {
        float: none;
        width: 100%;
    }

    .beforeafter{
        padding:10px;
    }

    .beforeafter img {
        margin: 0px auto;
    }

    .care {
        padding: 0px 10px;
    }

    .quetion h2 {
        font-size: 20px;
        padding: 10px;
    }

    .quetion table {
        display: block;
        padding: 0px 10px 25px 10px;
    }

    .quetion table th {
        width: 50px;
        vertical-align: top;
    }

    .quetion table th,
    .quetion table td{
        font-size:12px;
    }

    .plus {
        padding: 0 10px;
    }

    .plus img:nth-of-type(3){
        width: 120px;
    }

    .exsample li,
    .exsample li:nth-of-type(odd) {
        float: none;
        width: 100%;
        margin: 0 0 0 0;
    }

    .float-box .right table th{
        width:30%;
    }

}