body { padding-bottom: .55rem; }

.top-nav { display: flex; justify-content: space-between; align-items: center; }

.top-nav .back { background: url(../image/btn-left-icon.png) no-repeat center top; width: .17rem; height: .3rem; background-size: 100%; }

.top-nav .share { background: url(../image/btn-transpond-icon.png) no-repeat center top; width: 0.32rem; height: 0.32rem; background-size: 100%; }

.top-nav .title { font-size: 0.32rem; margin-left: .1rem; }

.change-user { display: flex; margin-top: .35rem; font-size: 0.24rem; justify-content: space-between; align-items: center; }

.change-user .role { display: flex; align-items: center; }

.change-user .role .role-name { max-width: 1.38rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.change-user .role .change-role { background: url(../image/icon-role-arrow.png) no-repeat center top; background-size: 100%; margin-left: .1rem; width: .3rem; height: .3rem; font-size: 0; }

.change-user .end-time { color: #000; display: flex; align-items: center; }

.change-user .end-time .icon-time-clock { background: url(../image/icon-time-clock.png) no-repeat center top; background-size: 100%; width: .3rem; height: .3rem; }

.change-user .end-time .no-group { font-size: .2rem; border: 0.02rem solid #FF5858; box-sizing: border-box; color: #FF5858; display: flex; align-items: center; justify-content: center; border-radius: 0.04rem; width: 1.18rem; height: .42rem; margin-left: 0.2rem; }

.change-user .end-time span { font-size: .22rem; color: #292929; margin-left: .1rem; }

.change-user .btn-box { display: flex; align-items: center; }

.change-user .btn-box a { font-size: .2rem; border: 0.02rem solid #955f1b; box-sizing: border-box; color: #955f1b; display: flex; align-items: center; justify-content: center; border-radius: 0.04rem; width: 1.18rem; height: .42rem; }

.change-user .btn-box .btn-record { margin-right: .1rem; }

.invite-cnt { display: flex; align-items: center; margin-top: .32rem; background-color: #fef8ef; box-sizing: border-box; padding: 0 .22rem; border-radius: 0.04rem; width: 6.86rem; height: 1.16rem; }

.invite-cnt .zudui-slogn { width: 3.65rem; height: 1.08rem; margin-top: .05rem; }

.invite-cnt .invite-text { display: flex; align-items: center; justify-content: center; border: 0.02rem solid #955d22; border-radius: 0.04rem; width: 1.67rem; height: .66rem; margin-left: 1.06rem; }

.invite-cnt .invite-text .icon-invite { background: url(../image/icon-invite.png) no-repeat center top; background-size: 100%; width: .22rem; height: .22rem; }

.invite-cnt .invite-text span { font-size: 0.24rem; color: #955d22; margin-left: 0.1rem; }

.invite-cnt-bg .team-status { margin-left: .26rem; flex: 1; }

.invite-cnt-bg .team-status .team-info .level-txt { font-size: 0.26rem; font-weight: 500; color: #2b2d2c; }

.invite-cnt-bg .team-status .team-info .exp-txt { font-size: 0.22rem; color: #768196; }

.invite-cnt-bg .team-status .team-info { display: flex; justify-content: space-between; align-items: center; }

.invite-cnt-bg .team-status .team-progress { height: 0.08rem; width: 3.7rem; background: #d3d3d3; border-radius: 0.04rem; margin-top: .14rem; position: relative; }

.invite-cnt-bg .team-status .team-progress .team-progress-bg { max-width: 3.7rem; position: absolute; top: 0; left: 0; background: #e8c380; height: 0.08rem; width: 10%; border-radius: 0.04rem; }

.invite-cnt-bg .header-pic { font-size: 0; }

.invite-cnt-bg .header-pic img:last-child { margin-right: 0; }

.invite-cnt-bg .header-pic .myself-img, .invite-cnt-bg .header-pic .team-img, .invite-cnt-bg .header-pic .original-img { display: inline-block; vertical-align: top; width: .55rem; height: .55rem; border-radius: 50%; margin-right: 0.08rem; box-sizing: border-box; border-radius: 50%; border: 0.02rem solid #fff; }

.invite-cnt-bg .header-pic .team-img.on { border: 0.02rem solid #e8c380; }

.team-box { height: 0; overflow: hidden; transition: height 0.5s ease-out; background-color: #fef8ef; padding: 0 .23rem; box-sizing: border-box; margin-top: -0.02rem; border-radius: 0.04rem; width: 6.86rem; }

.team-box.on { height: 1.4rem; }

.team-box .icon-down { background: url(../image/icon-open.png) no-repeat center top; width: .25rem; height: .2rem; background-size: 100%; margin: .2rem auto 0; }

.team-con { display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; border-top: 0.01rem solid #d1ceca; padding-top: .28rem; }

.team-con img { width: .55rem; height: .55rem; border-radius: 50%; box-sizing: border-box; border: 0.01rem solid #fff; }

.team-con .team-left { display: flex; align-items: center; }

.team-con .team-info { margin-left: .16rem; font-size: .22rem; color: #292929; }

.team-con .team-garde { display: flex; align-items: center; font-size: .22rem; color: #768196; margin-top: 0.08rem; }

.team-con .team-garde p { margin-right: .12rem; }

.team-con .btn-look { font-size: .2rem; border: 0.02rem solid #955f1b; width: 1.18rem; height: .42rem; color: #955f1b; display: flex; justify-content: center; align-items: center; border-radius: 0.04rem; }

.invite-tips { display: flex; justify-content: space-between; font-size: 0.23rem; background: #cccccc; height: 0.5rem; margin-top: .25rem; line-height: 0.5rem; border-radius: 0.15rem; padding: 0 0.25rem; }

.reward-tips { display: flex; justify-content: space-between; padding: 0 .3rem; margin-top: .2rem; }

.reward-tips .reward-tips-title { font-size: .32rem; color: #2b2d2c; font-weight: 500; }

.reward-tips .reward-tips-title span { font-size: .22rem; color: #768196; margin-left: .12rem; font-weight: normal; }

.reward-tips .quickly-reward { font-size: .2rem; border: 0.02rem solid #955f1b; color: #955f1b; display: flex; align-items: center; justify-content: center; border-radius: 0.04rem; width: 1.18rem; height: .42rem; }

.reward-tips .quickly-reward.on { background-color: #fff; color: #768196; border: 0.02rem solid #768196; }

.sign-box { margin-top: .32rem; }

.sign-box .sign-top { display: flex; justify-content: space-between; align-items: center; }

.sign-box .sign-top .sign-title { font-size: .32rem; font-weight: 500; color: #2b2d2c; }

.sign-box .sign-top .btn-inform { font-size: .2rem; border: 0.02rem solid #955f1b; width: 1.18rem; height: .42rem; color: #955f1b; display: flex; justify-content: center; align-items: center; border-radius: 0.04rem; }

.sign-box .sign-top .btn-inform.un { background-color: #f8f8f8; color: #768196; border: none; }

.sign-box .sign-top .sign-left { display: flex; align-items: center; }

.sign-box .sign-top .sign-team-box { font-size: 0; margin-left: 0.06rem; }

.sign-box .sign-top .sign-team-box .team-avatar { display: inline-block; vertical-align: top; margin-right: .1rem; position: relative; }

.sign-box .sign-top .sign-team-box .team-avatar.on .icon-informed { display: block; }

.sign-box .sign-top .sign-team-box .team-avatar img { width: .32rem; height: .32rem; border-radius: 50%; background-color: #f0f0f0; box-sizing: border-box; border-radius: 100%; }

.sign-box .sign-top .sign-team-box .team-avatar .icon-informed { background: url(../image/icon-informed.png) no-repeat center center; background-size: 100%; width: .32rem; height: .32rem; background-color: rgba(0, 0, 0, 0.4); position: absolute; top: 0rem; left: 0; border-radius: 50%; display: none; }

.sign-box .sign-top .sign-team-box .team-avatar:last-child { margin-right: 0; }

.sign-box .sign-container { margin: .1rem auto 0; background-color: #f4f4f4; padding: .24rem .26rem .2rem; box-sizing: border-box; border-radius: 0.05rem; position: relative; width: 6.86rem; height: 1.91rem; }

.sign-box .sign-container .sign-important-lott { position: absolute; top: 0; right: 0; background: linear-gradient(to bottom, #fffdf8, #fffefd, #fffffe); height: 1.91rem; width: 1.4rem; box-sizing: border-box; text-align: center; z-index: 6; }

.sign-box .sign-container .sign-important-lott.on .sign-lott-name { display: flex; }

.sign-box .sign-container .sign-important-lott .sign-lott-name { position: absolute; top: .62rem; right: .5rem; display: flex; align-items: center; justify-content: center; font-size: .16rem; color: #fff; height: .3rem; border-radius: 0.05rem; background: rgba(0, 0, 0, 0.8); display: none; z-index: 44; padding: 0 .1rem; white-space: nowrap; }

.sign-box .sign-container .sign-important-lott .sign-lott-name::after { content: ''; background: url(../image/icon-xjd.png) no-repeat center top; width: .1rem; height: .1rem; background-size: 100%; position: absolute; top: -0.1rem; right: .15rem; }

.sign-box .sign-container .sign-important-lott .sign-important-item { width: .8rem; height: .8rem; background-color: #f4f4f4; border-radius: 0.05rem; display: flex; justify-content: center; align-items: center; margin: .24rem auto 0; box-sizing: border-box; position: relative; }

.sign-box .sign-container .sign-important-lott .sign-important-item .icon-received { background: url(../image/icon-received.png) no-repeat center center; background-size: 100%; width: .8rem; height: .8rem; background-color: rgba(0, 0, 0, 0.3); border-radius: 0.05rem; position: absolute; top: 0rem; left: 0; display: none; }

.sign-box .sign-container .sign-important-lott .sign-important-item.over .icon-received { display: block; }

.sign-box .sign-container .sign-important-lott img { width: .6rem; height: .6rem; object-fit: contain; margin: 0 auto 0; display: block; }

.sign-box .sign-container .sign-important-lott span { font-size: .2rem; color: #000; margin-top: .44rem; display: block; }

.sign-box .sign-award { width: 5.14rem; height: 1.6rem; display: flex; flex-direction: column; overflow-x: auto; white-space: nowrap; position: relative; -webkit-overflow-scrolling: touch; }

.sign-box .sign-con { display: flex; align-items: center; width: 100%; }

.sign-box .sign-item { text-align: center; margin-right: .22rem; position: relative; }

.sign-box .sign-item .icon-received { background: url(../image/icon-received.png) no-repeat center center; background-size: 100%; width: .8rem; height: .8rem; background-color: rgba(0, 0, 0, 0.3); border-radius: 0.05rem; position: absolute; top: 0rem; left: 0; display: none; }

.sign-box .sign-item.over .icon-received { display: block; }

.sign-box .sign-item.over .day-item .icon-dot { background-color: #e8c380; }

.sign-box .sign-item.over .day-item span { color: #a09f9f; }

.sign-box .sign-item.on .sign-lott { border: 0.02rem solid #e8c482; }

.sign-box .sign-item .sign-lott { background-color: #fff; width: .8rem; height: .8rem; box-sizing: border-box; border-radius: 0.05rem; display: flex; justify-content: center; align-items: center; position: relative; }

.sign-box .sign-item .sign-lott.on .sign-lott-name { display: flex; }

.sign-box .sign-item .sign-lott .sign-lott-name { position: absolute; top: .8rem; left: 0; display: flex; align-items: center; justify-content: center; font-size: .16rem; color: #fff; height: .3rem; border-radius: 0.05rem; background: rgba(0, 0, 0, 0.8); display: none; z-index: 44; padding: 0 .1rem; }

.sign-box .sign-item .sign-lott .sign-lott-name::after { content: ''; background: url(../image/icon-xjd.png) no-repeat center top; width: .1rem; height: .1rem; background-size: 100%; position: absolute; top: -0.1rem; left: .15rem; }

.sign-box .sign-item img { width: .6rem; height: .6rem; object-fit: contain; }

.sign-box .sign-item:last-child { margin-right: 0; }

.sign-box .sign-item:last-child .sign-lott .sign-lott-name { left: -1.48rem; }

.sign-box .sign-item:last-child .sign-lott .sign-lott-name::after { content: ''; left: auto; right: .15rem; }

.sign-box .pro-con { width: 28.34rem; height: .1rem; background-color: #d3d3d3; border-radius: .1rem; position: absolute; top: 1rem; left: 0; }

.sign-box .pro-con .pro-bar { position: absolute; top: 0; left: 0; background-color: #e8c380; width: 10%; display: block; max-width: 100%; height: 100%; border-radius: .1rem; }

.sign-box .day-item { text-align: center; margin-top: .18rem; }

.sign-box .day-item.on .icon-dot { background-color: #e8c380; }

.sign-box .day-item .icon-dot { border-radius: 50%; width: 0.14rem; height: 0.14rem; background-color: #d3d3d3; display: block; margin: 0 auto 0; position: relative; z-index: 2; }

.sign-box .day-item span { font-size: .2rem; color: #333333; display: block; margin-top: .12rem; }

.sign-box .sign-btn-box { display: flex; justify-content: space-between; align-items: center; margin-top: .15rem; box-sizing: border-box; }

.sign-box .sign-btn-box a { background-color: #ffeed0; color: #955d22; font-size: .24rem; border-radius: 0.04rem; height: .66rem; display: flex; align-items: center; justify-content: center; }

.sign-box .sign-btn-box a.on { background-color: #f8f8f8; color: #768196; }

.sign-box .sign-btn-box .btn-get-lott { width: 5.50rem; }

.sign-box .sign-btn-box .btn-add-sign { width: 1.32rem; position: relative; }

.sign-box .sign-btn-box .btn-add-sign .sgin-num { position: absolute; top: -0.12rem; right: -0.08rem; width: .15rem; height: .15rem; background-color: #ff4444; font-size: .16rem; color: #fff; border-radius: 50%; text-align: center; font-style: normal; padding: 0.05rem; display: flex; justify-content: center; align-items: center; }

.tab-box { width: 7.5rem; margin-left: -.3rem; position: sticky; top: 0; padding-top: 0.6rem; box-sizing: border-box; padding-bottom: 0.2rem; }

.tab-box .tab-con { width: 4.32rem; display: flex; align-items: center; justify-content: space-between; margin: 0 auto 0; height: .8rem; }

.tab-box a { font-size: .28rem; color: #2d2f2e; position: relative; font-weight: 500; }

.tab-box a.active { color: #c0a472; }

.tab-box a.active::after { content: ''; position: absolute; width: .57rem; height: .15rem; bottom: -.25rem; left: 0; background: url(../image/icon-active.png) no-repeat center top; background-size: 100%; }

.tab-box i { position: absolute; top: -0.02rem; right: -0.14rem; width: .12rem; height: .12rem; background-color: #ff4444; border-radius: 50%; }

.tab-box .lott-num { top: -0.12rem; right: -0.22rem; width: .15rem; height: .15rem; background-color: #ff4444; font-size: .16rem; color: #fff; border-radius: 50%; text-align: center; font-style: normal; padding: 0.05rem; display: flex; justify-content: center; align-items: center; }

.tab-box .tab-nav { display: none; }

.tab-box .tab-nav.active { display: flex; }

.tab-box .task-nav { justify-content: space-between; padding: 0 .3rem; margin-top: .1rem; }

.tab-box .task-nav .task-day-title { font-weight: 500; font-size: .32rem; color: #2b2d2c; }

.tab-box .task-nav .task-day-title span { font-size: .18rem; color: #768196; margin-left: .12rem; font-weight: normal; }

.tab-box .task-nav .task-quickly-reward { font-size: .2rem; border: 0.02rem solid #955f1b; color: #955f1b; display: flex; align-items: center; justify-content: center; border-radius: 0.04rem; width: 1.18rem; height: .42rem; box-sizing: border-box; }

.tab-container { width: 100%; box-sizing: border-box; }

.lott-header-field { font-size: 0.24rem; display: flex; justify-content: space-around; align-items: center; width: 6.86rem; height: .56rem; background: url(../image/lott-bg.png) no-repeat center top; background-size: 100%; }

.lott-header-field .person-lott, .lott-header-field .group-lott { position: relative; }

.lott-header-field .person-lott i, .lott-header-field .group-lott i { position: absolute; top: -0.02rem; right: -.14rem; width: 0.12rem; height: 0.12rem; background-color: #ff4444; border-radius: 50%; }

.lott-header-field .person-lott { color: #484a4b; }

.lott-header-field .group-lott { color: #c4943d; }

.lott-header { background: url(../image/lott-item-bg.png) no-repeat center top; background-size: 100%; width: 6.86rem; height: 1.64rem; box-sizing: border-box; margin-top: 0.1rem; position: relative; }

.lott-header.arrive-un .level-unlocked { display: block; }

.lott-header .level-unlocked { display: none; position: absolute; top: 0; left: 0; background: rgba(51, 51, 51, 0.2); width: 6.86rem; height: 1.64rem; border-radius: 0.05rem; }

.lott-header .item-goods-img { width: 3.1rem; }

.lott-header .item-goods-img span { font-size: .16rem; display: block; margin-top: .1rem; text-align: center; }

.lott-header .item-goods-img.un .item-goods-bg { position: relative; }

.lott-header .item-goods-img.un .item-goods-bg::before { content: ''; position: absolute; top: 0; letter-spacing: 0; background: url(../image/icon-unlock.png) no-repeat center top; background-size: 100%; width: .94rem; height: .95rem; border-radius: 0.05rem; box-sizing: border-box; }

.lott-header .item-goods-img.on span { color: #484a4b; }

.lott-header .item-goods-img.on .item-goods-bg { position: relative; }

.lott-header .item-goods-img.on .item-goods-bg::before { content: ''; position: absolute; top: 0; left: 0; background: url(../image/icon-get.png) no-repeat center top; background-size: 100%; width: .94rem; height: .95rem; border-radius: 0.05rem; box-sizing: border-box; }

.lott-header .item-goods-img.on .item-goods-bg::after { content: ''; position: absolute; top: .2rem; left: .24rem; background: url(../image/icon-gou.png) no-repeat center top; background-size: 100%; width: .5rem; height: .55rem; box-sizing: border-box; }

.lott-header .person-lott-box .item-goods-bg { background: url(../image/person-lott-bg.png) no-repeat center top; background-size: 100%; width: .94rem; height: .95rem; margin: 0 auto 0; }

.lott-header .person-lott-box span { color: #484a4b; }

.lott-header .group-lott-box .item-goods-bg { background: url(../image/group-lott-bg.png) no-repeat center top; background-size: 100%; width: .94rem; height: .95rem; margin: 0 auto 0; }

.lott-header .group-lott-box span { color: #a15801; }

.lott-header .item-goods-bg { display: flex; justify-content: center; align-items: center; }

.lott-header .item-goods-bg img { width: .68rem; height: .67rem; }

.lott-header .circle { background: url(../image/icon-circle-bg.png) no-repeat center top; background-size: 100%; width: 1.34rem; height: 1.34rem; display: flex; align-items: center; font-size: .2rem; color: #8d6337; align-items: center; justify-content: center; position: relative; }

.lott-header .circle.un::before { content: ''; position: absolute; top: .11rem; left: .11rem; background: url(../image/icon-unget.png) no-repeat center top; background-size: 100%; width: 1rem; height: 1rem; }

.lott-header .circle.un::after { content: ''; position: absolute; top: .42rem; left: 0; right: 0; margin: 0 auto; background: url(../image/icon-lock.png) no-repeat center top; background-size: 100%; width: .31rem; height: .4rem; }

.lott-header .circle p { margin-top: -0.05rem; margin-left: 0.02rem; }

.lott-header .item-goods { display: flex; justify-content: center; padding: .2rem 0; box-sizing: border-box; }

.task-item { margin-top: .2rem; }

.task-item .task-nav { display: flex; justify-content: space-between; }

.task-item .task-nav .task-day-title { font-weight: 500; font-size: .32rem; color: #2b2d2c; }

.task-item .task-nav .task-day-title span { font-size: .18rem; color: #768196; margin-left: .12rem; letter-spacing: 0; font-weight: normal; }

.task-item .task-nav .task-quickly-reward { font-size: .2rem; border: 0.02rem solid #955f1b; color: #955f1b; display: flex; align-items: center; justify-content: center; border-radius: 0.04rem; width: 1.18rem; height: .42rem; box-sizing: border-box; }

.task-item .task-nav .task-quickly-reward.on { background-color: #fff; color: #768196; border: 0.02rem solid #768196; }

.task-item .task-content { display: flex; justify-content: space-between; align-items: center; margin-top: .2rem; border-bottom: 0.01rem solid #ededed; padding-bottom: .2rem; color: #292929; font-size: .24rem; }

.task-item .task-content .task-content-title-ext { font-size: .22rem; color: #768196; }

.task-item .task-content.on .task-status { background: #f8f8f8; color: #768196; border: none; }

.task-item .task-content.get .task-content-field .task-exp-num { background: #ffeed0; color: #955d22; }

.task-item .task-content.get .task-content-field .extra-icon-box { background: #ffeed0; }

.task-item .task-content.get .task-status { background: #fff2dc; color: #955d22; border: none; }

.task-item .task-content.get .task-content-field .extra-icon-box .extra-icon { background: url(../image/icon-extra-lott.png) no-repeat center top; background-size: 100%; }

.task-item .task-content .task-status { width: 1.18rem; height: .42rem; background-color: #fff; color: #768196; font-size: 0.2rem; border-radius: 0.04rem; text-align: center; border: 0.02rem solid #768196; box-sizing: border-box; display: flex; justify-content: center; align-items: center; }

.task-item .task-content .task-content-field { display: flex; align-items: center; height: .96rem; }

.task-item .task-content .task-content-field .extra-icon-box { display: flex; align-items: center; justify-content: center; background: #ececec; border-radius: 50%; width: .71rem; height: .71rem; }

.task-item .task-content .task-content-field .extra-icon-box .extra-icon { background: url(../image/icon-extra-lott-un.png) no-repeat center top; background-size: 100%; width: .45rem; height: .45rem; }

.task-item .task-content .task-content-field .task-exp-num { background: #ececec; border-radius: 50%; font-size: 0.28rem; width: .71rem; height: .71rem; box-sizing: border-box; display: flex; align-items: center; justify-content: center; color: #768196; font-weight: 700; }

.task-item .task-content .task-content-field .task-content-desc { margin-left: .15rem; line-height: 0.35rem; }

.task-item .task-content .task-content-right { display: flex; align-items: center; position: relative; }

.task-item .task-content .task-content-right img { width: .5rem; height: .5rem; }

.task-item .task-content .task-content-right .task-status { position: relative; margin-left: .2rem; }

.task-item .task-content .task-content-right .task-status span { position: absolute; top: -0.06rem; right: 0; background-color: #ff4444; font-size: .16rem; color: #fff; width: .2rem; height: .2rem; border-radius: 50%; }

.task-item .task-content .task-content-right .lott-img-name { position: absolute; top: .62rem; right: 1.4rem; display: none; align-items: center; justify-content: center; font-size: .16rem; color: #fff; height: .3rem; border-radius: 0.05rem; background: rgba(0, 0, 0, 0.8); z-index: 44; padding: 0 .1rem; white-space: nowrap; }

.task-item .task-content .task-content-right .lott-img-name.on { display: flex; }

.task-item .task-content .task-content-right .lott-img-name::after { content: ''; background: url(../image/icon-xjd.png) no-repeat center top; width: .1rem; height: .1rem; background-size: 100%; position: absolute; top: -0.1rem; right: .15rem; }

.task-item .task-content:last-child { border-bottom: none; }

.draw-nav { display: flex; font-size: .22rem; justify-content: space-between; margin-top: 0.26rem; padding: 0 .3rem; }

.draw-nav .draw-nav-title { display: flex; align-items: center; }

.draw-nav .draw-nav-title .draw-title { font-size: .32rem; font-weight: 500; color: #2b2d2c; }

.draw-nav .draw-nav-title .draw-nav-record { font-size: .2rem; border: 0.02rem solid #955f1b; box-sizing: border-box; color: #955f1b; display: flex; align-items: center; justify-content: center; border-radius: 0.04rem; width: 1.18rem; height: .42rem; margin-left: .16rem; }

.draw-nav .draw-num { color: #2b2d2c; font-size: .26rem; display: flex; align-items: center; }

.draw-nav .draw-num .icon-wh { background: url(../image/icon-wh.png) no-repeat center top; background-size: 100%; display: inline-block; width: .22rem; height: .22rem; margin-left: 0.07rem; }

.tab3 .draw-box { position: relative; width: 6.86rem; height: 7.14rem; margin: .1rem auto 0; }

.tab3 .draw-list { width: 6.86rem; height: 7.14rem; position: relative; }

.tab3 .draw-list .draw-field { display: inline-block; vertical-align: top; position: absolute; width: 2.07rem; height: 2.15rem; background: url(../image/draw-bg.png) no-repeat center top; background-size: 100%; text-align: center; box-sizing: border-box; padding-top: .3rem; }

.tab3 .draw-list .draw-field.on { background: url(../image/draw-bg-on.png) no-repeat center top; background-size: 100%; }

.tab3 .draw-list .draw-field .draw-field-goods { background: url(../image/draw-item-bg.png) no-repeat center top; background-size: 100%; width: .94rem; height: .95rem; margin: 0 auto 0; box-sizing: border-box; padding-top: .14rem; }

.tab3 .draw-list .draw-field .draw-field-goods img { vertical-align: middle; width: .7rem; height: .7rem; }

.tab3 .draw-list .draw-field .draw-field-name { width: 100%; color: #a15801; font-size: 0.2rem; margin-top: .22rem; }

.tab3 .draw-list .draw-field0 { top: 0; left: 0; }

.tab3 .draw-list .draw-field1 { top: 0; left: 2.39rem; }

.tab3 .draw-list .draw-field2 { top: 0; left: 4.77rem; }

.tab3 .draw-list .draw-field3 { top: 2.47rem; left: 4.77rem; }

.tab3 .draw-list .draw-field4 { top: 4.94rem; left: 4.77rem; }

.tab3 .draw-list .draw-field5 { top: 4.94rem; left: 2.39rem; }

.tab3 .draw-list .draw-field6 { top: 4.94rem; left: 0; }

.tab3 .draw-list .draw-field7 { top: 2.47rem; left: 0; }

.tab3 .draw-btn-box { position: absolute; top: 50%; left: 50%; margin-top: -.83rem; margin-left: -1.04rem; }

.tab3 .draw-btn-box a { width: 2.07rem; margin-bottom: .32rem; background-color: #ffeed0; color: #955d22; font-size: .24rem; border-radius: 0.04rem; height: .65rem; display: flex; align-items: center; justify-content: center; }

.tab-content { display: none; }

.tab-content.active { display: block; }

.dialog { outline: none; border: none; position: relative; display: none; width: 4.9rem; background-color: #fff; border-radius: 0.1rem; box-sizing: border-box; padding-bottom: .3rem; background-color: #fff; }

.dialog .dia-title { font-size: .28rem; height: .8rem; display: flex; align-items: center; justify-content: center; color: #333333; border-bottom: 0.01rem solid #ededed; }

.dialog .dia-lott-box { margin: .36rem auto 0; text-align: center; width: 4.3rem; }

.dialog .dia-lott-box .dia-lott-item { background: url(../image/draw-item-bg.png) no-repeat center top; background-size: 100%; width: .94rem; height: .95rem; display: flex; justify-content: center; align-items: center; margin: 0 auto; }

.dialog .btn-get { display: flex; justify-content: center; align-items: center; height: .66rem; background-color: #ffeed0; color: #955d22; font-size: .24rem; margin: .32rem auto 0; width: 4.3rem; border-radius: 0.04rem; }

.dia-lott-one .dia-lott-box img, .dia-lott-sign .dia-lott-box img { width: .68rem; height: .67rem; object-fit: contain; }

.dia-lott-one .dia-lott-box p, .dia-lott-sign .dia-lott-box p { color: #333333; font-size: .24rem; margin-top: .4rem; }

.dia-lott-ten .dia-lott-box { font-size: 0; }

.dia-lott-ten .dia-lott-box .dia-lott-item { background: url(../image/lott-ten-bg.png) no-repeat center top; background-size: 100%; width: .76rem; height: .76rem; display: inline-block; vertical-align: top; margin-right: .12rem; margin-bottom: .3rem; box-sizing: border-box; padding-top: .1rem; }

.dia-lott-ten .dia-lott-box .dia-lott-item:nth-child(5n) { margin-right: 0; }

.dia-lott-ten .dia-lott-box img { width: .56rem; height: .56rem; object-fit: contain; }

.dia-lott-ten .btn-get { margin: 0 auto 0; }

.dia-lott-sign { text-align: center; }

.dia-lott-sign .dia-box.dia-box-two .dia-lott-box { display: inline-block; vertical-align: top; width: 45%; }

.dia-lott-sign .tips { font-size: .2rem; color: #999999; margin-top: .32rem; text-align: center; }

.dia-join-group .dia-con.on .group-tips { color: #d31e1e; }

.dia-join-group .dia-con.on .btn-join { background-color: #f8f8f8; color: #768196; }

.dia-join-group .group-box { margin-top: .3rem; font-size: 0; text-align: center; }

.dia-join-group .group-box img { display: inline-block; vertical-align: top; width: .64rem; height: .64rem; border-radius: 50%; background-color: #f7f7f7; margin-right: .23rem; }

.dia-join-group .group-text { font-size: .24rem; padding: 0 .28rem; color: #333333; margin-top: .36rem; }

.dia-join-group .group-tips { font-weight: 500; display: block; text-align: center; margin-top: .5rem; font-size: .24rem; color: #333333; }

.dia-join-group .btn-box { font-size: 0; display: flex; justify-content: center; align-items: center; margin-top: .52rem; }

.dia-join-group .btn-box a { border-radius: 0.04rem; font-size: .24rem; width: 2.02rem; height: .66rem; display: flex; justify-content: center; align-items: center; box-sizing: border-box; }

.dia-join-group .btn-box .btn-canle { border: 0.02rem solid #955f1b; color: #955f1b; margin-right: .22rem; }

.dia-join-group .btn-box .btn-join { background-color: #ffeed0; color: #955f1b; }

.dia-card-info .dia-card-text { padding: 0 .3rem; margin-top: .43rem; font-size: .24rem; color: #333333; }

.dia-card-info .card-tips { font-weight: 500; display: block; text-align: center; margin-top: .5rem; height: auto; }

.dia-card-info .btn-box { font-size: 0; display: flex; justify-content: center; align-items: center; margin-top: .45rem; }

.dia-card-info .btn-box a { border-radius: 0.04rem; font-size: .24rem; width: 2.02rem; height: .66rem; display: flex; justify-content: center; align-items: center; box-sizing: border-box; }

.dia-card-info .btn-box .btn-canle { border: 0.02rem solid #955f1b; color: #955f1b; margin-right: .22rem; }

.dia-card-info .btn-box .btn-use { background-color: #ffeed0; color: #955f1b; }

.dia-card-info .btn-box .btn-use.on { background-color: #f8f8f8; color: #768196; }

.dia-rules .act-time { font-size: .22rem; color: #333333; margin-top: .3rem; padding: 0 .24rem; }

.dia-rules .dia-rules-con { font-size: .22rem; color: #333333; height: 6rem; overflow-x: auto; padding: 0 .24rem; width: 4.9rem; margin: .46rem auto 0; box-sizing: border-box; -webkit-overflow-scrolling: touch; }

.dia-rules .dia-rules-con .rules-item { margin-bottom: .42rem; }

.dia-rules .dia-rules-con .rules-item:last-child { margin-bottom: 0; }

.dia-rules .btn-true { width: 4.3rem; height: .66rem; display: flex; justify-content: center; align-items: center; background-color: #ffeed0; color: #955d22; margin: .3rem auto 0; border-radius: 0.04rem; font-size: .24rem; }

.dia-lott-probability .table-box { color: #333333; font-size: .2rem; width: 100%; margin: 0 auto 0; box-sizing: border-box; }

.dia-lott-probability .table-box tr { height: .5rem; }

.dia-lott-probability .table-box td { text-align: center; border: 0.01rem solid #ededed; box-sizing: border-box; }

.dia-lott-probability .table-box td:first-child { width: 70%; }

.dia-lott-probability .table-box td:last-child { width: 30%; text-align: left; padding-left: .45rem; }

.dia-lott-probability .table-box th { height: .6rem; font-size: .2rem; background-color: #fef8ef; }

.dia-lott-probability .btn-true { width: 4.3rem; height: .66rem; display: flex; justify-content: center; align-items: center; background-color: #ffeed0; color: #955d22; margin: .3rem auto 0; border-radius: 0.04rem; font-size: .24rem; }

.dia-lott-record { width: 6rem; }

.dia-lott-record .dia-con { width: 100%; }

.dia-lott-record .dia-con span { display: flex; align-items: center; justify-content: center; width: 49%; }

.dia-lott-record .dia-record-head { display: flex; justify-content: space-around; align-items: center; height: 0.6rem; font-size: 0.2rem; background-color: #fef8ef; font-weight: 500; }

.dia-lott-record .dia-record-con { max-height: 4.5rem; overflow-x: auto; -webkit-overflow-scrolling: touch; }

.dia-lott-record .dia-record-con .record-item { display: flex; justify-content: space-around; align-items: center; font-size: .2rem; color: #333333; height: .5rem; }

.dia-lott-record .btn-true { width: 5rem; height: .66rem; display: flex; justify-content: center; align-items: center; background-color: #ffeed0; color: #955d22; margin: .3rem auto 0; border-radius: 0.04rem; font-size: .24rem; }