/* Shared responsive corrections for the active ld cms 2025 theme. */
*, *::before, *::after { box-sizing: border-box; }
html { max-width: 100%; }
body { max-width: 100%; }
img, video, iframe, object, embed, table { max-width: 100%; }
img { height: auto; }

.kn-mobile-toggle, .kn-mobile-backdrop, .kn-mobile-drawer { display: none; }

/* Small set of utility classes formerly supplied by the removed Tailwind browser bundle. */
body.bg-white { background: #fff; }
.py-2 { padding-top: .5rem; padding-bottom: .5rem; }
.px-8 { padding-left: 2rem; padding-right: 2rem; }
.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
.border-gray-200 { border-color: #e5e7eb; }
.max-w-7xl { max-width: 80rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.flex { display: flex; }
.justify-between { justify-content: space-between; }
.items-center { align-items: center; }
.space-x-8 > * + * { margin-left: 2rem; }
.text-gray-700 { color: #374151; }
.font-medium { font-weight: 500; }
.pb-1 { padding-bottom: .25rem; }
.transition-colors { transition: color .2s ease, border-color .2s ease; }
.border-transparent { border-color: transparent; }
.border-b-2 { border-bottom-width: 2px; border-bottom-style: solid; }
.anchor-link:hover, .hover\\:text-primary:hover { color: #1f2c5c; }
.anchor-link:hover, .hover\\:border-primary:hover { border-color: #1f2c5c; }

@media (max-width: 767px) {
  html, body { width: 100%; overflow-x: hidden; }
  body { padding-bottom: env(safe-area-inset-bottom); }
  #header, .top_bg { position: relative; height: auto !important; min-height: 58px; }
  #header .header, .header { width: 100% !important; max-width: 100% !important; min-height: 58px; }
  #header .h_con { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 58px; padding: 8px 12px; }
  #header .logo { float: none !important; margin: 0; max-width: 62%; }
  #header .logo img { max-height: 42px; width: auto; }
  #header .h_dw, #header .h_honor, #header .h_tel { display: none !important; }
  #header .h_nav { display: none !important; }
  .kn-mobile-toggle { display: inline-flex; position: absolute; right: 10px; top: 8px; z-index: 1003; width: 44px; height: 44px; border: 0; border-radius: 4px; background: #0c5aa6; color: #fff; align-items: center; justify-content: center; font-size: 24px; line-height: 1; cursor: pointer; }
  .kn-mobile-toggle:focus-visible, .kn-mobile-drawer a:focus-visible, .kn-mobile-drawer button:focus-visible { outline: 3px solid #ffb400; outline-offset: 2px; }
  .kn-mobile-backdrop { display: block; position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.45); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
  .kn-mobile-drawer { display: block; position: fixed; top: 0; right: 0; z-index: 1002; width: min(88vw, 360px); height: 100dvh; overflow-y: auto; padding: 68px 14px 24px; background: #fff; box-shadow: -5px 0 18px rgba(0,0,0,.18); transform: translateX(102%); transition: transform .2s ease; }
  body.kn-menu-open { overflow: hidden; }
  body.kn-menu-open .kn-mobile-backdrop { opacity: 1; pointer-events: auto; }
  body.kn-menu-open .kn-mobile-drawer { transform: translateX(0); }
  .kn-mobile-drawer ul { list-style: none; margin: 0; padding: 0; }
  .kn-mobile-drawer li { border-bottom: 1px solid #e9edf2; }
  .kn-mobile-drawer a, .kn-mobile-drawer .kn-sub-toggle { display: flex; align-items: center; min-height: 48px; width: 100%; padding: 10px 8px; color: #1c2b3a; background: transparent; border: 0; text-decoration: none; font-size: 16px; text-align: left; }
  .kn-mobile-drawer .kn-sub-toggle { justify-content: space-between; cursor: pointer; }
  .kn-mobile-drawer .kn-sub-toggle::after { content: '+'; font-size: 20px; color: #0c5aa6; }
  .kn-mobile-drawer li.kn-expanded > .kn-sub-toggle::after { content: '−'; }
  .kn-mobile-drawer .kn-submenu { display: none; padding: 0 0 6px 14px; }
  .kn-mobile-drawer li.kn-expanded > .kn-submenu { display: block; }
  .kn-mobile-drawer .kn-submenu a { min-height: 44px; font-size: 14px; color: #526170; }

  #icon_module, .client-2, .fuc, .demand { max-width: calc(100vw - 16px); }
  #icon_module { right: 8px !important; bottom: calc(12px + env(safe-area-inset-bottom)) !important; transform: scale(.88); transform-origin: bottom right; }
  .client-2 { right: 6px !important; bottom: calc(74px + env(safe-area-inset-bottom)) !important; }
  .fuc { left: 6px !important; right: auto !important; bottom: calc(12px + env(safe-area-inset-bottom)) !important; }
  .demand { bottom: calc(12px + env(safe-area-inset-bottom)) !important; }

  #product-nav, #product-nav > div, .max-w-7xl, #product-intro, .k-rich-unify,
  .anchor-section, [style*="width: 1200px"], [style*="width: 1190px"] {
    width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important;
  }
  #product-nav { overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; }
  #product-nav a { display: inline-flex; min-height: 44px; align-items: center; padding: 8px 12px; }
  #product-intro { display: flex !important; flex-direction: column !important; gap: 18px; padding: 16px 12px !important; }
  #product-intro > * { width: 100% !important; max-width: 100% !important; }
  .anchor-section, .k-rich-unify { padding-left: 12px !important; padding-right: 12px !important; }
  .anchor-section [style*="height: 360px"], .anchor-section [style*="height: 400px"] { height: auto !important; min-height: 0 !important; }
  .k-rich-unify, .k-rich-unify * { max-width: 100% !important; }
  .k-rich-unify table { display: block; overflow-x: auto; white-space: nowrap; }
  .swiper, .slick-slider, .swiper-container { max-width: 100%; overflow: hidden; }
  .swiper-slide, .slick-slide { max-width: 100%; }
  .form_box, .form, form { max-width: 100%; }
  input, select, textarea, button { max-width: 100%; }
}

@media (min-width: 768px) {
  .kn-mobile-toggle, .kn-mobile-backdrop, .kn-mobile-drawer { display: none !important; }
}
