body { width: 100%; overflow: initial; }
body, html { text-align: initial; height: 100%; }
html { overflow-x: clip; overflow-y: auto; height: auto; min-height: 100%; }
body { overflow: visible; height: auto; min-height: 100%; width: 100%; }
a { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; text-decoration: none; }
img { max-width: 100%; }
#wrap { width: 100%; word-break: auto-phrase; position: relative; top: 0px; left: 0px;; }
#toTop { display: none; text-decoration: none; position: fixed; bottom: 100px; right: 10px; overflow: hidden; width: 50px; height: 50px; border: none; text-indent: -999999px; background: url(../images/totop.png); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60); opacity: 0.6; z-index: 99999; background-color: #83c01e; background-repeat: no-repeat; background-position: center center; border-radius: 100px; }
#toTop:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; }
.hidden_txt { position: absolute!important; font-size: 0!important; line-height: 0!important; overflow: hidden!important; }
.fust_color { color: #83c01e!important; }
/* 에셋 */




/* main_en */
.main_sec_wrap { position: relative; top: 0px; left: 0px; }
.viewer { width: var(--w); margin: 40px auto; position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); background: #000; isolation: isolate; }
.viewer .poster, .viewer .video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; will-change: opacity; }
.viewer .poster { opacity: 1; }
.viewer .video { opacity: 0; pointer-events: none; }
.viewer:has(.controls a:hover) .poster { opacity: 0; }
.viewer:has(a[data-vid="1"]:hover) .video[data-vid="1"] { opacity: 1; }
.viewer:has(a[data-vid="2"]:hover) .video[data-vid="2"] { opacity: 1; }
.viewer:has(a[data-vid="3"]:hover) .video[data-vid="3"] { opacity: 1; }
.controls { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; }
.hero-rotator { position: relative; height: 100vh; min-height: 360px; background: #000; }
.hero-vid-wrap { position: relative; width: 100%; height: 100%; }
.hero-vid { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-controls { position: relative; inset: 0; display: flex; align-items: center; justify-content: space-between; padding-top: 80px; }
.main .btn { width: 52px; height: 52px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .2); color: #fff; font-size: 24px; cursor: pointer; }
.main .btn:hover { background: rgba(255, 255, 255, .35); }
.rotator { position: relative; width: 100%; max-width: inherit; margin: 0 auto; aspect-ratio: 16/9; background: #000; overflow: hidden; user-select: none; height: 100vh; }
.rotator>.item { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; }
.rotator>.item.is-active { display: flex; }
.rotator video, .rotator img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rotator .hint { position: absolute; top: 50%; right: 33%; padding: 30px; font-size: 15px; color: #fff; background: rgba(0, 0, 0, .35); border-radius: 999px; transition: 0.5s; }
.rotator.clickable { cursor: pointer; }
/* main_en */



/* main_kr */
.k_stage { height: 300vh; background: #fff; position: relative; overflow: visible; width: 100%; }
.k_frame { position: relative; height: 100svh; overflow: hidden; background: #fff; display: flex; align-items: center; justify-content: center; width: 100%; left: 0; top: 0; }
.k_frame.is-pin { position: fixed; top: 0; left: 0; width: 100%; height: 100svh; z-index: 50; }
.k_frame.is-after { position: absolute; left: 0; width: 100%; z-index: 1; }
.k_intro_copy { position: relative; z-index: 1; width: 100%; max-width: 1200px; text-align: center; display: flex; flex-direction: column; gap: 150px; padding: 0; box-sizing: border-box; }
.k_intro_tit { font-size: 60px; font-weight: 800; color: #111; line-height: 1.25; letter-spacing: -0.03em; margin: 0; }
.k_pill { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 220px; height: 90px; border-radius: 999px; overflow: hidden; z-index: 4; will-change: width, height, border-radius; background: transparent; }
.k_pill_bg { position: absolute; inset: 0; background: center/cover no-repeat; background-color: #000; transform: scale(1.02); will-change: transform, opacity; }
.k_zoom_bg { position: absolute; inset: 0; z-index: 2; opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.k_bg_item { position: absolute; inset: 0; background: center/cover no-repeat; opacity: 0; transform: scale(1.03); transition: opacity .6s ease, transform .8s ease; }
.k_bg_item.is_on { opacity: 1 !important; overflow: hidden; width: 90%; margin: 5% auto 5% auto; border-radius: 80px; }
.k_dim { position: absolute; inset: 0; background: rgba(0,0,0,.45); opacity: 0; pointer-events: none; z-index: 3; }
.k_copy_wrap { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; z-index: 5; padding: 0 5vw; box-sizing: border-box; }
.k_copy { width: 100%; max-width: 1200px; opacity: 0; color: #fff; }
.k_copy.is_on { opacity: 1; }
.k_kicker1 { font-size: 18px; text-align: center; }
.k_kicker { font-size: 40px; font-weight: 700; text-align: center; margin-bottom: 24px; opacity: .92; line-height: 1.5; }
.k_badge { display: inline-block; padding: 24px 60px; margin-bottom: 24px; font-size: 60px; font-weight: 800; border-radius: 999px; background: rgba(0,0,0,.8); backdrop-filter: blur(10px); }
.k_title { font-size: 40px; font-weight: 700; opacity: .98; }
/* main_kr */






/* sub_02_05 추출 솔루션 */
.pf_table {  width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: #fff; color: #111827; font-size: 16px; }
.pf_table th, .pf_table td { padding: 18px 14px; text-align: center; vertical-align: middle; border-bottom: 1px solid #eceff3; }
.pf_table thead tr:first-child th { background: #f3f4f6; font-weight: 700; color: #6b7280; border-bottom: 0; }
.pf_table thead tr:last-child th { background: #8cc63f; color: #fff; font-weight: 800; border-bottom: 0; }
.pf_table thead tr:first-child th:first-child { border-top-left-radius: 10px; }
.pf_table thead tr:first-child th:last-child { border-top-right-radius: 10px; }
.pf_table tbody tr:last-child td:first-child { border-bottom-left-radius: 10px; }
.pf_table tbody tr:last-child td:last-child { border-bottom-right-radius: 10px; }
.pf_table { border: 1px solid #eceff3; border-radius: 10px; overflow: hidden; }
.pf_method { font-weight: 800; text-align: left; padding-left: 22px; color: #374151; background: #fff; }
.pf_val { font-weight: 600; color: #111827; }
.pf_result { text-align: left; padding: 22px 22px; background: #f3f4f6; }
.pf_result .pf_list { margin: 0; padding-left: 18px; }
.pf_result .pf_list li { margin: 8px 0; font-weight: 800; color: #111827; line-height: 1.5; }
.pf_table tbody td { background: #fff; }
.sub_02_05 .grid1fr { display: grid; grid-template-columns: 1fr; gap: 40px; }
.sub_02_05 .grid1fr > * { min-width: 0; }
.sub_02_05 .right_cont_01 .right_cont_card_wrap img { aspect-ratio: 4/3; object-fit: cover; border-radius: 16px; }
.pf_table_wrap { width: 100%; max-width: 100%; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.pf_table { width: 100%; min-width: 800px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.pf_table th, .pf_table td { white-space: nowrap; }
@media (max-width:520px) {
  .pf_table_wrap { padding-bottom: 6px; }
}
.data_con_wrap { padding: 30px 0; }
.grid3fr { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
/* sub_02_05 추출 솔루션 */






/* sub_01_03 수처리공정 */
.cavitox_dark_sec { position: relative; padding: 120px 0; background: radial-gradient(900px 520px at 12% 12%, rgba(140,198,63,.22), rgba(0,0,0,0) 62%), radial-gradient(900px 520px at 88% 18%, rgba(56,189,248,.12), rgba(0,0,0,0) 55%), radial-gradient(900px 520px at 65% 85%, rgba(99,102,241,.12), rgba(0,0,0,0) 55%), linear-gradient(180deg, #05080f 0%, #070b14 50%, #060913 100%); overflow: hidden; }
.cavitox_dark_sec:before { content: ""; position: absolute; inset: -2px; background: radial-gradient(1200px 700px at 45% -10%, rgba(255,255,255,.06), rgba(0,0,0,0) 60%), radial-gradient(900px 600px at 35% 115%, rgba(140,198,63,.08), rgba(0,0,0,0) 65%); pointer-events: none; }
.cavitox_dark_inner { width: 100%; margin: 0 auto; padding: 0; box-sizing: border-box; }
.cavitox_dark_hero { position: relative; border-radius: 28px; padding: 42px 42px 26px; background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)); border: 1px solid rgba(255,255,255,.10); box-shadow: 0 30px 90px rgba(0,0,0,.45); backdrop-filter: blur(8px); }
.cavitox_dark_badge { display: inline-flex; align-items: center; padding: 10px 14px; border-radius: 999px; background: rgba(140,198,63,.14); border: 1px solid rgba(140,198,63,.28); color: #c9ff84; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.cavitox_dark_head { display: grid; grid-template-columns: 1.15fr .85fr; gap: 34px; align-items: start; margin-top: 18px; }
.cavitox_dark_titlewrap { min-width: 0; }
.cavitox_dark_title { margin: 0; font-size: clamp(34px, 3.6vw, 54px); letter-spacing: -0.04em; color: #f8fafc; line-height: 1.05; }
.cavitox_dark_title_accent { color: #b9ff5a; text-shadow: 0 0 24px rgba(140,198,63,.35); }
.cavitox_dark_subtitle { margin: 12px 0 0; color: rgba(226,232,240,.92); font-weight: 800; letter-spacing: -0.02em; line-height: 1.35; font-size: clamp(16px, 1.5vw, 22px); }
.cavitox_dark_desc { margin: 8px 0 0; color: rgba(203,213,225,.90); line-height: 1.8; max-width: 560px; }
.cavitox_dark_cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 18px; }
.cavitox_dark_btn { display: inline-flex; align-items: center; justify-content: center; padding: 12px 16px; border-radius: 14px; font-weight: 900; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease; }
.cavitox_dark_btn_primary { color: #0b1220; background: #8cc63f; border: 1px solid rgba(0,0,0,.18); box-shadow: 0 18px 50px rgba(140,198,63,.22); }
.cavitox_dark_btn_ghost { color: #e5e7eb; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.16); }
.cavitox_dark_kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 40px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.10); }
.cavitox_dark_kpi { border-radius: 16px; padding: 20px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); }
.cavitox_dark_kpi_label { font-size: 18px; letter-spacing: .12em; text-transform: uppercase; color: rgba(148,163,184,.92); font-weight: 800; }
.cavitox_dark_kpi_val { margin-top: 16px; font-size: 20px; font-weight: 700; color: #f1f5f9; }
.cavitox_dark_features { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-top: 22px; }
.cavitox_dark_features > * { min-width: 0; }
.cavitox_dark_card { position: relative; border-radius: 22px; padding: 22px 20px 20px; background: radial-gradient(520px 240px at 85% 0%, rgba(140,198,63,.12), rgba(0,0,0,0) 62%), rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.10); box-shadow: 0 20px 70px rgba(0,0,0,.35); overflow: hidden; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; min-height: 220px; }
.cavitox_dark_card_key { border-color: rgba(140,198,63,.35); background: radial-gradient(640px 280px at 75% 0%, rgba(140,198,63,.18), rgba(0,0,0,0) 60%), rgba(255,255,255,.05); }
.cavitox_dark_card_key:after { content: ""; position: absolute; right: -140px; top: -140px; width: 280px; height: 280px; border-radius: 999px; background: rgba(140,198,63,.12); filter: blur(2px); pointer-events: none; }
.cavitox_dark_pill { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 999px; background: rgba(140,198,63,.12); border: 1px solid rgba(140,198,63,.25); color: rgba(226,232,240,.92); font-weight: 800; font-size: 18px; }
.cavitox_dark_dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #8cc63f; box-shadow: 0 0 0 6px rgba(140,198,63,.14); }
.cavitox_dark_card_title { margin: 14px 0 0; color: #b9ff5a; font-weight: 700; letter-spacing: -0.02em; font-size: 26px; }
.cavitox_dark_card_desc { margin: 12px 0 0; color: rgba(203,213,225,.90); line-height: 1.75; }
@media (max-width:1600px) {
  .cavitox_dark_sec { padding: 150px 5%; }
  .sub_div_03_02 .sub_div_03_02_cont_wrap { flex-direction: column; }
}
@media (max-width:1200px) {
  .cavitox_dark_head { grid-template-columns: 1fr; }
  .cavitox_dark_desc { max-width: 100%; }
  .cavitox_dark_kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cavitox_dark_features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:680px) {
  .sub_div_03_02 .sub_div_03_02_text_wrap { width: 100%; gap: 20px; grid-template-columns: repeat(1, 1fr); }
  .cavitox_dark_sec { padding: 80px 5%; }
  .cavitox_dark_hero { padding: 26px 18px 18px; border-radius: 22px; }
  .cavitox_dark_kpis { grid-template-columns: 1fr; }
  .cavitox_dark_features { grid-template-columns: 1fr; }
  .cavitox_dark_card { min-height: auto; }
  .sub_01_03_sec_04_all_wrap { display: grid; grid-template-columns: repeat(1, 1fr); gap: 10px; }
  .sec_padding001 { padding: 60px 0; }
  .pf_table {min-width: 1200px;}

}
.cavi3_sec { width: 100%; }
.cavi3_inner { width: 100%; margin: 0 auto; box-sizing: border-box; }
.cavi3_head { margin-bottom: 26px; }
.cavi3_h2 { margin: 0; color: #111827; font-size: clamp(24px, 2.2vw, 34px); font-weight: 900; letter-spacing: -0.03em; }
.cavi3_sub { margin: 10px 0 0; color: #4b5563; line-height: 1.75; font-weight: 700; max-width: 720px; }
/* definition card */
.cavi3_defcard { border-radius: 18px; background: #f9fafb; padding: 18px 18px; }
.cavi3_defbadge { display: inline-flex; align-items: center; padding: 8px 12px; border-radius: 999px; background: rgba(140,198,63,.14); color: #2f6b12; font-weight: 900; letter-spacing: .10em; text-transform: uppercase; font-size: 12px; }
.cavi3_defdesc { margin: 12px 0 0; color: #111827; line-height: 1.75; font-weight: 800; }
/* block */

.cavi3_block_head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.cavi3_kicker { font-size: 18px; letter-spacing: .14em; text-transform: uppercase; color: #6b7280; font-weight: 900; }
.cavi3_block_tit { font-weight: 900; color: #111827; letter-spacing: -0.01em; }
/* steps */
.cavi3_steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.cavi3_step { border-radius: 18px; background: #ffffff; padding: 20px; min-width: 0; box-shadow: 0 10px 24px rgba(17,24,39,.06); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.cavi3_step:hover { transform: translateY(-2px); border-color: rgba(140,198,63,.38); box-shadow: 0 18px 46px rgba(17,24,39,.10); }
.cavi3_step_key { border-color: rgba(140,198,63,.55); background: radial-gradient(520px 260px at 70% 0%, rgba(140,198,63,.12), rgba(255,255,255,0) 60%), #ffffff; }
.cavi3_step_no { font-weight: 900; color: rgba(17,24,39,.45); letter-spacing: .10em; font-size: 18px; margin-bottom: 10px; }
.cavi3_step_icon { width: 100%; border-radius: 14px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; }
.cavi3_step_icon img { max-width: 100%; height: auto; display: block; }
.cavi3_step_txt { margin-top: 12px; }
.cavi3_step_tit { font-weight: 900; color: #111827; letter-spacing: -0.01em; font-size: 20px; }
.cavi3_step_desc { margin-top: 8px; color: #4b5563; line-height: 1.6; font-weight: 700; font-size: 18px; }
/* metrics */
.cavi3_metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.cavi3_metric { border-radius: 16px; background: #f9fafb; padding: 30px; text-align: center; }
.cavi3_metric_k { display: inline-flex; font-size: 18px; align-items: center; justify-content: center; padding: 10px 16px; border-radius: 999px; background: #ffffff; border: 1px solid #eceff3; font-weight: 900; color: #111827; margin-bottom: 10px; }
.cavi3_metric_v { font-weight: 700; font-size: 20px; color: #111827; letter-spacing: -0.01em; }
/* result */
.cavi3_result { margin-top: 14px; }
.cavi3_result_in { border-radius: 18px; background: linear-gradient(90deg, rgba(17,24,39,.06), rgba(140,198,63,.12)); padding: 30px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 12px; align-items: center; }
.cavi3_result_tit { font-weight: 900; color: #111827; letter-spacing: -0.02em; font-size: 20px; }
.cavi3_result_right { color: #374151; line-height: 1.7; font-size: 20px; }
@media (max-width:1100px) {
  .cavi3_head { grid-template-columns: 1fr; }
  .cavi3_inner { padding: 0 5%; }
}
@media (max-width:980px) {
  .cavi3_steps { grid-template-columns: repeat(2, 1fr); }
  .cavi3_metrics { grid-template-columns: 1fr; }
  .cavi3_result_in { grid-template-columns: 1fr; }
}
@media (max-width:560px) {
  .cavi3_sec { padding: 0; }
  .cavi3_block { padding: 18px 12px; }
  .cavi3_steps { grid-template-columns: 1fr; }
  .cavi3_result_right { font-size: 15px; }
  .cavi3_metric_v { font-size: 15px; }
  .cavi3_step_desc { font-size: 15px; }
}
/* sub_01_03 수처리공정 */




/* sub_02_03 */
.ue2_sec { padding: 0 0 80px 0;  }
.ue2_inner { width: 100%; margin: 0 auto; padding: 0 var(--page-pad, 5vw); box-sizing: border-box; }
/* head */
.ue2_head { text-align: center; margin-bottom: 40px; }
.ue2_kicker { display: inline-flex; align-items: center; padding: 10px 14px; border-radius: 999px; background: rgba(255,42,42,.10); border: 1px solid rgba(255,42,42,.18); color: #ff2a2a; font-weight: 900; letter-spacing: .10em; text-transform: uppercase; font-size: 12px; }
.ue2_title { margin: 14px 0 0; color: #111827; font-weight: 900; letter-spacing: -0.03em; font-size: clamp(24px, 2.4vw, 38px); line-height: 1.25; }
.ue2_head_line { width: 92px; height: 6px; border-radius: 999px; background: linear-gradient(90deg, #ff2a2a, rgba(140,198,63,.9)); margin: 18px auto 0; }
/* layout */

/* cards */
.ue2_cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ue2_card { border-radius: 18px; background: #fafafa;   padding: 20px; min-height: 164px; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }

.ue2_card_top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.ue2_badge { display: inline-flex; align-items: center; padding:10px 16px; border-radius: 999px; background: rgba(17,24,39,.06); border: 1px solid rgba(236,239,243,1); color: #111827; font-weight: 700; font-size: 18px; letter-spacing: .06em; }
.ue2_card_tit { font-weight: 900; color: #111827; letter-spacing: -0.02em; font-size: 20px; line-height: 1.2; }
.ue2_card_desc { margin-top: 10px; color: #4b5563; font-weight: 700; line-height: 1.65; font-size: 18px; }
/* right textbox */
.ue2_textbox { border-radius: 20px; background: rgba(17,24,39,.03);  padding: 22px 22px; }
.ue2_desc { margin: 0; color: #111827; font-weight: 700; line-height: 1.85; font-size: 18px; word-break: keep-all; }
.ue2_points { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.ue2_point { display: flex; align-items: flex-start; gap: 20px; font-size: 18px; color: #374151; font-weight: 800; line-height: 1.6; }
.ue2_point_dot { width: 10px; height: 10px; border-radius: 50%; background: #8cc63f; box-shadow: 0 0 0 6px rgba(140,198,63,.12); margin-top: 10px; flex: 0 0 auto; }
/* =========================================================
  Responsive
========================================================= */
@media (max-width:1100px) {
  .ue2_grid { grid-template-columns: 1fr; }
  .ue2_textbox { padding: 18px 16px; }
}
@media (max-width:680px) {
  .ue2_sec { padding: 76px 0; }
  .ue2_head { margin-bottom: 26px; }
  .ue2_cards { grid-template-columns: 1fr; }
  .ue2_card { min-height: auto; }
  .ue2_card_tit { font-size: 18px; }
}
/* sub_02_03 */