/* 新闻中心 */
.news {
    position: absolute;
    inset: 0;
}

.news a {
    text-decoration: none;
}

.news .background {
    position: absolute;
    inset: 0;
    background: linear-gradient(-38deg, #1E1129 0%, #2F1D3F 100%);
    opacity: 0.99;
}

.news .top-bg {
    position: absolute;
    top: 0;
    width: 100%;
    background-image: url(../images/news/top-bg.png);
    background-size: cover;
    background-position: center;
    height: 8.74rem;
}

.news .container {
    position: absolute;
    inset: 0;
    overflow: auto;
}

.news .container .wrapper {
    position: relative;
}

/* banner */
.news .container .wrapper .banner {
    position: relative;
    display: flex;
    flex-direction: column;
    height: calc(6.425rem - .9375rem);
    transform: scale(0.8);
    justify-content: center;
    /* align-items: center; */
}

.news .container .wrapper .banner .title {
    margin-top: 2.825rem;
    margin-left: calc(0.3rem + 2.975rem);
    height: 0.85rem;
    font-family: ChuangKeTieJinGangTi-2;
    font-size: 0.9rem;
    color: #FFFFFF;
    line-height: 0.12rem;
}

.news .container .wrapper .banner .desc {
    margin-top: -0.0625rem;
    margin-left: calc(0.3rem + 2.975rem);
    font-weight: 800;
    font-size: .4125rem;
    color: #FFFFFF;
    line-height: 1;
}

/* section */
.news .container .wrapper .section-line {
    position: relative;
    height: .05rem;
    background-color: #FFFFFF;
    margin: .05rem 0 .275rem 0;
}

.news .container .wrapper .section-line .more {
    position: absolute;
    top: -0.4375rem;
    right: 0;
    font-weight: 400;
    font-size: .25rem;
    color: #FFFFFF;
    transition: transform 0.3s ease-in-out;
    cursor: pointer;
}

.news .container .wrapper .section-line .more:hover {
    transform: translateX(.125rem);
}

/* latest-recommend */
.news .container .wrapper .latest-recommend {
    position: relative;
    display: flex;
    justify-content: center;
    transform: scale(0.8);
    transform-origin: top;
    margin-top: 3.5rem;
}

/* latest */
.news .container .wrapper .latest-recommend .latest {
    display: flex;
    flex-direction: column;
    width: 9.8rem;
    margin-right: .45rem;
}

.news .container .wrapper .latest-recommend .latest .title {
    font-family: "ChuangKeTieJinGangTi-2";
    color: white;
    font-size: .5rem;
    line-height: 1;
}

.news .container .wrapper .latest-recommend .latest .section-line {
    margin-right: 0.125rem;
}

.news .container .wrapper .latest-recommend .latest .content {
    display: flex;
    flex-wrap: wrap;
}

.news .container .wrapper .latest-recommend .latest .content .item {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 4.7375rem;
    height: 6.4rem;
    background: #FFFEFD;
    border-radius: .15rem;
    margin-right: .325rem;
    margin-bottom: .375rem;
    overflow: hidden;
    transition: transform .3s ease-in-out;
    cursor: pointer;
}

.news .container .wrapper .latest-recommend .latest .content .item:hover {
    transform: translateY(-0.125rem);
}

.news .container .wrapper .latest-recommend .latest .content .item:nth-child(2n) {
    margin-right: 0;
}

.news .container .wrapper .latest-recommend .latest .content .item .img {
    width: 100%;
    height: 3.125rem;
    /* background-color: #9757B4; */
}

.news .container .wrapper .latest-recommend .latest .content .item .info {
    margin: 0 .5625rem 0 .3rem;
}

.news .container .wrapper .latest-recommend .latest .content .item .info .name {
    width: 100%;
    font-weight: 800;
    font-size: .3125rem;
    color: #000000;
    line-height: 1.2;
    margin-top: .4375rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.news .container .wrapper .latest-recommend .latest .content .item .info .date {
    font-weight: 400;
    font-size: .225rem;
    color: #939393;
    margin-top: .125rem;
}

.news .container .wrapper .latest-recommend .latest .content .item .info .desc {
    font-weight: 400;
    font-size: .23rem;
    color: #797979;
    line-height: 1.3;
    margin-top: .05rem;
}

.news .container .wrapper .latest-recommend .latest .content .item .understand {
    position: absolute;
    bottom: .0625rem;
    right: .25rem;
    font-weight: 300;
    font-size: .1875rem;
    color: #1D1D1D;
}

/* recommend */
.news .container .wrapper .latest-recommend .recommend {
    display: flex;
    flex-direction: column;
}

.news .container .wrapper .latest-recommend .recommend .video {
    display: flex;
    flex-direction: column;
    width: 4.7875rem;
}

.news .container .wrapper .latest-recommend .recommend .title {
    font-family: "ChuangKeTieJinGangTi-2";
    color: white;
    font-size: .5rem;
    line-height: 1;
}

.news .container .wrapper .latest-recommend .recommend .video .content {
    display: flex;
    flex-wrap: wrap;
}

.news .container .wrapper .latest-recommend .recommend .video .content .item {
    position: relative;
    width: 100%;
    height: 2.7375rem;
    /* background-color: #9757B4; */
    border-radius: .225rem;
    margin-bottom: .225rem;
    overflow: hidden;
    transition: transform .3s ease-in-out;
    cursor: pointer;
}

.news .container .wrapper .latest-recommend .recommend .video .content .item:hover {
    transform: scale(1.02);
}

.news .container .wrapper .latest-recommend .recommend .video .content .item .poster {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news .container .wrapper .latest-recommend .recommend .video .content .item .shadow {
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #2D084F 0%, rgba(121,65,172,0) 100%);
}

.news .container .wrapper .latest-recommend .recommend .video .content .item .play-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1.85rem;
    height: 1.8625rem;
    transition: transform .3s ease-in-out;
}

.news .container .wrapper .latest-recommend .recommend .video .content .item:hover .play-icon {
    transform: translate(-50%, -50%) scale(1.1);
}

.news .container .wrapper .latest-recommend .recommend .video .content .item .info {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: #FFFFFF;
    margin: 0 .25rem;
}

.news .container .wrapper .latest-recommend .recommend .video .content .item .info .name {
    font-weight: 800;
    font-size: .2375rem;
}

.news .container .wrapper .latest-recommend .recommend .video .content .item .info .date {
    font-weight: 500;
    font-size: .1375rem;
    margin-bottom: .1rem;
}

.news .container .wrapper .latest-recommend .recommend .article {
    display: flex;
    flex-direction: column;
    width: 4.7875rem;
    margin-top: .5rem;
}

.news .container .wrapper .latest-recommend .recommend .article .content {
    width: 100%;
    height: 5.875rem;
    background: #FFFFFF;
    border-radius: .225rem;
}

.news .container .wrapper .latest-recommend .recommend .article .content .item {
    display: flex;
    align-items: center;
    padding: .22rem .4rem;
    transition: transform .3s ease-in-out;
    cursor: pointer;
}

.news .container .wrapper .latest-recommend .recommend .article .content .item:hover {
    transform: translateX(.125rem);
}

.news .container .wrapper .latest-recommend .recommend .article .content .item .icon {
    width: .175rem;
    height: .2875rem;
}

.news .container .wrapper .latest-recommend .recommend .article .content .item .info {
    display: flex;
    flex-direction: column;
    margin-left: .25rem;
}

.news .container .wrapper .latest-recommend .recommend .article .content .item .info .name {
    font-weight: bold;
    font-size: .25rem;
    color: #000000;
    line-height: 1.2;
}

.news .container .wrapper .latest-recommend .recommend .article .content .item .info .date {
    font-weight: 500;
    font-size: .1375rem;
    color: #000000;
    margin-top: .0625rem;
}

/* game-special */
.news .container .wrapper .game-special {
    display: block;
    width: 15rem;
    margin: -2rem auto 2.8rem auto;
}

.news .container .wrapper .game-special .title {
    font-family: "ChuangKeTieJinGangTi-2";
    color: white;
    font-size: .5rem;
    line-height: 1;
}

.news .container .wrapper .game-special .section-line {
    margin-left: .1125rem;
}

.news .container .wrapper .game-special .content {
    display: flex;
}

.news .container .wrapper .game-special .content .item {
    position: relative;
    width: 4.4625rem;
    height: 2.4375rem;
    border-radius: .15rem;
    background-color: rgb(90, 73, 103);
    margin-right: .25rem;
    overflow: hidden;
    transition: transform .3s ease-in-out;
    cursor: pointer;
}

.news .container .wrapper .game-special .content .item:hover {
    transform: translateY(-0.125rem);
}


.news .container .wrapper .game-special .content .item:nth-last-child() {
    margin-right: 0;
}

.news .container .wrapper .game-special .content .item .img {
    position: absolute;
    width: 100%;
    height: 100%;
}

.news .container .wrapper .game-special .content .item .shadow {
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #2D084F 0%, rgba(121,65,172,0) 100%);
}

.news .container .wrapper .game-special .content .item .info {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    margin: 0 .175rem;
}

.news .container .wrapper .game-special .content .item .info .name {
    /* font-family: "ChuangKeTieJinGangTi-2"; */
    font-weight: 800;
    font-size: .275rem;
    color: #FFFFFF;
    line-height: 1.2;
    margin-bottom: .0625rem;
}

.news .container .wrapper .game-special .content .item .info .date {
    font-weight: 500;
    font-size: .225rem;
    color: #FFFFFF;
    margin-bottom: .2125rem;
}