@charset "UTF-8";
html, body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC","Helvetica Neue",STHeiti,"Microsoft Yahei",Tahoma,Simsun,sans-serif;
}

html * {
  outline: 0;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
  -webkit-tap-highlight-color: transparent;
}

body, th, td, p, ol, ul, li, dl, dt, dd, a, h1, h2, h3, h4, h5, h6, form, fieldset, input, legend, select, textarea {
  margin: 0;
  padding: 0;
}

input, img, fieldset {
  border: none;
}

input, select, fieldset {
  vertical-align: middle;
}

ul, ol {
  list-style-type: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img {
  max-width: 100%;
  vertical-align: top;
}

i, cite, em, var, address, dfn {
  font-style: normal;
}

a:link {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:active {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

input:focus::-webkit-input-placeholder {
  color: transparent;
}

input:focus:-moz-placeholder, input:focus::-moz-placeholder {
  color: transparent;
}

button, input[type=button], input[type=password], input[type=submit], input[type=text], textarea {
  -webkit-appearance: none;
}

input:-ms-clear {
  display: none;
}

/* clear IE10 X */
input {
  -webkit-user-modify: read-write-plaintext-only;
}

.clear::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
  line-height: 0;
  visibility: hidden;
}

.tl {
  text-align: left;
}

.tc {
  text-align: center;
}

.tr {
  text-align: right;
}

.bc {
  margin: 0 auto;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

.vm {
  vertical-align: middle;
}

.pr {
  position: relative;
}

.pa {
  position: absolute;
}

.none {
  display: none;
}

.block {
  display: block;
}

.f12 {
  font-size: 12px;
}

.f13 {
  font-size: 13px;
}

.f14 {
  font-size: 14px;
}

.f16 {
  font-size: 16px;
}

.f20 {
  font-size: 20px;
}

.fb {
  font-weight: bold;
}

.fn {
  font-weight: normal;
}

.t2 {
  text-indent: 2em;
}

/* ellipsis */
.elli, .userlist-con-ul ul li span.name, .userlist-con-ul ul li span.gift {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.mr6 {
  margin-right: 6px;
}

.w10 {
  width: 10px;
}

.h10 {
  height: 10px;
}

del {
  text-decoration: line-through;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

[v-cloak] {
  display: none;
}

.layout {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

/**layout**/
.layoutbg {
  background: rgba(0, 0, 0, 0.7);
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
}

.child-with-unknown-dimensions {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/**
 * 让子元素绝对居中于父容器
 * 向 Sass mixin 传递了宽度，所以就使用负向 margin 处理水平位置，
 * 使用 CSS transform 处理垂直位置 
 */
.child-with-known-width {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2.22222rem;
  margin-left: -1.11111rem;
  transform: translateY(-50%);
}

/**
 * 让子元素绝对居中于父容器
 * 向 Sass mixin 传递了高度，所以就使用负向 margin 处理垂直位置，
 * 使用 CSS transform 处理水平位置 
 */
.child-with-known-height {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 2.22222rem;
  margin-top: -1.11111rem;
  transform: translateX(-50%);
}

/**
 * 让子元素绝对居中于父容器
 * 向 Sass mixin 传递了高度和宽度，所以就使用负向 margin 处理水平和垂直位置
 */
.child-with-known-dimensions {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2.22222rem;
  height: 2.22222rem;
  margin: -1.11111rem 0 0 -1.11111rem;
}

::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #d89c76;
}

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #d89c76;
}

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #d89c76;
}

:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #d89c76;
}

body {
  max-width: 4rem;
  margin: 0 auto;
  background-color: #3f0f15;
  position: relative;
}

.srpd4_section {
  background: url("../images/srpd4_section.jpg") no-repeat center 0;
  background-size: 100% auto;
  padding-top: 6rem;
  overflow: hidden;
  width: 100%;
  height: 8.88889rem;
  box-sizing: border-box;
}

.rule {
  width: 0.7rem;
  height: 0.25rem;
  border: 0.01111rem solid #fff279;
  display: block;
  font-size: 0.14444rem;
  line-height: 0.24444rem;
  color: #fff;
  text-align: center;
  position: absolute;
  top: 0.15556rem;
  right: 0.13333rem;
  box-sizing: border-box;
  border-radius: 0.05556rem;
}

.startTime {
  width: 1.77778rem;
  height: 0.33333rem;
  background: url(../images/start_time.png) center 0 no-repeat;
  background-size: 100% auto;
  position: absolute;
  right: 0.33333rem;
  top: 0.78889rem;
}

.start_btn {
  width: 100%;
  height: 0.51667rem;
  margin-bottom: 0.66667rem;
  display: block;
}

.focus {
  width: 2.97778rem;
  height: 3.42222rem;
  background: #fff;
  border: 0.01111rem solid #ffd200;
  box-sizing: border-box;
  overflow: hidden;
}

.focus p {
  font-size: 0.15556rem;
  line-height: 0.27778rem;
  color: #9b0407;
  text-align: center;
}

a.close {
  width: 0.26111rem;
  height: 0.26111rem;
  background: url(../images/close.png) center 0 no-repeat;
  background-size: 100% auto;
  float: right;
  margin: 0.12778rem 0.10556rem 0 0;
}

.wxcode {
  width: 1.59444rem;
  height: 1.59444rem;
  margin: 0.44444rem auto 0.22222rem;
}

.wxcode img {
  width: 1.59444rem;
  height: 1.59444rem;
}

.lay-rule, .convert-rule,
.score-use {
  width: 3.2rem;
  height: 3.86111rem;
  background: #fff;
  border: 0.01111rem solid #ffd200;
  box-sizing: border-box;
  overflow: hidden;
}

.convert-rule,
.score-use {
  width: 3.2rem;
  height: 3.06667rem;
}

.rule-con,
.convert-rule-con,
.score-use-con {
  margin-top: 0.27778rem;
  padding: 0.05556rem 0.18333rem 0 0.13889rem;
  font-size: 0.12222rem;
  line-height: 0.25rem;
  color: #92373a;
}

.rule-con h2,
.convert-rule-con h2,
.score-use-con h2 {
  font-size: 0.13889rem;
  font-weight: normal;
}

.rule-con a,
.convert-rule-con a,
.score-use-con a {
  font-weight: bolder;
  text-align: right;
  float: right;
  padding-bottom: 0.11111rem;
}

.rule-con p,
.convert-rule-con p,
.score-use-con p {
  clear: both;
}

.indexbg1 {
  width: 100%;
  height: 4.52778rem;
  background: url(../images/indexbg1.jpg) center 0 no-repeat;
  background-size: 100% auto;
  padding-top: 2.83333rem;
  box-sizing: border-box;
}

.indexbg2 {
  width: 100%;
  height: 3.25rem;
  background: url(../images/indexbg2.jpg) center 0 no-repeat;
  background-size: 100% auto;
  margin-top: -1px;
}

.btn1 {
  width: 0.91111rem;
  height: 0.26667rem;
  background: url(../images/btn1.png) center 0 no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 0.15556rem;
  left: 0.14444rem;
}

.icon-lucky {
  width: 0.87778rem;
  height: 0.27222rem;
  background: url(../images/icon-lucky.png) center 0 no-repeat;
  background-size: 100% auto;
  margin: 0 auto 0.07778rem;
}

.curluck {
  text-align: center;
  color: #ffcc12;
  font-size: 0.12222rem;
}

.progress {
  padding: 0.14444rem 0 0.12222rem;
}

.flag-num {
  width: 3.4rem;
  height: 0.28889rem;
  display: block;
  margin: 0 auto;
}

.flag-num li {
  float: left;
  font-size: 0.10556rem;
  line-height: 0.16667rem;
  color: #e5e7ea;
  padding-left: 0.17778rem;
}

.flag-num li span {
  float: left;
  width: 0.18889rem;
  height: 0.26667rem;
  background: url(../images/icon-heart-1.png) center 0 no-repeat;
  background-size: 100% auto;
}

.flag-num li.flag1 {
  padding-left: 0.33333rem;
}

.flag-num li.active {
  color: #ffdf30;
}

.flag-num li.active span {
  background-image: url("../images/icon-heart.png");
}

.icon-heart {
  width: 0.18889rem;
  height: 0.26667rem;
  background: url(../images/icon-heart.png) center 0 no-repeat;
  background-size: 100% auto;
  display: inline-block;
}

.progress-bg {
  width: 3.4rem;
  height: 0.19444rem;
  background: url(../images/probg.png) center 0 no-repeat;
  background-size: 100% auto;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 0.01111rem 0.02222rem;
  position: relative;
}

.progress-inner {
  width: 3.37778rem;
  height: 0.17222rem;
  background: url(../images/pro-inner.png) center 0 no-repeat;
  background-size: 100% auto;
  background-size: 3.37778rem 0.17222rem;
  border-radius: 2.77778rem;
  overflow: hidden;
}

.star {
  width: 0.43889rem;
  height: 0.41111rem;
  background: url(../images/star.png) center 0 no-repeat;
  background-size: 100% auto;
  position: absolute;
  left: 0;
  top: -0.11111rem;
  transform: translate(-55%, -6%);
}

.progress-line {
  width: 3.37778rem;
  height: 0.17222rem;
  padding: 0.01667rem 0;
  box-sizing: border-box;
}

.progress-line li {
  float: left;
  width: 0.5rem;
  height: 0.13889rem;
  border-right: 0.01111rem solid #d0f14b;
}

.progress-line li:first-child {
  width: 0.44444rem;
}

.progress-dots {
  color: #d1f14c;
  font-size: 0.13333rem;
  font-weight: bolder;
  width: 3.4rem;
  height: 0.11111rem;
  margin: 0 auto;
}

.progress-dots li {
  float: left;
  text-shadow: 0 2px #3d0927;
  padding-left: 0.16667rem;
}

.progress-dots li:nth-child(1) {
  padding-left: 0.33333rem;
}

.lucktips {
  font-size: 0.12222rem;
  color: #fffc69;
  text-align: center;
  padding-top: 0.05556rem;
}

.lucktips i.icon-heart-text {
  position: relative;
  padding-right: 0.22222rem;
}

.lucktips i.icon-heart-text::after {
  position: absolute;
  background: url("../images/icon-heart.png");
  background-size: 0.18889rem 0.26667rem;
  content: '';
  width: 0.18889rem;
  height: 0.26667rem;
  top: -0.05556rem;
}

.lucktips i.icon-gift-text {
  position: relative;
  padding-right: 0.27778rem;
}

.lucktips i.icon-gift-text::after {
  position: absolute;
  background: url("../images/icon-gift.png");
  background-size: 0.26111rem 0.22222rem;
  content: '';
  width: 0.26111rem;
  height: 0.22222rem;
  top: 0;
}

.indexcon2 {
  width: 3.86667rem;
  margin: 0 auto;
  overflow: hidden;
}

.sendGift {
  width: 1.93333rem;
  height: 1.11111rem;
  float: left;
  padding: 0.11111rem 0.15rem;
  box-sizing: border-box;
}

.sendGift a {
  width: 1.63333rem;
  height: 0.48333rem;
  display: block;
}

.sendGift p {
  font-size: 0.12222rem;
  color: #fff16b;
  text-align: center;
  padding-top: 0.11111rem;
}

.getGift {
  width: 1.93333rem;
  height: 1.11111rem;
  float: left;
  padding: 0.11111rem 0.15rem;
  box-sizing: border-box;
}

.getGift a {
  width: 1.63333rem;
  height: 0.48333rem;
  display: block;
}

.getGift p {
  font-size: 0.12222rem;
  color: #fff16b;
  text-align: center;
  padding-top: 0.11111rem;
  vertical-align: top;
}

.getGift i {
  position: relative;
  padding-right: 0.22222rem;
}

.getGift i::after {
  position: absolute;
  top: -0.05556rem;
  content: '';
  width: 0.18889rem;
  height: 0.26667rem;
  background: url("../images/icon-heart.png") no-repeat;
  background-size: 0.18889rem 0.26667rem;
}

.index2tips {
  font-size: 0.14444rem;
  line-height: 0.33333rem;
  color: #fff16b;
  text-align: center;
}

.icon-arrow {
  width: 0.17222rem;
  height: 0.2rem;
  background: url(../images/icon-arrow.png) center 0 no-repeat;
  background-size: 100% auto;
  display: block;
  margin: 0 auto;
}

.get-balloon {
  width: 2.66667rem;
  height: 0.45556rem;
  display: block;
  margin: 0.21111rem auto 0;
}

.tips1,
.tips2,
.tips-text,
.get-bollon {
  width: 3.19444rem;
  height: 3.94444rem;
  background: #fff;
  border: 0.01667rem solid #fcb00c;
  border-radius: 0.05556rem;
  box-sizing: border-box;
}

.tips1 h2,
.tips2 h2,
.tips-text h2,
.get-bollon h2 {
  padding-top: 0.26667rem;
  font-size: 0.21111rem;
  line-height: 0.33333rem;
  color: #ec8d03;
  text-align: center;
}

.tips1 h3,
.tips2 h3,
.tips-text h3,
.get-bollon h3 {
  font-size: 0.22222rem;
  color: #ff9e10;
  text-align: center;
  padding: 0.95556rem 0 0.87778rem;
}

.tips1 h4,
.tips2 h4,
.tips-text h4,
.get-bollon h4 {
  font-size: 0.22222rem;
  color: #ff9e10;
  text-align: center;
  padding: 0.51111rem 0 0.4rem;
}

.btn3 {
  width: 1.72778rem;
  height: 0.66667rem;
  background: url(../images/btn2.png) center 0 no-repeat;
  background-size: 100% auto;
  display: block;
  margin: 0 auto;
}

.btn4, .btn2 {
  width: 1.72778rem;
  height: 0.66667rem;
  background: url(../images/btn2.png) center 0 no-repeat;
  background-size: 100% auto;
  display: block;
}

.panda1 {
  position: absolute;
  width: 3.57778rem;
  height: 3.17778rem;
  background: url(../images/panda1.png) center 0 no-repeat;
  background-size: 100% auto;
  left: 50%;
  margin-left: -1.78889rem;
  top: 0.16667rem;
}

.panda2 {
  position: absolute;
  width: 3.57778rem;
  height: 3.17778rem;
  background: url(../images/panda2.png) center 0 no-repeat;
  background-size: 100% auto;
  left: 50%;
  margin-left: -1.78889rem;
  top: -0.05556rem;
}

.panda3 {
  position: absolute;
  width: 3.57778rem;
  height: 3.17778rem;
  background: url(../images/panda3.png) center 0 no-repeat;
  background-size: 100% auto;
  left: 50%;
  margin-left: -1.78889rem;
  top: -0.05556rem;
}

.panda4 {
  position: absolute;
  width: 3.57778rem;
  height: 3.17778rem;
  background: url(../images/panda4.png) center 0 no-repeat;
  background-size: 100% auto;
  left: 50%;
  margin-left: -1.78889rem;
  top: -0.05556rem;
}

.tips2 p {
  font-size: 0.17778rem;
  color: #880c5b;
  text-align: center;
  font-weight: bolder;
  padding-top: 2.11111rem;
}

.tips2 p span {
  position: relative;
  padding-right: 0.27778rem;
}

.tips2 p span::after {
  position: absolute;
  width: 0.23333rem;
  height: 0.22778rem;
  background: url(../images/heart2.png) center 0 no-repeat;
  background-size: 100% auto;
  content: '';
  top: 0;
}

.btn2 {
  position: absolute;
  bottom: 0.22222rem;
  left: 50%;
  margin-left: -0.86111rem;
}

.get-bollon p {
  font-size: 0.14444rem;
  color: #880c5b;
  text-align: center;
  font-weight: bolder;
}

.heart3 {
  width: 0.60556rem;
  height: 0.84444rem;
  background: url(../images/heart3.png) center 0 no-repeat;
  background-size: 100% auto;
  margin: 0.14444rem auto 0.23889rem;
}

.convertbg1 {
  width: 100%;
  height: 9.11111rem;
  background: url(../images/convertbg1.jpg) center 0 no-repeat;
  background-size: 100% auto;
}

.topbtn {
  width: 3.73889rem;
  height: 0.33333rem;
  margin: 0 auto;
  padding-top: 0.15556rem;
}

.topbtn a {
  width: 0.7rem;
  height: 0.25rem;
  display: block;
  border: 0.01111rem solid #fff279;
  box-sizing: border-box;
  font-size: 0.12222rem;
  line-height: 0.22222rem;
  color: #fff;
  text-align: center;
  border-radius: 0.05556rem;
}

.convert-gift-list1 {
  padding-top: 0.76667rem;
  width: 3.81667rem;
  margin: 0 auto;
}

.gift-con {
  width: 1.05rem;
  height: 1.81667rem;
  margin: 0 0.11111rem;
  text-align: center;
  float: left;
}

.gift-con .gift-bg {
  width: 1.05rem;
  height: 1.43889rem;
  background: url(../images/convert-giftbg.jpg) center 0 no-repeat;
  background-size: 100% auto;
  position: relative;
}

.gift-con .gift-bg h2 {
  font-weight: normal;
}

.gift-con .gift-bg .icon-num {
  width: 0.28889rem;
  height: 0.33333rem;
  background: url(../images/icon-num.png) center 0 no-repeat;
  background-size: 100% auto;
  position: absolute;
  right: -0.05556rem;
  top: -0.05556rem;
  font-size: 0.08889rem;
  color: #ffffff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.gift-con .gift-bg a {
  width: 1.05rem;
  height: 0.27222rem;
  position: absolute;
  left: 0;
  bottom: 0rem;
  text-align: center;
  font-size: 0.16667rem;
  line-height: 0.27222rem;
  color: #3c052f;
  text-align: center;
  font-weight: bolder;
}

.gift-con .gift-bg p.num {
  font-size: 0.1rem;
  line-height: 0.11111rem;
  color: #b0afaf;
  text-align: center;
  position: absolute;
  bottom: 0.27778rem;
  left: 0;
  width: 1.05rem;
  height: 0.16667rem;
}

.gift-con p {
  font-size: 0.11111rem;
  color: #efc334;
  text-align: center;
  padding-top: 0.05556rem;
}

.gift-con p span {
  position: relative;
  padding-right: 0.22222rem;
}

.gift-con p span::after {
  position: absolute;
  top: 0;
  right: 0;
  content: '';
  width: 0.18889rem;
  height: 0.26667rem;
  background: url("../images/icon-heart.png") no-repeat;
  background-size: 0.18889rem 0.26667rem;
}

.gift-con .unchange {
  background: url("../images/convert-giftbg-1.png") center 0 no-repeat;
  background-size: 100% auto;
}

.gift-con .unchange a {
  color: #fff;
}

.gift1 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: center;
  padding: 0.07778rem 0;
}

.gift1 img {
  width: 0.60556rem;
  height: 0.66667rem;
  margin: 0 auto;
}

.gift2 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: center;
  padding: 0.07778rem 0;
}

.gift2 img {
  width: 0.71111rem;
  height: 0.58333rem;
  margin: 0.05556rem auto;
}

.gift3 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: center;
  padding: 0.07778rem 0;
}

