#scratch{ position: relative;}
#cover{ position: absolute; top:-3px; left:-3px;}
#card{ -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}
#wrap{position: relative;width:100%;min-height: 17.8rem;}

/*背景音乐 S */
.music-play{position: fixed;top: 0.3rem;left: 0.3rem;width:1rem;height: 1rem;border-radius: 50%;background: url(../image/music.png) no-repeat;background-size:100% 100%;z-index: 9;box-shadow: 0px 0px 0.1rem rgba(0,0,0,.16); -webkit-animation: music 2s linear infinite;}
.Musicpaused {-webkit-animation-play-state:paused; animation-play-state:paused;background: url(../image/musicd.png) no-repeat;background-size:100% 100%;}
@-webkit-keyframes music {
    0% {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    to{
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
    }
}
/*背景音乐 E*/

.modality1 {
    background: linear-gradient(to bottom, #ff4c42, #FB6A3F);
}
.r-bag{position: absolute;width: 100%;height: 100%;overflow: hidden;z-index: 1;top: 0;left: 0;}
.r-cont{position: relative;z-index: 3;padding-bottom: 1rem;}
.header {padding: 0.3rem 0.49333333rem 0rem 0.49333333rem;}
.title {width: 8.6rem;margin: .15rem auto;margin-bottom: .284rem;}
.modality1 .title{width: 6.24rem;margin-top: .46rem;margin-bottom: 2.1rem;}

.a1,.a2,.a3,.a4,.a5,.a6{display: none;}
.modality1 .a1,.modality2 .a2,.modality3 .a3,.modality4 .a4,.modality5 .a5,.modality6 .a6{display: block;}

/* 刮奖区 */
#card{height: 100%;font-weight: bold;font-size: 0.8rem;display: flex;align-items: center;justify-content: center;color: #797979;opacity:0;}
#card span{display: none;}
#scratch{width: 8.66rem;height: 4.45rem;margin:0 auto;background: #fff;border:0.48rem solid #fff;box-sizing: border-box;}

#scratch .scr-btn{position: absolute;width: 100%;height: 100%;z-index: 9;}
#scratch .scr-btn span{display: block;width: 4.32rem;height: 1.17rem;color: #fff;font-size:0.53rem;font-weight:bold;background:linear-gradient(80deg,rgba(255,74,76,1),rgba(254,161,104,1));box-shadow:0px 0px 6px 0px rgba(255,60,0,0.5);border-radius: 1.17rem;text-align: center;line-height: 1.17rem;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.modality1 #card{background: #FFB49E;}
.modality1 #card.win{color: #ff3a00;}

/*次数*/
.border {margin: 0rem auto;font-size: 0.4rem;line-height: 0.67rem;text-align: center;color: #fff;/* text-shadow:2px 2px 0px #fff; */}
#change{font-size: 0.5rem;}
.modality1 .border{margin-bottom: 0.3rem;}
/* 活动说明 */
.borback{border-radius: 0.373rem;background: rgba(255,255,255,.2);padding:.5rem;box-sizing: border-box;width: 90%;margin: 0 auto;margin-top: .5rem;position: relative;}
.title-but{font-size: .5rem;font-weight: bold;color: #fff600;text-align:center;margin-bottom: .5rem;}
.title-but>span{position: relative;/* display: inline-block; */}
.modality1 .title-but .left,.modality1 .title-but .right{flex: 1;display: block;}
.instru-txt{font-size: .38rem;color: #fff;line-height: .6rem;}

.prize-btitle{font-size: .42rem;font-weight: 600;}
.flex-box{display: flex;}
.flex-box li{margin-right: .3rem;line-height:.8rem;box-sizing: border-box;}
.flex-box li:nth-child(1){margin-right: 1.3rem;width: 1.86rem;}
.flex-box li:nth-child(2){flex: 1;}
.flex-box li:nth-child(3n){margin-right: 0;text-align: right;}
.prize-btitle.flex-box li:nth-child(1){padding-left: .18rem;}
.modality1 .title-but{position: absolute;top: -1.5rem;left: 0;font-size: 0.53rem;color: #fff;display: flex;width: 100%;align-items: center;text-shadow: 0px 0px 0.06rem #FF4D4D;}
.modality1 .title-but span:nth-child(2){display: block;width:4.88rem;height:1.013rem;line-height:1.013rem; background:linear-gradient(0deg,rgba(34,241,172,1),rgba(162,242,61,1));box-shadow:0px 0px 0.08rem 0px rgba(255,60,0,0.5);border-radius:1.013rem;margin: 0 .2rem;}
.modality1 .borback{margin-top: 2.3rem;}


#txtHxPwd {
    border-radius: 6px;
    background-color:#fff;height: 0.6rem;line-height: 0.60rem;height: 26px;border:1px;
}
#btnHx {
           display: inline;
    text-align: center;
    height: 0.8rem;
    line-height: 0.63rem;
    color: #fff;
    font-size: 0.3rem;
    border-radius: 0.93rem;
    position: relative;
    z-index: 3;
    outline: none;
    text-decoration: none;
    color: inherit;
    background: #FF5F53;
    width: 80px;
    border: 1px solid #d4b8b6;
}


/* 未中奖 */
.pre-box{position: absolute;width: 100%;height: 100%;top: 0;left: 0; z-index: 9;}
.modality1 .win-txt{margin-top: -0.96rem;margin-left: .2rem;font-size: 0.77rem;font-weight: 600;color: #d31a1b;}
.modality1 .btn{width: 3.866667rem;height: 1.17333333rem;border-radius:1.17333333rem;background:linear-gradient(0deg,rgba(34,241,172,1),rgba(162,242,61,1));box-shadow:0px 0px 0.08rem 0px rgba(255,60,0,0.5);font-size: 0.53rem;color: #fff;line-height:1.17333333rem;}
.modality1 #mask .winning{width: 100%;left: 0;margin-left: 0;margin-top: 0;top: 0;}
.modality1 #mask2 .winning{margin-top: 0;top: 0;}
.modality1 #mask .btn{bottom: 1.6rem;margin-left: 0.06rem;}
.modality1 #mask2 .btn{bottom: 1.3rem;}
.trophy{text-align: center;position: absolute;width: 100%;top: 50%;left: 0;transform: translateY(-50%);margin-top: -1rem;}
.modality1 .trophy{margin-top: 1.5rem;color: #ff6600;}
.modality1 .tro-title{font-size:0.42rem;}
.modality1 .jp-title{font-weight: bold;font-size: 0.74rem;/*margin-top: 0.6rem;*/}
.modality1 #mask2 .jp-title{margin-top: 0.6rem;}
.modality1 .title-but>span{display: inline-block;}
.modality1 #mask2 .jp-title{text-align: center;color:#ff6600;margin-top: 7.3rem;}
/* 提示框 */
.Fill-info,.Fill-img,.Fill-wimg{display: none;}
.box-popup{position: fixed;left: 0;top: 0;right: 0;bottom: 0;z-index: 99;background: rgba(0,0,0,.6);}
.box-cont{width: 7.73rem;/* height: 6.26rem; */border-radius: 0.26rem;background: #fff;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);padding:0.6rem 1rem;box-sizing: border-box;border: 0.053rem solid rgba(251,106,63,1);}
.dw-cont{position: relative;z-index: 103;}
.popup-form input{background: #fff;border-radius: 0.08rem;height: 1.1333rem;width: 100%;box-sizing: border-box;padding: 0 .4rem;line-height: 1.1333rem;font-size: 0.26rem;margin-bottom: 0.5rem;border: 1px solid rgba(251,106,63,1);position: relative;z-index: 3;color: #fb6a3f;}
.popup-title{width: 9.24rem;left: 50%;transform: translateX(-50%);position: absolute;top: -2.2rem;}
.popup-btn,.popup-btn1{display: block; text-align: center;height: 1.2rem;line-height: 1.06rem;color: #FB6A3F;font-size: 0.53rem;border-radius: 1.2rem;position: relative;z-index: 3; background: url(../image/btn.png) no-repeat; background-size:100% 100%;}
.popup-form input::-webkit-input-placeholder {color:#fb6a3f;}
.cont-txt{color: #fb6a3f;font-size: 0.4rem;border-radius: 0.22rem;padding: 0.26rem;min-height: 1.73rem;font-weight: bold;margin-bottom: .26rem;box-sizing: border-box;}
.img-cont{display: flex;align-items: center;justify-content: center;}

/* 皮肤2 */
.modality2{background:#9321b6;}
.modality2 .title{width: 7.9rem;margin-top: 0.4rem;}
.modality2 .border{color: #fff;width: 6.96rem;background: url(../image/border-bg.png) no-repeat;background-size:100% 100%;position: relative;padding:0.8rem 0.46rem .46rem;box-sizing: border-box;margin: 0.8rem auto .4rem auto;}
.modality2 .border .border-title{width:5rem;height:0.93rem;border-radius: 0.93rem;line-height: 0.83rem;text-align:center;position: absolute;left: 50%;transform: translateX(-50%);top: -0.4rem;z-index: 3;background: url(../image/border-title.png) no-repeat;background-size:100% 100%;color: #fff;font-size: 0.4rem;font-weight: bold;}
.modality2 #scratch{background: url(../image/gjbg.png) no-repeat;background-size:100% 100%;width: 9.17rem;height: 4.96rem;border: 0;padding: 1rem 1.5rem 1rem 1.5rem;}
.modality2 #scratch #cover{top: 1rem;left: 1.5rem;margin-top: -3px;margin-left: -3px;}
.modality2 #card{background: #fff;}
.modality2 .borback{border:2px solid rgba(172,0,174,.2);padding-top: 1rem;margin-top: 1.2rem;}
.modality2 .tit-img{width: 3.69rem;position: absolute;left: 50%;transform:translateX(-50%);top: -.7rem;z-index: 3;}
.modality2 .box-cont{background: #fff;border: 0.053rem solid rgba(147,33,182,1);}
.modality2 .popup-title,.modality2 .cont-txt,.modality2 .popup-form input,.modality2 .popup-form input::-webkit-input-placeholder{color: #a836cb;}
.modality2 #card{color: #595959;}
.modality2 #card.win{color: #9321b6;}
.modality2 .pre-box{z-index: 3;color: #fff;}
.modality2 .zjzs{position: absolute;z-index: 2;width: 10rem;left: 50%;margin-left: -5rem; top: 2rem;}
.modality2 .tro-title{font-size:0.42rem;}
.modality2 .jp-title{text-align: center;color: #fff;font-size: 0.8rem;font-weight: normal;/*margin-top: 3rem;*/}
.modality2 #mask2 .jp-title{margin-top: 3rem;}
.modality2 .jp-title span{display: block;}
.modality2 .popup-form input{border: 1px solid #a836cb;}
.modality2 .popup-btn,.popup-btn1{background: url(../image/btn1.png) no-repeat; background-size:100% 100%;color: #fff;}
.modality2 .box-popup{background: rgba(0,0,0,.8);}
.modality2 .trophy{margin-top: 0.9rem;}
.modality2 .winning .btn{display: none;}
.modality2 .close{width: 1.12rem;height: 1.12rem;border-radius: 50%;background: rgba(255,255,255,0.4);font-size: 0.8rem;font-weight: bold;color: #9321B6;line-height: 1.08rem;text-align: center; position: absolute;left: 50%;transform: translateX(-50%);bottom: -1.5rem;z-index: 9;}


/* 皮肤3 */
.modality3{background: #ffd634;}
.modality3 .title{width: 8.28rem;margin-bottom: 0.8rem;margin-top: -0.68rem;}
.modality3 .border{position: absolute;text-shadow: 0px 0px 0.07rem #050273;top: 4.2rem;margin-left: -0.2rem; left: 50%;transform: translateX(-50%);}
.modality3 .borback{background:rgba(91,90,217,1);border:0.053rem solid rgba(5,2,115,1);position: relative;padding-top: 1.2rem;margin-top: 1rem;}
.modality3 .instru {margin-top: 1.3rem;}
.modality3 #scratch{background: url(../image/gjbg2.png) no-repeat;background-size:100% 100%;width: 9.013rem;height: 5.26rem;border: 0;padding: 1.1rem 1.3rem;}
.modality3 #scratch #cover{top: 1.1rem;left: 1.3rem;margin-top: -3px;margin-left: -3px;}
.modality3 #card{background: #fff;color: #818181;}
.modality3 #card.win{color: #5a59d8;}
.modality3 .title-but{position: absolute;width: 4.53rem;height: 1.06rem;line-height: 1.06rem;color: #050273;border-radius: 1.06rem;left: 50%;top: -0.53rem;box-shadow: 0px 0px 0.1rem rgba(0,0,0,.16);font-size: 0.53rem;font-weight: normal;transform: translateX(-50%);background:url(../image/btn2.png) no-repeat;background-size:100% 100%;}
.modality3 .winning>img{width: 7.33rem;margin: 0 auto;}
.modality3 .winning .btn{bottom: 0.5rem;background:url(../image/btn2.png) no-repeat;background-size:100% 100%;width: 4.146rem;height: 1.173rem;line-height: 1.173rem;color: #050273;}
.modality3 .trophy{margin-top: 0.4rem;}
.modality3 .pre-box{color: #050273;}
.modality3 .jp-title{text-align: center;font-size: 0.8rem;font-weight: normal;/*margin-top: 3.8rem;*/}
.modality3 #mask2 .jp-title{margin-top: 3.8rem;}
.modality3 .trophy img{width: 2.36rem;height: 2.36rem;border-radius: 50%;border: 0.08rem solid #FFE401;margin-right: .3rem;}
.modality3 .box-cont{background: #FFD634;border: 0.053rem solid rgba(5,2,115,1);}
.modality3 .popup-title{color: #fff;}
.modality3 .cont-txt,.modality3 .popup-form input,.modality3 .popup-form input::-webkit-input-placeholder{color: #050273;background: #fff;}
.modality3 .popup-form input,.modality3 .cont-txt{border: 1px solid #050273;}
.modality3 .popup-btn,.popup-btn1{color:#050273;width:4.146rem;height:1.173rem;border-radius:1.173rem;background: url(../image/btn2.png) no-repeat;background-size:100% 100%;margin: 0 auto;}
.modality3 .box-popup{background: rgba(0,0,0,.7);}

/* 皮肤4 */
.modality4{background: #d91732;}
.modality4 .title{width: 9.45rem;margin-top: 0.2rem;}
.modality4 .border{ position: absolute; width: 9.2rem;height: 2.66rem;top: 14.5rem; left: 50%;transform: translateX(-50%); color: #fff;background:rgba(255,255,255,0.1);box-shadow:0px 5px 30px 0px rgba(137,2,148,0.3);border-radius: 0.26rem;box-sizing: border-box;padding-top: .6rem;}
.modality4 #scratch{background: url(../image/gjbg3.png) no-repeat;background-size:100% 100%;width: 9.4rem;height: 6.58rem;border: 0;padding: 2.5rem 1.5rem 1.2rem 1.5rem;margin-top: 2.5rem;margin-bottom: 4.3rem;}
.modality4 #scratch #cover{top: 2.5rem;left: 1.5rem;margin-top: -3px;margin-left: -3px;}
.modality4 #card{background: #fff;color: #afafaf;}
.modality4 #card.win{color: #d91732;}
.modality4 .title-but{display: flex;justify-content: center;align-items: center;}
.modality4 .title-but>span{display: inline-block;background-image:-webkit-linear-gradient(bottom,#FFC85C,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent; }
.modality4 .title-but span:nth-child(2){margin: 0 0.2rem;}
.modality4 .title-but .left,.modality4 .title-but .right{width: 0.77rem;}
.modality4 .borback{border: 0;background:rgba(255,255,255,0.1);box-shadow:0px 5px 30px 0px rgba(137,2,148,0.3);}
.modality4 .winning img{width: 7.65rem;margin: 0 auto;}
.modality4 #mask .winning,.modality4 #mask2 .winning{margin-top: -5.6rem;width: 100%;margin-left: 0;left: 0;}
.modality4 .winning .btn{background:rgba(255,193,83,1);bottom: 1rem;font-size: 0.45rem;color: #CB142F;height: 1.17rem;border-radius: 1.17rem;line-height: 1.17rem;}
.modality4 .winning p{display: none;}
.modality4 .trophy{margin-top: 1.3rem;}
.modality4 .pre-box{color: #ffc153;font-size: 0.53rem;}
.modality4 .jp-title{text-align: center;font-size: 0.69rem;font-weight: normal;/*margin-top: 0.6rem;*/color: #fff;}
.modality4 #mask2 .jp-title{margin-top: 0.6rem;}
.modality4 .trophy img{width: 2.89rem;height: 2.01rem;border-radius: 0.13rem;margin: 0 auto;}
.modality4 #mask2 .winning .jp-title{font-size: 0.8rem;font-weight: normal;margin-top: 4.7rem;}
.modality4 #mask2 .winning .jp-title span{display: block;}
.modality4 .box-cont{background: #ff415b;border: 0;}
.modality4 .popup-title{color: #fff;}
.modality4 .cont-txt,.modality4 .popup-form input,.modality4 .popup-form input::-webkit-input-placeholder{color: #d01530;}
.modality4 .popup-form input,.modality4 .cont-txt{border: 1px solid #d01530;background: #fff; box-shadow: 0px 0px 0.2rem rgba(0,0,0,.16);}
.modality4 .popup-btn,.popup-btn1{background:#ffc153;color:#d01530;line-height: 1.2rem;}
.modality4 .box-popup{background: rgba(0,0,0,.6);}

/* 皮肤5 */
.modality5{background: #557fe3;}
.modality5 .title{margin-top: 0;width: 9.146rem;}
.modality5 .borback{background:rgba(255,255,255,.1);border: 0;border-radius: 0.53rem;position: relative;margin-top: 1.4rem;padding-top: 1.1rem;}
.modality5 #scratch{background: url(../image/gjbg4.png) no-repeat;background-size:100% 100%;width: 10rem;height: 8rem;border: 0;padding: 1.7rem 1.7rem 3.1rem 1.7rem;margin-top: 0.76rem;margin-bottom: 0.7rem;}
.modality5 #scratch #cover{top: 1.7rem;left: 1.7rem;margin-top: -3px;margin-left: -3px;border-radius: 0.13rem;/* border:0.053rem solid rgba(32,75,154,.4); */box-shadow: 0px 0px 4px rgba(32,75,154,.4);}
.modality5 #card{background: #fff;color: #9e9e9e;}
.modality5 #card.win{color: #315abf;}
.modality5 .border{position: absolute;width: 8.49rem;height: 2.38rem;background: url(../image/border-bg1.png) no-repeat;background-size:100% 100%;left: 50%;transform: translateX(-50%);top: 9.2rem;z-index: 9;box-sizing: border-box;padding-top: 0.4rem;}
.modality5 .title-but{position: absolute;width: 4.57rem;height: 1.24rem;line-height: 1.14rem; top: -0.6rem;left: 50%;transform: translateX(-50%);background: url(../image/btn3.png) no-repeat;background-size: 100% 100%;color: #fff;font-size: 0.53rem;margin-bottom: 0;}
.modality5 .title-but span{margin-top: .2rem;}
.modality5 #mask .winning,.modality5 #mask2 .winning{width: 8.49rem;margin: -6rem 0 0 -4.245rem;margin-top: -6rem;}
.modality5 .winning .btn{width: 4.23rem;height: 1.36rem;font-size: 0.56rem;line-height: 1.24rem;font-weight: 600;bottom: 1.1rem;background: none;color: #2D57B8;}
.modality5 #mask2 .winning .btn{bottom: 0.2rem;}
.modality5 .trophy{margin-top: -0.5rem;color: #2D57B8;}
.modality5 .tro-title{font-size: 0.4rem;font-weight: 600;margin-bottom: .3rem;}
.modality5 .jp-title{font-size: 0.56rem;font-weight: bold;text-align: center;}
.modality5 #mask2 .jp-title{margin-top: 3.6rem;color: #2D57B8;}
.modality5 #mask2 .jp-title span{display: block;}
.modality5 .box-cont{background: #557FE3;border: 0;}
.modality5 .popup-title{color: #fff;}
.modality5 .cont-txt,.modality5 .popup-form input,.modality5 .popup-form input::-webkit-input-placeholder{color: #2651B7;}
.modality5 .popup-form input,.modality5 .cont-txt{border: 1px solid #2651B7;box-shadow: 0px 0px 0.2rem rgba(0,0,0,.16);background: #fff;}
.modality5 .popup-btn,.popup-btn1{background:url(../image/btn4.png) no-repeat;background-size: 100% 100%;color:#2651B7;height: 1.173rem;line-height: 1.173rem;}

/* 皮肤6 */
.modality6{background: #e10745;}
.modality6 .title{margin-top: .3rem;width: 7.986rem;margin-bottom: 0;}
.modality6 .border{width: 6.56rem;padding: 0.266rem;box-sizing: border-box; margin: 0 auto;border-radius: 5px;background: rgba(255,255,255,.3);margin-bottom: .8rem;margin-top: .2rem;}
.modality6 #scratch{background: url(../image/gjbg5.png) no-repeat;background-size:100% 100%;border: 0;padding: 0.55rem 0.5rem;}
.modality6 #cover{left: .5rem;top: .55rem;margin-top: -3px;margin-left: -3px;}
.modality6 #card{background: #fff;color: #7b7b7b;}
.modality6 #card.win{color: #d70740;}
.modality6 .tit-img{width: 10rem;position: absolute;left: 50%;transform:translateX(-50%);top: -2rem;z-index: 3;}
.modality6 .borback{margin-top: 1.9rem;}
.modality6 #mask .winning,.modality6 #mask2 .winning{width: 7.866rem; margin-top: -6rem;margin-left: -3.933rem;}
.modality6 .winning .btn,.modality6 .popup-btn,.popup-btn1{background:linear-gradient(0deg,rgba(246,69,100,1),rgba(255,104,147,1));
box-shadow:0px 0.066rem 0.266rem 0px rgba(96,34,255,0.5);width: 4.32rem;height: 1.1733rem;line-height: 1.1733rem;border-radius: 1.1733rem;color: #fff;}
.modality6 .trophy{color: #fff;margin-top: 1rem;}
.modality6 .tro-title{font-size: 0.44rem;margin-bottom: 0.3rem;}
.modality6 .jp-title{font-size: 0.6133rem;text-align: center;color: #fff;}
.modality6 #mask2 .jp-title{margin-top: 4.5rem;}
.modality6 .cont-txt,.modality6 .popup-form input,.modality6 .popup-form input::-webkit-input-placeholder{color: #d80842;}
.modality6 .popup-form input,.modality6 .cont-txt{border: 1px solid #d80842;box-shadow: 0px 0px 0.2rem rgba(0,0,0,.16);background: #fff;}
.modality6 .popup-btn,.popup-btn1{margin: 0 auto;}
.modality6 .box-cont{border: 0;padding-top: 1rem;}