@charset "utf-8";
@import url(reset.css);
@import url(font.css);
@import url(motion.css);
@import url(animate.css);
@import url(table.css);
@import url(contents.css);

body{width: 100%;height: 100%;}

#wrap{position: relative;width: 100%;height: 100%;}

#wrap #header .container.pc{position: relative;  margin:0 auto; }
#wrap #header .container.mobile{display: none;}
#wrap #header .container:after{display: block;content: '';clear: both;}

#wrap #header .nav_bg.mobile{display: none;position: fixed;z-index: 9998;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/s_img/m_nav_bg.png) repeat;}
#wrap #header .nav.mobile{display: none;position: fixed;z-index: 9999;top: 0;right: 0;width: 300px;height: 100%;background: #fff;overflow-y: scroll;}
#wrap #header .nav.mobile{}
#wrap #header .nav.mobile .top_box{position: relative;height: 65px;}
#wrap #header .nav.mobile .top_box ul.language{position:absolute; left: 15px;top:25px;width: 220px;border-radius: 0;border: none; }
#wrap #header .nav.mobile .top_box ul.language:after{display: block;content: '';clear: both;}
#wrap #header .nav.mobile .top_box ul.language li{float: left;width: 50px;margin-left: 0; display:inline;}
#wrap #header .nav.mobile .top_box ul.language li a{display: inline;width: 50px;font-size: 16px;color: #747474;font-weight: normal;padding: 0;}
#wrap #header .nav.mobile .top_box ul.language li.on a{color: #1e83d0;font-weight: 500;}
#wrap #header .nav.mobile .top_box .close{position: absolute;top: 0;right: 15px;}
#wrap #header .nav.mobile .top_box .close img{width: 22px;margin-top: 22px;}

#wrap #header .nav.mobile .bot_box{position: relative;height: 65px;}
#wrap #header .nav.mobile .bot_box ul.q_link{position:absolute; left:1%;top:25px;width:99%;border-radius: 0;border: none; }
#wrap #header .nav.mobile .bot_box ul.q_link:after{display: block;content: '';clear: both;}
#wrap #header .nav.mobile .bot_box ul.q_link li{float: left;width:32%;margin:0 1% 0 0; display:inline; background:#1e83d0;text-align:center; }
#wrap #header .nav.mobile .bot_box ul.q_link li a{display: inline;height:36px; line-height:36px; text-align:center; font-size: 15px; letter-spacing:-0.05em; color: #fff;font-weight: normal;padding: 0;}


#wrap #header .nav.mobile .gnb_box{}
#wrap #header .nav.mobile .gnb_box ul{}
#wrap #header .nav.mobile .gnb_box ul li{position: relative;border-top: 1px solid #ccc;}
#wrap #header .nav.mobile .gnb_box ul li.last{border-bottom: 1px solid #b7b7b7;}
#wrap #header .nav.mobile .gnb_box ul li span.icon{position: absolute;top: 0;right: 10px;display: block;width: 30px;height: 60px;background: url(../img/s_img/m_gnb_box_li_bullet.png) no-repeat center center;background-size:25px;}
#wrap #header .nav.mobile .gnb_box ul li.on span.icon{background: url(../img/s_img/m_gnb_box_li_bullet_on.png) no-repeat center center; background-size:25px;}
#wrap #header .nav.mobile .gnb_box ul li a{display: block;height: 60px;line-height: 60px;font-size: 18px;color: #181818;font-weight: normal;padding: 0 0 0 15px;}
#wrap #header .nav.mobile .gnb_box ul li ul{display: none;border-top: 1px solid #ccc;background: #efefef;padding: 30px 14px 15px 14px;}
#wrap #header .nav.mobile .gnb_box ul li ul li{border: none;margin-bottom: 15px;}
#wrap #header .nav.mobile .gnb_box ul li ul li a{height: auto;line-height:1.2;font-size:15px;font-weight: 300;padding: 0; letter-spacing:-0.05em;background: none;}

