.productdisplay {
	font-family: HarmonyOS_Sans_SC;
	padding-bottom: 3vw;
	/* background: linear-gradient(180deg, #e7f0fd 0%, #ffffff 100%); */
	background: linear-gradient(to left, #d1e7ff, #bce0ff, #ddedff);
}

h1 {
	text-align: center;
	font-size: 2.5vw;
	font-weight: 600;
	color: #0f313e;
	cursor: default;
}

.productdisplay>h1 {
	padding-top: 12vw;
	margin-bottom: 3vw;
}

.productoption {
	display: flex;
	justify-content: center;
	margin-bottom: 3vw;
	gap: 4vw;
}

.productoption>li {
	display: flex;
	width: 10%;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 1vw;
	border: solid transparent 0.3vw;
	border-radius: 1vw;
	transition: all 1s;
	border: solid white 0.3vw;
	z-index: 1;
}

.productoption>li:hover {
	/* background: linear-gradient(to right, #d9e9ff, #edf6ff); */
	cursor: pointer;
	/* background: linear-gradient(180deg, rgba(134, 189, 255, .45) 0%, rgba(167, 210, 255, .23) 100%); */
	transform: scale(1.2);
}

.productoption>li>span {
	font-size: 1.2vw;
	color: #222831;
	font-weight: 600;
}

.productoption>li>img {
	width: 50%;
	margin-bottom: 1vw;
}

.swiper {
	width: 82%;
	height: 48vw;
	border-radius: 1vw;
	margin: 0 auto;
	margin-bottom: 3vw;
	z-index: 0 !important;
}

.swiper-wrapper {
	height: 100%;
}

.swiper-slide {
	width: 100%;
	height: 100%;
}

.swiper-slide img {
	width: 100%;
	height: 100%;
}

.applications {
	margin-top: 4vw;
	font-family: HarmonyOS_Sans_SC;
	margin-bottom: 6vw;
}

.applications>h1 {
	margin-bottom: 4vw;
}

.applications>ul {
	width: 85%;
	display: flex;
	justify-content: center;
	gap: 4vw;
	border-bottom: 0.1vw solid #d9d9d9;
	margin: 0 auto;
	cursor: pointer;
	margin-bottom: 4vw;
}

.applications>ul>li {
	font-size: 1.45vw;
	padding-bottom: 1vw;
	font-weight: normal;
	color: #000;
	border-bottom: 0.2vw solid transparent;
	transition: all 0.3s;
	z-index: 4;
}

.applications>ul>li:first-child {
	border-bottom: 0.2vw solid #006EFF;
}

.applicationshow {
	width: 80%;
	height: 40vw;
	margin: 0 auto;
	border-radius: 1vw;
	overflow: hidden;
	margin-bottom: 6vw;
}

.applicationshow>div {
	width: 100%;
	height: 100%;
	display: flex;
	border-radius: 1vw;
	transition: all 1s;
}

.applicationshow>div>img {
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	border-radius: 1vw;
}

.contacts {
	margin-top: 3vw;
	display: flex;
	justify-content: center;
	gap: 4vw;
	font-size: 1.45vw;
	margin-bottom: 3vw;
}

.contacts>div:first-child {
	background-color: #006EFF;
	color: white;
	border-radius: 2vw;
	padding: 0.8vw 2.5vw 0.8vw 2.5vw;
	cursor: pointer;
}

.contacts>div:first-child:hover {
	background: linear-gradient(134deg, #00a4ff 0%, #006eff 100%);
}

.contacts>div:last-child {
	border: solid #006EFF 0.1vw;
	color: #006EFF;
	border-radius: 2vw;
	padding: 0.6vw 2.5vw 0.6vw 2.5vw;
	cursor: pointer;
}

.whyselect {
	margin-top: 4vw;
	color: #222831;
	margin-bottom: 10vw;
}

.whyselect>h1 {
	margin-top: 4vw;
	margin-bottom: 4vw;
}

.cardul {
	display: flex;
	justify-content: center;
	gap: 4vw;
	margin-bottom: 8vw;
}

.cardul>li {
	width: 18%;
	height: auto;
	border: solid 0.1vw #31608b14;
	border-radius: 0.4vw;
	cursor: default;
	transition: all 0.5s;
	z-index: 3;
}

.cardul>li:hover {
	transform: scale(1.05);
	border: solid #006EFF 0.1vw;
}

.cardul>li>div:first-child {
	color: white;
	height: 20%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5vw;
	background: linear-gradient(134deg, #00a4ff 0%, #006eff 100%);
	border-radius: 0.4vw;
}

.cardul>li>div:nth-child(2) {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 12%;
	padding-top: 1vw;
	padding-bottom: 1vw;
}

.cardul>li>div:nth-child(2) img {
	height: 100%;
}

.cardul>li>div:nth-child(3)>div:first-child {
	display: flex;
	align-items: center;
	justify-content: start;
	padding-left: 2vw;
	font-size: 1.15vw;
	margin-top: 1vw;
	margin-bottom: 2vw;
	font-weight: 600;
}

.cardinnerul>li {
	display: flex;
	justify-content: start;
	background-color: white;
	margin-bottom: 2vw;
	padding-left: 2vw;
	font-size: 1vw;
	line-height: 1.5vw;
	color: #555;
}

.zhibo {
	padding-top: 4vw;
	color: #22283;
	padding-bottom: 4vw;
	margin-bottom: 2vw;
}

.zhibo>h1 {
	margin-bottom: 4vw;
}

.zhibo>div {
	width: 85%;
	margin: 0 auto;
	overflow: hidden;
}

.zhiboshow {
	display: flex;
	justify-content: space-between;
	gap: 4vw;
	width: auto;
	padding-left: 1vw;
	padding-right: 2vw;
	animation: lunxun 30s linear infinite;
	margin-bottom: 6vw;
}

@keyframes lunxun {
	25% {
		transform: translateX(-45%);
	}

	50% {
		transform: translateX(-90%);
	}

	75% {
		transform: translateX(-135%);
	}

	100% {
		transform: translateX(-160%);
	}
}

.zhiboshow>div {
	width: 18.25vw;
	flex-shrink: 0;
}

.zhiboshow>div img {
	width: 100%;
	height: 34.5vw;
	margin-bottom: 1vw;
	border-radius: 0.4vw;
}

.zhiboshow>div>div:first-child {
	overflow: hidden;
}

.zhiboshow>div>div {
	text-align: center;
	font-size: 1.25vw;
	font-weight: 600;
}

.shuzhipeople {
	padding-top: 4vw;
	padding-bottom: 4vw;
	color: #222831;
}

.shuzhipeople>p {
	text-align: center;
	margin-top: 2vw;
	margin-bottom: 2vw;
	font-size: 1.45vw;
}

.shuzhipeople>div {
	width: 85%;
	margin: 0 auto;
	margin-top: 4vw;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-right: 6vw;
}

.shuzhileft {
	font-size: 1.45vw;
}

.shuzhileft>ul>li {
	cursor: pointer;
	margin-bottom: 1vw;
	padding: 1vw 2vw 1vw 2vw;
	font-family: HarmonyOS_Sans_SC;
	font-weight: 600;
	opacity: 0.9;
	border-radius: 0.4vw;
	transition: all 0.5s;
}

.shuzhileft>ul>li:last-child {
	margin-bottom: 0;
}

.shuzhileft>ul>li:hover {
	background: linear-gradient(to right, #eff5fe, #e3eefe, #d3e5fd);
	color: #006EFF;
}

.shuzhiright>div {
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	box-shadow: 0 0 1vw #ccc;
	border-radius: 1vw;
}

.shuzhiright {
	width: 40vw;
	height: 26vw;
	border-radius: 1vw;
}

#videoAr {
	width: 100%;
	height: 100%;
	border-radius: 1vw;
	/*object-fit: cover;*/
}

#videoArs {
	width: 100%;
	height: 100%;
	border-radius: 1vw;
	/*object-fit: cover;*/
}

.plyr__poster {
	background-size: 100% 100% !important;
}

.plyr {
	width: 100%;
	height: 100%;
	border-radius: 1vw;
}

/* .shuzhiright>div video {
	width: 100%;
	height: 100%;
	z-index: 5;
} */

.aiwenan {
	padding-top: 4vw;
	background-color: rgba(228, 242, 254, .5);
}

.aicard {
	display: flex;
	justify-content: center;
	padding-top: 4vw;
	flex-wrap: wrap;
	margin-bottom: 5vw;
	padding-bottom: 6vw;
	gap: 4vw;
	color: #222831;
}

.aicard>div {
	padding: 2vw;
	width: 35%;
	background-color: #ffffff;
	border-radius: 1vw;
	border: 0.1vw solid #f0f5fa;
	cursor: default;
}

.aicard>div img {
	border-radius: 1vw;
	width: 100%;
}

.innercard>div {
	font-size: 1.65vw;
	font-weight: 600;
	border-radius: 1vw;
	margin-top: 2vw;
	margin-bottom: 2vw;
}

.innercard>p {
	color: #22283180;
	font-size: 1vw;
}

.innercard>section {
	color: white;
	background-color: #006EFF;
	font-size: 1vw;
	border-radius: 1.8vw;
	padding: 1vw 2.5vw 1vw 2.5vw;
	cursor: pointer;
	width: 16%;
	text-align: center;
	margin-top: 2vw;
}

.innercard>section:hover {
	background: linear-gradient(134deg, #00a4ff 0%, #006eff 100%);
}

.kelongshow {
	width: 60%;
	display: flex;
	justify-content: center;
	margin: 0 auto;
	margin-top: 3vw;
	border-radius: 1vw;
	overflow: hidden;
}

.kelongshow img {
	transition: all 1s;
	width: 100%;
	height: 30vw;
	border-radius: 1vw;
	flex-shrink: 0;
}

.kelongshow .plyr {
    width: 100%;
    height: 30vw;
    flex-shrink: 0;
    z-index: 6 !important;
}

.kelongshow>div {
	border-radius: 1vw;
	transition: all 1s;
	display: flex;
}

.kelongshow img:hover {
	transform: scale(1.2);
}

.qiehuankelong {
	display: flex;
	justify-content: center;
	margin-top: 1vw;
	margin-bottom: 10vw;
}

.qiehuankelong>ul {
	display: flex;
	justify-content: space-around;
	background-color: white;
	width: 26%;
	padding: 1vw;
	border-radius: 1vw;
	box-shadow: 0 0 0.5vw #d6e1f7b3;
	margin-top: 2vw;
}

.qiehuankelong>ul>li {
	width: 30%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding-top: 1vw;
	padding-bottom: 1vw;
	border-radius: 1vw;
	cursor: pointer;
	overflow: hidden;
	transition: all 0.5s;
}

.qiehuankelong>ul>li:hover {
	background-color: #006EFF;
	color: white;
}

.qiehuankelong>ul>li:hover img {
	transform: translateY(-12vw);
	filter: drop-shadow(white 0 12vw);
}

.qiehuankelong>ul>li div {
	font-size: 1.25vw;
	width: 100%;
	text-align: center;
	opacity: 0.85;
}

.qiehuankelong>ul>li img {
	width: 40%;
	margin-bottom: 1vw;
}

.desc2c,
.desc3c {
	display: none;
}

.desc {
	position: relative;
	font-size: 1.25vw;
	width: 50%;
	margin: 0 auto;
	margin-top: 2vw;
	color: #222831;
	line-height: 2vw;
	height: 10vw;
	overflow: hidden;
	word-break: break-all;
}

.kehu {
	margin-top: 8vw;
}

.kehushow {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 4vw;
	padding-bottom: 4vw;
}

.kehushow>div {
	width: 15%;
	text-align: center;
	margin-bottom: 2vw;
}

.kehushow>div img {
	width: 65%;
	height: 9.75vw;
	box-shadow: 0 0 1vw #eee;
	border-radius: 0.4vw;
	border: solid #eee 0.1vw;
}

@media (max-width:768px) {
	.productdisplay>h1 {
		padding-top: 24vw;
		margin-bottom: 3vw;
	}

	h1 {
		font-size: 4.5vw;
	}

	.productoption {
		display: none;
	}

	.swiper {
		width: 90%;
		height: 52.6vw;
		margin-top: 10vw;
	}

	.shuzhipeople>p {
		font-size: 2.6vw;
	}


	.shuzhipeople>div {
		width: 100%;
		justify-content: center;
		flex-wrap: wrap;
		flex-direction: column-reverse;
		box-sizing: border-box;
		padding-right: 0;
	}

	.shuzhiright {
		width: 90vw;
		height: 52vw;
		border-radius: 1vw;
		margin-top: 4vw;
	}
	
	.kehushow>div img {
	    width: 65%;
	    height: 22.75vw;
    }

	.shuzhileft {
		font-size: 3.45vw;
		margin-top: 10vw;
	}

	.shuzhileft>ul>li {
		text-align: center;
	}

	.zhiboshow>div {
		width: 30.25vw;
	}

	.zhiboshow {
		margin-bottom: 10vw !important;
	}

	.zhiboshow>div>div {
		text-align: center;
		font-size: 3.25vw;
	}

	@keyframes lunxun {
		25% {
			transform: translateX(-75%);
		}

		50% {
			transform: translateX(-150%);
		}

		75% {
			transform: translateX(-225%);
		}

		100% {
			transform: translateX(-300%);
		}
	}

	.contacts {
		flex-direction: column;
		text-align: center;
		font-size: 3.45vw;
		width: 30vw !important;
	}

	.aicard>div {
		width: 40%;
	}

	.innercard>div {
		font-size: 3.65vw;
	}

	.innercard>p {
		font-size: 2.5vw;
	}

	.innercard>section {
		font-size: 3vw;
		padding: 1.2vw 2.5vw 1.2vw 2.5vw;
		width: 30%;
	}

	.kelongshow {
		width: 90%;
	}

	.kelongshow img {
		height: 45vw;
	}
	
	.kelongshow .plyr {
        height: 45vw;
    }

	.desc {
		font-size: 3.25vw;
		width: 90%;
		line-height: 5vw;
		height: 25vw;
	}

	.qiehuankelong>ul {
		width: 45%;
	}

	.qiehuankelong>ul>li {
		width: 40%;
	}

	.qiehuankelong>ul>li div {
		font-size: 3.25vw;
	}

	.cardul {
		flex-wrap: wrap;
		gap: 2vw;
		margin-top: 10vw;
	}

	.cardul>li>div:first-child {
		font-size: 3.8vw;
	}

	.cardul>li>div:nth-child(3)>div:first-child {
		font-size: 3.15vw;

	}

	.cardinnerul>li {
		font-size: 3vw;
		line-height: 5.5vw;
		padding-right: 2vw;
	}

	.cardul>li>div:nth-child(2) {
		height: 12%;
		padding-top: 5vw;
		padding-bottom: 5vw;
	}

	.cardul>li {
		width: 45%;
		margin-bottom: 6vw;
	}

	.indexcontacts {
		margin: 0 auto;
	}

	.applications>ul {
		width: 90%;
	}

	.applications>ul>li {
		font-size: 3.25vw;
		border-bottom: 0.4vw solid transparent;
		transition: all 0.3s;
		z-index: 4;
	}

	.applicationshow {
		width: 90%;
		height: 50vw;
	}
	
	.kehushow {
	    margin-top: 8vw;
	}
	
	.kehushow>div {
	    width: 40%;
	    margin-bottom: 4vw;
	}
	
	.zhibo>h1 {
	    margin-bottom: 8vw;
	}
	
	.zhiboshow>div img {
        height: 55.8vw;
    }
}
