@charset "UTF-8";
/* company-history.php 전용 — 인라인 <style>에서 분리 (2026-07-30) */
/* 연혁 — 시대별 그룹 레이아웃 (페이지 고유 보정 · tokens.css 기반) */
.era-nav{position:sticky;top:var(--head-h);z-index:20;background:#fff;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:0 0 60px;padding:86px 0 20px}
.era-nav::before{content:"";position:absolute;top:calc(7px + 60px);left:12%;right:12%;height:2px;background:var(--line)}
.era-nav a{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;padding-top:6px}
.era-nav a::before{content:"";position:absolute;top:-26px;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--line);transition:.2s}
.era-nav a b{font-size:18px;font-weight:900;color:var(--navy);transition:.2s}
.era-nav a small{font-size:13px;color:var(--gray)}
@media (hover:hover){.era-nav a:hover b{color:var(--primary)}.era-nav a:hover::before{border-color:var(--primary);background:var(--primary)}}
.era-nav a.is-active::before{border-color:var(--primary);background:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent)}
.era-nav a.is-active b{color:var(--primary)}

.eras{display:flex;flex-direction:column;gap:72px}
.era{display:grid;grid-template-columns:320px 1fr;gap:54px;align-items:start;scroll-margin-top:calc(var(--head-h) + 176px)}
.era-head{position:sticky;top:calc(var(--head-h) + 130px + 60px);align-self:start}
.era-head .rng{font-size:clamp(26px,3vw,34px);font-weight:900;color:var(--primary);line-height:1.1}
.era-head .sub{font-size:21px;font-weight:800;color:var(--ink);margin-top:12px}
.era-head .dsc{font-size:15px;color:var(--gray);line-height:1.85;margin-top:16px}
.era-head .bar{width:56px;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--primary),var(--primary-light));margin-top:22px}
.era-years{border-top:2px solid var(--navy)}
.era-year{display:grid;grid-template-columns:76px 1fr;gap:26px;padding:22px 4px;border-bottom:1px solid var(--line);align-items:start}
.era-year:last-child{border-bottom:0}
.era-year .yr{font-size:22px;font-weight:900;color:var(--navy);line-height:1.15}
.era-year .evs{display:flex;flex-direction:column;gap:9px}
.ev{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:baseline}
.ev .m{font-size:13px;font-weight:800;color:var(--primary)}
.ev .x{font-size:14.5px;color:var(--ink);line-height:1.6}
@media (max-width:1024px){
  .era{grid-template-columns:1fr;gap:28px}
  .era-head{position:static}
  .era-nav{margin-bottom:44px}
}
@media (max-width:768px){
  .era-nav{gap:8px;margin-bottom:52px}
  .era-nav a b{font-size:15px}
  .era-nav a small{font-size:11px}
  .era-year{grid-template-columns:1fr;gap:8px}
}