.videojustify {
	position: fixed;
	height: 100%;
	width: 100%;
	top: 0px;
	left: 0px;
	background-color: rgb(0 0 0/ 100%);
	z-index: 9999;
	justify-content: center;
	display: flex;
	align-items: center;
}

.graycolor{
	color:gray;
}

.closevidoe {
	position: absolute;
	cursor: pointer;
	top: 16px;
	right: 16px;
	z-index: 10;
	border-radius: 9999px;
	background-color: hsla(0, 0%, 100%, .5);
	padding: 12px;

}

.closevidoe button {
	width: 20px;
	height: 20px;
	padding: 0;
	margin: 0;
	border: 0;
}

.contentvideo {
	justify-content: center;
	display: flex;
	align-items: center;
	margin: 0 70px;
}

.contentvideo video {
	justify-content: center;
	display: flex;
	align-items: center;
	margin: 0 70px;
	width: 100%;
}

.full {
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0px;
	top: 0px;
	justify-content: center;
}

.full img {
	width: 100%;
	min-height: 100%;
	transition:1s linear 2s;
	transform:scale(1.1,1.1);
}
.full:hover img {
    transform: scale(1.05);
	
}

.mySwiper .swiper-slide-active img,.mySwiper .swiper-slide-duplicate-active img{
	transition:6s linear;
	transform:scale(1,1);
	}	

.slide-1 .preload {
	background: url(../uploads/01_s.jpg) no-repeat left top/100% 100%;
}

.slide-2 .preload {
	background: url(../uploads/02_s.jpg) no-repeat left top/100% 100%;
}

.slide-3 .preload {
	background: url(../uploads/03_s.jpg) no-repeat left top/100% 100%;
}

.slide-4 .preload {
	background: url(../uploads/04_s.jpg) no-repeat left top/100% 100%;
}

.homepage-left100 {
	width: 100%;
	position: absolute;
	left: 100%;
	top: 44%;
	z-index: 10;
	transform: translate(-50%, -50%);
}

.homepage-left100 .txt {
	text-transform: uppercase;
	font-size: 48px;
	letter-spacing: 16px;
	line-height: 72px;
}

.txtCenter {
	position: absolute;
	top: 45%;
	left: 50%;
	z-index: 10;
	transform: translate(-50%, -50%);
	text-align: center;
	width: 100%;
	padding: 15px;
}

.txtCenter .txt {
	font-size: 125px;
	letter-spacing: -2px;
	line-height: 115px;
	color: #121212;
	text-align: center;
	text-transform: uppercase;
	font-family: "Arial Black", Gadget, sans-serif;
}

.whiteTxt {
	position: absolute;
	top: 45%;
	left: 50%;
	z-index: 10;
	transform: translate(-50%, -50%);
	text-align: center;
	width: 100%;
}

.whiteTxt .txt {
	font-size: 65px;
	letter-spacing: -2px;
	line-height: 82px;
	color: #ffffff;
	text-align: center;
	font-family: "Arial Black", Gadget, sans-serif;
}

footer {
	width: 100%;
	height: 70px;
	position: absolute;
	bottom: 0;
	background: #fff;
	z-index: 30;
	line-height: 70px;
	text-indent: 30px;
}

.video-container {
	position: relative;
	width: 100%;
	/* 指定容器宽度 */
	height: 0;
	/* 高度设置为0 */
	padding-bottom: 56.25%;
	/* 宽高比为16:9的视频 */
}

.video-container video {
	position: absolute;
	top: -120px;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: fill;
	/* 确保视频内容覆盖整个元素区域 */
}

.videoContainer {
	height: 100%;
	width: 100%;
	overflow: hidden;
	position: relative;
	justify-content: center;
	display: flex;
}

.videoContainer::before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	padding-bottom: calc(250% / 19.2);
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0));
	background: -o-linear-gradient(bottom, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0));
	background: -moz-linear-gradient(bottom, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0));
	background: linear-gradient(to bottom, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0));
}

.videoContainer video {
	object-fit: fill;
	width: 100%;
	min-height: 100%;
}





.common2{
	width: 100%;
   
   
   }
   
   .common2 .titlemore2 {
	   height: 0.55rem;
	   margin-bottom: 0.1rem;
	   padding-top: 0.1rem;
	   margin-right: 0.6rem;
	   width: calc(100% - 1.2rem);
	   float: left;
	   margin-top: 0.5rem;
	   margin-left: 1.82rem;
	   margin-right: 1.83rem;
	   margin-bottom: 0.5rem;
   }
   
   .common2 .titlemore2 span {
	   display: inline-block;
	   cursor: pointer;
	   font-size: 0.3rem;
	   font-family: "AlibabaExtraBold";
	   margin-right: 0.7rem;
	   color: #1c1f2366;
	   text-align: center;
   
   }
   .common2 .titlemore2 span.active {
   
	   color: #1c1f23;
	   border-bottom:3px #000 solid ;
   
   }
   





