

.container{ width:770px; padding:0px;}
.row{ margin:0px;}
.box{width:770px; min-width:770px;float:left;}

.top-box{z-index:151;width:100%; box-sizing:border-box; margin-top:0; padding:0px;transition-duration: .3s;}
.logo{ display:inline-block; margin:10px 0px;}
.logo1{ display:inline-block;}
.logo2{ display:none;}
.logo3{ display:none;}
.top-box:hover .logo1{ display:none;}
.top-box:hover .logo2{ display:inline-block;}


.top-right{ font-size:0px; }
.top-nav{ display:inline-block;text-align:left; font-size:0px; line-height:0px; }
.top-nav li{position:relative; display:inline-block; vertical-align:text-bottom; padding:0px 22px;}
.top-nav li>a{ position:relative; display:inline-block; font-size:16px; line-height:96px; height:96px; color:#333;opacity:1;transition-duration: .3s;  }
.top-box:hover .top-nav li a{color:#333;transition-duration: .3s;}
.top-nav li a:after{ content:""; position: absolute;  z-index:-1;width:0%;height:2px;bottom: 20px;left:50%;background-color:#fff;transition-duration: .3s;}
.top-nav li:hover a:after{width:100%;left: 0%;bottom:0px;transition-duration: .3s;}
.top-nav li.on a:after{width:100%;left: 0%;transition-duration: .3s;}
.top-box:hover li.on>a{ color:#14a25e;transition-duration: .3s;}
.top-box:hover .top-nav li a:after{ background:#14a25e;transition-duration: .3s;}

.top-box a.search-buttom{ float:right; position:relative;display:inline-block; width:30px; height:100px; margin-right:20px;background:url(../images/icon-ss1.png) center no-repeat;opacity:1;transition-duration: .3s; }
.top-box a.language{ float:right;display:inline-block;width:30px; height:100px; margin-right:20px;background:url(../images/icon-en1.png) center no-repeat;opacity:1;transition-duration: .3s; }
.top-box:hover a.search-buttom{background:url(../images/icon-ss2.png) center no-repeat;}
.top-box:hover a.language{background:url(../images/icon-en2.png) center no-repeat;}
.top-box a.search-buttom:hover{opacity:0.7;transition-duration: .3s; }
.top-box a.language:hover{opacity:0.7;transition-duration: .3s; }
/*导航初始效果*/

.top-box.top-fixed{ position:fixed; z-index:151; left:0; top:0; padding:0px 40px; margin:0px;background:#fff;box-shadow:0px 0px 3px rgba(0,0,0,.6);}
.top-fixed .logo1{ display:none;}
.top-fixed .logo2{ display:inline-block;}
.top-fixed .logo3{ display:none;}
.top-fixed .top-nav li a{ position:relative; color:#333;}
.top-fixed .top-nav li a:after{ background-color:#14a25e;transition-duration: .3s;}
.top-fixed .top-nav li a:hover:after{width: 100%;left: 0%; transition-duration: .3s;}
.top-fixed .top-nav li.on>a{color:#14a25e;transition-duration: .3s;}
.top-fixed .top-nav li.on a:after{ width:100%; left:0px; background:#14a25e;transition-duration: .3s;}

.top-fixed a.search-buttom{background:url(../images/icon-ss2.png) center no-repeat;}
.top-fixed a.language{background:url(../images/icon-en2.png) center no-repeat;}
/*页面滚动后导航效果*/

.top-box .search-box{ position:absolute; display:none; top:100%; right:40px; background:#f7f7f7; font-size:0px;box-shadow:0px 1px 2px rgba(0,0,0,.4);}
.top-box .search-box input{ display:inline-block; vertical-align:text-bottom; width:200px; height:29px; margin:11px 25px 11px 25px; border:none; border-bottom:1px solid #e0e0e0; background:none; font-size:14px; line-height:29px; color:#333;}
.top-box .search-box .search{ position:relative; display:inline-block; vertical-align:text-bottom; width:80px; height:51px; }
.top-box .search-box .search:before{ content:""; position: absolute; z-index:2;width: 100%;height: 100%;bottom: 0px;left: 0%;background:url(../images/icon-ss2.png) no-repeat center;}
.top-box .search-box .search:hover:before{;background:url(../images/icon-ss1.png) no-repeat center;}
.top-box .search-box .search:after{ content:""; position: absolute; z-index:1;width: 0%;height: 100%;bottom: 0px;left: 50%;background-color:#14a25e;transition-duration: .3s;}
.top-box .search-box .search:hover:after{width: 100%;left: 0%;background-color:#14a25e;transition-duration: .3s;}
/*搜索弹出*/
@media (max-width:1250px) {
.top-box{ position:absolute; z-index:151;width:100%; box-sizing:border-box;padding:0px 20px;}
.top-box:hover{padding:0px 20px; transition-duration: .3s;}
.top-box.top-fixed{padding:0px 20px;}

.top-box .logo2{ display:inline-block;}
.top-box .logo2{ display:none;}
.top-box .logo3{ display:none;}
.top-box:hover .logo1{ display:none;}
.top-box:hover .logo2{ display:none;}
.top-box:hover .logo3{ display:inline-block;}
.top-fixed .logo2{ display:none;}
.top-fixed .logo3{ display:inline-block;}


.top-nav li{ display:inline-block; vertical-align:text-bottom; padding:0px 15px;}
.top-fixed .top-nav li{ display:inline-block; vertical-align:text-bottom; padding:0px 15px;}
}
/*导航页面宽度适应*/

.top-nav2{ position:absolute;z-index:9999;background:#f7f7f7; top:100%; left:0px;transform: translateX(-50%); padding:0px 20px 0px 40px; overflow:hidden; display:none;box-shadow:0px 1px 1px rgba(0,0,0,.3); border-radius:0px 0px 6px 6px;}
.top-nav2-c{ margin:auto; text-align:center;white-space:nowrap; padding:20px 0px; overflow:hidden;}
.top-nav2 img{ display:inline-block; width:200px; margin-right:20px; vertical-align:text-top;}
.top-nav2 dl{ display:inline-block; text-align:left;vertical-align:text-top; border-left:1px solid #e0e0e0; padding:0px 1px;}
.top-box .top-nav2 dl a{ position:relative; display:inline-block; color:#666; font-size:14px; line-height:32px; padding:0px 25px 0px 30px;}
.top-box .top-nav2 dl a:hover{color:#14a25e;}
.top-box .top-nav .top-nav2 dl a:after{ content:""; position: absolute;  z-index:1; width: 20px;height: 100%; bottom: 0px; left: 10px; background:url(icon-dlbg.png) no-repeat center left;opacity: 0;transition-duration: .3s;  }
.top-box .top-nav .top-nav2 dl a:hover:after{ content:""; position: absolute;  z-index:1; width: 20px;height: 100%; bottom: 0px; left: 0px; background:url(icon-dlbg.png) no-repeat center left;opacity: 1;transition-duration: .3s;  }
.top-box .top-nav2 dl:hover dd b{ color:#14a25e;}

/*nav end*/
