/* =====================================================================
   시안 C — 밝은 기관형 (greenhouse.or.kr 구조 참조)
   site.css **뒤에** 실려 토큰과 뼈대를 덮는다.

   A·B 와의 구조 차이
     상단 개별 드롭다운(A) / 전체화면 드로어(B) → **한 판짜리 메가 패널**
     배너 슬라이더(A) / 풀블리드 사진 히어로(B) → **글 없는 사진 슬라이더**
     좌측 서브메뉴(A) / 사진 히어로 띠(B)       → **옅은 제목 띠 + 가로 탭**
     카드+그림자(A) / 괘선(B)                   → **둥근 타일 + 넓은 여백**

   글씨: 본문 Pretendard · 제목 Noto Sans KR — 둘 다 SIL Open Font License
   (상업적 사용 무료). 유료 폰트는 쓰지 않는다.
   굵게 쓰지 않고 크게 쓴다(48~54px / weight 500) — 참조 사이트의 인상.

   본문(page-body) 클래스 계약은 A·B 와 같다. 관리자가 고친 본문이 세 시안
   모두에서 성립해야 하므로 마크업은 손대지 않고 여기서 다시 칠하기만 한다.
   ===================================================================== */

:root{
  --brand:#17794A;        /* 딥 그린 — 흰 글씨 5.6:1 */
  --brand-ink:#12603B;
  --brand-soft:#E8F3EC;
  --brand-deep:#0E4B2F;   /* 푸터 바탕 */
  --accent:#BF4A22;       /* 상담 유도 */
  --accent-ink:#9B3A18;
  --accent-soft:#FBEAE2;

  --ink:#2E2E2E; --ink-soft:#4A4A4A; --muted:#6A6A6A;
  --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F5F8F6;
  --line:#E2E7E3; --line-soft:#EEF2EF;

  --foot-text:#E6EFE9; --foot-dim:#BDD1C5;

  --warn:#7E5518; --warn-bg:#FBF2E3;
  --ok:#186B45; --ok-bg:#E4F1EA;

  /* 둥글고 부드럽게 — A(16px)보다 크고 B(0)와는 정반대 */
  --radius:20px; --radius-sm:14px; --radius-xs:10px;
  --shadow-sm:0 1px 2px rgba(20,50,35,.04);
  --shadow:0 6px 22px -12px rgba(20,50,35,.18);
  --shadow-lg:0 14px 40px -18px rgba(20,50,35,.22);

  --maxw:1280px;
  --header-h:92px;

  --font-head:"Noto Sans KR",var(--font);
  --tc-gut:24px;
}

/* --------------------------------------------------- 대안 팔레트 · 로고 금색
   site.css 의 gold 블록(시안 A 용)과 같은 특이도지만 이 파일이 뒤에 실려 이긴다.
   둥근 타일과 부드러운 그림자는 시안 C 의 정체성이라 색만 갈아 끼운다. */
:root[data-palette="gold"]{
  --brand:#8A5A00;        /* 로고 금색 · 흰 글씨 5.95:1 */
  --brand-ink:#6E4700;
  --brand-soft:#F7EFDE;
  --brand-deep:#5A3A00;
  --accent:#17794A;       /* 초록이 강조색으로 자리를 바꾼다 */
  --accent-ink:#12603B;
  --accent-soft:#E8F3EC;

  --ink:#2E2A22; --ink-soft:#4A4438; --muted:#6A6355;
  --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F8F5EE;
  --line:#E7E1D4; --line-soft:#F1EDE3;

  --foot-text:#F2E9D6; --foot-dim:#D4C4A4;

  --radius:20px; --radius-sm:14px; --radius-xs:10px;
  --shadow-sm:0 1px 2px rgba(70,50,10,.05);
  --shadow:0 6px 22px -12px rgba(70,50,10,.20);
  --shadow-lg:0 14px 40px -18px rgba(70,50,10,.24);
}

/* ------------------------------------------------------- 세 번째 팔레트 · 남색
   둥근 타일과 부드러운 그림자는 시안 C 의 정체성이라 색만 갈아 끼운다.
   이 시안은 바탕이 순백이라 남색이 가장 또렷하게 선다. */
