@charset "utf-8";
/* CSS Document */
body{ background: url("/common/html5/images/video/event/hongbaoyu/20190114/bg.jpg"); background-size: 100% 100%;-moz-background-size:100% 100%;background-repeat: no-repeat; }
.buttonRule{ position: fixed; padding: 7px 2px; width: 22px; height: auto; text-align: center; line-height: 16px; right: 0; top: 55%; color: #fff; font-size: 14px; border-radius: 2px; background: rgba(0,0,0,.6); z-index: 120; }
/*弹层*/
.prizeLayer{ display: none; top: 0; left: 0; width: 100%; height: 100%; position: fixed; background: #000; opacity: 0.8; z-index: 220; }
.prizeBox{ display: none; position: fixed; top: 20%; width: 90%; left: 5%; z-index: 230; opacity: 1; }
.prizeClose{ position: absolute; right: 0; top: -15%; width: 12%; height: 10%; z-index: 10; }
.prizeLogo{ position: absolute; top: 16%; left: 27%; width: 50%; }
.prizeText{ position: absolute; top: 28%; left: 28%; width: 35%; color: #fff; font-size: 4.5rem; text-align: center; color: #dc1413; font-weight: bold;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.prizeImg{ position: absolute; left: 5%; top: 10%; width: 90%;  }
.prizeTitle{ line-height: 0; }
.prizeQuan{ position: absolute; width: 70%; left: 18%; top: 45%; height: 22%; background: url("/common/html5/images/video/event/20170426/bgQuan_1.png") no-repeat; background-size: 100% 100%; }
.prizeQuan_jifen{ background: url("/common/html5/images/video/event/20170426/bgQuan_2.png") no-repeat; background-size: 100% 100%; }
.prizeQuan .pirce{ position: absolute; top: 50%; left: 3%; width: 40%; font-size: 1.2rem; color: #fff; text-align: center; line-height: 0; }
.prizeQuan .pirce span{ font-size: 3.8rem; }
.quanText{ position: absolute; right: 0; top: 50%; width: 52%; font-size: 1.6rem; font-weight: bold; color: #484848; line-height: 2rem;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.quanText span{ display: inline-block; margin-bottom: 1px; font-size: 1.2rem; line-height: 1.3rem; font-weight: normal; }
.prizeButton{ position: absolute; display: block; width: 40%; height: auto; bottom: -28%; right: 10%; }
.prizeNotFan{ position: absolute; display: block; width: 40%; height: auto; bottom: -28%; left: 5%; }
.prizeFan{ position: absolute; display: none; width: 40%; height: auto; bottom: -28%; left: 5%; }
.notFan { position: absolute; display: none; color: #ae382f; text-align: center; bottom: -65%; font-weight: 600; font-size: 1.2rem; width: 100%; }
.alreadyFan { position: absolute; display: block; color: #ffcb73; text-align: center; bottom: -65%; font-weight: 600; font-size: 1.2rem; width: 100%; }
.textVip { position: absolute; top: 18%; left: 28%; width: 41%; color: #f07563; font-weight: 600; text-align: center; font-size: 1rem; display: none; }
.prizeVip { position: absolute; display: none; width: 46%; height: auto; bottom: -33%; left: 27%; }
.gameClose{ display: none; position: absolute; right: 5%; top: -20%; width: 44px; height: 44px; background: url("/common/html5/images/video/event/20170227/imgClose.png") no-repeat; background-size: 100% 100%; opacity: 0; z-index: 20; }

.testRain{ position: fixed; left: 0; top: 10%; padding: 5px; color: #fff; background: #000; z-index: 2020; }
.heziMove{
    position: fixed; top: 0; left: 0; z-index: 210; display: none; width: 100%; height: 100%;
}
.closePrize{
    position: absolute; z-index: 99; top: 20px; right: 20px; width: 7%; display: none;
}

.coinDJS{ display: none; position: fixed; width: 100%; top: 30%; left: 0; opacity: 0; z-index: 210; }
.coinDJS .num_5{ position: absolute; width: 18%; text-align: center; top: 25%; left: 40.5%; }
.coinDJS .num_4{ position: absolute; width: 18%; text-align: center; top: 25%; left: 40%; opacity: 0; }
.coinDJS .num_3{ position: absolute; width: 18%; text-align: center; top: 25%; left: 40.5%; }
.coinDJS .num_2{ position: absolute; width: 18%; text-align: center; top: 25%; left: 40.2%; opacity: 0; }
.coinDJS .num_1{ position: absolute; width: 18%; text-align: center; top: 25%; left: 39%; opacity: 0; }
.coinDJS p{ position: absolute; width: 100%; top: 120%; font-size: 2rem; font-weight: bold; color: #ffcf23; text-align: center; }

.daojishi{
    width: 16%; height: auto; position: absolute; top: 10px; left: 10px; color: #1e1e1e; opacity: 0;
}
.canvasView{
    position: absolute; top: 0; left: 0;
}
.inputtext{
    position: absolute; top: 50%; width: 100%; text-align: center; font-size: 1rem; color: #f46823;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.inputtext span{
    font-size: 2rem;
}
.prizeButton.gohome{top:35%}