@charset "utf-8";

/* basic */

/* float */
.fl_l { float:left}
.fl_r { float:right}

/* text align */
.ta_l { text-align:left}
.ta_c { text-align:center}
.ta_r { text-align:right}

/* text ellipsis */
.txt_elps { text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}

/* hide */
.hdn { position:absolute; left:0; top:0; width:0; height:0; overflow:hidden;}

/* overflow hidden */
.of_h { overflow:hidden;}
.of_x_h	{ overflow-x:hidden;}
.of_y_h	{ overflow-y:hidden;}

/* root */
:root {
    --tc_black: #000;
	--tc_white: #fff;
    --tc_red: #ec0e3b;
    --tc_yellow: #f4d81c;
    --tc_orange: #f98911;
    --tc_green: #079ca3;
    --tc_blue01:#1fa7f0;
    --tc_blue02: #125ae0;
    --tc_blue03	:#1624a7;
    --tc_gray01	:#464646;
    --tc_gray02	:#666666;
    --tc_gray03	:#999999;
    --tc_footer	:#0e1723;
}

/* layout*/
.wrap { width:100%; height:100%; position:relative; }
.wrap { min-width:1400px; overflow:auto }

/* snb */
.skip { position:absolute; left:0; top:0; width:100%; z-index:900;}
.skip a { display:block; width:100%; position:absolute; left:0; top:0; font-size:16px; line-height:24px; font-weight:500; color:#fff; background:#3a6ac4; padding:12px 0; text-align:center; transform:translateY(-100%); transition:transform 0.16s ease-out;}

/* header */
.container{ width:100%; /*max-width: 1400px; width: calc(100% - 40px); margin: auto;*/}

#header { position:relative; background:transparent; margin:0; padding:0; z-index:9999 }
#header .logo a { display:block; width:319px; height:50px; margin-left:40px; margin-top:30px; background:url(../images/common/logo2.png) no-repeat 0 0; }

#header .container {display: flex; justify-content:space-between; align-items:flex-start; }
#header .gnb { /*text-align:right;*/ }
#header .nav .logo { display:flex; width:200px; flex-wrap:wrap; justify-content:center; align-items:center; text-transform:uppercase; cursor:pointer; }

#header .menu_btn { width:76px; height:76px; padding:23px; background-color:var(--tc_blue03); z-index:999; }
#header .menu_btn div { content:''; width:31px; height:2px; background-color:#ffffff; margin: 6px 0px; position: relative; transition:all .4s ease-out;}
#header .menu_btn.hmenu div { position:absolute; margin:28px 22px; transition:all .4s ease-out;}
#header .menu_btn.hmenu div:nth-child(1) { transform:rotate(45deg); top:7px; right:0px;}
#header .menu_btn.hmenu div:nth-child(2) { width:0px; top:7px; right:0px;}
#header .menu_btn.hmenu div:nth-child(3) { transform:rotate(-45deg); top:7px; right:0px;}
#header .menu_btn::before { content:''; position:absolute; top:10px; left:-150px; display:block; width:100px; height:30px; background:url(../images/common/ktl_slogan.png)no-repeat center center;}
#header .btn_ktl { position:absolute; display:block; width:76px; height:76px; top:76px; right:0; z-index:999; background:var(--tc_yellow) url(../images/common/ico_ktlhome.png)no-repeat center center;  }
#header .menu_btn + div.sitemap { display:none; }
#header .menu_btn.hmenu + div.sitemap { position:absolute; display:block; top:0; left:0; z-index:99; width:100%; height:100vh; background-color:rgb(255, 255, 255) }

#header .nav ul.gnb { display:flex; margin-bottom:0px; padding-left:0px; }
#header .nav ul.gnb li{  margin-bottom:0px; color:#000000; text-align:center; position:relative;}
#header .nav ul.gnb li a { display:block; transition:.8s ease; text-transform:uppercase; box-sizing:border-box;}
#header .nav ul.gnb > li > a { padding:38px 50px 20px 50px; color:#fff; font-size:18px; font-weight:500}
#header .nav ul.gnb > li:nth-child(2) > a { padding:38px 60px 20px 60px;}
#header .nav ul.gnb li ul.sub{ position:absolute; padding-left:0px; padding-top:20px; padding-bottom:10px; opacity:0; visibility:hidden; z-index:3; width:100%}
#header .nav ul.gnb li ul.sub li { display:block; position:relative; font-weight:300; }
#header .nav ul.gnb li ul.sub li a { padding:10px; }

#header .nav ul.gnb:hover li ul.sub { visibility:visible; opacity:1;transform:translateY(0px);}
#header .nav ul.gnb li:hover { display:inline-block; margin-bottom:0px;}
#header.open .hd_bg { position:absolute; width:100%; background:linear-gradient(to bottom right, rgb(0, 6, 34, 0.4), rgba(23, 23, 23, 0.6)); backdrop-filter: blur(50px); z-index: 1; transition: all .3s; border-top: 1px solid #4c4c4c80; }
#header .nav ul.gnb li ul.sub li a { text-align:left; color:#fff; }
/* #header .nav ul.gnb li ul.sub li a:hover { font-weight:500; } */
#header .nav .active { position:relative }
#header .nav .active:hover:after {content:''; display:block; position:absolute; width:100%; height:4px; background-color:var(--tc_blue03); left:0; bottom:0 }
#header .nav ul.gnb li ul.sub { display:block !important}
/* sitemap */
#header .menu_btn + div.sitemap { display:none; }
#header .menu_btn.hmenu + div.sitemap { display:flex; justify-content: flex-start; flex-direction: column; z-index:99; width:100%; height:100vh; padding:100px; background:linear-gradient(to bottom right, rgb(0, 35, 189), rgb(0, 9, 56)); /*background-color:#0066d3*/ }
.sitemap p.title { display:block;  font-size:60px; font-weight:500; color:var(--tc_white);  }
.s_nav { width:100%; padding-top:30px; }
.s_nav ul {display:flex; flex-direction:row; justify-content:space-between; margin-top:70px; }
.s_nav ul li:last-child { margin-right:100px; }
.s_nav ul li a { display:block; color:var(--tc_white); font-size:38px; font-weight:500 }
.s_nav ul li ul.sub { display:flex; flex-direction:column; margin-top:50px; }
.s_nav ul li ul.sub li a { font-size:18px; line-height:34px; }


/* swipper slide */
.wrap .slide_area { display:flex; }
.swiper-wrapper { position:absolute!important }

.sw_slide { position:relative; /*min-width:1400px;*/ width:100%; height:100vh; overflow:visible }
.sw_slide .swiper-slide { display:flex; width:100%; height:100%; background:transparent;  }
.sw_slide .swiper-slide.v01 { background:url(../images/common/visual_01.jpg) no-repeat center top; }
.sw_slide .swiper-slide.v02 { background:url(../images/common/visual_02.jpg) no-repeat center top; }
.sw_slide .swiper-slide.v03 { background:url(../images/common/visual_03.jpg) no-repeat center top; }
.sw_slide .swiper-slide.v04 { background:url(../images/common/visual_04.jpg) no-repeat center top; }
.sw_slide .swiper-slide.v05 { background:url(../images/common/visual_05.jpg) no-repeat center top; }

@media (min-width:768px) {
.sw_slide .swiper-slide	{ background-size:cover!important}
}

/* slide custom style */
.mv { }
.mv > div { position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding-left:200px; /*display:inline-block; margin:300px 0 0 200px;*/ color:#fff; text-align:left; line-height:52px; letter-spacing:-1px }
.mv .sw_v_s { font-family:Verdana sans-serif; font-weight:100; font-size:20px; margin-bottom:20px; letter-spacing:1px }
.mv .sw_v_t { font-weight:500; font-size:40px }
.mv .sw_v_t h5 > span { display:block; font-size:35px; font-weight:300 }
.mv .sw_v_t h5 > span > em { font-size:40px; font-weight:500 }
.tc_yellow { color:var(--tc_yellow) }

/* slide control */
.sw_control { position:absolute; display:flex; width:600px; height:50px; top:600px; left:200px; border:1px solid red; z-index:9999; }

/* pagination */
.swiper-pagination { top:70%; padding-left:200px; text-align:left }
.swiper-pagination span { background-color:#fff; width:60px; height:6px; border-radius:0; margin-right:0px !important; }
/* nav btn*/
.swiper-button-next { top:71%; left:570px; /*right:60px; left:auto*/ }
.swiper-button-prev { top:71%; left:540px;/*left:60px; right:auto*/ }
.swiper-button-prev:after,
.swiper-button-next:after { color:#fff; font-size:20px; }
.swiper-button-prev:hover:after,
.swiper-button-next:hover:after { opacity:1 }
.sw_v .swiper-button-prev { transform:translateX(-200%); }
.sw_v .swiper-button-next { transform:translateX(200%); }
.custom-fraction { text-align:right; margin:15px 5px 0 0;}
.btn_nav { position:absolute; top:70%; left:600px; z-index:99; }
.btn_nav .auto-start { width:30px; height:30px; font-size:0; background:url(../images/common/ico_play_w.png)no-repeat center top / 60% }
.btn_nav .auto-stop { width:30px; height:30px; font-size:0; background:url(../images/common/ico_pause_w.png)no-repeat center top / 60% }


/* footer */
.footer { position:relative; display:flex; width:100%; height:160px; justify-content:space-between; padding:70px 100px; margin-top:-120px; z-index:9999;  background-color:var(--tc_footer) }
.footer .ft_l { display:flex; align-items:center; font-family:"NanumGothic"; font-size:13px; color:var(--tc_white); line-height:22px; }
.footer .ft_l h2.f_logo { display:inline-block; width:190px; height:32px; margin-right:100px; background:url(../images/common/f_logo.png)no-repeat 0 0; opacity:0.4 }
.footer .ft_l .f_address { opacity:0.8 }
.footer .ft_l .f_address em.f_tel { padding-left:10px }
.footer .ft_l .f_copyright { opacity:0.4 }
.footer .ft_r { display:flex; align-items:center; color:var(--tc_white); }
.footer .ft_r ul { display:flex; padding-left:20px; }
.footer .ft_r ul li { margin:0 5px; }
.footer .ft_r ul li a { display:block; width:28px; height:28px }
.footer .ft_r ul li a.link_ktrust { background:url(../images/common/ico_ktrust.png)no-repeat 0 0; }
.footer .ft_r ul li a.link_ytube { background:url(../images/common/ico_ytube.png)no-repeat 0 0; }
.footer .ft_r ul li a.link_insta { background:url(../images/common/ico_insta.png)no-repeat 0 0; }
.footer .ft_r ul li a.link_fbook { background:url(../images/common/ico_fbook.png)no-repeat 0 0; }
.footer .ft_r ul li a.link_nblog { background:url(../images/common/ico_nblog.png)no-repeat 0 0; }