*{
	margin: 0;
	padding: 0;
}
html,body {
    position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
    background-size: 100% 100%;
}
#fireworks{
    display: none;
    background: transparent!important;
}
#cionImg,#goldImg{
    display: none;
    width: 1px;
    height: 1px;
    position: absolute;
    top: -1000px;
    left: -1000px;
}
.wealth-god-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}
.wealth-god-wrapper .god1 {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    position: absolute;
    bottom: -488px;
    width: 100%;
    height: auto;
    z-index: 1;
}
.wealth-god-wrapper .god1 img {
    display: block;
    max-width: 100%;
}
.wealth-bag, .wealth-bag2 {
    position: absolute;
    left: 50%;
    bottom: 481px;
    margin-left: -107px;
    width: 214px;
    height: 225px;
    animation-fill-mode: forwards;
    z-index: 22;
    display: none;
}
.wealth-bag2 {
   bottom: 0px; 
   top: -150px;
}
.wealth-bag img, .wealth-bag2 img {
    display: block;
    width: 100%;
}
.wealth-bag2 img {
    transform: rotate(180deg);
}
.star-wrapper {
    display: none;
    position: absolute;
    left: 0;
    top: 145px;
    width: 100%;
    height: 330px;
}
.star-wrapper .star {
    position: absolute;
    background-size: 100% 100%;
}
.star-wrapper .star1 {
    left: 271px;
    top: 3px;
    width: 42px;
    height: 39px;
    background: url('../images/star1.png') no-repeat;
}
.star-wrapper .star2 {
    right: 181px;
    top: 23px;
    width: 68px;
    height: 68px;
    background: url('../images/star3.png') no-repeat;
}
.star-wrapper .star3 {
    left: 199px;
    top: 132px;
    width: 62px;
    height: 55px;
    background: url('../images/star2.png') no-repeat;
}
.star-wrapper .star4 {
    left: 335px;
    top: 184px;
    width: 27px;
    height: 20px;
    background: url('../images/star4.png') no-repeat;
}
.star-wrapper .star5 {
    left: 268px;
    top: 191px;
    width: 30px;
    height: 32px;
    background: url('../images/star5.png') no-repeat;
}
.star-wrapper .star6 {
    right: 112px;
    bottom: 15px;
    width: 113px;
    height: 109px;
    background: url('../images/star6.png') no-repeat;
}
.star-wrapper .star7 {
    right: 249px;
    bottom: 56px;
    width: 28px;
    height: 27px;
    background: url('../images/star7.png') no-repeat;
}
.star-wrapper .star8 {
    left: 93px;
    bottom: 23px;
    width: 60px;
    height: 54px;
    background: url('../images/star8.png') no-repeat;
}
.star-wrapper .star9 {
    left: 229px;
    bottom: 1px;
    width: 59px;
    height: 56px;
    background: url('../images/star9.png') no-repeat;
}
/* 红包 - 旋转上升 */
@keyframes transRotate {
    0% {
        transform: rotateZ(0deg);
        bottom: 481px;
    }
    11% {
        transform: rotateZ(90deg);
        bottom: 605px;
    }
    22% {
        transform: rotateZ(180deg);
        bottom: 729px;
    }
    33% {
        transform: rotateZ(270deg);
        bottom: 835px;
    }
    44% {
        transform: rotateZ(360deg);
        bottom: 977px;
    }
    55% {
        transform: rotateZ(450deg);
        bottom: 1101px;
    }
    66% {
        transform: rotateZ(540deg);
        bottom: 1225px;
    }
    77% {
        transform: rotateZ(630deg);
        bottom: 1349px;
    }
    88% {
        transform: rotateZ(720deg);
        bottom: 1473px;
    }
    100% {
        transform: rotateZ(900deg);
        bottom: 1600px;
    }
}
/* 退场 and 进场 */
@keyframes transMove {
    0%{
        transform: translateY(10%);
        -webkit-transform: translateY(10%);
    }
    20%{
        transform: translateY(20%);
        -webkit-transform: translateY(20%);
    }
    40%{
        transform: translateY(40%);
        -webkit-transform: translateY(40%);
    }
    60%{
        transform: translateY(60%);
        -webkit-transform: translateY(60%);
    }
    80%{
        transform: translateY(80%);
        -webkit-transform: translateY(80%);
    }
    100%{
        transform: translateY(100%);
        -webkit-transform: translateY(100%);
    }
}
@keyframes transMove2 {
    0%{
        top: -150px;
    }
    20%{
        top: -166px;
    }
    40%{
        top: -182px;
    }
    60%{
        top: -198px;
    }
    80%{
        top: -214px;
    }
    100%{
        top: -230px;
    }
}
