.flex-center{display:flex;justify-content:center;align-items:center}.z-10000{z-index:10000}.flex-col{flex-direction:column}.radius-12{border-radius:.32rem}.text-center{text-align:center}.mt-20{margin-top:.53333rem}.page-profile .user-detail{gap:.32rem;width:9.12rem;margin:0 auto}.page-profile .user-detail .avatar img{width:1.6rem;height:1.6rem;border-radius:100%;object-fit:cover}.page-profile .user-detail .detail{flex:1}.page-profile .user-detail .detail .name{font-size:.53333rem;font-weight:700;line-height:1;margin-bottom:.26667rem}.page-profile .user-detail .detail .id{color:hsla(0,0%,100%,.6901960784313725);opacity:.75}.page-profile .user-detail .btn-logout{border:.02667rem solid hsla(0,0%,100%,.3137254901960784);height:.8rem;padding:0 .4rem;border-radius:2.66667rem;font-weight:500;color:hsla(0,0%,100%,.6274509803921569);cursor:pointer}.page-profile .vip-box .vip-con{margin-top:.16rem;margin-bottom:.64rem;height:2.56rem;width:9.12rem;margin-left:auto;margin-right:auto;background:url(../img/bg-vip.62a56735.png) 50% no-repeat;background-size:auto 100%;box-sizing:border-box;padding:.85333rem 0 0 .53333rem;color:#521c0c}.page-profile .vip-box .vip-con h3{font-size:.37333rem;margin-bottom:.13333rem}.page-profile .vip-box .vip-con p{opacity:.8}.page-profile .vip-box .free-con{margin-top:.42667rem;margin-bottom:-.53333rem;height:3.2rem;width:9.12rem;margin-left:auto;margin-right:auto;background:url(../img/bg-free.e9f8c7a8.png) 50% no-repeat;background-size:100% auto;box-sizing:border-box;padding:.85333rem 0 0 .53333rem;color:#ffe8de}.page-profile .vip-box .free-con h3{font-size:.42667rem}