.wraper_info{
	position: relative;
	box-sizing: border-box;
	width: 100%;
	overflow: hidden;
}
.page{
	width: 100%;
	position: relative;
	overflow: hidden;
	font-size: 12px;
}
.section0{
	width: 100%;
	position: relative;
	background: url(/static/images/tsviewone.png) center center no-repeat;
    background-size: cover;
	height: 1420px;
    z-index: 0;
}
.text-center{
	text-align: center; 
 }
 .text-left{
   text-align: left;
 }
 .text-right{
   text-align: right;
 }
 .bold h1{
	 font-weight: bold;
 }
 .bold h2{
	font-weight: bold;
 }
.btnTitle{
	/*position: absolute;*/
 /*   left: 50%;*/
 /*   z-index: 1;*/
 /*   color: #ffffff;*/
 /*   animation: viewFrames 1s ease-in-out;*/
 /*   text-align: center;*/
 /*   transform: translate(-50%, -50%);*/
 /*   height: 567px;*/
 /*   box-sizing: border-box;*/
 /*   padding: 115px 0;*/
 /*   top: 50%;*/
}

.buttonBox{
	width: 210px;
    margin: 60px 0;
    line-height: 0;
    cursor: pointer;
    position: absolute;
    left: 50%;
    margin-left: -105px;
}
.btnTitle h2{
	 font-size: 60px;
	 font-weight: bold;
	 letter-spacing: 2px;
	 line-height: 80px;
	 margin-bottom: 20px;
}
.pinng>h2 {
	font-size:60px;
	 font-weight: bold;
	 letter-spacing: 2px;
	 line-height: 80px;
	 color: #fff;
	 margin-bottom: 20px;
}
.seppedBtnTitle{
	position: absolute;
	top: 50%;
	left:180px;
	transform: translate(0%, -50%);
}
.section7,
.section8,
.section9
{
	background-color: #000;
}
.section1,
.section2,
.section3,
.section4,
.section5,
.section10,
.section11{
	background-color: #212121;
}
.section12{
	background-color: #232323;
}
.section13{
	width: 100%;
	background: url(/static/images/pass.png) center center no-repeat;
    background-size: cover;
  
}
.section14{
	background-color: #2C2C2C;
}
.section13 .passability-tweteen-top{
	color: black;
    position: absolute;
	bottom: 30px;
    transform: translate(-50%, 0);
    left: 50%;
}
.section13 .passability-tweteen-top h3{
	color: black;
}
.section13 .passability-tweteen-top p{
	font-weight: bold;
	color: black;
}

.passability-tweteen-top span{
	bottom: -48px;
}
.section1{
	background: url(/static/images/course.png) center center no-repeat;
    background-size: cover;
    height: 910px;
}
.ViewFont h2{
    font-size: 30px;
    font-weight: bold;
    letter-spacing: 2px;
    line-height: 80px;
    margin-bottom: 20px; 
}
.section9 .tsTwo-top{
	position: absolute;
	width: 100%;
    top: 0;
    left: 50%;
    z-index: 9;
    transform: translate(-50%, -30px);
}
.ViewFont p{
    font-size: 18px;
    line-height: 24px;
    color:rgba(129,129,129,1);
}
.section1 .range{
	box-sizing: border-box;
	position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0%);
}
.section1 .range .renge-view  {
	position: relative;
	box-sizing: border-box;
	
}
.section1 .range .renge-view p{
	color: #000;
	font-size: 18px;
	font-weight: bold;
}
.section1 .range .renge-view  h2{
	color: #222D33;
}

.section1 .range .renge-view .lang{
	background: #FFFFFF;
	width: 19px;
	height: 19px;
	opacity: 0.06;
	border-radius: 50%;
	display: inline-block;
	margin:10.5px 6px;
	
}
.section1 .range .renge-view sub{
	font-size: 30px;
	color: #818181;
	line-height: 75px;
}

.fons60>h3{
	font-size: 60px;
	line-height: 75px;
	font-weight: bold;
}
.fons60>p{
	font-size: 30px;
	line-height: 42px;
}

