/* ============================================================
   정안레미콘 주식회사 – 친환경 심플 스타일
   Color Palette:
     Green-Dark  : #1a3c2b
     Green-Mid   : #2d6a4f
     Green-Light : #52b788
     Green-Soft  : #d8f3dc
     Accent      : #40916c
     Neutral-100 : #f8faf9
     Neutral-200 : #edf2ef
     Neutral-700 : #4a5568
     Neutral-900 : #1a202c
   ============================================================ */

/* ── Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: 'Noto Sans KR', sans-serif;
  color: #2d3748;
  background: #fff;
  line-height: 1.7;
  overflow-x: hidden;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* ── Container ── */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ── Section Helpers ── */
.section { padding: 100px 0; }
.section--gray { background: #f5f8f6; }
.section--green { background: linear-gradient(135deg, #1a3c2b 0%, #2d6a4f 60%, #40916c 100%); }

.section-head { text-align: center; margin-bottom: 60px; }
.section-label {
  display: inline-block;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: #40916c;
  margin-bottom: 12px;
}
.section-title {
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 700;
  color: #1a3c2b;
  line-height: 1.3;
  margin-bottom: 16px;
}
.section-sub {
  font-size: 16px;
  color: #718096;
  max-width: 600px;
  margin: 0 auto;
}
.mt-20 { margin-top: 20px; }

/* ── Buttons ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 600;
  transition: all 0.3s ease;
  cursor: pointer;
  border: 2px solid transparent;
}
.btn--primary {
  background: #2d6a4f;
  color: #fff;
  border-color: #2d6a4f;
}
.btn--primary:hover { background: #1a3c2b; border-color: #1a3c2b; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(45,106,79,0.3); }
.btn--outline {
  background: transparent;
  color: #2d6a4f;
  border-color: #2d6a4f;
}
.btn--outline:hover { background: #2d6a4f; color: #fff; transform: translateY(-2px); }
.btn--white {
  background: #fff;
  color: #2d6a4f;
  border-color: #fff;
}
.btn--white:hover { background: #d8f3dc; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.15); }
.btn--full { width: 100%; justify-content: center; }

/* ── AOS (simple fade-up) ── */
[data-aos] {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
[data-aos].aos-animate {
  opacity: 1;
  transform: translateY(0);
}

/* ================================================================
   HEADER
================================================================ */
.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  padding: 20px 0;
  transition: all 0.4s ease;
}
.header.scrolled {
  background: rgba(255,255,255,0.97);
  backdrop-filter: blur(10px);
  box-shadow: 0 2px 20px rgba(0,0,0,0.08);
  padding: 14px 0;
}
.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: nowrap;       /* 절대 줄바꾸기 금지 */
  min-width: 0;
}

/* Logo */
.header__logo, .footer__logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 17px;           /* ▼ 20→17px (공간 확보) */
  font-weight: 700;
  color: #fff;
  transition: color 0.3s;
  flex-shrink: 0;            /* 로고 압축 방지 */
  white-space: nowrap;
}
.header.scrolled .header__logo { color: #1a3c2b; }
.header__logo em { font-style: normal; font-size: 14px; font-weight: 400; opacity: 0.8; }

/* SRA CI 로고 — 투명 헤더: 흰색 / 스크롤 후: 원본 빨간색 유지 */
.logo-sra {
  height: 30px;
  width: auto;
  object-fit: contain;
  filter: brightness(0) invert(1);  /* 투명 배경 위: 흰색 */
  transition: filter 0.4s ease;
  flex-shrink: 0;
}
.header.scrolled .logo-sra {
  filter: none;                      /* 흰 배경 위: 원본 빨간색 */
}
.logo-sra--footer {
  height: 26px;
  filter: brightness(0) invert(1);  /* 어두운 푸터: 흰색 */
  opacity: 0.9;
}

/* 로고 구분선 */
.logo-divider {
  width: 1px;
  height: 26px;
  background: rgba(255,255,255,0.35);
  flex-shrink: 0;
  transition: background 0.4s;
}
.header.scrolled .logo-divider { background: rgba(26,60,43,0.2); }

/* Nav */
.header__nav {
  flex: 1 1 auto;    /* 남은 공간 유연하게 차지 */
  min-width: 0;
  display: flex;
  justify-content: center;
}
.nav-list {
  display: flex;
  flex-wrap: nowrap;       /* 줄바꾸기 금지 */
  gap: 0;
  align-items: center;
}
.nav-list > li {
  flex-shrink: 0;          /* 압쳐서 글자 글스 방지 */
}
.nav-list a {
  font-size: 13px;         /* 약간 축소 */
  font-weight: 500;
  color: rgba(255,255,255,0.9);
  position: relative;
  padding: 4px 10px;       /* 좌우 패딩으로 간격 조절 */
  white-space: nowrap;     /* 글자 절대 줄바꾸기 금지 */
  transition: color 0.3s;
  display: block;
}
.header.scrolled .nav-list a { color: #2d3748; }
.nav-list a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 10px;
  right: 10px;
  width: auto; height: 2px;
  background: #52b788;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.3s ease;
}
.nav-list a:hover::after, .nav-list a.active::after { transform: scaleX(1); }
.nav-list a:hover { color: #52b788; }
.header.scrolled .nav-list a:hover { color: #2d6a4f; }

/* Hamburger */
.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 4px;
}
.hamburger span {
  width: 24px; height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: all 0.3s;
}
.header.scrolled .hamburger span { background: #1a3c2b; }
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

/* ================================================================
   HERO
================================================================ */
.hero {
  position: relative;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.hero__bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #0d2818 0%, #1a3c2b 40%, #2d6a4f 80%, #40916c 100%);
}
.hero__overlay {
  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.03'%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");
}
.hero__shapes { position: absolute; inset: 0; }
.shape {
  position: absolute;
  border-radius: 50%;
  background: rgba(82, 183, 136, 0.12);
  animation: float 8s ease-in-out infinite;
}
.shape--1 { width: 400px; height: 400px; top: -100px; right: -80px; animation-delay: 0s; }
.shape--2 { width: 250px; height: 250px; bottom: 80px; right: 200px; animation-delay: 2s; }
.shape--3 { width: 150px; height: 150px; top: 40%; left: 10%; animation-delay: 4s; }

@keyframes float {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-20px) scale(1.03); }
}

.hero__content {
  position: relative;
  z-index: 2;
  padding-top: 100px;
  padding-bottom: 60px;
  width: 100%;
  max-width: 100%;
}
.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: rgba(82,183,136,0.2);
  border: 1px solid rgba(82,183,136,0.4);
  border-radius: 50px;
  font-size: 11px;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  letter-spacing: 1px;
  color: #74c69d;
  margin-bottom: 20px;
  max-width: 100%;
  white-space: nowrap;
}
.hero__title {
  font-size: clamp(30px, 4.5vw, 76px);
  font-weight: 700;
  color: #fff;
  line-height: 1.25;
  margin-bottom: 20px;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.hero__title span {
  display: block;
}
.hero__title .accent {
  display: block;
  background: linear-gradient(90deg, #52b788, #74c69d);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero__desc {
  font-size: 16px;
  color: rgba(255,255,255,0.75);
  margin-bottom: 28px;
  font-weight: 300;
  line-height: 1.8;
}
.hero__btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* Scroll hint */
.hero__scroll-hint {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,0.5);
  font-size: 10px;
  letter-spacing: 3px;
  font-family: 'Montserrat', sans-serif;
}
.scroll-line {
  width: 1px;
  height: 50px;
  background: linear-gradient(to bottom, rgba(255,255,255,0.5), transparent);
  animation: scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* Hero visual */
.hero__visual {
  position: absolute;
  right: -60px;
  top: 50%;
  transform: translateY(-50%);
  width: 500px;
  height: 500px;
  opacity: 0.4;
  animation: spin 40s linear infinite;
}
.hero-svg { width: 100%; height: 100%; }
@keyframes spin { from { transform: translateY(-50%) rotate(0deg); } to { transform: translateY(-50%) rotate(360deg); } }

/* ================================================================
   STATS
================================================================ */
.stats {
  background: #fff;
  padding: 60px 0;
  border-bottom: 1px solid #edf2ef;
}
.stats__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.stat-item {
  text-align: center;
  padding: 30px 16px;
  border-radius: 16px;
  background: linear-gradient(135deg, #f5f8f6, #edf2ef);
  transition: transform 0.3s, box-shadow 0.3s;
  overflow: hidden;
  min-width: 0;
}
.stat-item:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(45,106,79,0.1); }
.stat-num {
  font-family: 'Montserrat', sans-serif;
  font-size: 48px;
  font-weight: 700;
  color: #2d6a4f;
  line-height: 1;
}
/* 콤마 없이 그대로 표시하는 숫자 (설립연도 등) */
.stat-num--plain {
  font-family: 'Montserrat', sans-serif;
  font-size: 48px;
  font-weight: 700;
  color: #2d6a4f;
  line-height: 1;
}
.stat-unit { font-size: 22px; font-weight: 700; color: #40916c; }
.stat-item p { font-size: 14px; color: #718096; margin-top: 8px; font-weight: 500; }

/* ================================================================
   ABOUT
================================================================ */
.about__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}
.about__img-wrap {
  position: relative;
  height: 480px;
}
.about__img-box {
  position: absolute;
  border-radius: 20px;
  overflow: hidden;
}
.about__img-box--main {
  width: 75%;
  height: 380px;
  top: 0; left: 0;
}
.about__img-box--sub {
  width: 50%;
  height: 220px;
  bottom: 0; right: 0;
  border: 4px solid #fff;
  box-shadow: 0 20px 60px rgba(0,0,0,0.1);
}
.img-placeholder {
  width: 100%; height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 60px;
}
.concrete-img { background: linear-gradient(135deg, #1a3c2b, #2d6a4f); color: rgba(255,255,255,0.3); }
.nature-img { background: linear-gradient(135deg, #52b788, #74c69d); color: rgba(255,255,255,0.6); }

.about__badge-float {
  position: absolute;
  top: 60px;
  right: -20px;
  background: #fff;
  border-radius: 16px;
  padding: 16px 20px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.12);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  z-index: 2;
}
.about__badge-float i { font-size: 28px; color: #f6ad55; }
.about__badge-float strong { font-size: 15px; color: #1a3c2b; }
.about__badge-float span { font-size: 11px; color: #718096; }

.about__text { padding-left: 10px; }
.about__desc { color: #718096; margin-bottom: 28px; font-size: 15px; }
.about__features { display: flex; flex-direction: column; gap: 12px; }
.about__features li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  font-weight: 500;
  color: #4a5568;
}
.about__features li i { color: #40916c; font-size: 16px; }

/* ================================================================
   BUSINESS
================================================================ */
.business__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.biz-card {
  background: #fff;
  border-radius: 20px;
  padding: 36px 32px;
  border: 1px solid #edf2ef;
  transition: all 0.35s ease;
  position: relative;
  overflow: hidden;
}
.biz-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 0;
  background: linear-gradient(to bottom, #52b788, #2d6a4f);
  transition: height 0.4s ease;
  border-radius: 4px 0 0 4px;
}
.biz-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(45,106,79,0.12); border-color: #d8f3dc; }
.biz-card:hover::before { height: 100%; }
.biz-card__icon {
  width: 60px; height: 60px;
  border-radius: 16px;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #2d6a4f;
  margin-bottom: 20px;
  transition: all 0.3s;
}
.biz-card:hover .biz-card__icon { background: linear-gradient(135deg, #2d6a4f, #40916c); color: #fff; transform: scale(1.1); }
.biz-card h3 { font-size: 20px; font-weight: 700; color: #1a3c2b; margin-bottom: 12px; }
.biz-card p { font-size: 14px; color: #718096; margin-bottom: 20px; line-height: 1.8; }
.biz-card__list { display: flex; flex-direction: column; gap: 6px; }
.biz-card__list li {
  font-size: 13px;
  color: #40916c;
  font-weight: 500;
  padding-left: 16px;
  position: relative;
}
.biz-card__list li::before {
  content: '→';
  position: absolute;
  left: 0;
  font-size: 12px;
}

/* ================================================================
   ECO
================================================================ */
.eco { position: relative; overflow: hidden; }
.eco__bg-deco {
  position: absolute;
  width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(82,183,136,0.06) 0%, transparent 70%);
  right: -200px; top: -100px;
  pointer-events: none;
}
.eco__content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
.eco__steps { display: flex; flex-direction: column; gap: 28px; }
.eco-step {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
.eco-step__num {
  flex-shrink: 0;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #2d6a4f;
}
.eco-step__body h3 {
  font-size: 17px;
  font-weight: 600;
  color: #1a3c2b;
  margin-bottom: 6px;
}
.eco-step__body h3 i { color: #40916c; margin-right: 6px; }
.eco-step__body p { font-size: 14px; color: #718096; line-height: 1.8; }

/* Eco circle */
.eco__visual {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 24px;
}
.eco-circle {
  position: relative;
  width: 320px;
  height: 320px;
}
.eco-circle__ring {
  position: absolute;
  border-radius: 50%;
  border: 2px solid;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  animation: spinRing 20s linear infinite;
}
.eco-circle__ring--outer {
  width: 300px; height: 300px;
  border-color: rgba(82,183,136,0.2);
  border-style: dashed;
  animation-duration: 25s;
}
.eco-circle__ring--mid {
  width: 220px; height: 220px;
  border-color: rgba(82,183,136,0.3);
  animation-direction: reverse;
  animation-duration: 18s;
}
.eco-circle__ring--inner {
  width: 140px; height: 140px;
  border-color: rgba(82,183,136,0.4);
  animation-duration: 12s;
}
@keyframes spinRing { from { transform: translate(-50%,-50%) rotate(0deg); } to { transform: translate(-50%,-50%) rotate(360deg); } }

.eco-circle__core {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 100px; height: 100px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
  box-shadow: 0 10px 40px rgba(45,106,79,0.4);
  z-index: 2;
}
.eco-circle__core i { font-size: 22px; color: #52b788; margin-bottom: 4px; }
.eco-circle__core span { font-size: 11px; font-weight: 600; line-height: 1.4; }

.eco-dot {
  position: absolute;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 6px 20px rgba(45,106,79,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2d6a4f;
  font-size: 16px;
  top: 50%; left: 50%;
  transform-origin: 0 0;
}
.eco-dot--1 { transform: rotate(0deg) translateX(140px) translateY(-50%); }
.eco-dot--2 { transform: rotate(90deg) translateX(140px) translateY(-50%); }
.eco-dot--3 { transform: rotate(180deg) translateX(140px) translateY(-50%); }
.eco-dot--4 { transform: rotate(270deg) translateX(140px) translateY(-50%); }

/* ================================================================
   SAFETY & HEALTH – 안전보건관리
================================================================ */

/* 목표 배너 */
.safety-goal-banner {
  display: flex;
  align-items: center;
  gap: 24px;
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  border-radius: 20px;
  padding: 28px 36px;
  margin-bottom: 48px;
  box-shadow: 0 8px 32px rgba(45,106,79,0.25);
}
.safety-goal-banner__icon {
  width: 64px; height: 64px;
  background: rgba(255,255,255,0.15);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; color: #fff;
  flex-shrink: 0;
}
.safety-goal-banner__label {
  font-size: 12px; font-weight: 700;
  color: rgba(255,255,255,0.65);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.safety-goal-banner__body h3 {
  font-size: 20px; font-weight: 700; color: #fff;
  line-height: 1.4;
}

/* 4대 항목 그리드 */
.safety-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-bottom: 40px;
}
.safety-card {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
  overflow: hidden;
  transition: transform 0.3s, box-shadow 0.3s;
}
.safety-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 36px rgba(45,106,79,0.12);
}
.safety-card--highlight {
  border-color: #52b788;
  box-shadow: 0 4px 24px rgba(82,183,136,0.18);
}
.safety-card__header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 24px;
  border-bottom: 1px solid #f0f4f0;
}
.safety-card__header--plan { background: linear-gradient(135deg, #ebf8ff, #dbeafe); }
.safety-card__header--edu  { background: linear-gradient(135deg, #fef3cd, #fde68a33); }
.safety-card__header--prev { background: linear-gradient(135deg, #fff0f0, #fecaca44); }
.safety-card__header--zero { background: linear-gradient(135deg, #d8f3dc, #b7e4c7); }
.safety-card__num {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px; font-weight: 800;
  color: #fff;
  background: #2d6a4f;
  width: 32px; height: 32px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.safety-card__header--plan .safety-card__num { background: #3b82f6; }
.safety-card__header--edu  .safety-card__num { background: #f6ad55; }
.safety-card__header--prev .safety-card__num { background: #e53e3e; }
.safety-card__header--zero .safety-card__num { background: #2d6a4f; }
.safety-card__icon {
  font-size: 22px;
  color: #2d6a4f;
}
.safety-card__header--plan .safety-card__icon { color: #3b82f6; }
.safety-card__header--edu  .safety-card__icon { color: #d97706; }
.safety-card__header--prev .safety-card__icon { color: #e53e3e; }
.safety-card__header h3 {
  font-size: 17px; font-weight: 700; color: #1a3c2b;
}
.safety-card__body {
  padding: 20px 24px;
}
.safety-card__list {
  list-style: none;
  display: flex; flex-direction: column; gap: 10px;
  margin-bottom: 16px;
}
.safety-card__list li {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 13px; color: #4a5568; line-height: 1.6;
}
.safety-card__list li i { color: #52b788; margin-top: 2px; flex-shrink: 0; }

/* 목표 뱃지 */
.safety-card__goal {
  display: flex; align-items: flex-start; gap: 8px;
  background: linear-gradient(135deg, #f0fdf4, #d8f3dc);
  border: 1px solid #b7e4c7;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 13px; color: #1a3c2b; line-height: 1.5;
}
.safety-card__goal i { color: #2d6a4f; margin-top: 2px; flex-shrink: 0; }
.safety-card__goal strong { font-weight: 700; color: #2d6a4f; margin-right: 4px; }

/* 무재해 현황 숫자판 */
.safety-zero-board {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  border-radius: 14px;
  padding: 20px 16px;
  margin-bottom: 4px;
}
.safety-zero-item {
  flex: 1;
  text-align: center;
}
.safety-zero-num {
  font-family: 'Montserrat', sans-serif;
  font-size: 48px; font-weight: 800; color: #fff;
  line-height: 1;
  display: block;
}
.safety-zero-unit {
  font-size: 16px; font-weight: 600; color: rgba(255,255,255,0.75);
  margin-left: 2px;
}
.safety-zero-item p {
  font-size: 11px; color: rgba(255,255,255,0.65);
  margin-top: 6px; font-weight: 500;
}
.safety-zero-divider {
  width: 1px; height: 60px;
  background: rgba(255,255,255,0.2);
  margin: 0 16px;
}

/* 실천 서약 */
.safety-pledge {
  margin-top: 12px;
}
.safety-pledge__inner {
  background: linear-gradient(135deg, #f0fdf4, #ffffff);
  border: 2px solid #52b788;
  border-radius: 20px;
  padding: 40px 40px;
  text-align: center;
}
.safety-pledge__inner > i {
  font-size: 36px; color: #2d6a4f; margin-bottom: 14px;
}
.safety-pledge__inner h3 {
  font-size: 22px; font-weight: 700; color: #1a3c2b;
  margin-bottom: 12px;
}
.safety-pledge__inner > p {
  font-size: 14px; color: #4a5568; line-height: 1.8;
  margin-bottom: 28px;
}
.safety-pledge__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  max-width: 640px;
  margin: 0 auto;
}
.safety-pledge__item {
  display: flex; align-items: center; gap: 10px;
  background: #fff;
  border: 1px solid #b7e4c7;
  border-radius: 12px;
  padding: 14px 18px;
  font-size: 14px; font-weight: 600; color: #1a3c2b;
  text-align: left;
}
.safety-pledge__item i { color: #2d6a4f; font-size: 15px; flex-shrink: 0; }

/* ── 반응형 ── */
@media (max-width: 768px) {
  .safety-goal-banner { flex-direction: column; text-align: center; padding: 24px 20px; }
  .safety-goal-banner__body h3 { font-size: 16px; }
  .safety-grid { grid-template-columns: 1fr; }
  .safety-pledge__inner { padding: 28px 20px; }
  .safety-pledge__grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .safety-zero-num { font-size: 36px; }
}

/* ================================================================
   QUALITY
================================================================ */
.quality__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
.quality__text h3 { font-size: 24px; font-weight: 700; color: #1a3c2b; margin-bottom: 16px; }
.quality__text p { font-size: 15px; color: #718096; line-height: 1.9; margin-bottom: 32px; }
.cert-badges { display: flex; gap: 16px; flex-wrap: wrap; }
.cert-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 20px 24px;
  background: linear-gradient(135deg, #f5f8f6, #edf2ef);
  border-radius: 16px;
  border: 1px solid #d8f3dc;
  transition: all 0.3s;
}
.cert-badge:hover { background: linear-gradient(135deg, #d8f3dc, #b7e4c7); transform: translateY(-3px); }
.cert-badge i { font-size: 24px; color: #f6ad55; }
.cert-badge span { font-size: 13px; font-weight: 700; color: #1a3c2b; }
.cert-badge small { font-size: 11px; color: #718096; }

/* Process flow */
.process-flow {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  background: #fff;
  border-radius: 20px;
  padding: 40px 30px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.06);
}
.process-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.process-step__icon {
  width: 70px; height: 70px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #fff;
  box-shadow: 0 6px 20px rgba(45,106,79,0.3);
  transition: transform 0.3s;
}
.process-step:hover .process-step__icon { transform: scale(1.1); }
.process-step__label { font-size: 13px; font-weight: 600; color: #4a5568; text-align: center; }
.process-arrow { color: #b7e4c7; font-size: 18px; margin-top: -20px; }

/* ================================================================
   NEWS
================================================================ */
.news__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 40px;
}
.news-card {
  background: #fff;
  border-radius: 20px;
  padding: 28px;
  border: 1px solid #edf2ef;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: all 0.3s;
  position: relative;
}
.news-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(45,106,79,0.1); border-color: #b7e4c7; }
.news-card__date {
  display: flex;
  flex-direction: column;
}
.news-card__date .day {
  font-family: 'Montserrat', sans-serif;
  font-size: 40px;
  font-weight: 700;
  color: #e8f5e9;
  line-height: 1;
}
.news-card__date .month { font-size: 11px; color: #b7e4c7; font-weight: 600; letter-spacing: 1px; }
.news-tag {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 11px;
  font-weight: 600;
  margin-bottom: 8px;
}
.tag--notice { background: #fff3cd; color: #856404; }
.tag--eco { background: #d8f3dc; color: #2d6a4f; }
.tag--news { background: #e8f4f8; color: #1a6a8f; }
.news-card__body h4 { font-size: 16px; font-weight: 700; color: #1a3c2b; margin-bottom: 8px; line-height: 1.5; }
.news-card__body p { font-size: 13px; color: #718096; line-height: 1.7; }
.news-card__link {
  align-self: flex-end;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: #f5f8f6;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2d6a4f;
  transition: all 0.3s;
}
.news-card:hover .news-card__link { background: #2d6a4f; color: #fff; }
.news__more { text-align: center; }

/* ================================================================
   CONTACT
================================================================ */
.contact__grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 60px;
  align-items: start;
}
.contact__list { display: flex; flex-direction: column; gap: 24px; }
.contact__list li { display: flex; gap: 16px; align-items: flex-start; }
.contact-icon {
  flex-shrink: 0;
  width: 44px; height: 44px;
  border-radius: 12px;
  background: rgba(255,255,255,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: #74c69d;
}
.contact__list strong { display: block; color: rgba(255,255,255,0.6); font-size: 12px; font-weight: 500; margin-bottom: 2px; }
.contact__list p { color: #fff; font-size: 15px; font-weight: 500; }
.contact__list a { color: #fff; border-bottom: 1px solid rgba(255,255,255,0.3); transition: border-color 0.3s; }
.contact__list a:hover { border-color: #fff; }

.contact__form-wrap {
  background: rgba(255,255,255,0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 24px;
  padding: 40px;
}
.contact__form h3 { font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 24px; }
.form-mail-notice {
  margin-top: 12px;
  text-align: center;
  font-size: 12px;
  color: rgba(255,255,255,0.65);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.form-mail-notice i { color: rgba(255,255,255,0.5); }
.form-mail-notice strong { color: rgba(255,255,255,0.9); font-weight: 600; }
.form-mail-setup { color: rgba(255,220,100,0.85); font-size: 11px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.form-group label { font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.7); }
.form-group input,
.form-group textarea {
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 14px;
  font-family: inherit;
  transition: all 0.3s;
  outline: none;
}
.form-group input::placeholder,
.form-group textarea::placeholder { color: rgba(255,255,255,0.4); }
.form-group input:focus,
.form-group textarea:focus {
  border-color: rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.15);
}
.form-group textarea { resize: vertical; }

/* ================================================================
   FOOTER
================================================================ */
.footer {
  background: #0d1f16;
  color: rgba(255,255,255,0.6);
}
.footer__inner {
  display: grid;
  grid-template-columns: 1.5fr 1.5fr;
  gap: 60px;
  padding: 60px 24px;
}
.footer__brand { max-width: 320px; }
.footer__logo {
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 16px;
}
.footer__logo .logo-icon { color: #52b788; }
.footer__brand p { font-size: 14px; line-height: 1.8; margin-bottom: 20px; }
.footer__social { display: flex; gap: 12px; }
.footer__social a {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: rgba(255,255,255,0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.6);
  font-size: 16px;
  transition: all 0.3s;
}
.footer__social a:hover { background: #2d6a4f; color: #fff; transform: translateY(-2px); }
.footer__nav {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 20px;
  padding-top: 8px;
}
.footer__nav-col h4 { font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 16px; }
.footer__nav-col ul { display: flex; flex-direction: column; gap: 10px; }
.footer__nav-col a { font-size: 13px; color: rgba(255,255,255,0.5); transition: color 0.3s; }
.footer__nav-col a:hover { color: #52b788; }
/* 푸터 PWA 설치 버튼 전용 행 (PC·모바일 동일 표시) */
.footer__pwa-row {
  display: flex;
  justify-content: center;
  padding: 20px 0 4px;
  border-top: 1px solid rgba(255,255,255,0.08);
  margin-top: 28px;
  /* footer__inner가 grid일 때 전체 폭 차지 */
  grid-column: 1 / -1;
}
.footer__pwa-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 32px;
  background: linear-gradient(135deg, #2d6a4f, #52b788);
  color: #fff;
  border: none;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 6px 24px rgba(45,106,79,0.38);
  white-space: nowrap;
  min-height: 52px;
}
.footer__pwa-cta i { font-size: 18px; }
.footer__pwa-cta:hover { transform: translateY(-2px); box-shadow: 0 10px 32px rgba(45,106,79,0.5); }
.footer__pwa-cta:active { transform: scale(0.97); }
.footer__pwa-badge {
  background: rgba(255,255,255,0.25);
  border-radius: 50px;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.03em;
}

.footer__bottom {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding: 20px 24px;
}
.footer__bottom .container {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: space-between;
  align-items: center;
}
.footer__bottom p { font-size: 12px; color: rgba(255,255,255,0.35); }

/* ================================================================
   BACK TO TOP
================================================================ */
.back-to-top {
  position: fixed;
  bottom: 36px; right: 32px;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(45,106,79,0.4);
  opacity: 0;
  transform: translateY(16px);
  transition: all 0.3s;
  pointer-events: none;
  z-index: 999;
}
.back-to-top.visible { opacity: 1; transform: translateY(0); pointer-events: all; }
.back-to-top:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(45,106,79,0.5); }

/* ================================================================
   STAFF PORTAL BUTTON (헤더)
================================================================ */
.staff-portal-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 7px 12px;
  border-radius: 50px;
  border: 1.5px solid rgba(255,255,255,0.55);
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  flex-shrink: 0;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.staff-portal-btn:hover {
  background: rgba(255,255,255,0.22);
  border-color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}
.staff-portal-btn i { font-size: 13px; }
/* 스크롤 후 흰 헤더 */
.header.scrolled .staff-portal-btn {
  border-color: #2d6a4f;
  background: transparent;
  color: #2d6a4f;
}
.header.scrolled .staff-portal-btn:hover {
  background: #2d6a4f;
  color: #fff;
}

/* ERP 헤더 버튼 - 스크롤 후 흰 헤더 상태 */
.header.scrolled .erp-header-btn {
  border-color: #2d6a4f;
  background: transparent;
  color: #2d6a4f;
}
.header.scrolled .erp-header-btn:hover {
  background: #2d6a4f;
  color: #fff;
}

/* 모바일에서 텍스트 숨기고 아이콘만 — erp-header-btn 과 동일 처리 */
@media (max-width: 768px) {
  .staff-portal-btn span { display: none; }
  .staff-portal-btn {
    padding: 8px 10px;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    justify-content: center;
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.55);
  }
  .staff-portal-btn i { font-size: 15px; }
}

/* ================================================================
   PORTAL MODAL
================================================================ */
.portal-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: rgba(10, 24, 16, 0.65);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.portal-overlay.active {
  opacity: 1;
  visibility: visible;
}
.portal-modal {
  position: relative;
  background: #fff;
  border-radius: 24px;
  padding: 44px 40px 36px;
  max-width: 440px;
  width: 100%;
  text-align: center;
  box-shadow: 0 30px 80px rgba(0,0,0,0.25);
  transform: translateY(24px) scale(0.97);
  transition: transform 0.35s cubic-bezier(.34,1.36,.64,1);
  border-top: 4px solid #2d6a4f;
}
.portal-overlay.active .portal-modal {
  transform: translateY(0) scale(1);
}

/* 닫기 버튼 */
.portal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: none;
  background: #f5f5f5;
  color: #718096;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.portal-close:hover {
  background: #e2e8f0;
  color: #2d3748;
  transform: rotate(90deg);
}

/* 아이콘 */
.portal-icon {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  color: #2d6a4f;
  margin: 0 auto 20px;
}

/* 텍스트 */
.portal-title {
  font-size: 22px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 10px;
}
.portal-desc {
  font-size: 14px;
  color: #718096;
  line-height: 1.8;
  margin-bottom: 20px;
}

/* 안내 박스 */
.portal-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f0fdf4;
  border: 1px solid #b7e4c7;
  border-radius: 12px;
  padding: 12px 16px;
  margin-bottom: 24px;
  text-align: left;
}
.portal-notice i {
  color: #2d6a4f;
  font-size: 15px;
  flex-shrink: 0;
}
.portal-notice span {
  font-size: 12.5px;
  color: #2d6a4f;
  font-weight: 500;
  line-height: 1.6;
}

/* 버튼 그룹 */
.portal-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 18px;
}
.portal-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 20px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  transition: all 0.25s ease;
  border: 2px solid transparent;
  text-decoration: none;
}
.portal-btn--primary {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  box-shadow: 0 6px 20px rgba(45,106,79,0.3);
}
.portal-btn--primary:hover {
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(45,106,79,0.4);
}
.portal-btn--cancel {
  background: transparent;
  border-color: #e2e8f0;
  color: #718096;
}
.portal-btn--cancel:hover {
  background: #f7fafc;
  border-color: #cbd5e0;
  color: #4a5568;
}

/* 하단 안내 */
.portal-footer-note {
  font-size: 12px;
  color: #a0aec0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.portal-footer-note i { color: #b7e4c7; }

/* 모바일 최적화 */
@media (max-width: 480px) {
  .portal-modal {
    padding: 36px 24px 28px;
    border-radius: 20px;
  }
  .portal-title { font-size: 19px; }
  .portal-desc { font-size: 13px; }
  .portal-btn { font-size: 14px; padding: 13px 18px; }
}

/* ================================================================
   RESPONSIVE
================================================================ */

/* ── 태블릿 (1024px 이하) ── */
@media (max-width: 1024px) {
  .about__grid { grid-template-columns: 1fr; gap: 50px; }
  .about__visual { max-width: 500px; margin: 0 auto; }
  .eco__content { grid-template-columns: 1fr; }
  .eco__visual { order: -1; }
  .quality__grid { grid-template-columns: 1fr; }
  .contact__grid { grid-template-columns: 1fr; }
  .footer__inner { grid-template-columns: 1fr; gap: 40px; }
  /* 사업영역: 태블릿 2열 */
  .business__grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── 태블릿 헤더 메뉴 최적화 (769~1180px) ── */
@media (min-width: 769px) and (max-width: 1180px) {
  /* 로고 텍스트 숨기고 이미지만 */
  .logo-text { display: none; }
  .logo-divider { display: none; }
  /* 메뉴 폰트/패딩 최소화 */
  .nav-list a { font-size: 11.5px; padding: 4px 7px; }
  /* ERP·포털 버튼 텍스트 숨김 (두 버튼 동일 스타일 적용) */
  .erp-header-btn span,
  .staff-portal-btn span { display: none; }
  .erp-header-btn,
  .staff-portal-btn {
    padding: 7px 10px;
    border-radius: 50%;
    width: 34px;
    height: 34px;
    justify-content: center;
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.55);
  }
}

/* ── 모바일 (768px 이하) ── */
@media (max-width: 768px) {

  /* ─ 공통 ─ */
  .section { padding: 56px 0; }
  .container { padding: 0 20px; }

  /* ─ 헤더 ─ */
  .header__nav {
    position: fixed;
    top: 0; right: -100%;
    width: min(280px, 85vw);
    height: 100%;
    height: 100dvh;
    background: rgba(13,31,22,0.98);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 80px 28px 40px;
    transition: right 0.35s cubic-bezier(.4,0,.2,1);
    flex-direction: column;
    border-left: 1px solid rgba(82,183,136,0.25);
    overflow-y: auto;
    z-index: 1050;
  }
  .header__nav.open { right: 0; }
  .nav-list { flex-direction: column; flex-wrap: nowrap; gap: 0; }
  .nav-list a {
    color: rgba(255,255,255,0.88);
    font-size: 15px;
    padding: 14px 0;
    white-space: normal;   /* 모바일 메뉴는 줄바꿈 허용 */
    display: block;
    border-bottom: 1px solid rgba(255,255,255,0.07);
  }
  .hamburger { display: flex; z-index: 1100; }

  /* ─ ERP 헤더 버튼 모바일 (staff-portal-btn 과 완전 통일) ─ */
  .erp-header-btn span { display: none; }
  .erp-header-btn {
    padding: 8px 10px;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    justify-content: center;
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.55);
  }
  .erp-header-btn i { font-size: 15px; }

  /* ─ Hero ─ */
  .hero {
    min-height: 100vh;
    min-height: 100dvh;
    align-items: flex-start;
  }
  .hero__content {
    padding-top: 110px;
    padding-bottom: 80px;
    width: 100%;
  }
  .hero__visual { display: none; }
  .hero__scroll-hint { display: none; }

  .hero__badge {
    font-size: 9px;
    letter-spacing: 0.8px;
    padding: 6px 14px;
    margin-bottom: 18px;
  }
  .hero__title {
    font-size: 34px;
    line-height: 1.3;
    margin-bottom: 18px;
  }
  .hero__desc {
    font-size: 14px;
    margin-bottom: 22px;
  }
  .hero__cert-row {
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
  }
  .hero__cert-item {
    font-size: 10px;
    padding: 8px 10px 7px;
    min-width: 62px;
    gap: 5px;
    border-radius: 12px;
  }
  .hero__btns {
    gap: 10px;
    flex-wrap: wrap;
  }
  .hero__btns .btn {
    padding: 12px 24px;
    font-size: 14px;
  }

  /* ─ Stats ─ */
  .stats { padding: 40px 0; }
  .stats__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .stat-item {
    padding: 22px 14px;
    overflow: hidden;
    min-width: 0;
  }
  .stat-num { font-size: 36px; }
  .stat-num--plain { font-size: 36px; }
  .stat-unit { font-size: 17px; }
  .stat-item p { font-size: 12px; margin-top: 6px; }

  /* ─ About ─ */
  .about__grid { grid-template-columns: 1fr; gap: 0; }
  .about__visual { position: static; width: 100%; max-width: 100%; }
  .about__img-wrap {
    position: relative;
    height: 220px;
    margin-bottom: 0;
  }
  .about__img-box--main {
    position: absolute;
    width: 100% !important;
    height: 220px !important;
    top: 0; left: 0;
  }
  .about__img-box--sub { display: none; }
  .about__info-card {
    position: static;
    margin-top: 16px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.07);
  }

  /* ─ Business / News ─ */
  .business__grid { grid-template-columns: 1fr; }
  .news__grid { grid-template-columns: 1fr; }

  /* ─ Contact ─ */
  .form-row { grid-template-columns: 1fr; }
  .contact__form-wrap { padding: 28px 20px; }

  /* ─ Footer ─ */
  .footer__nav { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .footer__inner { gap: 32px; }

  /* ─ Estimate Banner ─ */
  .estimate__banner { padding: 22px 24px; gap: 8px; }
  .estimate__banner-divider { display: none; }
  .estimate__banner-item { min-width: 140px; padding: 8px 14px; }
}

/* ── 소형 모바일 (480px 이하) ── */
@media (max-width: 480px) {

  /* ─ 공통 ─ */
  .section { padding: 48px 0; }
  .container { padding: 0 16px; }
  .section-title { font-size: 24px; }

  /* ─ Hero ─ */
  .hero__content {
    padding-top: 100px;
    padding-bottom: 60px;
  }
  .hero__badge {
    font-size: 8.5px;
    letter-spacing: 0.6px;
    padding: 5px 12px;
  }
  .hero__title {
    font-size: 30px;
    line-height: 1.35;
  }
  .hero__desc { font-size: 13px; }
  .hero__cert-item {
    font-size: 9px;
    padding: 7px 8px 6px;
    min-width: 56px;
    gap: 4px;
    border-radius: 10px;
  }
  .hero__btns { flex-direction: column; }
  .hero__btns .btn { width: 100%; justify-content: center; }

  /* ─ Stats ─ */
  .stats { padding: 32px 0; }
  .stats__list { gap: 10px; }
  .stat-item { padding: 18px 10px; border-radius: 12px; }
  .stat-num { font-size: 30px; }
  .stat-num--plain { font-size: 30px; }
  .stat-unit { font-size: 15px; }
  .stat-item p { font-size: 11px; }

  /* ─ About ─ */
  .about__img-wrap { height: 180px; }
  .about__img-box--main { height: 180px !important; }
  .about__info-card { padding: 16px; }

  /* ─ Process ─ */
  .process-flow { flex-direction: column; align-items: center; }
  .process-arrow { transform: rotate(90deg); margin: 0; }

  /* ─ Footer ─ */
  .footer__nav { grid-template-columns: repeat(3, 1fr); gap: 12px; }
  .footer__bottom .container { flex-direction: column; text-align: center; gap: 6px; }
}

/* ── 초소형 (375px 이하) ── */
@media (max-width: 375px) {
  .hero__title { font-size: 26px; }
  .hero__badge { display: none; }
  .stats__list { gap: 8px; }
  .stat-num { font-size: 26px; }
  .stat-num--plain { font-size: 26px; }
  .stat-unit { font-size: 13px; }
  .stat-item p { font-size: 10px; }
}

/* ── Utility ── */
.br-mobile { display: none; }
@media (max-width: 480px) { .br-mobile { display: block; } }

/* ================================================================
   GROUP – 계열사 현황
================================================================ */

/* 임원 카드 */
.group-sub-title {
  font-size: 18px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.group-sub-title i { color: #40916c; }

.group-executives { margin-bottom: 56px; }
.exec-cards {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.exec-card {
  background: #fff;
  border-radius: 16px;
  padding: 22px 28px;
  border: 1px solid #edf2ef;
  min-width: 200px;
  transition: all 0.3s;
  position: relative;
}
.exec-card:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(45,106,79,0.1); }
.exec-card--highlight {
  border: 2px solid #52b788;
  background: linear-gradient(135deg, #f5fff8, #fff);
}
.exec-card__role {
  font-size: 11px;
  font-weight: 700;
  color: #40916c;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.exec-card__name {
  font-size: 22px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 8px;
  letter-spacing: 2px;
}
.exec-card__tel {
  font-size: 14px;
  color: #718096;
  display: flex;
  align-items: center;
  gap: 6px;
}
.exec-card__tel i { color: #52b788; }
.exec-card__badge {
  position: absolute;
  top: -10px; right: 16px;
  background: linear-gradient(90deg, #2d6a4f, #52b788);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 12px;
  border-radius: 50px;
}

/* ================================================================
   권역별 계열사 레이아웃
================================================================ */
.region-group {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* 권역 블록 */
.region-block {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #edf2ef;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(45,106,79,0.05);
}

/* 권역 라벨 */
.region-label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 28px;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 2px;
  border-bottom: 1px solid rgba(255,255,255,0.2);
}
.region-label i { font-size: 14px; }

.region-label--hq {
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  color: #fff;
}
.region-label--chungbuk {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
}
.region-label--gyeonggi {
  background: linear-gradient(135deg, #1b4f72, #2e86c1);
  color: #fff;
}
.region-label--chungnam {
  background: linear-gradient(135deg, #6c3483, #9b59b6);
  color: #fff;
}

/* 카드 그리드 */
.region-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1px;
  background: #f0f4f1;
}
.region-cards .affiliate-card {
  border-radius: 0;
  border: none;
  box-shadow: none;
  background: #fff;
  transition: background 0.2s, transform 0.2s;
}
.region-cards .affiliate-card:hover {
  background: #f8fdf9;
  transform: none;
  box-shadow: none;
  border-color: transparent;
}
.region-cards .affiliate-card--main {
  border: none;
  box-shadow: none;
  background: linear-gradient(135deg, #f0fdf5, #e6f7ec);
}
.region-cards .affiliate-card--hq {
  background: linear-gradient(135deg, #fafffe, #f0fdf5);
}

/* 기존 affiliates-grid / affiliates-others (하위호환 보존) */
.affiliates-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 24px;
  align-items: start;
}
.affiliates-others {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  align-content: start;
}

/* 계열사 카드 공통 */
.affiliate-card {
  background: #fff;
  border-radius: 18px;
  border: 1px solid #edf2ef;
  overflow: hidden;
  transition: all 0.3s;
}
.affiliate-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(45,106,79,0.1); border-color: #b7e4c7; }
.affiliate-card--main {
  border: 2px solid #52b788;
  box-shadow: 0 8px 30px rgba(45,106,79,0.1);
}

.affiliate-card__header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid #f5f8f6;
}
.affiliate-card__icon {
  width: 44px; height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #2d6a4f;
  flex-shrink: 0;
}
.affiliate-card--main .affiliate-card__icon {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  width: 52px; height: 52px;
  font-size: 22px;
  border-radius: 14px;
}
.affiliate-card--hq .affiliate-card__icon {
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  color: #fff;
  width: 52px; height: 52px;
  font-size: 22px;
  border-radius: 14px;
}
.affiliate-badge--hq {
  background: linear-gradient(90deg, #1a3c2b, #2d6a4f);
  color: #fff;
}
.affiliate-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 50px;
  font-size: 10px;
  font-weight: 700;
  background: #edf2ef;
  color: #40916c;
  margin-bottom: 4px;
}
.affiliate-badge--main {
  background: linear-gradient(90deg, #2d6a4f, #40916c);
  color: #fff;
}
.affiliate-card__header h4 {
  font-size: 15px;
  font-weight: 700;
  color: #1a3c2b;
}
.affiliate-card--main .affiliate-card__header h4 { font-size: 18px; }

.affiliate-card__info {
  padding: 16px 20px 18px;
}
.affiliate-card__info p {
  font-size: 12px;
  color: #718096;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.affiliate-card__info i { color: #52b788; width: 14px; text-align: center; flex-shrink: 0; }
.affiliate-card__info a { color: #2d6a4f; font-weight: 600; }
.affiliate-card__info a:hover { text-decoration: underline; }

.affiliate-card__dept {
  padding: 10px 20px;
  border-bottom: 1px solid #f5f8f6;
}
.dept-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: #2d6a4f;
  background: #d8f3dc;
  padding: 4px 12px;
  border-radius: 50px;
}

/* 본사 임직원 전체 테이블 */
.staff-table-wrap {
  padding: 0 20px 20px;
  overflow-x: auto;
}
.staff-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  margin-top: 12px;
}
.staff-table thead th {
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  color: #fff;
  padding: 9px 12px;
  text-align: left;
  font-weight: 600;
  font-size: 12px;
}
.staff-table thead th:first-child { border-radius: 8px 0 0 0; }
.staff-table thead th:last-child  { border-radius: 0 8px 0 0; }
.staff-table tbody tr:nth-child(even) { background: #f9fdf9; }
.staff-table tbody tr:hover { background: #edf7ef; }
.staff-table tbody td {
  padding: 8px 12px;
  color: #4a5568;
  border-bottom: 1px solid #f0f4f1;
  font-size: 13px;
}

/* 계열사 미니 직원 목록 */
.affiliate-staff-mini {
  padding: 12px 20px 16px;
}
.staff-mini-row {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid #f5f8f6;
  font-size: 12.5px;
  align-items: center;
}
.staff-mini-row:last-child { border-bottom: none; }
.staff-mini-row span:first-child {
  font-weight: 700;
  color: #40916c;
  font-size: 11px;
}
.staff-mini-row span:last-child { color: #2d3748; }

/* 개인정보 안내 */
.privacy-notice {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: #718096;
  background: #f5f8f6;
  border-radius: 8px;
  padding: 7px 12px;
  margin-top: 12px;
  margin-bottom: 2px;
}
.privacy-notice i { color: #40916c; }

/* ================================================================
   HERO – 인증 뱃지 행 & 서브
================================================================ */
.hero__cert-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 32px;
  align-items: flex-end;
}

/* 인증 배지: 흰색 배경 카드 스타일로 마크 원본 색상 그대로 표시 */
.hero__cert-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 10px 14px 8px;
  background: rgba(255, 255, 255, 0.95);
  border: none;
  border-radius: 14px;
  font-size: 11px;
  color: #1a3c2b;
  font-weight: 700;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
  min-width: 72px;
  text-align: center;
  letter-spacing: -0.2px;
}
.hero__cert-item i { color: #2d6a4f; font-size: 22px; }

/* ── Hero 섹션 인증마크 이미지 ── */
.hero-cert-img {
  width: 44px;
  height: 44px;
  object-fit: contain;
  /* 원본 색상 그대로 – 흰 배경 위에 표시 */
  filter: none;
  opacity: 1;
  flex-shrink: 0;
}
.hero-cert-img--ks {
  /* KS 마크는 검정색 – 원본 유지 */
  filter: none;
  opacity: 1;
}

/* ── 타임라인 인증마크 이미지 ── */
.tl-cert-img {
  width: 26px;
  height: 26px;
  object-fit: contain;
  vertical-align: middle;
  margin-right: 6px;
  border-radius: 5px;
  /* 흰 배경 위 원본 색상 유지 */
  filter: none;
  background: #fff;
  padding: 2px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.12);
}
.tl-cert-img--co2 {
  /* 녹색 CO2 마크 – 원본 유지 */
  filter: none;
}

/* ── 타임라인 인증마크 블록 (제목 위 독립 배치) ── */
.tl-cert-mark {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 14px;
}
.tl-cert-mark__img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  border-radius: 14px;
  background: #fff;
  padding: 6px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.15);
  filter: none;
  display: block;
}
.tl-cert-mark__img--co2 {
  filter: none;
}
.tl-icon-wrap {
  width: 80px;
  height: 80px;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
  color: #40916c;
}

/* CO2 마크 SVG (레거시 - 유지) */
.co2-mark-icon {
  width: 30px;
  height: 30px;
  object-fit: contain;
  filter: brightness(0) invert(1);
  flex-shrink: 0;
}
.co2-mark-footer {
  width: 22px;
  height: 22px;
  object-fit: contain;
  vertical-align: middle;
  filter: brightness(0) invert(1) opacity(0.85);
  margin-right: 2px;
}
.footer__cert-co2 {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.hero__sub {
  display: block;
  font-size: 14px;
  color: rgba(255,255,255,0.5);
  margin-top: 4px;
  font-weight: 400;
}

/* ================================================================
   ABOUT – 회사 정보 카드 + 미션 + 코어 밸류
================================================================ */
.about__info-card {
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
  background: #fff;
  border-radius: 16px;
  padding: 20px 24px;
  box-shadow: 0 16px 50px rgba(0,0,0,0.1);
  border-left: 4px solid #52b788;
}
.company-info-list { display: flex; flex-direction: column; gap: 8px; }
.company-info-list li {
  display: flex;
  gap: 10px;
  font-size: 13px;
  align-items: flex-start;
}
.ci-label {
  flex-shrink: 0;
  width: 64px;
  font-weight: 600;
  color: #40916c;
}
.ci-value { color: #2d3748; }
.ci-sub { font-size: 11px; color: #718096; }

/* 미션 박스 */
.mission-box {
  background: linear-gradient(135deg, #f5f8f6, #edf2ef);
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 24px;
  border-left: 4px solid #52b788;
}
.mission-quote {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.mission-quote i { color: #52b788; font-size: 20px; flex-shrink: 0; margin-top: 4px; }
.mission-quote p { font-size: 16px; font-weight: 600; color: #1a3c2b; line-height: 1.7; }

/* 코어 밸류 */
.core-values { display: flex; flex-direction: column; gap: 14px; }
.cv-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 14px 16px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #edf2ef;
  transition: all 0.3s;
}
.cv-item:hover { border-color: #b7e4c7; box-shadow: 0 4px 16px rgba(45,106,79,0.08); }
.cv-item > i {
  flex-shrink: 0;
  width: 36px; height: 36px;
  border-radius: 10px;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2d6a4f;
  font-size: 15px;
  margin-top: 2px;
}
.cv-item div { display: flex; flex-direction: column; gap: 2px; }
.cv-item strong { font-size: 14px; color: #1a3c2b; font-weight: 600; }
.cv-item span { font-size: 13px; color: #718096; }

/* About visual 높이 조정 */
.about__img-wrap { padding-bottom: 120px; }

/* ================================================================
   HISTORY – 타임라인 (반응형 완전 재작성)
   데스크톱: 좌우 지그재그 / 태블릿·모바일: 세로 단일 컬럼
================================================================ */
.history { overflow: visible; }

/* ── 공통 래퍼 ── */
.timeline {
  position: relative;
  max-width: 820px;
  margin: 0 auto;
  padding: 10px 0 40px;
}

/* ── 세로 트랙 선 (데스크톱) ── */
.timeline__track {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, #d8f3dc, #52b788, #d8f3dc);
  transform: translateX(-50%);
  pointer-events: none;
}

/* ── 개별 아이템 (데스크톱: 좌우 배치) ── */
.tl-item {
  position: relative;
  width: 44%;
  margin-bottom: 36px;
  /* dot 위치 보정을 위해 overflow 허용 */
}
.tl-item--left  { margin-right: auto; padding-right: 44px; text-align: right; }
.tl-item--right { margin-left:  auto; padding-left:  44px; text-align: left;  }

/* ── 중심 점 ── */
.tl-dot {
  position: absolute;
  top: 22px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #2d6a4f;
  border: 3px solid #fff;
  box-shadow: 0 0 0 3px #52b788;
  z-index: 3;
}
.tl-item--left  .tl-dot { right: -51px; }
.tl-item--right .tl-dot { left:  -51px; }
.tl-dot--future { background: #b7e4c7; box-shadow: 0 0 0 3px #d8f3dc; }

/* ── 카드 ── */
.tl-card {
  background: #fff;
  border-radius: 16px;
  padding: 24px 22px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
  border: 1px solid #edf2ef;
  position: relative;
  transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
  text-align: center;
}
.tl-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 36px rgba(45,106,79,0.12);
  border-color: #b7e4c7;
}
.tl-card--highlight {
  border-color: #52b788;
  background: linear-gradient(135deg, #f5fff8, #fff);
}
.tl-card--future {
  background: #f5f8f6;
  border-style: dashed;
  border-color: #b7e4c7;
}
.tl-year {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #40916c;
  letter-spacing: 1px;
  margin-bottom: 10px;
  text-align: left;
}
.tl-card h4 {
  font-size: 15px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 6px;
  line-height: 1.4;
}
.tl-card h4 i { margin-right: 6px; color: #52b788; }
.tl-card p { font-size: 13px; color: #718096; line-height: 1.7; }
.tl-badge {
  position: absolute;
  top: -10px;
  right: 14px;
  background: linear-gradient(90deg, #2d6a4f, #52b788);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 50px;
  letter-spacing: 1px;
}

/* ── 태블릿 이하: 세로 단일 컬럼 ── */
@media (max-width: 760px) {
  .timeline__track {
    left: 20px;
    transform: none;
  }
  .tl-item,
  .tl-item--left,
  .tl-item--right {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 50px;
    padding-right: 0;
    text-align: left;
  }
  .tl-item--left .tl-dot,
  .tl-item--right .tl-dot {
    left: 14px;
    right: auto;
  }
}

/* ================================================================
   ECO – 3대 인증 카드
================================================================ */
.eco__certs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 60px;
}
.eco-cert-card {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  background: #fff;
  border-radius: 18px;
  padding: 24px;
  border: 2px solid #edf2ef;
  transition: all 0.3s;
  box-shadow: 0 4px 16px rgba(0,0,0,0.04);
}
.eco-cert-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(45,106,79,0.12); }
.eco-cert-card--ks { border-top: 3px solid #f6ad55; }
.eco-cert-card--epd { border-top: 3px solid #52b788; }
.eco-cert-card--lowcarbon { border-top: 3px solid #4299e1; }
.eco-cert-card__icon {
  flex-shrink: 0;
  width: 64px; height: 64px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  overflow: hidden;
  background: transparent;
  padding: 4px;
}
/* 이미지 아이콘 스타일 */
.eco-cert-card__icon--img {
  width: 72px;
  height: 72px;
  background: #fff;
  border-radius: 12px;
  padding: 6px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.eco-cert-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.eco-cert-card--ks .eco-cert-card__icon { background: #fef3cd; }
.eco-cert-card--epd .eco-cert-card__icon { background: #f0faf2; }
.eco-cert-card--lowcarbon .eco-cert-card__icon { background: #f0faf2; }
.eco-cert-card__body { flex: 1; }
.eco-cert-card__body strong { display: block; font-size: 15px; font-weight: 700; color: #1a3c2b; margin-bottom: 3px; }
.eco-cert-card__body span { display: block; font-size: 11px; color: #40916c; font-weight: 600; margin-bottom: 8px; }
.eco-cert-card__body p { font-size: 13px; color: #718096; line-height: 1.7; }

/* eco-data-box */
.eco-data-box {
  background: #fff;
  border-radius: 16px;
  padding: 20px 28px;
  margin-top: 24px;
  border: 1px solid #d8f3dc;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}
.eco-data-box__label {
  font-size: 13px;
  font-weight: 700;
  color: #40916c;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
  white-space: nowrap;
  text-align: center;
}
.eco-data-row {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}
.eco-data-row span {
  font-size: 13px;
  color: #4a5568;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
}
.eco-data-row i { color: #52b788; flex-shrink: 0; }

/* ================================================================
   QUALITY – 추가 요소
================================================================ */
.quality__qs-note {
  margin-top: 20px;
  padding: 14px 20px;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  border-radius: 12px;
  font-size: 13px;
  color: #1a3c2b;
  font-weight: 500;
  text-align: center;
}
.quality__qs-note i { margin-right: 8px; color: #2d6a4f; }

/* ================================================================
   FOOTER – 인증 뱃지 행
================================================================ */
.footer__tagline { font-size: 14px; line-height: 1.8; margin-bottom: 12px; }
.footer__cert-row {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 16px;
}
.footer__cert-row span {
  font-size: 11px;
  color: rgba(255,255,255,0.6);
  display: flex;
  align-items: center;
  gap: 6px;
}
.footer__cert-row i { color: #52b788; }
/* 실제 이미지 인증 뱃지 */
.footer__cert-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: rgba(255,255,255,0.7);
  font-weight: 500;
}
/* Footer 인증마크: 작은 흰 배경 카드로 원본 색상 표시 */
.footer-cert-img {
  width: 30px;
  height: 30px;
  object-fit: contain;
  filter: none;
  opacity: 1;
  background: #fff;
  border-radius: 6px;
  padding: 2px;
}
.footer-cert-img--ks {
  filter: none;
  opacity: 1;
}
.footer__cert-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: rgba(255,255,255,0.85);
  font-weight: 600;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 50px;
  padding: 4px 10px 4px 4px;
}

/* ================================================================
   ESG 경영 섹션
================================================================ */

/* ── 선언 블록 ── */
.esg-declaration {
  display: flex;
  gap: 28px;
  align-items: flex-start;
  background: #fff;
  border-radius: 20px;
  padding: 36px 40px;
  margin-bottom: 48px;
  border-left: 5px solid #2d6a4f;
  box-shadow: 0 4px 20px rgba(45,106,79,0.08);
}
.esg-decl__icon {
  flex-shrink: 0;
  width: 56px; height: 56px;
  border-radius: 14px;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; color: #2d6a4f;
}
.esg-decl__body h3 {
  font-size: 20px; font-weight: 700; color: #1a3c2b;
  margin-bottom: 14px;
}
.esg-decl__body p {
  font-size: 15px; color: #4a5568; line-height: 1.85;
  margin-bottom: 10px;
}
.esg-decl__body p:last-child { margin-bottom: 0; }

/* ── 공통 블록 타이틀 ── */
.esg-block-title {
  font-size: 19px; font-weight: 700; color: #1a3c2b;
  margin-bottom: 10px;
  display: flex; align-items: center; gap: 10px;
}
.esg-block-title i { color: #52b788; font-size: 18px; }
.esg-block-desc {
  font-size: 14px; color: #718096; margin-bottom: 24px;
}

/* ── 경영 목적 ── */
.esg-purpose {
  background: #fff;
  border-radius: 20px;
  padding: 36px 40px;
  margin-bottom: 48px;
  box-shadow: 0 4px 20px rgba(45,106,79,0.06);
}
.esg-purpose__list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 14px;
}
.esg-purpose__list li {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: 15px; color: #2d3748; line-height: 1.7;
  padding: 14px 18px;
  background: #f8faf9;
  border-radius: 12px;
  border-left: 3px solid #52b788;
  transition: background 0.25s;
}
.esg-purpose__list li:hover { background: #d8f3dc; }
.esg-purpose__list li i { color: #2d6a4f; font-size: 16px; margin-top: 3px; flex-shrink: 0; }

/* ── 추진 체계 ── */
.esg-system {
  background: #fff;
  border-radius: 20px;
  padding: 36px 40px;
  margin-bottom: 48px;
  box-shadow: 0 4px 20px rgba(45,106,79,0.06);
}
.esg-system__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.esg-system-card {
  background: linear-gradient(135deg, #f0faf4, #e8f5ec);
  border-radius: 16px;
  padding: 24px 20px;
  text-align: center;
  border: 1px solid #d8f3dc;
  transition: all 0.3s;
}
.esg-system-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(45,106,79,0.12);
  border-color: #52b788;
}
.esg-system-card__num {
  font-family: 'Montserrat', sans-serif;
  font-size: 28px; font-weight: 700;
  color: #52b788; margin-bottom: 12px;
}
.esg-system-card p {
  font-size: 13px; color: #2d3748; line-height: 1.7;
  margin: 0;
}

/* ── 분야별 E·S·G 카드 ── */
.esg-pillars {
  margin-bottom: 48px;
}
.esg-pillars__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 8px;
}
.esg-pillar-card {
  background: #fff;
  border-radius: 20px;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
  transition: all 0.3s;
  display: flex; flex-direction: column;
}
.esg-pillar-card:hover { transform: translateY(-6px); box-shadow: 0 20px 48px rgba(0,0,0,0.12); }

.esg-pillar-card__header {
  display: flex; align-items: center; gap: 16px;
  padding: 24px 28px 20px;
}
.esg-pillar-card--e .esg-pillar-card__header { background: linear-gradient(135deg, #1a3c2b, #2d6a4f); }
.esg-pillar-card--s .esg-pillar-card__header { background: linear-gradient(135deg, #1a3348, #2d4a6f); }
.esg-pillar-card--g .esg-pillar-card__header { background: linear-gradient(135deg, #3d1a2b, #6f2d4f); }

.esg-pillar-tag {
  width: 52px; height: 52px;
  border-radius: 14px;
  background: rgba(255,255,255,0.2);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 26px; font-weight: 700; color: #fff;
  flex-shrink: 0;
}
.esg-pillar-card__header > div strong {
  display: block; font-size: 17px; font-weight: 700; color: #fff;
}
.esg-pillar-card__header > div span {
  font-size: 12px; color: rgba(255,255,255,0.7); font-weight: 400;
}

.esg-pillar-card__list {
  list-style: none; padding: 20px 28px; margin: 0; flex: 1;
  display: flex; flex-direction: column; gap: 12px;
}
.esg-pillar-card__list li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 13px; color: #4a5568; line-height: 1.65;
}
.esg-pillar-card--e .esg-pillar-card__list li i { color: #2d6a4f; flex-shrink: 0; }
.esg-pillar-card--s .esg-pillar-card__list li i { color: #2d4a6f; flex-shrink: 0; }
.esg-pillar-card--g .esg-pillar-card__list li i { color: #6f2d4f; flex-shrink: 0; }

.esg-pillar-card__cta {
  margin: 0 28px 24px;
  padding: 12px 16px;
  border-radius: 10px;
  font-size: 12px; font-weight: 600;
  display: flex; align-items: center; gap: 8px;
}
.esg-pillar-card--e .esg-pillar-card__cta { background: #d8f3dc; color: #1a3c2b; }
.esg-pillar-card--s .esg-pillar-card__cta { background: #d8e8f3; color: #1a3348; }
.esg-pillar-card--g .esg-pillar-card__cta { background: #f3d8e8; color: #3d1a2b; }

/* ── 지속적 개선 의지 ── */
.esg-commitment {
  background: linear-gradient(135deg, #1a3c2b 0%, #2d6a4f 100%);
  border-radius: 24px;
  padding: 2px;
  margin-bottom: 0;
}
.esg-commitment__inner {
  background: #fff;
  border-radius: 22px;
  padding: 52px 60px;
  text-align: center;
}
.esg-commitment__icon {
  width: 72px; height: 72px;
  border-radius: 50%;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  display: flex; align-items: center; justify-content: center;
  font-size: 30px; color: #2d6a4f;
  margin: 0 auto 24px;
}
.esg-commitment__inner h3 {
  font-size: 22px; font-weight: 700; color: #1a3c2b;
  margin-bottom: 16px;
}
.esg-commitment__inner > p {
  font-size: 15px; color: #4a5568; line-height: 1.85;
  margin-bottom: 28px;
}
.esg-commitment__list {
  list-style: none; padding: 0; margin: 0 auto 32px;
  display: inline-flex; flex-direction: column; gap: 12px;
  text-align: left;
}
.esg-commitment__list li {
  display: flex; align-items: center; gap: 12px;
  font-size: 15px; color: #2d3748;
  padding: 10px 20px;
  background: #f0faf4;
  border-radius: 50px;
}
.esg-commitment__list li i { color: #40916c; }
.esg-commitment__closing {
  font-size: 15px; color: #4a5568; line-height: 1.85;
}
.esg-commitment__closing strong { color: #1a3c2b; }

/* ── 반응형 ── */
@media (max-width: 1024px) {
  .esg-system__grid { grid-template-columns: repeat(2, 1fr); }
  .esg-pillars__grid { grid-template-columns: repeat(2, 1fr); }
  .esg-pillar-card:last-child { grid-column: 1 / -1; max-width: 480px; margin: 0 auto; width: 100%; }
}
@media (max-width: 768px) {
  .esg-declaration { flex-direction: column; gap: 16px; padding: 24px; }
  .esg-purpose { padding: 24px; }
  .esg-system { padding: 24px; }
  .esg-system__grid { grid-template-columns: repeat(2, 1fr); }
  .esg-pillars__grid { grid-template-columns: 1fr; }
  .esg-pillar-card:last-child { grid-column: auto; max-width: 100%; }
  .esg-commitment__inner { padding: 36px 24px; }
  .esg-commitment__list { width: 100%; }
}
@media (max-width: 480px) {
  .esg-system__grid { grid-template-columns: 1fr; }
}

/* ================================================================
   MAP placeholder
================================================================ */
.map-placeholder {
  margin-top: 24px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
}
.map-placeholder i { font-size: 32px; color: #74c69d; }
.map-placeholder span { font-size: 13px; color: rgba(255,255,255,0.7); }
.map-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  border-radius: 50px;
  background: rgba(255,255,255,0.15);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  transition: background 0.3s;
}
.map-link:hover { background: rgba(255,255,255,0.3); }

/* ================================================================
   RESPONSIVE – 추가
================================================================ */
@media (max-width: 1024px) {
  .eco__certs { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  .eco__certs { grid-template-columns: 1fr; }
  .eco-cert-card { flex-direction: row; gap: 14px; align-items: center; }
  .eco-cert-card__icon--img { width: 56px; height: 56px; }
  /* 모바일 hero 인증 카드 */
  .hero-cert-img { width: 34px; height: 34px; }
  .hero__cert-row { gap: 8px; }
  .tl-cert-img { width: 20px; height: 20px; }
  .tl-cert-mark__img { width: 64px; height: 64px; }
  .tl-icon-wrap { width: 64px; height: 64px; font-size: 28px; }
  /* footer 인증 */
  .footer-cert-img { width: 26px; height: 26px; }
}

@media (max-width: 480px) {
  .eco__certs { grid-template-columns: 1fr; }
  .eco-cert-card { flex-direction: row; gap: 12px; }
  .eco-cert-card__icon--img { width: 48px; height: 48px; }
  .footer__cert-row { gap: 6px; flex-wrap: wrap; }
  .footer-cert-img { width: 22px; height: 22px; }
  .footer__cert-badge { font-size: 10px; padding: 3px 8px 3px 3px; }
  .tl-card { padding: 14px 16px; }
  .hero-cert-img { width: 28px; height: 28px; }
  .hero-cert-img { width: 22px; height: 22px; }
}

@media (max-width: 1100px) {
  .affiliates-grid { grid-template-columns: 1fr; }
  .affiliates-others { grid-template-columns: repeat(2, 1fr); }
  /* 권역 카드 2열 */
  .region-cards { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  /* 임원 카드 */
  .exec-cards { flex-direction: column; gap: 12px; }
  .exec-card { min-width: auto; }
  /* 계열사 */
  .affiliates-others { grid-template-columns: 1fr; }
  .staff-mini-row { grid-template-columns: 50px 1fr; font-size: 12px; }
  /* 권역 라벨 */
  .region-label { padding: 14px 20px; font-size: 14px; }
  /* 권역 카드 1열 */
  .region-cards { grid-template-columns: 1fr; }
  /* 로고 */
  .logo-sra { height: 24px; }
  .logo-text { font-size: 16px; }
}

@media (max-width: 480px) {
  .affiliates-others { grid-template-columns: 1fr; }
  .staff-table { font-size: 12px; }
  .staff-table tbody td { padding: 6px 8px; }
  /* 헤더 로고 */
  .logo-sra { height: 20px; }
  .logo-divider { height: 20px; }
  .logo-text { font-size: 14px; }
  /* 임원카드 이름 */
  .exec-card__name { font-size: 18px; }
  /* 권역 블록 */
  .region-block { border-radius: 14px; }
  .region-label { padding: 12px 16px; font-size: 13px; letter-spacing: 1px; }
}

/* back-to-top, staff-portal-btn, portal-overlay 등은 상단에서 정의됨 */

/* ================================================================
   PWA 설치 배너 (안드로이드)
================================================================ */
.pwa-banner {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: #fff;
  border-top: 1px solid #e2e8f0;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.12);
  padding: 14px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  z-index: 1500;
  /* display:none은 JS가 제어 */
}
.pwa-banner__icon {
  width: 48px; height: 48px;
  border-radius: 12px;
  object-fit: cover;
  flex-shrink: 0;
}
.pwa-banner__text {
  flex: 1;
  min-width: 0;
}
.pwa-banner__text strong {
  display: block;
  font-size: 14px; font-weight: 700; color: #1a3c2b;
  margin-bottom: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pwa-banner__text span {
  font-size: 12px; color: #718096;
}
.pwa-banner__btn {
  background: linear-gradient(135deg, #2d6a4f, #52b788);
  color: #fff;
  font-size: 13px; font-weight: 700;
  padding: 10px 20px;
  border-radius: 50px;
  flex-shrink: 0;
  white-space: nowrap;
  transition: all 0.25s;
}
.pwa-banner__btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(45,106,79,0.3); }
.pwa-banner__close {
  color: #a0aec0;
  font-size: 18px;
  padding: 4px;
  flex-shrink: 0;
  transition: color 0.2s;
}
.pwa-banner__close:hover { color: #4a5568; }

/* ================================================================
   PWA 앱 설치 안내 공통 모달 (iOS + Android)
================================================================ */

/* 플로팅 설치 버튼 (FAB) */
.pwa-fab {
  position: fixed;
  bottom: 88px;
  right: 20px;
  z-index: 1400;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  background: linear-gradient(135deg, #2d6a4f, #52b788);
  color: #fff;
  border: none;
  border-radius: 20px;
  padding: 12px 16px;
  font-size: 11px;
  font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  box-shadow: 0 6px 24px rgba(45,106,79,0.38);
  transition: transform 0.2s, box-shadow 0.2s;
  white-space: nowrap;
  animation: fabPop 0.4s cubic-bezier(.4,0,.2,1);
}
.pwa-fab i { font-size: 20px; }
.pwa-fab:hover { transform: translateY(-3px); box-shadow: 0 10px 32px rgba(45,106,79,0.45); }
@keyframes fabPop {
  from { transform: scale(0.6) translateY(20px); opacity: 0; }
  to   { transform: scale(1) translateY(0); opacity: 1; }
}

/* 공통 오버레이 */
.pwa-install-overlay {
  position: fixed;
  inset: 0;
  background: rgba(10,24,16,0.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 9000;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: env(safe-area-inset-bottom, 0);
}

/* 모달 본체 */
.pwa-install-modal {
  background: #fff;
  border-radius: 28px 28px 0 0;
  padding: 28px 24px 36px;
  max-width: 480px;
  width: 100%;
  position: relative;
  animation: slideUp 0.38s cubic-bezier(.4,0,.2,1);
  max-height: 90dvh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
@keyframes slideUp {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

/* 닫기 버튼 */
.pwa-install-close {
  position: absolute;
  top: 14px; right: 16px;
  width: 34px; height: 34px;
  border-radius: 50%;
  background: #f0f4f0;
  color: #718096;
  font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s;
  flex-shrink: 0;
}
.pwa-install-close:hover { background: #e2e8f0; color: #2d3748; }

/* 헤더 */
.pwa-install-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 22px;
  padding-right: 40px;
}
.pwa-install-icon {
  width: 64px; height: 64px;
  border-radius: 16px;
  flex-shrink: 0;
  box-shadow: 0 4px 16px rgba(0,0,0,0.14);
  object-fit: cover;
}
.pwa-install-header h3 {
  font-size: 18px; font-weight: 700; color: #1a3c2b;
  margin-bottom: 2px;
}
.pwa-install-sub {
  font-size: 12px; color: #718096;
  display: flex; align-items: center; gap: 5px;
}
.pwa-install-header--ios  .pwa-install-sub::before { content: ''; display:inline-block; width:14px;height:14px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23555' d='M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.8-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z'/%3E%3C/svg%3E") center/contain no-repeat; }
.pwa-install-header--android .pwa-install-sub::before { content:''; display:inline-block; width:14px;height:14px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233ddc84' d='M17.523 15.34l1.43-2.487a.5.5 0 0 0-.85-.489l-1.448 2.516A8.94 8.94 0 0 1 12 15.77a8.94 8.94 0 0 1-4.655-1.89L5.897 11.364a.5.5 0 0 0-.85.49l1.43 2.486A9.48 9.48 0 0 0 12 17.77a9.48 9.48 0 0 0 5.523-2.43zM8.5 11a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm7 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z'/%3E%3C/svg%3E") center/contain no-repeat; }

/* 단계 목록 */
.pwa-install-steps {
  list-style: none;
  display: flex; flex-direction: column; gap: 10px;
  margin-bottom: 24px;
}
.pwa-install-steps li {
  display: flex; align-items: flex-start; gap: 12px;
  background: #f8faf9;
  border: 1px solid #e8f0eb;
  border-radius: 14px;
  padding: 13px 15px;
}
.pwa-step-num {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2d6a4f, #52b788);
  color: #fff;
  font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}
.pwa-install-steps li > div {
  font-size: 13px; color: #2d3748; line-height: 1.6; flex: 1;
}
.pwa-install-steps li > div strong { color: #1a3c2b; }
.pwa-step-icon {
  font-size: 16px;
  margin-left: 6px;
  vertical-align: middle;
}

/* 확인 버튼 */
.pwa-install-confirm {
  width: 100%;
  padding: 15px;
  border-radius: 14px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  font-size: 15px; font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  transition: all 0.25s;
  border: none; cursor: pointer;
}
.pwa-install-confirm:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(45,106,79,0.3); }

/* 모바일 반응형 */
@media (max-width: 480px) {
  .pwa-install-modal { padding: 24px 18px 32px; }
  .pwa-install-header h3 { font-size: 16px; }
  .pwa-fab { bottom: 76px; right: 14px; padding: 10px 13px; }
}

/* staff-portal-btn은 상단 STAFF PORTAL BUTTON 섹션에서 정의됨 */

/* form-mail-notice는 상단 CONTACT 섹션에서 정의됨 */

/* ================================================================
   PWA 앱 설치 버튼 (푸터) - 구버전 제거됨, footer__pwa-cta 사용
================================================================ */
/* footer__pwa-cta는 footer 섹션 상단 .footer__pwa-row에서 정의 */

/* ================================================================
   QUALITY 추가 반응형
================================================================ */
@media (max-width: 768px) {
  .quality__text h3 { font-size: 20px; }
  .cert-badges { gap: 10px; }
  .cert-badge { padding: 16px 18px; }
}

/* CONTACT, FOOTER 추가 반응형은 기존 블록에서 처리됨 */

/* safety-goal-banner는 상단 SAFETY 섹션에서 이미 정의됨 */

/* ================================================================
   NOTICE – 공지사항
================================================================ */
.notice { background: #f5f8f6; }

/* 툴바 (탭 + 검색) */
.notice__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  background: #fff;
  border-radius: 16px;
  padding: 14px 20px;
  margin-bottom: 28px;
  box-shadow: 0 2px 12px rgba(45,106,79,0.07);
  border: 1px solid #e8f0eb;
}
.notice__tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.ntab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;
  color: #4a5568;
  background: #f5f8f6;
  border: 1px solid #e2e8f0;
  transition: all 0.25s;
  cursor: pointer;
}
.ntab:hover { background: #d8f3dc; color: #1a3c2b; border-color: #b7e4c7; }
.ntab--active {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(45,106,79,0.25);
}
.ntab i { font-size: 12px; }

.notice__search {
  display: flex;
  align-items: center;
  gap: 0;
  border: 1.5px solid #d0e8d8;
  border-radius: 50px;
  overflow: hidden;
  background: #fff;
}
.notice__search input {
  border: none;
  outline: none;
  padding: 9px 16px;
  font-size: 13px;
  width: 220px;
  background: transparent;
  color: #2d3748;
}
.notice__search input::placeholder { color: #a0aec0; }
#noticeSearchBtn {
  padding: 9px 16px;
  background: linear-gradient(135deg, #2d6a4f, #52b788);
  color: #fff;
  font-size: 13px;
  border: none;
  cursor: pointer;
  transition: opacity 0.2s;
}
#noticeSearchBtn:hover { opacity: 0.85; }

/* 본문 2열 */
.notice__body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}

/* 목록 */
.notice__list-wrap {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #e8f0eb;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(45,106,79,0.06);
}
.notice__list-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px 14px;
  border-bottom: 1px solid #f0f4f0;
}
.nl-title {
  font-size: 16px;
  font-weight: 700;
  color: #1a3c2b;
}
.nl-count {
  font-size: 13px;
  color: #52b788;
  font-weight: 600;
}
.notice__list-head-row {
  display: grid;
  grid-template-columns: 1fr 88px 80px 54px;
  gap: 0;
  padding: 10px 24px;
  background: #f8faf9;
  border-bottom: 1px solid #edf2ef;
  font-size: 12px;
  font-weight: 700;
  color: #718096;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.notice__list { list-style: none; margin: 0; padding: 0; }
.notice-item {
  display: grid;
  grid-template-columns: 1fr 88px 80px 54px;
  align-items: center;
  padding: 14px 24px;
  border-bottom: 1px solid #f5f8f6;
  cursor: pointer;
  transition: background 0.2s;
}
.notice-item:last-child { border-bottom: none; }
.notice-item:hover { background: #f0fdf4; }
.notice-item--active { background: #e8f5ec; }
.notice-item__title {
  font-size: 14px;
  color: #2d3748;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
}
.notice-item__title .nbadge-new {
  flex-shrink: 0;
  background: #e53e3e;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  padding: 1px 5px;
  border-radius: 4px;
  letter-spacing: 0.5px;
}
.notice-item__cat {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 50px;
  text-align: center;
  white-space: nowrap;
}
.ncat--price   { background: #e8f4fd; color: #2b6cb0; }
.ncat--supply  { background: #fef3cd; color: #c05621; }
.ncat--assoc   { background: #f0fff4; color: #276749; }
.ncat--urgent  { background: #fff5f5; color: #c53030; }
.ncat--general { background: #f7fafc; color: #4a5568; }
.notice-item__date {
  font-size: 12px;
  color: #a0aec0;
}
.notice-item__imp {
  text-align: center;
}
.imp--high {
  font-size: 11px;
  font-weight: 700;
  color: #e53e3e;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
}
.imp--high::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #e53e3e;
  flex-shrink: 0;
}
.imp--normal {
  font-size: 11px;
  color: #a0aec0;
}

/* 페이지네이션 */
.notice__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 16px 24px;
  border-top: 1px solid #f0f4f0;
}
.npag-btn {
  width: 32px; height: 32px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #4a5568;
  background: #f5f8f6;
  border: 1px solid #e2e8f0;
  cursor: pointer;
  transition: all 0.2s;
  display: flex; align-items: center; justify-content: center;
}
.npag-btn:hover { background: #d8f3dc; border-color: #b7e4c7; color: #1a3c2b; }
.npag-btn--active {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border-color: transparent;
}
.npag-arrow { color: #718096; }

/* 상세 패널 */
.notice__detail {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #e8f0eb;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(45,106,79,0.06);
  position: sticky;
  top: 90px;
  min-height: 300px;
}
.notice__detail-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 80px 24px;
  color: #a0aec0;
}
.notice__detail-empty i { font-size: 48px; color: #d8f3dc; }
.notice__detail-empty p { font-size: 14px; }

/* 상세 내용 */
.notice-detail__header {
  padding: 24px 28px 18px;
  border-bottom: 1px solid #f0f4f0;
}
.notice-detail__badges {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.notice-detail__badge-group {
  display: flex;
  gap: 8px;
}
.notice-detail__back {
  font-size: 12px;
  color: #52b788;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: color 0.2s;
}
.notice-detail__back:hover { color: #2d6a4f; }
.notice-detail__title {
  font-size: 20px;
  font-weight: 700;
  color: #1a3c2b;
  line-height: 1.4;
  margin-bottom: 10px;
}
.notice-detail__meta {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 12px;
  color: #a0aec0;
  flex-wrap: wrap;
}
.notice-detail__meta span {
  display: flex;
  align-items: center;
  gap: 4px;
}
.notice-detail__meta i { font-size: 11px; }

/* 요약 정보 박스 */
.notice-detail__summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  background: linear-gradient(135deg, #f0fdf4, #e8f5ec);
  border-bottom: 1px solid #d8f3dc;
}
.nd-summary-item {
  padding: 16px 20px;
  text-align: center;
  border-right: 1px solid #d8f3dc;
}
.nd-summary-item:last-child { border-right: none; }
.nd-summary-item i {
  font-size: 20px;
  color: #40916c;
  display: block;
  margin-bottom: 6px;
}
.nd-summary-item .nd-label {
  font-size: 11px;
  color: #718096;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: block;
  margin-bottom: 4px;
}
.nd-summary-item .nd-val {
  font-size: 13px;
  font-weight: 700;
  color: #1a3c2b;
}

/* 본문 */
.notice-detail__body {
  padding: 24px 28px;
  font-size: 14px;
  color: #4a5568;
  line-height: 1.85;
  max-height: 520px;
  overflow-y: auto;
}
.notice-detail__body h3 {
  font-size: 15px;
  font-weight: 700;
  color: #1a3c2b;
  margin: 20px 0 10px;
}
.notice-detail__body p { margin-bottom: 12px; }
.notice-detail__body ul {
  list-style: disc;
  padding-left: 20px;
  margin-bottom: 12px;
}
.notice-detail__body ul li { margin-bottom: 6px; }

/* 단가표 */
.nd-price-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin: 12px 0 16px;
  border-radius: 10px;
  overflow: hidden;
}
.nd-price-table th {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  padding: 10px 12px;
  text-align: center;
  font-weight: 700;
}
.nd-price-table td {
  padding: 9px 12px;
  text-align: center;
  border-bottom: 1px solid #f0f4f0;
  color: #2d3748;
}
.nd-price-table tr:nth-child(even) td { background: #f8faf9; }
.nd-price-table .td-up { color: #e53e3e; font-weight: 700; }
.nd-price-table .td-note { font-size: 11px; color: #a0aec0; }

/* 상세 하단 CTA */
.notice-detail__cta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 18px 28px;
  border-top: 1px solid #f0f4f0;
  background: #fafcfb;
}
.nd-cta-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 16px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  transition: all 0.25s;
  cursor: pointer;
  text-decoration: none;
}
.nd-cta-btn--outline {
  background: #fff;
  color: #2d6a4f;
  border: 2px solid #52b788;
}
.nd-cta-btn--outline:hover { background: #d8f3dc; }
.nd-cta-btn--fill {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border: 2px solid transparent;
}
.nd-cta-btn--fill:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(45,106,79,0.3); }

/* ── 반응형 ── */
@media (max-width: 1024px) {
  .notice__body { grid-template-columns: 1fr; }
  .notice__detail { position: static; }
}
@media (max-width: 768px) {
  .notice__toolbar { flex-direction: column; align-items: stretch; }
  .notice__tabs { justify-content: flex-start; }
  .notice__search input { width: 160px; }
  .notice__list-head-row,
  .notice-item { grid-template-columns: 1fr 70px 68px 44px; padding: 12px 16px; }
  .notice-detail__summary { grid-template-columns: 1fr; }
  .nd-summary-item { border-right: none; border-bottom: 1px solid #d8f3dc; }
  .nd-summary-item:last-child { border-bottom: none; }
  .notice-detail__cta { grid-template-columns: 1fr; gap: 8px; }
  .notice-detail__title { font-size: 17px; }
}
@media (max-width: 480px) {
  .notice__tabs { gap: 6px; }
  .ntab { padding: 7px 12px; font-size: 12px; }
  .notice__list-head-row { display: none; }
  .notice-item {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 4px 8px;
    padding: 12px 14px;
  }
  .notice-item__title { grid-column: 1; }
  .notice-item__imp  { grid-column: 2; grid-row: 1; }
  .notice-item__cat  { grid-column: 1; }
  .notice-item__date { grid-column: 2; grid-row: 2; font-size: 11px; }
  .notice-detail__header { padding: 18px 18px 14px; }
  .notice-detail__body { padding: 18px; }
  .notice-detail__cta { padding: 14px 18px; }
}

/* ================================================================
   ESTIMATE – 견적 요청
================================================================ */
.estimate { background: #f5f8f6; }

/* 상단 안내 배너 */
.estimate__banner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0;
  background: linear-gradient(135deg, #1a3c2b 0%, #2d6a4f 60%, #40916c 100%);
  border-radius: 20px;
  padding: 28px 40px;
  margin-bottom: 40px;
  box-shadow: 0 8px 32px rgba(26,60,43,0.22);
}
.estimate__banner-item {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  min-width: 180px;
  padding: 8px 20px;
}
.estimate__banner-item i {
  font-size: 26px;
  color: #74c69d;
  flex-shrink: 0;
}
.estimate__banner-item strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 3px;
  line-height: 1.3;
}
.estimate__banner-item span {
  font-size: 12px;
  color: rgba(255,255,255,0.65);
}
.estimate__banner-divider {
  width: 1px;
  height: 40px;
  background: rgba(255,255,255,0.18);
  flex-shrink: 0;
}
@media (max-width: 900px) {
  .estimate__banner { padding: 22px 24px; gap: 8px; }
  .estimate__banner-divider { display: none; }
  .estimate__banner-item { min-width: 140px; padding: 8px 14px; }
}
@media (max-width: 600px) {
  .estimate__banner {
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 22px;
    gap: 16px;
  }
  .estimate__banner-item { padding: 0; min-width: unset; }
}
.estimate__grid {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 32px;
  align-items: start;
}

/* 단계 인디케이터 */
.est-steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: 32px;
  padding: 24px 32px;
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  border-radius: 16px;
}
.est-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  opacity: 0.5;
  transition: opacity 0.3s;
}
.est-step--active { opacity: 1; }
.est-step--done   { opacity: 0.8; }
.est-step__circle {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  border: 2px solid rgba(255,255,255,0.4);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 16px; font-weight: 700;
  color: #fff;
  transition: all 0.3s;
}
.est-step--active .est-step__circle {
  background: #fff;
  color: #2d6a4f;
  border-color: #fff;
  box-shadow: 0 4px 16px rgba(255,255,255,0.3);
}
.est-step--done .est-step__circle {
  background: #52b788;
  border-color: #52b788;
}
.est-step span {
  font-size: 12px;
  font-weight: 600;
  color: rgba(255,255,255,0.75);
  white-space: nowrap;
}
.est-step--active span { color: #fff; }
.est-step__line {
  flex: 1;
  height: 2px;
  background: rgba(255,255,255,0.2);
  margin: 0 12px;
  margin-bottom: 22px;
  min-width: 40px;
}

/* 폼 카드 */
.estimate__form-wrap {
  background: #fff;
  border-radius: 24px;
  border: 1px solid #e8f0eb;
  box-shadow: 0 8px 40px rgba(45,106,79,0.08);
  overflow: hidden;
}
.est-fieldset {
  border: none;
  padding: 0;
  margin: 0;
  display: none;
}
.est-fieldset--active { display: block; }
.est-step-title {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 22px 32px;
  font-size: 17px;
  font-weight: 700;
  color: #1a3c2b;
  border-bottom: 1px solid #f0f4f0;
  background: #fafcfb;
}
.est-step-num {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(135deg, #2d6a4f, #52b788);
  padding: 4px 10px;
  border-radius: 50px;
  letter-spacing: 1px;
}
.est-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  padding: 20px 32px 0;
}
.est-group {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.est-group--full {
  padding: 0 32px 0;
  margin-top: 20px;
}
.est-group label {
  font-size: 13px;
  font-weight: 600;
  color: #2d3748;
}
.est-group label em {
  color: #e53e3e;
  font-style: normal;
  margin-left: 2px;
}
.est-group input,
.est-group select,
.est-group textarea {
  padding: 11px 14px;
  border: 1.5px solid #d8e8d8;
  border-radius: 10px;
  font-size: 14px;
  color: #2d3748;
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
  font-family: 'Noto Sans KR', sans-serif;
  outline: none;
}
.est-group input:focus,
.est-group select:focus,
.est-group textarea:focus {
  border-color: #52b788;
  box-shadow: 0 0 0 3px rgba(82,183,136,0.15);
}
.est-group select {
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2352b788' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}
.est-group textarea { resize: vertical; min-height: 100px; }
.est-hint { font-size: 11px; color: #718096; margin-top: 2px; }

/* 빠른 선택 버튼 */
.est-quick-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.est-quick {
  padding: 7px 14px;
  border-radius: 50px;
  font-size: 12px;
  font-weight: 600;
  color: #4a5568;
  background: #f5f8f6;
  border: 1.5px solid #e2e8f0;
  cursor: pointer;
  transition: all 0.2s;
}
.est-quick:hover { background: #d8f3dc; border-color: #b7e4c7; color: #1a3c2b; }
.est-quick--active {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border-color: transparent;
}

/* 토글 버튼 (타설 시간) */
.est-toggle-group {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.est-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: #4a5568;
  background: #f5f8f6;
  border: 1.5px solid #e2e8f0;
  cursor: pointer;
  transition: all 0.2s;
}
.est-toggle:hover { background: #d8f3dc; border-color: #b7e4c7; color: #1a3c2b; }
.est-toggle--active {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border-color: transparent;
}

/* 체크박스 */
.est-check-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.est-check {
  display: flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  font-size: 13px;
  color: #4a5568;
  font-weight: 500;
}
.est-check input[type="checkbox"] {
  width: 16px; height: 16px;
  accent-color: #2d6a4f;
  cursor: pointer;
  padding: 0;
  border: none;
  box-shadow: none;
}
.est-check input[type="checkbox"]:focus { box-shadow: none; }

/* 글자 수 카운터 */
.est-char-count {
  text-align: right;
  font-size: 11px;
  color: #a0aec0;
  margin-top: 4px;
}

/* 페이지 하단 버튼 */
.est-page-btns {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 24px 32px;
  border-top: 1px solid #f0f4f0;
  margin-top: 24px;
  background: #fafcfb;
}
.est-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 28px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.25s;
  font-family: 'Noto Sans KR', sans-serif;
  border: none;
}
.est-btn--prev {
  background: #f5f8f6;
  color: #4a5568;
  border: 1.5px solid #e2e8f0;
}
.est-btn--prev:hover { background: #edf2ef; }
.est-btn--next {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
}
.est-btn--next:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(45,106,79,0.3); }
.est-btn--submit {
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  color: #fff;
}
.est-btn--submit:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(26,60,43,0.35); }
.est-btn--submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* 사이드바 */
.estimate__sidebar {
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: sticky;
  top: 90px;
}
.est-side-card {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #e8f0eb;
  padding: 24px;
  box-shadow: 0 4px 20px rgba(45,106,79,0.06);
}
.est-side-card--contact {
  background: linear-gradient(135deg, #f0fdf4, #e8f5ec);
  border-color: #b7e4c7;
}
.est-side-card--info {
  background: #fafcfb;
}
.est-side-card--qform {
  background: linear-gradient(135deg, #f0fdf4, #e6f4ea);
  border-color: #95d5b2;
  border-left: 4px solid #40916c;
}
.est-qform-features {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.est-qform-features li {
  font-size: 13px;
  color: #2d6a4f;
  display: flex;
  align-items: center;
  gap: 7px;
}
.est-qform-features li i {
  color: #52b788;
  font-size: 12px;
  flex-shrink: 0;
}
.est-side-card h4 {
  font-size: 15px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.est-side-card h4 i { color: #52b788; }
.est-side-card > p {
  font-size: 13px;
  color: #718096;
  margin-bottom: 14px;
  line-height: 1.6;
}
.est-side-tel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px;
  border-radius: 12px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  font-size: 17px;
  font-weight: 800;
  text-decoration: none;
  margin-bottom: 10px;
  transition: all 0.25s;
  letter-spacing: 0.5px;
}
.est-side-tel:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(45,106,79,0.3); }
.est-side-mail {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px;
  border-radius: 12px;
  background: #fff;
  color: #2d6a4f;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  border: 2px solid #52b788;
  transition: all 0.25s;
}
.est-side-mail:hover { background: #d8f3dc; }

/* 약속 목록 */
.est-promise-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.est-promise-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.est-promise-list li > i {
  color: #52b788;
  font-size: 14px;
  margin-top: 3px;
  flex-shrink: 0;
}
.est-promise-list li > div strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #1a3c2b;
}
.est-promise-list li > div span {
  font-size: 12px;
  color: #718096;
}

/* 안내 목록 */
.est-info-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.est-info-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  color: #4a5568;
  line-height: 1.65;
}
.est-info-list li > i { color: #52b788; font-size: 11px; margin-top: 3px; flex-shrink: 0; }

/* ── 반응형 ── */
@media (max-width: 1100px) {
  .estimate__grid { grid-template-columns: 1fr 300px; gap: 24px; }
}
@media (max-width: 900px) {
  .estimate__grid { grid-template-columns: 1fr; }
  .estimate__sidebar { position: static; flex-direction: row; flex-wrap: wrap; }
  .est-side-card { flex: 1; min-width: 260px; }
}
@media (max-width: 768px) {
  .est-steps { padding: 18px 20px; gap: 0; }
  .est-step__circle { width: 36px; height: 36px; font-size: 14px; }
  .est-step span { font-size: 11px; }
  .est-step__line { min-width: 20px; }
  .est-row { grid-template-columns: 1fr; padding: 16px 20px 0; }
  .est-group--full { padding: 0 20px 0; }
  .est-page-btns { padding: 20px; flex-wrap: wrap; }
  .est-btn { padding: 12px 20px; font-size: 14px; }
  .est-step-title { padding: 18px 20px; font-size: 15px; }
  .estimate__sidebar { flex-direction: column; }
}
@media (max-width: 480px) {
  .est-steps { border-radius: 12px; padding: 14px 16px; }
  .est-step span { display: none; }
  .est-step__line { min-width: 16px; }
  .est-btn--submit { width: 100%; justify-content: center; }
  .est-page-btns { justify-content: space-between; }
}

/* ================================================================
   NAV DROPDOWN – 고객지원 드롭다운
================================================================ */

.nav-has-dropdown {
  position: relative;
}
.nav-dropdown-toggle {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  white-space: nowrap;
}
.nav-chevron {
  font-size: 10px;
  transition: transform 0.3s;
}
.nav-has-dropdown:hover .nav-chevron,
.nav-has-dropdown.open .nav-chevron {
  transform: rotate(180deg);
}

.nav-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 12px 40px rgba(26,60,43,0.16);
  border: 1px solid #e8f0eb;
  min-width: 180px;
  padding: 8px;
  z-index: 2000;
  list-style: none;
}
.nav-dropdown::before {
  content: '';
  position: absolute;
  top: -7px;
  left: 50%;
  transform: translateX(-50%);
  width: 12px; height: 12px;
  background: #fff;
  border-left: 1px solid #e8f0eb;
  border-top: 1px solid #e8f0eb;
  transform: translateX(-50%) rotate(45deg);
}
.nav-has-dropdown:hover .nav-dropdown,
.nav-has-dropdown.open .nav-dropdown {
  display: block;
  animation: dropIn 0.22s cubic-bezier(.4,0,.2,1);
}
@keyframes dropIn {
  from { opacity: 0; transform: translateX(-50%) translateY(-8px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}
.nav-dropdown li a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: #2d3748 !important;
  transition: background 0.2s, color 0.2s;
  white-space: nowrap;
}
.nav-dropdown li a i { color: #52b788; font-size: 13px; }
.nav-dropdown li a:hover {
  background: #f0fdf4;
  color: #1a3c2b !important;
}
.nav-dropdown li a::after { display: none !important; }

/* 모바일 드롭다운 - 사이드 메뉴 안에서 인라인으로 */
@media (max-width: 768px) {
  .nav-dropdown {
    position: static;
    transform: none;
    box-shadow: none;
    border: none;
    border-left: 2px solid #52b788;
    border-radius: 0;
    padding: 4px 0 4px 16px;
    margin-top: 4px;
    background: transparent;
    display: none;
  }
  .nav-dropdown::before { display: none; }
  .nav-has-dropdown.open .nav-dropdown { display: block; animation: none; }
  .nav-dropdown li a {
    color: rgba(255,255,255,0.75) !important;
    padding: 10px 0;
    font-size: 14px;
    border-radius: 0;
    border-bottom: none;
  }
  .nav-dropdown li a:hover { background: transparent; color: #52b788 !important; }
}

/* ================================================================
   ESTIMATE – 모바일 키보드 시 화면 묻힘 방지
================================================================ */
/* 모바일에서 포커스 시 자동 스크롤 도우미 */
@media (max-width: 768px) {
  .estimate__form-wrap {
    /* 하단 여백 충분히 확보 – 키보드 올라왔을 때 마지막 필드 보이도록 */
    padding-bottom: 200px;
    /* 섹션 자체가 스크롤 컨테이너 역할 */
    overflow-anchor: none;
  }
  .est-fieldset--active {
    scroll-margin-top: 80px;
  }
  .est-group input,
  .est-group select,
  .est-group textarea {
    /* iOS 자동 확대 방지: 16px 이상 유지 */
    font-size: 16px !important;
    /* 탭 인덱스 영역 확보 */
    min-height: 44px;
  }
  /* 입력 포커스 시 시각적 강조 */
  .est-group input:focus,
  .est-group select:focus,
  .est-group textarea:focus {
    border-color: #40916c !important;
    box-shadow: 0 0 0 3px rgba(64,145,108,0.18) !important;
    position: relative;
    z-index: 2;
  }
  /* 사이드바 카드는 세로 정렬 */
  .estimate__sidebar { flex-direction: column; }

  /* 스텝 버튼 고정 영역 확보 */
  .est-page-btns {
    position: sticky;
    bottom: 0;
    background: #fff;
    border-top: 1px solid #e8f0eb;
    padding: 14px 20px;
    z-index: 10;
    margin: 0 -1px;
    border-radius: 0 0 24px 24px;
  }
}

/* ================================================================
   NOTICE COMMENTS – 댓글 & 상태 표시
================================================================ */
.notice-status-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 28px;
  background: #f8faf9;
  border-top: 1px solid #f0f4f0;
  flex-wrap: wrap;
}
.notice-status-label {
  font-size: 12px;
  font-weight: 600;
  color: #718096;
}
.notice-status-select {
  padding: 5px 12px;
  border-radius: 50px;
  border: 1.5px solid #d0e8d8;
  font-size: 12px;
  font-weight: 700;
  color: #2d3748;
  background: #fff;
  cursor: pointer;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
}
.nstatus--검토중  { background: #fffbeb; color: #b45309; border-color: #fde68a; }
.nstatus--처리중  { background: #eff6ff; color: #1d4ed8; border-color: #bfdbfe; }
.nstatus--완료    { background: #f0fdf4; color: #15803d; border-color: #bbf7d0; }
.nstatus--보류    { background: #fef2f2; color: #dc2626; border-color: #fecaca; }

/* 댓글 영역 */
.notice-comments {
  border-top: 1px solid #f0f4f0;
  padding: 20px 28px;
  background: #fafcfb;
}
.notice-comments__title {
  font-size: 14px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.notice-comments__title i { color: #52b788; }

.notice-comment-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 16px;
  max-height: 260px;
  overflow-y: auto;
}
.notice-comment-item {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e8f0eb;
  padding: 12px 16px;
}
.nc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
.nc-author {
  font-size: 12px;
  font-weight: 700;
  color: #2d6a4f;
}
.nc-date {
  font-size: 11px;
  color: #a0aec0;
}
.nc-body {
  font-size: 13px;
  color: #4a5568;
  line-height: 1.65;
}
.nc-delete {
  background: none;
  border: none;
  color: #cbd5e0;
  font-size: 11px;
  cursor: pointer;
  padding: 2px 4px;
  transition: color 0.2s;
}
.nc-delete:hover { color: #e53e3e; }

/* 댓글 입력 */
.notice-comment-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.nc-form-row {
  display: flex;
  gap: 8px;
}
.nc-input-name {
  width: 130px;
  flex-shrink: 0;
  padding: 9px 12px;
  border: 1.5px solid #d0e8d8;
  border-radius: 10px;
  font-size: 13px;
  outline: none;
  font-family: 'Noto Sans KR', sans-serif;
}
.nc-input-text {
  flex: 1;
  padding: 9px 12px;
  border: 1.5px solid #d0e8d8;
  border-radius: 10px;
  font-size: 13px;
  resize: none;
  outline: none;
  font-family: 'Noto Sans KR', sans-serif;
  min-height: 60px;
}
.nc-input-name:focus,
.nc-input-text:focus {
  border-color: #52b788;
  box-shadow: 0 0 0 3px rgba(82,183,136,0.12);
}
.nc-submit {
  align-self: flex-end;
  padding: 9px 20px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: 'Noto Sans KR', sans-serif;
}
.nc-submit:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(45,106,79,0.25); }

.notice-comment-empty {
  font-size: 13px;
  color: #a0aec0;
  text-align: center;
  padding: 16px 0;
}

/* 공지 목록 – 댓글 수 뱃지 */
.notice-item__cmt {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  font-weight: 600;
  color: #52b788;
  background: #f0fdf4;
  border: 1px solid #d8f3dc;
  border-radius: 50px;
  padding: 1px 7px;
  margin-left: 6px;
  vertical-align: middle;
}
.notice-item__cmt i { font-size: 10px; }

/* 공지 목록 – 처리상태 배지 */
.nstatus-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  border-radius: 50px;
  padding: 1px 8px;
  margin-left: 6px;
  vertical-align: middle;
  border: 1px solid transparent;
}
.nstatus-badge--review  { background: #fffbeb; color: #b45309; border-color: #fde68a; }
.nstatus-badge--process { background: #eff6ff; color: #1d4ed8; border-color: #bfdbfe; }
.nstatus-badge--done    { background: #f0fdf4; color: #15803d; border-color: #bbf7d0; }
.nstatus-badge--hold    { background: #fef2f2; color: #dc2626; border-color: #fecaca; }

@media (max-width: 480px) {
  .notice-comments { padding: 16px; }
  .nc-form-row { flex-direction: column; }
  .nc-input-name { width: 100%; }
  .notice-item__cmt,
  .nstatus-badge { display: none; }
}

/* ================================================================
   CERTIFICATES – 인증서 출력
================================================================ */
.certs { background: #fff; }

/* 관리자 토글 */
.certs__admin-toggle {
  text-align: right;
  margin-bottom: 24px;
}
.certs__admin-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 20px;
  background: #f5f8f6;
  border: 1.5px solid #d0e8d8;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 700;
  color: #2d6a4f;
  cursor: pointer;
  transition: all 0.2s;
}
.certs__admin-btn:hover { background: #d8f3dc; border-color: #52b788; }
.certs__admin-btn i { color: #52b788; }

/* 로그인 상태 관리자 UI */
.certs__admin-loggedin {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.certs__admin-loggedin-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #2d6a4f;
  background: #d8f3dc;
  border: 1.5px solid #b7e4c7;
  border-radius: 50px;
  padding: 5px 14px;
  letter-spacing: 0.03em;
}
.certs__admin-loggedin-label i { color: #40916c; font-size: 11px; }

/* 새 등록 버튼 (초록) */
.certs__admin-btn--add {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  border-color: transparent;
  color: #fff;
}
.certs__admin-btn--add:hover { background: linear-gradient(135deg, #1a3c2b, #2d6a4f); border-color: transparent; }
.certs__admin-btn--add i { color: #d8f3dc; }

/* 로그아웃 버튼 (회색) */
.certs__admin-btn--logout {
  background: #f5f5f5;
  border-color: #e2e8f0;
  color: #718096;
}
.certs__admin-btn--logout:hover { background: #fff5f5; border-color: #fecaca; color: #e53e3e; }
.certs__admin-btn--logout i { color: #a0aec0; }
.certs__admin-btn--logout:hover i { color: #e53e3e; }

/* 관리자 패널 */
.certs__admin-panel {
  margin-bottom: 32px;
  animation: dropIn 0.25s ease;
}
.certs__admin-inner {
  background: linear-gradient(135deg, #f0fdf4, #e8f5ec);
  border: 1.5px solid #b7e4c7;
  border-radius: 20px;
  padding: 28px 32px;
}
.certs__admin-inner h4 {
  font-size: 16px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.certs__admin-inner h4 i { color: #40916c; }

/* ── 패널 헤더 ── */
.cadmin-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1.5px solid #b7e4c7;
}
.cadmin-header__icon {
  width: 48px; height: 48px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; color: #fff;
  flex-shrink: 0;
}
.cadmin-header h4 {
  font-size: 17px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 4px !important;
}
.cadmin-header p {
  font-size: 12px;
  color: #718096;
  line-height: 1.5;
}

/* ── 섹션 구분 ── */
.cadmin-section {
  background: #fff;
  border: 1px solid #e0eeea;
  border-radius: 16px;
  padding: 20px 22px;
  margin-bottom: 16px;
}
.cadmin-section__title {
  font-size: 13px;
  font-weight: 700;
  color: #2d6a4f;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.cadmin-optional {
  font-size: 11px;
  font-weight: 500;
  color: #a0aec0;
  background: #f0f4f0;
  border-radius: 50px;
  padding: 2px 8px;
  margin-left: 4px;
}

/* ── 파일 업로드 드롭존 ── */
.cert-upload-zone {
  border: 2px dashed #b7e4c7;
  border-radius: 16px;
  background: #f8fdf9;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
  overflow: hidden;
}
.cert-upload-zone:hover,
.cert-upload-zone--dragover {
  border-color: #40916c;
  background: #edfbf2;
}
.cert-upload-zone--done {
  border-color: #40916c;
  border-style: solid;
  background: #f0fdf4;
}
.cert-upload-zone__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 36px 24px;
  text-align: center;
  pointer-events: none;
}
.cert-upload-zone__icon {
  width: 56px; height: 56px;
  background: linear-gradient(135deg, #d8f3dc, #b7e4c7);
  border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
  color: #2d6a4f;
  margin-bottom: 14px;
}
.cert-upload-zone__main {
  font-size: 14px;
  font-weight: 600;
  color: #2d3748;
  margin-bottom: 8px;
  line-height: 1.6;
}
.cert-upload-zone__browse {
  color: #2d6a4f;
  font-weight: 700;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 14px;
  text-decoration: underline;
  font-family: 'Noto Sans KR', sans-serif;
  pointer-events: all;
}
.cert-upload-zone__browse:hover { color: #40916c; }
.cert-upload-zone__sub {
  font-size: 12px;
  color: #a0aec0;
  line-height: 1.7;
}
.cert-upload-zone__sub strong { color: #4a5568; }

/* 파일 형식 배지 */
.cert-upload-zone__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  margin-top: 12px;
  pointer-events: none;
}
.cert-upload-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 50px;
  border: 1px solid;
  letter-spacing: 0.5px;
}
.cert-upload-badge--pdf  { background: #fff5f5; color: #c53030; border-color: #feb2b2; }
.cert-upload-badge--img  { background: #ebf8ff; color: #2b6cb0; border-color: #90cdf4; }

/* ── 진행 바 ── */
.cert-upload-progress {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 4px 4px;
}
.cert-upload-progress__bar {
  flex: 1;
  height: 6px;
  background: #e2e8f0;
  border-radius: 50px;
  overflow: hidden;
}
.cert-upload-progress__fill {
  height: 100%;
  background: linear-gradient(90deg, #2d6a4f, #52b788);
  border-radius: 50px;
  transition: width 0.2s ease;
  width: 0%;
}
.cert-upload-progress__label {
  font-size: 12px;
  font-weight: 600;
  color: #2d6a4f;
  white-space: nowrap;
}

/* ── 미리보기 영역 ── */
.cert-preview {
  margin-top: 12px;
  background: #fff;
  border: 1.5px solid #b7e4c7;
  border-radius: 14px;
  overflow: hidden;
}
.cert-preview__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: #f0fdf4;
  border-bottom: 1px solid #d8f3dc;
}
.cert-preview__info {
  display: flex;
  align-items: center;
  gap: 12px;
}
.cert-preview__file-icon {
  font-size: 22px;
}
.cert-preview__file-icon--img { color: #2b6cb0; }
.cert-preview__file-icon--pdf { color: #c53030; }
.cert-preview__name {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #1a3c2b;
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cert-preview__size {
  font-size: 11px;
  color: #a0aec0;
  margin-top: 2px;
  display: block;
}
.cert-preview__remove {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: #fff;
  border: 1.5px solid #e2e8f0;
  color: #a0aec0;
  font-size: 12px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
  flex-shrink: 0;
}
.cert-preview__remove:hover {
  background: #fff5f5;
  border-color: #fecaca;
  color: #e53e3e;
}
.cert-preview__thumb-wrap {
  padding: 12px;
  background: #fafafa;
  text-align: center;
}
.cert-preview__thumb {
  max-width: 100%;
  max-height: 200px;
  border-radius: 8px;
  object-fit: contain;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}
.cert-preview__pdf-msg {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  font-size: 13px;
  color: #c53030;
  font-weight: 600;
  background: #fff5f5;
}
.cert-preview__pdf-msg i { font-size: 18px; }

/* 파일 미등록 버튼 */
.cert-card__print-btn--disabled {
  opacity: 0.45;
  cursor: not-allowed !important;
  background: #f0f4f0 !important;
  color: #a0aec0 !important;
  border-color: #e2e8f0 !important;
}
.certs__form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.certs__form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.certs__form-group--full { grid-column: 1 / -1; }
.certs__form-group label {
  font-size: 13px;
  font-weight: 600;
  color: #2d3748;
}
.certs__form-group label em { color: #e53e3e; font-style: normal; }
.certs__form-group input,
.certs__form-group select {
  padding: 10px 14px;
  border: 1.5px solid #d0e8d8;
  border-radius: 10px;
  font-size: 14px;
  color: #2d3748;
  background: #fff;
  outline: none;
  font-family: 'Noto Sans KR', sans-serif;
  transition: border-color 0.2s;
}
.certs__form-group input:focus,
.certs__form-group select:focus {
  border-color: #52b788;
  box-shadow: 0 0 0 3px rgba(82,183,136,0.12);
}
.certs__admin-btns {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 8px;
}
.certs__save-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 11px 28px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  font-family: 'Noto Sans KR', sans-serif;
}
.certs__save-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(45,106,79,0.28); }
.certs__cancel-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 11px 20px;
  background: #fff;
  color: #718096;
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  font-family: 'Noto Sans KR', sans-serif;
}
.certs__cancel-btn:hover { background: #f5f8f6; }

/* 비밀번호 변경 버튼 */
.certs__changepw-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 11px 20px;
  background: #fff8e1;
  color: #b45309;
  border: 1.5px solid #fde68a;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  font-family: 'Noto Sans KR', sans-serif;
}
.certs__changepw-btn:hover {
  background: #fef3c7;
  border-color: #f59e0b;
  transform: translateY(-1px);
}

/* 카테고리 탭 */
.certs__tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}
.ctab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 18px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;
  color: #4a5568;
  background: #f5f8f6;
  border: 1.5px solid #e2e8f0;
  cursor: pointer;
  transition: all 0.25s;
}
.ctab:hover { background: #d8f3dc; color: #1a3c2b; border-color: #b7e4c7; }
.ctab--active {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(45,106,79,0.22);
}

/* 인증서 그리드 */
.certs__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.cert-card {
  background: #fff;
  border-radius: 20px;
  border: 1px solid #e8f0eb;
  box-shadow: 0 4px 20px rgba(45,106,79,0.07);
  overflow: hidden;
  transition: transform 0.25s, box-shadow 0.25s;
  display: flex;
  flex-direction: column;
}
.cert-card:hover { transform: translateY(-4px); box-shadow: 0 12px 36px rgba(45,106,79,0.14); }

.cert-card__header {
  padding: 20px 20px 16px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.cert-card__icon-wrap {
  width: 52px; height: 52px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
}
.cert-card__icon-wrap--quality { background: linear-gradient(135deg, #ebf8ff, #dbeafe); color: #2b6cb0; }
.cert-card__icon-wrap--eco     { background: linear-gradient(135deg, #f0fff4, #c6f6d5); color: #276749; }
.cert-card__icon-wrap--safety  { background: linear-gradient(135deg, #fffbeb, #fde68a55); color: #b45309; }
.cert-card__icon-wrap--other   { background: linear-gradient(135deg, #f7fafc, #e2e8f0); color: #4a5568; }

.cert-card__badge {
  font-size: 10px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 50px;
  white-space: nowrap;
}
.cert-card__badge--quality { background: #ebf8ff; color: #2b6cb0; }
.cert-card__badge--eco     { background: #f0fff4; color: #276749; }
.cert-card__badge--safety  { background: #fffbeb; color: #b45309; }
.cert-card__badge--other   { background: #f7fafc; color: #4a5568; }

.cert-card__body {
  padding: 0 20px 16px;
  flex: 1;
}
.cert-card__name {
  font-size: 15px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 6px;
  line-height: 1.4;
}
.cert-card__issuer {
  font-size: 12px;
  color: #718096;
  margin-bottom: 10px;
}
.cert-card__meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cert-card__meta-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #4a5568;
}
.cert-card__meta-row i { color: #52b788; font-size: 11px; flex-shrink: 0; width: 12px; }

.cert-card__footer {
  padding: 14px 20px;
  border-top: 1px solid #f0f4f0;
  background: #fafcfb;
  display: flex;
  gap: 8px;
}
.cert-card__print-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 10px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  font-family: 'Noto Sans KR', sans-serif;
  text-decoration: none;
}
.cert-card__print-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(45,106,79,0.28); }
/* 수정 버튼 */
.cert-card__edit-btn {
  width: 38px;
  display: flex; align-items: center; justify-content: center;
  background: #fff;
  border: 1.5px solid #b7e4c7;
  border-radius: 10px;
  color: #52b788;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
}
.cert-card__edit-btn:hover {
  background: #f0fdf4;
  border-color: #52b788;
  color: #2d6a4f;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(45,106,79,0.15);
}

/* 삭제 버튼 */
.cert-card__del-btn {
  width: 38px;
  display: flex; align-items: center; justify-content: center;
  background: #fff;
  border: 1.5px solid #e2e8f0;
  border-radius: 10px;
  color: #a0aec0;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
}
.cert-card__del-btn:hover { background: #fff5f5; border-color: #fecaca; color: #e53e3e; }

/* 카드 푸터 버튼 간격 */
.cert-card__footer {
  gap: 8px;
  flex-wrap: nowrap;
  min-height: 54px; /* 수정/삭제 버튼 없어도 높이 유지 */
}
.cert-card__footer .cert-card__print-btn {
  min-width: 0;
  flex: 1;
}

/* 수정 버튼 – 관리자 로그인 후 renderCerts()에서 동적 삽입 */
/* 높이 맞춤: edit/del 버튼은 print 버튼 높이에 맞춤 */
.cert-card__edit-btn,
.cert-card__del-btn {
  height: 100%;
  min-height: 38px;
  padding: 0;
  box-sizing: border-box;
}

/* 빈 상태 */
.certs__empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 64px 24px;
  color: #a0aec0;
}
.certs__empty i { font-size: 48px; color: #d8f3dc; display: block; margin-bottom: 12px; }
.certs__empty p { font-size: 14px; }

/* 관리자 비밀번호 모달 */
.certs-pw-overlay {
  position: fixed;
  inset: 0;
  background: rgba(10,24,16,0.6);
  backdrop-filter: blur(6px);
  z-index: 3000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s;
}
.certs-pw-overlay.active { opacity: 1; visibility: visible; }
.certs-pw-modal {
  background: #fff;
  border-radius: 20px;
  padding: 36px 36px 28px;
  max-width: 360px;
  width: 90%;
  box-shadow: 0 24px 60px rgba(0,0,0,0.2);
  text-align: center;
}
.certs-pw-icon {
  width: 60px; height: 60px;
  border-radius: 16px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; color: #fff;
  margin: 0 auto 16px;
}
.certs-pw-modal h4 {
  font-size: 18px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 6px;
}
.certs-pw-modal p {
  font-size: 13px;
  color: #718096;
  margin-bottom: 20px;
}
.certs-pw-input {
  width: 100%;
  padding: 12px 16px;
  border: 1.5px solid #d0e8d8;
  border-radius: 12px;
  font-size: 15px;
  text-align: center;
  letter-spacing: 4px;
  outline: none;
  margin-bottom: 16px;
  font-family: 'Noto Sans KR', sans-serif;
}
.certs-pw-input:focus { border-color: #52b788; box-shadow: 0 0 0 3px rgba(82,183,136,0.15); }
.certs-pw-btns {
  display: flex;
  gap: 10px;
}
.certs-pw-confirm {
  flex: 1;
  padding: 12px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  font-family: 'Noto Sans KR', sans-serif;
  transition: all 0.2s;
}
.certs-pw-confirm:hover { opacity: 0.9; }
.certs-pw-cancel {
  flex: 1;
  padding: 12px;
  background: #f5f8f6;
  color: #718096;
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  font-family: 'Noto Sans KR', sans-serif;
  transition: all 0.2s;
}
.certs-pw-cancel:hover { background: #edf2ef; }

/* ── 비밀번호 변경 버튼 (모달 내부 취소와 구분) ── */
.certs-pw-icon--change {
  background: linear-gradient(135deg, #b45309, #f59e0b) !important;
}

/* 비밀번호 변경 모달 – 필드 래퍼 */
.cpw-field-wrap {
  text-align: left;
  margin-bottom: 12px;
}
.cpw-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: #4a5568;
  margin-bottom: 5px;
}
.cpw-label em {
  color: #e53e3e;
  font-style: normal;
  margin-left: 2px;
}
/* 변경 모달에서는 letter-spacing 제거 */
#certsChangePwOverlay .certs-pw-input {
  letter-spacing: 0;
  text-align: left;
  font-size: 14px;
  margin-bottom: 0;
}
/* 힌트 박스 */
.cpw-hint {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 12px;
  color: #92400e;
  line-height: 1.6;
  margin: 14px 0 18px;
  text-align: left;
}
.cpw-hint i { color: #f59e0b; flex-shrink: 0; margin-top: 2px; }
.cpw-hint strong { color: #1a3c2b; }

/* ================================================================
   COMPLAINT – 민원접수 섹션
================================================================ */

/* 섹션 배경 */
.complaint.section {
  background: #fff;
}

/* 상단 안내 카드 3종 */
.complaint__info-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 48px;
}
.complaint__info-card {
  display: flex;
  align-items: center;
  gap: 18px;
  background: #f8faf9;
  border: 1.5px solid #d8f3dc;
  border-radius: 18px;
  padding: 22px 24px;
  transition: box-shadow 0.25s, transform 0.25s;
}
.complaint__info-card:hover {
  box-shadow: 0 8px 28px rgba(45,106,79,0.12);
  transform: translateY(-3px);
}
.complaint__info-icon {
  width: 52px; height: 52px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
}
.complaint__info-icon--phone  { background: linear-gradient(135deg,#2d6a4f,#40916c); color:#fff; }
.complaint__info-icon--direct { background: linear-gradient(135deg,#1a3c2b,#2d6a4f); color:#fff; }
.complaint__info-icon--mail   { background: linear-gradient(135deg,#40916c,#52b788); color:#fff; }

.complaint__info-body h4 {
  font-size: 13px;
  font-weight: 700;
  color: #4a5568;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.complaint__role-badge {
  background: #d8f3dc;
  color: #2d6a4f;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 50px;
}
.complaint__tel {
  display: block;
  font-size: 18px;
  font-weight: 800;
  color: #1a3c2b;
  text-decoration: none;
  letter-spacing: -0.3px;
  line-height: 1.3;
  transition: color 0.2s;
}
.complaint__tel:hover { color: #40916c; }
.complaint__info-body p {
  font-size: 11px;
  color: #a0aec0;
  margin-top: 3px;
}

/* 메인 그리드 */
.complaint__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}

/* ── 왼쪽: 전화 안내 ── */
.complaint__guide {
  background: #f8faf9;
  border: 1.5px solid #d8f3dc;
  border-radius: 24px;
  padding: 32px;
}
.complaint__guide-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.complaint__guide-header i {
  width: 42px; height: 42px;
  background: linear-gradient(135deg,#2d6a4f,#40916c);
  color: #fff;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}
.complaint__guide-header h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1a3c2b;
}
.complaint__guide-desc {
  font-size: 13px;
  color: #718096;
  margin-bottom: 22px;
  line-height: 1.65;
}

/* 준비물 체크리스트 */
.complaint__checklist {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 28px;
}
.complaint__checklist li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: #fff;
  border: 1px solid #e8f0eb;
  border-radius: 14px;
  padding: 14px 16px;
}
.complaint__check-icon {
  width: 36px; height: 36px;
  background: linear-gradient(135deg,#d8f3dc,#b7e4c7);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px;
  color: #2d6a4f;
  flex-shrink: 0;
}
.complaint__checklist li div strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 3px;
}
.complaint__checklist li div p {
  font-size: 12px;
  color: #718096;
  line-height: 1.6;
}

/* 접수 절차 */
.complaint__steps {
  background: #fff;
  border: 1px solid #e8f0eb;
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 20px;
}
.complaint__steps h4 {
  font-size: 13px;
  font-weight: 700;
  color: #2d6a4f;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.complaint__step-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.complaint__step-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.complaint__step-num {
  width: 26px; height: 26px;
  background: linear-gradient(135deg,#2d6a4f,#40916c);
  color: #fff;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}
.complaint__step-list li div strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #1a3c2b;
  margin-bottom: 2px;
}
.complaint__step-list li div p {
  font-size: 12px;
  color: #718096;
  line-height: 1.55;
}
.complaint__step-list li div p a {
  color: #2d6a4f;
  font-weight: 700;
  text-decoration: none;
}
.complaint__step-list li div p a:hover { text-decoration: underline; }

/* 국민신문고 박스 */
.complaint__gov-box {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: linear-gradient(135deg,#1a3c2b,#2d6a4f);
  border-radius: 16px;
  padding: 20px 22px;
  color: #fff;
}
.complaint__gov-box > i {
  font-size: 22px;
  color: #52b788;
  flex-shrink: 0;
  margin-top: 2px;
}
.complaint__gov-box strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 6px;
}
.complaint__gov-box p {
  font-size: 12px;
  color: rgba(255,255,255,0.8);
  line-height: 1.65;
  margin-bottom: 10px;
}
.complaint__gov-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,0.15);
  color: #d8f3dc;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 14px;
  border-radius: 50px;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.25);
  transition: background 0.2s;
}
.complaint__gov-link:hover { background: rgba(255,255,255,0.25); color: #fff; }

/* ── 오른쪽: 메일 접수 폼 ── */
.complaint__form-wrap {
  background: #fff;
  border: 1.5px solid #d8f3dc;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 8px 40px rgba(45,106,79,0.08);
}
.complaint__form-header {
  display: flex;
  align-items: center;
  gap: 14px;
  background: linear-gradient(135deg,#1a3c2b,#2d6a4f);
  color: #fff;
  padding: 22px 28px;
}
.complaint__form-header > i {
  font-size: 26px;
  color: #52b788;
  flex-shrink: 0;
}
.complaint__form-header h3 {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 3px;
}
.complaint__form-header p {
  font-size: 12px;
  color: rgba(255,255,255,0.75);
  line-height: 1.5;
}
.complaint__form-header p strong { color: #d8f3dc; }

/* 폼 내부 */
.complaint__form {
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.complaint__fieldset {
  border: 1px solid #e8f0eb;
  border-radius: 16px;
  padding: 20px;
}
.complaint__fieldset legend {
  font-size: 13px;
  font-weight: 700;
  color: #2d6a4f;
  padding: 0 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.complaint__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 14px;
}
.complaint__group {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.complaint__group--full {
  grid-column: 1 / -1;
  margin-top: 10px;
}
.complaint__group label {
  font-size: 12px;
  font-weight: 600;
  color: #4a5568;
}
.complaint__group label em {
  color: #e53e3e;
  font-style: normal;
  margin-left: 2px;
}
.complaint__group input,
.complaint__group select,
.complaint__group textarea {
  padding: 10px 14px;
  border: 1.5px solid #d0e8d8;
  border-radius: 10px;
  font-size: 14px;
  font-family: 'Noto Sans KR', sans-serif;
  color: #2d3748;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  background: #fff;
  /* 모바일 iOS 확대 방지 */
  font-size: 16px;
}
.complaint__group input:focus,
.complaint__group select:focus,
.complaint__group textarea:focus {
  border-color: #52b788;
  box-shadow: 0 0 0 3px rgba(82,183,136,0.15);
}
.complaint__group textarea {
  resize: vertical;
  min-height: 120px;
  line-height: 1.65;
}
.complaint__counter {
  font-size: 11px;
  color: #a0aec0;
  text-align: right;
  margin-top: 4px;
}

/* 개인정보 동의 */
.complaint__agree {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 12px;
  color: #718096;
  line-height: 1.65;
  cursor: pointer;
  background: #f8faf9;
  border: 1px solid #e8f0eb;
  border-radius: 12px;
  padding: 14px 16px;
}
.complaint__agree input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #2d6a4f;
  flex-shrink: 0;
  margin-top: 1px;
  cursor: pointer;
}
.complaint__agree em { color: #e53e3e; font-style: normal; }

/* 제출 버튼 */
.complaint__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 15px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  border: none;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  transition: all 0.25s;
  letter-spacing: 0.3px;
}
.complaint__submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(45,106,79,0.3);
}
.complaint__submit:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  transform: none;
}

/* ── 반응형 ── */
@media (max-width: 1024px) {
  .complaint__info-cards { grid-template-columns: 1fr; gap: 14px; }
  .complaint__grid       { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .complaint__info-cards { grid-template-columns: 1fr; }
  .complaint__grid       { gap: 20px; }
  .complaint__guide,
  .complaint__form-wrap  { border-radius: 18px; }
  .complaint__guide      { padding: 22px; }
  .complaint__form       { padding: 18px; }
  .complaint__row        { grid-template-columns: 1fr; }
  .complaint__info-card  { flex-direction: row; }
}
@media (max-width: 480px) {
  .complaint__info-card  { gap: 12px; padding: 16px; }
  .complaint__tel        { font-size: 16px; }
}

/* 반응형 */
@media (max-width: 1024px) {
  .certs__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .certs__form-row { grid-template-columns: 1fr; }
  .certs__admin-inner { padding: 20px; }
  /* 버튼 3개 → 세로 스택 */
  .certs__admin-btns {
    flex-direction: column;
    align-items: stretch;
  }
  .certs__save-btn,
  .certs__changepw-btn,
  .certs__cancel-btn {
    justify-content: center;
    width: 100%;
  }
}
@media (max-width: 600px) {
  .certs__grid { grid-template-columns: 1fr; }
  .certs__tabs { gap: 6px; }
  .ctab { padding: 7px 12px; font-size: 12px; }
}
@media (max-width: 480px) {
  /* 관리자 로그인 상태 UI – 세로 스택 */
  .certs__admin-toggle { text-align: left; }
  .certs__admin-loggedin {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .certs__admin-btn--add,
  .certs__admin-btn--logout {
    width: 100%;
    justify-content: center;
  }
  /* 카드 푸터 수정/삭제 버튼 – 터치 영역 확보 */
  .cert-card__edit-btn,
  .cert-card__del-btn {
    width: 44px;
    min-height: 44px;
    font-size: 15px;
  }
}

/* ================================================================
   모바일 종합 최적화 (추가 보강)
================================================================ */

/* ── 공지사항 모바일 ── */
@media (max-width: 768px) {
  /* 2열 → 단일 컬럼 전환 */
  .notice__body {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  /* 목록 헤더 컬럼 축소 */
  .notice__list-head-row {
    grid-template-columns: 1fr 72px 60px;
  }
  .notice__list-head-row span:last-child { display: none; }
  .notice-item {
    grid-template-columns: 1fr 72px 60px;
    padding: 12px 16px;
  }
  .notice-item__imp { display: none; }
  .notice-detail__title { font-size: 16px; }
  .notice-detail__summary { grid-template-columns: 1fr; }
  .nd-summary-item { border-right: none; border-bottom: 1px solid #d8f3dc; padding: 12px 16px; }
  .nd-summary-item:last-child { border-bottom: none; }
  .notice-detail__header { padding: 18px 16px 14px; }
  .notice__search input { width: 140px; }
  /* sticky → 상단 고정 해제 (모바일에서 겹침 방지) */
  .notice__detail { position: static; }
  /* 모바일: 공지 미선택 시 상세 패널 숨김 */
  .notice__detail.notice__detail--empty-mobile {
    display: none;
  }
}
@media (max-width: 480px) {
  .notice__toolbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
  }
  .notice__tabs { gap: 6px; }
  .ntab { padding: 6px 12px; font-size: 12px; }
  .notice__search input { width: 110px; font-size: 13px; }
  .notice-item { padding: 10px 12px; }
  .notice-item__title { font-size: 13px; }
  .notice-item__cat { font-size: 10px; padding: 2px 6px; }
  .notice-item__date { font-size: 11px; }
  .notice__list-head-row {
    grid-template-columns: 1fr 60px;
    padding: 8px 12px;
  }
  .notice__list-head-row span:nth-child(3) { display: none; }
  .notice-item {
    grid-template-columns: 1fr 60px;
  }
  .notice-item__date { display: none; }
  .nd-detail-body { padding: 16px; }
}

/* ── 견적 요청 섹션 모바일 ── */
@media (max-width: 768px) {
  .estimate__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .estimate__sidebar { order: -1; }
  .estimate__sidebar-card { padding: 20px; }
  .estimate__form-wrap {
    border-radius: 16px;
    padding-bottom: 60px; /* 키보드 팝업 여유 공간 */
  }
  .est-step-title { padding: 16px 20px; font-size: 15px; }
  .est-fieldset { padding: 0; }
  .est-group { margin-bottom: 16px; }
}
@media (max-width: 480px) {
  .estimate__form-wrap { border-radius: 12px; }
  .est-step-title { padding: 14px 16px; font-size: 14px; }
  /* 입력 필드 iOS 확대 방지 */
  .estimate__form input,
  .estimate__form select,
  .estimate__form textarea {
    font-size: 16px !important;
  }
  .est-quick { padding: 7px 10px; font-size: 12px; }
  .est-submit-btn { font-size: 14px; padding: 14px; }
}

/* ── 민원접수 섹션 모바일 ── */
@media (max-width: 768px) {
  .complaint__grid { grid-template-columns: 1fr; gap: 20px; }
  .complaint__info-cards { grid-template-columns: 1fr; gap: 12px; }
  .complaint__info-card { flex-direction: row; align-items: center; }
  .complaint__guide { padding: 20px; border-radius: 16px; }
  .complaint__form-wrap { border-radius: 18px; }
  .complaint__form { padding: 18px 16px; gap: 16px; }
  .complaint__form-header { padding: 18px 20px; }
  .complaint__row { grid-template-columns: 1fr; gap: 10px; }
  .complaint__fieldset { padding: 16px; }
}
@media (max-width: 480px) {
  .complaint__info-card { padding: 14px; gap: 10px; }
  .complaint__tel { font-size: 16px; }
  .complaint__form-header h3 { font-size: 15px; }
  .complaint__form-header > i { font-size: 20px; }
  .complaint__group input,
  .complaint__group select,
  .complaint__group textarea { font-size: 16px; }
  .complaint__submit { font-size: 14px; padding: 13px; }
}

/* ================================================================
   견적서 작성 모달 (QUOTATION FORM)
================================================================ */

/* ── 오버레이 ── */
.qform-overlay {
  position: fixed;
  inset: 0;
  z-index: 8000;
  background: rgba(10,24,16,0.75);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 16px;
  overflow-y: auto;
}

/* ── 모달 본체 ── */
.qform-modal {
  background: #fff;
  border-radius: 16px;
  width: 100%;
  max-width: 960px;
  min-height: 90vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  animation: qfSlideUp 0.35s cubic-bezier(.4,0,.2,1);
  margin: auto;
}
@keyframes qfSlideUp {
  from { opacity: 0; transform: translateY(40px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── 모달 헤더 ── */
.qform-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  border-radius: 16px 16px 0 0;
  flex-shrink: 0;
  flex-wrap: wrap;
  gap: 8px;
}
.qform-header__left {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
}
.qform-header__left i { font-size: 20px; color: #74c69d; }
.qform-header__left h2 { font-size: 17px; font-weight: 700; color: #fff; }
.qform-header__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.qform-action-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
  font-family: 'Noto Sans KR', sans-serif;
}
.qform-action-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.2); }
.qform-action-btn--print { background: #52b788; color: #fff; }
.qform-action-btn--email { background: #fff; color: #2d6a4f; }
.qform-close {
  background: rgba(255,255,255,0.15);
  border: none;
  border-radius: 8px;
  color: #fff;
  width: 36px;
  height: 36px;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.qform-close:hover { background: rgba(255,255,255,0.28); }

/* ── 스크롤 바디 ── */
.qform-body {
  flex: 1;
  overflow-y: auto;
  padding: 24px 20px 8px;
  -webkit-overflow-scrolling: touch;
}

/* ═══════════════════════════════════════════════════════
   견적서 인쇄 영역 — 원본 PDF 양식 기반 완전 재설계
   A4(210×297mm) 완벽 대응
═══════════════════════════════════════════════════════ */

/* ── 종이 영역 ── */
.qf-paper {
  background: #fff;
  padding: 0;
  font-family: 'Noto Sans KR', '맑은 고딕', sans-serif;
  font-size: 13px;          /* ▲ 전체 기본 폰트 13px (기존 12px) */
  color: #111;
  line-height: 1.45;
  box-sizing: border-box;
}

/* ══ ① 헤더: 견적서 제목(중앙) + 메타(우측) ══ */
.qf-doc-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding-bottom: 6px;
  margin-bottom: 8px;
  border-bottom: 3px solid #1a5c2b;
}
.qf-doc-title-block {
  /* 제목을 전체 너비 기준 중앙에 오도록 absolute 처리 */
  position: absolute;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;       /* 메타 입력 클릭 방해 안 함 */
}
/* 헤더 자체에 relative 부여 */
.qf-doc-header { position: relative; }
.qf-main-title {
  font-size: 30px;
  font-weight: 900;
  color: #1a5c2b;
  letter-spacing: 10px;
  margin: 0;
  line-height: 1.2;
  text-indent: 10px;         /* letter-spacing 마지막 글자 보정 */
}
.qf-doc-title-en {
  font-size: 11px;
  letter-spacing: 5px;
  color: #1a5c2b;
  margin-top: 2px;
  font-weight: 500;
  text-indent: 5px;
}
/* 제목 블록 높이 확보 (메타 블록 높이만큼) */
.qf-doc-title-spacer {
  height: 72px;              /* 메타 4행 높이와 동일 */
}
.qf-doc-meta-block {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 210px;
  position: relative;        /* z-index 확보 */
  z-index: 1;
}
.qf-meta-row {
  display: flex;
  align-items: center;
  font-size: 12px;           /* ▲ 11→12px */
  color: #111;
  gap: 4px;
}
.qf-meta-label {
  font-weight: 600;
  white-space: nowrap;
  min-width: 56px;
}
.qf-meta-input {
  border: none;
  border-bottom: 1px solid #999;
  padding: 1px 3px;
  font-size: 12px;           /* ▲ 11→12px */
  color: #111;
  background: transparent;
  font-family: 'Noto Sans KR', sans-serif;
  outline: none;
  flex: 1;
  min-width: 105px;
}
.qf-meta-input:focus { border-bottom-color: #1a5c2b; }

/* ══ ② 수신처 — 리스트형 ══ */
.qf-recipient-wrap {
  margin-bottom: 8px;
}
.qf-recipient-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: 4px;
  border-bottom: 1px solid #333;
  margin-bottom: 0;
}
.qf-recipient-company {
  font-size: 17px;
  font-weight: 900;
  color: #111;
  letter-spacing: 0.5px;
}
.qf-recipient-kw {
  font-size: 14px;           /* ▲ 13→14px */
  font-weight: 600;
  color: #111;
}
.qf-recipient-input {
  border: none;
  background: transparent;
  font-size: 17px;           /* ▲ 16→17px */
  font-weight: 900;
  font-family: 'Noto Sans KR', sans-serif;
  color: #111;
  outline: none;
  width: 240px;
}
.qf-recipient-rows {
  width: 100%;
  border-collapse: collapse;
}
.qf-recipient-rows td {
  padding: 3px 6px;          /* 행 높이 줄임 */
  font-size: 12px;           /* ▲ 11→12px */
  color: #111;
  border-bottom: 1px solid #ccc;
  vertical-align: middle;
}
.qf-recipient-rows .qf-rr-label {
  font-weight: 700;
  letter-spacing: 3px;
  white-space: nowrap;
  width: 115px;
  color: #111;
}
.qf-rr-input {
  border: none;
  background: transparent;
  font-size: 12px;           /* ▲ 11→12px */
  font-family: 'Noto Sans KR', sans-serif;
  color: #111;
  outline: none;
  width: 100%;
}

/* ══ ③ 공급자 테이블 ══ */
.qf-supplier-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 8px;
  table-layout: fixed;
}
.qf-supplier-table td {
  border: 1px solid #555;
  padding: 3px 8px;          /* 행 높이 조정 */
  font-size: 12px;           /* ▲ 11→12px */
  color: #111;
  vertical-align: middle;
}
.qf-supplier-table .qf-sup-section {
  background: #fff;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  writing-mode: vertical-lr;  /* 위→아래 세로쓰기 */
  text-orientation: upright;  /* 각 글자를 바로 세움 */
  letter-spacing: 6px;
  width: 28px;
  padding: 6px 2px;
  line-height: 1.2;
}
.qf-supplier-table .qf-sup-label {
  background: #fff;
  font-size: 12px;           /* ▲ 11→12px */
  font-weight: 700;
  text-align: center;
  letter-spacing: 4px;
  white-space: nowrap;
  width: 95px;
}
.qf-supplier-table .qf-sup-val {
  background: #fff;
  font-size: 12px;           /* ▲ 11→12px */
  color: #111;
}
.qf-sup-val-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.qf-sup-stamp {
  width: 60px;
  height: 60px;
  object-fit: contain;
  opacity: 0.85;
  mix-blend-mode: multiply;
  flex-shrink: 0;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

/* ══ ④ 금액 헤더 라인 ══ */
.qf-amount-header {
  font-size: 13px;           /* ▲ 12→13px */
  font-weight: 700;
  color: #111;
  letter-spacing: 3px;
  padding: 5px 2px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  margin-bottom: 4px;
}

/* ══ ⑤ 품목 테이블 ══ */
.qf-table-wrap {
  margin-bottom: 4px;
}
.qf-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;           /* ▲ 11→12px */
  table-layout: fixed;
}
.qf-table thead tr {
  background: #fff;
}
.qf-table th {
  color: #111;
  font-weight: 700;
  padding: 5px 4px;
  text-align: center;
  font-size: 12px;
  border: 1px solid #555;
  letter-spacing: 2px;
}
.qf-table tbody td {
  padding: 0 4px;            /* ▼ 세로 패딩 줄여 행 높이 감소 */
  border: 1px solid #aaa;
  vertical-align: middle;
  color: #111;
  height: 26px;              /* 고정 행 높이 */
}
.qf-table tbody tr:hover { background: #f5fbf5; }
.qf-td-center { text-align: center; }
/* 화면 모드에서 인쇄 전용 span 숨김 */
.qf-print-only { display: none; }

.qf-td-right  { text-align: right; padding-right: 6px; }
.qf-td-input {
  width: 100%;
  border: none;
  background: transparent;
  padding: 1px 3px;
  font-size: 12px;           /* ▲ 11→12px */
  font-family: 'Noto Sans KR', sans-serif;
  color: #111;
  outline: none;
  box-sizing: border-box;
  line-height: 1.3;
}
.qf-td-input:focus { background: #f0fdf0; }
.qf-td-input--num { text-align: right; }
.qf-td-calc {
  text-align: right;
  font-size: 12px;
  color: #111;
  padding-right: 6px;
}
.qf-td-del { text-align: center; width: 22px; }
.qf-row-del-btn {
  background: none;
  border: none;
  color: #c00;
  cursor: pointer;
  font-size: 11px;
  padding: 2px 3px;
}
.qf-row-del-btn:hover { color: #f00; }
/* ▼ 프리셋 드롭다운: 품명 셀 안에서만 보임 (화면용) */
.qf-preset-sel {
  width: 100%;
  border: 1px solid #ddd;
  padding: 1px 2px;
  font-size: 10px;
  font-family: 'Noto Sans KR', sans-serif;
  background: #f8fff8;
  outline: none;
  border-radius: 2px;
  margin-bottom: 1px;
  color: #333;
  display: block;
}

/* ── 행 추가 버튼 ── */
.qf-add-row-wrap {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 4px;
}
.qf-add-row-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: #f0fdf4;
  color: #1a5c2b;
  border: 1px dashed #1a5c2b;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  font-family: 'Noto Sans KR', sans-serif;
  transition: background 0.15s;
}
.qf-add-row-btn:hover { background: #d4edda; }

/* ══ ⑥ 참고사항 박스 ══ */
.qf-note-box {
  border: 1px solid #555;
  padding: 6px 10px;
  margin-bottom: 8px;
  font-size: 12px;           /* ▲ 11→12px */
  color: #111;
  line-height: 1.6;
}
.qf-note-box__title {
  font-weight: 900;
  font-size: 13px;           /* ▲ 12→13px */
  margin-bottom: 3px;
  display: block;
  letter-spacing: 2px;
}
/* textarea 스타일 */
.qf-note-textarea {
  width: 100%;
  border: none;
  background: transparent;
  font-size: 12px;
  font-family: 'Noto Sans KR', '맑은 고딕', sans-serif;
  color: #111;
  line-height: 1.7;
  resize: none;
  outline: none;
  box-sizing: border-box;
  padding: 0;
  overflow: hidden;
  min-height: 100px;
}
.qf-note-textarea:focus {
  background: #fafff8;
}

/* ══ ⑦ 하단 회사 로고 (가운데 정렬) ══ */
.qf-footer-logo {
  margin-top: 8px;
  text-align: center;        /* ▲ right → center */
  padding-top: 6px;
  border-top: 1px solid #333;
}
.qf-footer-logo__name {
  font-size: 15px;           /* ▲ 14→15px */
  font-weight: 900;
  color: #111;
  letter-spacing: 2px;
  display: block;
}
.qf-footer-logo__en {
  font-size: 10px;           /* ▲ 9→10px */
  color: #555;
  letter-spacing: 1px;
  display: block;
  margin-top: 2px;
}

/* ── 모달 푸터 호환 유지 ── */
.qf-total-banner { display: none !important; }
.qf-info-table   { display: none !important; }
.qf-cond-table   { display: none !important; }
.qf-footer-sign  { display: none !important; }

/* ── 모달 푸터 (하단 버튼바) ── */
.qform-footer {
  display: flex;
  gap: 10px;
  padding: 12px 20px;
  border-top: 1.5px solid #edf2ef;
  background: #f8faf9;
  border-radius: 0 0 16px 16px;
  flex-shrink: 0;
  flex-wrap: wrap;
}
.qform-footer-btn {
  flex: 1;
  min-width: 80px;
  padding: 12px 8px;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  font-family: 'Noto Sans KR', sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: transform 0.15s, box-shadow 0.15s;
}
.qform-footer-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.12); }
.qform-footer-btn--reset  { background: #edf2ef; color: #4a5568; }
.qform-footer-btn--print  { background: #2d6a4f; color: #fff; }
.qform-footer-btn--email  { background: #fff; color: #2d6a4f; border: 1.5px solid #52b788; }

/* ── 메일 발송 확인 모달 ── */
.qf-mail-overlay {
  position: fixed;
  inset: 0;
  z-index: 9500;
  background: rgba(10,24,16,0.7);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.qf-mail-modal {
  background: #fff;
  border-radius: 20px;
  padding: 28px 24px 24px;
  max-width: 420px;
  width: 100%;
  box-shadow: 0 20px 60px rgba(0,0,0,0.25);
  animation: qfSlideUp 0.3s cubic-bezier(.4,0,.2,1);
  text-align: center;
}
.qf-mail-icon {
  width: 56px;
  height: 56px;
  background: linear-gradient(135deg, #2d6a4f, #52b788);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
  font-size: 22px;
  color: #fff;
}
.qf-mail-modal h3 {
  font-size: 18px;
  font-weight: 800;
  color: #1a3c2b;
  margin-bottom: 6px;
}
.qf-mail-modal > p {
  font-size: 13px;
  color: #718096;
  margin-bottom: 18px;
}
.qf-mail-field {
  text-align: left;
  margin-bottom: 12px;
}
.qf-mail-field label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: #718096;
  margin-bottom: 4px;
}
.qf-mail-field input {
  width: 100%;
  border: 1.5px solid #d8f3dc;
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 14px;
  font-family: 'Noto Sans KR', sans-serif;
  outline: none;
  transition: border-color 0.2s;
}
.qf-mail-field input:focus { border-color: #52b788; }
.qf-mail-btns {
  display: flex;
  gap: 10px;
  margin-top: 18px;
  margin-bottom: 10px;
}
.qf-mail-send, .qf-mail-cancel {
  flex: 1;
  padding: 12px;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  font-family: 'Noto Sans KR', sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: transform 0.15s;
}
.qf-mail-send:hover, .qf-mail-cancel:hover { transform: translateY(-1px); }
.qf-mail-send   { background: #2d6a4f; color: #fff; }
.qf-mail-cancel { background: #edf2ef; color: #4a5568; }
.qf-mail-hint {
  font-size: 11px;
  color: #a0aec0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

/* ── 견적서 작성하기 버튼 (사이드바) ── */
.est-qform-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px;
  background: linear-gradient(135deg, #1a3c2b, #2d6a4f);
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  margin-top: 14px;
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 4px 16px rgba(45,106,79,0.28);
}
.est-qform-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(45,106,79,0.38);
}
.est-qform-btn i { font-size: 16px; }

/* ══════════════════════════════════════════════════════════════════
   관급 배정잔량 관리 ERP — CSS
   Color: Blue-dark #1e3a5f / Blue-mid #2563eb / Amber #f59e0b
          Green #16a34a / Red #dc2626 / Gray-50 #f8fafc
══════════════════════════════════════════════════════════════════ */

/* ── 오버레이 / 셸 레이아웃 ── */
.erp-overlay {
  position: fixed; inset: 0; z-index: 3000;
  background: rgba(10,20,40,.55);
  display: flex; align-items: stretch; justify-content: center;
}
.erp-shell {
  display: flex; width: 100%; max-width: 1440px;
  background: #f0f4f8; overflow: hidden;
  box-shadow: 0 0 60px rgba(0,0,0,.35);
}

/* ── 사이드바 ── */
.erp-sidebar {
  width: 220px; flex-shrink: 0;
  background: #1e3a5f;
  display: flex; flex-direction: column;
  overflow-y: auto;
}
.erp-sidebar__header {
  padding: 20px 16px 16px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.erp-sidebar__logo {
  display: flex; align-items: center; gap: 10px;
  color: #fff; margin-bottom: 14px;
}
.erp-sidebar__logo > .fas {
  font-size: 24px; color: #60a5fa;
}
.erp-sidebar__logo-name { font-size: 14px; font-weight: 700; color: #fff; line-height: 1.2; }
.erp-sidebar__logo-sub  { font-size: 10px; color: #93c5fd; }
.erp-sidebar__user {
  display: flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.08); border-radius: 8px;
  padding: 8px 10px; color: #cbd5e1; font-size: 13px;
}
.erp-sidebar__user .fas { color: #60a5fa; font-size: 16px; }
.erp-nav { padding: 12px 0; flex: 1; }
.erp-nav__item {
  display: flex; align-items: center; gap: 10px;
  width: 100%; padding: 11px 18px;
  background: none; border: none; cursor: pointer;
  color: #94a3b8; font-size: 13.5px; font-family: inherit;
  text-align: left; transition: all .18s;
  border-left: 3px solid transparent;
}
.erp-nav__item:hover { background: rgba(255,255,255,.07); color: #e2e8f0; }
.erp-nav__item--active {
  background: rgba(96,165,250,.15) !important;
  color: #60a5fa !important;
  border-left-color: #60a5fa !important;
}
.erp-nav__item .fas { width: 18px; text-align: center; font-size: 14px; }
.erp-sidebar__footer {
  padding: 14px 12px;
  border-top: 1px solid rgba(255,255,255,.1);
  display: flex; flex-direction: column; gap: 6px;
}
.erp-sidebar__logout,
.erp-sidebar__close {
  width: 100%; padding: 8px; border-radius: 7px;
  border: 1px solid rgba(255,255,255,.15);
  background: none; color: #94a3b8; font-size: 12px;
  font-family: inherit; cursor: pointer; transition: all .18s;
  display: flex; align-items: center; justify-content: center; gap: 6px;
}
.erp-sidebar__logout:hover  { background: rgba(220,38,38,.2); color: #fca5a5; }
.erp-sidebar__close:hover   { background: rgba(255,255,255,.1); color: #fff; }
.erp-sidebar__account {
  width: 100%; padding: 8px; border-radius: 7px;
  border: 1px solid rgba(52,211,153,.35);
  background: rgba(52,211,153,.1); color: #6ee7b7;
  font-size: 12px; font-family: inherit; cursor: pointer;
  transition: all .18s;
  display: none; align-items: center; justify-content: center; gap: 6px;
}
.erp-sidebar__account:hover { background: rgba(52,211,153,.25); color: #a7f3d0; }

/* ── 메인 영역 ── */
.erp-main {
  flex: 1; display: flex; flex-direction: column;
  overflow: hidden; min-width: 0;
}

/* ── 모바일 상단바 ── */
.erp-topbar {
  display: none;
  align-items: center; gap: 10px;
  background: #1e3a5f; padding: 12px 16px;
  color: #fff;
}
.erp-topbar__menu, .erp-topbar__close {
  background: none; border: none; color: #fff;
  font-size: 18px; cursor: pointer; padding: 4px;
}
.erp-topbar__title { flex: 1; font-weight: 600; font-size: 15px; }

/* ── 탭 패널 ── */
.erp-tab {
  flex: 1; padding: 24px 28px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 20px;
}

/* ── 로그인 탭 ── */
.erp-tab--login {
  align-items: center; justify-content: flex-start;
  background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 100%);
  overflow-y: auto; padding: 24px 16px;
}
.erp-login-card {
  background: #fff; border-radius: 16px;
  padding: 36px 32px; max-width: 420px; width: 100%;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
  margin: auto;
}
.erp-login-icon {
  text-align: center; font-size: 40px;
  color: #2563eb; margin-bottom: 12px;
}
.erp-login-title {
  text-align: center; font-size: 22px; font-weight: 700;
  color: #1e3a5f; margin-bottom: 6px;
}
.erp-login-desc {
  text-align: center; font-size: 13px; color: #64748b;
  margin-bottom: 24px; line-height: 1.6;
}
.erp-login-form { display: flex; flex-direction: column; gap: 14px; }
.erp-login-hint {
  font-size: 12px; color: #64748b; text-align: center;
  padding: 8px; border-radius: 6px;
}
.erp-login-hint--err {
  color: #dc2626; background: #fef2f2;
}

/* 기본 계정 안내 */
.erp-login-default-info {
  margin-top: 14px;
  font-size: 12px; color: #1e40af;
  text-align: center; padding: 9px 14px;
  background: #eff6ff; border: 1px solid #bfdbfe;
  border-radius: 8px; line-height: 1.7;
}
.erp-login-default-info strong {
  font-family: monospace; font-size: 13px;
  background: #dbeafe; padding: 1px 5px; border-radius: 4px;
}

/* 계정 초기화 버튼 */
.erp-login-reset-btn {
  display: block; width: 100%; margin-top: 10px;
  padding: 10px; border-radius: 8px;
  background: #fffbeb; border: 1px solid #fde68a;
  color: #92400e; font-size: 12px; font-weight: 600;
  cursor: pointer; text-align: center;
  transition: background .15s;
}
.erp-login-reset-btn:hover { background: #fef3c7; }

.erp-login-info {
  margin-top: 14px; font-size: 12px; color: #94a3b8;
  text-align: center; padding: 10px;
  background: #f8fafc; border-radius: 8px;
}

/* ── 페이지 헤더 ── */
.erp-page-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 10px;
}
.erp-page-title {
  font-size: 20px; font-weight: 700; color: #1e3a5f;
  display: flex; align-items: center; gap: 10px;
}
.erp-page-title .fas { color: #2563eb; font-size: 18px; }
.erp-page-date { font-size: 13px; color: #64748b; }

/* ── KPI 카드 그리드 ── */
.erp-kpi-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
}
.erp-kpi {
  background: #fff; border-radius: 12px;
  padding: 18px 20px; display: flex; align-items: center; gap: 14px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  border-left: 4px solid transparent;
}
.erp-kpi--blue  { border-left-color: #2563eb; }
.erp-kpi--green { border-left-color: #16a34a; }
.erp-kpi--amber { border-left-color: #f59e0b; }
.erp-kpi--red   { border-left-color: #dc2626; }
.erp-kpi__icon {
  width: 44px; height: 44px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; flex-shrink: 0;
}
.erp-kpi--blue  .erp-kpi__icon { background: #eff6ff; color: #2563eb; }
.erp-kpi--green .erp-kpi__icon { background: #f0fdf4; color: #16a34a; }
.erp-kpi--amber .erp-kpi__icon { background: #fffbeb; color: #f59e0b; }
.erp-kpi--red   .erp-kpi__icon { background: #fef2f2; color: #dc2626; }
.erp-kpi__label { font-size: 12px; color: #64748b; margin-bottom: 4px; }
.erp-kpi__val   { font-size: 24px; font-weight: 700; color: #1e293b; }

/* ── 카드 ── */
.erp-card {
  background: #fff; border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06); overflow: hidden;
}
.erp-card__head {
  padding: 14px 20px; border-bottom: 1px solid #e2e8f0;
  display: flex; align-items: center; justify-content: space-between;
  background: #f8fafc;
}
.erp-card__head h3 {
  font-size: 14px; font-weight: 600; color: #1e3a5f;
  display: flex; align-items: center; gap: 8px;
}
.erp-card__head .fas { color: #2563eb; }
.erp-card__head--red { background: #fef2f2; border-bottom-color: #fecaca; }
.erp-card__head--red h3 { color: #dc2626; }
.erp-card__head--red .fas { color: #dc2626; }
.erp-card__body { padding: 16px 20px; }

/* ── 대시보드 현장별 소진율 바 ── */
.erp-site-bar-item {
  margin-bottom: 14px; padding-bottom: 14px;
  border-bottom: 1px solid #f1f5f9;
  cursor: pointer; transition: background .15s;
  border-radius: 8px; padding: 10px;
}
.erp-site-bar-item:hover { background: #f8fafc; }
.erp-site-bar-item:last-child { border-bottom: none; margin-bottom: 0; }
.erp-site-bar__top {
  display: flex; align-items: center;
  justify-content: space-between; margin-bottom: 6px; gap: 8px;
}
.erp-site-bar__name { font-size: 13.5px; font-weight: 600; color: #1e293b; }
.erp-site-bar__meta { font-size: 12px; color: #64748b; }
.erp-site-bar__nums {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; color: #475569; flex-wrap: wrap;
}
.erp-site-bar__remain { font-weight: 700; font-size: 13px; color: #1e3a5f; }
.erp-progress { height: 8px; background: #e2e8f0; border-radius: 999px; overflow: hidden; }
.erp-progress__bar {
  height: 100%; border-radius: 999px;
  background: #2563eb; transition: width .4s ease;
}
.erp-progress__bar--green  { background: #16a34a; }
.erp-progress__bar--amber  { background: #f59e0b; }
.erp-progress__bar--red    { background: #dc2626; }
.erp-progress__bar--gray   { background: #94a3b8; }
.erp-site-bar__badges { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }

/* ── 배지 ── */
.erp-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 600;
}
.erp-badge--blue   { background: #eff6ff; color: #2563eb; }
.erp-badge--green  { background: #f0fdf4; color: #16a34a; }
.erp-badge--amber  { background: #fffbeb; color: #92400e; }
.erp-badge--red    { background: #fef2f2; color: #dc2626; }
.erp-badge--gray   { background: #f1f5f9; color: #64748b; }
.erp-badge--dday   { background: #f0fdf4; color: #15803d; font-weight: 700; }
.erp-badge--dday-warn { background: #fffbeb; color: #92400e; }
.erp-badge--dday-alert { background: #fef2f2; color: #dc2626; }

/* ── 버튼 ── */
.erp-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: 8px; border: none;
  font-size: 13px; font-family: inherit; font-weight: 500;
  cursor: pointer; transition: all .18s; white-space: nowrap;
}
.erp-btn--primary { background: #2563eb; color: #fff; }
.erp-btn--primary:hover { background: #1d4ed8; }
.erp-btn--outline { background: #fff; color: #2563eb; border: 1px solid #bfdbfe; }
.erp-btn--outline:hover { background: #eff6ff; }
.erp-btn--ghost   { background: #f1f5f9; color: #475569; }
.erp-btn--ghost:hover { background: #e2e8f0; }
.erp-btn--danger  { background: #dc2626; color: #fff; }
.erp-btn--danger:hover { background: #b91c1c; }
.erp-btn--sm { padding: 5px 11px; font-size: 12px; }
.erp-btn--full { width: 100%; justify-content: center; }

/* ── 폼 요소 ── */
.erp-field { display: flex; flex-direction: column; gap: 3px; }
.erp-field--full { grid-column: 1 / -1; }
.erp-label { font-size: 11px; font-weight: 600; color: #374151; }
.erp-label .req { color: #dc2626; margin-left: 2px; }
.erp-input {
  padding: 6px 9px; border-radius: 6px;
  border: 1px solid #d1d5db; font-size: 12px;
  font-family: inherit; background: #fff;
  transition: border-color .18s, box-shadow .18s; color: #1e293b;
}
.erp-input:focus {
  outline: none; border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37,99,235,.12);
}
.erp-input--sm { max-width: 220px; }
.erp-select {
  padding: 6px 9px; border-radius: 6px;
  border: 1px solid #d1d5db; font-size: 12px;
  font-family: inherit; background: #fff; color: #1e293b;
  cursor: pointer;
}
.erp-select:focus { outline: none; border-color: #2563eb; }
.erp-textarea {
  padding: 6px 9px; border-radius: 6px;
  border: 1px solid #d1d5db; font-size: 12px;
  font-family: inherit; resize: vertical; color: #1e293b;
}
.erp-textarea:focus { outline: none; border-color: #2563eb; }

/* ── 필터 바 ── */
.erp-filter-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}

/* ── 폼 그리드 ── */
.erp-form-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px;
  margin-bottom: 10px;
}
.erp-form-grid--ship { grid-template-columns: 1fr 1fr; }

/* ── 규격 섹션 ── */
/* ══════════════════════════════════════════
   규격별 배정량 섹션 (다중 규격 입력)
══════════════════════════════════════════ */
.erp-spec-section {
  border: 1.5px solid #c7d2fe;
  border-radius: 9px;
  padding: 10px 12px 10px;
  background: linear-gradient(135deg, #f0f4ff 0%, #f8fafc 100%);
  margin-bottom: 10px;
}
.erp-spec-section__head {
  display: flex; align-items: center;
  justify-content: space-between; margin-bottom: 7px;
}
.erp-spec-section__title {
  display: flex; align-items: center; gap: 8px;
}
.erp-spec-section__head h4 {
  font-size: 12px; font-weight: 700; color: #1e3a5f;
  display: flex; align-items: center; gap: 6px; margin: 0;
}
.erp-spec-section__head h4 i { color: #4f46e5; }
.erp-spec-section__badge {
  display: inline-flex; align-items: center;
  background: #4f46e5; color: #fff;
  font-size: 10px; font-weight: 700;
  padding: 2px 8px; border-radius: 20px;
  letter-spacing: 0.02em;
}
.erp-spec-hint {
  font-size: 10.5px; color: #64748b;
  background: #e0e7ff; border-radius: 6px;
  padding: 5px 9px; margin-bottom: 8px;
  display: flex; align-items: flex-start; gap: 5px; line-height: 1.45;
}
.erp-spec-hint i { color: #4f46e5; margin-top: 1px; flex-shrink: 0; }
.erp-spec-hint strong { color: #1e3a5f; }

/* 열 헤더 */
.erp-spec-rows-wrap { border-radius: 9px; overflow: hidden; }
.erp-spec-rows-header {
  display: flex; align-items: center; gap: 6px;
  background: #1e3a5f; padding: 6px 8px;
  font-size: 10.5px; font-weight: 600; color: #c7d2fe;
  border-radius: 7px 7px 0 0;
}
.erp-spec-col-label { flex-shrink: 0; }
.erp-spec-col-spec    { flex: 2.2; }
.erp-spec-col-qty     { flex: 1.2; }
.erp-spec-col-price   { flex: 1.4; }
.erp-spec-col-subtotal{ flex: 1.4; }

/* 규격 행 */
.erp-spec-row {
  display: flex; align-items: flex-start; gap: 6px;
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
  padding: 7px 8px;
  transition: background .15s;
}
.erp-spec-row:hover { background: #f8faff; }
.erp-spec-row:last-child { border-bottom: none; border-radius: 0 0 9px 9px; }
.erp-spec-row__num {
  flex: 0 0 18px; width: 18px; height: 18px;
  background: #4f46e5; color: #fff;
  border-radius: 50%; font-size: 10px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  margin-top: 22px; flex-shrink: 0;
}
.erp-spec-row__body { flex: 1; min-width: 0; }
.erp-spec-row__fields {
  display: grid;
  grid-template-columns: 2.2fr 1.2fr 1.4fr 1.4fr;
  gap: 5px; align-items: end;
}
.erp-spec-row .erp-field { margin-bottom: 0; }
.erp-spec-row .erp-label { font-size: 10px; margin-bottom: 2px; }

/* 직접입력 커스텀 */
.spec-custom-wrap { position: relative; }
.spec-custom-hint {
  display: block; font-size: 10px; color: #94a3b8; margin-top: 2px;
}

/* 규격별 납품장소 입력행 */
/* 규격별 납품기한+납품장소 2열 메타 행 */
.erp-spec-row__meta {
  margin-top: 6px; padding-top: 6px;
  border-top: 1px dashed #e2e8f0;
  display: flex; gap: 8px; align-items: flex-start;
}
/* 하위 호환: 기존 __delivery 클래스 */
.erp-spec-row__delivery {
  margin-top: 6px; padding-top: 6px;
  border-top: 1px dashed #e2e8f0;
  display: flex; flex-direction: column; gap: 3px;
}

/* 소계 표시 */
.erp-spec-subtotal {
  background: #f1f5f9; border: 1px solid #e2e8f0;
  border-radius: 5px; padding: 5px 8px;
  font-size: 11px; font-weight: 600; color: #1e3a5f;
  text-align: right; min-height: 28px;
  display: flex; align-items: center; justify-content: flex-end;
}

/* 삭제 버튼 */
.erp-spec-row__del {
  flex: 0 0 26px; width: 26px; height: 26px;
  background: #fef2f2; border: 1px solid #fecaca;
  border-radius: 5px; color: #dc2626; cursor: pointer;
  font-size: 11px; display: flex; align-items: center;
  justify-content: center; margin-top: 20px;
  transition: background .15s, color .15s;
}
.erp-spec-row__del:hover {
  background: #dc2626; color: #fff; border-color: #dc2626;
}

/* 합계 바 */
.erp-spec-total-bar {
  display: flex; align-items: center; justify-content: flex-end;
  gap: 6px; margin-top: 7px;
  background: #1e3a5f; color: #c7d2fe;
  border-radius: 6px; padding: 7px 12px;
  font-size: 12px;
}
.erp-spec-total-bar strong {
  color: #fff; font-size: 13px;
}

/* erp-btn--success */
.erp-btn--success {
  background: linear-gradient(135deg, #059669 0%, #047857 100%);
  color: #fff; border: none;
}
.erp-btn--success:hover {
  background: linear-gradient(135deg, #047857 0%, #065f46 100%);
  transform: translateY(-1px);
}

/* ── 테이블 ── */
.erp-table-wrap { overflow-x: auto; border-radius: 10px; border: 1px solid #e2e8f0; }
.erp-table {
  width: 100%; border-collapse: collapse; font-size: 13px;
  background: #fff;
}
.erp-table thead { background: #1e3a5f; }
.erp-table thead th {
  padding: 11px 14px; color: #e2e8f0; font-weight: 600;
  font-size: 12px; text-align: left; white-space: nowrap;
}
.erp-table tbody tr { border-bottom: 1px solid #f1f5f9; transition: background .15s; }
.erp-table tbody tr:last-child { border-bottom: none; }
.erp-table tbody tr:hover { background: #f8fafc; }
.erp-table td {
  padding: 11px 14px; color: #374151; vertical-align: middle;
}
.erp-table .erp-empty {
  text-align: center; color: #94a3b8; padding: 28px;
  font-size: 13px;
}
.erp-table .ta-r { text-align: right; }
.erp-table .ta-c { text-align: center; }
.erp-admin-col { text-align: center !important; }

/* ════════════════════════════════════════
   배정 목록 아코디언 테이블
════════════════════════════════════════ */

/* 메인 행 */
.alloc-main-row:hover td { background: #f0f4ff !important; }
.alloc-main-row.alloc-row--open td {
  background: #eef2ff !important;
  border-bottom: none;
}
.alloc-toggle-cell { width: 36px; padding: 0 8px !important; }
.alloc-toggle-icon {
  display: inline-block; font-size: 10px; color: #94a3b8;
  transition: transform .2s;
}
.alloc-row--open .alloc-toggle-icon { color: #4f46e5; }

/* 상세 행 */
.alloc-detail-row > td { padding: 0 !important; background: #f8faff !important; border-bottom: 2px solid #c7d2fe !important; }

/* 규격 상세 내부 컨테이너 */
.alloc-spec-detail {
  padding: 0 0 10px 48px;
  background: #f8faff;
}

/* 규격 상세 서브 테이블 */
.alloc-spec-table {
  width: 100%; border-collapse: collapse;
  font-size: 12px; margin-top: 0;
}
.alloc-spec-table thead tr {
  background: #e0e7ff;
}
.alloc-spec-table thead th {
  padding: 7px 12px; font-size: 11px; font-weight: 700;
  color: #3730a3; text-align: left; white-space: nowrap;
  border-bottom: 1px solid #c7d2fe;
}
.alloc-spec-table thead th.ta-r { text-align: right; }
.alloc-spec-table .alloc-spec-row { border-bottom: 1px solid #e8edf8; }
.alloc-spec-table .alloc-spec-row:last-child { border-bottom: none; }
.alloc-spec-table .alloc-spec-row:hover { background: #eff3ff; }
.alloc-spec-table td {
  padding: 8px 12px; color: #374151; vertical-align: middle;
}
.alloc-spec-table .ta-r { text-align: right; }
.alloc-spec-table .erp-empty { text-align: center; }

/* 합계 행 */
.alloc-spec-total {
  background: #e0e7ff;
  border-top: 2px solid #c7d2fe;
}
.alloc-spec-total td {
  padding: 9px 12px; font-size: 12px;
}

/* ── 배정잔량 현황 테이블 ── */
.erp-table--remain .remain-row--warn td { background: #fffbeb !important; }
.erp-table--remain .remain-row--alert td { background: #fef2f2 !important; }
.erp-table--remain .remain-row--done td { background: #f8fafc !important; color: #94a3b8; }

/* ── 소진율 인라인 바 (잔량테이블용) ── */
.erp-inline-bar { display: flex; align-items: center; gap: 6px; }
.erp-inline-bar__track {
  flex: 1; height: 6px; background: #e2e8f0;
  border-radius: 999px; overflow: hidden; min-width: 50px;
}
.erp-inline-bar__fill {
  height: 100%; border-radius: 999px; background: #2563eb;
}

/* ── 폼 패널 (우측 고정 드로어) ── */
.erp-form-panel {
  position: fixed;
  top: 0; right: 0;
  width: 480px;
  height: 100vh;
  background: #fff;
  box-shadow: -4px 0 32px rgba(0,0,0,.18);
  border-left: 1px solid #e2e8f0;
  z-index: 2100;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: translateX(100%);
  transition: transform .28s cubic-bezier(.4,0,.2,1);
}
.erp-form-panel.is-open {
  transform: translateX(0);
}
/* 드로어 오버레이 배경 */
.erp-form-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 2099;
  display: none;
}
.erp-form-overlay.is-open { display: block; }

.erp-form-panel__head {
  display: flex; align-items: center;
  justify-content: space-between;
  padding: 10px 16px; background: #1e3a5f;
  border-bottom: 1px solid #1e3a5f;
  flex-shrink: 0;
}
.erp-form-panel__head h3 { font-size: 14px; font-weight: 700; color: #fff; }
.erp-form-panel__close {
  background: rgba(255,255,255,.15); border: none; cursor: pointer;
  font-size: 14px; color: #fff; padding: 5px 7px; border-radius: 6px;
  transition: background .15s;
}
.erp-form-panel__close:hover { background: rgba(255,255,255,.3); }
.erp-form-panel__body {
  padding: 12px 16px;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}
.erp-form-panel__actions {
  display: flex; gap: 8px; padding: 10px 16px;
  border-top: 2px solid #e2e8f0;
  background: #fff;
  flex-shrink: 0;
  position: sticky;
  bottom: 0;
  z-index: 10;
}

/* ── 섹션 소제목 ── */
.af-section-title {
  font-size: 12px; font-weight: 700; color: #1e3a5f;
  display: flex; align-items: center; gap: 6px;
  margin: 10px 0 7px;
  padding-bottom: 5px; border-bottom: 1.5px solid #e2e8f0;
}
.af-section-title .fas { color: #4f46e5; }
/* STEP 뱃지 */
.af-step-badge {
  background: #dbeafe; color: #1d4ed8;
  font-size: 9px; font-weight: 800;
  padding: 2px 7px; border-radius: 10px;
  letter-spacing: .04em; flex-shrink: 0;
}

/* ════════════════════════════════════════════════
   PDF 배정통보서 첨부 업로드 존 — 기본 워크플로우
   PDF 등록이 주 진입점임을 강조하는 디자인
════════════════════════════════════════════════ */
.af-pdf-zone {
  border: 2px dashed #3b82f6;
  border-radius: 10px;
  margin-bottom: 12px;
  background: linear-gradient(135deg, #eff6ff 0%, #f0f7ff 100%);
  overflow: hidden;
  transition: border-color .2s, box-shadow .2s, background .2s;
  box-shadow: 0 2px 8px rgba(59,130,246,.12);
  position: relative;
}
.af-pdf-zone::before {
  content: 'STEP 1';
  position: absolute; top: 0; left: 0;
  background: #2563eb; color: #fff;
  font-size: 9px; font-weight: 800;
  padding: 2px 8px; border-radius: 0 0 6px 0;
  letter-spacing: .05em;
}
.af-pdf-zone--drag {
  border-color: #1d4ed8;
  background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 100%);
  box-shadow: 0 4px 16px rgba(37,99,235,.25);
}
.af-pdf-zone__inner {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 8px; padding: 20px 16px 16px; cursor: pointer;
  text-align: center;
  min-height: 90px;
}
.af-pdf-zone__icon {
  font-size: 32px; color: #ef4444;
  flex-shrink: 0;
  filter: drop-shadow(0 2px 4px rgba(239,68,68,.3));
  animation: af-icon-pulse 2.5s ease-in-out infinite;
}
@keyframes af-icon-pulse {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.08); }
}
.af-pdf-zone__title {
  font-size: 14px; font-weight: 800;
  color: #1e3a5f; margin: 0;
  letter-spacing: -.01em;
}
.af-pdf-zone__desc {
  font-size: 11px; color: #64748b;
  margin: 0; line-height: 1.5;
}
.af-pdf-zone__hint {
  font-size: 10px; color: #93c5fd;
  margin: 0; font-weight: 600;
}
.af-pdf-zone__actions {
  display: flex; align-items: center; gap: 8px;
  flex-wrap: wrap; justify-content: center;
}
.af-pdf-zone__manual-link {
  font-size: 10px; color: #94a3b8;
  text-decoration: underline; cursor: pointer;
  background: none; border: none; padding: 2px 4px;
}
.af-pdf-zone__manual-link:hover { color: #64748b; }

/* 파싱 완료 상태 */
.af-pdf-parsed {
  padding: 12px 16px;
  background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 100%);
}
.af-pdf-parsed__head {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 700; color: #065f46;
  margin-bottom: 8px;
}
.af-pdf-parsed__badge {
  background: #059669; color: #fff;
  font-size: 10px; font-weight: 800;
  padding: 2px 9px; border-radius: 20px;
  letter-spacing: .03em;
}
.af-pdf-parsed__preview {
  display: flex; flex-wrap: wrap; gap: 4px;
  margin-bottom: 8px;
}
.af-tag {
  display: inline-flex; align-items: center;
  background: #e0e7ff; color: #3730a3;
  font-size: 11px; font-weight: 600;
  padding: 3px 10px; border-radius: 20px;
  gap: 3px;
}
.af-tag--green { background: #d1fae5; color: #065f46; }
.af-tag--warn  { background: #fef3c7; color: #92400e; }
.af-tag--blue  { background: #dbeafe; color: #1e40af; }
.af-pdf-parsed__reset {
  font-size: 11px; color: #64748b; background: none;
  border: 1px solid #e2e8f0; border-radius: 6px;
  padding: 4px 10px; cursor: pointer;
  display: flex; align-items: center; gap: 5px;
  transition: background .15s;
}
.af-pdf-parsed__reset:hover { background: #f1f5f9; color: #374151; }

/* 필수 입력 필드 경고 */
.erp-input--warn {
  border-color: #f59e0b !important;
  background: #fffbeb !important;
  animation: af-warn-flash 1s ease-in-out 2;
}
@keyframes af-warn-flash {
  0%, 100% { border-color: #f59e0b; }
  50%       { border-color: #d97706; box-shadow: 0 0 0 2px rgba(245,158,11,.25); }
}

/* ── 출하 입력 – 잔량 미니바 ── */
.erp-ship-remain-bar {
  display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 14px;
}
.erp-ship-remain-chip {
  display: flex; flex-direction: column; gap: 4px;
  background: #f0f4f8; border-radius: 8px; padding: 8px 12px;
  min-width: 130px; flex: 1;
}
.erp-ship-remain-chip__spec { font-size: 11px; color: #64748b; font-weight: 600; }
.erp-ship-remain-chip__val  { font-size: 15px; font-weight: 700; color: #1e3a5f; }
.erp-ship-remain-chip__sub  { font-size: 11px; color: #94a3b8; }
.erp-ship-remain-chip--warn { background: #fffbeb; }
.erp-ship-remain-chip--warn .erp-ship-remain-chip__val { color: #92400e; }
.erp-ship-remain-chip--alert { background: #fef2f2; }
.erp-ship-remain-chip--alert .erp-ship-remain-chip__val { color: #dc2626; }

/* ── 출하 규격 입력 행 ── */
.erp-ship-rows { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.erp-ship-spec-row {
  display: grid; grid-template-columns: 2fr 1.2fr 1.5fr 1.5fr; gap: 8px;
  background: #f8fafc; border-radius: 8px; padding: 10px 12px;
  border: 1px solid #e2e8f0;
}
.erp-ship-spec-row__label {
  font-size: 12px; font-weight: 600; color: #1e3a5f;
  display: flex; align-items: center;
}
.erp-ship-spec-row__qty { font-size: 13px; }
.erp-ship-total-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 12px; background: #eff6ff; border-radius: 8px;
  margin-bottom: 14px; border: 1px solid #bfdbfe;
}
.erp-ship-total-row span { font-size: 13px; color: #1e3a5f; font-weight: 600; }
.erp-ship-total-row strong { font-size: 18px; font-weight: 700; color: #2563eb; }

/* ── 상세 드로어 ── */
.erp-detail-drawer {
  background: #fff; border-radius: 12px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 4px 20px rgba(0,0,0,.08);
}
.erp-detail-drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; background: #1e3a5f; border-radius: 12px 12px 0 0;
}
.erp-detail-drawer__head h3 { font-size: 15px; font-weight: 700; color: #fff; }
.erp-detail-drawer__head button {
  background: none; border: none; color: #94a3b8; cursor: pointer; font-size: 16px;
}
.erp-detail-drawer__body { padding: 20px; }

/* ── 상세 스펙 테이블 ── */
.erp-detail-spec-tbl {
  width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 8px;
}
.erp-detail-spec-tbl th {
  background: #f0f4f8; padding: 8px 12px; color: #374151;
  font-size: 12px; border: 1px solid #e2e8f0; text-align: left;
}
.erp-detail-spec-tbl td {
  padding: 8px 12px; border: 1px solid #e2e8f0; color: #1e293b;
}
.erp-detail-spec-tbl .remain-ok  { color: #16a34a; font-weight: 700; }
.erp-detail-spec-tbl .remain-warn { color: #92400e; font-weight: 700; }
.erp-detail-spec-tbl .remain-alert { color: #dc2626; font-weight: 700; }

/* ── 출하 이력 테이블 (상세) ── */
.erp-ship-hist-tbl {
  width: 100%; border-collapse: collapse; font-size: 12.5px; margin-top: 10px;
}
.erp-ship-hist-tbl th {
  background: #f0f4f8; padding: 7px 10px; color: #374151;
  font-size: 12px; border: 1px solid #e2e8f0;
}
.erp-ship-hist-tbl td {
  padding: 7px 10px; border: 1px solid #e2e8f0; color: #374151;
}
.erp-ship-hist-tbl tbody tr:nth-child(even) { background: #fafafa; }

/* ── 보고서 ── */
.erp-report-grid { display: grid; grid-template-columns: 320px 1fr; gap: 20px; align-items: start; }
.erp-report-area {
  background: #fff; border-radius: 12px;
  border: 1px solid #e2e8f0; padding: 24px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.erp-report-paper { font-size: 13px; color: #1e293b; }
.erp-report-paper h3 {
  font-size: 16px; font-weight: 700; color: #1e3a5f; margin-bottom: 16px;
  padding-bottom: 10px; border-bottom: 2px solid #1e3a5f;
}
.erp-report-section { margin-bottom: 20px; }
.erp-report-section h4 { font-size: 13px; font-weight: 700; color: #374151; margin-bottom: 8px; }
.erp-report-tbl {
  width: 100%; border-collapse: collapse; font-size: 12.5px;
}
.erp-report-tbl th {
  background: #1e3a5f; color: #fff; padding: 8px 10px;
  font-size: 12px; text-align: left;
}
.erp-report-tbl td { padding: 7px 10px; border: 1px solid #e2e8f0; }
.erp-report-tbl tbody tr:nth-child(even) { background: #f8fafc; }
.erp-report-tbl .ta-r { text-align: right; }
.erp-report-summary {
  display: flex; gap: 16px; flex-wrap: wrap;
  padding: 12px 16px; background: #f0f4f8;
  border-radius: 8px; margin-top: 12px;
}
.erp-report-summary-item { display: flex; flex-direction: column; gap: 2px; }
.erp-report-summary-item span { font-size: 11px; color: #64748b; }
.erp-report-summary-item strong { font-size: 15px; font-weight: 700; color: #1e3a5f; }

/* ── 로딩 ── */
.erp-loading {
  text-align: center; padding: 32px; color: #94a3b8; font-size: 14px;
}
.erp-loading .fas { margin-right: 6px; }

/* ── 알림 토스트 ── */
.erp-toast {
  position: fixed; bottom: 28px; right: 28px; z-index: 9999;
  padding: 12px 20px; border-radius: 10px;
  font-size: 13.5px; font-weight: 500;
  background: #1e293b; color: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.2);
  display: flex; align-items: center; gap: 10px;
  animation: erpToastIn .25s ease;
}
.erp-toast--success { background: #15803d; }
.erp-toast--error   { background: #dc2626; }
@keyframes erpToastIn { from { opacity:0; transform: translateY(12px); } to { opacity:1; transform: none; } }

/* ── 상태 뱃지 ── */
.erp-status {
  display: inline-block; padding: 2px 9px;
  border-radius: 999px; font-size: 11px; font-weight: 600;
}
.erp-status--active   { background: #dcfce7; color: #15803d; }
.erp-status--done     { background: #f1f5f9; color: #64748b; }
.erp-status--pause    { background: #fffbeb; color: #92400e; }
.erp-status--cancel   { background: #fef2f2; color: #dc2626; }

/* ── 경보 아이템 ── */
.erp-alert-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px; border-radius: 8px; margin-bottom: 6px;
  background: #fef2f2; border-left: 3px solid #dc2626;
}
.erp-alert-item--warn {
  background: #fffbeb; border-left-color: #f59e0b;
}
.erp-alert-item__icon { font-size: 16px; }
.erp-alert-item--warn  .erp-alert-item__icon { color: #f59e0b; }
.erp-alert-item         .erp-alert-item__icon { color: #dc2626; }
.erp-alert-item__body { flex: 1; }
.erp-alert-item__name { font-size: 13px; font-weight: 600; color: #1e293b; }
.erp-alert-item__meta { font-size: 12px; color: #64748b; }

/* ── ERP 헤더 버튼 ── */
.erp-header-btn {
  display: flex; align-items: center; gap: 5px;
  padding: 7px 12px; border-radius: 50px;
  background: rgba(255,255,255,0.1);
  color: #fff;
  border: 1.5px solid rgba(255,255,255,0.55);
  font-size: 12px; font-family: inherit; font-weight: 600;
  cursor: pointer; transition: all 0.3s ease; white-space: nowrap;
  flex-shrink: 0;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.erp-header-btn:hover {
  background: rgba(255,255,255,0.22);
  border-color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}

/* ── 배정 목록 아코디언 - 현장정보 요약바 ── */
.alloc-spec-info-bar {
  display: flex; flex-wrap: wrap; gap: 6px 18px;
  background: #f0f4f8; padding: 8px 14px;
  font-size: 11.5px; color: #475569;
  border-bottom: 1px solid #e2e8f0;
}
.alloc-spec-info-bar i { color: #64748b; margin-right: 3px; }

/* ── 배정 명세 서브테이블 (납품장소 컬럼 추가) ── */
.alloc-spec-table th:nth-child(3),
.alloc-spec-table td:nth-child(3) {
  font-size: 11px; color: #475569; max-width: 140px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ── 잔량 현황 테이블 납품장소 컬럼 ── */
.erp-table--remain td:nth-child(4) {
  font-size: 11px; color: #475569; max-width: 120px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ── 토글 스위치 (대지급/후징수) ── */
.erp-switch { position: relative; display: inline-block; width: 38px; height: 22px; flex-shrink: 0; }
.erp-switch input { opacity: 0; width: 0; height: 0; }
.erp-switch__slider {
  position: absolute; inset: 0; cursor: pointer;
  background: #cbd5e1; border-radius: 22px;
  transition: background .2s;
}
.erp-switch__slider::before {
  content: ''; position: absolute;
  width: 16px; height: 16px; border-radius: 50%;
  left: 3px; bottom: 3px; background: #fff;
  transition: transform .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.erp-switch input:checked + .erp-switch__slider { background: #2563eb; }
.erp-switch input:checked + .erp-switch__slider::before { transform: translateX(16px); }

/* ── 배정 폼 드로어 반응형 ── */
@media (max-width: 540px) {
  .erp-form-panel {
    width: 100%;
    border-left: none;
    border-top: 1px solid #e2e8f0;
    top: auto;
    bottom: 0;
    height: 92vh;
    transform: translateY(100%);
    border-radius: 16px 16px 0 0;
  }
  .erp-form-panel.is-open {
    transform: translateY(0);
  }
}

/* ── 엑셀 다운로드 버튼 ── */
.erp-btn--excel {
  background: #16a34a; color: #fff; border: none;
}
.erp-btn--excel:hover { background: #15803d; }
.erp-btn--excel .fas  { color: #bbf7d0; }

/* ── 엑셀 힌트 박스 ── */
.erp-excel-hint {
  margin-top: 10px; padding: 10px 14px;
  background: #f0fdf4; border: 1px solid #bbf7d0;
  border-radius: 8px; font-size: 12px; color: #166534; line-height: 1.6;
}
.erp-excel-hint .fas { margin-right: 4px; color: #16a34a; }

/* ══════════════════════════════════════════
   수요기관 현장별 잔량확인 보고서
══════════════════════════════════════════ */

/* 보고서 최상단 헤더 */
.erp-client-report-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
  padding: 20px 24px; margin-bottom: 20px;
  background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 100%);
  border-radius: 12px; color: #fff;
}
.erp-client-report-header__title  { flex: 1; min-width: 220px; }
.erp-client-report-header__company {
  font-size: 11px; color: #93c5fd; font-weight: 600;
  letter-spacing: 1px; margin-bottom: 4px;
}
.erp-client-report-header__h3 {
  font-size: 22px; font-weight: 800; color: #fff;
  margin-bottom: 6px; line-height: 1.2;
}
.erp-client-report-header__sub  { font-size: 12px; color: #bfdbfe; }
.erp-client-report-header__sub b { color: #fff; }

/* 전체 요약 카드 */
.erp-client-report-summary {
  display: flex; flex-wrap: wrap; gap: 0;
  background: rgba(255,255,255,.12); border-radius: 10px;
  overflow: hidden; border: 1px solid rgba(255,255,255,.18);
  align-self: flex-start;
}
.erp-client-report-summary__item {
  display: flex; flex-direction: column; gap: 2px;
  padding: 12px 18px; border-right: 1px solid rgba(255,255,255,.15);
}
.erp-client-report-summary__item:last-child { border-right: none; }
.erp-client-report-summary__item span   { font-size: 11px; color: #bfdbfe; }
.erp-client-report-summary__item strong { font-size: 16px; font-weight: 700; color: #fff; }
.erp-client-report-summary__item--highlight strong { color: #86efac; font-size: 19px; }

/* 현장 블록 카드 */
.erp-client-site-block {
  background: #fff; border-radius: 12px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
  margin-bottom: 20px; overflow: hidden;
}

/* 현장 블록 헤더 */
.erp-client-site-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
  padding: 14px 18px; background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}
.erp-client-site-header__left  { flex: 1; min-width: 200px; }
.erp-client-site-header__right { text-align: right; flex-shrink: 0; }
.erp-client-site-header__code {
  display: inline-block; font-size: 11px; font-weight: 700;
  color: #2563eb; background: #eff6ff;
  padding: 2px 8px; border-radius: 5px; margin-bottom: 4px;
}
.erp-client-site-header__name {
  font-size: 15px; font-weight: 700; color: #1e3a5f; margin-bottom: 5px;
}
.erp-client-site-header__meta {
  display: flex; flex-wrap: wrap; gap: 10px;
  font-size: 12px; color: #64748b;
}
.erp-client-site-header__meta .fas { margin-right: 3px; color: #93c5fd; }

/* 소진율 프로그레스 래퍼 */
.erp-client-progress-wrap {
  padding: 10px 18px 12px; background: #fafbfc;
  border-bottom: 1px solid #f1f5f9;
}

/* ── 반응형 ── */
@media (max-width: 1100px) {
  .erp-kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .erp-report-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .erp-sidebar { display: none; position: absolute; z-index: 10; height: 100%; }
  .erp-sidebar--open { display: flex !important; }
  .erp-topbar { display: flex; }
  .erp-shell { position: relative; }
  .erp-tab { padding: 16px; }
  .erp-kpi-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .erp-form-grid { grid-template-columns: 1fr; }
  /* 규격 행 모바일 반응형 */
  .erp-spec-rows-header { display: none; }
  .erp-spec-row { flex-direction: column; gap: 6px; padding: 12px; }
  .erp-spec-row__num { margin-top: 0; margin-bottom: 4px; }
  .erp-spec-row__body { width: 100%; }
  .erp-spec-row__fields { grid-template-columns: 1fr 1fr; gap: 8px; }
  .erp-spec-row__del { margin-top: 0; align-self: flex-end; }
  .erp-ship-spec-row { grid-template-columns: 1fr 1fr; }
  .erp-client-report-header { flex-direction: column; }
  .erp-client-report-summary { align-self: stretch; }
  .erp-client-report-summary__item { padding: 10px 14px; }
}
@media (max-width: 480px) {
  .erp-kpi-grid { grid-template-columns: 1fr 1fr; }
  .erp-kpi__val { font-size: 18px; }
  .erp-filter-bar { flex-direction: column; align-items: stretch; }
  .erp-input--sm { max-width: 100%; }
  .erp-spec-row__fields { grid-template-columns: 1fr; }
  .erp-spec-section__head { flex-wrap: wrap; gap: 8px; }
}

/* ══════════════════════════════════════════════════
   데이터 백업 패널 — 관리자 대시보드
══════════════════════════════════════════════════ */
#dashBackupCard {
  border: 2px solid #2563eb;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(37,99,235,.15);
}
/* 백업 지표 카드 */
.erp-bk-stat {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 12px 14px;
  display: flex; flex-direction: column;
  align-items: flex-start; gap: 3px;
  position: relative; overflow: hidden;
}
.erp-bk-stat::before {
  content: '';
  position: absolute; top: 0; left: 0;
  width: 3px; height: 100%;
  background: #2563eb;
  border-radius: 10px 0 0 10px;
}
.erp-bk-stat__icon {
  font-size: 18px; color: #2563eb;
  margin-bottom: 4px;
}
.erp-bk-stat__label {
  font-size: 11px; font-weight: 600;
  color: #64748b;
}
.erp-bk-stat__val {
  font-size: 20px; font-weight: 800;
  color: #1e3a5f; line-height: 1.1;
}
.erp-bk-stat__val span { font-size: 12px; font-weight: 500; color: #64748b; }
.erp-bk-stat__ts {
  font-size: 10px; color: #94a3b8;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 100%;
}
/* 백업 없음 상태 */
.erp-bk-stat--empty .erp-bk-stat__val { color: #f59e0b; }
.erp-bk-stat--empty::before { background: #f59e0b; }

/* 안내 배너 */
.erp-bk-notice {
  display: flex; gap: 9px; align-items: flex-start;
  background: #eff6ff; border: 1px solid #bfdbfe;
  border-radius: 8px; padding: 10px 12px;
  font-size: 12px; color: #1e40af; line-height: 1.6;
}
/* 복원 배너 애니메이션 (js/erp-backup.js에서 생성) */
#erpRestoreBanner { font-family: inherit; }

/* ══════════════════════════════════════════════════
   인쇄 스타일 (@media print) — A4 완벽 대응
   핵심: 모달 UI 전부 제거, #qfPrintArea만 A4로 출력
══════════════════════════════════════════════════ */
@media print {
  @page {
    size: A4 portrait;
    margin: 12mm 14mm;
  }

  /* 모달 외 모든 요소 숨김 */
  body > *:not(.qform-overlay) { display: none !important; }

  /* 오버레이: position 해제 → 일반 흐름 */
  .qform-overlay {
    position: static !important;
    background: none !important;
    padding: 0 !important;
    display: block !important;
    overflow: visible !important;
  }
  /* 모달 박스: 그림자/애니메이션 제거 */
  .qform-modal {
    box-shadow: none !important;
    border-radius: 0 !important;
    min-height: auto !important;
    max-height: none !important;
    animation: none !important;
    width: 100% !important;
    max-width: none !important;
    display: block !important;
  }
  /* 헤더/푸터/인쇄불필요 요소 완전 숨김 */
  .qform-header,
  .qform-footer,
  .qf-no-print,
  .qf-add-row-wrap,
  .qf-preset-sel { display: none !important; }

  /* 바디 스크롤 해제 */
  .qform-body {
    padding: 0 !important;
    overflow: visible !important;
    flex: none !important;
    max-height: none !important;
  }

  /* 종이 영역: A4 꽉 채움 */
  .qf-paper {
    padding: 0 !important;
    width: 100% !important;
    box-shadow: none !important;
    font-size: 11px !important;  /* 인쇄시 폰트 약간 축소 → A4 한장 */
  }

  /* 제목 절대위치 해제 → 인쇄시 정상 흐름 */
  .qf-doc-header { position: relative !important; }
  .qf-doc-title-block {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    pointer-events: none !important;
  }

  /* 헤더 */
  .qf-main-title { font-size: 26px !important; }
  .qf-doc-title-en { font-size: 9px !important; }
  .qf-meta-input, .qf-meta-label { font-size: 10px !important; }

  /* 수신처 */
  .qf-recipient-input { font-size: 14px !important; }
  .qf-recipient-rows td, .qf-rr-input { font-size: 10px !important; }
  .qf-recipient-rows td { padding: 2px 5px !important; }

  /* 공급자 */
  .qf-supplier-table td { font-size: 10px !important; padding: 2px 6px !important; }
  .qf-supplier-table .qf-sup-section { font-size: 11px !important; }
  .qf-sup-stamp { width: 52px !important; height: 52px !important; }

  /* 금액 헤더 */
  .qf-amount-header { font-size: 11px !important; padding: 3px 2px !important; }

  /* 품목 테이블 */
  .qf-table th { font-size: 10px !important; padding: 3px 2px !important; }
  .qf-table tbody td { font-size: 10px !important; height: 22px !important; padding: 0 3px !important; }
  .qf-td-input { font-size: 10px !important; }

  /* 참고사항 */
  .qf-note-box { font-size: 10px !important; padding: 4px 8px !important; }
  .qf-note-box__title { font-size: 11px !important; }
  .qf-note-textarea { font-size: 10px !important; min-height: auto !important; }

  /* 하단 */
  .qf-footer-logo { margin-top: 6px !important; padding-top: 4px !important; }
  .qf-footer-logo__name { font-size: 13px !important; }
  .qf-footer-logo__en { font-size: 9px !important; }

  /* 테이블 overflow 해제 */
  .qf-table-wrap    { overflow: visible !important; margin-bottom: 3px !important; }
  .qf-table         { table-layout: fixed !important; width: 100% !important; }
  .qf-supplier-table{ table-layout: fixed !important; width: 100% !important; }
  .qf-recipient-rows{ width: 100% !important; }

  /* 도장 이미지 인쇄 보장 */
  .qf-sup-stamp {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    display: inline-block !important;
  }

  /* 수량·단가 input 인쇄 시 숨기고 포맷된 span 표시 */
  .qf-no-print.qf-qty,
  .qf-no-print.qf-price { display: none !important; }
  .qf-print-only {
    display: inline-block !important;
    font-size: 10px !important;
    width: 100% !important;
  }

  /* 입력창 → 텍스트처럼 (테두리 제거) */
  .qf-td-input,
  .qf-meta-input,
  .qf-rr-input,
  .qf-recipient-input {
    border: none !important;
    border-bottom: none !important;
    background: transparent !important;
  }

  /* textarea 인쇄 시 테두리 제거, 높이 자동 */
  .qf-note-textarea {
    border: none !important;
    background: transparent !important;
    resize: none !important;
    overflow: visible !important;
    min-height: auto !important;
    height: auto !important;
  }

  /* 행 추가버튼 / 삭제버튼 숨김 */
  .qf-row-del-btn,
  .qf-td-del { display: none !important; }

  /* 참고사항 박스 인쇄 보장 */
  .qf-note-box {
    border: 1px solid #555 !important;
    page-break-inside: avoid;
    margin-bottom: 6px !important;
  }
  .qf-footer-logo { page-break-inside: avoid; }
  .qf-add-row-wrap { display: none !important; }
}

/* ── 견적서 모달 모바일 반응형 ── */
@media (max-width: 768px) {
  .qform-overlay { padding: 0; align-items: flex-end; }
  .qform-modal {
    border-radius: 20px 20px 0 0;
    max-width: 100%;
    min-height: 92vh;
    max-height: 96vh;
  }
  .qform-header { border-radius: 20px 20px 0 0; padding: 12px 16px; }
  .qform-header__left h2 { font-size: 15px; }
  .qform-action-btn span { display: none; }
  .qform-action-btn { padding: 8px 10px; }
  .qform-body { padding: 14px 12px 8px; }
  /* 헤더 → 세로 */
  .qf-doc-header { flex-direction: column; gap: 6px; }
  .qf-doc-meta-block { align-items: flex-start; width: 100%; }
  .qf-meta-input { width: 100%; }
  /* 테이블 가로 스크롤 허용 (모바일에서만) */
  .qf-table-wrap { overflow-x: auto; }
  .qf-table { min-width: 520px; }
  /* 조건 테이블 → 단일 컬럼 */
  .qf-cond-table colgroup { display: none; }
  .qform-footer-btn { font-size: 12px; padding: 11px 6px; }
  /* iOS 입력 확대 방지 */
  .qf-td-input,
  .qf-meta-input,
  .qf-info-input,
  .qf-cond-input { font-size: 16px; }
  .qf-note-textarea { font-size: 16px; }
  .qf-mail-field input { font-size: 16px; }
  /* 수신처 테이블 모바일 */
  .qf-info-table,
  .qf-cond-table { font-size: 11px; }
  /* 서명란 도장 축소 */
  .qf-sign-stamp-img { width: 64px; height: 64px; }
  .qf-stamp-img { width: 40px; height: 40px; }
}
@media (max-width: 480px) {
  .qform-header__left h2 { font-size: 14px; }
  .qf-main-title { font-size: 20px; letter-spacing: 3px; }
  .qform-footer { padding: 10px 10px; gap: 6px; }
  .qf-sign-stamp-img { width: 56px; height: 56px; }
}

/* ── 인증서 섹션 모바일 ── */
@media (max-width: 768px) {
  .certs__admin-inner { padding: 18px 16px; }
  .certs__form-row { grid-template-columns: 1fr; gap: 12px; }
  .cert-card__name { font-size: 14px; }
  .cert-card__header { padding: 16px 16px 12px; }
  .cert-card__body { padding: 0 16px 14px; }
  .cert-card__footer { padding: 12px 16px; }
  /* 업로드 존 모바일 */
  .cert-upload-zone { padding: 24px 16px; }
}
@media (max-width: 480px) {
  .certs__grid { grid-template-columns: 1fr; }
  .cert-card { border-radius: 16px; }
  .cert-card__print-btn { font-size: 12px; padding: 9px 8px; }
  /* 업로드 폼 입력 필드 iOS 확대 방지 */
  .certs__admin-inner input,
  .certs__admin-inner select,
  .certs__admin-inner textarea { font-size: 16px; }
}

/* ── 인증서 인라인 뷰어 오버레이 모바일 ── */
#certViewerOverlay {
  padding: 12px !important;
}
@media (max-width: 480px) {
  #certViewerOverlay {
    padding: 8px !important;
  }
  #certViewerOverlay img {
    max-height: calc(100vh - 80px) !important;
  }
  #certViewerOverlay iframe {
    height: calc(100vh - 80px) !important;
  }
}

/* ── 네비게이션 드롭다운 모바일 (기존 스타일 유지, 중복 제거) ── */

/* ── Hero 섹션 추가 보강 ── */
@media (max-width: 768px) {
  .hero__title { font-size: clamp(28px, 7vw, 40px); }
  .hero__cta-group { flex-direction: column; gap: 10px; }
  .hero__cta-group .btn { width: 100%; justify-content: center; }
}

/* ── 푸터 모바일 ── */
@media (max-width: 768px) {
  .footer__pwa-row { padding: 16px 0 4px; margin-top: 20px; }
  .footer__pwa-cta {
    width: 100%;
    max-width: 360px;
    justify-content: center;
    padding: 16px 24px;
    font-size: 15px;
    min-height: 56px; /* 터치 타깃 충분히 확보 */
  }
}
@media (max-width: 480px) {
  .footer__nav { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .footer__logo-area { text-align: center; }
  .footer__contact-list { align-items: center; }
  .footer__pwa-cta { font-size: 14px; padding: 15px 20px; }
}

/* ── 스크롤바 얇게 (모바일 터치 환경) ── */
@media (max-width: 768px) {
  ::-webkit-scrollbar { width: 4px; height: 4px; }
  ::-webkit-scrollbar-track { background: #f0f4f0; }
  ::-webkit-scrollbar-thumb { background: #b7e4c7; border-radius: 4px; }
}

/* ── 비밀번호 변경 모달 모바일 ── */
@media (max-width: 480px) {
  .certs-pw-modal { padding: 28px 20px 22px; border-radius: 16px; }
  .certs-pw-modal h4 { font-size: 16px; }
  .certs-pw-btns { flex-direction: column; gap: 8px; }
  .certs-pw-confirm,
  .certs-pw-cancel { padding: 12px; }
  .cpw-hint { font-size: 11px; padding: 10px 12px; }
}

/* ── 토스트 모바일 ── */
@media (max-width: 480px) {
  .toast {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) translateY(20px) !important;
    width: calc(100vw - 32px);
    max-width: none;
    text-align: center;
    justify-content: center;
    font-size: 13px;
  }
  .toast--show {
    transform: translateX(-50%) translateY(0) !important;
  }
}

/* ── About / Eco / Quality 섹션 모바일 ── */
@media (max-width: 768px) {
  .about__grid { grid-template-columns: 1fr; gap: 32px; }
  .about__text h2 { font-size: clamp(22px, 5vw, 32px); }
  .eco__certs { grid-template-columns: 1fr; gap: 14px; }
  .eco-cert-card { padding: 18px; gap: 12px; }
  .quality__grid { grid-template-columns: 1fr; gap: 16px; }
  .quality-card { padding: 20px; }
}
@media (max-width: 480px) {
  .eco-cert-card { flex-direction: column; align-items: flex-start; }
  .eco-cert-card__icon { width: 52px; height: 52px; }
}

/* ── 통계 섹션 ── */
@media (max-width: 480px) {
  .stats__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
}

/* ── Contact (오시는 길) 모바일 ── */
@media (max-width: 768px) {
  .contact__grid { grid-template-columns: 1fr; gap: 24px; }
  .contact__map-wrap { height: 260px; border-radius: 14px; }
  .contact__info-card { padding: 22px 18px; }
  .contact__form-wrap { padding: 22px 16px; }
}
@media (max-width: 480px) {
  .contact__map-wrap { height: 220px; }
  .contact__info-item { font-size: 13px; }
  /* Contact 폼 iOS 확대 방지 */
  .contact__form input,
  .contact__form select,
  .contact__form textarea { font-size: 16px !important; }
}

/* ── 섹션 헤드 모바일 ── */
@media (max-width: 768px) {
  .section-head { margin-bottom: 36px; }
  .section-label { font-size: 10px; letter-spacing: 3px; }
  .section-subtitle { font-size: 14px; }
}
@media (max-width: 480px) {
  .section-head { margin-bottom: 28px; }
}

/* ================================================================
   견적서 저장 버튼 추가 스타일
================================================================ */
.qform-action-btn--save {
  background: #1b4332;
  color: #fff;
  border: none;
}
.qform-action-btn--save:hover { background: #2d6a4f; }

.qform-footer-btn--save {
  background: #1b4332;
  color: #fff;
}
.qform-footer-btn--save:hover { background: #2d6a4f; }

/* 사이드바 버튼 그룹 */
.est-qform-btn-group {
  display: flex;
  gap: 8px;
  margin-top: 14px;
}
.est-qform-btn-group .est-qform-btn {
  margin-top: 0;
  flex: 1;
}
.est-qlist-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 13px 14px;
  border-radius: 12px;
  border: 1.5px solid #52b788;
  background: #fff;
  color: #2d6a4f;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.est-qlist-btn:hover {
  background: #f0fdf4;
  border-color: #40916c;
  transform: translateY(-1px);
}

/* ================================================================
   견적서 내역 조회 모달 – QUOTATION LIST STYLES
================================================================ */

/* ── 오버레이 ── */
.qlist-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,30,20,0.68);
  z-index: 9900;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  backdrop-filter: blur(4px);
}

/* ── 모달 컨테이너 ── */
.qlist-modal {
  background: #fff;
  border-radius: 20px;
  width: 100%;
  max-width: 900px;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(10,25,15,0.32);
  animation: qlistSlideUp 0.28s ease;
}
@keyframes qlistSlideUp {
  from { opacity: 0; transform: translateY(32px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── 헤더 ── */
.qlist-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 22px;
  background: linear-gradient(135deg, #1b4332, #2d6a4f);
  color: #fff;
  flex-shrink: 0;
}
.qlist-header__left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.qlist-header__left i { font-size: 18px; color: #95d5b2; }
.qlist-header__left h2 { font-size: 17px; font-weight: 700; margin: 0; color: #fff; }
.qlist-close {
  background: rgba(255,255,255,0.15);
  border: none;
  color: #fff;
  width: 34px; height: 34px;
  border-radius: 50%;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  transition: background 0.2s;
}
.qlist-close:hover { background: rgba(255,255,255,0.28); }

/* ── 로딩 ── */
.qlist-loading {
  padding: 48px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  color: #4a5568;
}

/* ── 스크린 공통 ── */
.qlist-screen {
  flex: 1;
  overflow-y: auto;
  padding: 20px 22px;
}

/* ══════════════════════════════
   ① 인증 화면
══════════════════════════════ */
.qlist-auth-wrap {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0;
  align-items: start;
  max-width: 720px;
  margin: 0 auto;
  padding: 8px 0 16px;
}
.qlist-auth-card {
  padding: 28px 24px;
  border-radius: 16px;
  border: 1.5px solid #e8f0eb;
  background: #fafcfb;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.qlist-auth-card--admin {
  border-color: #b7e4c7;
  background: linear-gradient(135deg, #f0fdf4, #e8f5ec);
}
.qlist-auth-card--writer {
  border-color: #bee3f8;
  background: linear-gradient(135deg, #ebf8ff, #e3f2fd);
}
.qlist-auth-icon {
  width: 48px; height: 48px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  margin-bottom: 4px;
}
.qlist-auth-card--admin .qlist-auth-icon { background: #d8f3dc; color: #2d6a4f; }
.qlist-auth-card--writer .qlist-auth-icon { background: #bee3f8; color: #2b6cb0; }
.qlist-auth-card h3 { font-size: 16px; font-weight: 700; color: #1a3c2b; margin: 0; }
.qlist-auth-card p  { font-size: 13px; color: #718096; margin: 0; line-height: 1.6; }
.qlist-auth-card p strong { color: #2d6a4f; }
.qlist-auth-card--writer p strong { color: #2b6cb0; }

.qlist-auth-field { display: flex; flex-direction: column; gap: 6px; }
.qlist-auth-input {
  width: 100%;
  padding: 11px 14px;
  border: 1.5px solid #d1e8d8;
  border-radius: 10px;
  font-size: 14px;
  font-family: 'Noto Sans KR', sans-serif;
  background: #fff;
  color: #1a3c2b;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
}
.qlist-auth-input:focus {
  border-color: #52b788;
  box-shadow: 0 0 0 3px rgba(82,183,136,0.15);
}
.qlist-auth-card--writer .qlist-auth-input:focus {
  border-color: #63b3ed;
  box-shadow: 0 0 0 3px rgba(99,179,237,0.15);
}

.qlist-auth-btn {
  padding: 12px 16px;
  border-radius: 10px;
  border: none;
  font-size: 14px;
  font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  transition: all 0.2s;
  margin-top: 4px;
}
.qlist-auth-btn--admin {
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  box-shadow: 0 4px 14px rgba(45,106,79,0.25);
}
.qlist-auth-btn--admin:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(45,106,79,0.35); }
.qlist-auth-btn--writer {
  background: linear-gradient(135deg, #2b6cb0, #3182ce);
  color: #fff;
  box-shadow: 0 4px 14px rgba(43,108,176,0.25);
}
.qlist-auth-btn--writer:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(43,108,176,0.35); }

/* 구분선 */
.qlist-auth-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  color: #a0aec0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  align-self: center;
}

/* ══════════════════════════════
   ② 목록 화면
══════════════════════════════ */
.qlist-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.qlist-table-title {
  font-size: 15px;
  font-weight: 700;
  color: #1a3c2b;
}
.qlist-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
}
.qlist-search-input {
  padding: 9px 14px;
  border: 1.5px solid #d1e8d8;
  border-radius: 10px;
  font-size: 13px;
  font-family: 'Noto Sans KR', sans-serif;
  background: #fafcfb;
  color: #1a3c2b;
  outline: none;
  width: 220px;
  transition: border-color 0.2s;
}
.qlist-search-input:focus { border-color: #52b788; }
.qlist-reload-btn {
  width: 36px; height: 36px;
  border: 1.5px solid #d1e8d8;
  border-radius: 10px;
  background: #fafcfb;
  color: #52b788;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px;
  transition: all 0.2s;
}
.qlist-reload-btn:hover { background: #f0fdf4; border-color: #52b788; }

/* 테이블 */
.qlist-table-wrap {
  overflow-x: auto;
  border-radius: 12px;
  border: 1px solid #e8f0eb;
}
.qlist-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.qlist-table thead tr {
  background: linear-gradient(135deg, #f0fdf4, #e8f5ec);
}
.qlist-table th {
  padding: 12px 14px;
  text-align: left;
  font-size: 12px;
  font-weight: 700;
  color: #2d6a4f;
  white-space: nowrap;
  border-bottom: 2px solid #b7e4c7;
}
.qlist-th-no { width: 42px; text-align: center; }
.qlist-tr {
  cursor: pointer;
  transition: background 0.15s;
  border-bottom: 1px solid #f0f4f1;
}
.qlist-tr:hover { background: #f0fdf4; }
.qlist-tr:last-child { border-bottom: none; }
.qlist-table td {
  padding: 12px 14px;
  color: #374151;
  vertical-align: middle;
}
.qlist-td-no { text-align: center; color: #a0aec0; font-size: 12px; }
.qlist-td-company strong { font-size: 13px; color: #1a3c2b; display: block; }
.qlist-td-company small { font-size: 11px; color: #718096; }
.qlist-td-amt { font-weight: 700; color: #2d6a4f; white-space: nowrap; }
.qlist-td-date { font-size: 12px; color: #718096; white-space: nowrap; }
.qlist-td-status { white-space: nowrap; }
.qlist-td-actions { white-space: nowrap; text-align: center; }

.qlist-empty {
  text-align: center;
  padding: 48px 20px;
  color: #a0aec0;
  font-size: 14px;
  line-height: 2;
}

/* 상태 배지 */
.qlist-status-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid;
  white-space: nowrap;
}
/* 상태 셀렉트 (관리자) */
.qlist-status-sel {
  padding: 4px 8px;
  border-radius: 8px;
  border: 1.5px solid;
  font-size: 11px;
  font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  background: #fff;
  cursor: pointer;
  outline: none;
}

/* 열람 버튼 */
.qlist-view-btn, .qlist-del-btn {
  width: 30px; height: 30px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  margin: 0 2px;
}
.qlist-view-btn { background: #ebf8ff; color: #2b6cb0; }
.qlist-view-btn:hover { background: #bee3f8; }
.qlist-del-btn { background: #fff5f5; color: #c53030; }
.qlist-del-btn:hover { background: #fed7d7; }

/* 페이지네이션 */
.qlist-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #f0f4f1;
}
.qlist-page-btn {
  padding: 8px 16px;
  border: 1.5px solid #d1e8d8;
  border-radius: 10px;
  background: #fafcfb;
  color: #2d6a4f;
  font-size: 13px;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s;
}
.qlist-page-btn:hover:not(:disabled) { background: #f0fdf4; border-color: #52b788; }
.qlist-page-btn:disabled { opacity: 0.4; cursor: default; }
.qlist-page-info { font-size: 13px; color: #718096; }

/* ══════════════════════════════
   ③ 상세 열람 화면
══════════════════════════════ */
.qlist-detail-toolbar {
  margin-bottom: 16px;
}
.qlist-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  border: 1.5px solid #d1e8d8;
  border-radius: 10px;
  background: #fafcfb;
  color: #2d6a4f;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  transition: all 0.2s;
}
.qlist-back-btn:hover { background: #f0fdf4; border-color: #52b788; }

.qlist-detail-content { padding-bottom: 24px; }

/* 상세 헤더 */
.qldetail-header {
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 2px solid #e8f0eb;
}
.qldetail-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.qldetail-est-no {
  font-size: 18px;
  font-weight: 800;
  color: #1a3c2b;
  margin: 0;
}
.qldetail-meta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 12px;
  color: #718096;
}
.qldetail-meta span { display: flex; align-items: center; gap: 5px; }
.qldetail-meta i { color: #52b788; }

/* 수신·발신 그리드 */
.qldetail-parties {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 16px;
}
.qldetail-party {
  border: 1.5px solid #e8f0eb;
  border-radius: 12px;
  overflow: hidden;
}
.qldetail-party-title {
  padding: 8px 14px;
  background: linear-gradient(135deg, #f0fdf4, #e8f5ec);
  font-size: 12px;
  font-weight: 700;
  color: #2d6a4f;
  letter-spacing: 2px;
  border-bottom: 1px solid #d8f3dc;
}
.qldetail-info-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.qldetail-info-tbl th {
  padding: 7px 12px;
  text-align: left;
  color: #718096;
  font-weight: 600;
  width: 70px;
  white-space: nowrap;
  background: #fafcfb;
  border-bottom: 1px solid #f0f4f1;
}
.qldetail-info-tbl td {
  padding: 7px 12px;
  color: #1a3c2b;
  border-bottom: 1px solid #f0f4f1;
}
.qldetail-info-tbl tr:last-child th,
.qldetail-info-tbl tr:last-child td { border-bottom: none; }

/* 합계 배너 */
.qldetail-total-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background: linear-gradient(135deg, #1b4332, #2d6a4f);
  border-radius: 12px;
  margin-bottom: 14px;
  color: #d8f3dc;
  font-size: 13px;
}
.qldetail-total-banner strong {
  font-size: 20px;
  font-weight: 800;
  color: #fff;
}

/* 품목 테이블 */
.qldetail-table-wrap {
  overflow-x: auto;
  border-radius: 10px;
  border: 1px solid #e8f0eb;
  margin-bottom: 14px;
}
.qldetail-items-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  min-width: 560px;
}
.qldetail-items-tbl th {
  padding: 9px 10px;
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  color: #2d6a4f;
  background: linear-gradient(135deg, #f0fdf4, #e8f5ec);
  border-bottom: 2px solid #b7e4c7;
  white-space: nowrap;
}
.qldetail-items-tbl td {
  padding: 9px 10px;
  text-align: center;
  border-bottom: 1px solid #f0f4f1;
  color: #374151;
}
.qldetail-items-tbl td:nth-child(2) { text-align: left; }
.qldetail-items-tbl td:nth-child(8) { text-align: left; }
.qldetail-items-tbl tfoot td {
  background: #f0fdf4;
  font-weight: 700;
  color: #2d6a4f;
}
.ta-r { text-align: right !important; }

/* 조건 */
.qldetail-conditions { margin-bottom: 14px; }
.qldetail-cond-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 10px;
}
.qldetail-cond-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 8px 12px;
  background: #fafcfb;
  border: 1px solid #e8f0eb;
  border-radius: 8px;
  font-size: 12px;
  color: #374151;
}
.qldetail-cond-key {
  font-weight: 700;
  color: #2d6a4f;
  white-space: nowrap;
  flex-shrink: 0;
  min-width: 56px;
}
.qldetail-note {
  padding: 12px 14px;
  background: #fffbeb;
  border: 1px solid #fcefc7;
  border-radius: 8px;
  font-size: 12px;
  color: #744210;
}
.qldetail-note strong { display: block; margin-bottom: 6px; font-size: 12px; }
.qldetail-note p { margin: 0; line-height: 1.6; }

/* 관리자 상태 변경 */
.qldetail-admin-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: #fafcfb;
  border: 1.5px solid #e8f0eb;
  border-radius: 12px;
  margin-top: 16px;
}
.qldetail-status-label {
  font-size: 13px;
  font-weight: 700;
  color: #1a3c2b;
  white-space: nowrap;
}
.qldetail-status-sel {
  flex: 1;
  padding: 8px 12px;
  border: 1.5px solid #d1e8d8;
  border-radius: 8px;
  font-size: 13px;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600;
  color: #2d6a4f;
  background: #fff;
  outline: none;
}
.qldetail-status-save-btn {
  padding: 9px 18px;
  border: none;
  border-radius: 8px;
  background: linear-gradient(135deg, #2d6a4f, #40916c);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  font-family: 'Noto Sans KR', sans-serif;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  transition: all 0.2s;
}
.qldetail-status-save-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(45,106,79,0.3); }

/* ══════════════════════════
   모바일 반응형
══════════════════════════ */
@media (max-width: 768px) {
  .qlist-overlay { padding: 0; align-items: flex-end; }
  .qlist-modal {
    border-radius: 20px 20px 0 0;
    max-width: 100%;
    max-height: 94vh;
    min-height: 80vh;
  }
  .qlist-header { border-radius: 20px 20px 0 0; padding: 12px 16px; }
  .qlist-screen { padding: 14px 14px; }

  /* 인증 화면 – 세로 스택 */
  .qlist-auth-wrap {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .qlist-auth-divider { padding: 0; }
  .qlist-auth-divider::before,
  .qlist-auth-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e8f0eb;
    margin: 0 10px;
  }
  .qlist-auth-divider { display: flex; align-items: center; }

  /* 목록 화면 */
  .qlist-toolbar { gap: 8px; }
  .qlist-search-input { width: 100%; flex: 1; font-size: 16px; }
  .qlist-hidden-mobile { display: none !important; }
  .qlist-auth-input { font-size: 16px; }

  /* 상세 */
  .qldetail-parties { grid-template-columns: 1fr; gap: 10px; }
  .qldetail-cond-grid { grid-template-columns: 1fr; }
  .qldetail-est-no { font-size: 15px; }
  .qldetail-total-banner strong { font-size: 17px; }
  .qldetail-admin-actions { flex-wrap: wrap; }
  .qldetail-status-sel { width: 100%; }
  .qldetail-status-save-btn { width: 100%; justify-content: center; }
}
@media (max-width: 480px) {
  .qlist-header__left h2 { font-size: 15px; }
  .qlist-table { font-size: 12px; }
  .qlist-table th, .qlist-table td { padding: 9px 8px; }
  .est-qform-btn-group { flex-direction: column; }
  .est-qlist-btn { width: 100%; }
}