.raffleBox {
    margin: 0;
    height: 1200px;
    background: url("../img/anniversary/choujiang/bg.svg") no-repeat;
    position: relative;
}

#raffle-lucky {
    position: absolute;
    top: 291.46px;
    left: 723.48px;
    /*top: 43.12%;*/
    /*left: 49.9%;*/
    /*transform: translate(-50%,-50%);*/
}

.turntableTitle {
    height: 60px;
    position: absolute;
    left: 832px;
    top: 80px;
}

.remainingTimes {
    position: absolute;
    left: 842px;
    bottom: 326px;
    /*top: 71.6%;*/
    /*left: 50%;*/
    /*transform: translate(-50%,-50%);*/
    width: 220px;
    height: 40px;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: 700;
    background: #F04848;
    border-radius: 20px;
    line-height: 40px;
    text-align: center;
}

.remainingTimes span {
    color: #FFE19A;
}

.modelBox {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    z-index: 10002;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
    margin: 0;
    display: none;
}

.modelBox .modelCon {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 580px;
    height: 580px;
    transform: translate(-50%,-50%);
}

.modelBox .integralCon {
    background: url("../img/anniversary/choujiang/integralModel.png") no-repeat;
    background-size: 580px 580px;
}

.modelBox .alreadyCon,.modelBox .notInCon {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 400px;
    height: 446px;
    transform: translate(-50%,-50%);
}

.modelBox .alreadyCon {
    background: url("../img/anniversary/choujiang/already.png") no-repeat;
    background-size: 400px 446px;
}

.modelBox .notInCon {
    background: url("../img/anniversary/choujiang/notIn.png") no-repeat;
    background-size: 400px 446px;
}

.modelBox .productCon {
    background: url("../img/anniversary/choujiang/product.png") no-repeat;
    background-size: 580px 580px;
}

.modelBox .alreadyCon .title,.modelBox .notInCon .title {
    margin-top: 40px;
}

.modelBox .alreadyCon .content {
    font-size: 24px;
    margin-top: 186px;
}

.modelBox .notInCon .content {
    margin-top: 175px;
}

.modelBox .alreadyCon .content span {
    color: #EA1313;
}

.modelBox .alreadyCon .determine {
    transform: translate(-50%, 10px);
}

.modelBox .notInCon .determine {
    transform: translate(-50%, 0);
}

.modelBox .productCon .determine {
    transform: translate(-50%, 32px);
}

.modelBox .modelCon .closeIcon {
    width: 24px;
    height: 24px;
    position: absolute;
    right: 20%;
    top: 16%;
    cursor: pointer;
}

.modelBox .alreadyCon .closeIcon,.modelBox .notInCon .closeIcon {
    width: 24px;
    height: 24px;
    position: absolute;
    right: 7%;
    top: 6%;
    cursor: pointer;
}

.modelBox .title {
    height: 47px;
    font-size: 32px;
    font-weight: bold;
    color: #7D2506;
    line-height: 47px;
    text-align: center;
}

.modelBox .modelCon .title {
    margin-top: 107px;
}

.modelBox .content {
    font-weight: 500;
    color: #7D2506;
    text-align: center;
    line-height: 27px;
    margin-top: 14px;
}

.modelBox .modelCon .content {
    font-size: 18px;
    margin-top: 14px;
}

.modelBox .modelCon .content span {
    color: #EA1313;
}

.modelBox .modelCon .prizeName {
    height: 29px;
    font-size: 20px;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 29px;
    text-align: center;
    margin-top: 40px;
}

.modelBox .modelCon .prizeNum {
    height: 54px;
    font-size: 20px;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 54px;
    text-align: center;
    margin-top: 6px;
}

.modelBox .modelCon .prizeNum span {
    font-size: 36px;
}

.modelBox .determine {
    cursor: pointer;
    position: absolute;
    left: 50%;
}

.modelBox .integralCon .determine {
    transform: translate(-50%, 24px);
}

.productCon .detail {
    display: flex;
    align-items: center;
    margin: 66px 0 0 142px;

}

.productCon .detail .detailLeft {
    width: 85px;
    height: 54px;
    font-size: 36px;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 54px;
}

.productCon .detail .detailRight {
    margin-left: 60px;
}

.productCon .detail .detailRight .productDetail {
    font-size: 20px;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 29px;
}

