@charset "utf-8";

/**
 * Legacy CSS (combined)
 * 
 * Sources:
 *   - css/global.css (Shell + Page-specific styles)
 *   - inc/view_template.css (Block + Popup styles)
 * 
 * Excluded:
 *   - #vis, #ban, #slogan (Main page only — 후속 작업)
 * 
 * Image paths: ../images/ → /images/legacy/
 */

/* ====================================================================
   1. Reset / Wrap
   ==================================================================== */
* {word-break:keep-all;box-sizing:border-box;letter-spacing:-0.025em;word-spacing:-0.025em;}
#wrap {min-width:1240px;position:relative;overflow:hidden;}

/* ====================================================================
   2. Header (#header, .gnb, .tnb, .mnu)
   Source: global.css L6-37
   ==================================================================== */
#header {--legacy-header-height:clamp(90px, 4.8vw, 108px);position:absolute;left:0;top:0;width:100%;z-index:500;padding:0 20px;height:var(--legacy-header-height);overflow:hidden;transition:0.3s;background:#fff;}
#header:before {content:"";display:block;position:absolute;left:0;top:calc(var(--legacy-header-height) - 1px);width:100%;height:1px;background:rgba(85,85,85,0.16);transition:0.3s;}
#header .inner {max-width:1720px;height:var(--legacy-header-height);margin:0 auto;position:relative;font-size:0;white-space:nowrap;text-align:center;z-index:10;}
#header .logo {position:absolute;left:0;top:50%;transform:translateY(-50%);}
#header .logo a {display:block;width:clamp(257px, 10vw + 110px, 360px);height:clamp(40px, 1.8vw + 16px, 56px);background:url(/images/legacy/logo-color.png) 0 50% / contain no-repeat;text-indent:-9999px;}
#header .gnb {display:inline-block;}
#header .gnb > li {display:inline-block;vertical-align:top;position:relative;}
#header .gnb > li > a {display:block;padding:0 clamp(36px, 1.2vw + 20px, 52px);font-size:clamp(20px, 0.45vw + 14px, 26px);height:var(--legacy-header-height);line-height:var(--legacy-header-height);color:#555;transition:0.3s;}
#header .gnb > li > a > span {display:block;position:relative;}
#header .gnb > li > a > span:before {content:"";display:block;position:absolute;left:50%;background:#165ea2;height:4px;transition:0.3s;opacity:0;bottom:0;width:0;}
#header .gnb > li > ul {display:block;position:absolute;left:0;top:100%;width:100%;padding-top:clamp(24px, 0.9vw + 12px, 34px);}
#header .gnb > li > ul > li > a {display:block;font-size:clamp(17px, 0.34vw + 13px, 21px);font-weight:300;padding:clamp(11px, 0.35vw + 7px, 15px) 0;color:rgba(85,85,85,0.75);}
#header .gnb > li:hover > a > span:before,
#header .gnb > li.active > a > span:before {opacity:1;left:0;width:100%;}
#header .gnb > li > ul > li:hover > a,
#header .gnb > li > ul > li.active > a {text-decoration:underline;color:#555;}
#header .tnb {position:absolute;right:48px;top:50%;margin-top:-6.5px;}
#header .tnb li {display:inline-block;vertical-align:top;position:relative;}
#header .tnb li ~ li {margin-left:10px;padding-left:11px;}
#header .tnb li ~ li:before {content:"";display:block;width:1px;height:9px;position:absolute;left:0;top:50%;margin-top:-4.5px;background:#555;}
#header .tnb li a {display:block;font-size:clamp(13px, 0.12vw + 11.5px, 15px);font-weight:300;color:rgba(85,85,85,0.8);letter-spacing:0;}
#header .mnu {width:24px;height:18px;border:none;position:absolute;right:0;top:50%;margin-top:-9px;background:url(/images/legacy/head-menu.png) no-repeat 0 -18px;}

/* Header hover state */
#header:hover {height:clamp(430px, 7vw + 390px, 580px);}

/* ====================================================================
   3. Footer (#footer)
   Source: global.css L106-115
   ==================================================================== */
#footer {padding:40px 20px;background:#202020;}
#footer .inner {max-width:1720px;margin:0 auto;position:relative;}
#footer address {font-size:16px;font-weight:300;line-height:1.6em;color:#fff;}
#footer .copy {margin-top:30px;font-size:12px;color:rgba(255,255,255,0.29);letter-spacing:0;}
#footer .rig {position:absolute;right:0;top:0;white-space:nowrap;text-align:right;}
#footer .rig .tnb {font-size:0;}
#footer .rig .tnb li {display:inline-block;vertical-align:top;}
#footer .rig .tnb li ~ li {margin-left:12px;}
#footer .rig .tnb li a {display:block;font-size:14px;font-weight:300;color:rgba(255,255,255,0.36);}
#footer .rig h2 {margin-top:16px;}
#footer .rig h2 img {display:block;max-width:240px;max-height:66px;width:auto;height:auto;margin-left:auto;}