:root[data-palette="blue"]{
  --brand:#1C5F8C;        /* 남색 · 흰 글씨 6.85:1 */
  --brand-ink:#154C70;
  --brand-soft:#E6F1F9;
  --brand-deep:#154E73;
  --accent:#A85C16;       /* 따뜻한 앰버 · 흰 글씨 4.99:1 */
  --accent-ink:#8A4A11;
  --accent-soft:#FBF1E4;

  --ink:#24303A; --ink-soft:#44515C; --muted:#64707B;
  --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F3F8FC;
  --line:#DEE7EE; --line-soft:#EDF3F8;

  --foot-text:#E4EFF7; --foot-dim:#C6DAEA;

  --radius:20px; --radius-sm:14px; --radius-xs:10px;
  --shadow-sm:0 1px 2px rgba(15,45,70,.05);
  --shadow:0 6px 22px -12px rgba(15,45,70,.20);
  --shadow-lg:0 14px 40px -18px rgba(15,45,70,.24);
}

.tc{background:var(--bg);color:var(--ink)}
html.tc-locked{overflow:hidden}
.tc h1,.tc h2,.tc h3,.tc .board-title,.tc .page h1{
  font-family:var(--font-head);letter-spacing:-.02em;word-break:keep-all}
/* 이 시안은 "굵게"가 아니라 "크게"로 위계를 만든다 */
.tc h1,.tc h2{font-weight:500}

.tc .site-header,.tc .site-footer{display:none}
.tc .btn{border-radius:999px;font-weight:600}
.tc .btn.lg{padding:15px 32px}

/* ------------------------------------------------------------ 상단 GNB */
.tc-head{position:sticky;top:0;z-index:120;background:#fff;border-bottom:1px solid var(--line);
  transition:box-shadow .2s}
.tc-head.shadow{box-shadow:0 2px 14px -6px rgba(20,50,35,.18)}
.tc-head-in{max-width:var(--maxw);margin:0 auto;padding:0 var(--tc-gut);height:var(--header-h);
  display:flex;align-items:center;gap:28px}
.tc-brand{flex:none;display:flex;align-items:center}
.tc-brand img{display:block;width:172px;height:auto}

.tc-gnb{margin-left:auto;position:static}
.tc-gnb-top{list-style:none;display:flex;gap:6px;margin:0;padding:0}
.tc-gnb-top>li>a{display:block;padding:0 20px;line-height:var(--header-h);
  font-family:var(--font-head);font-size:18px;font-weight:500;color:var(--ink);white-space:nowrap}
.tc-gnb-top>li>a:hover{color:var(--brand)}
.tc-gnb-top>li.on>a{color:var(--brand);font-weight:700}

/* 메가 패널 — 어느 대메뉴에 올려도 여섯 그룹이 한 번에 펼쳐진다 */
.tc-mega{position:absolute;left:0;right:0;top:var(--header-h);background:#fff;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  box-shadow:0 18px 34px -22px rgba(20,50,35,.35);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.16s}
.tc-gnb:hover .tc-mega,.tc-gnb:focus-within .tc-mega{opacity:1;visibility:visible;transform:none}
.tc-mega-in{max-width:var(--maxw);margin:0 auto;padding:30px var(--tc-gut) 34px;
  display:grid;grid-template-columns:repeat(6,1fr);gap:26px}
.tc-mega-col{min-width:0}
.tc-mega-col h2{margin:0 0 12px;padding-bottom:10px;font-size:16.5px;font-weight:700;
  border-bottom:2px solid var(--brand)}
.tc-mega-col h2 a{color:var(--brand-ink)}
.tc-mega-col ul{list-style:none;margin:0;padding:0}
.tc-mega-col li{margin-bottom:2px}
.tc-mega-col ul a{display:block;padding:6px 0;font-size:15px;color:var(--ink-soft);
  overflow-wrap:break-word}
.tc-mega-col ul a:hover{color:var(--brand);text-decoration:underline}
.tc-mega-col ul a.on{color:var(--brand);font-weight:700}
.tc-mega-col ul a.hl{color:var(--accent-ink);font-weight:700}

.tc-burger{display:none;margin-left:auto;width:48px;height:48px;cursor:pointer;
  background:none;border:1px solid var(--line);border-radius:12px;
  flex-direction:column;justify-content:center;align-items:center;gap:4px}
.tc-burger span{display:block;width:20px;height:2px;background:var(--ink)}

/* -------------------------------------------------------------- 본문 틀 */
.tc-main>*{max-width:var(--maxw);margin-left:auto;margin-right:auto;
  padding-left:var(--tc-gut);padding-right:var(--tc-gut)}
.tc-main>.tc-full{max-width:none;padding-left:0;padding-right:0}
.tc-wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--tc-gut)}

