.top-content-page{margin-top: 1.25rem;}
.top-content-page .top-content-wrap{background-color: #ffffff;border-radius: 1.875rem;padding: 1.875rem;}
.top-content-page .top-content-wrap .top-tabs-wrap{width: 100%;height: 3.75rem;border-radius: 1rem;display: flex;align-items: center;justify-content: space-between;background-color: #F7F7FB;}
.top-content-page .top-content-wrap .top-tabs-wrap a{width: 33.3333%;flex: 0 0 33.3333%;max-width: 33.3333%;padding: 0 1rem;text-align: center;height: 100%;line-height: 3.75rem;border-radius: 1rem;font-size: 1.75rem;font-weight: 500;color: #949494;position: relative;z-index: 1;overflow: hidden;}
.top-content-page .top-content-wrap .top-tabs-wrap a.active{background: linear-gradient(90deg, #65F3CE 0%, #52BBEC 100%);font-weight: bold;color: #FFFFFF;}
.top-content-page .top-content-wrap .top-tabs-wrap a.active::after{content: "";position: absolute;right: 0rem;bottom: -0.25rem;width: 4.313rem;height: 4rem;background-image: url(../images/home/rankIcon.webp);background-position: center;background-repeat: no-repeat;background-size: cover;z-index: -1;}
.top-content-page .top-content-wrap .top-three-wrap{margin-top: 3.25rem;display: flex;align-items: center;column-gap: 1.875rem;}
.top-content-page .top-content-wrap .top-three-wrap > a{width: calc(33.3333% - 1.3rem);flex: 0 0 calc(33.3333% - 1.3rem);max-width: calc(33.3333% - 1.3rem);position: relative;display: flex;flex-direction: column;}
.top-content-page .top-content-wrap .top-three-wrap > a .imgWrap{width: 6.25rem;height: 6.25rem;position: relative;margin-left: 1.125rem;z-index: 1;}
.top-content-page .top-content-wrap .top-three-wrap > a .imgWrap img{width: 100%;height: 100%;border-radius: 50%;object-fit: cover;object-position: center;}
.top-content-page .top-content-wrap .top-three-wrap > a .imgWrap::after{content: "";position: absolute;top: -1rem;right: -0.375rem;background-image: url(../images/top/rank1Crown.webp);background-position: center;background-repeat: no-repeat;background-size: contain;width: 2.188rem;height: 2.188rem;}
.top-content-page .top-content-wrap .top-three-wrap > a .rankNo{position: absolute;top: 1.125rem;right: 0.25rem;width: 3.125rem;height: auto;object-fit: cover;object-position: center;}
.top-content-page .top-content-wrap .top-three-wrap > a .rank-detail{width: 100%;height: 11.875rem;border: 1px solid #FFDDD2;background: linear-gradient(180deg, #FFEEE9 16.24%, #FFFFFF 100%);padding: 3.875rem 0.625rem 1.625rem;display: flex;flex-direction: column;row-gap: 0.875rem;border-radius: 1.875rem 3.75rem 1.875rem 1.875rem;margin-top: -2.75rem;}
.top-content-page .top-content-wrap .top-three-wrap > a .rank-detail .appName{font-size: 1.625rem;font-weight: bold;line-height: 2rem;color: #FF6A3C;height: 4rem;text-align: center;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.top-content-page .top-content-wrap .top-three-wrap > a .rank-detail .typeSize{display: flex;align-items: center;font-size: 1.25rem;color: #949494;line-height: 1.25;column-gap: 0.5rem;justify-content: center;}
.top-content-page .top-content-wrap .top-three-wrap > a .rank-detail .typeSize i{width: 1px;height: 1.125rem;background-color: #949494;}
.top-content-page .top-content-wrap .top-three-wrap > a:nth-child(2) .imgWrap::after{background-image: url(../images/top/rank2Crown.webp);}
.top-content-page .top-content-wrap .top-three-wrap > a:nth-child(3) .imgWrap::after{background-image: url(../images/top/rank3Crown.webp);}
.top-content-page .top-content-wrap .top-three-wrap > a:nth-child(2) .rank-detail{border: 1px solid #FFE2A4;background: linear-gradient(180deg, #FFF6DF 22.55%, #FFFFFF 100%); }
.top-content-page .top-content-wrap .top-three-wrap > a:nth-child(3) .rank-detail{border: 1px solid #DADADA;background: linear-gradient(180deg, #EFEFEF 22.06%, #FFFFFF 100%); }
.top-content-page .top-content-wrap .top-three-wrap > a:nth-child(2) .rank-detail .appName{color: #FFA231;}
.top-content-page .top-content-wrap .top-three-wrap > a:nth-child(3) .rank-detail .appName{color: #807B7B;}

.top-content-page .top-content-wrap .rank-listing{display: flex;flex-direction: column;margin-top: 1.5rem;}
.top-content-page .top-content-wrap .rank-listing > a{padding: 1rem 0;display: flex;align-items: center;column-gap: 1.25rem;position: relative;}
.top-content-page .top-content-wrap .rank-listing > a .rankNo{width: 3.125rem;height: 3.125rem;background-position: center;background-repeat: no-repeat;background-size: cover;}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(1) .rankNo{background-image: url(../images/home/4.webp);}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(2) .rankNo{background-image: url(../images/home/5.webp);}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(3) .rankNo{background-image: url(../images/home/6.webp);}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(4) .rankNo{background-image: url(../images/home/7.webp);}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(5) .rankNo{background-image: url(../images/home/8.webp);}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(6) .rankNo{background-image: url(../images/home/9.webp);}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(7) .rankNo{background-image: url(../images/home/10.webp);}
.top-content-page .top-content-wrap .rank-listing > a > img{width: 7.188rem;flex: 0 0 7.188rem;max-width: 7.188rem;height: 7.188rem;border-radius: 1.875rem;object-fit: cover;object-position: center;}
.top-content-page .top-content-wrap .rank-listing > a .detailWrap{display: flex;flex-direction: column;row-gap: 0.5rem;width: 18.75rem;overflow: hidden;}
.top-content-page .top-content-wrap .rank-listing > a .detailWrap .appName{font-size: 1.875rem;color: #333333;font-weight: 500;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.top-content-page .top-content-wrap .rank-listing > a .detailWrap > p{font-size: 1.5rem;color: #949494;}
.top-content-page .top-content-wrap .rank-listing > a::after{content: "";position: absolute;right: 0;bottom: 0;width: calc(100% - 12.813rem);height: 1px;background-color: #0000001A;}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(7){padding: 1rem 0 0;}
.top-content-page .top-content-wrap .rank-listing > a:nth-child(7)::after{display: none;}