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

/*common*/


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

.tit_h3{font-size:28px;font-weight:400; color:#323232;  position:relative; letter-spacing:-1px}
.tit_h3:after{content:''; width:60px; height:1px; display:block; background:#505050; margin: 0 auto; margin-top:20px;}
.tit_h4{font-size:26px; color:#323232; font-weight:bold; letter-spacing:-1px}

.tit_h5{color:#323232; font-weight:bold; font-size:18px;}

.tit_h4.noLine:after{width:0; height:0px; margin-top:0px;}


.mEnter{display:block;}
.mb{margin-bottom:30px !important}
.pb{padding-bottom:30px !important;}
.bmb{margin-bottom:50px !important}
.mb10{margin-bottom:10px !important;}
.mb20{margin-bottom:20px !important;}
.mb30{margin-bottom:30px !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}
.line_btn{overflow:hidden;}
.line_btn li{width:100%; margin-bottom:10px;}
.line_btn li a{display:block; border:1px solid #ffffff; padding:5px; text-align:center; font-size:0.8em}
.line_btn li:last-child{margin:0; }

.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:500}
.fss{font-size:0.8em}
.Tblack{color:#323232}
.Tred{color:#e83428}
.ylTxt{color:#fff94e;}
.grTxt{color:#11ae4b}
.orgTxt{color:#ffa60a}
.upcase{text-transform:uppercase}

.btn_more{display:inline-block; color:#ffffff; background:#1c3f95; padding:6px 20px; border-radius:500px}

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


.tit_h4{font-size:30px; letter-spacing:-1px}
.tit_h5{font-size:20px; letter-spacing:-1px}


.mb{margin-bottom:45px !important; }
.pb{padding-bottom:45px !important;}
.bmb{margin-bottom:70px !important;}

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

.half{width:47.5%; float:left;}
.mr{margin-right:3%;}

.line_btn li{width:47.5%; float:left; margin-right:3%;}
.line_btn li:last-child{margin:0}
.line_btn li a{padding:8px}

.mEnter{display:inline-block;}
.tEnter{display:block;}
}

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

body, html{font-size:17px;}
.mEnter{display:inline-block;}
.tEnter{display:inline-block;}
.pEnter{display:block;}

.tit_h3:after{margin-top:25px;}

.tit_h4{font-size:30px; }

.tit_h5{font-size:20px; }


.mb{margin-bottom:60px !important}
.pb{padding-bottom:60px !important;}
.bmb{margin-bottom:100px !important}
.pdinner{padding:0 20px}



}



/*owl 컨트롤러 css변경*/
.owl-controls{width:100%; margin:0 auto;}

/*owl pagenation css변경 */
.page_btn .owl-page span{width:20px !important; height:20px !important; background:none !important; border:4px solid #ffffff; border-radius:20px; opacity:0.7 }
.page_btn .owl-page.active span{opacity:1;}

.page_btn2 .owl-page span{width:5px !important; height:5px !important; background:#808080 !important; border-radius:20px; position:relative; opacity:1 !important; margin:0 20px !important;}
.page_btn2 .owl-page.active span:before{content:''; width:30px; height:30px; position:absolute; margin-left:-16px; left:50%; margin-top:-16px; top:50%; border:1px solid #808080; border-radius:200px;}

/*owl navigation css변경*/
.owl-theme .owl-controls{position:relative}
.arrow_btn .owl-buttons{position:absolute; width:100%; top:-250px;}
.arrow_btn .owl-buttons div{position:absolute; font-family:'FontAwesome'; text-indent:-999999px; background:none !important; padding:0px !important; margin:0px !important;}
.arrow_btn .owl-buttons div:first-child{left:2%;}
.arrow_btn .owl-buttons div:last-child{right:2%;}
.arrow_btn .owl-buttons div.owl-prev:after,
.arrow_btn .owl-buttons div.owl-next:after{content:'\f104'; font-family:'FontAwesome'; position:absolute; left:0; top:0; text-indent:0 !important; font-size:3em;}
.arrow_btn .owl-buttons div.owl-next:after{content:'\f105'; right:0; left:auto;}

.pop_page_btn{position:relative;}
.pop_page_btn .owl-controls{position:absolute; bottom:0px; text-align:right !important}
.pop_page_btn .owl-pagination{display:inline-block; padding:1px 10px; border-radius:500px; height:22px;}
.pop_page_btn .owl-controls .owl-page span{width:10px !important; height:10px !important; background:#505050 !important; margin:2px 4px !important}
.pop_page_btn .owl-controls .active span{background:#8c000a !important}

@media all and (min-width:1200px) {
.arrow_btn .owl-buttons div:first-child{left:-10%;}
.arrow_btn .owl-buttons div:last-child{right:-10%;}
.arrow_btn .owl-buttons div.owl-prev:after,
.arrow_btn .owl-buttons div.owl-next:after{font-size:50px;}
}



/* ==== 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%}
.slick-slide.dragging img{pointer-ic_ings: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;  z-index:100; top:0; display: block;   width: 40px;   height: 40px; border:0;  background:none;  cursor: pointer;   text-indent:-999999px;
/*	-webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);*/}

.slick-arrow:before{content:'\f105'; font-family:'FontAwesome'; position:absolute; text-indent:0; width:100%; height:100%; line-height:40px; left:0; right:0; bottom:0; top:0;  margin:auto; font-weight:600; text-align:center; color:#ffffff; font-size:20px}
.slick-next{right:0;}
.slick-prev:before{content:'\f104';}



/* Circle Arrows */
.cir-arrow .slick-arrow{position: absolute;  top: 50%; z-index:100;  display: block;   width: 50px;   height: 50px; border:0;   cursor: pointer;  background:none; border:2px solid #ffffff; border-radius:500px; text-indent:-999999px;
/*	-webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);*/}

.cir-arrow .slick-arrow:before{text-indent:0; content:''; display:block; position:absolute;  width:16px; height:16px; line-height:20px; background-size:100% !important; left:0; right:0; bottom:0; top:0;  margin:auto; font-weight:600 }
.cir-arrow .slick-arrow:before{background:url(../img/slick_prev.png) no-repeat center center}
.cir-arrow .slick-arrow.slick-next{right:0;}
.cir-arrow .slick-arrow.slick-next:before{background:url(../img/slick_next.png) no-repeat center center}

/*line-Dots*/
.slick-dots{position: absolute;    bottom: 10%;    display: block;    width: 100%;    padding: 0;    margin: 0;   text-align: center; z-index:10}
.slick-dots li{position: relative;  display: inline-block;  margin: 0 3px;  padding: 0;   cursor: pointer; vertical-align:middle}
.slick-dots li button{ font-size: 0;   line-height: 0;  display: block;  width: 25px;  height: 3px;  padding: 0px;  cursor: pointer;  color: transparent;  border: 0;  outline: none;  background:none; background:#ffffff; opacity:0.8;  transition:0.3s}
.slick-dots li.slick-active{}
.slick-dots li.slick-active button{background:#f9a607; opacity:1; width:40px; transition:0.3s}

/*slick_dot*/
.slickdot .slick-dots{position: absolute; display: inline-block;  line-height:100%;  width:auto;text-align: center; z-index:10}
.slickdot .slick-dots li{position: relative;  display: inline-block;  width: 8px;  height: 8px;  margin: 0 3px;  padding: 0;   cursor: pointer; vertical-align:middle;}
.slickdot .slick-dots li button{ font-size: 0;   line-height: 0;  display: block;  width: 100%;  height: 100%; border-radius:500px;  cursor: pointer;  color: transparent;  border: 0;  outline: none;  background:none; background:#c8c8c8; opacity:1}
.slickdot .slick-dots li.slick-active button{background:#000000; opacity:1}


/*pop_dot*/
.pop_dot .slick-dots{position: absolute; background:#173049; bottom: 0;  left:0; right:0;  display: inline-block; padding: 10px; line-height:100%;  width:auto;  text-align: center; z-index:10}
.pop_dot .slick-dots li{position: relative;  display: inline-block;  width: 13px;  height: 13px;  margin: 0 5px;  padding: 0;   cursor: pointer; vertical-align:middle;}
.pop_dot .slick-dots li button{ font-size: 0;   line-height: 0;  display: block;  width: 100%;  height: 100%; border-radius:500px;  cursor: pointer;  color: transparent;  border: 0;  outline: none;  background:none; background:#ffffff; opacity:0.5}
.pop_dot .slick-dots li.slick-active button{background:#fcc754; opacity:1}



/*slick_circle_arrow*/

.slick_circle_arrow button{position:absolute; top:auto; bottom:10px; right:20px; background:none; border:1px solid #ffffff; border-radius:500px; border-color:rgba(255,255,255,0.5)}
.slick_circle_arrow button:before{color:#ffffff;}
.slick_circle_arrow button.slick-prev{margin-right:60px}




/**/
.wrap{max-width:2000px; min-width:320px; width:100%; margin: 0 auto; position:relative; }
.mainslider{position:relative; margin:0 auto; overflow:hidden}
.mainslider .slick-list{font-size:0px;}
.mainslider .visu{min-height:730px; max-height:1000px; height:100vh; background:#ffffff; position:relative; color:#ffffff;  line-height:1.3; font-size:14px; display:flex; align-items:center}
.mainslider .visu:before{content:''; position:absolute; top:0; left:0; right:0; bottom:0; background-size:cover !important;}
.mainslider .main01:before{background:linear-gradient(rgba(18,48,95,0.45), rgba(18,48,95,0.45)) no-repeat center center, url(../img/main_iso.jpg) no-repeat center 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 7s ease-out forwards;    -webkit-animation: zoomout 7s ease-out forwards;}

.mainslider .visu h2{font-weight:900}


.txtLine{display:block; overflow:hidden; line-height:1.2;}
.txtLine em{overflow:hidden; display:block;}
.txtLine em{font-weight:inherit; transform:translate(0, 100%);-webkit-transform:translate(0, 100%); transition: transform .72s cubic-bezier(0.22, 1, 0.36, 1);-webkit-transition:transform .72s cubic-bezier(0.22, 1, 0.36, 1);}
.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) {

}


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


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




.mainslider .visu .txt{margin: 0 auto; max-width:1600px; left:0; right:0; margin:auto; position:absolute; width:100%;  padding:0px 3%; text-align:center;}

/*
.mainslider .visu .txt:before{content:''; width:100%; height:100%; max-width:670px; position:absolute;  top:0; bottom:0; right:0; left:0; margin:auto; background:url(../img/worldmap_bg.png) no-repeat center top; background-size:100% !important; opacity:0.3}*/
.mainslider .visu h2{ /* -webkit-animation:fadeOutRight 0.5s both;       animation:fadeOutRight 0.5s both;*/}
.mainslider .visu h2 img{max-width:200px; margin-bottom:40px}
.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; font-size:1.4em; font-weight:600; letter-spacing:-2px}
.mainslider .visu p em:before{content:''; display:inline-block; width:40px; height:1px; vertical-align:middle; margin-right:10px; background:#ffffff}

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


/*mainslider text css*/
.mainslider h2{font-size:2.2em; font-weight:700; }
.mainslider h2 span.txtLine em{word-break:keep-all}

.mainslider p{position:relative; }

.mainslider p b{font-weight:800}


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


}


@media all and (min-width:768px) {
.mainslider h2{font-size:4em; }
.mainslider .visu p{font-size:1.6em}
}

@media all and (min-width:1024px) {
.mainslider .slick-dots{bottom:250px}
.mainslider .visu .txt{max-width:1000px; margin:0 auto; text-align:left;}
.mainslider .slick-dots{right:0%; left:0; right:0; text-align:right; bottom:340px; max-width:1000px; margin:auto;}

}

@media all and (min-width:1200px) {
.mainslider .visu p{font-size:1.75em}

}

@media all and (min-width:1600px) {
.mainslider .visu .txt{max-width:1600px; }
.mainslider .slick-dots{max-width:1600px; }

.mainslider h2{font-size:5.6em}

}


/*tabbox*/
.tabbox{position:relative; max-width:2000px; margin: 0 auto; color:#ffffff;  }
.tabbox .inner{max-width:1600px}
.tabbox .question h3{font-weight:700; font-size:1.25em; position:relative; z-index:1; line-height:1.4;}
.tabbox .question dl{font-weight:800; position:relative; z-index:1;}
.tabbox .question dl dt{font-size:2.1em}
.tabbox .question{padding:30px 5%; position:relative;}
.tabbox .question:before{content:''; position:absolute; width:100%; height:100%; left:0; top:0; bottom:0; background:#f49c1b;opacity:0.9; z-index:0;}

.tabbox .question a.ic_inquiry{width:120px; height:120px; top:-120px; background:#131c3c; color:#ffffff; padding:10px; text-align:center; display:block; position:absolute; right:0; font-weight:700; font-size:1.1em; z-index:2;}
.tabbox .question a.ic_inquiry img{width:60px; }
.tabbox .question a.ic_inquiry span{display:block;}

@media all and (min-width:540px) {
.tabbox .question{padding:40px 20px; }
.tabbox .question a.ic_inquiry{width:170px; height:auto; top:0; top:0; right:0; bottom:0; padding:30px;}
.tabbox .question a.ic_inquiry img{width:80px; }
.tabbox h3 span.mEnter{display:inline !Important}

}




@media all and (min-width:1024px) {
.tabbox{height:174px; margin-top:-174px;}
.tabbox .question{margin-left:50%}
}

@media all and (min-width:1200px) {
.tabbox{height:200px; margin-top:-200px}
.tabbox .question{padding:50px}
.tabbox .question a.ic_inquiry{width:190px;}
.tabbox .question a.ic_inquiry img{width:100px; }
.tabbox .question a.ic_inquiry span{font-size:1.1em}

}

@media all and (min-width:1400px) {
.tabbox{height:210px; margin-top:-210px}
.tabbox .question a.ic_inquiry{width:210px;}
.tabbox .question{font-size:1.1em;}
}



/*section 공통*/
.section{padding:60px 0px;}
.section_top {text-align:center; color:#000000}
.section_top h3{font-size:2.1em; font-weight:800 }
.section_top h3 span{font-size:13px; display:block; text-transform:uppercase; font-weight:700; margin-bottom:12px; letter-spacing:0.08em;}
.section_top p.txt{color:#808080}

@media all and (min-width:620px) {
.section_top h3{font-size:2.4em}
.section_top h3 span{font-size:14px}
}

@media all and (min-width:768px) {
.section{padding:80px 0px;}
.section_top h3{font-size:2.5em;  }
.section_top p.txt{font-size:1.1em}
}

@media all and (min-width:1024px) {
.section_top h3{font-size:3.1em;  }
.section_top h3 span{font-size:14px; position:relative;}
.section_top h3 span:before{content:''; width:50px; height:2px; background:#ffffff; display:inline-block; vertical-align:middle; margin-right:16px; opacity:1}
}

@media all and (min-width:1200px) {
.section{padding:140px 0px;}
.section_top h3{font-size:3.3em; line-height:1.15 }
.section_top h3 span{margin-top:10px;  }

}


@media all and (min-width:1400px) {
.section_top h3{font-size:4em; line-height:1.15 }
.section_top h3 span{font-size:22px}

}


/*section01*/
#section01{overflow:hidden}
.certibox{padding:30px 20px; background:#3a3e41; color:#ffffff; position:relative;}
.certibox:before{content:''; width:70px; height:35px; position:absolute; right:20px; top:30px; background:url(../img/logo_w.png) no-repeat center center; background-size:100% !important }
.certibox .slick-arrow{top:40%; right:-25px; z-index:10}
.certibox .slick-arrow.slick-prev{right:auto; left:-25px; }
.certibox h3{font-size:1.2em; font-weight:700; margin-bottom:10px;}

.certibox li{text-align:center}
.certibox li img{max-width:80px; display:block; margin:0 auto; }
.certibox li span{display:block; font-weight:600; font-size:1.1em}

@media all and (min-width:620px) {
.certibox{padding:40px 20px;}
.certibox:before{content:''; width:120px; height:60px; }
}

@media all and (min-width:1024px) {
.certibox{padding:40px 5%;}
.certibox:before{content:''; right:5%; top:40px}

}



@media all and (min-width:1400px) {
.certibox{padding:50px 5%;}


}



#section01 .pdinner{max-width:550px; margin:0 auto}
#section01:after{content:''; display:block; clear:both;}
#section01 .right{position:relative;}

#section01 .product_slider .slick-arrow{top:auto; bottom:45px;}
#section01 .product_slider .slick-arrow.slick-prev{left:auto; right:50px}
#section01 .product_slider .slick-arrow.slick-next{right:0%;}
#section01 .product_slider .info{padding:40px 5%; max-width:400px; margin:0 auto; position:relative; background:#f49c1b; color:#ffffff; text-align:center; }

#section01 .product_slider{background:#f49c1b}
#section01 .product_slider .info h3{font-size:1.7em; font-weight:800; margin-bottom:10px; line-height:1.2 }
#section01 .product_slider .info h3 span{font-size:16px; font-weight:700; display:block; margin-bottom:10px; text-transform:uppercase; letter-spacing:0.03em}
#section01 .product_slider .info p{margin-bottom:20px; word-break:keep-all}
#section01 .product_slider .info a.line_btn{height:45px; line-height:45px; display:inline-block; padding:0 30px; border-radius:500px; border:1px solid #ffffff; font-size:0.9em}

#section01 .productbox .bg{position:relative;}
#section01 .productbox .product_bg li{background-size:cover !important; min-height:230px;}
#section01 .productbox .product_bg li img{display:none}
#section01 .productbox .product_bg li.bg01{background:url(../img/product_bg01.jpg) no-repeat center center;}
#section01 .productbox .product_bg li.bg02{background:url(../img/product_bg02.jpg) no-repeat center center;}

#section01 .product_slider .product_info .bg{background-size:cover !important; min-height:230px;}
#section01 .product_slider .product_info .bg01{background:url(../img/product_bg01.jpg) no-repeat center center;}
#section01 .product_slider .product_info .bg02{background:url(../img/product_bg02.jpg) no-repeat center center;}
#section01 .product_slider .product_info .bg03{background:url(../img/product_bg03.jpg) no-repeat center center;}
#section01 .product_slider .product_info .bg04{background:url(../img/product_bg04.jpg) no-repeat center center;}
#section01 .product_slider .product_info .bg05{background:url(../img/product_bg05.jpg) no-repeat center center;}
#section01 .product_slider .product_info .bg06{background:url(../img/product_bg06.jpg) no-repeat center center;}
#section01 .product_slider .product_info .bg07{background:url(../img/product_bg07.jpg) no-repeat center center;}


#section01 .section_top{color:#ffffff}
#section01 .left{color:#ffffff; padding:60px 5%; background:url(../img/left_bg.jpg) no-repeat center center; background-size:cover !important;}

#section01 .left p{color:#ffffff; word-break:keep-all}
#section01 .left .about_company h4{font-weight:600; margin-bottom:10px; text-align:center;}
#section01 .left .num_company{overflow:hidden}
#section01 .left .num_company dl{width:33.33%; float:left; text-align:center;}
#section01 .left .num_company dd{font-size:1.7em; font-weight:800;}
#section01 .left .num_company dt{text-transform:uppercase; font-size:0.8em; font-weight:700; letter-spacing:-0.02em}
#section01 .left .about_company:after{content:''; display:block; clear:both}

#section01 .left .section_top,
#section01 .left .about_company{max-width:700px; margin:0 auto}


@media all and (min-width:620px) {
#section01 .product_info{display:flex}
#section01 .product_info .info{width:50%; max-width:100%; padding:50px 5%; text-align:left; min-height:350px}
#section01 .product_slider .info a.line_btn{position:absolute; bottom:50px}
#section01 .product_info .bg{width:50%;}
#section01 .productbox .product_bg{position:absolute; top:0; bottom:0;}
#section01 .productbox .product_bg .slick-list{position:static}
#section01 .productbox .product_bg li{position:absolute; bottom:0; top:0; }
#section01 .productbox .product_bg li img{display:block;}

#section01 .productbox:after{content:''; clear:both; display:block}

#section01 .left .num_company dd{font-size:2.5em}
}

@media all and (min-width:768px) {
#section01 .product_slider .info p{font-size:1.1em}
}

@media all and (min-width:1024px) {
#section01 .left .about_company h4{text-align:left; margin-bottom:15px; }
#section01 .left .num_company dt{margin-bottom:15px; font-size:1em; }
#section01 .left .num_company dd{font-size:3em}
#section01 .product_slider .info h3{font-size:2em}
#section01 .product_slider .info h3 span{font-size:20px}

#section01 .left{padding:90px 0}
}

@media all and (min-width:1200px) {
#section01 .pdinner{max-width:1400px;}
#section01 .section_top{text-align:left; margin:20px 0px;  padding:0 30px 0px 0px}
#section01 {display:flex; flex-direction:row-reverse}
#section01 .right{float:right; width:50%; display:flex; flex-direction:column}
#section01 .left{float:left; width:50%; padding:85px 5%; min-height:557px}
#section01 .left .num_company dl{text-align:left;}
/*
#section01 .left .num_company dl{width:37%;}
#section01 .left .num_company dl:first-child{width:26%;}*/

#section01 .certibox{height:38%}
.certibox h3{margin-bottom:10px}
#section01 .product_slider{height:62%;}
#section01 .product_info .info{min-height:400px; }
#section01 .product_slider .info a.line_btn{bottom:70px}
#section01 .product_slider .info p{font-size:1.05em}
#section01 .product_slider .slick-arrow{bottom:60px}

}




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

#section01 .left{float:left; width:50%; padding:130px 5%;}
#section01 .product_info .info{min-height:450px}
#section01 .left .num_company dd{font-size:3em;}

#section01 .product_slider .info h3 span{margin-bottom:20px; font-size:20px;}
#section01 .product_slider .info h3{margin-bottom:20px; font-size:2.2em}
#section01 .product_slider .info p{font-size:1.1em}

#section01 .product_slider .slick-arrow{ right:30px;}
#section01 .product_slider .slick-arrow.slick-next{right:30px}
#section01 .product_slider .slick-arrow.slick-prev{right:90px}

}

@media all and (min-width:1600px) {
#section01 .left .num_company dd{font-size:3.5em;}

}

/*section02*/
#section02{overflow:hidden}
#section02 .pdinner{max-width:1400px;}
.news_slider{-webkit-box-shadow: 0px 0px 30px -5px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 30px -5px rgba(0,0,0,0.3);
box-shadow: 0px 0px 30px -5px rgba(0,0,0,0.3);}
#section02 .left .newsbox{background:#ffffff; padding:30px 30px 50px; }
.news_slider.circle-arrow .slick-arrow {border-color:#c8c8c8; top:auto; bottom:20px;}
.news_slider.circle-arrow .slick-arrow:before{color:#323232}
.news_slider.circle-arrow .slick-arrow.slick-next{right:10px; }
.news_slider.circle-arrow .slick-arrow.slick-prev{left:auto; top:auto;  right:70px; }
.news_slider .slick-dots{bottom:30px}
#section02 .left .newsbox h4{font-weight:700; margin-bottom:20px; font-size:1.2em}
#section02 .left .newsbox dl dt{font-weight:800; font-size:1.4em; margin-bottom:20px; display:-webkit-box;
-webkit-line-clamp: 2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word; 
line-height: 1.3;
height: 2.6em;
overflow:hidden;
text-overflow:ellipsis;
white-space:normal;
word-break:break-all;}

#section02 .left .newsbox dl dd.txt{display:block; display:-webkit-box;
-webkit-line-clamp: 2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word; 
line-height: 1.3;
height: 2.6em;
overflow:hidden;
text-overflow:ellipsis;
white-space:normal;
word-break:break-all;}
#section02 .left .newsbox dl dd.date{margin-top:10px; font-size:0.9em; font-weight:600}

#section02 .right ul{overflow:hidden;}
#section02 .right ul li{width:33.33%; float:left; padding:20px 0px; background:#000000; color:#ffffff; text-align:center;}
#section02 .right ul li img{max-width:60px;}
#section02 .right ul li a{display:block; width:100%; height:100%;}
#section02 .right ul li span{display:block; font-weight:700}
#section02 .right ul li.s01{background:#3a3e41}
#section02 .right ul li.s02{background:#f59c1c}
#section02 .right ul li.s03{background:#14324f}



@media all and (min-width:768px) {
#section02 .pdinner:after{content:''; clear:both; display:block;}
#section02 .left .newsbox{padding:50px 30px;}
#section02 .left{width:50%; float:left;}
#section02 .left .newsbox dl dt{font-size:1.3em}
#section02 .left .newsbox dl dd.txt{font-size:1.1em;}

#section02 .right{width:50%; float:left;}
#section02 .right ul li{width:50%; padding:30px 0px 40px}
#section02 .right ul li:first-child{margin-left:50%;}
#section02 .right ul li img{max-width:70px}

.news_slider.circle-arrow .slick-arrow{bottom:20px}
}


@media all and (min-width:1024px) {
#section02 .section_top h3{text-align:left; margin-left:5%}
#section02 .section_top h3 span:before{background:#808080}
#section02 .left{width:55%;}
#section02 .right{width:45%; margin-top:-105px}

#section02 .right ul li{font-size:1.2em; padding:35px 0px 40px}
#section02 .right ul li img{max-width:80px;}
}

@media all and (min-width:1200px) {
#section02{position:relative;}
#section02:before{content:''; display:block; position:absolute; left:0; right:0; bottom:0; height:40%; background:#f8f8f8}
#section02 .right{margin-top:-170px}
#section02 .right ul li{font-size:1.2em; padding:50px 0px 60px}
#section02 .right ul li img{max-width:100px;}
#section02 .left .newsbox{padding:70px 50px; background:#ffffff}

#section02 .left .newsbox dl dt{font-weight:800; font-size:1.4em; margin-bottom:20px; display:-webkit-box;
-webkit-line-clamp: 1; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word; 
line-height: 1.3;
height: 1.3em;
overflow:hidden;
text-overflow:ellipsis;
white-space:normal;
word-break:break-all;}


.news_slider.circle-arrow .slick-arrow{bottom:40px}

}

@media all and (min-width:1400px) {
#section02 .right{margin-top:-230px}
#section02 .right ul li{font-size:1.4em; min-height:300px; padding-top:60px;}
#section02 .right ul li img{max-width:120px}
}


/*section_mid*/
#section_mid{border-bottom:1px solid #e6e6e6; padding:50px 0px}
#section_mid .biz_certi ul{ max-width:430px; margin:0 auto}
#section_mid .biz_certi ul:after{content:''; clear:both; display:block;}
#section_mid .biz_certi ul li{position:relative; width:50%; float:left; margin-bottom:20px;}
#section_mid .biz_certi ul li img{width:40px; margin-right:20px; display:inline-block; vertical-align:middle;}
#section_mid .biz_certi ul li span{display:block; width:calc(100% - 60px); font-weight:600; color:#000000; font-size:0.9em; display:inline-block; vertical-align:middle; word-break:keep-all}

@media all and (min-width:768px) {
#section_mid{padding:80px 0px}
#section_mid .biz_certi ul{max-width:100%; display:flex  }
#section_mid .biz_certi ul li{width:25%; padding:0px; margin:0}
}

@media all and (min-width:1024px) {
#section_mid .biz_certi ul {padding-left:5%}
#section_mid .biz_certi ul li span{font-size:1.2em}
}



/*footer*/
#footer{background:#3a3e41;  color:#c8c8c8; font-size:0.9em; padding:30px 0px;}

#footer .pdinner,
#footer .inner{max-width:1600px}

#footer .foot_li{margin-bottom:10px; overflow:hidden; text-align:left; clear:both; padding:0 3% }
#footer .foot_li li{display:inline-block; padding:0 3px;}
#footer .foot_li li:first-child a{color:#f9a607; font-weight:500}
#footer .foot_li li a{display:block; line-height:25px;}

#footer .box p{font-weight:500; margin-bottom:10px}
#footer .box p b{margin-left:10px; padding-left:10px; border-left:1px solid #ffffff; border-color:rgba(255,255,255,0.3); font-weight:700 }
#footer .copy p{font-size:0.8em; clear:both; }
#footer .copy p b{font-weight:600; color:#f9a607; text-transform:uppercase}

#footer address{padding-bottom:5px;}

/*컬러패스*/
/*#footer .dropdown{float:left; border-right:1px solid #dcdcdc;border-color:rgba(255,255,255,0.2); position:relative; width:46%; background:#555555}*/
#footer .dropdown{border-bottom:1px solid #dcdcdc;border-color:rgba(255,255,255,0.2); position:relative;}
#footer .dropdown.deph02{width:54%;}
#footer .dropbtn {width:100%; text-align:left; display:inline-block; height:auto; position:relative; line-height:50px; padding:0 25px 0 10px; cursor:pointer; color:#ffffff;}
#footer .dropbtn:after{font-family:'FontAwesome'; content:'\f107'; position:absolute; right:10px; color:#ffffff; font-size:14px; top:0; bottom:0; margin:auto;}

#footer .dropdown ul{}
#footer .dropdown ul li{padding:0px 10px; }
#footer .dropmenu {display: none;  position: absolute;  z-index: 5; background:#555555; border:1px solid #555555; box-sizing:content-box; left:-1px; width:100%;  top:-120px; max-height:120px; overflow-y:scroll}
#footer .dropmenu a{display:block; line-height:30px; color:#ffffff; }
#footer .dropmenu a:hover {font-weight:500;}
#footer .dropdown .show {display:block;}



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

.footinfo{position:relative; overflow:hidden}
.footinfo .box{padding:0px 0px 20px; /*border-top:1px solid #dcdcdc; border-color:rgba(255,255,255,0.1); text-align:left;*/ }
.footinfo .box h4{font-weight:700; margin-bottom:5px;}
.copy{letter-spacing:0}


@media all and (min-width:540px) {
/*.footinfo{ border-top:1px solid #dcdcdc; border-color:rgba(255,255,255,0.1);}
.footinfo .box{border:0px;}*/
}


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

#footer{font-size:0.9em}
#footer .inner{padding:0 3%;}
#footer .inner:after{content:''; clear:both; display:block}
/*#footer .bottom_li{border-bottom:1px solid #e6e6e6; border-color:rgba(255,255,255,0.1); }*/
#footer .relative_li{float:right; border-left:1px solid #dcdcdc; border-color:rgba(255,255,255,0.1);}
#footer .foot_li{float:left; clear:none; padding:0; margin:0}
#footer .dropdown{width:auto !important;}
#footer{padding:60px 0px 60px}
#footer .foot_li li{text-align:left; padding:0 20px 0 0px;}


#footer{text-align:left;}


#footer .dropbtn{padding:0 30px 0 20px; line-height:60px}
#footer .dropdown{float:left;}
#footer .dropdown ul li{padding:0px 20px; }
#footer .dropdown{min-width:230px; border-bottom:0; border-right:1px solid #dcdcdc;border-color:rgba(255,255,255,0.1); }
#footer .dropdown.deph02{min-width:200px}
#footer .dropmenu a{line-height:40px;}
#footer .dropbtn:after{right:15px}

.footinfo{border:0px; padding:0 !important}
.footinfo .box{ padding:30px 3%;}
.footinfo .box h4{font-size:1.2em}
.footinfo .box ul li{display:inline-block; margin-right:10px;}

#footer .box p{font-size:1.05em;}
}

@media all and (min-width:1200px) {
#footer .dropdown.deph02{min-width:250px}
#footer .inner{padding:0 20px;}
.footinfo .box{ padding:30px 20px;}

#footer .footinfo:before{content:''; position:absolute; right:20px; top:0; bottom:0; margin:auto; width:154px; height:66px; background:url(../img/logo_w.png) no-repeat center center; background-size:100% !important}
}


/*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:block !important; cursor:pointer; z-index:4000;}
#sns{position:fixed; z-index:999; right:calc(1% + 5px); bottom:calc(5% + 60px)}
#sns li{width:40px; height:40px; margin-top:5px;}

@media all and (min-width:1200px) {
#sns{bottom:45%;}
#sns li{margin-top:20px}
}




/*키프레임셋팅*/

@keyframes zoomout {
	0% { transform: scale(1.07); }
    100% {        transform: scale(1.0);    }
}
@-webkit-keyframes scaling {
	From {    -webkit-transform: scale(1.07);}
	To {    -webkit-transform: scale(1.0);}
}
@-webkit-keyframes bounce-top{0%{-webkit-transform:translateY(-30px);transform:translateY(-30px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:1}24%{opacity:1}40%{-webkit-transform:translateY(-15px);transform:translateY(-15px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}65%{-webkit-transform:translateY(-3px);transform:translateY(-3px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}82%{-webkit-transform:translateY(-0px);transform:translateY(-0px);-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 scale-up-center{0%{-webkit-transform:scale(.5);transform:scale(.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes scale-up-center{0%{-webkit-transform:scale(.5);transform:scale(.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}
@-webkit-keyframes kenburns-top{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0);-webkit-transform-origin:50% 16%;transform-origin:50% 16%}100%{-webkit-transform:scale(1.1) translateY(-15px);transform:scale(1.1) translateY(-15px);-webkit-transform-origin:top;transform-origin:top}}@keyframes kenburns-top{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0);-webkit-transform-origin:50% 16%;transform-origin:50% 16%}100%{-webkit-transform:scale(1.1) translateY(-15px);transform:scale(1.1) translateY(-15px);-webkit-transform-origin:top;transform-origin:top}}



.bounce-top:hover a:before{-webkit-animation:bounce-top .9s both;animation:bounce-top .9s both}
.kenburns-top{-webkit-animation:kenburns-top 10s ease-out both;animation:kenburns-top 10s ease-out both}
.zmout{animation: zoomout 5s ease-in-out infinite alternate;    -webkit-animation: zoomout 5s ease-in-out infinite alternate; animation-iteration-count:1; 	-webkit-animation-iteration-count: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%;}}



@-webkit-keyframes rotation {
	0% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	50% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	100% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
}
@keyframes rotation{

	0% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	50% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	100% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
}



@-webkit-keyframes rotation2 {
	0% {
		-webkit-transform: rotate(5deg);
		-o-transform: rotate(5deg);
		transform: rotate(5deg);
	}
	50% {
		-webkit-transform: rotate(-5deg);
		-o-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
	100% {
		-webkit-transform: rotate(5deg);
		-o-transform: rotate(5deg);
		transform: rotate(5deg);
	}
}
@keyframes rotation2{

	0% {
		-webkit-transform: rotate(5deg);
		-o-transform: rotate(5deg);
		transform: rotate(5deg);
	}
	50% {
		-webkit-transform: rotate(-5deg);
		-o-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
	100% {
		-webkit-transform: rotate(5deg);
		-o-transform: rotate(5deg);
		transform: rotate(5deg);
	}
}




@-webkit-keyframes rotation3 {
	0% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	50% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	100% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
}
@keyframes rotation3{

	0% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	50% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	100% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
}

.vibrate-1{-webkit-animation:vibrate-1 3s linear infinite both;animation:vibrate-1 3s linear infinite both}
@-webkit-keyframes vibrate-1 {
0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
 
  25% {
    -webkit-transform: translate(0px, 4px);
            transform: translate(0px, 4px);
  }
  50% {
    -webkit-transform: translate(0px, -8px);
            transform: translate(0px, -8px);
  }

  75% {
    -webkit-transform: translate(0px, 4px);
            transform: translate(0px, 4px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@keyframes vibrate-1 {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
 
  25% {
    -webkit-transform: translate(0px, 4px);
            transform: translate(0px, 4px);
  }
  50% {
    -webkit-transform: translate(0px, -8px);
            transform: translate(0px, -8px);
  }

  75% {
    -webkit-transform: translate(0px, 4px);
            transform: translate(0px, 4px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}







/*서브레이아웃*/

body.subWrap #header{box-shadow:none; }
#sub_visual{position:relative; text-align:center;  margin-top:40px; padding:120px 0 130px; background:url(../img/sub_visual01.jpg) no-repeat center center; background-size:cover !important; }
#sub_visual.sub02{background:url(../img/sub_visual02.jpg) no-repeat center center;  }
#sub_visual.sub03{background:url(../img/sub_visual03.jpg) no-repeat center center;  }
#sub_visual.sub04{background:url(../img/sub_visual04.jpg) no-repeat center center;  }
#sub_visual.sub05{background:url(../img/sub_visual05.jpg) no-repeat center center;  }
#sub_visual.sub06{background:url(../img/sub_visual06.jpg) no-repeat center center;  }
#sub_visual.sub07{background:url(../img/sub_visual07.jpg) no-repeat center center;  }
#sub_visual.sub08{background:url(../img/sub_visual08.jpg) no-repeat center center;  }


#sub_visual .tit_h2{color:#ffffff; font-weight:600; font-size:2em; margin-bottom:10px }
#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}
#sub_visual p{color:#ffffff; font-size:1.1em}

#sub_visual p.visu_tit span{z-index:2; position:relative; font-weight:500; opacity:0.8}
#sub_visual p.visu_tit span.tt {font-weight:800; opacity:1}

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

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

@media all and (min-width:1200px) {
body.subWrap #header{border-bottom:0px}
#sub_visual{margin-top:45px; overflow:hidden; padding:180px 0 160px;}
#sub_visual .tit_h2{font-size:2.8em; }
#sub_visual p.visu_tit{font-size:1.4em}
/*
#sub_visual:before{content:''; width:600px; height:600px; position:absolute; right:-200px; bottom:0; background:url(../img/svisu_cover01.png) no-repeat center center; background-size:100% !important}
*/
}



/*효과*/
.visusliderWrap h2.visu_tit strong:before {animation-timing-function:ease}
.slide_animation {
  position: relative;
  padding: 0.1rem 13px 0rem 0.2rem;
  overflow: hidden;
}
.slide_animation:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 3px;
  z-index: 1;
  width: 0;
  height: 8px;
  background:#f39800; background:linear-gradient(120deg, #f39800 60% , #ef7d00 100%);
  animation: slide 1.2s 1.2s forwards;
  animation-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
  border-radius:20px;
}


@keyframes slide {
  0% {
    width: 0;
  }
  50% {
    width: 100%;
	
  }

 80% {
    width: 8px;
	right:0;
	left:auto
  }

  100% {
    width: 8px;
	right:0;
	left:auto
  }
}


@media all and (min-width:1200px) {
.slide_animation {
  padding: 0.1rem 18px 0rem 0.2rem;
}
.slide_animation:before {
  height: 15px;
}

@keyframes slide {
  0% {
    width: 0;
  }
  50% {
    width: 100%;
	
  }

 80% {
    width: 15px;
	right:0;
	left:auto
  }

  100% {
    width: 15px;
	right:0;
	left:auto
  }
}

}



.subwrap{background:#ffffff; ; margin:0 auto;  padding:50px 0px  0}

.subcon{margin:0 auto; position:relative;  min-height:400px;}
.subcon:after{content:''; clear:both; display:block}

.sub_con .con{padding:0 3% 30px}
.conh3{font-size:1.6em; font-weight:600; color:#000000; text-align:center; position:relative}
/*.conh3:after{content:''; display:block; width:40px; height:1px; background:#323232; position:absolute; bottom:0; left:0; right:0; margin:auto}*/


.path{display:block;}
.path li{font-size:0.9em; display:inline-block; vertical-align:top; color:#ffffff; opacity:0.7}
.path li:before{content:'\f105'; font-family:'FontAwesome'; display:inline-block; padding:0px 10px}
.path li:first-child:before{display:none;}


.sub_title{padding:20px 3%; border-bottom:1px solid #e6e6e6; margin-bottom:30px; position:relative; overflow:hidden}
.sub_title ul{ position:absolute; height:30px; right:3%; top:0; bottom:0; margin:auto; }
.sub_title ul li{text-align:center; background:#15126e; border-radius:500px; width:30px; height:30px;  padding:8px;}
.sub_title ul li img{}
.sub_title h3{font-weight:500; font-size:1.4em; color:#505d6c}

@media all and (min-width:768px) {
.subwrap{padding:70px 0px 0}
}

@media all and (min-width:1200px) {
.sub_title ul{right:20px}

.conh3{font-size:2.4em;}
.subwrap{padding:100px 0px 0}
}






/*레프트2차메뉴*/
#sidemenu {display:none;float: left; /*position:fixed;*/width:260px;  z-index:10; top:auto;} /*기준*/
#sidemenu h2 {display:block;font-size:1.5em; text-align:center; line-height:1.2;  color:#fff; min-height:100px; padding:42px 0; /*background:rgba(90,19,40,0.8);*/ background:#004c7f; position:relative;  }
#sidemenu h2 span {display:block; font-size:15px; margin-bottom:10px; letter-spacing:0;}

#sidemenu .snblist{border:1px solid #e6e6e6; border-width:0 1px 1px; background:#ffffff}
#sidemenu .snblist li > a {position:relative; display: block; padding:17px 20px; font-weight:400; border-bottom:1px solid #e6e6e6; color:#323232; font-size:1.05em}
#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 a.active {color:#004c7f; font-weight:500}
#sidemenu .snblist li a.active:after {
	position: absolute;
	top: 43%;
	right: 10px;
	width:7px;
	height:7px;
	border-radius:80px;
	background:#004c7f;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	font-family: FontAwesome;
	content: "";
	font-style:normal;  
	color:#808080
}
#sidemenu .snblist li a:hover i:after{right: 7px;}
#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);
}


#sidemenu .snblist .sub{background:#f8f8f8; padding:10px 0px; border-bottom:1px solid #e6e6e6}
#sidemenu .snblist .sub li.select a{color:#006fba}
#sidemenu .snblist .sub li a{padding:8px 20px; border-bottom:0px }



/*서브탭*/
.tabmenu{position:relative;}
.tabmenu .dropbtn {line-height:45px; border:2px solid #767ba5;  width:100%; text-align:left; display:block; height:auto; position:relative; padding:0 25px 0 10px; cursor:pointer; color:#2b4771; font-weight:500}
.tabmenu .dropbtn:after{font-family:'FontAwesome'; content:'\f107'; position:absolute; right:10px; color:#2b4771; font-size:16px; top:0; bottom:0; margin:auto;}

.tabmenu .tabmenu_li ul{background:#f8f8f8}
.tabmenu .tabmenu_li ul li{border:1px solid #e6e6e6; border-top:0px; }
.tabmenu .tabmenu_li {display: none;  position: absolute;  z-index: 100; background:#ffffff; box-sizing:content-box;  width:100%; top:49px; left:0; right:0; }
.tabmenu .tabmenu_li ul li a{display:block; padding:0px 10px;  line-height:40px; color:#323232; }
.tabmenu .tabmenu_li ul li.active{background:#767ba5; border-color:#767ba5}
.tabmenu .tabmenu_li ul li.active a{ font-weight:500; color:#ffffff}
.tabmenu .tabmenu_li a:hover {font-weight:500;}
.tabmenu .tabmenu_li.show {display:block;}

@media all and (min-width:768px) {
.tabmenu .tabmenu_li {display: block !important; position:relative; top:0;} 
.tabmenu .tabmenu_li ul{background:none; text-align:center;}
.tabmenu .tabmenu_li ul:after{content:''; display:block; clear:both}
.tabmenu .tabmenu_li ul li {display:inline-block; margin:0 10px; border:0px; border-top:3px solid #e6e6e6}
.tabmenu .tabmenu_li ul li a{line-height:50px; font-size:1.1em; font-weight:500; padding:0 20px; }
.tabmenu .tabmenu_li ul li.active{border-color:#2b4771; background:none}
.tabmenu .tabmenu_li ul li.active a{color:#2b4771; font-weight:600}
.tabmenu .dropbtn{display:none}
}

@media all and (min-width:1200px) {
.tabmenu .tabmenu_li ul li a{line-height:60px; font-size:1.3em }
}




/*컬러패스*/
#sub_drop{width:100%;   border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6;  font-size:0.95em; position:absolute; bottom:0; background:#ffffff}
/*#sub_drop .inner{background:#767ba5;}*/

#sub_drop .inner:after{content:''; display:block; clear:both}
#sub_drop .dropdown{width:calc(100% - 40px); float:left; position:relative;}
#sub_drop .dropdown.home{width:40px; border:0; display:block;}
#sub_drop .dropdown.home a{display:block; line-height:55px; padding:0 10px;  text-align:center}

#sub_drop .home img{display:inline-block; vertical-align:middle; max-width:15px}
#sub_drop .dropbtn {width:100%; text-align:left; display:inline-block; height:auto; position:relative; line-height:55px; padding:0 10px 0 15px; cursor:pointer;  font-weight:500 /* background:rgba(0,0,0,0.3)*/}
#sub_drop .dropbtn:after{font-family:'FontAwesome'; content:'\f107'; position:absolute; right:10px; font-weight:600; font-size:14px; top:0; bottom:0; margin:auto;  transition:0.3s; }
#sub_drop .dropdown.active a.dropbtn:after{ -webkit-transform:rotate(180deg);
  -moz-transform:rotate(180deg);
  -ms-transform:rotate(180deg);
  -o-transform:rotate(180deg);
  transform:rotate(180deg)}

#sub_drop .dropdown.active a.dropbtn{background:#ffffff; }

#sub_drop .dropdown.dep{display:block; float:left; width:calc(40% - 20px )}
#sub_drop .dropdown.dep2{display:block; float:left; width:calc(60% - 20px )}

#sub_drop .dropdown ul li{padding:3px 15px; }
#sub_drop .dropmenu {display: none;  position: absolute;  z-index: 5; background:#ffffff; border:1px solid #e6e6e6; border-top:0px;   color:#323232; text-align:left; left:0; box-sizing:content-box; left:-1px; width:100%; padding:10px 0px}
#sub_drop .dropmenu a{display:block; line-height:40px}
#sub_drop .dropmenu a:hover {color:#000000; font-weight:600;}
#sub_drop .dropdown > .dropmenu li{position:relative;}
#sub_drop .dropdown > .dropmenu li a{display: block;}
#sub_drop .dropdown.active > .dropmenu {display:block;}

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

@media all and (min-width:768px) {
#sub_drop .dropdown.dep{max-width:200px; }
#sub_drop .dropdown.dep2{max-width:250px; }
}


@media all and (min-width:860px) {
#sub_drop{font-size:1.1em;    border-color:rgba(255,255,255,0.4); border-width:0; background:rgba(0,0,0,0.3); }
#sub_drop .inner{background:none; border:0px;}
#sub_drop .dropmenu{border:0px; background:none;  position:relative; text-align:center; left:0; display:block !important; padding:0}
#sub_drop .dropdown.home,
#sub_drop .dropdown.dep{display:none; float:none }
#sub_drop .dropdown.dep2{display:block; width:100%; max-width:100%}
#sub_drop .dropdown.active a.dropbtn,
#sub_drop .dropbtn.has-focus{background:#767ba5; border:0px;}

#sub_drop .dropdown > .dropmenu li a.current{background:#ffffff; color:#000000; font-weight:700;}
#sub_drop .dropdown > .dropmenu li a.current:hover{color:#505050}
/*
#sub_drop .dropdown > .dropmenu li a:before{content:''; position:absolute; bottom:0px; left:50%; width:0; height:3px;  background:#b964a4; background:linear-gradient(45deg, #b964a4 0% , #4a569d 100%); transition:all 0.2s cubic-bezier(0.7, 0, 0.3, 1)}
#sub_drop .dropdown > .dropmenu li:hover a:before,
#sub_drop .dropdown > .dropmenu li a.current:before{width:60px; margin-left:-30px;}*/

#sub_drop .dropdown.home a{line-height:60px; width:100%;  padding:0 } 
#sub_drop .dropbtn {line-height:50px; display:none}


#sub_drop .dropmenu a{color:#e6e6e6; font-weight:600}
#sub_drop .dropdown > .dropmenu li:hover a{color:#ffffff}

#sub_drop .dropdown > .dropmenu li{display:block;position:relative; padding:0 ; float:left; width:25%;}
#sub_drop .dropdown > .dropmenu li:before{content:''; display:block; width:1px; height:30px; background:#ffffff; opacity:0.2; position:absolute; left:0; top:0; bottom:0; margin:auto;}
#sub_drop .dropdown > .dropmenu li:first-child:before{display:none}

#sub_drop .dropdown > .dropmenu li a{line-height:70px; }
#sub_drop .dropdown > .dropmenu.list06 li{width:16.666%}
#sub_drop .dropdown > .dropmenu.list07 li{width:14.28%}
#sub_drop .dropdown > .dropmenu.list05 li{width:20%}
#sub_drop .dropdown > .dropmenu.list03 li{width:33.33%}
#sub_drop .dropdown > .dropmenu.list02 li{width:50%}
#sub_drop .dropdown > .dropmenu li a{display:block;  }

#sub_visual.sub02 #sub_drop{font-size:0.9em}
#sub_visual.sub02 #sub_drop .dropdown > .dropmenu li{width:13%;}
#sub_visual.sub02 #sub_drop .dropdown > .dropmenu li:nth-child(3){width:14%;}
#sub_visual.sub02 #sub_drop .dropdown > .dropmenu li:nth-child(4){width:11%;}
#sub_visual.sub02 #sub_drop .dropdown > .dropmenu li:nth-child(5){width:22%;}
#sub_visual.sub02 #sub_drop .dropdown > .dropmenu li:nth-child(6){width:16%;}
#sub_visual.sub02 #sub_drop .dropdown > .dropmenu li:nth-child(7){width:11%;}
}

@media all and (min-width:1200px) {
#sub_drop{  border:0px; font-size:1em}
#sub_drop .inner{max-width:1400px}
#sub_drop .dropdown.home a,
#sub_drop .dropdown > .dropmenu li a,
#sub_drop .dropbtn {line-height:75px; font-size:1.05em;  transition:0.3s;}
#sub_drop .dropdown.home{width:65px;}
#sub_drop .dropdown{width:calc(100% - 65px);}



#sub_drop .dropdown > .dropmenu li{}
#sub_drop .dropdown > .dropmenu li a{font-size:1em; }
#sub_visual.sub02 #sub_drop{font-size:1em}

}





/*텍스트효과*/

.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;}
}



@-webkit-keyframes heartbeat{from{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(.91);transform:scale(.91);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}17%{-webkit-transform:scale(.98);transform:scale(.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(.87);transform:scale(.87);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes heartbeat{from{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(.91);transform:scale(.91);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}17%{-webkit-transform:scale(.98);transform:scale(.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(.87);transform:scale(.87);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}
@-webkit-keyframes jello-vertical{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}40%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}50%{-webkit-transform:scale3d(.85,1.15,1);transform:scale3d(.85,1.15,1)}65%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}75%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes jello-vertical{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}40%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}50%{-webkit-transform:scale3d(.85,1.15,1);transform:scale3d(.85,1.15,1)}65%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}75%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}
@-webkit-keyframes text-pop-up-bottom{
	0%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;text-shadow:none}
	100%{-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}
	}
@keyframes text-pop-up-bottom
	{0%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;text-shadow:none}
	100%{-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}
	}

@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;}
}