/* ===============================================
   Therapist Page Styles
   =============================================== */

/* -----------------------------------------------
   Therapist Section
   ----------------------------------------------- */
.therapist_section {
    padding: calc(100vw * 120 / 1400) calc(100vw * 100 / 1400);
    background-color: #E6E1DA;
}

.therapist_section_inner {
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 80 / 1400);
}

/* -----------------------------------------------
   Therapist Row
   ----------------------------------------------- */
.therapist_row {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: calc(100vw * 80 / 1400);
}

/* -----------------------------------------------
   Therapist Card
   ----------------------------------------------- */
.therapist_card {
    width: calc(100vw * 320 / 1400);
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 24 / 1400);
}

.therapist_card_image {
    width: calc(100vw * 320 / 1400);
    height: calc(100vw * 434 / 1400);
    position: relative;
    overflow: hidden;
}

.therapist_card_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.therapist_card_content {
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 8 / 1400);
}

.therapist_card_shop {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
    font-size: calc(100vw * 14 / 1400);
    color: #ffffff;
    background-color: #272e27;
    padding: calc(100vw * 4 / 1400) calc(100vw * 16 / 1400);
    border-radius: calc(100vw * 24 / 1400);
    width: fit-content;
    letter-spacing: 0.02em;
    line-height: 2;
}

.therapist_card_name {
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-size: calc(100vw * 22 / 1400);
    color: #4c5559;
    letter-spacing: 0.02em;
    line-height: 1.8;
    margin: 0;
}

/* -----------------------------------------------
   Responsive - SP
   ----------------------------------------------- */
@media (max-width: 768px) {
    .therapist_section {
        padding: calc(100vw * 80 / 375) calc(100vw * 20 / 375);
    }

    .therapist_section_inner {
        gap: calc(100vw * 60 / 375);
    }

    .therapist_row {
        flex-direction: column;
        gap: calc(100vw * 40 / 375);
        align-items: center;
    }

    .therapist_card {
        width: calc(100vw * 335 / 375);
        gap: calc(100vw * 16 / 375);
    }

    .therapist_card_image {
        width: calc(100vw * 335 / 375);
        height: calc(100vw * 450 / 375);
    }

    .therapist_card_content {
        gap: calc(100vw * 8 / 375);
    }

    .therapist_card_shop {
        font-size: calc(100vw * 12 / 375);
        padding: calc(100vw * 4 / 375) calc(100vw * 12 / 375);
        border-radius: calc(100vw * 20 / 375);
    }

    .therapist_card_name {
        font-size: calc(100vw * 18 / 375);
    }
}