.mine-container{ width: 750rpx; height: 1116rpx; background: #F0F1F5; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: space-between; box-sizing: border-box; } .mine-center{ width: 716rpx; margin: 0 auto; } .mine-info{ margin-top: 80rpx; width: 100%; height: 344rpx; background: #FFFFFF; border-radius: 20rpx; } .mine-bg{ width: 156rpx; height: 156rpx; background: #61CA54; border-radius: 50%; display: flex; justify-content: center; align-items: center; position: absolute; left: 280rpx; top: 18rpx; } .mine-avatar{ width: 138rpx; height: 138rpx; border-radius: 50%; background: gray; } .avatar-image{ width: 100%; height: 100%; border-radius: 50%; } .mine-edit{ position: absolute; top: 110rpx; right: 83rpx; width: 224rpx; height: 46rpx; border-radius: 22rpx; background: #3DBEF9; display: flex; align-items: center; } .edit-image{ width: 24rpx; height: 36rpx; margin: 0 10rpx 6rpx 20rpx; } .edit-img{ width: 100%; height: 100%; } .edit-text{ width: 144rpx; height: 34rpx; color: #FFFFFF; font-size: 24rpx; } .mine-detail{ width: 670rpx; text-align: center; position: absolute; top: 180rpx; } .mine-title{ color: #000000; font-size: 32rpx; } .mine-address{ color: #4C4C4C; font-size: 28rpx; } .mine-line{ width: 674rpx; height: 4rpx; background: #F0F1F5; margin: 37rpx 20rpx; } .mine-category{ width: 716rpx; height: 120rpx; font-size: 28rpx; font-weight: bold; display: flex; justify-content: space-around; align-items: center; position: absolute; top: 300rpx; } .border-right{ display: flex; justify-content: center; align-items: center; font-size: 24rpx; font-weight: lighter; height: 22rpx; border-right: 2rpx solid #D6D6D6; } .flower-count .border-right{ border: none; } .play-count,.point-count,.follow-count,.flower-count{ width: 25%; text-align: center; } .play-img{ width: 28rpx; height: 26rpx; margin-right: 6rpx; } image{ width: 100%; height: 100%; } .play-count{ color: #92D626; } .point-count{ color: #FFA700; } .follow-count{ color: #529BEF; } .flower-count{ color: #EE5750; } .wallet-module{ margin-top: 30rpx; width:716rpx; height: 88rpx; font-size: 34rpx; color: #5E5E5E; background: #FFFFFF; border-radius: 14rpx; } .wallet-center{ width: 680rpx; height: 88rpx; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; } .icon-box{ width: 60rpx; height: 60rpx; margin-right: 16rpx; } .wallet-left{ display: flex; align-items: center; } .wallet-right{ width: 16rpx; height: 28rpx; } .course-module,.group-module,.reading-module,.keep-module,.myfollow-module{ margin-top: 20rpx; width:716rpx; height: 88rpx; font-size: 34rpx; color: #5E5E5E; background: #FFFFFF; border-radius: 14rpx; }