@charset "utf-8";
/* Platinum Course */

/**
Common Parts
**/
.platinum_course-full-image {
    position: relative;
    display: block;
    width: 100%;
    line-height: 0;
}

.platinum_course-full-image>img {
    display: block;
    width: 100%;
    line-height: 0;
}

.platinum_course-content_inr {
    position: relative;
}

/**
FRAME
**/
.platinum_course-body {
    background: repeating-linear-gradient(-45deg, #fff 0 2px, #f4f4f4 0 4px);
}

.platinum_course-wrap {
    width: 100%;
    max-width: 750px;
    margin: auto;
    background: #fff;
    box-shadow: 0 0 20px 0px #000000;
}

.platinum_course-wrap img {
    display: block;
}

.platinum_course-sec {
    max-width: 750px;
    margin: auto;
}

/**
FV
**/
.platinum_course-fv_top {
    position: relative;
}

.platinum_course-fv_top-main {
    position: relative;
    display: block;
    width: 100%;
    line-height: 0;
}

.platinum_course-fv_top-main>img {
    width: 100%;
}

.platinum_course-fv_top-price {
    position: absolute;
    right: 0;
    bottom: 3%;
    left: 0;
    width: min(698px, 93.06vw);
    margin: auto;
}
.platinum_course-fv_top-price.platinum_course-fv_top-price--c {
    bottom: 5%;
}

.platinum_course-fv_btm {
    position: relative;
}

.platinum_course-fv_btm-main {
    position: relative;
    width: 100%;
}

.platinum_course-fv_btm-dial {
    position: absolute;
    top: 4%;
    right: 9.2%;
    width: min(340px, 45.33vw);
}

.platinum_course-fv_btm-dial.platinum_course-fv_btm-dial--c {
    top: 10%;
}

.platinum_course-fv_btm-btn {
    position: absolute;
    top: 50%;
    right: 2.5%;
    display: block;
    width: min(444px, 59.2vw);
    margin: auto;
    transition: opacity .3s ease-out;
}

.platinum_course-fv_btm-btn.platinum_course-fv_btm-btn--c {
    top: 60%;
}

.platinum_course-fv_btm-btn>img {
    width: 100%;
}

.platinum_course-fv_btm-date {
    position: absolute;
    right: 2.1%;
    bottom: 7%;
    width: min(448px, 59.73vw);
}

.platinum_course-fv_note {
    position: relative;
    width: 100%;
    margin: 8% auto;
}

.platinum_course-fv_note.platinum_course-fv_note--c {
    margin: 0 auto 8%;
}

/**
CARE
**/
.platinum_course-care {
    margin-top: -6%;
}

/**
COURSE
**/
.platinum_course-course {
    position: relative;
    z-index: 10;
}

/**
DIFFERENCE
**/
.platinum_course-difference {
    margin-top: -18%;
}

/**
CV_MID
**/
.platinum_course-cv {
    position: relative;
    z-index: 10;
}

.platinum_course-cv_price {
    position: absolute;
    bottom: 8%;
    left: 0;
    right: 0;
    width: min(641px, 85.46vw);
    margin: auto;
}

.platinum_course-fv_btm-dial.platinum_course-fv_btm-dial--cv_mid {
    top: 3%;
    right: 0;
    left: 0;
    width: min(410px, 54.66vw);
    margin: auto;
}

.platinum_course-cv-arrow {
    width: 100%;
}

.platinum_course-fv_btm-btn.platinum_course-fv_btm-btn--cv_mid {
    top: 40%;
    right: 0;
    left: 0;
    width: min(652px, 90vw);
    margin: auto;
}

.platinum_course-fv_btm-date.platinum_course-fv_btm-date--cv_mid {
    right: 0;
    bottom: 22%;
    left: 0;
    margin: auto;
}

/**
SELECTED
**/
.platinum_course-selected {
    position: relative;
    margin-top: -16%;
    z-index: 5;
}

/**
VOICE
**/
.platinum_course-voice {
    position: relative;
    margin-top: -18%;
}

/**
SALON
**/
.platinum_course-salon {
    padding-bottom: 20%;
}

.salon-area {
    margin-bottom: 6%;
}

ul.lp-salon_list {
    width: min(691px, 92.1vw);
    margin: auto !important;
    padding: 0 !important;
    list-style-type: none !important;
}

.lp-salon_list_district {
    display: block;
    padding-bottom: 0 !important;
    list-style: none;
}

.lp-salon_list_district_name {
    display: block;
    margin: 1em auto;
    padding: 6px 0;
    background-color: rgb(102, 102, 102);
    text-align: center;
    font-size: min(4.5vw, 30px);
    font-weight: normal;
    color: rgb(255, 255, 255);
    letter-spacing: 1px;
    line-height: 1;
}

.lp-salon_list-salons {
    padding: 0 !important;
}

.lp-salon_list-salons_el {
    margin-top: 4%;
    padding: 0 !important;
    list-style: none;
}

.lp-salon_list-salons_el>a {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
}

.lp-salon_list-salons_info {
    width: 80%;
}

.lp-salon_list-salons_name {
    display: block;
    font-size: min(4.8vw, 34px);
    font-weight: bold;
    color: black;
}

.lp-salon_list-salons_name small {
    display: inline-block;
    margin-left: 1em;
    font-size: min(2.8vw, 18px);
}

.lp-salon_list-salons_address {
    display: block;
    padding-top: 2%;
    font-size: min(3.6vw, 26px);
    line-height: 1.3;
    color: #444;
}

.lp-salon_list-salons_img {
    width: min(126px, 16.8vw);
}

.lp-salon_list-salons_img>img {
    display: block;
    width: 100%;
}

/* Color Adjustment */
.lp-salon_list--vip .lp-salon_list_district_name {
    background: #8C5547;
    background: linear-gradient(0deg, #C3A392 0%, #8C5547 100%);
}

.lp-salon_list--vip .lp-salon_list-salons_name {
    color: #691B1E;
}

/**
CV_BTM
**/
.platinum_course-cv_btm {
    position: relative;
    margin-top: -20%;
    z-index: 10;
}

.platinum_course-fv_btm-date.platinum_course-fv_btm-date--cv_btm {
    right: 0;
    bottom: 0%;
    left: 0;
    margin: auto;
}

.platinum_course-fv_btm-date.platinum_course-fv_btm-date--cv_btm--c {
    right: 0;
    bottom: 10%;
    left: 0;
    margin: auto;
}

.platinum_course-cv_price.platinum_course-cv_price--btm {
    bottom: 8%;
}

.platinum_course-cv_price.platinum_course-cv_price--btn {
    top: 38%;
    bottom: unset;
}

.platinum_course-cv_btm-btn {
    position: absolute;
    right: 0;
    bottom: 8%;
    left: 0;
    width: min(728px, 97.06vw);
    margin: auto;
    transition: opacity .3s ease-out;
}

.platinum_course-cv_btm-btn.platinum_course-cv_btm-btn--c {
    bottom: 14%;
}

.platinum_course-cv_btm-btn.platinum_course-cv_btm-btn--gift {
    bottom: 22%;
    width: min(650px, 86.66vw);
}

.platinum_course-cv_btm-btn>img {
    width: 100%;
}

/**
FOOTER
**/
.platinum_course-footer {
    margin-top: 5%;
}

.platinum_course-footer_list {
    display: flex;
    justify-content: center;
    align-items: center;
}

.platinum_course-footer_list li {
    display: block;
    padding: .3em 1em .4em;
}

.platinum_course-footer_list li:last-child {
    border-left: 1px solid #595757;
}

.platinum_course-footer_list li a {
    text-decoration: none;
    color: #595757;
    line-height: 1;
    font-size: min(3.5vw, 20px);
}

.platinum_course-footer_btm {
    margin-top: .5em;
    background: #595757;
    text-align: center;
}

.platinum_course-footer_btm-company {
    padding: 1em 0 1.1em;
    color: #ffffff;
    font-size: min(2.5vw, 12px);
}

@media screen and (min-width: 768px) {
    .lp-salon_list-salons_el>a:hover {
        cursor: pointer;
    }

    .platinum_course-cv_btm-btn:hover,
    .platinum_course-fv_btm-btn:hover {
        cursor: pointer;
        opacity: .8;
    }
}