@charset "utf-8";
/* biz_05 (MONO) 테마 · 일반페이지(page.php) 전용 스타일
   구역 종류는 page.section.php 참고 — lead / text / media / imggrid /
   steps / years / stats / table / map / cta / note                     */

.b05-page{padding-bottom:20px}

/* ── 구역 공통 ────────────────────────────────────── */
.pg-sec{padding:64px 0;border-bottom:2px solid var(--ink)}
.pg-sec:first-child{padding-top:20px}
.pg-sec:last-child{border-bottom:0;padding-bottom:20px}

/* 검정 칩 라벨 */
.pg-chip{display:inline-block;background:var(--ink);color:var(--yellow);font-family:var(--latin);
  font-size:11px;letter-spacing:.16em;padding:6px 12px;margin-bottom:20px}

/* 제목 */
.pg-h{font-size:clamp(26px,3.6vw,42px);font-weight:900;line-height:1.25;letter-spacing:-.02em;margin-bottom:26px}
.pg-h::after{content:"";display:block;width:56px;height:4px;background:var(--yellow);margin-top:16px}

/* 본문 글 */
.pg-text{font-size:16px;line-height:2;color:var(--graphite);max-width:860px}
.pg-text p{margin-bottom:20px}
.pg-text p:last-child{margin-bottom:0}
.pg-text strong{color:var(--ink);font-weight:900}
.pg-text em{font-style:normal;background:var(--yellow);color:var(--ink);padding:0 5px;font-weight:700}
.pg-text a{border-bottom:2px solid var(--yellow);color:var(--ink)}

/* ── lead : 초대형 타이포 인트로 ──────────────────── */
.pg-lead{padding-top:8px}
.pg-xt{font-family:var(--latin);font-size:clamp(36px,6.5vw,82px);line-height:1.06;letter-spacing:-.01em}
.pg-xt em{font-style:normal;color:transparent;-webkit-text-stroke:2px var(--ink);position:relative;z-index:0}
.pg-xt em::after{content:"";position:absolute;left:0;right:0;bottom:6%;height:34%;background:var(--yellow);z-index:-1}
.pg-xt .kr{display:block;font-family:var(--sans);font-size:clamp(22px,3.4vw,40px);font-weight:900;letter-spacing:-.02em;margin-top:12px}
.pg-leadtxt{margin-top:30px;max-width:720px;font-size:17px;line-height:1.95;color:var(--graphite)}

