/* =========================================================
   파일명: /assets/css/brand-rebuild.css
   역할: 뉴트리바디 브랜드형 산업자동화 사이트 전면 재구성 패치
   원칙:
   - 라운드/그림자/얇은 박스 남발 제거
   - 콘텐츠 폭 확대
   - 이미지 중심 / 직선형 / 산업장비 브랜드 톤
   - 자료실 메뉴 제거 후 카탈로그는 고객센터 하위메뉴로 처리
========================================================= */

:root{
  --nb-brand-bg:#f4f7fb;
  --nb-ink:#0f172a;
  --nb-ink-2:#1f2937;
  --nb-muted-2:#64748b;
  --nb-line-2:#d9e1ea;
  --nb-accent:#35bdf2;
  --nb-blue-modern:#126ee2;
  --nb-container:var(--nb-page-width);
  --nb-header-h:76px;
}

html{scroll-behavior:smooth}
body{
  background:var(--nb-brand-bg);
  color:var(--nb-ink);
  font-family:"Pretendard","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}

.container{width:var(--nb-container);max-width:none;margin:0 auto}

/* =========================================================
   [01] HEADER 정리
   - header/nav/dropdown은 /assets/css/header.css에서만 관리합니다.
   - 이 파일에서는 header 관련 selector를 재정의하지 않습니다.
========================================================= */

/* =========================================================
   [02] Hero / 페이지 상단 구조: 낮은 박스감 제거, 이미지 중심
========================================================= */
.home-hero,
.page-banner{
  margin-top:0;
  border-radius:0;
}
.home-hero{
  min-height:760px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:#111827;
}
.home-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(7,13,23,.72),rgba(7,13,23,.36) 46%,rgba(7,13,23,.18));
  pointer-events:none;
}

.page-banner:not(.page-banner--layered)::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(7,13,23,.34),rgba(7,13,23,.16) 46%,rgba(7,13,23,.08));
  pointer-events:none;
}
.home-hero-inner,
.page-banner .container{position:relative;z-index:2}
.home-hero-text{max-width:820px;padding-top:var(--nb-header-h)}
.hero-kicker,
.page-banner-label{
  color:#9fd0ff;
  letter-spacing:.16em;
  font-weight:900;
  font-size:15px;
}
.home-hero h1,
.page-banner-title{
  font-size:clamp(52px,5vw,86px);
  line-height:1.04;
  letter-spacing:-.07em;
  font-weight:950;
  color:#fff;
  text-shadow:0 12px 34px rgba(0,0,0,.35);
}
.home-hero p,
.page-banner-desc{
  font-size:clamp(18px,1.35vw,24px);
  line-height:1.75;
  color:rgba(255,255,255,.86);
}
.hero-product-search{display:none}
.hero-quick-menu{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px}
.hero-quick-btn,
.btn,
.btn-primary,
.btn-light{
  border-radius:0;
  min-height:50px;
  padding:0 24px;
  border:1px solid rgba(255,255,255,.42);
  background:rgba(255,255,255,.08);
  color:#fff;
  font-weight:900;
}
.hero-quick-btn:hover{background:var(--nb-accent);border-color:var(--nb-accent)}

/* =========================================================
   [03] 하위메뉴 / breadcrumb: 구형 바 느낌 제거
========================================================= */
.breadcrumbs{display:none}
.page-section-bar{
  position:relative;
  z-index:20;
  margin-top:-1px;
  background:#fff;
  border-top:1px solid var(--nb-line-2);
  border-bottom:1px solid var(--nb-line-2);
}
.page-section-bar__inner{
  display:flex;
  align-items:center;
  min-height:70px;
}
.page-section-bar__home,
.page-section-bar__current,
.page-section-bar__link{
  border-radius:0;
  box-shadow:none;
}
.page-section-bar__home{
  width:64px;
  align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:var(--nb-accent);
}
.page-section-bar__current{
  min-width:190px;
  padding:0 26px;
  font-size:15px;
  font-weight:900;
  color:var(--nb-ink);
  border-right:1px solid var(--nb-line-2);
}
.page-section-bar__links{display:flex;align-items:stretch;overflow:auto}
.page-section-bar__link{
  position:relative;
  display:flex;
  align-items:center;
  padding:0 24px;
  min-height:70px;
  color:#334155;
  font-size:15px;
  font-weight:800;
  border-right:1px solid var(--nb-line-2);
  white-space:nowrap;
}
.page-section-bar__link.is-active,
.page-section-bar__link:hover{color:var(--nb-accent)}
.page-section-bar__link.is-active::after,
.page-section-bar__link:hover::after{
  content:"";
  position:absolute;
  left:24px;
  right:24px;
  bottom:0;
  height:4px;
  background:var(--nb-accent);
}

/* =========================================================
   [04] 전체 레이아웃: 폭 확대, 박스감 제거, 각진 톤
========================================================= */
.main-layout{
  padding-top:clamp(56px,5vw,96px);
  padding-bottom:clamp(80px,7vw,140px);
}
.layout-content{width:100%}
.content-card,
.page-intro-card,
.category-card,
.quick-card,
.contact-box,
.empty-box,
.notice-box,
.resource-item,
.product-card,
.case-card,
.home-difference-card,
.home-process-item{
  border-radius:0;
  box-shadow:none;
}
.content-card{
  background:#fff;
  border:1px solid var(--nb-line-2);
  padding:clamp(38px,4vw,72px);
  margin-bottom:42px;
}
.content-card h2{
  font-size:clamp(34px,3vw,52px);
  line-height:1.12;
  letter-spacing:-.06em;
  color:var(--nb-ink);
  margin-bottom:22px;
}
.content-card p{font-size:17px;line-height:1.9;color:#536273}
.badge,
.home-pill{
  border-radius:0;
  background:transparent;
  color:var(--nb-accent);
  box-shadow:none;
  padding:0;
  min-height:auto;
  font-size:13px;
  letter-spacing:.18em;
}
.page-intro-card{
  grid-template-columns:minmax(0,1fr) minmax(420px,46%);
  gap:56px;
  padding:clamp(34px,4vw,64px);
  border:0;
  border-top:4px solid var(--nb-ink);
  background:#fff;
}
.page-intro-text{min-height:230px}
.page-intro-text h2{font-size:clamp(38px,3vw,56px);letter-spacing:-.07em;color:var(--nb-ink)}
.page-intro-image{border-radius:0;border:0;box-shadow:none}
.page-intro-image img{border-radius:0;min-height:260px;object-fit:cover}

/* =========================================================
   [05] 메인 페이지 섹션 재구성
========================================================= */
.home-primary-products,
.home-difference-section{padding-top:clamp(78px,6vw,120px)}
.home-section-title,
.section-head{text-align:left;margin-bottom:34px}
.home-section-title span,
.section-head span,
.home-case-flow-head span{
  color:var(--nb-accent);
  font-size:13px;
  font-weight:950;
  letter-spacing:.18em;
}
.home-section-title h2,
.section-head h2,
.home-case-flow-head h2{
  font-size:clamp(38px,3.6vw,60px);
  line-height:1.1;
  color:var(--nb-ink);
  letter-spacing:-.07em;
  margin:10px 0 12px;
}
.home-section-title p,
.section-head p{font-size:17px;color:#64748b}
.quick-menu.home-image-card-grid,
.category-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin-top:0;
}
.home-image-card,
.category-card{
  position:relative;
  min-height:420px;
  padding:0;
  border:1px solid var(--nb-line-2);
  border-right:0;
  overflow:hidden;
  background:#111827;
}
.home-image-card:last-child,
.category-card:last-child{border-right:1px solid var(--nb-line-2)}
.home-image-card .quick-card-image,
.category-card .quick-card-image{position:absolute;inset:0;display:block}
.home-image-card img,
.category-card img{width:100%;height:100%;object-fit:cover;opacity:1;filter:none;image-rendering:auto;transition:transform .35s ease}
.home-image-card::after,
.category-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.72));z-index:1}
.home-image-card .quick-card-body,
.category-card > *:not(.quick-card-image){position:relative;z-index:2;display:block;padding:300px 28px 28px;color:#fff}
.home-image-card strong,
.category-card h3{font-size:28px;line-height:1.18;color:#fff;letter-spacing:-.06em}
.home-image-card span span,
.category-card p{color:rgba(255,255,255,.82);font-size:15px;line-height:1.6}
.home-image-card:hover img,
.category-card:hover img{transform:scale(1.05);opacity:1}
.home-difference-card{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:54px;
  padding:clamp(48px,5vw,84px);
  background:#111827;
  color:#fff;
  border:0;
}
.home-difference-copy h2{font-size:clamp(36px,3.2vw,56px);line-height:1.15;letter-spacing:-.07em;color:#fff}
.home-difference-copy p{font-size:17px;color:rgba(255,255,255,.72);line-height:1.9}
.home-process-list{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(255,255,255,.16)}
.home-process-item{background:#111827;border:0;padding:28px;min-height:160px}
.home-process-item b{display:block;color:var(--nb-accent);font-size:15px;margin-bottom:18px}
.home-process-item strong{font-size:22px;line-height:1.35;color:#fff}

/* =========================================================
   [06] 제품/사례 카드: 게시판형에서 쇼케이스형으로
========================================================= */
.product-grid,
.case-grid,
.cases-grid{
  gap:0;
}
.product-card,
.case-card{
  border:1px solid var(--nb-line-2);
  background:#fff;
  overflow:hidden;
  transition:transform .2s ease, border-color .2s ease;
}
.product-card:hover,
.case-card:hover{transform:translateY(-3px);border-color:#94a3b8}
.product-card img,
.case-card img,
.product-card-thumb img,
.case-card-thumb img{border-radius:0;transition:transform .35s ease}
.product-card:hover img,
.case-card:hover img{transform:scale(1.04)}
.product-card h3,
.case-card h3{font-size:21px;line-height:1.28;letter-spacing:-.05em;color:var(--nb-ink)}
.filter-panel,
.product-filter,
.filter-bar,
.case-filter-bar{
  border-radius:0;
  box-shadow:none;
  border:1px solid var(--nb-line-2);
  background:#fff;
}
.filter-chip,
.case-chip,
.mobile-submenu__link{
  border-radius:0;
}

/* =========================================================
   [07] 입력폼 / 고객센터 / 자료 카드 각진 처리
========================================================= */
input,select,textarea,button{border-radius:0}
.contact-form input,
.contact-form select,
.contact-form textarea,
.inquiry-form input,
.inquiry-form select,
.inquiry-form textarea{
  border-radius:0;
  min-height:48px;
  border:1px solid #cbd5e1;
}
.resource-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-top:1px solid var(--nb-line-2);border-left:1px solid var(--nb-line-2)}
.resource-item{display:grid;grid-template-columns:220px 1fr;gap:24px;padding:24px;border-right:1px solid var(--nb-line-2);border-bottom:1px solid var(--nb-line-2);background:#fff}
.resource-item img{width:100%;height:150px;object-fit:cover;border-radius:0}
.resource-item h3{font-size:24px;letter-spacing:-.05em;margin:0 0 8px;color:var(--nb-ink)}

/* =========================================================
   [08] 푸터 정리
========================================================= */
.site-footer,
.footer{
  background:#0f172a;
  color:rgba(255,255,255,.68);
  border-top:0;
}

/* =========================================================
   [09] MOBILE 정리
   - 모바일 header/nav는 /assets/css/mobile.css에서만 관리합니다.
   - 이 파일에서는 home/card 반응형만 기본 CSS에 의존합니다.
========================================================= */

/* =========================================================
   [10] 납품·수리 사례 카드 확대 재설계
   원인:
   - 기존 home-case-flow-card / case-card가 낮은 높이와 좁은 썸네일로 구성되어
     실제 현장 사례의 시각적 임팩트가 약했음.
   - 모바일형 가로 카드 느낌이 PC 화면에도 남아 사례 섹션이 작고 답답해 보였음.
   수정:
   - PC에서는 사례 카드를 크게 보이도록 2열/대형 카드 중심으로 재정렬
   - 홈 메인 흐름 카드도 높이와 이미지 면적을 키워 포트폴리오형 섹션으로 변경
   - 라운드 없이 직선형 브랜드 톤 유지
========================================================= */
.home-case-flow{
  padding:clamp(84px,7vw,132px) 0;
  background:#f4f7fb;
  overflow:hidden;
}

body.home-page .home-case-flow-head.container,
.home-case-flow-head.container{
  width:min(92vw,1440px);
  max-width:none;
  margin:0 auto 34px;
  padding:0 0 24px;
  border-bottom:2px solid #d8e3ef;
}

.home-case-flow-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
}

.home-case-flow-head span{
  display:block;
  color:#1d8cff;
  font-size:13px;
  line-height:1;
  font-weight:950;
  letter-spacing:.18em;
  margin-bottom:12px;
}

.home-case-flow-head h2{
  margin:0;
  color:#0f172a;
  font-size:clamp(44px,4.2vw,72px);
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.075em;
}

.home-case-flow-head p{
  margin:14px 0 0;
  color:#64748b;
  font-size:17px;
  line-height:1.7;
}

.home-case-flow-head a{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 22px;
  border:1px solid #9ecfff;
  background:#fff;
  color:#126ee2;
  font-size:14px;
  font-weight:900;
  letter-spacing:-.03em;
  border-radius:0;
}

.home-case-flow-head a:hover{
  background:#126ee2;
  border-color:#126ee2;
  color:#fff;
}

.home-case-marquee{
  width:min(92vw,1440px);
  max-width:none;
  margin:0 auto;
  overflow:visible;
}

.home-case-marquee-track{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
  width:100%;
  animation:none;
  transform:none;
}

.home-case-flow-card{
  min-width:0;
  width:100%;
  min-height:440px;
  display:grid;
  grid-template-rows:260px 1fr;
  background:#fff;
  border:1px solid #d8e3ef;
  border-radius:0;
  box-shadow:none;
  overflow:hidden;
  transition:transform .22s ease,border-color .22s ease;
}

.home-case-flow-card:hover{
  transform:translateY(-6px);
  border-color:#8cc8ff;
}

.home-case-flow-thumb{
  width:100%;
  height:260px;
  overflow:hidden;
  background:#eaf2fb;
  border-radius:0;
}

.home-case-flow-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:0;
  transition:transform .35s ease,filter .35s ease;
}

.home-case-flow-card:hover .home-case-flow-thumb img{
  transform:scale(1.045);
}

.home-case-flow-body{
  padding:26px 28px 30px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:14px;
}

.home-case-flow-meta{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0;
}

.home-case-flow-meta b{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:0 10px;
  background:#e8f4ff;
  color:#126ee2;
  font-size:12px;
  font-weight:950;
  letter-spacing:-.02em;
  border-radius:0;
}

.home-case-flow-meta em{
  color:#64748b;
  font-size:13px;
  font-style:normal;
  font-weight:800;
}

.home-case-flow-body strong{
  display:block;
  color:#0f172a;
  font-size:clamp(22px,1.45vw,28px);
  line-height:1.32;
  font-weight:950;
  letter-spacing:-.065em;
}

/* 납품·수리 사례 페이지 카드 확대 */
.case-grid,
.cases-grid,
body[data-sidebar-type="cases"] .case-grid,
.page-cases .case-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:34px;
}

.case-card,
.page-cases .case-card{
  min-height:520px;
  border:1px solid #d8e3ef;
  border-radius:0;
  background:#fff;
  box-shadow:none;
  overflow:hidden;
  transition:transform .22s ease,border-color .22s ease;
}

.case-card:hover,
.page-cases .case-card:hover{
  transform:translateY(-6px);
  border-color:#8cc8ff;
  box-shadow:none;
}

.case-thumb,
.case-card-thumb{
  width:100%;
  height:330px;
  aspect-ratio:auto;
  border-radius:0;
  background:#eaf2fb;
  overflow:hidden;
}

.case-thumb img,
.case-card-thumb img,
.case-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:0;
}

.case-body,
.case-card-body{
  padding:28px 30px 34px;
}

.case-meta,
.case-card-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:16px;
}

.case-meta span,
.case-card-meta span,
.case-category,
.case-date{
  border-radius:0;
  font-size:12px;
  font-weight:900;
}

.case-body h3,
.case-card h3,
.page-cases .case-card h3{
  margin:0 0 12px;
  color:#0f172a;
  font-size:clamp(24px,1.55vw,30px);
  line-height:1.3;
  font-weight:950;
  letter-spacing:-.065em;
}

.case-body p,
.case-card p,
.page-cases .case-card p{
  color:#526275;
  font-size:16px;
  line-height:1.75;
}

@media (max-width:1024px){
  .home-case-marquee-track{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .home-case-flow-card{
    min-height:410px;
    grid-template-rows:240px 1fr;
  }
  .home-case-flow-thumb{height:240px}
  .case-grid,
  .cases-grid,
  body[data-sidebar-type="cases"] .case-grid,
  .page-cases .case-grid{
    grid-template-columns:1fr;
    gap:26px;
  }
}

@media (max-width:768px){
  .home-case-flow{
    padding:58px 0 72px;
  }
  .home-case-flow-head{
    display:block;
  }
  .home-case-flow-head h2{
    font-size:38px;
  }
  .home-case-flow-head a{
    margin-top:20px;
    width:100%;
  }
  .home-case-marquee-track{
    grid-template-columns:1fr;
    gap:20px;
  }
  .home-case-flow-card{
    min-height:0;
    grid-template-rows:220px auto;
  }
  .home-case-flow-thumb{height:220px}
  .home-case-flow-body{padding:22px 20px 24px}
  .home-case-flow-body strong{font-size:22px}
  .case-card,
  .page-cases .case-card{
    min-height:0;
  }
  .case-thumb,
  .case-card-thumb{
    height:230px;
  }
  .case-body,
  .case-card-body{
    padding:22px 20px 26px;
  }
  .case-body h3,
  .case-card h3,
  .page-cases .case-card h3{
    font-size:22px;
  }
}


/* =========================================================
   [2026-05-11] FINAL BRAND LAYOUT PATCH
   목적:
   - 실제 로드되는 최종 CSS로 브랜드형 폭/여백/인트로카드/푸터 흐름 정리
   - breadcrumb 제거
   - 고객센터 Hero 잘림 완화
   - 설비 하위메뉴 카테고리 화면 표시 폭 안정화
========================================================= */

:root{
  --nb-container:var(--nb-page-width);
  --nb-section-container:var(--nb-page-width);
  --nb-card-line:#d7e5f4;
  --nb-page-bg:#f3f8fe;
}

html,body{
  min-height:100%;
}

body{
  background:var(--nb-page-bg);
}

body.sub-page{
  display:flex;
  flex-direction:column;
}

body.sub-page .site-header,
body.sub-page .page-hero,
body.sub-page .page-section-bar,
body.sub-page .mobile-submenu,
body.sub-page .mobile-product-search,
body.sub-page .breadcrumbs,
body.sub-page .site-footer,
body.sub-page .footer{
  flex:0 0 auto;
}

.container{
  width:var(--nb-container);
  max-width:none;
  margin-left:auto;
  margin-right:auto;
}

.breadcrumbs,
.breadcrumb-wrap,
.sub-breadcrumb,
.page-breadcrumb{
  display:none !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}

.main-layout,
.main-layout.no-sidebar,
.main-layout.has-sidebar{
  width:var(--nb-section-container);
  max-width:none;
  display:block;
  padding-top:clamp(34px,3.2vw,58px);
  padding-bottom:clamp(48px,4.2vw,80px);
  margin-left:auto;
  margin-right:auto;
  background:transparent;
}

.layout-content{
  width:100%;
  max-width:none;
  margin:0;
}

/* Hero: 오른쪽 문구가 들어간 이미지가 잘려 보여도 본문 텍스트와 충돌하지 않게 높이/오버레이 정리 */
.page-hero.page-hero--banner{
  min-height:clamp(300px,31vw,480px);
}

.page-hero.page-hero--banner::before{
  background-position:center center;
}

body[data-sidebar-type="customer"] .page-hero.page-hero--banner::before{
  background-position:center center;
}

.page-hero.page-hero--banner::after{
  background:linear-gradient(
    90deg,
    rgba(7,16,30,.74) 0%,
    rgba(7,16,30,.48) 34%,
    rgba(7,16,30,.18) 60%,
    rgba(7,16,30,.08) 100%
  );
}

.page-hero.page-hero--banner .page-hero-inner{
  padding-top:clamp(70px,6vw,96px);
  padding-bottom:clamp(62px,5vw,88px);
}

.page-hero.page-hero--banner h1{
  max-width:780px;
}

.page-hero.page-hero--banner p{
  max-width:820px;
}

/* 상단 하위메뉴: 게시판형 두꺼운 느낌 축소 */
.page-section-bar{
  background:#fff;
  border-top:1px solid #dce8f4;
  border-bottom:1px solid #dce8f4;
}

.page-section-bar .container{
  width:var(--nb-section-container);
}

.page-section-bar__link{
  min-height:54px;
  padding:0 22px;
  font-size:14px;
  font-weight:850;
  border-right:1px solid #e3edf7;
}

.page-section-bar__link.is-active::after,
.page-section-bar__link:hover::after{
  left:22px;
  right:22px;
  height:3px;
}

/* 인트로카드: 삭제하지 않고 슬림 브랜드형으로 유지 */
.content-card,
.page-intro-card,
.contact-panel,
.resource-card,
.about-card,
.notice-card,
.as-card,
.product-control-panel,
.product-view-panel,
.product-list-head{
  border-radius:0;
  box-shadow:none;
}

.page-intro-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,36%);
  align-items:center;
  gap:clamp(28px,3vw,56px);
  width:100%;
  min-height:0;
  padding:clamp(28px,3vw,46px);
  margin:0 0 30px;
  background:#fff;
  border:1px solid var(--nb-card-line);
  border-left:4px solid #1688e8;
  overflow:hidden;
}

