@charset "utf-8";
/*  */
.page-banner{ position: relative; overflow: hidden;}
.page-banner-pics img{width: 100%;}
/*  */
.page-banner-contents{position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0 100px; justify-content: center; flex-direction: column;}
@media (max-width:1700px){
	.page-banner-contents{padding-right:80px;padding-left:80px;}
}
@media (max-width:1600px){
	.page-banner-contents{padding-right:15px;padding-left:15px;}
}
@media (max-width:1440px){
	.page-banner-contents{padding:15px}
}
/*  */
.page-banner-title h3{font-size: 54px; line-height: 1.6;}
.page-banner-title p{font-size: 18px; line-height: 1.4;}
.page-banner-title-white h3,
.page-banner-title-white p{color: #fff;}

@media (max-width:1440px){
	.page-banner-title-white h3{font-size: 42px;}
	.page-banner-title-white p{color: #fff;}
}

@media (max-width:1200px){
	.page-banner-title-white h3{font-size: 32px;}
}

@media (max-width: 768px){
	.page-banner-title-white h3{font-size: 24px;}
	.page-banner-title-white p{font-size: 16px;}
}
/*  */
.page-banner-icon ul li{ position: relative; z-index: 2; margin-top: 60px; display: flex; flex-direction: column; justify-content: center; margin-right: 25px; height: 120px; width: 120px; padding: 15px; border-radius: 12px;overflow: hidden;text-align: center; }
.page-banner-icon ul li::before{position: absolute; top: 0; left: 0; content: ''; z-index: -1; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.1);backdrop-filter: blur(15.5px);-webkit-backdrop-filter: blur(15.5px);border: 1px solid rgba(255, 255, 255, 0.18);box-shadow: rgba(142, 142, 142, 0.19) 0px 6px 15px 0px;-webkit-box-shadow: rgba(142, 142, 142, 0.19) 0px 6px 15px 0px;border-radius: 9px;-webkit-border-radius: 9px;color: rgba(255, 255, 255, 0.45);}
.page-banner-icon ul li img{max-width: 100%; margin: 0 auto 5px;}
.page-banner-icon ul li p{color: #fff;}
@media (max-width:1440px){
	.page-banner-icon ul li{width: 100px; height: 100px;}
}

@media (max-width:1200px){
	.page-banner-icon ul li{width: 80px; height: 80px;}
	.page-banner-icon ul li img{max-width: 80%;}
	.page-banner-icon ul li p{font-size: 12px;}
}

@media (max-width:1200px){
	.page-banner-icon ul li{ margin-top: 40px;}
}


@media (max-width: 768px){
	.page-banner-icon ul li{ margin-right: 15px;}
}

@media (max-width: 480px){
	.page-banner-icon ul li{ margin-right: 10px;}
}

/*  */
.solution-bg{ padding-bottom: 120px; background-color: #F8F9FB; overflow: hidden;}
.solution-item{position: relative; justify-content: flex-end; margin-top: 120px;}
.solution-pic{width: 1200px; height: 640px;}
.solution-contents{position: absolute; bottom: 50%; left: 160px; padding: 65px 120px; width: 800px; background-color: #fff; transform: translateY(50%);}

.solution-more a{display: inline-block; padding: 0  40px; line-height: 50px; font-size: 20px; background-color: var(--default);color: #fff;}
.solution .solution-item:nth-child(2n){ justify-content: flex-start; }
.solution .solution-item:nth-child(2n) .solution-contents{ left: initial; right: 160px; }


@media (min-width:768px) {
	.solution-more a:hover{background-color: #06E2E5;}
}

@media (max-width:1640px) {
	.solution-contents {left: 80px; padding: 65px 80px; width: 600px;}
	.solution .solution-item:nth-child(2n) .solution-contents{ right: 100px; }
}

@media (max-width:1440px) {
	.solution-pic{width: 1000px; height: 560px;}
	.solution-contents {left: 80px;}
	.solution .solution-item:nth-child(2n) .solution-contents{ right: 80px; }
}

@media (max-width:1366px) {
	.solution-pic{width: 900px; height: 500px;}
	.solution-contents {left: 60px;}
	.solution .solution-item:nth-child(2n) .solution-contents{ right: 60px; }
}

@media (max-width:1280px) {
	.solution-pic{width: 800px; }
	.solution-contents {left: 40px; padding: 50px 65px;}
	.solution .solution-item:nth-child(2n) .solution-contents{ right: 40px; }
}

@media (max-width:960px) {
	.solution-pic{width: 100%; }
	.solution-contents {left: 50%; transform: translateX(-50%) translateY(0); bottom: -120px;}
	.solution .solution-item:nth-child(2n) .solution-contents{ right: 50%; transform: translateX(50%);}
}

@media (max-width:768px) {
	.solution-item{ margin-top: 0; flex-direction: column-reverse;}
	.solution-pic{width: 100%; }
	.solution-contents { position: static; left: 50%; width: 100%; transform:translate(0)!important; }
}

@media (max-width:640px) {
	.solution-pic{ height: 240px; }
	.solution-contents { padding: 30px; }
	.solution-more a{ padding: 0 20px; line-height: 40px; font-size: 16px;}
}

/*  */
.technology-need-lists ul{margin-left: -24px;}
.technology-need-lists ul li{width: 33.33%; padding-left: 24px; margin-bottom: 24px;}
.technology-need-item{ padding: 30px 40px; background-color: #F9FAFC; height: 100%; border-radius: 6px;}
.technology-need-item h3{margin: 15px 0; color: var(--default); font-size: 24px;}
.technology-need-item p{color: #666;}

@media (max-width:860px) {
	.technology-need-lists ul{margin-left: -15px;}
	.technology-need-lists ul li{width: 50%; padding-left: 15px; margin-bottom: 15px;}
	.technology-need-item h3{margin: 15px 0; font-size: 20px;}
}

@media (max-width:640px) {
	.technology-need-lists ul li{width: 50%;}
	.technology-need-item{ padding: 15px;}
	.technology-need-item img{ width: 60px;}
	.technology-need-item h3{margin: 10px 0; font-size: 18px;}
	.technology-need-item p{ font-size: 14px;}
}


/*  */
.technology-tools-bg{background-color: #F8F9FB; padding-bottom: 0;}
.technology-tools-lists .technology-tools-item:nth-child(2n){ flex-direction: row-reverse;}

.technology-tools-pic{width: 50%;}
.technology-tools-pic img {max-width: 100%;}

.technology-tools-content{width: 50%; padding: 15px 160px; align-items: center;}
.technology-tools-content .index-title{padding-bottom: 0;}
@media (max-width:1640px) {
	.technology-tools-content{ padding: 15px 100px; }
}

@media (max-width:1440px) {
	.technology-tools-content{ padding: 15px 80px; }
}

@media (max-width:1366px) {
	.technology-tools-content{ padding: 15px 60px; }
}

@media (max-width:1280px) {
	.technology-tools-content{ padding: 15px 40px; }
}

@media (max-width:960px) {
	.technology-tools-content .index-title h3{ font-size: 24px;}
}

@media (max-width:960px) {
	.technology-tools-pic{width: 100%;}
	.technology-tools-pic img {max-width: 100%;}
	
	.technology-tools-content{width: 100%; padding: 30px; align-items: center;}
}