/* =========================================================
   센도리 2026 — 조달·공공 안내 (page/sub_06_01.php) · 접두어 sdg-
   시안 v6 디자인 언어(메인 sdm · 제품 sdp) 재사용. 공통 토큰·키프레임은 sd.css
   ========================================================= */
@keyframes sdgOpen{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

.sdg{color:var(--sd-ink);background:#fff;line-height:normal;overflow-x:clip}
.sdg h2,.sdg h3,.sdg p,.sdg button,.sdg table{font-family:var(--sd-font)}
.sdg *{word-break:keep-all;overflow-wrap:break-word}
.sdg ul,.sdg dl,.sdg dd,.sdg dt{margin:0;padding:0;list-style:none}
.sdg .sd-thin{font-weight:200}
.sdg-in{max-width:calc(var(--sd-w) + var(--sd-gutter) * 2);margin:0 auto;padding:0 var(--sd-gutter)}
.sdg-sec{position:relative}

/* 공통 머리글 */
.sdg-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:48px}
.sdg-head .sd-btn{height:54px;flex-shrink:0}
.sdg-src{font-size:17px;font-weight:300;color:var(--sd-mute2);text-align:right}
.sdg-note{margin-top:24px!important;font-size:17px;font-weight:300;color:var(--sd-mute2)}
.sdg .sdg-note a{color:var(--sd-mute2);text-decoration:underline;text-underline-offset:3px}
.sdg .sdg-note a:hover{color:var(--sd-blue)}
.sdg-ext{display:inline-block;margin-left:4px;vertical-align:-1px}

/* 배지 */
.sdg-badge{display:inline-flex;align-items:center;height:30px;padding:0 13px;border-radius:15px;font-size:16px;font-weight:700;white-space:nowrap}
.sdg-badge--blue{background:var(--sd-blue);color:#fff}
.sdg-badge--sky{background:var(--sd-sky-bg);color:var(--sd-blue);box-shadow:inset 0 0 0 1px #b3e3f5}
.sdg-badge--green{background:#fff;color:var(--sd-green);box-shadow:inset 0 0 0 1px #bfdcc6}

/* 화면 진입 시 등장 (JS 가 .is-js 를 붙인 경우에만 숨김 → JS 없이도 내용은 보임) */
.sdg.is-js [data-sdg-rv]{opacity:0;transform:translateY(32px);transition:opacity .8s ease var(--d,0s),transform .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),translate .35s ease,box-shadow .3s ease,background .3s ease,border-color .3s ease}
.sdg.is-js [data-sdg-rv].is-in{opacity:1;transform:none}

/* 웨이브 (메인 카드와 같은 구조) */
.sdg-wave{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;overflow:hidden;pointer-events:none}
.sdg-wave svg{flex-shrink:0;width:200%;display:block;max-width:none}
.sdg-wave > span{flex-grow:1;margin-top:-.5px}
.sdg-wave--2 svg{height:30px}
.sdg-wave--1 svg{height:24px}

/* =================== 1. 소개 =================== */
.sdg-intro{padding-top:120px}
.sdg-intro__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px;align-items:center}
.sdg-intro__txt{grid-column:span 7}
.sdg-lead{margin-top:28px!important;max-width:680px;font-size:22px;font-weight:300;line-height:1.85;color:var(--sd-mute)}
.sdg-lead strong{font-weight:700;color:var(--sd-blue)}
.sdg-lead b{font-weight:700;color:var(--sd-ink)}
.sdg-names{grid-column:span 5;display:flex;flex-direction:column;gap:12px}
.sdg-name{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"where code" "name code";gap:4px 16px;align-items:center;padding:22px 28px;border-radius:24px;border:1px solid var(--sd-line);background:#fff;translate:0 0;transition:opacity .8s ease var(--d,0s),transform .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),translate .3s ease,border-color .3s ease,box-shadow .3s ease}
.sdg-name:hover{translate:6px 0;border-color:#b9d3e8;box-shadow:0 14px 32px rgba(13,87,150,.10)}
.sdg-name__where{grid-area:where;font-size:17px;font-weight:400;color:var(--sd-mute2)}
.sdg-name__name{grid-area:name;font-size:26px;font-weight:700;letter-spacing:-.6px;color:var(--sd-blue)}
.sdg-name__code{grid-area:code;padding:8px 14px;border-radius:14px;background:var(--sd-sky-bg2);font-size:19px;font-weight:800;color:var(--sd-blue);white-space:nowrap;font-variant-numeric:tabular-nums}

/* 숫자 카드 */
.sdg-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:80px}
.sdg-stat{position:relative;display:flex;flex-direction:column;gap:10px;min-height:270px;padding:34px 30px 28px;border-radius:28px;background:#fff;overflow:hidden;box-shadow:0 12px 36px rgba(13,87,150,.10);translate:0 0;--w1:0%;--w2:0%;--bar:var(--sd-blue);--num:var(--sd-blue);transition:opacity .8s ease var(--d,0s),transform .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),translate .4s ease,box-shadow .3s ease}
.sdg-stat--sky{--bar:var(--sd-sky)}
.sdg-stat--green{--bar:var(--sd-green);--num:var(--sd-green)}
.sdg-stat.is-in{--w2:20%;--w1:11%}
.sdg-stat:hover{translate:0 -10px;box-shadow:0 24px 50px rgba(13,87,150,.20);--w2:62%;--w1:42%}
.sdg-stat .sdg-wave--2{height:var(--w2);transition:height .9s cubic-bezier(.3,.7,.2,1)}
.sdg-stat .sdg-wave--1{height:var(--w1);transition:height .8s cubic-bezier(.3,.7,.2,1) .12s}
.sdg-stat__bar{position:absolute;left:0;top:0;right:0;height:6px;background:var(--bar)}
.sdg-stat__eye,.sdg-stat__row,.sdg-stat__sub{position:relative}
.sdg-stat__eye{font-size:20px;font-weight:600;color:var(--sd-mute)}
.sdg-stat__row{display:flex;align-items:baseline;gap:6px;margin-top:auto}
.sdg-stat__num{font-size:72px;font-weight:800;line-height:1;letter-spacing:-3px;color:var(--num);font-variant-numeric:tabular-nums}
.sdg-stat__unit{font-size:22px;font-weight:600;color:var(--sd-ink)}
.sdg-stat__sub{font-size:17px;font-weight:300;line-height:1.6;color:var(--sd-mute2)}

/* =================== 2. 혁신제품 =================== */
.sdg-inno{margin-top:140px;padding:120px 0;background:var(--sd-sky-bg2)}
.sdg-inno__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:stretch}
.sdg-inno__card{grid-column:span 5;display:flex;flex-direction:column;justify-content:space-between;gap:32px;padding:40px;border-radius:36px;background:var(--sd-blue);color:#fff;box-shadow:0 20px 44px rgba(13,87,150,.22)}
.sdg-inno__card .sdg-badge--sky{background:#fff;box-shadow:none}
.sdg-inno__big{margin-top:22px;font-size:28px;font-weight:600;color:#fff}
.sdg-inno__big span{font-size:88px;font-weight:800;line-height:1;letter-spacing:-3px;margin-right:6px;font-variant-numeric:tabular-nums}
.sdg .sdg-inno__cap{margin-top:8px!important;font-size:20px;font-weight:300;color:#c6dbee}
.sdg-dl{display:flex;flex-direction:column}
.sdg-dl > div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;padding:14px 0;border-top:1px solid rgba(255,255,255,.18)}
.sdg-dl dt{font-size:17px;color:#c6dbee}
.sdg-dl dd{font-size:19px;font-weight:600;color:#fff}
.sdg-dl__term dd{line-height:1.6}
.sdg-dl__term strong{font-weight:700;color:#7fd1ee;white-space:nowrap}

/* 표 공통 */
.sdg-tbl{border-radius:28px;border:1px solid var(--sd-line);background:#fff;overflow:hidden}
.sdg-tbl table{width:100%;border-collapse:collapse;font-size:18px}
.sdg-tbl thead th{padding:18px 24px;background:var(--sd-blue);color:#fff;font-size:17px;font-weight:600;text-align:left;white-space:nowrap}
.sdg-tbl tbody th,.sdg-tbl tbody td{padding:15px 24px;border-top:1px solid var(--sd-line);text-align:left;vertical-align:middle;font-weight:400}
.sdg-tbl tbody tr{background:#fff;transition:background .2s ease}
.sdg-tbl tbody tr:nth-child(even){background:#f9fbfc}
.sdg-tbl tbody tr:hover{background:var(--sd-sky-bg)}
.sdg-tbl .sdg-tbl__model{font-weight:700;color:var(--sd-blue)}
.sdg-tbl__id{font-weight:600;color:var(--sd-ink);font-variant-numeric:tabular-nums;letter-spacing:.3px}
.sdg-tbl__sub{font-size:17px;font-weight:300;color:var(--sd-mute)}
.sdg .sdg-tbl__link a{display:inline-flex;align-items:center;font-size:17px;font-weight:600;color:var(--sd-blue);white-space:nowrap}
.sdg .sdg-tbl__link a:hover{color:var(--sd-sky)}
.sdg-tbl__code{font-weight:700;color:var(--sd-blue)}
.sdg-tbl__pname{font-weight:400;color:var(--sd-ink)}
.sdg-inno__tbl{grid-column:span 7}
.sdg-inno__tbl tbody th,.sdg-inno__tbl tbody td{padding:16px 28px}
.sdg-inno__tbl thead th{padding:18px 28px}

/* =================== 3. 물품식별번호 =================== */
.sdg-ids{padding-top:120px}
.sdg-acc{display:flex;flex-direction:column;gap:12px}
.sdg-acc__item{border-radius:24px;border:1px solid var(--sd-line);background:#fff;overflow:hidden;transition:border-color .3s ease,box-shadow .3s ease}
.sdg-acc__item:hover{border-color:#b9d3e8}
.sdg-acc__item[open]{border-color:#b9d3e8;box-shadow:0 16px 40px rgba(13,87,150,.08)}
.sdg-acc__sum{display:grid;grid-template-columns:auto auto minmax(0,1fr) 40px;align-items:center;gap:14px;padding:20px 24px 20px 28px;cursor:pointer;list-style:none;user-select:none}
.sdg-acc__sum::-webkit-details-marker{display:none}
.sdg-acc__sum::marker{content:""}
.sdg-acc__name{font-size:22px;font-weight:700;color:var(--sd-ink)}
.sdg-acc__cnt{padding:4px 12px;border-radius:14px;background:var(--sd-sky-bg);font-size:16px;font-weight:700;color:var(--sd-blue)}
.sdg-acc__src{font-size:16px;font-weight:300;color:var(--sd-mute2);text-align:right}
.sdg-acc__chev{width:40px;height:40px;border-radius:20px;background:var(--sd-bg2);color:var(--sd-blue);display:flex;align-items:center;justify-content:center;transition:transform .35s ease,background .3s ease,color .3s ease}
.sdg-acc__chev svg{display:block}
.sdg-acc__sum:hover .sdg-acc__chev{background:var(--sd-sky-bg)}
.sdg-acc__item[open] .sdg-acc__chev{transform:rotate(180deg);background:var(--sd-blue);color:#fff}
.sdg-acc__sum:hover .sdg-acc__name,.sdg-acc__item[open] .sdg-acc__name{color:var(--sd-blue)}
.sdg-acc__sum:focus-visible{outline:3px solid var(--sd-sky);outline-offset:-3px;border-radius:24px}
.sdg-acc__tbl{margin:0 28px 28px;border-radius:18px}
.sdg-acc__item[open] .sdg-acc__tbl{animation:sdgOpen .4s ease both}
.sdg-acc__tbl thead th{padding:14px 22px;background:var(--sd-bg);color:var(--sd-mute);font-size:16px}
.sdg-acc__tbl tbody th,.sdg-acc__tbl tbody td{padding:13px 22px;font-size:17px}
.sdg-acc__tbl th:first-child{width:46%}
.sdg-acc__tbl thead th:nth-child(2){width:22%}

/* =================== 4. 라인업 =================== */
.sdg-line{margin-top:140px;padding:120px 0;background:var(--sd-bg)}
.sdg-ltabs{display:flex;gap:4px;padding:6px;border-radius:32px;background:#fff;box-shadow:0 8px 24px rgba(13,87,150,.08);flex-shrink:0;max-width:100%;overflow-x:auto;scrollbar-width:none}
.sdg-ltabs::-webkit-scrollbar{display:none}
.sdg-ltab{display:inline-flex;align-items:center;gap:8px;height:50px;padding:0 22px;border:0;border-radius:25px;background:transparent;color:var(--sd-mute);font-size:18px;font-weight:600;white-space:nowrap;transition:background .3s ease,color .3s ease}
.sdg-ltab span{min-width:24px;height:24px;padding:0 7px;border-radius:12px;background:var(--sd-bg2);color:var(--sd-blue);font-size:14.5px;font-weight:700;line-height:24px;text-align:center;transition:background .3s ease,color .3s ease}
.sdg-ltab:hover:not(.is-on){color:var(--sd-blue)}
.sdg-ltab.is-on{background:var(--sd-blue);color:#fff}
.sdg-ltab.is-on span{background:rgba(255,255,255,.2);color:#fff}
.sdg-lpanel[hidden]{display:none}
.sdg-lpanel:focus-visible{outline:3px solid var(--sd-sky);outline-offset:6px;border-radius:28px}
.sdg-pgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.sdg-lpanel.is-anim .sdg-pc{animation:cdUp .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d,0s)}
.sdg-pc{display:flex;flex-direction:column;border-radius:28px;background:#fff;overflow:hidden;translate:0 0;transition:translate .3s ease,box-shadow .3s ease}
.sdg-pc:hover{translate:0 -8px;box-shadow:0 22px 44px rgba(13,87,150,.16)}
.sdg-pc__img{height:210px;margin:14px 14px 0;border-radius:20px;background:var(--sd-bg2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.sdg .sdg-pc__img img{display:block;width:auto;height:auto;max-width:72%;max-height:78%;transform:scale(1);transition:transform .6s ease}
.sdg-pc:hover .sdg-pc__img img{transform:scale(1.06)}
.sdg-pc__body{flex-grow:1;display:flex;flex-direction:column;gap:12px;padding:20px 24px 24px}
.sdg-pc__tags{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sdg-pc__form{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:15px;background:var(--sd-bg2);font-size:16px;font-weight:600;color:var(--sd-mute)}
.sdg .sdg-pc__title{font-size:22px;font-weight:700;letter-spacing:-.4px;color:var(--sd-ink)}
.sdg-pc__models{display:flex;flex-direction:column;gap:6px}
.sdg-pc__models li{padding:8px 12px;border-radius:12px;background:var(--sd-sky-bg2);font-size:17px;font-weight:700;color:var(--sd-blue);letter-spacing:.2px}
.sdg-pc__acts{margin-top:auto;padding-top:6px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.sdg .sdg-pc__ask{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:21px;background:var(--sd-blue);color:#fff;font-size:17px;font-weight:700;transition:background .3s ease}
.sdg .sdg-pc__ask:hover{background:var(--sd-sky);color:#fff}
.sdg .sdg-pc__mall{font-size:17px;font-weight:600;color:var(--sd-blue);white-space:nowrap}
.sdg .sdg-pc__mall:hover{color:var(--sd-sky)}
.sdg-empty{padding:48px;border-radius:28px;background:#fff;text-align:center;font-size:19px;color:var(--sd-mute2)}

/* =================== 5. 기술 =================== */
.sdg-tech{padding-top:140px}
.sdg-tgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.sdg-tc{display:flex;flex-direction:column;gap:14px;padding:32px 28px;border-radius:28px;background:var(--sd-bg);translate:0 0;transition:opacity .8s ease var(--d,0s),transform .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),translate .3s ease,background .3s ease,box-shadow .3s ease}
.sdg-tc:hover{translate:0 -8px;background:#fff;box-shadow:0 22px 44px rgba(13,87,150,.14)}
.sdg-tc__head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.sdg-tc__ico{width:52px;height:52px;border-radius:26px;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .3s ease}
.sdg-tc:hover .sdg-tc__ico{background:var(--sd-bg)}
.sdg-tc__cnt{font-size:20px;font-weight:600;color:var(--tc);white-space:nowrap}
.sdg-tc__cnt > span:first-child{font-size:52px;font-weight:800;line-height:1;letter-spacing:-2px;margin-right:2px;font-variant-numeric:tabular-nums}
.sdg .sdg-tc__name{margin-top:6px;font-size:24px;font-weight:700;letter-spacing:-.6px;line-height:1.4;color:var(--sd-ink)}
.sdg .sdg-tc__desc{font-size:18px;font-weight:300;line-height:1.7;color:var(--sd-mute)}
.sdg-tc__pats{margin-top:auto!important;padding-top:14px!important;border-top:1px solid var(--sd-line);display:flex;flex-direction:column;gap:8px}
.sdg-tc__pats li{display:flex;flex-direction:column;gap:1px;font-size:16px;font-weight:300;line-height:1.5;color:var(--sd-mute)}
.sdg-tc__pats li span{font-weight:700;color:var(--sd-blue)}
.sdg .sdg-tc__note{margin-top:auto!important;padding-top:14px;border-top:1px solid var(--sd-line);font-size:16px;font-weight:600;color:var(--sd-blue)}

/* =================== 6. 인증 =================== */
.sdg-cert{margin-top:140px;padding:88px 0;background:var(--sd-sky-bg2)}
.sdg-cert__in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px;align-items:start}
.sdg-cert__head{grid-column:span 4}
.sdg .sdg-more{display:inline-block;margin-top:22px;font-size:19px;font-weight:600;color:var(--sd-blue)}
.sdg .sdg-more:hover{color:var(--sd-sky)}
.sdg-chips{grid-column:span 8;display:flex;flex-wrap:wrap;gap:10px}
.sdg .sdg-chips a{display:inline-flex;align-items:center;min-height:48px;padding:10px 20px;border-radius:24px;background:#fff;border:1px solid #d3e3f0;color:var(--sd-blue);font-size:18px;font-weight:600;line-height:1.4;transition:background .25s ease,color .25s ease,border-color .25s ease}
.sdg .sdg-chips a:hover{background:var(--sd-blue);border-color:var(--sd-blue);color:#fff}

/* =================== 7. 설치 현장 =================== */
.sdg-proj{padding-top:140px}
.sdg-pjgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.sdg-pjgrid > li{min-width:0}
.sdg a.sdg-pj{display:flex;flex-direction:column;height:100%;border-radius:32px;background:var(--sd-bg);overflow:hidden;color:var(--sd-ink);translate:0 0;transition:translate .3s ease,box-shadow .3s ease}
.sdg a.sdg-pj:hover{translate:0 -8px;box-shadow:0 22px 44px rgba(13,87,150,.16);color:var(--sd-ink)}
.sdg-pj__img{display:block;height:220px;overflow:hidden}
.sdg .sdg-pj__img img{width:100%;height:100%;max-width:none;object-fit:cover;display:block;transform:scale(1);transition:transform 1.2s ease}
.sdg-pj:hover .sdg-pj__img img{transform:scale(1.06)}
.sdg-pj__body{padding:24px 26px 28px;display:flex;flex-direction:column;gap:12px}
.sdg-pj__tag{align-self:flex-start;padding:6px 14px;background:#fff;border-radius:16px;font-size:17px;font-weight:600;color:var(--sd-blue)}
.sdg-pj__tag--green{color:var(--sd-green)}
.sdg-pj__title{font-size:23px;font-weight:500;line-height:1.45}
.sdg a.sdg-pj:hover .sdg-pj__title{color:var(--sd-blue)}

/* =================== 8. CTA =================== */
.sdg-cta{padding:120px 0 140px}
.sdg-cta__box{position:relative;display:flex;justify-content:space-between;align-items:center;gap:32px;padding:52px 56px;border-radius:36px;background:var(--sd-blue);color:#fff;overflow:hidden}
.sdg-cta__wave.sdg-wave--2{height:46%}
.sdg-cta__wave.sdg-wave--1{height:30%}
.sdg-cta__txt,.sdg-cta__act{position:relative}
.sdg-cta__eye{font-size:20px;font-weight:700;color:#7fd1ee}
.sdg .sdg-cta__tit{margin-top:10px;font-size:40px;font-weight:600;letter-spacing:-1.2px;color:#fff}
.sdg-cta__tit span{font-weight:200}
.sdg .sdg-cta__sub{margin-top:10px!important;font-size:20px;font-weight:300;color:#c6dbee}
.sdg-cta__act{display:flex;flex-direction:column;align-items:flex-end;gap:16px;flex-shrink:0}
.sdg .sdg-cta__tel{font-size:36px;font-weight:800;letter-spacing:-.5px;color:#fff;white-space:nowrap}
.sdg .sdg-cta__tel:hover{color:#7fd1ee}
.sdg-cta__btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.sdg .sdg-btn{display:inline-flex;align-items:center;justify-content:center;height:56px;padding:0 28px;border-radius:28px;font-size:19px;font-weight:700;white-space:nowrap;transition:background .3s ease,color .3s ease,border-color .3s ease}
.sdg .sdg-btn--sky{background:var(--sd-sky);color:#fff}
.sdg .sdg-btn--sky:hover{background:#fff;color:var(--sd-blue)}
.sdg .sdg-btn--line{border:1.5px solid rgba(255,255,255,.55);color:#fff}
.sdg .sdg-btn--line:hover{background:#fff;border-color:#fff;color:var(--sd-blue)}

/* 키보드 포커스 */
.sdg a:focus-visible,.sdg button:focus-visible{outline:3px solid var(--sd-sky);outline-offset:3px}

/* =================== 반응형 =================== */
@media (max-width:1280px){
  .sdg-intro{padding-top:100px}
  .sdg-intro__grid,.sdg-cert__in{gap:32px}
  .sdg-stat{padding:30px 24px 24px}
  .sdg-stat__num{font-size:62px}
  .sdg-inno,.sdg-line{margin-top:120px;padding:100px 0}
  .sdg-inno__card{padding:36px}
  .sdg-ids,.sdg-tech,.sdg-proj{padding-top:110px}
  .sdg-pc__body{padding:18px 20px 22px}
  .sdg-tc{padding:28px 22px}
  .sdg-tc__cnt > span:first-child{font-size:46px}
  .sdg-cert{margin-top:110px}
  .sdg-cta__box{padding:48px 44px}
}
@media (max-width:1024px){
  .sdg-intro{padding-top:80px}
  .sdg-intro__grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .sdg-intro__txt,.sdg-names{grid-column:auto}
  .sdg-names{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .sdg-name{grid-template-columns:minmax(0,1fr);grid-template-areas:"where" "name" "code";justify-items:start;align-content:start;gap:6px}
  .sdg-name__code{margin-top:6px}
  .sdg-lead{font-size:20px}
  .sdg-stats{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:56px}
  .sdg-stat{min-height:220px}
  .sdg-head{flex-wrap:wrap;margin-bottom:36px}
  .sdg-src{text-align:left}
  .sdg-inno,.sdg-line{margin-top:96px;padding:88px 0}
  .sdg-inno__grid{grid-template-columns:minmax(0,1fr)}
  .sdg-inno__card,.sdg-inno__tbl{grid-column:auto}
  .sdg-inno__card{flex-direction:row;align-items:flex-start;gap:40px}
  .sdg-inno__top{flex-shrink:0}
  .sdg-dl{flex-grow:1}
  .sdg-ids,.sdg-tech,.sdg-proj{padding-top:88px}
  .sdg-pgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sdg-tgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sdg-cert{margin-top:96px;padding:72px 0}
  .sdg-cert__in{grid-template-columns:minmax(0,1fr);gap:24px}
  .sdg-cert__head,.sdg-chips{grid-column:auto}
  .sdg-pjgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sdg-cta{padding:88px 0 100px}
  .sdg .sdg-cta__tit{font-size:32px}
}
@media (max-width:860px){
  .sdg-pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sdg-inno__card{flex-direction:column;gap:28px}
  .sdg-cta__box{flex-direction:column;align-items:flex-start}
  .sdg-cta__act{align-items:flex-start}
  .sdg-cta__btns{justify-content:flex-start}
}
@media (max-width:640px){
  .sdg-intro{padding-top:56px}
  .sdg-lead{margin-top:20px!important;font-size:17px;line-height:1.8}
  .sdg-intro__grid{gap:24px}
  .sdg-names{display:flex;gap:10px}
  .sdg-name{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"where code" "name code";justify-items:stretch;align-items:center;padding:16px 18px;border-radius:20px;gap:2px 12px}
  .sdg-name__code{margin-top:0}
  .sdg-name__where{font-size:14px}
  .sdg-name__name{font-size:21px}
  .sdg-name__code{font-size:15px;padding:6px 10px;border-radius:12px}
  .sdg-stats{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:40px}
  .sdg-stat{min-height:0;gap:8px;padding:26px 22px 22px;border-radius:24px}
  .sdg-stat__eye{font-size:17px}
  .sdg-stat__row{margin-top:6px}
  .sdg-stat__num{font-size:52px;letter-spacing:-2px}
  .sdg-stat__unit{font-size:18px}
  .sdg-stat__sub{font-size:15px}
  .sdg-head{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:28px}
  .sdg-head .sd-btn{height:46px;padding:0 18px;font-size:16px}
  .sdg-src{font-size:14px}
  .sdg-note{font-size:14px;line-height:1.6}
  .sdg-inno,.sdg-line{margin-top:72px;padding:64px 0}
  .sdg-inno__card{padding:28px 22px;border-radius:24px;gap:22px}
  .sdg-inno__big{margin-top:16px;font-size:21px}
  .sdg-inno__big span{font-size:64px}
  .sdg .sdg-inno__cap{font-size:16px}
  .sdg-dl > div{grid-template-columns:76px minmax(0,1fr);gap:10px;padding:12px 0}
  .sdg-dl dt{font-size:14px}
  .sdg-dl dd{font-size:16px}
  /* 표 → 행별 카드 */
  .sdg-tbl{border-radius:20px}
  .sdg-tbl thead{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
  .sdg-tbl table,.sdg-tbl tbody{display:block}
  .sdg-tbl tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:14px 18px;border-top:1px solid var(--sd-line)}
  .sdg-tbl tbody tr:first-child{border-top:0}
  .sdg-tbl tbody th,.sdg-tbl tbody td{display:block;padding:0!important;border:0;font-size:15px}
  .sdg-tbl .sdg-tbl__model{grid-column:1 / -1;font-size:16px}
  .sdg-tbl td[data-label]::before{content:attr(data-label);display:block;font-size:13px;font-weight:400;color:var(--sd-mute2);letter-spacing:0}
  .sdg-inno__tbl .sdg-tbl__model{grid-column:1}
  .sdg-inno__tbl .sdg-tbl__id{grid-column:1}
  .sdg-inno__tbl .sdg-tbl__link{grid-column:2;grid-row:1 / span 2;align-self:center}
  .sdg .sdg-tbl__link a{font-size:15px}
  .sdg-acc{gap:10px}
  .sdg-acc__item{border-radius:20px}
  .sdg-acc__sum{grid-template-columns:minmax(0,1fr) auto 36px;gap:4px 10px;padding:16px 14px 16px 18px}
  .sdg-acc__name{font-size:18px}
  .sdg-acc__cnt{font-size:14px;padding:3px 10px}
  .sdg-acc__src{grid-column:1 / span 2;grid-row:2;text-align:left;font-size:13px}
  .sdg-acc__chev{grid-column:3;grid-row:1 / span 2;width:36px;height:36px}
  .sdg-acc__tbl{margin:0 12px 12px;border-radius:14px}
  .sdg-acc__tbl th:first-child,.sdg-acc__tbl thead th:nth-child(2){width:auto}
  .sdg-tbl__code{display:block}
  .sdg-ltabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;width:100%;padding:5px;border-radius:26px}
  .sdg-ltab{flex-direction:column;justify-content:center;gap:3px;height:60px;padding:0 4px;border-radius:21px;font-size:15px}
  .sdg-ltab span{height:20px;min-width:20px;line-height:20px;font-size:13px}
  .sdg-pgrid{grid-template-columns:minmax(0,1fr);gap:12px}
  .sdg-pc{flex-direction:row;align-items:flex-start;border-radius:24px}
  .sdg-pc__img{width:100px;height:100px;flex-shrink:0;margin:16px 0 0 16px;border-radius:16px}
  .sdg-pc__body{min-width:0;gap:10px;padding:16px 16px 18px 14px}
  .sdg-badge,.sdg-pc__form{height:26px;padding:0 10px;font-size:13px}
  .sdg .sdg-pc__title{font-size:18px}
  .sdg-pc__models{flex-direction:row;flex-wrap:wrap;gap:5px}
  .sdg-pc__models li{font-size:14px;padding:5px 9px;border-radius:10px}
  .sdg-pc__acts{gap:8px 14px;justify-content:flex-start}
  .sdg .sdg-pc__ask{height:40px;padding:0 16px;font-size:15px}
  .sdg .sdg-pc__mall{font-size:15px}
  .sdg-tgrid{grid-template-columns:minmax(0,1fr);gap:12px}
  .sdg-tc{padding:24px 20px;border-radius:24px;gap:12px}
  .sdg-tc__cnt > span:first-child{font-size:40px}
  .sdg .sdg-tc__name{font-size:20px;margin-top:2px}
  .sdg .sdg-tc__desc{font-size:16px}
  .sdg-tech,.sdg-ids,.sdg-proj{padding-top:64px}
  .sdg-cert{margin-top:72px;padding:56px 0}
  .sdg .sdg-more{margin-top:14px;font-size:16px}
  .sdg-chips{gap:8px}
  .sdg .sdg-chips a{min-height:40px;padding:8px 14px;font-size:15px;border-radius:20px}
  /* 설치 현장: 가로 스와이프(scroll-snap) */
  .sdg-pjgrid{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(var(--sd-gutter) * -1);padding:0 var(--sd-gutter) 8px;scroll-padding:0 var(--sd-gutter);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .sdg-pjgrid::-webkit-scrollbar{display:none}
  .sdg-pjgrid > li{flex:0 0 78%;scroll-snap-align:start}
  .sdg a.sdg-pj{border-radius:24px}
  .sdg-pj__img{height:180px}
  .sdg-pj__body{padding:18px 20px 22px}
  .sdg-pj__title{font-size:19px}
  .sdg-pj__tag{font-size:15px}
  .sdg-cta{padding:64px 0 80px}
  .sdg-cta__box{padding:32px 22px;border-radius:24px;gap:24px}
  .sdg-cta__eye{font-size:16px}
  .sdg .sdg-cta__tit{font-size:27px;letter-spacing:-.6px}
  .sdg .sdg-cta__sub{font-size:16px;line-height:1.6}
  .sdg-cta__act{width:100%}
  .sdg .sdg-cta__tel{font-size:30px}
  .sdg-cta__btns{flex-direction:column;width:100%}
  .sdg .sdg-btn{width:100%;height:52px;font-size:17px}
}

/* 움직임 줄이기: 등장·웨이브·호버 이동 끔 */
@media (prefers-reduced-motion:reduce){
  .sdg.is-js [data-sdg-rv]{opacity:1;transform:none;transition:none}
  .sdg-stat,.sdg-name,.sdg-pc,.sdg-tc,.sdg a.sdg-pj{translate:none!important;transition:box-shadow .2s ease,background .2s ease}
  .sdg-stat .sdg-wave--1,.sdg-stat .sdg-wave--2,.sdg-acc__chev,.sdg-pc__img img,.sdg-pj__img img{transition:none}
  .sdg-pc:hover .sdg-pc__img img,.sdg-pj:hover .sdg-pj__img img{transform:none}
  .sdg-lpanel.is-anim .sdg-pc,.sdg-acc__item[open] .sdg-acc__tbl{animation:none}
}