.page-intro-text{
  display:block;
  min-height:0;
  padding:0;
}

.page-intro-card .badge,
.page-intro-text .badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 12px;
  margin:0 0 16px;
  background:#1688e8;
  color:#fff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.1em;
}

.page-intro-text h2,
.page-intro-card h2{
  margin:0 0 18px;
  font-size:clamp(32px,2.5vw,46px);
  line-height:1.16;
  letter-spacing:-.06em;
  color:#10243e;
  font-weight:950;
}

.page-intro-text p,
.page-intro-card p{
  max-width:820px;
  margin:0;
  font-size:clamp(15px,1vw,17px);
  line-height:1.85;
  color:#566b82;
}

.page-intro-image{
  width:100%;
  max-width:none;
  margin:0;
  overflow:hidden;
  border:1px solid #dbe8f5;
  background:#eef5fc;
}

.page-intro-image img{
  display:block;
  width:100%;
  height:clamp(170px,13vw,230px);
  max-height:none;
  object-fit:cover;
  object-position:center;
}

/* 일반 본문 카드: 전체 폭을 더 자연스럽게 사용 */
.content-card{
  width:100%;
  padding:clamp(30px,3vw,52px);
  margin-bottom:32px;
  background:#fff;
  border:1px solid var(--nb-card-line);
}

.content-card h2{
  font-size:clamp(28px,2.4vw,42px);
  line-height:1.18;
  margin-bottom:18px;
}

.content-card p{
  font-size:16px;
  line-height:1.85;
}

.section-card-stack{
  width:100%;
  margin:0;
}

/* 회사소개: 너무 작은 중앙 박스처럼 보이는 문제 완화 */
.about-card,
.contact-panel,
.resource-card{
  max-width:none;
}

.feature-grid,
.contact-info-grid{
  gap:14px;
}

/* 제품 홈/카테고리: 설비 하위메뉴 클릭 시 화면이 빈 것처럼 보이지 않도록 카드 폭/그리드 정리 */
.product-home-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
  width:100%;
  margin:0;
}

.product-home-card{
  min-height:220px;
  border:1px solid #d7e5f4;
  background:#fff;
}

.product-control-panel,
.product-view-panel,
.product-list-head{
  width:100%;
  border:1px solid #d7e5f4;
  background:#fff;
}

.product-grid{
  width:100%;
}

.product-grid.view-many{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px;
}

.product-grid.view-large{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:26px;
}

.empty-box{
  grid-column:1/-1;
}

/* 납품·수리 사례: 폭 확장 + 위쪽 필터 박스 정리 */
.case-filter-bar,
.case-category-tabs,
.case-tab-panel{
  width:100%;
}

.case-grid,
.cases-grid,
body[data-sidebar-type="cases"] .case-grid,
.page-cases .case-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:26px;
}

.case-card,
.page-cases .case-card{
  min-height:0;
}

.case-thumb,
.case-card-thumb{
  height:260px;
}

/* 고객센터 계열: 짧은 페이지에서 푸터가 붕 뜨는 느낌 완화 */
body.page-contact .main-layout,
body.page-as .main-layout,
body.page-notice .main-layout,
body.page-tech .main-layout{
  padding-bottom:56px;
}

.contact-panel,
.resource-card{
  margin-bottom:28px;
}

.contact-form .form-row{
  margin-bottom:18px;
}

.submit-panel{
  margin-top:22px;
}

.site-footer,
.footer{
  margin-top:auto;
  background:#0f172a;
  color:rgba(255,255,255,.72);
  border-top:0;
}

@media (max-width:1200px){
  .product-grid.view-many,
  .case-grid,
  .cases-grid,
  body[data-sidebar-type="cases"] .case-grid,
  .page-cases .case-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:900px){
  :root{
    --nb-container:min(92vw,100%);
    --nb-section-container:min(92vw,100%);
  }

  .main-layout,
  .main-layout.no-sidebar,
  .main-layout.has-sidebar{
    padding-top:26px;
    padding-bottom:44px;
  }

  .page-hero.page-hero--banner{
    min-height:300px;
  }

  .page-section-bar{
    display:none;
  }

  .page-intro-card{
    grid-template-columns:1fr;
    gap:20px;
    padding:24px 20px;
    margin-bottom:22px;
  }

  .page-intro-image img{
    height:auto;
    max-height:220px;
    object-fit:contain;
  }

  .content-card{
    padding:24px 20px;
  }

  .product-home-grid,
  .product-grid.view-many,
  .product-grid.view-large,
  .case-grid,
  .cases-grid,
  body[data-sidebar-type="cases"] .case-grid,
  .page-cases .case-grid{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   [2026-05-11] HERO TEXT ALIGN + SOFT SLIDE-IN PATCH
   원인:
   - .page-hero--banner .page-hero-inner가 width:100%로 지정되어
     공통 .container 폭 기준을 무시하고 화면 좌측에 붙어 보였음.
   수정:
   - Hero 텍스트 기준선을 헤더 로고와 같은 공통 컨테이너 폭으로 복원
   - 제목/설명은 왼쪽에서 과하지 않게 들어오는 fade 애니메이션 적용
========================================================= */
.page-hero.page-hero--banner .page-hero-inner{
  width:var(--nb-container);
  max-width:none;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}

.page-hero.page-hero--banner .eyebrow,
.page-hero.page-hero--banner h1,
.page-hero.page-hero--banner p{
  opacity:0;
  transform:translateX(-28px);
  animation:nbHeroTextSlideIn .92s cubic-bezier(.22,.72,.18,1) forwards;
  will-change:opacity, transform;
}

.page-hero.page-hero--banner .eyebrow{
  animation-delay:.08s;
}

.page-hero.page-hero--banner h1{
  animation-delay:.20s;
}

.page-hero.page-hero--banner p{
  transform:translateX(-22px);
  animation-delay:.34s;
}

@keyframes nbHeroTextSlideIn{
  from{
    opacity:0;
    transform:translateX(-28px);
  }
  to{
    opacity:1;
    transform:translateX(0);
  }
}

@media (max-width:900px){
  .page-hero.page-hero--banner .page-hero-inner{
    width:var(--nb-container);
  }

  .page-hero.page-hero--banner .eyebrow,
  .page-hero.page-hero--banner h1,
  .page-hero.page-hero--banner p{
    transform:translateX(-16px);
  }
}

@media (prefers-reduced-motion:reduce){
  .page-hero.page-hero--banner .eyebrow,
  .page-hero.page-hero--banner h1,
  .page-hero.page-hero--banner p{
    opacity:1;
    transform:none;
    animation:none;
    will-change:auto;
  }
}

/* =========================================================
   [2026-05-11] HERO CONTENT STABLE ANCHOR PATCH
   원인:
   - 설비 소개(products) 페이지 진입 시 다른 서브페이지와 비교해
     Hero 텍스트 기준선이 미세하게 흔들려 보였음.
   - 페이지별 스크롤바 유무/배너 그룹 차이에 따라 중앙 정렬 기준이
     달라 보일 수 있어, Hero 텍스트 기준선을 별도 고정 변수로 통일.
   수정:
   - 모든 서브페이지 Hero 텍스트를 동일한 컨테이너 폭과 동일한 좌측 기준선으로 고정
   - 설비 소개만 별도 보정값이 적용되지 않도록 data-hero-key별 차이를 제거
   - 페이지 전환 시 스크롤바 유무로 인한 가로 흔들림 방지
========================================================= */
html{
  scrollbar-gutter:stable;
}

:root{
  --nb-hero-anchor-width:var(--nb-container);
}

.page-hero.page-hero--banner .page-hero-inner,
.page-hero.page-hero--banner[data-hero-key="products"] .page-hero-inner,
body[data-sidebar-type="products"] .page-hero.page-hero--banner .page-hero-inner{
  width:var(--nb-hero-anchor-width);
  max-width:none;
  margin-left:auto;
  margin-right:auto;
  padding-left:0;
  padding-right:0;
  box-sizing:border-box;
}

@media (max-width:900px){
  .page-hero.page-hero--banner .page-hero-inner,
  .page-hero.page-hero--banner[data-hero-key="products"] .page-hero-inner,
  body[data-sidebar-type="products"] .page-hero.page-hero--banner .page-hero-inner{
    width:var(--nb-container);
    padding-left:0;
    padding-right:0;
  }
}

@media (max-width:768px){
  .page-hero.page-hero--banner .page-hero-inner,
  .page-hero.page-hero--banner[data-hero-key="products"] .page-hero-inner,
  body[data-sidebar-type="products"] .page-hero.page-hero--banner .page-hero-inner{
    width:100%;
    padding-left:18px;
    padding-right:18px;
  }
}


/* =========================================================
   [2026-05-11] INDUSTRIAL CLEANUP V3
   목적:
   - 주황 계열 hover/강조색 제거
   - Hero 애니메이션은 은은한 fade/slide 기준으로 통일
   - 인트로 카드 제거 후 페이지 본문을 직선형 산업 UI로 정리
   - 회사소개/고객센터 하위메뉴 anchor 랜딩 위치 보정
   - 메인 납품·수리 사례 / 하단 CTA 가독성 개선
   - 납품·수리 사례 페이지: PC에서 섹션별 10개 × 2줄 표시 기준
========================================================= */

:root{
  --nb-industrial-blue:#126ee2;
  --nb-industrial-blue-dark:#0b4f9f;
  --nb-industrial-navy:#0f172a;
  --nb-industrial-line:#d7e1ee;
  --nb-industrial-panel:#f4f8fc;
}

/* [01] 주황색 잔재 제거: hover/active 계열을 파랑·남색으로 통일 */
.nav-link::after,
.page-section-bar__link::after,
.page-section-bar__link:hover::after,
.page-section-bar__link.is-active::after{
  background:var(--nb-industrial-blue);
}

.dropdown a:hover,
.dropdown a:focus,
.header-contact-btn:hover,
.header-contact-btn:focus,
.hero-quick-btn:hover,
.hero-quick-btn:focus,
.case-list-link:hover,
.case-section-more-link:hover,
.case-section-all-link:hover,
.case-more-button:hover,
.detail-btn:hover,
.product-action-btn--primary:hover,
.product-inquiry-card-btn:hover{
  background:var(--nb-industrial-blue);
  border-color:var(--nb-industrial-blue);
  color:#fff;
}

/* [02] 인트로 카드 제거: Hero + 필터/본문으로 바로 진입 */
.page-intro-card,
.intro-card,
.page-intro-flex,
body.sub-page .page-intro-card{
  display:none;
}

/* [03] 자연스러운 랜딩 위치 보정 */
html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--nb-header-h,76px) + 24px);
}

