/* ESG경영 페이지 전용 스타일 — 모든 규칙은 .esg 스코프 (기존 페이지 영향 없음)
   컬러/타이포는 common.css 토큰 기준: 포인트 #F37321, 타이틀 #111, 본문 #666, 라인 #DDD, 배경 #F5F5F5 */

/* 상단 비주얼 (ESG 전용 배경) */
.top-bg.bg-5{background:linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,.45)),url('/static/images/esg/top.jpg') center 45%/cover no-repeat;}

/* 섹션 탭 */
.esg .esg-tabs{display:flex;justify-content:center;flex-wrap:nowrap;gap:0;border-bottom:1px solid #DDD;margin:0;padding:0;list-style:none;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;scroll-behavior:smooth;}
.esg .esg-tabs::-webkit-scrollbar{display:none;}
.esg .esg-tabs .nav-link{flex:none;scroll-snap-align:start;white-space:nowrap;background:none;border:0;border-bottom:3px solid transparent;border-radius:0;color:#666;font-size:1.05rem;font-weight:500;padding:1.1rem 1.2rem .9rem;letter-spacing:-.02em;}
.esg .esg-tabs .nav-link:hover{color:#F37321;}
.esg .esg-tabs .nav-link.active{color:#F37321;border-bottom-color:#F37321;font-weight:700;background:none;}
.esg .esg-tabs-wrap{position:sticky;top:0;z-index:50;background:#fff;}

/* 공통 */
.esg .esg-eyebrow{display:block;font-family:'GmarketSans',sans-serif;font-weight:500;font-size:.9rem;color:#F37321;letter-spacing:.06em;margin-bottom:.9rem;}
.esg .section-header{margin-top:4.5rem;}
.esg .section-header .display-6{display:block;line-height:1.3;}
.esg .section-header .header-sub{margin:0 auto;max-width:860px;line-height:1.7;}
.esg .esg-hero-img{display:block;width:100%;height:340px;object-fit:cover;border-radius:15px;margin-top:2.5rem;}
.esg .esg-policy-img{height:500px;object-position:center 40%;}
@media (max-width:576px){.esg .esg-policy-img{height:260px;}}
/* ESG경영방침 배너 콜라주 (미사용) */
.esg .esg-collage{position:relative;margin-top:2.5rem;padding:3.25rem 2.5rem 84px;border-radius:18px;background:linear-gradient(180deg,#FFFFFF 0%,#F3F7F1 100%);overflow:hidden;}
.esg .esg-collage-scroll{position:relative;z-index:1;}
.esg .esg-badges{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));list-style:none;margin:0 0 -42px;padding:0;position:relative;z-index:2;}
.esg .esg-badges li{display:flex;flex-direction:column;align-items:center;gap:.5rem;}
.esg .esg-badges .b{width:84px;height:84px;border-radius:50%;border:3px solid #fff;box-shadow:inset 0 0 0 6px rgba(255,255,255,.14),0 8px 18px rgba(27,42,74,.14);display:flex;align-items:center;justify-content:center;}
.esg .esg-badges svg{width:36px;height:36px;display:block;}
.esg .esg-ribbon{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;background:#fff;height:300px;border-radius:14px 14px 50% 50% / 14px 14px 22% 22%;overflow:hidden;}
.esg .esg-ribbon .ph{position:relative;background:#EEF1EE;border:1.5px dashed #C3CCC4;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.3rem;padding:3.5rem .75rem 1rem;text-align:center;font-size:.8rem;line-height:1.45;color:#7D877F;overflow:hidden;}
.esg .esg-ribbon .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.82) contrast(.96) brightness(1.03) sepia(.06);}
.esg .esg-ribbon .ph:has(img){border:0;}
.esg .esg-ribbon .ph:has(img)::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,250,244,.12) 0%,rgba(27,42,74,.10) 100%);pointer-events:none;}
.esg .esg-ribbon .ph b{font-size:.9rem;color:#1B2A4A;}
.esg .esg-leaf{position:absolute;bottom:12px;width:150px;height:60px;z-index:0;border:1.5px dashed #CFE1CB;border-radius:12px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.7rem;line-height:1.4;color:#98B593;background:transparent;opacity:.85;}
.esg .esg-leaf-l{left:12px;}
.esg .esg-leaf-r{right:12px;}
.esg .sub-title{text-align:center;}
.esg .sub-title p{max-width:760px;margin:-1.8rem auto 2.2rem;font-size:1rem;line-height:1.8;color:#666;}
.esg .sub-title + .row{margin-top:0;}
.esg .esg-block{padding-top:5rem;}
.esg .esg-block.tight{padding-top:1.25rem;}
.esg .esg-block:last-child{padding-bottom:5rem;}
.esg .esg-card{height:100%;background:#fff;border:1px solid #DDD;border-radius:15px;padding:2.25rem 2rem;}
.esg .esg-card.gray{background:#F5F5F5;border:0;}
.esg .esg-card h5{margin:0 0 .9rem;font-size:1.25rem;font-weight:700;color:#111;letter-spacing:-.03em;}
.esg .esg-card p{margin:0 0 .75rem;font-size:.97rem;line-height:1.85;color:#666;letter-spacing:-.02em;}
.esg .esg-card p:last-child{margin-bottom:0;}
.esg .esg-card .esg-no{font-family:'GmarketSans',sans-serif;font-weight:700;font-size:1.75rem;color:#F37321;}
.esg .esg-card .esg-no + h5{margin-top:1rem;font-size:1.125rem;}
.esg .esg-tag{font-family:'GmarketSans',sans-serif;font-weight:500;font-size:.8rem;color:#F37321;letter-spacing:.06em;}
.esg .esg-tag + h5{margin-top:.6rem;}
.esg .esg-closing{margin:2.25rem 0 0;text-align:center;font-size:1.06rem;line-height:1.8;font-weight:500;color:#111;letter-spacing:-.025em;}
.esg .esg-note{margin:1.5rem 0 0;text-align:center;font-size:.8rem;line-height:1.7;color:#777;}

/* 수치 박스 */
.esg .esg-stat{height:100%;background:#fff;border:1px solid #DDD;border-radius:15px;padding:2rem 1rem;text-align:center;}
.esg .esg-stat .num{font-family:'GmarketSans',sans-serif;font-weight:700;font-size:3rem;line-height:1;color:#F37321;}
.esg .esg-stat .num small{font-size:1.5rem;}
.esg .esg-stat .label{margin-top:.9rem;font-size:.95rem;color:#666;word-break:keep-all;}
.esg .esg-stat.gray{background:#F5F5F5;border:0;text-align:left;padding:2.25rem 2rem;}
.esg .esg-stat.gray .num{font-size:2.4rem;}
.esg .esg-stat.gray .num small{font-size:1.25rem;}

/* 연령대 */
.esg .esg-age{background:#F5F5F5;border-radius:10px;padding:.9rem .5rem;text-align:center;}
.esg .esg-age.on{border:1px solid #F37321;}
.esg .esg-age span{display:block;font-size:.8rem;color:#777;}
.esg .esg-age b{display:block;margin-top:.35rem;font-family:'GmarketSans',sans-serif;font-size:1.4rem;color:#111;}
.esg .esg-age.on b{color:#F37321;}

/* 표 */
.esg .esg-table{border:1px solid #DDD;border-radius:15px;overflow:hidden;background:#fff;}
.esg .esg-table table{width:100%;margin:0;border-collapse:collapse;font-size:.95rem;}
.esg .esg-table th{background:#F5F5F5;text-align:left;padding:.95rem 1.4rem;font-weight:700;color:#111;border-bottom:1px solid #DDD;}
.esg .esg-table td{padding:.95rem 1.4rem;border-bottom:1px solid #E1E1E1;color:#666;line-height:1.75;vertical-align:middle;}
.esg .esg-table tr:last-child td{border-bottom:0;}
.esg .esg-table td.key{font-weight:500;color:#111;}
.esg .esg-table .no{font-family:'GmarketSans',sans-serif;font-weight:700;color:#F37321;margin-right:.6rem;}
.esg .esg-table .pct{text-align:right;font-family:'GmarketSans',sans-serif;font-weight:700;color:#F37321;}

/* 인증서 */
.esg .esg-cert{height:100%;background:#fff;border:1px solid #DDD;border-radius:15px;padding:1.5rem;}
.esg .esg-cert .thumb{background:#F5F5F5;border-radius:10px;padding:1rem;margin-bottom:1.1rem;}
.esg .esg-cert img{display:block;width:100%;aspect-ratio:1/1.414;object-fit:contain;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.12);}
.esg .esg-cert b{display:block;font-size:1.06rem;color:#111;}
.esg .esg-cert span{display:block;margin-top:.25rem;font-size:.875rem;color:#666;}
.esg .esg-cert em{display:block;margin-top:.75rem;font-style:normal;font-size:.85rem;font-weight:500;color:#F37321;}

/* 대표이사 메시지 */
.esg .esg-ceo .lead-q{margin:0 0 1.25rem;font-size:1.45rem;line-height:1.55;font-weight:700;color:#111;letter-spacing:-.035em;}
.esg .esg-ceo p{font-size:1rem;line-height:1.9;}
.esg .esg-ceo strong{color:#111;}
.esg .esg-ceo .sign{margin-top:1.5rem;text-align:center;font-size:1.125rem;font-weight:700;color:#111;}

/* 정책 자료 */
.esg .esg-doc{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:100%;background:#fff;border:1px solid #DDD;border-radius:15px;padding:1.6rem 1.75rem;color:#111;text-decoration:none;}
.esg .esg-doc:hover{border-color:#F37321;}
.esg .esg-doc b{display:block;font-size:1.03rem;}
.esg .esg-doc span{display:block;margin-top:.35rem;font-size:.875rem;color:#666;}
.esg .esg-doc i{flex:none;font-style:normal;font-size:.8rem;font-weight:700;color:#fff;background:#F37321;border-radius:8px;padding:.45rem .9rem;}

/* 다음 섹션 */
.esg .esg-next{display:flex;align-items:center;justify-content:space-between;width:100%;margin:0 0 5rem;background:#F5F5F5;border:1px solid #DDD;border-radius:15px;padding:1.6rem 2rem;font-family:inherit;}
.esg .esg-next:hover{border-color:#F37321;}
.esg .esg-next span{font-size:.875rem;color:#777;}
.esg .esg-next b{font-size:1.125rem;color:#111;}

/* ≤992px */
@media (max-width:991.98px){
  .esg .esg-tabs{justify-content:flex-start;}
}
/* ≤576px (모바일) */
@media (max-width:576px){
  .esg .section-header{margin-top:3rem;}
  .esg .esg-tabs{padding-right:28px;}
  .esg .esg-tabs-wrap::after{content:"";position:absolute;top:0;right:0;bottom:1px;width:36px;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,0),#fff 80%);}
  .esg .esg-tabs .nav-link{font-size:.9rem;padding:.95rem .75rem .75rem;}
  .esg .esg-eyebrow{font-size:.8rem;}
  .esg .esg-hero-img{height:260px;margin-top:1.75rem;}
  .esg .esg-collage{margin-top:1.75rem;padding:2rem 0 76px;border-radius:14px;}
  .esg .esg-collage-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 1rem;}
  .esg .esg-collage-scroll::-webkit-scrollbar{display:none;}
  .esg .esg-collage-track{width:760px;}
  .esg .esg-badges{margin-bottom:-30px;}
  .esg .esg-badges .b{width:60px;height:60px;}
  .esg .esg-badges svg{width:26px;height:26px;}
  .esg .esg-ribbon{height:230px;}
  .esg .esg-leaf{width:110px;height:48px;bottom:10px;font-size:.58rem;}
  .esg .esg-leaf-l{left:10px;}
  .esg .esg-leaf-r{right:10px;}
  .esg .sub-title p{margin:-1.2rem auto 1.5rem;font-size:.94rem;}
  .esg .esg-block{padding-top:3rem;}
  .esg .esg-block.tight{padding-top:1rem;}
  .esg .esg-block:last-child{padding-bottom:3.5rem;}
  .esg .esg-card{padding:1.5rem 1.25rem;}
  .esg .esg-card h5{font-size:1.125rem;}
  .esg .esg-card p{font-size:.9rem;line-height:1.8;}
  .esg .esg-card .esg-no{font-size:1.5rem;}
  .esg .esg-card .esg-no + h5{margin-top:.75rem;font-size:.97rem;line-height:1.4;}
  .esg .esg-card.dir p{font-size:.84rem;line-height:1.65;}
  .esg .esg-closing{font-size:.97rem;}
  .esg .esg-stat{padding:1.1rem .35rem;}
  .esg .esg-stat .num{font-size:1.6rem;}
  .esg .esg-stat .num small{font-size:.875rem;}
  .esg .esg-stat .label{margin-top:.6rem;font-size:.75rem;line-height:1.5;letter-spacing:-.04em;}
  .esg .esg-stat.gray{padding:1.5rem 1.25rem;}
  .esg .esg-stat.gray .num{font-size:2rem;}
  .esg .esg-age b{font-size:1.06rem;}
  .esg .esg-age span{font-size:.72rem;}
  .esg .esg-table table{font-size:.8rem;line-height:1.6;}
  .esg .esg-table th,.esg .esg-table td{padding:.75rem;}
  .esg .esg-table.sdg td.key,.esg .esg-table.sdg th:first-child{white-space:nowrap;letter-spacing:-.04em;padding-right:.4rem;}
  .esg .esg-table .no{margin-right:.35rem;}
  .esg .esg-cert{padding:.75rem;}
  .esg .esg-cert .thumb{padding:.6rem;margin-bottom:.75rem;}
  .esg .esg-ceo .lead-q{font-size:1.2rem;}
  .esg .esg-ceo p{font-size:.9rem;}
  .esg .esg-doc{padding:1.25rem;}
  .esg .esg-next{padding:1.25rem;margin-bottom:3.5rem;}
  .esg .esg-next b{font-size:1rem;}
}


/* ===== 페이지 분리 추가분 (2026.10.19) ===== */
/* 탭: button → a 링크 */
.esg .esg-tabs .nav-link{text-decoration:none;display:block;}
/* 다음 페이지: button → a 링크 */
.esg a.esg-next{text-decoration:none;}
.esg a.esg-next:hover b{color:#F37321;}