@charset "utf-8";

/* 서브페이지 축소값 — PC(1025px~)는 layout.css 원래 디자인 크기 */
@media (max-width: 1024px) {
:root { --sub-hero-h: 260px; }
.mv2-intro__tags { max-width: 100%; }
body:not([data-nav="main"]) { --fs-body: 15px; --fs-body-lg: 16px; --fs-body-sm: 13px; --fs-subhead: clamp(18px, 1.15vw, 22px); --gap-section: 40px; --gap-md: 12px; --gap-sm: 8px; --gap-head-content: 12px; }
body:not([data-nav="main"]) .portfolio-board-page { --mv-fz-xl: clamp(24px, 1.7vw, 32px); --mv-fz-sub: clamp(16px, 1.3vw, 20px); --mv-fz-body: 15px; --mv-fz-sm: 13px; }
.inquiry-page-head h2, .support-page-head h2, .portfolio-page-head h2, .company-page-title h2, .ceo-greeting-page-title h2, .product-detail-heading { font-size: clamp(22px, 1.4vw, 26px); }
.sub-hero__titles { top: 0; bottom: 0; gap: 10px; padding: calc(var(--header-outer-pad) + 64px) 24px 16px; }
.sub-hero-nav__home { width: 44px; height: 44px; }
.sub-hero-nav__label { width: auto; min-width: 140px; max-width: 220px; min-height: 44px; padding: 8px 16px 8px 18px; font-size: 14px; line-height: 1.4em; flex-shrink: 1; }
.sub-hero-nav__home img { width: 16px; height: 16px; }
.sub-hero-nav__pill { width: auto; min-width: 140px; max-width: 220px; flex-shrink: 1; }
.sub-hero-nav__trigger { gap: 10px; min-height: 44px; padding: 8px 16px 8px 18px; font-size: 14px; line-height: 1.4em; }
.sub-hero-nav__dropdown a { padding: 8px 16px; font-size: 14px; }
.real-cont.inquiry-page { padding-bottom: 48px; }
.inquiry-page .inquiry-page-head { margin-bottom: 40px; }
body[data-nav="works"] #contArea { padding-bottom: 48px; }
.company-page-title, .ceo-greeting-page-title { padding: 80px 0 48px; }
.ceo-greeting-body { padding: 0 0 48px; }
.ceo-greeting-body__inner { gap: clamp(16px, 2vw, 28px); }
.ceo-greeting-visual { height: clamp(160px, 14vw, 220px); }
.ceo-greeting-columns { gap: clamp(16px, 2vw, 32px); }
.ceo-greeting-copy { gap: 16px; }
.ceo-greeting-copy__groups { gap: 16px; }
.biz-intro .sec-head h2 + p { margin-top: 12px; }
.machine-vision-page.biz-solution-layout > .biz-dt-section:first-child { padding-top: clamp(28px, 3vw, 40px); }
.biz-mv-feature-card__icon { width: 56px; height: 56px; margin-bottom: 12px; }
.biz-solution-layout .company-page-title { padding-bottom: 16px; }
.biz-dt-section { padding: clamp(32px, 3vw, 40px) 0; }
.biz-stack--icon .stack-icon { width: 56px; height: 56px; }
.safety-page .biz-dt-section { padding: clamp(32px, 3vw, 48px) 0; }
.history-zigzag { padding: clamp(24px, 3vw, 36px) 0 0; }
.ceo-greeting-split { gap: clamp(20px, 2.4vw, 36px); }
.ceo-greeting-split__col { gap: 16px; }
.ceo-greeting-quote__text { font-size: clamp(16px, 1.1vw, 18px); }
#company-vision-main { --vm-fz-xl: clamp(22px, 1.6vw, 28px); --vm-fz-lg: clamp(20px, 1.5vw, 26px); --vm-fz-sub: clamp(16px, 1.25vw, 18px); --vm-fz-body: 15px; --vm-fz-sm: 13px; --vm-sec-gap: 40px; }
#company-vision-main > .company-page-title { padding-bottom: 16px; }
#company-vision-main > .vm-mv-tech-group .vm-tech-sec { padding-top: clamp(28px, 3vw, 40px); padding-bottom: 40px; }
#company-vision-main .company-page-title h2 { font-size: clamp(22px, 1.4vw, 26px); }
.vm-sec-head { margin-bottom: 24px; }
.vm-mv-block { padding: clamp(20px, 2vw, 28px); }
.vm-mv-block__icon { bottom: clamp(20px, 2vw, 28px); right: clamp(20px, 2vw, 28px); width: clamp(48px, 4vw, 64px); height: clamp(48px, 4vw, 64px); }
.vm-mv-block__text { gap: 10px; padding-bottom: clamp(40px, 4vw, 52px); }
.vm-mv-block__title { font-size: 22px; }
#company-vision-main > .vm-values-sec { padding-top: 40px; padding-bottom: 40px; }
#company-vision-main > .vm-philosophy-sec { padding-top: 40px; padding-bottom: 48px; }
.vm-value-card { padding: 24px 16px; }
.vm-value-card .vm-card-icon { width: 48px; height: 48px; margin: 0 0 12px; }
.vm-value-card .vm-card-icon svg, .vm-value-card .vm-card-icon img { width: 40px; height: 40px; }
#company-history-main > .company-page-title { padding-bottom: 24px; }
#company-location-main { --vm-fz-xl: clamp(22px, 1.6vw, 28px); --vm-fz-lg: clamp(20px, 1.5vw, 26px); --vm-fz-sub: clamp(16px, 1.25vw, 18px); --vm-fz-body: 15px; --vm-fz-sm: 13px; --vm-sec-gap: 40px; }
#company-location-main > .company-page-title { padding-bottom: 16px; }
#company-location-main > .location-site-sec { padding-bottom: 40px; }
#company-location-main > .location-route-sec { padding-top: 40px; padding-bottom: 48px; }
#company-location-main .company-page-title h2 { font-size: clamp(22px, 1.4vw, 26px); }
.machine-vision-page { --mv-fz-xl: clamp(20px, 1.35vw, 24px); --mv-fz-lg: clamp(18px, 1.2vw, 22px); --mv-fz-sub: 16px; --mv-fz-body: 15px; --mv-fz-sm: 13px; }
.machine-vision-page > .mv2-cases-sec > .inner { padding-top: 40px; }
.mv2-intro-sec { padding-bottom: 40px; }
.mv2-intro { grid-template-columns: minmax(0, 1fr) minmax(280px, 0.82fr); gap: clamp(24px, 3vw, 40px); }
.mv2-intro__lead { margin: auto 0 16px; font-size: 20px; }
.mv2-sec-head { margin-bottom: clamp(20px, 2vw, 28px); }
.mv2-solution-sec .mv2-sec-head__title { font-size: clamp(20px, 1.35vw, 24px); }
.mv2-solution-sec .mv2-sec-head__desc { font-size: 15px; }
.mv2-solution-sec .mv2-feat-item__desc { font-size: 15px; }
.mv2-solution-sec > .inner { padding-top: 40px; }
.mv2-flow-sec .mv2-sec-head { margin-bottom: 24px; }
.mv2-flow-sec .mv2-sec-head__title { font-size: clamp(20px, 1.35vw, 24px); }
.mv2-solution-sec { padding: 0 0 40px; }
.mv2-cases-sec { padding: 40px 0 32px; }
.mv2-cases-sec .mv2-sec-head { margin-bottom: 24px; }
.mv2-cases-sec .mv2-sec-head__title { font-size: clamp(20px, 1.35vw, 24px); }
.mv2-challenge-cta-sec { padding: 0 0 48px; }
main.biz-solution-layout > .biz-dt-section { padding: 0 0 40px; }
main.biz-solution-layout > .biz-dt-section > .inner { padding-top: 40px; }
.portfolio-tabs__btn { min-height: 44px; padding: 10px 24px; font-size: 15px; }
.support-board-section { padding-bottom: 48px; }
main.biz-solution-layout .mv2-flow-sec { padding: 40px 0; }
.process-monitoring-page { --mv-fz-xl: clamp(20px, 1.35vw, 24px); --mv-fz-lg: clamp(18px, 1.2vw, 22px); --mv-fz-sub: 16px; --mv-fz-body: 15px; --mv-fz-sm: 13px; }
.process-monitoring-page > .pm2-monitor-sec > .inner { padding-top: 40px; }
.pm2-monitor-sec { padding: 0 0 40px; }
.pm2-monitor-sec .mv2-sec-head { margin-bottom: 24px; }
.pm2-monitor-sec .mv2-sec-head__title { font-size: clamp(20px, 1.35vw, 24px); }
.device-solution-page { --mv-fz-xl: clamp(20px, 1.35vw, 24px); --mv-fz-sub: 16px; --mv-fz-body: 15px; --mv-fz-sm: 13px; }
.dv2-device-cat-sec { padding: 0 0 40px; }
.device-solution-page .dv2-device-cat-sec > .inner { padding-top: 40px; }
.device-solution-page .dv2-device-cat-sec, .device-solution-page .dv2-why-sec, .device-solution-page .dv2-partners-sec { padding: 0 0 40px; }
.device-solution-page .dv2-device-cat-sec > .inner, .device-solution-page .dv2-why-sec > .inner, .device-solution-page .dv2-partners-sec > .inner, .device-solution-page .dv2-select-sec > .inner { padding-top: 40px; }
.device-solution-page .dv2-select-sec { padding: 0 0 48px; }
.device-solution-page .dv2-why-sec { padding: 0 0 40px; }
.device-solution-page .dv2-why-sec .mv2-sec-head { margin-bottom: clamp(20px, 2vw, 28px); }
.device-solution-page .dv2-partners-sec { padding: 0 0 40px; }
.dv2-select-sec { padding: 0 0 48px; }
.industrial-safety-page { --mv-fz-xl: clamp(20px, 1.35vw, 24px); --mv-fz-lg: clamp(18px, 1.2vw, 22px); --mv-fz-sub: 16px; --mv-fz-body: 15px; --mv-fz-sm: 13px; }
.industrial-safety-page > .mv2-cases-sec > .inner { padding-top: 40px; }
.industrial-safety-page > .is2-suhozone-sec, .industrial-safety-page > .is2-app-sec, .industrial-safety-page > .is2-thermal-sec, .industrial-safety-page > .is2-platform-sec { padding: 0 0 40px; }
.industrial-safety-page > .is2-suhozone-sec > .inner, .industrial-safety-page > .is2-app-sec > .inner, .industrial-safety-page > .is2-thermal-sec > .inner, .industrial-safety-page > .is2-platform-sec > .inner { padding-top: 40px; }
.is2-suhozone-sec { padding: 0 0 40px; }
.industrial-safety-page .is2-suhozone-sec .mv2-sec-head { margin-bottom: clamp(20px, 2vw, 28px); }
.industrial-safety-page .is2-suhozone-sec .mv2-sec-head__title { font-size: clamp(20px, 1.35vw, 24px); }
.is2-app-sec { padding: 0 0 40px; }
.is2-app-sec .mv2-sec-head { margin-bottom: 24px; }
.is2-app-sec .mv2-sec-head__title { font-size: clamp(20px, 1.35vw, 24px); }
.is2-thermal-sec { padding: 0 0 40px; }
.is2-platform-sec { padding: 0 0 40px; }
.is2-platform-sec .mv2-sec-head { margin-bottom: clamp(20px, 2vw, 28px); }
.is2-platform-sec .mv2-sec-head__title { font-size: clamp(20px, 1.35vw, 24px); }
.portfolio-board-page .portfolio-page-head { margin-bottom: 40px; }
.portfolio-board-page .portfolio-tabs { margin-bottom: 40px; }
.support-board-section .support-page-head { margin-bottom: 40px; }
.support-resource-guide { margin-bottom: 40px; }
.inquiry-cat-sec__title { margin: 0 0 clamp(16px, 2vw, 24px); font-size: 28px; }
.inquiry-form-sec__title { font-size: 28px; }
}