[id],
.case-type-section,
.content-card,
.contact-panel,
.resource-card,
.company-section,
.about-section,
.notice-section,
.as-section{
  scroll-margin-top:calc(var(--nb-header-h,76px) + 26px);
}

/* [04] Hero 애니메이션: 과한 확대 없이 천천히 fade 기반 */
.home-hero::after,
.page-hero.page-hero--banner::after{
  animation:nbHeroDimFade 1.45s ease both;
}

.home-hero .hero-video,
.page-hero.page-hero--banner::before{
  animation:nbHeroMediaFade 1.8s ease both;
}

.home-hero-text,
.page-hero.page-hero--banner .page-hero-inner{
  animation:nbHeroBlockFadeUp 1.05s cubic-bezier(.22,.72,.18,1) both;
}

@keyframes nbHeroDimFade{
  from{opacity:.56;}
  to{opacity:1;}
}

@keyframes nbHeroMediaFade{
  from{opacity:.72;filter:saturate(.86) contrast(.96);}
  to{opacity:1;filter:saturate(1) contrast(1);}
}

@keyframes nbHeroBlockFadeUp{
  from{opacity:0;transform:translateY(22px);}
  to{opacity:1;transform:translateY(0);}
}

/* [05] 이미지 통일: 제품/사례/메인카드 비율과 crop 기준 통합 */
.product-thumb,
.case-thumb,
.case-card-thumb,
.home-case-flow-thumb,
.quick-card-image{
  background:#eef4fa;
  overflow:hidden;
  border-radius:0;
}

.product-thumb img,
.case-thumb img,
.case-card-thumb img,
.home-case-flow-thumb img,
.quick-card-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:0;
  filter:saturate(.96) contrast(1.02);
}

.product-thumb img{
  object-fit:contain;
  padding:10px;
  background:#fff;
}

/* [06] 페이지 본문: 박스 중첩 줄이고 직선형 산업 UI로 정리 */
.main-layout.no-sidebar{
  padding-top:44px;
}

.content-card,
.product-card,
.case-card,
.resource-card,
.contact-panel,
.empty-box,
.filter-panel,
.product-filter-panel,
.product-view-panel,
.case-mobile-view-panel,
.case-anchor-tabs{
  border-radius:0;
  box-shadow:none;
  border-color:var(--nb-industrial-line);
}

.content-card,
.contact-panel,
.resource-card{
  background:#fff;
  border-top:3px solid var(--nb-industrial-blue);
}

.product-card:hover,
.case-card:hover,
.home-case-flow-card:hover,
.quick-card:hover{
  transform:translateY(-2px);
  border-color:#8dbdf0;
  box-shadow:0 14px 32px rgba(15,35,67,.10);
}

/* [07] 메인 납품·수리 사례 디자인 재정리 */
.home-case-flow{
  background:linear-gradient(180deg,#eef5fc 0%,#f8fbff 100%);
  border-top:1px solid #d7e5f2;
  border-bottom:1px solid #d7e5f2;
}

.home-case-flow-head{
  align-items:end;
}

.home-case-flow-head span{
  color:var(--nb-industrial-blue);
  letter-spacing:.14em;
}

.home-case-flow-head a{
  border-radius:0;
  color:#0f3f72;
  border-color:#9fc8ef;
}

.home-case-flow-card{
  border-radius:0;
  border:1px solid var(--nb-industrial-line);
  box-shadow:none;
}

.home-case-flow-thumb{
  height:260px;
}

.home-case-flow-body strong{
  min-height:58px;
}

/* [08] 납품·수리 사례 페이지: 카드 규격 정리
   - 기존 10열 초소형 카드 규칙 제거
   - PC는 4열, 중간 화면은 responsive.css에서 3열/1열로 정리
   - 설명과 버튼은 유지해 사례 카드가 너무 납작하게 보이지 않도록 조정 */
.case-overview-mode .case-paged-grid,
.case-section-mode .case-paged-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
  align-items:stretch;
}

.case-overview-mode .case-card,
.case-section-mode .case-card{
  min-width:0;
  border-radius:0;
  min-height:100%;
  background:#fff;
}

.case-overview-mode .case-thumb,
.case-section-mode .case-thumb{
  height:auto;
  aspect-ratio:4/3;
}

.case-overview-mode .case-body,
.case-section-mode .case-body{
  padding:20px 20px 22px;
}

.case-overview-mode .case-meta,
.case-section-mode .case-meta{
  gap:6px;
  margin-bottom:12px;
}

.case-overview-mode .case-meta span,
.case-section-mode .case-meta span{
  min-height:24px;
  padding:0 8px;
  font-size:11px;
}

.case-overview-mode .case-body h3,
.case-section-mode .case-body h3{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:52px;
  margin:0 0 10px;
  font-size:18px;
  line-height:1.45;
  letter-spacing:-.045em;
}

.case-overview-mode .case-body p,
.case-section-mode .case-body p{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin:0 0 16px;
  font-size:14px;
  line-height:1.65;
}

.case-overview-mode .case-detail-btn,
.case-section-mode .case-detail-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  min-height:34px;
  margin-top:auto;
  padding:0 12px;
  border:1px solid #d7e5f5;
  color:#174a7c;
  font-size:12px;
  font-weight:750;
}

.case-type-section{
  margin-bottom:58px;
}

/* [09] 메인 하단 CTA: 컬러 블록으로 가독성 강화 */
.home-difference-section{
  max-width:none;
  width:100%;
  padding:82px max(24px,calc((100vw - 1320px)/2)) 92px;
  margin:0;
  background:linear-gradient(135deg,#0f172a 0%,#123f73 58%,#126ee2 100%);
}

.home-difference-card{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(7,13,23,.26);
  color:#fff;
}

.home-pill{
  border-radius:0;
  background:rgba(255,255,255,.12);
  color:#cfe8ff;
}

.home-process-list{
  background:rgba(255,255,255,.18);
}

.home-process-item{
  background:rgba(255,255,255,.08);
}

.home-process-item b{
  color:#9fd0ff;
}

/* [10] 반응형: 모바일에서는 10열 강제 해제 */
@media (max-width:1200px){
  .case-overview-mode .case-paged-grid,
  .case-section-mode .case-paged-grid{
    grid-template-columns:repeat(5,minmax(0,1fr));
  }
}

@media (max-width:900px){
  .main-layout.no-sidebar{padding-top:28px;}
  .home-case-flow-thumb{height:220px;}
  .case-overview-mode .case-paged-grid,
  .case-section-mode .case-paged-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }
  .case-overview-mode .case-thumb,
  .case-section-mode .case-thumb{
    height:180px;
  }
  .case-overview-mode .case-body,
  .case-section-mode .case-body{
    padding:16px 14px 18px;
  }
  .case-overview-mode .case-body h3,
  .case-section-mode .case-body h3{
    font-size:16px;
    min-height:auto;
  }
}

@media (max-width:520px){
  .case-overview-mode .case-paged-grid,
  .case-section-mode .case-paged-grid{
    grid-template-columns:1fr;
  }
  .case-overview-mode .case-thumb,
  .case-section-mode .case-thumb{
    height:210px;
  }
}

@media (prefers-reduced-motion:reduce){
  .home-hero::after,
  .page-hero.page-hero--banner::after,
  .home-hero .hero-video,
  .page-hero.page-hero--banner::before,
  .home-hero-text,
  .page-hero.page-hero--banner .page-hero-inner{
    animation:none;
  }
}


/* =========================================================
   DESIGN UNIFY PATCH
========================================================= */

.content-card,
.case-section,
.contact-panel,
.about-section,
.products-section {
    border-radius: 0;
    box-shadow: none;
}

.case-sections {
    gap: 80px;
}

.case-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
}

.case-card {
    transition: transform .25s ease, box-shadow .25s ease;
}

.case-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 14px 30px rgba(0,0,0,.08);
}

.case-thumb img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.customer-quick-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
    margin:30px 0 40px;
}

.customer-quick-card{
    border:1px solid #dbe4ef;
    background:#fff;
    padding:26px 22px;
    transition:.25s ease;
}

.customer-quick-card:hover{
    border-color:#1677ff;
    transform:translateY(-4px);
}

.customer-quick-card strong{
    display:block;
    font-size:20px;
    margin-bottom:10px;
    color:#0f2747;
}

.customer-quick-card span{
    color:#5d6b7a;
    font-size:14px;
}

.contact-form input,
.contact-form textarea,
.contact-form select{
    min-height:56px;
    border-radius:0;
    border:1px solid #d5dfeb;
    font-size:16px;
}

.contact-form textarea{
    min-height:220px;
}

.contact-submit-button{
    min-height:60px;
    font-size:18px;
    font-weight:700;
}

@media (max-width: 1280px){
    .case-grid{
        grid-template-columns:repeat(4,minmax(0,1fr));
    }
}

@media (max-width: 900px){
    .case-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .customer-quick-grid{
        grid-template-columns:1fr 1fr;
    }
}

@media (max-width: 640px){
    .case-grid{
        grid-template-columns:1fr;
    }

    .customer-quick-grid{
        grid-template-columns:1fr;
    }
}


/* =========================================================
   MOBILE / CASE DUPLICATE CLEANUP PATCH V2
   - 예전 모바일 하위메뉴 카드 제거
   - 납품·수리 사례 모바일 보기 방식 패널 제거
   - 상단 page-quick-menu 기준으로 UX 단일화
========================================================= */
.mobile-submenu,
.mobile-submenu-wrap,
.mobile-submenu-list,
.mobile-submenu-grid,
.mobile-submenu-card,
.mobile-sub-nav,
.mobile-category-card,
.case-mobile-view-panel {
    display: none !important;
}


/* =========================================================
   CASE PAGE INTRO / TYPOGRAPHY / SPACING PATCH
   - 전체보기 상위 설명 섹션 추가 스타일
   - 하위메뉴 글자 크기 축소
   - 납품·수리 사례 본문 좌측 붙음 보정
========================================================= */

/* 하위메뉴 글씨가 너무 커 보이던 문제 보정 */
.page-section-bar__current {
    font-size: 14px;
    font-weight: 800;
}

.page-section-bar__link {
    font-size: 14px;
    font-weight: 650;
    padding: 0 22px;
    letter-spacing: -0.02em;
}

.page-section-bar__link.is-active {
    font-weight: 750;
}

/* 납품·수리 사례 페이지 상위 intro */
.case-overview-intro {
    background: #fff;
    border: 1px solid #dbe7f3;
    padding: clamp(34px, 3.2vw, 58px);
    margin: 0 0 clamp(34px, 3vw, 54px);
}

.case-overview-eyebrow {
    display: inline-block;
    margin-bottom: 14px;
    color: #0b78d0;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .18em;
}

.case-overview-intro h2 {
    margin: 0 0 18px;
    color: #0f2747;
    font-size: clamp(32px, 2.5vw, 46px);
    line-height: 1.15;
    letter-spacing: -0.06em;
}

.case-overview-intro p {
    max-width: 860px;
    margin: 0;
    color: #536273;
    font-size: 16px;
    line-height: 1.85;
}

