/* pages/rotaryDraw/rotaryDraw.wxss */
image{
  display: block;
}
view{
  -webkit-overflow-scrolling: touch;
}
.main{
  height: calc(100vh - 120rpx);
  overflow: auto;
  overflow-x: hidden;
  position: relative;
}
.pageBg{
  width: 750rpx;
  height: 1354rpx;
}
.gameFrame{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top:345rpx;
  width:661rpx;
  height:661rpx;
  z-index: 9;
}
.gameGroup{
  position: relative;
  width: 100%;
  height: 100%;
}
.gameDial{
  width: 100%;
  height: 100%;
}
.gamePointer{
  position: absolute;
  top: 207rpx;
  left: 50%;
  transform: translateX(-50%);
  width: 119rpx;
  height: 181rpx;
}
.gamePointer2{
  position: absolute;
  top: 207rpx;
  left: 271rpx;
  width: 119rpx;
  height: 120rpx;
}
.recordFrame{
  position: absolute;
  top: 0;
  left: 0;
  width: 750rpx;
  height: 1354rpx;
}
.recordGroup{
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 530rpx;
  height: 152rpx;
  overflow: hidden;
}
.recordText{
  position: absolute;
  left: 0;
  top: 152rpx;
  text-align: center;
  font-size: 24rpx;
  width: 100%;
  height: 40rpx;
  line-height: 40rpx;
  color: white;
}
.ruleMask{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100vh - 120rpx);
  background-color: rgba( 000, 000, 000, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99;
}
.ruleGroup{
  position: relative;
  width: 641rpx;
  height: 995rpx;
}
.closeRule{
  position: absolute;
  top: -27rpx;
  right: -28rpx;
  width: 38rpx;
  height: 37rpx;
}
.getNow{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 435rpx;
  width: 366rpx;
  height: 56rpx;
}
.gameDialAni{
  animation:rotateAni 3s linear infinite;
}
@keyframes rotateAni
{
  0% {rotate:0;}
  100% {rotate:360deg;}
  100% {rotate:0;}
}