@media (max-width: 1024px) {
  .site-header .gnb { display: none; width: 100%; order: 4; }
  .site-header.is-open .gnb { display: flex; }
  .site-header.is-open .gnb-mega { display: block; padding: 16px; }
  .site-header .gnb-mega-cols { flex-direction: column; gap: 24px; }
  .site-header .gnb-mega-col { align-items: flex-start; }
  .site-header .menu-btn { display: flex; }
  .site-header .header-row { flex-wrap: wrap; }
  .sub-hero { height: 260px; }
  .sub-hero__titles { top: 0; bottom: 0; gap: 10px; padding: calc(var(--header-outer-pad) + 64px) 24px 16px; }
  .biz-problem-grid { grid-template-columns: repeat(2, 1fr); }
  .biz-industry-grid { grid-template-columns: repeat(3, 1fr); }
  .biz-product-grid { grid-template-columns: repeat(2, 1fr); }
  .brand-grid { grid-template-columns: repeat(3, 1fr); }
  .item-grid { grid-template-columns: repeat(2, 1fr); }
  .support-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .biz-problem-grid, .biz-industry-grid, .biz-product-grid { grid-template-columns: 1fr; }
  .brand-grid { grid-template-columns: repeat(2, 1fr); }
  .item-grid, .support-grid { grid-template-columns: 1fr; }
  .sub-hero { height: 210px; }
  .sub-hero__titles { top: 0; bottom: 0; gap: 8px; padding: calc(var(--header-outer-pad) + 56px) 16px 12px; }
  .site-header .btn-store { width: 100%; justify-content: center; order: 3; }
}

@media (max-width: 1440px) {
  .main-hero__badge--vision { top: 48%; left: 55%; }
  .main-hero__badge--process { top: 21%; left: 63%; }
  .main-hero__badge--safety { top: 35%; left: 66%; }
}

@media (max-width: 1280px) {
  .main-hero__scene-deco,
  .main-hero__info,
  .main-hero__pin,
  .main-hero--bright .main-hero__zone { display: none; }
}

@media (max-width: 1280px) {
  .main-hero__pin { display: none; }
}

@media (max-width: 1024px) {
  .main-hero--bright { height: auto; min-height: 100svh; }
  .main-hero--bright .main-hero__inner { height: auto; min-height: 100svh; padding-top: clamp(120px, 14vh, 156px); padding-bottom: clamp(80px, 10vh, 120px); justify-content: flex-end; }
  .main-hero--bright .main-hero__content { max-width: 100%; }
  .main-hero--bright .main-hero__scene-dim { background: linear-gradient(180deg, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.72) 46%, rgba(255,255,255,0.58) 100%); }
}

