﻿﻿/* 首页导航及栏目展示部分 */
        @charset "UTF-8";

        * {
            box-sizing: border-box;
            touch-action: pan-y;
        }

        .main .gray-bg {
            background: #F5F5F5;
        }

        .main .gray-color {
            color: #333 !important;
        }

        .main .yellow-color {
            color: #FFF1CE !important;
        }

         /*首页*/
        .main .top-content {
            margin: 0 auto;
            padding: 30px 0 50px;
            width: 1080px;
        }

         /*首页栏目导航*/
        .main .top-content .left-nav {
            background: #AE210F;
            color: #D4A471;
            float: left;
            font-size: 16px;
            padding: 0 13px;
            width: 90px;
        }
        /*首页栏目展示*/
        .main .top-content .focus-infoflow {
            float: left;
            height: 932px;
            margin: 0 16px;
            min-height: 200px;
            width: 648px;
        }
        /*右侧平台，矩阵*/
        .main .top-content .rigth-plats {
            background: #F5F5F5;
            float: left;
            height: 932px;
            margin: 0 0 10px;
            width: 310px;
        }

        /*全媒体运用案例*/
        .main .media-demos {
            margin: 0 auto 46px;
            padding: 80px 0 0;
            position: relative;
            width: 1080px;
        }

        .main .media-demos .media-demo-tabs {
            display: flex;
            font-size: 28px;
            justify-content: center;
            margin: 30px 0 30px -60px;
            width: 1200px;
        }

        .main .media-demos .media-demos-photos {
            height: 313px;
            position: relative;
            width: 100%;
        }

        .main .media-demos .show-all-demos {
            border-radius: 4px;
            border: 1px solid #E8E8E8;
            cursor: pointer;
            height: 40px;
            line-height: 40px;
            margin: 60px auto 0;
            text-align: center;
            width: 180px;
        }

        .main .top-content .left-nav li {
            border-bottom: 1px solid #B14031;
            cursor: pointer;
            letter-spacing: 4px;
            line-height: 21px;
            padding: 13px 6px;
            text-align: center;
        }

        .main .media-demos .media-demo-tabs li {
            color: #ccc;
            cursor: pointer;
            float: left;
            font-size: 24px;
            height: 33px;
            line-height: 19px;
            padding: 0 25px;
            position: relative;
        }

        .main .top-banner .top-nav .top-nav-inner {
            font-size: 18px;
            line-height: 55px;
            margin: 0 auto;
            position: relative;
            width: 1080px;
        }

        .main .top-content .focus-infoflow .swiper-container {
            height: 320px;
            margin: 0 0 15px;
            width: 648px;
        }

        .main .top-content .focus-infoflow .per-focus {
            height: 320px;
            position: relative;
            width: 648px;
        }

        .main .top-content .focus-infoflow .infoflow-container {
            padding: 0 8px 0 0;
            width: 648px;
        }
        
        /*查看更多*/
        .main .top-content .focus-infoflow .infoflow-container .show-all {
            border-radius: 4px;
            border: 1px solid #E8E8E8;
            cursor: pointer;
            height: 40px;
            line-height: 40px;
            margin: 50px auto 0;
            text-align: center;
            width: 180px;
        }
        .main .top-content .focus-infoflow .infoflow-container .show-all:hover {
            border: 1px solid #AE210F;
            color: #AE210F;
        }

        .main .top-content .focus-infoflow .pagination {
            display: none;
            padding: 26px 0 0;
            text-align: center;
        }

        .main .top-content .rigth-plats .media-plat {
            padding: 20px 10px 0;
        }


        .main .media-demos .media-demo-tabs .current-media-demo-tabs {
            border-top: 1px solid #AE210F;
            color: #333;
            font-size: 14px;
        }

        .main .media-demos .media-demos-photos .swiper-container {
            height: 313px;
            padding: 5px 0 5px 5px;
            width: 1065px;
        }

        .main .media-demos .media-demos-photos .per-media-demo {
            background: white;
            border: 1px solid #e8e8e8;
            display: inline-block;
            height: 273px;
            padding: 0 20px;
            width: 255px;
        }

        .main .media-demos .media-demos-photos .right-arrow {
            right: -80px;
        }

        .main .media-demos .media-demos-photos .left-arrow {
            left: -90px;
            transform: rotate(180deg);
        }

        .main .media-demos .media-demos-photos .arrow-container {
            height: 80px;
            position: absolute;
            top: 90px;
            width: 80px;
        }

        .main .media-demos .media-demos-photos .bottom-pagation {
            bottom: 0;
            height: 2px;
            left: 0;
            line-height: 2px;
            position: absolute;
            text-align: center;
            width: 100%;
        }

        .main .media-demos .show-all-demos:hover {
            border: 1px solid #AE210F;
            color: #AE210F;
        }

        .main .top-banner .top-nav .top-nav-inner span {
            cursor: pointer;
            float: left;
            padding: 0 30px;
        }

            .main .top-banner .top-nav .top-nav-inner span, .main .top-banner .top-nav .top-nav-inner span a:hover, .main .top-banner .top-nav .top-nav-inner span a {
                color: #D9BF7F;
            }

        .main .top-content .left-nav li :last-of-type {
            border: none;
        }

        .main .top-content .focus-infoflow .per-focus img {
            height: 100%;
            object-fit: cover;
            width: 100%;
        }

        .main .top-content .focus-infoflow .per-focus p {
            bottom: 0;
            color: #fff;
            height: 32px;
            left: 0;
            line-height: 32px;
            position: absolute;
            text-indent: 10px;
            width: 100%;
        }

        .main .media-demos .media-demo-tabs li:after {
            background: #E8E8E8;
            content: "";
            display: inline-block;
            height: 28px;
            position: absolute;
            right: 0;
            top: 0;
            width: 1px;
        }

        .main .media-demos .media-demos-photos .bottom-pagation span {
            background: #E8E8E8;
            display: inline-block;
            height: 2px;
            margin: 0 2px;
            width: 40px;
        }

        .main .top-banner .top-nav .top-nav-inner .swiper-container {
            height: 55px;
            width: 1080px;
        }

        .main .top-banner .top-nav .top-nav-inner .top-nav-left-arrow {
            border-left: 10px solid transparent;
            border-top: 7px solid transparent;
            border-bottom: 7px solid transparent;
            border-right: 10px solid #D04230;
            cursor: pointer;
            left: -30px;
            position: absolute;
            top: 20px;
        }

        .main .top-banner .top-nav .top-nav-inner .top-nav-right-arrow {
            border-left: 10px solid #D9BF7F;
            border-top: 7px solid transparent;
            border-bottom: 7px solid transparent;
            border-right: 10px solid transparent;
            cursor: pointer;
            position: absolute;
            right: -30px;
            top: 20px;
        }

        .main .top-content .focus-infoflow .swiper-container .swiper-pagination {
            text-align: right;
        }

        .main .top-content .focus-infoflow .swiper-container .swiper-pagination-bullet-active {
            background: #AE210F;
        }

        .main .top-content .focus-infoflow .swiper-container .swiper-button-prev {
            background: url(http://p3.qhimg.com/d/inn/56613b39/switchable_arr.png) no-repeat 0 -2px #000;
            height: 45px;
            left: 0;
            opacity: 0.4;
            width: 28px;
        }

        .main .top-content .focus-infoflow .swiper-container .swiper-button-next {
            background: url(http://p3.qhimg.com/d/inn/56613b39/switchable_arr.png) no-repeat 0 -2px #000;
            background-position: -38px -2px;
            height: 45px;
            opacity: 0.4;
            right: 0;
            width: 28px;
        }

        .main .top-content .focus-infoflow .pagination .disable-click {
            color: #DDD !important;
            cursor: not-allowed !important;
        }

        .main .top-content .focus-infoflow .pagination .pre-page {
            background: white;
            border: 1px solid #ddd;
            cursor: pointer;
            display: inline-block;
            height: 24px;
            width: 50px;
        }

        .main .top-content .focus-infoflow .pagination .next-page {
            background: white;
            border: 1px solid #ddd;
            cursor: pointer;
            display: inline-block;
            height: 24px;
            width: 50px;
        }

        .main .top-content .rigth-plats .media-plat .title {
            margin: 0 0 15px;
        }

        .main .top-content .rigth-plats .media-plat .media-plat-tabs {
            border-top: 1px solid #E8E8E8;
            margin: 0 0 20px;
        }

        .main .top-content .rigth-plats .pingtai .per-plat-container {
            max-height: 496px;
            overflow: hidden;
        }

        .main .top-content .rigth-plats .juzhen .per-plat-container {
            max-height: 372px;
            overflow: hidden;
        }


        .main .media-demos .media-demos-photos .swiper-container .swiper-pagination-bullets {
            bottom: 0 !important;
        }

        .main .media-demos .media-demos-photos .swiper-container .swiper-pagination-bullet {
            border-radius: 0;
            height: 2px;
            margin: 0 2px;
            width: 40px;
            background: #E8E8E8;
            opacity: 1;
        }

        .main .media-demos .media-demos-photos .swiper-container .swiper-pagination-bullet-active {
            background: #AE210F;
        }

        .main .media-demos .media-demos-photos .per-media-demo:hover {
            border: none;
            box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
        }

        .main .media-demos .media-demos-photos .per-media-demo .source {
            font-size: 24px;
            height: 71px;
            line-height: 71px;
            overflow: hidden;
            text-align: center;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .main .media-demos .media-demos-photos .per-media-demo .covers {
            height: 132px;
            margin: 0 0 20px;
            overflow: hidden;
            width: 215px;
        }

        .main .media-demos .media-demos-photos .per-media-demo .title {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            width: 100%;
        }

        .main .media-demos .media-demos-photos .arrow-container:hover {
            cursor: pointer;
        }

        .main .media-demos .media-demos-photos .arrow-container .arrow1 {
            border-left: 40px solid #E8E8E8;
            left: 5px;
            z-index: 9;
        }

        .main .media-demos .media-demos-photos .arrow-container .arrow1, .main .media-demos .media-demos-photos .arrow-container .arrow2 {
            border-top: 40px solid transparent;
            border-bottom: 40px solid transparent;
            border-right: 40px solid transparent;
            height: 0;
            position: absolute;
            top: 0;
            width: 0;
        }

        .main .media-demos .media-demos-photos .arrow-container .arrow2 {
            border-left: 40px solid #fff;
            left: 0;
            z-index: 10;
        }

        .main .media-demos .media-demos-photos .bottom-pagation .red-bg {
            background: #AE210F;
        }

        .main .top-content .rigth-plats .media-plat .media-plat-tabs li {
            color: #999;
            cursor: pointer;
            float: left;
            font-size: 12px;
            height: 33px;
            line-height: 19px;
            padding: 7px;
            position: relative;
            text-align: center;
            width: 72px;
        }

        .main .media-demos .media-demo-tabs li:last-of-type:after {
            display: none;
        }

        .main .media-demos .media-demos-photos .swiper-container a:hover {
            color: #333;
        }

        .main .media-demos .media-demos-photos .per-media-demo .covers img {
            height: 100%;
            object-fit: cover;
            width: 100%;
        }

        .main .top-banner .top-nav .top-nav-inner .swiper-container .swiper-slide {
            display: inline-block;
            width: auto;
        }

        .main .top-content .rigth-plats .media-plat .title .title-name {
            float: left;
            font-weight: 700;
            font-size: 18px;
        }

        .main .top-content .rigth-plats .media-plat .title .more {
            cursor: pointer;
            float: right;
            height: 25px;
            line-height: 25px;
        }

        .main .top-content .rigth-plats .media-plat .media-plat-tabs .current-plat-tab {
            border-top: 1px solid #AE210F;
            color: #333;
            font-size: 14px;
        }

        .main .top-content .rigth-plats .media-plat .per-plat-container .per-plat {
            float: left;
            margin: 0 10px 30px 0;
            width: 65px;
        }


        .main .media-demos .media-demos-photos .per-media-demo:hover .title {
            color: #AE210F;
        }

        .main .media-demos .media-demos-photos .arrow-container:hover .arrow1 {
            border-left: 40px solid #AE210F;
        }

        .main .top-content .rigth-plats .media-plat .title .title-name span {
            color: #AE210F;
        }

        .main .top-content .rigth-plats .media-plat .media-plat-tabs li:after {
            background: #E8E8E8;
            content: "";
            display: inline-block;
            height: 16px;
            position: absolute;
            right: 0;
            top: 7px;
            width: 1px;
        }

        .main .top-content .rigth-plats .media-plat .per-plat-container > div:nth-of-type(4n) {
            margin: 0 0 30px;
        }


        .main .top-content .rigth-plats .media-plat .per-plat-container .per-plat .per-plat-img {
            height: 65px;
            overflow: hidden;
        }

        .main .top-content .rigth-plats .media-plat .per-plat-container .per-plat .circular-shape {
            border-radius: 50%;
        }

        .main .top-content .rigth-plats .media-plat .per-plat-container .per-plat .media-name {
            height: 19px;
            line-height: 19px;
            margin: 10px 0 0;
            overflow: hidden;
            text-align: center;
            text-overflow: ellipsis;
            white-space: nowrap;
        }


        .main .top-content .rigth-plats .media-plat .media-plat-tabs li:last-of-type:after {
            display: none;
        }

        .main .top-content .rigth-plats .media-plat .per-plat-container .per-plat .per-plat-img img {
            height: 100%;
            object-fit: cover;
            width: 100%;
        }




        .title-second {
            font-size: 18px;
            font-weight: 700;
            text-align: center;
        }

            .title-second p {
                background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAXAAAAAKCAYAAACt1wUsAAAA2ElEQVRoQ+3WwQ3CMAxAUbIBM7ARE1EmYiNmYIOgckBCEFpZPRjzuFKr+CX6ou1WfC6H/dR7P6141CMECBD4C4HW2vl4vU1Ly476ucV8i758ac73BAgQqCqwRXy3iP/XgPvnXfX62YsAgahAlnjPv38YcPGOHq85AgSqCmSK9zDg4l31+tmLAIGoQLZ4fwy4eEeP1xwBAlUFMsb7LeDiXfX62YsAgahA1ni/BFy8o8drjgCBqgKZ4/0MuHhXvX72IkAgKpA93o+Ai3f0eM0RIFBV4BfiPdvfAaEi7WzIg9ONAAAAAElFTkSuQmCC") left center no-repeat,url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAXAAAAAKCAYAAACt1wUsAAAA4UlEQVRoQ+3a3Q2CQBBFYbcDa7AjKxIrsiNrsIM1a4JRBJbE8DCTj9flZ+65yQlZKIcNx+10HGqtl+mppZTr+f4YerfY6/rec60jgAACWQk0/5ZeuL3k+6/8e3NbRwABBLISGP25KnDyzlq/XAggEJXA58vvosDJO2q95kYAgawEpjsXswIn76z1y4UAAlEJzG07/wicvKPWa24EEMhKYOmb4ZfAyTtr/XIhgEBUAms/fLwFTt5R6zU3AghkJdD7W+8lcPLOWr9cCCAQlUBP3i1XIe+o9ZobAQSyEtgi75b9CdAC7WxVSmN1AAAAAElFTkSuQmCC") right center no-repeat;
                background-size: 168px 5px,168px 5px;
                display: inline-block;
                padding: 0 175px;
            }

                .title-second p span {
                    color: #AE210F;
                }

        /*新闻列表格式*/
        .feed-item {
            position: relative;
            padding: 16px 0;
            z-index: 1;
            cursor: pointer;
            border-bottom: 1px solid #f0f0f0;
            transition: background .3s ease-in;
        }

           .feed-item:first-child {
                padding-top: 0;
            }

           .feed-item:hover {
                background: #f0f0f0;
            }

           .feed-item > a {
                display: block;
            }

           .feed-item.adcode-item, .feed-item.adcode-item:hover {
                background: #fff;
            }

            .feed-item .title {
                color: #444;
                font-size: 18px;
                line-height: 1.222em;
                max-height: 2.444em;
                font-weight: 700;
                letter-spacing: .5px;
                overflow: hidden;
            }

                .feed-item .title:hover {
                    color: #ea524f;
                }

            .feed-item .summary-text {
                font-size: 1rem;
                margin-top: 5px;
                line-height: 1.5em;
                max-height: 3em;
                overflow: hidden;
            }

            .feed-item .media-extra {
                color: #999;
                line-height: 1.5em;
                font-size: 12px;
                margin-top: 7px;
            }

                .feed-item .media-extra .col {
                    float: left;
                    white-space: nowrap;
                }

                .feed-item .media-extra .dot {
                    width: 2px;
                    height: 2px;
                    overflow: hidden;
                    margin: 9px 10px 0;
                    background: gray;
                }

                    .feed-item .media-extra .dot:last-child {
                        display: none;
                    }

                .feed-item .media-extra .cite.has .cite-name:hover {
                    color: #ea524f;
                }

                .feed-item .media-extra .cite .cite-logo {
                    position: relative;
                    float: left;
                    width: 18px;
                    height: 18px;
                    overflow: hidden;
                    margin-right: 4px;
                    border-radius: 50%;
                }

                    .feed-item .media-extra .cite .cite-logo img {
                        width: 16px;
                        height: 16px;
                        overflow: hidden;
                        border-radius: 50%;
                        border: 1px solid #f0f0f0;
                    }

                    .feed-item .media-extra .cite .cite-logo .name {
                        position: absolute;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 100%;
                        color: #8d95a2;
                        text-align: center;
                    }

                    .feed-item .media-extra .cite .cite-logo.no-logo {
                        background: #dbe0e7;
                    }

            .feed-item .close {
                position: absolute;
                width: 20px;
                height: 20px;
                bottom: 12px;
                right: 0;
                overflow: hidden;
                padding: 0 20px 0 8px;
                transition: width .3s ease;
                cursor: pointer;
                white-space: nowrap;
                line-height: 20px;
                text-indent: 40px;
                font-size: 12px;
            }

                .feed-item .close .icon {
                    position: absolute;
                    top: 0;
                    right: 0;
                    width: 20px;
                    height: 20px;
                    overflow: hidden;
                    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAeCAYAAAARgF8NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyppVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTMyIDc5LjE1OTI4NCwgMjAxNi8wNC8xOS0xMzoxMzo0MCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUuNSAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowRDcxQUNFQzdDQTAxMUU2QThGODkwRDk3OUNDQkNGRCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowRDcxQUNFRDdDQTAxMUU2QThGODkwRDk3OUNDQkNGRCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjBENzFBQ0VBN0NBMDExRTZBOEY4OTBEOTc5Q0NCQ0ZEIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjBENzFBQ0VCN0NBMDExRTZBOEY4OTBEOTc5Q0NCQ0ZEIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Vw3ZRgAAAOFJREFUeNpivHnz5goGBoZWIL7MgAp0gbiaCUhsBuKtQCyDJCkDFdvMAiSWArEkEG8DYluoAhB7GkiOEWgFTFc7EJtB2aeAuBLEQFYAsg7GUQfifzBBGAA59BEUt8IEWaB0ERB7I7nhMBC/B+IukIJoIC4AYisg/ghV4AXEx4D4KcgKX6juJ0jWPYGK+SI7Eitg/P///6gCuihgACpYAcS6IIVoGCS2AsSIBuJHQCyDJCkDFYuGCZQA8SUg5odiELsCJIfsBuyJFkkB1kRL0ASYG4qwuKEMrJkYX+ANB4AAAwDRAvHg3Hn88QAAAABJRU5ErkJggg==);
                    background-repeat: no-repeat;
                    background-position: 50% 6px;
                }

                .feed-item .close:hover {
                    width: 48px;
                    border-radius: 20px;
                    background-color: #ef5c59;
                    color: #fff;
                    text-indent: 0;
                }

                    .feed-item .close:hover .icon {
                        background-position: 50% -15px;
                    }


        .feed-lp-rt {
            display: table !important;
            width: 100%;
        }

            .feed-lp-rt .left-wrapper {
                width: 30%;
                display: table-cell;
                position: relative;
            }

                .feed-lp-rt .left-wrapper img {
                    width: 100%;
                }

                .feed-lp-rt .left-wrapper .badge {
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    z-index: 3;
                    padding: 0 6px;
                    background: #444;
                    background: rgba(0,0,0,.5);
                    color: #fff;
                    font-size: 12px;
                    line-height: 20px;
                    white-space: nowrap;
                }

                    .feed-lp-rt .left-wrapper .badge .icon {
                        float: left;
                        width: 6px;
                        height: 8px;
                        overflow: hidden;
                        margin-top: 6px;
                        margin-right: 3px;
                        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAICAYAAADaxo44AAAAP0lEQVQImW2NwQ0AEBAElyJ0Ro+ojCbGQ1zkmGRfu3MnoAIJ0B2xGUD+FYd2bF+YHfUSJAVvdH9qAsU/t9WdBfIfkDgk/nkBAAAAAElFTkSuQmCC) no-repeat 0 0;
                    }

                    .feed-lp-rt .left-wrapper .badge.badge-live {
                        background: #ff4633;
                    }

                    .feed-lp-rt .left-wrapper .badge.badge-playback {
                        background: #000;
                    }

            .feed-lp-rt .right-wrapper {
                display: table-cell;
                padding-left: 15px;
                vertical-align: middle;
            }

