:root{
    --black:#0e0e10; --ink:#16161a; --body:#34343c; --mute:#5f5f6a;
    --line:#e7e7ea; --paper:#f5f5f6;--white:#fff;
    --red:#ED2024; --red-700:#c41a1d; --red-tint:#fdecea;
    --kf:"Pretendard","Pretendard Variable",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;
    --ef:"Montserrat","Pretendard",Arial,sans-serif;
    --maxw:1200px; --gnb-h:70px;
  }
  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{ margin:0; font-family:var(--kf); color:var(--body); background:var(--white);
        line-height:1.7; word-break:keep-all; -webkit-font-smoothing:antialiased; }
  img{ max-width:100%; display:block; }
  a{ color:inherit; text-decoration:none; }
  .wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 28px; }
  .en{ font-family:var(--ef); }

  .gnb{ position:fixed; top:0; left:0; right:0; height:var(--gnb-h); z-index:100;
        display:flex; align-items:center; background:rgba(14,14,16,0); transition:background .3s, box-shadow .3s; }
  .gnb.solid{ background:var(--white); box-shadow:0 1px 0 var(--line); }
  .gnb .wrap{ display:flex; align-items:center; justify-content:space-between; }
  .logo{ display:flex; align-items:center; height:40px; }
  .logo img{ height:36px; width:auto; display:block; }
  .logo .lg-white{ display:none; }
  .gnb.solid .logo .lg-light{ display:block; }
  .gnb.solid .logo .lg-white{ display:none; }
  .gnb:not(.solid) .logo .lg-light{ display:none; }
  .gnb:not(.solid) .logo .lg-white{ display:block; }
  .nav{ display:flex; align-items:center; gap:28px; }
  .nav a{ font-size:.94rem; font-weight:600; color:rgba(255,255,255,.86); transition:color .2s; cursor:pointer; }
  .gnb.solid .nav a{ color:var(--ink); }
  .nav a:hover,.nav a.on{ color:var(--red); }
  .nav .util{ display:flex; align-items:center; gap:13px; padding-left:18px; margin-left:4px; border-left:1px solid rgba(255,255,255,.22); }
  .gnb.solid .nav .util{ border-left-color:var(--line); }
  .nav .util a{ font-size:.84rem; font-weight:600; color:rgba(255,255,255,.8); display:inline-flex; align-items:center; gap:5px; }
  .gnb.solid .nav .util a{ color:var(--mute); }
  .nav .util a:hover{ color:var(--red); }
  .nav .util svg{ width:15px; height:15px; }
  .nav .quote{ font-family:var(--kf); font-weight:700; color:#fff !important; background:var(--red); padding:9px 18px; border-radius:6px; font-size:.9rem; }
  .nav .quote:hover{ background:var(--red-700); }
  .burger{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:6px; }
  .mobile-utils{ display:none; }
  .burger span{ width:24px; height:2px; background:#fff; }
  .gnb.solid .burger span{ background:var(--ink); }

  .nav.mobile-open{ display:flex !important; position:absolute; top:var(--gnb-h); left:0; right:0; flex-direction:column; gap:0; width:100%; background:#fff; border-top:1px solid var(--line); padding:12px 0; z-index:99; }
  .nav.mobile-open a{ display:block; padding:12px 28px; border-bottom:1px solid var(--line); font-size:.95rem; color:var(--ink) !important; }
  .nav.mobile-open a:last-child{ border-bottom:0; }
  .nav.mobile-open a.on{ background:var(--red-tint); color:var(--red) !important; }
  .nav.mobile-open .util{ display:none; }

  .page{ display:block; }
  .page.active{ display:block; animation:pagein .45s ease; }
  @keyframes pagein{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }

  .btn{ display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:.98rem; padding:15px 28px; border-radius:7px; transition:transform .2s, background .2s, border-color .2s; cursor:pointer; }
  .btn-red{ background:var(--red); color:#fff; }
  .btn-red:hover{ background:var(--red-700); transform:translateY(-2px); }
  .btn-ghost{ border:1px solid rgba(255,255,255,.28); color:#fff; }
  .btn-ghost:hover{ border-color:#fff; transform:translateY(-2px); }
  .btn-dark{ border:1px solid var(--line); color:var(--ink); }
  .btn-dark:hover{ border-color:var(--ink); transform:translateY(-2px); }

  .hero{ position:relative; background:var(--black); color:#fff; overflow:hidden; padding:calc(var(--gnb-h) + 100px) 0 0; }
  .hero-photo{ position:absolute; inset:0; opacity:.85; overflow:hidden; }.hero-photo img{ width:100%; height:100%; object-fit:cover; object-position:center 38%; display:block; }
  .hero-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,10,11,.82) 0%, rgba(10,10,11,.5) 38%, rgba(10,10,11,.12) 70%, rgba(10,10,11,0) 100%); }
  .hero::before{ content:""; position:absolute; inset:0; opacity:.06; background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px); background-size:54px 54px; }
  .hero::after{ content:""; position:absolute; top:-20%; right:-12%; width:55%; height:85%; background:radial-gradient(circle, rgba(226,35,26,.30) 0%, rgba(226,35,26,0) 65%); pointer-events:none; }
  .hero .wrap{ position:relative; }
  .hero-tag{ font-family:var(--ef); font-size:.8rem; font-weight:700; letter-spacing:.28em; color:#9a9aa4; text-transform:uppercase; margin:0 0 26px; }
  .hero h1{ font-size:clamp(2.3rem,5.4vw,4rem); font-weight:800; line-height:1.16; letter-spacing:-.02em; margin:0 0 26px; }
  .hero h1 .r{ color:var(--red); }
  .hero p{ font-size:clamp(1.02rem,1.7vw,1.2rem); color:#c4c4cc; max-width:38em; margin:0 0 40px; }
  .hero-cta{ display:flex; gap:14px; flex-wrap:wrap; }
  .hero-bar{ position:relative; margin-top:74px; border-top:1px solid rgba(255,255,255,.12); display:grid; grid-template-columns:repeat(4,1fr); }
  .hero-bar .cell{ padding:26px 8px 32px; border-right:1px solid rgba(255,255,255,.12); }
  .hero-bar .cell:last-child{ border-right:0; }
  .hero-bar .k{ font-family:var(--ef); font-size:clamp(1.3rem,2.6vw,1.8rem); font-weight:800; color:#fff; line-height:1.05; }
  .hero-bar .k .r{ color:var(--red); }
  .hero-bar .l{ font-size:.85rem; color:#9a9aa4; margin-top:10px; }

  .pbanner{ position:relative; background:var(--black); color:#fff; overflow:hidden; padding:calc(var(--gnb-h) + 60px) 0 56px; }
  .pbanner::before{ content:""; position:absolute; inset:0; opacity:.06; background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px); background-size:54px 54px; }
  .pbanner::after{ content:""; position:absolute; top:-30%; right:-8%; width:46%; height:120%; background:radial-gradient(circle, rgba(226,35,26,.26) 0%, rgba(226,35,26,0) 65%); }
  .pbanner .wrap{ position:relative; }
  .pbanner .crumb{ font-family:var(--ef); font-size:.82rem; color:#9a9aa4; letter-spacing:.04em; margin-bottom:14px; }
  .pbanner .crumb b{ color:var(--red); font-weight:700; }
  .pbanner h1{ font-size:clamp(1.9rem,4.2vw,2.8rem); font-weight:800; margin:0 0 12px; letter-spacing:-.015em; }
  .pbanner h1 .r{ color:var(--red); }
  .pbanner p{ font-size:1.05rem; color:#c4c4cc; margin:0; max-width:40em; }

  .sec{ padding:clamp(64px,8vw,104px) 0; }
  .sec-paper{ background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .sec-dark{ background:var(--black); color:#fff; }
  .sec-head{ max-width:760px; margin-bottom:clamp(36px,5vw,54px); }
  .sec-head.center{ margin:0 auto clamp(36px,5vw,54px); text-align:center; }
  .sec-head h2{ font-size:clamp(1.6rem,3.4vw,2.4rem); font-weight:800; letter-spacing:-.015em; color:var(--ink); margin:0 0 14px; line-height:1.26; }
  .sec-dark .sec-head h2{ color:#fff; }
  .sec-head h2 .r{ color:var(--red); }
  .sec-head p{ font-size:1.05rem; color:var(--mute); margin:0; }
  .sec-dark .sec-head p{ color:#a8a8b2; }
  .q{ font-family:var(--ef); font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--red); display:block; margin-bottom:12px; }

  .grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .mini{ background:var(--white); border:1px solid var(--line); border-radius:14px; padding:30px 28px; transition:transform .25s, box-shadow .25s, border-color .25s; cursor:pointer; }
  .mini:hover{ transform:translateY(-5px); box-shadow:0 24px 48px -28px rgba(14,14,16,.3); border-color:#dadadf; }
  .mini .ix{ width:46px; height:46px; border-radius:11px; background:var(--red-tint); color:var(--red); display:grid; place-items:center; margin-bottom:18px; }
  .mini .ix svg{ width:23px; height:23px; }
  .mini h3{ font-size:1.14rem; font-weight:700; color:var(--ink); margin:0 0 3px; }
  .mini .eng{ font-family:var(--ef); font-size:.74rem; font-weight:600; color:var(--red); margin:0 0 10px; }
  .mini p{ font-size:.92rem; color:var(--mute); margin:0; }

  .why{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
  .wcard{ display:flex; gap:22px; background:var(--white); border:1px solid var(--line); border-radius:14px; padding:30px 28px; }
  .wcard .ix{ flex:0 0 auto; width:50px; height:50px; border-radius:12px; background:var(--black); color:#fff; display:grid; place-items:center; }
  .wcard .ix svg{ width:25px; height:25px; }
  .wcard h3{ font-size:1.16rem; font-weight:700; color:var(--ink); margin:0 0 8px; }
  .wcard h3 .r{ color:var(--red); }
  .wcard p{ margin:0; font-size:.94rem; color:var(--mute); }

  .svc-row{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,60px); align-items:center; padding:clamp(40px,5vw,56px) 0; border-bottom:1px solid var(--line); }
  .svc-row:last-child{ border-bottom:0; }
  .svc-row .media{ order:2; }
  .svc-row.flip .text{ order:2; }
  .svc-row.flip .media{ order:1; }
  .svc-no{ font-family:var(--ef); font-size:.8rem; font-weight:800; color:var(--red); letter-spacing:.1em; }
  .svc-row h3{ font-size:clamp(1.4rem,3vw,1.9rem); font-weight:800; color:var(--ink); margin:8px 0 2px; letter-spacing:-.01em; }
  .svc-row .eng{ font-family:var(--ef); font-size:.82rem; font-weight:600; color:var(--red); margin:0 0 16px; letter-spacing:.03em; }
  .svc-row .desc{ font-size:1rem; color:var(--body); margin:0 0 22px; }
  .svc-row ul{ list-style:none; margin:0; padding:0; display:grid; gap:11px; }
  .svc-row ul li{ position:relative; padding-left:24px; font-size:.96rem; color:var(--body); }
  .svc-row ul li::before{ content:""; position:absolute; left:3px; top:9px; width:7px; height:7px; border-radius:2px; background:var(--red); }
  .svc-row ul li b{ color:var(--ink); font-weight:700; }

  .svc-media{ aspect-ratio:4/3; min-height:420px; border-radius:16px; background:linear-gradient(135deg,#1a1a1e,#2a2a30); color:#7a7a86; display:grid; place-items:center; font-size:.86rem; text-align:center; padding:18px; position:relative; overflow:hidden; }
  .svc-media::after{ content:""; position:absolute; inset:0; opacity:.5; background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:32px 32px; }
  .svc-media span{ position:relative; }
  .svc-media.has-img{ background:none; padding:0; }
  .svc-media.has-img::after{ display:none; }
  .svc-media.has-img img{ width:100%; height:100%; object-fit:cover; display:block; }

  .sol-card{ background:var(--white); border:1px solid var(--line); border-radius:18px; overflow:hidden; box-shadow:0 30px 60px -42px rgba(14,14,16,.4); margin-bottom:30px; }
  .sol-top{ display:grid; grid-template-columns:1fr 1fr; }
  .sol-left{ background:var(--black); color:#fff; padding:clamp(32px,4vw,48px); position:relative; overflow:hidden; }
  .sol-left::after{ content:""; position:absolute; right:-40px; bottom:-40px; width:220px; height:220px; background:radial-gradient(circle, rgba(226,35,26,.3), transparent 70%); }
  .sol-badge{ position:relative; display:inline-flex; font-family:var(--ef); font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#fff; background:var(--red); padding:6px 13px; border-radius:999px; margin-bottom:20px; }
  .sol-left h3{ position:relative; font-size:clamp(1.5rem,2.8vw,2rem); font-weight:800; margin:0 0 6px; }
  .sol-left .sub{ position:relative; font-family:var(--ef); font-size:.9rem; color:#9a9aa4; margin:0 0 20px; }
  .sol-left p{ position:relative; font-size:.96rem; color:#c8c8d0; margin:0 0 22px; }
  .sol-partner{ position:relative; padding-top:20px; border-top:1px solid rgba(255,255,255,.14); font-size:.88rem; color:#a8a8b2; }
  .sol-partner b{ color:#fff; font-weight:700; }
  .sol-right{ padding:clamp(32px,4vw,48px); }
  .sol-right h4{ margin:0 0 20px; font-size:.8rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--red); font-family:var(--ef); }
  .sol-feat{ display:grid; grid-template-columns:1fr 1fr; gap:20px 24px; }
  .sol-feat .f h5{ margin:0 0 5px; font-size:.98rem; font-weight:700; color:var(--ink); display:flex; gap:8px; }
  .sol-feat .f h5 .d{ width:7px; height:7px; border-radius:2px; background:var(--red); flex:0 0 auto; margin-top:6px; }
  .sol-feat .f p{ margin:0; font-size:.86rem; color:var(--mute); }
  .sol-bottom{ border-top:1px solid var(--line); padding:24px clamp(32px,4vw,48px); display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; background:var(--paper); }
  .sol-certs{ display:flex; gap:9px; flex-wrap:wrap; }
  .sol-certs span{ font-size:.8rem; font-weight:600; color:var(--body); background:#fff; border:1px solid var(--line); border-radius:999px; padding:6px 14px; }

  .prod{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
  .pcard2{ background:var(--white); border:1px solid var(--line); border-radius:14px; padding:28px 28px; }
  .pcard2 .pt{ font-family:var(--ef); font-size:.74rem; font-weight:700; letter-spacing:.08em; color:var(--red); text-transform:uppercase; }
  .pcard2 h4{ font-size:1.14rem; font-weight:700; color:var(--ink); margin:8px 0 8px; }
  .pcard2 p{ margin:0; font-size:.93rem; color:var(--mute); }

  .effect{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:14px; }
  .ecard{ background:var(--white); border:1px solid var(--line); border-radius:12px; padding:24px 22px; }
  .ecard .t{ font-size:1.02rem; font-weight:700; color:var(--ink); margin:0 0 6px; }
  .ecard .t .r{ color:var(--red); }
  .ecard p{ margin:0; font-size:.9rem; color:var(--mute); }

  .inq{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .inq-card{ background:var(--white); border:1px solid var(--line); border-radius:14px; padding:34px 28px; display:flex; flex-direction:column; text-align:center; align-items:center; transition:transform .25s, box-shadow .25s, border-color .25s; }
  .inq-card:hover{ transform:translateY(-5px); box-shadow:0 24px 48px -28px rgba(14,14,16,.3); border-color:#dadadf; }
  .inq-card .ix{ width:56px; height:56px; border-radius:14px; background:var(--black); color:#fff; display:grid; place-items:center; margin-bottom:18px; }
  .inq-card .ix svg{ width:27px; height:27px; }
  .inq-card h3{ font-size:1.22rem; font-weight:700; color:var(--ink); margin:0 0 9px; }
  .inq-card h3 .r{ color:var(--red); }
  .inq-card p{ font-size:.93rem; color:var(--mute); margin:0 0 24px; flex:1; }
  .inq-card .btn{ width:100%; justify-content:center; }

  .proc{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
  .pstep{ padding:0 24px; position:relative; }
  .pstep:not(:last-child)::after{ content:""; position:absolute; top:22px; right:-1px; width:1px; height:calc(100% - 30px); background:rgba(255,255,255,.14); }
  .pstep .pn{ font-family:var(--ef); font-size:.84rem; font-weight:800; color:var(--red); }
  .pstep .pbar{ height:3px; background:var(--red); width:40px; margin:14px 0 18px; border-radius:2px; }
  .pstep h4{ font-size:1.1rem; font-weight:700; color:#fff; margin:0 0 9px; }
  .pstep p{ font-size:.9rem; color:#a8a8b2; margin:0; }

  .hist{ display:grid; gap:0; max-width:820px; }
  .hrow{ display:grid; grid-template-columns:120px 1fr; gap:24px; padding:10px 0; border-bottom:1px solid var(--line); align-items:baseline; }
  .hrow:last-child{ border-bottom:0; }
  .hrow .yr{ font-family:var(--ef); font-size:1.3rem; font-weight:800; color:var(--ink); }
  .hrow .ev{ font-size:1rem; color:var(--body); }
  .hrow .ev b{ color:var(--ink); }

  .certs2{ display:flex; flex-wrap:wrap; gap:10px; }
  .certs2 span{ font-size:.92rem; color:var(--body); background:var(--white); border:1px solid var(--line); border-radius:999px; padding:9px 18px; }

  .logos{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
  .lcard{ background:var(--white); border:1px solid var(--line); border-radius:12px; height:100px; display:grid; place-items:center; padding:18px; transition:border-color .25s, transform .25s; }
  .lcard:hover{ border-color:#d0d0d6; transform:translateY(-3px); }
  .lcard img{ max-height:34px; max-width:100%; width:auto; height:auto; object-fit:contain; filter:grayscale(.12); }
  .lcard span{ font-weight:700; font-size:1rem; color:var(--ink); text-align:center; }
  .logos-note{ margin-top:24px; text-align:center; font-size:.9rem; color:var(--mute); }

  .csr-intro{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,60px); align-items:center; margin-bottom:clamp(36px,5vw,52px); }
  .csr-intro h2{ font-size:clamp(1.6rem,3.4vw,2.3rem); font-weight:800; color:var(--ink); margin:0; line-height:1.32; }
  .csr-intro h2 .r{ color:var(--red); }
  .csr-intro p{ color:var(--mute); margin:0 0 16px; }
  .csr-intro p:last-child{ margin-bottom:0; }
  .csr-cards{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .csr-card{ border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--white); display:flex; flex-direction:column; }
  .csr-card .band{ background:var(--black); color:#fff; padding:22px 26px; display:flex; align-items:center; justify-content:space-between; gap:14px; }
  .csr-card .org{ font-weight:700; font-size:1.05rem; }
  .csr-card .badge{ font-size:.72rem; font-weight:700; color:#fff; border:1px solid rgba(255,255,255,.4); border-radius:999px; padding:5px 12px; white-space:nowrap; }
  .csr-card .body{ padding:26px; flex:1; }
  .csr-card .body h4{ margin:0 0 10px; font-size:1.16rem; font-weight:700; color:var(--ink); }
  .csr-card .body h4 .r{ color:var(--red); }
  .csr-card .body p{ margin:0 0 18px; font-size:.94rem; color:var(--mute); }
  .csr-card .meta{ display:flex; flex-wrap:wrap; gap:7px; }
  .chip{ font-size:.8rem; color:var(--body); background:var(--paper); border:1px solid var(--line); border-radius:6px; padding:4px 10px; }

  .esg-eval{ display:grid; grid-template-columns:300px 1fr; gap:clamp(24px,4vw,48px); align-items:stretch; }
  .esg-score{ background:var(--black); color:#fff; border-radius:16px; padding:clamp(28px,3.5vw,40px); display:flex; flex-direction:column; justify-content:center; text-align:center; position:relative; overflow:hidden; }
  .esg-score::before{ content:""; position:absolute; inset:0; opacity:.06; background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px); background-size:36px 36px; }
  .esg-score .rel{ position:relative; }
  .esg-score .cap{ font-size:.82rem; color:rgba(255,255,255,.74); letter-spacing:.04em; margin-bottom:10px; }
  .esg-score .grade{ font-family:var(--ef); font-size:clamp(3.4rem,7vw,4.6rem); font-weight:800; line-height:1; color:var(--red); }
  .esg-score .pts{ font-family:var(--ef); font-size:1.3rem; font-weight:700; margin-top:8px; }
  .esg-score .pts small{ font-size:.9rem; color:rgba(255,255,255,.72); font-weight:600; }
  .esg-score .sub{ font-size:.8rem; color:rgba(255,255,255,.74); margin-top:14px; padding-top:14px; border-top:1px solid rgba(255,255,255,.15); }
  .esg-eval-body{ display:grid; gap:22px; align-content:center; }
  .esg-eval-body .blk h4{ font-size:1.04rem; font-weight:800; color:var(--ink); margin:0 0 12px; }
  .esg-eval-body .blk h4 .r{ color:var(--red); }
  .esg-eval-body ol{ list-style:none; margin:0; padding:0; counter-reset:e; display:grid; gap:9px; }
  .esg-eval-body ol li{ position:relative; padding-left:30px; font-size:.95rem; color:var(--body); line-height:1.55; }
  .esg-eval-body ol li::before{ counter-increment:e; content:counter(e); position:absolute; left:0; top:0; width:21px; height:21px; border-radius:6px; background:var(--red-tint); color:var(--red); font-size:.72rem; font-weight:700; display:grid; place-items:center; }
  .esg-eval-body .effort{ display:grid; gap:9px; }
  .esg-eval-body .effort p{ position:relative; padding-left:20px; margin:0; font-size:.95rem; color:var(--body); line-height:1.6; }
  .esg-eval-body .effort p::before{ content:""; position:absolute; left:2px; top:9px; width:6px; height:6px; border-radius:2px; background:var(--red); }
  .esg-eval-body .effort b{ color:var(--ink); font-weight:700; }

  .esg-mini{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:clamp(28px,4vw,40px); }
  .esg-mini .m{ border:1px solid var(--line); border-radius:12px; background:var(--white); padding:20px 22px; }
  .esg-mini .m .h{ display:flex; align-items:baseline; gap:8px; margin-bottom:10px; }
  .esg-mini .m .ltr{ font-family:var(--ef); font-size:1.7rem; font-weight:800; color:var(--red); line-height:1; }
  .esg-mini .m .nm{ font-size:.82rem; font-weight:700; color:var(--ink); }
  .esg-mini .m .nm small{ display:block; font-weight:600; color:var(--mute); font-size:.72rem; margin-top:1px; }
  .esg-mini .m .tags{ font-size:.85rem; color:var(--body); line-height:1.6; }

  .esg-detail{ display:grid; gap:18px; margin-top:clamp(36px,5vw,52px); }
  .esg-row{ display:grid; grid-template-columns:200px 1fr; gap:clamp(20px,3vw,40px); align-items:start; border:1px solid var(--line); border-radius:14px; background:var(--white); padding:clamp(26px,3.5vw,36px); }

  .esg-row .label .en{ font-family:var(--ef); font-size:.78rem; font-weight:700; color:var(--red); letter-spacing:.04em; text-transform:uppercase; }
  .esg-row .label h3{ font-size:clamp(1.25rem,2.4vw,1.6rem); font-weight:800; color:var(--ink); margin:6px 0 0; letter-spacing:-.01em; }
  .esg-row .cont p{ margin:0 0 14px; font-size:1rem; color:var(--body); line-height:1.75; }
  .esg-row .cont p:last-child{ margin-bottom:0; }
  .esg-row .cont ul{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
  .esg-row .cont ul li{ position:relative; padding-left:22px; font-size:.97rem; color:var(--body); line-height:1.6; }
  .esg-row .cont ul li::before{ content:""; position:absolute; left:3px; top:9px; width:6px; height:6px; border-radius:2px; background:var(--red); }
  .esg-row .cont .iso{ display:inline-block; margin-top:6px; font-size:.8rem; font-weight:700; color:var(--red); border:1px solid var(--red); border-radius:999px; padding:5px 14px; }

  .decl{ border:1px solid var(--line); border-radius:16px; background:var(--white); padding:clamp(34px,5vw,60px); }
  .decl .lead{ font-size:clamp(1.05rem,1.8vw,1.2rem); color:var(--ink); font-weight:600; line-height:1.7; margin:0 0 28px; }
  .decl ol{ list-style:none; margin:0 0 28px; padding:0; counter-reset:d; display:grid; gap:14px; }
  .decl ol li{ position:relative; padding-left:34px; font-size:.99rem; color:var(--body); line-height:1.7; }
  .decl ol li::before{ counter-increment:d; content:counter(d); position:absolute; left:0; top:1px; width:23px; height:23px; border-radius:7px; background:var(--red); color:#fff; font-size:.74rem; font-weight:700; display:grid; place-items:center; }
  .decl .one li::before{ content:"하나"; width:auto; padding:0 8px; border-radius:7px; font-size:.7rem; letter-spacing:-.02em; }
  .decl .closing{ font-size:1rem; color:var(--ink); font-weight:600; line-height:1.7; padding-top:24px; border-top:1px solid var(--line); margin:0; }
  .decl .sign{ margin-top:24px; text-align:right; }
  .decl .sign .date{ font-size:.9rem; color:var(--mute); margin:0 0 4px; }
  .decl .sign .by{ font-size:1.08rem; font-weight:800; color:var(--ink); margin:0; }

  .hr-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:26px 0; }
  .hr-card{ border:1px solid var(--line); border-radius:12px; background:var(--white); padding:20px; }
  .hr-card .no{ font-family:var(--ef); font-size:.72rem; font-weight:700; color:var(--red); letter-spacing:.06em; }
  .hr-card .key{ font-size:1rem; font-weight:800; color:var(--ink); margin:6px 0 8px; letter-spacing:-.01em; }
  .hr-card .txt{ font-size:.84rem; color:var(--mute); line-height:1.6; }

  .contact-grid{ display:grid; grid-template-columns:1.1fr 1fr; gap:30px; }
  .cinfo{ display:grid; gap:18px; }
  .cinfo .row{ display:flex; gap:16px; align-items:flex-start; padding:22px 24px; border:1px solid var(--line); border-radius:12px; background:var(--white); }
  .cinfo .row .ic{ flex:0 0 auto; width:42px; height:42px; border-radius:10px; background:var(--red-tint); color:var(--red); display:grid; place-items:center; }
  .cinfo .row .ic svg{ width:21px; height:21px; }
  .cinfo .row .lbl{ font-size:.8rem; color:var(--mute); margin-bottom:3px; }
  .cinfo .row .val{ font-size:1.05rem; font-weight:700; color:var(--ink); }
  .cmap{ position:relative; border:1px solid var(--line); border-radius:12px; background:var(--paper); min-height:320px; overflow:hidden; }
  .cmap iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
  .cmap-link{ position:absolute; right:12px; bottom:12px; z-index:2; background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:9px 13px; font-size:.82rem; font-weight:700; text-decoration:none; box-shadow:0 6px 18px rgba(0,0,0,.16); }
  .cmap-link:hover{ border-color:var(--red); color:var(--red); }

  .cta-band{ background:var(--black); color:#fff; padding:clamp(60px,8vw,92px) 0; position:relative; overflow:hidden; text-align:center; }
  .cta-band::before{ content:""; position:absolute; inset:0; opacity:.05; background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px); background-size:54px 54px; }
  .cta-band .wrap{ position:relative; }
  .cta-band h2{ font-size:clamp(1.6rem,3.6vw,2.4rem); font-weight:800; margin:0 auto 14px; max-width:22em; line-height:1.34; }
  .cta-band h2 .r{ color:var(--red); }
  .cta-band p{ color:#b4b4be; max-width:34em; margin:0 auto 34px; font-size:1.04rem; }

  footer{ background:#08080a; color:#9a9aa5; padding:54px 0 38px; font-size:.9rem; }
  footer .top{ display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,.1); }
  footer .flogo img{ height:30px; width:auto; }
  footer .fnav{ display:flex; gap:24px; flex-wrap:wrap; }
  footer .fnav a{ color:#b4b4be; font-weight:600; cursor:pointer; }
  footer .fnav a:hover{ color:#fff; }
  footer .info{ margin-top:28px; line-height:1.9; }
  footer .info b{ color:#c8c8d0; font-weight:600; }
  footer .copy{ margin-top:20px; font-family:var(--ef); font-size:.8rem; color:#5a5a64; }

  @media (max-width:980px){
    .grid3{ grid-template-columns:repeat(2,1fr); }
    .why{ grid-template-columns:1fr; }
    .svc-row{ grid-template-columns:1fr; gap:24px; }
    .svc-row .media,.svc-row.flip .media{ order:1; }
    .svc-row .text,.svc-row.flip .text{ order:2; }
    .sol-top{ grid-template-columns:1fr; }
    .sol-feat{ grid-template-columns:1fr 1fr; }
    .prod{ grid-template-columns:1fr; }
    .effect{ grid-template-columns:1fr; }
    .inq{ grid-template-columns:1fr; }
    .proc{ grid-template-columns:repeat(2,1fr); gap:34px 0; }
    .pstep:nth-child(2)::after{ display:none; }
    .logos{ grid-template-columns:repeat(3,1fr); }
    .csr-intro,.csr-cards{ grid-template-columns:1fr; }
    .esg-eval{ grid-template-columns:1fr; }
    .esg-mini{ grid-template-columns:1fr; }
    .esg-row{ grid-template-columns:1fr; gap:14px; }
    .hr-grid{ grid-template-columns:1fr 1fr; }
    .contact-grid{ grid-template-columns:1fr; }
  }
  @media (max-width:680px){
    .gnb .wrap{ display:flex; align-items:center; gap:8px; }
    .gnb .logo{ height:40px; width:auto; }
    .nav{ position:absolute; top:60px; left:0; right:0; display:none; flex-direction:column; background:white; border-bottom:1px solid #f0f0f0; z-index:999; }
    .nav a:not(.util),.nav .quote{ border-bottom:1px solid #f0f0f0; padding:16px; text-align:center; }
    .nav a:not(.util):hover,.nav .quote:hover{ background:#f5f5f5; }
    .nav.mobile-open{ display:flex !important; }
    .mobile-utils{ display:flex; gap:12px; margin-left:auto; margin-right:4px; align-items:center; }
    .mobile-utils a{ font-size:12px; color:white; text-decoration:none; white-space:nowrap; transition:0.3s; letter-spacing:.02em; }
    .mobile-utils a:hover{ color:#ED2024; }
    .gnb.solid .mobile-utils a{ color:#222; }
    .burger{ display:flex; flex-direction:column; gap:5px; width:28px; height:28px; padding:0; background:none; border:none; cursor:pointer; flex-shrink:0; }
    .burger span{ width:100%; height:2.5px; background:white; border-radius:2px; transition:0.3s; box-shadow:0 1px 2px rgba(0,0,0,0.2); }
    .gnb.solid .burger span{ background:#222; box-shadow:none; }
    .burger.open span:nth-child(1){ transform:rotate(45deg) translate(9px, 9px); }
    .burger.open span:nth-child(2){ opacity:0; }
    .burger.open span:nth-child(3){ transform:rotate(-45deg) translate(6px, -6px); }
    .hero-photo img{ object-position:56% 42%; }
    .hero-bar{ grid-template-columns:repeat(2,1fr); }
    .hero-bar .cell:nth-child(2){ border-right:0; }
    .hero-bar .cell:nth-child(1),.hero-bar .cell:nth-child(2){ border-bottom:1px solid rgba(255,255,255,.12); }
    .svc-media{ max-height:250px !important; min-height:0; }
    .hr-grid{ grid-template-columns:1fr; gap:10px; margin:20px 0; }
    .grid3{ grid-template-columns:1fr; }
    .sol-feat{ grid-template-columns:1fr; }
    .proc{ grid-template-columns:1fr; } .pstep::after{ display:none !important; }
    .logos{ grid-template-columns:repeat(2,1fr); }
    .hrow{ grid-template-columns:46px 1fr; gap:8px; padding:8px 0; }
  .hrow .yr{ font-size:.9rem; }
  .hrow .ev{ font-size:clamp(.66rem,3vw,.8rem); letter-spacing:-.01em; line-height:1.4; }
    .sol-bottom{ flex-direction:column; align-items:flex-start; }
  }
  a:focus-visible,.btn:focus-visible,.burger:focus-visible{ outline:3px solid var(--red); outline-offset:3px; border-radius:5px; }
  @media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } .page.active{ animation:none; } *{ transition:none !important; } }

/* 문의 폼 모달 */
.inq-modal{position:fixed;inset:0;z-index:1000;display:none;}
.inq-modal.on{display:block;}
.inq-backdrop{position:absolute;inset:0;background:rgba(14,14,16,.55);}
.inq-dialog{position:relative;max-width:520px;width:calc(100% - 36px);margin:7vh auto 4vh;background:var(--white);border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.28);padding:34px 32px 28px;max-height:86vh;overflow:auto;animation:inqpop .25s ease;}
@keyframes inqpop{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.inq-x{position:absolute;top:14px;right:16px;border:none;background:none;font-size:1.7rem;line-height:1;color:var(--mute);cursor:pointer;width:36px;height:36px;border-radius:8px;}
.inq-x:hover{background:var(--paper);color:var(--ink);}
.inq-eyebrow{font-family:var(--ef);font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin:0 0 6px;}
.inq-head h3{font-size:1.4rem;color:var(--ink);margin:0 0 6px;font-weight:800;}
.inq-sub{font-size:.9rem;color:var(--mute);margin:0 0 20px;line-height:1.55;}
.inq-form label{display:block;font-size:.85rem;font-weight:700;color:var(--ink);margin-bottom:14px;}
.inq-form .req{color:var(--red);}
.inq-form input,.inq-form textarea{width:100%;margin-top:7px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;font-family:var(--kf);font-size:.95rem;color:var(--ink);background:#fbfbfc;transition:border-color .15s,box-shadow .15s;box-sizing:border-box;}
.inq-form input:focus,.inq-form textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px var(--red-tint);background:#fff;}
.inq-form textarea{resize:vertical;min-height:110px;line-height:1.5;}
.inq-honey{position:absolute !important;left:-9999px;width:1px;height:1px;opacity:0;}
.inq-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:4px;}
.inq-actions .btn{padding:13px 22px;}
.inq-status{font-size:.86rem;margin:14px 0 0;min-height:1.1em;line-height:1.5;}
.inq-status.ok{color:#1a7f37;font-weight:700;}
.inq-status.err{color:var(--red-700);font-weight:700;}
.inq-privacy{font-size:.74rem;color:var(--mute);margin:12px 0 0;}
@media (max-width:680px){.inq-dialog{margin:0;width:100%;min-height:100%;border-radius:0;padding:26px 20px;}.inq-actions{flex-direction:column-reverse;}.inq-actions .btn{width:100%;justify-content:center;}}

.inq-filelabel .inq-fhint{font-weight:500;color:var(--mute);font-size:.78rem;}
.inq-file{display:flex;align-items:center;gap:10px;margin-top:7px;position:relative;}
.inq-file input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;}
.inq-file-btn{flex:none;display:inline-flex;align-items:center;padding:10px 16px;border:1px solid var(--line);border-radius:8px;font-size:.85rem;font-weight:700;color:var(--ink);background:var(--paper);}
.inq-file:hover .inq-file-btn{border-color:var(--red);color:var(--red);}
.inq-file-txt{font-size:.82rem;color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.inq-file-txt.has{color:var(--ink);font-weight:600;}
.inq-fhint2{display:block;font-size:.74rem;color:var(--mute);margin-top:7px;font-weight:500;}
.inq-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);z-index:1100;display:flex;align-items:center;gap:14px;background:var(--ink);color:#fff;padding:14px 16px 14px 20px;border-radius:10px;box-shadow:0 12px 36px rgba(0,0,0,.3);font-size:.9rem;font-weight:600;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;max-width:calc(100% - 32px);}
.inq-toast.on{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto;}
.inq-toast button{border:none;background:rgba(255,255,255,.16);color:#fff;width:26px;height:26px;border-radius:6px;font-size:1.1rem;line-height:1;cursor:pointer;flex:none;}
.inq-toast button:hover{background:rgba(255,255,255,.3);}