@charset "utf-8";
/* CSS Document */
body{ overflow:hidden; width:100%; height:100%}
ul, li {
    list-style: none;
    margin: 0;
    padding: 0;
}
.tuchu {
    position: absolute;
    top: -110px;
    bottom: -90px;
    left: -3%;
    right: -3%;
    display: none;
}
.tuchuk{top: 50%;
    left: 50%;
    margin:-200px 0 0 -140px;
    width: 280px;
    height: 280px;
    position: absolute;
    z-index: 4;
    padding: 0;}
.tx{     width: 260px;
    height: 260px;
    margin: 10px;
    overflow: hidden;filter: brightness(100);
    border-radius: 100%; object-fit: contain;}
.qipao{    width: 280px;
    height: 280px;
    position: absolute;
    top: 0;
    padding: 0;
    margin: 0;}
.qipao .qipaoimg{width:100%; height:100%;overflow:hidden; border-radius: 100%;}
.xm{font-size: 36px;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    bottom: 0;
    margin:8px auto 0;
    width: 226px;}
.pm{
    font-size: 20px;
    text-align: center;
    color: #fff;
    margin: -60px auto 20px;
    width: 60px;
    height: 60px;
    line-height: 60px;
    position: absolute;
    top: 30px;
    right: 0;
    margin-left: -30px;
    background: url(http://wxc.vshangtong.com/index/wxc/qipao.png);
    background-size: cover;
}
.tuchug {
    top: 50%;
    left: 50%;
    margin: -800px 0 0 -400px;
    width: 800px;
    height: 800px;
    position: absolute;
    z-index: 4;
    border-radius: 100%;
}
.tuchu.view { display: block; -webkit-animation:vp 0.5s 8s ease forwards;}
.view .tuchuk{-webkit-animation:vv 8s 0s ease forwards;  }
.view .tuchug{-webkit-animation: vg 6.5s 0s ease forwards; opacity: 0;}
.view .pm{-webkit-animation: pmsz 1s 2s ease forwards; opacity: 0;-webkit-transform-origin:center center;}

@-webkit-keyframes vp{
0%{-webkit-transform: scale(1);opacity:1;}
100%{-webkit-transform: scale(1);opacity:0;}
}
@-webkit-keyframes vv{
0%{opacity:0;-webkit-transform: scale(0.8) translateY(500px);}
10%{opacity:1;-webkit-transform: scale(0.8) translateY(90px);}
20%{opacity:1;-webkit-transform: scale(0.8) translateY(110px);}
90%{opacity:1;-webkit-transform:scale(1) translateY(-15px);}
100%{opacity:0;-webkit-transform:scale(1) translateY(-500px);}
}
@-webkit-keyframes vg{
0%{opacity:0;}
50%{opacity:1; }
100%{opacity:1; }
}
@-webkit-keyframes pmsz{
0%{opacity:0;-webkit-transform: scale(0.1) translateY(50px);}
50%{opacity:1;-webkit-transform: scale(1.2) translateY(-10px);}
100%{opacity:1;-webkit-transform: scale(1) translateY(0);}
}
.tuchug li{ width: 100%;
    height: 100%;
    text-align: center;
    position: absolute;-webkit-transform: translateY(1600px);}
.li1{ -webkit-animation:yuan 8s 0s 2 ease forwards;background:url(http://pic.vshangtong.com/index/wxc/qipao-1.png); background-size:cover;    -webkit-transform: translateX(-30px);}
.li2{ -webkit-animation:yuan 8s 1s 2 ease forwards; background:url(http://pic.vshangtong.com/index/wxc/qipao-2.png); background-size:cover;    -webkit-transform: translateX(-20px);}
.li3{ -webkit-animation:yuan 8s 2s ease 2 forwards;  background:url(http://pic.vshangtong.com/index/wxc/qipao-3.png); background-size:cover;    -webkit-transform: translateX(-10px);}
.li4{ -webkit-animation:yuan 8s 3s 2 ease forwards;  background:url(http://pic.vshangtong.com/index/wxc/qipao-4.png); background-size:cover;   -webkit-transform: translateX(0); }
.li5{ -webkit-animation:yuan 8s 4s 2 ease forwards;  background:url(http://pic.vshangtong.com/index/wxc/qipao-5.png); background-size:cover;    -webkit-transform: translateX(15px);}
.li6{ -webkit-animation:yuan 8s 5s 2 ease forwards;  background:url(http://pic.vshangtong.com/index/wxc/qipao-6.png); background-size:cover;    -webkit-transform: translateX(30px);}

@-webkit-keyframes yuan{
0%{-webkit-transform: translateY(1600px);opacity:1;}
90%{-webkit-transform: translateY(150px);opacity:0.3;   -webkit-transform: translateX(0);}
    100%{-webkit-transform: translateY(0);opacity:0;   -webkit-transform: translateX(0);}
}


 
 ::-webkit-scrollbar-track-piece {
 background-color: rgba(0,0,0,0);
 border:0;border-radius: 8px;
 
}
::-webkit-scrollbar {
 width: 8px;
 height: 8px;
 border:0;border-radius: 8px;
}
::-webkit-scrollbar-thumb {
 background-color: rgba(0,0,0,0);
 background-clip: padding-box;
 min-height: 28px;
 border:0;border-radius: 8px;
}
::-webkit-scrollbar-thumb:hover {
 background-color: rgba(0,0,0,0);
 border:0;border-radius: 8px;
}

.member-list {height: 70%;overflow: scroll;}
.Panel.Bottom { background-color: transparent}
.Panel.Top{background-color: transparent}
 .video{	width:100%;	height:100%;background-color: #000;	}
 
 
 
 

.amp_account_codeimage {  cursor: pointer; display: block; position: absolute; width: 90px; height: 90px; top: 50%; margin-top: -45px; right: 15px;}
.closebutton { cursor: pointer; width: 30px; height: 30px;	right:0;position: absolute;}
.closebutton:before { position: absolute; content: ''; display: block; width: 22px; height: 1px; background: #9c9c9c; -webkit-transform: rotate(-45deg); top: 16px; left: 2px;}
.closebutton:after { position: absolute; content: '';  display: block;  width: 22px;  height: 1px; background: #9c9c9c; -webkit-transform: rotate(45deg); top: 16px; left: 2px;}
.qiandaoewm{ position:absolute; top:50%; left:50%; margin-left:-150px; margin-top:-150px; width:300px}
.anewm { position: absolute; width: 430px; bottom: 32px;  left: 50%;  margin-left: -215px;  text-align: center;}
.anewm a { padding: 10px 20px; background-color: #FF5722; border-radius: 30px; color: #fff;}
.rightewm{position: absolute; right:-400px; top:0; width:300px; height: 300px; background-color: rgb(255, 255, 255); border-radius: 10px;    text-align: center; -webkit-transition: all 0.5s ease-out 0s;transition: all 0.5s ease-out 0s; z-index:3}
.leftqd{height: 100%; overflow: auto; position: absolute; left: 0; right: 0; top: 0;-webkit-transition: all 0.5s ease-out 0s;transition: all 0.5s ease-out 0s; overflow-x:hidden;}
.rightewm.openit{ right: 0 !important; }
.leftqd.openit2{ right: 300px !important;}
.rightewm .wemtp{ width: 100%; border-radius: 10px;}
.rightewm .sminfo{ font-size: 22px;}
.rightewm .sminfo .activity_key {color: #FF5722;}

 

body { margin: 0; padding: 0; background-color:#000 }
 
  
.son.puman{animation: Puman 0.5s linear 1 0s both;margin-left:0; margin-top:0;}
@-webkit-keyframes Puman { 0% {
opacity:0;transform:scale(0.1);}
100% {
opacity:1;transform:scale(1);}
}

 

.son.paoma{ animation: Paoma 2s linear 1 0s both; z-index:15 ;}
@-webkit-keyframes Paoma { 0% {
opacity:1;width: {$picwidh}px; height: {$picwidh}px; }
50% {
opacity:1; width:80px; height:80px;}
100% {
opacity:0;width:100px; height:100px;}
}
.son.paoma .tu1{ border-radius:10px;}
 .father  { position: fixed; width: 1920px; height: 1080px ; z-index:50000; display:none}
 /**/
.ewm{ position:fixed; bottom:10px; right:10px; width:200px; height:200px;}
.ewm img{ width:100%; height:100%}
 

 
  
 
 
#co{ position:fixed; transform-origin: 50% 50% 0px;  }
.vediomsk {
    position: absolute;
    z-index: 0;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    overflow: hidden;
    background-size: cover;
    background-color: $logosence[spcolor];
}

.kscj{ padding: 10px 20px; width:300px;background-color: #FF5722; border-radius: 30px; color: #fff; }
.kscj:active{ background-color: #da4516;color: #fff; }
 
.top_title{display: none;}
 
 
  * {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  user-select: none;
}

#bubbleradius {
  width: 4.5rem;
  height: 1px;
  opacity: 0;
  z-index: -1;
  display: block;
}

body {
  overflow: hidden;
}

#app {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
   color: white;
    
}
 
.txx {
color: #FFF;
    font-size: 24px;
    position: absolute;
    text-align: center;
    width: 200px;
    padding: 20px;
    box-sizing: border-box;
    left: 50%; border-radius: 16px;
    margin-left: -100px;background-color: rgba(33, 150, 243, 0.2);}
.txx .nc{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin:0 auto; padding:0; border-radius: 10px; display:none}
.txx .tel{white-space:nowrap; margin:0 auto; padding:0; border-radius: 10px; display:none}
.txa { width: 100px; height: 100px;margin: 0 auto; border-radius:10px; background-color: #1a85ce70; background-size:100% 100% !important;display:none}
.kscj{ padding: 10px 20px; width:300px;background-color: #FF5722; border-radius: 30px; color: #fff; }
.kscj:active{ background-color: #da4516;color: #fff; }

/**/
.top_title{display: none;}

body { margin: 0; padding: 0; background-color:#000 }
 
  
 #ddd{ display:none}