.avatar{
  width: 120px;
  height: 120px;
  margin-top: 40px;
  border-radius: 50%;
}
.bio {
    font-family: "PingFangSC-Regular";
    font-size: 20px;
    color: #2E3134;
    font-weight: 400;
    margin-top: 24px;
    width: 400px;
    overflow: hidden;
    white-space: pre-line;
    text-overflow: ellipsis;
    display: -webkit-box; /* 改变元素类型 */
    -webkit-line-clamp: 11; /* 展示的行数 */
    line-clamp: 11;
    -webkit-box-orient: vertical;
  }
  
  .card-wrap {
    margin-top: 40px;
  }
  
  .info {
    margin-top:4px;
    height: 28px;
    line-height: 28px;
    font-family: "PingFangSC-Regular";
    font-size: 20px;
    color: rgba(60, 60, 67, 0.60);
    text-align: center;
    font-weight: 400;
  }
  
  .name {
    margin-top: 16px;
    font-size: 25px;
    color: #2E3134;
    text-align: center;
    font-weight: 500;
    height: 36px;
    line-height: 36px;
  }
  
  .card {
    background: #FFFFFF;
    border-radius: 24px;
    width: 480px;
    display: flex;
    flex-direction: column;
  }
  
  .join-btn {
    background-image: linear-gradient(-45deg, #3487FE 0%, #2F4BE1 100%);
    border-radius: 30px;
    border: none;
    font-family: PingFangSC-Medium;
    font-size: 20px;
    color: #FFFFFF;
    text-align: center;
    font-weight: 500;
    width: 320px;
    height: 60px;
    margin-bottom: 50px;
    margin-top: 60px;
    cursor: pointer;
  }

  .not-found{
    font-family: "PingFangSC-Regular";
    font-size: 20px;
    color: #2E3134;
    text-align: center;
    font-weight: 400;
  }
  
  /*  适配小屏幕 */
  @media screen and (max-width: 600px) {
    .bio {
      font-family: "PingFangSC-Regular";
      font-size: 16px;
      color: #2E3134;
      font-weight: 400;
      margin-top: 16px;
      width: 295px;
      white-space: pre-line;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box; /* 改变元素类型 */
      -webkit-line-clamp: 11; /* 展示的行数 */
      line-clamp: 11;
      -webkit-box-orient: vertical;
    }
  
    .card-wrap {
      margin-top: 16px;
    }
  
    .info {
      height: 22px;
      line-height: 22px;
      font-family: "PingFangSC-Regular";
      font-size: 16px;
      color: rgba(60, 60, 67, 0.60);
      text-align: center;
      font-weight: 400;
    }
  
    .name {
      margin-top: 16px;
      font-size: 20px;
      color: #2E3134;
      text-align: center;
      font-weight: 500;
      height: 28px;
      line-height: 28px;
    }
  
    .card {
      background: #FFFFFF;
      border-radius: 24px;
      width: 343px;
      display: flex;
      flex-direction: column;
    }
  
    .join-btn {
      background-image: linear-gradient(-45deg, #3487FE 0%, #2F4BE1 100%);
      border-radius: 24px;
      border: none;
      font-family: PingFangSC-Medium;
      font-size: 17px;
      color: #FFFFFF;
      text-align: center;
      font-weight: 500;
      width: 295px;
      height: 48px;
      margin-bottom: 24px;
      margin-top: 32px;
      cursor: pointer;
    }
    .not-found{
      font-family: "PingFangSC-Regular";
      font-size: 16px;
      color: #2E3134;
      text-align: center;
      font-weight: 400;
    }
  }