.gift3 img {
  width: 0.6rem;
  height: 0.56111rem;
  margin: 0 auto;
}

.gift4 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: center;
  padding: 0.07778rem 0;
}

.gift4 img {
  width: 0.6rem;
  height: 0.56111rem;
  margin: 0 auto;
}

.gift5 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: left;
  padding: 0.07778rem 0 0.07778rem 0.16667rem;
}

.gift5 img {
  width: 0.74444rem;
  height: 0.64444rem;
  margin: 0 auto;
}

.gift6 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: left;
  padding: 0.07778rem 0 0.11111rem 0.04444rem;
}

.gift6 img {
  width: 0.68889rem;
  height: 0.48333rem;
  margin: 0 auto;
}

.gift7 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: left;
  padding: 0.07778rem 0 0.11111rem 0.04444rem;
}

.gift7 img {
  width: 0.65rem;
  height: 0.45rem;
  margin: 0 auto;
}

.gift8 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: left;
  padding: 0.07778rem 0 0.11111rem 0.04444rem;
}

.gift8 img {
  width: 0.65556rem;
  height: 0.46111rem;
  margin: 0 auto;
}

.gift9 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: left;
  padding: 0.07778rem 0 0.11111rem 0.06667rem;
}

.gift9 img {
  width: 0.72778rem;
  height: 0.56667rem;
  margin: 0 auto;
}

