.banner{
    background: url("../../img/banner1.png") no-repeat center;
    width: 100%;
    height: 580px;
}
.banner_2{
    background: url("../img/saas-cion11.png") no-repeat center;
    /* background: url("../img/saas_pro\ 2.jpg") no-repeat center; */
    width: 100%;
    height: 635px;
}
/*html {
 
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
 
-webkit-filter: grayscale(100%);}
*/

.banner_2_h5{
    padding: .48rem 0 .4rem;
    text-align: center;
    font-family: PingFangSC-Regular;

}
.banner_2_h5 h5{
    font-size: .32rem;
    color: #222B34;
    font-family: PingFangSC-Semibold;
    margin-bottom: .45rem;
}
.banner_2_h5 h3{
    font-size: .3rem;
    color: #333333;
    margin-bottom: .08rem;
}
.banner_2_h5 p{
    width: 90%;
    font-size: .26rem;
    color: #999999;
    margin: 0 auto .24rem;
    line-height: .4rem;
}

.content{
    width: 100%;
    height: 665px;
    background: #F6F6F7;
    padding-top: 74px;
}

.content h3{
    font-family: PingFangSC-Semibold;
    font-size: 32px;
    color: #222B34;
    text-align: center;
}
.content_box{
    width: 1200px;
    height: 488px;
    margin: 32px auto 0;
    padding: 0 99px 0 48px;
}
.content_box .content_box_left{
    width: 609px;
    height:  488px;
    float: left;
    margin-right: 181px;
    padding-top: 62px;
}
/* .content_box_left ul{

} */
.content_box_left ul li{
    width: 609px;
    height: 86px;
    cursor: pointer;
    margin-bottom: 10px;
}

.content_box_left ul li:nth-child(1):hover{
    background: url("../img/leftImageHover1.png") !important;

}
.content_box_left ul li:nth-child(2):hover{
    background: url("../img/leftImageHover2.png") !important;
}
.content_box_left ul li:nth-child(3):hover{
    background: url("../img/leftImageHover3.png") !important;
}
.content_box_left ul li:nth-child(4):hover{
    background: url("../img/leftImageHover4.png") !important;
}
.content_box_left ul li.active:nth-child(1){
    background: url("../img/leftImageHover1.png") !important;

}
.content_box_left ul li.active:nth-child(2){
    background: url("../img/leftImageHover2.png") !important;
}
.content_box_left ul li.active:nth-child(3){
    background: url("../img/leftImageHover3.png") !important;
}
.content_box_left ul li.active:nth-child(4){
    background: url("../img/leftImageHover4.png") !important;
}

.content_box .content_box_right{
    width: 207px;
    height: 488px;
    float: left;
    background: url("../img/IPhoneX.png") no-repeat center;
}
/*è½®æ’­*/
.wrapper{
    width: 100%;
    height: 100%;
    padding-top: 50%;

}
.wrapper_box{
    width: 125px;
    height: 218px;
    overflow: hidden;
    margin:0 auto;
}
.wrapper_box ul{
    width: 628px;
    height: 218px;
    transition: all .3s;
}
.wrapper_box ul li{
    float: left;
    width: 125px;
    height: 218px;
    background-size: contain;
    /* padding-right: 40px; */
    /* margin-right: 40px; */
    /* background-size: 100%; */
}
/*è½®æ’­nav*/

.nav_box{
    width: 100%;
    height: 7px;
}
.nav_box ul{
    width: 40px;
    margin: 0 auto;
    height: 7px;
}
.nav_box ul li{
    float: left;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
    margin-right: 3px;
    cursor: pointer;
}
.nav_box ul li.active{
    float: left;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    margin-right: 3px;
    cursor: pointer;
    background: #00B153;
}

.content_2{
    font-family: PingFangSC-Regular;
    width: 1200px;
    height: 504px;
    text-align: center;
    padding: 76px 64px 0;
    margin: 0 auto;

}
.content_2 h3{
    font-family: PingFangSC-Semibold;
    font-size: 32px;
    color: #000000;
    letter-spacing: 1.04px;
}
.content_2 p{
    font-size: 16px;
    color: #666666;
    letter-spacing: 0.52px;
    margin-top: 8px;
}
.list{
    margin-top: 48px;
    font-family: PingFangSC-Regular;
}
.list li{
    width: 33%;
    float: left;
}
.list_box{
    width: 248px;
    margin: 0 auto;
}
 .list li img{
    width: 101px;
    height: 100px;
     margin-bottom: 32px;
}
.list li h4{
    width: 100%;
    font-size: 20px;
    color: #333333;
    letter-spacing: 0.65px;
}
.list li p{
    width: 100%;
    font-size: 16px;
    color: #999999;
    letter-spacing: 0.52px;
}

.headText{
    width: 100%;
    /* height: 580px; */
    color:white; 
    font-size: 60px;
    font-weight: 600; 
    text-align: center;
    /* padding: 390px; */
    padding-top: 290px;
    /* padding-bottom: 50px; */

}

.headText2{
    width: 100%;
    /* height: 580px; */
    color:black; 
    font-size: 40px;
    font-weight: 500; 
    text-align: center;
    /* padding: 390px; */
    padding-top: 40px;
}