.white {
	color: #fff;
}
.white>p{
	color: #fff;
}
.text-center{
	text-align: center;
}
.pinng,
.fons60{
	padding: 80px 0;
}
.padding{
    padding: 140px  0;
}
.pinng > h3{
	font-size: 30px;
	color: #fff;
	margin: 20px 0;
	line-height:45px;
}
.pinng > p{
	font-size: 26px;
	color: #818181;
}
.tsThree-top p{
	font-size: 18px;
	line-height: 25px;
	margin-top: 36px;
}
.section1 .range .renge-view img {
	padding-top: 50px;
	width: 60%;
}
.section3{
	background: #1a1a12;
    background-size: cover;
}
.section3 .vidbacking-active-block-back{
	top: 0;
    left: 0;
    transform: none;
}
.section3 .container_text{
	position: inherit;
    overflow: hidden;
    width: 100%;
}
.section3 .container_text .videobox video{
	object-fit: contain;
    margin: 0 auto;
    position: relative; 
    height: 100%;
    -webkit-filter: grayscale(100%);
	filter: initial;
	width: 100%;
}
.btnTitles{
	position: absolute;
    left:50%;
    top: 180px;
    transform:translate(-50%,-50%);
    z-index:1;
    color: #ffffff;
    text-align: center;
    animation: viewFrames 1s ease-in-out;
}
.section4{
	background: url(/static/images/lithium.gif) center center no-repeat;
    background-size: 100% 100%;
    height: -webkit-fill-available;
}
.renge-view p{
	font-size:18px;      
}
@keyframes king1{
  0%{
  	opacity: 0;
    
  }
  50%{
  	opacity: 1;
  	
  }
  75%{
  	opacity: 1;
  	
  }
  100%{
  	opacity: 1;
  	
  }
}	  
@keyframes king2{
  0%{
  	opacity: 0;
  
  }
  50%{
  	opacity: 0;
  	
  }
   75%{
  	opacity: 1;
  	
  }
  100%{
  	opacity: 1;
  	
  }
  
}
@keyframes king3{
  0%{
  	opacity: 0;
  
  }
  50%{
  	opacity: 0;
  	
  }
  75%{
  	opacity: 0;
  	
  }
  100%{
  	opacity: 1;
  	
  }
  
}
.section2 {
	height: 1420px;
}
.section2 .section2-PE{
	position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
}
.section2 .tsTwo-bottom{
	
	text-align: center;
}
.section2 .tsTwo-bottom img{
	width: 100%;
}
.section3  h3{
	font-size: 30px;
    color: #fff;
	margin: 20px 0;
    line-height:40px;
}
.section5{
	padding: 100px 0 180px 0;
}
.section5 .powerLost ul {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	box-sizing: border-box;
}
.section5 .powerLost ul li{
	flex: 0 0 50%;
	color: #fff;
	position: relative;
    padding-top: 100px;
    box-sizing: border-box;
	height: 310px;
	background: #484848;
	border: 1px solid transparent;
	overflow: hidden;
	transition:all 1s cubic-bezier(.17,.67,.84,.66);

}
.CuNineViewControl{
	padding-top: 0;
}
.CuNineViewControl ul{
	padding-top: 100px;
    display: flex;
    width: 500px;
    text-align: center;
    height: auto;
    flex-wrap: wrap;
}
.dataViewInfo{
    display: flex;
}
.CuNineViewControl h3{
    font-size: 60px;
    font-weight: bold;
}
.CuNineViewControl ul li{
    flex:  0 0 50%;
    margin-bottom: 40px;
}
.CuNineViewControl ul li .infoImg img{
    width: 50%
}
.CuNineViewControl p{
	color: rgba(129,129,129,1);
}
.dataViewInfo h3{
	font-size: 40px;
    line-height:37px;
   font-weight: bold;
   color:#FFCC00;
}
.dataViewInfo p{
   font-size:18px;
   line-height:37px;
   font-weight: 400;
   margin-top: 0;
   text-align: left;
}
.section5 .powerLost ul li:nth-of-type(1),
.section5 .powerLost ul li:nth-of-type(4){
	background: #202020;
}
.section5 .powerLost ul li:nth-of-type(3){
	background: #272727;
}
.section5 .powerLost ul li h3{
	font-size: 40px;
	text-align: center;
	font-weight: bold;
	line-height: 80px;
}
.section5 .powerLost ul li p{
	font-size: 18px;
}
.powerLost ul li.active:hover h3,
.powerLost ul li.active:hover p{
	color:  #099A3F;
}
.section5 .powerLost ul li:hover{
	transition:all 1s cubic-bezier(.17,.67,.84,.66);
	transition-delay: 0.4s;
	
}
.section5{
	min-height: 100%;
    background: url(/static/images/machinery.png) center center no-repeat;
    background-size: cover;
}
.multi-hover span {
		position: absolute;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		z-index: 99;
		transition: .3s linear;
		opacity: 0;
	  -webkit-touch-callout: none;
	  -webkit-user-select: none;
}
.multi-hover span:hover { opacity: 1; }
.multi-hover span:nth-child(odd):hover { left: 0; z-index: 3; }
.multi-hover span:nth-child(odd).hover { left: 0; z-index: 1; }
.multi-hover span:nth-child(even):hover { top: 0; z-index: 3; }
.multi-hover span:nth-child(even).hover { top: 0; z-index: 1; } 
.multi-hover span:nth-child(1) { /* right panel */
		top: 0;
		left: 90%;
        border: 1px solid #099A3F;
		}
		 
	.multi-hover span:nth-child(2) { /* top panel */ 
		top: -90%;
		left: 0;
		border: 1px solid #099A3F;
		}   

	.multi-hover span:nth-child(3) { /* left panel */ 
		top: 0;
		left: -90%;
	    border: 1px solid #099A3F;
		}  
		
	.multi-hover span:nth-child(4) { /* bottom panel */
		top: 90%;
		left: 0;
		border: 1px solid #099A3F; } 
.section6 h1{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 910px;
	color: #fff;
    font-size: 60px;
}
.section6{
	   background-color: #222222;
}
.section6-center{
	position: absolute;
	top:0;
	left:300px;
}
.section6 .container_text{
	position: relative;
    overflow: hidden;
    left: 68px;
}
.section7 .tsSeven-top{
	padding: 300px 0;
}
.brake_system{
    display: flex;
    justify-content: center;
    align-items: end;	
    overflow: hidden;
	    background: black;
}
.brake_system ul{
	    line-height: 0;
}
.brake_system ul li{
	    background: #1D1C1C;
	    border-bottom: 1px solid #2d2d2d;
	    width: 650px;
	    cursor: pointer;
	    transition: all 0.5s ease-in;
	    box-sizing: border-box;
        height: 300px;
}
.brake_system ul li:nth-last-child(1){
	 border-bottom:none;
}
.brake_system ul li.active{
	background: #060606;
	transition: all 0.5s ease-in-out;
}
.brake_system ul li label{
	display: block;
	padding: 80px 50px 80px 60px;
    cursor: pointer;
}
.brake_system ul li label h3{
	font-size: 26px;
    color: #FFFFFF;
    line-height: 40px;
    margin-bottom: 20px;
}
.brake_system .system_main{
	width: 650px;
}
.brake_system ul li label p{
	font-size: 18px;
    color: #818181;
    line-height: 30px;
}
.system_center{
	width: calc(100% - 650px);
}
.system_center .suffix{
	position: relative;
	opacity: 0;
	transition: all 0.4s ease-in;
}
.system_center .suffix img{
	width: 100%;
	position: absolute;
	top: -200px;
	right: 0;
	height:auto;
	opacity: 1;
}
.system_center .suffix.active{
	opacity: 1;
	transition: all 0.4s ease-in-out;
}

/* .fill1{
	animation:fillTop1 1s linear 2s infinite alternate;
    -webkit-animation:fillTop1 1s linear 2s infinite alternate;
    -moz-animation:fillTop1 1s linear 2s infinite alternate;
    -ms-animation:fillTop1 1s linear 2s infinite alternate;
    -o-animation:fillTop1 1s linear 2s infinite alternate;
}
.fill2{
	animation:fillTop2 1s linear 2s infinite alternate;
    -webkit-animation:fillTop2 1s linear 2s infinite alternate;
    -moz-animation:fillTop2 1s linear 2s infinite alternate;
    -ms-animation:fillTop2 1s linear 2s infinite alternate;
    -o-animation:fillTop2 1s linear 2s infinite alternate;
}
.fill3{
	animation:fillTop3 1s linear 2s infinite alternate;
    -webkit-animation:fillTop3 1s linear 2s infinite alternate;
    -moz-animation:fillTop3 1s linear 2s infinite alternate;
    -ms-animation:fillTop3 1s linear 2s infinite alternate;
    -o-animation:fillTop3 1s linear 2s infinite alternate;
} */
.fillTop1{
	animation-name: fillTop1;
	animation-duration:0.5s;
	transform-style: preserve-3d;
}
.fillTop2{
	animation-name: fillTop2;
	animation-duration:1s;
	transform-style: preserve-3d;
}
.fillTop3{
	animation-name: fillTop3;
	animation-duration:2s;
	transform-style: preserve-3d;
}
@keyframes fillTop1{
  0%{
  	opacity: 0;

  }
  50%{
  	opacity: 1;

  }
  75%{
  	opacity: 1;

  }
  100%{
  	opacity: 1;

  }
}	  
@keyframes fillTop2{
  0%{
  	opacity: 0;
  
  }
  50%{
  	opacity: 0;
  	
  }
   75%{
  	opacity: 1;

  }
  100%{
  	opacity: 1;

  }
}	  
@keyframes fillTop3{
  0%{
  	opacity: 0;
  
  }
  50%{
  	opacity: 0;
  	
  }
   75%{
  	opacity: 0;
  	
  }
  100%{
  	opacity: 1;

  }
}	
@media all and (max-width: 1920px) {
	.system_center .suffix img{
	    width: 100%;
		position: absolute;
		top: -950px;
		right: 0;
		height: auto;
		transform: translate(0, 10%);
	}
	.section1 .range .renge-view img{
		width: 60%;
	}
}  

.headlamp{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	height: 100%;

}
.headlamp .headlamp-img{
	flex: 0 0 50%;
	position: relative;
	z-index: 99;
	height: 100%;
	min-width: 1040px;
}
.headlamp .headlamp-img img{
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	opacity: 1;
	height: 100%;
	
}
.headlamp .rize-lamp{
	color: #fff;
    padding: 220px 120px;
    flex: auto;
}
.headlamp .rize-lamp h1{
	color: #D11E26;
    font-size: 200px;
    font-weight: bold;
    font-family: 'DINOT-Bold';
    text-indent: -10px;
}
.headlamp .rize-lamp p{
	font-size: 30px;
    line-height: 45px;
    margin-bottom: 20px;
}
.headlamp .rize-lamp p:nth-of-type(2){
	font-size: 18px;
    color: #FFFFFF;
    line-height: 28px;
}
.headlamp .rize-lamp img.lamp2{
	    opacity: 0;
	    position: absolute;
	    top: 0px;
	    left: 0px;
	    height: 100%;
	    width: 100%;
}
@keyframes cf4FadeInOut{
  0%{
  	opacity: 1;
    transition: all 1s ease;
	visibility: visible;
  }
  100%{
  	opacity: 0;
    transition: all 1s ease-in;
	visibility: visible;
  }
}	  
.lamp1{
    animation-name: cf4FadeInOut;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 0s;
    animation-direction: alternate;

}
.lamp2{
	animation-name: cf4FadeInOut;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 2s;
    animation-direction: alternate;
}
@keyframes lamp-animateRight {
	0%{
  	opacity: 0;
    transition: all 1s ease;
	visibility: visible;
	transform: translate3d(300px, 0, 0);
  }
  100%{
  	opacity: 1;
    transition: all 1s ease-in;
	visibility: visible;
	transform: translate3d(0px, 0, 0);
  }
}
.rize-lamp .drive1,.rize-lamp .drive2,.rize-lamp .drive3{
	opacity: 0;
	transition: all 1s ease-in;
}
.lamp-animateRight{
	color: #fff !important;
}
.drive1.lamp-animateRight{
	animation: lamp-animateRight 0.5s ease-in;
	-webkit-animation: lamp-animateRight 0.5s ease-in;
    -moz-animation: lamp-animateRight 0.5s ease-in; 
	animation-name: lamp-animateRight;
	animation-duration:0.5s;
	transform-style: preserve-3d;
	transition-delay: 3s;
	opacity: 1;
}
.drive2.lamp-animateRight{
	animation: lamp-animateRight 1s ease-in;
	-webkit-animation: lamp-animateRight 1s ease-in;
    -moz-animation: lamp-animateRight 1s ease-in; 
	animation-name: lamp-animateRight;
	animation-duration:1s;
	transform-style: preserve-3d;
	transition-delay: 6s;
	opacity: 1;
}
.drive3.lamp-animateRight{
	animation: lamp-animateRight 1.5s ease-in;
	-webkit-animation: lamp-animateRight 1.5s ease-in;
    -moz-animation: lamp-animateRight 1.5s ease-in; 
	animation-name: lamp-animateRight;
	animation-duration:1.5s;
	transform-style: preserve-3d;
	transition-delay: 9s;
	opacity: 1;
}

.technology{
	display: flex;
	justify-content: center;
}
.technology .technology-viewLeft{
 flex: 1;	
 overflow: hidden;
 position: relative;
 box-sizing: border-box;
}
.technology .technology-viewtImg{
	/* height:1200px; */
	width:100%;
	background:url(/static/images/technology.png) center center no-repeat;
    background-size: cover;
    flex: 0 0 50%;

}
.technology .technology-viewRight {
	flex: 1;
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
}

.technology .viewRight-top{
   padding:76px 140px;
   position: absolute;
   left: 0;
   top:0;	
}
.technology .viewRight-top h3{
	font-weight: bold;
}
.technology-viewRight{
	/*display: flex;
	flex-wrap: wrap;*/
}
.technology-viewRight .viewRight-top-button{
	/* height:600px; */
	width:100%;
	background:url(/static/images/figure.png) center center no-repeat;
    background-size: cover;


}
.technology-viewRight .viewRight-top-center{
	/* height:600px; */
	width:100%;
	background:url(/static/images/screw.png) center center no-repeat;
    background-size: cover;

}
.section-common .common_pictures{
	position: relative;
}
/**img 添加动态消费*/
.section-common .common_pictures .technology-viewtImg.bigget:hover,
.section-common .common_pictures .viewRight-top-button.bigget:hover,
.section-common .common_pictures .viewRight-top-center.bigget:hover{
    animation:animations 0s linear 1s infinite alternate;
    -webkit-animation:animations 0s linear 1s infinite alternate;
    -moz-animation:animations 1s linear 1s infinite alternate;
    -ms-animation:animations 1s linear 1s infinite alternate;
    -o-animation:animations 1s linear 1s infinite alternate;
   
    cursor: pointer;
}
.section-common .common_pictures .technology-viewtImg.bigget:hover,
.section-common .common_pictures .viewRight-top-button.bigget:hover,
.section-common .common_pictures .viewRight-top-center.bigget:hover{
	transform: scale(1.05,1.05);
	 transition: all 1.5s ease-in;
}
.section-common .common_pictures .technology-viewtImg.bigget,
.section-common .common_pictures .viewRight-top-button.bigget,
.section-common .common_pictures .viewRight-top-center.bigget{
	transform: scale(1,1);
	transition: all 2s ease-in-out;
}
.section-common .common_pictures .technology-viewtImg.bigget{
	transition: all 0.5s ease-in-out;
}
.section12 article{
	display: flex;
	padding: 80px 0;
	justify-content: flex-end;
	
}
.section12 article .passability-twesix-left{
	    flex: auto;
}

.section12 article .passability-twesix-right{
      flex: 0 0 50%;
}

.passability-twesix-left .passability ul {
	position: relative;
	width: 100%;

}
.passability ul li {
	position: absolute;
	top:0;
	left: 0;
	opacity: 0;
	transition: all 0.2s ease-in;
}
.passability ul li.active {
	opacity: 1;
	transition: 0.2s ease-in-out;
	position: absolute;
	top:0;
	left: 0;
}
.passability ul li.fadeInUp{
	animation-name: fadeInUp;
	animation-duration:1s;
	transform-style: preserve-3d;
}
@-webkit-keyframes fadeInUp{
	0%{
		opacity: 0;
		transition: all 1s ease;
		visibility: visible;
		-webkit-transform: translate3d(0,100px,0);
		transform: translate3d(0, 100px, 0)
	}
	100%{
		opacity: 1;
		transition: all 1s ease-in;
		visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0)
	}
}
@keyframes fadeInUp {
	0%{
		opacity: 0;
		transition: all 1s ease;
		visibility: visible;
		-webkit-transform: translate3d(0,100px,0);
		transform: translate3d(0, 100px, 0)
	}
	100%{
		opacity: 1;
		transition: all 1s ease-in;
		visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0)
	}
}