.gift10 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: center;
  padding: 0.05556rem 0 0.02778rem;
}

.gift10 img {
  width: 0.21667rem;
  height: 0.78333rem;
  margin: 0 auto;
}

.gift11 h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: center;
  padding: 0.07778rem 0 0.11111rem;
}

.gift11 img {
  width: 0.71667rem;
  height: 0.5rem;
  margin: 0 auto;
}

.convert-gift-list2 {
  padding-top: 0.22222rem;
  width: 3.04444rem;
  margin: 0 auto;
  overflow: hidden;
}

.convert-gift-list2 .gift-con {
  margin: 0 0.23333rem;
}

.convert-gift-list3 {
  width: 3.37222rem;
  height: 1.83333rem;
  background: url(../images/convert-giftbg2.jpg) center 0 no-repeat;
  background-size: 100% auto;
  margin: 0 auto;
  position: relative;
}

.convert-gift-list3 .icon-num2 {
  width: 0.28889rem;
  height: 0.33333rem;
  background: url(../images/icon-num.png) center 0 no-repeat;
  background-size: 100% auto;
  position: absolute;
  left: -0.05556rem;
  top: -0.05556rem;
  font-size: 0.08889rem;
  color: #ffffff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.convert-gift-list3 dl {
  width: 100%;
  display: flex;
}

