:root{
    --site_width:1440px;
    --color_primary:#1E6FA8;
    --color_secondary:#000080;
    --header_height:80px;
    --scroll_h:56px;
    --bg:#ffffff;
    --bg_soft:#CDC6BE;
    --line:#e8efe8;
    --txt:#0f172a;
    --muted:#64748b;
    --radius:16px;
    --shadow:0 8px 22px rgba(2,6,23,.06);
    --shadow2:0 10px 28px rgba(2,6,23,.08);
}
*,*::before,*::after{box-sizing:border-box;}html,body{margin:0;padding:0;}
body{font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,Roboto,"Helvetica Neue","Segoe UI","Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif;color:#111;line-height:1.5;word-break:keep-all;}a{color:inherit;text-decoration:none;}a:hover,a:focus,a:active{text-decoration:none;}a:focus-visible,button:focus-visible,input:focus-visible,
textarea:focus-visible,select:focus-visible{outline:2px solid var(--color_primary);outline-offset:2px;}ul,ol{margin:0;padding:0;list-style:none;}img{vertical-align:middle;border:0;max-width:100%;height:auto;}
button{background:none;border:0;cursor:pointer;font:inherit;color:inherit;}
table{border-collapse:collapse;border-spacing:0;}
input,textarea,select{font-family:inherit;}::placeholder{color:#abb4bd;opacity:1;}::-webkit-input-placeholder{color:#abb4bd;}:-ms-input-placeholder{color:#abb4bd;}i{font-style:normal;}

/* ===================================================
   HEADER / NAV
=================================================== */
#site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:900;
  height:var(--header_height);
  background:#fff;
  box-shadow:0 2px 12px rgba(0,0,0,.07);
  transition:height .3s ease;
}
#site-header.scrolled{
  height:var(--scroll_h);
}
.header-inner{
  max-width:1440px;
  height:100%;
  margin:0 auto;
  padding:0 40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

/* 로고 */
.site-logo{display:flex;align-items:center;flex-shrink:0;}
.site-logo img{
  height:26px;
  width:auto;
  object-fit:contain;
  transition:height .3s ease;
}
#site-header.scrolled .site-logo img{height:26px;}

/* 전화+햄버거 묶음 */
.header-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}

/* 전화 아이콘 버튼 */
.header-tel{
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  flex-shrink:0;
  color:var(--color_primary);
  font-size:14px;
  border-radius:50%;
  border:1.5px solid var(--color_primary);
  transition:background .2s,color .2s;
  text-decoration:none;
}
.header-tel:hover{
  background:var(--color_primary);
  color:#fff;
}

/* GNB */
.gnb ul{
  display:flex;
  align-items:center;
  gap:66px;
}
.gnb a{
  font-size:17px;
  font-weight:600;
  color:var(--txt);
  position:relative;
  padding-bottom:4px;
  white-space:nowrap;
  transition:color .2s;
}
.gnb a::after{
  content:'';
  position:absolute;
  bottom:0;left:0;
  width:0;height:2px;
  background:var(--color_primary);
  transition:width .25s ease;
}
.gnb a:hover,.gnb a:focus-visible{
  color:var(--color_primary);
}
.gnb a:hover::after,.gnb a:focus-visible::after{width:100%;}

/* 햄버거 버튼 (PC·모바일 항상 노출) */
.hamburger{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:5px;
  width:44px;
  height:44px;
  flex-shrink:0;
  padding:6px;
  border-radius:8px;
  transition:background .2s, color .2s;
}
.hamburger:hover span{background:var(--color_primary);}
.hamburger span{
  display:block;
  width:24px;
  height:2px;
  background:var(--txt);
  border-radius:2px;
  transition:transform .3s ease, opacity .2s ease;
}
.hamburger.is-active span:nth-child(1){
  transform:translateY(7px) rotate(45deg);
}
.hamburger.is-active span:nth-child(2){opacity:0;}
.hamburger.is-active span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
}

/* ===================================================
   SIDE DRAWER
=================================================== */
.sidedrawer-backdrop{
  position:fixed;
  inset:0;
  top:var(--header_height);
  z-index:800;
  background:rgba(0,0,0,.4);
  opacity:0;
  pointer-events:none;
  transition:opacity .3s;
}
.sidedrawer-backdrop.is-open{
  opacity:1;
  pointer-events:auto;
}
.sidedrawer{
  position:fixed;
  top:var(--header_height);
  left:0;
  width:80%;
  max-width:480px;
  height:calc(100vh - var(--header_height));
  z-index:850;
  background:#fff;
  box-shadow:4px 0 28px rgba(0,0,0,.14);
  transform:translateX(-100%);
  transition:transform .35s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;
}
.sidedrawer.is-open{
  transform:translateX(0);
}
.sidedrawer-nav{
  padding:36px 28px;
}
.sidedrawer-nav ul{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.sidedrawer-nav a{
  display:block;
  padding:14px 16px;
  font-size:16px;
  font-weight:600;
  color:var(--txt);
  border-radius:8px;
  border-left:3px solid transparent;
  transition:background .2s,color .2s,border-color .2s;
}
.sidedrawer-nav a:hover{
  background:rgba(30,111,168,.07);
  color:var(--color_primary);
  border-left-color:var(--color_primary);
}
@media(max-width:768px){
  .sidedrawer{display:none;}
  .sidedrawer-backdrop{display:none;}
}

/* 헤더 높이만큼 본문 여백 */
body{padding-top:var(--header_height);}

/* ===================================================
   HERO
=================================================== */
.hero{
  position:relative;
  width:100%;
  height:calc(100vh - var(--header_height));
  min-height:560px;
  display:flex;
  align-items:center;
  overflow:hidden;
}
.hero-bg{
  position:absolute;
  inset:0;
  background:url('/images/visual_hero1.png') center/cover no-repeat;
  transform:scale(1.04);
  transition:transform 8s ease;
}
.hero:hover .hero-bg{transform:scale(1);}
.hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,rgba(5,15,35,.72) 0%,rgba(5,15,35,.38) 60%,rgba(5,15,35,.10) 100%);
}
.hero-inner{
  position:relative;
  z-index:2;
  max-width:1440px;
  width:100%;
  margin:0 auto;
  padding:0 80px;
}
.hero-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.65);
  margin-bottom:24px;
}
.hero-eyebrow::before{
  content:'';
  display:block;
  width:32px;
  height:2px;
  background:var(--color_primary);
  border-radius:2px;
}
.hero-title{
  font-size:clamp(36px,5.2vw,52px);
  font-weight:800;
  line-height:1.15;
  letter-spacing:-.03em;
  color:#fff;
  margin:0 0 24px;
}
.hero-title em{
  font-style:normal;
  color:var(--color_primary);
}
.hero-desc{
  font-size:clamp(15px,1.3vw,18px);
  font-weight:400;
  line-height:1.75;
  color:rgba(255,255,255,.72);
  max-width:560px;
  margin:0 0 44px;
}
.hero-actions{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
}
.hero-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 30px;
  border-radius:50px;
  font-size:15px;
  font-weight:600;
  letter-spacing:.01em;
  transition:all .25s;
  cursor:pointer;
  text-decoration:none;
}
.hero-btn--primary{
  background:var(--color_primary);
  color:#fff;
  border:2px solid var(--color_primary);
}
.hero-btn--primary:hover{
  background:transparent;
  color:#fff;
}
.hero-btn--outline{
  background:transparent;
  color:#fff;
  border:2px solid rgba(255,255,255,.5);
}
.hero-btn--outline:hover{
  border-color:#fff;
  background:rgba(255,255,255,.08);
}
.hero-scroll{
  position:absolute;
  bottom:36px;
  left:50%;
  transform:translateX(-50%);
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.45);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.hero-scroll span{
  display:block;
  width:1px;
  height:40px;
  background:linear-gradient(to bottom,rgba(255,255,255,.0),rgba(255,255,255,.5));
  animation:scrollLine 1.8s ease infinite;
}
@keyframes scrollLine{
  0%{opacity:0;transform:scaleY(0);transform-origin:top;}
  50%{opacity:1;}
  100%{opacity:0;transform:scaleY(1);transform-origin:top;}
}