.tc-sec-head{text-align:center;margin:0 0 40px}
.tc-sec-head h2{margin:0;font-size:40px;line-height:1.32}
.tc-sec-head p{margin:14px 0 0;font-size:17.5px;line-height:1.8;color:var(--muted)}
.tc-more{display:inline-block;padding:12px 28px;border:1px solid var(--line);border-radius:999px;
  font-size:16px;font-weight:600;color:var(--ink-soft);background:#fff}
.tc-more:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
.tc-more.sm{padding:7px 16px;font-size:14px}

/* --------------------------------------------------------- 사진 슬라이더
   글자를 얹지 않으므로 가림막이 필요 없다 → 사진이 원래 밝기로 보인다. */
.tc-hero{position:relative;background:var(--surface-2);overflow:hidden}
/* site.css 의 .slide-track 에는 aspect-ratio:700/270 (배너 원본 비율)이 걸려 있다.
   높이만 덮으면 폭이 height×700/270 으로 계산돼 화면 밖으로 밀려난다(520 → 1348px).
   반드시 aspect-ratio 를 풀고 폭을 100% 로 못박아야 한다. */
.tc-hero .slide-track{position:relative;aspect-ratio:auto;width:100%;height:min(58vh,520px)}
.tc-hero .slide{position:absolute;inset:0;opacity:0;transition:opacity .7s;pointer-events:none}
.tc-hero .slide.on{opacity:1;pointer-events:auto}
.tc-hero .slide img{width:100%;height:100%;object-fit:cover;display:block}
.tc-hero .slide-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:52px;height:52px;border:none;border-radius:50%;cursor:pointer;font-size:26px;line-height:1;
  background:rgba(255,255,255,.92);color:var(--ink);box-shadow:0 2px 10px rgba(0,0,0,.18)}
.tc-hero .slide-btn:hover{background:#fff}
.tc-hero .slide-prev{left:20px}
.tc-hero .slide-next{right:20px}
.tc-hero .slide-ui{position:absolute;left:0;right:0;bottom:18px;z-index:2;
  display:flex;align-items:center;justify-content:center;gap:12px}
.tc-hero .slide-dots{display:flex;gap:8px}
.tc-hero .slide-dot{width:11px;height:11px;border-radius:50%;border:none;cursor:pointer;padding:0;
  background:rgba(255,255,255,.62);box-shadow:0 1px 3px rgba(0,0,0,.3)}
.tc-hero .slide-dot.on{background:#fff;width:30px;border-radius:999px}
.tc-hero .slide-play{width:26px;height:26px;border:none;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.62);box-shadow:0 1px 3px rgba(0,0,0,.3);position:relative}
.tc-hero .slide-play::before{content:"";position:absolute;inset:0;margin:auto;width:8px;height:9px;
  border-left:3px solid var(--ink);border-right:3px solid var(--ink)}
.tc-hero .slide-play.paused::before{width:0;height:0;border:none;
  border-left:9px solid var(--ink);border-top:5.5px solid transparent;border-bottom:5.5px solid transparent}

/* ---------------------------------------------------------- 바로가기 타일 */
.tc-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
  margin-top:-56px;margin-bottom:0;position:relative;z-index:3}
