.module .center-title {
	font-size:17px;
	color:#4d4d4d;
	text-align:center;
	padding-top:20px;
}

.container {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow-y: scroll;
	overflow-x: hidden;
}

.module .left-title{
	text-align: left;
	padding-left: 10%;
}
.module .about {
	display: flex;
	/* margin: 5rem 16.25rem; */
	margin: 5rem 10%;
}
.module .about .about-left {
	width: 28%;
	height: 20rem;
	background: rgba(68, 188, 130, 0.1);
}
.module .about .about-left > img {
	width: 100%;
	height: 100%;
	margin: 2.5rem 0 0 2.5rem;
}
.tabscon {
	width: 60%;
}
.about .about-middle {
	margin: 0 6.25rem;
	font-size: 1.25rem;
	line-height: 2.5rem;
	text-align: justify;
	color: #666666;
}
.about-title {
	margin: 2rem 0;
	font-size: 1.5rem;
	line-height: 2.25rem;
	color: #44BC82;
}
.about-right {
	font-size: 1.25rem;
	line-height: 1.875rem;
	color: #333333;
	display: flex;
}
.about-right .about-line {
	width: 1px;
	height: 18.125rem;
	background: #EDEDED;
}
.about-right-right > div {
	z-index: 2;
	width: 10rem;
	height: 5.625rem;
	border-bottom: 1px solid #dedede;
	margin: 0.625rem 1.25rem;
	text-align: center;
	line-height: 5.625rem;
	background: url(../image/aboutVector.png) no-repeat; 
	background-position: center; 
}
.about-right-right .active {
	background: rgba(68, 188, 130, 0.1);
	color: #44BC82;
}
.about-right-right > div:hover {
	background: rgba(68, 188, 130, 0.1);
	color: #44BC82;
}
/* 产品功能 */
.function {
	height: 70rem;
	background: url(../image/openSourceBg%201.png);
}
.function > ul {
	margin: 4.5rem 10%;
	text-align: center;
	display: flex;
	justify-content: space-between;
}
.function > ul > li {
	width: 22.5rem;
}
.function-icon {
	width: 6.625rem;
	height: 6.625rem;
	margin: auto;
	position: relative;
}
@media screen and (max-width: 2200px) {
	.function-line {
		width: 22.25rem;
		height: 5.52rem;
		position: absolute;
		top: 0;
		left: 12rem;
		background: url(../image/Vector%205.png) no-repeat;
		background-size: 22.25rem 5.25rem;
	}
}
@media screen and (max-width: 1800px) {
	.function-line {
		width: 22.25rem;
		height: 5.52rem;
		position: absolute;
		top: 0;
		left: 10rem;
		background: url(../image/Vector%205.png) no-repeat;
		background-size: 22.25rem 5.25rem;
	}
}
@media screen and (max-width: 1700px) {
	.function-line {
		width: 0rem;
	}
}
.function-title {
	font-weight: 500;
	font-size: 24px;
	line-height: 36px;
	color: #333333;
	margin: 30px auto;
}
.function-text {
	font-size: 20px;
	line-height: 40px;
	color: #666666;
	position:relative;
}
.move {
	animation:move 2s;
	-webkit-animation:move 2s;
}
@-webkit-keyframes move
{
	0%   {left:0px; top:100px;opacity: 0;}
	100% {left:0px; top:0px;opacity: 1;}
}
@keyframes move {
	0%   {left:0px; top:100px;opacity: 0;}
	100% {left:0px; top:0px;opacity: 1;}
}
.function-bottom {
	margin: 0 10%;
	display: flex;
	background: url(../image/Group%20104.png);
}
/* 业务痛点 */
.business {
	height: 54.375rem;
	width: 100%;
	background: url(../image/business0.png) no-repeat;
	background-size: 100% 100%;
}
.business-ul {
	display: flex;
	margin: 5rem 7.8125rem 0;
	justify-content: space-evenly;
}
.business-li {
	width: 24.1875rem;
}
.business-li .business-top {
	width: 8.75rem;
	height: 9rem;
	background-image: url(../image/business2.png);
	margin: 0 auto;
}
.business-li .business-top img {
	margin: 1.875rem 3.125rem 0.3125rem;
}
.business-li .business-top div {
	font-weight: 500;
	font-size: 2.125rem;
	color: #fff;
	text-align: center;
}
.business-li .business-number {
	width: 100%;
	height: 12.5rem;
	font-size: 2rem;
	margin: auto;
}
.business-middle {
	width: 12.125rem;
	margin: 0 auto;
}
.business-bottom {
	font-size: 1rem;
	line-height: 1.5rem;
	color: #666666;
	width: 65%;
	margin: auto;
	background: #ffffff;
	padding: 0 10px;
}
.business-bottom div {
	font-weight: 500;
	font-size: 1.5rem;
	color: #000000;
	text-align: center;
	margin: 0.625rem 0 1.25rem;
	position: relative;
}
.business-bottom span {
	color: #72BB38;
}
/* 产品特点 */
.production {
	background-color: #F2F5F7;
	padding-bottom: 70px;
}
.production-box {
	display: flex;
	margin: 5rem 10% 0;
}
.production-box .production-left .left-ul {
	position: relative;
}
.left-li .left-li-title {
	margin: 0 0 0.625rem 2.5rem;
	font-weight: 500;
	font-size: 1.5rem;
	color: #333333;
}
.left-li .left-li-bottom {
	width: 43.75rem;
	height: 9.5rem;
	background: url(../image/cptdbj.png) no-repeat;
	display: flex;
	justify-content: space-between;
	margin-bottom: 2.5rem;
}
.li-bottom-left {
	width: 19rem;
	margin: 2rem 0 0 2.5rem;
	font-size: 1rem;
	line-height: 1.5rem;
	color: #666666;
}
.li-bottom-right {
	margin-top: 2rem;
}
.li-bottom-right li {
	width: 12.5rem;
	display: flex;
	height: 1.875rem;
}
.li-bottom-right li>div {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: #44BC82;
	margin: 0.4375rem;
}
.production-box img {
	width: 2.5rem;
	height: 6.25rem;
	margin: auto;
}
.production-right {
	width: 35.5rem;
	background-color: #ffffff;
	font-size: 1.25rem;
	line-height: 1.875rem;
	color: #666666;
	margin-top: 1.25rem;
}
@media screen and (max-width: 2200px) {
	.production-right li {
		font-size: 1.25rem;
		margin: 3.75rem 2.5rem 0;
		display: flex;
	}
}
@media screen and (max-width: 1700px) {
	.production-right li {
		font-size: 18px;
		margin: 2rem 2.5rem 0;
		display: flex;
	}
}
.production-right img {
	width: 1.625rem;
	height: 1.25rem;
	margin: 0.3125rem 0.75rem 0 0;
}

