﻿.face-main1 {
    width: 100%;
    height: 9.33rem;
    background: url(../images/face/face-m1bg.png) no-repeat left top;
    background-size:100% 100%;
    position: relative;
}


.face-main .title {
    font-size: 0.96rem;
    font-weight: 600;
    color: rgba(16,146,237,1);
    margin: 1.6rem auto 0.213rem;
}

    .face-main .title span:nth-child(2) {
        color: #4F4F63;
    }

.face-main .subtitle {
    font-size: 0.75rem;
    font-weight: 400;
    color: rgba(111,111,130,0.39);
    line-height: 0.96rem;
    margin-bottom: 1.066rem;
}

.face-main2 {
    height: 11.36rem;
    background: rgba(245,246,247,1);
    overflow: hidden;
    text-align: center;
}

    .face-main2 .m2ul {
        display: flex;
        justify-content: space-between;
        width: 78.666%;
        margin: 0 auto;
    }

        .face-main2 .m2ul .m2li img {
            width: 3.1467rem;
            height: 3.1467rem;
            margin-bottom: 0.5867rem;
        }

        .face-main2 .m2ul .m2li div {
            font-size: 0.75rem;
            font-weight: 500;
            color: rgba(79,79,99,1);
        }

.face-main3 {
    overflow: hidden;
    text-align: center;
    height: 20.37rem;
}

    .face-main3 .tabbox-top ul {
        display: flex;
        justify-content: space-between;
        width: 92%;
        margin: 1.0667rem auto;
    }

        .face-main3 .tabbox-top ul li {
            padding: 0.16rem 0.533rem;
            border-radius: 0.1067rem;
            border: 1px solid rgba(231,231,231,1);
            font-size: 0.75rem;
            font-weight: 400;
            color: rgba(111,111,130,0.49);
            overflow: hidden;
        }

        .face-main3 .tabbox-top ul .activli {
            background: rgba(16,146,237,1);
            color: #fff;
        }

.tabbox-bot .bot-left {
    float: left;
    width: 30%;
    margin-left: 10%;
}

.tabbox-bot .bot-right {
    float: right;
    width: 60%;
    padding-left: 10%;
    padding-top: 1rem;
    box-sizing: border-box;
}

.tabbox-bot .bot-left img {
    width: 100%;
    height: 13.17rem;
}
.tabbox-bot .bot-left3 img {
    width: 120%;
    height: 11.17rem;
}
.tabbox-bot .bot-right .botli {
    margin-bottom: 1.0667rem;
    overflow: hidden;
    height: 1.28rem;
    line-height: 1.28rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(79,79,99,1);
}

    .tabbox-bot .bot-right .botli img {
        width: 1.28rem;
        height: 1.28rem;
        float: left;
        margin-right: 0.533rem;
    }

.face-main4 .title span:nth-child(2) {
    color: #fff;
}

.face-main4 .subtitle {
    color: rgba(255,255,255,0.69);
}

.face-main4 {
    overflow: hidden;
    text-align: center;
    width: 100%;
    height: 18.45rem;
    background: url("../images/face/m4bg1.png") no-repeat left top;
    background-size: 100% 100%;
}

    .face-main4 .shar {
        width: 100%;
        height: 18.45rem;
        background-color: rgba(0,0,0,.6);
        overflow: hidden;
    }

    .face-main4 .swiper-container {
        width: 100%;
        height: 11.75rem;
        margin-top: 2.133rem;
    }

        .face-main4 .swiper-container .swiper-slide {
            width: 100%;
            height: 11.75rem;
        }

            .face-main4 .swiper-container .swiper-slide h2 {
                font-weight: 600;
                color: rgba(255,255,255,1);
                font-size: 1rem;
                margin-bottom: 0.906rem;
            }

            .face-main4 .swiper-container .swiper-slide .jieshao {
                width: 64.5%;
                /*height: 3.307rem;*/
                margin: 0 auto;
                color: rgba(255,255,255,0.8);
                font-size: 0.75rem;
                line-height: 1.28rem;
                text-align: left;
            }