#wrap #header .nav.mobile .foot_box{padding: 30px 15px;}
#wrap #header .nav.mobile .foot_box p{font-size: 15px;color: #303030;font-weight: normal;line-height: 1.5;}
#wrap #header .nav.mobile .foot_box p.address{margin-bottom: 8px;}
#wrap #header .nav.mobile .foot_box p strong{font-weight: normal;}

#wrap #header.on{background: #fff; border-bottom: 1px solid #e1e1e1;}
#wrap #header.on .gnb .depth1{color: #272727;}
#wrap #header.on .navi-bg{top: 99px;}

#wrap #header.on .language{border: 1px solid #898989;}
#wrap #header.on .language a{color: #141414;}
#wrap #header.on .language.en a{background: url(../img/s_img/icon_language_en_bk.png) no-repeat 17px center;}




#wrap #footer{clear:both; position:relative; width: 100%; z-index: 100; height:160px; margin-top:0px; background-color:#252525 !important; }
.h340{height:300px !important;}

#wrap #footer .container{position: relative;width: 1200px;margin: 0 auto;height:100%;background-color: #252525;}
#wrap #footer .container.mobile{display: none;}
#wrap #footer .container:after{display: block;content: '';clear: both;}

.foot_add_outer{position:relative; width:1200px; margin:0px auto 0 auto; padding:0; }
.footer_logo {float:left; margin:36px 0 0 0; padding:0px; width:20%; } 
 
 /* 주소,연락처등 */  