@media (max-width: 640px) {
  .main-hero--bright .main-hero__inner { padding-top: clamp(112px, 13vh, 148px); padding-bottom: clamp(72px, 9vh, 108px); justify-content: flex-end; }
  .main-hero--bright .main-hero__lead { flex-direction: column; align-items: flex-start; gap: 6px; }
  .main-hero--bright .main-hero__lead-sep { display: none; }
  .main-hero--bright .main-hero__sol-cat { word-break: keep-all; white-space: normal; }
  .main-hero--bright .main-hero__sol-desc { white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .main-hero__device { transition: none; }
  .main-hero__device:hover { transform: none; }
  .main-hero--bright .main-hero__sol-text,
  .main-hero__zone,
  .main-hero__info,
  .main-hero__badge { transition: none; }
  .main-hero--bright .main-hero__sol-text:hover { transform: none; opacity: 1; }
  .main-hero__scroll:hover { transform: translateY(2px); }
  .main-hero--bright .main-hero__scroll:hover { transform: translateY(2px); }
  .main-hero__scroll-mouse::after { animation: none; }
}

@media (max-width: 1280px) {
  body[data-nav="main"] {
    --ba-main-tit: 38px;
    --ba-h3: 38px;
    --ba-h5: 26px;
    --ba-h7: 22px;
    --ba-p1: 18px;
    --ba-p2: 18px;
    --ba-p3: 18px;
    --ba-p4: 16px;
    --ba-p5: 15px;
    --ba-p6: 15px;
    --ba-num: 80px;
  }
}

@media (max-width: 1024px) {
  body[data-nav="main"] {
    --ba-main-tit: 34px;
    --ba-h3: 32px;
    --ba-h5: 24px;
    --ba-h7: 20px;
    --ba-num: 64px;
  }
}

@media (max-width: 768px) {
  body[data-nav="main"] {
    --ba-main-tit: 28px;
    --ba-h3: 28px;
    --ba-h5: 22px;
    --ba-h7: 18px;
    --ba-num: 48px;
  }
}

@media (max-width: 600px) {
  body[data-nav="main"] {
    --ba-main-tit: 24px;
    --ba-h3: 24px;
    --ba-h5: 20px;
    --ba-h7: 18px;
    --ba-p1: 16px;
    --ba-p2: 16px;
    --ba-p3: 16px;
    --ba-p4: 15px;
    --ba-p5: 15px;
    --ba-p6: 15px;
    --ba-num: 42px;
    font-size: 16px;
  }
}

@media (max-width: 1024px) {
  .home-challenge-cta__desc { white-space: normal; }
}

@media (max-width: 1024px) {
  .suho-showcase__shell { grid-template-columns: 1fr; min-height: auto; }
  .suho-showcase__panel { max-width: none; align-items: center; }
  .suho-showcase__panel > .suho-showcase__features, .suho-showcase__panel > .suho-showcase__actions { align-self: stretch; }
  .suho-showcase__head, .suho-showcase__desc { text-align: center; }
  .suho-showcase__desc { white-space: normal; }
  .suho-showcase__actions { justify-content: center; }
  .suho-showcase__device { min-height: 220px; max-width: 360px; margin: 0 auto; }
  .suho-showcase__visual img { object-position: center; opacity: 0.42; }
  .suho-showcase__visual-dim { background: linear-gradient(180deg, rgba(246,248,252,0.97) 0%, rgba(246,248,252,0.92) 52%, rgba(238,242,248,0.82) 100%); }
}

@media (max-width: 768px) {
  .suho-showcase__features { grid-template-columns: 1fr; gap: 10px; }
  .suho-showcase__actions { width: 100%; }
  .suho-showcase__actions .btn-primary { flex: 1 1 calc(50% - 6px); min-width: 148px; justify-content: center; }
}

@media (max-width: 480px) {
  .suho-showcase__actions { flex-wrap: nowrap; gap: 8px; }
  .suho-showcase__actions .btn-primary { flex: 1 1 0; min-width: 0; padding-left: 10px; padding-right: 10px; font-size: 14px; gap: 6px; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
  .suho-showcase__feature { transition: none; }
}

@media (max-width: 1200px) {
  .why-yg-flow__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .why-yg-flow__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
  .why-yg-flow__steps { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .why-yg-flow__step { transition: none; }
  .why-yg-flow__step:hover { transform: none; }
}

@media (max-width: 1024px) {
  .why-yg-stats__inner { grid-template-columns: 1fr; }
  .why-yg-stats__copy { max-width: 28em; }
}

@media (max-width: 560px) {
  .why-yg-stats__grid { grid-template-columns: 1fr; gap: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  .why-yg-stats__card-inner,
  .why-yg-stats__photo,
  .why-yg-stats__overlay,
  .why-yg-stats__unit,
  .why-yg-stats__label,
  .why-yg-stats__num .big,
  .why-yg-stats__num .plus { transition: none; }
  .why-yg-stats__card-inner:hover .why-yg-stats__photo,
  .why-yg-stats__card-inner:focus-within .why-yg-stats__photo,
  .why-yg-stats__card-inner.is-active .why-yg-stats__photo { transform: none; }
}

@media (max-width: 1100px) {
  .device-home__layout { grid-template-columns: 1fr; gap: 28px; }
  .device-home__actions { flex-direction: row; flex-wrap: wrap; }
  .device-home__partners-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .device-home__inner { padding-left: 16px; padding-right: 16px; }
  .device-home__board { padding: 20px 12px; gap: 28px; }
  .device-home__catalog { grid-template-columns: 1fr; }
  .device-home__actions { flex-wrap: nowrap; gap: 8px; }
  .device-home__btn { flex: 1 1 0; min-width: 0; min-height: 40px; padding: 0 6px; gap: 4px; font-size: 12px; letter-spacing: -0.02em; }
  .device-home__btn .btn-ico, .device-home__btn .btn-ico svg { width: 10px; height: 10px; }
  .device-home__partners-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .device-home__partner { min-height: 48px; padding: 8px; }
  .device-home__partner img { max-height: 20px; max-width: min(100%, 80px); }
}

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

@media (prefers-reduced-motion: reduce) {
  .hero-sian__pin-ico, .hero-sian__pin-hex { animation: none; }
}

@media (prefers-reduced-motion: reduce) {
  .device-home__col:hover .device-home__stage img { transform: none; }
  .device-home__layer,
  .device-home__plus-btn { transition: none; }
}

@media (max-width: 768px) {
  .quick-menu { gap: 10px; }
  .quick-menu__btn { width: 60px; height: 60px; }
  .quick-menu__btn--youtube img { width: 32px; }
  .quick-menu__btn--top svg { width: 20px; height: 20px; }
  .quick-menu__txt { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .quick-menu__btn { transition: none; }
  .quick-menu__btn:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .customer-logos-track,
  .customer-logos-track--rev { animation: none; }
  .customer-logo, .customer-logo img, .customers-sec__more, .customers-sec__more-ico { transition: none; }
  .customer-logo:hover, .customers-sec__more:hover .customers-sec__more-ico { transform: none; }
}

@media (max-width: 900px) {
  .home-challenge-cta__inner { grid-template-columns: 1fr; text-align: center; justify-items: center; }
  .home-challenge-cta__copy { text-align: center; }
  .home-challenge-cta__bg img { object-position: center 40%; opacity: 0.28; }
  .home-challenge-cta__bg::after { background: linear-gradient(180deg, rgba(9, 39, 113, 0.35) 0%, rgba(9, 39, 113, 0.78) 42%, var(--color-primary) 68%); }
}

@media (max-width: 1023px) {
  .sec-head br,
  .inquiry-page-head br,
  .partner-biz-section__lead br,
  .biz-mv-solution-lead br { display: none; }
  .ceo-greeting-page-title,
  .company-page-title { padding: 80px 0 48px; }
  .ceo-greeting-page-title h2,
  .company-page-title h2 { font-size: 22px; line-height: 1.35em; }
  .ceo-greeting-body { padding-bottom: 40px; }
  .ceo-greeting-body__inner { gap: 20px; }
  .ceo-greeting-visual { height: 180px; }
  .ceo-greeting-copy__line { white-space: normal; }
  .company-history-intro .sec-head p:last-of-type { white-space: normal; }
  .company-partner-intro .sec-head h2 { white-space: normal; }
  .company-location-intro .sec-head h2,
  .company-location-intro .sec-head h2 + p { white-space: normal; }
  .sec-head--oneline p { white-space: normal; }
}

@media (max-width: 1280px) {
  .main-hero--bright .main-hero__title { font-size: clamp(40px, 4.5vw, 56px); }
}

@media (max-width: 1024px) {
  .main-hero { height: auto; min-height: 0; }
  .main-hero__inner { justify-content: center; padding-top: 112px; padding-bottom: 72px; padding-left: var(--hero-align-x); padding-right: var(--hero-align-x); }
  .main-hero__title { font-size: clamp(28px, 5.5vw, 48px); }
  .main-hero--bright .main-hero__title { font-size: clamp(28px, 5.5vw, 48px); }
  .main-hero__slogan { font-size: clamp(16px, 3.6vw, 22px); padding-inline: 16px; }
  .main-hero__nav { grid-template-columns: 1fr; gap: 0; }
  .main-hero__nav-link { padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.12); }
  .main-hero__cards { grid-template-columns: 1fr; max-width: 360px; }
  .main-hero__hud--vision { top: 30%; left: auto; right: 6%; }
  .main-hero__hud--safety { top: 42%; left: 6%; }
  .main-hero__hud--data { display: none; }
  .main-hero__scene-glow { opacity: 0.22; }
  .biz-cards-grid { grid-template-columns: 1fr; }
  .biz-card { height: 280px; }
  .biz-card__bg-wrap--zoom .biz-card__bg { left: 0; top: 0; width: 100%; height: 100%; }
}

@media (max-width: 640px) {
  .main-hero__title { font-size: clamp(24px, 6.5vw, 36px); }
  .main-hero--bright .main-hero__title { font-size: clamp(24px, 6.5vw, 36px); }
  .main-hero__slogan { font-size: clamp(15px, 4vw, 18px); }
  .main-hero__eyebrow { letter-spacing: 0.16em; }
  .main-hero__nav { grid-template-columns: 1fr; gap: 0; }
  .main-hero__hud { display: none; }
  .main-hero__card { min-height: 200px; }
  .biz-card { height: 240px; }
  .biz-cards-grid { grid-template-columns: 1fr; }
  .ceo-greeting-columns { flex-direction: column; }
  .ceo-greeting-sign { text-align: left; }
  .biz-pillar-grid { grid-template-columns: 1fr; }
  .biz-problem-grid .item-thumb { height: 100px; }
  .biz-product-grid .prod-thumb { height: 100px; }
}

@media (max-width: 1199px) {
  .biz-mv-products-sec .biz-featured-products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1023px) {
  .machine-vision-page .biz-dt-head--oneline p,
  .machine-vision-page .biz-dt-note--oneline { white-space: normal; }
  .biz-mv-industry-strip { flex-direction: column; }
  .biz-mv-industry-strip__item { border-right: none; border-bottom: 1px solid var(--color-border); flex-direction: row; align-items: center; justify-content: space-between; }
  .biz-mv-industry-strip__item:last-child { border-bottom: none; }
  .biz-mv-feature-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .biz-mv-stack-flow__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .biz-mv-stack-flow__item:nth-child(3) { border-right: none; }
  .biz-mv-stack-flow__item:nth-child(n+4) { border-top: 1px solid var(--color-border); }
  .biz-mv-stack-flow__item:nth-child(4),
  .biz-mv-stack-flow__item:nth-child(5) { border-right: 1px solid var(--color-border); }
}

@media (max-width: 767px) {
  .biz-mv-feature-grid--2,
  .biz-mv-feature-grid--3 { grid-template-columns: 1fr; }
  .biz-mv-stack-flow__list { grid-template-columns: 1fr; }
  .biz-mv-stack-flow__item { border-right: none; border-bottom: 1px solid var(--color-border); }
  .biz-mv-stack-flow__item:last-child { border-bottom: none; }
  .biz-mv-stack-flow__item:nth-child(n+4) { border-top: none; }
  .biz-mv-products-sec .biz-featured-products-grid { grid-template-columns: 1fr; }
}

@media (max-width: 1200px) {
  .sfd-brand-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
  .sfd-head { flex-direction: column; align-items: flex-start; }
  .sfd-store-link { width: 100%; justify-content: center; }
  .sfd-support-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .sfd-brand-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sfd-product-board { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .sfd-brand-grid,
  .sfd-support-grid { grid-template-columns: 1fr; }
  .sfd-product-group__list li { grid-template-columns: 64px minmax(0, 1fr); min-height: 64px; }
}

@media (max-width: 1024px) {
  .biz-dt-pillars,
  .biz-dt-pillars--4 { grid-template-columns: repeat(2, 1fr); }
  .biz-dt-steps,
  .biz-dt-steps--6 { grid-template-columns: repeat(3, 1fr); }
  .biz-dt-step { border-right: none; padding-right: 0; margin-bottom: 8px; }
  .biz-dt-industry,
  .biz-dt-industry.is-reverse { grid-template-columns: 1fr; direction: ltr; }
  .biz-dt-industry.is-reverse > * { direction: ltr; }
  .biz-dt-product,
  .biz-dt-product.is-reverse { grid-template-columns: 1fr; direction: ltr; }
  .biz-dt-product.is-reverse > * { direction: ltr; }
  .biz-dt-spec-list { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .biz-dt-pillars,
  .biz-dt-pillars--4,
  .biz-dt-pillars--2 { grid-template-columns: 1fr; }
  .biz-dt-steps,
  .biz-dt-steps--6,
  .biz-dt-steps--3 { grid-template-columns: 1fr; }
}

@media (max-width: 1024px) {
  .biz-stack--rich { grid-template-columns: repeat(2, 1fr); }
  .biz-pillar-grid { grid-template-columns: 1fr; }
  .biz-problem-grid .item-thumb { height: 108px; }
  .biz-product-grid .prod-thumb { height: 108px; }
}

@media (max-width: 640px) {
  .biz-stack--rich { grid-template-columns: 1fr; }
  .biz-problem-grid .item-thumb { height: 96px; }
  .biz-product-grid .prod-thumb { height: 96px; }
}

@media (max-width: 1024px) {
  .biz-mv-solution-panel { grid-template-columns: 1fr; }
  .biz-mv-solution-hero img { min-height: 240px; }
}

@media (max-width: 640px) {
  .biz-mv-solution-hero img { min-height: 200px; }
}

@media (max-width: 1024px) {
  .biz-problem-grid--card .item-thumb { height: 132px; }
  .biz-pillar-grid--card .pillar-thumb { height: 140px; }
  .biz-product-grid--card .prod-thumb { height: 132px; }
}

@media (max-width: 640px) {
  .biz-problem-grid--card .item:hover,
  .biz-pillar-grid--card .pillar:hover,
  .biz-product-grid--card .prod:hover { transform: scale(1.02); }
  .biz-problem-grid--card .item-thumb { height: 120px; }
  .biz-pillar-grid--card .pillar-thumb { height: 128px; }
  .biz-product-grid--card .prod-thumb { height: 120px; }
}

@media (prefers-reduced-motion: reduce) {
  .biz-problem-grid--card .item,
  .biz-pillar-grid--card .pillar,
  .biz-product-grid--card .prod,
  .biz-problem-grid--card .item-thumb img,
  .biz-pillar-grid--card .pillar-thumb img,
  .biz-product-grid--card .prod-thumb img { transition: none; }
  .biz-problem-grid--card .item:hover,
  .biz-pillar-grid--card .pillar:hover,
  .biz-product-grid--card .prod:hover { transform: none; }
  .biz-problem-grid--card .item:hover .item-thumb img,
  .biz-pillar-grid--card .pillar:hover .pillar-thumb img,
  .biz-product-grid--card .prod:hover .prod-thumb img { transform: none; }
}

@media (max-width: 640px) {
  .biz-stack--icon .stack-icon { width: 72px; height: 72px; }
  .biz-stack--icon .stack-icon__svg { width: 40px; height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
  .biz-stack--icon .stack-item { transition: none; }
  .biz-stack--icon .stack-item:hover { transform: none; }
}

@media (max-width: 1024px) {
  .biz-industry-visual { grid-template-columns: repeat(3, 1fr); }
  .biz-industry-visual .ind-visual { min-height: 280px; }
  .biz-industry-visual .ind-visual:nth-child(4) { grid-column: span 1; }
}

@media (max-width: 640px) {
  .biz-industry-visual { grid-template-columns: repeat(2, 1fr); }
  .biz-industry-visual .ind-visual { min-height: 240px; }
  .biz-industry-visual .ind-visual:last-child { grid-column: 1 / -1; min-height: 220px; }
}

@media (prefers-reduced-motion: reduce) {
  .biz-industry-visual .ind-visual,
  .biz-industry-visual .ind-visual__img { transition: none; }
  .biz-industry-visual .ind-visual:hover { transform: none; }
  .biz-industry-visual .ind-visual:hover .ind-visual__img { transform: none; }
}

@media (max-width: 1340px) {
  .safety-page #compare .biz-dt-head--oneline p { white-space: normal; }
}

@media (max-width: 1024px) {
  .safety-product-layout { grid-template-columns: 1fr; }
  .safety-page #compare .biz-dt-head--oneline p { white-space: normal; }
  .safety-spec-rows__row { grid-template-columns: 112px minmax(0, 1fr); }
  .safety-tabs,
  .inquiry-page .tab-nav { flex-wrap: wrap; }
  .safety-tabs__btn,
  .inquiry-page .tab-nav button { flex: 1 1 calc(50% - 1px); padding: 16px 12px; font-size: 16px; }
  .safety-compare-cards,
  .safety-feature-grid,
  .safety-env-grid,
  .safety-rec-grid { grid-template-columns: 1fr; }
  .safety-spec-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .spec-table th,
  .spec-table td { padding: 12px var(--gap-sm); }
  .safety-spec-rows__row { grid-template-columns: 1fr; }
  .safety-spec-rows__row dt { border-bottom: 1px solid var(--color-border); }
  .safety-tabs__btn,
  .inquiry-page .tab-nav button { flex: 1 1 100%; padding: 14px 12px; font-size: 16px; }
}

@media (max-width: 1024px) {
  .support-process-stack { grid-template-columns: repeat(2, 1fr); }
  .support-resource-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .support-process-stack { grid-template-columns: 1fr; }
  .support-inquiry-btns { flex-direction: column; align-items: stretch; }
  .support-inquiry-btns .btn-primary { justify-content: center; }
}

@media (max-width: 1340px) {
  .vision-mission-block__desc--oneline { white-space: normal; font-size: var(--fs-body); }
}

@media (max-width: 1024px) {
  .company-value-block { grid-template-columns: 1fr; padding: var(--gap-md); }
  .vision-mission-facts { flex-direction: column; }
  .vision-mission-facts li { border-right: none; border-bottom: 1px solid var(--color-border); }
  .vision-mission-facts li:last-child { border-bottom: none; }
  .vision-values-list { grid-template-columns: repeat(2, 1fr); }
  .vision-philosophy-list__item { grid-template-columns: 44px 56px 1fr; }
  .vision-philosophy-list__icon { width: 56px; height: 56px; border-radius: 14px; }
  .vision-philosophy-list__icon svg { width: 26px; height: 26px; }
  .location-card__body { grid-template-columns: 1fr; }
  .location-card__map { border-left: none; border-top: 1px solid var(--color-border); min-height: 300px; }
  .location-card__map img, .location-card__map iframe { min-height: 300px; height: clamp(300px, 46vw, 380px); }
  .location-route-list { grid-template-columns: 1fr; }
  .location-card__row { grid-template-columns: 132px minmax(0, 1fr); }
  .history-zigzag::before { left: 20px; transform: none; }
  .history-zigzag__item,
  .history-zigzag__item.is-right,
  .history-zigzag__item.is-left { grid-template-columns: 40px minmax(0, 1fr); column-gap: 16px; }
  .history-zigzag__spacer { display: none; }
  .history-zigzag__node { grid-column: 1; grid-row: 1; margin-top: 8px; justify-self: center; align-self: start; }
  .history-zigzag__content,
  .history-zigzag__item.is-right .history-zigzag__content,
  .history-zigzag__item.is-left .history-zigzag__content { grid-column: 2; grid-row: 1; text-align: left; }
  .history-zigzag__item.is-left .history-zigzag__events li { flex-direction: row; text-align: left; }
  .location-office-block__body,
  .location-office-block__body--vina { grid-template-columns: 1fr; }
  .location-office-block__map { border-left: none; border-top: 1px solid var(--color-border); }
  .location-office-block__body--vina .location-office-block__map { border-right: none; }
  .location-access-grid { grid-template-columns: 1fr; }
  .location-info-dl__row { grid-template-columns: 72px 1fr; }
  .mv-capability-grid { grid-template-columns: repeat(2, 1fr); }
  .mv-stack-table { grid-template-columns: repeat(3, 1fr); }
  .value-icon-grid { grid-template-columns: 1fr; }
  .philosophy-formula { grid-template-columns: 1fr; }
  .philosophy-formula__op { padding: 4px 0; }
  .company-office-grid { grid-template-columns: 1fr; }
  .company-info-dl__row { grid-template-columns: 1fr; gap: 8px; }
}

@media (max-width: 640px) {
  .mv-capability-grid,
  .mv-stack-table { grid-template-columns: 1fr; }
  .mission-map { grid-template-columns: 1fr; }
  .mission-map__arrow { justify-self: center; transform: rotate(90deg); }
  .mission-steps { grid-template-columns: 1fr; }
  .mission-steps li { border-left: none; border-top: 1px solid var(--color-border); }
  .mission-steps li:first-child { border-top: none; }
  .company-office-card__links { flex-direction: column; }
  .company-office-card__links .btn-primary { justify-content: center; width: 100%; }
  .vision-values-list { grid-template-columns: 1fr; }
  .vision-philosophy-list__item { grid-template-columns: 40px 48px 1fr; gap: 14px; align-items: start; }
  .vision-philosophy-list__icon { width: 48px; height: 48px; border-radius: 12px; }
  .vision-philosophy-list__icon svg { width: 24px; height: 24px; }
  .location-card__row { grid-template-columns: 1fr; gap: 8px; }
  .location-route-item { grid-template-columns: 1fr; gap: 16px; min-height: 0; padding: clamp(28px, 4vw, 36px); }
  .location-route-item__tag { flex-direction: row; align-items: center; justify-content: flex-start; gap: 12px; }
}

@media (max-width: 1024px) {
  .biz-featured-products-grid { grid-template-columns: repeat(2, 1fr); }
}

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

@media (min-width: 1025px) {
  .product-hub-page #cat-vision .product-card-grid { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 1024px) {
  .product-card-grid { grid-template-columns: repeat(2, 1fr); }
  .product-hub-grid--3 { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .product-card-grid { grid-template-columns: 1fr; }
  .product-hub-grid--brand { grid-template-columns: 1fr; }
  .product-hub-nav { justify-content: flex-start; }
  .product-hub-nav__link { flex: 1 1 calc(50% - var(--gap-sm)); }
  .product-detail-head__list { margin-left: 0; width: auto; justify-content: center; flex: 1 1 100%; border-left: 1px solid var(--color-border); border-top: none; }
  .product-detail-head__actions { flex-wrap: wrap; gap: var(--gap-sm); }
  .product-detail-view-tab { flex: 1 1 calc(50% - var(--gap-sm)); min-height: 44px; }
}

@media (max-width: 1024px) {
  .partner-logo-wall { grid-template-columns: repeat(auto-fill, 148px); }
  .partner-logo-tile, .partner-logo-wall--customer .partner-logo-tile { width: 148px; height: 80px; padding: 10px 12px; }
  .partner-logo-tile img, .partner-logo-wall--customer .partner-logo-tile img { max-width: 108px; max-height: 36px; }
}

@media (max-width: 640px) {
  .partner-logo-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; }
  .partner-logo-tile, .partner-logo-wall--customer .partner-logo-tile { width: 100%; height: 72px; padding: 10px 12px; }
  .partner-logo-tile img, .partner-logo-wall--customer .partner-logo-tile img { max-width: min(100%, 108px); max-height: 32px; }
}

@media (max-width: 768px) { .board-form .form-row { grid-template-columns: 1fr; } }

@media (max-width: 1024px) {

  .portfolio-case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

}

@media (max-width: 768px) {

  .board-toolbar,

  .portfolio-board-toolbar,

  .support-board-toolbar { flex-direction: column; align-items: stretch; }

  .board-search,

  .portfolio-board-search,

  .support-board-search { margin-left: 0; width: 100%; }

  .board-search__input,

  .portfolio-board-search__input,

  .support-board-search__input { flex: 1; min-width: 0; }

}

@media (max-width: 640px) {

  .portfolio-case-grid { grid-template-columns: 1fr; }

  .portfolio-case-card__thumb { height: clamp(200px, 56vw, 242px); }

}

@media (max-width: 1024px) {
  .inquiry-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inquiry-cat-sec__title, .inquiry-form-sec__title { font-size: 24px; line-height: 1.35em; }
  .inquiry-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inquiry-layout { grid-template-columns: 1fr; }
  .inquiry-aside { position: relative; top: auto; }
}

@media (max-width: 768px) {
  .inquiry-grid--2,
  .inquiry-grid--3,
  .inquiry-section-row--2,
  .inquiry-cat-grid,
  .inquiry-form-v2 .inquiry-grid--2 { grid-template-columns: 1fr; }
  .inquiry-section__body { padding: 20px 16px; }
  .inquiry-form-v2 .inquiry-section__body { padding: 16px; }
  .inquiry-form-v2 .inquiry-actions { justify-content: center; }
}

@media (min-width: 769px) {
.board-list-m { display: none; }
}

@media (max-width: 768px) {
:root { --fs-body: 16px; --fs-body-lg: 18px; --fs-body-sm: 14px; --fs-subhead: 24px; --fs-gnb: 16px; --gap-section: 48px; --gap-md: 16px; --gap-sm: 12px; --gap-head-content: 16px; --header-outer-pad: 12px; --header-inner-pad: 16px; }
.site-header { height: 60px; padding: 0; }
.site-header > .inner-wide { height: 60px; padding-left: 12px; padding-right: 12px; }
.site-header .header-card { height: 60px; border-radius: 12px; }
.site-header .header-row { height: 60px; min-height: 60px; padding: 0 16px; flex-wrap: nowrap; }
.site-header .logo img { height: 22px; }
.site-header .btn-store { display: none; }
.site-header .menu-btn { display: flex; width: 28px; height: 28px; justify-content: center; }
.site-header .gnb, .site-header.is-open .gnb, .site-header.is-open .gnb-mega, .submenu-bg { display: none; }
.main-hero, .main-hero--bright, .main-visual { height: 150vw; min-height: 150vw; max-height: none; }
.main-hero.main-hero--sian { height: auto; min-height: 0; }
.main-hero__inner, .main-hero--bright .main-hero__inner { height: 100%; min-height: 0; padding-top: 76px; padding-bottom: 28px; padding-left: 16px; padding-right: 16px; justify-content: flex-end; }
.main-hero__title, .main-hero--bright .main-hero__title { font-size: 28px; line-height: 1.3em; }
.main-hero--bright .main-hero__sol-grid { display: none; }
.main-hero--bright .main-hero__desc { font-size: 14px; line-height: 1.6em; }
.main-hero--bright .main-hero__keywords { font-size: 12px; line-height: 1.5em; }
.main-hero__slogan { font-size: 16px; line-height: 1.5em; }
.page-hero-wrap ~ section { padding-top: 56px; padding-bottom: 56px; }
.sub-hero { height: 210px; }
.sub-hero__titles { top: 0; bottom: 0; gap: 8px; padding: calc(var(--header-outer-pad) + 56px) 16px 12px; }
.sub-hero-nav__pill.is-open .sub-hero-nav__dropdown { left: 0; right: auto; width: max-content; min-width: 100%; max-width: calc(100vw - 32px); box-sizing: border-box; }
.sub-hero-nav__pill.is-open:last-child .sub-hero-nav__dropdown { left: auto; right: 0; }
.sub-hero-nav__dropdown a { padding: 8px 14px; font-size: 13px; line-height: 1.4em; white-space: nowrap; }
.portfolio-board-page .portfolio-page-head, .portfolio-board-page .portfolio-tabs, .inquiry-page .inquiry-page-head, .inquiry-cat-sec, .support-board-section .support-page-head { margin-bottom: 32px; }
.inquiry-cat-sec__title, .inquiry-form-sec__title { font-size: 22px; line-height: 1.35em; }
.real-cont.inquiry-page { padding: 40px 15px 64px; }
body[data-nav="works"] #contArea { padding: var(--sub-hero-gap) 0 48px; }
.inner, .biz-cards-sec__inner, body[data-nav="works"] #contArea .real-cont { padding-left: 15px; padding-right: 15px; }
.site-footer { padding: 40px 15px; }
.site-footer .footer-top { margin-bottom: 24px; }
.site-footer .footer-logo img { height: 28px; }
.site-footer .btn-top { width: 44px; height: 44px; }
.site-footer .addr-row { font-size: 15px; line-height: 1.55em; gap: 10px; }
.site-footer .addr-row .sep { height: 16px; }
.site-footer .biz-info { margin-top: 16px; font-size: 15px; line-height: 1.5em; gap: 8px 16px; }
.site-footer .footer-line { margin: 28px 0; }
.site-footer .footer-bottom { font-size: 14px; line-height: 1.5em; gap: 10px 16px; }
.portfolio-case-grid { grid-template-columns: 1fr; }
.portfolio-case-card__thumb { height: 200px; }
#menu.mobile-navigation { display: none; position: fixed; top: 0; right: 0; z-index: 400; width: min(86vw, 360px); height: 100vh; padding: 24px 20px 40px; background: var(--color-white); box-shadow: -8px 0 24px rgba(0,0,0,0.12); overflow-y: auto; }
#menu.mobile-navigation.is-open { display: block; }
#menu.mobile-navigation .home { margin-bottom: 20px; font-size: 14px; font-weight: 700; line-height: 1.4em; }
#menu.mobile-navigation .nav-menu > ul { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
#menu.mobile-navigation .nav-menu > ul > li > a { display: block; padding: 12px 0; font-size: 18px; font-weight: 700; line-height: 1.4em; color: var(--color-heading); }
#menu.mobile-navigation .nav-menu ul ul { margin: 0; padding: 0 0 8px 12px; list-style: none; }
#menu.mobile-navigation .nav-menu ul ul a { display: block; padding: 8px 0; font-size: 15px; line-height: 1.4em; color: var(--color-body); }
#menu.mobile-navigation .close { position: absolute; top: 16px; right: 16px; width: 32px; height: 32px; border: 0; background: transparent; }
#menu.mobile-navigation .close::before, #menu.mobile-navigation .close::after { content: ""; position: absolute; top: 15px; left: 6px; width: 20px; height: 2px; background: var(--color-heading); }
#menu.mobile-navigation .close::before { transform: rotate(45deg); }
#menu.mobile-navigation .close::after { transform: rotate(-45deg); }
.mobile-overlay { display: none; position: fixed; inset: 0; z-index: 350; background: rgba(0,0,0,0.45); }
.mobile-overlay.is-open { display: block; }
body.nav-open { overflow: hidden; }
.board-list { display: none; }
.board-list-m { display: block; }
.board-list-m ul { margin: 0; padding: 0; list-style: none; }
.board-list-m li { padding: 16px 0; border-bottom: 1px solid var(--color-border); }
.board-list-m .tit { font-size: 16px; font-weight: 600; line-height: 1.5em; }
.board-list-m a { color: var(--color-heading); text-decoration: none; }
.board-list-m .info { margin-top: 8px; font-size: 13px; color: var(--color-muted); line-height: 1.4em; }
.support-board-table-wrap { overflow: visible; }
.support-board-table { min-width: 0; }
.support-board-table thead { display: none; }
.support-board-table, .support-board-table tbody, .support-board-table tr, .support-board-table td { display: block; width: 100%; }
.support-board-table tr { padding: 16px 0; border-bottom: 1px solid var(--color-border); }
.support-board-table td { padding: 4px 0; border: 0; text-align: left; font-size: 14px; line-height: 1.5em; }
.support-board-table td.support-board-table__title { font-size: 16px; font-weight: 600; line-height: 1.45em; }
.support-board-table td.support-board-table__attach { padding-top: 8px; }
}

/* ===== 서브페이지 콘텐츠 ===== */
@media (max-width: 768px) {
.ceo-greeting-headline { white-space: normal; }
.ceo-greeting-split { grid-template-columns: 1fr; }
.vm-value-cards { grid-template-columns: 1fr; }
.vm-value-card, .vm-value-card:nth-child(odd), .vm-value-card:nth-child(2n) { border-right: none; border-bottom: 1px solid rgba(9, 39, 113, 0.1); }
.vm-value-card:last-child { border-bottom: none; }
.location-card__map-overlay span { white-space: normal; text-align: center; }
.location-route-card { padding: clamp(24px, 4vw, 32px); }
.machine-vision-page .mv2-intro__lead { white-space: normal; }
.mv2-intro__tags { gap: 8px; padding: 0; background: none; border: none; }
.mv2-intro__tags li { border-radius: 14px; }
.mv2-integ { flex-direction: column; gap: clamp(20px, 4vw, 26px); }
.mv2-integ__card { flex: 1 1 auto; width: 100%; }
.mv2-integ__card .mv2-integ__arrow { display: flex !important; top: auto; right: 50%; bottom: -16px; transform: translate(50%, 50%); }
.mv2-integ__card:last-child .mv2-integ__arrow { display: none !important; }
.mv2-case-item { flex-wrap: wrap; align-items: flex-start; gap: 16px 20px; padding: 24px 16px; }
.mv2-case-item__num { width: 40px; font-size: 26px; }
.mv2-case-item__content { flex: 1 1 calc(100% - 60px); order: 1; }
.mv2-case-item__thumb { order: 2; width: 100%; max-width: none; aspect-ratio: 16 / 9; border-radius: var(--mv-card-radius); }
.mv2-challenge-cta__inner { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 24px; padding: 32px 24px; }
.mv2-challenge-cta__copy { text-align: center; }
.mv2-challenge-cta__bg img { object-position: center 40%; opacity: 0.26; }
.mv2-challenge-cta__bg::after { background: linear-gradient(180deg, rgba(9, 39, 113, 0.35) 0%, rgba(9, 39, 113, 0.78) 42%, var(--color-primary) 68%); }
.mv2-solution-sec .mv2-sec-head__title { white-space: normal; }
.machine-vision-page .mv2-solution-sec .mv2-sec-head__desc { white-space: normal; }
.process-monitoring-page .mv2-intro__lead { white-space: normal; }
.pm2-aibox { grid-template-columns: 1fr; gap: 24px; padding: 28px 24px 28px 28px; }
.pm2-aibox__visual { width: 88px; height: 88px; margin: 0 auto; }
.pm2-aibox__visual svg { width: 44px; height: 44px; }
.pm2-aibox__feats li { white-space: normal; }
.pm2-monitor-grid { grid-template-columns: 1fr; }
.process-monitoring-page .mv2-integ__card { flex: 1 1 auto; width: 100%; }
.process-monitoring-page .mv2-integ__card .mv2-integ__arrow { display: flex !important; top: auto; right: 50%; bottom: -16px; transform: translate(50%, 50%); }
.process-monitoring-page .mv2-integ__card:last-child .mv2-integ__arrow { display: none !important; }
.process-monitoring-page .mv2-solution-sec .mv2-sec-head__desc { white-space: normal; }
.pm2-monitor-card__desc { font-size: 14px; }
.device-solution-page .mv2-intro__tags { gap: 8px; padding: 0; background: none; border: none; }
.device-solution-page .mv2-intro__tags li { border-radius: 14px; }
.dv2-device-cat-grid { grid-template-columns: 1fr; }
.dv2-why-steps { grid-template-columns: 1fr; }
.dv2-partners-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dv2-select-grid { grid-template-columns: 1fr; }
.mv2-case-item__desc,
.machine-vision-page .mv2-case-item__desc { font-size: 14px; margin-bottom: 10px; }
.mv2-case-item__tags li { font-size: 14px; }
.industrial-safety-page .mv2-intro__lead { white-space: normal; }
.is2-app-grid { grid-template-columns: 1fr; }
.is2-platform-sources { flex-wrap: wrap; }
.is2-platform-source { flex: 1 1 calc(50% - 10px); }
.is2-platform-plus { display: none; }
.is2-platform-result { min-height: 240px; padding: 36px 24px; }
.industrial-safety-page .is2-suhozone-sec .mv2-sec-head__title { white-space: normal; }
.is2-suhozone-spot__grid { grid-template-columns: 1fr; }
.is2-suhozone-spot__grid-item:last-child:nth-child(odd) { grid-column: auto; max-width: none; }
.industrial-safety-page .mv2-integ__card { flex: 1 1 auto; width: 100%; }
.industrial-safety-page .mv2-integ__card .mv2-integ__arrow { display: flex !important; top: auto; right: 50%; bottom: -16px; transform: translate(50%, 50%); }
.industrial-safety-page .mv2-integ__card:last-child .mv2-integ__arrow { display: none !important; }
.mv2-challenge-cta__desc { white-space: normal; }
.industrial-safety-page .mv2-solution-sec .mv2-sec-head__desc { white-space: normal; }
}
@media (max-width: 900px) {
.support-resource-guide__list { grid-template-columns: 1fr; }
.support-resource-guide__item { flex-direction: row; align-items: center; }
.support-resource-guide__head { flex-direction: column; align-items: stretch; }
.support-resource-guide__btn { width: 100%; }
}
@media (max-width: 1024px) {
.ceo-greeting-headline { white-space: normal; }
.ceo-greeting-quote__text { white-space: normal; }
.ceo-greeting-split { grid-template-columns: 1fr; }
#company-vision-main > .company-page-title { padding: 80px 0 40px; }
#company-vision-main .company-page-title h2 { font-size: 22px; line-height: 1.35em; }
#company-vision-main > .biz-section { padding: 32px 0; }
#company-vision-main > .vm-values-sec { padding-top: 32px; padding-bottom: 32px; }
#company-vision-main > .vm-philosophy-sec { padding-top: 32px; padding-bottom: 40px; }
#company-vision-main > .vm-mv-tech-group .vm-mv-sec { padding-top: 0; padding-bottom: 20px; }
#company-vision-main > .vm-mv-tech-group .vm-tech-sec { padding-top: 28px; padding-bottom: 32px; }
.vm-mv-grid { grid-template-columns: 1fr; }
.vm-mv-block { padding: 20px; }
.vm-mv-block__icon { bottom: 16px; right: 16px; width: 48px; height: 48px; }
.vm-mv-block__text { padding-bottom: 40px; }
.vm-tech-flow { flex-direction: column; gap: 12px; }
.vm-tech-flow__arrow { width: auto; height: 28px; font-size: 28px; transform: rotate(90deg); opacity: 0.85; }
.vm-value-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vm-value-card { border-right: none; border-bottom: 1px solid rgba(9, 39, 113, 0.1); }
.vm-value-card:nth-child(odd) { border-right: 1px solid rgba(9, 39, 113, 0.1); }
.vm-value-card:nth-child(2n) { border-right: none; }
.vm-value-card:nth-last-child(-n+2) { border-bottom: none; }
.vm-value-card__desc { max-width: none; }
.vm-philosophy-list__item { gap: 16px; padding: 22px 20px; }
#company-history-main > .company-page-title { padding: 80px 0 40px; }
.company-history-sec { padding-bottom: 150px; }
.history-rail::before, .history-rail::after { left: 19px; }
.history-rail__item { grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: auto auto auto; column-gap: 16px; row-gap: 16px; }
.history-rail__meta { grid-column: 2; grid-row: 1; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px 12px; text-align: left; padding-top: 0; }
.history-rail__year { margin: 0; }
.history-rail__node { grid-column: 1; grid-row: 1 / span 3; margin-top: 4px; align-self: start; }
.history-rail__body { grid-column: 2; grid-row: 2; }
.history-rail__thumb { grid-column: 2; grid-row: 3; }
#company-location-main > .company-page-title { padding: 80px 0 40px; }
#company-location-main .company-page-title h2 { font-size: 22px; line-height: 1.35em; }
#company-location-main > .location-site-sec { padding-bottom: 32px; }
#company-location-main > .location-route-sec { padding-top: 32px; padding-bottom: 40px; }
.location-route-grid { grid-template-columns: 1fr; }
.mv2-case-item__thumb { width: clamp(240px, 36vw, 320px); }
.mv2-intro { grid-template-columns: 1fr; }
.mv2-intro__media { order: -1; aspect-ratio: 16 / 9; }
.mv2-solution-sec .mv2-feat-list { grid-template-columns: 1fr; gap: clamp(14px, 2vw, 20px); }
.mv2-solution-sec .mv2-feat-item:last-child:nth-child(odd) { grid-column: auto; justify-self: stretch; width: auto; }
.mv2-integ { flex-wrap: wrap; gap: clamp(18px, 2vw, 24px); }
.mv2-integ__card { flex: 1 1 calc(50% - 12px); }
.mv2-integ__card:nth-child(2) .mv2-integ__arrow, .mv2-integ__card:nth-child(4) .mv2-integ__arrow { display: none; }
.mv2-integ__card:nth-child(1) .mv2-integ__arrow, .mv2-integ__card:nth-child(3) .mv2-integ__arrow { display: flex; top: 50%; right: calc((clamp(18px, 2vw, 24px) / 2 + 21px) * -1); bottom: auto; left: auto; transform: translateY(-50%); }
.process-monitoring-page .mv2-integ__card { flex: 1 1 calc(50% - 12px); }
.process-monitoring-page .mv2-integ__card:nth-child(n) .mv2-integ__arrow { display: none; }
.process-monitoring-page .mv2-integ__card:nth-child(odd):not(:last-child) .mv2-integ__arrow { display: flex; top: 50%; right: calc((clamp(18px, 2vw, 24px) / 2 + 21px) * -1); bottom: auto; left: auto; transform: translateY(-50%); }
.pm2-monitor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pm2-monitor-grid > li:last-child:nth-child(odd) { grid-column: 1 / -1; width: calc(50% - 10px); justify-self: center; }
.dv2-device-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dv2-partners-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.industrial-safety-page .mv2-integ__card { flex: 1 1 calc(50% - 12px); }
.industrial-safety-page .mv2-integ__card:nth-child(n) .mv2-integ__arrow { display: none; }
.industrial-safety-page .mv2-integ__card:nth-child(odd):not(:last-child) .mv2-integ__arrow { display: flex; top: 50%; right: calc((clamp(18px, 2vw, 24px) / 2 + 21px) * -1); bottom: auto; left: auto; transform: translateY(-50%); }
.is2-app-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.is2-suhozone-spot__top { grid-template-columns: 1fr; }
.is2-suhozone-spot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.is2-suhozone-spot__grid-item:last-child:nth-child(odd) { grid-column: 1 / -1; width: 100%; max-width: calc(50% - clamp(6px, 0.6vw, 8px)); justify-self: start; }
.is2-thermal { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
.company-page-title,
.ceo-greeting-page-title,
#company-vision-main > .company-page-title,
#company-history-main > .company-page-title,
#company-location-main > .company-page-title,
.biz-solution-layout .company-page-title { padding: 80px 0 48px; }
.company-page-title h2,
.ceo-greeting-page-title h2,
#company-vision-main .company-page-title h2,
#company-location-main .company-page-title h2,
.inquiry-page-head h2,
.support-page-head h2,
.portfolio-page-head h2 { font-size: 20px; line-height: 1.35em; }
.company-page-title__desc,
.inquiry-page-head p,
.support-page-head p,
.portfolio-page-head p { margin-top: 8px; font-size: 14px; line-height: 1.6em; }
.ceo-greeting-body { padding-bottom: 32px; }
.ceo-greeting-visual { height: 160px; }
.ceo-greeting-lead__line,
.ceo-greeting-headline { font-size: 18px; line-height: 1.4em; }
.ceo-greeting-quote__text { font-size: 15px; line-height: 1.6em; }
#company-vision-main > .biz-section,
#company-vision-main > .vm-values-sec,
#company-vision-main > .vm-philosophy-sec { padding-top: 24px; padding-bottom: 28px; }
.vm-sec-head,
.mv2-sec-head,
.mv2-flow-sec .mv2-sec-head,
.mv2-cases-sec .mv2-sec-head,
.pm2-monitor-sec .mv2-sec-head,
.is2-app-sec .mv2-sec-head { margin-bottom: 16px; }
.mv2-sec-head__title,
.mv2-solution-sec .mv2-sec-head__title,
.mv2-flow-sec .mv2-sec-head__title,
.mv2-cases-sec .mv2-sec-head__title,
.pm2-monitor-sec .mv2-sec-head__title,
.is2-app-sec .mv2-sec-head__title,
.is2-platform-sec .mv2-sec-head__title,
.industrial-safety-page .is2-suhozone-sec .mv2-sec-head__title,
.vm-sec-head__title { font-size: 18px; line-height: 1.35em; }
.mv2-intro { gap: 16px; }
.mv2-intro-sec { padding: 24px 0 28px; }
.mv2-solution-sec,
.pm2-monitor-sec,
.dv2-device-cat-sec,
.is2-suhozone-sec,
.is2-app-sec,
.is2-thermal-sec,
.is2-platform-sec,
.device-solution-page .dv2-why-sec,
.device-solution-page .dv2-partners-sec,
.device-solution-page .dv2-select-sec,
.mv2-challenge-cta-sec { padding-bottom: 28px; }
.mv2-solution-sec > .inner,
.machine-vision-page > .mv2-cases-sec > .inner,
.process-monitoring-page > .pm2-monitor-sec > .inner,
.device-solution-page .dv2-device-cat-sec > .inner,
.device-solution-page .dv2-why-sec > .inner,
.device-solution-page .dv2-partners-sec > .inner,
.industrial-safety-page > .is2-suhozone-sec > .inner,
.industrial-safety-page > .is2-app-sec > .inner,
.industrial-safety-page > .is2-thermal-sec > .inner,
.industrial-safety-page > .is2-platform-sec > .inner,
main.biz-solution-layout > .biz-dt-section > .inner { padding-top: 24px; }
.biz-dt-section,
.safety-page .biz-dt-section { padding-top: 24px; padding-bottom: 24px; }
.biz-mv-feature-card { padding: 20px 16px; }
.vm-value-card { padding: 16px 12px; }
.vm-philosophy-list__item { padding: 16px; }
.company-history-sec { padding-bottom: 150px; }
.history-rail__item { margin-bottom: 40px; }
#company-history-main { --vm-fz-lg: 18px; --vm-fz-sub: 16px; --vm-fz-body: 14px; --vm-fz-sm: 12px; }
#company-history-main .company-page-title h2 { font-size: 20px; line-height: 1.35em; }
#company-history-main .history-rail__tag { font-size: 12px; line-height: 1.3em; padding: 3px 8px; }
.real-cont.inquiry-page { padding: var(--sub-hero-gap) 15px 40px; }
body[data-nav="works"] #contArea { padding: var(--sub-hero-gap) 0 40px; }
.support-board-section { padding: var(--sub-hero-gap) 0 40px; }
.mv2-intro-sec { padding-top: var(--sub-hero-gap); }
.inquiry-cat-sec__title,
.inquiry-form-sec__title { font-size: 20px; line-height: 1.35em; }
.pm2-monitor-grid { grid-template-columns: 1fr; }
.pm2-monitor-grid > li:last-child:nth-child(n) { grid-column: auto; width: auto; max-width: none; justify-self: stretch; }
.mv2-integ { flex-direction: column; }
.mv2-integ__card, .process-monitoring-page .mv2-integ__card, .industrial-safety-page .mv2-integ__card { flex: 1 1 auto; width: 100%; }
main.biz-solution-layout .mv2-flow-sec .mv2-integ__card:nth-child(n) .mv2-integ__arrow, .process-monitoring-page .mv2-integ__card:nth-child(n):not(:last-child) .mv2-integ__arrow, .industrial-safety-page .mv2-integ__card:nth-child(n):not(:last-child) .mv2-integ__arrow { display: flex; top: auto; right: 50%; bottom: -10px; left: auto; transform: translate(50%, 50%) rotate(90deg); }
main.biz-solution-layout .mv2-flow-sec .mv2-integ__card:last-child .mv2-integ__arrow, .process-monitoring-page .mv2-integ__card:last-child .mv2-integ__arrow, .industrial-safety-page .mv2-integ__card:last-child .mv2-integ__arrow { display: none; }
.mv2-intro__tags { gap: 8px; }
.is2-app-grid { grid-template-columns: 1fr; }
.is2-suhozone-spot__grid { grid-template-columns: 1fr; }
.is2-suhozone-spot__grid-item:last-child:nth-child(n) { grid-column: auto; width: auto; max-width: none; justify-self: stretch; }
.is2-suhozone-spot__intro { padding: 16px; }
.dv2-device-cat-grid { grid-template-columns: 1fr; }
.dv2-partners-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
body:not([data-nav="main"]) { --sub-hero-gap: 32px; }
}
@media (max-width: 768px) {
body:not([data-nav="main"]) { --sub-hero-gap: 24px; }
}
@media (max-width: 1024px) {
.portfolio-board-page .portfolio-page-head h2 { font-size: 22px; line-height: 1.35em; }
.portfolio-board-page .portfolio-case-card__title { font-size: 16px; line-height: 1.4em; }
.portfolio-board-page .portfolio-tabs__btn,
.support-board-section .portfolio-tabs__btn { min-height: 44px; padding: 10px 18px; font-size: 14px; line-height: 1.4em; }
.support-board-section .support-page-head h2 { font-size: 20px; line-height: 1.35em; }
#contArea .board-view-tit h3 { font-size: 20px; line-height: 1.4em; }
}
@media (max-width: 1024px) {
.portfolio-board-page .portfolio-case-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; row-gap: 24px; }
.portfolio-board-page .portfolio-case-card__thumb { height: 200px; }
.portfolio-board-page .portfolio-case-card__body { padding: 16px; gap: 8px; }
.support-board-section .support-resource-guide__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.support-board-section .support-resource-guide__item:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 768px) {
.portfolio-board-page .portfolio-case-grid { grid-template-columns: 1fr; row-gap: 20px; }
.portfolio-board-page .portfolio-case-card__thumb { height: auto; aspect-ratio: 16 / 9; }
.portfolio-board-page .portfolio-case-card__body { padding: 14px 14px 16px; gap: 8px; }
.portfolio-board-page .portfolio-case-card__title { font-size: 16px; line-height: 1.4em; }
.portfolio-board-page .portfolio-case-card__desc { font-size: 14px; line-height: 1.6em; }
.portfolio-board-page .portfolio-case-card__date { font-size: 13px; line-height: 1.4em; }
.portfolio-board-page .portfolio-page-head h2 { font-size: 20px; line-height: 1.35em; }
.portfolio-board-page .portfolio-page-head p { margin-top: 8px; font-size: 14px; line-height: 1.6em; }
.portfolio-board-page .portfolio-tabs,
.support-board-section .portfolio-tabs { flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 24px; }
.portfolio-board-page .portfolio-tabs__btn,
.support-board-section .portfolio-tabs__btn { flex: 0 0 auto; max-width: 100%; min-height: 40px; padding: 8px 16px; font-size: 13px; line-height: 1.4em; text-align: center; white-space: normal; }
.portfolio-board-page .portfolio-board-toolbar,
.support-board-section .support-board-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
.portfolio-board-page .portfolio-board-search,
.support-board-section .support-board-search { margin-left: 0; width: 100%; }
.portfolio-board-page .portfolio-board-search__input,
.support-board-section .support-board-search__input { flex: 1 1 0; min-width: 0; }
.support-board-section .support-page-head h2 { font-size: 20px; line-height: 1.35em; }
.support-board-section .support-page-head p { margin-top: 8px; font-size: 14px; line-height: 1.6em; }
.support-board-section .support-resource-guide { margin-bottom: 24px; padding: 16px; }
.support-board-section .support-resource-guide__head { flex-direction: column; align-items: stretch; }
.support-board-section .support-resource-guide__btn { width: 100%; }
.support-board-section .support-resource-guide__title { font-size: 16px; line-height: 1.4em; }
.support-board-section .support-resource-guide__text { font-size: 14px; line-height: 1.6em; }
.support-board-section .support-resource-guide__nowrap { white-space: normal; }
.support-board-section .support-resource-guide__list { grid-template-columns: 1fr; }
.support-board-section .support-resource-guide__item:last-child:nth-child(n) { grid-column: auto; width: auto; }
.support-board-section .support-board-table-wrap { overflow: visible; }
.support-board-section .support-board-table { min-width: 0; width: 100%; }
.support-board-section .support-board-table thead { display: none; }
.support-board-section .support-board-table,
.support-board-section .support-board-table tbody,
.support-board-section .support-board-table tr,
.support-board-section .support-board-table td { display: block; width: 100%; box-sizing: border-box; }
.support-board-section .support-board-table tr { padding: 14px 0; border-bottom: 1px solid var(--color-border); }
.support-board-section .support-board-table td { padding: 2px 0; border: 0; text-align: left; font-size: 13px; line-height: 1.5em; }
.support-board-section .support-board-table td.support-board-table__title { font-size: 15px; font-weight: 600; line-height: 1.45em; }
.support-board-section .support-board-table td.support-board-table__attach { padding-top: 6px; }
#contArea .board-view-tit { padding: 16px 0 12px; }
#contArea .board-view-tit h3 { font-size: 18px; line-height: 1.4em; }
#contArea .board-view-info { gap: 6px 12px; padding: 12px 0; font-size: 13px; line-height: 1.5em; }
#contArea .board-view-cnt { padding: 20px 0 28px; font-size: 14px; line-height: 1.7em; }
#contArea .board-view-cnt img,
#contArea .board-view-cnt video,
#contArea .board-view-cnt iframe,
#contArea .board-view-cnt table { max-width: 100%; }
#contArea .board-view-cnt img,
#contArea .board-view-cnt video,
#contArea .board-view-cnt iframe { height: auto; }
#contArea .video-container,
#contArea .video-container iframe,
#contArea .video-container video { width: 100%; max-width: 100%; }
#contArea .board-prev-next dt { flex: 0 0 72px; padding: 12px; font-size: 13px; line-height: 1.4em; }
#contArea .board-prev-next dd { padding: 12px; font-size: 14px; line-height: 1.5em; }
.inquiry-page .board-form .form-row { grid-template-columns: 1fr; }
.inquiry-page .inquiry-grid--2,
.inquiry-page .inquiry-grid--3,
.inquiry-page .inquiry-section-row--2,
.inquiry-page .inquiry-cat-grid,
.inquiry-page .inquiry-layout { grid-template-columns: 1fr; }
.inquiry-page .inquiry-aside { position: relative; top: auto; }
.inquiry-page .inquiry-cat-sec__title,
.inquiry-page .inquiry-form-sec__title { font-size: 20px; line-height: 1.35em; }
.pm2-aibox__desc { font-size: 14px; }
}
@media (max-width: 1024px) {
.main-hero.main-hero--sian { aspect-ratio: auto; height: auto; min-height: 0; max-height: none; }
.main-hero.main-hero--sian .main-hero__scene { display: none; }
.hero-sian { position: relative; top: auto; bottom: auto; display: flex; flex-direction: column; padding: 76px 0 0; box-sizing: border-box; }
.hero-sian__copy { position: relative; top: auto; left: auto; width: auto; margin: 0 16px; padding: 0; border-radius: 0; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.hero-sian__copy::before { display: none; }
.hero-sian__title { margin-bottom: 8px; font-size: clamp(20px, 5.6vw, 34px); }
.hero-sian__ko { font-size: clamp(12px, 3.4vw, 17px); }
.hero-sian__keys { gap: 0 6px; margin-top: 6px; font-size: clamp(9px, 2.4vw, 12px); letter-spacing: 0.04em; }
.hero-sian > .hero-sian__stage { position: relative; inset: auto; width: 100%; aspect-ratio: 1920 / 980; margin-top: 10px; background: url(/images/assets/home/factory_with_vg_logo_v4.jpg) center / 100% 100% no-repeat; }
.hero-sian > .hero-sian__stage::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 14%; background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,0) 100%); pointer-events: none; }
.hero-sian__pin { gap: 4px; transform: none; }
.hero-sian__pin::before { inset: -4px -8px -4px -4px; border-radius: 12px; }
.hero-sian__pin::after { left: 12px; top: 26px; width: 1px; }
.hero-sian__pin-ico { width: 24px; height: 26px; }
.hero-sian__pin-ico::after { inset: 2px; }
.hero-sian__pin-hex { inset: -10px; }
.hero-sian__pin-svg { width: 12px; height: 12px; }
.hero-sian__pin-name { display: none; }
.hero-sian__pin-sub { font-size: clamp(9px, 2.3vw, 13px); }
.hero-sian__pin--vision { top: 34.2%; left: 27%; }
.hero-sian__pin--process { top: 19.4%; left: 50.7%; }
.hero-sian__pin--safety { top: 21.6%; left: 72.9%; }
.hero-sian__pin--vision::after { height: calc(392 * var(--u)); }
.hero-sian__pin--process::after { height: calc(329 * var(--u)); }
.hero-sian__pin--safety::after { height: calc(294 * var(--u)); }
.hero-sian__pin:hover::after, .hero-sian__pin:focus-visible::after { width: 2px; }
.hero-sian__device { position: absolute; right: 8px; bottom: 8px; gap: 5px; min-width: 0; min-height: 0; margin: 0; padding: 4px 4px 4px 9px; border-radius: 999px; background: rgba(20,20,20,0.88); box-shadow: 0 4px 12px rgba(4,14,38,0.25); }
.hero-sian__device-body { gap: 0; }
.hero-sian__device-name { font-size: clamp(8px, 2.2vw, 11px); letter-spacing: 0.04em; }
.hero-sian__device-desc { display: none; }
.hero-sian__device-plus { width: clamp(16px, 4.4vw, 22px); height: clamp(16px, 4.4vw, 22px); font-size: clamp(11px, 3vw, 14px); }
.hero-sian__scroll { display: none; }
}
@media (max-width: 1024px) {
.sub-hero-nav { flex-wrap: nowrap; width: calc(100% - 30px); max-width: 560px; }
.sub-hero-nav__label,
.sub-hero-nav__pill { flex: 1 1 auto; width: auto; min-width: 0; max-width: none; }
}
@media (max-width: 1200px) {
:root { --sec-inset-x: clamp(20px, 8vw, 120px); --sec-inset-160: clamp(24px, 8vw, 160px); }
.suho-showcase__shell { grid-template-columns: 1fr 1fr; min-height: 0; }
.suho-showcase__panel { grid-column: 1 / -1; }
.suho-showcase__visual-dim { background: none; }
.suho-showcase__device { max-width: 360px; min-height: 0; margin: 0 auto; }
.suho-showcase__scene { margin-left: calc(clamp(16px, 2vw, 24px) * -0.4); }
.suho-showcase__scene img, .suho-showcase__scene::after { top: 0; bottom: 0; }
.suho-showcase__scene img { height: 100%; object-position: 30% 100%; }
.why-yg-flow__step + .why-yg-flow__step::before { display: none; }
.dv2-device-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dv2-partners-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
.suho-showcase__shell { grid-template-columns: 1fr; }
.suho-showcase__features { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); justify-items: center; gap: 8px; width: 100%; }
.suho-showcase__feature { width: auto; gap: 6px; }
.suho-showcase__feature-icon { width: 44px; height: 44px; }
.suho-showcase__feature-icon svg { width: 30px; height: 30px; }
.suho-showcase__feature-label { font-size: 9.5px; letter-spacing: 0.02em; }
.suho-showcase__device { max-width: 280px; }
.suho-showcase__scene { margin-left: 0; }
.suho-showcase__scene img { position: static; width: calc(100% + var(--sec-inset-160)); aspect-ratio: 4 / 3; height: auto; object-position: 32% 100%; }
.suho-showcase__scene::after { top: 0; bottom: 0; background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,0.72) 6%, rgba(255,255,255,0) 22%); }
.suho-showcase__btn { flex: 1 1 auto; padding: 0 16px; font-size: 14px; white-space: nowrap; }
.dv2-device-cat-grid { grid-template-columns: 1fr; }
.dv2-partners-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dv2-why-steps { grid-template-columns: 1fr; }
.dv2-select-grid { grid-template-columns: 1fr; }
}
@media (hover: none) {
.machine-vision-page .mv2-solution-sec .mv2-feat-item:hover,
.process-monitoring-page .mv2-solution-sec .mv2-feat-item:hover,
.industrial-safety-page .mv2-solution-sec .mv2-feat-item:hover,
.machine-vision-page .mv2-solution-sec .mv2-feat-item:hover .mv2-feat-item__icon,
.process-monitoring-page .mv2-solution-sec .mv2-feat-item:hover .mv2-feat-item__icon,
.industrial-safety-page .mv2-solution-sec .mv2-feat-item:hover .mv2-feat-item__icon,
.dv2-device-cat-card:hover,
.dv2-device-cat-card:hover .dv2-device-cat-card__media img,
.dv2-why-step__card:hover,
.dv2-why-step__card:hover .dv2-why-step__icon,
.is2-suhozone-spot__grid-item:hover,
.is2-suhozone-spot__grid-item:hover .is2-suhozone-spot__grid-num { transform: none; }
.is2-zone-slide:hover .is2-zone-slide__dot-bar { animation-play-state: running; }
.is2-zone-slide.is-paused .is2-zone-slide__dot-bar { animation-play-state: paused; }
}
@media (prefers-reduced-motion: reduce) {
.history-rail::after,
.history-rail__year,
.history-rail__tag,
.history-rail__node,
.history-rail__node::after,
.history-rail__thumb,
.history-rail.is-anim .history-rail__item { transition: none; }
.history-rail.is-anim .history-rail__item { opacity: 1; transform: none; }
.history-rail.is-anim .history-rail__item.is-current .history-rail__thumb,
.history-rail.is-anim .history-rail__item.is-current .history-rail__year { transform: none; }
.machine-vision-page .mv2-solution-sec .mv2-feat-item,
.machine-vision-page .mv2-solution-sec .mv2-feat-item__icon,
.process-monitoring-page .mv2-solution-sec .mv2-feat-item,
.process-monitoring-page .mv2-solution-sec .mv2-feat-item__icon,
.industrial-safety-page .mv2-solution-sec .mv2-feat-item,
.industrial-safety-page .mv2-solution-sec .mv2-feat-item__icon,
.dv2-device-cat-card,
.dv2-why-step__card,
.dv2-why-step__icon,
.is2-suhozone-spot__grid-item,
.is2-suhozone-spot__grid-num,
.is2-zone-slide__viewport,
.is2-zone-slide__track,
.is2-zone-slide__item img,
.is2-zone-slide__btn,
.is2-zone-slide__btn svg,
.is2-zone-slide__dot { transition: none; }
.machine-vision-page .mv2-solution-sec .mv2-feat-item:hover,
.process-monitoring-page .mv2-solution-sec .mv2-feat-item:hover,
.industrial-safety-page .mv2-solution-sec .mv2-feat-item:hover,
.machine-vision-page .mv2-solution-sec .mv2-feat-item:hover .mv2-feat-item__icon,
.process-monitoring-page .mv2-solution-sec .mv2-feat-item:hover .mv2-feat-item__icon,
.industrial-safety-page .mv2-solution-sec .mv2-feat-item:hover .mv2-feat-item__icon,
.dv2-device-cat-card:hover,
.dv2-why-step__card:hover,
.dv2-why-step__card:hover .dv2-why-step__icon,
.is2-suhozone-spot__grid-item:hover,
.is2-suhozone-spot__grid-item:hover .is2-suhozone-spot__grid-num,
.is2-zone-slide__photo img,
.is2-zone-slide__item.is-active .is2-zone-slide__photo img,
.is2-zone-slide:hover .is2-zone-slide__item.is-active .is2-zone-slide__photo img,
.is2-zone-slide__item.is-active .is2-zone-slide__badge b { transform: none; }
.is2-zone-slide__dot.is-active .is2-zone-slide__dot-bar { animation: none; transform: scaleX(1); }
}

@media (max-width: 768px) {
.why-yg-flow__title { margin-bottom: 12px; }
.why-yg-flow__steps { grid-template-columns: 1fr; gap: 8px; }
.why-yg-flow__step { flex-direction: row; align-items: center; gap: 12px; min-height: 0; padding: 12px 44px 12px 12px; border-radius: 12px; }
.why-yg-flow__step::after { border-radius: 12px 12px 0 0; }
.why-yg-flow__step:hover, .why-yg-flow__step:focus-within { transform: none; }
.why-yg-flow__icon { width: 40px; height: 40px; border-radius: 10px; }
.why-yg-flow__icon img { width: 26px; height: 26px; }
.why-yg-flow__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.why-yg-flow__step-title { font-size: 15px; line-height: 1.3em; }
.why-yg-flow__step-desc { font-size: 12px; line-height: 1.4em; }
.why-yg-flow__num { top: 50%; right: 14px; transform: translateY(-50%); font-size: 20px; }
.why-yg-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.why-yg-stats__card-inner { gap: 2px; min-height: 0; padding: 14px 14px 16px; border-radius: 12px; }
.why-yg-stats__card-inner.is-active, .why-yg-stats__card-inner:hover, .why-yg-stats__card-inner:focus-within { min-height: 0; transform: none; border-radius: 12px 12px 32px 12px; }
.why-yg-stats__unit { font-size: 13px; }
.why-yg-stats__label { font-size: 11px; line-height: 1.4em; }
.why-yg-stats__num { margin-top: 6px; }
.why-yg-stats__num .big { font-size: clamp(22px, 6.4vw, 30px); }
.why-yg-stats__num .plus { font-size: clamp(13px, 3.6vw, 17px); }
}

@media (max-width: 768px) {
.device-home__col { grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding: 10px 12px; }
.device-home__stage img { height: 72px; border-radius: 8px; }
.device-home__col-body { gap: 2px; }
.device-home__cat-title { font-size: 15px; line-height: 1.3em; word-break: keep-all; overflow-wrap: anywhere; }
.device-home__cat-desc { font-size: 12px; line-height: 1.45em; word-break: keep-all; overflow-wrap: anywhere; }
.customer-logos-list { gap: 8px; padding: 4px 6px; }
.customer-logo { width: 116px; max-width: 116px; height: 52px; border-radius: 6px; }
.customer-logo img { max-width: 62%; max-height: 46%; }
}