/* ===========================================================================
   비급여수가표 (/about/price) 전용 스타일
   기존 수가표 이미지(non-salary.jpg)의 틀을 그대로 옮겼다.
   3열(항목 / 세부내역 / 수가) 한 표, 항목은 rowspan 으로 묶고 배경에 B 워터마크.
   =========================================================================== */

.price {
    padding: 100px 0 120px;
}

.price .inner {
    padding: 0 30px;
}

/* 시안: "비급여" 는 진한 먹, "의료수가표" 는 브랜드 브라운. 좌측 정렬.
   시안 우측의 로고는 이미 사이트 헤더에 있어 중복이라 넣지 않았다. */
.price__title {
    font-size: 44px;
    font-weight: 500;
    letter-spacing: -1.5px;
    color: var(--c-brown);
}

.price__title b {
    font-weight: 700;
    color: #2a2a2a;
}

.price__sheet {
    position: relative;
    margin-top: 44px;
}

/* 배경 B 워터마크. 표를 가리지 않도록 아주 옅게 깔고 클릭도 통과시킨다 */
.price__mark {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 620px;
    height: auto;
    transform: translate(-50%, -50%);
    opacity: 0.06;
    pointer-events: none;
    user-select: none;
}

.price-table {
    position: relative;
    z-index: 1;
    width: 100%;
    border-top: 2px solid #6b5b4d;
    border-bottom: 1px solid #cfcfcf;
    border-collapse: collapse;
    /* 열 너비를 내용이 아니라 colgroup 이 정하게 한다 — 카테고리마다 칸이 밀리지 않도록 */
    table-layout: fixed;
}

.price-table .col-cat {
    width: 305px;
}

.price-table .col-cost {
    width: 260px;
}

/* reset-css 가 th/td 의 정렬·굵기를 전부 지워서 여기서 다시 세운다 */
.price-table th,
.price-table td {
    height: 48px;
    padding: 10px 16px;
    vertical-align: middle;
    text-align: center;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.5;
    color: #3a3a3a;
    word-break: keep-all;
}

.price-table thead th {
    height: 52px;
    border-bottom: 1px solid #d9d9d9;
    font-size: 16px;
    color: var(--c-body);
}

.price-table thead th span {
    font-size: 14px;
}

/* 세로 칸 구분선 — 시안과 같이 항목/세부내역/수가 사이에만 */
.price-table td {
    border-left: 1px solid #ececec;
}

.price-table tbody tr + tr td {
    border-top: 1px solid #ececec;
}

/* 카테고리 묶음 사이는 조금 더 진하게 (tbody 하나 = 카테고리 하나) */
.price-table tbody + tbody {
    border-top: 1px solid #b8b8b8;
}

.price-table__cat {
    font-weight: 700;
    letter-spacing: -0.5px;
    color: #2a2a2a;
}

/* "치당 10" 처럼 기준을 수가 앞에 붙인다 (시안과 동일, 별도 열을 두지 않는다) */
.price-table__std {
    color: #3a3a3a;
}

.price__note {
    margin-top: 24px;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.7;
    color: var(--c-body);
}

/* 관리자 등록 전 폴백 이미지 */
.price__fallback {
    display: block;
    width: 100%;
    height: auto;
    margin-top: 44px;
}

@media (max-width: 900px) {
    .price {
        padding: 60px 0 70px;
    }

    .price .inner {
        padding: 0 20px;
    }

    .price__title {
        font-size: 30px;
    }

    .price__sheet {
        margin-top: 28px;
    }

    .price__mark {
        width: 360px;
    }

    .price-table .col-cat {
        width: 92px;
    }

    .price-table .col-cost {
        width: 96px;
    }

    .price-table th,
    .price-table td {
        height: auto;
        padding: 12px 6px;
        font-size: 14px;
    }

    .price-table thead th {
        height: auto;
        font-size: 13px;
    }

    .price-table__cat {
        font-size: 14px;
    }

    .price__note {
        font-size: 14px;
    }
}
