@keyframes sprite_btn{
    0% { background-image: url(../images/btns2/b1.png); }
    2%  { background-image: url(../images/btns2/b2.png); }
    4%  { background-image: url(../images/btns2/b3.png); }
    6%  { background-image: url(../images/btns2/b4.png); }
    8%  { background-image: url(../images/btns2/b5.png); }
    10% { background-image: url(../images/btns2/b6.png); }
    12% { background-image: url(../images/btns2/b7.png); }
    14% { background-image: url(../images/btns2/b8.png); }
    16% { background-image: url(../images/btns2/b9.png); }
    18% { background-image: url(../images/btns2/b10.png); }
    20% { background-image: url(../images/btns2/b11.png); }
    22% { background-image: url(../images/btns2/b12.png); }
    24% { background-image: url(../images/btns2/b13.png); }
    26% { background-image: url(../images/btns2/b14.png); }
    28% { background-image: url(../images/btns2/b15.png); }
    30% { background-image: url(../images/btns2/b16.png); }
    32% { background-image: url(../images/btns2/b17.png); }
    34% { background-image: url(../images/btns2/b18.png); }
    36% { background-image: url(../images/btns2/b19.png); }
    38% { background-image: url(../images/btns2/b20.png); }
    40% { background-image: url(../images/btns2/b21.png); }
    42% { background-image: url(../images/btns2/b22.png); }
    44% { background-image: url(../images/btns2/b23.png); }
    46% { background-image: url(../images/btns2/b24.png); }
    48% { background-image: url(../images/btns2/b25.png); }
    50% { background-image: url(../images/btns2/b26.png); }
    52% { background-image: url(../images/btns2/b27.png); }
    54% { background-image: url(../images/btns2/b28.png); }
    56% { background-image: url(../images/btns2/b29.png); }
    58% { background-image: url(../images/btns2/b30.png); }
    60% { background-image: url(../images/btns2/b31.png); }
    62% { background-image: url(../images/btns2/b32.png); }
    64% { background-image: url(../images/btns2/b33.png); }
    66% { background-image: url(../images/btns2/b34.png); }
    68% { background-image: url(../images/btns2/b35.png); }
    70% { background-image: url(../images/btns2/b36.png); }
    72% { background-image: url(../images/btns2/b37.png); }
    74% { background-image: url(../images/btns2/b38.png); }
    76% { background-image: url(../images/btns2/b39.png); }
    78% { background-image: url(../images/btns2/b40.png); }
    80% { background-image: url(../images/btns2/b41.png); }
    82% { background-image: url(../images/btns2/b42.png); }
    84% { background-image: url(../images/btns2/b43.png); }
    86% { background-image: url(../images/btns2/b44.png); }
    88% { background-image: url(../images/btns2/b45.png); }
    90% { background-image: url(../images/btns2/b46.png); }
    92% { background-image: url(../images/btns2/b47.png); }
    94% { background-image: url(../images/btns2/b48.png); }
    100% { background-image: url(../images/btns2/b49.png); }
}

.header-wrap{
    background: #18202B;
    width: 100%;
    height: 56px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
}

.header{
    height: 100%;
    width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.header a img{
    width: 215px;
}

.header .navs{
    display: flex;
    align-items: center;
    margin-left: 90px;
}

.header .navs .nav{
    margin-right: 83px;
    cursor: pointer;
}

.header .navs .nav:hover{
    color: #2BBAC6;
}

.header .navs .nav-active{
    color: #2BBAC6;
}

.header .navs .dropdown-nav{
    position: relative;
}

.header .navs .dropdown-nav .dropdown-list{
    position: absolute;
    left: 50%;
    top: 23px;
    transform: translateX(-50%);
    width: 135px;
    height: 0px;
    background: #18202B;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    /* justify-content: center; */
    overflow: hidden;
    transition: height .1s ease-in-out;
    font-size: 16px;
}

.header .navs .dropdown-nav .dropdown-list .dropdown-item{
    margin-bottom: 13px;
    color: #fff;
}

.header .navs .dropdown-nav .dropdown-list .dropdown-item:hover{
    color: #2BBAC6;
}

.header .navs .dropdown-nav:hover  .dropdown-list{
    height: 170px;
}

.header .download-btn{
    position: absolute;
    right: 0;
    width: 280px;
    height: 56px;
    background-image: url(../images/download.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.header .download-btn:hover{
    animation: sprite_btn 2s 0s infinite normal;
}

#news{
    background: #18202B;
    min-height: 100vh;
}

.news-container{
    max-width: 1920px;
    min-height: 1080px;
    margin: 0 auto;
    background: url(../images/download/bg.png);
    background-size: 100% 1080px;
    background-repeat: no-repeat;
    padding-top: 120px;
    color: #CFE6E6;
}


.news-container .news-title{
    width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-shrink: 0;
}

.news-container .news-title .tiele{
    position: relative;
    bottom: -14px;
}

.news-container .news-title .line{
    flex-grow: 1;
    display: flex;
    align-items: end;
    flex-direction: row-reverse;
    padding-bottom: 12px;
}

.news-container .news-title .line .new{
    width: 67px;
    height: 36px;
    text-align: center;
    line-height: 36px;
    cursor: pointer;
    margin-left: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* color: #fff; */
}

.news-container .news-title .line .new img{
    padding-top: 3px;
}

.news-container .news-title .line .new-active{
    background-image: url(../images/news/type-bg.png);
    background-size: 100% 100%;
    color: #33E5F1;
}

.news-container .news-title .line .new:hover{
    background-image: url(../images/news/type-bg.png);
    background-size: 100% 100%;
    color: #33E5F1;
}

.news-box{
    min-height: 715px;
}

.news-list{
    width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 38px;
}

.news-list .news-item{
    width: 683px;
    height: 167px;
    border: 1px solid #13FFFC;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.news-list .news-item .cover{
    width: 301px;
    height: 165px;
    flex-shrink: 0;
}

.news-list .news-item .content{
    flex-grow: 1;
    padding: 28px;
    font-size: 16px;
}

.news-list .news-item .content .head{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.news-list .news-item .content .head .type{
    width: 69px;
    height: 26px;
    background-image: url(../images/news/item-bg.png);
    background-size: 100% 100%;
    text-align: center;
    line-height: 26px;
    flex-shrink: 0;
}

.news-list .news-item .content .title{
    margin-top: 22px;
}

.el-pagination{
    display: flex;
    justify-content: center;
    color: #CFE6E6 !important;
}

.el-pagination button{
    background: transparent !important;
}

.el-pagination .number,.el-icon{
    background: transparent !important;
    color: #CFE6E6 !important;
}

.el-pagination .active{
    color: #33E5F1 !important;
}

.el-pager{
    /* margin-top: 8px; */
}