.convert-gift-list3 dl dt {
  float: left;
  width: 50%;
  padding-top: 0.21111rem;
}

.convert-gift-list3 dl dt h2 {
  font-size: 0.12222rem;
  color: #ffd858;
  text-align: center;
}

.convert-gift-list3 dl dt img {
  width: 0.90556rem;
  height: 0.76111rem;
  display: block;
  margin: 0.06667rem auto;
}

.convert-gift-list3 dl dt p {
  font-size: 0.1rem;
  line-height: 0.22222rem;
  color: #b0afaf;
  text-align: center;
}

.convert-gift-list3 dl dd {
  width: 40%;
  padding-top: 0.22222rem;
}

.convert-gift-list3 dl dd .curnum {
  font-size: 0.11111rem;
  color: #fff;
  text-align: center;
}

.convert-gift-list3 dl dd .gift-heart {
  font-size: 0.11111rem;
  color: #efc334;
  text-align: center;
  padding-top: 0.11111rem;
}

.convert-gift-list3 dl dd .gift-heart span {
  position: relative;
  padding-right: 0.27778rem;
}

.convert-gift-list3 dl dd .gift-heart span::after {
  position: absolute;
  top: 0;
  right: 0;
  content: '';
  width: 0.18889rem;
  height: 0.26667rem;
  background: url("../images/icon-heart.png") no-repeat;
  background-size: 0.18889rem 0.26667rem;
}

