.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: 32rem;display: block;object-fit: cover;}
.tutorial-banner-panel .imgWrap .bottomWrap{position: absolute;margin: 2rem;bottom: 0;left: 0;display: flex;flex-direction: column;row-gap: 1rem;overflow: hidden;width: calc(100% - 4rem);}
.tutorial-banner-panel .imgWrap .bottomWrap .gameType{background-color: #6938EF;border-radius: 0.63rem;width: 5rem;height: 3rem;display: flex;align-items: center;justify-content: center;}
.tutorial-banner-panel .imgWrap .bottomWrap .gameType i{font-size: 2rem;color: #ffffff;}
.tutorial-banner-panel .imgWrap .bottomWrap .title{font-size: 2.5rem;font-weight: 600;color: #ffffff;display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.tutorial-banner-panel .imgWrap .bottomWrap .detailWrap{display: flex;align-items: center;column-gap: 3rem;overflow: hidden;width: 100%;}
.tutorial-banner-panel .imgWrap .bottomWrap .detailWrap p{display: flex;align-items: center;column-gap: 1rem;font-size: 1.5rem;color: #ffffff;font-weight: 500;line-height: 2rem;}
.tutorial-banner-panel .imgWrap .bottomWrap .detailWrap p i{color: #ffffff;font-size: 2rem;}
.tutorial-banner-panel .content{padding: 3rem 2rem;font-size: 1.75rem;color: #364152;line-height: 2rem;}
.tutorial-banner-panel .content h2{font-size: 2.5rem;font-weight: 700;margin-bottom: 2rem;}
.tutorial-banner-panel .content > img{width: 100%;height: auto;display: block;border-radius: 0.63rem;}
.tutorial-banner-panel .content ul{padding-left: 3rem;}
.tutorial-banner-panel .content ul li{margin-bottom: 1.5rem;}

.game-banner{margin-top: 2rem;margin-left: 2rem;margin-right: 2rem;background-color: #ffffff;box-shadow: 0px 2px 2px 0px #11135B0D;border-radius: 2rem;padding: 2rem 2.5rem 2rem 2rem;display: flex;flex-direction: column;row-gap: 2rem;}
.game-banner .game-detail-wrap{display: flex;align-items: flex-start;overflow: hidden;}
.game-banner .game-detail-wrap > img{width: 11rem;height: 11rem;border-radius: 1.25rem;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: 2rem;font-weight: 600;color: #364152;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 100%;margin-bottom: 1rem;}
.game-banner .game-detail-wrap .detailWrap .dev{font-size: 1.5rem;color: #364152;}
.game-banner .game-detail-wrap .detailWrap .tag-list{margin-top: 2rem;display: flex;align-items: center;gap: 0.5rem;}
.game-banner .game-detail-wrap .detailWrap .tag-list p{min-width: 9rem;height: 3rem;background-color: transparent;border-radius: 0.63rem;border: 1px solid #CDD5DF;font-size: 1.5rem;color: #364152;display: flex;align-items: center;justify-content: center;}
.game-banner .game-detail-wrap .rating{margin-left: auto;font-size: 2.5rem;font-weight: 500;color: #6938EF;display: flex;align-items: center;column-gap: 0.5rem;}
.game-banner .game-detail-wrap .rating i{font-size: 2.5rem;color: #6938EF;}
.game-banner .buttonWrap{display: flex;flex-direction: column;row-gap: 1rem;}
.game-banner .buttonWrap a{width: 100%;height: 6rem;border-radius: 0.63rem;display: flex;align-items: center;justify-content: center;column-gap: 1rem;}
.game-banner .buttonWrap a.viewNow{background-color: transparent;border:1px solid #6938EF;}
.game-banner .buttonWrap a.viewNow p{font-size: 2rem;font-weight: 500;color: #6938EF;}
.game-banner .buttonWrap a.viewNow i{font-size: 3rem;color: #6938EF;}
.game-banner .buttonWrap a.downloadBtn{background-color: #6938EF;box-shadow: 0px 4px 4px 0px #483F6B1A; }
.game-banner .buttonWrap a.downloadBtn p{font-size: 2rem;font-weight: 500;color: #ffffff;}
.game-banner .buttonWrap a.downloadBtn i{font-size: 3rem;color: #ffffff;}

.share-panel{margin-top: 6rem;}
.share-panel .container{padding: 0 2rem;}
.share-panel h2{font-size: 2rem;font-weight: 500;color: #364152;margin-bottom: 1.5rem;}
.share-panel .copy-panel{display: flex;align-items: center;border-radius: 0.63rem;border: 1px solid #CDD5DF;height: 4.5rem;overflow: hidden;}
.share-panel .copy-panel .link-panel{flex: 0 0 70%;max-width: 70%;padding: 1.25rem 1.75rem;border-right: 1px solid #CDD5DF;font-size: 1.75rem;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 30%;max-width: 30%;font-size: 1.75rem;color: #6938EF;column-gap: 0.5rem;font-weight: 500;}
.share-panel .copy-panel .copy-btn i{font-size: 2.5rem;color: #6938EF;}

.related-news-panel{margin-top: 6.5rem;}
.related-news-panel .container{padding: 0 2rem;}
.related-news-panel h2{font-size: 2rem;font-weight: 500;color: #364152;margin-bottom: 1.5rem;}
.related-news-panel .related-new-list{display: flex;flex-wrap: wrap;justify-content: space-between;row-gap: 2rem;}
.related-news-panel .related-new-list a{border-radius: 1.25rem;box-shadow: 0px 2px 2px 0px #11135B0D;flex: 0 0 49%;max-width: 49%;}
.related-news-panel .related-new-list a > img{width: 100%;height: 14rem;border-radius: 1.25rem 1.25rem 0 0;object-fit: cover;}
.related-news-panel .related-new-list a .detailWrap{background-color: #ffffff;padding: 2rem;display: flex;flex-direction: column;row-gap: 2rem;width: 100%;overflow: hidden;border-radius: 0 0 1.25rem 1.25rem;}
.related-news-panel .related-new-list a .detailWrap .title{font-size: 1.75rem;font-weight: 500;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: 1.5rem;color: #6938EF;}
.related-news-panel .related-new-list a .detailWrap .typeDateWrap .date{font-size: 1.5rem;color: #364152;}

.column-listing-panel{margin-top: 4rem;}
.column-listing-panel .swiper-container .swiper-slide a {align-items: flex-start;}
.column-listing-panel .swiper-container .swiper-slide a > img{width: 16.75rem;height: 10rem;border-radius: 0.63rem;flex: 0 0 16.75rem;}
.column-listing-panel .swiper-container .swiper-slide a .infoWrap{display: flex;flex-direction: column;row-gap: 1.75rem;}
.column-listing-panel .swiper-container .swiper-slide a .infoWrap .tutorialTop{display: flex;align-items: center;column-gap: 1rem;}
.column-listing-panel .swiper-container .swiper-slide a .infoWrap .tutorialTop p.type{font-size: 1.5rem;color: #6938EF;}
.column-listing-panel .swiper-container .swiper-slide a .infoWrap .tutorialTop span{width: 0.5rem;height: 0.5rem;border-radius: 50%;background-color: #9AA3B2;}
.column-listing-panel .swiper-container .swiper-slide a .infoWrap .tutorialTop .date{font-size: 1.5rem;color: #364152;}
.column-listing-panel .swiper-container .swiper-slide a .infoWrap .title{font-size: 1.75rem;color: #364152;line-height: 2rem;display: -webkit-box; -webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}

.tutorial-banner-panel .content {
    padding: 3rem 2rem;
    font-size: 1.75rem;
    color: #364152;
    line-height: 3rem;
}

.tutorial-banner-panel .content h3 {
    font-size: 2rem;
    color: #6938EF;
    line-height: 4rem;
}

.tutorial-banner-panel .content img {
    width: auto;
    height: auto;
    max-width: 100%;
    display: block;
    margin: 10px auto 0;
}
.tutorialBottomWrap .bottomLeft .content {
    font-size: 0.875rem;
    color: #364152;
    line-height: 2rem;
}