header{  width: 100%;  display: block;  top: 0;  left: 0;  z-index: 101;}
header .h-top{ width: 100%; height: 40px; display: inline-block; background: #004098;}
header .h-top .language{ margin-right: 20px; float: right; line-height: 40px;}
header .h-top .language a{ margin: 0 0 0 5px; color:#fff; font-size: .12rem;}
header .h-top .language a i{ margin-left: 5px; font-family: "iconfont1";}
header .h-top .language a:nth-child(2){ display: none;}
header .h-top .language:hover a:nth-child(2) { display: block;}
header .h-r{  display: inline-block;  color: #fff;  line-height: 40px;  margin-right: 10px; font-size: 12px; }
header .h-r i{ font-size: 18px; float: left; margin: 0 10px; font-family: "iconfont1";}
header .h-m{ width: 100%; height: 120px; background: #fff; float: left; position: relative; border-bottom: 1px solid #eee;}
header .h-m .left{ float: left; width: 50%; margin-top:38px; margin-left: 13px;}
header .h-m .right{ float: right; width: 48%; text-align: right; margin-top: 38px;}
header .h-m .right span{ width: 100%; float: right; font-size: 14px;}
header .h-m .right i{ width: 100%; float: right; font-size: 28px; color: #004098; margin-top: 5px;}

.topnavlist{ position: absolute; left: 0; background: #000; z-index: 9998; overflow: hidden; width: 100%; display: none;}
.AftermarketNav{ width: 100%; float: left; height: 100%;}
.AftermarketNav .list{ width: 33%; box-sizing: border-box; float: left; height: 100%; position: relative;}
.AftermarketNav .list::before{ content: ""; background: #000; width: 100%; height: 100%; float: left; opacity: .7; transition: all 0.3s ease-in-out}
.AftermarketNav .list:hover::before{ opacity: .3;}
.AftermarketNav .list:last-of-type{ width: 34%;}
.AftermarketNav .list .text{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,0); text-align: center; transition: all 0.5s ease-in-out }
.AftermarketNav .list:hover .text{ transform: translate(-50%,-50%); }
.AftermarketNav .list .text .tit{ font-size: .36rem; text-align: center; width: 100%; line-height: .6rem; float: left; color: #fff;}
.AftermarketNav .list .text p{ font-size: .16rem; text-align: center; width: 100%; line-height: .24rem; float: left; box-sizing: border-box; color: #fff; opacity: .0; padding: .1rem 5vw; display: block; font-family: "calibri",Arial, Helvetica, sans-serif; text-transform: none;}
.AftermarketNav .list .text button{ width: auto; border: none; background: #fff; opacity: 0; padding: 15px 40px; font-size: .16rem; display: inline-block; transition: opacity 0.3s ease-in-out,background 0.3s ease-in-out,color 0.3s ease-in-out;}
.AftermarketNav .list:hover .text button{ opacity: 1; transition: opacity 0.3s ease-in-out .6s;}
.AftermarketNav .list .text button:hover{ background: #004098; color: #fff; transition: background 0.3s ease-in-out,color 0.3s ease-in-out }



nav{ width: 100%;  float: left;}

nav .muen{ width: 100%;   float: left;  /*height: 70px;*/}
nav .muen .logo img{ max-width: 100%;}
header nav .muen .nav-zt ul{ float: left; margin-left: 13px;}
nav ul li{ float: left;}
nav ul li a{ color: #898a89; font-size: 0.2rem; line-height: 70px; text-transform: uppercase;  font-family: "TCCM","puhuiti",Microsoft YaHei,Arial, Helvetica, sans-serif; padding: 0 40px; border-left:1px solid #eee;  box-sizing: border-box; float: left;}
nav ul li:last-child a{ border-right: 1px solid #eee;}
nav ul li a i{ font-family: "iconfont1"; margin-right: 15px;}
nav ul li a b{ font-family: "iconfont1"; margin-left: 3px; display: none;}
nav ul li a b span{ float: left; transition: all 1s ease-in-out;}
nav ul li dl dt a:hover{ color: #004098;}

nav ul li:hover dl{ display: block; transition: all 1s ease-in-out;}
header nav .muen .nav-zt .language{ float: left; margin-right: 20px;}
header nav .muen .nav-zt .language a{ float: left;  margin: 45px 0 0 9px;}

nav ul li > a.cur,nav ul li > a:hover{ color: #004098;}
nav ul li a.cur span,nav ul li a:hover span{ border-bottom:2px solid #A9C27E;  padding-bottom: 5px;}
nav ul li > a.cur{ font-weight: bold;}

/* 切换 */
.banner{ width: 100%; float: left; position: relative; overflow: hidden;}
.banner .hd{ display: none;}
.banner li{ width: 100%; position: relative; overflow: hidden;}

.banner li img{ max-width: 100%; max-height: 100%;}
.banner li .img01{ width: 100%; float: left; opacity: 1;}
.banner li .text{ position: absolute; z-index: 4; color: #fff; text-transform: uppercase; vertical-align: middle; top: 50%; left: 50%; margin-left: -640px; transform: translateY(-50%);}

.banner li .text h2{ display: inline-block; line-height: 55px; font-size: 55px; transform: translateY(20px); opacity: 0; /*transition: 0.4s ease-in-out .8s;*/ font-family: "TCCM","puhuiti",Microsoft YaHei,Arial, Helvetica, sans-serif; color: #a3adc7; border-bottom: 5px solid #a3adc7; padding-bottom: 20px;}
.banner li .text h3{ display: inline-block; width: 100%; margin-top: 15px; font-size: 72px; font-weight: bold; transform: translateY(20px); opacity: 0; /*transition: 0.4s ease-in-out .4s;*/ font-family: "TCCM","puhuiti",Microsoft YaHei,Arial, Helvetica, sans-serif;}
.banner li .text span{ display: inline-block; width: 100%; margin-top: 15px; font-size: 16px; font-weight: bold; transform: translateY(20px); opacity: 0; /*transition: 0.4s ease-in-out .4s;*/ text-transform: none;}
.banner li .text a{ display: inline-block; margin-top: 42px; padding: 0 22px; line-height: 41px; border: 2px solid #fff; font-size: 16px; color: #fff; transform: translateY(20px); opacity: 0; /*transition: transform 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s, background .4s ease-in-out 0s, color .4s ease-in-out 0s;*/}
.banner li .text a:hover{ background: #fff; color: #000; opacity: 1;}

/* .banner li.ani-slide .text h2{ transition: 0.4s ease-in-out .4s; transform: translateY(0); opacity: 1;}
.banner li.ani-slide .text h3{ transition: 0.4s ease-in-out .8s; transform: translateY(0); opacity: 1;}
.banner li.ani-slide .text span{ transition: 0.4s ease-in-out 1.2s; transform: translateY(0); opacity: 1;}
.banner li.ani-slide .text a{ transition: transform 0.4s ease-in-out 1.6s, opacity 0.4s ease-in-out 1.6s, background .4s ease-in-out 0s, color .4s ease-in-out 0s; transform: translateY(0); opacity: 0.5;} */

.banner .prev,.banner .next{ width: 62px; height: 46px; float: right; position: absolute; bottom: 45px; text-align: center; line-height: 46px; font-family: iconfont; font-size: 18px; font-weight: bold; color: #000; right: 45px; z-index: 1113; background: #fff;}
.banner .prev{ right: 107px;}
.banner .prev:hover,.banner .next:hover{ opacity: 0.7;}
.banner .prev::after{ content: ""; position: absolute; right: 0; top: 11px; height: 23px; width: 1px; background: #cbcbcb;}




.banner-pc{ width: 100%; float: left; position: relative; overflow: hidden;}
.banner-pc .hd{ display: none;}
.banner-pc li{ width: 100%; position: relative; overflow: hidden;}

.banner-pc li img{ max-width: 100%; max-height: 100%;transition: all 1s ease-in-out;}
.banner-pc li .img01{ width: 100%; float: left; opacity: 1;}
.banner-pc li .img02{ width: 100%; float: left; opacity: 1; z-index: 3; position: absolute; left: 0; top: 0;left: 50%;
    transform: translateX(-960px);}
.banner-pc li .text{ position: absolute; z-index: 4; color: #fff; text-transform: uppercase; vertical-align: middle; top: 50%; left: 50%; margin-left: -640px; transform: translateY(-50%);transition: all 1s ease-in-out;width: 640px;}
.banner-pc li:hover .img02 img{
    float: left;
    margin-left: -200px;
}
.banner-pc li:hover .text{
    margin-left: -780px;
}

.banner-pc li .text h2{ display: inline-block; line-height: 55px; font-size: 55px; transform: translateY(20px); opacity: 0; font-family: "TCCM","puhuiti",Microsoft YaHei,Arial, Helvetica, sans-serif; color: #a3adc7; border-bottom: 5px solid #a3adc7; padding-bottom: 20px;}
.banner-pc li .text h3{ display: inline-block; width: 100%; margin-top: 15px; font-size: 72px; font-weight: bold; transform: translateY(20px); opacity: 0; font-family: "TCCM","puhuiti",Microsoft YaHei,Arial, Helvetica, sans-serif;}
.banner-pc li .text span{ display: inline-block; width: 100%; margin-top: 15px; font-size: 16px; font-weight: bold; transform: translateY(20px); opacity: 0; text-transform: none;}
.banner-pc li .text a{ display: inline-block; margin-top: 42px; padding: 0 22px; line-height: 41px; border: 2px solid #fff; font-size: 16px; color: #fff; transform: translateY(20px); opacity: 0; }
.banner-pc li .text a:hover{ background: #fff; color: #000; opacity: 1;}

.banner-pc .prev,.banner-pc .next{ width: 62px; height: 46px; float: right; position: absolute; bottom: 45px; text-align: center; line-height: 46px; font-family: iconfont; font-size: 18px; font-weight: bold; color: #000; right: 45px; z-index: 1113; background: #fff;}
.banner-pc .prev{ right: 107px;}
.banner-pc .prev:hover,.banner-pc .next:hover{ opacity: 0.7;}
.banner-pc .prev::after{ content: ""; position: absolute; right: 0; top: 11px; height: 23px; width: 1px; background: #cbcbcb;}





@media screen and (max-width: 734px){ 
    body{ overflow-x: hidden; }
    .main{ width: 100%; }
    header .h-top{ height: .4rem;}
    header .h-top .language{ font-size: .14rem; margin-right: .2rem;line-height: .4rem;}
    header .h-r{ float: left;}
    header .h-r h1{ font-size: .14rem; }
    header .h-r h2{ display: none;}
    
    header .h-m{ width: 100%; height: auto; background: #fff; float: left; position: relative; border-bottom: 1px solid #eee;}
    header .h-m .left{ float: left; width: 50%; margin:.2rem 0; box-sizing: border-box; padding: 0 .2rem;}
    header .h-m .left img{ max-width: 100%;}
    header .h-m .right{ display: none; }
    nav .muen{ position: fixed; top: 0; left: 0; z-index: 99998;}

    nav .muen .icon-m-muen{ float: left; position: absolute; top: .52rem; right: .2rem; width: .4rem; height: .4rem; transition: .6s ease-in-out .2s; z-index: 99; line-height: 0.4rem; background: #ccc; }

    nav .muen .icon-m-muen::before,nav .muen .icon-m-muen::after{ position: absolute; content: ""; width: .2rem; height: .02rem; background: #000; transition: .4s ease-in-out .1s; }
    nav .muen .icon-m-muen::before{ top: 50%; margin-top: -.08rem; left: 50%; margin-left: -.1rem;}
    nav .muen .icon-m-muen::after{ top: 50%; margin-top: .06rem; left: 50%; margin-left: -.1rem;}
    
    nav .muen .icon-m-muen i{ position: absolute; top: 50%; margin-top: -.01rem; left: 50%; margin-left: -.1rem; width: .2rem; height: .02rem; background: #000; transition: .4s ease-in-out .1s; }

    header nav .muen .nav-zt ul{ position: fixed; top: 0; right: -40vw; background: #004098; width: 40vw; height: 100vh; transition: .6s ease-in-out .2s; z-index: 99; padding: 10vh 0; box-sizing: border-box; display: flex; flex-direction: column;  align-items: top; margin: 0; }

    header nav .muen .nav-zt ul li{ width: 100%; font-size: 0; margin-bottom: .3rem; text-align: left; }
    header nav .muen .nav-zt ul li a{ padding: 0; line-height: .4rem;color: #fff; border: none; font-size: 3.8vw; width: 100%; float: left; box-sizing: border-box; padding: 0 10vw; }
    header nav .muen .nav-zt ul li a >:hover{ list-style: none; }
    nav ul li a b{ display: none;}

    nav ul li a i{ margin-right: .1rem;}
    
    .banner .prev,.banner .next{ width: .4rem; height: .3rem; float: right; position: absolute; bottom: .1rem; text-align: center; line-height: .3rem; font-family: iconfont; font-size: .16rem; font-weight: bold; color: #000; right: .1rem; z-index: 1113; background: #fff;}
    .banner .prev{ right: .5rem;}
    .banner .prev:hover,.banner .next:hover{ opacity: 0.7;}
    .banner .prev::after{ content: ""; position: absolute; right: 0; top: .05rem; height: .2rem; width: 1px;}
    


    nav.open .muen .icon-m-muen{ transform: translateX(-40vw); right: 0; background: #004098;}
    nav.open .muen .icon-m-muen::before{ transform: rotate(45deg); background: #fff; margin-top: -.01rem;}
    nav.open .muen .icon-m-muen::after{ transform: rotate(-45deg); background: #fff; margin-top: -.01rem;}
    nav.open .muen .icon-m-muen i{ display: none; }
    nav.open ul{ transform: translateX(-40vw) }
   

    .banner li .text{ margin: 0; left: 0; box-sizing: border-box; padding: 0 5vw;}
    .banner li .text h2{ display: inline-block; line-height: .18rem; font-size: .18rem; transform: translateY(20px); opacity: 0; /*transition: 0.4s ease-in-out .8s;*/ font-family: "TCCM","puhuiti",Microsoft YaHei,Arial, Helvetica, sans-serif; color: #a3adc7; border-bottom: 3px solid #a3adc7; padding-bottom: .1rem;}
    .banner li .text h3{ display: inline-block; width: 100%; margin-top: .1rem; font-size: .36rem; font-weight: bold; transform: translateY(20px); opacity: 0; transition: 0.4s ease-in-out .4s;font-family: "TCCM","puhuiti",Microsoft YaHei,Arial, Helvetica, sans-serif;}
    .banner li .text span{ display: none;}
    .banner li .text a{ display: inline-block; margin-top: .1rem; padding: 0 .12rem; line-height: .3rem; border: 2px solid #fff; font-size: .12rem; color: #fff; transform: translateY(20px); opacity: 0; transition: transform 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s, background .4s ease-in-out 0s, color .4s ease-in-out 0s;}
    .banner li .text a:hover{ background: #fff; color: #000; opacity: 1;}
    
    .banner li.ani-slide .text h2{ transition: 0.4s ease-in-out .4s; transform: translateY(0); opacity: 1;}
    .banner li.ani-slide .text h3{ transition: 0.4s ease-in-out .8s; transform: translateY(0); opacity: 1;}
    .banner li.ani-slide .text a{ transition: transform 0.4s ease-in-out 1.2s, opacity 0.4s ease-in-out 1.6s, background .4s ease-in-out 0s, color .4s ease-in-out 0s; transform: translateY(0); opacity: 0.5;} 
    


}