reader/component/my/my.wxss

.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{
  margin-bottom: 20rpx;
  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;
}