.bottom-left {
	width: 22.5rem;
	height: 25rem;
	background: rgba(68, 188, 130, 0.3);
	box-shadow: 10px 0px 10px rgba(0, 0, 0, 0.12);
}
.bottom-left > ul {
	margin-top: 3.25rem;
}
.bottom-left > ul > li {
	width: 23.75rem;
	height: 6.25rem;
	text-align: center;
	line-height: 6.25rem !important;
	font-size: 24px;
	line-height: 36px;
	color: #333333;
	position: relative;
	right: 0.625rem;
}
.bottom-left > ul > li:hover {
	background-color: #44BC82;
	color: #FFFFFF;
}
.bottom-left .active {
	background-color: #44BC82;
	color: #FFFFFF;
}
.bottom-right {
	margin: 6.375rem 0 0 7.5rem;
}
.bottom-right > ul > li {
	display: flex;
	font-size: 20px;
	color: #666666;
}
.bottom-right .round {
	width: 16px;
	height: 16px;
	background: #44BC82;
	border-radius: 50%;
	margin: 5px 24px 2.1875rem 0;
	flex-shrink: 0;
}
.frame-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 2rem 10% 0 10%;
	gap: 3%;
}
.frame-top-item{
	flex: 1;
	padding: 20px;
}
.frame-top-title{
	font-weight: 500;
	font-size: 24px;
	line-height: 36px;
	text-align: center;
	color: #0D4F50;
	margin-bottom: .5rem;
	white-space: nowrap; 
}
.frame-top-imgs{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.frame-top-img {
	width: 48%;
	/* height: 6rem; */
	/* margin: 0 .5rem; */
	/* object-fit: contain; */
}
.frame {
	height: 40rem;
	margin: 2rem 10%;
	display: flex;
	justify-content: space-between;
}
.frame-border {
	width: 5%;
	background: #44BC82;
	border-radius: 2px;
	font-weight: 500;
	font-size: 24px;
	line-height: 36px;
	text-align: center;
	color: #FFFFFF;
}
.frame-middle {
	width: 80%;
	position: relative;
}
.frame-style {
	/* background: #FFFFFF; */
	/* box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.08); */
	border-radius: 2px;
}
.frame-serve {
	height: 12rem;
	display: flex;
	margin-bottom: 1.18rem;
}
.frame-title {
	width: 11.3125rem;
	font-weight: 500;
	font-size: 24px;
	line-height: 36px;
	text-align: center;
	color: #0D4F50;
	background-image: url(../image/border1.svg);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
.frame-ul {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	width: 86%;
	/* margin: 1.5625rem 0 1.25rem 0; */
	padding: 16px 0;
}
.frame-li {
	width: 18%;
	height: 2.5rem;
	background: rgba(68, 188, 130, 0.2);
	border-radius: 2px;
	text-align: center;
	line-height: 2.5rem;
	font-size: 16px;
	font-weight: 500;
	color: #0D4F50;
	margin: 0 0.3125rem;
}
.frame-saas {
	height: 13.75rem;
	margin: 1.25rem 0;
	display: flex;
}
.saas-ul {
	width: 86%;
	display: flex;
	justify-content: space-between;
	padding-right: 3.0625rem;
}
.saas-box {
	width: 47%;
	margin: auto 0;
}
.saas-top {
	width: 100%;
	height: 2.5rem;
	background: #44BC82;
	border-radius: 2px;
	font-size: 20px;
	color: #FFFFFF;
	text-align: center;
	line-height: 2.5rem;
}
.saas-bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
@media screen and (max-width: 2200px) {
	.saas-li {
		width: 31%;
	}
}
@media screen and (max-width: 1500px) {
	.saas-li {
		width: 48%;
	}
}
.saas-li {
	height: 2.5rem;
	background: rgba(68, 188, 130, 0.2);
	border-radius: 2px;
	text-align: center;
	line-height: 2.5rem;
	font-size: 16px;
	font-weight: 500;
	color: #0D4F50;
	margin-top: 10px;
}
.platform-box {
	width: 28%;
	margin: auto 0;
}
.platform-top {
	width: 100%;
	height: 2.5rem;
	background: #44BC82;
	border-radius: 2px;
	font-size: 20px;
	color: #FFFFFF;
	text-align: center;
	line-height: 2.5rem;
}
.platform-li {
	width: 48%;
	height: 2.5rem;
	background: rgba(68, 188, 130, 0.2);
	border-radius: 2px;
	text-align: center;
	line-height: 2.5rem;
	font-size: 16px;
	font-weight: 500;
	color: #0D4F50;
	margin-top: 10px;
}
.frame-count {
	height: 80px;
	margin: 20px 0;
	display: flex;
}
.frame-intelligence {
	height: 105px;
	display: flex;
}
.count-li {
	width: 13%;
	height: 2.5rem;
	background: rgba(68, 188, 130, 0.2);
	border-radius: 2px;
	text-align: center;
	line-height: 2.5rem;
	font-size: 16px;
	font-weight: 500;
	color: #0D4F50;
	margin: auto 10px auto 0;
}
.frame-intelligence > input {
	height: 70px;
	margin: auto;
}
.hardware {
	margin: 80px 10% 10px;
	background: url(../image/Group%2094.png) no-repeat;
	background-size: 100% 100%;
	padding-top: 50px;
	display: flex;
	padding-bottom: 20px;
}
.hardware-right {
	width: 440px;
	height: 560px;
	margin: 0 50px;
	background: rgba(68, 188, 130, 0.06);
}
.hardware-right > input {
	width: 283px;
	height: 354px;
	margin: 110px 80px;
}
.hardware-left {
		font-size: 16px;
		line-height: 32px;
		text-align: justify;
		color: #666666;
	}
@media screen and (max-width: 2200px) {
	.hardware-left {
		width: 60%;
	}
}
@media screen and (max-width: 1800px) {
	.hardware-left {
		width: 55%;
	}
}
@media screen and (max-width: 1500px) {
	.hardware-left {
		width: 43%;
	}
}
.hardware-title {
	font-weight: 500;
	font-size: 24px;
	line-height: 36px;
	color: #44BC82;
	margin-bottom: 20px;
}
.hardware-ul {
	display: flex;
	margin-bottom: 20px;
	text-indent: 0;
}
.hardware-li {
	display: flex;
}
.hardware-run {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}
.hardware-run > div {
	margin-right: 50px;
}
.hardware-point {
	width: 8px;
	height: 8px;
	background: #00C3B3;
	border-radius: 50%;
	margin: 12px 12px 0 25px;
}
.hardware-more {
	width: 116px;
	height: 40px;
	background: #44BC82;
	border-radius: 24px;
	margin-top: 20px;
	font-size: 14px;
	text-align: center;
	color: #FFFFFF;
	text-indent: 0;
	line-height: 40px;
}
.hardware-more a {
	color: #FFFFFF;
	cursor: pointer;
}
.advantage {
	padding-bottom: 100px;
	background: url(../image/openSourceBg%201.png);
}
.advantage-top {
	width: 29.6875rem;
	display: flex;
	margin: 60px auto;
}
.advantage-button {
	width: 176px;
	height: 60px;
	text-align: center;
	line-height: 60px;
	font-size: 24px;
	border-radius: 40px;
	margin: 0 30px;
	background: rgba(68, 188, 130, 0.1);
	color: #666666;
}
.advantage-top .active {
	background: #44BC82;
	color: #ffffff;
}
.advantage-top div:hover {
	background: #44BC82;
	color: #ffffff;
}
.brightbg {
	background: rgba(68, 188, 130, 0.1);
}
.advantage-bottom ul {
	width: 80%;
	display: flex;
	flex-wrap: wrap;
	margin: 0 10%;
	position: relative;
}
.advantage-card {
	width: 22.2%;
	min-height: 180px;
	font-size: 16px;
	line-height: 21px;
	color: #666666;
	padding: 45px 20px 0;
	box-shadow: -3px 0px 17px #9e9c9c;
	margin: 0 25px 25px 0;
	border-radius: 10px;
}
.advantage-card .card-top {
	display: flex;
	margin-bottom: 20px;
}
.advantage-card .card-top .card-number {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	text-align: center;
	line-height: 35px;
	background-color: #44BC82;
	color: #ffffff;
	margin-right: 20px;
	flex-shrink: 0;
}
.advantage-card .card-top .card-right {
	font-weight: 500;
	font-size: 20px;
	color: #333333;
	white-space: nowrap;
}
.advantage-card .card-top .card-right .card-line {
	width: 40px;
	height: 2px;
	background-color: #44BC82;
	margin-top: 8px;
}
.model-box {
	/* height: 68rem; */
	margin-bottom: 30px;
}
.model {
	width: 70%;
	height: 760px;
	background-color: #0092FF;
	margin: 50px auto 0;
	background: url(../image/Group%2099.png) no-repeat;
	background-size: 100% 100%;
	position: relative;
	font-size: 20px;
	line-height: 30px;
	color: #666666;
	text-align: center;
}
.model .model-text {
	width: 120px;
	position: absolute;
	top: 12%;
	right: 44%;
}
@media screen and (min-width: 1700px) {
	.model .model-content1 {
		top: 12%;
		right: 45%;
	}
	.model .model-content2 {
		top: 20%;
		left: 27%;
	}
	.model .model-content3 {
		top: 20%;
		right: 27%;
	}
	.model .model-content4 {
		top: 36%;
		left: 12%;
	}.model .model-content5 {
		top: 36%;
		right: 12%;
	}.model .model-content6 {
		top: 61%;
		left: 4%;
	}.model .model-content7 {
		top: 61%;
		right: 4%;
	}.model .model-content8 {
		top: 87%;
		left: 6%;
	}.model .model-content9 {
		top: 87%;
		right: 6%;
	}
}
@media screen and (max-width: 1700px) {
	.model .model-content1 {
		top: 12%;
		right: 45%;
	}
	.model .model-content2 {
		top: 20%;
		left: 27%;
	}
	.model .model-content3 {
		top: 20%;
		right: 27%;
	}
	.model .model-content4 {
		top: 36%;
		left: 10%;
	}.model .model-content5 {
		top: 36%;
		right: 10%;
	}.model .model-content6 {
		top: 61%;
		left: 3%;
	}.model .model-content7 {
		top: 61%;
		right: 3%;
	}.model .model-content8 {
		top: 87%;
		left: 5%;
	}.model .model-content9 {
		top: 87%;
		right: 5%;
	}
}

.empower {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.empower .empower-card {
	width: 23.5%;
	height: 42%;
	background-color: #fff;
}
.card-bottom {
	margin-bottom: 20px;
}
.empower .empower-card > input {
	width: 100%;
	height:91%
}
.empower .empower-card > div {
	height: 50px;
	margin-top: -6px;
	background-color: #1080b0;
	font-size: 20px;
	line-height: 50px;
}
.article {
	margin: 6rem 10% 0px;
	color: #ffffff;
	text-align: center;
}
.article-title {
	background-color: #44bc82;
	font-size: 22px;
	height: 65px;
	line-height: 65px;
	box-shadow: -2px 1px 10px #6b6a6a;
}
.article-bottom {
	background-color: #1080b0;
	font-size: 22px;
	height: 65px;
	line-height: 65px;
	margin: 20px 0;
	box-shadow: -2px 1px 10px #6b6a6a;
}
.article-table {
	display: flex;
	justify-content: space-between;
}
.article-table>div {
	width: 23%;
	height: 65px;
	line-height: 65px;
	background-color: #0092FF;
	font-size: 28px;
	margin: 25px 0;
	box-shadow: -2px 1px 10px #6b6a6a;
}
.article-content {
	display: flex;
}
.article-content .left {
	width: 17%;
	height: 32.5rem;
	padding: 14% 4%;
	background-color: #0e81b0;
	font-size: 28px;
	margin-right: 25px;
}
.article-content .right {
	display: flex;
}
.text-fill {
	height: 75px;
	color: #000000;
	font-size: 26px;
	background-image:-webkit-linear-gradient(bottom,#63f1fc,#3190ed); 
	-webkit-background-clip:text; 
	-webkit-text-fill-color:transparent; 
	margin-top: 35px;

}
.appscene {
	margin: 5rem 10% 0;
	padding-bottom: 60px;
}
.appscene .scene-top {
	height: 80px;
	background: #44BC82;
	border-radius: 4px;
	font-size: 32px;
	font-weight: 500;
	color: #FFFFFF;
	text-align: center;
	line-height: 80px;
}
.vertical {
	width: 1px;
	height: 80px;
	background: #44BC82;
	margin: 0 auto;
}
.appscene-middle {
	width: 80%;
	height: 80px;
	border: 1px solid #44BC82;
	border-bottom: 0;
	margin: 0 auto;
	position: relative;
}
.appscene-middle .vertical-line1 {
	position: absolute;
	top: 0;
	left: 33%;
}
.appscene-middle .vertical-line2 {
	position: absolute;
	top: 0;
	right: 33%;
}
.appscene-bottom {
	display: flex;
	justify-content: space-between;
}
.appscene-card {
	width: 19%;
	font-size: 16px;
	line-height: 24px;
	text-align: justify;
	color: #666666;
	padding-bottom: 25px;
	position: relative;
}
.appscene-bottom .card-bg1 {
	background: url(../image/Group%20110.png);
}
.appscene-bottom .card-bg2 {
	background: url(../image/Group%20111.png);
}
.appscene-bottom .card-bg3 {
	background: url(../image/Group%20112.png);
}
.appscene-bottom .card-bg4 {
	background: url(../image/Group%20113.png);
}
@media screen and (max-width: 2200px) {
	.appscene-card > img {
		margin: 40px 35% 20px;
	}
}
@media screen and (max-width: 1700px) {
	.appscene-card > img {
		margin: 40px 32% 20px;
	}
}
.appscene-title {
	font-weight: 500;
	font-size: 20px;
	color: #44BC82;
	text-align: center;
}
.appscene-h {
	font-weight: 500;
	font-size: 16px;
	color: #333333;
	margin: 40px 0 20px;
	text-align: center;
}
.appscene-card > p {
	margin: 0 40px;
}
#case {
	/* height: 56rem; */
	padding-bottom: 1.25rem;
	background: url(../image/Group%2058.png);
}
.case-ul {
	margin: 0 10% 2rem;
}
.case-li {
	display: flex;
	justify-content: space-between;
}
.case-li .card-top {
	width: 33%;
	height: 350px;
	text-align: center;
}
.case-li .card-top > img {
	width: 96%;
	height: 80%;
	margin: 10px;
}
.case-li .card-top2 {
	width: 49%;
	height: 350px;
	text-align: center;
}
.case-li .card-top2 > img {
	width: 96%;
	height: 80%;
	margin: 10px;
}
.card-count {
	margin: 2rem 10% 0px;
	line-height: 26px;
}
.case-li2 {
	margin: 0 10% 20px;
	display: flex;
	justify-content: flex-start;
}

.case-li .card-top {
	background: #ffffff;
	border-radius: 5px;
	box-shadow: 0px 4px 20px 4px rgba(0, 0, 0, 0.06);
	height: 220px;
}

.case-li .card-top > img {
	height: 70%;
}
.case-li .card-top2 {
	background: #ffffff;
	border-radius: 5px;
	box-shadow: 0px 4px 20px 4px rgba(0, 0, 0, 0.06);
	height: 280px;
}

.case-li .card-top2 > img {
	height: 80%;
	margin: 10px 10px 3px;
}

.case-titlt {
	font-size: 24px;
	color: #333333;
}
.partnerbgimg {
	width: 100%;
	height: 100%;
	background: url(../image/hzhb.png) no-repeat;
	z-index: -1;
	opacity: 0.5;
	position: absolute;
	top: 0;
	left: 0;
	margin: 40px 10% 0;
}
.partnerbg {
	height: 100%;
	margin: 2rem 10% 0;
	background-size: 100%;
}
.partnerbg > img {
	margin-top: 80px;
	width: 100%;
	height: 400px;
}
.Cooperative {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	/* width: 100%;
	height: 68%; */
	margin: 60px auto;
	padding-bottom: 60px;
	position: relative;
}
.partner-item {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: calc(20% - 16px);
	height: 80px;
	background-color: white;
	margin-bottom: 16px;
	box-shadow: 8px 8px 8px #B1E1ED;
}



.partner-item-icon {
	/* height: 60px; */
	width: 60%;
	max-height: 80%;
	object-fit: contain;
}
.Cooperative ul {
	display: flex;
	flex-wrap: wrap;
}
.Cooperative ul li {
	width: 20%;
	height: 100px;
	margin-bottom: 1.25rem;
	margin-right: 5%;
}
.Cooperative ul li>img {
	width: 100%;
	height: 100%;
}
.ContactUsBox {
	width: 100%;
	height: 250px;
	background-color: #44BC82;
	position: relative;
}
.ContactUs {
	margin: 0 10%;
	display: flex;
	justify-content: space-between;
	font-size: 16px;
	line-height: 24px;
	color: #FFFFFF;
}
.ContactUs .contact-left {
	width: 50%;
}
.contact-left .contact-name {
	font-size: 24px;
	margin: 60px 0 30px;
}
.contact-left > p {
	margin: 15px 0;
}
.contact-right {
	margin-top: 100px;
}
.switch {
	display: flex;
	justify-content: space-between;
	margin: 0 20rem 1.25rem;
}
.switch .switch-left {
	display: flex;
}
.switch .switch-left div {
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	background-color: #dde0e4;
	margin: 0 0.3125rem;
}
.switch-left .active {
	width: 2.6rem !important;
	background-color: #44bc82 !important;
	border-radius: 20px !important;
}
.switch .switch-right {
	display: flex;
}
.switch-right .vectorleft {
	margin-right: 4rem;
}

/* 零碳园区 */
.area-items{
	/* position: relative; */
	display: flex;
	/* justify-content: space-between; */
	gap: 1rem;
	align-items: stretch;
	padding: 0 10%;
	margin-bottom: 1rem;
}

.area-item{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	/* width: calc(33.33% - .5rem); */
	/* height: 100%; */
	color: #fff;
	border-radius: 8px;
	flex: 1;
	padding: 20px;
}
.area-item-bg1 {
	background: linear-gradient(to bottom, #94D1FE, #3965A3);
}

.area-item-bg2 {
	background: linear-gradient(to bottom, #2D7C75, #2D7C75);
}

.area-item-bg3 {
	background: linear-gradient(to bottom, #F28E96, #E51F2F);
}

.area-icon{
	width: 30px;
	height: 30px;
}

.area-value{
	font-size: 26px;
	font-weight: 700;
	margin-top: 8px;
}

.area-desc{
	font-size: 18px;
	margin: 8px 0;
}

.area-detail{
	font-size: 14px;
	font-weight: 300;
}

.area-reasons{
	display: flex;
	gap: 1rem;
	align-items: stretch;
	padding: 0 10%;
	margin-bottom: 1rem;
}

.area-reason-left{
	flex: 1;
	/* padding: 20px; */
}

.area-reason-items{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
}

.area-reason-item {
	border-left: 2px solid #2E7D32;
	/* border-radius: 8px; */
	width: calc(50% - .6rem);
	padding-left: 20px;
	margin-bottom: 1rem;
}

.area-reason-item-title{
	line-height: 20px;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 8px;
}

.area-reason-item-icon {
	width: 20px;
}

.area-reason-item-100{
	width: 100%;
	border-radius: 8px;
	padding: 20px;
}

.area-reason-item-100-title {
	line-height: 20px;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 8px;
}

.area-reason-desc {
	font-size: 12px;
}

.area-reason-right{
	flex: 1;
	padding: 20px;
	color: #fff;
	border-radius: 8px;
}

.area-reason-right-icon{
	width: 16px;
}

.area-reason-right-title {
	line-height: 20px;
	font-size: 20px;
	font-weight: 600;
}

.area-reason-right-desc {
	font-size: 12px;
	margin: 1rem 0;
}

.area-reason-values{
	background-color: rgba(255, 255, 255, 0.3);
	border-radius: 8px;
	padding: 16px;
}

.area-reason-right-value-desc {
	font-size: 12px;
	font-weight: 600;
	margin-bottom: 20px;
}

.area-reason-value-base {
	display: flex;
	gap: 1rem;
	align-items: stretch;
	/* padding: 20px; */
	border-radius: 8px;
}

.area-reason-value {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex: 1;
}

.area-reason-value-value {
	font-size: 24px;
	font-weight: 700;
}

.project-base {
	/* padding: 0 10%; */
	margin: 0 10%;
}

.project-top {
	display: flex;
	align-items: stretch;
	gap: 1;
	text-align: center;
}

.project-line-view {
	position: relative;
	width: 30px;
	color: #3A3A3A;
	font-size: 20px;
	font-weight: 600;
}

.project-method {
	flex: 1;
}

.project-title {
	width: 100%;
	padding: 5px;
	background-color: #2D7C75;
	color: white;
	line-height: 20px;
	font-size: 16px;
	font-weight: 600;
}

.project-top-2 {
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	margin: 0 10px;
}

.project-top-2-bg1 {
	position: absolute;
	top: 10px;
	left: -23px;
	width: 80px;
	height: 50px;
	background-image: url(../image/border_small.svg);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	transform: rotateZ(90deg);
}

.project-method-items {
	display: flex;
	gap: 5px;
	align-items: stretch;
	line-height: 16px;
	margin-bottom: .5rem;
}

.project-method-item {
	flex: 1;
	white-space: nowrap;
	padding: 5px 0;
	border: 1px solid #2D7C75;
}

.project-method-item-icon{
	width: 16px;
}

.project-top-center{
	display: flex;
	align-items: center;
	width: 100px;
}

.triangle-right {
  width: 0;
  height: 0;
  border-top: 50px solid transparent;    /* 上边透明 */
  border-bottom: 50px solid transparent; /* 下边透明 */
  border-left: 20px solid #2D7C75;          /* 左边实色 → 指向右 */
	margin: 0 10px 0 40px;
}

.project-top-img{
	flex: 1;
}

.project-middle{
	display: flex;
	align-items: stretch;
	gap: 10px;
}

.project-middle-items {
	display: flex;
	align-items: stretch;
	gap: 1rem;
	flex: 1;
}

.project-middle-item{
	background-color: #E8F5E9;
	border-radius: 8px;
	text-align: center;
	flex: 1;
}

.project-middle-item-title{
	font-size: 20px;
	font-weight: 600;
	color: #2D7C75;
	margin: .5rem;
}


.project-bottom{
	display: flex;
	align-items: stretch;
	gap: 10px;
}

.project-bottom-items {
	display: flex;
	align-items: stretch;
	gap: 1rem;
	flex: 1;
}

.project-bottom-item{
	text-align: center;
	flex: 1;
	border: 1px solid #2D7C75;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	font-size: 14px;
}

.project-bottom-item-subs{
	display: flex;
	align-items: stretch;
	gap: 1rem;
	flex: 1;
}

.project-bottom-item-sub{
	border-radius: 8px;
	text-align: center;
	flex: 1;
}

.project-bottom-item-title{
	font-size: 16px;
	font-weight: 600;
	color: #2D7C75;
	margin: .5rem;
}


/* 零碳全景图 */
.panorama {
	flex: 1;
	background-color: white;
	padding: 0 10%;
	font-size: 17px;
}

.panorama-img {
	width: 100%;
	object-fit: contain;
	margin-top: 20px;
}
.panorama-desc{
	/* font-size: 17px; */
}

.white-color {
	color: #ffffff;
}

.color-3{
	color: #3A3A3A;
}

.color-0D4F50 {
	/* color: #0D4F50 !important; */
	/* font-size: 24px !important; */
	font-weight: 600;
}

.color-2D7C75{
	color: #2D7C75;
}

.bg-1{
	background-color: #0e81b0;
}

.clear-bg{
	background-color: transparent;
}

.border-dotted{
	border: 2px dashed  #44bc82;
}


.bg-E8F5E9 {
	background-color: #E8F5E9;
}

.border-solid{
	border: 1px solid #44bc82;
}

.background-img-small{
	background-image: url("../image/border_small.svg");
}
.margin-bottom-1{
	margin-bottom: 1rem;
}

.margin-bottom-05{
	margin-bottom: .5rem;
}
.margin-right-05 {
	margin-right: .5rem;
}

.margin-bottom-0{
	margin-bottom: 0;
}
.padding-bottom-1{
	padding-bottom: 1rem;
}

.margin-40 {
	margin: 40px 0;
}


.center-title {
	font-size:17px;
	color:#4d4d4d;
	text-align:center;
	padding-top:20px;
}
.left-title{
	text-align: left;
	padding-left: 10%;
}



/* Example for smaller screens */
@media screen and (max-width: 1200px) {
  .module .about {
    flex-direction: column; /* Stack items vertically */
    margin: 2rem 5%; /* Adjust margins */
  }

  .module .about .about-left,
  .tabscon,
  .about .about-middle,
  .about-right {
    width: 100%; /* Full width on small screens */
    margin: 1rem 0; /* Add vertical spacing */
  }

  .function > ul {
    /* flex-direction: column; 
    align-items: center; */
  }

  .function > ul > li {
    /* width: 90%; */
		flex: 1;
		margin-right: 2rem;
    margin-bottom: 2rem; /* Add spacing between items */
  }

  .business-ul {
    /* flex-direction: column; */
    margin: 2rem 5%;
  }

  .business-li {
    width: 100%; /* Full width on small screens */
    margin-bottom: 2rem; /* Add spacing between items */
  }

  .production-box {
    /* flex-direction: column; */
    margin: 2rem 5%;
  }


	
	.production-left {
		width: 59%;
	}
  .production-right {
    width: 40%; /* Full width on small screens */
  }

  .frame {
    /* flex-direction: column; */
    margin: 2rem 5%;
  }

  .frame-top {
		margin: 2rem 5% 0 5%;
	}
  .frame-middle,
  .frame-border {
    width: 100%; /* Full width on small screens */
		font-size: 22px;
  }

  .hardware {
    flex-direction: column; /* Stack hardware items vertically */
    margin: 2rem 5%;
  }

  .hardware-left,
  .hardware-right {
    width: 100%; /* Full width on small screens */
  }

  .advantage-bottom ul {
    /* flex-direction: column;  */
		justify-content: space-around;
		align-items: center;
		width: 90%;
		margin: 0 5%;
  }

  .advantage-card {
    width: 45%; /* Wider cards on small screens */
    margin: 1rem 0; /* Add spacing between cards */
  }

  .empower .empower-card {
    /* width: 100%;  */
		height: 45%;
    margin-bottom: 2rem; /* Add spacing between cards */
  }

  .appscene-bottom {
    /* flex-direction: column; 
		  align-items: center; */
  }

  .appscene-card {
    width: 23%;
    margin-bottom: 2rem; /* Add spacing between cards */
  }

  .Cooperative ul li {
    width: 45%; /* Two columns on small screens */
    margin-right: 5%;
  }

  .ContactUs {
    flex-direction: column; /* Stack contact items vertically */
    margin: 2rem 5%;
  }

  .ContactUs .contact-left,
  .contact-right {
    width: 100%; /* Full width on small screens */
  }

  .area-items,
  .area-reasons {
    flex-direction: column; /* Stack area items vertically */
    padding: 0 5%;
  }

	.area-reasons-3 {
		flex-direction: row;
	}

  .area-item,
  .area-reason-left,
  .area-reason-right {
    width: 100%; /* Full width on small screens */
    margin-bottom: 1rem; /* Add spacing between items */
  }

  .project-top,
  .project-middle,
  .project-bottom {
    /* flex-direction: column; */
    padding: 0;
  }

	.project-base{
		margin: 0 5%;
	}
  .project-top-img {
		width: 48%;
	}

  .project-method,
  .project-middle-items,
  .project-bottom-items {
    width: 100%; /* Full width on small screens */
    margin-bottom: 1rem; /* Add spacing between items */
  }

	.area-reason-item-100 {
		width: calc(50% - 10px);
	}

	.panorama{
		padding: 0 5%;
	}

	.panorama-desc{
		font-size: 14px;
	}
	
	.bottom-right {
		margin: 2rem 0 0 2rem;
	}

	.module .center-title {
		font-size: 15px;
	}

	.module .left-title {
		font-size: 22px;
	}
	.area-reason-item-title{
		font-size: 22px;
	}

	.area-reason-desc{
		font-size: 20px;
	}

	.area-reason-right-title {
		font-size: 22px;
	}

	.area-reason-right-desc{
		font-size: 20px;
	}

	.area-reason-right-value-desc{
		font-size: 20px;
	}

	.area-reason-value-value{
		font-size: 28px;
	}

	.business-bottom{
		width: 75%;
	}

	.appscene-card > p{
		margin: 0 20px;
		font-size: 20px;
	}

	.center-title {
		/* font-size: 20px; */
	}

	.center-title-1 {
		font-size: 26px !important;
	}

	.advantage-button {
		font-size: 28px;
	}

	.advantage-card .card-top .card-right{
		font-size: 22px;
	}

	.card-right-desc{
		font-size: 20px;
	}

	.model {
		width: 90%;
	}

	.article {
		margin: 6rem 5% 0px;
	}

	.appscene {
		margin: 5rem 5% 0;
	}

	.case-ul {
		margin: 0 5% 2rem;
	}

	.card-count {
		margin: 2rem 5% 0px;
		font-size: 12px;
	}

	.partnerbg {
		margin: 2rem 5% 0;
	}

	.left-li .left-li-bottom {
		width: 31.75rem;
	}

	.area-desc {
		font-size: 26px;
	}

	.area-detail {
		font-size: 22px;
	}
}