.banner{ background: url('../img/scenarioMarketingBanner.png') top center no-repeat; height: 197px; padding: 150px 0px; color: #141414;}
.banner b{ height: 75px; line-height: 75px; font-size: 54px;}
.banner p{ margin-top: 40px; line-height: 37px; font-size: 26px;}

.title{ font-size: 30px; font-weight: 600; color: #141414; line-height: 60px; text-align: center;}
.subTitle{ margin-top: 5px; font-size: 20px; line-height: 28px; color: #7E8287; text-align: center;}

.market{ padding-top: 60px;}
.market .flex{ margin-top: 40px; justify-content: space-between; align-items: center; height: 406px; background: url('../img/marketBg.png') top center no-repeat;}
.market .flex .middle{ width: 340px; height: 148px; text-align: center; line-height: 148px; font-size: 34px; font-weight: 600; color: #FFFFFF;}
.market .flex .left,
.market .flex .right{ width: 527px; height: 340px;}
.market .flex .item{ font-size: 16px; line-height: 30px; color: #141414; width: 300px; position: relative;}
.market .flex .item + .item{ margin-top: 80px;}
.market .flex .item span{ display: inline-block; position: absolute; top: 10px; width: 41px; height: 41px; text-align: center; line-height: 41px; margin: 2px; border-radius: 50%; background: linear-gradient(180deg, #A8CBFF, #3267FF); font-weight: 600; color: #FFFFFF; font-size: 21px;}
.market .flex .item span::before{ content: ''; display: block; width: 45px; height: 45px; position: absolute; z-index: -1; top: -2px; right: -2px; bottom: -2px; left: -2px; background: linear-gradient(180deg, #FFFFFF, #D3E3FF); border-radius: 50%;}
.market .flex .left .item{ padding-right: 85px; text-align: right;}
.market .flex .left .item:nth-child(1){ margin-left: 135px;}
.market .flex .left .item:nth-child(2){ margin-left: 75px;}
.market .flex .left .item:nth-child(3){ margin-left: 145px;}
.market .flex .left .item span{ right: 0px;}
.market .flex .right .item{ padding-left: 85px;}
.market .flex .right .item span{ left: 0px;}
.market .flex .right .item:nth-child(2){ margin-left: 65px; margin-top: 50px;}

.solution{ padding-top: 60px;}
.solution .flex{ margin-top: 30px; justify-content: space-between;}
.solution .flex .left{ width: 475px; background: linear-gradient(180deg, #EFF3F9 0%, #FFFFFF 100%); box-shadow: 0px 23px 29px 0px rgba(97,107,126,0.14); border-radius: 8px; border: 4px solid #FFFFFF; padding: 30px;}
.solution .flex .left p{ text-indent: 2em; font-size: 16px; line-height: 30px; color: #7E8287;}
.solution .flex .right{ width: 815px; height: 330px;}
.solution .flex .right .top{ margin-bottom: 27px; padding-top: 19px; height: 83px; background: linear-gradient(180deg, #EFF3F9 0%, #FFFFFF 100%); box-shadow: 0px 23px 29px 0px rgba(97,107,126,0.14); border-radius: 8px; border: 4px solid #FFFFFF; text-align: center;}
.solution .flex .right .top b{ color: #3267FF; font-size: 26px;}
.solution .flex .right .top p{ margin-top: 15px; color: #7E8287; font-size: 16px;}
.solution .flex .right .bottom{ align-items: center; padding-top: 80px; height: 136px; background: url('../img/solutionBg.png') top center no-repeat;}
.solution .flex .right .bottom .item{ width: 136px; height: 136px; text-align: center; line-height: 136px; border-radius: 50%; background: url('../img/solutionBottom.png') no-repeat; box-shadow: 0px 23px 29px 0px rgba(97,107,126,0.14); font-size: 16px; color: #141414;}
.solution .flex .right .bottom img{ width: 43px; height: 9px;}

.product{ padding-top: 60px;}
.product .flex{ flex-wrap: wrap; margin-top: 30px;}
.product .flex .item{ padding: 22px 20px; width: 310px; height: 241px; background: #3267FF;}
.product .flex .item.img{ padding: 0px; width: 350px; height: 285px;}
.product .flex .item.img img{ width: 100%; height: 285px;}
.product .flex .item b{ display: block; color: #FFFFFF; font-size: 28px; line-height: 40px;}
.product .flex .item p{ margin: 5px 0px 10px; height: 150px; color: #98B3FF; font-size: 16px; line-height: 30px;}
.product .flex .item span{ color: #FFFFFF; font-size: 12px; background: #98B3FF; padding: 6px 20px; border-radius: 30px;}
.product .flex .item span + span{ margin-left: 10px;}

.summarize{ padding-top: 60px; height: 882px; background: url('../img/summarizeBg.png') bottom center no-repeat;}
.summarize .flex{ margin-top: 30px; justify-content: space-between;}
.summarize .flex .item{ width: 220px;}
.summarize .flex .item .line{ margin-left: 110px; width: 1px; height: 40px; background: repeating-linear-gradient(to bottom, #FFFFFF 4px, #3267FF 8px);
}
.summarize .flex .item .top{ display: flex; align-items: center; padding: 0px 25px; font-size: 28px; color: #141414; font-weight: 600; height: 88px; background: linear-gradient(180deg, #EFF3F9, #FFFFFF); box-shadow: 0px 23px 29px 0px rgba(97,107,126,0.14); border-radius: 8px; border: 4px solid #FFFFFF;}
.summarize .flex .item .bottom{ padding: 15px; height: 310px; background: linear-gradient(180deg, #EFF3F9, #FFFFFF); box-shadow: 0px 23px 29px 0px rgba(97,107,126,0.14); border-radius: 8px; border: 4px solid #FFFFFF; color: #7E8287; font-size: 16px; line-height: 30px;}