@charset "utf-8"; 
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

/* Element Reset */
* {margin:0; padding:0; list-style:none; font-family:'Nanum Gothic', sans-serif;}
body,table,input,textarea,select,button{font-family:Tahoma, Geneva, sans-serif; font-size:12px}
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{display: block}
button,input[type=submit],input[type=reset],input[type=button]{cursor:pointer;overflow:visible}
ul, ol {list-style:none;}
img{border:0}

/* layout */
body {background-color:#f1f1f1;}
.wrapper {position:relative; width:1024px; margin:0 auto;}
.header {position:relative; height:79px; padding:0 100px 0 30px; background-color:#fff;}
.header .logo {float:left; width:190px; margin:10px 0 0 0;}
.header .logo a {display:block; width:190px; height:60px; overflow:hidden; text-align:-999px; font-size:0; background:url('../img/logo.gif') no-repeat 0 0;}
.header .topMenu {float:right; height:38px; margin:24px 0 0 0;}
.header .topMenu li {float:left; width:102px; padding-left:20px;}
.header .topMenu li a {display:block; width:102px; height:38px; overflow:hidden; text-indent:-999px; font-size:0; background:url('../img/menu.gif') no-repeat 0 0; border:1px solid #fff;}
.header .topMenu li.ceo a {background-position:0 0;}
.header .topMenu li.corp a {background-position:-150px 0;}
.header .topMenu li.contact a {background-position:-300px 0;}
.header .topMenu li.product a {background-position:-450px 0;}
.header .topMenu li.ceo a.on,
.header .topMenu li.ceo a:hover {background-position:0 -50px;}
.header .topMenu li.corp a.on,
.header .topMenu li.corp a:hover {background-position:-150px -50px;}
.header .topMenu li.contact a.on,
.header .topMenu li.contact a:hover {background-position:-300px -50px;}
.header .topMenu li.product a.on,
.header .topMenu li.product a:hover {background-position:-450px -50px;}
.header .topMenu li a.on,
.header .topMenu li a:hover {border:1px solid #0384ce;}
.footer {height:86px; background:url('../img/footer.gif') no-repeat 0 0;}

/* main */
.main_banner {position:relative; height:391px;}
.main_banner .img {display:block; position:relative;}
.img .sub{position:absolute; filter : alpha(opacity:100);}
.main_banner .btns {position:relative; width:80px;}
.main_banner .btns a {display:block; width:39px; height:39px; overflow:hidden; text-indent:-999px; font-size:0; background:url('../img/btn_main_move.gif') no-repeat;}
.main_banner .btns .prev {float:left; background-position:0 0; position:absolute; left:420px;top:270px;}
.main_banner .btns .next {float:right; background-position:0 -50px; position:absolute; left:462px;top:270px;}
.main_cont {position:relative;}
.main_cont .product {width:83px; height:48px; padding:101px 0 0 153px; background:url('../img/main_product.gif') no-repeat 0 0;}
.main_cont .product p {display:none;}
.main_cont .product a {display:block; width:63px; height:28px; overflow:hidden; text-indent:-999px; font-size:0;}
.main_cont .imgList {position:absolute; left:236px; top:0; width:487px; height:130px; padding:19px 0 0 39px; background-color:#0384ce;}
.main_cont .imgList .listArea {overflow:hidden; width:448px;}
.main_cont .imgList .listArea .item {float:left; padding-right:8px;}
.main_cont .imgList .listArea .item.last {padding:0;}
.main_cont .imgList .listArea .item img {display:block;}
.main_cont .imgList .btns a {position:absolute; top:63px; display:block; width:14px; height:22px; overflow:hidden; text-indent:-999px; font-size:0; background:url('../img/btn_main_product.gif') no-repeat;}
.main_cont .imgList .btns .prev {left:11px; background-position:0 0;}
.main_cont .imgList .btns .next {right:11px; background-position:0 -30px;}
.main_cont .cooperator {position:absolute; right:0; top:0; width:262px; height:149px; background:#fff url('../img/main_tit_cooperator.gif') no-repeat 24px 7px;}
.main_cont .cooperator .title {display:none;}
.main_cont .cooperator ul {margin:60px 0 0 20px;}
.main_cont .cooperator ul li {float:left; padding-left:4px;}

/* layer */
.layer {position:absolute; left:0; top:79px; width:1024px; height:540px; z-index:10; display:none;}
.layer .bg {position:absolute; left:0; top:0; width:100%; height:100%; z-index:11; background:#000; opacity:0.9; filter:alpha(opacity=90);}
.layer .cont {position:absolute; left:0; top:0; width:100%; height:100%; z-index:12;}
.layer .cont .btns a {position:absolute; top:215px; display:block; width:60px; height:80px; overflow:hidden; text-indent:-999px; font-size:0; background:url('../img/btn_layer_arr.png') no-repeat 0 0; z-index:15;}
.layer .cont .btns .prev {left:0; background-position:0 0;}
.layer .cont .btns .next {right:0; background-position:0 -80px;}

/* product */
.productView {position:relative; width:1024px; height:540px;}
.productView .tit {width:590px; margin:0 auto 15px; padding-top:27px;}
.cont .viewerImg {width:484px; margin:0 auto; border-top:1px solid #414141; border-right:1px solid #ebff62; border-bottom:1px solid #ebff62;}
.cont .viewerImg .img {}
.cont .viewerImg .img img {display:block;}
.cont .viewerImg .desc {padding:10px; background-color:#414141; color:#fff;}
.cont .viewerThumb {position:absolute; left:0; bottom:0; width:100%; height:81px;}
.cont .viewerThumb div li {position:relative; float:left;}
.cont .viewerThumb div li img {display:block;}
.cont .viewerThumb div li .title {position:absolute; left:0; top:-29px; height:25px; background:url('../img/bg_product_tit.png') no-repeat 0 0; display:none;}
.cont .viewerThumb div li .title span {float:left; display:block; height:17px; padding:0 3px; line-height:17px; background-color:#00baff; white-space:nowrap;}
.cont .viewerThumb div li .dimmed {position:absolute; left:0; bottom:0; width:100%; height:52px; background-color:#000; opacity:0.5; filter:alpha(opacity=50);}
.cont .viewerThumb div li.on {margin-top:-2px; border-top:2px solid #00baff;}
.cont .viewerThumb div li.on .dimmed {display:none;}
.cont .viewerThumb div li.on .title {display:block;}
.cont .viewerThumb .btns a {top:29px; width:27px; height:52px; background:url('../img/btn_product_list.gif') no-repeat;}
.cont .viewerThumb .btns .prev {background-position:0 -60px;}
.cont .viewerThumb .btns .next {background-position:0 0;}
.cont .viewerThumb .btns .prev:hover {background-position:-30px -60px;}
.cont .viewerThumb .btns .next:hover {background-position:-30px 0;}

/* normal content */
.contArea {padding:40px; text-align:center;}
a{cursor:pointer;}