/* 본문이 왼쪽에 딱 붙어 보이는 문제 보정 */
.case-sections {
    display: flex;
    flex-direction: column;
    gap: clamp(42px, 4vw, 72px);
}

.case-type-section {
    background: #fff;
    border: 1px solid #dbe7f3;
    padding: clamp(28px, 2.4vw, 44px);
}

.case-list-head {
    padding: 0;
    margin-bottom: clamp(24px, 2vw, 36px);
}

.case-list-title {
    margin: 0 0 12px;
    font-size: clamp(26px, 1.8vw, 34px);
    line-height: 1.2;
    letter-spacing: -0.055em;
}

.case-list-head p {
    margin: 0;
    font-size: 15px;
    line-height: 1.75;
    color: #66778a;
}

/* 중복 버튼 제거 후 남는 공간 보정 */
.case-section-head {
    align-items: flex-start;
}

@media (max-width: 768px) {
    .page-section-bar__current,
    .page-section-bar__link {
        font-size: 13px;
    }

    .case-overview-intro,
    .case-type-section {
        padding: 24px 18px;
    }

    .case-overview-intro h2 {
        font-size: 30px;
    }

    .case-list-title {
        font-size: 26px;
    }
}



/* =========================================================
   SOFT BRAND CLEANUP PATCH
   - 선 박스형 반복감 완화
   - 섹션 리듬 정리
   - 고객센터/회사소개/사례 페이지 공통 톤 정리
   - 기존 구조 유지, 임시 HTML 추가 없음
========================================================= */

:root{
    --nb-soft-bg:#f4f8fc;
    --nb-soft-line:#e3edf7;
    --nb-soft-line-strong:#cddceb;
    --nb-soft-card:#ffffff;
    --nb-soft-muted:#657789;
}

/* 공통: 너무 강한 파란 박스 선을 부드럽게 */
.content-card,
.case-type-section,
.case-overview-intro,
.contact-panel,
.contact-box,
.notice-box,
.resource-item,
.about-section,
.company-section,
.product-intro-card,
.page-intro-card {
    border-color: var(--nb-soft-line) !important;
}

/* 공통 섹션: 문서/관리자 페이지 느낌 완화 */
.content-card,
.case-type-section,
.case-overview-intro,
.contact-panel {
    background: linear-gradient(180deg,#fff 0%,#fbfdff 100%);
}

/* 큰 섹션끼리 구분은 유지하되 테두리 힘 줄임 */
.content-card {
    padding: clamp(42px, 4.2vw, 76px);
    margin-bottom: clamp(34px, 3.2vw, 58px);
}

/* 섹션 제목 체계 정리 */
.content-card h2,
.case-overview-intro h2,
.case-list-title {
    color:#0d2746;
    font-weight:850;
}

.content-card p,
.case-overview-intro p,
.case-list-head p {
    color:var(--nb-soft-muted);
}

/* 회사소개: 같은 박스 반복감 완화 */
.about-section,
.company-section {
    box-shadow:none;
}

.about-section + .about-section,
.company-section + .company-section {
    margin-top: clamp(34px, 3vw, 56px);
}

/* 기준 카드 / 정보 카드: 선 박스 과다 느낌 완화 */
.about-feature-grid .about-card,
.feature-grid .feature-card,
.info-card,
.contact-card,
.customer-quick-card,
.quick-card {
    border-color: var(--nb-soft-line);
    background: rgba(255,255,255,.78);
}

/* hover는 과하게 튀지 않고 살짝만 */
.about-feature-grid .about-card:hover,
.feature-grid .feature-card:hover,
.info-card:hover,
.contact-card:hover,
.customer-quick-card:hover,
.quick-card:hover {
    border-color: var(--nb-soft-line-strong);
    transform: translateY(-2px);
}

/* 어두운 프로세스 섹션은 브랜드 리듬으로 유지하되 내부 박스 색 완화 */
.process-section,
.work-process,
.company-process,
.about-process {
    border:none;
}

.process-section .process-card,
.work-process .process-card,
.company-process .process-card,
.about-process .process-card {
    background: rgba(255,255,255,.10);
    border-color: rgba(255,255,255,.12);
}

/* 고객센터: 폼이 관리자 페이지처럼 보이는 느낌 완화 */
.customer-quick-grid {
    margin: 30px 0 34px;
}

.customer-quick-card {
    min-height: 96px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    border-color: var(--nb-soft-line);
    background:#fff;
}

.contact-form,
.contact-form-wrap,
.contact-form-box {
    background:#f8fbff;
    border-color:var(--nb-soft-line);
}

.contact-form input,
.contact-form textarea,
.contact-form select {
    background:#fff;
    border-color:#d8e4f0;
}

.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus {
    outline:none;
    border-color:#1e88e5;
    box-shadow:0 0 0 3px rgba(30,136,229,.08);
}

/* 고객센터 하단 연락처 카드도 선 느낌 약화 */
.contact-info-row > *,
.contact-info-card {
    border-color:var(--nb-soft-line);
    background:#fff;
}

/* 사례 페이지: 소개/섹션 박스가 너무 딱딱해 보이는 문제 완화 */
.case-overview-intro {
    padding: clamp(36px, 3.4vw, 62px);
    margin-bottom: clamp(32px, 3vw, 54px);
}

.case-type-section {
    padding: clamp(30px, 2.6vw, 48px);
    box-shadow: 0 18px 45px rgba(15,39,71,.035);
}

.case-list-head {
    border-bottom: 1px solid var(--nb-soft-line);
    padding-bottom: clamp(18px, 1.8vw, 28px);
}

/* 사례 카드: 카드 테두리와 이미지 무게 균형 */
.case-card {
    border-color: var(--nb-soft-line);
    background:#fff;
}

.case-card:hover {
    border-color: var(--nb-soft-line-strong);
    box-shadow: 0 14px 32px rgba(15,39,71,.07);
}

.case-body h3,
.case-card h3 {
    font-weight:750;
    letter-spacing:-.045em;
}

.case-meta span {
    font-weight:650;
}

/* 하위 메뉴: 글씨가 너무 커 보이는 문제 보정 */
.page-section-bar__inner {
    min-height: 62px;
}

.page-section-bar__home {
    width: 58px;
}

.page-section-bar__current {
    min-width: 168px;
    padding: 0 22px;
    font-size: 13px;
    font-weight: 750;
}

.page-section-bar__link {
    min-height: 62px;
    padding: 0 20px;
    font-size: 13px;
    font-weight: 620;
    letter-spacing: -0.025em;
}

.page-section-bar__link.is-active {
    font-weight: 750;
}

.page-section-bar__link.is-active::after,
.page-section-bar__link:hover::after {
    left: 20px;
    right: 20px;
    height: 3px;
}

/* 연혁: 테이블/문서 느낌 완화 */
.history-table,
.history-list {
    border-color:var(--nb-soft-line);
}

.history-table tr,
.history-item {
    border-color:var(--nb-soft-line);
}

/* 오시는 길: 선 박스 느낌 완화 */
.location-box,
.contact-point-box {
    border-color:var(--nb-soft-line);
    background:#fff;
}

/* 모바일에서는 여백만 압축하고 구조 유지 */
@media (max-width: 768px) {
    .content-card,
    .case-overview-intro,
    .case-type-section,
    .contact-panel {
        padding: 26px 18px;
    }

    .page-section-bar__inner {
        min-height: 56px;
    }

    .page-section-bar__current,
    .page-section-bar__link {
        min-height: 56px;
        font-size: 12px;
        padding: 0 14px;
    }
}



/* =========================================================
   CUSTOMER CENTER OVERVIEW PATCH
   - 고객센터 전체보기 상위 intro 추가
   - 전체보기에서 문의/A/S/공지/카탈로그 섹션 동시 노출
========================================================= */

.customer-overview-intro {
    background: linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
    border: 1px solid #e3edf7;
}

.customer-overview-eyebrow,
.customer-section-eyebrow {
    display:inline-block;
    margin-bottom:14px;
    color:#0b78d0;
    font-size:12px;
    font-weight:800;
    letter-spacing:.18em;
}

.customer-overview-intro h2,
.customer-overview-section h2 {
    margin:0 0 16px;
    color:#0d2746;
    font-size:clamp(32px,2.4vw,46px);
    line-height:1.14;
    letter-spacing:-.06em;
    font-weight:850;
}

.customer-overview-intro p,
.customer-section-desc {
    max-width:880px;
    margin:0;
    color:#607284;
    font-size:16px;
    line-height:1.85;
}

.customer-overview-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
    margin-top:32px;
}

.customer-overview-card,
.customer-section-grid > div {
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:98px;
    padding:22px 24px;
    border:1px solid #e3edf7;
    background:#fff;
    text-decoration:none;
    color:inherit;
}

.customer-overview-card strong,
.customer-section-grid strong {
    display:block;
    margin-bottom:10px;
    color:#0d2746;
    font-size:18px;
    font-weight:800;
    letter-spacing:-.04em;
}

.customer-overview-card span,
.customer-section-grid span {
    color:#66798b;
    font-size:14px;
    line-height:1.65;
}

.customer-overview-card:hover {
    border-color:#bcd2e8;
    transform:translateY(-2px);
}

.customer-overview-section {
    background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);
    border:1px solid #e3edf7;
}

.customer-section-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    margin-top:30px;
}

.customer-dark-info {
    margin-top:24px;
    padding:28px 32px;
    background:#0f1c2f;
    color:#fff;
    display:grid;
    gap:9px;
}

.customer-dark-info strong {
    font-size:18px;
    margin-bottom:4px;
}

.customer-dark-info span {
    color:rgba(255,255,255,.78);
    font-size:14px;
}

.customer-list-preview {
    margin-top:28px;
    border-top:1px solid #e3edf7;
}

.customer-list-preview div {
    display:grid;
    grid-template-columns:48px minmax(0,1fr) 120px;
    gap:18px;
    align-items:center;
    min-height:56px;
    border-bottom:1px solid #e3edf7;
    color:#34465a;
}

.customer-list-preview b {
    color:#0b78d0;
}

.customer-list-preview em {
    justify-self:end;
    font-style:normal;
    color:#7b8da0;
    font-size:13px;
}

.customer-catalog-card {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    gap:34px;
    align-items:center;
    margin-top:30px;
    padding:30px;
    border:1px solid #e3edf7;
    background:#fff;
}

.customer-catalog-thumb img {
    width:100%;
    height:auto;
    display:block;
    border:1px solid #e3edf7;
}

.customer-catalog-card span {
    color:#0b78d0;
    font-size:12px;
    font-weight:800;
    letter-spacing:.18em;
}

.customer-catalog-card strong {
    display:block;
    margin:10px 0 10px;
    color:#0d2746;
    font-size:28px;
    letter-spacing:-.055em;
}

.customer-catalog-card p {
    color:#66798b;
}

.customer-catalog-card a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    margin-top:12px;
    padding:0 18px;
    background:#0f1c2f;
    color:#fff;
    text-decoration:none;
    font-weight:750;
}

@media (max-width: 900px) {
    .customer-overview-grid,
    .customer-section-grid {
        grid-template-columns:1fr 1fr;
    }

    .customer-catalog-card {
        grid-template-columns:1fr;
    }
}

@media (max-width: 640px) {
    .customer-overview-grid,
    .customer-section-grid {
        grid-template-columns:1fr;
    }

    .customer-list-preview div {
        grid-template-columns:32px minmax(0,1fr);
    }

    .customer-list-preview em {
        grid-column:2;
        justify-self:start;
    }
}


/* =========================================================
   CATALOG PATH / CUSTOMER WIDTH PATCH
   - 카탈로그 대표 이미지 경로: /files/catalog/1.jpg
   - 카탈로그 PDF 경로: /files/catalog/catalog.pdf
   - 고객센터 전체보기 폭을 다른 서브페이지 흐름과 맞춤
========================================================= */

body.customer-page .layout-content,
body.contact-page .layout-content,
body.customer-page .section-card-stack,
body.contact-page .section-card-stack {
    width: 100%;
}

body.customer-page .contact-panel,
body.contact-page .contact-panel,
body.customer-page .customer-overview-intro,
body.contact-page .customer-overview-intro,
body.customer-page .customer-overview-section,
body.contact-page .customer-overview-section {
    max-width: none;
}

/* 폼만 너무 넓어지지 않도록 내부 폼 영역은 적정 폭 유지 */
body.customer-page .contact-form,
body.contact-page .contact-form {
    max-width: 1080px;
}



/* 고객센터 스택 자체가 단일 폼 폭으로 좁아지는 경우 보정 */
.customer-section-stack,
.customer-overview-intro,
.customer-overview-section {
    width: 100%;
}





/* =========================================================
   V8 BRAND INDUSTRIAL REBUILD
========================================================= */

/* =========================================================
   정리 완료: 과거 임시 전역 강제 스타일 제거
   - .container/.inner max-width !important 제거
   - section/h1/h2/p/button 전역 !important 제거
   - 폭 기준은 /assets/css/base.css 의 --nb-page-width 와
     /assets/css/site-structure.css 의 .main-layout/.container에서만 관리
========================================================= */

/* =========================================================
   2026-05-11 실제 반영 패치: 설비소개 필터/카드 브랜드 통일
   적용 위치: /templates/head.php에서 실제 로드되는 /assets/css/brand-rebuild.css
   목적: 남색 박스형 필터 제거, 1차/2차 필터 가독성 개선, 제품 카드 시각 통일
========================================================= */
body[data-sidebar-type="products"] .product-control-panel{
  margin:24px 0 34px;
  padding:26px clamp(18px,2.2vw,34px);
  background:#ffffff;
  border:1px solid #e1e8f0;
  border-radius:18px;
  box-shadow:0 10px 30px rgba(16,36,62,.045);
}

body[data-sidebar-type="products"] .product-control-bg,
body[data-sidebar-type="products"] .filter-group-bg{
  display:none;
}

body[data-sidebar-type="products"] .filter-mode-tabs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 22px;
  margin:0 0 24px;
  padding:0 0 16px;
  border-bottom:1px solid #e6edf5;
  background:transparent;
}

body[data-sidebar-type="products"] .filter-mode-tabs button{
  position:relative;
  min-height:auto;
  padding:8px 0 10px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#6b7888;
  font-size:16px;
  font-weight:750;
  letter-spacing:-.04em;
  box-shadow:none;
  transform:none;
}

body[data-sidebar-type="products"] .filter-mode-tabs button::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-17px;
  height:2px;
  background:transparent;
  transition:background .18s ease;
}

