.header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0px 20px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
	position: fixed;
	z-index: 99;
}

.borderBtnVal {
	margin-bottom: 10px;
}

.header.active {
	background-color: #3f51b5;
	transition: all 1s;
}

.head-logo {
	gap: 13px;
	display: inline-flex;
	align-items: center;
	position: relative;
	flex: 0 0 auto;
}

img {
	max-width: 100%;
}

.img {
	position: relative;
	width: 200px;
	height: 50px;
}

.frame {
	display: inline-flex;
	align-items: flex-start;
	gap: 10px;
	padding: 5px 10px;
	position: relative;
	flex: 0 0 auto;
	background-color: rgba(84, 125, 229, 1);
	border-radius: 8px;
}

.text-wrapper {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #ffffff;
	font-size: 16px;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.head-nav {
	height: 70px;
	justify-content: center;
	gap: 60px;
	display: inline-flex;
	align-items: center;
	position: relative;
	flex: 0 0 auto;
}

.nav-item {
	display: inline-flex;
	height: 40px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 10px 2px;
	position: relative;
	flex: 0 0 auto;
	cursor: pointer;
}

.div {
	width: fit-content;
	margin-top: -4.5px;

	font-weight: 400;
	color: #ffffff;
	font-size: 16px;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.nav-line {
	position: absolute;
	width: 22px;
	height: 3px;
	top: 36px;
	left: 50%;
	margin-left: -11px;
	opacity: 0;

}

.nav-item:hover .nav-line {
	opacity: 1;
	transition: all 0.5s;
}


.nav-line-2 {
	left: 188px;
	position: absolute;
	width: 1px;
	height: 1px;
	top: 3735px;
}

.nav-line-3 {
	left: 92px;
	position: absolute;
	width: 1px;
	height: 1px;
	top: 3735px;
}

.nav-line-4 {
	left: -52px;
	position: absolute;
	width: 1px;
	height: 1px;
	top: 3735px;
}

.nav-line-5 {
	left: -196px;
	position: absolute;
	width: 1px;
	height: 1px;
	top: 3735px;
}

.nav-line-6 {
	left: -348px;
	position: absolute;
	width: 1px;
	height: 1px;
	top: 3735px;
}

.head-tel {
	gap: 8px;
	border-radius: 18px;
	display: inline-flex;
	align-items: center;
	position: relative;
	flex: 0 0 auto;
}

.img-2 {
	position: relative;
	width: 32px;
	height: 32px;
}

.head-tel-text {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	position: relative;
	flex: 0 0 auto;
}

.head-tel-text a {
	color: #fff;
}

.text-wrapper-2 {
	position: relative;
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #ffffff;
	font-size: 12px;
	letter-spacing: 0;
	line-height: normal;
}

.text-wrapper-3 {
	font-family: "Microsoft YaHei-Bold", Helvetica;
	font-weight: 700;
	color: #ffffff;
	font-size: 18px;
	position: relative;
	width: fit-content;
	letter-spacing: 0;
	line-height: normal;
}

.banner {
	position: relative;
	align-self: stretch;
	width: 100%;
	object-fit: cover;
}

.steps {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 20px 20px 0 20px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.step-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	padding: 20px;
	position: relative;
	flex-grow: 1;
}

.step-item-2 {
	position: relative;
	width: 80px;
	height: 80px;
}

.text-wrapper-4 {
	color: #333333;
	font-size: 16px;
	line-height: normal;
	position: relative;
	width: fit-content;

	font-weight: 400;
	letter-spacing: 0;
}

.step-icon {
	position: relative;
	flex: 0 0 auto;
	height: 60px;
}

.about {
	display: flex;
	max-width: 1780px;
	align-items: center;
	justify-content: space-between;
	padding: 20px;
	position: relative;
	align-self: stretch;
	width: 100%;
	margin: 0 auto;
}

.about-left {
	position: relative;
	width: 740px;
	height: 700px;
	border-radius: 10px;
	background-image: url(../img/18599cca7ecaa52450efca816c859f4-1.png);
	background-size: cover;
	background-position: 50% 50%;
}

.about-cont {
	display: flex;
	flex-direction: column;
	width: 940px;
	align-items: flex-start;
	gap: 55px;
	padding: 20px;
	position: relative;
	background-color: #ffffff33;
	border-radius: 10px;
}

.about-head {
	display: flex;
	align-items: center;
	gap: 10px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.div-2 {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	position: relative;
	flex: 0 0 auto;
}

.text-wrapper-5 {
	width: fit-content;
	margin-top: -1px;
	font-family: "Microsoft YaHei-Bold", Helvetica;
	font-weight: 700;
	color: #333333;
	font-size: 28px;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.about-head-line {
	position: relative;
	flex: 1;
	flex-grow: 1;
	width: 100px;
}

.p {
	color: #666666;
	font-size: 16px;
	position: relative;
	width: fit-content;

	font-weight: 400;
	letter-spacing: 0;
	line-height: normal;
}

.span {

	font-weight: 400;
	color: #666666;
	font-size: 16px;
	letter-spacing: 0;
}

.text-wrapper-6 {
	font-size: 20px;
}

.about-head-tag {
	position: relative;
	width: 42px;
	height: 22px;
	background-color: #4e6ef2;
	border-radius: 5px;
}

.text-wrapper-7 {
	position: absolute;
	top: 0;
	left: 7px;

	font-weight: 400;
	color: #ffffff;
	font-size: 14px;
	letter-spacing: 0;
	line-height: normal;
}

.flexcontainer {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

.text {
	align-self: stretch;

	font-weight: 400;
	color: rgba(79, 79, 79, 1);
	font-size: 16px;
	line-height: 28px;
	position: relative;
	letter-spacing: 0;
}

.text-wrapper-8 {

	font-weight: 400;
	color: #4f4f4f;
	font-size: 16px;
	letter-spacing: 0;
	line-height: 28px;
}

.about-zizhi {
	display: flex;
	align-items: flex-start;
	gap: 40px;
	padding: 0px 0px 40px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
	overflow-x: auto;
}

.about-zizhi-2 {
	position: relative;
	width: 420px;
	height: 280px;
	object-fit: cover;
}

.about-zizhi-3 {
	position: relative;
	width: 200px;
	height: 280px;
	object-fit: cover;
}

.project-part {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	padding: 50px 0px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
	background-color: #f4f4f4;
}

.frame-2 {
	display: flex;
	max-width: 1600px;
	width: 100%;
	align-items: center;
	gap: 10px;
	padding: 0px 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-3 {
	display: flex;
	align-items: center;
	padding: 1px 0px 0px;
	position: relative;
	flex: 1;
	flex-grow: 1;
}

.ellipse {
	position: relative;
	width: 9px;
	height: 9px;
	border-radius: 4.5px;
	border: 1px solid;
	border-color: #d9d9d9;
}

.line-stroke {
	position: relative;
	flex: 1;
	flex-grow: 1;
	height: 1px;
}

.text-wrapper-9 {
	font-size: 22px;
}

.frame-4 {
	display: flex;
	max-width: 1600px;
	width: 100%;
	align-items: flex-end;
	gap: 40px;
	padding: 0px 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-5 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	position: relative;
	flex: 1;
	flex-grow: 1;
}

.title {
	padding: 0px 0px 20px;
	align-self: stretch;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-6 {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 20px 0px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-color: #dddddd;
}

.text-wrapper-10 {
	width: fit-content;
	margin-top: -1px;
	font-family: "Microsoft YaHei-Bold", Helvetica;
	font-weight: 700;
	color: #333333;
	font-size: 32px;
	text-align: center;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.this-is-a-title {
	position: relative;
	flex: 1;

	font-weight: 400;
	color: #dddddd;
	font-size: 24px;
	text-align: right;
	letter-spacing: 0;
	line-height: normal;
}

.text-wrapper-11 {
	align-self: stretch;

	font-weight: 400;
	color: #333333;
	font-size: 16px;
	line-height: 28px;
	position: relative;
	letter-spacing: 0;
}

.frame-7 {
	display: flex;
	align-items: flex-start;
	gap: 30px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.frame-8 {
	background-color: #b69666;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	padding: 10px 12px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	border-radius: 5px;
	align-self: stretch;
}

.text-wrapper-12 {
	position: relative;
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #ffffff;
	font-size: 18px;
	letter-spacing: 0;
	line-height: 24px;
	white-space: nowrap;
}

.text-wrapper-13 {
	position: relative;
	align-self: stretch;

	font-weight: 400;
	color: #ffffff;
	font-size: 14px;
	letter-spacing: 0;
	line-height: 24px;
}

.frame-9 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	padding: 10px 12px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	background-color: #778ec7;
	border-radius: 5px;
	align-self: stretch;
}

.frame-10 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	padding: 10px 12px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	background-color: #607d8b;
	border-radius: 5px;
	align-self: stretch;
}

.text-wrapper-14 {

	font-weight: 400;
	color: #ffffff;
	font-size: 14px;
	line-height: 24px;
	position: relative;
	letter-spacing: 0;
}

.rectangle {
	position: relative;
	width: 500px;
	height: 340px;
	object-fit: cover;
}

.project-part-2 {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
	padding: 40px 0px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.frame-11 {
	display: flex;
	max-width: 1600px;
	width: 100%;
	align-items: center;
	gap: 40px;
	padding: 0px 20px;
	position: relative;
	flex: 0 0 auto;
}

.project-pic {
	position: relative;
	width: 580px;
	height: 420px;
}

.frame-12 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	position: relative;
	flex: 1;
	flex-grow: 1;
}

.frame-13 {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 8px 8px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.div-wrapper {
	display: flex;
	width: 229px;
	height: 44px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 8px 10px;
	position: relative;
	background-color: #2196f3;
	border-radius: 4px;
}

.text-wrapper-15 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #ffffff;
	font-size: 16px;
	line-height: 28px;
	white-space: nowrap;
	position: relative;
	letter-spacing: 0;
}

.frame-14 {
	display: flex;
	width: 229px;
	height: 44px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 8px 10px;
	position: relative;
	background-color: #009688;
	border-radius: 4px;
}

.frame-15 {
	display: flex;
	width: 229px;
	height: 44px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 8px 10px;
	position: relative;
	background-color: #f44336;
	border-radius: 4px;
}

.frame-16 {
	display: flex;
	width: 229px;
	height: 44px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 8px 10px;
	position: relative;
	background-color: #607d8b;
	border-radius: 4px;
}

.frame-17 {
	display: flex;
	width: 229px;
	height: 44px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 8px 10px;
	position: relative;
	background-color: #ff9800;
	border-radius: 4px;
}

.frame-18 {
	display: flex;
	width: 229px;
	height: 44px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 8px 10px;
	position: relative;
	background-color: #3f51b5;
	border-radius: 4px;
}

.frame-19 {
	display: flex;
	width: 229px;
	height: 44px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 8px 10px;
	position: relative;
	background-color: #00bcd4;
	border-radius: 4px;
}

.frame-20 {
	display: flex;
	width: 229px;
	height: 44px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 8px 10px;
	position: relative;
	background-color: rgba(84, 125, 229, 1);
	border-radius: 4px;
}

.frame-21 {
	display: flex;
	max-width: 1600px;
	width: 100%;
	align-items: flex-start;
	justify-content: center;
	padding: 0px 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-22 {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 0px 0px 20px;
	position: relative;
	flex: 1;
	flex-grow: 1;
}

.img-3 {
	position: relative;
	width: 120px;
	height: 120px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.img-3A {
	background-image: url(../img/advantage-1icon.png);
}

.img-3B {
	background-image: url(../img/advantage-2icon.png);
}

.img-3C {
	background-image: url(../img/advantage-3icon.png);
}

.img-3D {
	background-image: url(../img/advantage-4icon.png);
}

.component:hover .img-3A {
	background-image: url(../img/advantage-1iconW.png);
}

.component:hover .img-3B {
	background-image: url(../img/advantage-2iconW.png);
}

.component:hover .img-3C {
	background-image: url(../img/advantage-3iconW.png);
}

.component:hover .img-3D {
	background-image: url(../img/advantage-4iconW.png);
}

.frame-23 {
	display: flex;
	align-items: center;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.line {
	flex: 1;
	flex-grow: 1;
	object-fit: cover;
	position: relative;
	height: 1px;
	width: 40%;
}

.overlap-group-wrapper {
	position: relative;
	width: 28px;
	height: 28px;
}

.overlap-group {
	position: relative;
	width: 24px;
	height: 28px;
	left: 2px;
	background-image: url(../img/polygon-1.png);
	background-size: 100% 100%;
}

.text-wrapper-16 {
	position: absolute;
	top: 6px;
	left: 8px;
	color: #ffffff;
	font-size: 14px;
	line-height: 14px;

	font-weight: 400;
	text-align: center;
	letter-spacing: 0;
	white-space: nowrap;
}

.text-wrapper-17 {
	color: #000000;
	font-size: 18px;
	text-align: center;
	line-height: 32px;
	white-space: nowrap;
	position: relative;
	width: fit-content;

	font-weight: 400;
	letter-spacing: 0;
}

.project-part-3 {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	padding: 40px 0px 80px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
	background-color: #f3f3f3;
}

.title-2 {
	max-width: 1600px;
	width: 100%;
	padding: 0px 20px 20px 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-24 {
	display: flex;
	max-width: 1600px;
	width: 100%;
	align-items: flex-start;
	gap: 20px;
	position: relative;
	flex: 0 0 auto;
	padding: 0 20px;
}

.frame-25 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	padding: 20px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	background-color: #ffffff;
	border-radius: 10px;
	align-self: stretch;
}

.frame-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 150px;
	border-radius: 5px;
	overflow: hidden;
	background-image: url(../img/advantagepic-01.png);
	background-size: cover;
	background-position: 50% 50%;
}

.frame-26 {
	display: inline-flex;
	height: 40px;
	align-items: center;
	gap: 5px;
	padding: 5px 15px;
	background-color: #4bb3c2;
	border-radius: 20px;
}

.advantage-icon {
	position: relative;
	width: 24px;
	height: 24px;
}

.text-wrapper-18 {
	width: fit-content;
	color: #ffffff;
	font-size: 20px;
	line-height: normal;
	position: relative;

	font-weight: 400;
	letter-spacing: 0;
}

.text-wrapper-19 {
	align-self: stretch;
	color: #333333;
	font-size: 14px;
	line-height: 24px;
	position: relative;

	font-weight: 400;
	letter-spacing: 0;
}

.frame-27 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.frame-28 {
	display: flex;
	align-items: flex-start;
	gap: 5px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.frame-29 {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	position: relative;
	align-self: stretch;
	flex: 0 0 auto;
}

.group {
	position: relative;
	width: 12px;
	height: 12px;
}

.rectangle-2 {
	position: relative;
	flex: 1;
	width: 2px;
	flex-grow: 1;
}

.frame-30 {
	display: flex;
	align-items: flex-start;
	padding: 0px 0px 20px;
	position: relative;
	flex: 1;
	flex-grow: 1;
}

.rectangle-3 {
	position: relative;
	width: 6px;
	height: 12px;
}

.frame-31 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	padding: 10px 12px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	background-color: #4bb3c212;
	border-radius: 0px 5px 5px 5px;
}

.text-wrapper-20 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #4bb3c2;
	font-size: 18px;
	line-height: 24px;
	white-space: nowrap;
	position: relative;
	letter-spacing: 0;
}

.text-wrapper-21 {
	align-self: stretch;

	font-weight: 400;
	color: #666666;
	font-size: 14px;
	line-height: 24px;
	position: relative;
	letter-spacing: 0;
}

.frame-32 {
	background-image: url(../img/advantagepic-02.png);
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 150px;
	border-radius: 5px;
	overflow: hidden;
	background-size: cover;
	background-position: 50% 50%;
}

.frame-33 {
	background-color: rgba(47, 128, 237, 1);
	display: inline-flex;
	height: 40px;
	align-items: center;
	gap: 5px;
	padding: 5px 15px;
	border-radius: 20px;
}

.frame-34 {
	background-color: #f4f7f9;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	padding: 10px 12px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	border-radius: 0px 5px 5px 5px;
}

.text-wrapper-22 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #2f80ed;
	font-size: 18px;
	line-height: 24px;
	white-space: nowrap;
	position: relative;
	letter-spacing: 0;
}

.frame-35 {
	background-color: #f5f7fa;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	padding: 10px 12px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	border-radius: 0px 5px 5px 5px;
}

.frame-36 {
	background-image: url(../img/advantagepic-03.png);
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 150px;
	border-radius: 5px;
	overflow: hidden;
	background-size: cover;
	background-position: 50% 50%;
}

.frame-37 {
	background-color: #9155c0;
	display: inline-flex;
	height: 40px;
	align-items: center;
	gap: 5px;
	padding: 5px 15px;
	border-radius: 20px;
}

.frame-38 {
	background-color: #f7f4f9;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	padding: 10px 12px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	border-radius: 0px 5px 5px 5px;
}

.text-wrapper-23 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #9156c0;
	font-size: 18px;
	line-height: 24px;
	white-space: nowrap;
	position: relative;
	letter-spacing: 0;
}

.project-part-4 {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	padding: 40px 0px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.title-3 {
	max-width: 1600px;
	width: 100%;
	padding: 0px 20px 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-39 {
	display: flex;
	flex-wrap: wrap;
	max-width: 1600px;
	width: 100%;
	align-items: flex-start;
	gap: 40px 0;
	padding: 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-40 {
	display: flex;
	flex-direction: column;
	width: 12.5%;
	height: 108px;
	align-items: center;
	gap: 12px;
	position: relative;
}

.function-icon {
	position: relative;
	width: 72px;
	height: 72px;
}

.text-wrapper-24 {
	width: fit-content;

	font-weight: 400;
	color: #333333;
	font-size: 16px;
	text-align: center;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.product-features {
	padding: 80px 0 70px;
	display: flex;
	flex-direction: column;
	align-items: center;
	background-image: url(../img/product-features-bj.jpg);
	background-size: 100%;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
}

.product-features-subTitle {
	max-width: 1600px;
	width: 100%;
	margin: 30px auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.product-subTitle-txt {
	font-weight: 600;
	font-size: 32px;
	letter-spacing: 6%;
}

.product-demonstrate-btn {
	height: 60px;
	width: 200px;
	background-color: #4F9CF9;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	font-size: 24px;
	letter-spacing: -2%;

}

.product-features .arrow-right {
	width: 20px;
	height: 20px;
	margin-left: 10px;
}

.product-features-content {
	max-width: 1600px;
	width: 100%;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}



.product-card {
	border-radius: 10px;
	overflow: hidden;
	padding: 40px 30px;
	background-color: #FFFFFF;
	display: flex;
	flex-direction: column;
	transition: all 0.5s;
}

.product-card:nth-child(1) {
	--color: #6A85FF;
}

.product-card:nth-child(2) {
	--color: #34A853;
}

.product-card:nth-child(3) {
	--color: #EA4437;
}

.product-card:nth-child(4) {
	--color: #3F69A9;
}

.product-card:nth-child(5) {
	--color: #4285F4;
}

.product-card:nth-child(6) {
	padding: 0;
}

.product-card .product-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.product-card:hover {
	background-color: var(--color);
}



.product-card .card-title {
	font-weight: 600;
	font-size: 30px;
	color: var(--color);
	display: flex;
	align-items: center;
}

.product-card:hover .card-title {
	color: #ffffff;
}

.product-card .card-title .card-icon {
	width: 64px;
	height: 64px;
	border-radius: 24px;
	background-color: var(--color);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 20px;
}

.product-card:hover .card-title .card-icon {
	background-color: rgba(255, 255, 255, 0.2);
}

.product-card .card-title .card-icon img {
	width: 40px;
	height: 40px;

}

.product-card .card-content {
	font-size: 18px;
	line-height: 1.8em;
	color: #333333;
	margin-top: 30px;
	flex: 1;
}

.product-card:hover .card-content {
	color: #ffffff;
}

.product-card .card-interval {
	width: 60px;
	height: 8px;
	background-color: var(--color);
	margin-top: 30px;
}

.product-card:hover .card-interval {
	background-color: #ffffff;
}




.customer {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
	padding: 70px 0px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
	background-image: url(../img/customer.jpg);
	background-size: cover;
	background-position: 50% 50%;
	background-attachment: fixed;
}

.text-wrapper-25 {
	width: fit-content;
	margin-top: -1px;
	font-family: "Microsoft YaHei-Bold", Helvetica;
	font-weight: 700;
	color: #ffffff;
	font-size: 28px;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.APP {
	position: relative;
	width: fit-content;

	font-weight: 400;
	color: #ffffffcc;
	font-size: 16px;
	letter-spacing: 0;
	line-height: normal;
}

.text-wrapper-26 {

	font-weight: 400;
	color: #ffffffcc;
	font-size: 16px;
	letter-spacing: 0;
}

.customerList {
	display: flex;
	flex-wrap: wrap;
	max-width: 1600px;
	width: 100%;
	align-items: flex-start;
	gap: 30px;
	padding: 10px 20px;
	position: relative;
	flex: 0 0 auto;
}

.view {
	display: inline-flex;
	align-items: center;
	padding: 5px 15px;
	position: relative;
	flex: 0 0 auto;
	background-color: #212b464c;
	border-radius: 30px;
	backdrop-filter: blur(5px) brightness(100%);
	-webkit-backdrop-filter: blur(5px) brightness(100%);
}

.view:hover {
	background: #fff;
}

.frame-43 {
	display: inline-flex;
	align-items: flex-start;
	gap: 10px;
	padding: 10px;
	position: relative;
	flex: 0 0 auto;
}

.view:hover .text-wrapper {
	color: #1c2141;
}

.advantage {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 80px 0px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
	background-color: #f4f4f4;
}


.frame-44 {
	display: flex;
	max-width: 1600px;
	width: 100%;
	align-items: flex-start;
	gap: 70px;
	padding: 0px 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-45 {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 162px;
	position: relative;
	flex: 1;
	flex-grow: 1;
}

.frame-46 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	position: relative;
	align-self: stretch;
	flex: 0 0 auto;
}

.frame-46 .frame-3 {
	display: none;
}

.text-wrapper-27 {

	font-weight: 400;
	color: #666666;
	font-size: 16px;
	line-height: 24px;
	position: relative;
	letter-spacing: 0;
}

.frame-47 {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 18px;
	position: relative;
	flex: 0 0 auto;
}

.frame-48 {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-end;
	position: relative;
	flex: 0 0 auto;
}

.text-wrapper-28 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #333333;
	font-size: 16px;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.text-wrapper-29 {
	position: relative;
	width: fit-content;

	font-weight: 400;
	color: #333333cc;
	font-size: 13px;
	letter-spacing: 0.26px;
	line-height: normal;
}

.advantageContainer {
	display: flex;
	gap: 80px;
}

.component {
	display: flex;
	flex-direction: column;
	width: 248px;
	height: 600px;
	align-items: center;
	justify-content: space-between;
	padding: 40px 30px;
	position: relative;
	flex: 1;
	flex-grow: 1;
	border-radius: 20px;
	overflow: hidden;
}

.advantageBgPic {
	position: absolute;
	right: 100%;
	top: 0;
	width: 100%;
	height: 100%;
	transition: all .5s;
	object-fit: cover;
}

.component:hover .advantageBgPic {
	right: 0;
	transition: all .5s;
}

.component:hover div {
	color: #fff;
	transition: all .5s;
}

.frame-49 {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 30px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.text-wrapper-30 {
	width: fit-content;

	font-weight: 400;
	color: #333333;
	font-size: 16px;
	text-align: center;
	line-height: 24px;
	white-space: nowrap;
	position: relative;
	letter-spacing: 0;
}

.text-wrapper-31 {
	position: relative;
	align-self: stretch;

	font-weight: 400;
	color: #666666;
	font-size: 13px;
	text-align: center;
	letter-spacing: 0;
	line-height: 22px;
}

.frame-50 {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	position: relative;
	flex: 0 0 auto;
	transition: all .5s;
}

.text-wrapper-32 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #333333;
	font-size: 48px;
	text-align: center;
	line-height: 72px;
	white-space: nowrap;
	position: relative;
	letter-spacing: 0;
}

.text-wrapper-33 {
	width: fit-content;

	font-weight: 400;
	color: #666666;
	font-size: 13px;
	text-align: center;
	line-height: 19.5px;
	white-space: nowrap;
	position: relative;
	letter-spacing: 0;
}

.contact {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 60px;
	padding: 80px 0px 20px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.element-wrapper {
	display: inline-flex;
	align-items: flex-start;
	gap: 10px;
	padding: 5px;
	position: relative;
	flex: 0 0 auto;
}

.element {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #666666;
	font-size: 16px;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.frame-51 {
	display: flex;
	max-width: 1600px;
	width: 100%;
	align-items: flex-start;
	gap: 20px;
	padding: 0px 20px;
	position: relative;
	flex: 0 0 auto;
}

.address {
	display: flex;
	flex-direction: column;
	width: 920px;
	align-items: center;
	gap: 20px;
	position: relative;

}

.img-wrapper {
	position: relative;
	align-self: stretch;
	width: 100%;
	height: 300px;

}

.contact-addr {
	position: absolute;
	width: 100%;
	height: 300px;
	top: 0;
	left: 0;
	object-fit: cover;
	border-radius: 10px;
	transition: all .5s;
}

.address:hover .contact-addr {
	height: 125%;
	transition: all .5s;
	filter: brightness(50%)
}

.address:hover .frame-50 {
	transform: translateY(-136px);
	transition: all .5s;
}

.address:hover .text-wrapper-34,
.address:hover .text-wrapper-35 {
	color: #fff;
}

.div-3:hover .img-4 {
	height: 125%;
	transition: all .5s;
	filter: brightness(50%)
}

.div-3:hover .frame-50 {
	transform: translateY(-136px);
	transition: all .5s;
}

.div-3:hover .text-wrapper-34,
.div-3:hover .text-wrapper-35 {
	--color: #fff;
	color: #fff;
}

.frame-52 {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	position: relative;
	flex: 0 0 auto;
}

.line-stroke-2 {
	width: 40px;
	position: relative;
	height: 1px;
}

.text-wrapper-34 {
	position: relative;
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #333333;
	font-size: 14px;
	letter-spacing: 0;
	line-height: normal;
}

.text-wrapper-34::after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translate(110%);
	width: 40px;
	height: 1px;
	background-color: var(--color, #999999);
}

.text-wrapper-34::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translate(-110%);
	width: 40px;
	height: 1px;
	background-color: var(--color, #999999);
}

.text-wrapper-35 {
	position: relative;
	width: fit-content;

	font-weight: 400;
	color: #333333;
	font-size: 18px;
	letter-spacing: 0;
	line-height: normal;
}

.div-3 {
	display: flex;
	flex-direction: column;
	width: 300px;
	align-items: center;
	gap: 20px;
	position: relative;
}

.img-4 {
	position: absolute;
	width: 100%;
	height: 300px;
	top: 0;
	left: 0;
	object-fit: cover;
	transition: all .5s;
	border-radius: 10px;
}

.friend-link-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 40px 0px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
}

.friend-link {
	display: flex;
	flex-wrap: wrap;
	max-width: 1600px;
	width: 100%;
	align-items: flex-start;
	gap: 32px 20px;
	padding: 0px 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-53 {
	display: flex;
	width: 195px;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 4px 10px;
	position: relative;
	background-color: #f4f4f4;
	border-radius: 4px;
}

.frame-53:hover {
	background: #eef6ff;
}

.frame-53:hover .text-wrapper-37 {
	color: #3f51b5;
}

.text-wrapper-36 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #333333;
	font-size: 14px;
	text-align: center;
	line-height: 20px;
	white-space: nowrap;
	position: relative;
	letter-spacing: 0;
}

.text-wrapper-37 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #333333;
	font-size: 14px;
	text-align: center;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.foot {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 37px;
	padding: 50px 0px 0px;
	position: relative;
	align-self: stretch;
	width: 100%;
	flex: 0 0 auto;
	background-image: url(../img/foot.jpg);
	background-size: cover;
	background-position: 50% 50%;
	background-attachment: fixed;
}

.frame-54 {
	display: flex;
	max-width: 1600px;
	width: 100%;
	align-items: flex-start;
	justify-content: space-between;
	padding: 0px 20px;
	position: relative;
	flex: 0 0 auto;
}

.frame-55 {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 32px;
	padding: 10px 0px;
	position: relative;
	flex: 0 0 auto;
	max-width: 100%;
}

.flexcontainer-2 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

.span-wrapper {
	align-self: stretch;

	font-weight: 400;
	color: #ffffff;
	font-size: 14px;
	line-height: 20px;
	position: relative;
	letter-spacing: 0;
}

.text-wrapper-38 {

	font-weight: 400;
	color: #ffffff;
	font-size: 14px;
	letter-spacing: 0;
	line-height: 20px;
}

.frame-56 {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 36px;
	position: relative;
	flex: 0 0 auto;
}

.frame-57 {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	position: relative;
	flex: 0 0 auto;
}

.text-wrapper-39 {
	width: fit-content;
	margin-top: -1px;

	font-weight: 400;
	color: #ffffff;
	font-size: 22px;
	line-height: normal;
	position: relative;
	letter-spacing: 0;
}

.text-wrapper-40 {
	position: relative;
	width: fit-content;

	font-weight: 400;
	color: #ffffffcc;
	font-size: 14px;
	letter-spacing: 0;
	line-height: normal;
}

.frame-58 {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	position: relative;
	flex: 0 0 auto;
}

.frame-59 .frame-60:last-child {
	display: none;
}

.frame-59 {
	display: inline-flex;
	align-items: flex-start;
	gap: 40px;
	padding: 0px 20px 0px 0px;
	position: relative;
	flex: 0 0 auto;
}

.frame-60 {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	position: relative;
	flex: 0 0 auto;
}

.image {
	position: relative;
	width: 100px;
	height: 100px;
	object-fit: cover;
}

.text-wrapper-41 {
	color: #ffffffcc;
	font-size: 12px;
	position: relative;
	width: fit-content;

	font-weight: 400;
	letter-spacing: 0;
	line-height: normal;
}

.image-2 {
	position: relative;
	width: 100px;
	height: 100px;
}

.frame-61 {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 10px;
	position: relative;
	border-top-width: 1px;
	border-top-style: solid;
	border-color: #ffffff33;
}

.text-wrapper-42 {
	position: relative;
	width: fit-content;

	font-weight: 400;
	color: #ffffff;
	font-size: 14px;
	letter-spacing: 0;
	line-height: normal;
}

.text-wrapper-42 a {
	color: #fff;
}

.guanwangTag {
	width: 42px;
	height: 22px;
	background-color: #4e6ef2;
	border-radius: 5px;
	color: #ffffff;
	padding: 1px 4px 2px;
}

#backTop {
	position: fixed;
	right: 10px;
	bottom: 40px;
	cursor: pointer;
	display: none;
}

.sitemap {
	background-color: #fafafa;
	padding: 40px 0;
	margin-top: 10px;
}

.sitemapTitle {
	font-size: 24px;
	text-align: center;
	font-weight: bold;
	margin-bottom: 40px;
}

.sitemapProvince {
	margin: 0 6.5%;
}

.sitemapProvince h3 {
	background: #eee;
	padding: 20px;
	font-size: 20px;
	font-weight: bold;
}

.sitemapCity {
	display: flex;
	flex-wrap: wrap;
	gap: 30px 60px;
	padding: 30px 20px 40px;

}

.sitemapCity a {
	color: #333333;
	font-size: 16px;
}

.page404 {
	text-align: center;
	padding-top: 10%;
}

.page404Title {
	font-size: 24px;
	color: #333333;
	margin-bottom: 40px;
}

.page404Img {
	max-width: 80%;
}

.page404Link {
	font-size: 16px;
	color: #333333;
	margin-top: 40px;
}

.page404Link a {
	color: #337AFF;
	font-size: 20px;
	font-weight: bold;
}


.index-recomed {
	width: 100%;
	height: 124px;
	position: relative;
	background-image: url(../img/icon/indexbg.png);
	background-size: 100% 100%;
}

.index-recomed .index-recomed-father {
	width: 100%;
	height: 100%;
	max-width: 1600px;
	padding: 0px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 auto;
}

.index-recomed-leftpos {
	position: absolute;
	left: 0;
	top: 0;
}

.index-recomed-leftpos img {
	width: 130px;
	max-height: 68px;
}

.index-recomed-center {
	padding: 0 200px 0 300px;
	color: #333;
	font-family: Abhaya Libre ExtraBold;
	font-size: 24px;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	width: 100%;
	text-align: center;
}

.index-recomed-right img {
	width: 60px;
	height: 60px;
}

.moreover-1 {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.fatherImg {
	position: relative;
}

.posHeight {
	height: 130px;
}

.project-partnewDetail {
	background-color: #fff;
	padding: 60px;
	max-width: 1600px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -100px;
	border-radius: 16px;
}

.project-partnewDetail .frame-7 {
	gap: 111px;
}

.project-partnewDetail .title {
	gap: 30px;
	padding-bottom: 50px;
}

.flex {
	display: flex;
	align-items: center;
}

/* 新闻 */
.newlistbox {
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
}

.marleft {
	margin-left: auto;
}

.newlistbox .newlistbox-list {
	border-radius: 12px;
	background: #FFF;
	display: flex;
	flex-direction: column;
	/* gap: 25px; */
	padding: 60px;
	margin-bottom: 25px;
}

.headTitle-1 {
	color: #222;
	font-family: Abhaya Libre ExtraBold;
	font-size: 24px;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
}

.newlistbox #myTableList .headTitle-1 {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.iframBox #watchBox .contentBox-watch p {
	color: #858585;
	font-family: Abhaya Libre ExtraBold;
	font-size: 16px;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
}

.imgicon {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	margin-right: 10px;
}

.imgicon-2 {
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	margin-right: 15px;
}

.icontext-1 {
	color: #222;
	font-family: Abhaya Libre ExtraBold;
	font-size: 16px;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	align-items: center;
}

.headTitle-2 {
	color: #858585;
	font-family: Abhaya Libre ExtraBold;
	font-size: 20px;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	margin-top: 15px;
	margin-bottom: 35px;
}

.headTitle-3 {
	color: #222;
	font-family: Abhaya Libre Medium;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

/* 新闻end */

/* 新闻详情 */
.contentBox {
	width: 100%;
	/* max-width: 1600px;
	min-height: 500px; 
	padding: 50px 50px 0 50px; */
	margin: 0 auto;
}

.contentBox .contentBox-title1 {
	color: #222;
	font-family: Abhaya Libre ExtraBold;
	font-size: 24px;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	text-align: center;
}

.contentBox .contentBox-title2 {
	color: #222;
	font-family: Abhaya Libre Medium;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	margin: 45px 0 60px 0;
}

.title-pagenation {}

.iframBox {
	/* padding: 0 20px; */
	background-color: #fff;
	max-width: 1600px;
	/* min-height: 500px;  */
	padding: 50px 15px;
	margin: 0 auto;

}

.title-pagenation .pagenext {
	margin-bottom: 40px;
}

.showMoreText {
	flex-wrap: wrap;
}

.showMoreText .showMoreText-list {
	display: flex;
	align-items: center;
	border-radius: 40px;
	border: 1px solid #CCC;
	background: #FFF;
	height: 42px;
	flex-shrink: 0;
	color: #858585;
	font-family: Abhaya Libre Medium;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	padding: 0 25px;
	margin: 0 30px 30px 0
}

.color-999 {
	color: #858585;
	font-family: Abhaya Libre Medium;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

.color-123 {
	color: #222;
	font-family: Abhaya Libre Medium;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

.color-223 {
	color: #999;
	font-family: Abhaya Libre Medium;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

.contentBox-watch {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-top: 25px;
}

/* 新闻详情end */
.setLeftRightIcon {
	margin-left: 40px;
}

@media screen and (max-width: 1600px) {
	.head-nav {
		gap: 40px;
	}

	.frame-13>div {
		width: calc(25% - 6px);
	}

	.frame-44 {
		flex-direction: column;
		align-items: center;
	}

	.frame-45 {
		flex-direction: row;
		width: 100%;
		max-width: 1600px;
	}


	.frame-46 {
		width: 100%;
		display: flex;
		max-width: 1600px;
		width: 100%;
		align-items: center;
		gap: 10px;
		padding: 0px 20px;
		position: relative;
		flex: 0 0 auto;
		flex-direction: row;
	}

	.frame-46 .frame-3 {
		display: inline-flex;
	}


	.frame-47 {
		display: none;
	}

	.product-features-subTitle {
		padding: 0 20px;
	}

	.product-features-content {
		padding: 0 20px;
	}

}

@media screen and (max-width: 1400px) {
	.posHeight {
		height: 250px;
	}

	.project-partnewDetail .frame-7 {
		gap: 60px;
	}

	.project-partnewDetail {
		bottom: -220px;
		padding: 25px;
	}
}

@media screen and (max-width: 1200px) {
	.posHeight {
		height: 250px;
	}

	.project-partnewDetail .frame-7 {
		gap: 60px;
	}

	.project-partnewDetail {
		bottom: -220px;
		padding: 25px;
	}

	.header {
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.head-nav {
		display: none;
	}

	.about {
		flex-direction: column;
	}

	.about-left {
		width: 100%;
		height: 360px;
		margin: 20px auto;
	}

	.about-cont {
		width: 100%;
		padding-left: 0;
		padding-right: 0;
		gap: 20px;
	}

	.frame-4 {
		flex-direction: column;
		align-items: center;
	}

	.rectangle {
		width: 100%;
	}

	.steps {

		align-content: flex-start;
		flex-wrap: wrap;
	}

	.step-item {
		width: 30%;
	}

	.step-icon.itemThree {
		display: none;
	}

	.advantage {
		flex-direction: column;
	}

	.advantageContainer {
		flex-wrap: wrap;
		gap: 40px;
	}

	.frame-51 {
		flex-wrap: wrap;
	}

	.address {
		width: 100%;
	}

	.contact-addr {
		width: 100%;
	}

	.div-3 {
		width: calc((100% - 20px) / 2)
	}

	.frame-3 {
		display: none;
	}

	.frame-11 {
		flex-direction: column;
	}

	.frame-2 {
		flex-wrap: wrap;
	}



	.product-features-content {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 1100px) {
	.posHeight {
		height: 30px;
	}

	.project-partnewDetail .frame-7 {
		gap: 15px;
	}

	.project-partnewDetail {
		width: calc(100% - 40px);
		position: relative;
		left: 20px;
		top: 0;
		transform: translateX(0);
		margin-top: 30px;
		/* background-color: transparent; */
	}

	.project-partnewDetail .title {
		gap: 30px;
		padding-bottom: 20px;
	}
}

.borderBtnVal,
#pageUp,
#pageDown {
	cursor: pointer;
}

button:disabled {
	cursor: no-drop !important;
}

@media screen and (max-width: 768px) {
	.index-recomed-right img {
		width: 28px;
		height: 28px;
		flex-shrink: 0;
	}

	.text-wrapper {
		/* display: none; */
	}

	.gappad-2 {
		padding: 0 20px;
	}

	.gapmar-2 {
		margin: 0 20px;
	}

	.contentBox {
		/* padding: 50px 0; */
		margin: 0 auto;
	}

	.color-999,
	.color-123,
	.color-223,
	.contentBox .contentBox-title2 {
		font-size: 14px;
	}

	.contentBox .contentBox-title2 {
		margin: 40px 0;
	}

	.contentBox .contentBox-title1 {
		font-size: 18px;
	}

	.showMoreText .showMoreText-list {
		height: 36px;
		font-size: 16px;
		margin: 0 20px 20px 0;
	}

	/* 新闻列表 */
	.newlistbox .newlistbox-list {
		padding: 25px;
	}

	.newlistbox .headTitle-1 {
		font-size: 18px;
	}

	.newlistbox .icontext-1 {
		font-size: 14px;
	}

	.newlistbox .headTitle-3,
	.newlistbox .headTitle-2 {
		font-size: 14px;
	}

	.imgicon {
		width: 30px;
		height: 30px;
		margin-right: 5px;
	}

	.imgicon-2 {
		width: 18px;
		height: 18px;
		margin-right: 5px;
	}

	.setLeftRightIcon {
		margin-left: 20px;
	}

	/* 新闻列表end */
	.posHeight {
		height: 30px;
	}

	.project-partnewDetail .frame-7 {
		gap: 15px;
	}

	.project-partnewDetail {
		width: calc(100% - 40px);
		position: relative;
		left: 20px;
		top: 0;
		transform: translateX(0);
		margin-top: 30px;
		/* background-color: transparent; */
	}

	.project-partnewDetail .title {
		gap: 30px;
		padding-bottom: 20px;
	}

	/* .about-head{
    flex-direction: column;
  }*/
	.about-left {
		width: 100%;
		height: 210px;
		margin: 10px;
	}

	.text-wrapper-5 {
		font-size: 24px;
	}

	.text-wrapper-6 {
		font-size: 18px;
	}

	.p {
		font-size: 14px;
		line-height: 24px;
	}

	.about-cont {
		width: 100%;
		padding-left: 0;
		padding-right: 0;
		gap: 20px;
	}

	.title {
		gap: 10px;
	}

	.about-zizhi {
		overflow-x: auto;
		padding-bottom: 0;
	}

	.project-part {
		padding: 40px 0;
		gap: 10px;
	}

	.frame-6 {
		padding: 10px 0;
	}

	.about-head {
		flex-wrap: wrap;
	}

	.about-head-line {
		display: none;
	}

	.frame-46 {
		flex-wrap: wrap;
	}

	.frame-46 .frame-3 {
		display: none;
	}

	.frame-21 {
		flex-wrap: wrap;
		padding: 0 15px;
	}

	.project-part-2 {
		padding-bottom: 10px;
	}

	.project-part-3 {
		padding: 20px 0 30px;
		gap: 0;
	}

	.frame-25 {
		padding: 15px;
		gap: 15px;
	}

	.frame-wrapper {
		height: 120px;
	}

	.frame-32 {
		height: 120px;
	}

	.frame-36 {
		height: 120px;
	}

	.project-part-4 {
		padding: 20px 0;
		gap: 0;
	}

	.frame-39 {
		gap: 10px 0;
		padding: 0 10px;
	}

	.frame-22 {
		width: 33.3%;
		flex: auto;
	}

	.img-3 {
		width: 100px;
		height: 100px;
	}


	.frame-13>div {
		width: calc(50% - 6px);
	}

	.frame-7 {
		flex-direction: column;
		gap: 10px;
	}

	.frame-4 {
		gap: 20px;
	}

	.rectangle {
		height: 200px;
		border-radius: 4px;
	}

	.text-wrapper-4 {
		font-size: 12px;
	}

	.step-item-2 {
		width: 64px;
		height: 64px;
	}

	.header {
		padding-left: 10px;
		padding-right: 10px;
	}

	.img {
		width: 120px;
		height: auto;
	}

	.text-wrapper {
		font-size: 13px;
	}

	.text-wrapper-3 {
		font-size: 14px;
	}

	.frame {
		padding: 2px;
		border-radius: 4px;
	}

	.img-2 {
		width: 24px;
		height: 24px;
	}

	.head-logo {
		gap: 4px;
	}

	.element-wrapper {
		width: 100%;
	}

	.element {
		display: flex;
		flex-wrap: wrap;
	}

	.frame-24 {
		flex-direction: column;
	}

	.project-pic {
		max-width: 88%;
		height: auto;
	}

	.frame-40 {
		width: 25%;
	}

	.function-icon {
		width: 48px;
		height: 48px;
	}

	.frame-42 {
		width: 100%;
		overflow-x: auto;
	}

	.customerList {
		gap: 12px;
		width: 1360px;
		max-width: none;
	}

	.view {
		padding: 0;
	}

	.advantageContainer {
		flex-wrap: wrap;
		gap: 10px;
	}

	.component {
		flex: auto;
		border: #ddd solid 1px;
		height: 360px;
		width: 40%;
		padding: 24px 12px;
	}

	.frame-49 {
		gap: 15px;
	}

	.text-wrapper-31 {
		font-size: 12px;
		line-height: 20px;
	}

	.text-wrapper-32 {
		font-size: 36px;
		line-height: 48px;
	}

	.foot {
		padding-top: 28px;
	}

	.frame-54 {
		flex-wrap: wrap;
		gap: 20px;
	}

	.frame-54 .img {
		width: 160px;
	}

	.step-icon {
		height: 40px;
	}

	.step-item {
		padding: 10px;
	}

	.about-zizhi {
		gap: 10px;
	}

	.about-zizhi img {
		height: 150px;
		width: auto;
	}

	.this-is-a-title {
		display: none;
	}

	.text-wrapper-10 {
		font-size: 20px;
	}

	.text-wrapper-35 {
		font-size: 14px;
	}

	.friend-link {
		gap: 20px;
	}

	.frame-53 {
		width: calc((100% - 40px) / 3);
	}

	.img-wrapper {
		height: 180px;
	}

	.img-wrapper {
		height: 140px;
	}

	.customer {
		background-attachment: unset;
		padding: 40px 0;
		gap: 30px;
	}

	.contact {
		padding-top: 20px;
		padding-bottom: 0;
		gap: 20px;
	}

	.frame-61 {
		flex-direction: column;
	}

	.text-wrapper-42 {
		font-size: 12px;
	}

	.text-wrapper-9 {
		font-size: 16px;
	}

	.advantage {
		padding: 40px 0;
	}

	.frame-44 {
		gap: 30px;
		padding: 0 15px;
	}

	.text-wrapper-39 {
		font-size: 18px;
	}

	.contact-addr {
		height: 100%;
	}

	.img-4 {
		height: 100%;
	}

	.address:hover .frame-50 {
		transform: translateY(-90px);
	}

	.div-3:hover .frame-50 {
		transform: translateY(-86px);
	}

	.sitemapProvince {
		margin: 0 15px;
	}

	.sitemapProvince h3 {
		padding: 10px;
	}

	.sitemapCity {
		padding: 20px 10px 30px;
		gap: 20px 20px;
	}

	.page404 {
		margin-top: 20vh;
	}

	.page404Title {
		font-size: 20px;
	}

	.index-recomed-center {
		padding: 0 20px 0 60px;
		font-size: 18px;
	}

	.index-recomed-leftpos img {
		width: 80px;
		max-height: 68px;
	}

	.index-recomed {
		height: 94px;
	}

	.product-subTitle-txt {
		font-size: 26px;
	}

	.product-demonstrate-btn {
		height: 40px;
		width: 120px;
		border-radius: 4px;
		font-size: 16px;
	}

	.product-features .arrow-right {
		width: 14px;
		height: 14px;
		margin-left: 5px;
	}

	.product-features-content {
		grid-template-columns: repeat(1, 1fr);
	}

	.product-card {
		padding: 18px 24px;

	}


	.product-card .card-title {
		font-size: 20px;
	}

	.product-card .card-title .card-icon {
		width: 50px;
		height: 50px;
		border-radius: 16px;
	}

	.product-card .card-title .card-icon img {
		width: 30px;
		height: 30px;
	}

	.product-card .card-interval {
		width: 40px;
		height: 6px;
		margin-top: 20px;
	}

	.product-card .card-content {
		font-size: 14px;
		margin-top: 20px;
	}


	.product-features {
		padding: 60px 0 60px;
	}
}

.newlistbox-list .flex {
	max-width: 100%;
	overflow: hidden;
}

.newlistbox-list .flex .marleft {
	flex-shrink: 0;
	padding-left: 10px;
}

.el-button--primary {
	background: #3E77CC !important;
	border-color: #3E77CC !important;

}

#page4 {
	display: flex;
	align-items: center;
}

/*
#page4>button{
	width: 100px;
}
.overflowX{
	overflow-x: auto;
	display: flex;
	flex-wrap: nowrap;
	width: 40%;
} */

@media (max-width: 2000px) {
	.overflowX {
		display: flex;
		align-items: center;
	}
}

@media (max-width: 750px) {
	.overflowX {
		display: none;
	}
}



#customerService {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background-color: #ffffff;
	position: fixed;
	right: 10px;
	bottom: 110px;
	cursor: pointer;
}

.base-line {
	display: inline-block;
	box-sizing: border-box;
	width: calc(100% - 22px);
	margin: 0 auto;
	border-top: 2px dashed #D9D9D9;
	position: relative;
}

.base-line::before {
	content: "";
	position: absolute;
	left: 0;
	top: -1px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	box-sizing: border-box;
	border: 1px solid #D9D9D9;
	transform: translate(-100%, -50%);
}

.base-line::after {
	content: "";
	position: absolute;
	right: 0;
	top: -1px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	box-sizing: border-box;
	border: 1px solid #D9D9D9;
	transform: translate(100%, -50%);
}