html,
body {
    position: relative;
    height: auto;
}

body {
    background: #eee;
    /*  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;*/
    font-family: PingFang SC Medium, "微软雅黑";
    font-size: 14px;
    color: #000;
    margin: 0;
    padding: 0;
}

@media screen and (min-width: 1200px) {
    .swiper-container {
        display: flex;
        width: 100%;
        height: auto;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

    .swiper-pagination-bullet {
        border: 1px solid #fff;
        background: none;
    }

    .swiper-pagination-bullet-active {
        background: #fff;
    }

    .banner {
        width: 100%;
    }

    .titleBox {
        margin: auto;
        display: flex;
        flex-direction: column;
        width: 400px;
        position: absolute;
        top: 55%;
        left: 50%;
        margin-left: -200px;
        z-index: 1;
        /*margin-top:;*/
    }

    .title {
        margin: auto;
        font-weight: 600;
        font-size: 34px;
        color: #fff;
    }

    .titleEn {
        margin: auto;
        margin-top: 20px;
        font-size: 24px;
        color: #fff;
    }

    .headerOuter {
        width: 100%;
        height: auto;
        display: flex;
        background: #fff;
    }

    .header {
        display: flex;
        margin: auto;
        width: 1200px;
        height: 50px;
        border-bottom: 1px solid #7ba3db;
        justify-content: center;
        align-items: center;
    }

    .headerLeft {
        width: 260px;
        display: flex;
    }

    .logo {
        margin: auto;
        margin-left: 0;
        height: 40px;
    }

    .line {
        width: 1px;
        height: 30px;
        background: #5386c5;
        margin: auto;
        margin-left: 25px;
        margin-right: 25px;
    }

    .siteName {
        margin: auto;
        margin-right: 0;
        font-size: 20px;
        color: #14329d;
    }

    .headRight {
        display: flex;
        justify-content: space-around;
        height: 100%;
        margin: auto;
    }


    .headRightBox {
        display: flex;
    }

    .headNavBox {
        position: relative;
        display: flex;
        margin: auto;
    }

    .navBoxBox {
        display: flex;
        padding-left: 32px;
        padding-right: 32px;
    }

    .headNav {
        width: auto;
        margin: auto;
        line-height: 50px;
        color: #14329d;
    }


    .navTwoBox {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        padding-top: 20px;
        background: rgba(255, 255, 255, 0.1);
        z-index: 100;
    }

    .navTwoBoxLi {
        margin: auto;
        color: #fff;
        margin-bottom: 20px;
        font-size: 14px;
    }

    .navcheck {
        border-bottom: 3px solid #0078ff;
    }

    .navLine {
        width: 1px;
        height: 30px;
        background: #5d9dd6;
        margin: auto;
        /*    margin-left: 32px;
            margin-right: 32px; */
    }

    .bannerBottom {
        position: absolute;
        bottom: 50px;
        left: 50%;
        width: 76px;
        height: 76px;
        margin-left: -38px;
        z-index: 1
    }

    .content {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        background: #fff;
    }

    .contentBox {
        width: 1200px;
        margin: auto;
        display: flex;
        flex-direction: column;
    }

    .tagsBox {
        width: auto;
        height: auto;
        display: flex;
        margin: auto;
        font-size: 18px;
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .tagLi {
        margin: auto;
        margin-left: 30px;
        margin-right: 30px;
        color: #999999;
    }

    .tagLiCheck {
        color: #324ca9;
        font-weight: 600;
    }

    .contentTitle {
        margin: auto;
        margin-top: 50px;
        margin-bottom: 50px;
        color: #14329d;
        font-size: 26px;
        font-weight: 600;
    }

    .contentTitleDesc {
        margin: auto;
        margin-top: 0px;
        margin-bottom: 50px;
        color: #000;
        font-size: 16px;
        line-height: 32px;
    }

    .proLi {
        width: 1200px;
        min-height: 600px;
        margin: auto;
        display: flex;
        background: #e5e5e5;
        margin-bottom: 30px;
    }

    .proLiLeft {
        width: 45%;
        margin: auto;
        display: flex;
        margin-top: 100px;
        flex-direction: column;
    }

    .proLiLeftTop {
        margin: auto;
        font-size: 40px;
        color: #000;
        font-weight: 600;
        margin-left: 0;
        margin-top: 0;
    }

    .proLiLeftList {
        margin: auto;
        margin-top: 30px;
        margin-left: 0;
        display: flex;
        flex-direction: column;
    }

    .proLiLeftListLi {
        margin: auto;
        margin-bottom: 20px;
        line-height: 24px;
        font-size: 16px;
        margin-left: 0;
        display: flex;
    }

    .leftPint {
        width: 8px;
        display: block;
        height: 100%;
        margin-right: 10px;
    }

    .leftPint div {
        width: 8px;
        height: 8px;
        background: #949494;
        margin: auto;
        margin-left: 0;

        margin-top: 8px;
        border-radius: 50%;

    }

    .rightDesc {
        display: inline-block;
        width: 520px;

        margin: auto;
        margin-left: 0;
    }

    .proLiRight {
        margin: auto;
    }

    .navBoxBottom {
        display: flex;
        margin: auto;
        width: 100%;
        background: #fff;
    }

    .navBoxLiLast {
        margin: auto;
        margin-left: 0;
        margin-top: 20px;
        display: flex;
    }

    .navBoxLiImg {
        margin: auto;
        margin-left: 0;
        margin-right: 10px;
    }

    .navBoxLiLastDesc {
        margin: auto;
        margin-left: 0;
        color: #999999;
    }

    .navBoxBottomBox {
        margin: auto;
        margin-top: 100px;
        margin-bottom: 100px;
        display: flex;
        justify-content: space-between;
        width: 1200px;
    }

    .navBoxLi {
        display: flex;
        flex-direction: column;
        margin: auto;
        margin-top: 0;
        margin-left: 0;
        margin-right: 0;
    }

    .navBoxLiTitle {
        font-size: 16px;
        margin: auto;
        margin-top: 0;
        margin-left: 0;
        font-weight: 600;
        color: #000;
    }

    .navBoxLiTitleDesc {
        margin: auto;
        margin-left: 0;
        margin-top: 20px;
        color: #999999;
    }

    .bottom {
        display: flex;
        margin: auto;
        width: 100%;
        background: #041329;
    }

    .bottomBox {
        display: flex;
        margin: auto;
        width: 1200px;
        color: #fff;
        margin-top: 25px;
        margin-bottom: 25px;
    }

    .bottomLeft {
        margin: auto;
        margin-left: 0;
        margin-right: 0;
    }

    .bottomRight {
        margin: auto;
        margin-left: 26px;
    }

    .navImg {
        display: none;
    }

    .headRightBox {
        display: flex;
    }
}

@media screen and (max-width: 1200px) {
    .navBoxBox {
        display: flex;
    }

    .swiper-container {
        display: flex;
        width: 100%;
        height: auto;
    }

    .swiper1 {
        display: none;
    }

    .swiper2 {
        display: flex !important;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

    .swiper-pagination-bullet {
        border: 1px solid #fff;
        background: none;
    }

    .swiper-pagination-bullet-active {
        background: #fff;
    }

    .navImg {
        display: block;
        width: 30px;
        height: 30px;
        margin: auto;
        margin-right: 10px;
        /* margin-top: 30px; */
    }

    .banner {
        width: 100%;
    }

    .header {
        /* position: absolute;
        top: 0;
        left: 50%;
        display: flex;
        margin: auto;
        margin-left: -600px; */
        display: flex;
        width: 100%;
        height: 133px;
        background: #fff;
        /* border-bottom: 1px solid #7ba3db; */
        /* z-index: 1; */
    }

    .headerLeft {
        display: flex;
        margin: auto;
        /* margin-left: 0; */
    }

    .logo {
        margin: auto;
        margin-left: 0;
    }

    .rightDesc {
        /*display: inline-block;*/
        width: 100%;
        /*padding-left: 10px;*/
        padding-right: 10px;
        margin: auto;
        margin-left: 0;
    }

    .line {
        width: 1px;
        height: 30px;
        background: #5386c5;
        margin: auto;
        margin-left: 25px;
        margin-right: 25px;
    }

    .siteName {
        margin: auto;
        margin-right: 0;
        font-size: 20px;
        color: #000;
    }

    .headRight {
        position: absolute;
        top: 133px;
        left: 0;
        display: flex;
        flex-direction: column;
        width: 100%;
        height: auto;
        /* margin: auto; */
        /* margin-right: 0; */
        display: none;
        background: #fff;
        z-index: 2;
    }

    .headNav {
        width: 100%;
        height: 50px;
        text-align: center;
        margin: auto;
        line-height: 50px;
        color: #000;
        /* border-top: 1px solid #E1E0E0; */
        border-bottom: 1px solid #E1E0E0;
    }

    .headRightBox {
        display: flex;
        flex-direction: column;
    }

    .navcheck {
        /* border-bottom: 3px solid #0078ff; */
    }

    .navTwoBox {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        background: #fff;
    }

    .navTwoBoxLi {
        /* width: 100%; */
        height: 40px;
        margin: auto;
        color: #fff;
        /* margin-bottom: 20px; */
        font-size: 12px;
        color: #000;
        line-height: 40px;
    }

    .navLine {
        width: 1px;
        height: 30px;
        background: #5d9dd6;
        margin: auto;
        margin-left: 32px;
        margin-right: 32px;
        display: none;
    }

    .bannerBottom {
        position: absolute;
        bottom: 50px;
        left: 50%;
        width: 76px;
        height: 76px;
        margin-left: -38px;
        z-index: 1
    }

    .content {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        background: #fff;
    }

    .contentBox {
        width: 100%;
        margin: auto;
        display: flex;
        flex-direction: column;
    }

    .tagsBox {
        width: auto;
        height: auto;
        display: flex;
        margin: auto;
        font-size: 18px;
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .tagLi {
        margin: auto;
        margin-left: 30px;
        margin-right: 30px;
        color: #999999;
    }

    .tagLiCheck {
        color: #324ca9;
        font-weight: 600;
    }

    .contentTitle {
        margin: auto;
        margin-top: 50px;
        margin-bottom: 50px;
        color: #14329d;
        font-size: 26px;
        font-weight: 600;
    }

    .contentTitleDesc {
        width: 95%;
        margin: auto;
        margin-top: 0px;
        margin-bottom: 50px;
        color: #000;
        font-size: 16px;
        line-height: 32px;
    }

    .proLi {
        width: 100%;
        min-height: 600px;
        margin: auto;
        display: flex;
        flex-direction: column;
        background: #e5e5e5;
        margin-bottom: 30px;
        padding: 20px 0px 10px 0px;
    }

    .proLiLeft {
        width: 100%;
        margin: 10px auto;
        display: flex;
        flex-direction: column;
    }

    .proLiLeftTop {
        font-size: 26px;
        color: #000;
        width: 100%;
        text-align: center;
        font-weight: 600;
        /* margin-left: 0; */
        margin-top: 0;
    }

    .proLiLeftList {
        margin: auto;
        margin-top: 30px;
        /* margin-left: 0; */
        display: flex;
        flex-direction: column;
    }

    .proLiLeftListLi {
        width: 97%;
        margin-left: 1.5%;
        margin-right: 1.5%;
        margin-bottom: 20px;
        line-height: 24px;
        font-size: 16px;
        /* margin-left: 0; */
    }

    .proLiRight {
        width: 100%;
        margin: auto;
    }

    .navBoxLiLast {
        margin: auto;
        margin-left: 0;
        margin-top: 20px;
        display: flex;
    }

    .navBoxLiImg {
        margin: auto;
        margin-left: 0;
        margin-right: 10px;
    }

    .navBoxLiLastDesc {
        margin: auto;
        margin-left: 0;
        color: #999999;
    }

    .navBoxBottom {
        display: flex;
        margin: auto;
        width: 100%;
        background: #fff;
    }

    .navBoxBottomBox {
        margin: auto;
        margin-top: 30px;
        margin-bottom: 30px;
        display: flex;
        /* flex-direction: column; */
        justify-content: space-between;
        flex-wrap: wrap;
        width: 100%;
    }

    .navBoxLi {
        display: flex;
        flex-direction: column;
        width: 45%;
        margin: auto;
        margin-top: 30px;
        margin-left: 10px;
        /* margin-right: 30px; */
    }

    .navBoxLiTitle {
        font-size: 16px;
        margin: auto;
        margin-top: 0;
        margin-left: 0;
        font-weight: 600;
    }

    .navBoxLiTitleDesc {
        margin: auto;
        margin-left: 0;
        margin-top: 20px;
        color: #999999;
    }

    .bottom {
        display: flex;
        margin: auto;
        width: 100%;
        background: #041329;
    }

    .bottomBox {
        display: flex;
        flex-direction: column;
        margin: auto;
        width: 100%;
        color: #fff;
        margin-top: 25px;
        margin-bottom: 25px;
    }

    .bottomLeft {
        margin: auto;
        margin-left: 10px;
        margin-right: 10px;
        text-align: center;
    }

    .bottomRight {
        margin: auto;
        margin-top: 20px;
    }
}