.passability-twesix-right h3{
		font-size: 22px;
    line-height: 40px;
    text-align: left;
}
.passability-twesix-right ul li span{
	font-size: 18px;
	color:#fff;
	display: block;
}
.passability-twesix-right ul {
	padding: 120px 0;
	display: flex;
	justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}
.passability-twesix-right ul li{
	flex: 0 0 25%;
	line-height: 35px;
	margin-bottom: 30px;
	cursor: pointer;
	text-align: left;
}
.passability-tweteen-top span{
	font-size: 20px;
	position: relative;
	line-height: 36px;
}
.passability-tweteen-top h3{
	font-size: -webkit-xxx-large;
    letter-spacing: 5px;
    font-weight: bold;
}
.specfeatures{
	display: flex;
    justify-content: center;
}
.specfeatures .features_left{
	flex: 1;
}
.section14{
	padding-bottom: 110px;
}
.section14 .passability-tweteen-top p{
	color: #fff;
    font-weight: bold;
    margin-top: 40px;
}
.specfeatures span{
    font-size: 18px;
    color: #6d6d6d;
    text-align: right;
    display: block;
    position: relative;
    top: -50px;
}
.specfeatures .features_right span{
	text-align: left;
	margin-left: 10px;
}
.specfeatures_attribute{
	width: 100%;
	position: relative;
	box-sizing: border-box;
	top: -20px;
	border-radius: 30px;
	background-image: linear-gradient(180deg, #232323 0%, #393939 100%);
}
.specfeatures_attribute ul {
	display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.specfeatures_attribute ul li{
	    flex: 0 0 33.333%;
	    display: flex;
		justify-content: flex-start;
		align-items: center;
	    height: 160px;
        box-sizing: border-box;
}
.specfeatures_attribute ul li article{
	display: block;
    width: 260px;
    position: relative;
    left: 61px;
    top: 10px;
 }

.specfeatures_attribute ul li span{
	font-size: 18px;
    color: #fff;

}
.specfeatures_attribute ul li label{
	width: 100%;
    display: block;
	padding-bottom: 10px;
	display: flex;
}
.specfeatures_attribute ul li label>span{
    vertical-align: super;
	margin-left: 10px;
	font-size: 26px;
	white-space: nowrap;
}
.specfeatures_attribute ul li article>span{
	display: -webkit-box;
    line-height: 28px;
	margin-left: 40px;
	color: #818181;
	white-space: nowrap;
}
.smart_tall{
	display: flex;
    justify-content: center;
    position: relative;
    height: 100%;
}
/* .smart_tall .headlamp{
	height: 100%;
    flex: 0 0 50%;
    position: relative;
    width:50%;
    z-index: 0;
    position: absolute;
    left: 0;
} */
.smart_tall .headlight h1{
	color: #D11E26;
    font-size: 200px;
    font-weight: bold;
	font-family: 'DINOT-Bold';
    text-indent: -10px;
}
.smart_tall .headlight h3{
	font-size: 28px;
    margin-bottom: 40px;
    font-weight: bold;
    letter-spacing: 2px;
	margin-top: 30px;
	color: white;
}

.smart_tall .headlight p{
	font-size: 18px;
    color: #a0a0a0;
    line-height: 29px;
}
.smart_tall .headlamp{
	height: 100%;
    flex: 0 0 100%;
    position: relative;
    width:100%;
    z-index: 0;
    position: absolute;
	left: 0;
	top: 0;
} 
.smart_tall .headlamp img:nth-of-type(1){
	opacity: 1;
}
.smart_tall .headlamp img{
	position: absolute;
	left: 0;
	top:0;
	opacity: 0;
	width: auto;
	height: 100%;
}
.smart_tall .headlamp img{
	width: auto;
    height: -webkit-fill-available;
    z-index: 1;
    display: block;
    overflow: hidden;

}

.smart_tall .headlight {
	color: #fff;
    /*background: #000;*/
    flex: 1;
    width: 50%;
    overflow: hidden;
    padding: 250px 0 250px 150px;
    position: absolute;
    right: 0;
	margin-right: -120px;
	top: 50%;
    transform: translate(0px, -50%);
}
.headlamp img.head1{
	animation:king1 0s linear 2s infinite alternate;
}
.headlamp img.head2{
	animation:king2 2s linear 3.5s infinite alternate;
}

.headlamp img.head3{
	animation:king3 3.5s linear 4s infinite alternate;
}
.heightBg{
	position: absolute;
    height: 100%;
    overflow: hidden;
    flex: 1;
    width: 52%;
    opacity: 0;
	
}
.heightBg.active{
    overflow: hidden;
    right: 0;
	transition: width 1s;
	background-color: #1f1f1f;
}
.heightBg.active{
	opacity: 1;
	animation: bigLeftAnimations 1s ease-in;
	animation-name: bigLeftAnimations;
	animation-duration:.5s;
	transform-style: preserve-3d;
}
.heightBg.activeRight{
	opacity: 1;
	animation: bigLeftAnimationsRight 1s ease-in;
	animation-name: bigLeftAnimationsRight;
	animation-duration:1s;
	transform-style: preserve-3d;
}
h1.leftAnimation,
img.leftAnimation,
.soco_active.leftAnimation{
	opacity: 0;
	transition: all 1s ease;
}
img.leftAnimation.bigLeftAnimation,
h1.leftAnimation.bigLeftAnimation{
	opacity: 1;
	animation: bigLeft1 1s ease-in;
	-webkit-animation: bigLeft1 1s ease-in;
    -moz-animation: bigLeft1 1s ease-in; 
	animation-name: bigLeft1;
	animation-duration:1s;
	transform-style: preserve-3d;
}
h1.bigLeftAnimation,
img.leftAnimation.bigLeftAnimation,
.soco_active.bigLeftAnimation{
	opacity: 1;
	animation: bigLeft2 2s ease-in;
	-webkit-animation: has3 2s ease-in;
    -moz-animation: has3 2s ease-in; 
	animation-name: bigLeft2;
	animation-duration:2s;
	transform-style: preserve-3d;
}
.drive1.bigLeftAnimation{
	opacity: 1;
	animation: drive1 0.5s ease-in;
	-webkit-animation: drive1  0.5s ease-in;
    -moz-animation: drive1  0.5s ease-in; 
	animation-duration: 0.5s;
	transform-style: preserve-3d;
}
.drive2.bigLeftAnimation{
	opacity: 1;
	animation: drive2 1s ease-in;
	-webkit-animation: drive2 1s ease-in;
    -moz-animation: drive2 1s ease-in; 
	animation-duration:1s;
	transform-style: preserve-3d;
}
.drive3.bigLeftAnimation{
	opacity: 1;
	animation: drive3 1s ease-in;
	-webkit-animation: drive3 1s ease-in;
    -moz-animation: drive3 1s ease-in; 
	animation-duration:1s;
	transform-style: preserve-3d;
}

.drive4.bigLeftAnimation{
	opacity: 1;
	animation: drive4 1s ease-in;
	-webkit-animation: drive4 1s ease-in;
    -moz-animation: drive4 1s ease-in; 
	animation-duration:1s;
	transform-style: preserve-3d;
}
@keyframes drive1{
	0%{
  	opacity: 0;
    transform: translate3d(-100px, 0, 0);
  }
  50%{
  opacity: 0;
   transform: translate3d(-100px, 0, 0);
  }
  60%{
  	opacity: 0;
    transform: translate3d(-100px, 0, 0);
  }
  70%{
  	opacity: 1;
  }
  80%{
  	opacity: 1;
  }
  90%{
  	opacity: 1;
  }
  100%{
  	opacity: 1;

  }
}
@keyframes drive2{
	0%{
  	opacity: 0;

  }
  50%{
  opacity: 0;

  }
  60%{
  	opacity: 0;

  }
  70%{
  	opacity: 0;
  	transform: translate3d(-100px, 0, 0);
  }
  80%{
  	opacity: 1;
  }
  90%{
  	opacity: 1;
  }
  100%{
  	opacity: 1;

  }
}
@keyframes drive3{
	0%{
  	opacity: 0;
  }
  50%{
  opacity: 0;

  }
  60%{
  	opacity: 0;

  }
  70%{
  	opacity: 0;
  }
  80%{
  	opacity: 0;
  	transform: translate3d(-100px, 0, 0);
  }
  90%{
  	opacity: 1;
  }
  100%{
  	opacity: 1;

  }
}
@keyframes drive4{
	0%{
  	opacity: 0;

  }
  50%{
  opacity: 0;

  }
  60%{
  	opacity: 0;

  }
  70%{
  	opacity: 0;
  }
  80%{
  	opacity: 0;
  }
  90%{
  	opacity: 0;
  	transform: translate3d(-100px, 0, 0);
  }
  100%{
  	opacity: 1;

  }
}
@keyframes bigLeftAnimation{
  0%{
  	opacity: 0;
    transform: translate3d(-1000px, 0, 0);
  }
  100%{
  	opacity: 1;
  	transform: translate3d(0px, 0px, 0);
  }
}	 

@keyframes bigLeftAnimations{
	0%{
		opacity: 0;
	  width: 0;
	}
	100%{
		opacity: 1;
		width: 50%;
	}
  }
  @keyframes bigLeftAnimationsRight{
	  0%{
		opacity: 1;
		width: 50%;
	  }
	  100%{
		  opacity: 0;
		  width: 0;
	   }
	}
	.smart_tall .headlight h1{
		color: #FFCC00;
		font-size: 200px;
		font-weight: bold;
		font-family: 'DINOT-Bold';
		text-indent: -10px;
	}
	.smart_tall .headlight h3{
		font-size: 28px;
		margin-bottom: 40px;
		font-weight: bold;
		letter-spacing: 2px;
		margin-top: 30px;
		color: white;
	}
	
	.smart_tall .headlight p{
		/* font-size: 18px;
		color: #a0a0a0;
		line-height: 29px; */
	}
.section12 article{
	display: flex;
	padding: 0px 0 80px 0;
	justify-content: flex-end;
	
}
.section12 article .passability-twesix-left{
	    flex: auto;
}

.section12 article .passability-twesix-right{
      flex: 0 0 50%;
}
.section12 article .passability-twesix-left img{
	height: 1080px;
}
.passability-twesix-left .passability ul {
	position: relative;
	width: 100%;

}
.passability ul li {
	position: absolute;
	top:0;
	left: 0;
	opacity: 0;
	transition: all 0.2s ease-in;
}
.passability ul li.active {
	opacity: 1;
	transition: 0.2s ease-in-out;
	position: absolute;
    top: -120px;
    left: -400px;
}
.passability ul li.fadeInUp{
	animation-name: fadeInUp;
	animation-duration:1s;
	transform-style: preserve-3d;
}
@-webkit-keyframes fadeInUp{
	0%{
		opacity: 0;
		transition: all 1s ease;
		visibility: visible;
		-webkit-transform: translate3d(0,100px,0);
		transform: translate3d(0, 100px, 0)
	}
	100%{
		opacity: 1;
		transition: all 1s ease-in;
		visibility: visible;
		-webkit-transform: translate3d(0, 0, 0)
		transform: translate3d(0, 0, 0)
	}
}
@keyframes fadeInUp {
	0%{
		opacity: 0;
		transition: all 1s ease;
		visibility: visible;
		-webkit-transform: translate3d(0,100px,0);
		transform: translate3d(0, 100px, 0)
	}
	100%{
		opacity: 1;
		transition: all 1s ease-in;
		visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0)
	}
}

/**视频添加***/
video::media-controls {
  display:none !important;
}
video::-webkit-media-controls {
  display:none !important;
}
video::-moz-media-controls {
  display:none !important;
  
}
video::-moz-media-controls {
  display:none !important;
  
}
video::-o-media-controls {
  display:none !important;
  
}

.videobox video{
/* 	object-fit: contain;
    margin: 0 auto;
    position: absolute;
    height: 100%;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%); */
}

.section10 {
    height: 650px;
}
  .headlamp .headlamp-img img{
   	height: auto;
   }
  .section5 .powerLost ul li{
  	height: 280px;
  }
  .section1 .range .renge-view {
  
  }
  .section1 .range .renge-view .renge-list{
    position: absolute;
    left: 127px;
    top: -100px;
   }



.controller {
	position: relative;
	width: 100%;
	/*display: flex;
    justify-content: center;
    align-items: center;*/
}

.controller .controller-left .controller-text-top{
	    /* margin-bottom: 50px; */
}
.controller .controller-left .controller-text-top h1{
	font-size: 60px;
	color: #fff;
	font-weight: bold;
    line-height: 75px;
}
.controller .controller-text-bottom{
	padding: 60px 0;
	/* height: 343px; */
	box-sizing: border-box;
	position: absolute;
	transform: translate(0,-50%);
}
.section7 .videobox video{
	filter:initial;
	position: relative;
    height:fit-content;
}

.section7 .vidbacking-active-block-back{
	top: 0;
     left:0;
     transform: none;
}

.controller .controller-left{
	text-align: right;
    position: absolute;
    top: 50%;
    left: 50%;
	
	margin-left: -660px;
	width: 1200px;
	z-index:1

}
.controller .controller-text-bottom .controller-textCode{
	float: right;
	text-align: left;
	flex: 0 0 30%;
    padding-right: 100px;
    top: 25px;
    position: relative;

}
.controller .controller-text-bottom h3{
	color: #fff;
	font-size: 30px;
	line-height: 50px;
	margin-bottom: 40px;
	font-weight: bold;
}
.controller .controller-text-bottom p{
	color:#818181;
}
.controller .controller-text-bottom span{
	position: relative;
	font-size: 18px;
	display: block;
	line-height: 35px;
}
.controller .controller-text-bottom span:before{
	/* content: '';
    width: 6px;
    height: 6px;
    border-radius: 3px;
    background-color: #818181;
    position: absolute;
    top: 15px;
    display: block; */
	
}
.controller .controller-right{
    flex: 0 0 100%;
}
.swiper-Skip{
    position: relative;
    width: 100%;
    margin-bottom: 120px;
}
.swiper-Skip-prev span{
   display: block;
   width: 80px;
   height:80px;
   border-radius: 50%;
   background:#282828;
   position: absolute;
   bottom:200px;
   left: 0;
}
.swiper-Skip-prev span::before{
    position: absolute;
    content: '';
    width: 14px;
    height: 2px;
    background: #fff;
    transform: rotate(45deg);
	top: 45px;
    left: 30px;
}
.swiper-Skip-prev span::after{
    position: absolute;
    content: '';
    width: 14px;
    height: 2px;
    background: #fff;
    transform: rotate(-45deg);
	left: 30px;
    top: 36px;
}
.swiper-Skip-next span::before{
    position: absolute;
    content: '';
	width: 14px;
    height: 2px;
    background: #fff;
    transform: rotate(135deg);
	top: 43px;
    left: 36px;
}
.swiper-Skip-next span::after{
    position: absolute;
    content: '';
	width: 14px;
    height: 2px;
    background: #fff;
    transform: rotate(-135deg);
	right: 30px;
    top: 34px;
}
.swiper-Skip-next span{
    display: block;
   width: 80px;
   height: 80px;
   border-radius: 50%;
   background: #282828;
   position: absolute;
   bottom:200px;
   right:0;
}
.TcViewFifteenBasePE {
	overflow: hidden;
}



@media all and (max-width: 1501px) {
	.headlamp .rize-lamp{
	padding: 120px 80px;
	}
}
@media all and (max-width: 1920px) {
	.controller .controller-left {
	
	}
	.section1 .range .renge-view{
		padding: 40px 0;
	}
	.section1 .range .renge-view img{
		padding-top: 30px;
	}
}



/**分辨率1280**/
@media only screen and (max-device-width:1280px){
	.brake_system ul li label{
		padding-top: 35px;
	}
	.smart_tall .headlight{
		margin-right: -80px;
	}
	.section12 article .passability-twesix-left img{
		 height: 680px;
	}
	.passability ul li.active{
		position: absolute;
		top: -180px;
		left: -100px;
	}
	.section12 article .passability-twesix-right{
		padding-top: 0;
	}
	.passability-twesix-right ul{
		padding-top: 20px;
	}
	.section13 .passability-tweteen-top{
		width: 100%;
		bottom: -20px;
	}
	.passability-tweteen-top span{
		bottom: -30px;
	}
	.controller .controller-text-bottom{
		transform: translate(0,-70%);
	}
}

/**分辨率1400**/
@media only screen and (max-device-width:1440px){
	.brake_system ul li label{
		padding-top: 35px;
	}
	.smart_tall .headlight{
		margin-right: -80px;
	}
	.section12 article .passability-twesix-left img{
		 height: 680px;
	}
	.passability ul li.active{
		position: absolute;
		top: -180px;
		left: -100px;
	}
	.section12 article .passability-twesix-right{
		padding-top: 0;
	}
	.passability-twesix-right ul{
		padding-top:60px;
	}
	.section13 .passability-tweteen-top{
		width: 100%;
		bottom: -20px;
	}
	.passability-tweteen-top span{
		bottom: -30px;
	}
	.controller .controller-text-bottom{
		transform: translate(0,-70%);
	}
}





















/**
    手机版app
**/
@media only screen and (max-device-width:769px){

	.white{
		color:white;
	  }
		.areEasyTop {
		  padding: 2em 1.2em;	
		}
		.areEasyTop h1{
		  font-size: 2.2em;
		  font-weight: bold;
		  text-align: center;
		  line-height: 36px;
		  text-transform: uppercase;
		 
		}
		.ViewSixtipVoidTc .areEasyTop h1{
			white-space: pre;
		}
		.areEasyTop h3{
		  font-size: 1.2em;
		  font-weight:600;
		  line-height:32px;
		  text-align: center;
		  margin-top: 0.5em;
		  margin-bottom: 0.25em;
		}
		.areEasyTop button{
			outline: none;
			border: none;
			background: #fff;
			width: 50%;
			height: 3em;
			line-height: 3em;
			font-size: 1.1em;
			letter-spacing: 0.05em;
			margin:2em auto auto auto;
			display: block;
		}
		.areEasyTop p{
		  font-size:0.9em;
		  color: rgb(106, 106, 106);
		  line-height: 22px;
		  text-align: center;
		}
    .ViewOnetipVoidTc{
		width: 100%;
		background: url(/static/images/tsone.png) center center no-repeat;
		background-size:cover;
		height: 26.7em;
		box-sizing: border-box;
		position: relative;
		padding-top: 2.4em;
	}
	.ViewOnetipVoidTc h1{
        font-size: 3em;
        line-height: 1.2em;
      }
	.ViewTwotipVoidTc{
		width: 100%;
		background: url(/static/images/headstock.png) center center no-repeat;
		background-size:cover;
		height:36em;
		box-sizing: border-box;
		position: relative;
		padding-top: 1.4em;
		color: #000;
	}
	.ViewTwotipVoidTc p{
		font-weight: 1.2em;
		font-weight: bold;
		color: #000;
		margin: 0.8em auto;
	}
	.ViewTwotipVoidTc img{
	    width: 80%;
		display: block;
		margin: 3em auto;
	}
	.ViewThreetipVoidTc{
		width: 100%;
		background: url(/static/images/battery.png) center center no-repeat;
		background-size:cover;
		height:26.7em;
		box-sizing: border-box;
		position: relative;
		padding-top: 1.4em;
	}
	.ViewFourtipVoidTc,
	.ViewNinetipVoidTc{
		width: 100%;
		background:rgba(21,21,21,1);
		box-sizing: border-box;
		position: relative;
		margin-top: -1px;
	}
	.ViewNinetipVoidTc{
		height: 11.7185em;
		overflow: hidden;
		position: relative;
		top:4px;
	}
	.ViewNinetipVoidTc{
		padding: 0em 0;
	}
	.ViewNinetipVoidTc .areEasyTop {
		padding: 0.5em 1em;
	}
	.ViewFourtipVoidTc h3,
	.ViewNinetipVoidTc h3{
		line-height:32px;
		text-align: left;
		margin-bottom: 1em;
	}
	.ViewFourtipVoidTc p,
	.ViewNinetipVoidTc p{
		text-align: left;
	}
	.ViewFivetipVoidTc img{
		width: 100%;
		vertical-align: bottom;
	}
    .ViewSixtipVoidTc{
		background:rgba(0,0,0,1);
		position: relative;
		width: 100%;
		box-sizing: border-box;
		padding:2.4em 0 0 0;
		margin-top: -1px;
	}
	.ViewSixtipVoidTc img{
		width: 86%;
		display: block;
		margin: 4em auto 0em auto;
	}
	.ViewSixtipVoidTc .clickTile{
		width: 100%;
	}
	.ViewSeventipVoidTc{
		width: 100%;
		background: url(/static/images/electromotor.png) center center no-repeat;
		background-size: cover;
		height:26.7em;
		box-sizing: border-box;
		position: relative;
		margin-top: -1px;
		padding-top: 1.6em;
	}
	.ViewSeventipVoidTc .SixtipDatile{
		position: relative;
	}
	.ViewSeventipVoidTc .SixtipDatile p{
		font-size: 0.9em;
		font-weight: 400;
		color: rgba(129,129,129,1);
		padding-left: 2.4em;
		line-height:24px;
		position: absolute;
		left: 0;
		top: 2em;
	}
	.ViewNighttipVoidTc,
	.ViewTentipVoidTc{
		background:rgba(0,0,0,1);
		position: relative;
		width: 100%;
		box-sizing: border-box;
		padding:2.4em 0 2.4em 0;
		margin-top: -3px;
		margin-bottom: -3em;
	}
	.ViewTentipVoidTc{
		padding:10em 0 10em 0;
		
	}
	.ViewNighttipVoidTc img{
		width: 100%;
	}
	.ViewEleventipVoidTc{
		background:#1F1F1F;
		margin-top: -1px;
	}
	.SeventeentipRight h1{
		font-weight:600;
		color:rgba(255,204,0,1);
	}
	.SeventeentipLeft img{
		width: 100%;
	}
	.SeventeentipLeft{
		flex: 0 0 50%;
	}
	.SeventeentipVoidCenter {
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: left;
		height: 100%;
	}
	.SeventeentipVoidCenter .SeventeentipRight h1,
	.SeventeentipVoidCenter .SeventeentipRight h3,
	.SeventeentipVoidCenter .SeventeentipRight p{
	  text-align: left;
	}
	.ViewSeventeentipVoidTc{
		padding: 2.5em 0 2em 0;
	}
	.ViewSeventeentipVoidTc .areEasyTop {
		padding-bottom: 1em;
	}
	.ViewSeventeentipVoidTc .swiper-containerviewFive {
		padding-bottom:2em;
	}
	.ViewSeventeentipVoidTc .swiper-box img {
		width: 90% !important;
		display: block;
		margin: 0 auto;
	}
	.ViewSeventeentipVoidTcMax h3{
	   font-size: 1.2em;
	}
	.SeventeentipVoidCenter .SeventeentipRight {
		flex: 0 0 50%;
		padding-left: 1.2em;
		padding-right: 1em;
		margin-left: 0.8em;
		box-sizing: border-box;
		min-height: 207px;
		display: flex;
		flex-direction: column;        /*元素的排列方向为垂直*/
		justify-content: center;    /*水平居中对齐*/
		align-items: flex-start;  
		background:rgba(31,31,31,1);
	}
	.ViewEleventipVoidTc h1{
		font-size: 3em;
		font-weight: bold;
		text-align: center;
		line-height: 54px;
		text-transform: uppercase;
	  }
	
	  .ViewEleventipVoidTc h3{
		font-size:1.2em;
		font-weight:600;
		line-height:32px;
		text-align: center;
		margin-top: 0.5em;
	  }
	  .ViewEleventipVoidTc p{
		font-size:0.8em;
		color: rgb(106, 106, 106);
		line-height: 22px;
		text-align: center;
	  }
	  .ViewTwelvetipVoidTc{
		width: 100%;
		background:rgba(0,0,0,1);
		box-sizing: border-box;
		position: relative;
		margin-top: -1px;
	  }
	  .ViewTwelvetipVoidTc .areEasyTop{
		  padding: 3.2em 1.2em 4.4em 1.2em;
	  }
	  .ViewTwelvetipVoidTc img {
		  width: 100%;
	  }
     .ViewThirteentipVoidTc{
		width: 100%;
		background: url(/static/images/electrowelding.png) center center no-repeat;
		background-size: cover;
		height:14.65em;
		box-sizing: border-box;
		position: relative;
		margin-top: -3px;
		padding: 2em 0  0 0 ;
	 }
	 .ViewThirteentipVoidTc h3{
		 text-align: left;
	 }
	 .ViewThirteentipVoidTc p{
		 text-align: left;
		 color: #fff;
	 }
	 .ViewFourteentipVoidTc{
			width: 100%;
			background: url(/static/images/screw.png) center center no-repeat;
			background-size: cover;
			height: 20.5em;
			margin-top: -1px;
			box-sizing: border-box;
			height: 20.5em;
	 }
	.ViewFourteentipVoidTc h3,
	.ViewFourteentipVoidTc p{
		text-align: left;
	}
	.ViewFifteentipVoidTc{
		width: 100%;
		background: url(/static/images/carriage.png) center center no-repeat;
		background-size: cover;
		height:26.7em;
		box-sizing: border-box;
		position: relative;
		margin-top: -1px;
	}
	.ViewFifteentipVoidTc p{
		color:#000000;
		font-weight: bold;
	}
	.ViewFifteentipVoidTc .areEasyTop{
		position: absolute;
		bottom:0;
		text-align: center;
		transform: translate(-50%, 0);
		left: 50%;
		width: 95%;
		padding: 2em 0;
		margin: 0 auto;
	}
  .ViewSixteentipVoidTc img{
	width: 50%;
    display: block;
    margin: 2em auto 4em auto;
  }
	.ViewSixteentipVoidTc img.marshalling {
		width:90%;
		display: block;
		margin: 2em auto 4em auto;
	}
	.ViewSixteentipVoidTc{
		background:rgba(16,16,16,1);
		margin-top: -1px;
	}
	.ViewSixteentipVoidTc .areEasyTop h3{
		line-height: 30px;
	}
	.ViewEighteentipVoidTc {
		background:rgba(16,16,16,1);
		margin-top: -1px;
	}
    .ViewEighteentipVoidTc img{
		width: 100%;
	}
	.ViewNineteentipVoidTc{
		background:rgba(0,0,0,1);
		margin-top: -1px;
	}
	.ViewNineteentipVoidTc p{
		text-align: left;
		text-indent: initial;
		text-align: justify;
		font-size: 0.8em;
		
	 }
	.ViewSeventeentipVoidTc{
		background:rgba(44,44,44,1);
		margin-top: -1px;
	}
	.swiper-Skip {
		margin-bottom: 0;
	}
	.swiper-Skip-prev span {
		display: block;
		width: 50px;
		height: 50px;
		border-radius: 50%;
		background: #212121;
		position: absolute;
		bottom: 90px;
		left: 0;
	}
	.swiper-Skip-next span {
        display: block;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: #212121;
        position: absolute;
        bottom: 90px;
        right: 0;
	}
	.swiper-Skip-prev span{
		display: block;
        width: 40px;
        height: 40px;
		border-radius: 50%;
		background:#212121;
		position: absolute;
		bottom: 90px;
		left: 0;
	   }
	   .swiper-Skip-prev span::before{
        position: absolute;
        content: '';
        width: 14px;
        height: 2px;
        background: #fff;
        transform: rotate(45deg);
        top: 25px;
        left: 12px;
	   }
	   .swiper-Skip-prev span:hover::before,
	   .swiper-Skip-prev span:hover::after,
	   .swiper-Skip-next span:hover::before,
	   .swiper-Skip-next span:hover::after{
	   background: red;
	   }
	   .swiper-Skip-prev span::after{
		position: absolute;
        content: '';
        width: 18px;
        height: 3px;
        background: #fff;
        transform: rotate(-45deg);
        left: 12px;
        top: 15px;
        width: 15px;
        height: 2px;
	   }
	   .swiper-Skip-next span::before{
		position: absolute;
        content: '';
        width: 16px;
        height: 2px;
        background: #fff;
        transform: rotate(135deg);
        top: 25px;
        left: 12px;
	   }
	   .swiper-Skip-next span::after{
        position: absolute;
        content: '';
        width: 17px;
        height: 2px;
        background: #fff;
        transform: rotate(-135deg);
        right: 12px;
        top: 15px;
	   }
       .swiper-pagination-bullet{
		background: #fff !important;
        opacity: 1 !important;
        width: 7px;
        height: 7px;
        border-radius: 50%;
       }
	   .swiper-pagination-bullet{
		background: #000 !important;
		opacity: 1 !important;
		border:1px solid #818181;
	   }
	   .swiper-pagination-bullet-active{
		background: #fff!important;
		
	   }
	 
	   .swiper-pagination{
		   text-align: left!important;
		   left: 1em!important;
	   }
	   .ViewNighttipVoidTc .swiper-pagination{
		text-align: center !important;
		
		
	   }
	   .ViewNighttipVoidTc  .swiper-pagination-bullet-active{
		background: #fff !important;
		height: 8px;
		width: 8px;
		border-radius: 50%;
	   }
	   
	   .smart_tall .headlamp img{
		width: 50%;
		
	   }
	   .swiper-containerviewSix {
		   position: relative;
		   overflow: hidden;
		   margin-bottom: -3px;
		   background: rgba(21,21,21,1);
	   }

	 .SeventeentipLeft .headlamp  img.head2{
        animation:headking1 1s linear 1.5s infinite alternate;
    }
    .SeventeentipLeft .headlamp img.head1{
        animation:headking2 1.5s linear 2s infinite alternate;
    } 
    @keyframes headking1{
        0%{
            opacity: 0;
        }
        100%{
            opacity: 1;
        }
      }	
      @keyframes headking2{
        0%{
            opacity:0;
        }
        100%{
            opacity: 1;
        }
       
      } 



















	
}