/* pages/luckyStar/luckyStar.wxss */ image{ display: block; } view{ -webkit-overflow-scrolling: touch; } .main{ height: calc(100vh - 120rpx); overflow: auto; } .gameRuleBtn{ width:81rpx; height:81rpx; position: fixed; right: 17rpx; top: 216rpx; } .gameRuleBtn2{ background-color: #28568B; } .gameTip{ width:81rpx; height:81rpx; position: fixed; right: 17rpx; top: 331rpx; } .gameRuleDesc{ position: fixed; left: 0; top: 0; width: 100%; height: calc(100vh - 120rpx); background-color: rgba( 000, 000, 000, 0.3); display: flex; align-items: center; justify-content: center; z-index: 99; } .ruleGroup{ position: relative; width: 549rpx; height: 736rpx; } .gameRuleIcon{ width: 100%; height: 100%; } .gameRuleClose{ position: absolute; top: -10rpx; right: -10rpx; height: 40rpx; width: 40rpx; z-index: 9; } .gameStrat{ position: relative; width:277rpx; height:50rpx; padding-top: 37rpx; } .gameMain{ position: relative; width: 750rpx; } .gameStarBg{ width: 750rpx; height: 1038rpx; } .gameTitle{ position: absolute; left: 49%; top: 0; transform: translateX(-50%); width: 343rpx; height: 97rpx; z-index: 10; } .downTime{ position: absolute; top: 20rpx; right: 80rpx; font-size:34rpx; line-height: 34rpx; font-family:NissanBrand; color:rgba(35,33,34,1); font-weight: 500; } .gameClaw{ position: absolute; left: 268rpx; top: -440rpx; width: 224rpx; height: 800rpx; transition: top 0.8s linear; transform: scale(2); transform-origin:50% 0 0; } .gameClaw2{ transition: all 0.8s linear; } .prizeIcon2{ position: absolute; left: 74rpx; top: 558rpx; width: 561rpx; height: 187rpx; } .prizeIcon1{ position: absolute; left: 77rpx; top: 571rpx; width: 673rpx; height: 288rpx; } .gameGetBtn{ position: absolute; right: 70rpx; top: 920rpx; width: 304rpx; height: 80rpx; } .gameControlFrame{ position: absolute; left: 110rpx; top: 895rpx; width: 224rpx; height: 127rpx; } .gameControlGroup{ widows: 100%; height: 100%; position: relative; } .btnControlL{ position: absolute; left: 0; top: 39rpx; width: 71rpx; height: 51rpx; } .btnControlR{ position: absolute; right: 0; top: 39rpx; width: 71rpx; height: 51rpx; } .btnControlT{ position: absolute; left: 75rpx; top: 4rpx; width: 71rpx; height: 51rpx; } .btnControlB{ position: absolute; left: 75rpx; bottom: 0; width: 71rpx; height: 51rpx; } .successPop{ position: fixed; top: 0; left: 0; width: 100%; height: calc(100vh - 120rpx); background-color: rgba( 000, 000, 000, 0.3); display: flex; align-items: center; justify-content: center; z-index: 99; } .successGroup{ position: relative; width:488rpx; height:475rpx; display: flex; flex-direction: column; align-items: center; } .successIcon{ position: absolute; top: -33rpx; left: 50%; transform: translateX(-50%); width: 114rpx; height: 114rpx; } .titleGroup{ width: 100%; height: 63rpx; background-color: #355485; border-top-left-radius: 20rpx; border-top-right-radius: 20rpx; } .startRegister{ width:296rpx; height:50rpx; position: relative; } .prizePic{ width: 310rpx; height: 116rpx; margin-bottom: 10rpx; } .successTip{ font-size:28rpx; font-family:PingFangSC; font-weight:bold; color:rgba(52,84,132,1); line-height: 28rpx; text-align: center; margin-top: 50rpx; margin-bottom: 13rpx; } .prizeName{ font-size:21rpx; font-family:PingFangSC; font-weight:400; color:rgba(0,0,0,1); line-height:21rpx; text-align: center; margin-bottom: 30rpx; } .failText{ font-size:28rpx; font-family:PingFangSC; font-weight:bold; color:rgba(52,84,132,1); line-height:28rpx; text-align: center; } .getPrizeTip{ display: flex; align-items: center; justify-content: center; margin-top: 50rpx; margin-bottom: 16rpx; } .prizeTipLine{ width:80rpx; height:5rpx; background-color: #1F4C76; } .prizeTipLine:first-child{ margin-right: 20rpx; } .prizeTipLine:last-child{ margin-left: 20rpx; } .prizeTipText{ font-size:24rpx; font-family:PingFangSC; font-weight:600; color:rgba(21,83,136,1); line-height:24rpx; } .tipContentGroup{ width:712rpx; height:72rpx; margin: 0 auto; box-sizing: border-box; border: 1rpx solid #4B6782; padding: 0 20rpx; border-radius: 20rpx; overflow: hidden; position: relative; } .tipContentGroup>view::-webkit-scrollbar { display:none; width:0; height:0; color:transparent; } .tipContent{ position: absolute; top:0; left: 100%; font-size:21rpx; font-family:PingFangSC; font-weight:400; color:rgba(21,83,136,1); line-height:72rpx; white-space: nowrap; } .prizeLookGroup{ padding-top:40rpx; padding-bottom: 45rpx; display: flex; align-items: center; justify-content: center; } .prizeLook{ width:711rpx; height:71rpx; } .shareBtn{ position: absolute; left: 0; top: 0; z-index: 2; opacity: 0; } .getUserMsgBtn{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; margin: 0; padding:0; } .scrollSty{ margin-top: 10rpx; width:672rpx; height:72rpx; white-space: nowrap; } .tipContent{ display:inline-block; } .scrollMask{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; } .scrollFirstView{ width:712rpx; height:72rpx; } .luckyClaw{ width: 304rpx; height: 80rpx; margin-left: -2rpx; } .luckyLeft{ width: 71rpx; height: 51rpx; } .luckyRight{ width: 71rpx; height: 51rpx; } .luckyTop{ width: 71rpx; height: 51rpx; } .luckyBottom{ width: 71rpx; height: 51rpx; } .downTimeGroup{ position: fixed; left: 0; top: 0; width: 100%; height: calc(100vh - 120rpx); background-color: rgba( 000, 000, 000, 0.3); display: flex; align-items: center; justify-content: center; z-index: 99; } .luckyNum{ width: 221rpx; height: 131rpx; } .luckyPizeType{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .textFrame{ width:100%; height:100%; overflow: auto; position:relative; } .btnsGroup{ height: 110rpx; position: absolute; top: 310rpx; display: flex; align-items: center; justify-content: space-between; flex-direction: column; z-index: 9; } .luckyBtns{ width: 305rpx; height: 50rpx; } .luckyBtnsGap{ height: 13rpx; } .prizeContent{ position: absolute; top: 200rpx; z-index: 9; } .gameOpen{ position: absolute; left: 370rpx; top: 939rpx; width: 139rpx; height: 61rpx; } .newImages24{ position: absolute; left: 533rpx; top: 920rpx; width: 147rpx; height: 105rpx; } .chanceGroup{ position: relative; width: 489rpx; height: 460rpx; } .newImages44{ width: 100%; height: 100%; } .newImages45{ position: absolute; bottom: 58rpx; left: 50%; transform: translateX(-50%); width: 278rpx; height: 51rpx; } .gameRuleGroup{ position: absolute; top: 115rpx; left:0; width: 100%; height: 570rpx; display: flex; flex-direction: column; align-items: center; overflow: auto; } .newImages2-22{ position: absolute; left: 50%; transform: translateX(-50%); top: 369rpx; width: 247rpx; height: 91rpx; } .operationExample{ position: relative; width: 489rpx; height: 460rpx; } .newImages2-29{ width: 100%; height: 100%; } .newImages2-28{ position: absolute; left: 50%; transform: translateX(-50%); bottom:58rpx; width: 277rpx; height: 51rpx; } .newImages2-30{ position: absolute; left: 72rpx; top: 183rpx; width: 164rpx; height: 93rpx; } .newImages24-2{ top: 180rpx; right: 71rpx; left: auto; } .luckyLeft-2{ position: absolute; top: 208rpx; left: 74rpx; width: 53rpx; height: 39rpx; opacity: 0; } .luckyRight-2{ position: absolute; top: 208rpx; left: 182rpx; width: 53rpx; height: 39rpx; opacity: 0; } .luckyTop-2{ position: absolute; top: 182rpx; left: 126rpx; width: 53rpx; height: 39rpx; opacity: 0; } .luckyBottom-2{ position: absolute; top: 236rpx; left: 126rpx; width: 53rpx; height: 39rpx; opacity: 0; } .ani{ animation:mymove 800ms linear; } .ani2{ animation:mymove 2s linear; } @keyframes mymove{ 25% {opacity:1;} 50% {opacity:0;} 75% {opacity:1;} 100% {opacity:0;} }