@charset "utf-8";

/* beauty_esthetic_listsここから */
.top_mv_words {
    max-width: 84rem;
    width: 44vw;
}
.beauty_esthetic_lists {
    margin: 8.5rem 0 0rem 0;
}
.beauty_esthetic_lists ul {
    display: flex;
    align-items: center;
    justify-content: space-around;
    max-width: 110rem;
    width: 100%;
    margin: 0 auto;
}
.beauty_esthetic_lists ul li {
    list-style: none;
    text-align: center;
    font-size: 1.8rem;
    width: 100%;
    height: 6rem;
    display: flex;
    align-items: center;
}
.beauty_esthetic_lists ul li:nth-child(2),
.beauty_esthetic_lists ul li:nth-child(3),
.beauty_esthetic_lists ul li:nth-child(4) {
    border-left: 1px solid #707070;
}
.beauty_esthetic_lists ul li a {
    display: block;
    width: 100%;
}
.white_square {
    display: none;
}
/* beauty_esthetic_listsここまで */
/* esthetic_courseここから */
.esthetic_course_overviews {
    position: relative;
    border: 1px solid #ccc;
    padding: 3rem 0 2.8rem 3rem;
    /* padding: 4rem 0 2.8rem 3rem; */
    background-repeat: no-repeat;
    background-position: right bottom;
    margin-bottom: 6rem;
}
.esthetic_course_overviews_comment {
    border: 3px dotted #ccc;
    padding: 3rem 0 2.8rem 3rem;
    /* padding: 4rem 0 2.8rem 3rem; */
    background-repeat: no-repeat;
    background-position: right bottom;
    margin-bottom: 6rem;
}
.esthetic_course_ribbon {
    position: absolute;
    top: -6px;
    left: -6px;
    padding: 0.5rem 6rem 0.5rem 2rem;
    font-size: 2rem;
    color: #fff;
    background: linear-gradient(-45deg, transparent, transparent 25%, #FFA000 0%, #FFA000);
}
.esthetic_course_ribbon::before {
    position: absolute;
    content: "";
    top: 100%;
    left: 0;
    border: 3px solid transparent;
    border-top: 3px solid #F57F17;
    border-right: 3px solid #F57F17;
}
.human_course {
/*    background-image: url(../images/beauty/human_course_BG.png);*/
}
.special_course {
/*    background-image: url(../images/beauty/special_course_BG.png);*/
}
.small_face_course {
/*    background-image: url(../images/beauty/small_face_course_BG.png);*/
}
.sports_esthetic_course {
/*    background-image: url(../images/beauty/Sports_esthetic_course_icon_BG.png);*/
}
.whitening_course {
    background-image: url(../images/beauty/whitening_course_BG.png);
    background-size: contain;
    margin-bottom: 8rem;
}
.esthetic_course_overview {
    display: flex;
    align-items: center;
    /* justify-content: center; */
}

.esthetic_course_introduction {
    display: flex;
    margin-left: 2rem;
}
.course_title {
    font-size: 4rem;
    letter-spacing: 0.3rem;
}
.time_and_price {
    display: flex;
    align-items: center;
}
.normal_price,
.first_price {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

/* .normal_price img,
.normal_price p {
    display: inline-block;
}
.first_price h3,
.first_price p {
    display: inline-block;
} */
/* 2時間の画像 */
.time { 
    height: 3.8rem;
    margin-left: 1.8rem;
}
.yen {
    font-size: 3rem;
    font-weight: bold;
}
/* 左の￥マーク */
.left_yen {
    font-weight: bold;
    margin-left: 1.3rem;
}
.line_through {
    font-size: 3.5rem;
    font-weight: bold;
    text-decoration: line-through;
}
.price_area p {
    display: inline;
}
.price_arrow {
    width: 3.5rem;
    margin-left: 1.1rem;
}
.first_time {
    font-size: 2.2rem;
    margin-left: 0.8rem;
}
.first_times {
    display: flex;
    align-items: center;
}
.discount_price {
    font-size: 4rem;
}
/* black_boxここから */
.black_box_area {
    margin: 2rem 0 1.2rem 0.7rem;                              
}
.black_box {
    color: #fff;
    background-color: #000;
    font-size: 2rem;
    font-weight: bold;
    letter-spacing: 0.2rem;
    display: inline-block;
    height: 3.8rem;
    line-height: 3.8rem;
    padding: 0 1.7rem;
    border-radius: 0.1rem;
}
/* black_boxここまで */
/* gray_boxここから */
.gray_box_area {
    margin: 2rem 0 1.2rem 0.7rem;                              
}
.gray_box {
    color: #fff;
    background-color: #999;
    font-size: 2rem;
    letter-spacing: 0.2rem;
    display: inline-block;
    /* height: 3.8rem; */
    /* line-height: 3.8rem; */
    line-height: 1.2;
    /* padding: 0 1.7rem; */
    padding: 0.5rem 1.7rem;
    border-radius: 0.1rem;
}
/* gray_boxここまで */
/* couse_menuここから */
.couse_menu {
    margin-top: 2.5rem;
    column-count: 2;
    max-width: 82%;
}
.couse_menu li {
    display: flex;
    align-items: center;
    list-style: none;
    font-size: 2rem;
    margin-bottom: 2rem;
    margin-left: 1.2rem;
}
.couse_menu li div {
    background-color: #333333;
    color: #fff;
    font-size: 2.4rem;
    text-align: center;
    width: 3rem;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3rem;
    margin-right: 1.5rem;
}
.couse_menu li p {
    flex: 1;
    font-weight: 500;
}
.small_face_course .couse_menu li:nth-child(8) {
    opacity: 0;
}
/* couse_menuここまで */
/* esthetic_course_detailここから */
.esthetic_course_detail {
    width: 100%;
    max-width: 110rem;
    font-size: 1.8rem;
    line-height: 1.98;
    letter-spacing: 0.04rem;
    padding-left: 1rem;
}
/* esthetic_course_detailここまで */
.esthetic_course_detail_comment {
    width: 90%;
    max-width: 100rem;
    font-size: 1.8rem;
    line-height: 1.98;
    letter-spacing: 0.04rem;
    padding-left: 1rem;
}
/* esthetic_courseここまで */
/* link_buttonここから */
.inquiry_and_reserve {
    max-width: 50rem;
    margin: 0 auto 2rem auto;
}
.inquiry_and_reserve img {
    margin-right: 1rem;
    width: 4rem;
    height: auto;
}
.inquiry_and_reserve p {
    letter-spacing: 0.1rem;
}
.sp_br {
    display: none;
}
.sp_br2 {
    display: none;
}
/* link_buttonここまで */

/* 修正追加分ここから */
.course_introduction_top {
    display: inline-block;
    font-size: 1.3rem;
    letter-spacing: 0.14rem;
    line-height: 1.5;
    margin-bottom: 0.5rem;
}
.beauty_esthetic_lists ul li {
    letter-spacing: 0.16rem;
}
.beauty_esthetic_lists ul {
    margin-bottom: 5.5rem;
}
.facial_Esthe_image {
    margin: 0 auto 6rem auto;
    width: 100%;
    max-width: 120rem;
}
.course_icon {
    padding-left: 0.8rem;
}
.couse_menu_9 {
    margin-top: 0rem;
    column-count: 1;
}
#Small_face_course {
    padding-top: 3rem;
}
.discount_information p {
    font-size: 2.5rem;
    margin-top: -2.8rem;
    letter-spacing: 0.16rem;
    margin-bottom: 6rem;
    text-align: center;
}
#beauty main article {
    padding-bottom: 8rem;
}
.facial_Esthe_image_sp {
    display: none;
}
.br_960_on {
    display: none;
}
/* 修正追加分ここまで */

