@charset "UTF-8";
@font-face {
  font-family: "pingfang-medium";
  src: url("../../../common/fonts/PingFang-Medium.ttf");
  src: url("../../../common/fonts/PingFang-Medium.ttf") format("woff"), url("../../../common/fonts/PingFang-Medium.ttf") format("truetype"), url("../../../common/fonts/PingFang-Medium.ttf") format("svg");
}
@font-face {
  font-family: "pingfang-bold";
  src: url("../../../common/fonts/PingFang Bold.ttf");
  src: url("../../../common/fonts/PingFang Bold.ttf") format("woff"), url("../../../common/fonts/PingFang Bold.ttf") format("truetype"), url("../../../common/fonts/PingFang Bold.ttf") format("svg");
}
@font-face {
  font-family: "pingfang-regular";
  src: url("../../../common/fonts/PingFang-Regular.ttf");
  src: url("../../../common/fonts/PingFang-Regular.ttf") format("woff"), url("../../../common/fonts/PingFang-Regular.ttf") format("truetype"), url("../../../common/fonts/PingFang-Regular.ttf") format("svg");
}
body {
  display: none;
  background-color: #DFF7F3;
  position: relative;
  font-family: "pingfang-medium";
}

.banner {
  width: 10rem;
  height: 5.7733333333rem;
  margin: auto;
}
.banner img {
  width: 100%;
  height: 100%;
}

.personal-info-wrap {
  position: absolute;
  top: 4.0933333333rem;
  left: 50%;
  transform: translateX(-50%);
  width: 9.0666666667rem;
  height: 2.4rem;
  background: url("../images/info-bg.png") no-repeat 0 0/100% 100%;
}
.personal-info-wrap .personal-info-content {
  width: 100%;
  height: 2.4rem;
  display: flex;
  align-items: center;
}
.personal-info-wrap .personal-info-content .avatar {
  width: 1.3333333333rem;
  height: 1.3333333333rem;
  margin-left: 0.8666666667rem;
  margin-right: 0.2666666667rem;
}
.personal-info-wrap .personal-info-content .avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.personal-info-wrap .personal-info-content .personal-info {
  flex: 1;
  font-size: 0.2666666667rem;
  color: #141949;
}
.personal-info-wrap .personal-info-content .personal-info .nickname {
  font-size: 0.4rem;
  font-weight: 600;
  margin-bottom: 0.24rem;
}
.personal-info-wrap .personal-info-content .personal-info .platform-code,
.personal-info-wrap .personal-info-content .personal-info .invite-code {
  font-family: "pingfang-regular";
  margin-bottom: 0.1066666667rem;
}
.personal-info-wrap .personal-info-content .qr {
  width: 1.4266666667rem;
  height: 1.4266666667rem;
  margin-right: 0.9333333333rem;
}
.personal-info-wrap .personal-info-content .qr .active {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border-radius: 0.16rem;
  border: 0.1333333333rem solid white;
}

.share-btn {
  position: absolute;
  top: 6.2rem;
  left: 50%;
  transform: translateX(-50%);
  width: 4.52rem;
  height: 0.9466666667rem;
  line-height: 0.9466666667rem;
  background: url("../images/share-btn.png") no-repeat 0 0/100% 100%;
  font-family: "pingfang-bold";
  font-size: 0.4rem;
  font-weight: bold;
  color: #DB98FF;
  text-align: center;
}

.rule-wrap {
  width: 9.1333333333rem;
  height: 2.8rem;
  background: url("../images/ruleBg.png") no-repeat 0 0/100% 100%;
  margin: 2.2rem auto 0.6666666667rem;
  padding: 0.96rem 0.3333333333rem 0 0.4rem;
  box-sizing: border-box;
  position: relative;
}
.rule-wrap P {
  color: #141949;
  font-size: 0.3466666667rem;
  margin-bottom: 0.2rem;
  font-weight: bold;
}
.rule-wrap div {
  position: absolute;
  top: 0.2133333333rem;
  left: 0.24rem;
  color: #141949;
  font-size: 0.32rem;
  font-weight: bold;
}

.invite-record-wrap {
  width: 9.1333333333rem;
  height: 4.7066666667rem;
  background: url("../images/record-bg.png") no-repeat 0 0/100% 100%;
  margin: auto;
  padding-top: 1.0533333333rem;
  box-sizing: border-box;
  position: relative;
}
.invite-record-wrap::before {
  content: "邀請記錄";
  color: #141949;
  font-size: 0.32rem;
  font-weight: bold;
  position: absolute;
  left: 0.2533333333rem;
  top: 0.2266666667rem;
}
.invite-record-wrap .text {
  color: #141949;
  font-size: 0.32rem;
  position: absolute;
  font-weight: bold;
  top: 0.2266666667rem;
  left: 0.2533333333rem;
}
.invite-record-wrap::after {
  content: "";
  border: 0.5333333333rem solid transparent;
}
.invite-record-wrap li {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 0.5333333333rem;
}
.invite-record-wrap li .item-avatar {
  width: 1.3333333333rem;
  height: 1.3333333333rem;
  margin-left: 0.4266666667rem;
  margin-right: 0.2533333333rem;
}
.invite-record-wrap li .item-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.invite-record-wrap li .item-info {
  flex: 1;
}
.invite-record-wrap li .item-info .item-nickname {
  font-size: 0.4rem;
  font-weight: 600;
  color: #141949;
  margin-bottom: 0.4533333333rem;
}
.invite-record-wrap li .item-info .item-nickname img {
  width: 0.4rem;
  height: 0.4rem;
}
.invite-record-wrap li .item-info .item-date {
  font-size: 0.2666666667rem;
  color: #141949;
  font-weight: bold;
}
.invite-record-wrap li .isActive {
  position: absolute;
  right: 0.2933333333rem;
  bottom: 0.08rem;
  font-family: "pingfang-regular";
  font-size: 0.32rem;
  color: #141949;
  font-weight: bold;
}
.invite-record-wrap li .isActive.inactive {
  color: #FF6BEF;
}

/*# sourceMappingURL=index.css.map */