.tc-q{display:flex;flex-direction:column;gap:9px;padding:26px 24px 24px;background:#fff;
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  transition:transform .16s,box-shadow .16s}
.tc-q:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--brand-soft)}
.tc-q-ic{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  background:var(--brand-soft);color:var(--brand-ink)}
.tc-q-ic svg{width:24px;height:24px}
.tc-q b{font-family:var(--font-head);font-size:19px;font-weight:700;color:var(--ink)}
.tc-q span:not(.tc-q-ic){font-size:14.5px;line-height:1.65;color:var(--muted)}
.tc-q-cta{background:var(--brand);border-color:var(--brand)}
.tc-q-cta .tc-q-ic{background:rgba(255,255,255,.18);color:#fff}
.tc-q-cta b{color:#fff}
.tc-q-cta span:not(.tc-q-ic){color:#E9F3ED}   /* --brand 위에서 4.5:1 을 넘기는 최소 밝기 */
.tc-q-cta:hover{background:var(--brand-deep);border-color:var(--brand-deep)}

/* ------------------------------------------------------------- 선언문 */
/* padding 축약형 금지 — .tc-main>* 가 주는 좌우 여백(--tc-gut)이 지워진다 */
.tc-statement{text-align:center;padding-top:88px;padding-bottom:78px;max-width:900px}
.tc-eyebrow{margin:0 0 18px;font-size:15px;font-weight:700;letter-spacing:.02em;color:var(--brand)}
.tc-statement h1{margin:0;font-size:clamp(28px,4.4vw,48px);line-height:1.42;font-weight:500}
.tc-statement-sub{margin:26px auto 30px;max-width:44em;font-size:17.5px;line-height:1.95;color:var(--ink-soft)}

/* ---------------------------------------------------------- 케어 서비스 */
.tc-care{background:var(--surface-2);padding:80px 0}
.tc-care-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.tc-care-card{display:flex;flex-direction:column;background:#fff;border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .16s,box-shadow .16s}
.tc-care-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.tc-care-ph{display:block;aspect-ratio:4/3;background:var(--brand-soft);overflow:hidden}
.tc-care-ph img{width:100%;height:100%;object-fit:cover;display:block}
.tc-care-tx{display:flex;flex-direction:column;gap:7px;padding:20px 22px 24px}
.tc-care-tx b{font-family:var(--font-head);font-size:19px;font-weight:700;color:var(--ink)}
.tc-care-tx span{font-size:14.5px;line-height:1.7;color:var(--muted)}

/* ------------------------------------------------------------ 행복한 일상 */
.tc-daily{padding-top:84px;padding-bottom:20px}
.tc-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:-18px 0 32px}
.tc-chips a{padding:10px 20px;border:1px solid var(--line);border-radius:999px;
  font-size:15.5px;color:var(--ink-soft);background:#fff}
.tc-chips a:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}
.tc-photo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.tc-pcard{display:flex;flex-direction:column;gap:9px;min-width:0}
.tc-pcard-ph{display:block;aspect-ratio:4/3;border-radius:var(--radius-sm);overflow:hidden;
  background:var(--surface-2)}
.tc-pcard-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.tc-pcard:hover .tc-pcard-ph img{transform:scale(1.05)}
.tc-pcard-noimg{display:grid;place-items:center;width:100%;height:100%;font-size:13px;color:var(--muted)}
.tc-pcard-cat{font-size:13px;font-weight:700;color:var(--brand)}
.tc-pcard-t{font-size:16px;line-height:1.5;color:var(--ink);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tc-daily-more{text-align:center;margin:36px 0 0}

/* -------------------------------------------------------- 공지 · 오시는 길 */
.tc-bottom{background:var(--surface-2);margin-top:80px;padding:74px 0}
.tc-bottom-in{display:grid;grid-template-columns:1.25fr 1fr;gap:44px;align-items:start}
/* grid 아이템 기본값 min-width:auto 때문에, 말줄임(nowrap)인 공지 제목이
   칸의 최소폭을 밀어 올려 320px 에서 페이지가 가로로 삐져나갔다 */
.tc-bottom-in>*{min-width:0}
.tc-bh{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:16px}
.tc-bh h2{margin:0;font-size:26px}
.tc-notice ul{list-style:none;margin:0;padding:0;background:#fff;border-radius:var(--radius);
  padding:8px 24px}
.tc-notice li{border-top:1px solid var(--line-soft)}
.tc-notice li:first-child{border-top:none}
.tc-notice li a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:16px 0;color:var(--ink-soft)}
.tc-notice li a:hover{color:var(--brand)}
.tc-notice .t{min-width:0;font-size:16.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tc-notice .t b{display:inline-block;margin-right:8px;padding:2px 10px;border-radius:999px;
  background:var(--brand-soft);color:var(--brand-ink);font-size:12px;font-weight:700;vertical-align:1px}
.tc-notice .d{flex:none;font-size:14px;color:var(--muted)}
.tc-visit{background:#fff;border-radius:var(--radius);padding:26px 28px}
.tc-visit-addr{margin:0 0 8px;font-size:16.5px;line-height:1.75;color:var(--ink-soft)}
.tc-visit-tel{display:block;font-family:var(--font-head);font-size:30px;font-weight:700;
  color:var(--brand-ink);letter-spacing:-.02em}
.tc-visit-hrs{margin:6px 0 18px;font-size:14.5px;color:var(--muted)}
.tc-visit .btn{width:100%}

/* ------------------------------------------------------------------ 푸터 */
.tc-foot{background:var(--brand-deep);color:var(--foot-text);padding:48px 0 38px}
.tc-foot-in{max-width:var(--maxw);margin:0 auto;padding:0 var(--tc-gut)}
.tc-foot-top{display:flex;align-items:center;gap:28px;flex-wrap:wrap;
  padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.15)}
.tc-foot-logo{width:158px;height:auto;display:block}
.tc-foot-links{display:flex;flex-wrap:wrap;gap:6px 20px;margin-left:auto}
.tc-foot-links a{font-size:14.5px;color:var(--foot-dim)}
.tc-foot-links a:hover{color:#fff}
.tc-foot-links a.strong{color:#fff;font-weight:700}
.tc-foot-bot{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;
  flex-wrap:wrap;margin-top:22px}
.tc-foot-addr{margin:0;font-size:15px;line-height:1.75;color:var(--foot-dim)}
.tc-foot-tel{font-family:var(--font-head);font-size:28px;font-weight:700;color:#fff}
.tc-foot-meta{margin:22px 0 0;font-size:13.5px;line-height:1.9;color:var(--foot-dim)}
.tc-foot-meta a{color:var(--foot-dim);text-decoration:underline}

/* ============================================================ 서브페이지 */
/* 제목 띠 — 단색이면 허전해서 무늬를 깐다.
   로고가 5장 꽃잎 매화라 같은 문양을 오른쪽에 크게 얹고, 전체에는 아주 옅은
   점 격자를 깐다. 이미지 파일 대신 data URI 라 요청이 늘지 않고 어느 폭에서도
   안 깨진다.
   글은 왼쪽에만 놓이므로 무늬가 대비를 건드리지 않는다. 그래도 혹시 글이
   무늬 위로 올라와도 되게 꽃 투명도를 .08 이하로 묶었다
   (그 경우에도 제목 8.8:1, 빵부스러기 4.8:1 이상 — 세 팔레트 모두).

   **무늬·격자·바탕결은 전부 무채색 반투명이다.** 색은 background-color 의
   --brand-soft 하나가 결정한다. 예전에는 이 층들이 초록 hex(#17794A ·
   #F3F9F5→#DFEDE5)로 박혀 있었고, 특히 맨 아래 그라디언트가 불투명이라
   background-color 를 통째로 가렸다 — 그래서 금색·남색을 골라도 이 띠만
   초록으로 남았다. 무채색으로 얹으면 어느 팔레트에서도 저절로 맞는다. */
.tc-phead{
  position:relative;overflow:hidden;
  padding:56px 0 52px;border-bottom:1px solid var(--line);
  background-color:var(--brand-soft);
  background-image:
    /* 큰 매화 — 오른쪽 위 */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23000' fill-opacity='.055'%3E%3Ccircle cx='50' cy='27' r='17'/%3E%3Ccircle cx='72' cy='43' r='17'/%3E%3Ccircle cx='64' cy='69' r='17'/%3E%3Ccircle cx='36' cy='69' r='17'/%3E%3Ccircle cx='28' cy='43' r='17'/%3E%3C/g%3E%3Ccircle cx='50' cy='50' r='10' fill='%23fff' fill-opacity='.5'/%3E%3C/svg%3E"),
    /* 작은 매화 — 아래쪽에 겹쳐 놓는다 */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='%23000' fill-opacity='.04'%3E%3Ccircle cx='50' cy='27' r='17'/%3E%3Ccircle cx='72' cy='43' r='17'/%3E%3Ccircle cx='64' cy='69' r='17'/%3E%3Ccircle cx='36' cy='69' r='17'/%3E%3Ccircle cx='28' cy='43' r='17'/%3E%3C/g%3E%3Ccircle cx='50' cy='50' r='10' fill='%23fff' fill-opacity='.5'/%3E%3C/svg%3E"),
    /* 점 격자 */
    radial-gradient(circle,rgba(0,0,0,.045) 1.1px,transparent 1.2px),
    /* 바탕 결 — 왼쪽 위가 밝고 오른쪽 아래로 갈수록 살짝 짙어진다.
       반드시 반투명이어야 --brand-soft 가 비쳐 나온다 */
    linear-gradient(152deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,.16) 46%,rgba(0,0,0,.03) 100%);
  background-position:right -46px top -64px, right 232px bottom -74px, 0 0, 0 0;
  background-size:288px 288px, 172px 172px, 22px 22px, auto;
  background-repeat:no-repeat, no-repeat, repeat, no-repeat;
}
.tc-phead .tc-wrap{position:relative}
.tc-crumb{font-size:14.5px;color:var(--brand-ink);margin-bottom:10px}
.tc-crumb a{color:var(--brand-ink)}
.tc-crumb a:hover{text-decoration:underline}
.tc-phead h1{margin:0;font-size:clamp(28px,4vw,42px);line-height:1.3;color:var(--ink)}
/* 제목 옆 짧은 선 — 띠가 비어 보이지 않게 잡아 준다 */
.tc-phead h1::after{content:"";display:block;width:52px;height:3px;margin-top:16px;
  border-radius:999px;background:var(--brand)}

@media(max-width:720px){
  /* 좁아지면 큰 꽃이 제목 뒤로 들어온다 — 더 밀어내고 작게 */
  .tc-phead{padding:40px 0 36px;
    background-position:right -76px top -74px, right 96px bottom -66px, 0 0, 0 0;
    background-size:224px 224px, 132px 132px, 20px 20px, auto}
  .tc-phead h1::after{width:42px;margin-top:13px}
}

.tc-subtabs{background:#fff;border-bottom:1px solid var(--line);position:sticky;
  top:var(--header-h);z-index:60}
.tc-subtabs-in{display:flex;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tc-subtabs a{flex:none;padding:17px 20px;font-size:16px;color:var(--ink-soft);
  border-bottom:3px solid transparent;white-space:nowrap}
.tc-subtabs a:hover{color:var(--brand)}
.tc-subtabs a.on{color:var(--brand);font-weight:700;border-bottom-color:var(--brand)}

.tc-article{max-width:1080px;margin:0 auto;padding:52px var(--tc-gut) 92px}

/* ================================================ 본문 컴포넌트 다시 칠하기 */
.tc .page-body{font-size:16.5px}
.tc .svc-hero,.tc .opn-hero,.tc .opn-box,.tc .adm-sec,.tc .call-main,.tc .detail-card,
.tc .svc-items,.tc .opn-intro,.tc .cost-lead,.tc .pt-intro,.tc .call-lead,
.tc .opn-account,.tc .adm-fact,.tc .opn-fact,.tc .adm-check li,.tc .svc .svc-list li,
.tc .opn .opn-ways li,.tc .adm-note,.tc .cost-table,.tc .opn .opn-table,
.tc .mv-statement,.tc .mv-mission,.tc .mv-vision,.tc .org-node,.tc .pt-item,.tc .tl-tx,
.tc .greet-lead,.tc .greet-photo img,.tc .tl-photo img,.tc .dir-map,.tc .call-art img,
.tc .svc-photo img,.tc .opn-photo img{border-radius:var(--radius-sm)}

/* 제목은 큼직하고 가늘게 */
.tc .svc .svc-h,.tc .opn .opn-h,.tc .adm-h,.tc .cost-h,.tc .pol .pol-h2,
.tc .mv-label,.tc .pt-name{font-family:var(--font-head)}
.tc .opn .opn-h,.tc .adm-h{border-bottom-color:var(--line);color:var(--ink);font-weight:700}
.tc .pol .pol-h2{background:var(--brand-soft);border-left:none;border-radius:var(--radius-xs);
  color:var(--brand-ink)}

/* 시설 사진 — 둥근 타일 */
.tc .fac .fac-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.tc .fac .fac-grid .photo{aspect-ratio:4/3;border:none;border-radius:var(--radius-sm);
  box-shadow:var(--shadow-sm)}
.tc .fac .fac-cap{font-family:var(--font-head)}

/* ============================================================ 게시판·폼 */
.tc .crumb{padding-top:30px;font-size:14.5px}
.tc .board-title{font-size:34px;font-weight:500;border-bottom:none;padding-bottom:0;margin-bottom:24px}
.tc .page-layout{display:block}
.tc .side{display:none}
.tc .gtabs a{border-radius:999px}
.tc .gtabs a.on{background:var(--brand);color:#fff;border-color:var(--brand)}
.tc .post-list li a{padding:19px 4px}
.tc .post-title{font-size:17px}
.tc .gcard{border-radius:var(--radius-sm)}
.tc .gthumb{border-radius:var(--radius-sm) var(--radius-sm) 0 0}
.tc .pager a{border-radius:999px}
/* .post 에 max-width:none 금지 — 본문 폭을 잡는 .tc-main>* 를 이겨서 왼쪽에 붙는다 */
.tc .post h1{font-size:31px;font-weight:500}
.tc .contact-form{border-radius:var(--radius)}
.tc .contact-form input,.tc .contact-form select,.tc .contact-form textarea{border-radius:var(--radius-xs)}
.tc .done-box{border-radius:var(--radius)}

/* ============================================================== 반응형 */
@media(max-width:1180px){
  .tc-mega-in{grid-template-columns:repeat(3,1fr);gap:22px 20px}
  .tc-gnb-top>li>a{padding:0 13px;font-size:16.5px}
}
@media(max-width:1024px){
  /* 좁은 화면: 가로 GNB → 접히는 목록 */
  .tc-burger{display:flex}
  .tc-gnb{position:absolute;left:0;right:0;top:var(--header-h);background:#fff;
    border-top:1px solid var(--line);box-shadow:var(--shadow);
    max-height:calc(100vh - var(--header-h));overflow-y:auto;display:none;margin-left:0}
  .tc-gnb.open{display:block}
  .tc-gnb-top{display:none}
  .tc-mega{position:static;opacity:1;visibility:visible;transform:none;
    border:none;box-shadow:none}
  .tc-mega-in{grid-template-columns:1fr;gap:0;padding:8px var(--tc-gut) 24px}
  .tc-mega-col{border-bottom:1px solid var(--line-soft);padding:14px 0}
  .tc-mega-col h2{border-bottom:none;padding-bottom:0;margin-bottom:6px;font-size:17px}
  .tc-mega-col ul{display:flex;flex-wrap:wrap;gap:2px 0}
  .tc-mega-col li+li::before{content:"";display:inline-block;width:1px;height:11px;
    margin:0 11px;background:var(--line);vertical-align:middle}
  .tc-mega-col ul a{display:inline;padding:0}
}
@media(max-width:900px){
  .tc-quick{grid-template-columns:repeat(2,1fr);margin-top:-36px}
  .tc-care-grid{grid-template-columns:repeat(2,1fr)}
  .tc-photo-grid{grid-template-columns:repeat(3,1fr)}
  .tc-bottom-in{grid-template-columns:1fr;gap:34px}
  .tc-sec-head h2{font-size:32px}
}
@media(max-width:640px){
  :root{--tc-gut:18px;--header-h:76px}
  .tc-brand img{width:142px}
  .tc-hero .slide-track{height:min(46vh,340px);aspect-ratio:auto}
  .tc-hero .slide-btn{width:42px;height:42px;font-size:21px}
  .tc-hero .slide-prev{left:10px}
  .tc-hero .slide-next{right:10px}
  .tc-quick{grid-template-columns:1fr;gap:12px;margin-top:20px}
  .tc-q{flex-direction:row;align-items:center;gap:14px;padding:16px 18px;flex-wrap:wrap}
  .tc-q-ic{width:42px;height:42px;flex:none}
  .tc-q b{font-size:17.5px}
  .tc-q span:not(.tc-q-ic){flex:1 0 100%;font-size:14px}
  .tc-statement{padding-top:56px;padding-bottom:48px}
  .tc-care,.tc-bottom{padding:56px 0}
  .tc-daily{padding-top:56px}
  .tc-care-grid,.tc-photo-grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .tc-article{padding:32px var(--tc-gut) 62px}
  .tc .board-title{font-size:26px}
  .tc-foot-links{margin-left:0}
}
@media(max-width:420px){
  .tc-care-grid,.tc-photo-grid{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
  .tc-hero .slide,.tc-q,.tc-care-card,.tc-pcard-ph img,.tc-mega{transition:none}
}