.hero-banner-panel{margin-top: -4.75rem;}
.hero-banner-panel .hero-banner-slider{position: relative;height: 27rem;overflow: hidden;}
.hero-banner-panel .hero-banner-slider .swiper-slide img{width: 100%;height: auto;display: block;object-fit: cover;}
.hero-banner-panel .hero-banner-slider .hero-swiper-pagination{position: absolute;display: flex;justify-content: center;align-items: center;bottom: 1.25rem;column-gap: 0.5rem;z-index: 1;left: 50%;transform: translateX(-50%);}
.hero-banner-panel .hero-banner-slider .hero-swiper-pagination .swiper-pagination-bullet{width: 1rem;height: 0.5rem;opacity: 1;background-color: #FFFFFF;border-radius: 4px;}
.hero-banner-panel .hero-banner-slider .hero-swiper-pagination .swiper-pagination-bullet-active{width: 2.25rem;height: 0.5rem;background-color: #4AABFF;}

.navigation-panel{margin: 3.125rem 0 2.25rem;}
.navigation-panel .navigation-list{margin: 0 auto;display: flex;align-items: center;justify-content: center;column-gap: 5.75rem;}
.navigation-panel .navigation-list a{display: flex;flex-direction: column;row-gap: 0.75rem;}
.navigation-panel .navigation-list a .imgWrap{width: 5.5rem;height: 5.5rem;border-radius: 50%;display: flex;align-items: center;justify-content: center;}
.navigation-panel .navigation-list a.game-nav .imgWrap img{width: 3.25rem;height: auto;display: block;}
.navigation-panel .navigation-list a.app-nav .imgWrap img{width: 3rem;height: auto;display: block;}
.navigation-panel .navigation-list a.topic-nav .imgWrap img{width: 2.625rem;height: auto;display: block;}
.navigation-panel .navigation-list a.article-nav .imgWrap img{width: 3.25rem;height: auto;display: block;}
.navigation-panel .navigation-list a.game-nav .imgWrap {background: linear-gradient( 0deg, rgb(255,55,63) 0%, rgb(255,148,149) 100%);}
.navigation-panel .navigation-list a.app-nav .imgWrap {background: linear-gradient( 0deg, rgb(45,146,252) 0%, rgb(44,221,253) 100%);}
.navigation-panel .navigation-list a.topic-nav .imgWrap {background: linear-gradient( 0deg, rgb(155,84,255) 0%, rgb(203,168,255) 100%);}
.navigation-panel .navigation-list a.article-nav .imgWrap {background: linear-gradient( 0deg, rgb(255,130,11) 0%, rgb(255,193,92) 100%);}
.navigation-panel .navigation-list a p{text-align: center;font-size: 1.5rem;color: #404040;font-weight: 500;}

.hot-article-panel{margin-bottom: 1.25rem;}
.hot-article-panel .hot-article-wrap{display: flex;align-items: center;column-gap: 1.25rem;padding: 1.25rem 1.5rem 1.5rem;background-color: #F7F9FF;border-radius: 1rem;}
.hot-article-panel .hot-article-wrap > img{width: 4.5rem;height: auto;display: block;position: relative;z-index: 1;}
.hot-article-panel .hot-article-wrap .article-detail{display: flex;flex-direction: column;row-gap: 0.125rem;position: relative;}
.hot-article-panel .hot-article-wrap .article-detail h4{font-size: 1.625rem;color: #404040;font-weight: bold;}
.hot-article-panel .hot-article-wrap .article-detail p{font-size: 1.375rem;color: #A8A8A8;font-weight: 500;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
.hot-article-panel .hot-article-wrap .article-detail::before{position: absolute;content: "";width: 2.75rem;height: 2.75rem;border-radius: 50%;background-color: #DAE9FD;top: 50%;transform: translateY(-50%);left: -4.875rem;}

.hot-app-panel{margin-bottom: 1.875rem;}
.hot-app-panel .app-listing{display: flex;flex-wrap: wrap;column-gap: 2.625rem;row-gap: 2rem;}
.hot-app-panel .app-listing a{width: 8.75rem;flex: 0 0 8.75rem;max-width: 8.75rem;display: flex;flex-direction: column;align-items: center;}
.hot-app-panel .app-listing a img{width: 8.75rem;height: 8.75rem;border-radius: 2rem;display: block;}
.hot-app-panel .app-listing a p{margin: 0.313rem 0 0.625rem;text-align: center;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 1.75rem;color: #404040;font-weight: 500;width: 100%;}
.hot-app-panel .app-listing a span{width: 7.188rem;max-width: 7.188rem;height: 3rem;line-height: 3rem;text-align: center;background-color: #F3F3F3;border-radius: 1.5rem;font-size: 1.5rem;color: #999999;}

.app-recommend-panel{padding-left: 1.875rem;margin-bottom: 1.875rem;}
.app-recommend-panel .recommend-app-list{display: flex;column-gap: 1.25rem;overflow-x: scroll;}
.app-recommend-panel .recommend-app-list::-webkit-scrollbar{height: 0;}
.app-recommend-panel .recommend-app-list a{display: flex;align-items: center;column-gap: 1.25rem;padding: 1.5rem;background-color: #F3F3F3;border-radius: 1.875rem;width: 25.625rem;flex: 0 0 25.625rem;max-width: 25.625rem;}
.app-recommend-panel .recommend-app-list a .imgWrap{position: relative;width: 8.75rem;height: 8.75rem;flex: 0 0 8.75rem;max-width: 8.75rem;}
.app-recommend-panel .recommend-app-list a .imgWrap img{width: 100%;height: 100%;border-radius: 2rem;}
.app-recommend-panel .recommend-app-list a .imgWrap .recommend-icon{display: flex;align-items: center;justify-content: center;width: 4.125rem;height: 2rem;border-radius: 0.5rem;background: linear-gradient( 0deg, rgb(255,95,89) 0%, rgb(255,151,98) 100%);color: #ffffff;font-size: 1.125rem;position: absolute;top: -0.5rem;left: -0.5rem;}
.app-recommend-panel .recommend-app-list a .app-detail{display: flex;flex-direction: column;overflow: hidden;}
.app-recommend-panel .recommend-app-list a .app-detail h4{font-size: 1.75rem;font-weight: 500;color: #404040;margin-bottom: 0.63rem;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.app-recommend-panel .recommend-app-list a .app-detail > p:nth-child(1){font-size: 1.75rem;font-weight: 500;color: #404040;margin-bottom: 0.63rem;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.app-recommend-panel .recommend-app-list a .app-detail p.content{font-size: 1.375rem;color: #999999;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;margin-bottom: 1rem;}
.app-recommend-panel .recommend-app-list a .app-detail .dateUpdate{font-size: 1.375rem;color: #999999;}
.app-recommend-panel .recommend-app-list a .app-detail .dateUpdate span{color: #666666;}
.app-recommend-panel .titleWrap{padding-right: 1.875rem;}
.app-recommend-panel .recommend-app-list a:last-child{margin-right: 1.875rem;}

.famous-app-panel{margin-bottom: 0.63rem;}
.famous-app-panel .famous-app-list{display: flex;flex-direction: column;row-gap: 1.25rem;}
.famous-app-panel .famous-app-list > div{display: flex;align-items: center;padding-bottom: 1.25rem;border-bottom: 1px solid #F3F3F3;}
.famous-app-panel .famous-app-list > div:last-child{border-bottom: none;}
.famous-app-panel .famous-app-list > div > a img{width: 8.75rem;height: 8.75rem;flex: 0 0 8.75rem;max-width: 8.75rem;border-radius: 2rem;margin-right: 1.25rem;}
.famous-app-panel .famous-app-list div .detailWrap{display: flex;flex-direction: column;row-gap: 1rem;max-width: 17.313rem;flex: 0 0 17.313rem;margin-right: 1rem;}
.famous-app-panel .famous-app-list div .detailWrap h4{font-size: 1.875rem;font-weight: 500;color: #404040;}
.famous-app-panel .famous-app-list div .detailWrap .tag-list{display: flex;align-items: center;flex-wrap: wrap;gap: 0.63rem;}
.famous-app-panel .famous-app-list div .detailWrap .tag-list a{border-radius: 0.31rem;background-color: #DDF8F1;font-size: 1.25rem;color: #17A79F;padding: 0.31rem 0.5rem;}
.famous-app-panel .famous-app-list div .detailWrap .tag-list a:nth-child(2){background-color: #E9F8FF;color: #3C69E4;}
.famous-app-panel .famous-app-list div .detailWrap .tag-list a:nth-child(3){background-color: #FFEFEB;color: #F75A53;}
.famous-app-panel .famous-app-list div .detailWrap .dateUpdate{font-size: 1.5rem;color: #999999;}
.famous-app-panel .famous-app-list div .viewBtn{margin-left: auto;width: 7.188rem;height: 3rem;line-height: 3rem;text-align: center;flex: 0 0 7.188rem;max-width: 7.188rem;color: #999999;font-size: 1.5rem;background-color: #F3F3F3;border-radius: 1.5rem;}

.famous-app-panel .famous-app-list > a{display:block;padding-bottom: 1.25rem;border-bottom: 1px solid #F3F3F3;}
.famous-app-panel .famous-app-list > a:last-child{border-bottom: 0;}
.famous-app-panel .famous-app-list > a > img{width: 8.75rem;height: 8.75rem;border-radius: 2rem;margin-right: 1.25rem;float: left;}
.famous-app-panel .famous-app-list > a > div{width:24rem;margin-right: 1rem;float: left;}
.famous-app-panel .famous-app-list > a > div > h4{font-size: 1.875rem;font-weight: 500;color: #404040;margin-bottom: 1rem;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.famous-app-panel .famous-app-list > a > div > p{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 1.5rem;color: #999999;}
.famous-app-panel .famous-app-list > a > div > p:nth-child(1){font-size: 1.875rem;font-weight: 500;color: #404040;margin-bottom: 1rem;}
.famous-app-panel .famous-app-list > a > div > p:nth-child(2){margin-bottom: 1rem;}
.famous-app-panel .famous-app-list > a > div > p:nth-child(4){display: none;}
.famous-app-panel .famous-app-list > a > span{width: 7.188rem;height: 3rem;line-height: 3rem;text-align: center;flex: 0 0 7.188rem;max-width: 7.188rem;color: #999999;font-size: 1.5rem;background-color: #F3F3F3;border-radius: 1.5rem;display: block;float: left;margin-top: 3rem;}

.ranking-panel{margin-bottom: 1.875rem;}
.ranking-panel .ranking-cont{    display:flex;
    flex-direction: column;
    background-color: #4AABFF;
    border-radius: 2.5rem 2.5rem 0 0;}
.ranking-panel .ranking-cont .rank-tab-buttons{display: flex
;
    align-items: center;
    justify-content: center;
    column-gap: 4.25rem;
    padding: 1.5rem 0;}
.ranking-panel .ranking-cont .rank-tab-buttons li{    font-size: 1.75rem;
    color: #ffffff80;
    position: relative;}
.ranking-panel .ranking-cont .rank-tab-buttons li.active{    font-weight: 900;
    color: #ffffff;}
.ranking-panel .ranking-cont .rank-tab-buttons li.active::after{    bottom: -0.63rem;
    left: 50%;
    transform: translateX(-50%);
    width: 2rem;
    height: 0.5rem;
    border-radius: 0.25rem;
    background-color: #FFF100;
    position: absolute;
    content: "";}

.ranking-panel .ranking-cont .rank-tab-cont{}
.ranking-panel .ranking-cont .rank-tab-cont > div{display: none;background-color: #FFFFFF;
    border-radius: 2.5rem 2.5rem 0 0;
    padding: 0.75rem 0 0 0.5rem;
    flex-direction: column;
    position: relative;}
.ranking-panel .ranking-cont .rank-tab-cont > div.active{display:block;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a{display: flex
;
    align-items: center;
    padding: 1.25rem 0;
    border-bottom: 1px solid #f3f3f3;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a > i{font-size: 1.875rem;
    font-weight: 900;
    color: #A8A8A8;
    margin-right: 1.625rem;
    width: 2rem;
    text-align: center;
    flex: 0 0 2rem;
    max-width: 2rem;font-style: normal;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a > img{    width: 8.75rem;
    height: 8.75rem;
    flex: 0 0 8.75rem;
    max-width: 8.75rem;
    margin-right: 1.25rem;border-radius: 2rem;
    display: none;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a > div{display: flex
;
    width: 28.75rem;
    flex: 0 0 28.75rem;
    max-width: 28.75rem;
    overflow: hidden;
    justify-content: space-between;
    align-items: center;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a > div h4{    font-size: 1.875rem;
    font-weight: 500;
    color: #404040;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 14.5rem;}

.ranking-panel .ranking-cont .rank-tab-cont > div > a > div p{font-size: 1.5rem;
    color: #999999;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a > div p:nth-child(1){font-size: 1.875rem;
    font-weight: 500;
    color: #404040;
    max-width: 14.5rem;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a > div p:nth-child(2){display: none;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a > span{    margin-left: auto;
    min-width: 7.188rem;
    height: 3rem;
    flex: 0 0 7.188rem;
    max-width: 7.188rem;
    border-radius: 1.5rem;
    background-color: #F3F3F3;
    text-align: center;
    line-height: 3rem;
    font-size: 1.5rem;
    color: #999999;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a.top-three > img{display: block;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a.top-three > div{    flex-direction: column;
    justify-content: unset;
    align-items: unset;
    width: 17.25rem;
    flex: 0 0 17.25rem;
    max-width: 17.25rem;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a.top-three > div > h4{margin-bottom: 1rem;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a.top-three > div > p:nth-child(1){margin-bottom: 1rem;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a.top-three > div > p:nth-child(2){margin-bottom: 1rem;display: block;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a:nth-child(1) > i{    color: #FF4C34;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a:nth-child(2) > i{    color: #4AABFF;}
.ranking-panel .ranking-cont .rank-tab-cont > div > a:nth-child(3) > i{    color: #FFC64A;}

.topic-panel{margin-bottom: 1.875rem;padding-left: 1.875rem;}
.topic-panel .titleWrap{padding-right: 1.875rem;}
.topic-panel .titleWrap .tab-buttons{display: flex;align-items: center;}
.topic-panel .titleWrap .tab-buttons li{font-size: 1.375rem;color: #999999;position: relative;}
.topic-panel .titleWrap .tab-buttons li.active{font-weight: 900;color: #4AABFF;}
.topic-panel .titleWrap .tab-buttons li:nth-child(1){padding-right: 1.25rem;}
.topic-panel .titleWrap .tab-buttons li:nth-child(2){padding-left: 1.25rem;}
.topic-panel .titleWrap .tab-buttons li:nth-child(1)::after{position: absolute; content: ""; right: 0; top: 50%; transform: translateY(-50%) rotate(22deg); width: 1px; height: 70%; background-color: #999999;}
.topic-panel .tab-contents .tab-content{display: none;flex-direction: column;row-gap: 1.875rem;}
.topic-panel .tab-contents .tab-content.active{display: flex;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap{display: flex;column-gap: 1rem;overflow-x: scroll;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap::-webkit-scrollbar{height: 0;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap a{width: 15rem;flex: 0 0 15rem;max-width: 15rem;height: 10.875rem;position: relative;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap a:last-child{margin-right: 1.875rem;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap a img{width: 100%;height: 100%;border-radius: 1.25rem;object-fit: cover;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap a .infoWrap{position: absolute;bottom: 0;border-radius: 0 0 1.25rem 1.25rem;display: flex;align-items: flex-end;column-gap: 1.25rem;background-color: #F7B3A0;padding: 0.63rem 1.125rem 0.63rem 0.875rem;justify-content: space-between;width: 15rem;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap a .infoWrap h4{font-size: 1.5rem;color: #ffffff;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-weight: normal;width: 100%;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap a .infoWrap p{font-size: 1.25rem;color: #ffffff;}
.topic-panel .tab-contents .tab-content .topic-banner-wrap a .infoWrap p:nth-child(1){font-size: 1.5rem;color: #ffffff;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-weight: normal;width: 100%;}
.topic-panel .tab-contents .tab-content .topic-listing{display: flex;flex-wrap: wrap;gap: 1.25rem;padding-right: 1.875rem;}
.topic-panel .tab-contents .tab-content .topic-listing a{width: calc(50% - 0.625rem);height: 3.348rem;background-color: #EBF5FF;border-radius: 0.5rem;display: flex;align-items: center;justify-content: center;padding: 0 1.25rem;column-gap: 1rem;}
.topic-panel .tab-contents .tab-content .topic-listing a .title{font-size: 1.5rem;color: #4AABFF;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;}
.topic-panel .tab-contents .tab-content .topic-listing a .amount{font-size: 1.25rem;color: #4AABFF;}

.article-panel{margin-bottom: 0.63rem;}
.article-panel .tab-buttons{display: flex;column-gap: 0.63rem;align-items: center;margin-bottom: 1.75rem;}
.article-panel .tab-buttons li{height: 3.5rem;line-height: 3.5rem;background-color: #EBF5FF;border-radius: 0.5rem;text-align: center;padding: 0 2.125rem;font-size: 1.75rem;font-weight: 500;color: #4AABFF;}
.article-panel .tab-buttons li.active{background-color: #4AABFF;color: #FFFFFF;}
.article-panel .tab-contents .tab-content{display: none;flex-direction: column;}
.article-panel .tab-contents .tab-content.active{display: flex;}
.article-panel .tab-contents .tab-content a{display: flex;justify-content: space-between;column-gap: 2.25rem;padding: 1.25rem 0;border-bottom: 1px solid #eeeeee;}
.article-panel .tab-contents .tab-content a:last-child{border-bottom: none;}
.article-panel .tab-contents .tab-content a .detailWrap{display: flex;flex-direction: column;overflow: hidden;flex: 0 0 28.5rem;width: 28.5rem;max-width: 28.5rem;justify-content: space-between;}
.article-panel .tab-contents .tab-content a .detailWrap h4{font-size: 1.75rem;color: #404040;font-weight: 500;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.article-panel .tab-contents .tab-content a .detailWrap .bottomWrap{display: flex;align-items: center;column-gap: 1.75rem;}
.article-panel .tab-contents .tab-content a .detailWrap .bottomWrap p{font-size: 1.5rem;color: #999999;}
.article-panel .tab-contents .tab-content a img{width: 12rem;flex: 0 0 12rem;max-width: 12rem;height: 8.75rem;border-radius: 0.5rem;object-fit: cover;}

.hot-tag-panel{margin-bottom: 1.875rem;}
.hot-tag-panel .tag-list{display: flex;flex-wrap: wrap;gap: 1.25rem;}
.hot-tag-panel .tag-list a{width: 9.75rem;flex: 0 0 9.75rem;max-width: 9.75rem;text-align: center;height: 4rem;line-height: 4rem;background-color: #F5FAFF;border-radius: 0.75rem;font-size: 1.75rem;color: #666666;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}

.friendship-link-panel .link-list{display: flex;flex-wrap: wrap;row-gap: 1rem;justify-content: space-between;}
.friendship-link-panel .link-list a{width: 13.75rem;flex: 0 0 13.75rem;max-width: 13.75rem;height: 3.5rem;line-height: 3.25rem;text-align: center;background-color: #ffffff;border: 2px solid #E5E5E5;border-radius: 1.75rem;font-size: 1.5rem;color: #666666;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}