/* ── media : 이미지 + 글 (어긋난 2단) ─────────────── */
.pg-media{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.pg-media.rev .md-img{order:2}
.pg-media .md-img{position:relative;aspect-ratio:4/3;border:3px solid var(--ink);background:#f1f1f1;
  display:flex;align-items:center;justify-content:center;margin-top:-14px}
.pg-media.rev .md-img{margin-top:56px}
.pg-media .md-img i{font-family:var(--latin);font-size:34px;color:#d5d5d5;font-style:normal}
.pg-media .md-body{padding-top:22px}
.pg-media.rev .md-body{order:1}
.md-points{margin-top:26px;border-top:2px solid var(--ink)}
.md-points li{position:relative;padding:16px 0 16px 34px;border-bottom:1px solid var(--line-soft);
  font-size:15px;line-height:1.75;color:var(--ink)}
.md-points li::before{content:"";position:absolute;left:0;top:24px;width:16px;height:4px;background:var(--yellow)}

/* ── imggrid : 이미지 격자 ────────────────────────── */
.pg-imggrid{display:grid;gap:26px}
.pg-imggrid.cols2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pg-imggrid.cols3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pg-imggrid.cols4{grid-template-columns:repeat(4,minmax(0,1fr))}
.pg-imggrid figure{margin:0}
.pg-imggrid .im{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;
  border:2px solid var(--ink);background:#f1f1f1;transition:box-shadow .2s,transform .2s}
.pg-imggrid figure:hover .im{transform:translate(-4px,-4px);box-shadow:6px 6px 0 var(--yellow)}
.pg-imggrid .im i{font-family:var(--latin);font-size:22px;color:#d5d5d5;font-style:normal}
.pg-imggrid figcaption{margin-top:12px}
.pg-imggrid figcaption strong{display:block;font-size:16px;font-weight:900;line-height:1.4}
.pg-imggrid figcaption span{display:block;margin-top:5px;font-size:13px;color:var(--graphite)}

/* ── steps : 진행 순서 ────────────────────────────── */
.pg-steps{border-top:2px solid var(--ink)}
.pg-steps li{display:grid;grid-template-columns:110px minmax(0,1fr);gap:24px;align-items:start;
  padding:28px 12px;border-bottom:2px solid var(--ink);transition:background .18s}
.pg-steps li:hover{background:var(--yellow)}
.pg-steps .no{font-family:var(--latin);font-size:34px;line-height:1;color:#ccc}
.pg-steps li:hover .no{color:var(--ink)}
.pg-steps h4{font-size:19px;font-weight:900;margin-bottom:8px}
.pg-steps p{font-size:15px;line-height:1.85;color:var(--graphite)}
.pg-steps li:hover p{color:var(--ink)}

/* ── years : 연혁 (연도 대형 타이포) ──────────────── */
.pg-years{border-top:3px solid var(--ink)}
.pg-years .yr{display:grid;grid-template-columns:minmax(180px,260px) minmax(0,1fr);gap:30px;
  padding:34px 12px;border-bottom:2px solid var(--ink)}
.pg-years .y{font-family:var(--latin);font-size:clamp(38px,5.5vw,68px);line-height:.95;letter-spacing:-.02em}
.pg-years .yr:hover .y{color:transparent;-webkit-text-stroke:2px var(--ink)}
.pg-years ul{padding-top:10px}
.pg-years li{position:relative;padding:9px 0 9px 30px;font-size:15px;line-height:1.75;color:var(--graphite)}
.pg-years li::before{content:"";position:absolute;left:0;top:19px;width:14px;height:3px;background:var(--yellow)}
.pg-years li strong{color:var(--ink);font-weight:900}

/* ── stats : 숫자 지표 ────────────────────────────── */
.pg-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.pg-stats .st{padding:34px 20px;border-left:2px solid var(--ink)}
.pg-stats .st:first-child{border-left:0}
.pg-stats strong{display:block;font-family:var(--latin);font-size:clamp(30px,4vw,48px);line-height:1}
.pg-stats strong em{font-style:normal;font-size:17px;color:var(--yellow);-webkit-text-stroke:1px var(--ink);margin-left:4px}
.pg-stats .st span{display:block;margin-top:10px;font-size:13px;color:var(--graphite)}

/* ── table : 표 ───────────────────────────────────── */
.pg-tblwrap{overflow-x:auto}
.pg-tbl{width:100%;min-width:520px;border-collapse:collapse;border-top:3px solid var(--ink)}
.pg-tbl th{background:var(--ink);color:var(--yellow);font-family:var(--latin);font-size:12px;
  letter-spacing:.1em;padding:14px 16px;text-align:left;white-space:nowrap}
.pg-tbl td{border-bottom:1px solid var(--line-soft);padding:15px 16px;font-size:15px;color:var(--graphite)}
.pg-tbl tr:hover td{background:#FFFBE0;color:var(--ink)}
.pg-tbl td:first-child{font-weight:900;color:var(--ink)}

/* ── map : 오시는 길 ──────────────────────────────── */
.pg-map{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:34px;align-items:stretch}
.pg-map .mp{border:3px solid var(--ink);min-height:360px;overflow:hidden;background:#f1f1f1}
.pg-map .mp iframe,.pg-map .mp img{width:100%;height:100%;min-height:360px;border:0;display:block}
.pg-map .mp-ph{height:100%;min-height:360px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:14px;text-align:center;
  background:repeating-linear-gradient(45deg,#f4f4f4 0 16px,#fff 16px 32px)}
.pg-map .mp-ph i{font-family:var(--latin);font-size:38px;color:#ccc;font-style:normal}
.pg-map .mp-ph span{font-size:13px;color:var(--mute);line-height:1.8}
.pg-map .mp-info{border-top:3px solid var(--ink);margin:0}
.pg-map .mp-info>div{display:grid;grid-template-columns:88px minmax(0,1fr);gap:14px;align-items:start;
  padding:18px 4px;border-bottom:1px solid var(--line-soft)}
.pg-map .mp-info dt{font-family:var(--latin);font-size:11px;letter-spacing:.12em;
  background:var(--ink);color:var(--yellow);padding:5px 8px;text-align:center}
.pg-map .mp-info dd{margin:0;font-size:15px;line-height:1.8;color:var(--ink)}
.pg-map .mp-info dd a:hover{background:var(--yellow)}

/* ── cta : 문의 유도 ──────────────────────────────── */
.pg-cta{text-align:left}
.cta-link{display:inline-flex;align-items:baseline;gap:16px;font-family:var(--latin);
  font-size:clamp(34px,6vw,72px);line-height:1.06;transition:color .2s}
.cta-link .arr{color:var(--yellow);display:inline-block;transition:transform .25s}
.cta-link:hover .arr{transform:translate(8px,-8px)}
.pg-cta p{margin-top:18px;max-width:560px;font-size:15px;color:var(--graphite);line-height:1.9}

/* ── note : 안내 문구 ─────────────────────────────── */
.pg-note{border:2px dashed var(--ink);background:#FFFBE0;padding:26px 28px;margin-top:10px}
.pg-note h4{font-size:15px;font-weight:900;margin-bottom:10px}
.pg-note h4::before{content:"※ "}
.pg-note p{font-size:13px;line-height:1.9;color:var(--graphite)}

/* ── 반응형 ───────────────────────────────────────── */
@media (max-width:1024px){
  .pg-imggrid.cols4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-stats .st:nth-child(odd){border-left:0}
  .pg-stats .st:nth-child(n+3){border-top:1px solid var(--line-soft)}
}
@media (max-width:768px){
  .pg-sec{padding:44px 0}
  .pg-media{grid-template-columns:minmax(0,1fr);gap:24px}
  .pg-media .md-img,.pg-media.rev .md-img{order:1;margin-top:0;aspect-ratio:16/10}
  .pg-media .md-body,.pg-media.rev .md-body{order:2;padding-top:0}
  .pg-imggrid{gap:18px}
  .pg-imggrid.cols3,.pg-imggrid.cols4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-steps li{grid-template-columns:minmax(0,1fr);gap:10px;padding:22px 10px}
  .pg-steps .no{font-size:24px}
  .pg-years .yr{grid-template-columns:minmax(0,1fr);gap:10px;padding:26px 10px}
  .pg-years ul{padding-top:0}
  .pg-map{grid-template-columns:minmax(0,1fr)}
  .pg-map .mp,.pg-map .mp iframe,.pg-map .mp-ph{min-height:260px}
  .pg-note{padding:20px 18px}
}
@media (max-width:480px){
  .pg-imggrid.cols2,.pg-imggrid.cols3,.pg-imggrid.cols4{grid-template-columns:minmax(0,1fr)}
  .pg-map .mp-info>div{grid-template-columns:76px minmax(0,1fr);gap:10px}
}

/* ── 좁은 화면 지표 단위 줄바꿈 · 2026-08-31 점검 (main.css 와 같은 이유) ── */
@media (max-width:480px){
  .pg-stats strong{font-size:28px;line-height:1.12}
  .pg-stats strong em{display:block;margin-left:0;font-size:13px;letter-spacing:.06em}
}