@charset "utf-8";
body{max-width: 640px; margin: 0 auto; font-size: 14px;}
.container{padding: 0;}
.container .promotion-top{width: 100%; background: url(../img/game/guaguale_top.png) no-repeat; background-size: 100% 100%; padding: 30% 0; position: relative; text-align: center;}
.container .promotion-top .promotion-info{position: absolute; top: 20px; height: 30px; z-index: 2; width: 100%;}
.container .promotion-top .promotion-info .member-integral{display: inline-block; padding-left: 28px; background: #fff url(../img/game/member_integral.png) no-repeat 3px 3px/18px; float: left; height: 25px; line-height: 25px; padding-right: 10px; border-top-right-radius: 13px; border-bottom-right-radius: 13px;font-size: 12px;}
.container .promotion-top .promotion-info .game-rule{display: inline-block; padding-left: 28px; background: url(../img/game/game_rule.png) no-repeat 3px 3px/13px; float: right; height: 25px; line-height: 25px; padding-right: 10px; border-top-right-radius: 13px; border-bottom-right-radius: 13px;background-size: 18px;}
.container .promotion-top .how-many{color: #fff; display: inline-block; position: absolute; bottom: 0; white-space: nowrap; left: 50%; transform: translateX(-50%); font-size: 13px; padding: 5px 12px; border-radius: 15px;}
.container .promotion-top .how-many em{font-style: normal;}
.container .scratch-cards{padding: 20px 0 0 0; text-align: center;}
.container .scratch-cards .scratch-cards-area{width: 90%; height: 130px; margin: 0 auto; position: relative; max-width: 300px;}
.container .scratch-cards .scratch-cards-area #redux, .container .scratch-cards .scratch-cards-area #scratch_card{width: 100%; height: 100%; position: absolute; left: 0; top: 0;}
.container .scratch-cards .scratch-cards-area #scratch_card{background: url(../img/game/guaguale_center.png) no-repeat; background-size: 100% 100%;}
.container .tip{padding: 10px 5%; color: #fff; line-height: 1.5;}
.shade{position: fixed; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); max-width: 640px; left: 50%; transform: translateX(-50%); display: none; z-index: 10;}
.shade .promotion-game-rule-container{width: 89%; padding: 20px 0; margin: 0 auto; position: relative; top: 50%; border-radius: 15px; color: #fff; border: 4px solid; transform: translateY(-50%); -ms-transform: translateY(-50%); /* IE 9 */ -moz-transform: translateY(-50%); /* Firefox */ -webkit-transform: translateY(-50%); /* Safari 和 Chrome */ -o-transform: translateY(-50%);}
.shade .promotion-game-rule-container .popup-title{text-align: center; line-height: 35px; font-size: 16px; letter-spacing: 2px;}
.shade .promotion-game-rule-container .popup-content{margin: 0 15px; max-height: 400px; overflow-x: hidden; overflow-y: scroll;}
.shade .promotion-game-rule-container .shade-close{position: absolute; top: -40px; display: block; width: 26px; height: 26px; color: #fff; right: -5px; border-radius: 50%; border: 2px solid; text-align: center; line-height: 26px;}
.shade .promotion-game-rule-container .shade-close i{display: block; line-height: 20px;}
.shade .promotion-game-rule-container .popup-content p{color: #fff;}
.shade .promotion-game-rule-container .popup-content table{width: 100%; margin: 5px 0;}
.shade .promotion-game-rule-container .popup-content table tr th, .shade .promotion-game-rule-container .popup-content table tr td{font-weight: normal; line-height: 25px; text-align: center; border: 1px solid #fff;}
.shade .promotion-game-rule-container .project-title{font-weight: normal; line-height: 30px; color: #fff;}
/*获奖记录*/
.container .winning-record{padding: 10px 5%;}
.container .winning-record ul{width: 100%;}
.container .winning-record ul li{height: 30px;line-height: 30px;color: #fff; font-size: 12px;}
.container .winning-record ul li span{white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis;}
.dis-none{display: none;}
.login-layer{position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99;}
.layer-curtain{width: 100%; height: 100%; background: rgba(0, 0, 0, .7); position: absolute;}
.layer-content{width: 70%; background: #fff; position: relative; margin: 20vh auto; border-radius: 3px; text-align: center; padding: 45px 20px;}
.layer-icon{width: 45px; margin: 0 auto;}
.layer-text{font-size: 16px; margin: 10px 0;}
.layer-desc{font-size: 12px;}
.layer-btn{height: 30px; line-height: 30px; margin-top: 20px;}
.restriction{position: fixed;bottom: 0px;text-align: center;width: 100%;padding: 10px 0px;background: #db0c38;}
.restriction p.ns-text-color-gray{color:#fff !important}
.restriction button{border: 1px solid #fff;margin-top: 5px;color: #000;border-radius: 10px;background: yellow !important;color: #FF0036;}