@media screen and (max-width: 1385px) {
    .human_course,
    .small_face_course,
    .sports_esthetic_course,
    .whitening_course {
        background-size: contain;
    } 
    .esthetic_course_introduction {
        flex-direction: column;
        flex-grow: 1;
    }
    .time {
        margin-left: 0;
    }
    .beauty_esthetic_lists {
        width: 95%;
    }
    .facial_Esthe_image {
        margin: 0 auto 6rem auto;
        width: 100%;
        max-width: 120rem;
        padding-left: 2rem;
        padding-right: 9rem;
    }

}

@media screen and (max-width: 1000px) {
    .time {
        margin-left: 0;
    }
    .couse_menu {
        column-count: 1;
        max-width: 100%;
    }
    .special_course  {
        background-image: none;
    }
    .special_course_bgarea {
/*        background-image: url(../images/beauty/special_course_BG_sp.png);*/
        background-position: right bottom 1.5rem;
        background-repeat: no-repeat;
        background-size: contain;
    }
    .small_face_course {
        background-size: auto;
    }
    .small_face_course .couse_menu {
        max-width: 70%;
    }
    .small_face_course .couse_menu li:nth-child(8) {
        display: none;
    }
    .human_course {
/*        background-image: url(../images/beauty/human_course_BG.png);*/
        padding-bottom: 95rem;
    }
    .sports_esthetic_course {
/*        background-image: url(../images/beauty/Sports_esthetic_course_BG.png);*/
        padding-bottom: 52rem;
    }
    .whitening_course {
    background-image: url(../images/beauty/whitening_course_BG_sp.png);
    background-size: cover;
    }
    .whitening_course {
        background-image: url(../images/beauty/whitening_course_BG_sp.png);
        background-size: cover;
    }

}

