

.header .hd-product{display: none; width: 100%; min-width: 1200px; background-color: #2e2e2e; background-color: rgba(0,0,0,0.5); position: absolute; left: 0; top:80px; z-index: 20; }
.header .hd-product .cont{width: 1200px; margin: 0 auto; min-height: 222px; padding-bottom: 30px; overflow: hidden; position: relative; }
.header .hd-product .cont .item{width: 285px; float: left; margin-left: 19px;}
.header .hd-product .cont .item .mt{width: 260px; padding-left: 20px; height: 60px ;line-height: 60px; font-size: 18px; color: #fff; overflow: hidden;}
.header .hd-product .cont .item .mc{width: 265px;}
.header .hd-product .cont .item .mc a{display: block; width: 265px; height: 40px; line-height: 40px; margin-bottom: 10px; padding-left: 20px; background-color: #323232; font-size: 16px; color: #bbb;}
.header .hd-product .cont .item .mc a:hover{background-color: #1e1e1e; color: #fff;}
.header .hd-product .cont .item .mc span{display: inline-block; max-width: 210px; height: 40px; white-space: nowrap; margin-right: 10px; overflow: hidden; float: left;}
.header .hd-product .cont .item .mc img{float: left; margin-top: 13px;}
.header .hd-product .cont .item:first-child{margin-left: 0;}
.header .hd-product .cont .colse{display: block; width: 14px; height: 14px; border-top: 2px solid #999999; border-right: 2px solid #999999; position: absolute; bottom: 9px; left: 50%; margin-left: -5px; transform:rotate(-45deg);}

.header .zhuantispecial .cont .item{width: auto; float: none; margin-left: 0; padding-bottom: 1px; overflow: hidden;}
.header .zhuantispecial .cont .item .mt{width: 260px; padding-left: 20px; height: 60px ;line-height: 60px; font-size: 18px; color: #fff; overflow: hidden;}
.header .zhuantispecial .cont .item .mc{width: 265px; padding-right: 20px; margin: 0 20px 10px 0; float: right;}
.header .zhuantispecial .cont .item .mc a{display: block; width: 265px; height: 40px; line-height: 40px; margin-bottom: 10px;  padding-left: 20px; background-color: #323232; font-size: 16px; color: #bbb;}
.header .zhuantispecial .cont .item .mc a:hover{background-color: #1e1e1e; color: #fff;}
.header .zhuantispecial .cont .item .mc span{display: inline-block; max-width: 210px; height: 40px; white-space: nowrap; margin-right: 10px; overflow: hidden; float: left;}
.header .zhuantispecial .cont .item .mc img{float: left; margin-top: 13px;}
.header .zhuantispecial .cont .item:first-child{margin-left: 0;}
.header .zhuantispecial .cont .colse{display: block; width: 14px; height: 14px; border-top: 2px solid #999999; border-right: 2px solid #999999; position: absolute; bottom: 9px; left: 50%; margin-left: -5px; transform:rotate(-45deg);}


.header-active{background-color: #ffffff; box-shadow: 0 2px 4px rgba(0,0,0,0.15);}
.header-active .logo{background: url("../images/logo160x80-color.png") no-repeat;}
.header-active .phone{background: url("../images/phone-icon2.png") no-repeat 0 25px; color: #999;}
.header-active .nav li a{color: #555;}
.header-active .nav li a:hover{font-weight: bold; color: #333;}
.header-active .nav li.cur a{font-weight: bold; color: #333; background: none;}
.header-active:hover{background-color: #fff;}

/*右边小导航*/
.toolbar-tabs{width: 53px; position: fixed; right: 0; top:360px; border: 1px solid #2f2c29; background-color: #1e1e1e; border-right: none; z-index: 90;}
.toolbar-tabs .bar{width: 53px; height: 70px; position: relative;}
.toolbar-tabs .bar:before{display: block; width: 36px; height: 1px; background-color: #2f2f30; content: ''; position: absolute; top:-1px; left: 9px;}
.toolbar-tabs .bar:first-child:before{display: none;}
.toolbar-tabs .bar a{display: block; width: 53px; height: 70px;}
.toolbar-tabs .box{display: none; width: 150px; position: absolute; left: -150px; top:0;}

.toolbar-tabs .qq a{background: url("../images/before-icon.png") no-repeat 15px 22px;}
.toolbar-tabs .top{margin-top: 10px;}
.toolbar-tabs .top a{background: url("../images/before-icon.png") no-repeat 15px -170px;}

.toolbar-tabs .wechat a{background: url("../images/before-icon.png") no-repeat 14px -48px;}
.toolbar-tabs .wechat-cont{width: 120px; height: 120px; padding: 10px; background-color: #1e1e1e;}
.toolbar-tabs .wechat-cont:before{display: block; width: 0; height: 0; content: ''; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid #1e1e1e; position: absolute; left:140px; top:28px; }

.toolbar-tabs .phone a{background: url("../images/before-icon.png") no-repeat 14px -118px;}
.toolbar-tabs .phone-cont{width: 116px; padding: 0 12px; background-color: #1e1e1e;}
.toolbar-tabs .phone-cont:before{display: block; width: 0; height: 0; content: ''; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid #1e1e1e; position: absolute; left:140px; top:28px; }
.toolbar-tabs .phone-cont span{display: block; width: 115px; height: 39px; text-align: center; line-height: 39px; color: #cccccc; font-size: 16px; border-top: 1px solid #2f2f30;}
.toolbar-tabs .phone-cont span:hover{color: #fff;}
.toolbar-tabs .phone-cont span:first-child{border-top: none;}

.toolbar-tabs .top:hover a{background: url("../images/after-icon.png") no-repeat 15px -170px;}
.toolbar-tabs .qq:hover a{background: url("../images/after-icon.png") no-repeat 15px 22px;}
.toolbar-tabs .qq:hover .box{display: block;}
.toolbar-tabs .phone:hover a{background: url("../images/after-icon.png") no-repeat 14px -118px;}
.toolbar-tabs .phone:hover .box{display: block;}
.toolbar-tabs .wechat:hover a{background: url("../images/after-icon.png") no-repeat 14px -48px;}
.toolbar-tabs .wechat:hover .box{display: block;}



/*底部banner*/
.bottom-banner {width: 100%; height: 162px; position: fixed; left: 0; bottom: 0; z-index: 80; overflow: hidden;}
.bottom-banner .bottom-banner-small {position: absolute; left: -999px; top: 0; opacity: 0;}
.bottom-banner .bottom-banner-big {width: 100%; position: absolute; top: 0; left: 0; opacity: 1;}
.bottom-banner .bbb-pic {width: 1190px; margin: 0 auto; position: relative; opacity: .95; filter: alpha(opacity=95); z-index: 999;}
.bottom-banner .bbb-pic em {display: block; width: 40px; height: 40px; opacity: .5; filter: alpha(opacity=50); position: absolute; top: 25px; right: -55px; background: url("../images/clear25x25.png") center center no-repeat; cursor: pointer;}
.bottom-banner .bbb-pic em:hover {animation: 1.2s clear_rotating;}
.bottom-banner .bbb-bg {width: 100%; height: 150px; position: absolute; top: 22px; left: 0; opacity: .8; filter: alpha(opacity=80); background: #000; }



.ide-layer{width: 630px; border: 1px solid #dbdbdb; box-shadow: 0 0 15px rgba(0,0,0,0.3); background-color: #fff; z-index: 500; position: fixed; left: 50%; margin-left: -315px; top:50%; margin-top: -220px;}
.ide-layer .ide-del{display: block; width: 40px; height: 40px; background: url("../images/ide-del.png") no-repeat; position: absolute; right: -16px; top:-16px; box-shadow: 4px -4px 4px rgba(0,0,0,0.1); border-radius: 20px; overflow: hidden;}
.ide-layer .mt{padding-top: 40px;}
.ide-layer .mt p{color: #201e3b; font-size: 16px; padding-left: 30px;}
.ide-layer .mt p span{color: #2f72ba; padding: 0 3px;}

.ide-layer .mt .serve-btn{display: block; width: 158px; text-align: center; border-radius: 4px; padding-left: 30px; height: 48px; line-height: 48px; color: #ffffff; font-size: 18px; background: #68a5e1 url("../images/ide-qq-icon2.png") no-repeat 20px center; border: 1px solid #3883cc; box-shadow: 0 0 2px rgba(0,0,0,0.1); margin:30px auto;  }
.ide-layer .mt a:hover.serve-btn{background-color: #5696d5; transition:background 120ms;}
.ide-layer .mt .area-cont{padding-left: 30px; border-bottom: 2px solid #e2e2e2; height: 38px;}
.ide-layer .mt .area-cont dt{float: left; font-size: 16px; height: 30px; line-height: 25px; color: #201e3b; margin-right: 25px;}
.ide-layer .mt .area-cont dd{float: left; height: 38px;}
.ide-layer .mt .area-cont dd a{display: inline-block; height: 38px; line-height: 25px; padding: 0 15px; color: #201e3b; font-size: 16px;}
.ide-layer .mt .area-cont .cur a{border-bottom: 2px solid #e73642; position: relative;}


.ide-layer .mc{width: 560px; padding: 28px 0 20px 70px; background-color: #f8f8f8;}
.ide-layer .mc ul{overflow: hidden;}
.ide-layer .mc ul li{width: 270px; height: 45px; float: left; overflow: hidden; margin-bottom: 16px;}
.ide-layer .mc ul li a{display: inline-block; padding: 0 15px 0 48px; height: 43px; line-height: 43px; font-size: 16px; color: #0073b6;  background:#fff url("../images/ide-qq-icon.png") no-repeat 12px 9px; border: 1px solid #e6e6e6; border-radius: 4px;}
.ide-layer .mc ul li a:hover{background:#68a5e1 url("../images/ide-qq-icon2.png") no-repeat 12px 9px / 22px 25px; color: #fff; transition:background 200ms;}










