@charset "utf-8";
/*Common Layout CSS _ 15.05.18*/

.slide{position: relative;}
.slide_black_bg{position: absolute; width: 100%; height: 97%; background-color: rgba(0,0,0,0.2); background-image: url("../img/bg_video.jpg"); background-repeat: no-repeat; background-position: center; z-index: -1;}
.slide_box{width: 100%; overflow:hidden; height: auto;}
.slide_box video {width: 100%;}
.mobile_bg{display: none; height:920px; background: url("../img/bg_video.jpg") no-repeat 50%;}

@media all and (min-width:1200px) {
.slide_black_bg {width:100%;}
.slide_box{height: 950px;}
}

/*common*/

.inner{max-width:1200px; width:100%; position:relative; margin: 0 auto; padding:0 3%;}
.pdinner{max-width: 1500px;padding:0 3%;position:relative;margin: 0 auto;}
.ofh{overflow:hidden;}

.pdw3 {padding:0 3%;}

.mEnter{display:block;}
.pEnter{display:inline;}

.mb10{margin-bottom:10px !important;}
.mb20{margin-bottom:20px !important;}
.mb50{margin-bottom:50px !important;}
.mb60{margin-bottom:60px !important;}
.mb{margin-bottom:30px !important;}
.bmb{margin-bottom:40px !important}
.pb{padding-bottom:30px !important}
.bpb{padding-bottom:40px !important}

