@charset "utf-8";
/* CSS Document */
html,body{overflow-x:hidden !important;}
*{ margin:0; padding:0; }
ul,li{ list-style:none}
img { border:none;}
*:focus{ outline: none;}
.PC{ display:block !important}
.PHONE{ display:none !important}


.wrap{position: relative; z-index:inherit; left:50%; top:0; width:2000px; margin-left:-1000px}
.box0{ width:1480px; max-width:94%; margin:0 auto}
.box1{ width:1200px; margin:0 auto; max-width:100%}
.box2{ width:1200px; margin:0 auto; max-width:100%}


.fl_wrap{ *zoom:1;}
.fl_wrap:after{ content:""; display:block; clear:both;}
.fl_wrap > *     { float:left;}
.fl_wrap > .left { float:left;}
.fl_wrap > .right{ float:right;}
.fl_wrap > * > .in{ display:block}

.cl{ clear:both !important; display:block}
.pr{ position:relative; z-index:inherit}
.oh{ overflow:hidden !important;}

.resize{ display:block; height:0; padding-bottom:100%; position:relative;}
.resize .re{ position:absolute; left:0; top:0; width:100%; height:100%;}

/**/
#header{ position:fixed; z-index:1000; left:0; top:0; width:100%; border-bottom:1px solid rgba(255,255,255,.2); transition:.3s}
#header .va_wrap{ height:4.625em}
.headerPD{ padding-top:4.625em}
#header .logo{ float:left}
#header .logo > a{ position:relative}
.main #header .logo > a .logo1{ display:none;}
.main #header .logo > a .logo2{ display:inline-blockf}
#header .logo img{ max-height:80%}
#header .eng_m_st { position:absolute; right:43px; top:25px; color:#fff; font-size:1.063em;}
#header .eng_m_st .eng_m_xi {display:inline; padding-right:2px; font-size:15px;}

.sub #header .logo > a .logo2{ display:inline-block;}
.sub #header .logo > a .logo1{ display:none;}
.sub .stW#header .logo > a .logo2{ display:none;}
.sub .stW#header .logo > a .logo1{ display:inline-block;}


#header .gnb_wrap .gnb > li.m_guide{ display:none}

.stW#header{ background:#fff; border-bottom-color:#ddd}
.main .stW#header .logo > a .logo1{ display:inline-block}
.main .stW#header .logo > a .logo2{ display:none;}
.stW#header .gnb_wrap .gnb > li .dp1{ color:#111}
.stW#header .gnb_wrap .gnb > li:hover .dp1,
.stW#header .gnb_wrap .gnb > li.on .dp1{ color:#111}
.stW#header .language .langBtn{ background:#003f87}
.stW#header .eng_m_st {color:#003f87;}
.stW#header .m_btn .xi {color:#003f87;}
.stW#header .all_wrap .allBtn .va{ color:#111; border-color:#111;}
.stW#header .all_wrap{}
.stW#header .etc_wrap .etcBtn{ text-align:center;}
.stW#header .etc_wrap .etcBtn .va{ color:#111; border-color:#111;}



#header .menu_wrap{ float:right}
#header .gnb_wrap{ text-align:center; padding:0 5em 0 11em}
#header .gnb_wrap .gnb{}
#header .gnb_wrap .gnb > li{ position:relative;}
#header .gnb_wrap .gnb > li .dp1{ color:#fff; padding:0 1em; min-width:6.5em; position:relative;}
#header .gnb_wrap .gnb > li .dp1:after{ content:""; position:absolute; left:50%; bottom:-1px; width:0; height:3px; background:#ce1a1f; z-index:1; transition:.3s;}
#header .gnb_wrap .gnb > li:hover .dp1:after,
#header .gnb_wrap .gnb > li.on .dp1:after{  margin-left:-40%; width:80%;}
#header .gnb_wrap .gnb > li .dp1 .va{ position:relative; z-index:1; font-size:1.125em; transition:.3s}
#header .gnb_wrap .gnb > li .dp2{ position:absolute; left:50%; margin-left:-5rem; width:10rem; opacity:0; visibility:hidden; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.3);}
#header .gnb_wrap .gnb > li .dp2 > li{ display:block}
#header .gnb_wrap .gnb > li .dp2 > li > a{ height:auto; color:#111; text-align:center; padding:1em 0; border-top:1px dotted #999}
#header .gnb_wrap .gnb > li .dp2 > li:first-child > a{ border-top:none}
#header .gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em}
#header .gnb_wrap .gnb > li:hover .dp1,
#header .gnb_wrap .gnb > li.on .dp1{ color:#fff}
#header .gnb_wrap .gnb > li:hover .dp1:after,
#header .gnb_wrap .gnb > li.on .dp1:after{ opacity:1;}
#header .gnb_wrap .gnb > li:hover .dp2{ opacity:1; visibility:visible;}
#header .gnb_wrap .gnb > li .dp2 > li:hover > a{ color:#ce1a1f}

#header .etc_wrap .etcBtn{ width:40px; text-align:center; }
#header .etc_wrap .etcBtn .va{ font-size:1.250em; color:#fff; border-radius:100px; padding:.2em .4em; border:2px solid #fff;}


#header .all_wrap{ float:left;}
#header .all_wrap .allBtn{ width:5em; text-align:center; }
#header .all_wrap .allBtn .va{ font-size:1.250em; color:#fff; border-radius:100px; padding:.2em .4em; border:2px solid #fff;}
#header .all_wrap .all{ position: fixed; z-index:1; right:0; top:0; width:22em; max-width:90%; height:100%; box-shadow:-5px 0 5px rgba(0,0,0,.2); opacity:0; visibility:hidden; transition:.3s}
#header .all_wrap .all:not(.cssbrowser){ opacity:0; visibility:hidden; transition:.3s}
#header .all_wrap .all .bg{ position:fixed; left:0; top:0; width:100%; height:100%; background:#000; filter:alpha(opacity=50); opacity:.5; display:none\9; cursor:pointer}
#header .all_wrap .all .in{ position: absolute; right:-100%; width:100%; height:100%; background:#fff; transition:.3s}
#header .all_wrap .all .tit_wrap{ background:rgba(0,0,0,.7); background:#cf3128; position:relative; border-bottom:1px solid rgba(255,255,255,.2)}
#header .all_wrap .all .tit_wrap .btn{ position:absolute; top:0; width:5em; height:100%; text-align:center; color:#fff; transition:.3s; font-size:1.250em}
#header .all_wrap .all .tit_wrap .btn:hover{ background:rgba(0,0,0,.1)}
#header .all_wrap .all .tit_wrap .btn.close{ right:0; opacity:1 !important;}
#header .all_wrap .all .tit_wrap .tit{ padding:0 6em}
#header .all_wrap .all .tit_wrap .tit .va{ color:#fff; font-size:1.125em; font-weight:bold;}
#header .all_wrap .gnb > li{ display:block}
#header .all_wrap .gnb li > a{ position:relative; text-align:left; padding:0 2em; height:4em; overflow:hidden}
#header .all_wrap .gnb li > a:after{ content:"\e93f"; font-family:xeicon!important; position:absolute; right:0; top:0; width:3em; text-align:center; line-height:3.5em}
#header .all_wrap .gnb > li .dp1{ color:#333; border-bottom:1px solid #ddd; font-size:.938em}
#header .all_wrap .gnb > li .dp2{ background:#f5f5f5; padding:0 0 0 1px; position:relative; display:none}
#header .all_wrap .gnb > li .dp2:after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#ddd}
#header .all_wrap .gnb > li .dp2 > li{ width:50%}
#header .all_wrap .gnb > li .dp2 > li > a{ border:1px solid #ddd; margin:-1px 0 0 -1px; color:#333; transition:.3s; font-size:.938em}
#header .all_wrap .gnb > li .dp2 > li > a:after{ right:-100%; transition:.3s}
#header .all_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em}
#header .all_wrap .gnb > li:hover > .dp1{ background:#cf3128; color:#fff}
#header .all_wrap .gnb > li .dp2 > li:hover > a{ background:#555; border-color:transparent; color:#fff}
#header .all_wrap .gnb > li .dp2 > li:hover > a:after{ right:0}
#header .all_wrap.on .all{ display:block\9}
#header .all_wrap.on .all:not(.cssbrowser){ filter:alpha(opacity=100); opacity:1; visibility:visible}
#header .all_wrap.on .all .in{ right:0}



/*================================MAIN===============================================*/


