/* ===============================================
   Room Detail Page Styles
   =============================================== */

/* -----------------------------------------------
   Room Detail Overview Section
   ----------------------------------------------- */
.room_detail_overview_section {
    padding: calc(100vw * 120 / 1400) calc(100vw * 100 / 1400);
    background-color: #E6E1DA;
}

.room_detail_overview_inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 120 / 1400);
}

/* -----------------------------------------------
   Shop Title
   ----------------------------------------------- */
.room_detail_shop_title {
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-size: calc(100vw * 24 / 1400);
    color: #bf9443;
    text-align: center;
    letter-spacing: 0.02em;
    line-height: 1.8;
    margin: 0;
}

/* -----------------------------------------------
   Block 1: 大きな画像 + テキスト下
   ----------------------------------------------- */
.room_detail_block_1 {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 64 / 1400);
}

.room_detail_image_large {
    width: 100%;
    height: calc(100vw * 361 / 1400);
    overflow: hidden;
}

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

.room_detail_text_content {
    width: calc(100vw * 800 / 1400);
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 32 / 1400);
}

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

.room_detail_content_description {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
    font-size: calc(100vw * 14 / 1400);
    color: #4c5559;
    letter-spacing: 0.02em;
    line-height: 2;
    margin: 0;
}

/* -----------------------------------------------
   Block 2: 画像右 + テキスト左
   ----------------------------------------------- */
.room_detail_block_2 {
    width: 100%;
    display: flex;
    gap: calc(100vw * 100 / 1400);
    align-items: center;
}

.room_detail_image_medium {
    width: calc(100vw * 720 / 1400);
    height: calc(100vw * 384 / 1400);
    overflow: hidden;
}

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

.room_detail_text_area {
    width: calc(100vw * 380 / 1400);
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 32 / 1400);
}

/* -----------------------------------------------
   Block 3: テキスト左 + 画像右
   ----------------------------------------------- */
.room_detail_block_3 {
    width: 100%;
    display: flex;
    gap: calc(100vw * 100 / 1400);
    align-items: center;
}

.room_detail_text_area_wide {
    width: calc(100vw * 450 / 1400);
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 32 / 1400);
}

.room_detail_image_wide {
    width: calc(100vw * 650 / 1400);
    height: calc(100vw * 424 / 1400);
    overflow: hidden;
}

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

/* -----------------------------------------------
   Block 4: 3つの画像カード
   ----------------------------------------------- */
.room_detail_block_4 {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 40 / 1400);
}

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

.room_detail_features_grid {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

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

.room_detail_feature_image {
    width: calc(100vw * 320 / 1400);
    height: calc(100vw * 320 / 1400);
    overflow: hidden;
}

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

.room_detail_feature_text {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
    font-size: calc(100vw * 14 / 1400);
    color: #4c5559;
    letter-spacing: 0.02em;
    line-height: 2;
    margin: 0;
}

/* -----------------------------------------------
   Decorative Circle
   ----------------------------------------------- */
.room_detail_decorative_circle {
    width: calc(100vw * 100 / 1400);
    height: calc(100vw * 100 / 1400);
    background-color: #bf9443;
    border-radius: 50%;
    margin: 0 auto;
}

/* -----------------------------------------------
   Address Section
   ----------------------------------------------- */
.room_detail_address_section {
    padding: calc(100vw * 120 / 1400) calc(100vw * 100 / 1400);
    background-color: #272e27;
}

.room_detail_address_inner {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

/* -----------------------------------------------
   Left Side: Shop Info + Address Table
   ----------------------------------------------- */
.room_detail_address_left {
    width: calc(100vw * 704 / 1400);
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 83 / 1400);
}

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

.room_detail_address_shop_name {
    font-family: 'Noto Serif JP', serif;
    font-weight: 500;
    font-size: calc(100vw * 18 / 1400);
    color: #bf9443;
    letter-spacing: 0.02em;
    line-height: normal;
    margin: 0;
    padding: calc(100vw * 8 / 1400) calc(100vw * 4 / 1400);
}

.room_detail_address_header_line {
    width: 100%;
    height: 1px;
    background-color: #bf9443;
}

.room_detail_address_en_title {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 500;
    font-size: calc(100vw * 88 / 1400);
    color: #bf9443;
    letter-spacing: 0.02em;
    line-height: normal;
    margin: 0;
}

/* -----------------------------------------------
   Address Table
   ----------------------------------------------- */
.room_detail_address_table {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 15 / 1400);
}

