@charset "UTF-8";
/* CSS Document */

/* MEMO */
/* エステLPに使用 */

/* コピペ用コード */
.font-size-dummy {
    font-size: .75rem;   /* 12px */
    font-size: .8125rem; /* 13px */
    font-size: .875rem;  /* 14px */
    font-size: 1rem;     /* 16px */
    font-size: 1.25rem;  /* 20px */
    font-size: 1.75rem;  /* 28px */
}

/********** header **********/

/***ham***/

/***ham***/


/********** header **********/
/********** MV **********/

.home__mv--PC{
    margin-top: 70px;
}

/********** MV **********/
/********** achievements **********/

.achievements__container{
    background-color: var(--bg);
    padding: 5rem 0 0 0;
}

.achievements__count__title{
    font-size: 2rem;
    background: linear-gradient(transparent 65%, rgba(193, 39, 45, 0.25) 25%);
    display: inline-block;
    margin-bottom: 30px;
    font-weight: bold;
}

.achievements__box{
    font-size: 1.25rem;
    margin-bottom: 10px;
}

.achievements__num{
    font-size: 4rem;
    color: var(--accent-color);
}

.achievements__period{
    font-size: 1.25rem;
}

/********** achievements **********/

/********** intro **********/

/********** intro **********/
/* worries,effect,features,salon,therapistのタイトル */

/* worries,effect,featuresのタイトル */
/********** worries **********/

/********** worries **********/
/********** effect **********/

/********** effect **********/
/********** features **********/

/********** features **********/
/********** salon **********/

/********** salon **********/
/********** therapist **********/

.therapist__list{
    margin: 0 auto;
}

.therapist__img{
    max-width: 500px;
}

/********** therapist **********/
/********** price **********/

.price__infoBox__fatIndiba{
    display: grid;
    max-width: 610px;
    grid-template-columns: 1fr 0.5fr 0.85fr;
    grid-template-rows: 1fr 0.6fr 0.4fr;
    margin: 0 auto;
    margin-bottom: 20px;
    background-color: var(--bg);
    border-radius: 10px;
    text-align: left;
    padding: 20px 20px;
    box-sizing: border-box;
    align-items:center;
    box-shadow: 0px 2px 4px 0px rgba(34, 34, 34, 0.24);
    grid-column-gap: 20px;
}

.price__infoImage__fatIndiba{
    grid-area: 1 / 1 / 4 / 2;
    align-self:self-start;
}

.price__infoImage__fatIndiba img{
    width: 100%;
}

.price__infoIndiba{
    grid-area: 1 / 2 / 2 / 4;
    align-self: self-start;
    font-size: 1.25rem;
    color: var(--accent-color);
    line-height: 1.2;
}

.price__infoCourse{
    font-size: 1.5rem;
    color: var(--black);
}

.price__infoCourse__desc{
    font-size: 0.875rem;
    color: var(--black);
}

.price__infoTime__fatIndiba{
    grid-area: 2 / 2 / 3 / 3;
    font-size: 1.25rem;
    color: var(--white);
}

.price__infoTime__fatIndibaBox{
    background-color: var(--accent-color);
    padding: 5px 10px;
    display: inline-block;
    border-radius: 6px;
}

.price__infoPrice__fatIndiba{
    grid-area: 2 / 3 / 3 / 4;
    text-align: right;
    font-size: 2.5rem;
}

.price__infoFirstTime__fatIndiba{
    font-size: 0.875rem;
}

.price__infoFirstTimePrice__fatIndiba{
    grid-area: 3 / 1 / 4 / 4;
    text-align: right;
    font-size: 2rem;
    color: var(--accent-color);
}

.price__infoYen{
    font-size: 1.25rem;
}

.price__coupon{
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    box-shadow: 0px 2px 4px 0px rgba(34, 34, 34, 0.24);
    border-radius: 10px;
    margin-bottom: 80px;
}

.price__couponLink img{
    border-radius: 10px;
    width: 100%;
}

.price__menuTime__title{
    font-size: 1.75rem;
    background: linear-gradient(transparent 65%, rgba(193, 39, 45, 0.25) 25%);
    display: inline-block;
    margin-bottom: 30px;
}

.price__menuTime__area{
    width: 100%;
    max-width: 944px;
    display: flex;
    margin: 0 auto;
    justify-content: center;/* medical-estheは変更してcenter */
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.price__menuTime__box{
    max-width: 460px;
    width: 460px;
    background-color: var(--bg);
    border-radius: 10px;
    box-shadow: 0px 2px 4px 0px rgba(34, 34, 34, 0.24);
    padding: 15px;
    text-align: left;
    justify-content: space-between;
    align-items: center;
}

.price__menuTime__heading{
    font-size: 1.25rem;
    color: var(--accent-color);
}

.price__menuTime__desc{
    font-size: 2rem;
    line-height: 1.4;
}

.option__unit{
    font-size: 1.25rem;
}

.price__contact{
    font-size: 1.125rem;
}

.price__contactText{
    padding-bottom: 10px;
}

.price__contactMail{
    text-decoration: underline;
}

/********** price **********/
/********** flow **********/

/********** flow **********/
/********** SNS **********/

/********** SNS **********/
/********** faq **********/
.faq__container{
    background-color: var(--white);
}
/********** faq **********/
/********** info **********/
.info__container{
    background-color: var(--bg);
}
/********** info **********/
/********** footer **********/

.footer__logo{
    font-size: 1.875rem;
    color: var(--white);
}

/********** footer **********/
/********** floatingBtn **********/

/********** floatingBtn **********/

/**********************************タブレット**********************************/

@media screen and (max-width: 1025px) {
    .price__menuTime__area{
        justify-content: center;
    }

    .price__menuTime__box{
    max-width: 610px;
    width: 100%;
    }

    .achievements__container{
    padding-top: 3.75rem;
    }

}

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

}


/**********************************タブレット**********************************/
/**********************************SP**********************************/

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

    .price__infoBox__fatIndiba{
        grid-template-columns: 1fr 0.7fr 1fr;
        grid-column-gap: 10px;
        padding: 10px;
    }

    .price__menuTime__heading{
    font-size: 1rem;
    }

    .price__menuTime__desc{
    font-size: 1.5rem;
    }

    .option__unit{
    font-size: 1.125rem;
    }

    .footer__logo{
        font-size: 1.5rem;
    }
}
@media screen and (max-width: 500px) {

    
        .price__infoIndiba{
            font-size: 1rem;
        }
    
        .price__infoCourse{
            font-size: 1.25rem;
        }
    
        .price__infoTime__fatIndiba{
            align-self: self-end;
            font-size: 1rem;
        }
    
        .price__infoPrice__fatIndiba{
            align-self: self-end;
            font-size: 2rem;
        }

        .price__infoFirstTimePrice__fatIndiba {
            font-size: 1.5rem;
        }
}

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

    .price__infoCourse {
    font-size: 1rem;
    }

    .price__infoPrice__fatIndiba {
    font-size: 1.75rem;
    }

    .price__infoYen {
    font-size: 1rem;
    }

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

    .price__infoCourse__desc{
        display: none;
    }

    .price__menuTime__heading{
    font-size: 0.875rem;
    }

    .price__menuTime__desc{
    font-size: 1.25rem;
    }

        .price__infoPrice__fatIndiba {
        font-size: 1.5rem;
    }

    .option__unit{
    font-size: 1rem;
    }


}


/**********************************SP**********************************/