body {
    background: url(/img/bg.png) top center no-repeat #f2f2f2;
}

.wrapper {
    padding: 30px 0;
}

.container {
    padding: 15px;
    background-color: #f6f6f6;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.25);
}

.flex-section {
    display: flex;
    justify-content: space-between;
}

.section1 .ad-swiper {
    width: 600px;
    height: 320px;
    margin: 0;
}

    .section1 .ad-swiper a {
        width: 600px;
        height: 320px;
    }

    .section1 .ad-swiper img {
        width: 600px;
        height: 320px;
    }

    .section1 .ad-swiper .swiper-pagination {
        text-align: right;
        padding: 0 5px;
    }

        .section1 .ad-swiper .swiper-pagination .swiper-pagination-bullet {
            width: 18px;
            height: 18px;
            line-height: 18px;
            text-align: center;
            background-color: #fff;
            cursor: pointer;
            font-size: 12px;
            border-radius: 0;
            opacity: 1;
        }

            .section1 .ad-swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
                background-color: #2083b7;
                color: #fff;
            }

.section1 .notice {
    width: 563px;
    height: 318px;
    overflow: hidden;
    border: 1px solid #539ec9;
    background-color: #fff;
    padding: 0 20px;
}

    .section1 .notice .tabs {
        display: flex;
        align-items: center;
        height: 40px;
        border-bottom: 1px solid #f1f1f1;
    }

        .section1 .notice .tabs .tab {
            display: flex;
            align-items: center;
            height: 40px;
            width: 120px;
        }

            .section1 .notice .tabs .tab > a {
                font-size: 14px;
                color: #1e1e1e;
                display: flex;
                align-items: center;
            }

                .section1 .notice .tabs .tab > a::before {
                    content: "";
                    width: 17px;
                    height: 14px;
                    background-position: center center;
                    background-repeat: no-repeat;
                    background-size: 17px 14px;
                    margin-right: 10px;
                }

            .section1 .notice .tabs .tab.active > a {
                color: #3a95c9;
                border-bottom: 2px solid #539ec9;
                font-weight: bold;
                font-size: 15px;
                transition: all .16s linear;
            }

            .section1 .notice .tabs .tab:nth-child(1) > a::before {
                background-image: url(/img/icon-tab1.png);
            }

            .section1 .notice .tabs .tab:nth-child(1).active > a::before {
                background-image: url(/img/icon-tab1-active.png);
            }

            .section1 .notice .tabs .tab:nth-child(2) > a::before {
                background-image: url(/img/icon-tab2.png);
            }

            .section1 .notice .tabs .tab:nth-child(2).active > a::before {
                background-image: url(/img/icon-tab2-active.png);
            }

    .section1 .notice .tabs-swiper {
        height: 276px;
        width: 521px;
    }

        .section1 .notice .tabs-swiper .list {
            padding: 10px 0;
        }

            .section1 .notice .tabs-swiper .list .item {
                display: flex;
                justify-content: space-between;
                align-items: center;
                height: 32px;
            }

                .section1 .notice .tabs-swiper .list .item .link {
                    display: flex;
                    align-items: center;
                    flex: 1;
                    overflow: hidden;
                    font-size: 13px;
                }

                    .section1 .notice .tabs-swiper .list .item .link.new::before {
                        content: "";
                        background-image: url(/img/icon-new.png);
                        width: 20px;
                        height: 20px;
                        background-repeat: no-repeat;
                        background-size: 20px 20px;
                        background-position: center -6px;
                    }

                    .section1 .notice .tabs-swiper .list .item .link > div {
                        flex: 1;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }

                .section1 .notice .tabs-swiper .list .item:hover .link > div {
                    color: #3a95c9;
                }

                .section1 .notice .tabs-swiper .list .item .time {
                    font-size: 12px;
                    color: #999;
                }