.face-main5 {
    overflow: hidden;
    text-align: center;
    height: 14.24rem;
}

    .face-main5 .subtitle {
        color: rgba(111,111,130,0.39);
    }

    .face-main5 .m5ul {
        display: flex;
        padding: 0 6%;
    }

    .face-main5 .m5li:nth-child(2n+1) {
        flex: 2;
        font-size: 0.7rem;
        font-weight: 400;
        color: rgba(79,79,99,1);
        line-height: 0.9rem;
    }

        .face-main5 .m5li:nth-child(2n+1) > img {
            width: 2.93rem;
            height: 5.33rem;
            margin-bottom: 0.426rem;
        }

    .face-main5 .m5li:nth-child(2n) {
        flex: 1;
    }

        .face-main5 .m5li:nth-child(2n) > img {
            width: 0.85rem;
            height: 0.85rem;
            margin-top: 2.24rem;
        }

.face-main6 {
    overflow: hidden;
    text-align: center;
    width: 100%;
    height: 14.72rem;
    background: #1092ED;
}

    .face-main6 .title span:nth-child(2) {
        color: #fff;
    }

    .face-main6 .subtitle {
        color: rgba(255,255,255,0.39);
    }
.fc-m6left {
    width: 34%;
    float: left;
    height: 9.33rem;
    padding-left:6%;
}
    .fc-m6left img {
        width: 100%;
        height: 7.47rem;
    }
.face-main6 .swiper-container {
    width: 57%;
    height: 9.33rem;
    float: right;
    padding-left: 3%;
}

        .face-main6 .swiper-container .swiper-slide {
            width: 100%;
            height: 9.33rem;
            text-align:left;
        }

.face-main6 .swiper-slide img {
    width: 0.853rem;
    height: 0.853rem;
    float: left;
    margin: 0.001rem 0.427rem 0 0;
}

.face-main6 .swiper-slide h2 {
    font-size: 0.853rem;
    font-weight: 500;
    color: rgba(255,255,255,1);
    height: 0.855rem;
    line-height: 0.855rem;
    margin-top: 0.5rem;
    margin-bottom: 0.587rem;
}

.face-main6 .swiper-slide div {
    font-size: 0.75rem;
    font-weight: 400;
    color: #fff;
    line-height: 1.28rem;
    padding-right: 1rem;
}

.face-main7 {
    overflow: hidden;
    text-align: center;
}

    .face-main7 .fwzcul {
        width: 89%;
        margin: 0 auto 1.067rem;
        display: flex;
        justify-content: space-between;
    }

    .face-main7 .fwzcli {
        width: 32%;
    }

        .face-main7 .fwzcli img {
            width: 3.786rem;
            height: 3.786rem;
            margin-bottom: 0.533rem;
        }

        .face-main7 .fwzcli > h2 {
            font-size: 0.75rem;
            font-weight: 500;
            color: rgba(79,79,99,1);
            margin: 0.53rem 0 0.2133rem;
        }

        .face-main7 .fwzcli > div {
            font-size: 0.75rem;
            font-weight: 400;
            color: #9D9DA7;
            line-height: 1.4rem;
            text-align: center;
        }

    .face-main7 .jiamen {
        display: block;
        width: 68.27%;
        height: 2.56rem;
        background: rgba(16,146,237,1);
        border-radius: 0.16rem;
        text-align: center;
        line-height: 2.56rem;
        margin: 1.6rem auto;
        font-size: 0.96rem;
        font-weight: 600;
        color: rgba(255,255,255,1);
    }

.swiper-pagination-customs {
    width: 0.32rem;
    height: 0.32rem;
    background-color: rgba(255,255,255,0.4);
    display: inline-block;
    margin: 0 5px;
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    
}
.swiper-container3 .swiper-pagination {
    text-align: left;
    margin-left: 3%;
}
.swiper-pagination-customs-active {
    background-color: #fff;
}