.tac{text-align:center;}
.tal{text-align:left;}
.tar{text-align:right;}
.mo_only{display:block;}
.move_scroll{max-width:768px; overflow-x:auto}
.line_link{display:inline-block; color:#ffffff; padding-bottom:5px; border-bottom:3px solid #ffffff; font-size:0.9em}
.arrow_cir_w:after{content:''; width:28px; height:25px; background:url(../img/ic_arrow_w.png) no-repeat center center; background-size:100%; display:inline-block; vertical-align:middle; margin-left:10px;}

.dpib{display:inline-block}
.dpb{display:block;}

.upper{text-transform:uppercase}
.fwb{font-weight:600}
.fss{font-size:0.8em}
.Tblack{color:#323232}
.Tred{color:#e83428}
.clr_gry {color:#9c9c9c;}
.upcase{text-transform:uppercase}

.btn_more{display:inline-block; color:#ffffff; border:1px solid #ffffff; padding:6px 20px; border-radius:500px; vertical-align:middle; position:relative; z-index:1}
.btn_more:after{content:'+'; display:inline-block; margin-left:10px; vertical-align:middle}
.btn_more.wt_btn{border:1px solid #dcdcdc; background:none; }

@media all and (min-width:768px) {
.pEnter{display:block;}
.mb{margin-bottom:40px !important; }
.bmb{margin-bottom:60px !important;}
.bmb2 {margin-bottom:120px !important;}

.pb{padding-bottom:40px !important}
.bpb{padding-bottom:60px !important}

.mo_only{display:none;}
.move_scroll{max-width:100%;}
.pdinner{padding:0 3%}

.half{width:48.5%; float:left;}
.mr{margin-right:3%;}
.btn_more:after{margin-left:20px}
}

@media all and (min-width:1200px) {

body, html{font-size:16px;}
.mEnter{display:inline-block;}
.mb{margin-bottom:60px !important}
.bmb{margin-bottom:150px !important}

.pb{padding-bottom:50px !important}
.bpb{padding-bottom:80px !important}
.pdinner{padding:0 20px}
}


/* ==== Slider Image Transition === */
@-webkit-keyframes ProgressDots{from{width:0px;}to{width:100%;}}
@keyframes ProgressDots{from{width:0px;}to{width:100%;}}
@keyframes zoomout {	0% { transform: scale(1.1); }    100% {        transform: scale(1.0);    }}
@-webkit-keyframes zoomout {	0% { transform: scale(1.1); }    100% {        transform: scale(1.0);    }}
@-webkit-keyframes scaling {	From {    -webkit-transform: scale(1.1);}	To {    -webkit-transform: scale(1.0);}}


/* ==== Slick Slider Css Ruls === */
.slick-slider{position:relative;display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}
.slick-list:focus{outline:none}.slick-list.dragging{cursor:hand}
.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
.slick-track{position:relative;top:0;left:0;display:block}
.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}
.slick-loading .slick-track{visibility:hidden}
.slick-slide{display:none;float:left /* If RTL Make This Right */ ;height:100%;min-height:1px}
.slick-slide.dragging img{pointer-events:none}
.slick-initialized .slick-slide{display:block}
.slick-loading .slick-slide{visibility:hidden}
.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}

/* Arrows */
.slick-arrow{position: absolute;top: 40%;text-indent:-999999px;display: block;width: 20px;height: 20px;border:0;cursor: pointer;background: #f8f8f800; /*! border:1px solid #969696; */z-index:10}
.slick-arrow:before{content:'';display:block;position:absolute;font-family:'FontAwesome'; /*! width:20px; */height: 54px;line-height: 20px;left:0;right:0;bottom:0;top:0;margin:auto;text-indent:0;width: 28px;}
.slick-arrow.slick-prev:before{background: url(../img/slick_prev.png) no-repeat;}
.slick-arrow.slick-next:before{background: url(../img/slick_next.png) no-repeat;}
.slick-arrow:before{content:'\f104'; font-size:20px;}
.slick-next{right:0;}
.slick-next:before{content:'\f105'; }

/*Dots*/
.slick-dots{position: absolute;    bottom: -20px;    display: block;    width: 100%;    padding: 0;    margin: 0;   text-align: center; z-index:10}
.slick-dots li{position: relative;  display: inline-block;  width: 20px;  height: 2px;  margin: 0 5px;  padding: 0;   cursor: pointer;}
.slick-dots li button{ font-size: 0;   line-height: 0;  display: block;  width:100%; height:100%; background:#969696; cursor: pointer;  color: transparent;  border: 0;  outline: none;  opacity:0.8}
.slick-dots li.slick-active button{background:#323232; opacity:1}


/**/
.vided_bg {position:absolute; top:0; left:0; right:0; margin:0 auto; height:300px;  z-index:1; }
.vided_bg:after {position:absolute;display:block; content:'';  width:100%; height:300px; background: linear-gradient(to bottom, rgba(0,0,0,.4) 20%, rgba(0,0,0,0) 100%);}

.main_video {display:none;}
.wrap{/* max-width:2000px; */min-width:320px;width:100%;margin: 0 auto;position:relative;left: 0;right: 0;}
.mainslider{position:relative; margin:0 auto; overflow:hidden}
.mainslider .visu{height:500px; background:#ffffff; position:relative; color:#ffffff;  line-height:1.3}
.mainslider .visu:before{content:''; position:absolute; top:0; left:0; right:0; bottom:0; background-size:cover !important;}
.mainslider .main01:before{background:url(../img/main01.jpg) no-repeat 65% center}
.mainslider .main02:before{background:url(../img/main02.jpg) no-repeat center center}
.mainslider .main03:before{background:url(../img/main03.jpg) no-repeat center center}

.mainslider .slick-active .visu:before{animation: zoomout 1s ease-in-out infinite alternate;    -webkit-animation: zoomout 1s ease-in-out infinite alternate;
animation-iteration-count:1; 	-webkit-animation-iteration-count:1;}


.txtLine{display:block; overflow:hidden}
.txtLine em{overflow:hidden; display:block;}
.txtLine em{font-weight:inherit; transform:translate(0, 100%);-webkit-transform:translate(0, 100%); transition: transform .85s cubic-bezier(0.25, 0.46, 0.45, 0.94);-webkit-transition:transform .85s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.slick-active .txtLine em{opacity:1;transform:translate(0, 0);-webkit-transform:translate(0, 0); }


@keyframes zoomout {0% { transform: scale(1.1);} 100% {transform: scale(1.0);}}
@-webkit-keyframes scaling {	From {    -webkit-transform: scale(1.1);}	To {    -webkit-transform: scale(1.0);}}


@media all and (min-width:768px) {
.mainslider .visu{height:750px;}
.mainslider .visu h2 .msr{font-size:16px;}
}


@media all and (min-width:1200px) {
.mainslider .visu .txt{top:250px}
/*.mainslider .visu{height:950px;}*/

.mainslider .visu {min-height:900px; max-height:900px; height:100vh;}
.mainslider .visu:before{background-position:center center !important}
.mainslider{position:relative; }
}


/*main visual bg*/

#section00 .hide{height:0}
.mainvisual {position:relative; overflow:hidden; z-index:0}
.mainvisual .bx-wrapper .bx-viewpor{background:#323232}
.mainvisual #mainslider li{position:relative; height:450px; }


.mainvisual #mainslider li:before{content:'';display:block;position:absolute;width:100%;height:100%;background-size:cover !important;}
.mainvisual #mainslider li.main01:before{background:url(../img/nwtna_visual01.jpg) no-repeat center center;}
.mainvisual #mainslider li.main02:before{background: url(../img/nwtna_visual02.jpg) no-repeat center center;}
.mainvisual #mainslider li.main03:before{background: url(../img/nwtna_visual03.jpg) no-repeat center center;}
.mainvisual #mainslider li:before{animation: zoomout 0s ease-in-out infinite alternate;    -webkit-animation: zoomout 0s ease-in-out infinite alternate;}

.mainvisual #mainslider li:after{display:none;}

.mainvisual.dot_btn .bx-pager{position:absolute;color:#ffffff;overflow:hidden;max-width: 1500px;width: 100%;margin:0 auto;left: 0;right:0;bottom: 100px;text-align: left;z-index:100;border-radius: 0%;padding-left: 3%;}
.mainvisual.dot_btn .bx-pager .bx-pager-item{display:inline-block;margin: 0 8px !important;text-align:center;position:relative;background:none;vertical-align: middle;}
.mainvisual.dot_btn .bx-pager .bx-pager-item a{color:#ffffff;opacity:0.9;width: auto;display:block;margin: 0 0px;font-size: 0px;height:auto;}
.mainvisual.dot_btn .bx-pager .bx-pager-item a:before{border-radius: 50%;content:'';/* position:absolute; */display:block;width: 13px;/* background: rgba(244,244,244,0.5); */top:0;left:0;bottom:0;right:0;margin: auto;/* border-radius:500px; */transition: 0.3s;}
.mainvisual.dot_btn .bx-pager .bx-pager-item a.active{ transition:0.3s; opacity:1; background:none}
.mainvisual.dot_btn .bx-pager .bx-pager-item a.active:before {width: 43px;border-radius:30px;background: rgba(244,244,244,1);}
.mainvisual.dot_btn .bx-pager .bx-pager-item a:before{width: 38px;height:6px;/* border-radius:30px; */background: rgb(255 255 255 / 58%);/* border: 2px solid #fff; */border-radius: 0%;}
.mainvisual.dot_btn .bx-pager .bx-pager-item a.active:before {width: 38px;height: 6px;border: 0px;background: #fff;border-radius: 0%;}

#mainslider .txt_box{text-align: center;width: 100% !important;border: none;}
#mainslider .t1{font-size: 13px;margin-bottom: 10px;font-weight: 400;}
#mainslider .t2{font-size: 36px;font-weight: 600;line-height: 1;}
#mainslider .t4{display: none;}
#mainslider .more{margin-top: 59px;}



@media all and (min-width:1200px) {
	.mainvisual #mainslider li{min-height: 970px;height: 90vh;background-size: cover !important;/* max-height:1280px; */}
	.mainvisual .bx-wrapper .bx-has-controls-direction{bottom:200px;}
	.mainvisual  #bx-pager{width:1200px; padding:0 20px;}
	.mainvisual.dot_btn .bx-pager {bottom: 300px;padding-left: 20px;}
	.mainvisual.dot_btn .bx-pager .bx-pager-item a{width: auto;margin: 0 1px;border-radius: 0%;}
	.mainvisual.dot_btn .bx-pager .bx-pager-item a:before{width: 40px;height: 6px;}
	.mainvisual.dot_btn .bx-pager .bx-pager-item a.active:before {width: 45px;height: 6px;}
	.mainvisual .visu h2 .yllTxt{font-size:103px;}
	.mainvisual .visu h2:before {right:33%;}
	#mainslider .t1{font-size: 18px;}
    #mainslider .t2{font-size: 70px;}
	#mainslider .line{width: 38px;height: 3px;background: #fff;display: block;}
	#mainslider .t4{display: block;font-size: 20px;color: rgba(244,244,244,0.9);/* margin-top: 36px; */line-height: 1.5;font-weight: 500;margin-bottom: 0px;}
	.pc_inner{max-width: 1240px;margin:0 auto;}
	.pc_inner:after{display:block; clear:both; content:"";}
	.mainvisual .visu {top: 350px;}
	.mainvisual .visu h2:before {right:36%;}
	.mainvisual .visu a{margin:0px;}
	/*.mainvisual #mainslider li:after{content:'';display:block;position:absolute;background:url(../img/scr_down.png)no-repeat;background-size: 90%;width:11px;height:110px;right: 14%;top: 79%;}*/
}


.main_txt {position:absolute;top: 35%;left: 0;right:0;margin:0 auto;/*! text-align: center; */color:#fff;}
.main_txt h2{font-size: 2em;font-weight:700;/*! text-align: center; *//* text-align: center; */line-height: 35px;}
.main_txt p{position:relative;font-size: 1em;color: #ffffff;/*! text-align: center; *//* text-align: center; */}
.main_txt p.txt_nm {font-size:1.2em; padding-bottom:10px;}

.mainslider .visu .txt{margin: 0 auto; position:absolute; width:100%;  padding:0px 3%; text-align:center; left:0; right:0; top:160px;}
.mainslider .visu h2{  /*webkit-animation:fadeOutRight 0.5s both;       animation:fadeOutRight 0.5s both;*/}
.mainslider .visu h2 .msr{font-size:14px; color:#28cfff}
.mainslider .visu.slick-active h2{ -webkit-animation:fadeInDown  0.5s both  0.5s;    animation:fadeInDown  0.5s both  0.5s;}
.mainslider .visu h2 b{color:#ffffff}
.mainslider .visu p{margin:auto; line-height:1.5}

.mainslider .slick-dots {display:none;}
/*.mainslider .slick-dots{position: absolute;    bottom: 220px;    display: block;    width: 100%;    padding: 0;    margin: 0;   text-align: center; z-index:10}
.mainslider .slick-dots li{position: relative;  display: inline-block;  width: 20px;  height: 20px;  margin: 0 5px;  padding: 0;   cursor: pointer;}
.mainslider .slick-dots li button{ font-size: 0;   line-height: 0;  display: block;  width: 20px;  height: 20px; border-radius:500px;  padding: 5px;  cursor: pointer;  color: transparent;  border: 0;  outline: none;  background:none; border:5px solid #ffffff; opacity:0.5}
.mainslider .slick-dots li.slick-active button{border-color:#28cfff; opacity:1}*/


/*mainslider text css*/
.mainslider h2{font-size:2em; font-weight:700;}
.mainslider p{position:relative; }
.mainslider p.txt_nm {font-size:1.2em; padding-bottom:10px;}
.mainslider .more {margin-top:10px; border:2px solid #fff; display:inline-block; padding:10px;}
.click_h {display:none;}

@media all and (min-width:370px) {
.mainslider h2,
.main_txt h2 {font-size: 2.5em;}
}

@media all and (min-width:500px) {
.main_txt {position:absolute;top: 40%;left: 0;right:0;margin:0 auto;/*! text-align: center; */color:#fff;}
}

@media all and (min-width:768px) {
.mainslider .visu .txt {text-align:left;}
.mainslider p.txt_nm,
.main_txt p.txt_nm {font-size:1.68em;}
.mainslider p,
.main_txt p {font-size:1.2em;font-weight: 500;}
.mainslider .more {margin-top:20px;}
}

@media all and (min-width:980px) {
.mainslider h2,
.main_txt h2 {font-size: 3em;}

}


@media all and (min-width:1200px) {
.main_video {display:block;}
.main_top {position:relative;}
.mainslider {display:none;}
.mainslider .visu .txt {top:280px; max-width:1400px;}
.main_txt {/* top:22%; */max-width: 1500px;z-index:1;} 
.mainslider h2 {font-size:4em; }
.main_txt h2 {font-size: 4.5em;line-height: 70px;}
.main_txt p.txt_nm {font-size:2.3em;}
.main_txt p {font-size: 1.8em;}

.click_h {display:block; position:absolute; z-index:3; right:50px; top:38%; bottom:0; margin:0 auto;  width:7%;}
.click_h ul {position:relative;}
.click_h ul:before,
.click_h ul:after {position:absolute; display:block; content:''; left:0; right:0; margin:0 auto; background:url(../img/acc.png) no-repeat center; width:21px; height:10px; background-size:100%; }
.click_h ul:before {top:-30px;}
.click_h ul:after {bottom:-30px; transform: rotate(180deg)}
.click_h ul li {text-align:center; padding:5px 0 ;}
.click_h ul li a {font-size:14px; font-weight:700; color:#fff;}
.click_h ul li a:hover {background:#004098; padding:5px;}
}


@media all and (min-width:1400px) {
.main_txt {top: 40%;} 
.main_video .background {padding-bottom:50% !important}
}




/*footer*/
#footer{background: #141d25;color: #a0a0a0;padding: 70px 0px;}
#footer:after{display: block; clear: both; content: "";}
#footer > .pdinner{padding:30px 3% 0px;}
#footer h4{font-weight:700;}
#footer .pdinner{max-width: 1500px;}

#footer .foot_li li{float:left;margin-right: 50px;display:block;color: #c7c7c7;font-size: 0.9em;}
#footer .foot_li:before{display: block;clear: both;content: "";top: 35px;border-bottom: 1px solid #a0a0a0;position:absolute;width: 93%;}
#footer .foot_li:after{display:none;}

#footer .foot_bottom{margin-top: 50px;}
#footer .foot_bottom p{font-size: 0.8em;font-weight: 500;}



@media all and (min-width:768px) {
#footer > .pdinner{padding:50px 3% 0px; overflow:hidden}
#footer .foot_li:before{width:83%}
#footer .foot_li:after{display: block;clear: both;content: "";background: url(../img/logo_black.png) no-repeat;position: absolute;width: 100px;height: 70px;right: 0;top: 20px;}
}

@media all and (min-width:1200px) {
#footer > .pdinner{padding:80px 20px 0px; overflow:hidden}
#footer .foot_li:before{width: 90%;top: 45px;}
}


/*page up*/
#pageup {position:fixed; z-index:999; right:1%; bottom:5%; width:50px; height:50px; background-image:url('../img/Htop.png');background-repeat: no-repeat;  background-position:center center; background-size: 50px 50px; display:none; cursor:pointer; z-index:4000;}

@-webkit-keyframes bounce-top{0%{-webkit-transform:translateY(-45px);transform:translateY(-45px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:1}24%{opacity:1}40%{-webkit-transform:translateY(-24px);transform:translateY(-24px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}65%{-webkit-transform:translateY(-12px);transform:translateY(-12px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}82%{-webkit-transform:translateY(-6px);transform:translateY(-6px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}93%{-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}25%,55%,75%,87%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;opacity:1}}@keyframes bounce-top{0%{-webkit-transform:translateY(-45px);transform:translateY(-45px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:1}24%{opacity:1}40%{-webkit-transform:translateY(-24px);transform:translateY(-24px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}65%{-webkit-transform:translateY(-12px);transform:translateY(-12px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}82%{-webkit-transform:translateY(-6px);transform:translateY(-6px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}93%{-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}25%,55%,75%,87%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;opacity:1}}
@-webkit-keyframes text-pop-up-top
{0%{-webkit-transform:translateY(0);transform:translateY(0);
-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}
100%{-webkit-transform:translateY(-10px);transform:translateY(-10px);
-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}}
@keyframes text-pop-up-top{0%{-webkit-transform:translateY(0);transform:translateY(0);
-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}
100%{-webkit-transform:translateY(-10px);transform:translateY(-10px);
-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}}




/*서브레이아웃*/
#sub_visual{position:relative; padding:130px 0 90px; background:#0098e2;  margin:0 auto;  background:linear-gradient(45deg, #0098e2 0%, #dadf00 100%); background:#808080; background-size:cover !important}
#sub_visual{ background:url(../img/subvis01.jpg) no-repeat center center; }
#sub_visual.sub01{ background:url(../img/subvis01.jpg) no-repeat center center; }
#sub_visual.sub02{ background:url(../img/subvis02.jpg) no-repeat center center; }
#sub_visual.sub03{ background:url(../img/subvis03.jpg) no-repeat center center; }
#sub_visual.sub04{ background:url(../img/subvis04.jpg) no-repeat center center; }
#sub_visual.sub05{ background:url(../img/subvis05.jpg) no-repeat center center; }
#sub_visual.sub06{ background:url(../img/subvis06.jpg) no-repeat center center; }


#sub_visual{color:#ffffff; text-align:center;}
#sub_visual .tit_h2{font-weight:600; font-size:2em;}
#sub_visual .tit_h2 span{display:block;  margin-bottom:10px; font-size:15px; font-weight:800; letter-spacing:0; text-transform:uppercase; position:relative;}
#sub_visual .tit_h2 b{display:block; line-height:1.2}

@media all and (min-width:768px) {
#sub_visual{border-bottom:0}
#sub_visual .tit_h2{font-size:2.5em; }

#sub_visual p{font-size:18px}
#sub_visual .tit_h2 span:after{position:absolute; right:0; top:0; margin:0}
}

@media all and (min-width:1200px) {
#sub_visual .tit_h2{font-size: 3em;font-weight: 800;}
#sub_visual p{font-size:18px}
#sub_visual{border-bottom:0;}

}


.sub_tab{display:none}
.sub_con{margin: 0 auto; position:relative; min-height:400px; padding:50px 0% 0px; overflow:hidden}
.sub_con:after{content:''; clear:both; display:block}

/*2depth menu*/
#twodepthNav {position:relative; display:none; margin: 0 auto; background:#1c3f95}
#twodepthNav ul {overflow:hidden; text-align:center}
#twodepthNav ul li {position:relative; width:16%; display:inline-block; text-align:center; max-width:150px}
/*#twodepthNav ul li a:before{content:''; width:1px; height:20px; background:rgba(255,255,255,0.3); position:absolute; left:0; top:0; bottom:0; margin: auto;}*/
#twodepthNav ul li a{color:#ffffff}
#twodepthNav ul.li09 li{width:10.5%;}
#twodepthNav ul li a{display:block; line-height:60px; position:relative}
#twodepthNav ul li a:after{content:''; position:absolute; bottom:0; left:50%; width:0; height:4px; background:#0083ef; transition:all 0.2s cubic-bezier(0.7, 0, 0.3, 1)}
#twodepthNav ul li:hover a:after{width:60px; margin-left:-30px;}
#twodepthNav ul li a:hover{font-weight:600; transition:0.3s}
#twodepthNav ul li:first-child a:before{width:0}
#twodepthNav ul li.active {background:#ffffff}
#twodepthNav ul li.active a{font-weight:600; color:#323232}
#twodepthNav ul li.active a:after{width:60px; margin-left:-30px;}
/*#twodepthNav ul li.active:after {width:10px; height:10px; content: "";position:absolute; background:#f6c94f; top:43%; right:20px; border-radius:30px}*/

#sidemenu {display:none; position:absolute;width:200px;  z-index:9999; top:0px; left:20px} /*기준*/
#sidemenu h2 {display:block;font-size:1.6em;   text-align:center; line-height:1.2;  color:#fff; min-height:100px; padding:60px 0; /*background:rgba(90,19,40,0.8);*/ background:#29343f; position:relative; text-transform:uppercase;  }
#sidemenu h2 span {display:block; font-size:0.9rem; margin-bottom:10px;}

#sidemenu .snblist{border:1px solid #e6e6e6; border-width:0 1px 1px; background:#ffffff;  margin-bottom:30px}
#sidemenu .snblist li a {position:relative; display: block; padding:13px 20px; font-weight:400; border-bottom:1px solid #e6e6e6; color:#323232}
#sidemenu .snblist li:last-child a{border-bottom:0px;}
#sidemenu .snblist li a[target='_blank']:after {font-family: 'FontAwesome'; font-size:11px; display:inline-block; content:"\f08e"; margin: 0 0 2px 5px; vertical-align: middle;}
#sidemenu .snblist li a:hover {text-indent:5px; 	
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease; color:#303030; transition:0.3s}
#sidemenu .snblist li.active a {color:#d10000; font-weight:600}
#sidemenu .snblist li a i:after,#sidemenu .snblist li.active a i:after {
	position: absolute;
	top: 16px;
	font-weight:bold;
	right: 10px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	font-family: FontAwesome;
	content: "\f105";
	font-style:normal;  
	color:#808080
}
#sidemenu .snblist li a:hover i:after{right: 7px;}
#sidemenu .snblist li.active a i:after{color:#d10000}
#sidemenu .snblist li.active a:hover i:after{right:7px;}


#sidemenu .snblist li a i:after {background:rgba(255,255,255,0)}

#sidemenu .snblist li a:hover i:after {
	-webkit-transform: translateY(-50%) translateX(20%);
	-moz-transform: translateY(-50%) translateX(20%);
	-ms-transform: translateY(-50%) translateX(20%);
	-o-transform: translateY(-50%) translateX(20%);
	transform: translateY(0) translateX(20%);
	color:#fff;
	background:rgba(255, 255, 255, 1);
}

#sidemenu .snblist li.select a:hover i:after {
	-webkit-transform: none;
	-moz-transform: none;
	-ms-transform: none;
	-o-transform: none;
	transform: none;
	color:#fff;
	background:rgba(255, 255, 255, 1);
}



#fl_menu{display:none;}
.con{position:relative; min-height:500px;}
.conh3,
.ptn_tit{font-size: 2em;font-weight: 800;color: #222;text-align:center;margin-bottom: 50px;position: relative;}

/*.conh3:after{content:''; width:40px; height:1px; background:#000000; display:block; margin:10px auto 30px;}*/

.conh4{font-size:1.4em; font-weight:700; color:#000000; text-align:center;}
.conh4:after{content:''; width:40px; height:1px; background:#000000; display:block; margin:10px auto 30px;}

.path{display:block;}
.path li{font-size:12px; display:inline-block; vertical-align:top;}
.path li:before{content:'\f105'; font-family:'FontAwesome'; display:inline-block; padding:0px 10px}
.path li:first-child:before{display:none;}


@media all and (min-width:768px) {
.sub_con{padding:70px 0px 0px}
.conh4{font-size:2em}
.conh4:after{margin:20px auto 40px;}
#sub_visual{padding:150px 0px 100px;}
#twodepthNav {position:relative; display:block;}
}


@media all and (min-width:1200px) {
#sub_visual{padding:150px 0px 100px;border-bottom: 1px solid #f3f3f3;}
.subwrap{margin: 0 auto;position:relative;font-family: pretendard;}
.sub_tab{display:block;background:#0788c7; padding:10px 0px; text-align:right; color:#ffffff; font-size:0.85em; text-align:right;}
.sub_tab h3, .sub_tab p{display:inline-block; margin-left:15px; color:#fbdf40; font-weight:bold}
.sub_tab h3{color:#ffffff}
.sub_tab h3 span{margin-right:10px; text-transform:uppercase; color:#fbdf40}
.sub_tab p {border-radius:50px; background:#462e16; padding:5px 10px;}


#twodepthNav ul.li02 li{width:25%;}

.sub_con{position:relative; width:100%; margin: 0 auto; min-height:650px; padding:60px 0px 0px}
.con{width:1160px; margin:0 auto; min-height:800px;}
.conh3,
.ptn_tit{font-size: 2.5em;}
.conh4:after{margin:20px auto 60px;}
}

@media all and (min-width:1640px) {
#sidemenu{display:block}
#fl_menu{display:block; position:absolute; right:20px; z-index:9999; width:125px; top:0px; height:600px}
#fl_menu .label{text-align:center; line-height:80px; font-size:18px; font-weight:bold; background:#29343f; color:#fff;}
#fl_menu ul {text-align:center; padding:10px 0px 30px; background:#ffffff}
#fl_menu ul li a{font-size:16px; font-weight:600; padding:8px 0px}
#fl_menu ul li span{display:block}
#fl_menu .menu{display:block; border:1px solid #dcdcdc}
#fl_menu .menu img{max-width:60px}
#fl_menu .menu .menu_item{display:block; background:#ffffff; color:#323232; }
}




/*흰색패스*/

.menu_wrap{position:absolute; bottom:0; left:0; right:0; margin:auto; width:100%; max-width:1400px !Important}
#sub_drop{width:100%; position:relative; z-index:10; background:#fff;}

#sub_drop .dropdown{float:left; width:40%; position:relative; z-index:1; display:none}
#sub_drop .dropdown.deph02{width:60%}
#sub_drop .dropdown.deph02:before{content:''; width:1px; height:15px; background:#acacac; opacity:0.5; position:absolute; left:0; top:0; bottom:0; margin:auto}
#sub_drop .dropbtn {width:100%; text-align:left; display:inline-block;  height:auto; position:relative; line-height:55px; padding:0 25px 0 10px; cursor:pointer; color:#000; position:relative; font-weight:600;}
#sub_drop .dropbtn:after{font-family:'FontAwesome'; content:'\f107'; position:absolute; right:20px; color:#acacac; font-size:14px; top:0; bottom:0; margin:auto;}

#sub_drop .dropdown ul{}
#sub_drop .dropdown ul li{padding:5px 10px; text-align:left; }
#sub_drop .dropmenu {display: none;  position: absolute;  z-index: 5; background:#ffffff; border:1px solid #f3f3f3;box-sizing:content-box; left:-1px; width:100%;}
#sub_drop .dropmenu a{display:block; line-height:30px; color:#000000; }
#sub_drop .dropmenu a:hover {color:#1c3f95; font-weight:600;}
#sub_drop .dropdown .show {display:block;}

#sub_drop:after{display:block; content:''; clear:both;}

#sub_drop .home{display:none; min-width:46px !Important}
#sub_drop .home:before{content:''; width:1px; height:15px; background:#acacac; opacity:0.5; position:absolute; left:0; top:0; bottom:0; margin:auto}
#sub_drop .home a{display:block; line-height:55px; padding:0 10px; text-align:center}
#sub_drop .home img{display:inline-block; vertical-align:middle}

@media all and (min-width:360px) {
#sub_drop{width:94%;margin:auto;}
}


@media all and (min-width:540px) {
#sub_drop .dropdown{display:block; }
#sub_drop{max-width:500px; margin:0}
#sub_drop .dropdown{width:calc(45% - 55px);}
#sub_drop .dropdown.deph02{width: 420px;}
#sub_drop .home{display:block; width:80px !Important}
#sub_drop .dropbtn{padding:0 25px 0 20px; line-height:60px}
#sub_drop .dropdown ul li{padding:7px 20px; }
}

@media all and (min-width:1200px) {
.menu_wrap{left:0; right:0; margin:auto; width:100%;/*! border-bottom: 1px solid #f3f3f3; */}
#sub_drop{width:100%;left:0;right:auto;max-width: 500px;}
#sub_drop .dropdown{min-width:auto !important}
#sub_drop .dropmenu a{line-height:40px;}
#sub_drop .home a{line-height:70px;} 
#sub_drop .dropbtn {line-height:70px}

}

@media all and (min-width:1600px) {
.bg_menu {width:100%; margin:0 auto; }
.bg_menu:after {position:absolute; display:block; content:''; left:0; bottom:0; height:70px; width:20%; background:#fff; z-index:0;/*! border-bottom: 1px solid #f3f3f3; */}
}




/*텍스트효과*/

.motion01{animation-name:sub_tt;animation-duration:1000ms;animation-fill-mode:both;animation-delay:200ms;animation-timing-fonction:ease-out;}
.motion02{animation-name:sub_tt;animation-duration:1000ms;animation-fill-mode:both;animation-delay:200ms;animation-timing-fonction:ease-out;}

/* Chrome, Safari, Opera */ 
@-webkit-keyframes sub_tt { 
	0%   {top: 30px; opacity: 0;}
    100% {top: 0; opacity: 1;}
}
/* Standard syntax */
@keyframes sub_tt {
     0%   {top: 30px; opacity: 0;}
    100% {top: 0px; opacity:1;}
}
/* Chrome, Safari, Opera */ 
@-webkit-keyframes sub_tt {
    0%   {top: 30px; opacity: 0;}
    100% {top: 0; opacity: 0;}
}
/* Standard syntax */
@keyframes sub_tt {
     0%   {top: 30px; opacity: 0;}
    100% {top: 0px; opacity: 1;}
}

@media all and (max-width:1200px) {
#layerPopup0{top:100px !Important; left:0 !Important;}
#layerPopup1{top:435px !Important; left:0 !Important;}
#layerPopup2{top:770px !Important; left:0 !Important;}
#layerPopup3{top:1105px !Important; left:0 !Important;}
#layerPopup4{top:1440px !Important; left:0 !Important;}
#layerPopup5{top:1775px !Important; left:0 !Important;}
}

/*section공통*/
.txt_box{display:block; text-align:center; color:#fff;}
.txt_box h3{font-size:30px;font-weight:700;margin-bottom: 40px;}
.txt_box p{font-size:15px;margin-bottom: 40px;display: none;}
#section013 .txt_box{display:block; text-align:center; color:#343434;}

@media all and (min-width:768px) {
.txt_box h3{font-size:40px; font-weight:700;}
.txt_box p{font-size:20px; font-weight:300;}
.txt_con{padding:20px;}
}

/*section*/
#section011{background: #1b1b1b url(../img/section01_visual.jpg) no-repeat top center;height: 100%;width:100%;padding: 70px 0;}
#section012{background: #454f58 url(../img/section02_visual.jpg) no-repeat bottom center;height: 100%;width:100%;padding: 70px 0;}
#section013{background: #e5e5e5 url(../img/section03_visual.png) no-repeat top center;height: 100%;width:100%;padding: 70px 0;}
#section011 .busi_box,
#section012 .prod_box{display:flex; flex-wrap: wrap;}
#section011 .busi_box a,
#section012 .prod_box .prod_con{width: 48%;margin-right:2%;position: relative;margin-bottom: 2%;}
#section011 .busi_box .busi_con:nth-child(even),
#section012 .prod_box .prod_con:nth-child(even){margin-right:0%;}
#section011 .busi_box .busi_con:before{position:absolute;display:block;content:''; bottom:0;width: 100%;height: 270px;background: linear-gradient(to bottom, rgba(20, 20, 20, 0) 10%, rgba(20, 20, 20, 0.25) 25%, #151d258c 50%, #151d25e6 75%, #151d25 100%);}
#section011 .busi_box .busi_con:hover:before{position:absolute;display:block;content:''; bottom:0;width: 100%;height: 270px;background: linear-gradient(to bottom, rgba(20, 20, 20, 0) 10%, #015eb62e 25%, #015eb661 50%, #015eb6c7 75%, #015eb6 100%);}

#section011 .txt_con{display: block;color: #fff;position: absolute;/* z-index: 9; */bottom: 0;padding: 15px;}
#section011 .txt_con p{font-size: 1em;font-weight:700;margin-bottom:10px;}
#section011 .txt_con span{display: none;}

#section012 .prod_box .prod_con p{color:#fff;font-size: 1.2em;font-weight: 700;padding: 20px 10px;}
#section012 .prod_box .prod_con p:after{display: block;clear: both;content: "";width: 25px;height: 25px;position: absolute;background: url(../img/ico_go.png)no-repeat;right: 10px;background-size: 100%;bottom: 20px;}
#section012 .prod_box .prod_con p:hover:after{background: url(../img/ico_hover.png)no-repeat; background-size: 100%;}

#section013 .news_box,
#section013 .news_go{display: flex;flex-wrap: wrap;}
#section013 .news_box .news_con{width: 100%;position: relative;margin-bottom: 2%;background-color: #ffffff9c;}
#section013 .news_box .news_con a{display: block;border-top: #cdcdcd solid 5px;padding: 30px;}
#section013 .news_box .news_con a:hover{border-top: #0060ba solid 5px;}
#section013 .news_box .news_con h5{font-size: 1.2em;font-weight: 700;color: #333;margin-bottom: 10px;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
#section013 .news_box .news_con p{color: #7a7a7a;margin-bottom: 30px;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
#section013 .news_box .news_con span{color: #bababa; font-family: pretendard; font-size: 0.9em;}
#section013 .news_box .news_con a:after{display: block;clear: both;content: "";width: 25px;height: 25px;position: absolute;background: url(../img/ico_add_g.png)no-repeat;right: 20px;background-size: 100%;bottom: 20px;}
#section013 .news_box .news_con a:hover:after{background: url(../img/ico_hover.png)no-repeat; background-size: 100%;}

#section013 .news_go .go_box{width: 100%;position: relative; margin-bottom:2%; color:#fff;}
#section013 .news_go .go_box.col01{background-color:#0060ba;}
#section013 .news_go .go_box.col02{background-color:#00a653;}
#section013 .news_go .go_box.col03{background-color:#141d25;}
#section013 .news_go .go_box.col01:after{display: block;clear: both;content: "";width: 30px;height: 30px;position: absolute;background: url(../img/ico_add02.png)no-repeat;right: 30px;background-size: 100%;bottom: 35px;}
#section013 .news_go .go_box.col02:after{display: block;clear: both;content: "";width: 30px;height: 30px;position: absolute;background: url(../img/ico_add01.png)no-repeat;right: 30px;background-size: 100%;bottom: 35px;}
#section013 .news_go .go_box.col03:after{display: block;clear: both;content: "";width: 30px;height: 30px;position: absolute;background: url(../img/ico_add01.png)no-repeat;right: 30px;background-size: 100%;bottom: 35px;}
#section013 .news_go .go_box a{padding:30px;display: block;}
#section013 .news_go .go_box h5{font-size: 1.2em;font-weight: 700;margin-bottom: 10px;}
#section013 .news_go .go_box p{}

@media all and (min-width:500px) {
#section013 .news_box .news_con{width: 49%;margin-right: 2%;position: relative;margin-bottom: 2%;}
#section013 .news_box .news_con:nth-child(even){margin-right:0%;}
#section011 .txt_con p{font-size: 1.2em;}

}

@media all and (min-width:768px) {
#section011,
#section012,
#section013{padding: 100px 0;}
#section011 .busi_box a,
#section012 .prod_box .prod_con{width: 23.5%;margin-right:2%;}
#section011 .busi_box a:last-of-type,
#section012 .prod_box .prod_con:last-of-type{margin-right:0%;}
#section011 .busi_box a:nth-child(even){top: 40px;}
#section011 .busi_box .busi_con:nth-child(2),
#section012 .prod_box .prod_con:nth-child(2){margin-right:2%;}
#section012 .prod_box .prod_con p{font-size: 1em;}

#section013 .news_box .news_con a{padding: 20px;}
#section013 .news_box .news_con a:after{right: 30px;bottom: 30px;}
#section013 .news_box .news_con{width: 23.5%; margin-right: 2%;}
#section013 .news_box .news_con:nth-child(2){margin-right:2%;}
#section013 .news_box .news_con p{margin-bottom: 40px;}

#section013 .news_go .go_box{width: 32%;margin-right: 2%;position: relative;margin-bottom:0%;}
#section013 .news_go .go_box:last-of-type{margin-right:0%;}
#section013 .news_go .go_box a{padding:40px;display: block;}


}

@media all and (min-width:980px) {
.txt_box h3{margin-bottom:0px;}
.txt_box p{font-size:20px; font-weight:300; display:block;}
#section011 .txt_con{padding:28px;}
#section011 .txt_con span{display: block; font-size:0.9em}
#section013 .news_box .news_con a{padding: 30px;}
#section012 .prod_box .prod_con p{font-size: 1.2em;}
}