.room_detail_address_divider {
    width: 100%;
    height: 1px;
    background-color: #bf9443;
}

.room_detail_address_row {
    width: calc(100vw * 669 / 1400);
    display: flex;
    gap: calc(100vw * 16 / 1400);
    align-items: center;
}

.room_detail_address_label {
    width: calc(100vw * 160 / 1400);
    font-family: 'Noto Serif JP', serif;
    font-weight: 400;
    font-size: calc(100vw * 18 / 1400);
    color: #bf9443;
    letter-spacing: 0.02em;
    line-height: 2;
    padding-left: calc(100vw * 32 / 1400);
}

.room_detail_address_value {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
    font-size: calc(100vw * 14 / 1400);
    color: #bf9443;
    letter-spacing: 0.02em;
    line-height: 2;
    padding-left: calc(100vw * 32 / 1400);
}

/* -----------------------------------------------
   Right Side: Google Map
   ----------------------------------------------- */
.room_detail_map_container {
    width: calc(100vw * 392 / 1400);
    height: calc(100vw * 492 / 1400);
}

.room_detail_map_placeholder {
    width: 100%;
    height: 100%;
    background-color: #d9d9d9;
    display: flex;
    align-items: center;
    justify-content: center;
}

.room_detail_map_placeholder p {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
    font-size: calc(100vw * 14 / 1400);
    color: #bf9443;
    letter-spacing: 0.02em;
    line-height: 2;
    margin: 0;
}

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

    .room_detail_overview_inner {
        gap: calc(100vw * 80 / 375);
    }

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

    /* Block 1 */
    .room_detail_block_1 {
        gap: calc(100vw * 40 / 375);
    }

    .room_detail_image_large {
        height: calc(100vw * 240 / 375);
    }

    .room_detail_text_content {
        width: 100%;
        gap: calc(100vw * 24 / 375);
    }

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

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

    /* Block 2 */
    .room_detail_block_2 {
        flex-direction: column;
        gap: calc(100vw * 40 / 375);
    }

    .room_detail_image_medium {
        width: 100%;
        height: calc(100vw * 240 / 375);
    }

    .room_detail_text_area {
        width: 100%;
        gap: calc(100vw * 24 / 375);
    }

    /* Block 3 */
    .room_detail_block_3 {
        flex-direction: column-reverse;
        gap: calc(100vw * 40 / 375);
    }

    .room_detail_text_area_wide {
        width: 100%;
        gap: calc(100vw * 24 / 375);
    }

    .room_detail_image_wide {
        width: 100%;
        height: calc(100vw * 240 / 375);
    }

    /* Block 4 */
    .room_detail_block_4 {
        gap: calc(100vw * 32 / 375);
    }

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

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

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

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

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

    /* Decorative Circle */
    .room_detail_decorative_circle {
        width: calc(100vw * 60 / 375);
        height: calc(100vw * 60 / 375);
    }

    /* Address Section */
    .room_detail_address_section {
        padding: calc(100vw * 80 / 375) calc(100vw * 20 / 375);
    }

    .room_detail_address_inner {
        flex-direction: column;
        gap: calc(100vw * 60 / 375);
    }

    .room_detail_address_left {
        width: 100%;
        gap: calc(100vw * 60 / 375);
    }

    .room_detail_address_shop_name {
        font-size: calc(100vw * 16 / 375);
        padding: calc(100vw * 8 / 375) calc(100vw * 4 / 375);
    }

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

    .room_detail_address_table {
        gap: calc(100vw * 12 / 375);
    }

    .room_detail_address_row {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: calc(100vw * 8 / 375);
    }

    .room_detail_address_label {
        width: 100%;
        font-size: calc(100vw * 16 / 375);
        padding-left: calc(100vw * 16 / 375);
    }

    .room_detail_address_value {
        width: 100%;
        font-size: calc(100vw * 12 / 375);
        padding-left: calc(100vw * 16 / 375);
    }

    .room_detail_map_container {
        width: 100%;
        height: calc(100vw * 280 / 375);
    }

    .room_detail_map_placeholder p {
        font-size: calc(100vw * 12 / 375);
    }
}

