@charset "utf-8";


/* 추가 */
a:hover, a:visited, a:active { text-decoration:none; }

/* wrap */
.wrap {
    width:100%;
    min-width:1001px;
    font-family:'돋움';
}

.wt_wrap {
    width:1001px;
    margin:0 auto;
}

/* header_wrap */
.header_wrap {
    width:100%;
    text-transform:uppercase;
}

.header_top {
    height:24px;
    line-height:24px;
    background:#f6f6f6;
    border-bottom:1px solid #e2e2e2;
    text-align:right;
    font-size:10px; 
}

.header_top a { margin:0 5px; }
.header_top a:last-child { margin:0; }

.header_mid_area { width:100%; }
.header_wrap.on .header_mid_area { background:url("image/lnb_bg.gif") no-repeat 50% bottom; }


.header_mid {
    position:relative;
    overflow:hidden;
    width:1001px;
    margin:0 auto;
    height:74px;
}

.header_mid #logo { 
    position:absolute;
    top:10px;
    left:0;
    z-index:2;
}

.header_mid #gnbMenu {
    width:1001px;
    position:absolute;
    top:30px;
    right:50%;
    margin-right:-500px;
}

#gnb {
    font-family: Helvetica;
    font-weight:bold;
    font-size:15px;
    text-align:right;
    letter-spacing:-1px;
}

#gnb:after{content:'';display:block;clear:both;}
#gnb li{ 
    position:relative;
    display:inline-block;
    *display:inline;
    zoom:1; 
    margin-left:60px;
    text-align:left;
}
#gnb li:first-child { margin-left:0; }

#gnb li a{ display:block; color:#6a6a6a; overflow:hidden;height:22px;}

#gnb.on{}
#gnb li.on a.m_img img { margin-top:-22px; }
#gnb li.on a,
#gnb li a:hover{ color:#3caee0; }
#gnb li.on .sub{ display:block; }
#gnb .sub{
    display:none;
    position:absolute;
    top:24px;
    left:0;
    width:9999px;
}


#gnb li li {
    display:inline-block;
    float:none;
    white-space:nowrap;
    font-size:0px;
    line-height:0;
    letter-spacing:-2px;
    margin:4px 10px 0 0;
    vertical-align:top;
}

#gnb li li img { vertical-align:top;}

* html #gnb li li{display:inline;}
*+html #gnb li li{display:inline;}

#gnb li.on li a,
#gnb li li a{
    display:inline-block;
    color:#fff; 
    font-family:'돋움'; 
    font-weight:bold; 
}

#gnb li li.on1 a,
#gnb li li a:hover,
#gnb li li a:focus{color:#fff; }

#gnb #sub1,
#gnb #sub2,
#gnb #sub3,
#gnb #sub4,
#gnb #sub5{     left:0;  }
#gnb #sub3 { left:-315px;   }
#gnb #sub4,
#gnb #sub5  { text-align:right; left:auto; right:0; }



.header_bot {
    width:100%;
    border-top:1px solid #e2e2e2;
    text-align:center;
    font-size:0;
}



/* 비주얼 */

#visual{ position:relative; height:748px; }
#mBytree{
	position: absolute;
	left: 50%;
	top: 0;
	width: 1920px;
	margin: 0 0 0 -960px;
	overflow: hidden;
}
#mBytree .inner{}
#mBytree .inner .gallery{ position:relative; height:748px; }
#mBytree .inner .gallery li{ position:absolute; left:0; top:0px; width:100%; height:100%; }
#mBytree .inner .gallery li .thumb{ display:block; height:100%; }
#mBytree .inner .gallery li .thumb img{ width:100%;}
#mBytree .control_wrap{
	position: absolute;
	right: 50%;
	bottom: 10px;
	width: 1024px;
	margin-top: 0;
	margin-right: -950px;
	margin-bottom: 0;
	margin-left: 0;
}
#mBytree .control{ height:20px; }
#mBytree .control li{ display:inline; float:left; width:20px; height:20px; margin:10px; }
#mBytree .control li a{ display:block; overflow:hidden; height:100%;}
#mBytree .control li.on { width:20px;}
#mBytree .control li a:focus img,
#mBytree .control li.on a img{ margin:-20px 0 0; }  





/* con_left */
.con_left {
    width:450px;
    height:145px;
    float:left;
    padding:30px 10px;
}

#hotGallery{
    position:relative;
    overflow:hidden;
    }
#hotGallery .tab{
    zoom:1;
    width:450px;
}
#hotGallery .tab:after{
    content:'';
    display:block;
    clear:both;
}
#hotGallery .tab li{
    float:left;
    width:25%;
    text-align:center;
    font-size:11px;
    *margin:0 0 0 -1px;
}