.convert-gift-list3 dl dd .lottery-btn {
  width: 0.94444rem;
  height: 0.31111rem;
  background: #efc233;
  display: block;
  margin: 0.16667rem auto 0.31667rem;
  border-radius: 0.05556rem;
  font-size: 0.17778rem;
  line-height: 0.31111rem;
  color: #3c052f;
  text-align: center;
  font-weight: bolder;
}

.convert-gift-list3 dl dd .checklist {
  font-size: 0.13889rem;
  color: #fff;
  text-align: center;
  display: block;
  margin: 0 auto;
}

.convertbg2 {
  width: 100%;
  height: 5.91111rem;
  background: url(../images/convertbg2.jpg) center 0 no-repeat;
  background-size: 100% auto;
}

.btn-group {
  width: 3.86667rem;
  margin: 0 auto 0.11111rem;
  overflow: hidden;
  padding-bottom: 0.27778rem;
  border-bottom: 1px dashed #fedf20;
}

.btn-group a {
  float: left;
  margin: 0.11111rem 0.15rem;
  width: 1.63333rem;
  height: 0.48333rem;
  display: block;
}

.convert-userlist {
  width: 3.63889rem;
  height: 4.35556rem;
  margin: 0 auto;
  background: rgba(0, 0, 0, 0.1);
  padding-top: 0.16667rem;
  box-sizing: border-box;
}