body[data-sidebar-type="products"] .filter-mode-tabs button:hover,
body[data-sidebar-type="products"] .filter-mode-tabs button.active{
  color:#174ea6;
  background:transparent;
  border:0;
  box-shadow:none;
  transform:none;
}

body[data-sidebar-type="products"] .filter-mode-tabs button.active::after{
  background:#2f6fec;
}

body[data-sidebar-type="products"] .filter-groups{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

body[data-sidebar-type="products"] .printer-filter-groups,
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-groups,
body[data-sidebar-type="products"] .product-control-panel[data-category="consumable"] .filter-groups{
  grid-template-columns:1fr;
}

body[data-sidebar-type="products"] .filter-group{
  position:relative;
  min-height:auto;
  padding:22px;
  background:#fbfcfe;
  border:1px solid #e6edf5;
  border-radius:16px;
  box-shadow:none;
  overflow:visible;
}

body[data-sidebar-type="products"] .filter-group--primary{
  background:#ffffff;
  border-color:#d9e6f5;
}

body[data-sidebar-type="products"] .filter-group h3{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px 10px;
  margin:0 0 16px;
  color:#182333;
  font-size:18px;
  line-height:1.35;
  font-weight:850;
  letter-spacing:-.05em;
}

body[data-sidebar-type="products"] .filter-group h3::before{
  display:none;
}

body[data-sidebar-type="products"] .filter-step-badge{
  display:inline-flex;
  align-items:center;
  min-height:23px;
  padding:0 8px;
  border-radius:999px;
  background:#edf4ff;
  color:#2f6fec;
  font-size:12px;
  font-weight:850;
  letter-spacing:-.03em;
}

body[data-sidebar-type="products"] .filter-chip-all-row{
  margin:0 0 12px;
  padding:0;
  border:0;
  background:transparent;
}

body[data-sidebar-type="products"] .filter-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

body[data-sidebar-type="products"] .filter-group .filter-chip-row--details{
  display:flex;
  grid-template-columns:none;
  margin:0;
  padding:0;
  border:0;
}

body[data-sidebar-type="products"] .filter-group .filter-chip-row--details::before,
body[data-sidebar-type="products"] .filter-group .filter-chip-row--details::after{
  display:none;
}

body[data-sidebar-type="products"] .filter-chip,
body[data-sidebar-type="products"] .filter-chip-row .filter-chip,
body[data-sidebar-type="products"] .filter-chip-all-row .filter-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  min-width:0;
  min-height:36px;
  padding:0 14px;
  border:1px solid #d8e2ee;
  border-radius:999px;
  background:#ffffff;
  color:#4f5d70;
  font-size:14px;
  line-height:1;
  font-weight:700;
  letter-spacing:-.04em;
  box-shadow:none;
  transform:none;
}

body[data-sidebar-type="products"] .filter-chip-icon,
body[data-sidebar-type="products"] .filter-chip::before{
  display:none;
}

body[data-sidebar-type="products"] .filter-chip:hover{
  color:#174ea6;
  border-color:#a9c7f7;
  background:#f4f8ff;
  box-shadow:none;
  transform:none;
}

body[data-sidebar-type="products"] .filter-chip.active{
  color:#174ea6;
  border-color:#9dbdf6;
  background:#edf4ff;
  box-shadow:none;
}

body[data-sidebar-type="products"] .filter-chip-all-row .filter-chip.active{
  background:#174ea6;
  color:#fff;
  border-color:#174ea6;
}

body[data-sidebar-type="products"] .filter-result-count{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  margin:18px 0 0;
  padding:0 13px;
  border-radius:999px;
  background:#f3f6fa;
  color:#5a6676;
  font-size:13px;
  font-weight:750;
}

body[data-sidebar-type="products"] .line-filter-intro,
body[data-sidebar-type="products"] .auto-filter-intro,
body[data-sidebar-type="products"] .category-filter-intro,
body[data-sidebar-type="products"] .product-industrial-head{
  margin:0 0 18px;
  padding:26px clamp(18px,2.2vw,32px);
  background:#ffffff;
  border:1px solid #e1e8f0;
  border-radius:18px;
  box-shadow:none;
}

body[data-sidebar-type="products"] .line-filter-intro span,
body[data-sidebar-type="products"] .auto-filter-intro span,
body[data-sidebar-type="products"] .category-filter-intro span,
body[data-sidebar-type="products"] .product-industrial-head span{
  color:#2f6fec;
  font-size:12px;
  font-weight:850;
  letter-spacing:.12em;
}

body[data-sidebar-type="products"] .line-filter-intro h2,
body[data-sidebar-type="products"] .auto-filter-intro h2,
body[data-sidebar-type="products"] .category-filter-intro h2,
body[data-sidebar-type="products"] .product-industrial-head h2{
  margin:8px 0 0;
  color:#111827;
  font-size:clamp(24px,1.8vw,32px);
  line-height:1.28;
  font-weight:850;
  letter-spacing:-.06em;
}

body[data-sidebar-type="products"] .line-filter-intro p,
body[data-sidebar-type="products"] .auto-filter-intro p,
body[data-sidebar-type="products"] .category-filter-intro p,
body[data-sidebar-type="products"] .product-industrial-head p{
  margin:10px 0 0;
  color:#687789;
  font-size:15px;
  line-height:1.75;
  font-weight:500;
}

body[data-sidebar-type="products"] .product-list-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:16px;
  margin:26px 0 18px;
  padding:0;
  border:0;
  background:transparent;
}

body[data-sidebar-type="products"] .product-list-head h2{
  margin:0;
  color:#111827;
  font-size:26px;
  font-weight:850;
  letter-spacing:-.06em;
}

body[data-sidebar-type="products"] .product-list-head span{
  color:#7b8794;
  font-size:14px;
  font-weight:700;
}

body[data-sidebar-type="products"] .product-grid.view-many,
body[data-sidebar-type="products"] .product-grid.view-large{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
}

body[data-sidebar-type="products"] .product-card{
  border:1px solid #e3e9f1;
  border-radius:18px;
  background:#fff;
  box-shadow:none;
  overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

body[data-sidebar-type="products"] .product-card:hover{
  transform:translateY(-4px);
  border-color:#cfd9e6;
  box-shadow:0 16px 34px rgba(17,24,39,.08);
}

body[data-sidebar-type="products"] .product-thumb{
  aspect-ratio:4/3;
  background:#f5f7fa;
  overflow:hidden;
}

body[data-sidebar-type="products"] .product-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

body[data-sidebar-type="products"] .product-body{
  padding:18px 18px 20px;
}

body[data-sidebar-type="products"] .product-body h3{
  margin:0 0 9px;
  color:#172033;
  font-size:18px;
  line-height:1.35;
  font-weight:850;
  letter-spacing:-.05em;
}

body[data-sidebar-type="products"] .product-body p{
  min-height:3.4em;
  margin:0 0 14px;
  color:#6a7585;
  font-size:14px;
  line-height:1.7;
  font-weight:500;
}

body[data-sidebar-type="products"] .detail-btn{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:#f3f6fa;
  color:#3b4a5f;
  font-size:13px;
  font-weight:750;
}

body[data-sidebar-type="products"] .product-card:hover .detail-btn{
  background:#edf4ff;
  color:#174ea6;
}

@media (max-width:1180px){
  body[data-sidebar-type="products"] .product-grid.view-many,
  body[data-sidebar-type="products"] .product-grid.view-large{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:900px){
  body[data-sidebar-type="products"] .filter-groups{
    grid-template-columns:1fr;
  }

  body[data-sidebar-type="products"] .product-grid.view-many,
  body[data-sidebar-type="products"] .product-grid.view-large{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
  }
}

@media (max-width:640px){
  body[data-sidebar-type="products"] .product-control-panel{
    margin:18px 0 26px;
    padding:18px 16px;
    border-radius:16px;
  }

  body[data-sidebar-type="products"] .filter-mode-tabs{
    gap:6px 16px;
    margin-bottom:18px;
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:12px;
  }

  body[data-sidebar-type="products"] .filter-mode-tabs button{
    flex:0 0 auto;
    font-size:15px;
    white-space:nowrap;
  }

  body[data-sidebar-type="products"] .filter-mode-tabs button::after{
    bottom:-13px;
  }

  body[data-sidebar-type="products"] .filter-group{
    padding:17px 14px;
    border-radius:14px;
  }

  body[data-sidebar-type="products"] .filter-group h3{
    font-size:16px;
  }

  body[data-sidebar-type="products"] .filter-chip,
  body[data-sidebar-type="products"] .filter-chip-row .filter-chip,
  body[data-sidebar-type="products"] .filter-chip-all-row .filter-chip{
    min-height:34px;
    padding:0 11px;
    font-size:13px;
  }

  body[data-sidebar-type="products"] .product-grid.view-many,
  body[data-sidebar-type="products"] .product-grid.view-large{
    grid-template-columns:1fr 1fr;
    gap:13px;
  }

  body[data-sidebar-type="products"] .product-body{
    padding:14px 13px 16px;
  }

  body[data-sidebar-type="products"] .product-body h3{
    font-size:15px;
  }

  body[data-sidebar-type="products"] .product-body p{
    display:none;
  }
}

/* =========================================================
   2026-05-11 FINAL EQUIPMENT UI SYSTEM
   목적: 설비소개 전체보기/포장자동화라인/자동포장기/날인기/반자동장비 UI 통일
   기준: 가독성 우선, 밝은 색상, 버튼 동일 크기, 제품/사진 중심
========================================================= */
body[data-sidebar-type="products"]{
  --nb-brand:#0f6fdc;
  --nb-brand-soft:#eef6ff;
  --nb-ink:#122033;
  --nb-muted:#64748b;
  --nb-border:#d9e4ef;
  --nb-panel:#ffffff;
  --nb-page:#f4f8fc;
}

body[data-sidebar-type="products"] .nb-layout-main,
body[data-sidebar-type="products"] main{
  background:var(--nb-page);
}

/* 제품군 홈: 2개 핵심 + 2개 서브 hierarchy
   - 1열: 포장자동화라인 / 자동포장기 크게 노출
   - 2열: 날인·코딩 시스템 / 반자동장비 보조 카테고리로 정리
   - 텍스트/태그 색상은 흰 배경에서 확실히 보이도록 재정의
*/
body[data-sidebar-type="products"] .equipment-home-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(20px,2vw,32px);
  align-items:stretch;
}
body[data-sidebar-type="products"] .equipment-home-card{
  grid-column:auto;
  min-height:clamp(390px,25vw,500px);
  border:1px solid var(--nb-border);
  background:#fff;
  border-radius:0;
  overflow:hidden;
  box-shadow:0 18px 34px rgba(15,35,67,.08);
}
body[data-sidebar-type="products"] .equipment-home-card--primary{
  min-height:clamp(500px,32vw,620px);
  box-shadow:0 22px 46px rgba(15,35,67,.10);
}
body[data-sidebar-type="products"] .equipment-home-card--secondary,
body[data-sidebar-type="products"] .equipment-home-card--support{
  grid-column:auto;
  min-height:clamp(400px,24vw,500px);
  box-shadow:0 12px 26px rgba(15,35,67,.07);
}
body[data-sidebar-type="products"] .equipment-home-card--support{
  opacity:1;
}
body[data-sidebar-type="products"] .equipment-card-image{
  height:clamp(220px,16vw,300px);
  aspect-ratio:4/3;
  background:#f7fbff;
  border-bottom:1px solid #dbe8f5;
}
body[data-sidebar-type="products"] .equipment-home-card--primary .equipment-card-image{
  height:clamp(270px,19vw,360px);
}
body[data-sidebar-type="products"] .equipment-card-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center;
  padding:clamp(10px,1vw,18px);
  box-sizing:border-box;
  background:#f7fbff;
}
body[data-sidebar-type="products"] .equipment-card-body{
  padding:clamp(24px,2vw,36px);
}
body[data-sidebar-type="products"] .equipment-card-body small{
  color:#0f66bb;
  font-size:13px;
  font-weight:950;
  letter-spacing:.12em;
}
body[data-sidebar-type="products"] .equipment-card-body strong{
  color:#0b2440;
  letter-spacing:-.9px;
}
body[data-sidebar-type="products"] .equipment-home-card--primary .equipment-card-body strong{
  font-size:clamp(34px,2.25vw,46px);
  line-height:1.14;
}
body[data-sidebar-type="products"] .equipment-home-card--secondary .equipment-card-body strong,
body[data-sidebar-type="products"] .equipment-home-card--support .equipment-card-body strong{
  font-size:clamp(28px,1.75vw,36px);
  line-height:1.18;
}
body[data-sidebar-type="products"] .equipment-card-body > span{
  color:#40566e;
  font-size:clamp(15px,.95vw,18px);
  line-height:1.78;
  font-weight:700;
}
body[data-sidebar-type="products"] .equipment-card-body i{
  gap:8px;
  margin:20px 0 24px;
}
body[data-sidebar-type="products"] .equipment-card-body i b{
  min-height:30px;
  background:#eef6ff;
  border:1px solid #d4e5f7;
  color:#1b426a;
  font-size:12px;
  font-weight:900;
}
body[data-sidebar-type="products"] .equipment-card-body u{
  min-height:46px;
  border-color:#b9d5ee;
  color:#0f66bb;
  background:#fff;
  font-size:15px;
}

/* 제품 카테고리 필터 공통 래퍼 */
body[data-sidebar-type="products"] .product-control-panel{
  position:relative;
  margin:48px auto 34px;
  padding:30px;
  max-width:1180px;
  border:1px solid var(--nb-border);
  border-radius:0;
  background:#fff;
  box-shadow:none;
}

/* 1차 선택 탭: 어두운 박스 제거, 동일한 탭 크기 */
body[data-sidebar-type="products"] .filter-mode-tabs{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
  padding:0 0 18px;
  margin:0 0 24px;
  border-bottom:1px solid var(--nb-border);
  background:transparent;
}
body[data-sidebar-type="products"] .filter-mode-tabs button{
  min-height:52px;
  padding:0 18px;
  border:1px solid var(--nb-border);
  border-radius:0;
  background:#f8fafc;
  color:#334155;
  font-size:16px;
  font-weight:800;
  letter-spacing:-.35px;
  box-shadow:none;
  transform:none;
}
body[data-sidebar-type="products"] .filter-mode-tabs button:hover{
  border-color:#9cc9f5;
  background:#f3f8ff;
  color:var(--nb-brand);
  transform:none;
  box-shadow:none;
}
body[data-sidebar-type="products"] .filter-mode-tabs button.active{
  border-color:var(--nb-brand);
  background:var(--nb-brand-soft);
  color:var(--nb-brand);
  box-shadow:none;
}
body[data-sidebar-type="products"] .filter-mode-tabs button::after{
  display:none;
}

