.svga_box,.shoppop_box,.dominate_box,.shoppop_box_dominate{
    width:100vw;
    height:100vh;
    position:fixed;
    left:0;
    top:0;
    background:rgba(0,0,0,0.7);
    display:none;
    box-sizing:border-box;
    z-index: 999;
}
.wrapper_main {
    border-radius: 3vw;
    background: #fff;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-60%);
    transition: transform 1s;
    box-shadow:black 0px 0px 10px;
}
.wrapper_main_one {
    border-radius: 3vw;
    background: #fff;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow:black 0px 0px 10px;
}
.wrapper_main_0 {width: 94vw;z-index: 9999;top: 50%;}
.wrapper_main_1 {width: 92vw;z-index: 8888;top: calc(50% + 5px);}
.wrapper_main_2 {width: 90vw;z-index: 7777;top: calc(50% + 10px);}
.wrapper_main_3 {width: 88vw;z-index: 6666;top: calc(50% + 15px);}
.wrapper_main_4 {width: 86vw;z-index: 5555;top: calc(50% + 20px);}

.wrapper_main_imgwrap {
    width: 100%;
    height: 68vw;
    position: relative;
    overflow: hidden;
}
.wrapper_main_client {
    width: 100%;
    position: relative;
    overflow: hidden;
}
.wrapper_main_client>div{
    border-radius: 3vw 3vw 0 0 ;
}
.wrapper_main_imgwrap .wrapper_main_img {
    width: 100%;
    height: 68vw;
    border-radius: 3vw 3vw 0 0 ;
}
.leftMove {
    transform: translate(-800px, -60%);
}
.rightMove {
    transform: translate(400px, -60%);
}
.img_gfrz {
    position: absolute;
    width: 38vw;
    height: 30vw;
    right: 0;
    bottom: 0;
}
.main_content {
    padding: 2vw 2vw;
    position: relative;
}
.pos_img {
    width: 13vw;
    height: 11vw;
    position: absolute;
    top: 0;
    right: 0;
}
.close_img {
    position: absolute;
    left: 50%;
    bottom: -32%;
    transform: translateX(-50%);
    width: 10vw;
}
.close_box {
    position: absolute;
    bottom: 13vw;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
}
.close_box img{
    width: 13vw;
    height: 13vw;
    margin: 0 12vw;
}
.main_content_title {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}
.main_content_title img{
    width: 14vw;
    height: 5vw;
}
.main_content_title .span1{
    font-size: 5vw;
    line-height: 5vw;
    color: #292929;
    font-weight: 600;
    margin: 0 1vw 0 2vw;
}
.main_content_title .span2{
    font-size: 4vw;
    line-height: 5vw;
    color: #666;
}
.main_content_title_box{
    display:flex;
}
.client_img_box{
    border: 1px solid #a1d0f3;
    width: 12vw;
    height: 12vw;
    border-radius: 2vw 2vw;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 2vw;
}
.client_img{
    width: 10vw;
    height: 10vw;
}
.main_content_title_box_r{
    flex:1;
}
.main_content_price {
    font-size: 4vw;
    line-height: 4vw;
    margin-bottom: 2vw;
}
.main_content_price .span1{
    color: #666;
}  
.main_content_price .span2{
    color: #ff9601;
}  
.main_content_btn {
    display: flex;
    justify-content: space-between;
    margin-bottom: 2vw;
    color: #fff;
}
.main_content_btn div{
    width: 29vw;
    height: 7vw;
    line-height: 7vw;
    text-align: center;
    border-radius: 1vw;
    margin: 0 0.5vw;
}
.btn1 {
    background-color: #4ecbd5;
}
.btn2 {
    background-color: #3eadf5;
}
.btn3 {
    background-color: #588df3;
}
.main_content_information {
    font-size: 3vw;
    line-height: 4vw;
    color: #343434;
}
.main_content_information span {
    color: #5da5ef;
}
.msg_box{
    position: fixed;
    top: 10vw;
    left: 50%;
    transform: translateX(-50%);
    background: url('../images/showSVGA/msg.png');
    background-size: 100% 100%;
    height: 11vw;
    width: 64vw;
    font-size: 3vw;
    line-height: 10vw;
    text-align: center;
    color: white;
    display: none;
}
.svga_box_close{
    position: fixed;
    top: 4vw;
    right: 4vw;
    color: white;
    font-size: 4vw;
    z-index: 99999999;
}
.svga_box_time{
    font-size: 4vw;
}
.svga_close{
    display: none;
    font-size: 4vw;
}
.dominate_main{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.dominate_title{
    width: 48vw;
    height: 10vw;
    margin: 0 auto;
    display: block;
}
.dominate_text{
    background: url('../images/showSVGA/noshop.png');
    background-size: 100% 100%;
    width: 66vw;
    height: 60vw;
    padding: 4vw 5vw 4vw 4vw;
}
.dominate_tips{
    font-size: 4vw;
    color: #424242;
    line-height: 1.8;
}
.dominate_tips_item1{
    margin-top:3vw;
}
.dominate_tips_item1 .dominate_tips_fir{
    color:#3a7afe;
}
.dominate_tips_item1 div{
    color:#6e6e6e;
}
.dominate_tips_item2{
    margin-top:3vw;
}
.dominate_tips_item2 .dominate_tips_fir{
    color:#ff7600;
}
.dominate_tips_item2 div{
    color:#6e6e6e;
}
.dominate_btn_box{
    display: flex;
    margin: 8vw  auto;
    align-items: center;
    justify-content: center;
}
.dominate_btn{
    width: 27vw;
    height: 9vw;
    border-radius: 5vw;
    color: white;
    font-size: 4vw;
    text-align: center;
    line-height: 9vw;
    margin: 0 2vw;
}
.dominate_btn:first-child{
    background-image: linear-gradient(-90deg, 
        #3a7afe 0%, 
        #6e9dff 100%), 
    linear-gradient(
        #000000, 
        #000000);
    background-blend-mode: normal, 
        normal;
}
.dominate_btn:last-child{
    background-image: linear-gradient(-90deg, 
        #ff5900 0%, 
        #ff9500 100%), 
    linear-gradient(
        #000000, 
        #000000);
    background-blend-mode: normal, 
        normal;
}
/* .dominate_box{
    width:100vw;
    height:100vh;
    position:fixed;
    left:0;
    top:0;
    background:rgba(0,0,0,0.7);
    box-sizing:border-box;
    z-index: 9999;
    display:block;
} */
.dominate_tips_fir{
    display: flex;
    align-items: center;
    font-size: 3vw;
}
.dominate_tips_sec{
    padding-left:4vw;
    font-size: 3vw;
}
.dominate_text img{
    width: 3vw;
    height: 3vw;
}
.dominate_timer{
    margin: 3vw auto;
    width: 27vw;
    height: 8vw;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 1vw;
    font-size: 4vw;
    color: #ffffff;
    text-align:center;
    line-height:8vw;
}
.dominate_timer span{
    color: red;
    font-size: 4vw;
}


/* ball */
.word_could_box{
    width:100vw;
    height:100vh;
    position:fixed;
    left:0;
    top:0;
    background:rgba(0,0,0,0.7);
    box-sizing:border-box;
    z-index: 999;
    display:none;
}
.word_could_box_inner{
    width:100vw;
    height:100vh;
    position:fixed;
    left:0;
    top:0;
    background:url('../images/showSVGA/lightbottom.png') no-repeat;
    background-position:bottom center;
    background-size:90vw auto;
    box-sizing:border-box;
    z-index: 999;
}
.word_could_time{
    width:48vw;
    height:8vw;
    font-size:17vw;
    color:#20a9ff;
    margin:0 auto;
    margin-top:15vw;
    background:url('../images/showSVGA/daojishi.png') no-repeat;
    background-size: 100% 100%;
    position:relative;
}
.word_could_get{
    width:53vw;
    height:9vw;
    margin:0 auto;
    margin-top:15vw;
    display:block;
}
.word_could_time span{
    position:absolute;
    bottom:-3vw;
    right:12vw;
}
.word_could_bean{
    width: 99vw;
    height: 11vw;
    line-height: 11vw;
    text-align: center;
    background:url('../images/showSVGA/lingdouzibg.png') no-repeat;
    background-size: 100% 100%;
    font-size:5vw;
    color:white;
    margin:10vw auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.word_could_bean img{
    width:6vw;
    height:5vw;
    margin-left:2vw;
}
.word_could_ball{

}
.wordCloud__tagBall {
    position: relative;
    width:100vw;
    height:100vw;
}
.wordCloud__tag2 {
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    text-decoration: none;
    font-size: 14px;
    color: #292929;
    text-align: center;
    width:12vw;
    height:12vw;
    
}
.wordCloud__tag2 img {
    position: absolute;
    left: 100px;
    top: 100px;
    width: 200px;
    height: 200px;
    transform: translate3d(-80%, -80%, 0);
    z-index: 2;
}
.wordCloud__tag2 img:nth-child(2) {
    transform: translate3d(-80%, -80%, 0) scale(0.8);
    z-index: 1;
}
.wordCloud__tag {
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    text-decoration: none;
    font-size: 14px;
    color: #292929;
    text-align: center;
    width:12vw;
    height:12vw;
    z-index: 10;
}
.wordCloud__tag .head {
    display: block;
    width: 12vw;
    height: 12vw;
    margin: 0 auto;
    border-radius: 50%;
    margin-bottom: 10px;
    border: solid 2px #ffffff;
    box-shadow: 0px 0px 20px 0px rgba(166, 166, 166, 0.6);
    position: relative;
    z-index: 100;
}
.wordCloud__tag span {
    width: 10vw;
    height: 3vw;
    position: absolute;
    left: 50%;
    margin-left: -42px;
    top: -5px;
    transform: translate3d(42px, 0, 0);
    background-color: rgba(0,0,0,0.5);
    border-radius: 2vw;
    border: solid 0vw #ffffff;
    display:inline-block;
    font-size:2vw;
    color:#ffb400;
    display:flex;
    align-items:center;
    justify-content:center;
}
.wordCloud__tag span img {
    width:3vw;
    height:2.5vw;
    text-align:center;
    line-height:2vw;
    margin-left:1vw;
    
}
.wordCloud__home {
    display: flex;
    justify-content: center;
}

.zoom-leave-active {
    transition: opacity 1s ease;
}

.zoom-leave-to {
    transform: scale(0.1);
}

@keyframes aninone {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
.none {
    animation: aninone 0.2s ease;
    animation-delay: 0.5s;
    animation-fill-mode: forwards;
}

@keyframes anishow {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.show {
    animation: anishow 1s ease;
    animation-delay: 2s;
    animation-fill-mode: forwards;
}
.baping_title{
    background: white;
    border-radius: 3vw;
    padding: 3vw 3vw; 
}
.baping_title img{
    width: 48vw;
    height: 10vw;
    margin: 0 auto;
    display: block;
}
.baping_title_bottom{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.baping_title_btn{
    background: url('../images/psta_btn.png');
    background-size: 100% 100%;
    text-align: center;
    width: 25vw;
    height: 7vw;
    line-height: 7vw;
    color: white;
}

/* 任务弹窗 */
.task_mask {
    position: fixed;
    background-color: rgba(0, 0, 0, .3);
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 999;
    display: none;
}
.task_mask_box{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 92vw;
}
.task_mask .close {
    display: inline-block;
    width: 6vw;
    height: 6vw;
    position: absolute;
    left: 0;
    right: 0;
    margin: 2vw auto;
}
.task_mask .title {
    width: 100%;
    text-align: center;
    font-size: 4vw;
    letter-spacing: 0px;
    color: #ffffff;
    margin-bottom: 2vw;
}
.task_mask .title .price {
    font-size: 5vw;
    font-style: italic;
    letter-spacing: 5px;
    font-weight: 700;
    color: rgb(255,132,30);
}
.task_mask .content {
    width: 92vw;
    height: 39vw;
    background-color: #ffffff;
    border-radius: 3vw;
    margin: 0 auto;
    padding: 2vw;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    box-sizing: border-box;
}
.task_mask .content .shopImg {
    width: 33vw;
    height: 33vw;
    position: relative;
    border-radius: 3vw;
    overflow: hidden;
    margin-right: 2vw;
}
.task_mask .content .shopImg img {
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}
.task_mask .content .r_info {
    flex: 1;
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    height: 33vw;
}
.task_mask .content .r_info .name {
    font-size: 3vw;
    line-height: 5vw;
    letter-spacing: 0px;
    color: #232222;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}
.task_mask .content .r_info .desc {
    border-radius: 1vw;
    overflow: hidden;
}
.task_mask .content .r_info .desc span:nth-child(1) {
    display: inline-block;
    background: url(../images/showSVGA/xianshi.png);
    background-position: 0 0;
    background-size: 100% 100%;
    width: 9vw;
    height: 6vw;
    font-size: 3vw;
    text-align: center;
    line-height: 6vw;
    color: #ffffff;
    position: relative;
}
.task_mask .content .r_info .desc span:nth-child(2) {
    display: inline-block;
    width: 35vw;
    height: 6vw;
    border: solid 1px #fae2df;
    border-left: none;
    font-size: 3vw;
    line-height: 6vw;
    letter-spacing: 0px;
    color: #fc822d;
    text-align: center;
}
.task_mask .content .r_info .task {
    width: 100%;
    height: 10vw;
    display: flex;
    align-items: center;
}
.task_mask .content .r_info .task .price {
    width: 28vw;
    height: 10vw;
    line-height: 10vw;
    box-sizing: border-box;
    padding-left: 2vw;
    background: url("../images/showSVGA/zeroyuan.png");
    background-position: 0 0;
    background-size: 100% 100%;
    margin-right: -2vw;
}
.task_mask .content .r_info .task .price span:nth-child(1) {
    font-size: 3vw;
    color: #ffffff;
    z-index: 99;
    text-decoration: line-through;
}
.task_mask .content .r_info .task .price span:nth-child(2) {
    font-size: 5vw;
    color: #ffffff;
    z-index: 99;
}
.task_mask .content .r_info .task .go {
    width: 28vw;
    height: 10vw;
    margin-left: -2vw;
}