/*
Theme Name: Haesong Tech
Theme URI: https://www.haesongtech.co.kr/
Author: (주)해송텍
Description: (주)해송텍 표면처리 전문기업 공식 홈페이지 테마. 전해연마 · 아연/니켈/크롬 표면처리 · 주석아연도금.
Version: 4.5.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: haesong
*/

:root{
  --im-a1:url(assets/a1.jpg);
  --im-a2:url(assets/a2.jpg);
  --im-a4:url(assets/a4.jpg);
  --im-a7:url(assets/a7.jpg?v=2);
  --im-dry_btn:url(assets/dry_btn.jpg?v=2);
  --im-dry_in:url(assets/dry_in.jpg?v=2);
  --im-ep_after:url(assets/ep_after.jpg?v=3);
  --im-ep_before:url(assets/ep_before.jpg?v=3);
  --im-jeon:url(assets/jeon.jpg);
  --im-exterior_v:url(assets/exterior_v.jpg?v=2);
  --im-factory:url(assets/factory.jpg?v=5);
  --im-water:url(assets/water.jpg?v=2);
  --im-rectifier:url(assets/rectifier.jpg?v=2);
  --im-plating:url(assets/plating_line.jpg);
  --im-sn_after:url(assets/sn_after.jpg);
  --im-parts_wide:url(assets/parts_wide.jpg);
  --im-cr_parts:url(assets/cr_parts.jpg);
  --im-sn_line:url(assets/sn_line.jpg);
  --im-ep_card:url(assets/ep_card.jpg?v=6);
  --im-ep_icon:url(assets/ep_icon.jpg?v=4);
  --im-ep_compare:url(assets/ep_compare.jpg?v=4);
  --im-p3:url(assets/p3.jpg);
  --im-p6:url(assets/p6.jpg);
  --im-p7:url(assets/p7.jpg);
}
/* ================= 공통 (kumohdc common.css 기준) ================= */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{
  overflow-x:hidden;
  color:#333333;
  font-family:'Montserrat','Gothic A1','Apple SD Gothic Neo',sans-serif;
  font-size:62.5%;
  letter-spacing:-0.02em;
  word-break:keep-all;
  word-wrap:break-word;
}
body{font-size:1.6rem;background-color:#fff;line-height:1.6}
ul,ol{list-style:none}
a{color:inherit;outline:none;text-decoration:none}
button{font-family:inherit;background-color:transparent;border:none;outline:none;cursor:pointer;color:inherit}
b,strong{font-weight:800}
input,textarea,select{font-family:inherit;outline:none;color:#333}
h1,h2,h3,h4,h5{font-weight:inherit;font-size:inherit}
:focus-visible{outline:2px solid #293492;outline-offset:2px}

.container{max-width:1520px;width:100%;margin:0 auto;padding:0 15px}
.container_st1{max-width:1210px}
.container_vis{max-width:1410px}

.sec{padding:120px 0}
.sec_tit{font-size:4.4rem;font-weight:600;line-height:1.25}
.sec_tit.eb{font-weight:800}
.sec_underline{display:block;width:46px;height:2px;margin:25px 0;
  background:linear-gradient(90deg,#293492 0 26px,transparent 26px 32px,#293492 32px 46px)}
.sec_txt{font-size:2rem;line-height:1.5}
.sec_center{text-align:center}
.sec_center .sec_underline{margin:25px auto}
.sec_subtit{font-size:2.4rem;font-weight:600;color:#293492;margin:40px 0 30px}
.hr_line{border:0;border-top:1px solid #333;margin:60px 0 0}
.point{color:#e00f35}
.blue{color:#293492}

/* ================= 헤더 : 상단 고정 가로 바 ================= */
#header{
  position:fixed;top:0;left:0;width:100%;height:88px;
  border-bottom:1px solid #e8e8e8;
  box-shadow:0 4px 14px rgba(100,100,100,.05);
  font-family:'Gothic A1','Montserrat',sans-serif;
  z-index:99999;background-color:#fff;
}
#header .h_navi{
  max-width:1520px;width:100%;height:100%;margin:0 auto;padding:0 30px;
  display:flex;align-items:center;
}

/* 로고 */
.h_logo{display:block;flex:none;padding:0;margin-right:40px}
.h_logo .wordmark{display:flex;align-items:center;gap:9px}
.h_mark{width:24px;height:24px;flex:none;display:block;object-fit:contain}
.h_logo .wm_txt{
  font-family:'Montserrat',sans-serif;font-size:2.3rem;font-weight:800;
  color:#1b2a6b;letter-spacing:-0.03em;line-height:1;
}
.h_logo .wm_kr{
  display:block;margin-top:5px;padding-left:33px;font-size:1.05rem;font-weight:700;
  color:#8a8f9c;letter-spacing:0.2em;
}

/* 1차 메뉴 : 가로 나열 */
.h_menu{display:flex;align-items:stretch;height:100%;flex:0 0 auto;margin-left:auto}
.h_menu__list{position:relative;display:flex;align-items:center}
.h_menu__link{
  display:flex;align-items:center;height:100%;padding:0 24px;
  font-size:1.7rem;font-weight:700;color:#333;
  transition:color .2s;cursor:pointer;
}
.h_menu__list:hover .h_menu__link,.h_menu__list.on .h_menu__link{color:#293492}
/* 활성 메뉴 하단 인디케이터 */
.h_menu__list::after{
  content:"";position:absolute;left:24px;right:24px;bottom:0;height:3px;
  background-color:#293492;transform:scaleX(0);transform-origin:center;
  transition:transform .25s ease;
}
.h_menu__list:hover::after,.h_menu__list.on::after{transform:scaleX(1)}

/* 2차 메뉴 : 아래로 펼쳐지는 드롭다운 */
.submenu_inner{
  position:absolute;top:88px;left:50%;min-width:230px;
  background-color:#fff;border:1px solid #eee;border-top:2px solid #293492;
  box-shadow:0 10px 24px rgba(100,100,100,.13);padding:12px 0;
  opacity:0;visibility:hidden;transform:translateX(-50%) translateY(-8px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s;
}
.h_menu__list:hover .submenu_inner{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);
}
.h_submenu li a{
  display:block;padding:10px 24px;font-size:1.5rem;font-weight:500;color:#666;
  white-space:nowrap;transition:color .2s,background-color .2s;
}
.h_submenu li a:hover{color:#293492;background-color:#f4f7f9}

/* 우측 : 대표번호 + 언어 */
.h_bottom{display:flex;align-items:center;gap:20px;flex:none;padding:0;margin-left:30px}
.h_tel_box{text-align:right;line-height:1.2}
.h_tel_t{font-size:1.15rem;font-weight:700;color:#999;margin-bottom:2px;letter-spacing:.06em}
.h_tel{font-family:'Montserrat',sans-serif;font-size:1.9rem;font-weight:700;color:#333;letter-spacing:-0.04em}
.h_cta{
  display:inline-flex;align-items:center;gap:7px;flex:none;
  height:42px;padding:0 20px;border-radius:2px;
  background-color:#293492;color:#fff;
  font-size:1.5rem;font-weight:700;letter-spacing:-.02em;
  transition:background-color .22s;
}
.h_cta svg{width:17px;height:17px;flex:none}
.h_cta:hover{background-color:#1c2570}

/* 모바일 헤더 */
.mh_menu{display:none}

/* ================= 본문 래퍼 ================= */
.wrap{padding-top:88px;min-height:100vh}

/* 플로팅 견적문의 */
.float_quote{
  position:fixed;right:34px;bottom:34px;z-index:99998;
  width:96px;height:96px;border-radius:3px;
  background-color:rgba(238,238,238,.88);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  color:#333;font-size:1.3rem;font-weight:700;
  transition:background-color .25s,color .25s;
}
.float_quote:hover{background-color:#293492;color:#fff}
.float_quote svg{width:26px;height:26px}

/* ================= 이미지 플레이스홀더 ================= */
.ph{position:relative;overflow:hidden;background-color:#2b3138}
.ph::after{
  content:"";position:absolute;inset:0;
  background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.05) 0 1px,transparent 1px 7px);
  pointer-events:none;
}
.ph--hero1{background:linear-gradient(118deg,#12203a 0%,#20365c 42%,#0d1522 100%)}
.ph--hero2{background:linear-gradient(118deg,#1a2430 0%,#2c4a6b 46%,#0f171f 100%)}
.ph--hero3{background:linear-gradient(118deg,#141a24 0%,#293492 130%)}
.ph--dark{background:linear-gradient(140deg,#232a33 0%,#39424e 55%,#191d23 100%)}
.ph--steel{background:radial-gradient(circle at 34% 30%,#eef1f4 0%,#c3ccd4 48%,#98a4ae 100%)}
.ph--rnd{background:linear-gradient(160deg,#0a0d12 0%,#101827 55%,#0a0d12 100%)}
.ph--band1{background:linear-gradient(120deg,#3a4250 0%,#5a6675 100%)}
.ph--band2{background:linear-gradient(120deg,#2f3947 0%,#4d5a6b 100%)}
.ph--band3{background:linear-gradient(120deg,#252d38 0%,#414d5d 100%)}
.ph_tag{
  position:absolute;left:12px;top:12px;z-index:3;
  font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:600;letter-spacing:.12em;
  color:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.3);
  padding:3px 8px;border-radius:2px;
}
.ph_tag--dk{color:rgba(51,51,51,.55);border-color:rgba(51,51,51,.28)}

/* ================= 메인 : 비주얼 ================= */
.section--visual{position:relative;height:calc(100vh - 88px);min-height:600px;overflow:hidden}
.vis_slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;z-index:1}
.vis_slide.on{opacity:1;z-index:2}
.vis_slide::before{
  content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.28) 62%,rgba(0,0,0,.45) 100%);
}
.vis_inner{
  position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;justify-content:center;
}
.vis_txt{max-width:1410px;width:100%;margin:0 auto;padding:0 15px;color:#fff}
.vis_tit{
  font-family:'Montserrat',sans-serif;font-size:6.4rem;font-weight:800;line-height:1.14;
  letter-spacing:-0.03em;max-width:16ch;
}
.vis_stxt{margin-top:26px;font-size:1.8rem;font-weight:500;color:rgba(255,255,255,.86)}
.vis_page{
  position:absolute;right:44px;top:50%;transform:translateY(-50%);z-index:10;
  display:flex;flex-direction:column;align-items:center;gap:14px;
}
.vis_page button{
  width:2px;height:16px;border-radius:0;background-color:rgba(255,255,255,.45);
  transition:height .25s,background-color .25s;position:relative;
}
.vis_page button.on{height:36px;background-color:#fff}

/* ================= 메인 : 인트로 ================= */
.section--intro{background-color:#f4f4f4}
.its_head .sec_tit{color:#333}
.its_head .sec_tit .lt{font-family:'Montserrat',sans-serif;font-weight:600}
.its_head .sec_txt{color:#555;margin-top:4px}
.its_list{display:flex;gap:24px;margin-top:70px}
.its_list li{flex:1 1 33.333%}
.its_card{display:block;position:relative}
.its_card .ph{height:300px}
.its_card .ph::before{
  content:"";position:absolute;left:0;right:0;bottom:0;height:46%;z-index:2;
  background:linear-gradient(to top,rgba(0,0,0,.6),rgba(0,0,0,0));
}
.its_card .kr{
  position:absolute;left:22px;bottom:20px;z-index:4;color:#fff;
  font-size:1.8rem;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.4);
}
.its_card .en{
  display:block;text-align:center;margin-top:24px;
  font-family:'Montserrat',sans-serif;font-size:1.6rem;font-weight:700;
  letter-spacing:.06em;color:#333;
}
.its_card .its_border{position:absolute;inset:0;z-index:5;pointer-events:none}
.its_border span{position:absolute;background-color:#293492;transition:transform .3s linear;z-index:2}
.its_border span.top{width:4px;height:100%;top:0;left:0;transform:scaleY(0);transform-origin:50% 0}
.its_border span.bot{width:4px;height:100%;bottom:0;right:0;transform:scaleY(0);transform-origin:50% 100%}
.its_card:hover .its_border span.top,.its_card:hover .its_border span.bot{transform:scaleY(1)}

/* ================= 메인 : 서비스 원형 ================= */
.section--product{background-color:#fff}
.prd_list{display:flex;justify-content:center;gap:44px;margin-top:70px;flex-wrap:wrap}
.prd_list li{flex:0 0 210px}
.prd_item{display:block;text-align:center}
.prd_item .circle{
  display:block;margin:0 auto;
  width:210px;height:210px;border-radius:2px;border:1px solid #dedede;
  overflow:hidden;position:relative;transition:border-color .25s;
}
.prd_item:hover .circle{border-color:#293492}
.prd_item .circle .ph{position:absolute;inset:0}
.prd_item .en{
  display:block;margin-top:26px;font-family:'Montserrat',sans-serif;
  font-size:1.6rem;font-weight:700;letter-spacing:.05em;color:#333;line-height:1.35;
}
.prd_item .kr{display:block;margin-top:8px;font-size:1.5rem;font-weight:500;color:#777}

/* ================= 메인 : R&D ================= */
.section--rnd{background-color:#0b0e13;color:#fff;padding:120px 0}
.section--rnd .sec_tit{font-family:'Montserrat',sans-serif;color:#fff}
.section--rnd .sec_txt{color:rgba(255,255,255,.72)}
.rnd_box{position:relative;margin-top:64px;height:420px}
.rnd_grid{
  position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(770px,86%);height:250px;border:1px solid rgba(255,255,255,.55);
  display:flex;
}
.rnd_cell{
  flex:1 1 50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
}
.rnd_cell+.rnd_cell{border-left:1px solid rgba(255,255,255,.55)}
.rnd_cell .ic{width:44px;height:44px;margin-bottom:10px;opacity:.9}
.rnd_cell .kr{font-size:1.8rem;font-weight:700}
.rnd_cell .en{font-family:'Montserrat',sans-serif;font-size:1.5rem;font-weight:400;color:rgba(255,255,255,.72)}

/* ================= 메인 : 퀵 배너 ================= */
.section--quick{display:flex}
.qk{flex:1 1 33.333%;position:relative;height:190px;display:block}
.qk .ph{position:absolute;inset:0}
.qk::before{content:"";position:absolute;inset:0;z-index:3;background-color:rgba(0,0,0,.34);transition:background-color .3s}
.qk:hover::before{background-color:rgba(41,52,146,.6)}
.qk_in{
  position:relative;z-index:4;height:100%;display:flex;align-items:center;justify-content:center;gap:14px;
  color:#fff;font-size:1.8rem;font-weight:700;
}
.qk_in .cr{
  width:30px;height:26px;border-radius:0;border:1px solid rgba(255,255,255,.8);
  display:flex;align-items:center;justify-content:center;
}
.qk_in svg{width:12px;height:12px}

/* ================= 푸터 ================= */
#footer{background-color:#f1f1f1;padding:60px 0 40px}
.f_inner{display:flex;gap:40px;flex-wrap:wrap}
.f_left{flex:1 1 400px}
.f_logo .wordmark{display:flex;align-items:center;gap:8px}
.f_logo .h_mark{width:24px;height:24px}
.f_logo .wm_txt{font-family:'Montserrat',sans-serif;font-size:2.4rem;font-weight:800;color:#1b2a6b;letter-spacing:-0.03em}
.f_info{margin-top:26px;font-size:1.4rem;color:#666;line-height:1.9}
.f_cols{flex:2 1 620px;display:flex;gap:40px;flex-wrap:wrap}
.f_col{flex:1 1 180px}
.f_col h5{font-size:1.6rem;font-weight:700;color:#333;padding-bottom:12px;border-bottom:1px solid #333}
.f_col ul{margin-top:16px}
.f_col li{font-size:1.4rem;color:#8b8b8b;line-height:2}
.f_col li a:hover{color:#293492}
.f_bot{
  margin-top:48px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:1.3rem;color:#8b8b8b;
}
.f_bot .pv{font-weight:700;color:#666}

/* ================= 서브 페이지 ================= */
.sub_page{display:block}

.sub_head{padding:120px 0 0;text-align:center}
.sub_head .sec_tit{font-size:4.4rem;font-weight:800;color:#111}
.sub_head .sec_txt{font-size:1.8rem;color:#444;line-height:1.75}
.sub_body{padding:0 15px 120px}

.din{display:flex;gap:60px;align-items:flex-start;margin-top:70px}
.din .left{flex:1 1 46%}
.din .right{flex:1 1 54%}
.din_ph{height:auto;aspect-ratio:100/74.98;background-size:contain;background-repeat:no-repeat;background-position:center;background-color:#f2f2f2}
.din_txt{font-size:1.6rem;line-height:2;color:#444}
.din_txt p+p{margin-top:24px}
.din_sign{margin-top:40px;padding-top:24px;border-top:1px solid #dedede;font-size:1.6rem}
.din_sign b{font-size:2rem;margin-left:10px}

/* 비전 박스 */
.vision_box{
  margin-top:60px;background-color:#f4f7f9;padding:70px 60px;text-align:center;
}
.vision_box .vt{font-family:'Montserrat',sans-serif;font-size:1.6rem;font-weight:700;letter-spacing:.18em;color:#293492}
.vision_box .vm{font-size:3.2rem;font-weight:800;line-height:1.42;margin-top:22px;color:#222}
.vision_box .vs{margin-top:22px;font-size:1.7rem;color:#555}

.policy_list{display:flex;gap:24px;margin-top:50px;flex-wrap:wrap}
.policy_list li{
  flex:1 1 22%;min-width:210px;background-color:#fff;border:1px solid #e1e1e1;padding:34px 26px;text-align:center;
  transition:border-color .25s,box-shadow .25s;
}
.policy_list li:hover{border-color:#293492;box-shadow:0 6px 20px rgba(41,52,146,.09)}
.policy_list .no{font-family:'Montserrat',sans-serif;font-size:1.4rem;font-weight:700;color:#293492;letter-spacing:.1em}
.policy_list .pt{font-size:1.9rem;font-weight:800;margin:12px 0 12px;color:#222}
.policy_list .pd{font-size:1.5rem;color:#666;line-height:1.75}

/* 오시는 길 */
.map_box{margin-top:60px;border:1px solid #d9dbdc;position:relative;background-color:#eef0f2;overflow:hidden}
.map_box svg{display:block;width:100%;height:auto}
.map_note{
  position:absolute;right:18px;bottom:18px;background-color:rgba(255,255,255,.94);
  border:1px solid #d9dbdc;padding:9px 14px;font-size:1.35rem;color:#666;
}

/* 테이블 (kumohdc 장비현황 스타일) */
.tb_inner{display:flex;gap:40px;margin-top:50px;flex-wrap:wrap}
.tb_box{flex:1 1 420px;text-align:center}
.tb_box table{width:100%;border-collapse:collapse;border-bottom:1px solid #d9dbdc;table-layout:fixed}
.tb_box th,.tb_box td{font-weight:700;height:60px;padding:10px}
.tb_box th{font-size:2rem;color:#fff}
.tb_box td{font-size:1.7rem}
.tb_box tbody tr{background-color:#fff}
.tb_box tbody td{border-right:1px solid #d9dbdc}
.tb_box tbody td:last-child{border-right:0}
.table_b th{background-color:#293492}
.table_r th{background-color:#e00f35}
.table_b tbody tr:nth-child(2n){background-color:#f4f7f9}
.table_r tbody tr:nth-child(2n){background-color:#fef6f7}
.tb_cap{font-size:1.5rem;font-weight:700;color:#333;text-align:left;margin-bottom:14px}
.tb_box td.wide{font-size:1.5rem;font-weight:500;color:#555}
.tb_box td.na{color:#e00f35}

/* 공정 흐름 */
.prc_list{display:flex;margin-top:50px;flex-wrap:wrap;row-gap:34px}
.prc_list li{
  flex:1 1 0;min-width:150px;position:relative;padding-right:34px;
}
.prc_list li:last-child{padding-right:0}
.prc_list li::after{
  content:"";position:absolute;right:12px;top:52px;width:10px;height:10px;
  border-top:2px solid #c8ced4;border-right:2px solid #c8ced4;transform:rotate(45deg);
}
.prc_list li:last-child::after{display:none}
.prc_box{border:1px solid #e1e1e1;text-align:center;padding:26px 12px 24px;height:100%;background-color:#fff}
.prc_box .no{font-family:'Montserrat',sans-serif;font-size:1.3rem;font-weight:700;color:#999;letter-spacing:.1em}
.prc_box .nm{font-size:1.8rem;font-weight:800;margin-top:10px;color:#222}
.prc_box .ct{font-family:'Montserrat',sans-serif;font-size:1.5rem;font-weight:700;color:#293492;margin-top:8px}
.prc_box .ct.na{color:#e00f35}
.prc_box .rl{font-size:1.4rem;color:#777;margin-top:12px;line-height:1.6}

/* 사업분야 아이템 */
.biz_item{margin-top:80px}
.biz_item:first-of-type{margin-top:60px}
.biz_head{display:flex;align-items:baseline;gap:16px;padding-bottom:18px;border-bottom:2px solid #333}
.biz_head .no{font-family:'Montserrat',sans-serif;font-size:1.6rem;font-weight:800;color:#293492}
.biz_head .kr{font-size:2.8rem;font-weight:800;color:#111}
.biz_head .en{
  font-family:'Montserrat',sans-serif;font-size:1.4rem;font-weight:600;
  letter-spacing:.1em;color:#999;margin-left:auto;text-transform:uppercase;
}
.biz_body{display:flex;gap:50px;margin-top:44px;flex-wrap:wrap}
.biz_body .lt{flex:1 1 500px}
.biz_body .rt{flex:1 1 420px}
.biz_desc{font-size:1.6rem;line-height:1.95;color:#444}
.biz_tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.biz_tags span{
  font-size:1.4rem;font-weight:600;color:#293492;background-color:#f4f7f9;
  border:1px solid #dde5ee;padding:6px 14px;
}

/* 전후 비교 슬라이더 */
.ba{position:relative;aspect-ratio:91/14;overflow:hidden;--pos:50%;border:1px solid #d9dbdc}
.ba .lyr{position:absolute;inset:0}
.ba .lyr svg{display:block;width:100%;height:100%}
.ba .aft{clip-path:inset(0 0 0 var(--pos))}
.ba .dv{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;background-color:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.3);pointer-events:none;z-index:5}
.ba .kb{
  position:absolute;top:50%;left:var(--pos);width:44px;height:44px;margin:-22px 0 0 -22px;
  border-radius:2px;background-color:#fff;pointer-events:none;z-index:6;
  display:flex;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(0,0,0,.28);
  font-size:1.1rem;color:#293492;font-weight:800;letter-spacing:-1px;
}
.ba .cp{
  position:absolute;bottom:14px;z-index:5;font-size:1.3rem;font-weight:700;color:#fff;padding:6px 14px;
}
.ba .cp.b{left:14px;background-color:rgba(224,15,53,.9)}
.ba .cp.a{right:14px;background-color:rgba(41,52,146,.9)}
.ba input[type=range]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:7}
.ba_note{margin-top:12px;font-size:1.35rem;color:#999}

/* 단계 리스트 */
.step_list{margin-top:30px;border-top:1px solid #e1e1e1}
.step_list li{display:flex;gap:20px;padding:22px 0;border-bottom:1px solid #e1e1e1}
.step_list .n{font-family:'Montserrat',sans-serif;font-size:1.5rem;font-weight:800;color:#293492;flex:none;padding-top:2px}
.step_list .st{font-size:1.8rem;font-weight:700;color:#222}
.step_list .sd{font-size:1.5rem;color:#666;margin-top:4px;line-height:1.7}

/* 폼 (kumohdc form 스타일) */
.form_table{margin-top:50px;border-top:2px solid #333}
.form_row{display:flex;border-bottom:1px solid #e1e1e1;align-items:stretch}
.form_th{
  flex:0 0 200px;background-color:#f4f7f9;display:flex;align-items:center;padding:22px 24px;
  font-size:1.6rem;font-weight:700;color:#333;
}
.form_th .req{color:#e00f35;margin-left:4px}
.form_box{flex:1 1 auto;padding:16px 24px;display:flex;align-items:center;gap:12px}
.form_box input,.form_box select,.form_box textarea{
  width:100%;border:1px solid #dedede;padding:12px 14px;font-size:1.5rem;background-color:#fff;
  transition:border-color .2s;
}
.form_box textarea{min-height:170px;resize:vertical;line-height:1.7}
.form_box input:focus,.form_box select:focus,.form_box textarea:focus{border-color:#293492}
.form_agree{display:flex;align-items:flex-start;gap:10px;margin-top:26px;font-size:1.45rem;color:#666}
.form_agree input{width:17px;height:17px;margin-top:4px;flex:none;accent-color:#293492}
.form-buttons{width:100%;margin-top:50px;display:flex;justify-content:center}
.form-buttons .button{
  color:#fff;max-width:250px;width:100%;font-size:1.6rem;font-weight:700;height:55px;
  background-color:#293492;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid transparent;transition:all ease .3s;
}
.form-buttons .button:hover{background-color:#162075}
.form_err{margin-top:16px;font-size:1.45rem;color:#e00f35;font-weight:600;display:none;text-align:center}
.form_err.on{display:block}
.form_out{margin-top:34px;border:1px solid #d9dbdc;border-top:3px solid #293492;padding:30px;display:none;background-color:#fff}
.form_out.on{display:block}
.form_out h4{font-size:1.9rem;font-weight:800;color:#222}
.form_out p{font-size:1.5rem;color:#666;margin-top:8px}
.form_out pre{
  margin-top:18px;padding:20px;background-color:#f4f7f9;border:1px solid #e1e6ea;
  font-family:'Montserrat','Gothic A1',monospace;font-size:1.4rem;line-height:1.9;
  white-space:pre-wrap;overflow-x:auto;color:#444;
}

/* 연락처 카드 */
.ct_list{display:flex;gap:24px;margin-top:60px;flex-wrap:wrap}
.ct_list li{flex:1 1 260px;border:1px solid #e1e1e1;padding:32px 26px;text-align:center}
.ct_list .ct_t{font-family:'Montserrat',sans-serif;font-size:1.3rem;font-weight:700;letter-spacing:.16em;color:#999}
.ct_list .ct_v{font-size:2rem;font-weight:800;color:#222;margin-top:10px}
.ct_list .ct_d{font-size:1.4rem;color:#777;margin-top:6px}

/* 안내 박스 */
.notice{
  margin-top:40px;border:1px solid #f2c9d1;background-color:#fef6f7;padding:22px 26px;
  font-size:1.45rem;color:#555;line-height:1.8;
}
.notice b{color:#e00f35}
.todo{color:#999;border-bottom:1px dashed #e00f35}

/* ================= 실사진 / 영상 ================= */
.pic{
  background-image:var(--i);background-size:cover;background-position:center;
  background-repeat:no-repeat;background-color:#1a1f25;
}
.pic::after{content:none !important}
.mf{position:absolute;inset:0;overflow:hidden}
.mf video{width:100%;height:100%;object-fit:cover;display:block}


/* ================= 반응형 ================= */
@media (max-width:1400px){
  .vis_tit{font-size:5.2rem}
}
@media (max-width:1200px){
  .sec{padding:80px 0}
  .sec_tit{font-size:3rem}
  .sub_head .sec_tit{font-size:3.2rem}
  .sec_underline{margin:18px 0}
  .sec_center .sec_underline{margin:18px auto}
  .sec_txt{font-size:1.8rem}
  .sec_subtit{font-size:2rem;margin:28px 0 22px}
  #header{height:50px}
  #header .h_navi{padding:0;height:50px}
  .h_logo{margin:0;padding:0 16px;display:flex;flex-direction:column;justify-content:center;height:50px}
  .h_logo .wm_txt{font-size:1.9rem}
  .h_logo .wm_kr{display:none}
  .mh_menu{display:block;margin-left:auto;padding-right:14px}
  .mh_menu__btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center}
  .mh_menu__btn i,.mh_menu__btn i::before,.mh_menu__btn i::after{
    display:block;width:20px;height:2px;background-color:#333;content:"";position:relative;
  }
  .mh_menu__btn i::before{position:absolute;top:-6px}
  .mh_menu__btn i::after{position:absolute;top:6px}
  .h_menu{
    display:none;position:absolute;top:50px;left:0;width:100%;height:auto;background-color:#fff;
    border-top:1px solid #e1e1e1;box-shadow:0 8px 16px rgba(0,0,0,.08);flex:none;
    max-height:calc(100vh - 50px);overflow-y:auto;
  }
  .h_menu.on{display:block}
  .h_menu__list{display:block;width:100%}
  .h_menu__list::after{display:none}
  .h_menu__link{display:block;height:auto;padding:16px 20px;border-bottom:1px solid #f1f1f1}
  .submenu_inner{
    position:static;min-width:0;opacity:1;visibility:visible;transform:none;
    box-shadow:none;border:0;padding:6px 0 12px;background-color:#fafbfc;
  }
  .h_submenu li a{padding:8px 34px}
  .h_bottom{display:none}
  .wrap{padding-top:50px}
  .section--visual{height:calc(100vh - 50px);min-height:520px}
  .vis_tit{font-size:3.6rem}
  .vis_stxt{font-size:1.6rem}
  .float_quote{width:74px;height:74px;right:18px;bottom:18px;font-size:1.15rem}
  .float_quote svg{width:20px;height:20px}
  .its_list{gap:16px}
  .its_card .ph{height:220px}
  .din{gap:34px;margin-top:44px}
  .din_ph{height:auto;aspect-ratio:100/74.98}
  .vision_box{padding:44px 24px}
  .vision_box .vm{font-size:2.4rem}
  .rnd_box{height:340px}
  .rnd_grid{height:200px}
}
@media (max-width:1024px){
  .sub_head .sec_tit{font-size:2.6rem}
  .sec_subtit{font-size:1.8rem;margin:20px 0 14px}
  .its_list{flex-wrap:wrap}
  .its_list li{flex:1 1 100%}
  .din{flex-direction:column}
  .biz_body{display:block}
  .biz_body .rt{margin-top:30px}
  .form_row{flex-wrap:wrap}
  .form_th{flex:1 1 100%;padding:14px 18px}
  .form_box{padding:14px 18px}
  .tb_box th{font-size:1.7rem}
  .tb_box td{font-size:1.5rem}
  .tb_box th,.tb_box td{height:50px}
}
@media (max-width:700px){
  .vis_tit{font-size:2.8rem}
  .sec{padding:60px 0}
  .section--quick{flex-direction:column}
  .qk{flex:0 0 auto;height:130px}
  .prc_list li{flex:1 1 100%;padding-right:0}
  .prc_list li::after{display:none}
  .rnd_grid{flex-direction:column;height:auto;width:88%;padding:20px 0}
  .rnd_cell{padding:24px 0}
  .rnd_cell+.rnd_cell{border-left:0;border-top:1px solid rgba(255,255,255,.45)}
  .biz_head{flex-wrap:wrap}
  .biz_head .en{margin-left:0;flex:1 1 100%}
  .vision_box .vm{font-size:2rem}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}

/* ================= 워드프레스 추가 ================= */
/* 허니팟 — 사람에게는 보이지 않지만 스크린리더/봇에는 존재 */
.hs_hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 접수 결과 안내 */
.form_msg{
  margin:0 0 24px;padding:16px 20px;border-radius:2px;
  font-size:1.6rem;font-weight:600;line-height:1.5;
}
.form_msg.ok{background-color:#eef2fb;border-left:3px solid #293492;color:#293492}
.form_msg.err{background-color:#fdeef1;border-left:3px solid #e00f35;color:#b00c29}

/* 관리자 바가 뜰 때 좌측 사이드바가 가려지지 않도록 */
body.admin-bar #header{top:32px}
body.admin-bar .submenu_inner{top:88px}
@media screen and (max-width:782px){
  body.admin-bar #header{top:46px}
}


/* ================= 전해연마 상세 (ep_*) ================= */
.ep_lead{margin-top:46px;padding:38px 40px;background-color:#f4f7f9;border-left:3px solid #293492}
.ep_lead p{font-size:1.9rem;line-height:1.65;color:#333;font-weight:500}
.ep_lead p + p{margin-top:14px;font-size:1.7rem;color:#555;font-weight:400}

.ep_merit{display:flex;gap:20px;margin-top:34px;flex-wrap:wrap}
.ep_merit li{
  flex:1 1 0;min-width:190px;padding:26px 24px;
  border:1px solid #e1e1e1;background-color:#fff;transition:border-color .25s,box-shadow .25s;
}
.ep_merit li:hover{border-color:#293492;box-shadow:0 6px 20px rgba(41,52,146,.09)}
.ep_merit .ic{
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  border:1px solid #dfe3ea;color:#293492;margin-bottom:16px;
}
.ep_merit .ic svg{width:22px;height:22px}
.ep_merit .t{font-size:1.7rem;font-weight:700;color:#222}
.ep_merit .d{margin-top:8px;font-size:1.45rem;color:#777;line-height:1.55}

.ep_split{display:flex;gap:56px;margin-top:60px;align-items:flex-start}
.ep_split .lt{flex:0 0 34%}
.ep_split .rt{flex:1 1 auto;min-width:0}
.ep_why p{font-size:1.6rem;line-height:1.75;color:#555}
.ep_why p + p{margin-top:16px}

.ep_flow{display:flex;gap:0;margin-top:26px;flex-wrap:wrap}
.ep_flow li{flex:1 1 0;min-width:150px;position:relative;padding:0 8px}
.ep_flow li::after{
  content:"";position:absolute;top:34px;right:-6px;width:12px;height:12px;
  border-top:2px solid #c8ccd4;border-right:2px solid #c8ccd4;transform:rotate(45deg);
}
.ep_flow li:last-child::after{display:none}
.ep_flow .box{border:1px solid #e1e1e1;padding:20px 16px;height:100%;background-color:#fff}
.ep_flow .no{font-family:'Montserrat',sans-serif;font-size:1.3rem;font-weight:800;color:#293492}
.ep_flow .nm{margin-top:8px;font-size:1.6rem;font-weight:700;color:#222}
.ep_flow .rl{margin-top:7px;font-size:1.35rem;color:#888;line-height:1.5}

.ep_good{margin-top:14px}
.ep_good li{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid #ececec}
.ep_good li:first-child{border-top:1px solid #ececec}
.ep_good .n{
  font-family:'Montserrat',sans-serif;font-size:1.35rem;font-weight:800;
  color:#293492;flex:none;padding-top:3px;
}
.ep_good .t{font-size:1.6rem;font-weight:700;color:#222}
.ep_good .d{margin-top:5px;font-size:1.45rem;color:#777;line-height:1.55}

.ep_use{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.ep_use li{
  flex:1 1 30%;min-width:150px;padding:18px 20px;background-color:#f4f7f9;
  font-size:1.55rem;font-weight:600;color:#333;
}
.ep_use li span{display:block;margin-top:5px;font-size:1.35rem;font-weight:400;color:#888}

.ep_note{
  margin-top:44px;padding:24px 30px;background-color:#293492;color:#fff;
  font-size:1.7rem;font-weight:600;text-align:center;line-height:1.5;
}

/* ================= 부대설비 (설비 페이지) ================= */
.fc_hero{margin-top:40px;height:420px;position:relative;overflow:hidden}
.fc_hero .cap{
  position:absolute;left:0;bottom:0;padding:16px 24px;
  background-color:rgba(0,0,0,.55);color:#fff;font-size:1.5rem;font-weight:600;
}
.aux_list{margin-top:34px}
.aux_item{display:flex;gap:48px;align-items:center}
.aux_item + .aux_item{margin-top:56px}
.aux_item:nth-child(2n){flex-direction:row-reverse}
.aux_item .ph{flex:0 0 46%;height:330px}
.aux_item .tx{flex:1 1 auto;min-width:0}
.aux_item .en{
  font-family:'Montserrat',sans-serif;font-size:1.4rem;font-weight:700;
  letter-spacing:.08em;color:#293492;
}
.aux_item .kr{margin-top:10px;font-size:2.4rem;font-weight:700;color:#222}
.aux_item .ds{margin-top:18px;font-size:1.6rem;line-height:1.75;color:#555}
.aux_item .ds + .ds{margin-top:12px}
.aux_tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.aux_tags span{
  padding:7px 14px;font-size:1.4rem;font-weight:600;
  color:#293492;background-color:#f4f7f9;
}

@media (max-width:1024px){
  .ep_split{flex-direction:column;gap:34px}
  .ep_split .lt{flex:1 1 100%}
  .ep_flow li::after{display:none}
  .aux_item,.aux_item:nth-child(2n){flex-direction:column;gap:24px}
  .aux_item .ph{flex:1 1 100%;width:100%;height:260px}
  .fc_hero{height:280px}
}

/* 단일 실사 이미지 (전후 슬라이더 대체) */
.biz_shot{position:relative;aspect-ratio:16/10;overflow:hidden}
.biz_shot .ph{position:absolute;inset:0}
.biz_shot .tag{
  position:absolute;left:14px;bottom:14px;padding:7px 14px;
  background-color:rgba(41,52,146,.9);color:#fff;font-size:1.35rem;font-weight:700;
}

/* 채팅 상담 링크 */
.chat_link{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 16px;border:1px solid #293492;border-radius:2px;
  color:#293492;font-size:1.5rem;font-weight:700;
  transition:background-color .2s,color .2s;
}
.chat_link svg{width:17px;height:17px;flex:none}
.chat_link:hover{background-color:#293492;color:#fff}

.ba_full{margin-top:44px}
.ba_full .ba_note{margin-top:12px}

/* 전해연마 전후 비교샷 */
.ep_compare{position:relative;margin-top:44px;max-width:720px;margin-left:auto;margin-right:auto}
.ep_compare .ph{height:auto;aspect-ratio:100/107.36;background-size:contain;background-repeat:no-repeat;background-position:center;background-color:#f2f2f2}
.ep_compare .lb{
  position:absolute;display:inline-flex;align-items:baseline;gap:8px;
  padding:10px 18px;font-size:1.6rem;font-weight:800;color:#fff;letter-spacing:-.02em;
}
.ep_compare .lb em{font-family:'Montserrat',sans-serif;font-size:1.25rem;font-weight:700;font-style:normal;opacity:.85}
.ep_compare .lb.b{left:20px;top:20px;background-color:rgba(60,66,74,.9)}
.ep_compare .lb.a{left:20px;bottom:74px;background-color:rgba(41,52,146,.94)}
.ep_compare .cap{margin-top:14px;font-size:1.4rem;color:#888;text-align:center}

@media (max-width:700px){
  .ep_compare .lb{padding:7px 12px;font-size:1.35rem}
  .ep_compare .lb.b{left:14px;top:14px}
  .ep_compare .lb.a{left:14px;bottom:52px}
}

/* 부대설비 사양 배지 */
.aux_item .kr .badge{
  display:inline-block;margin-left:10px;padding:5px 12px;vertical-align:middle;
  background-color:#293492;color:#fff;font-size:1.35rem;font-weight:700;letter-spacing:-.02em;
}

/* 플로팅 채팅상담 — 카카오 브랜드 컬러 */
.float_quote{background-color:rgba(254,229,0,.95);color:#3c1e1e}
.float_quote:hover{background-color:#fee500;color:#3c1e1e}
.float_quote svg{fill:#3c1e1e;stroke:none}

/* 선택 항목 구분선 */
.form_opt_t{
  margin:30px 0 12px;padding-left:14px;border-left:3px solid #dedede;
  font-size:1.45rem;color:#888;font-weight:500;
}

/* 오시는 길 지도 (구글 지도 임베드) */
.hs_map{width:100%;height:480px}
.hs_map iframe{display:block;width:100%;height:100%;border:0}
.hs_map_ph{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  width:100%;height:100%;background-color:#eef1f4;color:#333;text-align:center;padding:0 20px;
  transition:background-color .2s;
}
.hs_map_ph:hover{background-color:#e4e9ee}
.hs_map_ph_n{
  display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:12px;
  background-color:#03c75a;color:#fff;font-family:'Montserrat',sans-serif;font-size:2.8rem;font-weight:900;
}
.hs_map_ph_t{font-size:2rem;font-weight:700;color:#222}
.hs_map_ph_a{font-size:1.5rem;color:#777}
.hs_map_lb{
  padding:7px 14px;background-color:#293492;color:#fff;border-radius:2px;
  font-size:1.4rem;font-weight:700;white-space:nowrap;
  box-shadow:0 3px 10px rgba(0,0,0,.28);
}
.hs_map_lb::after{
  content:"";position:absolute;left:50%;bottom:-6px;margin-left:-6px;
  border:6px solid transparent;border-top-color:#293492;border-bottom:0;
}
.map_bar{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  flex-wrap:wrap;margin-top:18px;
}
.map_addr{font-size:1.6rem;color:#444}
.map_addr b{margin-right:10px;color:#222}
.map_go{
  display:inline-flex;align-items:center;gap:8px;flex:none;
  padding:11px 20px;border:1px solid #293492;border-radius:2px;
  color:#293492;font-size:1.5rem;font-weight:700;
  transition:background-color .2s,color .2s;
}
.map_go svg{width:17px;height:17px;flex:none}
.map_go:hover{background-color:#293492;color:#fff}
@media (max-width:700px){
  .hs_map{height:340px}
  .map_bar{flex-direction:column;align-items:flex-start;gap:12px}
}

/* ================= 모바일 터치 영역 ================= */
@media (max-width:1200px){
  /* 푸터 링크 17px → 40px */
  .f_col li{line-height:1.5}
  .f_col li a{display:inline-block;padding:11px 0;min-height:40px;box-sizing:border-box}
  /* 슬라이드 인디케이터 16px → 40px 히트영역 */
  .vis_page{gap:6px}
  .vis_page button{position:relative}
  .vis_page button::after{content:"";position:absolute;left:-18px;right:-18px;top:-12px;bottom:-12px}
  /* 본문 안내 링크 */
  .biz_desc a,.tb_box a{display:inline-block;padding:6px 0}
}

/* 전화번호 링크는 주변 글자색을 그대로 따른다 */
.h_tel a,.ct_v a,.f_col li a[href^="tel:"],.tb_box a[href^="tel:"]{color:inherit}
.h_tel a:hover,.ct_v a:hover{color:#293492}

/* ================= 모바일 : 긴 블록 접기 ================= */
@media (max-width:1024px){
  .mfold{max-height:240px;overflow:hidden;position:relative}
  .mfold::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:110px;
    background:linear-gradient(180deg,rgba(255,255,255,0) 0%,#fff 82%);
    pointer-events:none;
  }
  .mfold.on{max-height:none}
  .mfold.on::after{display:none}
  .mfold_btn{
    display:flex;align-items:center;justify-content:center;gap:9px;
    width:100%;margin-top:16px;padding:15px 12px;
    border:1px solid #d9dbdc;background-color:#fff;
    font-size:1.5rem;font-weight:700;color:#293492;letter-spacing:-.02em;
  }
  .mfold_btn::after{
    content:"";width:8px;height:8px;flex:none;
    border-right:2px solid #293492;border-bottom:2px solid #293492;
    transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s;
  }
  .mfold_btn.on::after{transform:rotate(-135deg) translate(-2px,-2px)}
  .mfold_btn:active{background-color:#f4f7f9}
}

/* ================= 모바일 : 세로로 길던 목록을 2열로 ================= */
@media (max-width:1024px){
  /* 홈 Our Service — 2행 2열 */
  .prd_list{display:grid;grid-template-columns:1fr 1fr;gap:26px 14px;margin-top:44px}
  .prd_list li{flex:none;min-width:0}
  .prd_item .circle{width:100%;height:auto;aspect-ratio:1/1}
  .prd_item .en{margin-top:16px;font-size:1.35rem;line-height:1.3}
  .prd_item .kr{margin-top:6px;font-size:1.35rem}

  /* 전해연마 4대 효과 */
  .ep_merit{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .ep_merit li{min-width:0;padding:18px 14px}
  .ep_merit .ic{width:38px;height:38px;margin-bottom:12px}
  .ep_merit .t{font-size:1.5rem}
  .ep_merit .d{font-size:1.3rem}

  /* 적용 분야 */
  .ep_use{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .ep_use li{min-width:0;padding:14px;font-size:1.4rem}
  .ep_use li span{font-size:1.25rem}

  /* 설비 공정 흐름 */
  .prc_list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:34px}
  .prc_list li{min-width:0;padding:0}
  .prc_list li::after{display:none}
  .prc_box{padding:20px 10px 18px}
  .prc_box .nm{font-size:1.6rem}
  .prc_box .rl{font-size:1.3rem;margin-top:9px}

  /* 전해연마 공정 순서 */
  .ep_flow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .ep_flow li{min-width:0;padding:0}
}
@media (max-width:360px){
  .prd_list,.ep_merit,.ep_use,.prc_list,.ep_flow{grid-template-columns:1fr}
}

/* ================= 모바일 메뉴 아코디언 ================= */
/* 터치 기기에서는 hover 로 열리는 데스크톱 동작을 완전히 차단한다.
   (:hover 규칙이 우선순위가 높아 서브메뉴를 왼쪽으로 밀어내던 문제) */
@media (hover:none),(max-width:1200px){
  .h_menu__list:hover .submenu_inner,
  .h_menu__list .submenu_inner{
    position:static;left:auto;right:auto;top:auto;
    transform:none;opacity:1;visibility:visible;
    min-width:0;width:100%;box-shadow:none;border:0;
  }
}
@media (max-width:1200px){
  .h_menu__list{position:relative}
  .h_menu__link{padding-right:64px}

  .submenu_inner{
    display:block;height:0;overflow:hidden;padding:0;
    background-color:#fafbfc;
    transition:height .26s ease;
  }
  .h_submenu{display:block;width:100%;padding:6px 0 12px}
  .h_submenu li{display:block;width:100%}
  .h_submenu li a{display:block;width:100%;color:#666;padding:11px 34px}

  .h_sub_toggle{
    position:absolute;right:0;top:0;width:62px;height:60px;z-index:3;
    display:flex;align-items:center;justify-content:center;
    background-color:transparent;border:0;border-bottom:1px solid #f1f1f1;
  }
  .h_sub_toggle::after{
    content:"";width:9px;height:9px;
    border-right:2px solid #999;border-bottom:2px solid #999;
    transform:rotate(45deg) translate(-2px,-2px);transition:transform .22s;
  }
  .h_sub_toggle[aria-expanded="true"]::after{
    transform:rotate(-135deg) translate(-2px,-2px);border-color:#293492;
  }
  .h_menu__list.open > .h_menu__link{color:#293492}
}

/* ================= 모바일 : 세로로 길던 목록을 2열로 ================= */
@media (max-width:1024px){
  /* 홈 Our Service — 2행 2열 */
  .prd_list{display:grid;grid-template-columns:1fr 1fr;gap:26px 14px;margin-top:44px}
  .prd_list li{flex:none;min-width:0}
  .prd_item .circle{width:100%;height:auto;aspect-ratio:1/1}
  .prd_item .en{margin-top:16px;font-size:1.35rem;line-height:1.3}
  .prd_item .kr{margin-top:6px;font-size:1.35rem}

  /* 전해연마 4대 효과 */
  .ep_merit{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .ep_merit li{min-width:0;padding:18px 14px}
  .ep_merit .ic{width:38px;height:38px;margin-bottom:12px}
  .ep_merit .t{font-size:1.5rem}
  .ep_merit .d{font-size:1.3rem}

  /* 적용 분야 */
  .ep_use{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .ep_use li{min-width:0;padding:14px;font-size:1.4rem}
  .ep_use li span{font-size:1.25rem}

  /* 설비 공정 흐름 */
  .prc_list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:34px}
  .prc_list li{min-width:0;padding:0}
  .prc_list li::after{display:none}
  .prc_box{padding:20px 10px 18px}
  .prc_box .nm{font-size:1.6rem}
  .prc_box .rl{font-size:1.3rem;margin-top:9px}

  /* 전해연마 공정 순서 */
  .ep_flow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .ep_flow li{min-width:0;padding:0}
}
@media (max-width:360px){
  .prd_list,.ep_merit,.ep_use,.prc_list,.ep_flow{grid-template-columns:1fr}
}

/* ================= 모바일 메뉴 아코디언 ================= */
@media (max-width:1200px){
  .h_menu__list{position:relative}
  .h_menu__link{padding-right:64px}
  .submenu_inner{display:none}
  .h_menu__list.open .submenu_inner{display:block}

  .h_sub_toggle{
    position:absolute;right:0;top:0;width:62px;height:60px;z-index:3;
    display:flex;align-items:center;justify-content:center;
    background-color:transparent;border:0;border-bottom:1px solid #f1f1f1;
  }
  .h_sub_toggle::after{
    content:"";width:9px;height:9px;
    border-right:2px solid #999;border-bottom:2px solid #999;
    transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s;
  }
  .h_sub_toggle[aria-expanded="true"]::after{
    transform:rotate(-135deg) translate(-2px,-2px);border-color:#293492;
  }
  .h_menu__list.open > .h_menu__link{color:#293492}
}

/* ================= 세로 배치 시 flex-basis 가 '높이'로 둔갑하던 문제 ================= */
@media (max-width:1024px){
  .biz_body .lt,.biz_body .rt,
  .din .left,.din .right,
  .ep_split .lt,.ep_split .rt,
  .aux_item .tx,
  .rnd_cell{flex:0 0 auto}
}

/* ================= 모바일 서브메뉴 : 데스크톱 값 완전 초기화 ================= */
@media (max-width:1200px){
  .submenu_inner{
    display:none;position:static;left:auto;right:auto;top:auto;
    min-width:0;width:100%;transform:none;opacity:1;visibility:visible;
    transition:none;box-shadow:none;border:0;
  }
  .h_menu__list.open > .submenu_inner{display:block}
  .h_submenu{display:block;width:100%}
  .h_submenu li{display:block;width:100%}
  .h_submenu li a{display:block;width:100%;color:#666}
}

/* ================= PROCESS 영상 위 글자 가독성 ================= */
.rnd_box .mf::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,11,16,.34) 0%,rgba(8,11,16,.52) 55%,rgba(8,11,16,.62) 100%);
}
.rnd_grid{
  background-color:rgba(8,11,16,.30);
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}
.rnd_cell .kr,.rnd_cell .en{text-shadow:0 1px 6px rgba(0,0,0,.65)}

/* ================= 다크모드에서도 밝은 화면 고정 ================= */
:root{color-scheme:light}
html{background-color:#fff}
body{background-color:#fff;color:#333}
input,select,textarea,button{color-scheme:light}
@media (prefers-color-scheme:dark){
  :root{color-scheme:light}
  html,body{background-color:#fff;color:#333}
  .form_box input,.form_box select,.form_box textarea{background-color:#fff;color:#333}
  img,video{filter:none}
}

/* ================= 모바일 메인 비주얼 : 절반 높이 + 전체 노출 ================= */
@media (max-width:1024px){
  .section--visual{
    width:100%;height:293px;
    min-height:0;max-height:none;aspect-ratio:auto;
    background-color:#0b0e13;
    transition:height .45s ease;
  }
  /* 잘라내지 않고 전체를 보여준다 (영상 16:9 · 사진 4:3) */
  .mf video{object-fit:contain;background-color:#0b0e13}
  .vis_slide .ph.pic{background-size:contain;background-repeat:no-repeat;background-position:center;background-color:#0b0e13}
  /* 어두운 여백 위에 글자가 놓이므로 상단 그라디언트는 약하게 */
  .vis_slide::before{background:linear-gradient(180deg,rgba(0,0,0,.22) 0%,rgba(0,0,0,.06) 35%,rgba(0,0,0,.72) 100%)}

  .vis_inner{justify-content:flex-end;padding-bottom:20px}
  .vis_txt{padding:0 18px}
  .vis_tit{font-size:2.4rem;line-height:1.25}
  .vis_stxt{margin-top:10px;font-size:1.4rem}
  .vis_page{right:14px;gap:5px}
}
@media (max-width:700px){
  .section--visual{height:255px}
  .vis_tit{font-size:2.1rem}
}