/* 1차/2차 그룹: 모든 페이지 동일 2단 카드 */
body[data-sidebar-type="products"] .filter-groups{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  align-items:start;
}
body[data-sidebar-type="products"] .filter-groups.printer-filter-groups,
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-groups,
body[data-sidebar-type="products"] .product-control-panel[data-category="consumable"] .filter-groups{
  grid-template-columns:1fr;
}
body[data-sidebar-type="products"] .filter-group{
  min-width:0;
  padding:24px;
  border:1px solid var(--nb-border);
  border-radius:0;
  background:#fff;
  box-shadow:none;
}
body[data-sidebar-type="products"] .filter-group.filter-group--primary{
  border-color:#b9d9f7;
}
body[data-sidebar-type="products"] .filter-group-bg{
  display:none;
}
body[data-sidebar-type="products"] .filter-group h3{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 18px;
  padding-bottom:14px;
  border-bottom:1px solid var(--nb-border);
  color:var(--nb-ink);
  font-size:24px;
  line-height:1.25;
  font-weight:900;
  letter-spacing:-.8px;
}
body[data-sidebar-type="products"] .filter-group h3::before{
  display:none;
}
body[data-sidebar-type="products"] .filter-step-badge{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:58px;
  height:30px;
  padding:0 10px;
  border-radius:0;
  background:var(--nb-brand-soft);
  color:var(--nb-brand);
  font-size:13px;
  font-weight:900;
  letter-spacing:-.2px;
}

/* 버튼 행 */
body[data-sidebar-type="products"] .filter-chip-all-row{
  display:grid;
  grid-template-columns:minmax(150px,220px);
  gap:10px;
  margin:0 0 12px;
  padding:0;
}
body[data-sidebar-type="products"] .filter-chip-row,
body[data-sidebar-type="products"] .filter-group .filter-chip-row--details{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(132px,1fr));
  gap:10px;
  padding:0;
  margin:0;
  border:0;
}
body[data-sidebar-type="products"] .filter-group .filter-chip-row--details::before,
body[data-sidebar-type="products"] .filter-group .filter-chip-row--details::after{
  display:none;
}

/* 실제 필터 버튼: 동일 크기, 밝은 색상, 가독성 우선 */
body[data-sidebar-type="products"] .filter-chip,
body[data-sidebar-type="products"] .filter-chip-row .filter-chip,
body[data-sidebar-type="products"] .filter-chip-all-row .filter-chip{
  width:100%;
  min-width:0;
  min-height:46px;
  padding:0 14px;
  border:1px solid var(--nb-border);
  border-radius:0;
  background:#f8fafc;
  color:#26364a;
  font-size:15px;
  font-weight:800;
  line-height:1.25;
  letter-spacing:-.35px;
  box-shadow:none;
  transform:none;
}
body[data-sidebar-type="products"] .filter-chip:hover{
  background:#f2f7fd;
  border-color:#a9cff3;
  color:var(--nb-brand);
  transform:none;
  box-shadow:none;
}
body[data-sidebar-type="products"] .filter-chip.active{
  background:#eaf4ff;
  border-color:var(--nb-brand);
  color:var(--nb-brand);
  box-shadow:inset 0 -3px 0 var(--nb-brand);
}
body[data-sidebar-type="products"] .filter-chip-label{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body[data-sidebar-type="products"] .filter-chip::before,
body[data-sidebar-type="products"] .filter-chip-icon{
  display:none;
}

/* 결과 카운트 */
body[data-sidebar-type="products"] .filter-result-count{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:22px;
  padding:10px 14px;
  border:1px solid #cfe2f4;
  border-radius:0;
  background:#f7fbff;
  color:#334155;
  font-size:14px;
  font-weight:800;
}
body[data-sidebar-type="products"] .filter-result-count::before{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  background:var(--nb-brand);
}

/* 제품 목록 카드도 같은 디자인 언어로 통일 */
body[data-sidebar-type="products"] .product-list-head{
  max-width:1180px;
  margin:0 auto 18px;
  padding:0 0 14px;
  border-bottom:1px solid var(--nb-border);
}
body[data-sidebar-type="products"] .product-grid{
  max-width:1180px;
  margin:0 auto 80px;
  gap:22px;
}
body[data-sidebar-type="products"] .product-card{
  border:1px solid var(--nb-border);
  border-radius:0;
  background:#fff;
  box-shadow:none;
  overflow:hidden;
}
body[data-sidebar-type="products"] .product-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 32px rgba(15,35,67,.08);
}
body[data-sidebar-type="products"] .product-thumb{
  aspect-ratio:4/3;
  background:#f6f8fb;
}
body[data-sidebar-type="products"] .product-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}
body[data-sidebar-type="products"] .product-body h3{
  color:var(--nb-ink);
  font-size:21px;
  line-height:1.35;
  font-weight:900;
  letter-spacing:-.65px;
}
body[data-sidebar-type="products"] .product-body p{
  color:var(--nb-muted);
  line-height:1.75;
}

/* 각 카테고리 히어로/소개 박스 강약 조절 */
body[data-sidebar-type="products"] .auto-filter-intro,
body[data-sidebar-type="products"] .line-filter-intro,
body[data-sidebar-type="products"] .category-filter-intro{
  max-width:1180px;
  margin:48px auto 0;
  padding:48px 44px;
  border:1px solid var(--nb-border);
  border-radius:0;
  background:#fff;
  box-shadow:none;
}
body[data-sidebar-type="products"] .auto-filter-intro h2,
body[data-sidebar-type="products"] .line-filter-intro h2,
body[data-sidebar-type="products"] .category-filter-intro h2{
  color:var(--nb-ink);
  font-size:34px;
  line-height:1.25;
  font-weight:900;
  letter-spacing:-1.1px;
}
body[data-sidebar-type="products"] .auto-filter-intro p,
body[data-sidebar-type="products"] .line-filter-intro p,
body[data-sidebar-type="products"] .category-filter-intro p{
  color:var(--nb-muted);
  font-size:16px;
  line-height:1.8;
}

@media (max-width:900px){
  body[data-sidebar-type="products"] .equipment-home-grid,
  body[data-sidebar-type="products"] .filter-groups{
    grid-template-columns:1fr;
  }
  body[data-sidebar-type="products"] .equipment-home-card,
  body[data-sidebar-type="products"] .equipment-home-card--primary,
  body[data-sidebar-type="products"] .equipment-home-card--secondary,
  body[data-sidebar-type="products"] .equipment-home-card--support{
    grid-column:span 1;
    min-height:260px;
  }
  body[data-sidebar-type="products"] .product-control-panel{
    margin:32px 16px 28px;
    padding:20px;
  }
  body[data-sidebar-type="products"] .filter-mode-tabs{
    grid-template-columns:1fr;
  }
  body[data-sidebar-type="products"] .filter-group{
    padding:20px;
  }
  body[data-sidebar-type="products"] .filter-group h3{
    font-size:22px;
  }
  body[data-sidebar-type="products"] .filter-chip-row,
  body[data-sidebar-type="products"] .filter-group .filter-chip-row--details{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body[data-sidebar-type="products"] .auto-filter-intro,
  body[data-sidebar-type="products"] .line-filter-intro,
  body[data-sidebar-type="products"] .category-filter-intro{
    margin:32px 16px 0;
    padding:32px 22px;
  }
  body[data-sidebar-type="products"] .auto-filter-intro h2,
  body[data-sidebar-type="products"] .line-filter-intro h2,
  body[data-sidebar-type="products"] .category-filter-intro h2{
    font-size:27px;
  }
}

@media (max-width:520px){
  body[data-sidebar-type="products"] .filter-chip-row,
  body[data-sidebar-type="products"] .filter-group .filter-chip-row--details,
  body[data-sidebar-type="products"] .filter-chip-all-row{
    grid-template-columns:1fr;
  }
  body[data-sidebar-type="products"] .filter-chip,
  body[data-sidebar-type="products"] .filter-chip-row .filter-chip,
  body[data-sidebar-type="products"] .filter-chip-all-row .filter-chip{
    min-height:44px;
    font-size:14px;
  }
}


/* =========================================================
   2026-05-11 EQUIPMENT UI CONSISTENCY REAL FIX
   적용 목적:
   - 설비소개 하위페이지 폭 통일
   - 원물/공정 2개 필터 박스 동일 크기·동일 정렬
   - 남색 버튼판 제거, 밝은 브랜드형 버튼으로 변경
   - 메인 헤더 + 하위메뉴 sticky 동시 유지
   - 제품 카드/필터가 페이지마다 다르게 보이는 문제 정리
========================================================= */
:root{
  --nb-product-width:var(--nb-page-width);
  --nb-product-side:clamp(20px,4vw,48px);
  --nb-brand-blue:#126ee2;
  --nb-brand-blue-2:#2f8cff;
  --nb-soft-blue:#f2f8ff;
  --nb-soft-gray:#f8fafc;
  --nb-ink-strong:#10243a;
  --nb-text-soft:#5e6b7c;
  --nb-line-soft:#dbe7f2;
  --nb-chip-h:48px;
  --nb-chip-gap:10px;
}

/* [01] 하위메뉴 sticky: 메인 헤더 아래 같이 따라오도록 고정 */
.page-section-bar{
  position:sticky;
  top:var(--nb-header-h,76px);
  z-index:1040;
  background:rgba(255,255,255,.98);
  border-top:0;
  border-bottom:1px solid #dce6f0;
  box-shadow:0 8px 20px rgba(15,35,67,.055);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.page-section-bar__inner{
  width:min(calc(100vw - 32px),var(--nb-product-width));
  max-width:var(--nb-product-width);
  margin:0 auto;
  min-height:58px;
}
.page-section-bar__home,
.page-section-bar__current,
.page-section-bar__link{
  min-height:58px;
}
.page-section-bar__home{
  background:#fff;
  color:var(--nb-brand-blue);
  border-left:1px solid #dce6f0;
  border-right:1px solid #dce6f0;
}
.page-section-bar__current{
  color:var(--nb-ink-strong);
  background:#fff;
}
.page-section-bar__link{
  color:#405167;
  background:#fff;
  font-weight:800;
}
.page-section-bar__link.is-active,
.page-section-bar__link:hover{
  color:var(--nb-brand-blue);
  background:#f8fbff;
}
.page-section-bar__link.is-active::after,
.page-section-bar__link:hover::after{
  height:3px;
  background:var(--nb-brand-blue);
}

/* [02] 설비소개 하위페이지 폭 통일 */
body[data-sidebar-type="products"] .layout-content{
  width:100%;
  max-width:none;
}
body[data-sidebar-type="products"] .line-automation-hero,
body[data-sidebar-type="products"] .auto-packer-hero,
body[data-sidebar-type="products"] .category-showcase-hero,
body[data-sidebar-type="products"] .line-automation-summary,
body[data-sidebar-type="products"] .auto-packer-summary,
body[data-sidebar-type="products"] .category-showcase-summary,
body[data-sidebar-type="products"] .line-filter-intro,
body[data-sidebar-type="products"] .auto-filter-intro,
body[data-sidebar-type="products"] .category-filter-intro,
body[data-sidebar-type="products"] .product-industrial-head,
body[data-sidebar-type="products"] .product-control-panel,
body[data-sidebar-type="products"] .product-list-head,
body[data-sidebar-type="products"] .product-grid{
  width:100%;
  max-width:none;
  margin-left:0;
  margin-right:0;
  box-sizing:border-box;
}
body[data-sidebar-type="products"] .line-automation-hero,
body[data-sidebar-type="products"] .auto-packer-hero,
body[data-sidebar-type="products"] .category-showcase-hero{
  margin-top:64px;
  margin-bottom:34px;
}
body[data-sidebar-type="products"] .line-automation-summary,
body[data-sidebar-type="products"] .auto-packer-summary,
body[data-sidebar-type="products"] .category-showcase-summary{
  margin-top:0;
  margin-bottom:54px;
}

/* [03] 필터 안내 박스: 페이지별 폭/색상 통일 */
body[data-sidebar-type="products"] .line-filter-intro,
body[data-sidebar-type="products"] .auto-filter-intro,
body[data-sidebar-type="products"] .category-filter-intro,
body[data-sidebar-type="products"] .product-industrial-head{
  margin-top:0;
  margin-bottom:18px;
  padding:42px 44px;
  background:#fff;
  border:1px solid var(--nb-line-soft);
  border-radius:0;
  box-shadow:none;
}
body[data-sidebar-type="products"] .line-filter-intro span,
body[data-sidebar-type="products"] .auto-filter-intro span,
body[data-sidebar-type="products"] .category-filter-intro span,
body[data-sidebar-type="products"] .product-industrial-head span{
  color:var(--nb-brand-blue);
}

/* [04] 필터 전체 패널: 버튼판 느낌 제거 */
body[data-sidebar-type="products"] .product-control-panel{
  margin-top:0;
  margin-bottom:44px;
  padding:32px;
  background:#fff;
  border:1px solid var(--nb-line-soft);
  border-radius:0;
  box-shadow:none;
  overflow:visible;
}
body[data-sidebar-type="products"] .product-control-bg,
body[data-sidebar-type="products"] .filter-group-bg{
  display:none;
}

/* [05] 1차 선택 탭: 원물/공정 둘 다 보이되 밝은 탭형으로 통일 */
body[data-sidebar-type="products"] .filter-mode-tabs{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:0 0 24px;
  padding:0 0 22px;
  border-bottom:1px solid #e7eef6;
  background:transparent;
}
body[data-sidebar-type="products"] .filter-mode-tabs button{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:50px;
  padding:0 18px;
  border:1px solid var(--nb-line-soft);
  border-radius:0;
  background:#fff;
  color:#334155;
  font-size:15px;
  font-weight:850;
  letter-spacing:-.035em;
  box-shadow:none;
  text-align:center;
}
body[data-sidebar-type="products"] .filter-mode-tabs button::after{display:none;}
body[data-sidebar-type="products"] .filter-mode-tabs button.active,
body[data-sidebar-type="products"] .filter-mode-tabs button:hover{
  background:var(--nb-soft-blue);
  border-color:#a9cff4;
  color:var(--nb-brand-blue);
  box-shadow:inset 0 -3px 0 var(--nb-brand-blue);
}

/* [06] 2개 필터 박스: 큰 쪽 기준으로 동일 폭/높이 */
body[data-sidebar-type="products"] .filter-groups{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
  align-items:stretch;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-groups,
body[data-sidebar-type="products"] .filter-groups.printer-filter-groups{
  grid-template-columns:1fr;
}
body[data-sidebar-type="products"] .filter-group{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:326px;
  padding:26px;
  background:#fff;
  border:1px solid var(--nb-line-soft);
  border-radius:0;
  box-shadow:none;
  box-sizing:border-box;
}
body[data-sidebar-type="products"] .filter-group h3{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:40px;
  margin:0 0 18px;
  padding:0 0 14px;
  border-bottom:1px solid #e7eef6;
  color:var(--nb-ink-strong);
  font-size:24px;
  line-height:1.25;
  font-weight:900;
  letter-spacing:-.055em;
}
body[data-sidebar-type="products"] .filter-step-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-width:58px;
  height:28px;
  padding:0 10px;
  border-radius:0;
  background:var(--nb-soft-blue);
  color:var(--nb-brand-blue);
  font-size:13px;
  font-weight:900;
  letter-spacing:-.035em;
}

/* [07] 필터 버튼: 어두운 남색 제거, 동일 높이/폭/간격 */
body[data-sidebar-type="products"] .filter-chip-all-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--nb-chip-gap);
  margin:0 0 10px;
}
body[data-sidebar-type="products"] .filter-chip-row,
body[data-sidebar-type="products"] .filter-group .filter-chip-row--details{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--nb-chip-gap);
  align-content:start;
  margin-top:0;
  padding-top:0;
}
body[data-sidebar-type="products"] .filter-group .filter-chip-row--details::before,
body[data-sidebar-type="products"] .filter-group .filter-chip-row--details::after{
  display:none;
}
body[data-sidebar-type="products"] .filter-chip,
body[data-sidebar-type="products"] .filter-chip-row .filter-chip,
body[data-sidebar-type="products"] .filter-chip-all-row .filter-chip{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-width:0;
  height:var(--nb-chip-h);
  min-height:var(--nb-chip-h);
  padding:0 12px;
  border:1px solid var(--nb-line-soft);
  border-radius:0;
  background:#fff;
  color:#334155;
  font-size:14px;
  line-height:1.25;
  font-weight:800;
  letter-spacing:-.035em;
  text-align:center;
  white-space:normal;
  box-shadow:none;
  transform:none;
}
body[data-sidebar-type="products"] .filter-chip-row .filter-chip:nth-child(4n+6){
  grid-column:auto;
}
body[data-sidebar-type="products"] .filter-chip-label{
  display:block;
  max-width:100%;
  color:inherit;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  word-break:keep-all;
}
body[data-sidebar-type="products"] .filter-chip-icon{
  display:none;
}
body[data-sidebar-type="products"] .filter-chip:hover{
  background:#f8fbff;
  border-color:#b8d7f4;
  color:var(--nb-brand-blue);
  transform:none;
}
body[data-sidebar-type="products"] .filter-chip.active{
  background:var(--nb-brand-blue);
  border-color:var(--nb-brand-blue);
  color:#fff;
  box-shadow:none;
}
body[data-sidebar-type="products"] .filter-result-count{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  margin-top:22px;
  padding:0 14px;
  border:1px solid #cfe2f5;
  background:#f8fbff;
  color:#27435f;
  font-size:14px;
  font-weight:850;
}

