

.header .banner {
    position: relative;
    background-image: url("/image/web_banner.png");
    background-size:100% auto;
    /*background-position: center;*/
    background-repeat:no-repeat;
    /* height: 1000px; */
    cursor: pointer;
    width: 100%;
    padding-bottom: 35%;
}

.header  .top {
    background: #18243A;
    color: #FFFFFF;
    padding: 1% 0px 1% 20%;
}      


.content1 {
    margin-top: 3%;
}

.content1 .content-title {
    font-weight: 600;
    color: #303030;
    text-align: center;
    
}
.content1 .content-text {
    margin: 3% 13% 0%;
}
.content1 .content-text .line-box {
    margin-top: 3%;
}
.content1 .content-text .box {
    background: linear-gradient(90deg, #DBEFFF 0%, #FFFFFF 100%);
    border-radius: 8px 8px 8px 8px;
    opacity: 1;
    color: #222C3B;

    padding: 2% 0%;
    width: 29%;
}
 
.content1 .content-text .box span {
    padding-left: 8%;
}

.content1 .content-text .box img {
    width: 18%;
}



.content2 {
    margin-top: 3%;
    background-color: #F7FAFD;
}
.content2 .content-title {
    padding-top: 3%;
    font-weight: bold;
    color: #0038AA;
    text-align: center;
}
.content2 .content-text-one {
    padding-top: 3%;
    margin: 0% 13% 0%;
    text-align: center;
    padding-bottom: 7%;
}
.content2 .content-text-one img {
    width: 100%;
}




.content3 {
    background: #FFFFFF;
}
.content3 .content-text-three {
    margin: 0% 13% 0%;
    padding: 3% 0%;
}
.content3 .content-text-three .right img {
    width: 100%;
}

.content3 .content-text-three .left {
    padding-top: 116px;
    width: 43%;
    margin-right: -8%;
    padding-bottom: 129px;
}

.content3 .content-text-three .line-one {
    width: 70%;
} 
.content3 .content-text-three .left .text-one {
    color: #222C3B;
    font-weight: 500;
}

.content3 .content-text-three .left .text-two {
    font-weight: bold;
    color: #B4B4B4;
}

.content3 .content-text-three .left .text-three {
    font-weight: 400;
    color: #353535;
}

.content3 .content-text-three .left img {
    width: 20%;
}



.content4 {
    margin-top: 3%;
    background-color: #F7FAFD;
    padding-bottom: 3%;
}
.content4 .content-title {
    padding-top: 3%;
    font-weight: bold;
    color: #0038AA;
    text-align: center;
}
.content4 .content-text {
    margin: 2% 13% 0%;
}

.content4 .content-text .box img {
    width: auto;
}

.content4 .content-text .box .desc1 {
    padding-right: 21%;
    padding-left: 3%;
}

.content4 .content-text .box .desc2 {
    padding-right: 18%;
    padding-left: 3%;
}

.content4 .content-text .box .desc3 {
    padding-right: 10%;
    padding-left: 3%;
}



.foot {
    background: #18243A;
}
.foot .content {
    padding: 5% 0% 3% 16%;
    color: #FFFFFF;
}



@media screen and (min-width: 1050px) and (max-width: 1750px) {
    
    .content3 .content-text-three .line-one {
        width: 100%;
    }
    .content3 .content-text-three .left {
        margin-right: 3%;
    }


    .content4 .content-text .box img {
        width: 300px;
    }
}

@media screen and (min-width: 650px) and (max-width: 1050px) {
    .header .top {
        padding: 1% 0px 1% 8%;
    }
    .content3 .content-text-three .line-one {
        width: 100%;
    }
    .content3 .content-text-three .left {
        width: 100%;
        margin-right: 0%;
    }
    .content4 .content-text .box img {
        width: 210px;
    }
}

@media screen and (max-width: 650px) {
    .header .top {
        padding: 1% 0px 1% 8%;
    }
    .content1 .content-text {
        margin: 3% 0% 0%;
    }
    .content3 .content-text-three .line-one {
        width: 100%;
    }
    .content3 .content-text-three .left {
        width: 100%;
        margin-right: 0%;
    }
    .content3 .content-text-three {
        margin: 0%;
    }
    .content4 .content-text .box img {
        width: 113px;
    }
}