.foot_add {float:right; text-align:left; margin:20px 0 0 0; padding:0;width:75%; font-size:15px; font-weight:300; overflow:hidden; line-height:22px; padding-top:10px;}
.foot_add img {vertical-align:top; font-size:0px; line-height:0px; }
.foot_add address { margin:0 0 0px 0; width:100%; float:left; padding:0;font-size:15px;  line-height:24px; font-style:normal;font-weight:300;  letter-spacing:0em; color:#fff;}
.foot_add p.point{display:block; font-size:16px;  line-height:24px; font-weight:500; color:#fff; padding-bottom:10px;}
.foot_add p.point span.pc_cut{display:block;}



.foot_add .copy {margin:0px 0 0px 0; padding:0; font-weight:300; letter-spacing:0em; color:#fff !important;line-height:24px; font-weight:300; }
.foot_add .copy a{color:#fff; font-size:15px; font-weight:300; }
.foot_add .copy a:hover{color:#fff; font-weight:300; }

.foot_add em.part{background: url(../img/s_img/f_part.gif) no-repeat center 7px; padding:0 10px;} 
.mt5{margin-top:5px;}
span.f_part{background:url('../img/s_img/f_bar.gif') no-repeat 15px 6px; padding:0 15px 0 14px;}




/*TOP*/

.navBtn {position:fixed;  right:20px; bottom:20px; z-index:999999; display: flex;  justify-content: center; width:50px;  height: 50px; transition: 0.3s ease-in-out; align-items: center; transform: scale(0) rotate(-80deg); }
.navBtn > div { margin:10px 20px 40px 0px; text-align:center; flex-shrink:0; cursor: pointer;}

.goTop { font-size:14px; line-height:70px; color:#111;  width:100%; height:100%; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);  transition: 3s; display: flex; justify-content: center;
    position: relative; background-color: #111 !important ;  border-radius:0;}
.goTop:after{content:''; position:absolute; background: url('../img/s_img/up_black.png') no-repeat; width:19px;height: 27px; top:26%; left: 33%; background-size: contain;}
.goTop > img { width:48px;  margin-top:5px;}




/* WIND SELL */


#wrap #content .section#section1{clear:both; margin:0; padding:0; background:#fff;}
#wrap #content .section#section1 .container{width:100%; height:100%;  margin:0 auto; padding:100px 0; background:#f2f2f2;}
#wrap #content .section#section1 h3{ padding:35px 0 20px 0;text-align: center;font-size: 48px;color: #111;font-weight:600; letter-spacing:-0.03em; background:url(../img/s_img/title_blueline.gif) no-repeat center 0;}
#wrap #content .section#section1 p.tit{font-size:18px; font-weight:300; line-height:1.5; color:#111; text-align: center;}
#wrap #content .section#section1 p.tit span.pc_cut{display:block;}

/* 아이콘 */

#wrap #content .section#section1 .about_box { position:relative; z-index:10; width:1200px; height:510px; margin:40px auto 0 auto !important;  background:none;}
#wrap #content .section#section1 .area {position:absolute; top:0px; left:0px; position:relative; overflow:hidden; width:1200px; height:510px; margin:0 auto; }

#wrap #content .section#section1 .icon_bar ul { position:absolute; right:0; top:0; width:100%; margin:0;padding:0 5%;}
#wrap #content .section#section1 .icon_bar ul:after{display: block;content: '';clear: both;}
#wrap #content .section#section1 .icon_bar ul li {position:relative; margin:30px 0 30px 0; width:33.33%; text-align:center !important; float:left; font-size:14px; text-align:center !important; letter-spacing:-1px; }
#wrap #content .section#section1 .icon_bar ul li:after{display: block;content: '';clear: both;}

#wrap #content .section#section1 .icon_bar ul li.last{border-right:0;}
#wrap #content .section#section1 .icon_bar ul li a {display:block; padding:0px 0 0 0;  text-align:center; line-height:14px; font-weight:600; color:#333; font-size:13px;letter-spacing:-0.05em; word-break:keep-all; transition:transform 600ms ease-in-out 0s; }
#wrap #content .section#section1 .icon_bar ul li a img{text-align:center;}
#wrap #content .section#section1 .icon_bar ul li a span{font-size:13px; }
#wrap #content .section#section1 .icon_bar ul li a:hover { color:#2c79bd; text-decoration:none;}
#wrap #content .section#section1 .icon_bar ul li em{margin:0 auto; width:100%; display:block; font-size:18px; padding-bottom:10px; text-align:center;}
#wrap #content .section#section1 .icon_bar ul li a span.more_btn {display:block; width:46px; height:46px; margin:0 auto; margin-top:-27px; transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; }
#wrap #content .section#section1 .icon_bar ul li a:hover span.more_btn,#section1 .icon_bar ul li.area01 a:focus span.more_btn {background:url("../img/s_img/btn_icon_more.png") no-repeat scroll 50% bottom; transform: rotate(360deg); font-weight:bold;}
#wrap #content .section#section1 .icon_bar ul li a span.img_area {width:100%; max-width:190px;  margin:0 auto;padding-top:15px; overflow:hidden; transition:margin 0.35s ease-in-out; text-align:center;}
#wrap #content .section#section1 .icon_bar ul li a span.img_area img {width:100%; max-width:190px; margin:0 auto; transition: 0.35s ease-in-out; text-align:center;}
#wrap #content .section#section1 .icon_bar ul li a:hover span.img_area img { margin-top:0px; }
#wrap #content .section#section1 .icon_bar ul li dl{margin:40px auto;}
#wrap #content .section#section1 .icon_bar ul li dt{text-align:center; font-size:20px; font-weight:500; color:#333; line-height:1.5; }
#wrap #content .section#section1 .icon_bar ul li dd{margin:20px auto; text-align:center; font-size:16px; font-weight:300; color:#333; line-height:1.5; }
#wrap #content .section#section1 .icon_bar ul li dd span.pc_cut{display:block;}

#wrap #content .section#section1 .icon_bar ul li dd.btn{ line-height:1; padding:0;  }
#wrap #content .section#section1 .icon_bar ul li dd.btn a span.img_area_more{display:inline-block; font-size:18px; font-weight:500; height:40px; line-height:36px;color:#111; letter-spacing:-0.05em; width:155px;  padding:0px 20px; background:#107ebb; text-align:center; color:#fff;}
#wrap #content .section#section1 .icon_bar ul li dd.btn a:hover span.img_area_more{color:#fff; }


.hide{display:none;}





/*02 제품소개 */
#wrap .section#product{clear:both; position:relative;width:100%; height:auto; margin:0 auto; padding:0px 0; background:url(../img/s_img/product_bg.jpg) no-repeat center 0;}
#wrap .section#product h3{margin-top:0px; padding:35px 0 20px 0;text-align: center;font-size: 48px;color: #fff;font-weight:600; letter-spacing:-0.03em; background:url(../img/s_img/title_whiteline.gif) no-repeat center 0;}
#wrap .section#product p.tit{font-size:18px; font-weight:300; line-height:1.5; color:#fff; text-align: center;}
#wrap .section#product p.tit span.pc_cut{display:block;}

#wrap .section#product .container{width:1200px; margin:0 auto;padding:100px 0;}
#wrap .section#product ul.main_quick{width:100%; margin:80px auto 0 auto;}
#wrap .section#product ul.main_quick:after{display: block;content: '';clear: both;}
#wrap .section#product ul.main_quick li{float: left;width:33.33%; min-height:380px; text-align:center; }
#wrap .section#product ul.main_quick li.last{margin-right: auto;}
#wrap .section#product ul.main_quick li a{margin:0 auto; position: relative;display: block;border: 0px solid #acacac;width:100%; max-width:340px; height:340px;}
#wrap .section#product ul.main_quick li a span.img_box{position: relative;display: block;width:100%;height:auto;overflow: hidden;}
#wrap .section#product ul.main_quick li a span.img_box img{width:100%; max-width:340px;transition: all 1s ease 0s; -webkit-transition: all 1s ease 0s;}
#wrap .section#product ul.main_quick li a span.tit{position: absolute;bottom:0px;left: 0px;background: url(../img/s_img/bg_main_quick.png) repeat;display: block; width:100%; max-width:340px;text-indent: 30px;height: 66px;line-height: 66px;font-size: 20px;color: #fff;font-weight: 500;text-align: left;transition: all 0.25s ease 0s; -webkit-transition: all 0.25s ease 0s;}
#wrap .section#product ul.main_quick li a span.plus{position: absolute;bottom: 0;right: 30px;display: block;text-align: right;width: 100%;height: 66px;line-height: 66px;font-size: 20px;color: #fff;font-weight: 500;transition: all 0.25s ease 0s; -webkit-transition: all 0.25s ease 0s;}
#wrap .section#product ul.main_quick li a span.border{position: absolute;top:0px;left: 0px;display: block;border: 15px solid #b3b3b3;width: 100%;height: 100%;display: none;background: url(../img/s_img/main_quick_border_bg.png) repeat;transition: all 0.25s ease 0s; -webkit-transition: all 0.25s ease 0s;}
#wrap .section#product ul.main_quick li a span.view{position: absolute;top:115px;left: 0;display: block;width: 100%;height: 80px;color: #fff;font-size: 20px;text-align: center;display: none;background: url(../img/s_img/icon_main_quick_plus.png) no-repeat center 100%;transition: all 0.25s ease 0s; -webkit-transition: all 0.25s ease 0s;}

#wrap .section#product ul.main_quick li a:hover span.img_box img{width: 100%; max-width:340px; transition: all 1s ease 0s; -webkit-transition: all 1s ease 0s;}

#wrap .section#product ul.main_quick li a:hover span.tit{display: none;transition: all 0.25s ease 0s; -webkit-transition: all 0.25s ease 0s;}
#wrap .section#product ul.main_quick li a:hover span.plus{display: none;transition: all 0.25s ease 0s; -webkit-transition: all 0.25s ease 0s;}
#wrap .section#product ul.main_quick li a:hover span.border{display: block;transition: all 0.25s ease 0s; -webkit-transition: all 0.25s ease 0s;}
#wrap .section#product ul.main_quick li a:hover span.view{display: block;transition: all 0.25s ease 0s; -webkit-transition: all 0.25s ease 0s;}
#wrap .section#product ul.main_quick li span.bott{width:100%; max-width:340px; text-align:center; font-weight:500; min-height:100px; line-height:1.2; font-size:18px;  display:inline-block;padding:38px 10px 20px 10px; background:#b3b3b3; color:#000;}




#wrap .section#product ul.main_quick li dl{padding:30px 10px 40px 10px; background:#b3b3b3;}
#wrap .section#product ul.main_quick li dt{font-size:20px; font-weight:400; line-height:1.4; color:#000; letter-spacing:-0.05em; text-align:center;}
#wrap .section#product ul.main_quick li dd{font-size:15px; color:#000;  line-height:1.5; padding-top:20px; font-weight:300; letter-spacing:-0.05em;text-align:center;}
#wrap .section#product ul.main_quick li dd span.pc_cut{display:block;}









/*03 CONTACT US*/
#wrap .section#map{clear:both; position:relative;width:100%; height:auto; margin:0 auto; padding:0px 0 0 0; background:#fff;}

.map_main{clear:both; margin-top:60px;}

#wrap .section#map h3{margin-top:100px; padding:35px 0 20px 0;text-align: center;font-size: 48px;color: #111;font-weight:600; letter-spacing:-0.03em; background:url(../img/s_img/title_blueline.gif) no-repeat center 0;}
#wrap .section#map p.tit{font-size:18px; font-weight:300; line-height:2; color:#111; text-align: center;}
#wrap .section#map p.tit span.pc_cut{display:block;}

#wrap .section#map p.tit strong{font-weight:600; color:#f58220; }









/* sub(common) */
#wrap .sub_vis{width: 100%;height:360px;margin-top:0px;background: #eee;}
#wrap .sub_vis h3{font-size: 40px;color: #fff;font-weight:600; text-align: center; padding-top:209px;}
#wrap .sub_vis#sub1{background: url(../img/p_img/sub_vis1.jpg) no-repeat center center;-webkit-background-size: cover;background-size: cover;}
#wrap .sub_vis#sub2{background: url(../img/p_img/sub_vis2.jpg) no-repeat center center;-webkit-background-size: cover;background-size: cover;}
#wrap .sub_vis#sub3{background: url(../img/p_img/sub_vis3.jpg) no-repeat center center;-webkit-background-size: cover;background-size: cover;}
#wrap .sub_vis#sub4{background: url(../img/p_img/sub_vis4.jpg) no-repeat center center;-webkit-background-size: cover;background-size: cover;}
#wrap .sub_vis#sub5{background: url(../img/p_img/sub_vis5.jpg) no-repeat center center;-webkit-background-size: cover;background-size: cover;}
#wrap .sub_vis#sub6{background: url(../img/p_img/sub_vis6.jpg) no-repeat center center;-webkit-background-size: cover;background-size: cover;}
#wrap .sub_vis#sub7{background: url(../img/p_img/sub_vis7.jpg) no-repeat center center;-webkit-background-size: cover;background-size: cover;}


#wrap .sub_nav.pc{display: block;width: 100%;height:56px;background: #107ebb;  overflow-x: hidden;}
#wrap .sub_nav.pc ul{width: 1199px;margin: 0 auto;border-left: 1px solid #88bfdd;}
#wrap .sub_nav.pc ul:after{display: block;content: '';clear: both;}
#wrap .sub_nav.pc ul li{float: left;}
#wrap .sub_nav.pc ul li a{display: block;width: 100%;height:56px;line-height:56px;text-align: center;color: #fff;border-right: 1px solid #88bfdd;font-size: 18px;font-weight: normal;letter-spacing: -0.5px;}
#wrap .sub_nav.pc ul li.on a{background: #0f366d;color: #fff;}

#wrap .sub_nav.pc ul li.double a{padding-top:7px;height: 56px;line-height: 1.25; font-size:17px;}
#wrap .sub_nav.pc ul li.double a span.pc_cut{display:block;}
#wrap .sub_nav.s1 ul li{width: 100%;}

#wrap .sub_nav.s2 ul li{width: 49.999%;}
#wrap .sub_nav.s3 ul li{width: 33.33333333333333%;}
#wrap .sub_nav.s4 ul li{width: 25%;}
#wrap .sub_nav.s5 ul li{width: 20%;}
#wrap .sub_nav.s6 ul li{width: 16.66666666666667%;}

#wrap .sub_nav.mobile{display: none;position: relative;width: 100%;z-index: 1000;}
#wrap .sub_nav.mobile a.selected{position: relative;display: block;width: 100%;height: 60px;border-bottom: 1px solid #ccc;}
#wrap .sub_nav.mobile a.selected span.txt{display: block;width: 100%;height: 60px;line-height: 60px;font-size: 17px;font-weight: 500;text-align: center; letter-spacing:-0.05em; color: #090909;}
#wrap .sub_nav.mobile a.selected span.arrow{position: absolute;top: 15px;right: 15px;display: block; width:30px;height: 30px;background: url(../img/s_img/sub_nav_m_arrow.png) no-repeat center center;-webkit-background-size: 100%; background-size: 100%;}
#wrap .sub_nav.mobile a.selected.on span.arrow{background: url(../img/s_img/sub_nav_m_arrow_on.png) no-repeat center center;-webkit-background-size: 100%;background-size: 100%;}
#wrap .sub_nav.mobile ul{display: none;position: absolute;top: 60px;left: 0;width: 100%;background: #107ebb;padding: 30px 0;}
#wrap .sub_nav.mobile ul li a{display: block;width: 100%;font-size:17px;color: #fff; letter-spacing:-0.05em; text-align: center;height: 40px;line-height: 40px;}
#wrap .sub_nav.mobile ul li:hover{background: #0f366d;}



/* sub(common) */


#sub #wrap #content{width: 100%;}
#sub #wrap #content .container{padding:60px 0 100px 0;width: 1200px;margin: 0 auto; min-height:400px;}

#sub #wrap #content .container_full{padding:60px 0 100px 0;width: 100%;margin: 0 auto; min-height:400px;}


#sub h4{font-size:36px !important;color: #333;text-align: center;font-weight:500; line-height:30px;margin:40px 0 100px 0; letter-spacing:-0.05em; padding:0px; }
#sub h4 span{padding:0 0 15px 0; background:url(../img/s_img/h4_bar.gif) no-repeat 52% bottom; font-weight:500;  font-size:36px; letter-spacing:-0.05em;}
#sub h4 span.non{background:none;}
#sub h4 span.non em.cut{display:block; font-size:28px; color:#777; padding:10px 0 15px 0;background:url(../img/s_img/h4_bar.gif) no-repeat center bottom;}
#sub h5{clear:both; font-size:24px; color: #111; text-align:left; font-weight:500; line-height:32px !important;margin:40px 0 20px 0; letter-spacing:-0.05em; padding-left:25px; background:url('../img/s_img/h5_bull.gif') no-repeat 0 15px; }
#sub h6{font-size:18px; color:#2c5fa1; line-height: 25px;font-weight:bold; padding-left: 16px; background: url(../img/s_img/sub1_6_title_bullet.png) no-repeat 0 5px; margin:20px 0 20px 10px; margin-left:10px;}
#sub h5.fir{margin-top:0;}

#sub h5.non{clear:both; font-size:24px; color: #111; text-align:left; font-weight:500; line-height:32px !important;margin:60px 0 20px 0; letter-spacing:-0.05em; padding-left:0px; background:none; }





