.page {


    .banner {
        width: 100%;

        .img {
            width: 100%;
        }
    }

    .sm-container {
        .sm {
            width: 100%;
            height: 16rem;

            .container {
                height: 100%;
                margin: 0 2rem;
                display: flex;
                align-items: center;

                .item {
                    flex: 1;
                    height: 100%;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center;

                    .img {
                        width: 5rem;
                        height: 5rem;
                        margin-bottom: .5rem;
                    }

                    .title {
                        font-size: 1rem;
                        color: black;
                        font-weight: bold;
                        margin-bottom: .4rem;
                    }

                    .tip {
                        font-size: .7rem;
                        color: #303133;
                        line-height: 1.2rem;
                    }

                    .transparent {
                        opacity: 0;
                    }
                }
            }
        }
    }

    .szdj-container {
        .szdj-box1 {
            position: relative;
            width: 100%;
            height: 800px;
            overflow: hidden;

            .szdj1,
            .szdj2,
            .szdj3 {
                background-size: cover;
                position: absolute;
                left: 0;
                width: 100%;
                height: 100%;
                z-index: 1;

                .container {
                    /*width: calc(100% - 500px);*/
                    width: 40vw;
                    position: absolute;
                    left: 60px;
                    top: 50%;
                    transform: translateY(-50%);
                    z-index: 4;

                    .title {
                        font-size: 40px;
                        color: white;
                        font-weight: bold;
                        letter-spacing: 2px;
                        margin-bottom: 30px;
                    }

                    .tip {
                        font-size: 18px;
                        color: rgba(255, 255, 255, .6);
                        margin-bottom: 36px;
                        line-height: 36px;
                    }

                    .icons {
                        display: flex;
                        align-items: center;

                        .icons-box {
                            display: flex;
                            flex-direction: column;
                            align-items: center;
                            justify-content: center;
                            margin-right: 60px;

                            .img {
                                width: 46px;
                                height: 46px;
                                margin-bottom: 8px;
                            }

                            .txt {
                                font-size: 16px;
                                color: #fff
                            }
                        }
                    }
                }
            }

            .szdj1 {
                top: 0px;
                background-image: url("../images/bg-1.png");
            }

            .szdj2 {
                top: 800px;
                background-image: url("../images/bg-2.png");
            }

            .szdj3 {
                top: 1600px;
                background-image: url("../images/bg-3.png");
            }

            .right-btn {
                width: 240px;
                position: absolute;
                right: 60px;
                top: 50%;
                z-index: 2;
                transform: translateY(-50%);

                .item2 {
                    margin: 60px 0;
                }

                .item {
                    cursor: pointer;
                    color: rgba(255, 255, 255, .6);
                    display: flex;
                    align-items: center;
                    justify-content: space-between;

                    .line {
                        width: 60px;
                        height: 2px;
                        background-color: white;
                        opacity: 0;
                    }

                    .title {
                        font-size: 24px;
                    }
                }

                .btn-active {
                    color: white;
                    font-weight: bold;

                    .line {
                        opacity: 1;
                    }
                }
            }
        }

        .szdj-box2 {
            position: relative;
            width: 100%;
            height: 800px;

            /*overflow: hidden;*/
            .szdj1,
            .szdj2,
            .szdj3 {
                background-size: cover;
                position: absolute;
                top: 0;
                width: 100%;
                height: 100%;
                z-index: 1;

                .container {
                    width: calc(100% - 120px);
                    position: absolute;
                    left: 60px;
                    top: 50%;
                    transform: translateY(-50%);
                    z-index: 4;

                    .title {
                        font-size: 32px;
                        color: white;
                        font-weight: bold;
                        letter-spacing: 2px;
                        margin-bottom: 24px;
                    }

                    .tip {
                        font-size: 16px;
                        color: rgba(255, 255, 255, .6);
                        margin-bottom: 36px;
                        line-height: 30px;
                    }

                    .icons {
                        display: flex;
                        align-items: center;

                        .icons-box {
                            display: flex;
                            flex-direction: column;
                            align-items: center;
                            justify-content: center;
                            margin-right: 50px;

                            .img {
                                width: 46px;
                                height: 46px;
                                margin-bottom: 8px;
                            }

                            span {
                                font-size: 16px;
                                color: white;
                            }
                        }
                    }
                }
            }

            .szdj1 {
                background-image: url("../images/bg-1.png");
                z-index: 3;
            }

            .szdj2 {
                background-image: url("../images/bg-2.png");
                z-index: 2;
            }

            .szdj3 {
                background-image: url("../images/bg-3.png");
                z-index: 1;
            }

            .top-btn {
                position: absolute;
                left: 60px;
                top: 80px;
                z-index: 4;
                display: flex;
                align-items: center;

                .item2 {
                    margin: 0 80px;
                }

                .item {
                    cursor: pointer;
                    color: rgba(255, 255, 255, .6);
                    display: flex;
                    flex-direction: column-reverse;
                    align-items: center;
                    justify-content: space-between;

                    .line {
                        width: 100%;
                        height: 2px;
                        background-color: white;
                        opacity: 0;
                        margin-top: 10px;
                    }

                    .title {
                        font-size: 20px;
                    }
                }

                .btn-active {
                    color: white;
                    font-weight: bold;

                    .line {
                        opacity: 1;
                    }
                }
            }
        }

        .szdj-box3 {
            width: 100%;
            overflow: hidden;

            .szdj1,
            .szdj2,
            .szdj3 {
                background-size: cover;
                width: 100%;
                height: 350px;
                display: flex;
                align-items: center;
                justify-content: center;

                .container {
                    width: calc(100% - 40px);

                    .title {
                        font-size: 22px;
                        color: white;
                        font-weight: bold;
                        letter-spacing: 2px;
                        margin-bottom: 16px;
                    }

                    .tip {
                        font-size: 12px;
                        color: rgba(255, 255, 255, .6);
                        margin-bottom: 36px;
                        line-height: 24px;
                    }

                    .icons {
                        display: flex;
                        align-items: center;

                        .icons-box {
                            display: flex;
                            flex-direction: column;
                            align-items: center;
                            justify-content: center;
                            margin-right: 30px;

                            .img {
                                width: 32px;
                                height: 32px;
                                margin-bottom: 8px;
                            }

                            span {
                                font-size: 12px;
                                color: white;
                            }
                        }
                    }
                }
            }

            .szdj1 {
                background-image: url("../images/bg-1.png");
            }

            .szdj2 {
                background-image: url("../images/bg-2.png");
            }

            .szdj3 {
                background-image: url("../images/bg-3.png");
            }
        }
    }

    .ywfg-container {
        width: 100%;

        .ywfb1 {
            width: 100%;
            height: 100%;
            padding-top: 2rem;

            .module-title {
                font-size: 1rem;
                color: black;
                font-weight: bold;
                text-align: center;
                margin-bottom: 1rem;
            }

            .tips {
                display: flex;
                align-items: center;
                justify-content: space-around;

                .item {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center;

                    .num {
                        font-size: .8rem;
                        color: #136BED;
                        margin-bottom: 10px;
                        font-weight: bold;

                        span {
                            font-size: .8rem;
                            color: #136BED;
                            margin-bottom: 10px;
                            font-weight: bold;
                        }
                    }

                    .explain {
                        font-size: .5rem;
                        color: #666666;
                    }
                }
            }

            .map-container {
                width: 80%;
                display: flex;
                justify-content: center;
                margin: 0 auto;
                margin-top: 40px;
                margin-bottom: 5vw;
                position: relative;
                overflow: hidden;

                .mapImg {
                    width: 100%;
                }

                .address-item {
                    position: absolute;
                    left: 0;
                    top: 0;
                    z-index: 10;

                    .address-drop {
                        width: 100%;
                        position: relative;

                        .drop {
                            width: .6vw;
                            height: .4vw;
                            background-color: #A2B9E7;
                            filter: blur(.2vw);
                            position: absolute;
                            left: 50%;
                            transform: translateX(-50%);
                            top: 1.3vw;
                            z-index: 3;
                        }

                        .drop1 {
                            width: 1.6vw;
                            height: 1.1vw;
                            background-color: #DBE1ED;
                            border: 2px solid #98B6ED;
                            border-radius: 50%;
                            position: absolute;
                            left: 50%;
                            top: 1vw;
                            transform: translateX(-50%);
                            z-index: 2;
                        }

                        .line {
                            width: .2vw;
                            height: 1.4vw;
                            background: linear-gradient(180deg, #4672c4 9%, #b3c3e1 100%);
                            position: absolute;
                            left: 50%;
                            transform: translateX(-50%);
                            top: .2vw;
                            z-index: 4;
                        }
                    }

                    .address-title {
                        font-size: .8vw;
                        background-color: #136BED;
                        padding: 0.2vw 1.4vw;
                        border-radius: .2vw;
                        color: white;
                    }
                }

                .xi-zang {
                    left: 18.5%;
                    top: 43%;
                }

                .si-chuan {
                    left: 43.2%;
                    top: 48%;
                }

                .yun-nan {
                    left: 42%;
                    top: 64%;
                }

                .gui-zhou {
                    left: 52%;
                    top: 59%;
                }

                .shan-xi {
                    left: 63%;
                    top: 32%;
                }

                .hu-nan {
                    left: 61%;
                    top: 56%;
                }

                .guang-zhou {
                    left: 65%;
                    top: 68%;
                }

                .bei-jing {
                    left: 69%;
                    top: 23%;
                }

                .xiong-an {
                    left: 70%;
                    top: 30%;
                }

                .jiang-xi {
                    left: 69%;
                    top: 58%;
                }

                .jiang-su {
                    left: 76%;
                    top: 42%;
                }
            }

        }
    }

    .zykh-container {
        width: 100%;

        .zyke1 {
            width: 100%;
            position: relative;

            .img {
                width: 100%;
            }

            .module-title {
                position: absolute;
                left: 50%;
                transform: translateX(-50%);
                top: 4vw;
                font-size: 1rem;
                font-weight: bold;
            }

            .list-container {
                position: absolute;
                left: 0;
                bottom: 0;
                /*background-color: rgba(0,0,0,1);*/
                width: 100%;
                height: calc(100% - 11vw);

                .company-box {
                    position: absolute;
                    left: 50%;
                    top: 50%;
                    transform: translate(-50%, -50%);
                    width: 40vw;
                    height: 40vw;
                    margin: auto;
                    background-color: rgba(226, 228, 233, 0.2);
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;

                    .box1 {
                        width: 70%;
                        height: 70%;
                        background-color: rgba(216, 222, 233, 0.2);
                        border-radius: 50%;
                        display: flex;
                        align-items: center;
                        justify-content: center;

                        .box2 {
                            width: 55%;
                            height: 55%;
                            border-radius: 50%;

                            .box3 {
                                width: 100%;
                                height: 100%;
                                border-radius: 50%;
                            }
                        }
                    }
                }

                .size {
                    width: 10vw;
                    border-radius: 1vw;
                }

                .position {
                    position: absolute;
                    left: 50%;
                    top: 50%;
                    transform: translate(-50%, -50%);
                }

                .shadow {
                    box-shadow: 0 .5vw .8vw rgba(0, 53, 132, 0.2);
                }
            }
        }
    }

    .sthb-container {
        .sthb1 {
            height: 48vw;

            .module-title {
                font-size: 1rem;
                font-weight: bold;
                text-align: center;
                padding-top: 4vw;
            }

            .container {
                width: 80vw;
                height: 32vw;
                margin: auto;
                margin-top: 3vw;
                display: flex;
                align-items: center;
                overflow: hidden;

                .item {
                    height: 100%;
                    flex: 1;
                    position: relative;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    background-size: cover;
                    background-repeat: no-repeat;
                    border: 1px dashed white;

                    .title {
                        position: absolute;
                        left: 2vw;
                        top: 2vw;
                        font-size: .7rem;
                        color: white;
                        font-weight: bold;
                        letter-spacing: 4px;
                        width: 100%;
                    }

                    .title-center {
                        position: absolute;
                        left: 50%;
                        top: 50%;
                        transform: translate(-50%, -50%);
                        font-size: .7rem;
                        color: white;
                        width: 100%;
                        text-align: center;
                        font-weight: 400 !important;
                        letter-spacing: 4px;
                    }

                    .yfw-container {
                        position: absolute;
                        left: 40px;
                        top: 450px;
                        width: 27vw;
                        transform: translateY(-50%);
                        display: flex;
                        flex-wrap: wrap;
                        opacity: 0;

                        .sthb-item {
                            width: 7.5vw;
                            height: 2.7vw;
                            margin-bottom: 2vw;
                            margin-right: 2vw;

                            .img {
                                width: 100%;
                                height: 100%;
                                vertical-align: middle;
                            }
                        }

                        :nth-child(3n) {
                            margin-right: 0;
                        }

                        :nth-child(7),
                        :nth-child(8),
                        :nth-child(9) {
                            margin-bottom: 0;
                        }
                    }

                    .sthbMasker {
                        position: absolute;
                        left: 0;
                        top: 0;
                        z-index: 10;
                        /*background-color: rgba(0,0,0,.2);*/
                        width: 100%;
                        height: 100%;
                    }
                }

                .item1 {
                    flex: 3;
                    background-image: url("../images/sthb/bgm1.png");

                    .yfw-container {
                        top: 50%;
                        opacity: 1;
                    }
                }

                .item2 {
                    background-image: url("../images/sthb/bg2.png");
                }

                .item3 {
                    background-image: url("../images/sthb/bg3.png");
                }

                .item4 {
                    background-image: url("../images/sthb/bg4.png");
                }

                .item5 {
                    background-image: url("../images/sthb/bg5.png");
                }
            }
        }

        .sthb2 {
            padding: 0 4vw;
            padding-top: 32px;

            .module-title {
                font-size: 1.2rem;
                font-weight: bold;
                text-align: center;
                margin-bottom: 4vw;
            }

            .item {
                height: 32vw;
                margin-bottom: 4vw;
                padding-top: 4vw;
                padding-left: 4vw;
                background-size: cover;
                background-repeat: no-repeat;

                .title {
                    font-size: 1.5rem;
                    font-weight: bold;
                    margin-bottom: 4vw;
                    color: white;
                }

                .list {
                    display: flex;
                    align-items: center;
                    flex-wrap: wrap;

                    .sthb-item {
                        width: 13vw;
                        height: 4.8vw;
                        margin-right: 3vw;
                        margin-bottom: 3vw;

                        .img {
                            width: 100%;
                            height: 100%;
                            vertical-align: middle;
                        }
                    }
                }
            }

            .item1 {
                background-image: url("../images/sthb/bgm1.png");
            }

            .item2 {
                background-image: url("../images/sthb/bgm2.png");
            }

            .item3 {
                background-image: url("../images/sthb/bgm3.png");
            }

            .item4 {
                background-image: url("../images/sthb/bgm4.png");
            }

            .item5 {
                background-image: url("../images/sthb/bgm5.png");
            }
        }
    }

    .xwdt-container {
        .xwdt1 {
            height: 44vw;

            .module-title {
                font-size: 1rem;
                font-weight: bold;
                text-align: center;
            }

            .container {
                width: 80vw;
                margin: auto;
                margin-top: 3vw;
                display: flex;
                align-items: flex-start;

                .item {
                    flex: 1;
                    height: 100%;

                    .img-box {
                        width: 100%;
                        height: 15vw;
                        margin-bottom: 2vw;

                        .img {
                            width: 100%;
                            height: 100%;
                            vertical-align: middle;
                        }
                    }

                    .item-title {
                        font-size: 1vw;
                        color: black;
                        font-weight: bold;
                        margin-bottom: 30px;
                        width: 22vw;
                        overflow: hidden;
                        /* 确保超出的内容会被隐藏 */
                        white-space: nowrap;
                        /* 确保文本在一行内显示，不换行 */
                        text-overflow: ellipsis;

                        /* 使用省略号表示被截断的文本 */
                        a {
                            font-size: 1vw;
                            color: black;
                            font-weight: bold;
                        }
                    }
                }

                .item-time {
                    font-size: 0.8vw;
                    color: #999;
                }
            }

            .item2 {
                margin: 0 4vw;
            }

            .item3 {
                height: 24vw !important;
                overflow: auto;

                .list-item {
                    position: relative;
                    padding: 0 1.2vw;
                    padding-bottom: 2vw;
                    border-bottom: 1px solid #DEDEDE;
                    margin-bottom: 2vw;

                    .list-title {
                        font-size: 1.1vw;
                        color: #313233;
                        margin-bottom: 1vw;
                        font-weight: bold;
                        width: 20vw;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        display: -webkit-box;
                        -webkit-line-clamp: 2;
                        -webkit-box-orient: vertical;

                        a {
                            font-size: 1.1vw;
                            color: #313233;
                            font-weight: bold;
                        }
                    }

                    .list-title::before {
                        content: '';
                        position: absolute;
                        left: 0;
                        top: 10px;
                        width: 6px;
                        height: 6px;
                        background-color: #DEDEDE;
                        border-radius: 50%;
                    }

                    .list-time {
                        font-size: .9vw;
                        color: #999999;
                    }
                }

                .list-item:last-child {
                    border: none;
                }
            }
        }

        .more {
            border: 1px solid #AEB3C8;
            font-size: 1vw;
            color: black;
            margin: auto;
            width: 14vw;
            height: 3vw;
            line-height: 3vw;
            text-align: center;
            margin-top: 4vw;
            cursor: pointer;
        }
    }

    .xwdt2 {
        padding: 0 4vw;
        padding-top: 3vw;
        margin-bottom: 6vw;

        .module-title {
            font-size: 1.2rem;
            font-weight: bold;
            text-align: center;
            margin-bottom: 4vw;
        }

        .item {
            background-color: #f8f8f8;
            height: 55vw;
            margin-bottom: 24px;

            .img-box {
                height: 42vw;

                .img {
                    width: 100%;
                    height: 100%;
                    vertical-align: middle;
                }
            }

            .text-container {
                padding: 3vw;

                .text-title {
                    font-size: 1rem;
                    color: #313233;
                    font-weight: bold;
                    overflow: hidden;
                    /* 确保超出的内容会被隐藏 */
                    white-space: nowrap;
                    /* 确保文本在一行内显示，不换行 */
                    text-overflow: ellipsis;
                    /* 使用省略号表示被截断的文本 */
                    width: 100%;
                    margin-bottom: 1rem;

                    a {
                        font-size: 1rem;
                        color: #313233;
                        font-weight: bold;
                    }
                }

                .text-time {
                    color: #999999;
                    font-size: .8rem;
                }
            }
        }

        .list-container {
            padding-bottom: 1vw;
            overflow: auto;
            background-color: #f8f8f8;

            .list-item {
                padding: 1rem 1rem;
                border-bottom: 1px solid #ececec;

                .list-item-title {
                    font-size: 1rem;
                    color: #313233;
                    margin-bottom: .8rem;
                    font-weight: bold;
                    overflow: hidden;
                    /* 确保超出的内容会被隐藏 */
                    white-space: nowrap;
                    /* 确保文本在一行内显示，不换行 */
                    text-overflow: ellipsis;
                    /* 使用省略号表示被截断的文本 */
                    width: 100%;

                    a {
                        font-size: 1rem;
                        color: #313233;
                        font-weight: bold;
                    }

                    .list-item-time {
                        font-size: .8rem;
                        color: #999999;
                    }
                }
            }
        }
    }


}


/* 头部 */
/* 屏幕 > 1120px */
@media (min-width: 1120px) {
    .page {
        .header-container {

            .header1,
            .header2 {
                display: none;
            }
        }
    }
}

/* 700px < 屏幕 < 1099px */
@media (min-width: 700px) and (max-width: 1119px) {
    .page {
        .header-container {

            .header,
            .header2 {
                display: none;
            }
        }
    }
}

/* 屏幕 < 699px */
@media (max-width: 699px) {
    .page {
        .header-container {

            .header,
            .header1 {
                display: none;
            }
        }
    }
}


/* 使命 愿景 价值观 */
/* 屏幕 > 1000px */
@media (min-width: 1200px) {
    .page {
        .sm-container {
            .sm {
                .container {
                    .item {
                        .tip {
                            font-size: 0.4rem;
                            line-height: 0.6rem;
                        }
                    }
                }
            }
        }
    }
}


/* 数字党建 */
/* 屏幕 > 1000px */
@media (min-width: 1000px) {
    .page {
        .szdj-container {

            .szdj-box2,
            .szdj-box3 {
                display: none;
            }
        }
    }
}

/* 屏幕 < 999px */
@media (min-width: 600px) and (max-width: 999px) {
    .page {
        .szdj-container {

            .szdj-box1,
            .szdj-box3 {
                display: none;
            }
        }
    }
}

/* 屏幕 < 599px */
@media (max-width: 599px) {
    .page {
        .szdj-container {

            .szdj-box1,
            .szdj-box2 {
                display: none;
            }
        }
    }
}


/* 业务覆盖 */
@media (max-width: 1200px) {
    .page {
        .ywfg-container {
            .ywfb1 {
                .module-title {
                    font-size: 1.2rem;
                }

                .tips {
                    .item {
                        .num {
                            font-size: 1.2rem;

                            span {
                                font-size: 1.2rem
                            }
                        }

                        .explain {
                            font-size: 1em;
                        }
                    }
                }

                .map-container {
                    width: 100%;
                    padding: 0 2rem;
                    overflow: hidden
                }
            }
        }
    }
}

/* 主要客户 */
/* 屏幕 < 599px */
@media (max-width: 1200px) {
    .page {
        .zykh-container {
            .zyke1 {
                .module-title {
                    font-size: 1.2rem;
                }
            }
        }
    }
}


/* 生态伙伴 */
@media (max-width: 1200px) {
    .page {
        .sthb-container {
            .sthb1 {
                .module-title {
                    font-size: 1.2rem;
                }
            }
        }
    }
}

@media (max-width: 799px) {
    .page {
        .sthb-container {
            .sthb1 {
                display: none;
            }
        }
    }
}

@media (min-width: 800px) {
    .page {
        .sthb-container {
            .sthb2 {
                display: none;
            }
        }
    }
}


/* 新闻动态 */
@media (max-width: 1200px) {
    .page {
        .xwdt-container {
            .xwdt1 {
                .module-title {
                    font-size: 1.2rem;
                }
            }
        }
    }
}

@media (max-width: 799px) {
    .page {
        .xwdt-container {
            .xwdt1 {
                display: none;
            }
        }
    }
}

@media (min-width: 800px) {
    .page {
        .xwdt-container {
            .xwdt2 {
                display: none;
            }
        }
    }
}


/* 底部 */
@media (min-width: 1000px) {
    .page {
        .footer-container {
            .footer2 {
                display: none;
            }
        }
    }
}

@media (max-width: 999px) {
    .page {
        .footer-container {
            .footer1 {
                display: none;
            }
        }
    }
}