@charset "utf-8";
#visual{
    margin-bottom: 30px;
}

#read{
    margin-bottom: 40px;
    //text-align: center;
}

#mokuji{
    margin-bottom: 40px;
}

#mokuji h3{
    font-size: 24px;
    padding-top: 15px;
}
#mokuji h4{
    font-size: 18px;
    padding-top: 10px;
}

#mokuji li{
    display: inline-block;
    font-size: 18px;
    padding-right: 0px;
    padding-bottom: 10px;
    //width: 100px;
}

#mokuji li a::before{
    content: "▼";

}

#mokuji li a{

    transition: color 0.3s ease 0s;
}

#mokuji li a:hover{

    color: #ff0000;
}
.dental_list h2{
    font-size: 24px;
    padding-bottom: 5px;
    border-bottom: solid 2px #000;
    margin-bottom: 20px;
}

.dental_list h3{
    font-size: 20px;
    padding-left: 5px;
    border-left: solid 5px #000;
    margin-bottom: 20px;

}

.dental_box {
    border-top: 1px solid;
    border-bottom: 1px solid;
    border-left: 1px solid;
    padding-top: 10px;
}


.dental_box:nth-of-type(4n){
    border-right: 1px solid;
}


.dental_box:last-child{
    border-right: 1px solid;
}

.dental_box .thum{
    height: 260px;
    width: 300px;
    vertical-align: top;
    display: table-cell;
    text-align: center;
}

.dental_box .text{
    margin-top: 10px;
    text-align: center;
}

.dental_box .thum img{
//max-width: 300px;
max-height: 260px;
//width: 100%;
}


.dental_box{
    margin-bottom: 30px;
}

#timer_wrap{
    margin-bottom: 30px;
}

.timer_text{
    text-align: center;
    font-weight: bold;
    font-size: 20px;
}
#timer .yycountdown-box {
    font-weight: bold;
    font-size: 20px;
}

#timer .yycountdown-box .yyc-day::before{
    content: "あと";
    font-size: 20px;
    color: #000;
}

#timer .yycountdown-box .yyc-day {
    font-size: 1.8em;
    color: #009F3D;
}

#timer .yycountdown-box .yyc-hou {
    font-size: 1.8em;
    color: #009F3D;
}

#timer .yycountdown-box .yyc-min {
    font-size: 1.8em;
    color: #009F3D;
}

#timer .yycountdown-box .yyc-sec {
    font-size: 1.8em;
    color: #009F3D;
}

.num{
    font-size: 14px;
}
.name01{
    font-size: 15px;
}
.name01{
        font-weight:bolder;
    }


.name02{
    font-size: 15px;
}
.name02{
        font-weight:bolder;
    }


.dental_title{
    font-size: 14px;
}

@media (max-width: 768px) {
    #mokuji li{
        vertical-align: top;
    }
    .dental_box .thum img{
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }
    .dental_box {
        text-align: center;
    }

    .dental_box:nth-of-type(4n){
        border-right: 1px solid;
    }

    .dental_box:nth-of-type(2n){
        border-right: 1px solid;
    }

    .dental_box .thum{
        text-align: center;
padding-top: 100%;
display: block;
position: relative;
width: auto;
height: auto;
    }

    .timer_text{
        text-align: center;
        font-weight: bold;
        font-size: 16px;
    }
    #timer .yycountdown-box {
        font-weight: bold;
        font-size: 16px;
    }

    #timer .yycountdown-box .yyc-day::before{
        content: "あと";
        font-size: 16px;
        color: #000;
    }

#mokuji{
    margin-bottom: 40px;
    text-align: left;
}

    #mokuji li{
        display: inline-block;
        font-size: 14px;
        padding-right: 0px;
        padding-bottom: 10px;
        width: 23%;

    }
}
.catch_content {
    margin-top: 60px;
}
.catch_content .col3{
    padding:0 10px ;
}

.catch_content .catch_contact{
    border: solid 2px #4adfff;
    padding: 5px;
    margin-top: 20px;
}

@media (max-width: 768px) {
    .catch_content .text.col3{
        padding:0;
        width: 100%;
        max-width: 100%;
        margin-bottom: 30px;
    }
    .catch_content .col3{
        padding:0 5px ;
    }
}

.dental_list_title{
padding: 20px;
font-size: 24px;
background: #231814;
color: #fff;
margin-bottom: 50px;
}

.dental_list_title span{
font-size: 20px;
}

@media (max-width: 768px) {
.dental_list_title{
font-size: 18px;
}

.dental_list_title span{
font-size: 16px;
}

}

#select{
    margin-bottom: 60px;
    padding: 30px 0;
    background: #fdf6f0;
}

#select select{
  padding: 0 20px;
}

#select .container{
    display: flex;
}

#select .container .d01{
    width: 50%;
    text-align: center;
}

#select .container .d02{
    width: 50%;
}

@media (max-width: 768px) {

    #select .container{
        display: block;
    }
    #select .container .d01{
 width: 100%;
text-align: left;
margin-bottom: 5px;
    }

    #select .container .d02{
        width: 100%;
    }

}