.convert-userlist h2 {
  font-size: 0.16667rem;
  line-height: 0.27778rem;
  color: #fddf29;
  text-align: center;
  width: 1.18333rem;
  height: 0.27222rem;
  border: 0.01111rem solid #6d3e72;
  border-radius: 0.16667rem;
  margin: 0 auto;
  font-weight: normal;
}

.convert-userlist .convert-arrow {
  width: 0.19444rem;
  height: 0.14444rem;
  background: url(../images/convert-arrow.png) center 0 no-repeat;
  background-size: 100% auto;
  margin: 0.03889rem auto 0.09444rem;
}

.userlist-con {
  width: 3.22222rem;
  margin: 0 auto;
  border: 1px solid #4f253d;
  border-left: none;
  border-right: none;
  height: 3rem;
  padding: 0.11111rem 0;
}

.userlist-con-ul {
  position: relative;
  height: 3rem;
  width: 3.22222rem;
  overflow: hidden;
}

.userlist-con-ul ul {
  position: absolute;
  top: 0;
  left: 0;
  width: 3.22222rem;
}

.userlist-con-ul ul li {
  display: flex;
  padding-bottom: 0.11111rem;
  height: 0.27778rem;
  box-sizing: border-box;
}

.userlist-con-ul ul li span.name {
  width: 40%;
  font-size: 0.12222rem;
  color: #bd8dff;
  text-align: right;
}