.section2 {
    padding: 15px 0;
}

    .section2 .item1-box {
        padding: 15px;
        width: 370px;
        background-color: #fff;
    }

    .section2 .item2-box {
        padding: 15px;
        width: 430px;
        background-color: #fff;
    }

    .section2 .item3-box {
        padding: 15px;
        width: 340px;
        background-color: #fff;
    }

    .section2 .item-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 30px;
        margin-bottom: 15px;
        color: rgb(32, 131, 183);
        font-size: 16px;
        border-bottom: 1px solid rgb(83, 158, 201);
    }

        .section2 .item-header::before {
            content: "";
            background-image: url(/img/icon-new1.png);
            background-repeat: no-repeat;
            background-position: top center;
            width: 19px;
            height: 14px;
            margin-right: 5px;
        }

    .section2 .item2-box .item-header::before {
        background-image: url(/img/icon-new2.png);
    }

    .section2 .item-header .name {
        flex: 1;
    }

    .section2 .item-header .more {
        font-size: 12px;
        color: rgb(32, 131, 183);
    }

    .section2 .item1-box .list > li {
        height: 33px;
        border-bottom: 1px dotted #dedede;
        transition: all .2s linear;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .section2 .item1-box .list > li:hover {
            background-color: #efefef;
        }

        .section2 .item1-box .list > li > a {
            flex: 1;
            height: 32px;
            line-height: 32px;
            display: block;
            font-size: 13px;
            color: #1e1e1e;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .section2 .item1-box .list > li:hover > a {
            color: rgb(0, 114, 183);
        }

        .section2 .item1-box .list > li > .time {
            color: #999;
            font-size: 10px;
        }

    .section2 .item2-box .list > li {
        height: 33px;
        border-bottom: 1px dotted #dedede;
        transition: all .2s linear;
        display: flex;
        justify-content: space-between;
        align-items: center;
        overflow: hidden;
    }

        .section2 .item2-box .list > li:hover {
            background-color: #efefef;
        }

        .section2 .item2-box .list > li > a {
            flex: 1;
            height: 32px;
            line-height: 32px;
            display: block;
            font-size: 13px;
            color: #1e1e1e;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .section2 .item2-box .list > li:hover > a {
            color: rgb(0, 114, 183);
        }

        .section2 .item2-box .list > li > .time {
            color: #999;
            font-size: 10px;
        }

        .section2 .item2-box .list > li:first-child {
            flex-direction: column;
            height: 100px;
        }

            .section2 .item2-box .list > li:first-child:hover {
                background-color: #fff;
            }

            .section2 .item2-box .list > li:first-child > a {
                font-size: 1.17em;
                font-weight: bold;
                align-self: stretch;
            }

            .section2 .item2-box .list > li:first-child > .desc {
                font-size: 12px;
                margin: 6px 0;
                line-height: 18px;
                height: 54px;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
            }

    .section2 .item3-box .map {
        width: 310px;
        height: 265px;
        position: relative;
        background: url(/img/map.jpg) no-repeat center;
        background-size: contain;
        position: relative;
    }


        .section2 .item3-box .map .area {
            position: absolute;
            opacity: 1;
            filter: alpha(opacity=100);
        }

            .section2 .item3-box .map .area a {
                position: absolute;
                opacity: 0;
                filter: alpha(opacity=0);
                background-color: #ccc;
                z-index: 99;
            }

            .section2 .item3-box .map .area.on {
                background-repeat: no-repeat;
                -webkit-background-size: contain;
                background-size: contain;
            }

        .section2 .item3-box .map .jx {
            width: 66px;
            height: 66px;
            top: 4px;
            left: 139px;
        }

            .section2 .item3-box .map .jx.on {
                background-image: url(/img/jx1.png);
            }

        .section2 .item3-box .map .huz {
            width: 66px;
            height: 66px;
            top: -4px;
            left: 91px;
        }

            .section2 .item3-box .map .huz.on {
                background-image: url(/img/huz1.png);
            }

        .section2 .item3-box .map .hz.on {
            background-image: url(/img/hz1.png);
        }

        .section2 .item3-box .map .hz {
            width: 144.5px;
            height: 92px;
            top: 38px;
            left: 44px;
        }

        .section2 .item3-box .map .sx {
            width: 144.5px;
            height: 92px;
            top: 47px;
            left: 98px;
        }

            .section2 .item3-box .map .sx.on {
                background-image: url(/img/sx1.png);
            }

        .section2 .item3-box .map .nb {
            width: 144.5px;
            height: 97.5px;
            top: 45px;
            left: 145px;
        }

            .section2 .item3-box .map .nb.on {
                background-image: url(/img/nb1.png);
            }

        .section2 .item3-box .map .zs {
            width: 144.5px;
            height: 97.5px;
            top: 14px;
            right: -21px;
        }

            .section2 .item3-box .map .zs.on {
                background-image: url(/img/zs1.png);
            }

        .section2 .item3-box .map .qz {
            width: 144.5px;
            height: 92px;
            top: 104px;
            left: 0px;
        }

            .section2 .item3-box .map .qz.on {
                background-image: url(/img/qz1.png);
            }

        .section2 .item3-box .map .jh {
            width: 144.5px;
            height: 92px;
            top: 89px;
            left: 69px;
        }

            .section2 .item3-box .map .jh.on {
                background-image: url(/img/jh1.png);
            }

        .section2 .item3-box .map .tz {
            width: 144.5px;
            height: 97.5px;
            top: 112px;
            left: 123px;
        }

            .section2 .item3-box .map .tz.on {
                background-image: url(/img/tz1.png);
            }

        .section2 .item3-box .map .ls {
            width: 144.5px;
            height: 97.5px;
            top: 145px;
            left: 47px;
        }

            .section2 .item3-box .map .ls.on {
                background-image: url(/img/ls1.png);
            }

        .section2 .item3-box .map .wz {
            width: 144.5px;
            height: 97.5px;
            top: 164px;
            left: 92px;
        }

            .section2 .item3-box .map .wz.on {
                background-image: url(/img/wz1.png);
            }

        .section2 .item3-box .map .huz a {
            width: 33px;
            height: 21px;
            top: 24px;
            left: 18px;
        }

        .section2 .item3-box .map .jx a {
            width: 33px;
            height: 21px;
            top: 26px;
            left: 13px;
        }

        .section2 .item3-box .map .hz a {
            width: 45px;
            height: 27px;
            top: 30px;
            left: 35px;
        }

        .section2 .item3-box .map .sx a {
            width: 39px;
            height: 23px;
            top: 38px;
            left: 44px;
        }

        .section2 .item3-box .map .nb a {
            width: 27px;
            height: 41px;
            top: 33px;
            left: 50px;
        }

        .section2 .item3-box .map .zs a {
            width: 45px;
            height: 38px;
            top: 28px;
            left: 37px;
        }

        .section2 .item3-box .map .qz a {
            width: 39px;
            height: 28px;
            top: 26px;
            left: 47px;
        }

        .section2 .item3-box .map .jh a {
            width: 50px;
            height: 23px;
            top: 32px;
            left: 34px;
        }

        .section2 .item3-box .map .tz a {
            width: 39px;
            height: 23px;
            top: 30px;
            left: 50px;
        }

        .section2 .item3-box .map .ls a {
            width: 55px;
            height: 34px;
            top: 28px;
            left: 33px;
        }

        .section2 .item3-box .map .wz a {
            width: 39px;
            height: 23px;
            top: 45px;
            left: 35px;
        }

.section3 .swiper .swiper-slide {
    display: block;
}

    .section3 .swiper .swiper-slide img {
        width: 100%;
        height: 100px;
        object-fit: cover;
    }

.section4 {
    padding: 20px 0;
}

    .section4 .item-box {
        padding: 15px;
        width: 575px;
        background-color: #fff;
    }

    .section4 .item-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 30px;
        margin-bottom: 15px;
        color: rgb(32, 131, 183);
        font-size: 16px;
        border-bottom: 1px solid rgb(83, 158, 201);
    }

        .section4 .item-header::before {
            content: "";
            background-repeat: no-repeat;
            background-position: top center;
            width: 19px;
            height: 14px;
            margin-right: 5px;
        }

    .section4 .item1-box .item-header::before {
        background-image: url(/img/icon-new4.png);
    }

    .section4 .item2-box .item-header::before {
        background-image: url(/img/icon-new5.png);
    }

    .section4 .item-header .name {
        flex: 1;
    }

    .section4 .item-header .more {
        font-size: 12px;
        color: rgb(32, 131, 183);
    }

    .section4 .list {
        height: 240px;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
    }

        .section4 .list li:first-child {
            width: 240px;
            height: 240px;
        }

            .section4 .list li:first-child .img {
                width: 240px;
                height: 140px;
                overflow: hidden;
            }

                .section4 .list li:first-child .img img {
                    width: 240px;
                    height: 140px;
                    object-fit: cover;
                    transition: all .5s;
                }

                .section4 .list li:first-child .img:hover img {
                    transform: scale(1.1);
                }

            .section4 .list li:first-child .name {
                font-size: 14px;
                font-weight: bold;
                padding: 10px 0;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .section4 .list li:first-child .desc {
                line-height: 20px;
                height: 40px;
                overflow: hidden;
                font-size: 13px;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
            }

            .section4 .list li:first-child:hover .name,
            .section4 .list li:first-child:hover .desc {
                color: rgb(0, 114, 183);
            }

        .section4 .list li:nth-child(n+2) {
            width: 292px;
            height: 30px;
            border: 1px solid #2083b7;
            margin-bottom: 8px;
            padding: 0 10px;
            cursor: pointer;
            display: flex;
            align-items: center;
            overflow: hidden;
        }

            .section4 .list li:nth-child(n+2):hover {
                background-color: #efefef;
            }

            .section4 .list li:nth-child(n+2) > a {
                font-size: 13px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                flex: 1;
            }

            .section4 .list li:nth-child(n+2):hover > a {
                color: rgb(0, 114, 183);
            }

.section5 {
    padding: 20px 15px;
    background-color: #fff;
}

    .section5 .list {
        display: flex;
        justify-content: space-between;
    }

        .section5 .list .item {
            width: 370px;
            height: 220px;
        }

            .section5 .list .item a {
                display: block;
            }

                .section5 .list .item a .img {
                    position: relative;
                    width: 370px;
                    height: 220px;
                    overflow: hidden;
                }

                    .section5 .list .item a .img img {
                        width: 370px;
                        height: 220px;
                        object-fit: cover;
                        transition: all .5s;
                    }

                .section5 .list .item a:hover .img img {
                    transform: scale(1.1);
                }

                .section5 .list .item a .img .alt {
                    position: absolute;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    z-index: 1;
                    height: 35px;
                    line-height: 35px;
                    font-size: 14px;
                    color: #fff;
                    text-align: center;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    background-color: rgba(0,0,0,.6);
                    padding: 0 1em;
                }

.section6 {
    margin-top: 20px;
    padding: 15px;
    background-color: #fff;
}

    .section6 .tabs .tabs-header {
        border-bottom: 1px solid #2083b7;
        display: flex;
        align-items: center;
    }

        .section6 .tabs .tabs-header::before {
            content: "";
            background: url(/img/icon-friend.png) top center no-repeat;
            width: 22px;
            height: 22px;
        }

        .section6 .tabs .tabs-header .tab {
            padding: 0 30px;
            cursor: pointer;
            font-size: 16px;
            height: 30px;
            line-height: 30px;
            position: relative;
        }

            .section6 .tabs .tabs-header .tab.active {
                color: #58a2c9;
            }

                .section6 .tabs .tabs-header .tab.active::after {
                    background-color: #58a2c9;
                    color: #58a2c9;
                    content: "";
                    position: absolute;
                    left: 0;
                    right: 0;
                    bottom: -1px;
                    height: 2px;
                }

    .section6 .tabs .tabs-content {
        display: flex;
        overflow: hidden;
        min-height: 145px;
    }

        .section6 .tabs .tabs-content .pane {
            display: none;
            flex: 1;
        }

            .section6 .tabs .tabs-content .pane.active {
                display: block;
            }

        .section6 .tabs .tabs-content .friendly-link {
            display: flex;
            flex-wrap: wrap;
            padding: 15px;
        }

            .section6 .tabs .tabs-content .friendly-link li {
                width: 20%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                height: 28px;
                line-height: 28px;
            }

                .section6 .tabs .tabs-content .friendly-link li > a {
                    font-size: 14px;
                }