@charset "utf-8";
/*대표색상 #ef3026 */
#wrap{max-width:2000px; min-width:320px; margin: 0 auto; width:100%}
.inner{max-width: 1200px; width: 100%; margin: 0 auto;}
a.read_btn{display: inline-block; padding: 10px 25px; border: 3px solid #ef3026; color: #ef3026; transition: 0.3s;}
a.read_btn:hover{background: #ef3026; color: #fff;}

/*공통타이틀*/
h2.m_title{font-size: 35px; color: #ef3026; margin-bottom: 50px;}
p.m_text{font-size: 20px; color: #777; font-weight: 400;} 

.p_t_50{padding-top: 50px;}
.p_t_60{padding-top: 60px;}
.p_t_70{padding-top: 70px;}
.p_t_80{padding-top: 80px;}
.p_t_90{padding-top: 90px;}
.p_t_100{padding-top: 100px;}

/*폰트*/
.tite_h2 {font-family: 'ns'; font-weight:bold !important;}
.text_ns {font-family: 'ns';}

@media screen and (min-width:1024px){
.boxwidth li {height:120px}
}
/*header
header{width: 100%; position: fixed; height: 60px; z-index: 9999; background: rgba(239,48,38,0.9)}
header h1{float: left; margin-left: 50px; line-height: 60px;}
header h1 img{width: 75px;}

header .gnb_wrap{width: 70%; margin: 0 auto;}
header .gnb_wrap li{float: left; width: 25%; text-align: center; line-height: 60px; background: url("../img/h_t_bar.jpg") no-repeat right center;}
header .gnb_wrap li:last-child{background: none;}
header .gnb_wrap li a{display: block; font-size: 19px; font-weight: 500; letter-spacing: -0.3px; color: #fff;}

header .right{position: absolute; right: 0; top: 0;}
header .right .box{float: left; margin-right: 20px;}
header .right .box a{display: inline-block; font-size: 13px; line-height: 70px; margin-left: 6px; padding-left: 8px; background: url("../img/t_bar.jpg") no-repeat left center;}
header .right .box a:first-child{background: none;}
header .right .box .ran_on{font-weight: bold; color: #ef3026;}
header .right .sitemap{float: right;}
header .right .sitemap a{display: block; height: 50px; width: 80px; background: rgba(239,48,38,0.7); padding-top: 21px;}
header .right .sitemap span{text-indent: -9999px; display: block; height: 3.2px; width: 32px; background: #fff; margin-left: auto; margin-right: auto;}
*/

/*header
header{height: 80px; background: #fff; position: relative;}
header .logo{position: absolute; top: 16px; left: 50px;}
header .group{width: 55%; margin: 0 auto; text-align: center;}
header .group li{float: left; width: 20%; line-height: 78px; font-size: 18px; text-align: center;}
header .group li a{display: block; width: 100%; font-family: 'Nanum SquareB'}
header .lang_box{float: left; line-height: 80px; margin-right: 30px;}
header .lang_box .on{font-weight: bold; color: #285493;}
header .site_map{float: right; display: block; height: 80px; width: 80px; background: #285493 url("../img/ico_top_navi.png") no-repeat 50% / 28px;}
header .gnb_right{position: absolute; top:0; right: 0;}
*/

.lnb{background: #285493; height: 30px;}
.lnb .lnb_box{float: right; color: #fff; line-height: 30px; font-weight: bold; font-size: 13px;}
.lnb .lnb_box a{display: inline-block; font-size: 12px; font-weight: normal; padding: 0 15px; border-left: 1px solid rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0.7); transition: 0.3s;}
.lnb .lnb_box a:hover{color: rgba(255, 255, 255, 1);}
.lnb .lnb_box a.kor{display: inline-block; padding: 0 15px; border-left: 1px solid rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 1);}

header{width: 100%; position: fixed; z-index: 9999999999;}

header .rang{line-height: 65px; float: right; }
header .logo{float: left; line-height: 65px; width: 20%;}
header .logo img{width: 150px;}
header .d1{position:relative; background: rgba(239,48,38,0.9)}
header .d1 .inner{position:relative; }
header .gnb{float: right; width: 75%; position:relative; z-index:100000; font-weight: bold;}
header .gnb>ul>li{float:left; position:relative; width: 25%; text-align: center; background: url("../img/h_bar.gif") no-repeat right center;}
header .gnb li .m{display:block;  height: 65px; font-size: 20px;  color: #fff; line-height: 65px; text-transform:uppercase; }
header .gnb li .sub{position:absolute; top: 65px; left:0; padding: 20px 0px 10px; width:100%; height:251px; display:none; overflow:hidden; font-size: 16.5px; border-right: 1px solid #ddd;}
header .gnb .sub > ul > li a{display: block; padding: 2px 0 9px 0; color: #555; font-weight: bold; font-size: 16.5px;}
header .gnb .sub > ul > li a:hover{color: #ef3026;}
header .subBg{position:absolute; top: 65px; left:0; width:100%; height:280px;  display:none; background:rgba(255,255,255,1) url("../img/gnb_bg.png") no-repeat left bottom; ; border-top: 1px solid #ddd; z-index: 99999; border-bottom: 1px solid #ddd;}
header .kor{color: #a9171a; font-weight: bold;}
header .eng{color: #555;}
header .lnb{background: #464d60;}
header .lnb .join{float: right;}
header .lnb .join a{color: rgba(255, 255, 255, 0.8); font-size: 13px;}

/*아코디언메뉴*/
#side{display:none; position: fixed; top:0; right: -100%; width: 70%; height: 100%; background: #292f37; z-index: 1000002;}
#topBn{position: fixed; top: 70px; left: 0; width: 100%; height: 250px; background: #222; color: #fff; display: none; z-index: 200;}

.hBtn{display:none;}
.hBtn{position:absolute; top: 40px; right: 0px;}
.hBtn p{margin-left: 5px;}
.hBtn p a{display: block; width: 75px; height: 70px; text-indent: -9999px;}
.hBtn .hb1 a{background: url("../img/btn_topBn.png") no-repeat center/45px auto; width: 50px; border-radius: 3px 3px 0 0;}
.hBtn .hb3 a{background: url("../img/ico_po.png") no-repeat center/22px auto;}
.hBtn .hb4 a{background: #033e75 url("../img/btn_berger_m.png") no-repeat center 25px /23px auto; z-index: 20000;}
.hBtn .hb1 a:hover{background-color: #222;}
.hBtn .hb1 a.on{background-color: #222;}
.blackBg{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.85; z-index: 1000000; display: none;}

.search{padding: 20px 95px 20px 20px; position: relative;}
.search input{width: 100%; height: 30px; border: 0; border-radius: 3px; padding: 0 5px; box-sizing: border-box;}
.search label{display: none;}
.search a{position: absolute; top: 20px; right: 20px; display: block; width: 70px; height: 30px; text-align: center; line-height: 30px; border-radius: 3px; background: #666; color: #fff;}

.menu{border-top: 1px solid #555;}
.menu .d1 .m1{display: block; padding: 10px 15px; border-bottom: 1px solid rgba(255, 255, 255, 0.2); position: relative; font-size: 15px;}
.menu .d1 .m1:after{content: ""; border: 6px solid transparent; border-top-color: #fff; position: absolute; right: 20px; top: 17px;}
.menu .depth2{display: none;}
.menu .depth2 > li > a{display: block; color: #fff; padding: 8px 25px; background: #23282f url("../img/mo_txt_dot.jpg") no-repeat 15px center; font-size: 14px;}
.menu .d2 .m2{position: relative;}
.menu .d2 .m2:after{content: ""; border: 6px solid transparent; border-top-color: #ddd; position: absolute; right: 20px; top: 15px;}
.menu .depth3{background: #555; display: none;}
.menu .depth3 li a{display: block; padding: 4px 25px; color: #ddd;}
.menu .d1 .m1.on:after{border-top-color: transparent; border-bottom-color: #fff; top: 11px;}
.menu .d2 .m2.on:after{border-top-color: transparent; border-bottom-color: #ddd; top: 9px;}

.closeMenu{position: absolute; top: 13px; left: -60px;}
.closeMenu a{color: #fff;}

.depth1 .d1{font-size: 110%; line-height: 30px;}
.depth1 .d1> a{color: #fff;}

#side .gnb-right{background-color: #3a4050; float: none;}
#side .gnb-right a{color: #fff; line-height: 45px;}
#side .gnb-right a span{display: inline-block; padding: 0 22px;}
#side .gnb-right .bar{background: url("../img/ico_top_bar.png") no-repeat center right;}
#side .gnb-right .home{background-color:#5d6270; border-left: 1px solid #5e6577; padding: 0 15px;}
#side .gnb-right .search{background-color:#5d6270; padding: 0 15px;}

.mo_lnb a{color: #fff;}
.mo_lnb ul{}
.mo_lnb ul > li{float: left; width: 50%; box-sizing: border-box; border-right: 1px solid rgba(255, 255, 255, 0.2); text-align: center;} 
.mo_lnb ul > li a{font-size: 12px; display: inline-block; padding: 10px 0; color:#ffffff}

/*section1*/
.slider .list1{height: 869px; background: url("../img/m_banner_01.jpg");}
.slider .list2{height: 869px; background: url("../img/m_banner_02.jpg");}
.slider .list .box{padding-top: 400px;}
/*.slider .list .tit_box{text-align: center; color: #fff; background: rgba(0,0,0,0.5); width: 360px; margin: 0 auto; padding: 80px 0;}*/
.slider .list .tit_box h2.tit{font-size: 60px; color: #ef3026;}
.slider .list .tit_box .tit2{font-size: 40px; color: #fff;}

.slider .list .tit_box .bar{display: inline-block; width: 30px; height: 2px; background: #fff; text-indent: -9999px; margin-top: 20px; margin-bottom: 10px;}
.slider .list .tit_box .txt{font-size: 30px; font-weight: 300;}
.slider .list .tit_box .txt span{color: #ef3026;}

.slider .tit_box{padding-left:20px;}
.slider .list1 .tit_box{/*text-align: right;*/}

/*박스슬라이더*/
.slider .bx-wrapper .bx-viewport{border: 0 !important; box-shadow: 0 !important; left: 0 !important;}
.slider .bx-pager{margin: 0 auto !important; text-align: center !important; bottom: 30px !important; width: 100% !important;} 
.slider .bx-wrapper .bx-pager.bx-default-pager a{background: #fff !important;}
.slider .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active{background: #ef3026 !important; width: 30px !important; transition: 0.3s !important;}

/*section2*/
.sec2{background: url("../img/s2_bg.jpg"); padding-bottom: 100px;}
.sec2 h2.m_title{text-align: center}
.sec2 .product .box{position: relative; height: 285px; float: left; overflow: hidden;}
.sec2 .product .box04{clear:both}
.sec2 .product .box img{
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transition: all 0.3s ease-in-out;}
.sec2 .product .box:hover img{
  
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);}
  .sec2 .product .box:hover .black_bg{transition: 0.3s; background-color:rgba(0,0,0,0.1);}
.sec2 .product .box .tit{line-height: 285px; color: #fff; font-size: 26px; position:absolute; z-index: 10000000; top: 0; text-align: center; width: 100%;}
.sec2 .product .w25{width: 25%;}
.sec2 .product .w50{width: 50%;}

.black_bg{width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color:rgba(0,0,0,0.4); z-index: 9999999; }

/*section3*/
.sec3{position:relative; padding: 100px 0 0;}

.sec3 .catalog .inner{border-bottom: 2px solid #ef3026; margin-bottom: 50px; padding-bottom: 50px;}
.sec3 .catalog h2{text-align: center; border-bottom: 2px solid #ef3026; margin-bottom: 50px; padding-bottom: 50px;}
.sec3 .catalog .left{float: left; width: 60%; text-align: center;}
.sec3 .catalog .right{float: left; width: 40%;}
.sec3 .catalog .right h3{font-size: 24px; color: #ef3026; font-weight: 400; letter-spacing: -1px;}
.sec3 .catalog .right li{margin-bottom: 7px;}

.sec3 .about{background: url("../img/bg_line_right.jpg") no-repeat right bottom; padding-bottom: 100px;}
.sec3 .about h2{font-size: 24px; font-weight: 500;}
.sec3 .about p{font-weight: 300; color: #363636;}
.sec3 .about .left{float: left; width: 50%;}
.sec3 .about .right{float: right; width: 42%; margin-left: 8%;}
.sec3 .about .right .top{margin-bottom: 30px;}
.sec3 .about .right .bottom{ padding: 30px 0; border-bottom: 2px solid #ddd;}
.sec3 .about .right .bottom span{color: #ef3026; font-weight: bold;} 
.sec3 .about .right .bottom p{line-height: 23px;}
.sec3 .kor{font-size: 16px !important; font-weight: bold; letter-spacing: -0.5px;}

.obj1 img{position:absolute; top: 200px; transform:translateY(80%); opacity:0; transition:transform 1.5s, opacity 1.5s; z-index:-1}			
.obj1 .on{transform:translateY(80%); opacity:1;}
.obj1 .off{transform:translateY(0%); opacity:1; }


/*footer*/
footer{text-align: center; background: #444444; padding: 30px 0; margin-top: 50px;}
footer h1{color: #ef3026; margin-bottom: 10px; font-size: 24px; font-weight: 400;}
footer p{color: rgba(255,255,255,0.4); font-weight: 300; font-size: 13.5px; line-height: 20px;}
footer  a{color:#959595 !important; font-weight:bold}
/*animation*/
.movetext1{
position:relative;
animation-name:sub_tt;
animation-duration:1000ms;
animation-fill-mode:both;
animation-delay:200ms;
animation-timing-fonction:ease-out;
}

.movetext2{
position:relative;
animation-name:sub_tt;
animation-duration:1500ms;
animation-fill-mode:both;
animation-delay:300ms;
animation-timing-fonction:ease-out;
}

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

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






/*세부드롭다운메뉴 모바일*/

.m_menu{position:relative; margin-bottom:30px;}
.s_menu {width: 100%; overflow: hidden;  border:1px solid #c8c8c8; border-radius:5px;background:rgba(239,48,38,0.9);; }		
.s_menu li{background:none; position:relative; width: 100%;text-align: center;	line-height: 45px;color: #ffff;font-size: 16px;}
.s_menu li i{position:absolute; right:15px; top:17px; border-top:8px solid; border-left:5px solid rgba(0, 0, 0, 0); border-right:5px solid rgba(0, 0, 0, 0);}
.s_menu > li > a{display: block;}
.s_menu li.current {background-color:#969696; color:#fff;}
.s_menu li.current a{color:#ffffff}
.s_menu li.current ul li a{background:#ffffff; color:#505050}
.s_menu li.current i{border-top:0; border-bottom:8px solid; border-left:5px solid rgba(0, 0, 0, 0); border-right:5px solid rgba(0, 0, 0, 0); transition:0.3s}
.s_menu li ul li a{ line-height:40px;}
.mdepth {width:100%; margin:0 auto; top:70px; left:0; z-index:1; display: none; background:#ffffff}		
.mdepth > li > a {display: block; width: 100%; text-align:center; font-size: 16px; font-weight: 500;}

@media screen and (min-width:1024px){
.m_menu{display:none;}
}

/*email*/
.email {display:inline-block;}
.email:hover {text-decoration:underline!important;}

.dot {background:url(../img/tit_deco.png)no-repeat; width:30px;height:25px; display: inline-block;}

/*모바일 언어*/
.lang {background:#464d60; height:30px; display:block;}

.lang {text-align:right}
.lang a{color: #fff; line-height: 30px; font-weight: bold; font-size: 13px;}
.lang a{display: inline-block; font-size: 12px; font-weight: normal; padding: 0 15px; border-left: 1px solid rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 0.7)!important; transition: 0.3s;}
.lang a:hover{color: rgba(255, 255, 255, 1)!important;}
.lang a.lang_k{display: inline-block; padding: 0 15px; border-left: 1px solid rgba(255, 255, 255, 0.2); color: rgba(255, 255, 255, 1)!important;}

@media screen and (min-width:1200px){
.lang{display:none;}
}