/* hero 반응형 */
@media(max-width:768px){
  .hero-inner{padding:0 24px;}
  .hero-title{letter-spacing:-.02em;}
}

/* ===================================================
   STRENGTHS
=================================================== */
.strengths{
  padding:120px 0 100px;
  background:#f8fafc;
}
.strengths-inner{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px;
}

/* section head */
.section-head{
  text-align:center;
  margin-bottom:72px;
}
.section-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--color_primary);
  margin-bottom:16px;
}
.section-eyebrow::before,
.section-eyebrow::after{
  content:'';
  display:block;
  width:24px;
  height:1.5px;
  background:var(--color_primary);
  border-radius:2px;
}
.section-title{
  font-size:clamp(26px,3.2vw,34px);
  font-weight:800;
  letter-spacing:-.03em;
  color:var(--txt);
  line-height:1.2;
  margin:0 0 18px;
}
.section-title em{
  font-style:normal;
  color:var(--color_primary);
}
.section-desc{
  font-size:16px;
  color:var(--muted);
  line-height:1.75;
}

/* grid */
.strengths-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:28px;
}

/* card */
.str-card{
  position:relative;
  background:#fff;
  border-radius:20px;
  padding:40px 32px 36px;
  box-shadow:var(--shadow);
  border:1.5px solid transparent;
  overflow:hidden;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s;
}
.str-card::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:4px;
  background:var(--color_primary);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .3s ease;
}
.str-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow2);
  border-color:rgba(30,111,168,.15);
}
.str-card:hover::before{transform:scaleX(1);}

.str-card__num{
  font-size:48px;
  font-weight:900;
  color:rgba(30,111,168,.07);
  line-height:1;
  margin-bottom:16px;
  letter-spacing:-.04em;
}
.str-card__icon{
  position:absolute;
  top:32px;
  right:28px;
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(30,111,168,.1);
  color:var(--color_primary);
  font-size:20px;
  border-radius:12px;
  transition:background .3s,color .3s;
}
.str-card:hover .str-card__icon{
  background:var(--color_primary);
  color:#fff;
}
.str-card__title{
  font-size:20px;
  font-weight:700;
  color:var(--txt);
  margin:0 0 12px;
  line-height:1.3;
}
.str-card__title span{
  display:block;
  font-size:12px;
  font-weight:500;
  color:var(--color_primary);
  letter-spacing:.05em;
  margin-top:4px;
  text-transform:uppercase;
}
.str-card__body{
  font-size:14px;
  line-height:1.75;
  color:var(--muted);
  margin:0 0 20px;
}
.str-card__point{
  display:flex;
  align-items:flex-start;
  gap:8px;
  font-size:13px;
  font-weight:600;
  color:var(--color_primary);
  line-height:1.55;
}
.str-card__point i{
  margin-top:2px;
  flex-shrink:0;
}

@media(max-width:1100px){
  .strengths-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:768px){
  .strengths{padding:72px 0 60px;}
  .strengths-inner{padding:0 24px;}
  .strengths-grid{grid-template-columns:1fr; gap:20px;}
  .section-head{margin-bottom:48px;}
}

/* ===================================================
   PRODUCTS SECTION (홈 제품 그리드)
=================================================== */
.products-section{
  padding:120px 0 100px;
  background:#fff;
}
.products-inner{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px;
}
/* 그리드 */
.prod-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
/* 카드 */
.prod-card{
  display:block;
  text-decoration:none;
  background:#f8fafc;
  border-radius:14px;
  overflow:hidden;
  border:1.5px solid #e2e8f0;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s;
}
.prod-card:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 32px rgba(30,111,168,.12);
  border-color:var(--color_primary);
}
.prod-card__thumb{
  width:100%;
  aspect-ratio:1/1;
  overflow:hidden;
  background:transparent;
}
.prod-card__thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:8px;
  transition:opacity .3s ease;
}
.prod-card:hover .prod-card__thumb img{
  opacity:.85;
}
.prod-card__noimg{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#cbd5e1;
  font-size:2.4rem;
}
.prod-card__info{
  padding:16px 18px 18px;
}
.prod-card__code{
  display:inline-block;
  font-family:monospace;
  font-size:10px;
  font-weight:800;
  letter-spacing:.1em;
  color:var(--color_primary);
  background:#eff8ff;
  border:1px solid #bae6fd;
  border-radius:4px;
  padding:2px 7px;
  margin-bottom:8px;
}
.prod-card__name{
  font-size:14px;
  font-weight:700;
  color:var(--txt);
  line-height:1.45;
  margin:0;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
@media(max-width:1100px){
  .products-inner{ padding:0 48px; }
  .prod-grid{ grid-template-columns:repeat(3,1fr); gap:20px; }
}
@media(max-width:768px){
  .products-section{ padding:72px 0 60px; }
  .products-inner{ padding:0 24px; }
  .prod-grid{ grid-template-columns:repeat(2,1fr); gap:16px; }
}

/* ===================================================
   BOARD SECTION (공지사항 + FAQ)
=================================================== */
/* ===== BOARD SECTION ===== */
.board-section{
  padding:100px 0 100px;
  background:#f8fafc;
}
.board-section__head{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px 48px;
  text-align:center;
}
.board-section__head .section-eyebrow{
  font-size:13px;
  font-weight:700;
  letter-spacing:.12em;
  color:var(--color_primary);
  text-transform:uppercase;
  margin:0 0 10px;
}
.board-section__head .section-title{
  font-size:36px;
  font-weight:800;
  color:var(--txt);
  margin:0 0 14px;
  line-height:1.25;
}
.board-section__head .section-desc{
  font-size:15px;
  color:var(--muted);
  margin:0;
}
/* FAQ 아코디언 */
.faq-accordion{
  padding:8px 0;
}
.faq-item{
  border-bottom:1px solid #f1f5f9;
}
.faq-item:last-child{ border-bottom:none; }
.faq-q{
  width:100%;
  background:none;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 24px;
  text-align:left;
  transition:background .18s;
}
.faq-q:hover{ background:#f0f9ff; }
.faq-q span{
  font-size:14px;
  font-weight:500;
  color:var(--txt);
  flex:1;
  line-height:1.5;
}
.faq-icon{
  font-size:13px;
  color:var(--muted);
  flex-shrink:0;
  transition:transform .28s cubic-bezier(.4,0,.2,1);
}
.faq-item.open .faq-icon{
  transform:rotate(180deg);
  color:var(--color_primary);
}
.faq-item.open .faq-q span{ color:var(--color_primary); }
.faq-a{
  overflow:hidden;
  max-height:0;
  transition:max-height .35s cubic-bezier(.4,0,.2,1);
}
.faq-item.open .faq-a{ max-height:400px; }
.faq-a__inner{
  padding:0 24px 18px 24px;
  font-size:13.5px;
  color:var(--muted);
  line-height:1.75;
  border-top:1px solid #f1f5f9;
  padding-top:14px;
}
@media(max-width:768px){
  .board-section__head .section-title{ font-size:26px; }
  .board-section__head{ padding:0 24px 36px; }
}
.board-inner{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
}
.board-col{
  background:#fff;
  border-radius:16px;
  border:1.5px solid #e2e8f0;
  overflow:hidden;
}
.board-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 24px;
  border-bottom:1.5px solid #e2e8f0;
}
.board-title{
  font-size:16px;
  font-weight:800;
  color:var(--txt);
  margin:0;
  display:flex;
  align-items:center;
  gap:8px;
}
.board-title i{
  color:var(--color_primary);
  font-size:15px;
}
.board-more{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:12px;
  font-weight:700;
  color:var(--muted);
  text-decoration:none;
  transition:color .2s;
}
.board-more:hover{
  color:var(--color_primary);
}
.board-list{
  list-style:none;
  margin:0;
  padding:0;
}
.board-list li{
  border-bottom:1px solid #f1f5f9;
}
.board-list li:last-child{
  border-bottom:none;
}
.board-list li a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 24px;
  text-decoration:none;
  transition:background .18s;
  gap:12px;
}
.board-list li a:hover{
  background:#f0f9ff;
}
.board-item__title{
  font-size:14px;
  color:var(--txt);
  font-weight:500;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  flex:1;
  min-width:0;
}
.board-item__date{
  font-size:12px;
  color:var(--muted);
  flex-shrink:0;
  font-variant-numeric:tabular-nums;
}
.board-q{
  font-style:normal;
  font-weight:800;
  color:var(--color_primary);
  margin-right:6px;
}
.board-empty{
  padding:28px 24px;
  font-size:14px;
  color:var(--muted);
  text-align:center;
}
/* 공지사항 버튼 (리스트 아이템) */
.board-notice-btn{
  width:100%;
  background:none;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 24px;
  text-align:left;
  transition:background .18s;
  gap:12px;
}
.board-notice-btn:hover{ background:#f0f9ff; }
/* 공지 모달 */
.nm-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.45);
  z-index:9900;
  align-items:center;
  justify-content:center;
  padding:24px;
  backdrop-filter:blur(4px);
}
.nm-overlay.active{ display:flex; }
.nm-box{
  background:#fff;
  border-radius:16px;
  width:100%;
  max-width:640px;
  max-height:80vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  box-shadow:0 24px 80px rgba(0,0,0,.18);
  animation:nmIn .22s cubic-bezier(.4,0,.2,1);
}
@keyframes nmIn{
  from{ opacity:0; transform:translateY(18px) scale(.97); }
  to  { opacity:1; transform:none; }
}
.nm-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:24px 24px 16px;
  border-bottom:1.5px solid #e2e8f0;
  flex-shrink:0;
}
.nm-date{
  font-size:12px;
  color:var(--muted);
  margin:0 0 6px;
  font-variant-numeric:tabular-nums;
}
.nm-title{
  font-size:18px;
  font-weight:800;
  color:var(--txt);
  margin:0;
  line-height:1.4;
}
.nm-close{
  flex-shrink:0;
  background:none;
  border:none;
  cursor:pointer;
  font-size:20px;
  color:var(--muted);
  padding:2px 4px;
  transition:color .18s;
}
.nm-close:hover{ color:var(--txt); }
.nm-body{
  flex:1;
  overflow-y:auto;
  padding:24px;
  font-size:14.5px;
  color:var(--txt);
  line-height:1.85;
}
.nm-body img{ max-width:100%; height:auto; border-radius:8px; }
.nm-foot{
  padding:14px 24px;
  border-top:1.5px solid #e2e8f0;
  text-align:right;
  flex-shrink:0;
}
.nm-view-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:700;
  color:var(--color_primary);
  text-decoration:none;
  transition:opacity .18s;
}
.nm-view-btn:hover{ opacity:.75; }
@media(max-width:768px){
  .nm-box{ max-height:90vh; }
  .nm-title{ font-size:16px; }
}
@media(max-width:1100px){
  .board-inner{ padding:0 48px; gap:28px; }
}
@media(max-width:768px){
  .board-section{ padding:60px 0; }
  .board-inner{ padding:0 24px; grid-template-columns:1fr; gap:20px; }
}