/* ====================================================================
   4. SVIS (#svis, .snb)
   Source: global.css L117-142
   ==================================================================== */
#svis {background-repeat:no-repeat;background-position:50% 0;background-size:cover;text-align:center;color:#fff;}
#svis .inner {max-width:1200px;margin:0 auto;height:500px;position:relative;}
#svis dl {padding-top:210px;}
#svis dl dt {font-size:36px;font-weight:bold;}
#svis dl dd {font-size:18px;margin-top:13px; font-weight:300; letter-spacing:-0.05em; display:inline-block; padding:0px 10px 4px 10px;}
#svis .snb {position:absolute;left:0;bottom:0;width:100%;background:#fff;height:70px;box-shadow:inset 0 -1px 0 #dfdfdf;}
#svis .snb ul {text-align:center;font-size:0;}
#svis .snb ul li {display:inline-block;vertical-align:top;}
#svis .snb ul li a {display:block;height:70px;line-height:70px;font-size:18px;color:#555;padding:0 60px;position:relative;}
#svis .snb.snb--condensed ul {display:flex;align-items:stretch;justify-content:center;white-space:nowrap;}
#svis .snb.snb--condensed ul li {display:block;flex:1 1 0;min-width:0;}
#svis .snb.snb--condensed ul li a {display:flex;align-items:center;justify-content:center;height:70px;line-height:1.25;font-size:clamp(17px, 0.22vw + 12px, 18px);padding:0 clamp(10px, 0.85vw + 2px, 24px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#svis .snb ul li a:before {
    content:"";
    border:6px solid transparent;
    border-bottom:6px solid #e71419;
    display:none;
    height:0;
    width:0;
    left:50%;
    margin-left:-6px;
    position:absolute;
    bottom:0;
}
#svis .snb ul li:hover a {color:#e71419;}
#svis .snb ul li.active a {box-shadow:inset 0 -1px 0 #e71419;color:#e71419;}
#svis .snb ul li.active a:before {display:block;}

/* ====================================================================
   5. Sub / Content Area
   Source: global.css L145-148
   ==================================================================== */