/* -----------------------------------------------
   Therapist Section (在籍セラピスト)
   ----------------------------------------------- */
.room_detail_therapist_section {
    padding: calc(100vw * 120 / 1400) calc(100vw * 100 / 1400);
    background-color: #E6E1DA;
    padding-top: 0;
}

.room_detail_therapist_inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(100vw * 60 / 1400);
}

.room_detail_therapist_header {
    text-align: center;
}

.room_detail_therapist_header .section_title_en {
    font-family: 'Cormorant Garamond', serif;
    font-size: calc(100vw * 48 / 1400);
    font-weight: 600;
    color: #bf9443;
    letter-spacing: 0.08em;
    margin-bottom: calc(100vw * 16 / 1400);
}

.room_detail_therapist_header .section_title_ja {
    font-family: 'Noto Serif JP', serif;
    font-size: calc(100vw * 14 / 1400);
    font-weight: 500;
    color: #bf9443;
    letter-spacing: 0.1em;
}

.room_detail_therapist_images {
    display: flex;
    justify-content: start;
    gap: calc(100vw * 40 / 1400);
    flex-wrap: wrap;
}

.room_detail_therapist_card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(100vw * 12 / 1400);
}

.room_detail_therapist_image {
    width: calc(100vw * 200 / 1400);
    height: calc(100vw * 300 / 1400);
    overflow: hidden;
}

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

.room_detail_therapist_name {
    font-family: 'Noto Serif JP', serif;
    font-size: calc(100vw * 14 / 1400);
    font-weight: 500;
    color: black;
    letter-spacing: 0.05em;
    text-align: center;
    margin: 0;
}

.room_detail_therapist_btn {
    display: flex;
    align-items: center;
    gap: calc(100vw * 12 / 1400);
    font-family: 'Cormorant Garamond', serif;
    font-size: calc(100vw * 16 / 1400);
    font-weight: 600;
    color: #bf9443;
    text-decoration: none;
    letter-spacing: 0.05em;
    transition: opacity 0.3s ease;
}

.room_detail_therapist_btn:hover {
    opacity: 0.7;
}

.room_detail_therapist_btn svg {
    width: calc(100vw * 26 / 1400);
    height: calc(100vw * 26 / 1400);
}

/* SP対応 */
@media (max-width: 768px) {
    .room_detail_therapist_section {
        padding: calc(100vw * 60 / 375) calc(100vw * 20 / 375);
        padding-top: 0;
    }

    .room_detail_therapist_inner {
        gap: calc(100vw * 40 / 375);
    }

    .room_detail_therapist_header .section_title_en {
        font-size: calc(100vw * 32 / 375);
    }

    .room_detail_therapist_header .section_title_ja {
        font-size: calc(100vw * 12 / 375);
    }

    .room_detail_therapist_images {
        gap: calc(100vw * 16 / 375);
    }

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

    .room_detail_therapist_image {
        width: calc(100vw * 100 / 375);
        height: calc(100vw * 150 / 375);
    }

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

    .room_detail_therapist_btn {
        font-size: calc(100vw * 14 / 375);
        gap: calc(100vw * 8 / 375);
    }

    .room_detail_therapist_btn svg {
        width: calc(100vw * 20 / 375);
        height: calc(100vw * 20 / 375);
    }
}