#hotGallery .tab li a {
    display:block;
    overflow:hidden;
    height:26px; 
    line-height:26px;
    border-top:1px solid #e2dede;
    border-bottom:1px solid #e2dede;
    border-right:1px solid #e2dede;
}

#hotGallery .tab li:first-child  a{ border-left:1px solid #e2dede; }

#hotGallery .tab li a:hover,
#hotGallery .tab li a:focus,
#hotGallery .tab li.on a{
    position:relative;
    background:#3f8ecb;
    color:#fff;
}
#hotGallery .tab li a:hover img,
#hotGallery .tab li a:focus img,
#hotGallery .tab li.on img{position:relative;margin:-33px 0 0;}

#hotGallery .inner{
    display:none;
    overflow:hidden;
    position:relative;
    height:118px;

}

#hotGallery .inner.on{ display:block;}
#hotGallery .inner .gallery{ 
    position:absolute;
    left:0;
    top:0;
    height:100%;
}

#hotGallery .links_prev,
#hotGallery .links_next{ 
    position: absolute;
    top:28px;
}

#hotGallery .links_prev{ left:0px; }
#hotGallery .links_next{ right:0px; }

#hotGallery .list_product{
    position:absolute;
    width:9999px;
    overflow:hidden;
    padding:12px 17px;
    height:94px;
    background:url("image/contents_bg.png") no-repeat;
}
#hotGallery .list_product:after{content:'';display:block;clear:both;}

#hotGallery .list_product li{float:left;}

#hotGallery .list_product li a{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    cursor:pointer;
}

#hotGallery .list_product .thumb{display:block;width:86px;}
#hotGallery .list_product .thumb img{width:100%;}
#hotGallery .list_product .summary{
    display:block;
    height:24px;
    padding:0 5px;
    border:1px solid #fff;
    background:url('./image/bg_product.png') repeat-x;
    font-size:11px;line-height:24px;text-align:center;
    }
#hotGallery .list_product .title{
    display:inline-block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    max-width:70%;
    }
#hotGallery .list_product .price{
    display:inline-block;
    overflow:hidden;
    color:#e31565;
}



/* con_cen */

.con_cen {
    position:relative;
    width:248px;
    height:145px;
    padding:30px 14px;
    float:left;
    font-size:11px;
    border-right:1px solid #e2dede;
    border-left:1px solid #e2dede;
}
.con_cen ul { margin-top:10px; }
.con_cen ul li { 
    overflow:hidden;
    margin-bottom:2px;
    font-size:11px;
}

.con_cen ul li a { 
    float:left;
    width:200px;
    height:18px;
    overflow:hidden;
}

.con_cen ul li  span.date {
    float:right;
}

.con_cen .more {
    position:absolute;
    top:25px;
    right:10px;
}



/* con_right */
.con_right {
    width:251px;
    padding:30px 0;
    text-align:center;
    float:right;
}


/* footer */
.footer {
    clear:both;
    background:#3e3e3e;
    overflow:hidden;
    padding:25px 0;
    color:#b1b1b1;
    font-size:11px;
    letter-spacing:-1px;
}

.footer .wt_wrap { position:relative; }

.footer .ft_logo {
    float:left;
    width:118px;
}
.footer .ft_address {
    float:left;
    width:605px;
    margin-left:27px;
}

.footer .copyright { 
    font-weight:bold; 
    margin:4px 0 0 0;
}


.ft_menu {
    position:absolute;
    right:0;
}

.ft_menu ul { overflow:hidden; }
.ft_menu ul li {
    float:left;
    height:20px;
    line-height:20px;
    padding:0 8px;
    background:url("image/ft_menu_bg.png") repeat-x;
}

.ft_menu ul li.first {
    background:url("image/ft_menu_bg2.png") no-repeat 0 0;

}

.ft_menu ul li.last {
    background:url("image/ft_menu_bg2.png") no-repeat -145px 0;
    
}




/* sub style
****************************************************************************************************************************************/

.container_wrap {
    background:url("image/sub_container_bg.jpg") no-repeat center 0; 
}

/* 서브 비주얼 */

#sub_visual{ overflow:hidden; position:relative; height:195px; }
#sub_visu{ position:absolute; left:50%; top:0; width:1920px; margin:0 0 0 -960px; overflow: hidden;}
#sub_visu .inner{}
#sub_visu .inner .gallery{ position:relative; height:195px; }
#sub_visu .inner .gallery li{ position:absolute; left:0; top:0; width:100%; height:100%; }
#sub_visu .inner .gallery li .thumb{ display:block; height:100%; }
#sub_visu .inner .gallery li .thumb img{ width:100%; }