#sub {background:#eee;}
#sub > .inner {max-width:1200px;margin:0 auto;padding:100px 0;background:#fff;}
#content {max-width:1200px;margin:20px;min-height:300px;background-color:#f5f5f5;}
.legacy-content-surface {max-width:1200px;margin:20px;min-height:300px;background-color:#f5f5f5;}

/* ====================================================================
   8. Main Landing Page
   Source: global.css L39-104 (Modified paths)
   ==================================================================== */
#vis {text-align:center;font-size:0;}
#vis,
#vis .vis {position:relative;overflow:hidden;}
#vis .vis {height:100vh;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;text-align:center;}
#vis .txt {color:#fff;position:absolute;left:0;top:50%;margin-top:-89px;width:100%;z-index:100;}
#vis .txt dl dt {font-size:26px;letter-spacing:0em;opacity:0;transition:1s;transition-delay:0.3s;transform:scale(1.1);display:inline-block;background:rgba(0,0,0,0.7);padding:0px 10px;color:#fff;}
#vis .txt dl dt span,
#vis .txt dl dt strong {vertical-align:baseline;}
#vis .txt dl dd {font-size:60px;font-weight:bold;letter-spacing:-0.1em;margin:10px 0 45px;opacity:0;transition:1s;transition-delay:0.6s;transform:scale(1.1);text-shadow:0px 0px 35px rgba(0,0,0,0.9);}
#vis .txt p {font-size:22px;font-weight:600;letter-spacing:-0.05em;opacity:0;transition:1s;transition-delay:0.9s;transform:scale(1.1);text-shadow:0px 0px 10px rgba(0,0,0,0.9);}
#vis .txt2 {position:absolute;left:0;top:50%;width:100%;margin-top:-273px;text-align:left;}
#vis .txt2 .ver {max-width:1240px;margin:0 auto;}
#vis .txt2 .ver dl {text-shadow:0px 0px 5px rgba(0,0,0,0.5),0px 0px 10px rgba(0,0,0,0.5);}
#vis .txt2 .ver dl dt {font-size:56px;line-height:1.25em;font-weight:300;position:relative;padding-bottom:52px;margin-bottom:35px;color:#fff;opacity:0;transition:1s;transition-delay:0.3s;transform:scale(1.1);}
#vis .txt2 .ver dl dt:before {content:"";display:block;width:65px;height:3px;background:rgba(255,255,255,0.5);position:absolute;left:0;bottom:0;}
#vis .txt2 .ver dl dd {position:relative;font-size:24px;font-weight:600;color:#fff;line-height:1.8em;opacity:0;transition:1s;transition-delay:0.6s;transform:scale(1.1);}
#vis .txt2 .ver p {position:relative;margin-top:110px;opacity:0;transition:1s;transition-delay:0.9s;transform:scale(1.1);}
#vis .txt2 .ver p a {display:inline-block;width:220px;height:60px;line-height:58px;box-sizing:border-box;border:1px solid #fff;background:rgba(255,255,255,0.73);text-align:center;color:#000;font-size:16px;font-weight:bold;}
#vis .btn {width:200px;height:56px;line-height:54px;background:rgba(255,255,255,0.6);transition:0.3s;border:2px solid #303030;font-size:16px;font-weight:500;display:block;position:absolute;left:50%;top:50%;margin:200px 0 0 -100px;color:#303030;opacity:0;transition:1s;transition-delay:1.2s;transform:scale(1.1);}
#vis .vis1 {background-image:url(/images/legacy/vis1.jpg);}
#vis .vis2 {background-image:url(/images/legacy/vis2.jpg);}
#vis .vis3 {background-image:url(/images/legacy/vis3.jpg);}
#vis .vis4 {background-image:url(/images/legacy/vis1.jpg);}

.load #vis .txt dl dt,
.load #vis .txt dl dd,
.load #vis .txt p,
.load #vis .txt2 dl dt,
.load #vis .txt2 dl dd,
.load #vis .txt2 p,
.load #vis .btn {opacity:1;transform:scale(1);}

#vis .slick-arrow {position:absolute;bottom:63px;width:13px;height:19px;display:block;text-align:left;font-size:0;border:none;text-indent:-9999px;overflow:visible;z-index:100;}
#vis .slick-arrow.slick-prev {right:50%;margin-right:70px;background:url(/images/legacy/vis-prev.png) no-repeat;}
#vis .slick-arrow.slick-next {left:50%;margin-left:70px;background:url(/images/legacy/vis-next.png) no-repeat;}

#vis .slick-dots {font-size:0;position:absolute;width:140px;left:50%;margin-left:-70px;z-index:100;bottom:66px;text-align:center;}
#vis .slick-dots li {display:inline-block;vertical-align:top;margin:0 10px;}
#vis .slick-dots li button {box-sizing:border-box;width:13px;height:13px;border-radius:50%;background:transparent;border:none;text-indent:-9999px;border:3px solid #fff;}
#vis .slick-dots .slick-active button {background:#fff;}

#ban {overflow:hidden;}
#ban:after {content:'';display:block;clear:both;}
#ban a {width:33.333333%;height:300px;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;display:block;float:left;text-align:center;font-size:0;white-space:nowrap;position:relative;overflow:hidden;}
#ban a:before {content:"";display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.4);transition:0.3s;z-index:10;}
#ban a:after {content:'';display:inline-block;width:0;height:100%;vertical-align:middle;}
#ban a .img {position:absolute;left:0;top:0;width:100%;height:100%;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;transition:1.5s;}
#ban a .txt {display:inline-block;vertical-align:middle;position:relative;z-index:100;}
#ban a .txt > * {display:block;}
#ban a .txt strong {font-size:30px;font-weight:600;font-family:'Poppins',sans-serif;color:#fff;margin-top:27px;text-shadow:0px 0px 10px rgba(0,0,0,0.9);}
#ban a:hover:before {opacity:0;}
#ban a:hover .img {transform:scale(1.05);}
#ban .ban1 .img {background-image:url(/images/legacy/ban1.jpg);}
#ban .ban2 .img {background-image:url(/images/legacy/ban2.jpg);}
#ban .ban3 .img {background-image:url(/images/legacy/ban3.jpg);}

#slogan {height:100vh;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;text-align:center;position:relative;background-image:url(/images/legacy/slogan-bg.jpg);}
#slogan .txt {color:#fff;position:absolute;left:0;top:50%;margin-top:-89px;width:100%;z-index:100;}
#slogan .txt dl dt {font-size:30px;letter-spacing:-0.1em;opacity:0;transition:1s;transition-delay:0.3s;transform:scale(1.1);text-shadow:0px 0px 10px rgba(0,0,0,2.9);}
#slogan .txt dl dd {font-size:60px;font-weight:bold;letter-spacing:-0.1em;margin:10px 0 25px;opacity:0;transition:1s;transition-delay:0.6s;transform:scale(1.1);text-shadow:0px 0px 10px rgba(0,0,0,2.9);}
#slogan .txt p {font-size:18px;font-weight:600;line-height:1.6em;letter-spacing:-0.01em;opacity:0;transition:1s;transition-delay:0.9s;transform:scale(1.1);display:inline-block;background:rgba(0,0,0,0.6);padding:10px 10px;}
#slogan .btn {width:200px;height:56px;line-height:54px;background:rgba(255,255,255,0.6);transition:0.3s;border:2px solid #303030;font-size:16px;font-weight:500;display:block;position:absolute;left:50%;top:50%;margin:200px 0 0 -100px;color:#303030;opacity:0;transition:1s;transition-delay:1.2s;transform:scale(1.1);}
#slogan.active .txt dl dt,
#slogan.active .txt dl dd,
#slogan.active .txt p,
#slogan.active .btn {opacity:1;transform:scale(1);}