@media (max-width:2880px) {
  .ds_main_btn01 { top: 52%; left: 40%; }
  .ds_main_btn02 { top: 66%; left: 39%; }
  .ds_main_btn03 { top: 64%; right: 27%; }
}
@media (max-width:2560px) {
  .ds_main_btn01 { top: 52%; left: 38%; }
  .ds_main_btn02 { top: 65%; left: 37%; }
  .ds_main_btn03 { top: 64%; right: 25%; }
}
@media (max-width:2200px) {
  .ds_main_btn01 { top: 51%; left: 37%; }
  .ds_main_btn02 { top: 65%; left: 35%; }
  .ds_main_btn03 { top: 64%; right: 24%; }
}
@media (max-width:1920px) {
  .ds_main_btn01 { top: 50%; left: 37%; }
  .ds_main_btn02 { top: 65%; left: 35%; }
  .ds_main_btn03 { top: 64%; right: 20%; }
}
@media (max-width:1880px) {
  .ds_main_btn01 { top: 50%; left: 35%; }
  .ds_main_btn02 { top: 65%; left: 33%; }
  .ds_main_btn03 { top: 64%; right: 20%; }
}
@media (max-width:1540px) {
  .ds_main_btn01 { top: 50%; left: 33%; }
  .ds_main_btn02 { top: 65%; left: 32%; }
  .ds_main_btn03 { top: 64%; right: 18%; }
}
@media (max-width:1440px) {
  .ds_main_side_menu { width: min(20vw,320px);min-width: 300px; }
  .ds_main_side_menu .ds_main_footer { width: min(20vw,320px);min-width: 300px; }
  .ds_main_side_menu .ds_main_footer .ds_main_footer_in { gap: 10px; flex-direction: column }
  .ds_sub_all_wrap .ds_sub_con_all_wrap { left: 56px; width: 18vw }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap .sub_main_con_right_txt { width: 360px }
  .sub_main_con_right_wrap .sub_main_con_right_ui_img { width: 360px; height: 594px }
  .ds_sub_all_wrap .ds_sub_header .ds_sub_btn_wrap { display: none }
 .ds_main_header_nav_menu_b a { padding: 16px 40px; }
}
@media (max-width:1280px) {
  .ds_main_btn01 { top: 50%; left: 31%; }
  .ds_main_btn02 { top: 65%; left: 30%; }
  .ds_main_btn03 { top: 64%; right: 18%; }
}
@media (min-width:1201px) {
  .mobile_header .ds_main_hamburger, .mobile_header .ds_main_overlay, .mobile_header .ds_main_side_menu, .mobile_header .ds_topbar { display: none!important }
  .mobile_header .ds_sub_all_wrap .ds_sub_header { display: flex!important }
  .ds_sub_all_wrap .ds_sub_header { display: flex!important }
  .ds_tabmenu { display: none!important }
  .mobile_header .ds_main_overlay { position: fixed; inset: 0; z-index: 110; }
  .mobile_header .ds_main_side_menu { position: fixed; top: 0; bottom: 0; left: 0; z-index: 120; }
  .mobile_header .ds_main_overlay[hidden] { display: none !important; }
}
@media (max-width:1200px) {
  .ds_sub_outline { opacity: 1 !important; visibility: visible !important; }
  .ds_sub_all_wrap .ds_sub_header { display: none }
  .ds_sub_all_wrap .ds_sub_con_all_wrap .ds_sub_con_wrap { height: auto; display: flex; flex-direction: column-reverse; gap: 30px; justify-content: space-between }
  .ds_sub_con_back a>div { display: none }
  .ds_sub_all_wrap .ds_sub_con_all_wrap .ds_sub_con_back a { display: inline }
  .ds_main_hamburger { display: flex; flex-direction: column }
  .ds_main_side_menu { transform: translateX(-100%); box-shadow: none }
  .is-menu-open .ds_main_side_menu { transform: translateX(0); box-shadow: 10px 0 30px rgba(0,0,0,.25); z-index: 120 }
  .is-menu-open { overflow: hidden }
  .ds_sub_all_wrap .ds_sub_header .ds_sub_nav_wrap { display: none }
  .ds_topbar { display: none }
  .ds_topbar_in { width: 100%; display: flex; align-items: center; gap: 12px; pointer-events: auto }
  .ds_topbar_in_title { position: absolute; top: 15%; left: 50%; transform: translateX(-50%);width: 40%; }
  .ds_topbar_logo img { display: block; height: 28px; width: auto }
  .ds_topbar_title { color: #fff; font-weight: 700; font-size: 16px; letter-spacing: .2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
  .is-menu-open .ds_topbar { opacity: 0; visibility: hidden; transition: opacity .2s ease,visibility .2s ease }
  .ds_main_all_wrap,.ds_main_bg,.ds_main_bg img,.ds_main_bg_hid,.ds_main_bg_hid img,.ds_sub_all_wrap,.ds_sub_bg,.ds_sub_bg img { height: 100svh }
  .ds_main_side_menu { width: 280px }
  .ds_main_side_menu .ds_main_footer { width: 100% }
  .ds_main_side_menu .ds_main_header .ds_main_header_title { padding: 24px 28px }
  .ds_main_side_menu .ds_main_header_tit { font-size: 32px }
  .ds_main_header_nav_menu_a { padding: 16px 28px }
  .ds_main_header_nav_menu_b a { padding: 16px 44px }


  .ds_main_btn_wrap {position: relative;  display: flex; gap: 20px; flex-direction: column; align-items: center; position: absolute; top: 67%; left: 50%; transform: translate(-50%, -50%); z-index: 30; }
  .ds_main_btn_wrap .ds_main_btn { position: static; }


  /* 태블릿 cctv 위치조정 */
  .ds_sub_all_wrap.zoom-lv1 .ds_sub_prevention_bg { transform: scale(2.5); transform-origin: 45% 30%; }
  .ds_sub_all_wrap.zoom-lv4 .ds_sub_power_bg { transform: scale(2.5); transform-origin: 55% 37%; }
  .ds_sub_all_wrap.zoom-lv7 .ds_sub_pupm_bg { transform: scale(3); transform-origin: 61% 34%; }



  .ds_main_btn a::after,.ds_main_btn a::before { display: none }
  .ds_sub_all_wrap .ds_sub_header { height: 80px; padding: 0 5% }
  .ds_sub_all_wrap .ds_sub_header .ds_sub_logo_wrap { width: 360px }
  .ds_sub_all_wrap .ds_sub_con_all_wrap { top: 160px; left: 5%; width: 240px }
  .ds_sub_all_wrap .ds_sub_con_all_wrap .ds_sub_con_wrap { height: calc(100svh - 240px) }
  .ds_sub_main_con_all_wrap .ds_sub_main_con_btn { display: none!important }
  .sub_main_con_right_all_wrap { right: 56px }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap { gap: 20px }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap .sub_main_con_right_txt { width: 320px; padding: 20px; border-radius: 20px }
  .sub_main_con_right_wrap .sub_main_con_right_ui_img { width: 320px; height: 528px; border-radius: 20px }
  .sub_main_con_right_ui .sub_main_con_right_ui_nav { bottom: -52px; gap: 12px }
  .ds_sub_bg img { height: 100%; width: 100vw; object-fit: contain }
  .ds_main_bg_hid img { display: none }
  .mobile_header .ds_sub_all_wrap .ds_sub_header { display: none!important }
  .mobile_header .ds_main_hamburger { display: flex!important }
  .sub_main_con_right_all_wrap { display: none!important; opacity: 0!important; visibility: hidden!important }
  .sub_main_con_right_all_wrap.active { display: block!important; opacity: 1!important; visibility: visible!important }
  .ds_sub_all_wrap[class*="zoom-lv"],.ds_sub_all_wrap[class*="zoom-out-lv"] { transform: none!important }
  .is-mobile-sub .ds_tabmenu { z-index: 1000!important }
  .is-mobile-sub .ds_main_overlay { z-index: 1001!important }
  .is-mobile-sub .ds_main_side_menu { z-index: 1002!important }
  .ds_tabmenu_inner { justify-content: center; padding-inline: 16px }
  .ds_tabmenu.has-overflow .ds_tabmenu_inner { justify-content: flex-start }
  .ds_tabmenu_view { scroll-padding-left: 12px; scroll-padding-right: 12px }
  .ds_sub_main_con_all_wrap .ds_sub_main_con_btn,.ds_sub_main_con_all_wrap .ds_sub_outline { display: none }
  .ds_tabmenu { position: fixed; left: 0; right: 0; bottom: 0; z-index: 15; display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; column-gap: 8px; background: rgba(0,0,0,.7); backdrop-filter: blur(8px); padding: 10px 8px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(255,255,255,.15) }
  .ds_tabmenu_nav { width: 36px; height: 36px; margin: 0 auto; border-radius: 50%; border: 1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.35); color: #fff; display: inline-flex; align-items: center; justify-content: center; transition: opacity .2s,transform .12s,background .2s,border-color .2s; opacity: .85 }
  .ds_tabmenu_nav:hover { opacity: 1; border-color: #fff }
  .ds_tabmenu_nav:active { transform: scale(.96) }
  .ds_tabmenu_nav[disabled] { opacity: .35; pointer-events: none }
  .ds_tabmenu_view { position: relative; min-width: 0; overflow: hidden }
  .ds_tabmenu_inner { display: flex; align-items: center; gap: 10px; padding: 0 2px; overflow-x: auto; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; scrollbar-width: none }
  .ds_tabmenu_inner::-webkit-scrollbar { display: none }
  .ds_tabmenu_btn { flex: 0 0 auto; border: 1px solid rgba(255,255,255,.25); color: #fff; background: transparent; padding: 10px 16px; border-radius: 999px; font-size: 14px; font-weight: 500; white-space: nowrap; transition: background .25s,color .25s,border-color .25s,transform .12s }
  .ds_tabmenu_btn:hover { border-color: #319fe8 }
  .ds_tabmenu_btn:active { transform: scale(.96) }
  .ds_tabmenu_btn.on { background: #319fe8; border-color: #319fe8; color: #fff }
  .ds_tabmenu:not(.has-overflow) .ds_tabmenu_nav { display: none }
  .ds_sub_all_wrap { padding-bottom: 88px }
  .ds_sub_all_wrap[class*="zoom-lv"] .ds_sub_con_wrap .sec_tit4, .ds_sub_all_wrap[class*="zoom-lv"] .ds_sub_con_wrap .sec_txt2 { opacity: 1!important; visibility: visible!important }
  .ds_sub_con_all_wrap .ds_sub_con_wrap { height: auto!important }
  .sub_main_con_right_ui_img { height: auto!important; max-height: 60vh; }
  .sub_main_con_right_ui_img img { display: block; width: 100%; height: auto; user-select: none; pointer-events: none }
}
@media (max-width:992px) {
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap { flex-direction: column }
  .ds_main_side_menu { width: 240px }
  .ds_main_side_menu .ds_main_footer { width: 100% }
  .ds_sub_all_wrap .ds_sub_header { height: 68px; padding: 0 5% }
  .ds_sub_all_wrap .ds_sub_header .ds_sub_logo_wrap { width: 260px }
  .ds_sub_all_wrap .ds_sub_con_all_wrap { top: 124px; left: 5%; width: 220px }
  .ds_sub_all_wrap .ds_sub_con_all_wrap .ds_sub_con_back a { padding: 16px 28px; border-radius: 56px }
  .ds_sub_main_con_all_wrap .ds_sub_main_con_btn { width: 46px; height: 46px }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap { gap: 16px }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap .sub_main_con_right_txt { width: 300px; padding: 18px; border-radius: 18px }
  .sub_main_con_right_wrap .sub_main_con_right_ui_img { width: 300px; height: 495px; border-radius: 18px }
  .sub_main_con_right_ui .sub_main_con_right_ui_nav { bottom: -48px; gap: 10px }
}
@media (max-width:768px) {
  .ds_sub_bg img { height: 100%; width: 100vw; object-fit: contain }
  .ds_main_all_wrap,.ds_sub_all_wrap { height: 100svh }
  .ds_main_side_menu { width: 78vw; max-width: 360px }
  .ds_main_btn_wrap .ds_main_btn a { padding: 12px 18px; gap: 12px; font-weight: 700 }
  .ds_main_btn01 a::after,.ds_main_btn01 a::before,.ds_main_btn02 a::after,.ds_main_btn02 a::before,.ds_main_btn03 a::after,.ds_main_btn03 a::before { display: none }
  .ds_sub_all_wrap .ds_sub_header .ds_sub_logo_wrap { width: auto }
  .ds_sub_all_wrap .ds_sub_con_all_wrap { top: 96px; left: 0; padding: 0 5%; width: 50%; }
  .ds_sub_all_wrap .ds_sub_con_all_wrap .ds_sub_con_wrap { height: calc(100svh - 200px) }
  .ds_sub_main_con_all_wrap .ds_sub_main_con_btn { width: 40px; height: 40px }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap { gap: 12px }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap .sub_main_con_right_txt { width: clamp(240px,38vw,280px); padding: 16px; border-radius: 16px }
  .sub_main_con_right_wrap .sub_main_con_right_ui_img { width: clamp(240px,38vw,280px); height: calc(clamp(240px,38vw,280px)*1.65); border-radius: 16px }
  .sub_main_con_right_ui .sub_main_con_right_ui_nav { bottom: -76px; gap: 8px; }
  .sub_main_con_right_ui_img { height: auto !important; max-height: 40vh; }
}
@media (max-width:560px) {
  .ds_sub_all_wrap .ds_sub_con_all_wrap { left: 0; width: 60%; padding: 0 5% }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap { gap: 10px }
  .sub_main_con_right_all_wrap .sub_main_con_right_wrap .sub_main_con_right_txt, .sub_main_con_right_wrap .sub_main_con_right_ui_img { width: 100% }
  .sub_main_con_right_wrap .sub_main_con_right_ui_img { height: min(64svh,480px) }
  .sub_main_con_right_ui .sub_main_con_right_ui_nav { bottom: -80px; }
  .ds_sub_main_con_all_wrap .ds_sub_main_con_btn { width: 36px; height: 36px }
  .ds_sub_bg { height: 90svh; }
  .sub_main_con_right_all_wrap { width: 100%; padding: 0 10%; position: absolute; top: 120%; right: 0; transform: translate(-0px, -50%)!important; z-index: 6; opacity: 0; visibility: hidden; transition: opacity .4s ease, transform .4s ease, visibility 0s linear .4s; }
  .ds_main_all_wrap, .ds_sub_all_wrap { height: 100svh; overflow: scroll; }
  .sub_main_con_right_all_wrap { padding-bottom: 150px; }
  .sub_main_con_right_ui_img { max-height: 80vh; }
  .ds_sub_outline { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform-origin: center center; transition: transform 1s ease; z-index: 10; /* 배경보다 위에 있도록 */
    pointer-events: none; }
  /* ───────── 방재실 (prevention) ───────── */ .ds_sub_all_wrap.zoom-lv1 .ds_sub_prevention_bg { transform: scale(3.5); transform-origin: 44% 35%; }
  .ds_sub_all_wrap.zoom-lv2 .ds_sub_prevention_bg { transform: scale(2.8); transform-origin: 71% 41%; }
  .ds_sub_all_wrap.zoom-lv3 .ds_sub_prevention_bg { transform: scale(4); transform-origin: 76% 44%; }
  .ds_sub_all_wrap.zoom-out-lv1 .ds_sub_prevention_bg { transform: scale(1); transform-origin: 44% 35%; }
  .ds_sub_all_wrap.zoom-out-lv2 .ds_sub_prevention_bg { transform: scale(1); transform-origin: 71% 41%; }
  .ds_sub_all_wrap.zoom-out-lv3 .ds_sub_prevention_bg { transform: scale(1); transform-origin: 76% 44%; }
  /* ───────── 펌프실 (pump) ───────── */ .ds_sub_all_wrap.zoom-lv1 .ds_sub_pupm_bg { transform: scale(3.5); transform-origin: 25% 47%; }
  .ds_sub_all_wrap.zoom-lv2 .ds_sub_pupm_bg { transform: scale(3); transform-origin: 49% 56%; }
  .ds_sub_all_wrap.zoom-lv3 .ds_sub_pupm_bg { transform: scale(3); transform-origin: 50% 50%; }
  .ds_sub_all_wrap.zoom-lv4 .ds_sub_pupm_bg { transform: scale(3.5); transform-origin: 65% 50%; }
  .ds_sub_all_wrap.zoom-lv5 .ds_sub_pupm_bg { transform: scale(5); transform-origin: 40% 50%; }
  .ds_sub_all_wrap.zoom-lv6 .ds_sub_pupm_bg { transform: scale(4); transform-origin: 79% 44%; }
  .ds_sub_all_wrap.zoom-lv7 .ds_sub_pupm_bg { transform: scale(7); transform-origin: 54% 38%; }
  .ds_sub_all_wrap.zoom-lv8 .ds_sub_pupm_bg { transform: scale(5); transform-origin: 71% 44%; }
  .ds_sub_all_wrap.zoom-out-lv1 .ds_sub_pupm_bg { transform: scale(1); transform-origin: 25% 47%; }
  .ds_sub_all_wrap.zoom-out-lv2 .ds_sub_pupm_bg { transform: scale(1); transform-origin: 49% 56%; }
  .ds_sub_all_wrap.zoom-out-lv3 .ds_sub_pupm_bg { transform: scale(1); transform-origin: 50% 50%; }
  .ds_sub_all_wrap.zoom-out-lv4 .ds_sub_pupm_bg { transform: scale(1); transform-origin: 65% 50%; }
  .ds_sub_all_wrap.zoom-out-lv5 .ds_sub_pupm_bg { transform: scale(1); transform-origin: 40% 50%; }
  .ds_sub_all_wrap.zoom-out-lv6 .ds_sub_pupm_bg { transform: scale(1); transform-origin: 79% 44%; }
  .ds_sub_all_wrap.zoom-out-lv7 .ds_sub_pupm_bg { transform: scale(1); transform-origin: 54% 38%; }
  .ds_sub_all_wrap.zoom-out-lv8 .ds_sub_pupm_bg { transform: scale(1); transform-origin: 71% 44%; }
  /* ───────── 전기실 (power) ───────── */ .ds_sub_all_wrap.zoom-lv1 .ds_sub_power_bg { transform: scale(4); transform-origin: 30% 49%; }
  .ds_sub_all_wrap.zoom-lv2 .ds_sub_power_bg { transform: scale(3.5); transform-origin: 17% 53%; }
  .ds_sub_all_wrap.zoom-lv3 .ds_sub_power_bg { transform: scale(2.5); transform-origin: 78% 40%; }
  .ds_sub_all_wrap.zoom-lv4 .ds_sub_power_bg { transform: scale(5.5); transform-origin: 51% 39%; }
  .ds_sub_all_wrap.zoom-lv5 .ds_sub_power_bg { transform: scale(4); transform-origin: 40% 43%; }
  .ds_sub_all_wrap.zoom-out-lv1 .ds_sub_power_bg { transform: scale(1); transform-origin: 30% 49%; }
  .ds_sub_all_wrap.zoom-out-lv2 .ds_sub_power_bg { transform: scale(1); transform-origin: 17% 53%; }
  .ds_sub_all_wrap.zoom-out-lv3 .ds_sub_power_bg { transform: scale(1); transform-origin: 78% 40%; }
  .ds_sub_all_wrap.zoom-out-lv4 .ds_sub_power_bg { transform: scale(1); transform-origin: 51% 39%; }
  .ds_sub_all_wrap.zoom-out-lv5 .ds_sub_power_bg { transform: scale(1); transform-origin: 40% 43%; }
}
@media (max-width:375px) {
  .ds_topbar_in_title { top: 24%; }
}
@media (prefers-reduced-motion:reduce) {
  .ds_main_bg_hid, .ds_sub_bg, .sub_main_con_right_all_wrap, .sub_main_con_right_wrap .sub_main_con_right_ui_img img, .ds_main_btn_wrap .ds_main_btn a { transition: none!important }
}
@media (max-height:850px) {
  .ds_main_footer { display: none; }
}
@media (max-height:630px) {
  .ds_main_footer { display: none; }
  .ds_main_header_title .sec_txt1{display: none;}
}

