[v-cloak] {
    display:none;
}
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    background-color:#F5F5F5;
}
.divider {
    width:100%;
    margin:20px 0;
    padding:1px 0 0;
    background-color:#9b9b9b;
}
section {
    min-width:1200px;
    width:1200px;
    margin:20px auto;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    align-items:flex-start;
}
.newsLeft {
    width:820px;
    border-radius:8px;
    padding:20px;
    background:#FFFFFF;
}
.newsRight {
    width:360px;
    background:#FFFFFF;
    border-radius:8px;
    padding:20px;
}
.newsLeft .newsHeader h4 {
    font-size:20px;
    font-weight:bold;
    color:rgba(55, 55, 55, 1);
    padding-bottom:10px;
}
.newsLeft .newsHeader .breadcrumb {
    font-size:14px;
    font-weight:400;
    color:rgba(155, 155, 155, 1);
}
.newsLeft .newsHeader .breadcrumb_item {
    display:inline-block;
}
.newsLeft .newsHeader .breadcrumb_item::after {
    content:'>';
    font-size:14px;
    font-weight:400;
    font-family:serif;
}
.newsLeft .newsHeader .breadcrumb_item:last-child::after {
    content:"";
}
.newsLeft .cardList {
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:center;
    width:100%;
}
.newsLeft .cardList .cardItem {
    width:100%;
    height:120px;
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
    align-items:center;
    margin:20px auto;
}
.newsLeft .cardList .cardItem .cardLeft {
    margin-right:20px;
}
.newsLeft .cardList .cardItem .cardLeft img {
    width:160px;
    height:120px;
    border-radius:8px;
}
.newsLeft .cardList .cardItem .cardRight {
    width:calc(100% - 160px - 20px);
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    align-items:flex-start;
    padding-bottom:12px;
}
.newsLeft .cardList .cardItem .cardRight .cardRight_top {
    width:100%;
}
.newsLeft .cardList .cardItem .cardRight .cardRight_top h4 {
    font-size:16px;
    font-weight:bold;
    color:rgba(55, 55, 55, 1);
    padding-bottom:10px;
    overflow:hidden;
    position:relative;
}
.newsLeft .cardList .cardItem .cardRight .cardRight_top h4 .text_ellipsis {
    float:right;
    position:absolute;
    bottom:0px;
    right:0;
    padding-left:3px;
    display:block;
    width:20px;
    font-size:16px;
    font-weight:bold;
    letter-spacing:2px;
    color:rgba(55, 55, 55, 1);
    background:#fff;
}
.newsLeft .cardList .cardItem .cardRight .cardRight_top div.text {
    font-size:12px;
    font-weight:400;
    color:rgba(155, 155, 155, 1);
    overflow:hidden;
    position:relative;
    text-align:left;
}
.newsLeft .cardList .cardItem .cardRight .cardRight_top div.text .text_ellipsis {
    float:right;
    position:absolute;
    bottom:0px;
    right:0;
    padding-left:3px;
    display:block;
    width:20px;
    font-size:12px;
    font-weight:bold;
    letter-spacing:2px;
    color:rgba(155, 155, 155, 1);
    background:#fff;
}
.newsLeft .cardList .cardItem .cardRight .cardRight_bottom {
    width:100%;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
}
.newsLeft .cardList .cardItem .cardRight .cardRight_bottom span, .newsLeft .cardList .cardItem .cardRight .cardRight_bottom a {
    margin-right:20px;
    font-size:12px;
    font-weight:400;
    color:rgba(155, 155, 155, 1);
}
.newsLeft .cardList .cardItem .cardRight .cardRight_bottom a {
    margin-right:20px;
}
.el-pagination {
    display:flex;
    flex-direction:row;
    justify-content:center;
}
.rank {
    width:100%;
    height:auto;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:center;
    margin-top:20px;
}
.rankItem {
    width:100%;
    height:auto;
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
    align-items:flex-start;
    margin:12px auto;
}
.rankItem .rankItemLeft {
    height:100%;
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
    align-items:flex-start;
}
.rankItem .rankItemLeft span {
    font-size:40px;
    font-weight:bold;
    color:rgba(55, 55, 55, .25);
    width:70px;
    line-height:1;
    display:flex;
    flex-direction:row;
    align-items:flex-start;
    justify-content:flex-start;
}
.rankItem .rankItemRight {
    width:calc(100% - 70px);
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:flex-start;
}
.rankItem .rankItemRight h4 {
    display:block;
    width:100%;
    text-align:left;
    font-size:16px;
    font-weight:bold;
    color:rgba(75, 75, 75, 1);
    margin-bottom:12px;
    overflow:hidden;
    position:relative;
}
.rankItem .rankItemRight h4 .text_ellipsis {
    float:right;
    position:absolute;
    bottom:0px;
    right:7px;
    padding-left:3px;
    display:block;
    width:20px;
    font-size:16px;
    font-weight:bold;
    letter-spacing:2px;
    color:rgba(55, 55, 55, 1);
    background:#fff;
}
.rankItem .rankItemRight p {
    font-size:12px;
    font-weight:400;
    color:rgba(155, 155, 155, 1);
    line-height:1;
}
.rank .rankItem:first-child .rankItemLeft span {
    color:#3BA7FF;
}
.rank .rankItem:nth-child(2) .rankItemLeft span {
    color:rgba(59, 167, 255, .5);
}
.rank .rankItem:nth-child(3) .rankItemLeft span {
    color:rgba(59, 167, 255, .25);
}
.page {
    margin:30px auto;
    width:100%;
    font-size:14px;
    text-align:center;
}
.pagebox {
    display:inline-block;
}
.page .current {
    background:#3BA7FF;
    color:#fff;
    border:1px solid #3BA7FF;
}
.pagebox a {
    margin:0 5px;
    padding:0 12px;
    display:inline-block;
    background-color:#f7f7f7;
    border:solid 1px #ddd;
    border-radius:2px;
    color:#888;
    line-height:30px;
    text-align:center;
}
.pagebox a.end, .pagebox a.home, .pagebox a.next, .pagebox a.prev {
    padding:0 10px;
    width:auto;
}