@charset "utf-8";

/*
    지점 진료 안내 CSS (검색 노출용 시술 소개 글)

    유지보수 기준:
    - 지점 메인 페이지의 의료진 소개 아래 #care 섹션 전용입니다. (2026-10-16 덕천점 먼저 적용)
    - 모든 선택자는 .branchCareGuide 하위로만 작성합니다.
    - 시술별 글은 <details> 로 접혀 있지만 HTML 에 그대로 있어 검색엔진이 읽습니다.

    수정 가능:
    - 섹션 간격, 카드 테두리·배경, 텍스트 크기

    수정 금지:
    - section, h1, .barogInner, #contents 같은 전역 선택자
    - branchCareGuide__* 클래스명
*/

.branchCareGuide {
    margin-top: 80px;
    padding: 0 16px 60px;
    background: var(--mono-ff);
    box-sizing: border-box;
    scroll-margin-top: 120px;
}

.branchCareGuide .branchCareGuide__inner {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
}

.branchCareGuide .branchCareGuide__heading {
    margin-bottom: 24px;
    text-align: left;
}

.branchCareGuide .branchCareGuide__eyebrow {
    margin-bottom: 6px;
    color: var(--mono-2-95);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
}

.branchCareGuide .branchCareGuide__title {
    margin: 0;
}

.branchCareGuide .branchCareGuide__lead {
    margin: 14px 0 0;
    color: var(--mono-1-66);
    font-size: 14px;
    line-height: 1.6;
    word-break: keep-all;
}

.branchCareGuide .branchCareGuide__group {
    border-top: 1px solid var(--mono-4-dd);
}

.branchCareGuide .branchCareGuide__group:last-of-type {
    border-bottom: 1px solid var(--mono-4-dd);
}

.branchCareGuide .branchCareGuide__summary {
    position: relative;
    display: block;
    padding: 18px 36px 18px 0;
    cursor: pointer;
    list-style: none;
    text-align: left;
}

.branchCareGuide .branchCareGuide__summary::-webkit-details-marker {
    display: none;
}

/* 펼침 표시(+ / −) */
.branchCareGuide .branchCareGuide__summary::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 4px;
    transform: translateY(-50%);
    color: var(--point-color-primary);
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
}

.branchCareGuide .branchCareGuide__group[open] .branchCareGuide__summary::after {
    content: "\2212";
}

.branchCareGuide .branchCareGuide__groupTitle {
    margin: 0;
    color: var(--font-color-heading);
    font-size: 17px;
    line-height: 1.4;
    font-weight: 700;
}

.branchCareGuide .branchCareGuide__tags {
    display: block;
    margin-top: 6px;
    color: var(--mono-2-95);
    font-size: 13px;
    line-height: 1.5;
    word-break: keep-all;
}

.branchCareGuide .branchCareGuide__list {
    margin: 0;
    padding: 0 0 20px;
    text-align: left;
}

.branchCareGuide .branchCareGuide__item {
    padding: 16px;
    border-radius: var(--radius-8);
    background: var(--mono-5-f6);
}

.branchCareGuide .branchCareGuide__item + .branchCareGuide__item {
    margin-top: 8px;
}

.branchCareGuide .branchCareGuide__item dt {
    color: var(--font-color-base);
    font-size: 15px;
    line-height: 1.4;
    font-weight: 700;
}

.branchCareGuide .branchCareGuide__item dd {
    margin: 6px 0 0;
    color: var(--mono-1-66);
    font-size: 14px;
    line-height: 1.6;
    word-break: keep-all;
}

/* 시술 바로가기(tab_menu.css .branchTabMenu__item--primary)와 같은 노란 버튼 */
.branchCareGuide .branchCareGuide__more {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 58px;
    margin-top: 24px;
    padding: 0 12px;
    border-radius: var(--radius-12);
    background: var(--point-color-primary);
    color: var(--font-color-base, #000);
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    box-sizing: border-box;
}

@media (max-width: 767px) {
    .branchCareGuide .branchCareGuide__more {
        min-height: 52px;
        padding: 0 10px;
        font-size: 13px;
    }
}