<style type="text/css">
    body{
        margin: 0;
        padding: 0;
        font-family:Microsoft YaHei;
    }
    footer{
        width:100%;
        min-width: 1195px;
        height:79px;
        background:rgba(153,153,153,1);
        opacity:1;
        font-size:14px;
        text-align: center;
        font-weight:400;
        line-height:79px;
        color:rgba(255,255,255,1);
        margin-top: -22px;
    }
    h1{
        width:181px;
        height:46px;
        background:rgba(255,68,68,1);
        opacity:1;
        border-radius:0px 20px 0px 0px;
        font-size:20px;
        font-weight:400;
        line-height:48px;
        color:rgba(255,255,255,1);
        padding-left: 23px;
        margin-bottom: 0;
    }
    h3{
        font-size:16px;
        color:rgba(255,68,68,1);
        opacity:1;
        color: #FF4444;
        margin: 1px 0;
    }
    ul{
        padding: 0;
        margin: 0
    }
    li{ 
        list-style: none;
                background-size: cover;
    }
    a{
        color: #333
    }
    table{
        width: 100%;
        color: #999999;
        font-size: 14px;
        font-weight:400!important;
        border-collapse:collapse;
        clear: both;
        table-layout: fixed;
    }
    table tr th{
        border-bottom: 1px solid #CDCDCD;
        padding:13px 0;
        text-align: left;
    }
    table tr{
        height: 35px;
    }
    table tr td{
        min-height: 23px;
        padding:6px 0;
        text-align: left;
        overflow : hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        white-space:nowrap
    }
    table tr:nth-child(2) td,#workList tr:nth-child(n+2):nth-child(8n-6) td,#design tr:nth-child(n+2):nth-child(8n-6) td{
        padding-top: 18px
    }
    table tr:nth-child(2) td:first-child:after,#workList tr:nth-child(n+2):nth-child(8n-6) td:first-child:after,#design  tr:nth-child(n+2):nth-child(8n-6)  td:first-child:after{
        top: 21px
    }
    table tr td:first-child{
        color: #333333;
        padding-left: 20px;
        position: relative;
    }
    table tr td:first-child:after{
        content: "";
                position: absolute;
                display: block;
                width: 14px;
            height: 14px;
            left: 0;
            top: 9px;
    }
    table tr td:first-child:after{
        background-image: url('{ms:globalskin.url/}/images/subjectIcon5.png')
    }
    table .video td:first-child:after{
        background-image: url('{ms:globalskin.url/}/images/subjectIcon4.png')
    }
    #host section p:hover,#title .right div p:hover,table tr td:first-child:hover,a:hover{
        color: #FF4444!important;
        cursor:pointer
    }
    #Head{
        width: 100%;
        min-width: 1195px;
        /*height: 150px*/
    }
    video{
        background: #000;
                width:100%;
        height:100%;
    }
    .centerDiv{
        width: 1190px;
        margin: 0 auto;
        clear: both;
    }
    .active{
        color: #FF4444!important;
        position: relative;
    }
    .active:before {
                content: "."; 
                position: absolute; 
                top: -2px; 
                left: 46%;
                font-size: 26px
        }
    #title{
        width:100%;
        height:630px;
        background:rgba(255,247,247,1);
        opacity:1;
    }
    #title .left{
        float: left;
        width: 608px;
        margin-right: 22px;
    }
    #title .right{
        float: left;
        width: 560px
    }
    #title .left p{
        margin: 0 0 5px;
                height: 350px;
                background: #000;
        border-top: 3px solid rgba(255,68,68,1)
    }
    #title .left #titleArticle p{
        color: #707070;
        font-size:14px;
        line-height:24px;
                height: 135px;
        overflow : hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
                background: none;
        border: none
    }
    #title .left div{
        background: #fff;
        padding: 19px;
        box-shadow:0px 3px 15px rgba(235,235,235,1);
        border-radius:4px;
        height: 146px;
    }
    #title .right .div1{
        width:561px;
        height:280px;
        background:rgba(255,255,255,1);
        box-shadow:0px 3px 15px rgba(235,235,235,1);
        border-radius:4px;
        overflow: hidden;
    }
    #title .right .div1:first-child{
        margin: 19px  0
    }
    #title .right .div1 div{
        height:66px;
    }
    #title .right .div1 h2{
        width:130px;
        height:49px;
        font-size: 20px;
        background:rgba(255,68,68,1);
        border-radius:0px 0px 20px 0px;
        font-weight:400;
        line-height:48px;
        color:rgba(255,255,255,1);
        padding-left: 23px;
        margin: 0
    }
    #title .right .div1 p{
        color: #333333;
        font-size:14px;
        font-weight:400;
        line-height:15px;
        padding: 0 27px;
        clear: both;
        overflow: hidden;
    }
    #title .right .div1 span:first-child{
        width: 400px;
        float: left;
                display: inline-block;
                overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }
    #title .right .div1 span:nth-child(2){
        float: right;
        color: #999999;
        font-size:14px;
        font-weight:400;
    }
        #research .p1{
        margin-top: 40px;
    }
        #growth .p1{
        height: 30px;
    }
    #photo p:first-child span,#host .topP span,#research p .span1,#growth p:first-child span{
        position: relative;
        font-size: 20px;
                padding: 0 14px;
                float: left;
    }
    #photo p:first-child span:after,#host .topP span:after,#research p .span1:after,#growth p:first-child span:after{
        content: "";
                position: absolute;
               display: block;
               -webkit-transform: translate(-50%, -50%);
               transform: translate(-50%, -50%);
               border-top: 23px solid #FF4444;
               width: 3px;
               height: 24px;
               left: 0
    }
    #opus ul li table tr th:first-child:before{
        content: "";
                position: absolute;
               display: block;
               width: 24px;
               height: 24px;
           left: 105px;
           top: 15px;
    }
    #work,#photo,#research,#growth,#opus,#microVideo{
        height: 465px;
        position: relative;
    }
        #work{
        height: 490px;
    }
        #growth{
        height: 660px;
    }
       #microVideo{
        height: 625px;
    }
    #photo{
        margin-top: 35px;
        height: 580px;
    }
    #research {
        height: 800px;
    }
    #microVideo .div1{
        margin-top: 1px;
                border-top: 3px solid rgba(255,68,68,1);
                padding-top: 25px;
    }
    #work table,#opus ul li:first-child table{
        border-top: 3px solid rgba(255,68,68,1);
    }
    #opus ul li .more,#microVideo .more{
        display: none;
        float: right;
        font-size:12px;
        font-weight:400;
        margin: 15px 0 25px 0;
        color:rgba(89,164,233,1);
    }
    #opus ul li table tr th:first-child{
        position: relative;
        font-size: 20px;
                padding-left: 14px;
                color: #000;
    }
    #photoUl,#microVideoUl,#opusUl,#researchUl{
        padding-top: 3px;
                overflow: hidden;
                height: 30px;
                padding-left: 15px;
    }
    #opusUl,#workUl,#microVideoUl{
        padding-top: 26px;
                overflow: hidden;
            padding-left: 20px;
            height: 30px
    }
    #photoUl li,#microVideoUl li,#workUl li,#opusUl li,#researchUl li{
        float: left;
        margin: 0 6px;
        color: #707070;
        font-size: 16px
    }
    #photoUl li,#microVideoUl li{
        margin: 0 10px;
    }
    #photoUl li:hover,#microVideoUl li:hover,#workUl li:hover,#opusUl li:hover,#researchUl li:hover{
        color: #FF4444!important;
        cursor:pointer
    }
    #opus h1,#work h1,#microVideo h1{
        float: left;
    }
    #photoList,#microVideoList,#researchList{
        height: 380px;
    }
    #researchList{
        height:450px
    }
    #growthList{
        overflow: hidden;
    }
    #photoList li,#microVideoList li,#researchList li,#microVideoList li,#growthList li{
        float: left;
        width: 275px;
        height: 160px;
        margin: 0 30px 20px 0;
        overflow: hidden;
        position: relative;
    }
    #photoList li{
        height: 207px;
        }
    #microVideoList li .video1{
        position: absolute;
        top:60px;
        left:105px;
    }
    #researchList li,#microVideoList li{
        height: 225px;
                margin: 0 30px 5px 0;
    }
        #growthList li{
                width: 214px;
        height: auto;
        margin: 0 30px 20px 0;
    }
        #growthList li div{
                position: relative;
    }
        #growthList li .img1{
                width: 165px;
        height: 190px;
        margin: 0 24px;
    }
        #growthList li .img2{
                width: 50px;
                position: absolute;
        top: -3px;
        left: 25px
    }
        #growthList li p{
                margin: 8px 0 0 0
    }
        #growthList li .p{
                text-align: center;
    }
       #growthList li p span{
                text-align: left;
                overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-inline-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
        #growthList li .p1{
                font-size: 14px;
                color: #999999;
    }
        #researchList li{
                margin: 8px 22px 0 0;
        width: 220px;
    }

    #researchList li p,#microVideoList li p{
        font-size:16px;
        height: 40px;
        margin-top: 6px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    #researchList li p{
        padding: 0 10px;
                text-align: center;
    }
        #researchList li p span{
                text-align: left;
                overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-inline-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
        #researchList li img{
        width: 100%;
                height:100%;
        }
        #researchList li:hover img{
        transition: all 0.6s;
                transform: scale(1.15, 1.15);
        }
    #photoList a:nth-child(n+9){
        display: none;
    }
    #photoList a:nth-child(4n) li,#microVideoList li:nth-child(4n){
        margin: 0
    }
        #researchList a:nth-child(5n) li{
        margin-right: 0
    }
    #growthList a:nth-child(5n) li{
        margin: 0
    }
    #photoList li p{
        width: 92%;
        height: 38px;
        background:rgba(0,0,0,0.7);
        margin: 154px 0 0 0;
        color: #fff;
        font-size:14px;
        line-height:21px;
        overflow: hidden;
        text-overflow: ellipsis;
            -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        padding: 7.5px 4%;
                display: -webkit-box;
        transform: translate(0, 100%);
    }
    #photoList li:hover p{
                transform: translate(0, 0);
        transition: 0.6s;
    }
    #opusList li{
        min-height: 320px;
        margin-bottom:10px;
    }
    #opusList img, #workList img{
        float: left;
        width: 67px;
        height: 23px;
                margin-right: 5px;
                display: none
    }
        #opus #design .Y img,#workList .推荐 img{
        display: inline-block;
    }
    .text{
        width: 100%;
        height: 30%;
        background-color:blue;
        position: absolute;
        top: 30%;
        left: 0; 
        transform: rotate(-45deg) rotateX(90deg);
        transition: 0.6s 0.9s ease-in-out;
        line-height: 70%;
        color: pink;
        font-size: 26px;
        text-align: center;
    }

.activeShow{display: inline-block!important;}
.zuo{background-image: url('{ms:globalskin.url/}/images/huakuaiL.png');}
.you{background-image: url('{ms:globalskin.url/}/images/huakuaiR.png');background-position: -160px -440px;right: 0; width: 32px;}
.title_new .p2{min-height: 20px;}
img{object-fit: contain}
.flashSaleDeals ul li{height:auto!important}
</style>
