@charset "utf-8";
/* CSS Document */
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@import url(http://fonts.googleapis.com/css?family=Noto+Sans);

/* All Device */

html{overflow-y:scroll;  overflow-x:hidden;}
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, input{margin:0;padding:0;}
h1, h2, h3, h4, h5, h6{font-weight:normal;font-size:100%;}
a{text-decoration:none;}
ul, ol, li{list-style:none;}
img{border:none; vertical-align:middle;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary{display:block;}
table, td, tr{font-family:"NanumGothic","Nanum Gothic"; font-size:13px; color:#333; font-weight:400;}

body{background-color:#fff;}

#wrap{width:100%;  overflow:hidden; text-align:left; }
#top_wrap{position:relative;width:100%; height:80px; left:0px; top:0px;
background:url('../images/menu_bg.jpg')no-repeat center; z-index:999; border-bottom:solid 1px #ccc;}

#top_total{position:relative; margin:0 auto; left:0px; top:0px;  width:1000px; height:80px; z-index:998; }

#logo{ float:left; width:275px; height:50px; margin-top:12px; }



/*메뉴슬라이드*/
#menu{float:left;  width:725px; height:40px; top:60px; margin-left:0px; margin-top:32px;}
#menu ul{ display:table; }
#menu ul li{position:relative;  float:left; margin-right:0px;}
#menu ul li a{ display:block; width:145px; height:30px;text-align:center; font-family:"NanumGothic","Nanum Gothic"; 
font-size:16px; color:#333; font-weight:600; text-decoration:none; }

#menu ul li:last-child {margin-right:0px;}

#menu ul li:hover a{ color:#f78b0d;}


/*이미지슬라이드 css소스*/
#main_slide{position:relative;width:100%;  margin:0 auto;}
.clear{overflow: hidden; width: 100%; margin:0 auto;}
.dn {display: none;}
.wrap_box{width:100%;}
.wrap_box .visual{height:570px; margin-top: 0px;}
.wrap_box .box {position:relative; width:100%;}
.wrap_box .visual .pht{position:absolute; top:0; left:0; width:100%; height:570px;}
.wrap_box .visual .prev {position: absolute; top:230px; left:50%; margin-left:-500px; cursor: pointer; z-index:12}
.wrap_box .visual .next {position: absolute; top:230px; right:50%; margin-right:-500px; cursor: pointer;}
.wrap_box .visual .control{float:left; position:absolute; top:500px; left:50%; margin-left:-32px;  width:60px;}
.wrap_box .visual .control .fl{float:left; margin-right:10px; cursor: pointer;}

#main_ment{position:absolute; width:590px; height:67px;  left:50%;
margin-left:-295px; top:213px;}
#main_ment .ment1{font-family:"NanumGothic","Nanum Gothic"; font-size:28px; font-weight:600; color:#fff;
text-align: center;}
#main_ment .ment2{font-family:"NanumGothic","Nanum Gothic"; font-size:28px; font-weight:600; color:#fff;
text-align: center; margin-top:7px;}


#quick_wrap{position:relative; margin:0 auto; height:340px; background:url(../images/quick_bg.jpg) no-repeat center;}
#quick_total{position:relative; margin:0 auto;  width:1000px; overflow:hidden; top:85px;}
/*-------------------1--------------------------------------------------*/
#q1{float:left; width:180px; height:255px;}
#quick1{float:left; width:180px; height:180px;}
.qq1  img {
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
}
.qq1:hover img {
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -ms-transform:scale(1.2);   
    -o-transform:scale(1.2);
    transform:scale(1.2);
}
.qq1{overflow:hidden;}
#quick1_ment{float:left; width:180px; height:75px;}
/*-------------------2----------------------------------------------------------------*/
#q2{float:left; width:180px; height:255px; margin-left:20px;}
#quick2{float:left; width:180px; height:180px;}
.qq2  img {
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
}
.qq2:hover img {
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -ms-transform:scale(1.2);   
    -o-transform:scale(1.2);
    transform:scale(1.2);
}
.qq2{overflow:hidden;}
#quick2_ment{float:left; width:180px; height:75px;}
/*-------------------3----------------------------------------------------------------*/
#q3{float:left; width:180px; height:255px; margin-left:25px;}
#quick3{float:left; width:180px; height:180px;}
.qq3  img {
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
}
.qq3:hover img {
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -ms-transform:scale(1.2);   
    -o-transform:scale(1.2);
    transform:scale(1.2);
}
.qq3{overflow:hidden;}
#quick3_ment{float:left; width:180px; height:75px;}
/*-------------------4----------------------------------------------------------------*/
#q4{float:left; width:180px; height:255px; margin-left:25px;}
#quick4{float:left; width:180px; height:180px;}
.qq4  img {
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
}
.qq4:hover img {
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -ms-transform:scale(1.2);   
    -o-transform:scale(1.2);
    transform:scale(1.2);
}
.qq4{overflow:hidden;}
#quick4_ment{float:left; width:180px; height:75px;}
/*-------------------5----------------------------------------------------------------*/
#q5{float:left; width:180px; height:255px; margin-left:25px;}
#quick5{float:left; width:180px; height:180px;}
.qq5  img {
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -ms-transition:.3s;
    -o-transition:.3s;
    transition:.3s;
}
.qq5:hover img {
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -ms-transform:scale(1.2);   
    -o-transform:scale(1.2);
    transform:scale(1.2);
}
.qq5{overflow:hidden;}
#quick5_ment{float:left; width:180px; height:75px;}


#main_middle_wrap{margin:0 auto; left:0px; width:100%; height:270px;   
background-size:cover;background: url(../images/main_middle_wrap.jpg) no-repeat bottom  fixed;}
#main_middle_total{ position:relative; margin:0 auto; margin-top:px;  width:1000px; overflow:hidden;
min-height:270px;}

