.topic-banner-panel{margin-top: 1.5rem;display: flex;flex-direction: column;}
.topic-banner-panel .imgWrap{position: relative;}
.topic-banner-panel .imgWrap .overlay{position: absolute;width: 100%;height: 100%;top: 0;left: 0;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50.2%, #000000 100%); }
.topic-banner-panel .imgWrap > img{width: 100%;height: 37.5rem;display: block;object-fit: cover;}
.topic-banner-panel .imgWrap .bottomWrap{position: absolute;margin: 2rem auto;bottom: 0;display: flex;flex-direction: column;row-gap: 1rem;overflow: hidden;width: 93.5rem;left: 50%; transform: translateX(-50%);}
.topic-banner-panel .imgWrap .bottomWrap .gameType{background-color: #6938EF;border-radius: 0.31rem;width: 2.5rem;height: 1.625rem;display: flex;align-items: center;justify-content: center;}
.topic-banner-panel .imgWrap .bottomWrap .gameType i{font-size: 1.25rem;color: #ffffff;}
.topic-banner-panel .imgWrap .bottomWrap .title{font-size: 2.25rem;font-weight: 600;color: #ffffff;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.topic-banner-panel .imgWrap .bottomWrap .detailWrap{display: flex;align-items: center;column-gap: 2rem;overflow: hidden;width: 100%;}
.topic-banner-panel .imgWrap .bottomWrap .detailWrap p{display: flex;align-items: center;column-gap: 0.5rem;font-size: 1.25rem;color: #ffffff;font-weight: 500;}
.topic-banner-panel .imgWrap .bottomWrap .detailWrap p i{color: #ffffff;font-size: 1.5rem;}

.topicBottomWrap{display: flex;column-gap: 2rem;width: 93.5rem;margin: 2.5rem auto 0;}
.topicBottomWrap .bottomLeft{display: flex;flex-direction: column;flex: 0 0 60.125rem;max-width: 60.125rem;position: relative;}
.topicBottomWrap .bottomRight{display: flex;flex-direction: column;row-gap: 2rem;padding-left: 2rem;border-left: 1px solid #CDD0DF;height: max-content;}

.topicBottomWrap p.content{font-size: 0.875rem;color: #364152;line-height: 1.25rem;}
.topic-game-listing-panel{margin-top: 3rem;display: flex;flex-wrap: wrap;gap: 1rem;}
.topic-game-listing-panel a{background-color: #ffffff;box-shadow: 0px 2px 4px 0px #11135B26; border-radius: 1rem;width: 29.5rem;height: 8.5rem;display: flex;align-items: flex-start;padding: 1.5rem;}
.topic-game-listing-panel a > img{width: 5.5rem;height: 5.5rem;border-radius: 0.63rem;margin-right: 1.5rem;}
.topic-game-listing-panel a .game-detail{display: flex;flex-direction: column;overflow: hidden;margin-right: 2rem;flex:1;width: 0;}
.topic-game-listing-panel a .game-detail h3{font-size: 1.25rem;font-weight: 500;color: #364152;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.topic-game-listing-panel a .game-detail .game-inner-detail{display: flex;align-items: center;column-gap: 1rem;}
.topic-game-listing-panel a .game-detail .game-inner-detail p{font-size: 0.875rem;color: #364152;}
.topic-game-listing-panel a .game-detail .tag-list{display: flex;align-items: center;column-gap: 0.5rem;}
.topic-game-listing-panel a .game-detail .tag-list p{min-width: 3.5rem;height: 1.5rem;border-radius: 0.31rem;border: 1px solid #CDD5DF;background-color: transparent;font-size: 0.75rem;color: #364152;display: flex;align-items: center;justify-content: center;line-height: 2rem;}
.topic-game-listing-panel a .rating{margin-left: auto;display: flex;align-items: center;column-gap: 0.25rem;font-size: 1.5rem;color: #6938EF;font-weight: 500;line-height: 1.75rem;justify-content: flex-end;}
.topic-game-listing-panel a .rating i{font-size: 1.25rem;color: #6938EF;}
.topic-game-listing-panel a .downloadBtn{display: flex;align-items: center;column-gap: 0.5rem;width: 5.75rem;height: 2.25rem;border-radius: 0.31rem;justify-content: center;background: linear-gradient(180deg, #7A5AF8 0%, #6938EF 100%); box-shadow: 0px 2px 2px 0px #11135B40;margin-top: auto;}
.topic-game-listing-panel a .downloadBtn i{font-size: 1.25rem;color: #ffffff;}
.topic-game-listing-panel a .downloadBtn p{font-size: 500;font-size: 0.875rem;color: #ffffff;line-height: 1.5rem;}
.topic-game-listing-panel a .rightWrap{height: 5.5rem;display: flex;flex-direction: column;}

.topic-game-listing-panel ~ .pagination{margin-top: 3rem;display: flex;justify-content: center;align-items: center;column-gap: 1rem;position: relative;z-index: 1;}
.topic-game-listing-panel ~ .pagination .first-page{padding: 0 .75rem;}
.topic-game-listing-panel ~ .pagination .last-page{padding: 0 .75rem;}
.topic-game-listing-panel ~ .pagination a{background-color: #ffffff;border-radius: 0.25rem;border: 1px solid #CDD5DF;min-width: 2.5rem;min-height: 2.5rem;padding: 0 1rem;display: flex;align-items: center;justify-content: center;font-size: 1rem;color: #364152;column-gap: 0.5rem;line-height: 1.25rem;cursor: pointer;}
.topic-game-listing-panel ~ .pagination a:disabled{opacity: 0.5;cursor: no-drop;}
.topic-game-listing-panel ~ .pagination a i{font-size: 1rem;}
.topic-game-listing-panel ~ .pagination a.active{background-color: #EEEDFC;border-color: #6938EF;}

.bottomAction{position: absolute;bottom: 0;display: flex;justify-content: space-between;width: 100%;}
.bottomAction > p{font-size: 1rem;color: #364152;}
.bottomAction .goPage{display: flex;align-items: center;column-gap: 0.5rem;position: relative;z-index: 1;}
.bottomAction .goPage > p{font-size: 0.875rem;color: #364152;}
.bottomAction .goPage input{width: 3.125rem;height: 2.5rem;border-radius: 0.25rem;background-color: #ffffff;border: 1px solid #CDD5DF;text-align: center;font-size: 1rem;}
.bottomAction .goPage a{margin-left: 0.5rem;font-weight: 700;font-size: 0.875rem;color: #364152;padding-right: 0.5rem;}
.bottomAction .goPage input::-webkit-inner-spin-button, .bottomAction .goPage input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

.topicBottomWrap .bottomRight section{max-width: 22.875rem;}
.topicBottomWrap .bottomRight h2{font-size: 1.25rem;font-weight: 500;color: #364152;}
.topicBottomWrap .bottomRight .hot-tag-panel .tag-list{margin-top: 1.5rem;display: flex;gap: 0.5rem;flex-wrap: wrap;}
.topicBottomWrap .bottomRight .hot-tag-panel .tag-list a{width: 7.25rem;height: 2.5rem;border-radius: 0.63rem;border: 1px solid #CDD5DF;background-color: #ffffff;display: flex;align-items: center;justify-content: center;font-size: 0.875rem;color: #364152;column-gap: 0.25rem;}
.topicBottomWrap .bottomRight .hot-tag-panel .tag-list a i{font-size: 1.25rem;}

.topicBottomWrap .bottomRight .hot-topic-panel .hot-topic-list{width: 100%;display: flex;flex-direction: column;row-gap: 1rem;}
.topicBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a{width: 100%;border-radius: 0.63rem;position: relative;}
.topicBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a img{width: 100%;height: 11rem;object-fit: cover;border-radius: 0.63rem;}
.topicBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a .bottomWrap{width: 100%;border-radius: 0 0 0.63rem 0.63rem;padding: 0.75rem 1rem;position: absolute;bottom: 0;left: 0;display: flex;align-items: center;column-gap: 0.5rem;background-color: #00000080;backdrop-filter: blur(4px) }
.topicBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a .bottomWrap .gameType{background-color: #6938EF;border-radius: 0.31rem;width: 2.5rem;height: 1.625rem;display: flex;align-items: center;justify-content: center;}
.topicBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a .bottomWrap .gameType i{font-size: 1.25rem;color: #ffffff;}
.topicBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a .bottomWrap > p{font-size: 1rem;font-weight: 500;color: #FFFFFF;}

.topicBottomWrap .bottomRight .recommend-news-panel .new-listing{width: 100%;display: flex;flex-direction: column;row-gap: 1.5rem;}
.topicBottomWrap .bottomRight .recommend-news-panel .new-listing a{display: flex;align-items: flex-start;column-gap: 1rem;}
.topicBottomWrap .bottomRight .recommend-news-panel .new-listing a img{width: 8.375rem;height: 5rem;flex: 0 0 8.375rem;border-radius: 0.31rem;box-shadow: 0px 2px 4px 0px #11135B26; }
.topicBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap{display: flex;flex-direction: column;row-gap: 1rem;}
.topicBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap{display: flex;align-items: center;column-gap: 0.5rem;}
.topicBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap .newType{font-size: 0.75rem;color: #6938EF;}
.topicBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap span{width: 0.25rem;height: 0.25rem;background-color: #9B8AFB;border-radius: 50%;}
.topicBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap .date{color: #364152;font-size: 0.75rem;min-width: 30px;}
.topicBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .content{font-size: 0.875rem;color: #364152;display: -webkit-box; -webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}

.topicBottomWrap p.content {
    font-size: 1rem;
    color: #364152;
    line-height: 1.8rem;
}