/* 반응형 */
@media(max-width:768px){
  .header-inner{padding:0 20px;}
  .gnb{display:none;}
}

/* ===================================================
   CTA SECTION
=================================================== */
.cta-section{
  position:relative;
  height:400px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:linear-gradient(135deg, var(--color_secondary) 0%, var(--color_primary) 100%);
  overflow:hidden;
}
.cta-section::before{
  content:'';
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat;
}
.cta-inner{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:20px;
  padding:0 24px;
}
.cta-eyebrow{
  font-size:13px;
  font-weight:700;
  letter-spacing:.14em;
  color:rgba(255,255,255,.7);
  text-transform:uppercase;
  margin:0;
}
.cta-title{
  font-size:40px;
  font-weight:900;
  color:#fff;
  margin:0;
  line-height:1.25;
}
.cta-desc{
  font-size:16px;
  color:rgba(255,255,255,.8);
  margin:0;
  line-height:1.7;
}
.cta-actions{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:8px;
}
.cta-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 32px;
  border-radius:50px;
  font-size:15px;
  font-weight:700;
  text-decoration:none;
  transition:all .22s;
  cursor:pointer;
}
.cta-btn--primary{
  background:#fff;
  color:var(--color_primary);
}
.cta-btn--primary:hover{
  background:#e0f0fa;
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.cta-btn--outline{
  background:transparent;
  color:#fff;
  border:2px solid rgba(255,255,255,.6);
}
.cta-btn--outline:hover{
  background:rgba(255,255,255,.12);
  border-color:#fff;
  transform:translateY(-2px);
}
@media(max-width:768px){
  .cta-title{ font-size:28px; }
  .cta-section{ height:auto; padding:60px 0; }
  .cta-desc br{ display:none; }
}

/* ===================================================
   SITE FOOTER (재설계)
=================================================== */
.site-footer{
  background:#0d1829;
  color:#8899aa;
  font-size:14px;
}
.ft-inner{
  max-width:1200px;
  margin:0 auto;
  padding:0 60px;
}

/* ── 상단 본문 ── */
.ft-main{
  padding:70px 0 56px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.ft-main .ft-inner{
  display:grid;
  grid-template-columns:1.6fr 1fr 1.4fr;
  gap:60px;
  align-items:start;
}

/* 브랜드 */
.ft-logo{
  display:inline-block;
  font-size:21px;
  font-weight:900;
  color:#fff;
  text-decoration:none;
  letter-spacing:-.3px;
  margin-bottom:14px;
}
.ft-slogan{
  font-size:13.5px;
  color:#5a7090;
  line-height:1.75;
  margin:0 0 24px;
}
.ft-sns{
  display:flex;
  gap:10px;
}
.ft-sns__item{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  color:#7a9ab0;
  font-size:14px;
  text-decoration:none;
  transition:all .2s;
}
.ft-sns__item:hover{
  background:var(--color_primary);
  border-color:var(--color_primary);
  color:#fff;
}

/* 컬럼 공통 */
.ft-col__head{
  font-size:11px;
  font-weight:800;
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin:0 0 20px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.07);
}

/* DL 정보 */
.ft-dl{
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:11px;
}
.ft-dl > div{
  display:flex;
  align-items:flex-start;
  gap:12px;
}
.ft-dl dt{
  flex-shrink:0;
  font-size:12px;
  color:#4a6070;
  white-space:nowrap;
  min-width:14px;
  padding-top:1px;
}
/* 연락처 dt는 아이콘 */
.ft-col:last-child .ft-dl dt{
  color:var(--color_primary);
  font-size:13px;
  width:14px;
  text-align:center;
}
.ft-dl dd{
  margin:0;
  font-size:13px;
  color:#8899aa;
  line-height:1.6;
}
.ft-dl dd a{
  color:#8899aa;
  text-decoration:none;
  transition:color .18s;
}
.ft-dl dd a:hover{ color:#fff; }

/* ── 하단 바 ── */
.ft-bottom{
  background:#080f1a;
}
.ft-bottom__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 0;
  gap:20px;
  flex-wrap:wrap;
}
.ft-copy{
  font-size:12px;
  color:#3a5060;
  margin:0;
}
.ft-policy{
  display:flex;
  align-items:center;
  gap:12px;
}
.ft-policy-divider{
  color:#2a3a48;
  font-size:12px;
}
.ft-policy-btn{
  background:none;
  border:none;
  cursor:pointer;
  padding:0;
  font-size:12.5px;
  color:#5a7090;
  font-family:inherit;
  transition:color .18s;
}
.ft-policy-btn:hover{ color:#fff; }
.ft-policy-btn--em{
  font-weight:700;
  color:#8899aa;
}
.ft-policy-btn--em:hover{ color:#fff; }

/* 반응형 */
@media(max-width:1100px){
  .ft-inner{ padding:0 40px; }
  .ft-main .ft-inner{ grid-template-columns:1fr 1fr; gap:40px; }
  .ft-brand{ grid-column:1/-1; }
}
@media(max-width:768px){
  .ft-inner{ padding:0 24px; }
  .ft-main{ padding:48px 0 40px; }
  .ft-main .ft-inner{ grid-template-columns:1fr; gap:32px; }
  .ft-brand{ grid-column:auto; }
  .ft-bottom__inner{ flex-direction:column; align-items:flex-start; gap:10px; }
}

/* ── 약관·개인정보 모달 ── */
.pm-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.5);
  z-index:9950;
  align-items:center;
  justify-content:center;
  padding:24px;
  backdrop-filter:blur(4px);
}
.pm-overlay.active{ display:flex; }
.pm-box{
  background:#fff;
  border-radius:16px;
  width:100%;
  max-width:720px;
  max-height:85vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  box-shadow:0 32px 80px rgba(0,0,0,.22);
  animation:pmIn .22s cubic-bezier(.4,0,.2,1);
}
@keyframes pmIn{
  from{ opacity:0; transform:translateY(20px) scale(.97); }
  to  { opacity:1; transform:none; }
}
.pm-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:22px 28px;
  border-bottom:1.5px solid #e2e8f0;
  flex-shrink:0;
}
.pm-title{
  font-size:18px;
  font-weight:800;
  color:var(--txt);
  margin:0;
}
.pm-close{
  background:none;
  border:none;
  cursor:pointer;
  font-size:20px;
  color:var(--muted);
  padding:2px 4px;
  transition:color .18s;
  flex-shrink:0;
}
.pm-close:hover{ color:var(--txt); }
.pm-body{
  flex:1;
  overflow-y:auto;
  padding:32px 28px;
  font-size:14.5px;
  color:var(--txt);
  line-height:1.9;
}
.pm-body h2{
  font-size:16px;
  font-weight:800;
  color:var(--txt);
  margin:36px 0 10px;
  padding-bottom:8px;
  border-bottom:2px solid var(--color_primary);
}
.pm-body h2:first-child{ margin-top:0; }
.pm-body p{ margin:0 0 12px; }
.pm-body ul{
  padding-left:20px;
  margin:0 0 12px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.pm-body table{
  width:100%;
  border-collapse:collapse;
  font-size:13.5px;
  margin:12px 0 20px;
}
.pm-body table th,
.pm-body table td{
  border:1px solid #e2e8f0;
  padding:10px 14px;
  text-align:left;
  vertical-align:top;
}
.pm-body table thead th{
  background:#f8fafc;
  font-weight:700;
}
.pm-body a{ color:var(--color_primary); text-decoration:none; }
.pm-loading{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--muted);
  font-size:14px;
  padding:40px 0;
  justify-content:center;
}
@media(max-width:768px){
  .pm-box{ max-height:92vh; border-radius:12px; }
  .pm-head{ padding:18px 20px; }
  .pm-body{ padding:24px 20px; }
}

