@charset "utf-8";
/****************************** 全局样式 ******************************/
/********** 全局 **********/
.zam *{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent; -moz-user-select:none;-webkit-user-select:none;}
body{padding:0;margin:0;font:14px/25px microsoft yahei,arial;}
div, dl, dt, dd, ul, h1, h2, h3, h4, p{padding:0;margin:0;}
li{list-style:none;}
img{border:0;display:block;}
a{color:#000000;text-decoration:none;}
a:hover{color:#3498db;text-decoration:underline;}


/********** 其它 **********/
.clearfix:after{height:0;display:block;visibility:hidden;content:".";clear:both;}
.clearfix{display:inline-block;}
*html .clearfix{height:1%;}
.clearfix{display:block;}
.clear{height:0;overflow:hidden;font:0/0 arial;visibility:hidden;clear:both;}
.fl{float:left;}
.fr{float:right;}

/*公共箭头*/
.bottom_arrowBox .arrow_left{float:left; width:0; height:0; border-top:8px solid #fff; border-right:8px solid transparent;}
.bottom_arrowBox .arrow_right{float:left; width:0; height:0; border-top:8px solid #fff; border-left:8px solid transparent;}
/****************************** 全局样式 结束 ******************************/
html,body{width:100%; height:100%;}
.main{width:100%; height:100%; overflow:hidden; position:relative; }

.bg_rotate{ width:1000px; height:1000px; background:#ffe554 url(../images/redpack/app/bg.png) no-repeat; background-size:contain; position:absolute; left:50%; top:50%; margin-left:-500px; margin-top:-450px; z-index:-1; }
.bottom_money{width:100%; position:absolute; left:0; bottom:0;}
.bottom_money img{width:100%; height:auto;}

.btn_bottom{ width:100%; line-height:50px; font-size:20px; position:fixed; left:0; bottom:0; z-index:999;}
.btn_bottom a{float:left; width:50%;  text-align:center; color:#fff;}
.btn_bottom a.bule{background-color:#0c52d2;}
.btn_bottom a.red{background-color:#ff000a;}
.btn_bottom a.btn_winning_record i{width:25px; height:25px; line-height:25px; font-size:16px; color:#ff1127; font-style:normal; font-weight:bold; text-align:center; border-radius:50%; background-color:#ffed00; border:3px solid #fff; box-shadow:5px 0 5px 0 rgba(0,0,0,0.5); position:absolute; top:-20px; right:15px;}


/*进入游戏提示*/
.game_tips{width:100%; text-align:center; position:absolute; left:0; top:50%; z-index:99; /*display:none;*/}
.game_tips img{width:4rem; padding-left:30px; height:auto; margin:0 auto;}
.game_tips p{font-size:18px; line-height:30px; color:#fff; margin-top:20px;}

/*红包掉落中*/
.redenvelop_box{width:100%; height:100%; position:absolute; top:0; left:0; z-index:99; display:none;}
.redenvelop_box .countNum{ width:75px; height:100px; text-align:center; background:url(../images/redpack/app/stopwatch.png) top center no-repeat; background-size:contain; position:absolute; left:10px; bottom:80px;}
.redenvelop_box .countNum p{font-size:14px; color:#ff0000; margin-top:30px; }
.redenvelop_box .countNum p b{font-size:24px;}
.redenvelop_box .countNum span{display:block; font-size:12px; line-height:12px; color:#333;}

.redenvelop_box .redenvelop_list li{position:absolute; top:-160px; background-size:contain; }

.redenvelop_box .redenvelop_list .redenvelop1{width:122px; height:152px; background:url(../images/redpack/redenvelop_01.png) no-repeat; z-index:7;}
.redenvelop_box .redenvelop_list .redenvelop2{width:103px; height:137px; background:url(../images/redpack/redenvelop_02.png) no-repeat; z-index:6;}
.redenvelop_box .redenvelop_list .redenvelop3{width:80px; height:108px; background:url(../images/redpack//redenvelop_03.png) no-repeat; z-index:5;}
.redenvelop_box .redenvelop_list .redenvelop4{width:71px; height:97px; background:url(../images/redpack//redenvelop_04.png) no-repeat; z-index:4;}
.redenvelop_box .redenvelop_list .redenvelop5{width:67px; height:95px; background:url(../images/redpack/redenvelop_05.png) no-repeat; z-index:3;}
.redenvelop_box .redenvelop_list .redenvelop6{width:37px; height:48px; background:url(../images/redpack/redenvelop_06.png) no-repeat; z-index:2;}
.redenvelop_box .redenvelop_list .redenvelop7{width:28px; height:49px; background:url(../images/redpack/redenvelop_07.png) no-repeat; z-index:1;}

.redenvelop_box .redenvelop_list li a{display:block; width:100%; height:100%; background-size:contain; -ms-touch-action:none; touch-action:none;}

/*抢到一个红包*/
.grab_one_redenvelop{width:100%; position:absolute; top:50%; left:0; z-index:1001; display:none;}
.grab_one_redenvelop .close{padding:5px; font-size:30px; color:#ff000a; font-family:verdana; text-decoration:none; position:absolute; top:-20px; right:20px; -ms-touch-action:none; touch-action:none;}
.grab_one_redenvelop .txt{font-size:20px; line-height:30px; color:#ffed00; text-align:center;}
.grab_one_redenvelop .one_redenvelop{ width:250px; border-radius:10px; background-color:#e00000; margin:10px auto 0; overflow:hidden; position:relative;}

.grab_one_redenvelop .one_redenvelop .bg_arc{width:400px; height:400px; border-radius:50%; background-color:#ff2c00; box-shadow:0 0 10px 0 rgba(0,0,0,0.2); position:absolute; bottom:50px; left:50%; margin-left:-200px;}
.grab_one_redenvelop .one_redenvelop .btn_open{display:block; margin:0; padding:0; width:60px; height:60px; border-radius:50%; line-height:60px; font-size:16px; color:#fff; font-family:microsoft yahei,arial; text-align:center; background-color:#ffb901; border:none; outline:none; text-decoration:none; position:absolute; bottom:20px; left:50%; margin-left:-30px; -ms-touch-action:none; touch-action:none;}


.grab_one_redenvelop .one_redenvelop .user_info{margin:20px 0 100px; text-align:center; position:relative; }
.grab_one_redenvelop .one_redenvelop .user_info img{ width:50px; height:50px; border-radius:50%; border:2px solid #fff; margin:0 auto;}
.grab_one_redenvelop .one_redenvelop .user_info p{font-size:18px; color:#fff; line-height:24px; margin-top:20px;}
.grab_one_redenvelop .one_redenvelop .user_info span{font-size:12px; line-height:40px; color:#fff;}

/*获得实物奖品*/
.prize_redenvelop{ width:12rem; position:absolute; left:50%; top:50%; margin-left:-6rem; z-index:1001; display:none;}
.prize_redenvelop .close{padding:5px; font-size:30px; color:#ff000a; font-family:verdana; text-decoration:none; position:absolute; top:-20px; right:0; -ms-touch-action:none; touch-action:none;}
.prize_redenvelop .txt{ font-size:24px; color:#ffed00; text-align:center;}
.prize_redenvelop .prize_box{border-radius:8px; background-color:#ff000a; margin-top:70px; position:relative;}

.prize_redenvelop .prize_box .prize_url{width:120px; height:120px; position:absolute; left:50%; top:-60px; margin-left:-60px;}
.prize_redenvelop .prize_box .click_me{width:80px; position:absolute; left:50%; top:-74px; margin-left:4px; transform:rotate(38deg);}
.prize_redenvelop .prize_box .prize_img{ width:120px; height:120px; position:absolute; left:50%; top:-60px; margin-left:-60px;}
.prize_redenvelop .prize_box .prize_info{ padding:70px 0 20px; text-align:center;}
.prize_redenvelop .prize_box .prize_info p{ padding: 0 5px; font-size:30px; color:#fff; line-height:40px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.prize_redenvelop .prize_box .prize_info span{ display:block; padding: 0 5px; font-size:14px; color:#fff; line-height:24px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}

.prize_redenvelop .prize_box .ecode_box{padding:1rem 0; background-color:#fff; border-radius:0 0 8px 8px; position:relative;}

.prize_redenvelop .prize_box .ecode_box .round_box{position:absolute; top:-0.3rem; left:0;}
.prize_redenvelop .prize_box .ecode_box .round_box i{float:left; width:0.7rem; height:0.7rem; margin-left:0.2rem; border-radius:50%; background-color:#fff;}

.prize_redenvelop .prize_box .ecode_box .fl{width:3.5rem; height:5rem; text-align:center; font-size:16px; padding-top:1.5rem; box-sizing:border-box;}
.prize_redenvelop .prize_box .ecode_box .fr{float:none; width:3.5rem; height:5rem; font-size:14px; line-height:18px; padding:5px; box-sizing:border-box; display:table-cell; vertical-align:middle;}
.prize_redenvelop .prize_box .ecode_box .ecode_img{float:left; width:5rem; height:5rem;}

.prize_redenvelop .btn_share{ display:block; width:6rem; font-size:16px; font-weight:bold; color:#ff1127; line-height:36px; border-radius:8px; background-color:#ffed00; text-align:center; margin:20px auto 0;}

/*获得现金红包*/
.money_redenvelop{ width:12rem; height:391px; position:absolute; left:50%; top:50%; margin-left:-6rem; z-index:1001; display:none;}
.money_redenvelop .close{padding:5px; font-size:30px; color:#ff000a; font-family:verdana; text-decoration:none; position:absolute; top:-20px; right:0;}
.money_redenvelop .txt{ font-size:24px; color:#ffed00; text-align:center;}
.money_redenvelop .money_box{margin-top:20px;}

.money_redenvelop .money_box .box_top_bg{width:100%;}
.money_redenvelop .money_box .box_main{background-color:#cd330f; border-radius:0 0 8px 8px; text-align:center; position:relative; padding-bottom:20px;}

.money_redenvelop .money_box .box_main .user_photo{width:60px; height:60px; border-radius:50%; border:2px solid #fff; position:absolute; left:50%; top:-30px; margin-left:-30px;}
.money_redenvelop .money_box .box_main .money_info{ padding-top:40px;}
.money_redenvelop .money_box .box_main .money_info span{ font-size:14px; color:#fff; line-height:24px;}
.money_redenvelop .money_box .box_main .money {font-size:14px; color:#fff; line-height:40px; }
.money_redenvelop .money_box .box_main .money b{font-size:40px; font-weight:normal; padding-right:5px; }
.money_redenvelop .money_box .box_main .btn_received{display:inline-block; font-size:16px; color:#fff; line-height:36px; padding:0 30px; border-radius:8px; background-color:#ffb900;}
.money_redenvelop .money_box .box_main .txt{font-size:14px; color:#fff; line-height:18px; padding:10px 40px 0;}

.money_redenvelop .btn_share{ display:block; width:6rem; font-size:16px; font-weight:bold; color:#ff1127; line-height:36px; border-radius:8px; background-color:#ffed00; text-align:center; margin:20px auto 0;}

/*游戏规则*/
.game_rule{width:14rem; border-radius:10px; overflow:hidden; box-shadow:0 0 15px 0 rgba(0,0,0,0.2); position:absolute; top:50%; left:50%; margin-left:-7rem; z-index:99; display:none;}
.game_rule .tit{font-size:24px; font-weight:bold; line-height:50px; color:#fff; text-align:center; background-color:#ff000a;}
.game_rule .cont{padding:10px; font-size:16px; line-height:24px; max-height:312px; overflow-y:auto; background-color:#fff;}


/*中奖记录*/
.winning_record{width:14rem; border-radius:10px; background-color:#ff000a; overflow:hidden; box-shadow:0 0 15px 0 rgba(0,0,0,0.2); position:absolute; top:50%; left:50%; margin-left:-7rem; z-index:99; display:none;}
.winning_record .tit{font-size:24px; font-weight:bold; line-height:50px; color:#fff; text-align:center; }
.winning_record .cont{margin:0 10px 10px; padding:20px 10px 0; max-height:312px; overflow-y:auto; background-color:#fff;}

.winning_record .cont li{height:60px; background-color:#ff1f00; color:#fff; margin-bottom:20px; position:relative;}
.winning_record .cont li a{width:100%; height:100%; color:#fff; display:inline-block;}
.winning_record .cont li .user_info{float:left; width:8rem; margin:10px 0 0 10px;}
.winning_record .cont li .user_info p{font-size:16px; font-weight:bold; line-height:20px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.winning_record .cont li .user_info span{display:block; font-size:12px; line-height:20px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.winning_record .cont li .btn_notReceived{display:inline-block; width:40px; line-height:20px; font-size:12px; color:#fff; text-align:center; background-color:#1fd080; position:absolute; right:75px; bottom:10px;}
.winning_record .cont li .btn_isReceived{display:inline-block; width:40px; line-height:20px; font-size:12px; color:#ff4c00; text-align:center; background-color:#ffed00; position:absolute; right:75px; bottom:10px;}

.winning_record .cont li.prize .prize_img{width:60px; height:60px; /*border:1px solid #bcbcbc;*/ position:absolute; right:8px; bottom:8px;}
.winning_record .cont li.money .money_bg{width:60px; height:60px; background:url(../images/redpack/money_bg.png) no-repeat; background-size:contain; position:absolute; right:8px; bottom:8px;}
.winning_record .cont li.money .money_bg b{display:block; margin-top:32px; font-size:20px; font-weight:normal; color:#ff1f00; text-align:center;  }



/***********遮罩层***********/
.pop_mask{width:100%; height:100%; background-color:rgba(0,0,0,0.77); position:fixed; left:0; top:0; /*display:none;*/}
.pop_mask_black{width:100%; height:100%; background-color:rgba(0,0,0,0.85); position:fixed; left:0; top:0; z-index:1000; display:none;}


.animate_rotate{animation:15s linear 0s normal none infinite rotate; -webkit-animation:15s linear 0s normal none infinite rotate;}
@keyframes rotate {
  0 {transform:rotate(0deg);}
  100% {transform:rotate(360deg);}
}
@-webkit-keyframes rotate {
  0 {-webkit-transform:rotate(0deg);}
  100% {-webkit-transform:rotate(360deg);}
}

.grab_one_redenvelop .one_redenvelop .btn_open.open_anim{
-webkit-transform-style: preserve-3d;
-webkit-animation: rotate_3d 2s infinite ease;
transform-style: preserve-3d;
animation: rotate_3d 2s infinite ease;
}

@-webkit-keyframes rotate_3d {
0 { -webkit-transform: rotateY(0); }
100% { -webkit-transform: rotateY(360deg); }
}
@keyframes rotate_3d {
0 { transform: rotateY(0); }
100% { transform: rotateY(360deg); }
}