*{margin: 0 ;padding: 0;}
#jp_cj{max-width: 1920px;height: auto;margin: 0 auto;}
#jp_cj img{vertical-align: middle;}
#jp_cj .cj_banner {width: 100%;position: relative;}
#jp_cj .cj_banner img{width: 100%;height: auto;}
#jp_cj .cj_bottom{position: absolute;bottom: -5%;left: 50%;width: 230px;transform: translate(-50%,0%);text-align: center;}/**/
#jp_cj .cj_bottom img{width: 100%;}
#jp_cj .cj_cont{width: 100%;height:auto;background: url(https://resource.xp-pen.com/static/images/code_prize/bg.webp) top;}
#jp_cj .cj_cont1{max-width: 810px;margin: 0 auto;text-align: center;padding-top: 150px;}/***/
#jp_cj .cont1_title{width:200px;margin: 0 auto;margin-bottom: 70px;}
#jp_cj .cont1_title img{width: 100%;}
#jp_cj .cont1_detail {max-width: 802px;height: auto;margin: 0 auto;margin-bottom: 60px;}
#jp_cj .cont1_detail img{width: 100%;}
#jp_cj .cont1_title2{width:259px;margin: 0 auto;margin-bottom: 30px;}
#jp_cj .cont1_title2 img{width: 100%;}
#jp_cj .cj_prize1{width: 100%;height: auto;}
#jp_cj .cj_prize1 img{width: 100%;} 
#jp_cj .cj_prize3 {width: 100%;height: auto;display: flex;justify-content: space-between;margin-bottom: 40px;}
#jp_cj .cj_prize3 img{width: 50%;}
#jp_cj .cj_button {max-width: 45.7%;height: auto;margin: 0 auto;margin-bottom: 80px;}
#jp_cj .cj_button img{width: 100%;}
#jp_cj .cont1_title3{width:200px;margin: 0 auto;margin-bottom: 70px;}
#jp_cj .cont1_title3 img{width: 100%;}
#jp_cj .cj_process{width: 100%;height: auto;display: flex;flex-wrap: wrap; justify-content: space-between;}
#jp_cj .process1{width: 30%;height: auto;border: 2px solid #D7A642 ;border-radius: 6px;margin-bottom: 80px;padding-bottom: 40px;}
#jp_cj .process2{width: 30%;height: auto;}
#jp_cj .process1_bz1{width: 100%;transform: translate(0%,-50%);margin-bottom: 40px;text-align: center;}
#jp_cj .process1_bz1 img{width: 70px;}
#jp_cj .process1_bz2 {width: 100%;text-align: center;margin-bottom: 20px;}
#jp_cj .process1_bz2 img{width: 70px;}
#jp_cj .process1_p{font-size: 16px;line-height: 1.3;color: #fff;padding: 0 5px;font-weight: bold;margin-bottom: 10px;}
#jp_cj .process1_p2{font-size: 14px;line-height: 1.3;color: #fff;padding: 0 8px;font-weight: bold;}
#jp_cj .cj_note_matter{width: 100%;text-align: left;padding-bottom: 80px;}
#jp_cj .cj_note_matter img{width: 81%;}
/*自制弹窗样式*/
#jp_cj .mark {display: none;height:auto; width: 300px;position: absolute; left: 50%; top: 50%;transform: translate(-50%, -50%);
background:#fff; border-radius:8px;z-index: 9;padding: 30px 20px;box-sizing: border-box;}
#jp_cj .position_jp_cj{position: absolute; left: 50%; top: 50%;transform: translate(-50%, -50%);}
#jp_cj .position_jp{width: 100%;height: 100%;background: rgba(00,00,00, .3);position: fixed;z-index: 9;display: none;top: 0;left: 0;}
#jp_cj .cq_jp{max-width:180px;}
#jp_cj .cq_jp img{width: 100%;}
#jp_cj .jp_congratulate{font-size: 16px;color: #e60013;line-height: 1.3;font-weight: bold;text-align: center;margin-bottom: 15px;}
#jp_cj .jp_lucky{border: 2px solid #D7A642; color: #D73E3B;font-weight: bold;font-size: 60px;line-height: 1.3; padding: 10px;text-align: center;letter-spacing: 1rem; text-indent: 1rem;margin-bottom: 15px;}
#jp_cj .jp_lucky2{border: 2px solid #D7A642;padding: 10px;text-align: center;margin-bottom: 20px;}
#jp_cj .jp_lucky2_p{color: #000;line-height: 1.3;padding: 15px 10px;font-size: 16px;}
#jp_cj .jp_receive{width: 100%; text-align: center;height: auto;}
#jp_cj .jp_receive span{color: #fff;background: #000;width: 80%;padding: 8px 0; display: inline-block;border-radius: 25px;}
/* runout次数用完 */
#jp_cj .jp_runout{width: 100%;height: auto;padding: 50px 0px;text-align: center;margin-bottom: 15px;}
#jp_cj .jp_runout_txt{font-size: 16px;line-height: 1.3;color: #000;}
@media screen and (max-width: 1600px ){
	#jp_cj .cj_bottom{position: absolute;bottom: -10%;left: 50%;width: 230px;transform: translate(-50%,0%);text-align: center;}/**/
}
@media screen and (max-width: 1400px ){
	#jp_cj .cj_bottom{position: absolute;bottom: -15%;left: 50%;width: 230px;transform: translate(-50%,0%);text-align: center;}/**/
}
@media screen and (max-width: 1080px ){
	#jp_cj .cj_bottom {bottom: 0%;left: 50%;transform: translate(-50%,100%);}
}
@media screen and (max-width: 992px ){
	#jp_cj .cj_prize1 {padding: 0 10px; box-sizing: border-box;}
	#jp_cj .cj_prize3 {padding: 0 10px; box-sizing: border-box;}
	#jp_cj .cj_process {padding: 0 10px; box-sizing: border-box;}	
	#jp_cj .cj_note_matter {padding: 0 10px; padding-bottom: 80px;box-sizing: border-box;}
}

