/* 导航 */

.header {overflow: visible; position: fixed; z-index: 7;left: 0; top: 0; width: 100%; transition-duration: .5s; }
.header .logo { padding-top:0px; flex: 0 0 98px; display: inline-block; }
.header .header-mains { height:94px; align-items: center; transition: all 0.5s; }

.flexBox { display: -webkit-box;  display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap; justify-content: space-between; }

.header.bgf,.header.bgf2 { background: #fff; border-bottom: 1px solid #d5d5d5;    width: 100%;}
.welcome-body .header.bgf {  border-bottom: none; background: #fff;}
.welcome-body .header.bgf a{color: #000000!important;}
.welcome-body .header:hover,.welcome-body .header.bgf2 { background: #fff; border-bottom: 1px solid #d5d5d5;}

.header .header-left { flex: 0 0 auto;display: inline-flex; }
.header .header-right { flex: 0 0 187px; display: inline-flex; justify-content: space-around;position: absolute;left: 30%;top:27px;}
.header-nav, .search-btn {transition: all 0.5s; }

.header.bgf .header-nav .nav-top-a, .header:hover .header-nav .nav-top-a { color: #000; }
.header.bgf .header-nav .nav-top-a:hover, .header:hover .header-nav .nav-top-a:hover {color: #21dbb0 !important; }
.nav-top-a:hover {color: #21dbb0 !important; }
.header.bgf2 .header-nav .nav-top-a, .header:hover .header-nav .nav-top-a {color: #000; }
.header.bgf2 .header-nav .nav-top-a:hover, .header:hover .header-nav .nav-top-a:hover { color: #000; }
.header-right {
 float: right;
 max-width: 7%;
}
.header-nav {flex: 0 0 auto; display: inline-flex; margin-left:147px; margin-top:13px;}
.header-nav .nav-hides-title { font-size:18px;line-height: 1.1; color: #333; padding: 26px 0;}
.header-nav .nav-item { flex: 0 0 130px; max-height:80px; }
.header-nav .nav-item:hover .nav-top-a, .header-nav .nav-item.cur .nav-top-a,.header-nav .nav-item.cur2 .nav-top-a { color: #21dbb0; }
.header-nav .hides-a-wrap {  flex: 0 0 50%; }
.header-nav .nav-hides-left {  flex: 0 0 34%; }
.header-nav .nav-top-a { display: block; text-align: center; font-size: 18px; line-height: 17px;  padding: 22px 0 30px 0; color: #fff;  transition-duration: .3s; }
.header-nav .nav-hides-right {  overflow: hidden; }
.header-nav .nav-hides-right:hover .img100 {   transform: scale(1.1); }
.header-nav .hides-a { display: block; font-size: 16px;  line-height: 36px; color: #666; transition-duration: .3s; }
.header-nav .hides-a:hover { color: #21dbb0; transform: translateX(6px); }
.header-nav .hides-a:hover:before {  background: #21dbb0; }
.header-nav .hides-a:before { content: "";  display: inline-block;   vertical-align: top;  margin-right: 6px;  width: 4px;   height: 4px; background: #000;  position: relative;   top: 16px; }
.header-nav .img100 {  transition-duration: .5s;height: 168px;}
.header-nav .nav-hides { z-index: 7; padding: 26px 0;  position: absolute; left: 0;  top: 100%; display: none;background: #f5f5f5; border-bottom:1px solid #CCC;  border-top:1px solid #CCC;}
.header-nav .nav-hides .w1170 { opacity: 0; transform: transateY(40px); transition-duration: 1s; }
.header-nav .nav-hides.cur .w1170 {  opacity: 1;   transform: transateY(0); }

.header.bgf3 {background: #fff;}
.header:hover .right-a-wrap2,.header.bgf .right-a-wrap2,.header.bgf2 .right-a-wrap2 {}
.header:hover .right-a-wrap2,.header.bgf .right-a-wrap2,.header.bgf .buy-a0,.header.bgf2 .right-a-wrap2,.header.bgf2 .buy-a0 { color: #1a1a1a;}



.selects-banner { overflow: hidden;}
.header .show-search-btn { flex: 0 0 42px; cursor: pointer; height: 46px; border-radius: 50%;  margin-left: 26px; transition-duration: .3s; background: rgba(0, 0, 0, 0.2) ; }
.nav-hides2 { width: 100%; height: auto; z-index: 7;  padding : 26px 0;  position: absolute;  left: 0; top: 100%;  display: none; background: #fff; border-bottom:1px solid #CCC;  border-top:1px solid #CCC;}
.nav-hides2 .selects-title{font-size: 24px;line-height: 1.1; color: #333; padding-bottom: 4px; padding-top: 0px;}
.nav-hides2 .w1170 {display: none;}
.w1170 { width: 1170px; }
.nav-hides2 .w1400 {width: 1170px; position:relative;}
.selects-item:hover  .txt-wrap:hover { color: #21dbb0; font-size:18px;}
.nav-hides2 .txt-wrap { line-height:20px; font-size:18px; color: #666; text-align: center; padding :20px 0; transition-duration: .3s; }

/* 产品导航左右滚动 */
.swiper-btns-wrap3 {  opacity: 0; position: absolute; z-index: 3; height: 1px;overflow: visible;width: 100%; left: 0; top: 36%; }
.swiper-btns-wrap3 .btn {  position: absolute;   display: block;  width: 24px;  height: 40px;  margin-top: 0px;  cursor: pointer;  background-position: center !important;  background-repeat: no-repeat !important;  transition: all .5s ease;
 background-color: rgba(0, 0, 0, 0.5); }
.swiper-btns-wrap3 .btn:focus {  outline: none; }
.swiper-btns-wrap3 .btn:hover { background-color: #21dbb0; }
.swiper-btns-wrap3 .prev {left: 0; background-image: url(../image/prev2.png); }
.swiper-btns-wrap3 .prev:hover {  background-image: url(../image/prev2.png); }
.swiper-btns-wrap3 .next {right: 0; background-image: url(../image/next2.png); }
.swiper-btns-wrap3 .next:hover { background-image: url(../image/next2.png); }
.selects-lists:hover .swiper-btns-wrap3 { opacity: 1;}
.selects-lists .swiper-btns-wrap3 {margin-top: -18px;}


/* 导航右边 */
.header .right-a-wrap {flex: 0 0 88px; display: inline-flex;justify-content: space-around; }
.header .right-a { position: relative; flex: 0 0 20px; height: 42px;transition-duration: .3s; }
.header .right-a:after { position: absolute; right: -24px; top: 50%; margin-top: -8px; display: inline-block;  content: ""; height: 16px; width: 1px; }

.header .show-search-btn {flex: 0 0 42px;cursor: pointer; height: 42px; border-radius: 50%; margin-right:0px;   transition-duration: .3s;   background: rgba(0, 0, 0, 0.2) url(../image/ying.png) no-repeat center; }
.header.bgf .show-search-btn, .header:hover .show-search-btn {background: rgba(0, 0, 0, 0.2) url(../image/ying.png) no-repeat center; }
.header.bgf .show-search-btn:hover, .header:hover .show-search-btn:hover { background: #21dbb0 url(../image/ying.png) no-repeat center; }
 
/*.header.bgf .header-nav .nav-top-a, .header:hover .header-nav .nav-top-a {color: #1a1a1a; }
.header.bgf .header-nav .nav-top-a:hover, .header:hover .header-nav .nav-top-a:hover { color: #3fa644; }*/

.header .language-a.language-a {display: none ; flex: 0 0 32px; text-align: center; line-height: 42px;  height: 42px; font-size: 16px; color: #333;  transition-duration: .3s;}