@charset "utf-8";

@font-face {
    font-family: 'Hannari';
    src: url('../font/Hannari.otf');
}

@font-face {
    font-family: 'sawarabi';
    src: url('../font/sawarabi-mincho-medium.ttf');
}

.section_box {
    margin: 0 0 6%;
    width: 100%;
    overflow: hidden;
}

.section_box:last-of-type {
    margin: 0% auto;
}

#menu_contents ul {
    overflow: hidden;
}

#menu_contents .left_box {
    width: 37.5%;
    margin: 0 8% 0 0;
    display: inline-block;
    vertical-align: top;
}

#menu_contents .right_box {
    width: 54%;
    max-width: 650px;
    display: inline-block;
}

#menu_contents h2 {
    border-bottom: 2px solid #462a19;
    font-family: 'Arima Madurai', Arial, sans-serif;
    font-size: 262.5%;
    padding: 0px;
    margin: 0 0 6%;
    line-height: 100%;
}

#menu_contents h2 span {
    font-family: "Hannari", "游明朝", "sawarabi", "Yu Mincho", YuMincho, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
    padding: 0 0 0 5%;
    font-size: 38.09%;
    font-weight: bold;
}

#menu_contents table {
    font-family: "游ゴシック", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
    margin: 0 0 5%;
    font-size: 100%;
    line-height: 180%;
    width: 80%;
}

#menu_contents table.no_th {
    width: 35%;
}

#menu_contents th {
    word-break: keep-all;
    white-space: nowrap;
    padding: 0px 0% 7px 0;
    text-align: left;
    width: 55%;
}

#menu_contents td {
    word-break: keep-all;
    white-space: nowrap;
    padding: 0px 0% 7px 5%;
    text-align: right;
    width: 20%;
}

#menu_contents table.no_th td {
    padding: 0px 5% 3px 0%;
}

#menu_contents table.no_th td:first-child {
    width: 4em;
    padding: 0px 5% 3px 0%;
    font-weight: bold;
    text-align: left;
}

a.campaign_btn {
    display: block;
    max-width: 230px;
    background: #353c3d;
    padding: 0 10px;
    margin: 0;
    float: right;
    color: #fff !important;
    line-height: 50px;
    text-decoration: none !important;
    font-family: "游ゴシック", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
    text-align: center;
    width: 100%;
}

#service_img {
    margin: -13% 0 0;
    position: relative;
    width: 451px;
}

#service_img .ttl_txt {
    font-size: 20px;
    margin: 0 0 3%;
    font-weight: bold;
    font-family: "Hannari", "游明朝", "sawarabi", "Yu Mincho", YuMincho, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
}

#service_img a {
    text-decoration: none;
}

#service_img .txt_box {
    position: absolute;
    top: 80px;
    left: 40px;
    width: 82%;
    color: #5b401c;
}

#service_img .red_txt {
    font-size: 125%;
    font-weight: bold;
    margin: 0 0 3%;
    color: #c62e10;
}

#service_img dl {
    font-size: 0px;
    line-height: 0%;
}

#service_img dt {
    font-size: 16px;
    display: inline-block;
    width: 56%;
    word-break: break-all;
    font-weight: bold;
    line-height: 180%;
}

#service_img dd {
    font-size: 16px;
    display: inline-block;
    width: 44%;
    word-break: break-all;
    text-align: right;
    line-height: 180%;
}

@media screen and (max-width: 980px) {
    #menu_contents h2 span {
        display: block;
        padding: 0 0 5px 0%;


    }
}

@media screen and (max-width: 860px) {
    .section_box {
        margin: 0 auto 10%;
        width: 90%;
        overflow: hidden;
    }

    #menu_contents h2 {
        text-align: center;
        margin: 0 0 6%;
        line-height: 100%;
    }

    #menu_contents h2 span {
        display: inline-block;
        padding: 0 0 5px 5%;
        word-break: keep-all;
        white-space: nowrap;
    }

    #menu_contents .left_box {
        width: 100%;
        margin: 0 0% 0 0;
        display: block;
        overflow: hidden;
    }

    #menu_contents .right_box {
        width: 100%;
        margin: 3% auto 0;
        max-width: 650px;
        display: block;
    }

    #menu_contents table {
        margin: 0 auto 5%;
        font-size: 100%;
        line-height: 180%;
        width: 90%;
    }

    #menu_contents table.no_th {
        width: 40%;
    }

    #menu_contents th {
        word-break: keep-all;
        white-space: nowrap;
        padding: 0px 0% 7px 0;
        text-align: left;
        width: 50%;
    }

    #menu_contents td {
        word-break: keep-all;
        white-space: nowrap;
        padding: 0px 0% 7px 5%;
        text-align: right;
        width: 22.5%;
    }

    a.campaign_btn {
        margin: 0 auto;
        float: none;
        width: 100%;
    }

    #service_img {
        margin: 0 auto;
        position: relative;
        max-width: 451px;
        width: 100%;
    }

}

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

    #service_img .ttl_txt {
        font-size: 20px;
        margin: 0 0 3%;
    }

    #service_img .txt_box {
        top: 22%;
        left: 5%;
        width: 88%;
    }

    #service_img .red_txt {
        font-size: 112.5%;
        font-weight: bold;
        margin: 0 0 1%;
        color: #c62e10;
    }

    #service_img dt {
        font-size: 15px;
        width: 55%;
        line-height: 180%;
    }

    #service_img dd {
        font-size: 15px;
        width: 45%;
        line-height: 180%;
    }
}

@media screen and (max-width: 414px) {
    #menu_contents table {
        font-size: 87.5%;
        width: 100%;
    }

    #service_img .txt_box {
        top: 20%;
        left: 5%;
        width: 86%;
    }

    #service_img .ttl_txt {
        font-size: 18px;
        margin: 0 0 1%;
    }

    #service_img .red_txt {
        font-size: 100%;
        margin: 0 0 1%;
    }

    #service_img dt {
        font-size: 13px;
        width: 55%;
    }

    #service_img dd {
        font-size: 13px;
        width: 45%;
    }

}

@media screen and (max-width: 360px) {
    #service_img .ttl_txt {
        font-size: 18px;
        margin: 0 0 2%;
    }

    #service_img .txt_box {
        top: 19%;
        left: 5%;
    }

    #service_img .red_txt {
        font-size: 93.75%;
        margin: 0 0 1%;
        line-height: 160%;
    }

    #service_img dt {
        font-size: 13px;
        line-height: 160%;
    }

    #service_img dd {
        font-size: 13px;
        line-height: 160%;

    }
}

@media screen and (max-width: 320px) {
    #service_img .ttl_txt {
        font-size: 16px;
        margin: 0 0 1%;
    }

    #service_img .txt_box {
        top: 19%;
        left: 5%;
    }

    #service_img .red_txt {
        font-size: 82.5%;
        margin: 0 0 1%;
        line-height: 160%;
    }

    #service_img dt {
        font-size: 11px;
        letter-spacing: -1px;
        line-height: 140%;
    }

    #service_img dd {
        font-size: 11px;
        line-height: 140%;

    }
}

/*後から付け足した CSS  */
#facial_menu .eyelash-caption {
    text-align: left;
    font-weight: bold;
}

.three-d tr td {
    text-align: left;
}

.uesoroe {
    vertical-align: top;
    ;
}

.eyelash #service_img {
    margin-top: 0px;
}

caption {
    caption-side: bottom;
    font-size: 0.8rem;
}

@media screen and (max-width: 480px) {
    .section_box .left_box .el-table {
        margin-bottom: 1000px
    }
}