#news{float:left; width:245px; height:165px; background:url('../images/news.png')no-repeat center; margin-top:52px;}
#news .more{float:right;  height:20px; margin-right:20px; margin-top:18px; }
#news .more a{font-family:"NanumGothic","Nanum Gothic"; font-size:12px; color:#fff; font-weight:600;}
#news .more a:hover{font-family:"NanumGothic","Nanum Gothic"; font-size:12px; color:#999;}
#news_total{ float:left; width:245px; height:165px; margin-left:0px;}
#news_body{ float:left; width:245px; height:120px;}



#qr{float:left; width:340px; height:165px; background:url('../images/qr.png')no-repeat center; margin-top:52px; margin-left:20px;}

#customer{float:left; width:375px; height:165px; background:url('../images/customer.png')no-repeat center; margin-top:52px; margin-left:20px;}


/*----------------------------------------------sub 시작----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#middle_wrap{margin:0 auto;  width:100%; overflow:hidden;}
#middle_total.sub{ position:relative; margin:0 auto; margin-top:0px; overflow:hidden;  width:1000px; overflow:hidden;}
#sub_middle_total {margin:0 auto;   width:100%; height:300px; background:url('../images/sub_main.jpg') no-repeat center; margin-bottom:40px;}

#con_total{ padding-left:50px; width:750px; overflow:hidden;}
#con_title{ width:750px; height:59px; /*background:url('../images/title_square.jpg') no-repeat 0px 43px;*/ border-bottom:1px solid #ccc; }   /*title 사각형이미지*/
#title_a{ padding-top:10px; font-family:"NanumGothic","Nanum Gothic"; font-size:21px;  color:#333333; font-weight:600;}  /*title 멘트 */
#title_a span{ font-family:"NanumGothic","Nanum Gothic"; font-size:12px; color:#777;  float:right; padding-top:9px;}

#con{width:750px;  overflow:hidden; margin-top:50px; padding-bottom:100px; min-height:540px; }
/*-------------------------------------레프트 메뉴----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#left_total{float:left; width:200px; overflow:hidden; padding:0 0 30px 0;}
#left_title{width:200px; height:59px; padding:0px 0 0px 20px; font-family:'Nanum Gothic', sans-serif; font-size:21px; line-height:50px; font-weight:600; color:#222;}
#left_title span{font-size:20px;}


#left_nav{width:100%; overflow:hidden; min-height:250px; margin-top:0px;}
.leftMenu {float:left; width:200px; overflow:hidden; border-top:2px solid #ccc; }
.leftMenu > li{list-style:none; border-bottom:1px solid #ddd;  }
.leftMenu > li > a{display:block; width:180px; padding-left:20px; height:39px; font-family:'Nanum Gothic', sans-serif; font-size:15px; line-height:39px; font-weight:600; color:#535353; transition:0.3s; }
.leftMenu > li > a:hover{background-color:#d9811a;  color:#fff; text-decoration:none;}
.leftMenu > li.on > a{ background-color:#d9811a; color:#fff;}

.leftMenu .gub_sub {display:none;}
.leftMenu li .gub_sub { overflow:hidden; height:auto; padding:5px 0 15px;}
.leftMenu li .gub_sub li a {display:block; height:25px; padding-left:20px; font-family:'Nanum Gothic', sans-serif; font-size:14px; line-height:25px; color:#777;}
.leftMenu li .gub_sub li a:hover, .leftMenu li .gub_sub li.on a{color:#d9811a; text-decoration:none;}
.leftMenu li .gub_sub .sub1 a {font-family:"NanumGothic","Nanum Gothic";font-size:14px; color:#222; height: 30px; font-weight:600; text-decoration:none;}
.leftMenu li .gub_sub .sub1 a:hover {font-family:"NanumGothic","Nanum Gothic";color:#222;}
.leftMenu li .gub_sub li.sub1.on1 a{color:#d9811a;}
/*------------------------------------레프트 메뉴 끝---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/


/*copyright*/
#bottom_wrap{overflow:hidden; background-color:#222; }
#bottom_total{margin:0 auto; margin-top:0px; width:1000px; height:150px; display: block;}
#ftt{position:relative; left:0px; top:30px;  overflow:hidden;
font-family:"NanumGothic","Nanum Gothic";  font-size:13px; color:#222;}
#ftt a{float:left; padding-right:20px;  font-family:"NanumGothic","Nanum Gothic";
font-size:13px; color:#ccc;}
#ftt a:hover{text-decoration:none; color:#aaa;}
#copy1{margin:0 auto; margin-left:0px; margin-top:60px; font-family:"NanumGothic","Nanum Gothic"; font-size:12px; color:#ccc; line-height:20px;}