/* [08] 제품 목록도 같은 폭으로 */
body[data-sidebar-type="products"] .product-list-head{
  margin-top:0;
}
body[data-sidebar-type="products"] .product-grid.view-many,
body[data-sidebar-type="products"] .product-grid.view-large,
body[data-sidebar-type="products"] .product-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px;
  margin-bottom:90px;
}

/* [09] 메인 주력 제품군: 2x2, 반자동 제거 후 날인 왼쪽/사례 오른쪽 */
body.home-page .home-solution-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}
body.home-page .home-solution-card{
  min-height:390px;
}

@media (max-width:1100px){
  body[data-sidebar-type="products"] .product-grid.view-many,
  body[data-sidebar-type="products"] .product-grid.view-large,
  body[data-sidebar-type="products"] .product-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media (max-width:900px){
  .page-section-bar{top:var(--nb-header-h,72px);}
  .page-section-bar__inner{width:100%;}
  .page-section-bar__links{overflow-x:auto;}

  body[data-sidebar-type="products"] .line-automation-hero,
  body[data-sidebar-type="products"] .auto-packer-hero,
  body[data-sidebar-type="products"] .category-showcase-hero,
  body[data-sidebar-type="products"] .line-automation-summary,
  body[data-sidebar-type="products"] .auto-packer-summary,
  body[data-sidebar-type="products"] .category-showcase-summary,
  body[data-sidebar-type="products"] .line-filter-intro,
  body[data-sidebar-type="products"] .auto-filter-intro,
  body[data-sidebar-type="products"] .category-filter-intro,
  body[data-sidebar-type="products"] .product-industrial-head,
  body[data-sidebar-type="products"] .product-control-panel,
  body[data-sidebar-type="products"] .product-list-head,
  body[data-sidebar-type="products"] .product-grid{
    width:calc(100vw - 32px);
  }
  body[data-sidebar-type="products"] .filter-groups,
  body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-groups,
  body[data-sidebar-type="products"] .filter-groups.printer-filter-groups{
    grid-template-columns:1fr;
  }
  body[data-sidebar-type="products"] .filter-group{
    min-height:auto;
    padding:22px;
  }
  body[data-sidebar-type="products"] .filter-chip-row,
  body[data-sidebar-type="products"] .filter-group .filter-chip-row--details,
  body[data-sidebar-type="products"] .filter-chip-all-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body[data-sidebar-type="products"] .product-grid.view-many,
  body[data-sidebar-type="products"] .product-grid.view-large,
  body[data-sidebar-type="products"] .product-grid,
  body.home-page .home-solution-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:560px){
  body[data-sidebar-type="products"] .filter-mode-tabs,
  body[data-sidebar-type="products"] .filter-chip-row,
  body[data-sidebar-type="products"] .filter-group .filter-chip-row--details,
  body[data-sidebar-type="products"] .filter-chip-all-row,
  body[data-sidebar-type="products"] .product-grid.view-many,
  body[data-sidebar-type="products"] .product-grid.view-large,
  body[data-sidebar-type="products"] .product-grid,
  body.home-page .home-solution-grid{
    grid-template-columns:1fr;
  }
  body[data-sidebar-type="products"] .line-filter-intro,
  body[data-sidebar-type="products"] .auto-filter-intro,
  body[data-sidebar-type="products"] .category-filter-intro,
  body[data-sidebar-type="products"] .product-industrial-head,
  body[data-sidebar-type="products"] .product-control-panel{
    padding:24px 18px;
  }
  body[data-sidebar-type="products"] .filter-group h3{
    font-size:20px;
  }
}


/* =========================================================
   PATCH 2026-05-12
   - Case cards: remove tiny 10-column appearance
   - Product detail relation cards: related/required/option/consumable
========================================================= */

body[data-sidebar-type="cases"] .case-overview-mode .case-paged-grid,
body[data-sidebar-type="cases"] .case-section-mode .case-paged-grid,
.page-cases .case-overview-mode .case-paged-grid,
.page-cases .case-section-mode .case-paged-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:20px;
}

body[data-sidebar-type="cases"] .case-overview-mode .case-card,
body[data-sidebar-type="cases"] .case-section-mode .case-card,
.page-cases .case-overview-mode .case-card,
.page-cases .case-section-mode .case-card{
  min-width:0;
  border:1px solid #d8e5f2;
  background:#fff;
  box-shadow:none;
}

body[data-sidebar-type="cases"] .case-overview-mode .case-thumb,
body[data-sidebar-type="cases"] .case-section-mode .case-thumb,
.page-cases .case-overview-mode .case-thumb,
.page-cases .case-section-mode .case-thumb{
  height:auto;
  aspect-ratio:16/9;
  background:#edf4fb;
}

body[data-sidebar-type="cases"] .case-overview-mode .case-body,
body[data-sidebar-type="cases"] .case-section-mode .case-body,
.page-cases .case-overview-mode .case-body,
.page-cases .case-section-mode .case-body{
  padding:14px 14px 16px;
}

body[data-sidebar-type="cases"] .case-overview-mode .case-body h3,
body[data-sidebar-type="cases"] .case-section-mode .case-body h3,
.page-cases .case-overview-mode .case-body h3,
.page-cases .case-section-mode .case-body h3{
  min-height:42px;
  font-size:15px;
  line-height:1.42;
}

body[data-sidebar-type="cases"] .case-overview-mode .case-meta span,
body[data-sidebar-type="cases"] .case-section-mode .case-meta span,
.page-cases .case-overview-mode .case-meta span,
.page-cases .case-section-mode .case-meta span{
  min-height:22px;
  padding:0 7px;
  font-size:10px;
}

.product-relation-wrap{
  margin-top:44px;
  display:grid;
  gap:28px;
}

/* =========================================================
   [2026-05-12 PATCH] 날인기 필터 세로 폭 축소 / 전체 버튼 제거 대응
   - 원인: products.php의 공통 필터 렌더러가 printer_type에도 전체 버튼과 큰 min-height를 동일 적용
   - 처리: printer_type은 세부 종류 3개만 출력하고, 날인기 필터 패널만 얇은 탭형으로 정리
========================================================= */
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"]{
  margin-top:0;
  margin-bottom:30px;
  padding:22px 26px;
  background:#fff;
  border:1px solid #dbe7f3;
  box-shadow:none;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-groups,
