@charset "utf-8";
/* CSS Document */
/* 
抽奖弹窗
By：liuyang
ICQ：1845676808
Date：2020/09/02
*/

/**common**/
body, div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,p {padding:0; margin:0; font:14px Arial,\5FAE\8F6F\96C5\9ED1,Helvetica,sans-serif;}
table,td,tr,th{font-size:14px;}
ol,ul {list-style:none;}
li{list-style-type:none;}
img{vertical-align:top;border:0;}
h1,h2,h3,h4,h5,h6{font-size:inherit; font-weight:normal;}
address,cite,code,em,th,i{font-weight:normal; font-style:normal;}
.clear{*zoom:1;}
.clear:after{display:block; overflow:hidden; clear:both; height:0; visibility:hidden; content:".";}
a { text-decoration:none;}
a:visited { text-decoration:none;}
a:hover { text-decoration:none;}
a:active { text-decoration:none;}
.fl { float:left;}
.fr { float:right;}
input {outline:0px; -webkit-appearance:none;}


/**抽奖弹窗**/
.ly_cj { width:100%; height:100%; overflow:hidden; margin:0; padding:0; background:url(../images/main_bg.jpg) 0 0 no-repeat; background-size:100% 100%; position:relative;}
.cj_main { width:780px; height:450px; overflow:hidden; margin:-440px 0 0 -450px; padding:320px 60px 50px; background:url(../images/cj_bg.png) 0 0 no-repeat; position:absolute; left:50%; top:50%;}
.cj_main .cj_left { width:440px; height:440px; margin:0; padding:5px 20px; float:left;}
.cj_main .cj_right { width:260px; height:350px; margin:0; padding:100px 20px 0; float:right;}

#scrollBox { width:260px; height:280px; overflow:hidden; margin:0 auto; padding:0;}
#scrollBox #con1, #con2 { width:260px; float:left;}
#scrollBox li { width:100%; height:40px; overflow:hidden; line-height:40px; color:#333; font-size:14px; text-align:left; white-space: nowrap; text-overflow: ellipsis; margin:0; padding:0 0 0 10px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box;}
#scrollBox li span { color:#eb6100;}
.cj_jpbtn { width:280px; height:48px; margin:22px 0 0 -10px; padding:0 0 20px; background:url(../images/cj_jpbtn.png) center top no-repeat;}
.cj_jpbtn a { display:block; width:260px; height:44px; overflow:hidden; line-height:44px; color:#fff; font-size:20px; text-align:center; margin:0 auto; padding:0 0 4px;}

.lottery-box {
    overflow: hidden;
}
.lottery-box .title {
    text-align: center; padding: 50px 0; font-size: 18px; color: #fff;
}
.lottery {
    overflow: hidden; padding: 15px 20px; width: 400px; margin: 0 auto; background-repeat: no-repeat; background-size: 100% 100%;
}
@keyframes changeBg {
	0% {
		background-image:url(../images/k1.png);
	}
	100% {
		background-image:url(../images/k2.png);
	}
}
.lottery .lottery-item {
    height: 420px; position: relative; margin: 0;
}
.lottery .lottery-item ul li {
    width: 120px; height:120px; position: absolute; padding:0 0 20px; left:0; top:0; background: url(../images/bg2.png) center top no-repeat;
}
.lottery .lottery-item ul li:nth-child(2) {
    left: 140px; top:0;
}
.lottery .lottery-item ul li:nth-child(3) {
    left: 280px; top:0;
}
.lottery .lottery-item ul li:nth-child(4) {
    left: 280px; top: 140px;
}
.lottery .lottery-item ul li:nth-child(5) {
    left: 280px; top: 280px;
}
.lottery .lottery-item ul li:nth-child(6) {
    left: 140px; top: 280px;
}
.lottery .lottery-item ul li:nth-child(7) {
    left: 0; top: 280px;
}
.lottery .lottery-item ul li:nth-child(8) {
    left: 0; top: 140px;
}
.lottery .lottery-item ul li .box {
    height: 140px; position: relative; text-align: center; overflow: hidden; background-size: 100% 100%;
}
.lottery .lottery-item ul li .box img {
    display: block; height: 80px; margin: 0 auto; margin-top: 10px; margin-bottom: 5px;
}
.lottery .lottery-item ul li .box p {
	width:100%; overflow: hidden; color: #4c4c4c; font-size: 14px; white-space: nowrap; text-overflow: ellipsis;
}
.lottery .lottery-item ul li.on .box {
	background: url(../images/bg1.png) no-repeat center; background-size: 100% 100%;
}
.lottery .lottery-item ul li.on .box p {
	color: #fff;
}
.lottery .lottery-item .lottery-start {
	width: 120px; height:120px; padding: 0 0 20px; position: absolute; left: 140px; top: 140px;
}
.lottery .lottery-item .lottery-start .box {
    height: 140px; font-size: 14px; color: #fff; cursor: pointer; text-align: center; overflow: hidden; background: url(../images/bg0.png) no-repeat center; background-size: 100% 100%;
}
.lottery .lottery-item .lottery-start .box p b {
    font-size: 40px; margin-top: 16px; margin-bottom: 15px; line-height: 30px; display: block;
}
.lottery .lottery-item .lottery-start .box:active {
    opacity: 0.7;
}
.lottery .lottery-item .lottery-start .box.gray {
    background: url(../images/bg3.png) no-repeat center; background-size: 100% 100%;
}
.lottery .lottery-item .lottery-start .box.gray p {
    color: #708ABF;  font-weight: bold;
}
.mask {
    width: 100%; height: 100%; background: rgba(0,0,0,0.7); position: fixed; overflow: hidden; z-index: 222; top: 0; left: 0;
}
.lottery-alert {
	width: 390px; height:420px; background: url(../images/zj_bg.png) center top no-repeat; margin: auto; padding: 270px 65px 0; position: fixed; left: 0; top: 50%; right: 0; transform: translateY(-50%); z-index: 9999;
}
.lottery-alert .zj_img {
    width:390px; height:320px; overflow:hidden; margin: 0 auto; padding:0;
}
.lottery-alert .zj_img img {
	display: block; width:390px; height: 320px; margin: 0 auto; padding:0;
}
.lottery-alert .btnsave {
	width:390px; height: 40px; overflow:hidden; margin: 0 auto; padding:0;
}
.btnsave a {
	display:block; width:390px; height: 40px; overflow:hidden; line-height: 40px; color: #ff2101; font-size: 22px; text-align:center; margin: 0; padding: 0; background: url(../images/btn_bg.png) 0 0 repeat-x; border-radius: 8px;
}
.btnsave a img {
	display:inline-block; width:20px; height:20px; vertical-align:middle; margin:-4px 8px 0 0;
}
.lottery-alert p, .lottery-alert span {
	display:block; width:100%; height:30px; overflow:hidden; line-height:30px; font-size:14px; text-align:center; margin:0 auto; padding:0;
}
.lottery-alert p { color:#f83737;}
.lottery-alert span { color:#999;}