.tutorial-banner-panel{margin-top: 1.5rem;display: flex;flex-direction: column;}
.tutorial-banner-panel .imgWrap{position: relative;}
.tutorial-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%); }
.tutorial-banner-panel .imgWrap > img{width: 100%;height: 37.5rem;display: block;object-fit: cover;}
.tutorial-banner-panel .imgWrap .bottomWrap{position: absolute;margin: 2rem;bottom: 0;left: 50%;display: flex;flex-direction: column;overflow: hidden;width: 93.5rem;transform: translateX(-50%);}
.tutorial-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;margin-bottom: 0.5rem;}
.tutorial-banner-panel .imgWrap .bottomWrap .gameType i{font-size: 1rem;color: #ffffff;}
.tutorial-banner-panel .imgWrap .bottomWrap .title{font-size: 2.25rem;font-weight: 600;color: #ffffff;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;margin-bottom: 1rem;}
.tutorial-banner-panel .imgWrap .bottomWrap .detailWrap{display: flex;align-items: center;column-gap: 2rem;overflow: hidden;width: 100%;}
.tutorial-banner-panel .imgWrap .bottomWrap .detailWrap p{display: flex;align-items: center;column-gap: 0.5rem;font-size: 1.25rem;color: #ffffff;font-weight: 500;line-height: 1.5rem;}
.tutorial-banner-panel .imgWrap .bottomWrap .detailWrap p i{color: #ffffff;font-size: 1.5rem;}

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

.tutorialBottomWrap .bottomLeft .content{font-size: 0.875rem;color: #364152;line-height: 1.25rem;}
.tutorialBottomWrap .bottomLeft .content h2{font-size: 1rem;font-weight: 700;margin-bottom: 1rem;}
.tutorialBottomWrap .bottomLeft .content > img{width: 100%;height: auto;display: block;border-radius: 0.63rem;}
.tutorialBottomWrap .bottomLeft .content ul{padding-left: 3rem;}
.tutorialBottomWrap .bottomLeft .content ul li{margin-bottom: 1.5rem;}

.game-banner{margin-top: 4rem;background-color: #ffffff;box-shadow: 0px 2px 4px 0px #11135B26; border-radius: 1rem;padding: 1.5rem 2rem;display: flex;column-gap: 2rem;align-items: center;}
.game-banner .game-detail-wrap{display: flex;align-items: flex-start;overflow: hidden;}
.game-banner .game-detail-wrap > img{width: 10rem;height: 10rem;border-radius: 1rem;margin-right: 2rem;}
.game-banner .game-detail-wrap .detailWrap{width: 100%;overflow: hidden;display: flex;flex-direction: column;height: 100%;margin-right: 2rem;}
.game-banner .game-detail-wrap .detailWrap h2{font-size: 1.5rem;font-weight: 500;color: #364152;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 100%;margin-bottom: 0.5rem;}
.game-banner .game-detail-wrap .detailWrap .dev{font-size: 0.75rem;color: #364152;}
.game-banner .game-detail-wrap .ratingReviewWrap{margin-top: 1.25rem;display: flex;align-items: center;column-gap: 0.5rem;}
.game-banner .game-detail-wrap .ratingReviewWrap p{font-size: 1.5rem;font-weight: 500;color: #364152;line-height: 1.25rem;}
.game-banner .game-detail-wrap .ratingReviewWrap i{font-size: 1.5rem;color: #6938EF;}
.game-banner .game-detail-wrap .ratingReviewWrap i.empty{color: #CDD5DF;}
.game-banner .game-detail-wrap .detailWrap .tag-list{margin-top: 1.25rem;display: flex;align-items: center;gap: 0.5rem;}
.game-banner .game-detail-wrap .detailWrap .tag-list p{min-width: 3.5rem;height: 2rem;background-color: transparent;border-radius: 0.31rem;border: 1px solid #CDD5DF;font-size: 0.75rem;color: #364152;display: flex;align-items: center;justify-content: center;}
.game-banner .buttonWrap{display: flex;flex-direction: column;row-gap: 1rem;margin-left: auto;}
.game-banner .buttonWrap a{width: 100%;height: 3rem;border-radius: 0.31rem;display: flex;align-items: center;justify-content: center;column-gap: 0.5rem;min-width: 10.5rem;}
.game-banner .buttonWrap a.viewNow{background-color: transparent;border:1px solid #6938EF;}
.game-banner .buttonWrap a.viewNow p{font-size: 1rem;font-weight: 500;color: #6938EF;}
.game-banner .buttonWrap a.viewNow i{font-size: 1.5rem;color: #6938EF;}
.game-banner .buttonWrap a.downloadBtn{background-color: #6938EF;box-shadow: 0px 4px 8px 0px #483F6B26; }
.game-banner .buttonWrap a.downloadBtn p{font-size: 1rem;font-weight: 500;color: #ffffff;}
.game-banner .buttonWrap a.downloadBtn i{font-size: 1.5rem;color: #ffffff;}

.share-panel{margin-top: 2rem;}
.share-panel h2{font-size: 1.25rem;font-weight: 500;color: #364152;margin-bottom: 1.5rem;}
.share-panel .copy-panel{display: flex;align-items: center;border-radius: 0.31rem;border: 1px solid #CDD5DF;height: 2.25rem;overflow: hidden;max-width: 40.5rem;}
.share-panel .copy-panel .link-panel{flex: 0 0 81%;max-width: 81%;padding: 0.63rem 1rem;border-right: 1px solid #CDD5DF;font-size: 0.875rem;color: #364152;overflow: hidden;width: 100%;text-overflow: ellipsis;white-space: nowrap;}
.share-panel .copy-panel .copy-btn{display: flex;align-items: center;justify-content: center;flex: 0 0 19%;max-width: 19%;font-size: 0.875rem;color: #6938EF;column-gap: 0.25rem;font-weight: 500;line-height: 1rem;cursor: pointer;}
.share-panel .copy-panel .copy-btn i{font-size: 1.25rem;color: #6938EF;}

.related-news-panel{margin-top: 2rem;}
.related-news-panel h2{font-size: 1.25rem;font-weight: 500;color: #364152;margin-bottom: 1.5rem;}
.related-news-panel .related-new-list{display: flex;flex-wrap: wrap;justify-content: space-between;gap: 1rem;}
.related-news-panel .related-new-list a{border-radius: 0.63rem;box-shadow: 0px 2px 2px 0px #11135B0D;flex: 0 0 calc(33.33333% - 1rem);max-width: calc(33.33333% - 1rem);}
.related-news-panel .related-new-list a > img{width: 100%;height: 11rem;border-radius: 0.63rem 0.63rem 0 0;object-fit: cover;}
.related-news-panel .related-new-list a .detailWrap{background-color: #ffffff;padding: 1rem;display: flex;flex-direction: column;row-gap: 1rem;width: 100%;overflow: hidden;border-radius: 0 0 0.63rem 0.63rem;}
.related-news-panel .related-new-list a .detailWrap .title{font-size: 0.875rem;font-weight: 400;color: #364152;display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.related-news-panel .related-new-list a .detailWrap .typeDateWrap{display: flex;align-items: center;justify-content: space-between;}
.related-news-panel .related-new-list a .detailWrap .typeDateWrap .type{font-size: 0.75rem;color: #6938EF;}
.related-news-panel .related-new-list a .detailWrap .typeDateWrap .date{font-size: 0.75rem;color: #364152;}

.hot-app-panel .item-listing{display: flex;column-gap: 3.125rem;row-gap: 1.5rem;flex-wrap: wrap;}
.hot-app-panel .item-listing a{flex: 0 0 5.5rem;max-width: 5.5rem;display: flex;flex-direction: column;row-gap: 0.5rem;}
.hot-app-panel .item-listing a img{width: 100%;height: auto;display: block;border-radius: 0.63rem;}
.hot-app-panel .item-listing a h4{font-size: 1rem;font-weight: 500;color: #364152;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.hot-app-panel .item-listing a .rating{display: flex;align-items: center;column-gap: 0.125rem;font-size: 0.875rem;color: #364152;}
.hot-app-panel .item-listing a .rating i{font-size: 0.75rem;color: #6938EF;}

.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing{width: 100%;display: flex;flex-direction: column;row-gap: 1.5rem;}
.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing a{display: flex;align-items: flex-start;column-gap: 1rem;}
.tutorialBottomWrap .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; }
.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap{display: flex;flex-direction: column;row-gap: 1rem;}
.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap{display: flex;align-items: center;column-gap: 0.5rem;}
.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap .newType{font-size: 0.75rem;color: #6938EF;}
.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap span{width: 0.25rem;height: 0.25rem;background-color: #9B8AFB;border-radius: 50%;}
.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap .date{color: #364152;font-size: 0.75rem;}
.tutorialBottomWrap .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;}

.tutorialBottomWrap .bottomRight .hot-topic-panel .hot-topic-list{width: 100%;display: flex;flex-direction: column;row-gap: 1rem;}
.tutorialBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a{width: 100%;border-radius: 0.63rem;position: relative;}
.tutorialBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a img{width: 100%;height: 11rem;object-fit: cover;border-radius: 0.63rem;}
.tutorialBottomWrap .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) }
.tutorialBottomWrap .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;}
.tutorialBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a .bottomWrap .gameType i{font-size: 1.25rem;color: #ffffff;}
.tutorialBottomWrap .bottomRight .hot-topic-panel .hot-topic-list a .bottomWrap > p{font-size: 1rem;font-weight: 500;color: #FFFFFF;}

.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap{
    row-gap: 0.239rem;
    flex: 1;
    width: 0;
    text-align: justify;
}

.tutorialBottomWrap .bottomRight .recommend-news-panel .new-listing a .infoWrap .topWrap .newType{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    width: 0;
}

.related-news-panel .related-new-list a .detailWrap .typeDateWrap .type{
    flex: 1;
    width: 0;
}

.related-news-panel .related-new-list a{
    background: #fff;
}

.tutorialBottomWrap .bottomLeft .content {
    font-size: 0.875rem;
    color: #364152;
    line-height: 2rem;
}

.tutorialBottomWrap .bottomLeft .content h3 {
    color: #6938EF;
    line-height: 3rem;
}