body[data-sidebar-type="products"] .filter-groups.printer-filter-groups{
  display:block;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-group{
  min-height:auto;
  height:auto;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-group::after,
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-group-bg{
  display:none;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-group h3{
  min-height:auto;
  margin:0 0 14px;
  padding:0 0 12px;
  border-bottom:1px solid #e6eef7;
  font-size:22px;
  line-height:1.25;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-chip-all-row{
  display:none;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-chip-row,
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-group .filter-chip-row--details{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:0;
  padding:0;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-chip{
  min-height:48px;
  height:48px;
  padding:0 16px;
  border:1px solid #d7e3ef;
  background:#fff;
  color:#14243a;
  font-size:14px;
  font-weight:850;
  box-shadow:none;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-chip:hover,
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-chip.active{
  background:#1559ad;
  border-color:#1559ad;
  color:#fff;
}
body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-result-count{
  display:inline-flex;
  align-items:center;
  width:auto;
  margin-top:14px;
  padding:9px 14px;
  border:1px solid #dbe7f3;
  background:#f8fbff;
  color:#18304d;
  font-size:13px;
  line-height:1.2;
}
@media (max-width:768px){
  body[data-sidebar-type="products"] .product-control-panel[data-category="printer"]{
    padding:18px 16px;
    margin-bottom:24px;
  }
  body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-chip-row,
  body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-group .filter-chip-row--details{
    grid-template-columns:1fr;
  }
  body[data-sidebar-type="products"] .product-control-panel[data-category="printer"] .filter-chip{
    height:46px;
    min-height:46px;
  }
}

/* =========================================================
   [2026-05-14 PATCH] 제품 상세 하단 정보 성격별 출력 분리
   - related.txt: 카드형 유지
   - required.txt: 설치 전 확인사항 체크리스트형
   - option.txt: 선택 옵션 목록형
   - consumable.txt: 사용 자재 안내형
========================================================= */
.product-relation-section:has(.product-relation-checklist),
.product-relation-section:has(.product-relation-option-list),
.product-relation-section:has(.product-relation-material-list){
  padding-top:24px;
}


.product-relation-subblock{
  margin-top:16px;
}

.product-relation-subblock:first-child{
  margin-top:0;
}

.product-relation-subblock h4{
  margin:0 0 10px;
  color:#132238;
  font-size:15px;
  line-height:1.4;
  font-weight:900;
  letter-spacing:-.03em;
}

.product-relation-grid--option{
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-bottom:4px;
}

@media(max-width:900px){
  .product-relation-grid--option{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:560px){
  .product-relation-grid--option{
    grid-template-columns:1fr;
  }
}

.product-relation-checklist{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 14px;
  margin:0;
  padding:0;
  list-style:none;
}

.product-relation-checklist li{
  display:flex;
  gap:12px;
  align-items:flex-start;
  min-height:62px;
  padding:15px 16px;
  border:1px solid #dbe7f3;
  background:linear-gradient(180deg,#fff 0%,#f8fbff 100%);
}

.product-relation-checkmark{
  flex:0 0 auto;
  width:18px;
  height:18px;
  margin-top:2px;
  border:2px solid #0f66bb;
  border-radius:50%;
  position:relative;
  background:#fff;
}

.product-relation-checkmark::after{
  content:"";
  position:absolute;
  left:4px;
  top:2px;
  width:5px;
  height:9px;
  border:solid #0f66bb;
  border-width:0 2px 2px 0;
  transform:rotate(45deg);
}

.product-relation-checklist strong,
.product-relation-option-item strong,
.product-relation-material-list strong{
  display:block;
  color:#132238;
  font-size:15px;
  line-height:1.45;
  font-weight:900;
  letter-spacing:-.03em;
  word-break:keep-all;
}

.product-relation-checklist p{
  margin:4px 0 0;
  color:#667789;
  font-size:13px;
  line-height:1.6;
  word-break:keep-all;
}

.product-relation-option-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 14px;
}

.product-relation-option-item{
  display:grid;
  grid-template-columns:minmax(160px,.42fr) minmax(0,1fr);
  align-items:center;
  min-height:52px;
  padding:13px 16px;
  border:1px solid #dbe7f3;
  background:#fff;
}

.product-relation-option-item span{
  color:#647588;
  font-size:13px;
  line-height:1.55;
  word-break:keep-all;
}

.product-relation-material-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}

.product-relation-material-list li{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:9px 13px;
  border:1px solid #dbe7f3;
  background:#f8fbff;
}

.product-relation-material-list li::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#0f66bb;
}

.product-relation-material-list span{
  color:#647588;
  font-size:12.5px;
  line-height:1.5;
}

@media(max-width:900px){
  .product-relation-checklist,
  .product-relation-option-list{
    grid-template-columns:1fr;
  }

  .product-relation-option-item{
    grid-template-columns:1fr;
    gap:4px;
  }
}

@media(max-width:560px){
  .product-relation-checklist li,
  .product-relation-option-item{
    padding:13px 14px;
  }

  .product-relation-material-list{
    display:grid;
    grid-template-columns:1fr;
  }

  .product-relation-material-list li{
    width:100%;
  }
}

/* =========================================================
   [2026-05-14 PATCH] 관계 TXT link/text 블록 통합 UI
   - 모든 관계 TXT에서 link:/text: 블록을 동일하게 지원
   - link: 제품 카드 / text: 목록·체크·안내형
   - 카드와 텍스트 영역이 PC/모바일에서 이질감 없도록 톤 통일
========================================================= */
.product-relation-section{
  border-top:1px solid #d8e5f2;
  padding-top:28px;
}
.product-relation-subblock{
  margin-top:18px;
}
.product-relation-subblock:first-of-type{
  margin-top:0;
}
.product-relation-subblock h4{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 12px;
  color:#18304d;
  font-size:15px;
  line-height:1.4;
  font-weight:900;
  letter-spacing:-.03em;
}
.product-relation-subblock h4::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:#1559ad;
}
.product-relation-grid{
  gap:12px;
}
.product-relation-card,
.product-relation-checklist li,
.product-relation-option-item,
.product-relation-material-list li{
  border:1px solid #dbe7f3;
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 20px rgba(15,35,67,.035);
}
.product-relation-card{
  grid-template-columns:88px minmax(0,1fr);
  min-height:88px;
}
.product-relation-thumb{
  width:88px;
  height:88px;
  background:#f1f6fb;
}
.product-relation-body{
  padding:11px 13px;
}
.product-relation-body strong,
.product-relation-checklist strong,
.product-relation-option-item strong,
.product-relation-material-list strong{
  color:#132238;
  font-size:14px;
  line-height:1.42;
  font-weight:900;
  letter-spacing:-.03em;
}
.product-relation-body span,
.product-relation-option-item span,
.product-relation-material-list span,
.product-relation-checklist p{
  color:#647588;
  font-size:12.5px;
  line-height:1.55;
}
.product-relation-grid--option{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  margin-bottom:0;
}
.product-relation-option-list{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:10px 12px;
}
.product-relation-option-item{
  display:block;
  min-height:48px;
  padding:13px 15px;
}
.product-relation-option-item span{
  display:block;
  margin-top:4px;
}
.product-relation-checklist{
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:10px 12px;
}
.product-relation-checklist li{
  min-height:56px;
  padding:14px 15px;
}
.product-relation-material-list{
  gap:9px;
}
.product-relation-material-list li{
  min-height:38px;
  padding:9px 13px;
  background:#f8fbff;
}
.product-relation-section--materials .product-relation-card,
.product-relation-section--checklist .product-relation-card{
  background:#fff;
}
@media(max-width:560px){
  .product-relation-head h3{
    font-size:20px;
  }
  .product-relation-grid,
  .product-relation-grid--option,
  .product-relation-option-list,
  .product-relation-checklist{
    grid-template-columns:1fr;
  }
  .product-relation-card{
    grid-template-columns:82px minmax(0,1fr);
    min-height:82px;
  }
  .product-relation-thumb{
    width:82px;
    height:82px;
  }
  .product-relation-body{
    padding:10px 12px;
  }
  .product-relation-option-item,
  .product-relation-checklist li{
    padding:12px 13px;
  }
}


/* =========================================================
   [2026-05-16] GLOBAL CONTENT WIDTH LOCK PATCH
   목적:
   - 울트라와이드/대형 모니터에서 본문 카드와 섹션이 무제한으로 늘어나는 문제 방지
   - 회사소개/설비소개/사례/고객센터 본문 폭 기준을 동일하게 복구
   - Hero/헤더는 기존 흐름 유지, 실제 콘텐츠 영역만 제한폭 적용
========================================================= */
:root{
  --nb-page-width:min(92vw,1440px);
  --nb-section-container:var(--nb-page-width);
  --nb-container:var(--nb-page-width);
  --nb-content-max:1440px;
  --nb-readable-max:1180px;
  --nb-form-wide:1180px;
}

.container,
.page-section-bar .container,
.page-section-bar__inner,
.main-layout,
.main-layout.no-sidebar,
.main-layout.has-sidebar,
body.sub-page .main-layout,
body.sub-page .section-card-stack,
body.sub-page .customer-section-stack,
body.sub-page .customer-overview-intro,
body.sub-page .customer-overview-section{
  width:min(92vw,var(--nb-content-max));
  max-width:var(--nb-content-max);
  margin-left:auto;
  margin-right:auto;
}

.layout-content,
body.sub-page .layout-content{
  width:100%;
  max-width:100%;
  margin-left:0;
  margin-right:0;
}

.content-card,
.page-intro-card,
.product-control-panel,
.product-view-panel,
.product-list-head,
.product-series-intro,
.product-series-grid,
.product-grid,
.contact-panel,
.nb-service-hero,
.nb-service-card,
.case-type-section,
.notice-card,
.resource-card,
.about-card,
.as-card{
  max-width:100%;
}

/* 단일 폼/단일 안내 카드가 너무 좁거나 너무 넓어지는 현상 보정 */
body.page-contact .contact-panel,
body.page-as .contact-panel,
body.page-contact .nb-customer-form-card,
body.page-as .layout-content > .contact-panel{
  width:100%;
  max-width:var(--nb-content-max);
  margin-left:auto;
  margin-right:auto;
}

@media (max-width:900px){
  :root{
    --nb-page-width:min(92vw,100%);
    --nb-section-container:min(92vw,100%);
    --nb-container:min(92vw,100%);
  }

  .container,
  .page-section-bar .container,
  .page-section-bar__inner,
  .main-layout,
  .main-layout.no-sidebar,
  .main-layout.has-sidebar,
  body.sub-page .main-layout,
  body.sub-page .section-card-stack,
  body.sub-page .customer-section-stack,
  body.sub-page .customer-overview-intro,
  body.sub-page .customer-overview-section{
    width:min(92vw,100%);
    max-width:100%;
  }
}


/* =========================================================
   Product Detail Relation UI - Clean Final
   원인 정리:
   기존 product-relation 관련 CSS가 여러 차례 누적되어 카드 크기, 설명 노출, 시리즈 위치가 충돌함.
   아래 블록 하나로 관계 카드 UI를 통합 관리합니다.
========================================================= */

.product-relation-wrap{
  margin-top:34px;
  overflow:visible;
}

.product-relation-section{
  position:relative;
  overflow:visible;
  border-top:1px solid #d8e5f2;
  padding-top:30px;
  margin-top:30px;
}

.product-relation-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
  margin-bottom:18px;
}

.product-relation-head h3{
  margin:0;
  color:#102238;
  font-size:24px;
  line-height:1.25;
  letter-spacing:-.04em;
  font-weight:900;
}

.product-relation-head p{
  max-width:380px;
  margin:0;
  color:#6b7b8d;
  font-size:14px;
  line-height:1.55;
  text-align:right;
}

/* 공통 */
.product-relation-grid{
  display:grid;
  width:100%;
  max-width:100%;
  min-width:0;
  gap:18px;
  overflow:visible;
  box-sizing:border-box;
}

.product-relation-card{
  position:relative;
  overflow:visible;
  border:1px solid #dbe7f3;
  border-radius:18px;
  background:#fff;
  color:inherit;
  text-decoration:none;
  box-shadow:0 8px 22px rgba(15,35,67,.04);
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.product-relation-card:hover{
  z-index:80;
  transform:translateY(-2px);
  border-color:#8abdeb;
  box-shadow:0 16px 34px rgba(15,35,67,.11);
}

.product-relation-card--unlinked:hover{
  transform:none;
}

.product-relation-thumb{
  overflow:hidden;
  background:#f7fafc;
}

.product-relation-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  box-sizing:border-box;
}

.product-relation-body{
  position:relative;
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
}

.product-relation-body strong{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  color:#102238;
  font-weight:900;
  letter-spacing:-.035em;
  text-align:center;
}

.product-relation-body em{
  margin-top:4px;
  color:#b45309;
  font-size:11px;
  font-style:normal;
  font-weight:800;
}

/* 설명은 기본 비노출, PC hover 시 tooltip */
.product-relation-tooltip{
  position:absolute;
  left:50%;
  top:calc(100% + 12px);
  width:310px;
  max-width:min(310px,78vw);
  padding:14px 15px;
  border-radius:12px;
  background:#1f2937;
  color:#fff;
  box-shadow:0 16px 36px rgba(15,35,67,.18);
  font-size:13px;
  line-height:1.65;
  font-weight:500;
  letter-spacing:-.02em;
  opacity:0;
  visibility:hidden;
  transform:translateX(-50%) translateY(6px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
  z-index:500;
  pointer-events:none;
}

.product-relation-tooltip::before{
  content:attr(data-tooltip);
  white-space:pre-line;
}

.product-relation-card:hover .product-relation-tooltip{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) translateY(0);
}

/* 1. 선택 옵션: 큰 정사각 카드 */
.product-relation-section--option .product-relation-grid{
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
}

.product-relation-section--option .product-relation-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  min-height:230px;
  padding:18px 16px 20px;
  text-align:center;
}

.product-relation-section--option .product-relation-thumb{
  width:100%;
  height:145px;
  margin-bottom:12px;
  border-radius:14px;
}

.product-relation-section--option .product-relation-thumb img{
  padding:8px;
}

.product-relation-section--option .product-relation-body{
  width:100%;
  padding:0;
}

.product-relation-section--option .product-relation-body strong{
  font-size:20px;
  line-height:1.38;
}

/* 2. 필수 준비요소: 큰 가로 카드 */
.product-relation-section--required .product-relation-grid{
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
}

.product-relation-section--required .product-relation-card{
  display:grid;
  grid-template-columns:190px minmax(0,1fr);
  min-height:150px;
}

.product-relation-section--required .product-relation-thumb{
  width:190px;
  height:150px;
  border-radius:18px 0 0 18px;
}

.product-relation-section--required .product-relation-thumb img{
  padding:10px;
}

.product-relation-section--required .product-relation-body{
  align-items:flex-start;
  text-align:left;
  padding:22px 24px;
}

.product-relation-section--required .product-relation-body strong{
  text-align:left;
  font-size:21px;
  line-height:1.38;
}

/* 3. 함께 구성하면 좋은 제품: 이미지 큰 컴팩트 카드 */
.product-relation-section--related .product-relation-grid{
  grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
}

.product-relation-section--related .product-relation-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  min-height:215px;
  padding:14px 12px 16px;
  text-align:center;
}

.product-relation-section--related .product-relation-thumb{
  width:100%;
  height:122px;
  margin-bottom:12px;
  border-radius:14px;
}

.product-relation-section--related .product-relation-thumb img{
  padding:6px;
}

.product-relation-section--related .product-relation-body{
  width:100%;
  padding:0;
}

.product-relation-section--related .product-relation-body strong{
  font-size:16px;
  line-height:1.42;
}

/* 4. 소모품 */
.product-relation-section--consumable .product-relation-grid{
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
}

.product-relation-section--consumable .product-relation-card{
  display:grid;
  grid-template-columns:180px minmax(0,1fr);
  min-height:140px;
}

.product-relation-section--consumable .product-relation-thumb{
  width:180px;
  height:140px;
  border-radius:18px 0 0 18px;
}

.product-relation-section--consumable .product-relation-thumb img{
  padding:10px;
}

.product-relation-section--consumable .product-relation-body{
  align-items:flex-start;
  padding:20px 22px;
}

.product-relation-section--consumable .product-relation-body strong{
  text-align:left;
  font-size:20px;
  line-height:1.38;
}

/* 5. 시리즈 제품 계속 보기: 하단 탐색 영역 */
.product-relation-section--series{
  margin-top:76px;
  padding:28px 24px 22px;
  border:1px solid #d9e7f6;
  border-radius:20px;
  background:linear-gradient(180deg,#f8fbff 0%,#fff 100%);
  box-shadow:0 10px 28px rgba(15,35,67,.045);
}

.product-relation-section--series .product-relation-head{
  margin-bottom:16px;
}

.product-relation-section--series .product-relation-head h3{
  font-size:22px;
  color:#153453;
}

.product-relation-section--series .product-relation-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:12px;
  overflow:visible;
  padding:2px;
  scroll-snap-type:none;
}

.product-relation-section--series .product-relation-card{
  min-width:0;
  min-height:168px;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:12px 9px;
  text-align:center;
  scroll-snap-align:none;
}

.product-relation-section--series .product-relation-thumb{
  width:100%;
  height:104px;
  margin-bottom:10px;
  border-radius:12px;
}

.product-relation-section--series .product-relation-thumb img{
  padding:5px;
}

.product-relation-section--series .product-relation-body{
  width:100%;
  padding:0;
}

.product-relation-section--series .product-relation-body strong{
  font-size:14px;
  line-height:1.42;
}

@media (max-width:900px){
  .product-relation-head{
    display:block;
  }

  .product-relation-head p{
    max-width:none;
    margin-top:8px;
    text-align:left;
  }

  .product-relation-section--required .product-relation-grid,
  .product-relation-section--consumable .product-relation-grid{
    grid-template-columns:1fr;
  }

  .product-relation-section--series .product-relation-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media (max-width:560px){
  .product-relation-section--option .product-relation-grid,
  .product-relation-section--related .product-relation-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .product-relation-section--series{
    margin-top:38px;
    padding:18px 12px 16px;
  }

  .product-relation-section--series .product-relation-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .product-relation-section--option .product-relation-card,
  .product-relation-section--related .product-relation-card{
    min-height:170px;
    padding:10px;
  }

  .product-relation-section--option .product-relation-thumb,
  .product-relation-section--related .product-relation-thumb{
    height:96px;
  }

  .product-relation-section--required .product-relation-card,
  .product-relation-section--consumable .product-relation-card{
    grid-template-columns:128px minmax(0,1fr);
    min-height:116px;
  }

  .product-relation-section--required .product-relation-thumb,
  .product-relation-section--consumable .product-relation-thumb{
    width:128px;
    height:116px;
  }

  .product-relation-section--required .product-relation-body,
  .product-relation-section--consumable .product-relation-body{
    padding:14px;
  }

  .product-relation-section--required .product-relation-body strong,
  .product-relation-section--consumable .product-relation-body strong{
    font-size:16px;
  }

  .product-relation-section--series .product-relation-card{
    min-height:150px;
    padding:10px 8px;
  }

  .product-relation-section--series .product-relation-thumb{
    height:86px;
  }

  .product-relation-section--series .product-relation-body strong{
    font-size:12.5px;
    line-height:1.35;
  }

  .product-relation-tooltip{
    display:none;
  }
}