@media screen and (max-width:660px ){
	#jp_cj .cj_process {justify-content: space-around;}
	#jp_cj .process1 {width: 40%;}
	#jp_cj .process2 {width: 40%;}
	#jp_cj .cj_bottom {width: 180px;transform: translate(-50%,140%);}
	#jp_cj .cq_jp{max-width:160px;}
}
@media screen and (max-width:520px ){
	#jp_cj .process1 {width: 58%;}
	#jp_cj .process2 {width: 58%;}
	#jp_cj .cj_note_matter img {width: 96%;}
	#jp_cj .cj_bottom { width: 160px; transform: translate(-50%,160%);}
	#jp_cj .cq_jp{max-width:140px;}
}
@media screen and (max-width:400px ){
	#jp_cj .cj_bottom { width: 140px;transform: translate(-50%,180%);}
	#jp_cj .process1 {width: 66%;}
	#jp_cj .process2 {width: 66%;}
	#jp_cj .cq_jp{max-width:120px;}
}
.layui-layer-setwin .layui-layer-close2 { right: -10px;top: -10px;}
















.animated {-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-fill-mode: both;animation-fill-mode: both}
.animated.infinite {-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite}
.animated.b1 {-webkit-animation-iteration-count: 1;animation-iteration-count: 1}
.animated.b2 {-webkit-animation-iteration-count: 2;animation-iteration-count: 2}
.animated.b3 {-webkit-animation-iteration-count: 3;animation-iteration-count: 3}
@-webkit-keyframes shake {
	from,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0)}
	10%,30%,50%,70%,90% {-webkit-transform: translate3d(-40px, 0, 0);transform: translate3d(-40px, 0, 0)}
	20%,40%,60%,80% {-webkit-transform: translate3d(40px, 0, 0);transform: translate3d(40px, 0, 0)}
}
@keyframes shake {
	from,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0)}
	10%,30%,50%,70%,90% {-webkit-transform: translate3d(-40px, 0, 0);transform: translate3d(-40px, 0, 0)}
	20%,40%,60%,80% {-webkit-transform: translate3d(40px, 0, 0);transform: translate3d(40px, 0, 0)}
}
.shake {-webkit-animation-name: shake;animation-name: shake}
@-webkit-keyframes xz90 {
	from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1)}
	10% {-webkit-transform: rotate3d(0, 0, 1, 9deg);transform: rotate3d(0, 0, 1, 9deg)}
	20% {-webkit-transform: rotate3d(0, 0, 1, 18deg);transform: rotate3d(0, 0, 1, 18deg)}
	30% {-webkit-transform: rotate3d(0, 0, 1, 27deg);transform: rotate3d(0, 0, 1, 27deg)}
	40% {-webkit-transform: rotate3d(0, 0, 1, 36deg);transform: rotate3d(0, 0, 1, 36deg)}
	50% {-webkit-transform: rotate3d(0, 0, 1, 45deg);transform: rotate3d(0, 0, 1, 45deg)}
	60% {-webkit-transform: rotate3d(0, 0, 1, 54deg);transform: rotate3d(0, 0, 1, 54deg)}
	70% {-webkit-transform: rotate3d(0, 0, 1, 63deg);transform: rotate3d(0, 0, 1, 63deg)}
	80% {-webkit-transform: rotate3d(0, 0, 1, 72deg);transform: rotate3d(0, 0, 1, 72deg)}
	90% {-webkit-transform: rotate3d(0, 0, 1, 81deg);transform: rotate3d(0, 0, 1, 81deg)}
	to {-webkit-transform: rotate3d(0, 0, 1, 90deg);transform: rotate3d(0, 0, 1, 90deg)}
}
@keyframes xz90 {
	from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1)}
	10% {-webkit-transform: rotate3d(0, 0, 1, 9deg);transform: rotate3d(0, 0, 1, 9deg)}
	20% {-webkit-transform: rotate3d(0, 0, 1, 18deg);transform: rotate3d(0, 0, 1, 18deg)}
	30% {-webkit-transform: rotate3d(0, 0, 1, 27deg);transform: rotate3d(0, 0, 1, 27deg)}
	40% {-webkit-transform: rotate3d(0, 0, 1, 36deg);transform: rotate3d(0, 0, 1, 36deg)}
	50% {-webkit-transform: rotate3d(0, 0, 1, 45deg);transform: rotate3d(0, 0, 1, 45deg)}
	60% {-webkit-transform: rotate3d(0, 0, 1, 54deg);transform: rotate3d(0, 0, 1, 54deg)}
	70% {-webkit-transform: rotate3d(0, 0, 1, 63deg);transform: rotate3d(0, 0, 1, 63deg)}
	80% {-webkit-transform: rotate3d(0, 0, 1, 72deg);transform: rotate3d(0, 0, 1, 72deg)}
	90% {-webkit-transform: rotate3d(0, 0, 1, 81deg);transform: rotate3d(0, 0, 1, 81deg)}
	to {-webkit-transform: rotate3d(0, 0, 1, 90deg);transform: rotate3d(0, 0, 1, 90deg)}
}
.xz90 {-webkit-animation-duration:0.2s;animation-duration:0.2s;-webkit-animation-name: xz90;animation-name: xz90}
@-webkit-keyframes xz45 {
	from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1)}
	10% {-webkit-transform: rotate3d(0, 0, 1, 4.5deg);transform: rotate3d(0, 0, 1, 4.5deg)}
	20% {-webkit-transform: rotate3d(0, 0, 1, 9deg);transform: rotate3d(0, 0, 1, 9deg)}
	30% {-webkit-transform: rotate3d(0, 0, 1, 13.5deg);transform: rotate3d(0, 0, 1, 13.5deg)}
	40% {-webkit-transform: rotate3d(0, 0, 1, 18deg);transform: rotate3d(0, 0, 1, 18deg)}
	50% {-webkit-transform: rotate3d(0, 0, 1, 22.5deg);transform: rotate3d(0, 0, 1, 22.5deg)}
	60% {-webkit-transform: rotate3d(0, 0, 1, 27deg);transform: rotate3d(0, 0, 1, 27deg)}
	70% {-webkit-transform: rotate3d(0, 0, 1, 31.5deg);transform: rotate3d(0, 0, 1, 31.5deg)}
	80% {-webkit-transform: rotate3d(0, 0, 1, 36deg);transform: rotate3d(0, 0, 1, 36deg)}
	90% {-webkit-transform: rotate3d(0, 0, 1, 40.5deg);transform: rotate3d(0, 0, 1, 40.5deg)}
	to {-webkit-transform: rotate3d(0, 0, 1, 45deg);transform: rotate3d(0, 0, 1, 45deg)}
}
@keyframes xz45 {
	from {-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1)}
	10% {-webkit-transform: rotate3d(0, 0, 1, 4.5deg);transform: rotate3d(0, 0, 1, 4.5deg)}
	20% {-webkit-transform: rotate3d(0, 0, 1, 9deg);transform: rotate3d(0, 0, 1, 9deg)}
	30% {-webkit-transform: rotate3d(0, 0, 1, 13.5deg);transform: rotate3d(0, 0, 1, 13.5deg)}
	40% {-webkit-transform: rotate3d(0, 0, 1, 18deg);transform: rotate3d(0, 0, 1, 18deg)}
	50% {-webkit-transform: rotate3d(0, 0, 1, 22.5deg);transform: rotate3d(0, 0, 1, 22.5deg)}
	60% {-webkit-transform: rotate3d(0, 0, 1, 27deg);transform: rotate3d(0, 0, 1, 27deg)}
	70% {-webkit-transform: rotate3d(0, 0, 1, 31.5deg);transform: rotate3d(0, 0, 1, 31.5deg)}
	80% {-webkit-transform: rotate3d(0, 0, 1, 36deg);transform: rotate3d(0, 0, 1, 36deg)}
	90% {-webkit-transform: rotate3d(0, 0, 1, 40.5deg);transform: rotate3d(0, 0, 1, 40.5deg)}
	to {-webkit-transform: rotate3d(0, 0, 1, 45deg);transform: rotate3d(0, 0, 1, 45deg)}
}
.xz45 {-webkit-animation-duration:0.2s;animation-duration:0.2s;-webkit-animation-name: xz45;animation-name: xz45}
/* shake1 上下晃动 */
@-webkit-keyframes shake1 {
	from,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0)}
	10%,30%,50%,70%,90% {-webkit-transform: translate3d(0,-40px,0);transform: translate3d(0,-40px,0)}
	20%,40%,60%,80% {-webkit-transform: translate3d(0,40px,0);transform: translate3d(0,40px,0)}
}
@keyframes shake1 {
	from,to {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0)}
	10%,30%,50%,70%,90% {-webkit-transform: translate3d(0,-40px,0);transform: translate3d(0,-40px,0)}
	20%,40%,60%,80% {-webkit-transform: translate3d(0,40px,0);transform: translate3d(0,40px,0)}
}
.shake1 {-webkit-animation-name: shake1;animation-name: shake1}
@-webkit-keyframes gl90 {
	from {-webkit-transform: scale3d(1, 1, 1, -0deg);transform: scale3d(1, 1, 1, -0deg )}
	10% {-webkit-transform: rotate3d(0, 0, 1, -10deg);transform: rotate3d(0, 0, 1, -10deg)}
	20% {-webkit-transform: rotate3d(0, 0, 1, -20deg);transform: rotate3d(0, 0, 1, -20deg)}
	30% {-webkit-transform: rotate3d(0, 0, 1, -30deg);transform: rotate3d(0, 0, 1, -30deg)}
	40% {-webkit-transform: rotate3d(0, 0, 1, -40deg);transform: rotate3d(0, 0, 1, -40deg)}
	50% {-webkit-transform: rotate3d(0, 0, 1, -50deg);transform: rotate3d(0, 0, 1, -50deg)}
	60% {-webkit-transform: rotate3d(0, 0, 1, -60deg);transform: rotate3d(0, 0, 1, -60deg)}
	70% {-webkit-transform: rotate3d(0, 0, 1, -70deg);transform: rotate3d(0, 0, 1, -70deg)}
	80% {-webkit-transform: rotate3d(0, 0, 1, -80deg);transform: rotate3d(0, 0, 1, -80deg)}
	to {-webkit-transform: rotate3d(0, 0, 1, -90deg);transform: rotate3d(0, 0, 1, -90deg)}
}
@keyframes gl90 {
	from {-webkit-transform: scale3d(1, 1, 1, -0deg);transform: scale3d(1, 1, 1, -0deg )}
	10% {-webkit-transform: rotate3d(0, 0, 1, -10deg);transform: rotate3d(0, 0, 1, -10deg)}
	20% {-webkit-transform: rotate3d(0, 0, 1, -20deg);transform: rotate3d(0, 0, 1, -20deg)}
	30% {-webkit-transform: rotate3d(0, 0, 1, -30deg);transform: rotate3d(0, 0, 1, -30deg)}
	40% {-webkit-transform: rotate3d(0, 0, 1, -40deg);transform: rotate3d(0, 0, 1, -40deg)}
	50% {-webkit-transform: rotate3d(0, 0, 1, -50deg);transform: rotate3d(0, 0, 1, -50deg)}
	60% {-webkit-transform: rotate3d(0, 0, 1, -60deg);transform: rotate3d(0, 0, 1, -60deg)}
	70% {-webkit-transform: rotate3d(0, 0, 1, -70deg);transform: rotate3d(0, 0, 1, -70deg)}
	80% {-webkit-transform: rotate3d(0, 0, 1, -80deg);transform: rotate3d(0, 0, 1, -80deg)}
	to {-webkit-transform: rotate3d(0, 0, 1, -90deg);transform: rotate3d(0, 0, 1, -90deg)}
}
.gl90 {-webkit-animation-duration:0.3s;animation-duration:0.3s;-webkit-animation-name: gl90;animation-name: gl90}