@charset "utf-8";



/* mobile nav */
.mnav{position: relative;z-index: 900; display: none;}
.mnav.scroll-down .mheader{top:-100px;}
.mnav.scroll-top .mheader,.mnav.scroll-top .mheader{top:0px;background: #fff;}
.mnav.scroll-top .mheader .mlogo,.mnav.scroll-top .mheader .mlogo{background: url("../images/logo.png") left center no-repeat;background-size: 100%;}


.mnav.scroll-down .menu-toggle span.hamburger,
.mnav.scroll-down .menu-toggle span.hamburger:after,
.mnav.scroll-down .menu-toggle span.hamburger:before,
.mnav.scroll-down .menu-toggle span.cross:before,
.mnav.scroll-down .menu-toggle span.cross:after,
.mnav.scroll-top .menu-toggle span.hamburger,
.mnav.scroll-top .menu-toggle span.hamburger:after,
.mnav.scroll-top .menu-toggle span.hamburger:before,
.mnav.scroll-top .menu-toggle span.cross:before,
.mnav.scroll-top .menu-toggle span.cross:after
{background:#000;}

.nav-container {padding-top: 90px;}

.mheader {height:50px;position:fixed;left:0;top: 0;z-index: 93;width: 100%;overflow: hidden;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}
.mheader ul {height:50px;position: relative;padding:0 3%;margin: 0;}
.mlogo {left: 10px;
    top: 50%;
    position: absolute;
    z-index: 94;
    display: block;
    width: 84px;
    height: 39px;
    margin-top: -18px;
    background: url(../images/logo.png) left center no-repeat;
    background-size: 100%;
    -webkit-transition: none;
    -moz-transition: none;
    transition: none;}
.mlanguage {padding:10% 0;text-align: center;}
.mlanguage a{display: inline-block;margin:0 2%;color: #666;font-size: 14px;}
.mlanguage a:hover {opacity: 1;}

.cd-nav{margin: 0;padding: 0; }
.cd-nav li{width:80%;margin: auto;padding: 0;overflow:hidden;position: relative;}
.cd-nav a{ border-bottom:#313131 1px solid;position: relative; display: block;width:90%;font-weight: bold;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;font-size:17px; color:#fff;padding:5% 0; margin:0px auto;text-transform:uppercase;}
.cd-nav a:hover,.twonav.curr{color:#00bf86;}
.cd-nav li a.twonav {background: url(../images/right3.png) right center no-repeat;background-size: 3%;}
.no-touch .mheader{background-color: #1a1a1a;}

.menu-toggle {display: block;width:50px;height:50px; position:absolute;right:0px;top:0px;z-index: 9999;}
.cd-nav-trigger {width: 100%;height: 100%;display: block;}
.menu-toggle span.hamburger,
.menu-toggle span.hamburger:after,
.menu-toggle span.hamburger:before {content:"";display:block;width:24px;height:3px;background:#333;position:absolute;top:50%;margin-top:-1px;left:50%;margin-left:-12px;-webkit-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-o-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-o-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-delay:0.15s;}
.menu-toggle span.hamburger,
.menu-toggle span.hamburger:after,
.menu-toggle span.hamburger:before {content:"";display:block;width:24px;height:3px;background:#333;position:absolute;top:50%;margin-top:-1px;left:50%;margin-left:-12px;-webkit-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-o-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-o-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-delay:0.15s;}
.menu-toggle span.hamburger:after {margin-top:-7px;top:0;transition-delay:0.27s;}
.menu-toggle span.hamburger:before {margin-top:7px;top:0;transition-delay:0.2s;}
.no-touch .menu-toggle span.hamburger,
.no-touch .menu-toggle span.hamburger:after,
.no-touch .menu-toggle span.hamburger:before {transition-delay:0.12s;-webkit-transform:translateX(-70px);-moz-transform:translateX(-70px);-ms-transform:translateX(-70px);-o-transform:translateX(-70px);transform:translateX(-70px);}
.no-touch .menu-toggle span.hamburger,
.no-touch .menu-toggle span.hamburger:after,
.no-touch .menu-toggle span.hamburger:before {-webkit-transform:translateX(70px);-moz-transform:translateX(70px);-ms-transform:translateX(70px);-o-transform:translateX(70px);transform:translateX(70px);}
.no-touch .menu-toggle span.hamburger:after {transition-delay:0s;}
.no-touch .menu-toggle span.hamburger:before {transition-delay:0.07s;}
.menu-toggle span.cross:before,
.menu-toggle span.cross:after {content:"";display:block;width:24px;height:3px;background:#333;position:absolute;top:50%;margin-top:-1.5px;left:50%;margin-left:-12px;-webkit-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-o-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-o-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transform:translateY(-70px) translateX(-70px) rotate(45deg);-moz-transform:translateY(-70px) translateX(-70px) rotate(45deg);-ms-transform:translateY(-70px) translateX(-70px) rotate(45deg);-o-transform:translateY(-70px) translateX(-70px) rotate(45deg);transform:translateY(-70px) translateX(-70px) rotate(45deg);transition-delay:0.12s;}
.menu-toggle span.cross:after {transition-delay:0s;-webkit-transform:translateY(70px) translateX(-70px) rotate(-45deg);-moz-transform:translateY(70px) translateX(-70px) rotate(-45deg);-ms-transform:translateY(70px) translateX(-70px) rotate(-45deg);-o-transform:translateY(70px) translateX(-70px) rotate(-45deg);transform:translateY(70px) translateX(-70px) rotate(-45deg);}
.menu-toggle span.cross:after {-webkit-transform:translateY(-70px) translateX(70px) rotate(-45deg);-moz-transform:translateY(-70px) translateX(70px) rotate(-45deg);-ms-transform:translateY(-70px) translateX(70px) rotate(-45deg);-o-transform:translateY(-70px) translateX(70px) rotate(-45deg);transform:translateY(-70px) translateX(70px) rotate(-45deg);}
.no-touch .menu-toggle span.cross:before {transition-delay:0.12s;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);}
.no-touch .menu-toggle span.cross:after {transition-delay:0.24s;-webkit-transform:rotate(-45deg) !important;-moz-transform:rotate(-45deg) !important;-ms-transform:rotate(-45deg) !important;-o-transform:rotate(-45deg) !important;transform:rotate(-45deg) !important;}

.cd-nav-container{background-color:#1a1a1a;position: fixed; z-index:91; top:0px; right: 0; width: 100%;height:100%;overflow-y: auto;overflow-x: hidden; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); -webkit-transition: -webkit-transform 0.4s 0s, box-shadow 0s 0.4s; -moz-transition: -moz-transform 0.4s 0s, box-shadow 0s 0.4s; transition: transform 0.4s 0s, box-shadow 0s 0.4s;}
.cd-nav-container.is-visible{-webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0);-webkit-overflow-scrolling: touch;}

.cd-overlay{position: fixed; height: 100%; width: 100%; top: 0; left: 0; cursor: pointer; visibility: hidden; opacity: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: opacity 0.4s 0s, visibility 0s 0.4s; -moz-transition: opacity 0.4s 0s, visibility 0s 0.4s; transition: opacity 0.4s 0s, visibility 0s 0.4s; z-index:19;}
.cd-overlay.is-visible{opacity: 1; visibility: visible; -webkit-transition: opacity 0.4s 0s, visibility 0s 0s; -moz-transition: opacity 0.4s 0s, visibility 0s 0s; transition: opacity 0.4s 0s, visibility 0s 0s;}

.msearch {margin: 20px auto;width: 72%;}
.msearch .icon{position: relative;}
.msearch .minput{border: none;border-bottom: 1px solid #313131;background: none; width: 100%;height: 30px;font-size: 12px;outline: none;color: #fff;}
.msearch .msubmit{display: block;width: 18px;height: 18px;position: absolute;right: 0;top: 50%;margin-top: -9px; background: url("../images/ss1.png") center no-repeat;background-size: 100% ;opacity: .3;}
.minput::-moz-input-placeholder,.minput::-ms-input-placeholder,.minput::-webkit-input-placeholder {color:#333;}
input.minput[type="text"]::-webkit-input-placeholder {color:#333;}


.mchildren {display:none;width:90%;border-bottom: 1px solid #313131; margin:0px auto;padding:10px 0;position: relative;}
.mchildren a{border-bottom:none;position: relative; display: block;width:90%;font-size:15px; color:#ccc;padding:0.8em 0;}
.mchildren a:hover{background:none; color:#00bf86;}
.mchildren a.threenav {background: url(../images/right3.png) right center no-repeat;background-size:2%;}


.shownav-c {position: relative;width: 100%;height: 0px;overflow: hidden;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;}
.shownav-c.cur {height: auto;}
.shownav-c  ul {list-style: none;margin:auto;padding: 0;display:block;width: 90%;height: 100%;}
.shownav-c  ul li{list-style: none;margin: 0;padding: 0;display:block;;width:100%;}
.shownav-c  ul li a {font-weight: bold;border-bottom:#313131 1px solid;position: relative; display: block;width:90%;text-align: left; font-size:14px; color:#999;padding:4% 0; margin:0px auto;text-transform:uppercase;}
.closenav {display: block;font-size: 14px;color: #fff;position: absolute;left:5%;top: 10%;background: url("../../product/images/left4.png") left center no-repeat;padding-left: 30px;}
.closenav:hover {color: #fff;}

.shownav-d {padding:10px;width:90%;margin:auto;border-bottom:#313131 1px solid;display: none;}
.shownav-d.cur {display: block;}
.shownav-d a{display: block;color: #999!important;padding:4% 5%!important;font-size:14px!important;width:90%!important;border: none!important;}
.shownav-d a::after {display: none!important;}

.cd-nav li ul div ul li a:last-child {border: none;}
.interesting-list a .text h3 {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}




@media screen and (max-width: 1680px) {
    input[type="button"], input[type="submit"], input[type="reset"],input[type="text"],input[type="password"],input::-webkit-input-placeholder,textarea::-webkit-input-placeholder,input::-moz-input-placeholder,textarea::-moz-input-placeholder,input::-ms-input-placeholder,textarea::-ms-input-placeholder {font-size:12px;}

    @keyframes topdown2{0% { top:0;} 50%{ top:2%; }100%{ top:0; }}
    @keyframes topdown{0% { top:10%;} 50%{ top:12%; }100%{ top:10%; }}
}
@media screen and (max-width: 1600px) {

}
@media screen and (max-width: 1440px) {
    .header-nav-show {top: 83px;}
    .contact-section .content .left {width: 55%;}
    .contact-section .content .right {width: 40%;}
    .content-form li .submit1 {width: 100%;}
    .banner-slide .txt h1 {font-size:40px;}
    .banner-slide .txt h4 {font-size: 14px;line-height: 24px;}

    .banner-slide .txt h2 {font-size:40px;line-height:50px;padding: 10px 0 15px 0;}
    .banner-slide .txt h3 {font-size: 14px;padding: 15px 0;}
    .banner-slide .txt {margin-top: -100px;}
}
@media screen and (max-width: 1366px) {
    .contact-section .content .left .content-way li span h5 {font-size: 12px;}
    .header .content .right .search {width: 100px;}
    .header .content .center .nav li a {font-size: 14px;padding: 0 20px;}

}
@media screen and (max-width: 1280px) {
    .contact-section .content,.index-newscenter,.header-nav-show .content, .footer .content,.screen-banner-bottom-nav {width: 90%;}
    .header .content .center .nav li a {line-height: 75px;}
    .header .content .right {padding-top: 25px;}
    .header .content .right .language .icon {font-size: 12px;line-height: 18px;}
    .index-products-center .top .text,.interesting-detail-text,.evcharger-data .item li h5 {font-size: 14px;line-height: 24px;}
    .header-nav-show .content .nav-content {padding: 3% 0;}
    .header .content .left {height: 75px;}
    .header-nav-show {top:76px;}
    .header-height {height: 75px;}

    .item-nav .right-nav {width: 71%;}
    .banner-slide .txt h4,.our-project-swiper-3 .text h6,.page-banner .text h6,.interesting-video-list .item .text h5,.download-list a .text h5 span,.download-list-bottom a .text h5 span {font-size: 12px;line-height: 22px;}

}
@media screen and (max-width: 1152px) {
    .inside-pages .header .content .left .stockcode {margin-left: 110px;padding-left: 10px;}
    .header .content,.header-nav-show .content, .footer .content,.contact-section .content,.index-interesting  {width: 94%;}
    .header .content .center .nav li a {padding: 0 5px;}
    .item-nav .left.w50 {width: 60%;}
    .item-nav .cnav {width: 20%;padding: 0 5% 0 5%;}
    .item-nav .left {padding-right:5%;}
    .item-nav .cnav .email h3 a {font-size: 18px;}
    .item-nav .cnav li a h4,.screen-banner-swiper .screen-banner-slide .btn-2 a span,.interesting-list a .text h5,.video-list-bottom a .text h3,.evcharger-data .item li h5,.product-range-list .item-2 .text h5,.index-about .title-style h6 {font-size: 12px;line-height: 22px;}
    .item-nav .cnav li {padding: 0px 0 10px 0;}
    .item-nav .cnav li a {padding-bottom: 10px;}
    .banner-slide .txt h1 {font-size:30px;}
}
@media screen and (max-width: 1024px) {
    .index-products-center h2 {
        font-size: 50px;
    }
}
@media screen and (max-width: 860px) {
    .header,.aside-top,.pcshow  {display: none!important;}
    .mnav,.mbshow {display: block!important;}
    .inside-pages .menu-toggle span.hamburger,.inside-pages .menu-toggle span.hamburger:after,.inside-pages .menu-toggle span.hamburger:before,.inside-pages .menu-toggle span.hamburger,.inside-pages .menu-toggle span.hamburger:after,.inside-pages .menu-toggle span.hamburger:before,.inside-pages .menu-toggle span.cross:before,.inside-pages .menu-toggle span.cross:after,.no-touch .menu-toggle span.cross:after,.no-touch .menu-toggle span.cross:before{background: #fff;}
    .header-height,.product-detail .header-height {height:50px;}
    .index-banner-swiper .swiper-slide {background: #000;}
    .banner-slide .img img.mbshow {width: 100%!important;}
    .banner-slide .txt h1 {font-size: 30px;}
    .banner-slide .txt {width:90%;left: 5%;top:20%;margin-top:0px;}
    .banner-btn a {margin-bottom: 15px;}

    .banner-slide .txt h4 {padding: 10px 0 0px 0;}
    .banner-slide .txt h1 {padding-bottom: 10px;}

    .swiper-banner-pagination {bottom: 20px;}
    .swiper-history .swiper-history-time .swiper-slide-active .text {width: 90%;}

    .banner-slide .txt h2 {font-size: 34px}
    .banner-slide .txt.center {width:90%;left:5%;}
}