@media screen and (min-width: 2270px) {
    html{font-size: 128px!important;}
	header ul li {
		font-size: 0.18rem;
		margin-right: 0 ;
	
	}
}
@media screen and (min-width: 1922px) {
	html{font-size: 118px!important;}
	header ul li {
		font-size: 0.18rem;
		margin-right: 0.5rem;
	
	}
	.ywdt .mySwiperywdt {
		width: 17.2rem;

	}
	.qywh .content .mySwiperqywh{
		width: 19.9rem;
	}
	.DevelopmentHistoryitems .swiper-slide{
		width: 2.1rem;
	}
	#swiper-history .swiper-slide .detail .content div.wenzi span {

		background-size: 3.3rem 1.56rem;
		width: 3.3rem;

	}
	#swiper-history .swiper-slide .detail .c2 div.year{
		left: 2.1rem;
	}
	#swiper-history .swiper-slide .detail .c2 div.wenzi span{
		left:  2.1rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.year{
		left:4.2rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.wenzi span{
		left: 4.2rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.year{
		left: 6.3rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.wenzi span{
		left: 6.3rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.year{
		left: 8.4rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.wenzi span{
		left: 8.4rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.year{
		left: 10.5rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.wenzi span{
		left: 10.5rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.year{
		left: 12.6rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.wenzi span{
		left: 12.6rem;
	}
}

@media screen and (max-width: 1910px) {
	
	.DevelopmentHistoryitems .swiper-slide{
		width: 1.85rem;
	}
	#swiper-history .swiper-slide .detail .content div.wenzi span {

		background-size: 2.98rem 1.56rem;
		width: 2.98rem;

	}
	#swiper-history .swiper-slide .detail .c2 div.year{
		left: 1.85rem;
	}
	#swiper-history .swiper-slide .detail .c2 div.wenzi span{
		left:  1.85rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.year{
		left:3.7rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.wenzi span{
		left: 3.7rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.year{
		left: 5.55rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.wenzi span{
		left: 5.55rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.year{
		left: 7.4rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.wenzi span{
		left: 7.4rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.year{
		left: 9.25rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.wenzi span{
		left: 9.25rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.year{
		left: 11.1rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.wenzi span{
		left: 11.1rem;
	}


}

@media screen and (max-width: 1900px) {
	
	header ul li {
		font-size: 0.18rem;
		margin-right: 0.3rem ;
	}


}

@media screen and (max-width: 1800px) {
	header ul li {
		
	}
	html{font-size: 89px!important;}
	.common .titlemore{
		height: 0.85rem;
	}
	.qywh .content {
		margin-top: 0.4rem;
	}
	#swiper-history .swiper{
		height: auto;
	}

	#swiper-history .swiper-slide .detail .content div.wenzi span {

		background-size: 3rem 1.56rem;
		width: 3rem;

	}
		.ywdt .mySwiperywdt {
		width: 13.3rem;

	}
}

@media screen and (max-width: 1680px) {
	html{font-size: 86px!important;}
	header ul li{
		margin-right: 0.2rem;
	}
	.common .titlemore{
		height: 0.9rem;
	}
	.ywdt .hd {

		font-size: 0.20rem;
	}

	.ywdt .mySwiperywdt {
		width: 13.3rem;

	}

	.qywh .content .mySwiperqywh{
		width: 16.9rem;
	}

	#swiper-history .swiper{
		height: auto;
	}

	.DevelopmentHistoryitems .swiper-slide{
		width: 1.80rem;
	}
	#swiper-history .swiper-slide .detail .c2 div.year{
		left: 1.8rem;
	}
	#swiper-history .swiper-slide .detail .c2 div.wenzi span{
		left: 1.8rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.year{
		left:3.6rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.wenzi span{
		left: 3.6rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.year{
		left: 5.4rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.wenzi span{
		left: 5.4rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.year{
		left: 7.2rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.wenzi span{
		left: 7.2rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.year{
		left: 9rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.wenzi span{
		left: 9rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.year{
		left: 10.8rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.wenzi span{
		left: 10.8rem;
	}


}
@media screen and (max-width: 1560px) {

	html{font-size: 82px!important;}
	.ywdt .hd {

		font-size: 0.20rem;
	}
		.ywdt .mySwiperywdt {
		width: 12.6rem;

	}
}
@media screen and (max-width: 1440px) {
	html{font-size: 75px!important;}
	.common .titlemore{
		height: 1rem;
	}
	.ywdt .hd {

		font-size: 0.20rem;
	}

	.ywdt .mySwiperywdt {
		width: 13rem;

	}
	.qywh .content {
		margin-top: 0.3rem;
	}

	.qywh .content .mySwiperqywh{
		width: 17.2rem;
	}

	#swiper-history .swiper{
		height: auto;
	}



}
@media screen and (max-width: 1366px) {
	html{font-size: 71px!important;}
	.ywdt .hd {

		font-size: 0.20rem;
	}
	.ywdt .mySwiperywdt {
		width: 13.4rem;

	}
}

@media screen and (max-width: 1280px) {
	html{font-size: 66px!important;}

	header ul li{
		margin-right: 0.3rem;
	}
	.common .titlemore{
		height: 1rem;
	}
	.ywdt .hd {

		font-size: 0.20rem;
	}
	.ywdt .mySwiperywdt {
		width: 13.4rem;

	}

	.qywh .content {
		margin-top: 0.1rem;
	}

	.qywh .content .mySwiperqywh{
		width: 17.7rem;
	}

	#swiper-history .swiper{
		height: auto;
	}


}

@media screen and (max-width: 1160px) {
	html{font-size: 66px!important;}

	header ul li {
		margin-right: auto;
	}
	.common .titlemore{
		height: 0.9rem;
	}
	.ywdt .hd {

		font-size: 0.20rem;
	}
	.ywdt .mySwiperywdt {
		width: 11.5rem;

	}

	.qywh .content {
		margin-top: 0.1rem;
	}

	.qywh .content .mySwiperqywh{
		width: 15.3rem;
	}

	.other .white {

		margin-left: 0.5rem;
		margin-right: 0.4rem;
	}

	.other {
		height: 3.5rem;
	}
	.gb_container .rh .title {
		margin: 0.15rem 0 0.2rem 0;
	}
	
	#swiper-history .swiper-slide .detail .content div.wenzi span {

		background-size: 2.9rem 1.56rem;
		width: 2.9rem;

	}

	.DevelopmentHistoryitems .swiper-slide{
		width: 1.70rem;
	}
	#swiper-history .swiper-slide .detail .c2 div.year{
		left: 1.7rem;
	}
	#swiper-history .swiper-slide .detail .c2 div.wenzi span{
		left: 1.7rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.year{
		left:3.4rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.wenzi span{
		left: 3.4rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.year{
		left: 5.1rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.wenzi span{
		left: 5.1rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.year{
		left: 6.8rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.wenzi span{
		left: 6.8rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.year{
		left: 8.5rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.wenzi span{
		left: 8.5rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.year{
		left: 10.2rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.wenzi span{
		left:  10.2rem;
	}
}
@media screen and (max-width: 1024px) {
	html{font-size: 60px!important;}
	header ul li {
		margin-right: auto;
	}
	.common .titlemore{
		height: 0.9rem;
	}
	.ywdt .hd {

		font-size: 0.20rem;
	}
	.ywdt .mySwiperywdt {
		width: 11rem;

	}
	#swiper-history .swiper{
		
		height: auto;
	}

	.other {
		height: 3.5rem;
	}

	.gb_container .rh .title {
		margin: 0.05rem 0 0.2rem 0;
	}

	#swiper-history .swiper-slide .detail .content div.wenzi span {

		background-size: 2.8rem 1.56rem;
		width: 2.8rem;

	}

	.DevelopmentHistoryitems .swiper-slide{
		width: 1.6rem;
	}
	#swiper-history .swiper-slide .detail .c2 div.year{
		left: 1.6rem;
	}
	#swiper-history .swiper-slide .detail .c2 div.wenzi span{
		left: 1.6rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.year{
		left:3.2rem;
	}
	#swiper-history .swiper-slide .detail .c3 div.wenzi span{
		left: 3.2rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.year{
		left: 4.8rem;
	}
	#swiper-history .swiper-slide .detail .c4 div.wenzi span{
		left: 4.8rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.year{
		left: 6.4rem;
	}
	#swiper-history .swiper-slide .detail .c5 div.wenzi span{
		left: 6.4rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.year{
		left: 8.0rem;
	}
	#swiper-history .swiper-slide .detail .c6 div.wenzi span{
		left: 8.0rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.year{
		left: 9.6rem;
	}
	#swiper-history .swiper-slide .detail .c7 div.wenzi span{
		left:  9.6rem;
	}
}

@media screen and (max-width: 668px) {
	html{font-size: 50px!important;}
	
}