﻿.top-nav{width: 100%;height: 100px;position: absolute;top: 0;left: 0;z-index: 20;font-family: "Microsoft Yahei";background: rgba(30, 33, 35, 0.8);background: url('../images/ie-bg.png') repeat;/*background: #333\9;*/animation: fadeInDown 0.5s ease 1 forwards;-moz-animation: fadeInDown 0.5s ease 1 forwards;-webkit-animation: fadeInDown 0.5s ease 1 forwards;-ms-animation: fadeInDown 0.5s ease 1 forwards;}
.top-nav .link-item{width: 120px;height: 100px;display: block;float: left;position: relative;}
.link-item em{height: 2px;width: 0;position: absolute;bottom: 0;left: 0;background-color: #f4d997;-webkit-transition: all .2s linear;-moz-transition: all .2s linear;-ms-transition: all .2s linear;-o-transition: all .2s linear;}
.link-item:hover em{width: 100px;}
.top-nav .logo{width: 250px;height: 150px;position: absolute;top: 0px;left: 60px;transition: all 0.4s;-webkit-transition: all 0.4s;}
.nav-box{width: 1010px;height: 100px;position: absolute;top: 0;right: 98px;}
.nav-link{display: block;margin-left: 185px;float: left;}
.nav-box .info{width: 100%;position: absolute;top: 100px;padding: 10px 0;background-color: rgba(30, 33, 35, 0.8);background-color: #333\9;display: none;}
.nav-box .info a{display: block;width: 100%;line-height: 40px;text-align: center;text-decoration: none;color: #e6e6e6;font-size: 16px;z-index: 10;}
.nav-box .info a:hover{color: #fff;}
.nav-link .link-li{color: #e6e6e6;width: 100px;height: 100px;text-align: center;display: block;float: left;font-size: 16px;line-height: 16px;}
.nav-link .link-li:hover{color: #fff;}
.nav-link .lang{padding-top: 32px;padding-bottom: 8px;display: block;}
.nav-link .en{color: #c7c7c7;font-size: 12px;}
.share-icon{display: block;float: left;padding-left: 15px;position: absolute;top: 0;right: 0;z-index: 10;}
.share-icon a,
.share-icon .more,
.weixin-box{width: 28px;height: 28px;display: block;float: left;background: url('../images/share_icon.png') center no-repeat;background-position: 0 0;margin-top: 33px;margin-right: 10px;transition: opacity 0.2s ease-in-out;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;opacity: 0.6;filter: alpha(opacity=60);transition: opacity 0.8s;-webkit-transition: opacity 0.5s;cursor: pointer;}
.weixin-box{background-position: -3px -2px;}
.weixin-box div{width: 120px;height: 144px;background-color: rgba(30, 33, 35, 0.8);background-color: #333\9;position: absolute;top: 100px;left: -28px;display: none;}
.weixin-box img{width: 100px;height: 100px;position: absolute;top: 10px;left: 10px;display: block;}
.weixin-box p{width: 100%;color: #fff;font-size: 14px;text-align: center;position: absolute;bottom: 8px;}
.weixin-box em,
.more-wrap em{height: 2px;width: 0;position: absolute;top: -2px;left: 0;background-color: #f4d997;-webkit-transition: all .2s linear;-moz-transition: all .2s linear;-ms-transition: all .2s linear;-o-transition: all .2s linear;}
.share-icon .weibo{background-position: -42px -1px;}
.share-icon .tieba{background-position: -82px -2px;}
.share-icon .qq{background-position: -123px -2px;}
.share-icon .more{width: 33px;height: 33px;background-position: -162px -1px;position: relative;cursor: pointer;margin-right: 0;}
.share-icon .more-wrap{width: 48px;height: 148px;position: absolute;top: 29px;left: 0;padding-top: 12px;display: block;background-color: rgba(30, 33, 35, 0.8);background-color: #333\9;}
.more-wrap p{width: 100%;color: #fff;font-size: 12px;text-align: center;display: block;margin-top: -5px;}
.share-icon a:hover,
.share-icon .more:hover,
.weixin-box:hover{opacity: 1;filter: alpha(opacity=100);}

/* fixed-nav*/
.top-nav-fixed{height: 70px;position: fixed;top: 0;left: 0;transition: all 0.4s;-webkit-transition: all 0.4s;}
.top-nav-fixed .top-buy-btn{margin-top: 13px;}
.top-nav-fixed .nav-box{height: 70px;}
.top-nav-fixed .top-nav .link-item{height: 70px;transition: all 0.4s;-webkit-transition: all 0.4s;}
.top-nav-fixed .nav-link .link-li{height: 70px;transition: all 0.4s;-webkit-transition: all 0.4s;}
.top-nav-fixed .nav-link .lang{padding-top: 18px;transition: all 0.4s;-webkit-transition: all 0.4s;}
.top-nav-fixed .nav-box .info{top: 70px;}
.top-nav-fixed .share-icon a,
.top-nav-fixed .share-icon .more,
.top-nav-fixed .weixin-box{margin-top: 23px;}
.top-nav-fixed .weixin-box div{top: 70px;}
.top-nav-fixed .more-box{top: 18px;}
.top-nav-fixed .logo{width: 220px;height: 120px;top: 2px;}
.top-nav-fixed .link-item em{bottom: 30px;}

/* share*/
.more-box{width: 48px;height: 142px;position: absolute;top: 38px;left: -7px;padding-top: 46px;display: none;}
.more-box .s-link{width: 24px;height: 24px;background: url('../images/share.png') center no-repeat;margin: 2px 12px;opacity: 1;}
.container{position: relative;}
.container .more-box .s-weixin{background-position: 1px -96px;margin-top: 0;}
.container .more-box .s-weibo{background-position: 1px -124px;margin-top: 0;}
.container .more-box .s-qzone{background-position: 1px -152px;margin-top: 0;}
.container .more-box .s-qq{background-position: 1px -181px;margin-top: 0;}
.container .more-box .s-tieba{background-position: 1px -207px;margin-top: 0;}
.more-box .s-weixin:hover{background-position: -27px -96px;}
.more-box .s-weibo:hover{background-position: -27px -124px;}
.more-box .s-qzone:hover{background-position: -27px -152px;}
.more-box .s-qq:hover{background-position: -27px -181px;}
.more-box .s-tieba:hover{background-position: -27px -207px;}

/* qrcode pop*/
.qrcode-pop{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0, 0, 0, 0.8);z-index: 101;display: none;}
#qrcode_box{width: 600px;height: 490px;background: #fff;position: fixed;top: 50%;left: 50%;margin-top: -245px;margin-left: -300px;}
#qrcode_box .close{width: 44px;height: 44px;display: block;background: url('../images/close.png') center no-repeat;position: absolute;top: 30px;right: 30px;}
#qrcode_box p{color: #666;width: 100%;display: block;text-align: center;font: 16px/16px "微软雅黑";}
#qrcode_box .p-title{color: #333;font: bold 26px/26px "微软雅黑";padding-top: 104px;padding-bottom: 20px;}
#qrcode_box img{display: block;margin: 0 auto;padding: 11px;border: 1px solid #dfdfdf;margin-top: 32px;}
#qrcode_box table{width: 158px;height: 158px;display: block;margin: 0 auto;margin-left: 221px !important;}
.top-buy-btn{transition: margin-top 0.3s;display: block;cursor: pointer;width: 180px;height: 45px;background: url('../images/top-buy-btn.jpg') 0 0;float: left;margin-top: 25px;margin-left: 20px;}
.top-buy-btn:hover{background-position: 0 -45px;}
.close:hover{animation: rotateIn 1s ease 1;-moz-animation: rotateIn 1s ease 1;-webkit-animation: rotateIn 1s ease 1;-ms-animation: rotateIn 1s ease 1;}
@media screen and (max-width: 1450px){.nav-box{right: 10px;}
/*
 .top-nav .logo{width: 300px;height: 71px;position: absolute;top: 13px;left: 8px;}*/.top-nav-fixed .logo{width: 200px;height: 60px;top: 2px;}}