.userlist-con-ul ul li span.gift {
  width: 60%;
  font-size: 0.12222rem;
  color: #ffea69;
  text-align: left;
}

.gift-userlist,
.get-success,
.get-over,
.get-convert-over,
.go-bind,
.go-convert,
.bollon-under {
  width: 3.43889rem;
  height: 2.35556rem;
  border: 0.01667rem solid #fcb00c;
  border-radius: 0.05556rem;
  background: #fff;
}

.gift-userlist h2,
.get-success h2,
.get-over h2,
.get-convert-over h2,
.go-bind h2,
.go-convert h2,
.bollon-under h2 {
  font-size: 0.22222rem;
  color: #ec8d03;
  text-align: center;
  padding: 0.24444rem 0 0.21111rem;
}

.gift-userlist h3,
.get-success h3,
.get-over h3,
.get-convert-over h3,
.go-bind h3,
.go-convert h3,
.bollon-under h3 {
  font-size: 0.22222rem;
  color: #ec8d03;
  text-align: center;
  padding: 0.61111rem 0 0.55556rem;
}

.gift-userlist h4,
.get-success h4,
.get-over h4,
.get-convert-over h4,
.go-bind h4,
.go-convert h4,
.bollon-under h4 {
  font-size: 0.22222rem;
  color: #ec8d03;
  text-align: center;
  padding: 0.33333rem 0 0.22222rem;
  line-height: 0.44444rem;
}

.gift-userlist h5,
.get-success h5,
.get-over h5,
.get-convert-over h5,
.go-bind h5,
.go-convert h5,
.bollon-under h5 {
  font-size: 0.22222rem;
  color: #ec8d03;
  text-align: center;
  padding: 0.11111rem 0 0.11111rem;
  line-height: 0.38889rem;
}

.gift-userlist h6,
.get-success h6,
.get-over h6,
.get-convert-over h6,
.go-bind h6,
.go-convert h6,
.bollon-under h6 {
  font-size: 0.13889rem;
  color: #575756;
  text-align: center;
  padding: 0.11111rem 0 0.11111rem;
  line-height: 0.27778rem;
}

.gift-userlist p,
.get-success p,
.get-over p,
.get-convert-over p,
.go-bind p,
.go-convert p,
.bollon-under p {
  width: 0.92778rem;
  height: 0.22222rem;
  display: block;
  margin: 0.05556rem auto 0.05556rem;
  border-radius: 0.11111rem;
  background: #b39d77;
  font-size: 0.11111rem;
  line-height: 0.22222rem;
  color: #fff;
  text-align: center;
}

a.bind-btn {
  width: 1.72778rem;
  height: 0.56111rem;
  background: url(../images/bind-btn.png) center 0 no-repeat;
  background-size: 100% auto;
  display: block;
  margin: 0 auto;
}

.close2 {
  width: 0.26667rem;
  height: 0.26667rem;
  background: url(../images/close2.png) center 0 no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: 0.07778rem;
  right: 0.07778rem;
}

.table-title {
  display: flex;
}

.table-title li {
  float: left;
  font-size: 0.13889rem;
  color: #575756;
  text-align: center;
  font-weight: bolder;
  flex: 1;
}

.table-con {
  display: flex;
  padding-top: 0.11111rem;
}

.table-con li {
  float: left;
  font-size: 0.13889rem;
  color: #575756;
  text-align: center;
  flex: 1;
}

a.go-convert-btn {
  width: 1.55556rem;
  height: 0.52222rem;
  background: url(../images/go-convert-btn.png) center 0 no-repeat;
  background-size: 100% auto;
  display: block;
  margin: 0 auto;
}

a.gift-center-btn {
  width: 1.55556rem;
  height: 0.52222rem;
  background: url(../images/gift-center.png) center 0 no-repeat;
  background-size: 100% auto;
  display: block;
  margin: 0 auto;
}

.btn-group2 {
  display: flex;
}

.btn-group2 li {
  flex: 1;
}