.container {
    position:relative;
    margin:-195px auto 0;
    width:1001px;
    min-height:800px;
    padding:0 0 0 0;
    background:url("image/left_cate_bg.gif") repeat-y 0 0;
}
.container:after { content:""; display:block; clear:both;}

#container{
    position:relative;
    z-index:20;
}

/* left_box */

.left_box {
    float:left;
    width:198px;
    
}


/* right_box */
.right_box {
    float:right;
    width:773px;
    margin-top:155px;

}

.category {
    border:1px solid #e2e2e2;
    border-bottom:none;
}
.category li {
    background:#f6f6f6;
    border:1px solid #fff;
    border-bottom:1px solid #e2e2e2
    
}
.category li a{
    display:block;
    padding-left:12px;
    letter-spacing:-1px;
    height:30px;
    line-height:30px;
    font-weight:bold;
    color:#6a6a6a;
    font-family: 'NanumGothicWeb';
    font-size:13px;
    background:url("image/sub_cate_arrow.png") no-repeat 94% 8px;
}

.category a:hover {
    color:#fff;
    background:#4f89c5 url("image/sub_cate_arrow.png") no-repeat 94% -22px;
}


.depth_area {
    position:relative;
    overflow:hidden;
    padding:0 0 14px 0;
    border-bottom:1px solid #e2e2e2;
}



.depth {
    float:right;
    text-align:right;
    overflow:hidden;
}

.depth li {
    display:inline-block;
    *display:inline;
    zoom:1;
    color:#6a6a6a;
    font-size:11px;
}

.depth li.ar {
    font-weight:bold;
    color:#6c9ccf
}
.depth li.act {
    font-weight:bold;
    color:#4f89c5;
}

.sub_contents { padding:40px 0 0 0;  }

.depth a {
    font-family: '돋움';
    color:#6a6a6a;
    font-size:11px;
}

.depth a.current {
    font-weight:bold;
    color:#4f89c5;
}


/* 인증 특허 */

.confirm { background:url("image/confirm_bg.jpg") no-repeat 0 0;  }
.confirm2 { padding:20px 0 0 0;  }
.confirm2 .confirm_list { text-align:center;  padding-left:96px; padding-right:96px; }
.confirm2 .confirm_list li { float:left; width:193px; text-align:center; }

.confirm_top { 
    width:50%;
    margin:0 0 30px;
    padding:0 0 26px 387px;
    background:url("image/confirm_bar.gif") repeat-x 0 bottom;
}

.confirm_list.top {margin:0;padding:0;background-image:none;}
.confirm_list.top { overflow:hidden;  }
.confirm_list.top li { 
    float:left;
    width:50%;
    text-align:center;
}
.confirm_list_top li a {}
.confirm_list_top li a img {
    width:122px;
    -webkit-box-shadow: rgb(240, 240, 240) 0px 0px 10px;
    box-shadow: rgb(240, 240, 240) 0px 0px 10px;
}

.confirm_list_top li span { display:block; margin-bottom:10px; }
.confirm_list { overflow:hidden;margin:0 0 30px;padding:0 0 26px;background:url("image/confirm_bar.gif") repeat-x 0 bottom; }
.confirm_list li { 
    float:left;
    width:25%;
    text-align:center;
}
.confirm_list li a {}
.confirm_list li a img {
    width:122px;
    -webkit-box-shadow: rgb(240, 240, 240) 0px 0px 10px;
    box-shadow: rgb(240, 240, 240) 0px 0px 10px;
}

.confirm_list li span { display:block; margin-bottom:10px; }



/* SOCIAL ICONS - GENERAL */
.quick_m2 { position:absolute; top:45px; list-style:none; width:180px; height:40px;   }
.quick_m2 li { display:inline-block; float:left; width:40px; height:40px; margin-left:2px;  background-repeat:no-repeat; }
.quick_m2 li a { display:block; width:40px; height:40px; position:relative;  text-decoration:none; }
.quick_m2 li a strong { font-weight:normal; position:absolute; left:-10px;  letter-spacing:-.02em; font-size:.90em; top:-1px; color:#fff; width:65px; text-align:center; background:#007ac2; padding:3px 0 3px; z-index:9999;}

li.eng { background-image:url("images/eng.png"); }
li.eng a:hover { background:url("images/over.png") 0 -40px;}

li.esti { background-image:url("images/esti.png"); }
li.esti a:hover { background:url("images/over.png") 41px -40px; }

li.map { background-image:url("images/map.png"); }
li.map a:hover { background:url("images/over.png") 80px -40px; }

li.cadalog { background-image:url("images/catal.png"); }
li.cadalog a:hover { background:url("images/over.png") 120px -40px; }




/****************************************************************************************************************************************/