.mainVisual_wrap .slick-track{ height:750px;}
.mainVisual_wrap,
.mainVisual,
.mainVisual .img{ position:relative;}
.mainVisual .img{ z-index:1; overflow:hidden;}
.mainVisual .img .bg{ position: absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; background-size:cover; transform:scale(1.1,1.1); transition:1.5s;}
.mainVisual .img.activeAni .bg{ transform:scale(1,1);}

.mainVisual_wrap .slick-dots{ position:absolute; bottom:60px; left:13.5%;}
.mainVisual_wrap .slick-dots > ul{}
.mainVisual_wrap .slick-dots > ul > li{ display:inline-block; margin:0 3px;}
.mainVisual_wrap .slick-dots > ul > li button{ position:relative; width:15px; height:15px; border:1px solid #fff; border-radius:25px; background:transparent; overflow:hidden; cursor:pointer; font-size:0;}
.mainVisual_wrap .slick-dots > ul > li button:after{ content:""; position:absolute; z-index:3; bottom:0; left:0; width:0; height:100%; background:#fff;}
.mainVisual_wrap .slick-dots > ul > li.slick-active button{ width:60px;}
.mainVisual_wrap .slick-dots > ul > li.slick-active button:after{ z-index:2; width:100%; transition:4s;}

.mainVisual_wrap .slogan_wrap{ position: absolute; z-index:2; left:0; top:0; width:100%; padding-top:180px;}
.mainVisual_wrap .slogan{ width:65%; margin:auto; position:relative; padding:70px}
.mainVisual_wrap .slogan .t1{ padding-bottom:1.4em; opacity:0; margin-left:-10%; /*text-shadow:0 1px 2px rgba(0,0,0,.5);*/ font-size:3em; font-family:'notokrR'; letter-spacing:-2px}
.mainVisual_wrap .slogan .t2{ opacity:0; margin-left:-10%; font-size:1.570em; font-family:'notokrR'}
.mainVisual_wrap .slogan .c1{ vertical-align:baseline; font-family:'notokrB'}
.mainVisual_wrap .slogan .line{ position:absolute; background:#fff; width:5px; height:5px}
.mainVisual_wrap .slogan .line.line1{ height:0; left:10%; bottom:90%}
.mainVisual_wrap .slogan .line.line2{ width:0; right:90%; top:0}
.mainVisual_wrap .slogan .line.line3{ height:0; left:0; top:0}
.mainVisual_wrap .slogan .line.line4{ width:0; left:0; bottom:0}
.mainVisual_wrap .slogan .line.line5{ height:0; left:20%; bottom:0}
.load .mainVisual_wrap .slogan .line{ transition:.5s}
.load .mainVisual_wrap .slogan .line.line1{ height:10%}
.load .mainVisual_wrap .slogan .line.line2{ width:10%; transition-delay:.5s}
.load .mainVisual_wrap .slogan .line.line3{ height:100%; transition-delay:1s}
.load .mainVisual_wrap .slogan .line.line4{ width:20%; transition-delay:1.5s}
.load .mainVisual_wrap .slogan .line.line5{ height:10%; transition-delay:2s}
.load .mainVisual_wrap .slogan .t1{ opacity:1; margin-left:0; transition:1s}
.load .mainVisual_wrap .slogan .t2{ opacity:1; margin-left:0; transition:1s; transition-delay:.5s}

/*공통*/
.main_tit{ font-family:'Ms'; font-size:2.250em; text-align:center; padding-bottom:1em; color:#222}
.main_tit.st{ color:#fff}
.main_tit .c1{ font-weight:700; vertical-align:baseline;}

.moreBtn{ font-family:'Ms'; font-weight:600; font-size:11px; text-transform:uppercase}
.moreBtn > i{ width:30px; height:30px; line-height:30px; border:1px solid #ccc; border-radius:50px; text-align:center; margin-left:1em; transition:.3s;}
.moreBtn:hover i{ background:#cf3128; color:#fff; border-color:#cf3128}

.plusBtn{ display:block; color:#fff !important; width:160px; height:40px; line-height:40px; text-align:center; border-radius:50px; border:1px solid #fff; margin:1em auto 1.5em auto; transition:.3s;}
.plusBtn > i{ color:#fff; vertical-align:baseline; font-size:.938em; padding-left:5px}
.plusBtn:hover{ background:#cf3128; color:#fff; border-color:#cf3128}



.main_con1{ padding:3em 0 8em 0;}
.main_con1 .business_wrap{ margin:0 0 0 -20px}
.main_con1 .business_wrap > ul{}
.main_con1 .business_wrap > ul > li{ width:33.33%;}
.main_con1 .business_wrap > ul > li .in{ box-shadow:2px 2px 15px rgba(0,0,0, 0.2); margin:0 0 0 20px; padding-bottom:1em; cursor:pointer;}
.main_con1 .business_wrap > ul > li .img{ min-height:219px; height:100%; background:url(../images/temp/no_img.jpg) no-repeat center center; background-size:cover !important; position:relative;}
.main_con1 .business_wrap > ul > li .in:hover .img:after{ content:""; background:rgba(0,0,0,0); width:100%; height:100%; position:absolute; top:0; left:0; transition:.3s all;}
.main_con1 .business_wrap > ul > li .in:hover .moreBtn > i{ background:#cf3128; color:#fff; border-color:#cf3128}
.main_con1 .business_wrap > ul > li .in:hover .moreBtn{ color:#cf3128;}
.main_con1 .business_wrap > ul > li .img:after{ content:""; background:rgba(0,0,0,0); width:100%; height:100%; position:absolute; top:0; left:0;}
.main_con1 .business_wrap > ul > li .prod1{ background:url(../images/main/sec1_img1.jpg) no-repeat;}
.main_con1 .business_wrap > ul > li .prod2{ background:url(../images/main/sec1_img3.jpg) no-repeat;}
.main_con1 .business_wrap > ul > li .prod3{ background:url(../images/main/sec1_img2.jpg) no-repeat;}
.main_con1 .business_wrap > ul > li .txarea{ padding:2em 2em 0 2em}
.main_con1 .business_wrap > ul > li .txarea > dt{ font-size:1.375em; font-family:'notokrB'; color:#222}
.main_con1 .business_wrap > ul > li .txarea > dd{ font-size:1em; color:#555; padding:1em 0 2em 0}
.main_con1 .business_wrap > ul > li .moreBtn{ margin-left:3em}

.main_con2{ background:url(../images/main/sec2_bg.jpg) no-repeat center center; background-size:cover; padding:2.5em 0 2em 0;}
.main_con2 .tit_line{ width:30px; height:3px; background:#fff; display:block; margin:0 auto 1.5em auto}
.main_con2 .t1{ font-size:2em; color:#fff; text-align:center; font-family:'notokrB';}
.main_con2 .t2{ line-height:1.6; font-size:1.125em; color:#fff; text-align:center}
.main_con2 .icon{ text-align:center; padding:1.5em 0}

.main_con3{ background:#f7f7f7; padding:3em 0 6em 0}
.customer_wrap{position:relative;  height:70px; margin-bottom:40px; border-bottom:1px solid #ddd; border-top:1px solid #ddd;}
.customer_wrap .customer_slide .tt{position:absolute; left:0; top:16px; z-index:3;}
.customer_wrap .customer_slide .tt .xi{display:inline-block; *display:inline; zoom:1; vertical-align:middle; color:#000; font-size:30px; color:#000;}
.customer_wrap .customer_slide .tt span{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; color:#fff; font-size:0.938em;  cursor:pointer; background:#003f87; padding:10px 30px;}
.customer_wrap .customer_slide .slides{}
.customer_wrap .customer_slide .slides li{height:70px; line-height:70px; position:relative;}
.customer_wrap .customer_slide .slides li .notice_tit {color:#000; font-family:notokrR; font-size: 1em; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding-right:180px; margin-left:130px; vertical-align:middle; width:50%; cursor:pointer}
.customer_wrap .customer_slide .slides li .notice_tit .xi {vertical-align:bottom; padding-right:3px;}
.customer_wrap .customer_slide .flex-direction-nav{position:absolute; right:0; bottom:16px;}
.customer_wrap .customer_slide .flex-direction-nav li{display:inline-block;}
.customer_wrap .customer_slide .flex-direction-nav a{display:block; height:40px; width:40px; font-size:0;}
.customer_wrap .customer_slide .flex-direction-nav a:hover{background-color:#111;}
.customer_wrap .customer_slide .flex-direction-nav .flex-prev{background-color:#595959; background-image:url(../images/main/arr_up.png); background-repeat:no-repeat; background-position:center center; margin-right:1px;}
.customer_wrap .customer_slide .flex-direction-nav .flex-next{background-color:#595959; background-image:url(../images/main/arr_down.png);  background-repeat:no-repeat; background-position:center center;}
.customer_wrap .customer_slide .slides li .notice_date{position:absolute; right:120px; top:0; color:#999; font-family:notokrR; font-size:.875em;}
.main_con3 .custom_ul { overflow:hidden; margin-left:-10px;}
.main_con3 .custom_ul .li_in { float:left; width:25%;}
.main_con3 .custom_ul .li_in .con_in { margin-left:10px; border:1px solid #ddd; position:relative; overflow:hidden;}
.main_con3 .custom_ul .li_in .con_in:after { position:absolute; content:""; right:-35px; bottom:-35px; width:65px; height:65px; transform:rotate(45deg); border-left:1px solid #ddd;;}
.main_con3 .custom_ul .li_in .con_in .con_im_wrap { position:relative;  z-index:101; cursor:pointer}
.main_con3 .custom_ul .li_in .con_in .con_im_wrap .con_img > img{ width:100%}
.main_con3 .custom_ul .li_in .con_in .con_tx_wrap { padding:20px 30px 50px 30px; position:relative;  z-index:101; background:#fff}
.main_con3 .custom_ul .li_in .con_in .con_tx_wrap .ti { color:#000; font-size:1.250em; font-family:notokrM;}
.main_con3 .custom_ul .li_in .con_in .con_tx_wrap .tx { color:#555; font-size:0.938em; padding:15px 10px 0 0px; line-height: 1.5;}
.main_con3 .custom_ul .li_in .con_in .con_tx_wrap .bis_more { color:#222; position:absolute; right:-1px; bottom:-1px; padding:.5em; display:block; background:#fff;}
.main_con3 .custom_ul .li_in .con_in .con_tx_wrap .bis_more .xi { font-size:27px; transition:.3s;}
.main_con3 .custom_ul .li_in .con_in:hover .bis_more .xi,
.main_con3 .custom_ul .li_in .con_in .con_tx_wrap .bis_more:hover .xi { color:#cf3128;}



/**/
#footer{ background:#282828}
#footer .menu_wrap{ background:#282828;}
#footer .menu_wrap .box2{ position:relative;}
#footer .menu_wrap .gnb_wrap{ position:relative}
#footer .menu_wrap .gnb_wrap .gnb > li{ width:20%; position:relative; min-height:19em}
#footer .menu_wrap .gnb_wrap .gnb > li:after,
#footer .menu_wrap .gnb_wrap .gnb > li:first-child:before{ content:""; position:absolute; right:0; top:0; width:1px; height:100%; background:#fff; opacity:.1}
#footer .menu_wrap .gnb_wrap .gnb > li:first-child:before{ left:0}
#footer .menu_wrap .gnb_wrap .gnb > li .dp1{ padding:1.5em 1.5em 1em 1.5em; color:#fff; text-align:left}
#footer .menu_wrap .gnb_wrap .gnb > li .dp2{ /*padding-bottom:3rem*/}
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li{ display:block}
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a{ padding:.5em 1.5em; text-align:left; color:#fff; opacity:.6; transition:.3s}
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em}
#footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a:hover{ opacity:1}
#footer .menu_wrap .etc_wrap{ width:20%; position:absolute; right:0; top:0; height:100%}
#footer .menu_wrap .etc_wrap:after{ content:""; position:absolute; top:0; width:1px; height:100%; background:#fff; opacity:.1}
#footer .menu_wrap .etc_wrap:after{ right:0}
#footer .menu_wrap .etc_wrap .in{ padding:2em 1em}
#footer .menu_wrap .etc_wrap .in .catalog{ display:block; background:#fff; color:#ce1a1f; height:2.5em; transition:.3s}
#footer .menu_wrap .etc_wrap .in .catalog .tt{ font-size:.875em; padding-left:.5em}
#footer .menu_wrap .etc_wrap .in .catalog:hover{ background:#ce1a1f; color:#fff}
#footer .link_wrap{ border:1px solid #333; border:1px solid rgba(255,255,255,.1); border-left:none; border-right:none; background:#282828;}
#footer .link_wrap .va_wrap{ height:3em}
#footer .link_wrap .link > li > a{ margin:0 2.5em; color:#fff}
#footer .link_wrap .link > li > a:first-child{ margin-left:0}
#footer .link_wrap .link > li > a .va{ font-size:.875em; opacity:.6;}
#footer .link_wrap .link > li > a:hover .va{ text-decoration:underline}
#footer .link_wrap .gotop{ display:block; width:3.5em; background:#111; background:rgba(0,0,0,.4); opacity:.7; color:#fff; text-align:center; transition:.3s}
#footer .link_wrap .gotop .xi{ display:block}
#footer .link_wrap .gotop .tt{ display:block; font-size:.625em; letter-spacing:0}
#footer .link_wrap .gotop:hover{ background:#ce1a1f; color:#fff; opacity:1}
#footer .footerLogo{ padding-right:5em;}
#footer .info_wrap{ padding:1.5em 0}
#footer .info_wrap .info{ }
#footer .info_wrap .info > li{ margin-right:4em; font-size:.857em; color:#fff; opacity:.6; line-height:1.8; letter-spacing:0; font-family:notokrR}
#footer .info_wrap .info > li:first-child{ opacity:1;}
#footer .info_wrap .box1{ position:relative;}
#footer .info_wrap .mark{ position:absolute; right:0; bottom:.5em; display:none;}
#footer .info_wrap .info > li.copyright{ clear:both; padding-top:1em; font-size:.688em; color:#777; /*opacity:.3; */text-transform:uppercase}


/**/
#contents{}
#contents .sub_visual_wrap{ position:relative}
#contents .sub_visual_wrap > .va_wrap{ position:relative; height:23.5em; overflow:hidden}
#contents .sub_visual_wrap .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-position:center; background-repeat:no-repeat; background-size:cover; background-color:#00285e; transform:scale(1.3,1.3); transition:2s}
#contents .sub_visual_wrap .bg.bg_company_certification,
#contents .sub_visual_wrap .bg.bg_company_greetings,
#contents .sub_visual_wrap .bg.bg_company_history,
#contents .sub_visual_wrap .bg.bg_company_location,
#contents .sub_visual_wrap .bg.bg_company_overview,
#contents .sub_visual_wrap .bg.bg_company_vision{ background-image:url(../images/sub/sub_visual_company.jpg);}
#contents .sub_visual_wrap .bg.bg_customer_dataroom,
#contents .sub_visual_wrap .bg.bg_customer_notice,
#contents .sub_visual_wrap .bg.bg_customer_pdf,
#contents .sub_visual_wrap .bg.bg_customer_qna{ background-image:url(../images/sub/sub_visual_customer.jpg);}
#contents .sub_visual_wrap .bg.bg_guide_agree,
#contents .sub_visual_wrap .bg.bg_guide_privacy{ background-image:url(../images/sub/sub_visual_guide.jpg);}
#contents .sub_visual_wrap .bg.bg_online_inq{ background-image:url(../images/sub/sub_visual_online.jpg);}
#contents .sub_visual_wrap .bg.bg_business_business1{ background-image:url(../images/sub/sub_visual_business_business1.jpg);}
#contents .sub_visual_wrap .bg.bg_business_business2{ background-image:url(../images/sub/sub_visual_business_business2.jpg);}
#contents .sub_visual_wrap .bg.bg_business_business3{ background-image:url(../images/sub/sub_visual_business_business3.jpg);}


#contents .sub_visual_wrap .slogan{ position:relative; padding-top:1em}
#contents .sub_visual_wrap .slogan .tit{ font-size:2.125em; font-weight:500; color:#fff; margin-right:5em; opacity:0; transition:1s;}
#contents .sub_visual_wrap .slogan .sec{ display:block; width:0; height:.1em; margin:1.25em auto; background:#fff; transition:1s; transition-delay:.5s}
#contents .sub_visual_wrap .slogan .nav{ font-size:.875em; color:#fff; opacity:0; line-height:1.5; transition:1s; transition-delay:.5s}
#contents .sub_visual_wrap .slogan .nav .xi{ font-size:1em;}
#contents .sub_visual_wrap .slogan .nav .arrow{ margin:0 .3em 0 .2em}
#contents .sub_visual_wrap .slogan .nav .arrow:before{content:"\e93f"}
.load #contents .sub_visual_wrap .slogan .tit{ margin-right:0; opacity:1}
.load #contents .sub_visual_wrap .slogan .nav{ opacity:1}
.load #contents .sub_visual_wrap .slogan .sec{ width:2.5em}
.load #contents .sub_visual_wrap .bg{ transform:scale(1,1);}
#contents .sub_visual_wrap .sub_gnb_wrap{ /*position:absolute; left:0; bottom:0; width:100%*/ position:absolute; left:0; bottom:0; width:100%; bottom:3.5em; position:relative;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb{ text-align:center; margin-top:-1em;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li,
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp1{ display:none}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li.on,
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li.on .dp2{ display:block}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li{ max-width:20%; }
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li.m_0001_{ bottom:-3.3em; position:relative;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li.m_0001_ .dp2 > li{ width:20% !important; }
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a{ background:rgba(0,0,0,0.7); color:#fff; height:3.5em; border-left:1px solid rgba(255,255,255,.1);transition:.3s}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:1.125em; opacity:.6; transition:.3s}
/*#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li:hover > a{ opacity:.8}*/
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li.on > a{ background:#fff; color:#111}

#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li:hover > a .va,
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li.on > a .va{ opacity:1 }





/**/
.gnb .dp3{ display:none;}
#contents .sub_tab_wrap{ border-bottom:1px solid #ccc; margin-top:-3em; margin-bottom:3em;}
#contents .sub_tab_wrap *{ }
#contents .sub_tab_wrap .gnb .va_wrap{ height:60px}
#contents .sub_tab_wrap .gnb li, #contents .sub_tab_wrap .gnb a{ display:none}
#contents .sub_tab_wrap .gnb .dp3{ text-align:center}
#contents .sub_tab_wrap .gnb li.on, #contents .sub_tab_wrap .gnb .dp3, #contents .sub_tab_wrap .gnb .dp3 > li, #contents .sub_tab_wrap .gnb .dp3 > li > a{ display:block}
#contents .sub_tab_wrap .gnb .dp3 > li{ display:inline-block}
#contents .sub_tab_wrap .gnb .dp3 > li > a{ padding:0 40px; font-size:1.125em; color:#333; position:relative; transition:.3s}
#contents .sub_tab_wrap .gnb .dp3 > li > a:after{ content:""; position:absolute; left:50%; bottom:-3px; width:30px; height:5px; background:#2179ef; margin-left:-15px; opacity:0;}
#contents .sub_tab_wrap .gnb .dp3 > li.on > a, #contents .sub_tab_wrap .gnb .dp3 > li:hover > a{ color:#2179ef}
#contents .sub_tab_wrap .gnb .dp3 > li.on > a:after{ opacity:1}

#contents .sub_tit_wrap{ /*border-bottom:1px solid #ddd; */text-align:center; position:relative; background:#fff; transition:.3s; z-index:1;}
#contents .sub_tit_wrap .va_wrap{ /*height:5em;*/ z-transition:.3s; height:2em;}
#contents .sub_tit_wrap .tit{ font-size:2.25em; color:#111;}

#contents .doc{ padding:0 0 16em 0;}
#contents .doc.st{ padding:0 0 10em 0;}
#contents .doc.st1{ padding:0; margin-top:-3em;}
#contents .doc.st2{ padding:0;}


/*조직도*/
.page_Bg{ padding:4em 0; margin-top:-3em}
.page_Bg.bg_c1{ background-color:#f6f6f6;}
.page_Bg.bg_c2{ background-color:#062c5e;}
.page_orgaWrap{ padding-bottom:5em; text-align:center;}



/*연혁*/
.his_tit {font-size:1.5em; padding-bottom:1.5em; text-align:center; position:relative; margin-bottom:2em;}
.his_tit:after {position:absolute; content:""; width:3%; height:2px; background:#90c820; bottom:0; left:50%;}
.his_tit:before {position:absolute; content:""; width:3%; height:2px; background:#22287b; bottom:0; left:47%;}

.his_tit .in {vertical-align:top; color:#1da1f2; font-family:'notokrB';}
.history_area{ position:relative;}
.history_area .history_lst{ margin-left:190px; }
.history_area .history_lst .list{ *zoom:1; padding:30px 0; border-bottom:1px solid #ccc;}
.history_area .history_lst .list:after{ content:""; display:block; clear:both;}
.history_area .history_lst .list:first-child{ margin-top:0;}
.history_area .history_lst .list dt{ float:left; width:125px; margin:0 0 0 -145px;  text-align:right; position:relative}
.history_area .history_lst .list dt span{ display:inline-block; *display:inline; zoom:1; letter-spacing:-1px;}
.history_area .history_lst .list dt .year {font-size:2.7em; color:#6b7f98; margin:-5px 10px 0 0; font-weight:500}
.history_area .history_lst .list dd{ font-size:16px; margin-left:-10px; padding:5px 0 5px 40px; line-height:24px;}
.history_area .history_lst .list dd.first { margin-left:-10px; padding:5px 0 5px 40px; line-height:21px;font-size: 1em;}
.history_area .history_lst .list dd strong { color:#888; padding-right:10px; font-size:14px; min-width: 35px; display: inline-block;}



/*공통*/
.page_sec{ margin-top:50px;}
.page_sec2{ margin-top:35px;}
.page_sec3{ margin-top:15px;}
.page_sec4{ margin-top:60px;}

.page_tit{ position:relative; padding:15px 0 20px 0; font-size:1.25em; color:#111}
.page_tit:before,
.page_tit:after{ content:""; position:absolute; top:0; left:2px; width:.625em; height:4px}
.page_tit:before{ background:#2179ef;}
.page_tit:after{ background:#90c820; margin-left:.625em}
.page_tit.ac:before{ left:50%; margin-left:-.625em}
.page_tit.ac:after{ left:50%; margin-left:0}
.page_tit .t1{ display:block; font-size:.875em; margin-top:-5px}


.prod_tit{ text-align:center; margin-bottom:50px; border-bottom:1px solid #ddd; margin-top:-1.5em; /* font-size:2em; color:#333; margin-bottom:1.2em; margin-top:-.5em;*/}
.prod_tit .tt{ position:relative; display:inline-block; zoom:1; *display:inline; padding:0 60px 25px 60px; font-size:1.875em; color:#010101}
.prod_tit .line{ position:absolute; bottom:-1px; left:0; right:0; width:100%; height:2px; /*background:#cf3128*/}




.txBox{ font-family:'notokrR'; line-height:1.5; color:#222; padding:2em 2.5em; border:1px solid #ddd; word-break:break-all}


/**/
.sub_tt_wrap {margin-bottom:20px;}
.sub_tt_wrap .tit {font-size:1.313em; position:relative; padding-left:35px;}
.sub_tt_wrap .tit:before,
.sub_tt_wrap .tit:after{ content:""; position:absolute; top:9px; left:2px; width:15px; height:7px; transform:rotate(45deg);}
.sub_tt_wrap .tit:before{ background:#233f87}
.sub_tt_wrap .tit:after{ background:#2179ef; margin-left:.625em}

.sub_ti_wrap{ margin-bottom:15px; margin-left:1em}
.sub_ti_wrap .tit{ font-size:1.125em; position:relative; padding-left:18px; color:#555}
.sub_ti_wrap .tit:before{ content:""; position:absolute; top:7px; left:2px; width:8px; height:8px; background-image: linear-gradient(to top, #6f86d6 0%, #48c6ef 50%, #6f86d6 100%); border-radius:5px}

.sub_tt_wrap2{ margin-bottom:15px}
.sub_tt_wrap2 .tit{ font-size:1.125em; color:#003f87}


/**/
.top_bg{ background:#f5f5f5; padding:3em 0; margin-bottom:3em; background-size:cover !important; border-radius:10px 0 10px 0; /*box-shadow:10px 10px 40px rgba(0,0,0,0.2);*/ }
.top_bg.bg1{ background:url(../images/sub/topbg01.jpg) no-repeat center 30%;}
.top_bg.bg2{ background:url(../images/sub/topbg02.jpg) no-repeat center 30%;}
.top_bg.bg3{ background:url(../images/sub/topbg03.jpg) no-repeat center center;}
.top_bg.bg4{ background:url(../images/sub/topbg04.jpg) no-repeat center center;}
.top_bg.bg5{ background:url(../images/sub/topbg05.jpg) no-repeat center center;}
.top_bg.bg6{ background:url(../images/sub/topbg06.jpg) no-repeat center center;}
.top_bg.bg7{ background:url(../images/sub/topbg07.jpg) no-repeat center center;}
.top_bg.bg8{ background:url(../images/sub/topbg08.jpg) no-repeat center center;}
.top_bg.bg9{ background:url(../images/sub/topbg09.jpg) no-repeat center center;}
.top_bg.bg10{ background:url(../images/sub/topbg10.jpg) no-repeat center center;}
.top_bg.bg11{ background:url(../images/sub/topbg11.jpg) no-repeat center center;}
.top_bg.bg12{ background:url(../images/sub/topbg12.jpg) no-repeat center center; margin-bottom:-2em}


.top_bg .t1{ font-size:1.750em; text-align:center; color:#fff; font-family:'notokrB';}
.top_bg .t2{ font-size:.875em; text-align:center; color:#fff; opacity:.8; padding-top:1em;}

/*사업분야*/
.pro_wrap .tb_wrap{}
.pro_wrap .tb_wrap em{ font-size:.875em; text-align:right; display:block; padding-top:1em;}
.pro_wrap .tb_wrap .table_st tbody td{ text-align:center; font-family:'notokrR';}
.pro_wrap .tb_wrap .table_st{ border-top:3px solid #233f87; border-bottom:2px solid #233f87;}
.pro_wrap .tb_wrap .table_st th{ color:#02164c !important;}
.pro_wrap .tb_wrap .point{ position:relative;}
.pro_wrap .tb_wrap .point:after{ content:"*"; position:absolute; color:#F30; margin-left:.2em;}
.pro_wrap .tb_wrap .point.st{}
.pro_wrap .tb_wrap .point.st:after{ content:""; position:inherit; color:#F30; margin-right:1em;}
.pro_wrap .btn_wrap{ border:1px solid #0948a7; display:inline-block; width:180px; height:40px; line-height:40px; text-align:center; margin-left:1em;}
.pro_wrap .btn_wrap .btn{ color:#0948a7;}
.pro_wrap .btn_wrap .xi{ color:#0948a7;}
.pro_wrap .btn_wrap:hover{ background:#0948a7; transition:.3s;}
.pro_wrap .btn_wrap:hover .btn, .pro_wrap .btn_wrap:hover .xi{ color:#fff;}
.pro_wrap .pro_list1{ border:1px solid #ddd; padding:2em 2.5em;}
.pro_wrap .pro_list1 > li{ padding:.5em 0 .5em 0;/* width:50%;*/ float:none;}
.pro_wrap .pro_list1 > li .in{ position:relative;}
/*.pro_wrap .pro_list1 > li .in:before{ content:""; width:3px; height:3px; position:absolute; top:15px; left:0; border:3px solid #27bbd4;}*/
.pro_wrap .pro_list2{ border:1px solid #ddd; padding:2em 2.5em;}
.pro_wrap .pro_list2 > li{ position:relative; padding-left:1em; line-height:1.6;}
.pro_wrap .pro_list2 > li:before{ content:""; width:3px; height:3px; background:#666; position:absolute; top:11px; left:0;}
.pro_wrap .pro_list3{ border-top:3px solid #233f87; border-bototm:1px solid #233f87;}
.pro_wrap .pro_list3 .list01{ overflow:hidden; border-bottom:1px solid #ccc;}
.pro_wrap .pro_list3 .list01 > dt{ float:left; width:18%; font-size:1.250em; font-family:'notokrM'; padding:1.5em 2em;}
.pro_wrap .pro_list3 .list01 > dd{ float:left; padding:1.5em; width:70%;}
.pro_wrap .pro_list3 .list01 > dd > ul > li{ line-height:1.8; position:relative; padding-left:1em; font-family:'notokrR';}
.pro_wrap .pro_list3 .list01 > dd > ul > li:before{ content:""; position:absolute; width:4px; height:4px; top:9px; left:0; background:#3c68a9; display:inline-block;}
.pro_wrap .pro_list4 .step{ overflow:hidden; margin-left:-10px;}
.pro_wrap .pro_list4 .step > li{ width:20%; float:left;}
.pro_wrap .pro_list4 .step > li .in{ border:1px solid #003f87; margin-left:10px;}
.pro_wrap .pro_list4 .step > li .tt{ color:#fff; background:#003f87; font-family:'notokrR'; font-size:.875em; text-transform:uppercase; text-align:center; display:inline-block; width:100%; padding:10px 0 5px 0;}
.pro_wrap .pro_list4 .step > li .ti{ background:#003f87; color:#fff; font-family:'notokrM'; font-size:1em; text-align:center; height:48px; padding-top:.5em}
.pro_wrap .pro_list4 .step > li .tx{ font-family:'notokrR'; padding:1em 1.5em; text-align:center}
.pro_wrap .pro_list4 .step > li em{ display:block; font-size:.750em; line-height:1.5;}

.pro_wrap .page_tt{ font-size:1.750em; text-align:center; font-family:'notokrM';}
.pro_wrap .page_tt2{ font-size:1.375em; font-family:'notokrM';}
.pro_wrap .page_t1{ font-size:1.125em; font-family:'notokrR'; width:60%; margin:1em auto; text-align:center;}
.pro_wrap .gall_wrap{ background:#f5f5f5; padding:3em 0 10em 0; margin-top:3em;}
.pro_wrap .gall_wrap .board_photo_wrap .list{}


.pro_wrap .pro3_list{ margin-top:1em}
.pro_wrap .pro3_list > li{ padding-left:1em; position:relative}
.pro_wrap .pro3_list > li:before{ position:absolute; content:"-"; top:0; left:0}


.pro_wrap .gall_wrap .resize{ padding-bottom:73.66% !important}

/*시설*/
.project2_wrap{ background:#f5f5f5; padding:3em 0 10em 0;}
.project2_wrap .con{ overflow:hidden; margin-bottom:3em; /*border:1px solid #ddd; */padding:2em 3em; background:#fff;}
.project2_wrap .con .img_wrap{ width:50%; height:auto; float:left;}
.project2_wrap .con .img_wrap .bg1{ background:url(../images/sub/project2_img01.jpg) no-repeat center; width:80%; height:420px; background-size:cover;}
.project2_wrap .con .img_wrap .bg2{ background:url(../images/sub/project2_img02.jpg) no-repeat; width:80%; height:420px; background-size:cover;}
.project2_wrap .con .img_wrap .bg3{ background:url(../images/sub/project2_img03.jpg) no-repeat; width:80%; height:420px; background-size:cover;}
.project2_wrap .con .img_wrap .bg4{ background:url(../images/sub/project2_img04.jpg) no-repeat; width:80%; height:320px; background-size:cover;}
.project2_wrap .con .img_wrap .bg5{ background:url(../images/sub/project2_img05.jpg) no-repeat; width:80%; height:320px; background-size:cover;}
.project2_wrap .con .img_wrap .bg6{ background:url(../images/sub/project2_img06.jpg) no-repeat; width:80%; height:320px; background-size:cover;}
.project2_wrap .con .img_wrap .bg7{ background:url(../images/sub/project2_img07.jpg) no-repeat; width:80%; height:320px; background-size:cover;}
.project2_wrap .con .img_wrap .bg8{ background:url(../images/sub/project2_img08.jpg) no-repeat; width:80%; height:320px; background-size:cover;}
.project2_wrap .con .text_wrap{ width:50%; float:left;}
.project2_wrap .con .text_wrap .t1{ font-size:1.570em; margin-bottom:.5em; margin-top:1.5em; position:relative;}
.project2_wrap .con .text_wrap .en{ font-family:'notokrR'; color:#666; border-bottom:1px dotted #ddd; padding-bottom:1.5em;}
.project2_wrap .con .text_wrap .t2{ font-family:'notokrR'; line-height:1.6; margin-top:2em;}



/*오시는길*/
.location_wrap .root_daum_roughmap {width:100% !important; padding:0 !important; border:none !important}
.location_wrap .root_daum_roughmap .wrap_controllers {display:none !important;}

.location_wrap .map_info1 { overflow:hidden; margin-bottom:20px; box-shadow:2px 3px 8px -1px #a4a4a4; padding:1.5em; margin-top:2em; font-weight:300}
.location_wrap .map_info1 .t1 { float:left;}
.location_wrap .map_info1 .t1 span { color:#666; display:inline-block; margin-right:20px; line-height:38px; }
.location_wrap .map_info1 .t1 span:last-child { margin-right:0;}
.location_wrap .map_info1 .t1 .xi { font-size:1.438em; vertical-align:sub; color:#888; margin-right:5px; }
.location_wrap .map_info1 .map_btn { float:right; display:inline-block; padding:11px 45px 10px 45px; color:#fff; background:#003f87; border:1px solid #ddd; }
.location_wrap .map_info1 .map_btn .tx{ font-size:.875em; color:#fff; vertical-align:middle}

.location_wrap .map_info2 { margin-top:30px; font-weight:300}
.location_wrap .map_info2 > li { overflow:hidden; padding:2em 1em; border-bottom:1px solid #ddd}
.location_wrap .map_info2 > li h3 { float:left; color:#222222; font-size:1.375em; }
.location_wrap .map_info2 > li h3 .xi { font-size:1.625rem; vertical-align:text-top; }
.location_wrap .map_info2 > li .info { margin:0 0 0 240px;}
.location_wrap .map_info2 > li .info strong { display:block;}
.location_wrap .map_info2 > li .info p { color:#333; line-height:26px; position:relative; padding-left:30px}
.location_wrap .map_info2 > li .info ul li:first-child strong { padding-top:0}
.location_wrap .map_info2 > li.bus{}
.location_wrap .map_info2 > li.bus .info span { display:block; margin:2px 0 6px; color:#333; } `
.location_wrap .map_info2 > li.bus .info p { padding-left:32px; position:relative; line-height:30px; color:#666; }
.location_wrap .map_info2 > li.bus .info .g:before { content:"G"; width:23px; height:23px; border-radius:23px; background:#4a972e; color:#fff; text-align:center; line-height:22px; position:absolute; left:0; top:50%; margin-top:-11px; font-size:0.813em; }
.location_wrap .map_info2 > li.bus .info .r:before { content:"R"; width:23px; height:23px; border-radius:23px; background:#df262e; color:#fff; text-align:center; line-height:22px; position:absolute; left:0; top:50%; margin-top:-11px; font-size:0.813em; }
.location_wrap .map_info2 > li.bus .info .b:before { content:"B"; width:23px; height:23px; border-radius:23px; background:#395cb3; color:#fff; text-align:center; line-height:22px; position:absolute; left:0; top:50%; margin-top:-11px; font-size:0.813em; }

.location_wrap .map_info2 > li.subway {}
.location_wrap .map_info2 > li.subway .info { margin-top:-1px;}
.location_wrap .map_info2 > li.subway .info span { display:block; margin:2px 0 6px;}
.location_wrap .map_info2 > li.subway .info p { display:inline-block; margin-right:34px;}
.location_wrap .map_info2 > li.subway .info em { display:inline-block; font-weight:500;}
.location_wrap .map_info2 > li.subway .info .r em { color:#fff;}

.location_wrap .map_info2 > li.car .info .r em { color:#f62c11;}

.location_wrap .bs1{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; padding:0 15px; font-size:0.875em; font-weight:600; color:#fff; line-height:25px; border-radius:30px; background:#249f0b; margin:0 5px 5px 0}
.location_wrap .bs1.sub_col2{ background:#3cb44a}
.location_wrap .bs1.sub_col3{ background:#74c7c7; margin-left:5px}

.location_wrap .btn_in{ float:right;}
.location_wrap .btn_in .more{display:block; background:#003f87; border:1px solid #003f87; color:#fff; height:30px; padding:5px; transition:.3s; width:140px; margin-left:0.5em; border-radius:4px;}
.location_wrap .btn_in .more .tt{ vertical-align:middle; font-size:.875em; padding-left:.5em;}
.location_wrap .btn_in .more.va_wrap{ height:30px !important}
.location_wrap .btn_in .xi{ vertical-align:middle; margin-left:5px;}



/*인사말*/
.greetings_wrap{}
.greetings_wrap .left{ width:60%;}
.greetings_wrap .right{ width:40%; text-align:right;}
.greetings_wrap .t1{ font-size:1.570em; font-family:'notokrR'; line-height:1.4; letter-spacing:-1px; margin-bottom:1em;}
.greetings_wrap .t1:after{ display:block; content:""; background:linear-gradient(to right, #247bd2, #fff); width:70%; height:2px; margin:20px 0;}
.greetings_wrap .t2{ line-height:1.6; font-family:'notokrR'; margin-bottom:1em; font-size:1.063em;}
.greetings_wrap .c1{ color:#003f87; font-family:'notokrM'; vertical-align:baseline;}
.greetings_wrap .ceo_img > img{ max-width:100%; padding-top:1em;}
.greetings_wrap .ceo_name{ font-family:'notokrR'; text-align:right;}
.greetings_wrap .ceo_name .name{ font-size:1.125em; font-family:'notokrM'; vertical-align:baseline;}



/*시험의뢰절차*/
.step_process{ margin-left:-10px; *zoom:1}
.step_process:after{ content:""; display:block; clear:both;}
.step_process > li{ float:left; width:16.666%; text-align:center;}
.step_process > li .inner{ position:relative; margin-left:10px; padding:1em 0; background:#fff; border:1px solid #ccc; min-height:120px; border-top:3px solid #233f87}
.step_process.reverse{ margin-left:auto; margin-left:-150px; margin-top:1em; margin-right:140px}
.step_process.reverse > li{ float:right;}
.step_process.reverse > li .inner{ margin-left:auto; margin-right:10px;}

.step_process .icon{ height:60px;}
.step_process .icon img{ max-height:100%;}
.step_process .check{ position:absolute; z-index:3; left:35%; background:#1f57aa; border-radius:100%; padding:.8em 0; color:#fff; font-family:'Ms', 'NotoS', sans-serif; font-weight:600; width:45px; display:none}
.step_process.reverse .check{ background:#2685c7}
.step_process .check .xi{ width:20px; line-height:20px; color:#e95d00; background:#fff; border:2px solid #e95d00; border-radius:100%;}
.step_process .check .xi:before{ content:"\e929"; display:block;}
.step_process .num{ padding:1em 0 1em 0; font-size:.875em; color:#1f57aa; letter-spacing:0; text-transform:uppercase; font-family:'Ms'; font-weight:bold}
.step_process .tit{ padding:0 .5em; font-weight:500; color:#333; font-size:1em}
.step_process > li.on .inner{ background:#ee8322; border-color:#005295;}
.step_process > li.on .check .xi{ border-color:#1dbcb7;}
.step_process > li.on .tit{ color:#fff;}
.step_process .line{ position:absolute; z-index:2; top:22%; left:50%; width:5px; height:5px; background:#9fafbf; display:none}
.step_process .line1{ width:111%;}
.step_process .line2{ height:46%; z-index:1; top:131px;}
.step_process .line3{ left:auto; right:50%; width:100%;}

.step_process2{ margin-left:-10px; *zoom:1}
.step_process2:after{ content:""; display:block; clear:both;}
.step_process2 > li{ float:left; width:20%; text-align:center;}
.step_process2 > li .inner{ position:relative; margin-left:10px; padding:1em 0; background:#fff; border:1px solid #ccc; min-height:120px; border-top:3px solid #233f87}
.step_process2.reverse{ margin-left:auto; margin-left:-150px; margin-top:1em; margin-right:140px}
.step_process2.reverse > li{ float:right;}
.step_process2.reverse > li .inner{ margin-left:auto; margin-right:10px;}

.step_process2 .icon{ height:60px}
.step_process2 .icon img{ max-height:100%;}
.step_process2 .check{ position:absolute; z-index:3; left:38%; background:#1f57aa; border-radius:100%; padding:.8em 0; color:#fff; font-family:'Ms', 'NotoS', sans-serif; font-weight:600; width:45px; display:none}
.step_process2.reverse .check{ background:#2685c7}
.step_process2 .check .xi{ width:20px; line-height:20px; color:#e95d00; background:#fff; border:2px solid #e95d00; border-radius:100%;}
.step_process2 .check .xi:before{ content:"\e929"; display:block;}
.step_process2 .num{ padding:1em 0 1em 0; font-size:.875em; color:#1f57aa; letter-spacing:0; text-transform:uppercase; font-family:'Ms'; font-weight:bold}
.step_process2 .tit{ padding:0 .5em; font-weight:500; color:#333; font-size:1em}
.step_process2 > li.on .inner{ background:#ee8322; border-color:#005295;}
.step_process2 > li.on .check .xi{ border-color:#1dbcb7;}
.step_process2 > li.on .tit{ color:#fff;}
.step_process2 .line{ position:absolute; z-index:2; top:22%; left:50%; width:5px; height:5px; background:#9fafbf; display:none}
.step_process2 .line1{ width:111%;}
.step_process2 .line2{ height:46%; z-index:1; top:131px;}
.step_process2 .line3{ left:auto; right:50%; width:100%;}






/*개인정보처리방침*/
.privacy_area{ border-top:2px solid #333; border-bottom:1px solid #666; position:relative; /*height:800px; overflow-y:scroll;*/ font-family:'notokrR'; margin-top:4em}
.privacy_area .privacy_tt{ position:absolute; left:0; top:0; width:178px; height:100%; border-left:1px solid #ccc; border-right:1px solid #ccc; background:url(../images/member/agree_bg.png) no-repeat left top; text-align:right;}
.privacy_area .privacy_tt strong{ display:inline-block; *display:inline; zoom:1; font-size:1.308em; font-weight:600; color:#fff; padding:20px 15px 0;}
.privacy_area .privacy_box{  background-color:#f9f9f9; padding:30px;}
.privacy_area .privacy_box .txt{ font-weight:600; color:#444; line-height:20px; margin-bottom:15px;}
.privacy_area .privacy_box .privacy_in{ height:140px; padding:30px; border:1px solid #ccc; background:#fff; line-height:18px; overflow-y:scroll;}
.privacy_area .privacy_box .privacy_in p{ line-height:1.4; margin-bottom:10px; color:#555; font-size:0.875em; font-family:notokrR;}
.privacy_area .privacy_box .privacy_in.h_st{ overflow-y:hidden; height:auto;}
.privacy_area .privacy_box .privacy_inp{ margin-top:25px; text-align:right;}
.privacy_area .privacy_box .privacy_inp input,
.privacy_area .privacy_box .privacy_inp label{ vertical-align:middle; cursor:pointer;}
.privacy_area .privacy_box .privacy_inp input{ margin-left:15px;}
.privacy_area .privacy_box .privacy_inp label{ margin-left:8px;}
.privacy_area .privacy_box .privacy_inp label:hover{ color:#3992ed;}

.privacy_area.st .privacy_box{ margin-left:0; padding:30px;}
.privacy_area.st .privacy_box .privacy_in{ padding:30px; font-size:0.875em; line-height:1.6}

.privacy_area .privacy_box .privacy_in .privacy_tit{border:1px solid #ccc; padding:20px; background:#f1f1f1; text-align:center;}
.privacy_area.st .privacy_box .privacy_in p{color:#666;  line-height:21px; padding-left:5px;}
.privacy_area.st .privacy_box .privacy_in p >strong{font-size:1.154em; color:#333; margin-left:-5px;}

/*===============================================================sub===============================================================*/

/*서브페이지 탭*/
.page_tab{ margin-bottom:2.5em; text-align:center;}
.page_tab .tab{ display:inline-block; margin:0 auto}
.page_tab .tab > li > a{ position:relative; z-index:1; display:block; min-width:12em; padding:.8em 1em; background:#f0f0f0; border:1px solid #ccc; color:#777; transition:.2s; box-sizing:border-box}
.page_tab .tab > li > a .tt{ font-size:1em}
.page_tab .tab > li:hover > a,
.page_tab .tab > li.on > a{ z-index:2; background:#cf3128; color:#fff; border:1px solid #ccc;}


/*company(sub1)*/

/*company(sub1)_overview*/

.txt_red{color:#ce1a1f; vertical-align:bottom;}
.txt_bold{font-weight:bold; vertical-align:bottom;}
.txt_ls{letter-spacing:1px; vertical-align:bottom;}

.overview .sec1 .sec1_bg{width:100%; padding:80px 0; background:url('../images/sub/sub1/sub1_1_sec1_bg.jpg') no-repeat center/cover fixed;}
.overview .sec1 .sec_tit{text-align:center; font-size:1.75em; color:#f6f6f6; position:relative;}
.overview .sec1 .sec_tit:before{content:''; display:block; width:30px; height:3px; background:#f6f6f6; position:absolute; top:70px; left:50%; transform:translateX(-50%);}
.overview .sec1 .overview_list{margin-top:120px;}
.overview .sec1 .overview_list:after{content:''; clear:both; display:block;}
.overview .sec1 .overview_list li{float:left; background:rgba(33,33,33,0.7); color:#ccc; transition:0.3s; height:200px; padding:20px; box-sizing:border-box; border:1px solid #333; font-size:0.938em;}
.overview .sec1 .overview_list li:nth-of-type(-n+5){width:20%;}
.overview .sec1 .overview_list li:nth-of-type(-n+5) img{margin-left:50%; transform:translateX(-50%);}
.overview .sec1 .overview_list li:nth-of-type(-n+5) p{text-align:center;}
.overview .sec1 .overview_list li:nth-of-type(n+6){width:50%; height:260px; padding:40px;}
.overview .sec1 .overview_list li:nth-of-type(n+6) p{font-size:0.938em; line-height:1.4;}
.overview .sec1 .overview_list li:hover{background:#fff; color:#111;}
.overview .sec1 .overview_list li p:first-of-type{margin:20px 0 10px;}

.overview .sec2{margin-top:80px;}

/*company(sub1)_greetings*/

.greetings .sec1 .box1:after{content:''; clear:both; display:block;}
.greetings .sec1 .box1 > div{float:left;}

.greetings .sec1 .box1 .img_box1{width:41%; box-shadow:2px 2px 10px 2px #333;}

.greetings .sec1 .box1 .txt_box1{width:54%; margin-left:5%;}
.greetings .sec1 .box1 .txt_box1 .grt_tit{font-size:1.625em; position:relative;}
.greetings .sec1 .box1 .txt_box1 .grt_tit:before{content:''; display:block; width:50px; height:1px; background:#ce1a1f; position:absolute; top:90px;}
.greetings .sec1 .box1 .txt_box1 .grt_ctt{margin-top:56px; font-size:0.938em; color:#666;}
.greetings .sec1 .box1 .txt_box1 .grt_ceo{text-align:right; color:#444; font-size:1.125em; margin-top:40px; line-height:1.4; font-family:notokrR;}

/*company(sub1)_vision*/

.vision .sec1 .sec_tit{text-align:center; font-size:1.75em; color:#111; position:relative;}
.vision .sec1 .sec_tit:before{content:''; display:block; width:30px; height:3px; background:#CE1A1F; position:absolute; top:70px; left:50%; transform:translateX(-50%);}
.vision .sec1 .vision_dg{width:100%;}
.vision .sec1 .vision_dg .dg_tit{text-align:center; display:flex; align-items:center; justify-content:center; font-size:1.375em; width:200px; height:130px; background:url('../images/sub/sub1/sub1_3_img1.png') no-repeat center/cover; margin:60px auto 0;}
.vision .sec1 .vision_dg .dg_mid{margin:60px auto 0; width:60%;}
.vision .sec1 .vision_dg .dg_mid:after{content:''; clear:both; display:block;}
.vision .sec1 .vision_dg .dg_mid li{float:left; width:27.7%; height:200px; border:10px solid rgba(206,26,31,1); border-radius:100%; text-align:center; padding:40px; box-sizing:border-box; margin-right:8.3%; font-size:1.25em; box-shadow:2px 2px 10px 2px #666;}
.vision .sec1 .vision_dg .dg_mid li:last-of-type{margin-right:0;}
.vision .sec1 .vision_dg .dg_mid li img{display:block; margin:0 auto; margin-bottom:10px;}
.vision .sec1 .vision_dg .dg_bot{margin:80px auto 0; width:60%;}
.vision .sec1 .vision_dg .dg_bpt:after{content:''; clear:both; display:block;}
.vision .sec1 .vision_dg .dg_bot li{float:left; width:27.7%; height:80px; border:2px solid #ce1a1f; border-radius:10px; text-align:center; display:flex; align-items:center; justify-content:center; box-sizing:border-box; margin-right:8.3%; position:relative;}
.vision .sec1 .vision_dg .dg_bot li:last-of-type{margin-right:0;}
.vision .sec1 .vision_dg .dg_bot li:before{content:''; display:block; width:2px; height:60px; background:#f2bd1b; position:absolute; top:-62px;}

.location .sec1{width:100%;}
.location .sec2{width:100%;}
.location .sec_tit{font-size:2em; text-align:center; position:relative; margin-bottom:60px;}
.location .sec_tit:before{content:''; display:block; width:30px; height:3px; background:#CE1A1F; position:absolute; top:70px; left:50%; transform:translateX(-50%);}
.location .box1 > div{margin-top:80px;}
.location .sec_loc{text-align:center; font-size:1.5em; margin-bottom:15px;}
.location .loc_info{padding:15px 0; border-top:2px solid #333; border-bottom:1px solid #999; text-align:center;}
.location .loc_info ul li{padding:0 15px; display:inline-block;}
.location .loc_info ul li span{display:inline-block; width:40px; height:40px; background:#ce1a1f; border-radius:100%; text-align:center; line-height:40px; color:#fff; margin-right:10px;}

/*company(sub1)_certification*/

.certification .board_photo_wrap .img_resize{height:368px;}

/*online(sub3)*/

.online .terms_area{padding:20px; background:#f7f7f7; border-top:2px solid #333; border-bottom:1px solid #999; font-size:0.875em; color:#555; font-weight:400; line-height:1.6;}
.online .terms_area .terms_box{padding:30px; background:#fff; border:1px solid #eee; overflow-y: scroll; height:130px;}
.online .terms_area .terms_box strong{color:#111; font-family:'notokrB'; font-size:1em; vertical-align:bottom;}
.online .cont_check{ text-align: right; padding-top:8px; margin-bottom:22px;}
.online .label_st{ display:inline-block; color:#999;}
.online .label_st > *{cursor:pointer; vertical-align:middle;}
.online .label_st span{padding-left:3px;}
.online .board_st.write{border-top:1px solid #666;}
.online .board_btn_wrap{margin-top:20px; font-size:.938rem;}
.online .board_st th{color:#111;}
.online .board_st th, .board_st td{padding:15px 10px; border-bottom:1px solid #ddd;}
.online .select.input_st{padding:0 80px 0 5px; line-height:35px; height:35px;}
.online .inp_w2{width:175px;}
.online .iw100{width:100%;}
.online .tw1{width:100%; height:200px !important;}
.online input[type=file].input_st{background:none; border:none; padding:0; font-size:.938em; line-height:28px; height:28px;}
.online .input_st.s1{line-height:50px; height:50px; padding:0 30px;}
.online .input_st.c1{background:#cf3128 !important; border-color:#cf3128; color:#fff; height:50px;}
.online .input_st.c2{background:#999; border-color:#999; color:#fff;}



/*제품리스트*/
.prod_wrap{ margin:-2em 0 0 -2em}
.prod_wrap > li{ width:33.33%}
.prod_wrap > li .in{ margin:2em 0 0 2em; border:1px solid #ddd; /*padding:1em 1em 2em 1em; */text-align:center; cursor:pointer; padding-bottom:2em}
/*.prod_wrap > li .in .img img{transform:scale(.9,.9); transition:.3s}*/
.prod_wrap > li .in .tit{ font-size:1.250em; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; padding:1em 1em .5em 1em; border-top:1px solid #ddd;}
.prod_wrap > li .in .more{ position:relative; width:1.5em; height:1.5em; line-height:1.7em; margin:.5em 0}
.prod_wrap > li .in .more:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; background:#f5f5f5; transform:rotate(45deg); transition:.3s}
.prod_wrap > li .in .more:after{ content:"\e9c5"; position:relative}
.prod_wrap > li .in .info > li{ margin-top:1em}
.prod_wrap > li .in .info .t1{ float:left; text-align:right; width:35%; color:#000; font-size:.938em}
.prod_wrap > li .in .info .t2{ float:right; text-align:left; width:55%; color:#777; font-size:.938em; text-overflow:ellipsis; withe-space:nowrap; overflow:hidden; white-space:normal; height:20px;display:inline-block; word-wrap:break-word;}
.prod_wrap > li .in:hover .img img{transform:scale(1,1)}
.prod_wrap > li .in:hover .more{ color:#fff}
.prod_wrap > li .in:hover .more:before{ transform:rotate(135deg); background:#ce1a1f; border-color:transparent;}
.prod_wrap > li .in .img .prodLogo{ position:absolute; top:0; right:0; z-index:1111111;}



/*제품뷰*/


/*제품 뷰*/
.prod_view_wrap{}
.prod_view_wrap > ul > li{ width:50%; position:relative;}
.prod_view_wrap > ul > li:nth-child(1){}
.prod_view_wrap > ul > li:nth-child(2){}
.prod_view_wrap > ul > li .inner_box{position:absolute; top:20px; width:90%; color:#666; border-top:2px solid #666; padding-top:1em}
.prod_view_wrap > ul > li .inner_box .t1{ font-size:1.5em; padding-left:.5em}
.prod_view_wrap > ul > li .inner_box dl{ min-height:250px; padding-left:1em}
.prod_view_wrap > ul > li .inner_box dl dt{ padding:10px 0; font-weight:500; font-size:1.125em}
.prod_view_wrap > ul > li .inner_box dl dd{ line-height:1.6; color:#666; padding-left:1em; position:relative}
.prod_view_wrap > ul > li .inner_box dl dd:before{ content:"\e91b"; position:absolute; top:0; left:0; color:#333; font-family:xeicon;}
.prod_view_wrap > ul > li .prod_line{ width:100%; height:1px; background:#ddd; margin:20px 0;}

.prod_view_wrap .img_wrap .big{ width:80%;/*padding-right:15%;;*/position:relative;/* left: 50%; */}
/*.prod_view_wrap .img_wrap .big .in{ padding:2em;}*/
.prod_view_wrap .img_wrap .big .resize2 .re{ background:#fff; border:5px solid #ddd; box-sizing:border-box}


.cont_view_wrap{ margin-top:2.5em; background:#f5f5f5; padding:3em 0}
.cont_view_wrap .view_tit{ font-size:1.625em; margin-bottom:10px;}
.cont_view_wrap .view_tit_wrap{ border-top:2px solid #666; font-size:1em; border-bottom:1px solid #666; padding-left:1em}
.cont_view_wrap .view_tit_wrap p{ font-size:1.25em; padding:1em 0}
.cont_view_wrap .view_in_wrap{ background:#fff; padding:3em 0 3em 0; margin-bottom:3em; display:inline-block; width:100%}
.cont_view_wrap .view_in_wrap > table{ margin:0 auto}
.cont_view_wrap .view_in_wrap > p{ padding:0 2em; line-height:1.5;}
.cont_view_wrap .view_in_wrap .tx{ line-height:1.6; font-size:1em; font-weight:400; color:#656565; margin-bottom:1em}
.cont_view_wrap .view_in_wrap img{ margin:0 auto; display:block}

.prod_view_top .tit_wrap{ background:#f1f1f1; border-top:2px solid #666; color:#111; padding:.8em 1.5em; font-size:1.625em; margin-bottom:1em; position:relative; overflow:hidden;}
.prod_view_top .tit_wrap:before{ content:""; position:absolute; left:0; top:50%; width:1em; height:1px; background:#666}

.cont_info{ float:right; margin-top:2em}
.cont_info span{ width:15px; height:15px; display:inline-block; background:#f3cd62; margin-right:.5em}
.cont_info span.st{ background:#f9aa00 !important}
.cont_info ul li{ margin-right:1em}



.prod_view_wrap .img_wrap .small{ width:25%;}
.prod_view_wrap .img_wrap .small > li .in{ display:block; border:2px solid #222; margin-top:0.5em; padding:1em; filter:alpha(opacity=50);opacity:0.5; transition:.3s}
.prod_view_wrap .img_wrap .small > li:first-child .in{ margin-top:0}
.prod_view_wrap .img_wrap .small > li.on .in{ filter:alpha(opacity=100);opacity:1}
.prod_view_wrap .img_wrap .small.st1{ margin-top:1em; width:81.333%;}
.prod_view_wrap .img_wrap .small.st1 > li{ width:33.333%}
.prod_view_wrap .img_wrap .small.st1 > li .in{ margin:.5em .5em 0 0; padding:0.3em;}


.prod_view_wrap .btn_in{ padding-left:1em; padding-bottom:1em;}
.prod_view_wrap .btn_in.st{ width:20%;margin: 1em 0 0 0;padding-left:0; padding-bottom:2em}
.prod_view_wrap .btn_in .catalog{ display:block; background:#333; color:#fff; height:3em; transition:.3s; width:45%;}
.prod_view_wrap .btn_in .catalog .tt{ font-size:.875em; padding-left:.5em}
.prod_view_wrap .btn_in .catalog:hover{ background:#333; color:#fff}

.prod_view_wrap .btn_in .more{ display:block; background:#cf3128; color:#fff; height:3em; transition:.3s; width:45%; margin-left:0.5em}
.prod_view_wrap .btn_in .more .tt{ font-size:.875em; padding-left:.5em}
.prod_view_wrap .btn_in .more:hover{ background:#cf3128; color:#fff}

.view_in_wrap > div{ padding-left:2em; line-height:1.6}
.view_in_wrap span{ vertical-align:baseline}

/*에디터리스트*/
.edit_list{ padding-left:2em}
.edit_list li{ line-height:1.7; position:relative; padding-left:1em}
.edit_list li:before{ width:5px; height:5px; top:10px; left:0; position:absolute; content:""; background:#aaa}
 






/*

@media screen and (max-width:1400px){
.box2{ width:98%}
.main_con.main_sec2 .tab_wrap .tab_ul > li > a{ padding:0}
.main_con.main_sec2 .tab_wrap .tab_ul > li{ width:24%}
}

@media screen and (max-width:360px){
.main_con.main_sec2 .tab_wrap .tab_ul > li > a{ padding:0}
.main_con.main_sec2 .tab_wrap .tab_ul > li{ width:60%}
}
*/