/* ===================================================
   COMPANY PAGE
=================================================== */
.company-section{
  padding:90px 0 100px;
  background:#fff;
}
.company-section--gray{
  background:#f8fafc;
}
.company-inner{
  max-width:1200px;
  margin:0 auto;
  padding:0 60px;
}
.company-inner > .section-eyebrow{
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--color_primary);
  margin:0 0 10px;
}
.company-h2{
  font-size:clamp(24px,2.4vw,36px);
  font-weight:800;
  color:var(--txt);
  margin:0 0 48px;
  line-height:1.25;
}
.company-p{
  font-size:15px;
  color:var(--txt);
  line-height:2;
  margin:0 0 28px;
  white-space:pre-line;
}
.company-ceo-sign{
  font-size:14px;
  color:var(--muted);
  border-top:1px solid #e2e8f0;
  padding-top:20px;
  margin-top:8px;
}
.company-ceo-sign strong{
  color:var(--txt);
  font-weight:700;
}
/* 인사말 2열 */
.company-greeting{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:stretch;
}
.company-greeting__text{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.company-greeting .section-eyebrow{
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--color_primary);
  margin:0 0 10px;
}
.company-greeting__img{
  display:flex;
  align-items:center;
  justify-content:center;
}
.company-greeting__img-wrap{
  width:100%;
  aspect-ratio:4/3;
  border-radius:16px;
  overflow:hidden;
}
.company-greeting__img-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:16px;
}
/* 회사 개요 테이블 */
.company-table{
  width:100%;
  border-collapse:collapse;
  font-size:14.5px;
}
.company-table th,
.company-table td{
  padding:16px 20px;
  border-bottom:1px solid #e2e8f0;
  text-align:left;
  vertical-align:top;
  line-height:1.7;
}
.company-table th{
  width:180px;
  font-weight:700;
  color:var(--txt);
  background:#f1f5f9;
  white-space:nowrap;
}
.company-table td{
  color:#334155;
}
.company-table a{
  color:var(--color_primary);
  text-decoration:none;
}
/* 핵심 역량 카드 */
.company-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.co-card{
  background:#fff;
  border:1.5px solid #e2e8f0;
  border-radius:16px;
  padding:32px 24px;
  transition:box-shadow .22s, transform .22s;
}
.co-card:hover{
  box-shadow:0 12px 40px rgba(30,111,168,.12);
  transform:translateY(-4px);
}
.co-card__icon{
  width:48px;
  height:48px;
  border-radius:12px;
  background:linear-gradient(135deg,var(--color_secondary),var(--color_primary));
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  color:#fff;
  margin-bottom:18px;
}
.co-card__title{
  font-size:16px;
  font-weight:800;
  color:var(--txt);
  margin:0 0 10px;
}
.co-card__body{
  font-size:13.5px;
  color:var(--muted);
  line-height:1.8;
  margin:0;
}
/* 오시는 길 */
.company-map-wrap{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:start;
}
.company-map{
  width:100%;
  height:420px;
  border-radius:16px;
  overflow:hidden;
  border:none;
  line-height:0;
  font-size:0;
  position:relative;
}
.company-map--full{
  grid-column:1/-1;
}
/* 카카오 roughmap 컨테이너 + iframe 전체 채우기 */
.company-map .root_daum_roughmap_landing,
.company-map .root_daum_roughmap_landing > div{
  width:100% !important;
  max-width:100% !important;
  height:100% !important;
}
.company-map .root_daum_roughmap_landing iframe{
  width:100% !important;
  max-width:100% !important;
  height:100% !important;
  display:block;
}
.company-addr-dl{
  margin:0 0 28px;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.company-addr-dl > div{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.company-addr-dl dt{
  font-size:12px;
  font-weight:700;
  color:var(--color_primary);
  display:flex;
  align-items:center;
  gap:6px;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.company-addr-dl dd{
  margin:0;
  font-size:14px;
  color:var(--txt);
  line-height:1.65;
  padding-left:18px;
}
.company-addr-dl__note{
  font-size:12.5px;
  color:var(--muted);
}
.company-addr-dl a{
  color:var(--color_primary);
  text-decoration:none;
}
.company-contact-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--color_primary);
  color:#fff;
  padding:14px 28px;
  border-radius:50px;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  transition:background .2s, transform .2s;
}
.company-contact-btn:hover{
  background:var(--color_secondary);
  transform:translateY(-2px);
}
/* 반응형 */
@media(max-width:1100px){
  .company-inner{ padding:0 40px; }
  .company-cards{ grid-template-columns:repeat(2,1fr); }
  .company-greeting{ gap:40px; }
}
@media(max-width:768px){
  .company-section{ padding:60px 0 70px; }
  .company-inner{ padding:0 24px; }
  .company-greeting{ grid-template-columns:1fr; gap:28px; }
  .company-greeting__img{ display:flex; order:2; }
  .company-greeting__text{ order:1; }
  .company-cards{ grid-template-columns:repeat(2,1fr); }
  .company-map{ height:280px; }
  .company-map-wrap{ grid-template-columns:1fr; }
  .company-table th{ width:120px; }
}

/* ===================================================
   FAQ PAGE (faqp-*)
=================================================== */
.faqp-section{
  padding:80px 0 100px;
  background:#f8fafc;
}
.faqp-inner{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px;
}

/* ── 검색바 ── */
.faqp-search{
  margin-bottom:56px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}
.faqp-search__wrap{
  display:flex;
  align-items:center;
  max-width:420px;
  width:100%;
  background:#fff;
  border:1.5px solid #e2e8f0;
  border-radius:50px;
  padding:0 8px 0 24px;
  gap:10px;
  box-shadow:0 4px 20px rgba(0,0,0,.06);
  transition:border-color .2s, box-shadow .2s;
}
.faqp-search__wrap:focus-within{
  border-color:var(--color_primary);
  box-shadow:0 0 0 4px rgba(30,111,168,.10);
}
.faqp-search__icon{
  color:var(--muted);
  font-size:16px;
  flex-shrink:0;
}
.faqp-search__input{
  flex:1;
  border:none;
  background:transparent;
  padding:15px 0;
  font-size:15px;
  color:var(--txt);
  outline:none;
}
.faqp-search__input::placeholder{ color:#94a3b8; }
.faqp-search__btn{
  flex-shrink:0;
  background:var(--color_primary);
  color:#fff;
  border:none;
  border-radius:50px;
  padding:10px 28px;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  transition:background .2s;
}
.faqp-search__btn:hover{ background:var(--color_secondary); }
.faqp-search__result{
  text-align:right;
  margin:10px 0 0;
  font-size:14px;
  color:var(--muted);
}
.faqp-search__result strong{ color:var(--txt); }
.faqp-search__clear{
  margin-left:12px;
  font-size:13px;
  color:var(--color_primary);
  text-decoration:none;
}

/* ── 2열 그리드 ── */
.faqp-accordion{
  display:grid !important;
  grid-template-columns:repeat(2,1fr);
  gap:20px;
  border:none !important;
}

/* ── 카드형 아이템 ── */
.faqp-accordion .faq-item{
  background:#fff;
  border:1.5px solid #e2e8f0 !important;
  border-radius:16px;
  overflow:hidden;
  transition:box-shadow .22s, border-color .22s;
}
.faqp-accordion .faq-item:hover{
  box-shadow:0 8px 32px rgba(30,111,168,.10);
  border-color:#bfdbf0 !important;
}
.faqp-accordion .faq-item.open{
  border-color:var(--color_primary) !important;
  box-shadow:0 8px 32px rgba(30,111,168,.14);
}

/* ── 질문 버튼 ── */
.faqp-accordion .faq-q{
  padding:18px 20px;
  gap:12px;
  background:#fff;
  border-radius:0;
}
.faqp-accordion .faq-q:hover{ background:#f0f9ff; }
.faqp-accordion .faq-item.open .faq-q{
  background:#fff;
}

/* ── Q 번호 뱃지 ── */
.faqp-accordion .faq-q__num{
  flex-shrink:0;
  height:28px;
  padding:0 12px;
  border-radius:50px;
  background:linear-gradient(135deg,#0ea5e9,#0284c7);
  color:#fff;
  font-size:11px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  letter-spacing:.04em;
  white-space:nowrap;
  line-height:1;
}
.faqp-accordion .faq-q span:not(.faq-q__num){
  flex:1;
  font-size:15px;
  font-weight:700;
  color:var(--txt);
  line-height:1.5;
}
.faqp-accordion .faq-item.open .faq-q span:not(.faq-q__num){
  color:var(--color_primary);
}

/* ── 답변 영역 ── */
.faqp-accordion .faq-a{
  max-height:0;
  overflow:hidden;
  transition:max-height .38s ease;
}
.faqp-accordion .faq-item.open .faq-a{
  max-height:600px;
}
.faqp-accordion .faq-a__inner{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:18px 20px 20px;
  background:#f8fafc;
  border-top:1px solid #e8f0f8;
}
.faqp-accordion .faq-a__label{
  flex-shrink:0;
  width:28px;
  height:28px;
  border-radius:8px;
  background:#dbeafe;
  color:var(--color_primary);
  font-size:12px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}
.faqp-accordion .faq-a__text{
  font-size:14px;
  color:#334155;
  line-height:1.85;
  padding-top:2px;
}

/* ── 빈 상태 ── */
.faqp-empty{
  grid-column:1/-1;
  text-align:center;
  padding:72px 0;
  color:var(--muted);
}
.faqp-empty i{
  font-size:48px;
  margin-bottom:16px;
  display:block;
}
.faqp-empty p{
  font-size:16px;
  line-height:1.8;
  margin:0 0 24px;
}
.faqp-empty__btn{
  display:inline-block;
  background:var(--color_primary);
  color:#fff;
  border-radius:50px;
  padding:12px 28px;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
}

/* ── 고객센터 ── */
.faqp-cs{
  padding:80px 0 100px;
  background:#fff;
}
.faqp-cs__head{
  text-align:center;
  margin-bottom:48px;
}
.faqp-cs__title{
  font-size:clamp(22px,3vw,30px);
  font-weight:800;
  color:var(--txt);
  margin:0 0 10px;
}
.faqp-cs__sub{
  font-size:15px;
  color:var(--muted);
  margin:0;
}
.faqp-cs__cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.faqp-cs__card{
  background:#f8fafc;
  border:1.5px solid #e2e8f0;
  border-radius:16px;
  padding:40px 32px;
  text-align:center;
  transition:box-shadow .22s, transform .22s, border-color .22s;
}
.faqp-cs__card:hover{
  box-shadow:0 12px 40px rgba(30,111,168,.12);
  transform:translateY(-4px);
  border-color:#bfdbf0;
}
.faqp-cs__icon{
  width:60px;
  height:60px;
  border-radius:16px;
  background:linear-gradient(135deg,#0ea5e9,#0284c7);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  color:#fff;
  margin:0 auto 22px;
}
.faqp-cs__card-title{
  font-size:18px;
  font-weight:800;
  color:var(--txt);
  margin:0 0 10px;
}
.faqp-cs__card-body{
  font-size:13.5px;
  color:var(--muted);
  line-height:1.85;
  margin:0 0 24px;
}
.faqp-cs__card-btn{
  display:inline-block;
  background:#fff;
  color:var(--color_primary);
  border:1.5px solid var(--color_primary);
  border-radius:50px;
  padding:11px 26px;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  transition:background .2s, color .2s;
}
.faqp-cs__card-btn:hover{
  background:var(--color_primary);
  color:#fff;
}
.faqp-cs__card-btn--cta{
  background:var(--color_primary);
  color:#fff;
  border-color:var(--color_primary);
}
.faqp-cs__card-btn--cta:hover{
  background:var(--color_secondary);
  border-color:var(--color_secondary);
}

/* ── 반응형 ── */
@media(max-width:1200px){
  .faqp-inner{ padding:0 40px; }
}
@media(max-width:900px){
  .faqp-accordion{ grid-template-columns:1fr; }
  .faqp-cs__cards{ grid-template-columns:1fr; }
  .faqp-search{ align-items:center; }
  .faqp-search__result{ text-align:center; }
}
@media(max-width:600px){
  .faqp-inner{ padding:0 20px; }
  .faqp-search__btn{ padding:10px 18px; }
  .faqp-cs__card{ padding:28px 20px; }
}


/* ===================================================
   NOTICE PAGE (ntp-* / ntv-*)
=================================================== */
.ntp-section{
  padding:72px 0 100px;
  background:#fff;
}
.ntp-inner{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px;
}
.ntp-inner--view{
  max-width:1440px;
}

/* ── 검색바 ── */
.ntp-search{
  margin-bottom:32px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}
.ntp-search__wrap{
  display:flex;
  align-items:center;
  max-width:380px;
  width:100%;
  background:#fff;
  border:1px solid #d1d5db;
  border-radius:6px;
  padding:0 6px 0 16px;
  gap:8px;
  transition:border-color .2s, box-shadow .2s;
}
.ntp-search__wrap:focus-within{
  border-color:var(--color_primary);
  box-shadow:0 0 0 3px rgba(30,111,168,.08);
}
.ntp-search__icon{ color:#9ca3af; font-size:14px; flex-shrink:0; }
.ntp-search__input{
  flex:1;
  border:none;
  background:transparent;
  padding:10px 0;
  font-size:14px;
  color:var(--txt);
  outline:none;
}
.ntp-search__input::placeholder{ color:#9ca3af; }
.ntp-search__btn{
  flex-shrink:0;
  background:var(--color_primary);
  color:#fff;
  border:none;
  border-radius:4px;
  padding:7px 18px;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:background .2s;
}
.ntp-search__btn:hover{ background:var(--color_secondary); }
.ntp-search__result{
  text-align:right;
  margin:8px 0 0;
  font-size:13px;
  color:var(--muted);
}
.ntp-search__result strong{ color:var(--txt); }
.ntp-search__clear{
  margin-left:10px;
  font-size:12px;
  color:var(--color_primary);
  text-decoration:none;
}

/* ── 목록 테이블 ── */
.ntp-table-wrap{
  margin-bottom:40px;
  border-top:2px solid #1e293b;
}
.ntp-table{
  width:100%;
  border-collapse:collapse;
}
.ntp-table thead th{
  padding:13px 16px;
  font-size:13px;
  font-weight:700;
  color:#374151;
  text-align:left;
  background:#fff;
  border-bottom:1px solid #e5e7eb;
}
.ntp-table thead th:first-child{ text-align:center; }
.ntp-table thead th:last-child{ text-align:center; }
.ntp-row{
  cursor:pointer;
  border-bottom:1px solid #e5e7eb;
  transition:background .15s;
}
.ntp-row:hover{ background:#f8fafc; }
.ntp-row--pin{ }
.ntp-row--pin:hover{ background:#f8fafc; }
.ntp-num{
  text-align:center;
  padding:18px 16px;
  width:80px;
  font-size:14px;
  color:#6b7280;
}
.ntp-num__badge{
  font-size:14px;
  color:#6b7280;
  font-weight:400;
}
.ntp-pin{
  color:var(--color_primary);
  font-size:13px;
}
.ntp-pin-label{
  display:inline-block;
  background:var(--color_primary);
  color:#fff;
  font-size:11px;
  font-weight:700;
  border-radius:3px;
  padding:2px 7px;
  margin-right:8px;
  vertical-align:middle;
}
.ntp-title{
  padding:18px 16px;
  font-size:14.5px;
  font-weight:500;
  color:#111827;
  line-height:1.5;
}
.ntp-row--pin .ntp-title{ font-weight:700; }
.ntp-date{
  padding:18px 16px;
  font-size:13px;
  color:#6b7280;
  white-space:nowrap;
  text-align:center;
}

/* ── 페이지네이션 ── */
.ntp-pager{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  margin-top:40px;
}
.ntp-pager__btn,
.ntp-pager__num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:6px;
  font-size:13px;
  font-weight:500;
  color:#374151;
  text-decoration:none;
  background:#fff;
  border:1px solid #d1d5db;
  transition:background .15s, color .15s, border-color .15s;
}
.ntp-pager__btn:hover,
.ntp-pager__num:hover{
  background:#f3f4f6;
  border-color:#9ca3af;
}
.ntp-pager__btn.is-disabled{
  opacity:.35;
  pointer-events:none;
}
.ntp-pager__num.is-active{
  background:#1e4d2b;
  border-color:#1e4d2b;
  color:#fff;
  font-weight:700;
}

/* ── 빈 상태 ── */
.ntp-empty{
  text-align:center;
  padding:80px 0;
  color:var(--muted);
}
.ntp-empty i{ font-size:44px; margin-bottom:16px; display:block; color:#d1d5db; }
.ntp-empty p{ font-size:15px; line-height:1.8; margin:0 0 24px; }
.ntp-empty__btn{
  display:inline-block;
  background:var(--color_primary);
  color:#fff;
  border-radius:4px;
  padding:10px 24px;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
}

/* ── 상세 뷰 ── */
.ntv-head{
  padding:40px 0 20px;
  border-bottom:1px solid #e5e7eb;
  margin-bottom:0;
}
.ntv-title{
  font-size:clamp(20px,2.5vw,26px);
  font-weight:800;
  color:#111827;
  line-height:1.5;
  margin:0 0 10px;
}
.ntv-meta{
  font-size:13px;
  color:#6b7280;
  margin:0;
}
.ntv-body{
  padding:40px 0 48px;
  min-height:260px;
  font-size:15px;
  color:#374151;
  line-height:2;
  border-bottom:1px solid #e5e7eb;
  margin-bottom:0;
}
.ntv-body img{ max-width:100%; height:auto; border-radius:6px; }
.ntv-body p{ margin:0 0 16px; }
.ntv-body p:last-child{ margin-bottom:0; }

/* ── 이전/다음 ── */
.ntv-nav{
  border-bottom:1px solid #e5e7eb;
  margin-bottom:32px;
}
.ntv-nav__item{
  display:flex;
  align-items:center;
  gap:20px;
  padding:16px 0;
  border-top:1px solid #e5e7eb;
}
.ntv-nav__item--disabled .ntv-nav__link,
.ntv-nav__item--disabled .ntv-nav__none{ color:#d1d5db; }
.ntv-nav__label{
  flex-shrink:0;
  font-size:13px;
  font-weight:600;
  color:#374151;
  width:72px;
  display:flex;
  align-items:center;
  gap:6px;
}
.ntv-nav__label i{ font-size:11px; color:#9ca3af; }
.ntv-nav__link{
  flex:1;
  font-size:14px;
  color:#374151;
  text-decoration:none;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  transition:color .15s;
}
.ntv-nav__link:hover{ color:var(--color_primary); text-decoration:underline; }
.ntv-nav__none{
  flex:1;
  font-size:14px;
  color:#9ca3af;
}

/* ── 목록 버튼 ── */
.ntv-back{
  text-align:center;
  padding-bottom:16px;
}
.ntv-back__btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:#fff;
  color:#374151;
  border:1px solid #d1d5db;
  border-radius:6px;
  padding:10px 28px;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  transition:background .15s, border-color .15s;
}
.ntv-back__btn:hover{
  background:#f3f4f6;
  border-color:#9ca3af;
}

/* ── 반응형 ── */
@media(max-width:1200px){
  .ntp-inner{ padding:0 40px; }
}
@media(max-width:768px){
  .ntp-inner{ padding:0 20px; }
  .ntp-search{ align-items:center; }
  .ntp-search__result{ text-align:center; }
  .ntp-date{ display:none; }
  .ntv-body{ padding:28px 0 36px; }
}

/* ===================================================
   POLICY PAGES (이용약관 / 개인정보처리방침)
=================================================== */
.policy-section{
  padding:80px 0 100px;
  background:#fff;
}
.policy-inner{
  max-width:900px;
  margin:0 auto;
  padding:0 40px;
  display:grid;
  grid-template-columns:220px 1fr;
  gap:60px;
  align-items:start;
}
.policy-toc{
  position:sticky;
  top:calc(var(--header_height) + 24px);
  background:#f8fafc;
  border-radius:12px;
  border:1.5px solid #e2e8f0;
  padding:24px 20px;
  font-size:14px;
}
.policy-toc strong{
  display:block;
  font-size:13px;
  font-weight:800;
  color:var(--txt);
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:14px;
}
.policy-toc ol{
  margin:0;
  padding-left:18px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.policy-toc a{
  color:var(--muted);
  text-decoration:none;
  font-size:13px;
  line-height:1.5;
  transition:color .18s;
}
.policy-toc a:hover{ color:var(--color_primary); }
.policy-body{
  font-size:14.5px;
  color:var(--txt);
  line-height:1.9;
}
.policy-date{
  font-size:13px;
  color:var(--muted);
  margin:0 0 32px;
}
.policy-body h2{
  font-size:17px;
  font-weight:800;
  color:var(--txt);
  margin:40px 0 12px;
  padding-bottom:8px;
  border-bottom:2px solid var(--color_primary);
}
.policy-body h2:first-of-type{ margin-top:0; }
.policy-body p{ margin:0 0 14px; }
.policy-body ul{
  padding-left:20px;
  margin:0 0 14px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.policy-table{
  width:100%;
  border-collapse:collapse;
  font-size:13.5px;
  margin:12px 0 24px;
}
.policy-table th,
.policy-table td{
  border:1px solid #e2e8f0;
  padding:10px 14px;
  text-align:left;
  vertical-align:top;
}
.policy-table thead th{
  background:#f8fafc;
  font-weight:700;
  color:var(--txt);
}
.policy-table a{
  color:var(--color_primary);
  text-decoration:none;
}
/* page-hero 소형 */
.page-hero--sm{
  height:240px;
}
@media(max-width:768px){
  .policy-inner{ grid-template-columns:1fr; gap:28px; padding:0 20px; }
  .policy-toc{ position:static; }
  .policy-section{ padding:40px 0 60px; }
}

/* ===================================================
   PAGE HERO (서브페이지 공통)
=================================================== */
.page-hero{
  position:relative;
  height:380px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.page-hero__overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(5,15,35,.62) 0%,rgba(5,15,35,.48) 100%);
}
.page-hero__inner{
  position:relative;
  z-index:2;
  padding:0 24px;
}
.page-hero__eyebrow{
  font-size:12px;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(255,255,255,.65);
  margin-bottom:14px;
}
.page-hero__title{
  font-size:clamp(30px,4vw,52px);
  font-weight:800;
  color:#fff;
  letter-spacing:-.03em;
  margin:0 0 12px;
}
.page-hero__sub{
  font-size:15px;
  color:rgba(255,255,255,.7);
}

/* ===================================================
   CONTACT SECTION
=================================================== */
.contact-section{
  padding:100px 0 120px;
  background:#f8fafc;
}
.contact-wrap{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px;
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:60px;
  align-items:start;
}

/* 왼쪽 안내 */
.contact-info__eyebrow{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--color_primary);
  margin-bottom:20px;
}
.contact-info__title{
  font-size:clamp(22px,2.4vw,34px);
  font-weight:800;
  line-height:1.3;
  letter-spacing:-.03em;
  color:var(--txt);
  margin:0 0 18px;
}
.contact-info__title em{
  font-style:normal;
  color:var(--color_primary);
}
.contact-info__desc{
  font-size:14px;
  line-height:1.8;
  color:var(--muted);
  margin:0 0 32px;
}
.contact-checklist{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:32px;
}
.contact-checklist li{
  display:flex;
  gap:10px;
  padding:14px 18px;
  background:#fff;
  border-radius:10px;
  border-left:3px solid var(--color_primary);
  font-size:14px;
  color:var(--txt);
  line-height:1.6;
  box-shadow:var(--shadow);
}
.contact-checklist li span{
  font-weight:700;
  color:var(--color_primary);
  flex-shrink:0;
}
.contact-info__quote{
  padding:20px 24px;
  background:#fff;
  border-radius:10px;
  border-left:4px solid var(--color_primary);
  font-size:14px;
  font-weight:600;
  color:var(--txt);
  line-height:1.7;
  box-shadow:var(--shadow);
}

/* 오른쪽 폼 카드 */
.contact-form-card{
  background:#fff;
  border-radius:20px;
  padding:44px 44px 40px;
  box-shadow:var(--shadow2);
}
.contact-form-card__title{
  font-size:22px;
  font-weight:800;
  color:var(--txt);
  margin:0 0 8px;
}
.contact-form-card__sub{
  font-size:13px;
  color:var(--muted);
  margin:0 0 32px;
  line-height:1.6;
}

/* 폼 행 */
.cf-row{ margin-bottom:20px; }
.cf-row--2col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.cf-field{ display:flex; flex-direction:column; gap:6px; }
.cf-field label{
  font-size:13px;
  font-weight:600;
  color:var(--txt);
}
.cf-req{ color:#e53e3e; font-style:normal; }
.cf-hint{ font-size:12px; font-weight:400; color:var(--muted); }
.cf-field input,
.cf-field textarea,
.cf-field select{
  width:100%;
  padding:11px 14px;
  border:1.5px solid #e2e8f0;
  border-radius:10px;
  font-size:14px;
  color:var(--txt);
  background:#fafbfc;
  transition:border-color .2s, box-shadow .2s;
}
.cf-field input:focus,
.cf-field textarea:focus{
  border-color:var(--color_primary);
  box-shadow:0 0 0 3px rgba(30,111,168,.1);
  background:#fff;
  outline:none;
}
.cf-field textarea{ resize:vertical; min-height:140px; }

/* 첨부파일 */
.cf-file-label{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 14px;
  border:1.5px dashed #cbd5e1;
  border-radius:10px;
  font-size:14px;
  color:var(--muted);
  background:#fafbfc;
  cursor:pointer;
  transition:border-color .2s, color .2s;
}
.cf-file-label:hover{
  border-color:var(--color_primary);
  color:var(--color_primary);
}
.cf-file-label i{ font-size:16px; }

/* 개인정보 동의 행 */
.cf-privacy-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 0;
  border-top:1px solid #f1f5f9;
  margin-bottom:20px;
}
.cf-check-label{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:14px;
  color:var(--txt);
  cursor:pointer;
  user-select:none;
}
.cf-check-label input[type=checkbox]{ display:none; }
.cf-checkmark{
  width:20px;
  height:20px;
  border:2px solid #cbd5e1;
  border-radius:5px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .2s,border-color .2s;
}
.cf-check-label input:checked + .cf-checkmark{
  background:var(--color_primary);
  border-color:var(--color_primary);
}
.cf-check-label input:checked + .cf-checkmark::after{
  content:'';
  display:block;
  width:5px;
  height:9px;
  border:2px solid #fff;
  border-top:0;
  border-left:0;
  transform:rotate(45deg) translate(-1px,-1px);
}
.cf-privacy-btn{
  font-size:13px;
  font-weight:600;
  color:var(--color_primary);
  text-decoration:underline;
  white-space:nowrap;
  flex-shrink:0;
}

/* 전송 버튼 */
.cf-submit{
  width:100%;
  padding:15px;
  background:var(--color_primary);
  color:#fff;
  font-size:15px;
  font-weight:700;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  transition:background .2s, opacity .2s;
  cursor:pointer;
  border:none;
}
.cf-submit:hover{ background:#155d8e; }
.cf-submit:disabled{ opacity:.6; cursor:not-allowed; }

/* ===================================================
   개인정보 모달
=================================================== */
.privacy-modal{
  position:fixed;
  inset:0;
  z-index:1000;
  background:rgba(0,0,0,.5);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s;
}
.privacy-modal.is-open{
  opacity:1;
  pointer-events:auto;
}
.privacy-modal__box{
  background:#fff;
  border-radius:16px;
  width:100%;
  max-width:560px;
  max-height:80vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.2);
  transform:translateY(16px);
  transition:transform .3s ease;
}
.privacy-modal.is-open .privacy-modal__box{ transform:translateY(0); }
.privacy-modal__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 24px;
  border-bottom:1px solid #f1f5f9;
}
.privacy-modal__head h4{
  font-size:16px;
  font-weight:700;
  margin:0;
  color:var(--txt);
}
.privacy-modal__close{
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  color:var(--muted);
  font-size:16px;
  transition:background .2s;
}
.privacy-modal__close:hover{ background:#f1f5f9; }
.privacy-modal__body{
  padding:24px;
  overflow-y:auto;
  font-size:14px;
  line-height:1.85;
  color:var(--txt);
  flex:1;
}
.privacy-modal__body p{ margin:0 0 12px; }
.privacy-modal__body strong{ color:var(--color_primary); }
.privacy-modal__foot{
  padding:16px 24px;
  border-top:1px solid #f1f5f9;
}
.privacy-modal__foot .cf-submit{ border-radius:10px; }

/* contact 반응형 */
@media(max-width:1100px){
  .contact-wrap{ grid-template-columns:1fr; gap:40px; padding:0 40px; }
}
@media(max-width:768px){
  .contact-wrap{ padding:0 20px; }
  .contact-section{ padding:60px 0 80px; }
  .cf-row--2col{ grid-template-columns:1fr; }
  .contact-form-card{ padding:28px 20px; }
  .page-hero{ height:260px; }
}

/* ===================================================
   ESG
=================================================== */

/* 인트로 */
.esg-intro{
  padding:80px 0 60px;
  text-align:center;
  background:#fff;
}
.esg-intro__inner{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px;
}
.esg-badges{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  margin-top:36px;
  flex-wrap:wrap;
}
.esg-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 24px;
  border-radius:50px;
  font-size:14px;
  font-weight:700;
  letter-spacing:.04em;
}
.esg-badge--e{ background:#e8f5e9; color:#2e7d32; }
.esg-badge--s{ background:#e3f2fd; color:#1565c0; }
.esg-badge--g{ background:#fce4ec; color:#c62828; }

/* 공통 섹션 */
.esg-section{
  padding:100px 0;
}
.esg-section--e{ background:#f8fafc; }
.esg-section--s{ background:#fff; }
.esg-section--g{ background:#f8fafc; }

.esg-section__inner{
  max-width:1440px;
  margin:0 auto;
  padding:0 80px;
  display:grid;
  grid-template-columns:280px 1fr;
  gap:64px;
  align-items:start;
}

/* 왼쪽 레이블 */
.esg-section__label{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:20px;
  position:sticky;
  top:calc(var(--header_height) + 24px);
}
.esg-alpha{
  width:80px;
  height:80px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:20px;
  font-size:44px;
  font-weight:900;
  letter-spacing:-.04em;
  line-height:1;
}
.esg-alpha--e{ background:#e8f5e9; color:#2e7d32; }
.esg-alpha--s{ background:#e3f2fd; color:#1565c0; }
.esg-alpha--g{ background:#fce4ec; color:#c62828; }

.esg-section__en{
  font-size:12px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 6px;
}
.esg-section__title{
  font-size:clamp(20px,2vw,28px);
  font-weight:800;
  color:var(--txt);
  letter-spacing:-.03em;
  line-height:1.3;
  margin:0 0 14px;
}

/* 왼쪽 레이블 하단 quote */
.esg-section__quote{
  font-size:13px;
  font-weight:600;
  line-height:1.65;
  color:var(--color_primary);
  border-left:3px solid currentColor;
  padding:10px 14px;
  background:rgba(30,111,168,.06);
  border-radius:0 8px 8px 0;
  margin:0;
}

/* 카드 그리드 */
.esg-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.esg-card{
  background:#fff;
  border-radius:16px;
  padding:32px 28px;
  box-shadow:var(--shadow);
  border:1.5px solid #f1f5f9;
  transition:transform .3s, box-shadow .3s, border-color .3s;
}
.esg-section--s .esg-card{ background:#f8fafc; }
.esg-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow2);
  border-color:rgba(30,111,168,.2);
}
.esg-card__icon{
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(30,111,168,.1);
  color:var(--color_primary);
  font-size:20px;
  border-radius:12px;
  margin-bottom:18px;
  transition:background .3s, color .3s;
}
.esg-card:hover .esg-card__icon{
  background:var(--color_primary);
  color:#fff;
}
.esg-card h3{
  font-size:16px;
  font-weight:700;
  color:var(--txt);
  margin:0 0 10px;
}
.esg-card p{
  font-size:14px;
  line-height:1.8;
  color:var(--muted);
  margin:0;
}

/* E 섹션 아이콘 컬러 */
.esg-section--e .esg-card__icon{ background:#e8f5e9; color:#2e7d32; }
.esg-section--e .esg-card:hover .esg-card__icon{ background:#2e7d32; color:#fff; }
/* S 섹션 */
.esg-section--s .esg-card__icon{ background:#e3f2fd; color:#1565c0; }
.esg-section--s .esg-card:hover .esg-card__icon{ background:#1565c0; color:#fff; }
/* G 섹션 */
.esg-section--g .esg-card__icon{ background:#fce4ec; color:#c62828; }
.esg-section--g .esg-card:hover .esg-card__icon{ background:#c62828; color:#fff; }

/* quote 색상 */
.esg-section--e .esg-section__quote{ color:#2e7d32; border-color:#2e7d32; background:rgba(46,125,50,.06); }
.esg-section--s .esg-section__quote{ color:#1565c0; border-color:#1565c0; background:rgba(21,101,192,.06); }
.esg-section--g .esg-section__quote{ color:#c62828; border-color:#c62828; background:rgba(198,40,40,.06); }

/* CTA */
.esg-cta{
  padding:100px 0;
  background:linear-gradient(135deg,rgba(0,0,128,.85) 0%,rgba(30,111,168,.85) 100%),url('/images/esg_bg2.png') center/cover no-repeat;
  text-align:center;
}
.esg-cta__inner{
  max-width:780px;
  margin:0 auto;
  padding:0 40px;
}
.esg-cta__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(255,255,255,.65);
  margin-bottom:20px;
}
.esg-cta__title{
  font-size:clamp(26px,3.5vw,46px);
  font-weight:800;
  color:#fff;
  letter-spacing:-.03em;
  line-height:1.2;
  margin:0 0 20px;
}
.esg-cta__title em{
  font-style:normal;
  color:rgba(255,255,255,.85);
  text-decoration:underline;
  text-decoration-color:rgba(255,255,255,.4);
  text-underline-offset:6px;
}
.esg-cta__desc{
  font-size:15px;
  color:rgba(255,255,255,.75);
  line-height:1.8;
  margin:0 0 40px;
}

/* ESG 반응형 */
@media(max-width:1100px){
  .esg-section__inner{ grid-template-columns:1fr; gap:40px; padding:0 40px; }
  .esg-section__label{ position:static; flex-direction:row; align-items:center; }
  .esg-cards{ grid-template-columns:1fr 1fr; }
}
@media(max-width:768px){
  .esg-intro__inner{ padding:0 24px; }
  .esg-section{ padding:60px 0; }
  .esg-section__inner{ padding:0 24px; }
  .esg-cards{ grid-template-columns:1fr; }
  .esg-cta{ padding:60px 0; }
}