@charset "UTF-8";
/* ============================================================
   (주)랜컴테크놀로지 — screen-ui.css (단일 CSS)
   포인트 오렌지 #fa4f00, 다크 테크 테마. 1rem=10px, 컨테이너 1200px.
   폰트 사이즈 4단계 고정: 메인타이틀 3.6rem / 서브타이틀 2.4rem / 본문 1.8rem / 부가문구 1.5rem
   반응형 기준: 1200(캔버스) → 960 → 768 → 480px
   ============================================================ */
:root{
  --point:#fa4f00; --point-dark:#d94400; --point-soft:#fff2ec;
  --ink:#161616; --ink-soft:#3d3d3d; --tit:#1b1b1b; --txt:#444; --txt-sub:#777;
  --muted:#808080; --faint:#a8a8a8;
  --line:#e2e5ec; --border-soft:#e4e4e4; --surface:#f5f7fb; --surface-soft:#f7f7f7; --surface-topbar:#f4f4f4; --dark:#1c1f26;
  --container:1200px;
  --shadow-md: 0 4px 12px rgba(0,0,0,0.10), 0 2px 4px rgba(0,0,0,0.06);
  --shadow-lg: 0 12px 28px rgba(0,0,0,0.14), 0 4px 10px rgba(0,0,0,0.07);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{ font-size:62.5%; } /* 1rem = 10px */
body{ font-family:'Noto Sans KR','Noto Sans',sans-serif; font-size:1.8rem; color:var(--txt); line-height:1.6; background:#fff; display:flex; flex-direction:column; min-height:100vh; -webkit-font-smoothing:antialiased; }
img{ max-width:100%; height:auto; vertical-align:middle; }
a{ color:inherit; text-decoration:none; }
li{ list-style:none; }
table{ border-collapse:collapse; }
.blind{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }

/* ── 서브 공통 레이아웃 : 1200px 캔버스, 좌우 패딩 없음 ─────── */
.sub-page{ flex:1 0 auto; }
.sub-section{ padding:1rem 0 7rem; }
.sub-inner{ width:1200px; max-width:100%; margin:0 auto; padding:0; }

/* 페이지 타이틀(대) — 메인타이틀 3.6rem */
.pg-title{ margin-bottom:3.6rem; }
.pg-title h2{ font-size:3.6rem; font-weight:900; color:var(--tit); letter-spacing:-0.02em; }
.pg-title span.bar{ display:block; width:4rem; height:0.3rem; background:var(--point); margin-top:1.6rem; }

/* 섹션 헤드 / 오렌지 pill 배지 — 서브타이틀 2.4rem, 배지는 본문 1.8rem */
.sec-head{ margin:5.5rem 0 2.4rem; }
.sec-head:first-of-type{ margin-top:1rem; }
.badge{ display:inline-block; background:var(--point); color:#fff; font-size:1.8rem; font-weight:700; padding:0.8rem 2.6rem; border-radius:3rem; letter-spacing:-0.01em; }
.sec-tit{ position:relative; padding-left:1.6rem; font-size:2.4rem; font-weight:700; color:var(--tit); }
.sec-tit::before{ content:''; position:absolute; left:0; top:0.5rem; width:0.5rem; height:2.1rem; background:var(--point); }

/* 본문 텍스트 — 1.8rem */
.content-lead{ font-size:1.8rem; line-height:1.95; color:var(--txt); }
.content-lead strong{ color:var(--point); font-weight:700; }
.txt-body{ font-size:1.8rem; line-height:1.9; color:var(--txt); }
.txt-body p + p{ margin-top:1.6rem; }

/* 대시 리스트 — 1.8rem */
.dash-list li{ position:relative; padding-left:1.6rem; font-size:1.8rem; line-height:1.9; color:var(--txt); }
.dash-list li::before{ content:'-'; position:absolute; left:0; color:var(--txt-sub); }

/* 이미지 블록(응용 사진 등) */
.img-block{ margin:2.4rem 0; }
.img-block img{ width:100%; border-radius:0.6rem; }

/* ── 제품 히어로(다크) ─────────────────────────────── */
.prod-hero{ position:relative; background:var(--dark); color:#fff; border-radius:0.8rem; overflow:hidden; padding:5rem 4rem; display:flex; align-items:center; flex-wrap:wrap; }
.prod-hero__body{ flex:1 1 34rem; min-width:0; padding-right:3rem; }
.prod-hero__cat{ font-size:1.8rem; color:rgba(255,255,255,0.7); margin-bottom:1rem; }
.prod-hero__name{ font-size:3.6rem; font-weight:800; letter-spacing:-0.01em; }
.prod-hero__img{ flex:0 1 34rem; text-align:center; }
.prod-hero__img img{ max-height:32rem; width:auto; }

/* ── 사양표(spec) — 부가문구 1.5rem, 모바일 가로 스크롤 ──────── */
.spec-wrap{ overflow-x:auto; }
.spec-table{ width:100%; min-width:72rem; border-top:2px solid var(--ink); font-size:1.5rem; }
.spec-table th, .spec-table td{ padding:1.2rem 1.6rem; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
.spec-table thead th{ background:var(--ink); color:#fff; font-weight:700; text-align:center; border-bottom:none; }
.spec-table tbody th{ background:var(--surface); font-weight:600; color:var(--tit); }
.spec-table td.c{ text-align:center; }

/* 특징 카드 그리드 — 카드 제목은 본문 1.8rem(굵게)로 통일 */
.feat-grid{ display:flex; flex-wrap:wrap; margin:-1rem; }
.feat-grid > *{ flex:1 1 26rem; margin:1rem; }
.feat-card{ border:1px solid var(--line); border-radius:0.8rem; padding:2.8rem 2.4rem; background:#fff; }
.feat-card h4{ font-size:1.8rem; font-weight:700; color:var(--point); margin-bottom:1rem; }
.feat-card p{ font-size:1.8rem; line-height:1.8; color:var(--txt); }

/* 회사연혁 — 연도는 서브타이틀 2.4rem, 본문은 1.8rem */
.hist-row{ display:flex; gap:3rem; padding:1.6rem 0; border-bottom:1px solid var(--line); }
.hist-year{ flex:0 0 8rem; font-size:2.4rem; font-weight:800; color:var(--point); }
.hist-items{ flex:1; }
.hist-items dl{ display:flex; gap:1.6rem; padding:0.4rem 0; }
.hist-items dt{ flex:0 0 9rem; font-weight:700; color:var(--tit); font-size:1.8rem; }
.hist-items dd{ flex:1; color:var(--txt); font-size:1.8rem; }

/* 연락처 — 라벨은 부가문구 1.5rem, 값은 본문 1.8rem */
.contact-map{ border:1px solid var(--line); border-radius:0.8rem; overflow:hidden; margin-bottom:3rem; }
.contact-map iframe{ display:block; width:100%; height:38rem; border:0; }
.contact-info li{ display:flex; align-items:flex-start; gap:1.6rem; padding:1.2rem 0; font-size:1.8rem; }
.contact-info .ci-label{ flex:0 0 6rem; display:inline-flex; align-items:center; justify-content:center; height:3.2rem; background:var(--point); color:#fff; font-size:1.5rem; font-weight:700; border-radius:2rem; }
.contact-info .ci-val{ padding-top:0.3rem; color:var(--txt); line-height:1.7; }

/* ── index(메인) ──────────────────────────────────── */
.main-hero{ position:relative; width:100%; background:#0a0d16; aspect-ratio:1903/660; min-height:30rem; overflow:hidden; }
.main-hero-slides{ position:absolute; top:0; left:0; right:0; bottom:0; }
.hero-slide{ position:absolute; top:0; left:0; right:0; bottom:0; background-image:var(--bg); background-position:center; background-size:cover; background-repeat:no-repeat; opacity:0; transition:opacity 1s ease-in-out; }
.hero-slide.is-active{ opacity:1; }
.hero-nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:5rem; height:5rem; border:0; border-radius:50%; background:rgba(255,255,255,0.15); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .18s; }
.hero-nav:hover{ background:var(--point); }
.hero-nav.prev{ left:2.4rem; } .hero-nav.next{ right:2.4rem; }
.hero-nav svg{ width:2.4rem; height:2.4rem; }
.hero-dots{ position:absolute; left:0; right:0; bottom:2.4rem; z-index:3; display:flex; gap:1rem; justify-content:center; }
.hero-dots button{ width:1.2rem; height:1.2rem; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,0.45); cursor:pointer; transition:all .18s; }
.hero-dots button.is-active{ background:var(--point); transform:scale(1.15); }

.main-sec{ width:1200px; max-width:100%; margin:0 auto; padding:6.5rem 0; }
.main-sec__head{ text-align:center; margin-bottom:4rem; }
.main-sec__head h2{ font-size:2.4rem; font-weight:800; color:var(--tit); }
.main-sec__head p{ margin-top:1.2rem; font-size:1.8rem; color:var(--txt-sub); }
.main-sec__head .accent{ color:var(--point); }

/* 제품 카드(메인) — 카드 제목은 본문 1.8rem(굵게), 설명은 부가문구 1.5rem */
.prod-cards{ display:flex; flex-wrap:wrap; justify-content:center; margin:-1.2rem; }
.prod-cards > a{ flex:0 1 24rem; width:24rem; margin:1.2rem; border:1px solid var(--line); border-radius:1rem; padding:3rem 2.4rem; background:#fff; text-align:center; transition:all .18s; box-sizing:border-box; }
.prod-cards > a:hover{ transform:translateY(-4px); border-color:var(--point); box-shadow:0 1.4rem 3rem rgba(20,30,90,0.1); }
.prod-cards .pc-ic{ width:6rem; height:6rem; margin:0 auto 1.8rem; border-radius:50%; background:var(--point-soft); color:var(--point); display:flex; align-items:center; justify-content:center; }
.prod-cards h3{ font-size:1.8rem; font-weight:700; color:var(--tit); line-height:1.4; }
.prod-cards p{ margin-top:0.8rem; font-size:1.5rem; color:var(--txt-sub); }

/* 코넷(Cornet) 하단 배너 — PC: 원본 통이미지 + 버튼 오버레이 / 모바일: 실제 텍스트 하드코딩 */
.cornet-hero{ background:#000; }
.cornet-hero__link{ display:block; position:relative; width:100%; max-width:1907px; margin:0 auto; }
.cornet-hero__link img{ display:block; width:100%; height:auto; }
.cornet-hero__btn{ display:inline-flex; align-items:center; gap:0.6rem; padding:0.9rem 2.2rem; border:1px solid rgba(255,255,255,0.55); color:#fff; font-size:1.5rem; letter-spacing:0.04em; background:rgba(255,255,255,0.05); transition:all .18s; white-space:nowrap; }
.cornet-hero__btn:hover{ background:var(--point); border-color:var(--point); }
.cornet-hero__btn--pc{ position:absolute; left:45.2%; top:62%; }
.cornet-hero--en .cornet-hero__btn--pc{ top:69%; }

.cornet-hero__mobile{ display:none; }

@media (max-width:960px){
  .cornet-hero__link img.cornet-hero__img--pc, .cornet-hero__btn--pc{ display:none; }
  .cornet-hero__mobile{ display:block; padding:4rem 3rem; background:linear-gradient(135deg,#0a1128,#050814); }
  .cornet-hero__cat{ font-size:1.5rem; color:rgba(255,255,255,0.7); margin-bottom:1rem; }
  .cornet-hero__tit{ font-size:2.4rem; font-weight:800; color:#fff; margin-bottom:1.6rem; }
  .cornet-hero__desc{ font-size:1.8rem; line-height:1.8; color:rgba(255,255,255,0.75); margin-bottom:2rem; }
}
@media (max-width:480px){
  .cornet-hero__mobile{ padding:3rem 2rem; }
}

/* 특징 밴드(다크) — 수치는 서브타이틀 2.4rem, 설명은 본문 1.8rem */
.main-feature{ margin-top:7rem; background:var(--dark); color:#fff; }
.main-feature__inner{ width:1200px; max-width:100%; margin:0 auto; padding:6rem 1.5rem; display:flex; flex-wrap:wrap; }
.main-feature__item{ flex:1 1 22rem; margin:1.5rem; text-align:center; }
.main-feature__item strong{ display:block; font-size:2.4rem; font-weight:800; color:var(--point); margin-bottom:0.8rem; }
.main-feature__item p{ font-size:1.8rem; color:rgba(255,255,255,0.72); line-height:1.7; }

/* ── 게시판(공용, 관리자 연동) — 본문 1.8rem, 부가정보 1.5rem, 모바일 가로 스크롤 ─ */
.board-table{ width:100%; min-width:0; border-top:2px solid var(--point); border-collapse:collapse; font-size:1.8rem; }
.board-table th, .board-table td{ padding:1.3rem 1.4rem; border-bottom:1px solid var(--line); text-align:center; }
.board-table th{ background:var(--surface); font-weight:700; color:var(--tit); }
.board-table td.col-subject{ text-align:left; }
.board-table td.col-subject a:hover{ color:var(--point); }
.board-empty{ padding:8rem 0 !important; text-align:center; color:var(--txt-sub); }
.sub-table-wrap{ overflow-x:auto; }
.board-paging{ margin-top:3rem; text-align:center; }
.board-paging .on{ display:inline-block; min-width:3.4rem; padding:0.6rem; background:var(--point); color:#fff; border-radius:0.4rem; }
.board-view{ border-top:2px solid var(--point); }
.board-view-head{ padding:2.4rem 1rem; border-bottom:1px solid var(--line); }
.board-view-title{ font-size:2.4rem; font-weight:700; color:var(--tit); }
.board-view-meta{ margin-top:1rem; font-size:1.5rem; color:var(--txt-sub); }
.board-view-meta span+span{ margin-left:1.4rem; padding-left:1.4rem; border-left:1px solid var(--line); }
.board-view-content{ padding:3.6rem 1rem; border-bottom:1px solid var(--line); min-height:20rem; font-size:1.8rem; line-height:1.9; }
.board-view-content img{ max-width:100%; height:auto; }
.board-view-empty{ text-align:center; color:var(--txt-sub); font-size:1.8rem; padding:4rem 0; }
.board-view-foot{ margin-top:2.4rem; text-align:right; }
.board-btn{ display:inline-block; background:var(--point); color:#fff; font-size:1.5rem; padding:1rem 2.8rem; border-radius:0.8rem; }

/* ── 반응형 : PC(1200) → 960 → 768 → 480px ─────────────────
   1200px 캔버스 자체는 좌우 거터 없음. 뷰포트가 1200px보다 좁아지는 순간부터
   화면 여백이 필요해지므로 .sub-inner/.main-sec 등 공통 컨테이너에
   좌우 패딩을 되살린다(캔버스가 줄어들며 생기는 음수 마진 bleed 방지). ─── */
@media (max-width:1200px){
  .sub-inner{ padding:0 3rem; }
  .main-sec{ padding:6.5rem 3rem; }
  .main-feature__inner{ padding:6rem 3rem; }
}
@media (max-width:960px){
  .sub-inner{ padding:0 3rem; }
  .main-sec{ padding:5rem 3rem; }
  .main-feature__inner{ padding:5rem 3rem; }
  .pg-title h2{ font-size:2.4rem; }
  .prod-hero{ padding:3.4rem 2.4rem; }
  .prod-hero__name{ font-size:2.4rem; }
  .main-hero{ aspect-ratio:var(--mh-ratio, 1903/660); min-height:0; }
  .hero-slide{ background-image:var(--bg-m); }
  .hero-nav{ width:4.4rem; height:4.4rem; }
  .hero-nav.prev{ left:1.5rem; } .hero-nav.next{ right:1.5rem; }
  .prod-cards .pc-ic{ width:5.2rem; height:5.2rem; }
  .cornet-hero__btn{ padding:0.6rem 1.4rem; }
}
@media (max-width:768px){
  .sub-inner{ padding:0 2rem; }
  .main-sec{ padding:4rem 2rem; }
  .main-feature__inner{ padding:4rem 2rem; }
  .hist-row{ flex-direction:column; gap:0.6rem; }
  .cornet-hero__btn{ padding:0.5rem 1.2rem; letter-spacing:0; }
  /* 게시판 목록: 제목이 길면 한 줄 말줄임(…) 처리 */
  .board-table{ table-layout:fixed; }
  .board-table .col-num{ width:5rem; }
  .board-table .col-date{ width:9rem; }
  .board-table td.col-subject{ max-width:0; }
  .board-table td.col-subject a{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
}
@media (max-width:480px){
  .sub-inner{ padding:0 1.6rem; }
  .main-sec{ padding:3.5rem 1.6rem; }
  .main-feature__inner{ padding:3.5rem 1.6rem; }
  .hero-nav{ width:3.8rem; height:3.8rem; }
  .hero-dots{ bottom:1.6rem; }
  /* 퀵메뉴 카드: 2열 그리드 */
  .prod-cards{ gap:0; }
  .prod-cards > a{ flex:1 1 calc(50% - 2.4rem); width:auto; }
  /* 게시판 목록: 날짜 열 숨기고 번호+제목만 */
  .board-table .col-num{ width:4.5rem; }
  .board-table .col-date, .board-table td.col-date{ display:none; }
  .board-table th, .board-table td{ padding:1rem 0.8rem; }
}

/* ============================================================
   헤더(GNB) — include/gnb-header.php, eng/include/gnb-header.php 공용
   ============================================================ */
#site-header{ position:sticky; top:0; z-index:100; background:#fff; box-shadow:0 1px 0 rgba(0,0,0,0.08); }

.site-topbar{ background:var(--surface-topbar); border-bottom:1px solid var(--border-soft); }
.site-topbar__inner{ max-width:var(--container); margin:0 auto; padding:0 2rem; height:3.4rem; display:flex; align-items:center; justify-content:flex-end; gap:1.8rem; }
.site-topbar a{ font-size:1.5rem; color:var(--muted); text-decoration:none; }
.site-topbar a.site-topbar__en{ font-size:1.5rem; font-weight:700; letter-spacing:0.06em; color:#fff; background:var(--ink-soft); padding:0.5rem 1.2rem; border-radius:0.2rem; }

.site-header__inner{ position:relative; max-width:var(--container); margin:0 auto; padding:0 2rem; height:8.4rem; display:flex; align-items:center; justify-content:center; }

.site-logo{ position:absolute; left:2rem; top:50%; transform:translateY(-50%); display:inline-flex; align-items:center; gap:1rem; text-decoration:none; flex-shrink:0; }
.site-logo img{ height:4.4rem; width:auto; }

.site-lang{ position:absolute; right:2rem; top:50%; transform:translateY(-50%); font-size:1.5rem; font-weight:700; letter-spacing:0.06em; color:#fff; background:var(--point); padding:0.6rem 1.3rem; border-radius:0.3rem; text-decoration:none; transition:background .15s; }
.site-lang:hover{ background:var(--point-dark); }

.site-nav{ display:flex; height:8.4rem; list-style:none; margin:0; padding:0; }
.site-nav__item{ display:flex; align-items:center; }
.site-nav__link{ position:relative; display:flex; align-items:center; height:8.4rem; padding:0 2.6rem; font-weight:500; font-size:1.8rem; color:var(--ink); text-decoration:none; letter-spacing:-0.01em; white-space:nowrap; transition:color .15s; }
.site-nav__link:hover, .site-nav__link.is-active{ font-weight:700; color:var(--point); }
.site-nav__link.is-active::after{ content:''; position:absolute; left:2.6rem; right:2.6rem; bottom:2.6rem; height:2px; background:var(--point); }

/* 뎁스 메뉴(2차) — 헤더 아래 전체 폭 가로 바. position:fixed 로 뷰포트 좌우 끝까지 확장 */
.site-dropdown{ display:none; position:fixed; top:8.4rem; left:0; right:0; background:#fff; box-shadow:var(--shadow-md); border-top:2px solid var(--point); padding:0; white-space:nowrap; z-index:200; }
.site-nav__item:hover .site-dropdown{ display:flex; justify-content:center; align-items:stretch; }
.site-dropdown a{ display:flex; align-items:center; justify-content:center; height:5.6rem; padding:0 3.8rem; font-size:1.5rem; color:var(--ink-soft); text-decoration:none; transition:color .15s, background .15s; }
.site-dropdown a:hover{ color:var(--point); background:var(--surface-soft); }
.site-dropdown a.is-active{ color:var(--point); font-weight:700; }

.site-breadcrumb{ border-bottom:1px solid var(--border-soft); }
.site-breadcrumb__inner{ max-width:var(--container); margin:0 auto; padding:1.4rem 2rem; display:flex; justify-content:flex-end; align-items:center; gap:0.8rem; font-size:1.5rem; color:var(--muted); }
.site-breadcrumb__sep{ color:var(--faint); }
.site-breadcrumb__current{ color:var(--ink-soft); }

.site-hamburger{ display:none; flex-direction:column; justify-content:center; align-items:center; width:4.4rem; height:4.4rem; margin-left:auto; background:none; border:none; cursor:pointer; padding:0.4rem; gap:0.5rem; flex-shrink:0; }
.site-hamburger__bar{ display:block; width:2.4rem; height:2px; background:var(--ink); border-radius:2px; transition:transform .3s var(--ease-out), opacity .2s, width .2s; transform-origin:center; }
.site-hamburger.is-open .site-hamburger__bar:nth-child(1){ transform:translateY(0.7rem) rotate(45deg); }
.site-hamburger.is-open .site-hamburger__bar:nth-child(2){ opacity:0; width:0; }
.site-hamburger.is-open .site-hamburger__bar:nth-child(3){ transform:translateY(-0.7rem) rotate(-45deg); }

.site-nav-overlay{ display:none; position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:90; }
.site-nav-overlay.is-open{ display:block; }

.site-drawer-close{ display:none; position:absolute; top:1.4rem; right:1.6rem; width:3.6rem; height:3.6rem; background:none; border:none; font-size:1.8rem; color:var(--muted); cursor:pointer; line-height:1; z-index:1; }

/* 모바일(≤1200px) — 사이드 드로어 + 아코디언 */
@media (max-width:1200px){
  .site-topbar{ display:none; }
  .site-breadcrumb{ display:none; }
  .site-header__inner{ height:6rem; justify-content:flex-start; }
  .site-logo{ position:static; transform:none; }
  .site-logo img{ height:3.2rem; }
  .site-lang{ right:6.4rem; }
  .site-hamburger{ display:flex; }
  .site-drawer-close{ display:flex; align-items:center; justify-content:center; }

  #siteNav{ position:fixed; top:0; right:0; width:28rem; height:100vh; background:#fff; box-shadow:var(--shadow-lg); z-index:110; overflow-y:auto; transform:translateX(100%); transition:transform .3s var(--ease-out); }
  #siteNav.is-open{ transform:translateX(0); }

  .site-nav{ display:flex; flex-direction:column; height:auto; padding:2rem 0 4rem; margin:0; }
  .site-nav::before{ content:''; display:block; height:6rem; }

  .site-nav__item{ display:block; border-bottom:1px solid var(--border-soft); }
  .site-nav__link{ display:flex; align-items:center; justify-content:space-between; height:auto; padding:1.6rem 2.4rem; font-size:1.8rem; font-weight:600; }
  .site-nav__link::after{ display:none !important; }

  .site-dropdown{ display:block; position:static; transform:none; box-shadow:none; border-top:none; border-left:3px solid var(--point); padding:0.4rem 0; margin:0 2.4rem 0.8rem 2.4rem; background:var(--surface-soft); max-height:0; overflow:hidden; transition:max-height .3s var(--ease-out), padding .2s; }
  .site-nav__item.is-open .site-dropdown{ max-height:40rem; padding:0.8rem 0; }
  .site-nav__item:hover .site-dropdown{ display:block; max-height:0; padding:0; }
  .site-nav__item.is-open:hover .site-dropdown{ max-height:40rem; padding:0.8rem 0; }
  .site-dropdown a{ display:block; height:auto; padding:1rem 2rem; font-size:1.5rem; }
}

/* ============================================================
   서브페이지 상단 공통 — include/tab-menu.php, eng/include/tab-menu.php 공용
   ============================================================ */
.site-subpage{ background:#fff; }
.site-subpage__title{ max-width:var(--container); margin:0 auto; }
.site-subpage__title h1{ text-align:center; font-size:3.6rem; font-weight:800; color:var(--ink); letter-spacing:-0.02em; margin:5.6rem 0 4rem; }
.site-subnav{ border:1px solid var(--border-soft); border-right:none; margin:0 0 0.8rem; display:grid; }
.site-subnav__tab{ display:flex; align-items:center; justify-content:center; text-align:center; height:6.4rem; border-right:1px solid var(--border-soft); font-size:1.8rem; font-weight:500; text-decoration:none; background:#fff; color:var(--muted); transition:all .15s; }
.site-subnav__tab:hover{ color:var(--point); }
.site-subnav__tab.is-active{ font-weight:700; background:var(--point); color:#fff; }
.site-subnav--grid{ border-bottom:none; }
.site-subnav--grid .site-subnav__tab{ border-bottom:1px solid var(--border-soft); }
.site-content{ min-height:20rem; padding-top:4rem; }

@media (max-width:960px){
  .site-subnav{ grid-template-columns:repeat(2,1fr) !important; margin:0 0 0.8rem; }
  .site-subnav__tab{ height:5.2rem; font-size:1.5rem; border-bottom:1px solid var(--border-soft); }
  .site-subpage__title{ padding:0 1.6rem; }
  .site-subpage__title h1{ font-size:2.4rem; margin:3.6rem 0 2.4rem; }
}
@media (max-width:480px){
  .site-subnav{ grid-template-columns:repeat(2,1fr) !important; }
  .site-subpage__title h1{ font-size:2.4rem; }
  .site-content{ padding-top:2.8rem; }
}

/* ============================================================
   푸터 — include/footer.php, eng/include/footer.php 공용
   ============================================================ */
#site-footer{ background:#161616; color:rgba(255,255,255,0.62); margin-top:auto; }
.site-footer__inner{ max-width:var(--container); margin:0 auto; padding:3rem 2rem; display:flex; align-items:flex-start; gap:4rem; }
.site-footer__logo{ filter:grayscale(1) brightness(1.5); opacity:0.55; flex-shrink:0; padding-top:0.4rem; }
.site-footer__logo img{ height:4rem; width:auto; }
.site-footer__info{ font-size:1.5rem; line-height:1.95; color:rgba(255,255,255,0.55); }
.site-footer__company{ color:rgba(255,255,255,0.85); font-weight:700; margin-bottom:0.2rem; }
.site-footer__copy{ margin-top:0.4rem; color:rgba(255,255,255,0.4); }
.site-footer__bottom{ border-top:1px solid rgba(255,255,255,0.08); }
.site-footer__links{ max-width:var(--container); margin:0 auto; padding:1.2rem 2rem; display:flex; gap:2.2rem; font-size:1.5rem; color:rgba(255,255,255,0.4); }
.site-footer__links a{ color:inherit; text-decoration:none; transition:color .15s; }
.site-footer__links a:hover{ color:rgba(255,255,255,0.7); }

@media (max-width:960px){
  .site-footer__inner{ flex-direction:column; gap:1.6rem; padding:2.4rem 2rem; }
  .site-footer__links{ flex-wrap:wrap; gap:1.2rem; }
}
@media (max-width:768px){
  .site-modal__dialog{ margin:2rem auto; max-height:calc(100vh - 4rem); }
  .site-modal__head{ padding:1.6rem 1.8rem; }
  .site-modal__title{ font-size:1.8rem; }
  .site-modal__body{ padding:1.8rem 1.8rem 2.4rem; }
}
@media (max-width:480px){
  .site-footer__inner{ padding:2.4rem 1.8rem; gap:1.4rem; }
  .site-footer__info{ line-height:1.85; word-break:keep-all; }
  .site-footer__copy{ margin-top:0.8rem; }
  .site-footer__links{ flex-wrap:wrap; gap:1rem 1.6rem; padding:1.2rem 1.8rem; }
  .site-footer__logo img{ height:2.6rem; }
}