/* packageE/loveRanking/loveRanking.wxss */

view,
icon,
text {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.wrapper {
  position: relative;
}

.wrapper .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 12rem;
  background-image: url(https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/axphb_bg@2x.png);
  background-size: cover;
}

.wrapper .content {
  position: absolute;
  width: 100%;
  min-height: calc(100vh - 2.938rem - 11rem);
  top: 11rem;
  left: 0;
  background: #fff;
  border-radius: 1rem 1rem 0 0;
  padding: 1rem;
}

.wrapper .content .userInfo {
  width: 700rpx;
  height: 154rpx;
  padding: 0 1rem;
  background-color: #fff;
  box-shadow: 0.1rem 0.1rem 0.5rem 0.5rem rgba(101, 101, 101, 0.05);
  display: grid;
  grid-template-columns: 80rpx 80rpx 1fr 120rpx 120rpx;
  grid-column-gap: 20rpx;
}

.wrapper .content .userInfo .c1 {
  width: 80rpx;
  color: #018ced;
  font-size: 1rem;
}

/* .wrapper .content .userInfo .c2{} */

.wrapper .content .userInfo .c2 image {
  width: 72rpx;
  height: 72rpx;
  border-radius: 50%;
}

.wrapper .content .userInfo .c3 {
  width: 200rpx;
  height: 154rpx;
  line-height: 154rpx;
  font-size: 0.875rem;
  color: #171732;
  overflow: hidden;/* 超出部分隐藏 */
  white-space: nowrap;/* 不换行 */
  text-overflow: ellipsis;
}

.wrapper .content .userInfo .c4 {
  justify-content: center;
  color: #018ced;
}

.wrapper .content .userInfo .c5 {
  justify-content: center;
  font-size: 0.875rem;
  color: #018ced;
}

.wrapper .content .userInfo .c1,
.wrapper .content .userInfo .c2,
.wrapper .content .userInfo .c4,
.wrapper .content .userInfo .c5 {
  display: flex;
  align-items: center;
}

.wrapper .content .listData {
  padding-top: 2rem;
}

.wrapper .content .listData .item {
  display: grid;
  grid-template-columns: 100rpx 100rpx 1fr 130rpx 90rpx;
  grid-column-gap: 15rpx;
  height: 108rpx;
}

.wrapper .content .listData .item .c1 {
  display: flex;
  align-items: center;
  justify-content: center;
}

.wrapper .content .listData .item .c1 image {
  width: 72rpx;
  height: 72rpx;
}

.wrapper .content .listData .item .c3 {
  letter-spacing: 0.044rem;
  color: #2c2f32;
  width: 200rpx;
}

.wrapper .content .listData .item .c4 {
  letter-spacing: 0.044rem;
  color: #000;
  text-align: center;
}

.wrapper .content .listData .head {
  color: #b4b6b8;
  height: 2rem;
  align-items: flex-start;
}

.wrapper .content .listData .head .c1,
.wrapper .content .listData .head .c2,
.wrapper .content .listData .head .c3,
.wrapper .content .listData .head .c4,
.wrapper .content .listData .head .c5 {
  font-size: 24rpx;
  color: #b4b6b8;
}

.wrapper .content .listData .child .c2 {
  height: 3rem;
}

.wrapper .content .listData .child .c2 image {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
}

.wrapper .content .listData .child .c3 {
  font-size: 30rpx;
}

.wrapper .content .listData .item .c2,
.wrapper .content .listData .item .c5 {
  display: flex;
  align-items: center;
  justify-content: center;
}

.wrapper .content .listData .child .c3,
.wrapper .content .listData .child .c4 {
  line-height: 3rem;
  overflow: hidden;/* 超出部分隐藏 */
  white-space: nowrap;/* 不换行 */
  text-overflow: ellipsis;
}