/*通用样式1*/
*{box-sizing: border-box;margin:0; padding:0;font-family:"微软雅黑";}
body {  color:#555; font-size:14px; height: 100vh;width: 100%;overflow-x: hidden;display: block;margin: auto;position: relative;background-color: rgba(26, 188, 156, 1);padding-right: 0!important;overflow-y:scroll }
ol,ul,li { list-style:none; }
img { border:none; }

/*******************隐藏滚动条******************/
*::-webkit-scrollbar {width : 0px;height: 1px;}
*::-webkit-scrollbar-thumb {border-radius: 1px;box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);background: #535353;}
*::-webkit-scrollbar-track {box-shadow   : inset 0 0 5px rgba(0, 0, 0, 0.2);border-radius: 1px;background   : #ededed;}



/*加载动画css*/
.chromeframe {margin: 0.2em 0;background: #ccc;color: #000;padding: 0.2em 0;}
#loader-wrapper {position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index:999999;}
#loader {display: block;position: relative;left: 50%;top: 50%;width: 150px;height: 150px;margin: -75px 0 0 -75px;border-radius: 50%;border: 3px solid transparent;border-top-color: #FFF;-webkit-animation: spin 2s linear infinite;-ms-animation: spin 2s linear infinite;-moz-animation: spin 2s linear infinite;-o-animation: spin 2s linear infinite;animation: spin 2s linear infinite;z-index:1001;}
#loader:before {content: "";position: absolute;top: 5px;left: 5px;right: 5px;bottom: 5px;border-radius: 50%;border: 3px solid transparent;border-top-color: #FFF;-webkit-animation: spin 3s linear infinite;-moz-animation: spin 3s linear infinite;-o-animation: spin 3s linear infinite;-ms-animation: spin 3s linear infinite;animation: spin 3s linear infinite;}
#loader:after {content: "";position: absolute;top: 15px;left: 15px;right: 15px;bottom: 15px;border-radius: 50%;border: 3px solid transparent;border-top-color: #FFF;-moz-animation: spin 1.5s linear infinite;-o-animation: spin 1.5s linear infinite;-ms-animation: spin 1.5s linear infinite;-webkit-animation: spin 1.5s linear infinite;animation: spin 1.5s linear infinite;}


@-webkit-keyframes spin {
    0%{
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }100%{
         -webkit-transform: rotate(360deg);
         -ms-transform: rotate(360deg);
         transform: rotate(360deg);  }
}

@keyframes spin {
    0%{
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }100%{
         -webkit-transform: rotate(360deg);
         -ms-transform: rotate(360deg);
         transform: rotate(360deg);  }
}


#loader-wrapper .loader-section {position: fixed;top: 0;width: 50%;height: 100%;z-index: 1000;-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);  }
#loader-wrapper .loader-section.section-left {left: 0;background-size: 100%;}
#loader-wrapper .loader-section.section-right {right: 0;background-size: 100%;}


.loaded #loader-wrapper .loader-section.section-left {-webkit-transform: translateX(-100%);-ms-transform: translateX(-100%);transform: translateX(-100%);-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);}
.loaded #loader-wrapper .loader-section.section-right {-webkit-transform: translateX(100%);-ms-transform: translateX(100%);transform: translateX(100%);-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);}
.loaded #loader {opacity: 0;-webkit-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.loaded #loader-wrapper {visibility: hidden;-webkit-transform: translateY(-100%);-ms-transform: translateY(-100%);transform: translateY(-100%);-webkit-transition: all 0.3s 1s ease-out;transition: all 0.3s 1s ease-out;}

.no-js #loader-wrapper {display: none;}
.no-js h1 {color: #222222;}
#loader-wrapper .load_title {font-family:'微软雅黑';color:#FFF; font-size:19px; width:100%; text-align:center; z-index:9999999999999; position:absolute; top:60%; opacity:1; line-height:30px; }
#loader-wrapper .load_title span {  font-weight:normal; font-style:italic; font-size:13px; color:#FFF; opacity:0.5;}
/*加载动画css 结束*/

/*element-ui 通用*/
.message{width: 100%;max-width: 80%;min-width: auto!important}
.is-bordered-label{padding: 10px 5px!important; }

/*富文本*/
.tinymce{padding: 0.3rem 0.1rem;}
.tinymce img {max-width: 100%;height: auto}
.sming-des img {max-width: 100%;height: auto}
/*富文本 结束*/


#app{overflow-x: hidden;}
#main{min-height: 100vh;background-size: 100%;padding-bottom: 1px;}
/*标题*/
#title{width: 10rem;margin: 0 auto;position: relative;top:0}
#title img{width: 100%;}

/*游戏*/
#game{width: 10rem;min-height: 3rem;position: relative;z-index: 10}


/*规则弹窗*/
#guize{position: absolute;max-width: 2.5rem;max-height: 2.5rem;top:0;left:0;z-index: 11}
#guize img{width: 100%}
/*规则说明  抽屉组件 消除边框*/
/*.el-drawer /deep/ :focus {outline: none;}*/
.el-drawer:focus {outline: none;}
.guize{border-radius: 15px 15px 0 0!important;z-index: 999999!important;max-width: 640px;margin: 0 auto;height: auto!important;
    max-height: 90%;
    min-height: 40%;}
.guize .el-drawer__body{overflow: auto;}
.guize .guize-content{padding: 15px;}

.guize .el-drawer__header{text-align: center;border-bottom: 1px solid #e6e6e6;font-weight: bold;padding:10px 20px;font-size: 16px;letter-spacing: 1px;    color: #333;margin-bottom: 0;}
.guize .sming-popuo-title{font-weight: bold;line-height: 40px;font-size: 14px;color: #000;}
.guize ul li{height: 1.2rem;line-height: 1.2rem;margin-bottom: 8px;border-radius: 5px;background:linear-gradient(50deg,rgb(254 254 254),#f6f5f5 50%,#eeecec);overflow: hidden;display: flex;align-items: center}
.guize ul li .sming-p{width: 100%;display: flex;justify-content: space-between}
.guize ul li .sming-p h2{font-size: 0.3rem;min-width: 2rem;}
.guize ul li:nth-child(1){background:linear-gradient(50deg,rgb(251 249 242),#f5ecd3 50%,#ffeaa7);}
.guize ul li:nth-child(2){background:linear-gradient(50deg,rgb(251 241 241),#f7e8d8 50%,#fedab7);}
.guize ul li:nth-child(3){background:linear-gradient(50deg,rgb(251 251 253),#eaedf9 50%,#e8ebf8);}

.guize ul li .ul-li-bg{width: 0.8rem;height: 0.8rem;display: inline-block;text-align: center;line-height: 0.8rem;font-weight: bold;color: #732f2f;margin-right: 10px;background-size: 100%}
.guize ul li .ul-li-tag{float: right;margin-right: 0.15rem;height: 1.2rem;}
.guize .el-popup-parent--hidden {padding-right: 0!important;}
.guize .el-drawer__body::-webkit-scrollbar {width : 0px;height: 1px;}
.guize .sming-des img{max-width: 100%;height: auto}



/*我的奖品*/
#my{position: absolute;max-width: 2.5rem;max-height: 2.5rem;top:0;left:0;z-index: 11}
#my img{width: 100%}

/*我的中奖信息  抽屉组件 消除边框*/
/*.el-drawer /deep/ :focus {outline: none;}*/
.el-drawer:focus {outline: none;}
.my{border-radius: 15px 15px 0 0!important;z-index: 9999!important;max-width: 640px;margin: 0 auto;background-color: transparent!important;}
/*.el-drawer__wrapper{z-index: 4000!important;}*/
.my .el-drawer__body{overflow: auto;}
.my .my-box{padding: 0.3rem 0.2rem 0rem;width: 100%;margin: 0 auto;height: 100%;border-radius: 5px 5px 0 0;position: absolute;top: 0.6rem;left: 0;right: 0;background: linear-gradient(to right, #fea86f, #ffc79d) ;}
.my-close{position: absolute;right: 0.3rem;top: 0.4rem;font-size: 0.6rem;width: 1rem;height: 1rem;text-align: center;color: #fff;z-index: 10000;}
.my .el-drawer__header{text-align: center;font-weight: bold;padding:10px 20px;font-size: 16px;letter-spacing: 1px;    color: #333;margin-bottom: 0;z-index: 10;display: none}
.my .my-content::-webkit-scrollbar {width : 0px;height: 1px;}

.my .my-box .my-title{width: calc(100% + 0.4rem);left: -0.2rem;position: relative;z-index: 1;top: -0.6rem;margin-bottom: 3px;font-weight: 600;color: #fff}
.my .my-box .my-title img{width: 100%}
.my .my-title span{position: absolute;width: 100%;height: 100%;left: 0;text-align: center;display: flex;top: 0;justify-content: center;align-items: center;}



/*我的中奖信息*/
.my .choujiang{padding: 0.2rem;width: 100%;margin: 0 auto;height: calc(100% - 1.8rem);overflow-y: auto;overflow-x:hidden;border-radius: 5px;background: #fff url(../images/piaofu1.png);background-size: 100%}

.cj-search{padding: 0.2rem 0.2rem 0.5rem;border-bottom: 1px dashed #efeded;position: relative}
.cj-search .sub-search-inp{margin-top: 0.2rem;
    padding: 0 15px;height: 1.1rem;
    width: 100%;
    border: none;background: #fff3eb;
    box-shadow: 0 0 3px 0 #c1c9c4;}
.cj-search .sub-search-btn{position: absolute;
    right: 0;
    top: 0.4rem;
    width: 2rem;
    height: 1.1rem;
    background: #fa2727;
    color: #fff;
    line-height: 1.1rem;
    text-align: center;}


.zj-li{width: 100%;padding: 0.2rem;;position: relative;    box-sizing: border-box;}

.cj-search .qiu1{width: 0.2rem;height: 0.2rem;background: #f60;position: absolute;;border-radius: 50%;left: -0.27rem;bottom: -0.13rem;}
.cj-search .qiu2{width: 0.2rem;height: 0.2rem;background: #f60;position: absolute;;border-radius: 50%;right: -0.27rem;bottom: -0.13rem;}

.zj-li-ul{display: flex;border-bottom: 1px dashed #efeded;position: relative;}
.zj-li-ul img{width: 100%;}
.zj-li-ul .zj-li-l{width: 2rem;height: 2rem;}

.zj-li-ul .zj-li-c{width: 8rem;height: 1rem;display: flex;flex-wrap: wrap;align-items: center;}
.zj-li-ul .zj-li-c h1{font-size: 0.4rem;color: #fe9149;width: 100%;}
.zj-li-ul .zj-li-c p{color: #999;}
.zj-li-ul .zj-li-r{width: 2rem;height: 2rem;}
.zj-li-ul .zj-li-r span{width: 100%;height: 100%;display: block;}
.zj-msg .wu_zj{padding: 0;width: 50%;margin: 0 auto;}



/*奖品列表*/
#prize-list{position: relative;width: 9.5rem;background: linear-gradient(to right,#FFE5C4,#F4B28F);margin: 0.8rem auto;border-radius: 8px;padding: 5px;box-sizing: border-box;}

.prize-box {background: #fff;width: 100%;border-radius: 8px;position: relative;padding: 0.1rem;border: 1px dashed #f4b28f;}
.prize-box ul{display: flex;flex-wrap: wrap;padding: 0.2rem;justify-content: space-between;}
.prize-box .prize-list-title {width: 130%;height: 1rem;left: -15%;position: relative;top: -0.5rem;}
.prize-box .prize-list-title img {max-width: 100%;position: absolute;bottom: 0;}

.prize-list-1{width: 100%;}
.prize-list-1 .li-box{display: flex;height: 2.4rem;margin-bottom: 0.3rem;padding: 0.2rem;box-sizing: border-box;border-radius: 5px;box-shadow: 0 0 5px 0 #ccc;}
.prize-list-1 .li-box .img-box{width: 2rem;height: 2rem;background-color: #F4B28F}
.prize-list-1 .li-box .img-box img{width: 2rem;height: 2rem}
.prize-list-1 .li-box .prize-name{width: 6.2rem;padding-left: 0.3rem;background-color: #FFE5C4}
.prize-list-1 .li-box h1{font-size: 0.4rem;line-height: 1rem;margin-top: 0.2rem;color: #000}
.prize-list-1 .li-box h2{font-size: 13px;font-weight: 400;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;color: #f00}


.prize-list-2{width: 48%;margin-bottom: 0.3rem;}
.prize-list-2 .li-box{padding: 0.2rem;width: 100%;border-radius: 5px;background: linear-gradient(rgb(244, 178, 143), rgb(255, 229, 196))}
.prize-list-2 .li-box .img-box{width: 80%;height:0;padding-bottom: 80%;margin: 0 auto}
.prize-list-2 .li-box .img-box img{width: 100%;}
.prize-list-2 .li-box h1{text-align: center;font-size: 13px;margin: 3px 0;color: #000}
.prize-list-2 .li-box h2{text-align: center;font-size: 12px;font-weight: 400;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;color: #f00}


.prize-list-3{width: 32%;margin-bottom: 0.2rem;}
.prize-list-3 .li-box{padding: 0.2rem;width: 100%;border-radius: 5px;background: linear-gradient(rgb(244, 178, 143), rgb(255, 229, 196))}
.prize-list-3 .li-box .img-box{width: 80%;height:0;padding-bottom: 80%;margin: 0 auto}
.prize-list-3 .li-box .img-box img{width: 100%;}
.prize-list-3 .li-box h1{text-align: center;font-size: 13px;margin: 3px 0;color: #000}
.prize-list-3 .li-box h2{text-align: center;font-size: 12px;font-weight: 400;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;color: #f00}


/*音乐*/
#yinyue{width: 1.2rem;height: 1.2rem;position: absolute;right: 0;top: 0.5rem;text-align: center;z-index: 100}
#yinyue #music_play{background: rgba(0,0,0,0.5);border-radius: 50%;padding: 0.2rem;box-sizing: border-box;width: 80%}



/*弹幕1*/
.danmu1 {width: 100%;height: 3rem;position: absolute;top: 0rem;left: 0;z-index: 2;display: block;overflow-x: hidden;}
.danmu1 .danmu-1 {position: absolute;top: 0;right: -100%;height: 0.5rem;background-color: rgba(0, 0, 0, 0.5);border-radius: 2rem;white-space: nowrap; color: #fff;}
.danmu1 .danmu-1 img{width: 0.5rem;height: 0.5rem;vertical-align: middle;padding: 0.05rem;border-radius: 50%;}
.danmu1 .danmu-1 span {font-size: 0.25rem;padding: 0 0.2rem;line-height: 0.5rem;height: 1rem;display: inline-block;vertical-align: middle;}
.danmu1 .danmu-1 b{color: #ff0000;font-weight: 700;}

.danmu1::-webkit-scrollbar {width : 0;height: 1px;}


/*弹幕移动动画*/
@keyframes ani{
    form{right:0rem;}
    to{right:10rem;}
}
@-webkit-keyframes ani{
    form{right:0rem;}
    to{right:10rem;}
}


/*抽奖记录*/
.danmu2 {width: 9rem;margin: 1rem auto;background: rgba(0,0,0,0.2);border-radius: 5px;position: relative;    padding: 0.5rem 0;}
.danmu2 .danmu2-title{width: 100%;height: 2rem;position: absolute;top: -2rem;text-align: center}
.danmu2 .danmu2-title img{max-width: 100%;margin: 0 auto;}
.danmu2 .scrollDiv{height: 9.3rem;overflow: hidden;}
.danmu2 .scrollDiv .kong-data{opacity: 0.5}
.danmu2 ul{height: 7.7rem;padding: 0.2rem;}
.danmu2 ul li{height: 1.5rem;border-bottom: 1px dashed #ffffffa6;}
.danmu2 ul li .danmu-left{float: left;width: 1.2rem;height: 1.2rem;    margin-right: 0.1rem;}
.danmu2 ul li .danmu-left img{float: left;width: 100%;border-radius: 5px}
.danmu2 ul li .danmu-right{float: left;width: 6.5rem}
.danmu2 ul li .danmu-right h2{color: #fff;height: 0.7rem;line-height: 0.7rem;font-size: 0.35rem;overflow: hidden;display: flex;
    justify-content: space-between;}
.danmu2 ul li .danmu-right h2 span{display: inline-block;max-width: 3.3rem;font-size: 12px;}
.danmu2 ul li .danmu-right h2 small{float: right;color: #e9e9e9;width: 2.5rem;text-align: right}
.danmu2 ul li .danmu-right p{color: #fff; white-space: nowrap;width: 5.5rem;text-overflow: ellipsis;font-size: 0.3rem;overflow: hidden;}
.danmu2 ul li .li-zhanwei{width: 100%;height: 7px}

/*参与人数*/
#canyu{position: absolute;right: 0;left: 0;top: 0rem;color: rgb(255, 102, 0);text-align: center;z-index: 1;}



/*中奖提示*/
.zj-msg{width: 7.5rem;min-height: 7rem;top:25%;border-radius: 10px;animation: my-animation 0.5s;}
.zj-msg .el-dialog__header{padding: 0}
.zj-msg .zj-con{}

.zj-msg .zj-con .zj_tit{position: absolute;top: -2.8rem;
    left: -17%;
    width: 134%;}
.zj-msg .zj-con .zj_tit img{width: 100%}
.zj-msg .zj-con .zj_bg{width: 6rem;height: 6rem;top: 0rem;opacity: 0.3;left: 0;right: 0;margin: 0 auto;position: absolute;background-image: url("../../common/images/gold.png.html");-o-animation: circle 10s linear infinite;-ms-animation: circle 10s linear infinite;-moz-animation: circle 10s linear infinite;-webkit-animation: circle 10s linear infinite;animation: circle 10s linear infinite;background-repeat: no-repeat;background-position: center;background-size: 100%;}
.zj-msg .zj-con .zj_img{position: relative;margin: 0 auto;width: 4rem;min-height: 4rem;text-align: center;}
.zj-msg .zj-con .zj_img img{width: 100%}
.zj-msg .zj-con .zj_name{text-align: center;font-size: 0.4rem;margin-top: 0.3rem}
.zj-msg .zj-con .zj_name b{color: #f00}
.zj-msg .zj-con .zj_btn{text-align: center;font-size: 0.3rem;margin: 0 0.25rem;padding: 0.5rem 0 0;display: flex;justify-content: space-evenly;}
.zj-msg .zj-con .zj_btn span{width: 2rem;display: inline-block;border-radius: 0.4rem;padding: 0.14rem 0;font-size: 0.4rem;}
.zj-msg .zj-con .zj_btn span:nth-child(1){    color: #f5866f;border: 2px solid #f5866f;}
.zj-msg .zj-con .zj_btn span:nth-child(2){background: linear-gradient(to right,#f5866f, #e64423);color: #fff;padding: 0.18rem 0;}



/*奖品兑奖弹窗*/
.prize-msg{width: 9rem!important;top:5vh;border-radius: 10px;animation: my-animation 0.5s;overflow: hidden;}
.prize-msg .el-dialog__header{padding: 0}
.prize-msg .el-dialog__body{padding: 0}
.prize-msg iframe{width: 100%;height: 360px;padding-bottom: 10px;}


/************动画***********/
/*无任何动态 加上这个图片清晰一点*/
.no-ani{animation: no-ani 3s linear infinite}
@keyframes no-ani {
    0% {
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}


/*大小动画*/
.daxiao{animation: daxiao 3s linear infinite}
@keyframes daxiao {
    0% {
        -o-transform:scale(1);
        -ms-transform:scale(1);
        -moz-transform:scale(1);
        -webkit-transform:scale(1);
        transform:scale(1);
    }
    25%{-o-transform:scale(1.1);
        -ms-transform:scale(1.1);
        -moz-transform:scale(1.1);
        -webkit-transform:scale(1.1);
        transform:scale(1.1);}
    50%{
        -o-transform:scale(1);
        -ms-transform:scale(1);
        -moz-transform:scale(1);
        -webkit-transform:scale(1);
        transform:scale(1);
    }
    75%{
        -o-transform:scale(1.1);
        -ms-transform:scale(1.1);
        -moz-transform:scale(1.1);
        -webkit-transform:scale(1.1);
        transform:scale(1.1);
    }
    100% {
        -o-transform:scale(1);
        -ms-transform:scale(1);
        -moz-transform:scale(1);
        -webkit-transform:scale(1);
        transform:scale(1);
    }
}

/*上下浮动动画*/
.up_down{animation: up_down 3s linear infinite}
@keyframes up_down {
    0% {
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        -moz-transform: translateY(0);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -o-transform: translateY(20px);
        -ms-transform: translateY(20px);
        -moz-transform: translateY(20px);
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
    }

    100% {
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        -moz-transform: translateY(0);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/*左右扇形晃动*/
.left_right{animation: left_right 3s linear infinite}
@keyframes left_right {
    0% {
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    25% {
        -o-transform: rotate(10deg);
        -ms-transform: rotate(10deg);
        -moz-transform: rotate(10deg);
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg);
    }

    50% {
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    75% {
        -o-transform: rotate(-10deg);
        -ms-transform: rotate(-10deg);
        -moz-transform: rotate(-10deg);
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }

    100% {
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}


/*中奖弹窗 奖品背景 360旋转动画*/
@keyframes circle {
    0% {
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

#xkgif{height:100%;mix-blend-mode: color-dodge;background: url(../images/xk.gif.html);position: absolute;z-index: 1;width: 100%;display:none}




/*活动页面 表单收集*/
#app .form-popuo{height: auto; border-radius: 11px;box-sizing: border-box;box-shadow: 0 0 10px 0px #000000;max-width: 8rem;background: transparent!important;margin-top: 25vh!important;}
#app .form-popuo .el-dialog__header{padding: 0}
#app .form-popuo .el-dialog__body{padding: 0}

#app .form-popuo .close_guestbook{position: absolute;right: 0;left: 0;margin: 0 auto;bottom: -65px;;border: 2px solid #fff;width: 30px;height: 30px;line-height: 25px;border-radius: 50%;color: #f00;background-color: #ffd694;text-align: center;font-size: 22px;z-index: 10000;}

#app .form-popuo .close-xian{    position: absolute;right: 0;left: 0;margin: 0 auto;bottom: -35px;width: 2px;height: 36px;background: #f4ce72;}
#app .form-popuo .layui-layer-title{padding: 0;text-align: center;background-color: transparent;font-weight: bold;color: #20ab9d;font-size: 17px;}
#app .form-popuo .layui-layer-content{overflow: inherit!important;}
#app .form-popuo .guestbook_bg{width: 100%;position: absolute;top: -75px;left: 0;}
#app .form-popuo .guestbook_bg img{width: 100%;}

#app .form-popuo .form{padding: 15px 10px;border-radius: 7px;position: relative;z-index: 1000;padding-bottom: 0;}

#app .form-popuo .input-group{font-size: 0.3rem;margin-bottom: 10px;display: flex;z-index: 10000;position: relative;padding: 0 10px}
#app .form-popuo .input-group input{width: 100%;border: 1px solid #e7e7e7;border-radius: 4px;height: 0.9rem;font-size: 0.3rem;padding: 5px;}
#app .form-popuo .input-group span{font-size: 0.25rem;width: 1rem;display: inline-block;text-align: center;line-height: 0.6rem;}

#app .form-popuo .layui-layer-setwin a {display: none;}

/*diyform 样式*/
#app .form-popuo #form{width: 100%;max-width: 450px;margin: 0 auto;}

#app .form-popuo #form::-webkit-scrollbar {width : 0px;height: 1px;}

#app .form-popuo #form .form-item{background-clip: padding-box!important;font-size: 13px;background-size: 100%!important;box-sizing: border-box;    padding: 60px 10px 10px;
    background:linear-gradient(#f0ffa8, #bd2d2d);margin: 0;border-radius: 5px;color:#fff

}
#app .form-popuo #form .form-item .item{display: flex;align-items: center;border:1px dashed rgba(204, 204, 204, 0);margin: 5px 0;padding:0;}
#app .form-popuo #form .form-item .item>span{width: 80px;text-align: center;overflow: hidden;white-space: nowrap;}
#app .form-popuo #form .form-item .item .item-type{width: 100%;padding: 0 0.5rem;}

#app .form-popuo #form .form-item .item_active{border:1px dashed #f60!important;}
#app .form-popuo #form .form-item .item .bitian{color: #f00;float: left;width: 0;}
#app .form-popuo #form .sub_btn{margin: 10px auto;text-align: center;background-size: 100%!important;background-repeat: no-repeat!important;border-radius: 5px;position: relative;z-index: 1;
    width: 92%;
}

#app .form-popuo #form .sub_btn img{width: 75%;}

#app .form-popuo #form .upload-sub{width: 100%;height: 120px;border: 1px dashed #ccc;border-radius: 5px;text-align: center;line-height: 120px;font-size: 1rem;color: #ccc;position: relative;    background: #ffffff;}
#app .form-popuo #form .upload-sub .el-upload{width: 100%;position: absolute;top: 0;left: 0;}

#app .form-popuo #form .yi_upimg{border-radius: 5px;max-width: 100%;max-height:100%;width: auto!important;height: auto;box-sizing: border-box;}
#app .form-popuo #form .yi_upimg img{border-radius: 5px;}

#app .form-popuo #form .el-upload--picture-card{width: 100%;;height:120px;;line-height: 120px;border:none}
#app .form-popuo #form .el-upload-list__item{width: 100%!important;height:120px!important;position: relative;z-index: 100;}
#app .form-popuo #form .el-upload-list__item img{max-width: 100%;max-height:100%;width: auto!important;height: auto;}
#app .form-popuo #form .radio-s4 span{padding: 2px 5px!important;}
#app .form-popuo #form .checkbox-s4 span{padding: 2px 5px!important;}
#app .form-popuo #form .upload-msg{line-height: 25px;position: absolute;margin: 0 auto;left: 0;right: 0;bottom: 22px;font-size: 12px;}
#app .form-popuo #form .el-radio.is-bordered+.el-radio.is-bordered {margin-left: 0;}
#app .form-popuo #form .el-radio-group{width: 100%}
#app .form-popuo #form .ui-state-highlight{height: 50px;width: 100%;background: #f5ec5b !important;}
#app .form-popuo #form .form-item .item .caozuo{margin-left: 5px;position: absolute;right: -35px;}

#app .form-popuo #form .el-radio{background: #fff;padding: 5px 3px;}
#app .form-popuo #form .el-checkbox{background: #fff;padding: 5px 3px;}
#app .form-popuo #form .el-checkbox.is-bordered.el-checkbox--mini {padding: 3px 15px 3px 10px!important;}
#app .form-popuo #form .el-radio--mini.is-bordered {padding: 6px 15px 0 10px!important;}



/*奖品随机下落*/

.moneybox {width: 100%;
}

#xialuo {position: fixed;top:0;width: 100%;z-index: 10;}

#xialuo >div {position: absolute;width: 50px;height: 50px;-webkit-animation-iteration-count: infinite, infinite;-webkit-animation-direction: normal, normal;-webkit-animation-timing-function: linear, ease-in;}

#xialuo >div >img {position: absolute;width: 50px;height: 50px;-webkit-animation-iteration-count: infinite;-webkit-animation-direction: alternate;-webkit-animation-timing-function: ease-in-out;-webkit-transform-origin: 50% -100%;
}

@-webkit-keyframes fade {
    0% {
        opacity: 1;
    }

    95% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes drop {
    0% {
        -webkit-transform: translate(0px, -50px) rotate(0deg);

    }

    100% {
        -webkit-transform: translate(0px, 750px) ;
    }
}

@-webkit-keyframes shunshizhengxuanzhuan {
    0% {
        -webkit-transform: rotate(-70deg);
    }

    100% {
        -webkit-transform: rotate(70deg);
    }
}

@-webkit-keyframes nshizhengxuanzhuan {
    0% {
        -webkit-transform: scale(-1, 1) rotate(70deg);
    }

    100% {
        -webkit-transform: scale(-1, 1) rotate(-70deg);
    }
}




/***************兑奖页面 duijiang_page**************/
#duijiang-app{padding: 0.2rem 0 1rem;background-image: url(../images/piaofu1.png);background-size: 100%;background-color: #fff;}
/*兑奖奖品详情*/
#duijiang-app .duijiang-1{margin-top: 0.3rem;border-bottom: 1px dashed #ccc;position: relative}
#duijiang-app .duijiang-1-2{width: 100%;}
#duijiang-app .duijiang-1-2>img{width: 3rem;height: 3rem;margin: 0 auto;display: block}
#duijiang-app .duijiang-1-2 h1{text-align: center;line-height: 1.2rem;font-size: .6rem;word-break: break-word;color: #000;font-weight: 700;margin-bottom: .1rem;}
#duijiang-app .duijiang-1-2 p{color:#535353;font-size: 14px;text-align: center;line-height: 0.5rem;}
#duijiang-app .duijiang-1-2 h2{color: #f33061;font-size: 0.45rem;text-align: center;line-height: 0.5rem;margin-top: .5rem;}
#duijiang-app .duijiang-1-2 h2 span{color: #999;font-size: 0.28rem;background: #f2f2f2;border-radius: 20px;padding: 2px 8px;}
#duijiang-app .duijiang-1-2 .dj_name{background: #f33061;font-size: 0.45rem;text-align: center;line-height: 0.5rem;color: #fff;width: 50%;border-radius: 0.5rem;margin: 0 auto;margin-top: .4rem;padding: 0.2rem 0;display: block;text-decoration-line: none}
#duijiang-app .dj_name .to-dj{text-decoration: none;color: #fff;font-size: 13px;width: 100%;display: block;}
#duijiang-app .duijiang-1-2 .quan-msg{color: #bebebe;font-size: 0.35rem;text-align: center;line-height: 0.5rem;margin: 0.5rem;font-weight: 300;}
/*奖品兑奖信息*/
#duijiang-app .duijiang-2{position: relative;margin-top: 0.3rem;line-height: 0.8rem;font-size: 0.4rem;min-height: 2rem;}
#duijiang-app .duijiang-2 .hexiaoma-msg{text-align: center;display: flex;justify-content: center;flex-wrap: wrap}
#duijiang-app .duijiang-2 .hexiaoma-img{width: 4rem;}
#duijiang-app .duijiang-2 p{color: #6e6d6d;width: 100%}
#duijiang-app .duijiang-2 .dj_status{position: absolute;right: 0;    top: 0;}
#duijiang-app .djdizi-a{    overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width: 90%;}

/*diyform 样式*/
#duijiang-app .form-popuo #form{width: 100%;max-width: 450px;margin: 0 auto;}

#duijiang-app .form-popuo #form::-webkit-scrollbar {width : 0px;height: 1px;}

#duijiang-app .form-popuo #form .form-item{background-clip: padding-box!important;font-size: 13px;background-size: 100%!important;box-sizing: border-box;}
#duijiang-app .form-popuo #form .form-item .item{display: flex;align-items: center;border:1px dashed rgba(204, 204, 204, 0);margin: 5px 0;padding:0;}
#duijiang-app .form-popuo #form .form-item .item>span{width: 80px;text-align: center;overflow: hidden;white-space: nowrap;}
#duijiang-app .form-popuo #form .form-item .item .item-type{width: 100%;padding: 0 3px;}

#duijiang-app .form-popuo #form .form-item .item_active{border:1px dashed #f60!important;}
#duijiang-app .form-popuo #form .form-item .item .bitian{color: #f00;float: left;width: 0;}
#duijiang-app .form-popuo #form .sub_btn{margin: 10px auto;text-align: center;background-size: 100%!important;background-repeat: no-repeat!important;border-radius: 5px}

#duijiang-app .form-popuo #form .upload-sub{width: 100%;height: 120px;border: 1px dashed #ccc;border-radius: 5px;text-align: center;line-height: 120px;font-size: 1rem;color: #ccc;position: relative;    background: #ffffff;}
#duijiang-app .form-popuo #form .upload-sub .el-upload{width: 100%;position: absolute;top: 0;left: 0;}

#duijiang-app .form-popuo #form .yi_upimg{border-radius: 5px;max-width: 100%;max-height:100%;width: auto!important;height: auto;box-sizing: border-box;}
#duijiang-app .form-popuo #form .yi_upimg img{border-radius: 5px;}

#duijiang-app .form-popuo #form .el-upload--picture-card{width: 100%;;height:120px;;line-height: 120px;border:none}
#duijiang-app .form-popuo #form .el-upload-list__item{width: 100%!important;height:120px!important;position: relative;z-index: 100;}
#duijiang-app .form-popuo #form .el-upload-list__item img{max-width: 100%;max-height:100%;width: auto!important;height: auto;}
#duijiang-app .form-popuo #form .radio-s4 span{padding: 2px 5px!important;}
#duijiang-app .form-popuo #form .checkbox-s4 span{padding: 2px 5px!important;}
#duijiang-app .form-popuo #form .upload-msg{line-height: 25px;position: absolute;margin: 0 auto;left: 0;right: 0;bottom: 22px;font-size: 12px;}
#duijiang-app .form-popuo #form .el-radio.is-bordered+.el-radio.is-bordered {margin-left: 0;}
#duijiang-app .form-popuo #form .el-radio-group{width: 100%}
#duijiang-app .form-popuo #form .ui-state-highlight{height: 50px;width: 100%;background: #f5ec5b !important;}
#duijiang-app .form-popuo #form .form-item .item .caozuo{margin-left: 5px;position: absolute;right: -35px;}

#duijiang-app .form-popuo #form .el-radio{background: #fff;padding: 5px 3px;}
#duijiang-app .form-popuo #form .el-checkbox{background: #fff;padding: 5px 3px;}
#duijiang-app .form-popuo #form .el-checkbox.is-bordered.el-checkbox--mini {padding: 3px 15px 3px 10px!important;}
#duijiang-app .form-popuo #form .el-radio--mini.is-bordered {padding: 6px 15px 0 10px!important;}
#duijiang-app  .el-message{width: 90%!important;min-width: auto;padding: 7px;}
#duijiang-app .yi_sub_info{padding: 0.5rem;}
/***************兑奖页面 结束**************/


/*下落*/
#xialuo{}
#xialuo li{ position: absolute;width: 20px;height: 20px;background: #f00}
/*弹幕移动动画*/
@keyframes xldh{
    form{left:0rem;}
    to{right:10rem;}
}
@-webkit-keyframes xldh{
    form{left:0rem;}
    to{right:10rem;}
}



/*音乐跳动*/
.music-notes .note-item {
    position: absolute;
    top: 20%;
    left: 50%;
    margin-left: -5px;
    width: 0.2rem;
    height: 0.2rem;
    opacity: 0
}

.music-notes .item-1{
    -webkit-animation: music_piaodong 3s linear 0s infinite
}

.music-notes .item-2{
    -webkit-animation: music_piaodong 3s linear 1s infinite
}


.music-notes .item-3{
    -webkit-animation: music_piaodong 3s linear 2s infinite
}

@-webkit-keyframes music_piaodong {
    0% {
        width: 0.2rem;
        height: 0.2rem;
        opacity: 0;
        -webkit-transform: translate3D(0, 0, 0)
    }
    15% {
        opacity: .3;
        -webkit-transform: translate3D(-10px, 0, 0) scale(1)
    }
    30% {
        opacity: .5;
        -webkit-transform: translate3D(-22px, -6px, 0) scale(1.1)
    }
    45% {
        opacity: .7;
        -webkit-transform: translate3D(-32px, -15px, 0) scale(1.3)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3D(-40px, -25px, 0) scale(1.4)
    }
    75% {
        opacity: .7;
        -webkit-transform: translate3D(-47px, -32px, 0) scale(1.5)
    }
    90% {
        opacity: .3;
        -webkit-transform: translate3D(-56px, -40px, 0) scale(1.8)
    }
    100% {
        width: 0.5rem;
        height: 0.5rem;
        opacity: 0;
        -webkit-transform: translate3D(-65px, -50px, 0) scale(1.8)
    }
}