.medalStore { .header { width: 100%; padding: 60rpx 46rpx; box-sizing: border-box; background-color: #30C866; display: flex; justify-content: space-between; align-items: center; color: white; .left { .title { font-size: 42rpx; font-weight: bold; } .tips { margin-top: 16rpx; font-size: 24rpx; } } .right { font-size: 54rpx; } } .body { background-color: #F2F6FC; padding-bottom: 4rpx; .medalsBox { width: 100%; margin-bottom: 22rpx; background-color: white; .title { padding: 25rpx 38rpx; box-sizing: border-box; font-size: 32rpx; font-weight: bold; color: #000; } .medalList { display: flex; align-items: center; flex-wrap: wrap; .medal { width: 33%; margin-bottom: 30rpx; text-align: center; .medalImg { width: 184rpx; height: 169rpx; } .name { display: inline-block; text-align: center; padding: 6rpx 40rpx; font-size: 20rpx; border-radius: 50rpx; background-color: #FDD126; } } } } } }