@media screen and (max-width: 960px) {
    .wrapper_main {
        padding: 0;
        width: 89%;
    }
    .normal_price,
    .first_price {
        flex-wrap: nowrap;
    }
    .beauty_esthetic_lists ul {
        flex-direction: column;
        flex-wrap: wrap;
        width: 95%;
        margin: 0 auto;
    }
    .beauty_esthetic_lists ul li {
        display: flex;
        font-size: 2.6rem;
        width: 100%;
        height: 12.5rem;
    }
    .beauty_esthetic_lists ul li:nth-child(1),
    .beauty_esthetic_lists ul li:nth-child(2),
    .beauty_esthetic_lists ul li:nth-child(3) {
        border-bottom: 1px solid #707070;
    }
    .beauty_esthetic_lists ul li:nth-child(2) ,
    .beauty_esthetic_lists ul li:nth-child(3) ,
    .beauty_esthetic_lists ul li:nth-child(4) {
        border-left: none;
    }
    .beauty_esthetic_lists ul li a {
        padding: 0 0.5rem;
    }
    .beauty_esthetic_lists {
        position: relative;
        margin: 8.1rem 0 4.7rem 0;
        line-height: 1.42;
        letter-spacing: 0.24rem;
    }
    .white_square {
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        background-color: #fff;
        width: 4.1rem;
        height: 4.7rem;
    }

    .left_yen {
        margin-left: 0.5rem;
    }

    .first_time {
        margin-left: 0.6rem;
    }
    .black_box {
        font-size: 2.6rem;
        height: 5rem;
        line-height: 5rem;
        padding: 0 2.3rem;
    }
    .couse_menu li div {
        font-size: 2.6rem;
        width: 3.5rem;
        height: 3.5rem;
        border-radius: 3rem;
        margin-right: 0.8rem;
    }

    .small_face_course .couse_menu {
        max-width: 100%;
    }
    .small_face_course {
        background-size: 27.5%;
    }
    .small_face_course .esthetic_course_detail {
        width: 70%;        
        margin: 0.9rem 0 0 1.2rem;
    }
    .small_face_course {
        padding: 2.3rem 0 2.7rem 3.6rem;
    }
    .human_course {
        padding: 2.3rem 0 2.7rem 3.6rem;
    }
    .sports_esthetic_course {
        padding: 2.3rem 0 2.7rem 3.6rem;
    }
    .whitening_course {
        margin-bottom: 5rem;
    }
    .inquiry_and_reserve {
        max-width: 100%;
        margin: 0 auto 2rem auto;
    }
    .link {
        width: 100%;
        max-width: 100%;
        height: 8rem;
        border-radius: 5.5rem;
    }
    /* 追加修正ここから */
    /* .esthetic_course_overview {
        height: 16rem;
    } */
    .esthetic_course_introduction {
        margin-left: 2.5rem;
    }
    .esthetic_course_overviews {
        padding: 2.1rem 0 4.5rem 3rem;
    }
    .esthetic_course_ribbon {
        padding: 0.75rem 9rem 0.75rem 3rem;
        font-size: 3rem;
    }
    .course_title {
        font-size: 5.2rem;
        letter-spacing: 0.33rem;
        margin-top: 2.5rem;
    }
    .course_icon {
        margin-top: 1.2rem;
        width: 12.2rem;
        height: 12.3rem;
    }
    .time {
        height: 4.9rem;
        margin-bottom: 1rem;
    }
    .price_arrow {
        width: 3.8rem;
        height: auto;
        padding-top: 0rem;
    }
    .left_yen {
        font-size: 4rem;
    }
    .line_through {
        font-size: 4.5rem;
    }
    .first_time {
        font-size: 3rem;
        margin-left: 0.8rem;
        padding-top: 1rem;
        letter-spacing: -0.3rem;
    }
    .yen {
        font-size: 4rem;
    }
    .discount_price {
        font-size: 5.2rem;
        letter-spacing: -0.1rem;
        padding-bottom: 0.8rem;
    }
    .beauty_esthetic_lists .br_960_none {
        display: none;        
    }
    .beauty_esthetic_lists {
        position: relative;
        margin: 11.4rem auto 4.7rem auto;
        line-height: 1.42;
        letter-spacing: 0.24rem;
    }
    .course_introduction_top {
        font-size: 2.4rem;
        letter-spacing: 0.11rem;
        line-height: 1.5;
        margin-bottom: 1rem;
    }
    .beauty_esthetic_lists ul li {
        font-size: 3.6rem;
        /* height: 18.1rem; */
        letter-spacing: 0.34rem;
    }
    .beauty_esthetic_lists ul {
        margin-bottom: 4rem;
    }
    .facial_Esthe_image {
        display: none;
    }
    .facial_Esthe_image_sp {
        display: block;
        margin: 0 auto 10rem auto;
        width: 94%;

    }
    .black_box_area {
        margin: 2.3rem 0 1.2rem 1.7rem;
    }
    .black_box {
        font-size: 3.4rem;
        height: 6.4rem;
        line-height: 6.4rem;
        padding: 0 3rem;
        letter-spacing: 0.27rem;
    }
    .couse_menu {
        margin-top: 2.4rem;
    }
    .couse_menu li div {
        display: flex;
        align-items: center;
        font-size: 3.6rem;
        width: 4.5rem;
        height: 4.5rem;
        border-radius: 3rem;
        margin-right: 1.3rem;
        padding-bottom: 0.4rem;
    }
    .couse_menu li {
        font-size: 3.8rem;
        padding-left: 0.7rem;
        margin-bottom: 1.7rem;
        line-height: 6rem;
        letter-spacing: -0.13rem;
    }
    .esthetic_course_detail {
        width: 93%;
        margin: 0.7rem 0 0 1rem;
        line-height: 1.64;
        font-size: 3.5rem;
        letter-spacing: -0.1rem;
    }
    .beauty_esthetic_lists ul li:nth-child(1) {
        padding-top: 5.5rem;
        padding-bottom: 9.4rem;
    }
    .beauty_esthetic_lists ul li:nth-child(2) {
        padding-top: 9rem;
        padding-bottom: 9.4rem;
    }
    .beauty_esthetic_lists ul li:nth-child(3) {
        padding-top: 9.7rem;
        padding-bottom: 8.5rem;
    }
    .special_course {
        padding-bottom: 5.1rem;
        margin-bottom: 7.7rem;
    }
    #Small_face_course {
        padding-top: 2.1rem;
        padding-bottom: 5.1rem;
    }
    .br_960_on {
        display: block;
    }
    .human_course .couse_menu_9 {
        background-image: none;
    }
    .sports_esthetic_course .couse_menu_9 {
        background-image: none;
    }
    .couse_menu_9  li {
        align-items: flex-start;
    }
    .couse_menu_9 li div {
        margin-top: 1rem;
    }
/*    .human_course {
        padding-bottom: 95rem;
    }*/
/*    .sports_esthetic_course {
        padding-bottom: 52rem;
    }*/
    .discount_information p {
        font-size: 3.2rem;
        margin-top: -2.8rem;
        letter-spacing: 0.2rem;
        margin-bottom: 10.5rem;
    }
    .inquiry_and_reserve {
        max-width: 97%;
        margin: 0 auto 2rem auto;
    }
    .inquiry_and_reserve .link {
        width: 100%;
        max-width: 100%;
        height: 10rem;
        border-radius: 5.5rem;

    }
    .inquiry_and_reserve .link::before {
        right: 4rem;
        top: 5.5rem;
        width: 4.3rem;
        border-top: solid 0.3rem #fff;
    }
    .inquiry_and_reserve .link::after {
        top: calc(50% - 0.21rem);
        border-top: solid 0.3rem #fff;
        right: 3.9rem;
        width: 1.8rem;
    }
    .inquiry_and_reserve img {
        margin-right: 2rem;
        width: 5.2rem;
        height: auto;
    }
    .inquiry_and_reserve p {
        letter-spacing: -0.1rem;
    }
    #beauty main article {
        padding-bottom: 10.5rem;
    }
    /* 追加修正ここまで */
}
