html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
  margin: 0;
  padding: 0;
}

img, fieldset {
  border: 0;
}

/* set image max width to 100% */
img {
  max-width: 100%;
  height: auto;
  width: auto\9; /* ie8 */
}
input, textarea, button, a,div{-webkit-tap-highlight-color:rgba(0,0,0,0);}
/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;
}
html{ -webkit-text-size-adjust:none;}

/************************************************************************************
GENERAL STYLING
*************************************************************************************/

a {
  color: #027B7E;
  text-decoration: none;
  outline: none;
}
a:hover {
  text-decoration: none;
}

p {
  padding: 0;
}

/* list */
ul, ol {

}
li {
  margin: 0 0 .5em 0;
  padding: 0;
}

/* headings */


/* reset webkit search input styles */
input[type=search] {
  -webkit-appearance: none;
  outline: none;
}
input[type="search"]::-webkit-search-decoration, 
input[type="search"]::-webkit-search-cancel-button {
  display: none;
}

*{   
    -webkit-touch-callout:none;
    -webkit-user-select:none; 
    user-select:none;   
} 
#list_jl::-webkit-scrollbar{
    width: 5px;
    height: 5px;
    background-color:#a59676;
    border-radius: 10px;
}
#list_jl::-webkit-scrollbar-thumb{
    background-color: #ccc;
    border-radius: 10px;
}
#list_jl::-webkit-scrollbar-track{
    background-color:#a59676;
    border-radius: 10px;
}
@-webkit-keyframes opener {
    0% {
        -webkit-transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(20px);
    }
}
@keyframes opener {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(20px);
    }
}
@-webkit-keyframes opener1 {
    0% {
        -webkit-transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(10px);
    }
}
@keyframes opener1 {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(10px);
    }
}  
body,html{
    overflow-x: hidden;
    padding-right:0 !important;
}
body{
    overflow: hidden !important;
    color: #fff;
}
.clear:after { 
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clear {
  display: inline-block;
  }
.app{
    overflow: hidden;
    width:100%
}
.bg1{
    height:75.833vw;
    background:url('../img/bg1.jpg') top center no-repeat;
    background-size:cover;
    position:relative;
}
.bg2{
    height:299.1666vw;
    background:url('../img/bg2.jpg') top center no-repeat;
    background-size:cover;
    position:relative;
}
.nav_con{
    height:3.385vw;
    background:#000f1f;
    position: fixed;
    z-index:20;
    width:100%;
    left:0;
    top:0;
}
.mLogo{
    background:url('../img/mLogo.png') top center no-repeat;
    background-size:cover;
    width:3.645vw;
    height:2.916vw;
    position: absolute;
    top:0.26vw;
    left:9.958vw;
}
.nav_tab{
    margin-left:18.75vw;
}
.nav_tab a{
    float: left;
    margin-right:0.364vw;
}
#nav1{
    background:url('../img/nav1.png') top center no-repeat;
    background-size:cover;
    width:7.812vw;
    height:3.333vw;
}
#nav1:hover,#nav1.active{
    background:url('../img/nav1_hover.png') top center no-repeat;
    background-size:cover;
}
#nav2{
    background:url('../img/nav2.png') top center no-repeat;
    background-size:cover;
    width:7.864vw;
    height:3.333vw;
}
#nav2:hover,#nav2.active{
    background:url('../img/nav2_hover.png') top center no-repeat;
    background-size:cover;
}

#nav3{
    background:url('../img/nav3.png') top center no-repeat;
    background-size:cover;
    width:7.812vw;
    height:3.333vw;
}
#nav3:hover,#nav3.active{
    background:url('../img/nav3_hover.png') top center no-repeat;
    background-size:cover;
}
#nav4{
    background:url('../img/nav4.png') top center no-repeat;
    background-size:cover;
    width:7.812vw;
    height:3.333vw;
}
#nav4:hover,#nav4.active{
    background:url('../img/nav4_hover.png') top center no-repeat;
    background-size:cover;
}

#nav5{
    background:url('../img/nav5.png') top center no-repeat;
    background-size:cover;
    width:7.812vw;
    height:3.333vw;
}
#nav5:hover,#nav5.active{
    background:url('../img/nav5_hover.png') top center no-repeat;
    background-size:cover;
}

#nav6{
    background:url('../img/nav6.png') top center no-repeat;
    background-size:cover;
    width:7.812vw;
    height:3.333vw;
}
#nav6:hover,#nav6.active{
    background:url('../img/nav6_hover.png') top center no-repeat;
    background-size:cover;
}
#yy_con{
    width:2.187vw;
    height:2.187vw;
    position: absolute; 
    top:0.677vw;
    right:16.718vw;
    cursor: pointer;
}
#yy{
    background:url('../img/yy_yes.png') top center no-repeat;
    background-size:cover;
    width:2.187vw;
    height:2.187vw;
}
#line{
    width: 1px;
    height:100%;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
#pinna_1{
    width:100%;
    height:32.083vw;
    background:url('../img/pinna_1.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left:0;
    top:50vw;
    z-index: 1;
    -webkit-animation: opener 2s ease-in-out alternate infinite;
    animation: opener 2s ease-in-out alternate infinite;
}
#pinna_2{
    width:72.708vw;
    height:67.604vw;
    background:url('../img/pinna_2.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left: 12vw;
    top:7vw;
    -webkit-animation: opener 2s ease-in-out alternate infinite;
    animation: opener 2s ease-in-out alternate infinite;
}
#p2{
    position: absolute;
    left:0;
    top:1.562vw;
    width:100%;
}
#p2_title{
    width:100%;
    height:13.593vw;
    position: absolute;
    left:0;
    top:0;
    background:url('../img/p2_title.png') top center no-repeat;
    background-size:cover;
}
#luck_bg{
    width:68.02vw;
    height:45.833vw;
    background:url('../img/luck_bg.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left: 14vw;
    top: 16vw;
}
#tiao_bg{
    width: 1.1vw;
    height: 22.2vw;
    background: url(../img/tiao_bg.png) top center no-repeat;
    background-size: cover;
    position: absolute;
    right: 11.5vw;
    top: 10.8vw;
}

#tiao_2{
    width:1.1vw;
    height:5.729vw;
    position: absolute;
    left:0;
    top: 4vw;
    z-index:3;
}
#tiao_2 span{
    width:100%;
    height:100%;
    background:url('../img/tiao_2_3.png') top center no-repeat;
    background-size:100%;
    display: block;
}
#tiao_3{
    width:1.1vw;
    height:5.729vw;
    position: absolute;
    left:0;
    top: 9.7vw;
    z-index:2;
}
#tiao_3 span{
    width:100%;
    height:100%;
    background:url('../img/tiao_2_3.png') top center no-repeat;
    background-size:100%;
    display: block;
}
#tiao_4{
    width:1.1vw;
    height:6.458vw;
    position: absolute;
    left:0;
    top: 15.7vw;
    z-index:1;
}
#tiao_4 span{
    width:100%;
    height:100%;
    background:url('../img/tiao_4.png') top center no-repeat;
    background-size:100%;
    display: block;
}
#tiao_1{
    width:1.1vw;
    height:4.375vw;
    position: absolute;
    left:0;
    top: -0.6vw;
    z-index:4;
}
#tiao_1 span{
    width:100%;
    height:100%;
    background:url('../img/tiao_1.png') top center no-repeat;
    background-size:100%;
    display: block;
}
#tiao_1 strong{
    display: block;
    background:url('../img/dacheng.png') top center no-repeat;
    background-size:100%;
    position: absolute;
    right: -7vw;
    top: 2.5vw;
    width:5.937vw;
    height:4.479vw;
    opacity:0;
    
}
#tiao_2 strong{
    display: block;
    background:url('../img/dacheng.png') top center no-repeat;
    background-size:100%;
    position: absolute;
    right: -7vw;
    top: 3.2vw;
    width:5.937vw;
    height:4.479vw;
    opacity:0;
    
}
#tiao_3 strong{
    display: block;
    background:url('../img/dacheng.png') top center no-repeat;
    background-size:100%;
    position: absolute;
    right: -7vw;
    top: 3.2vw;
    width:5.937vw;
    height:4.479vw;
    opacity:0;
    
}
#tiao_4 strong{
    display: block;
    background:url('../img/dacheng.png') top center no-repeat;
    background-size:100%;
    position: absolute;
    right: -7vw;
    top: 3vw;
    width:5.937vw;
    height:4.479vw;
    opacity:0;
    
}
.tiao_style.tiao_yes strong{
    opacity:1 !important;
}
.tiao_style i{
    display: block;
    width:6.094vw;
    height:6.094vw;
    background:url('../img/dianNo.png') top center no-repeat;
    background-size:100%;
    position: absolute;
    left: -2.51vw;
    bottom: -3vw;
}
.tiao_style.tiao_yes i{
    background:url('../img/dianYes.png') top center no-repeat;
    background-size:100%;
}
#tiao_4.tiao_style i{
    bottom: -2.4vw;
}
#hui_box{
    width: 12.76vw;
    height: 2.552vw;
    background: url(../img/hui_box.png) top center no-repeat;
    background-size: 100%;
    position: absolute;
    right: 1.1vw;
    bottom: 9vw;
    box-sizing: border-box;
    padding: 0.3vw 0 0 9.3vw;
}
#hui_box img{
    width:1.1vw;
    position: relative;
    top: 0.1vw;
}
#hui_box img:nth-child(2){
    left:-0.2vw
}
#p3{
    position: absolute;
    left:0;
    top:59.083vw;
    width:100%;
}
#p3_bg{
    width:28.229vw;
    height:23.489vw;
    position: absolute;
    right:20vw;
    top: 21vw;
    background:url('../img/p3_bg.png') top center no-repeat;
    background-size:cover;
}
#p3_bg_xia{
    width:3.906vw;
    height:4.479vw;
    background:url('../img/p3_bg_xia.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    right:0;
    bottom:0;
    z-index: 2;
}
#p3_title{
    width:100%;
    height:14.666vw;
    position: absolute;
    left:0;
    top:0;
    background:url('../img/p3_title.png') top center no-repeat;
    background-size:cover;
}
#p4{
    position: absolute;
    left:0;
    top:113.5vw;
    width:100%;
}
#p4_title{
    width:100%;
    height:17.031vw;
    position: absolute;
    left:0;
    top:0;
    background:url('../img/p4_title.png') top center no-repeat;
    background-size:cover;
    z-index: 1;
}
#p4_con{
    background:url('../img/p4_con.png') top center no-repeat;
    background-size:cover;
    width:100%;
    height:51.197vw;
    position: absolute;
    top: 17vw;
    left:0;
}
#join_btn{
    width: 16.2vw;
    height: 3.645vw;
    position: absolute;
    top: 41.514vw;
    left: 40.5vw;
}
#p5{
    position: absolute;
    left:0;
    top:182.291vw;
    width:100%;
}
#p5_title{
    width:100%;
    height:12.916vw;
    position: absolute;
    left:0;
    top:0;
    background:url('../img/p5_title.png') top center no-repeat;
    background-size:cover;
}
#p5_list{
    width:60.052vw;
    height:28.229vw;
    background:url('../img/p5_list.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left:20.208vw;
    top:15.416vw;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between
}
#p5_list a{
    width:19.27vw;
    height:5.833vw;
    display: block;
    margin-bottom:1.3vw;
}
#p6{
    position: absolute;
    left:0;
    top:235.416vw;
    width:100%;
}
#btn_gs{
    width:19.322vw;
    height:5.468vw;
    background:url('../img/btn_gs.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    top:0;
    left:28.75vw;
}
#btn_Twitte{
    width:19.322vw;
    height:5.468vw;
    background:url('../img/btn_Twitte.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    top:0;
    right:28.75vw;
}
#bigLogo{
    width:24.406vw;
    height:20.312vw;
    background:url('../img/bigLogo.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    top:11.562vw;
    left:36.145vw;
}
#download_apple{
    width:16.927vw;
    height:4.27vw;
    background:url('../img/download_apple.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left:32.187vw;
    top:33.854vw;
}
#download_google{
    width:16.875vw;
    height:5.104vw;
    background:url('../img/download_google.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    right:32.187vw;
    top:32.9vw;
}
#ft_text{
    width:100%;
    height:20.989vw;
    background:url('../img/ft_text.jpg') top center no-repeat;
    background-size:cover;
    position: absolute;
    left:0;
    bottom:0;
}
#ft_text a{
    display: block;
    position: absolute;
}
#ft_text .ft_link1{
    width:7.8vw;
    height:1.041vw;
    left:40vw;
    top:6.562vw;
}
#ft_text .ft_link2{
    width:11.1vw;
    height:1.041vw;
    right:38.6vw;
    top:6.562vw;
}
#ft_text .ft_link3{
    width:15.312vw;
    height:1.041vw;
    left:42vw;
    top:8.562vw;
}
#cj_btn{
    width:8.177vw;
    height:2.812vw;
    background:url('../img/cj_btn.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left: 22vw;
    top: 45vw;
    cursor: pointer;
    z-index:1;
}
#cj_btn:hover{
    background:url('../img/cj_btn_hover.png') top center no-repeat;
    background-size:cover;
}
#fx_btn{
    width:8.177vw;
    height:2.812vw;
    background:url('../img/fx_btn.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left: 22vw;
    top: 48.5vw;
    cursor: pointer;
    z-index: 1;
}
#fx_btn:hover{
    background:url('../img/fx_btn_hover.png') top center no-repeat;
    background-size:cover;
}
#jg_btn{
    width:8.177vw;
    height:2.812vw;
    background:url('../img/jg_btn.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left: 22vw;
    top: 52vw;
    cursor: pointer;
    z-index: 1;
}
#jg_btn:hover{
    background:url('../img/jg_btn_hover.png') top center no-repeat;
    background-size:cover;
}
#vd_play_icon{
    background:url('../img/vd_play_icon.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    z-index:5;
    cursor: pointer;
}
#vd_box_con{
    width:40.1vw;
    height:22.3vw;
    position: absolute;
    left: 0.53vw;
    top: 0.3vw;
    overflow: hidden;
    border-radius:0.2vw;
    
}
#vd_box{
    width:41.093vw;
    height:23.333vw;
    background:url('../img/vd_box.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    top: 21vw;
    left:19.552vw;
    z-index: 10;
}
#vd_box_icon{
    background:url('../img/vd_box_icon.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    top:-0.3vw;
    left:-0.2vw;
    z-index: 1;
    width:4.062vw;
    height:4.739vw;
    pointer-events:none;
}
#vd_tab_1{
    background:url('../img/vd_tab_1.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
    cursor: pointer;
}
#vd_tab_1:hover,#vd_tab_1.pitch{
    background:url('../img/vd_tab_1_h.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
}
#vd_tab_2{
    background:url('../img/vd_tab_2.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
    cursor: pointer;
}
#vd_tab_2:hover,#vd_tab_2.pitch{
    background:url('../img/vd_tab_2_h.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
}
#vd_tab_3{
    background:url('../img/vd_tab_3.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
    cursor: pointer;
}
#vd_tab_3:hover,#vd_tab_3.pitch{
    background:url('../img/vd_tab_3_h.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
}
#vd_tab_4{
    background:url('../img/vd_tab_4.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
    cursor: pointer;
}
#vd_tab_4:hover,#vd_tab_4.pitch{
    background:url('../img/vd_tab_4_h.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
}
#vd_tab_5{
    background:url('../img/vd_tab_5.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
    cursor: pointer;
}
#vd_tab_5:hover,#vd_tab_5.pitch{
    background:url('../img/vd_tab_5_h.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
}
#vd_tab_6{
    background:url('../img/vd_tab_6.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
    cursor: pointer;
}
#vd_tab_6:hover,#vd_tab_6.pitch{
    background:url('../img/vd_tab_6_h.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
}
#vd_tab_7{
    background:url('../img/vd_tab_7.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
    cursor: pointer;
}
#vd_tab_7:hover,#vd_tab_7.pitch{
    background:url('../img/vd_tab_7_h.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
}
#vd_tab_8{
    background:url('../img/vd_tab_8.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
    cursor: pointer;
}
#vd_tab_8:hover,#vd_tab_8.pitch{
    background:url('../img/vd_tab_8_h.png') top center no-repeat;
    background-size:cover;
    width:18.333vw;
    height:4.739vw;
}
#swiperPage4{
    width: 23vw;
    height: 22.2vw;
    position: relative;
    left: 4vw;
    top: 0.5vw;
}
#swiperPage4 .swiper-wrapper{
    padding-top:0.52vw;
}
#p3_bg .swiper-button-prev{
    top: -3vw;
    right: 8.5vw;
    left:auto;
    background:url('../img/vd_shang.png') top center no-repeat;
    background-size:cover;
    width:3.854vw;
    height:2.968vw;
    margin-top:0;
}
#p3_bg .swiper-button-next{
   top:initial;
   bottom:-2.8vw;
   right: 8.5vw;
   background:url('../img/vd_xia.png') top center no-repeat;
   background-size:cover;
   width:3.854vw;
   height:2.968vw;
   margin-top:0;
}
.rotate-music {
    animation-name: rotate-music;
    animation-duration: 15s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    -webkit-animation-name: rotate-music;
    -webkit-animation-duration: 15s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
}
.mOnOff{
    display:none;
}


.turntable-bg {
    width: 38.645vw;
    height: 38.645vw;
    margin: 0 auto;
    position: absolute;
    left: 31.3vw;
    top: 17.4vw;
    z-index: 10;
    transform: scale(0.86);
    -webkit-transform: scale(0.8);
}
.turntable-bg #pan_wai{
    width:46.039vw;
    height:46.039vw;
    background:url('../img/pan_wai.png') top center no-repeat;
    background-size:cover;
    pointer-events:none;
    position: absolute;
    left: -3.7vw;
    top: -3.9vw;
    z-index: 1;
}
.turntable-bg .pointer {
    width: 13.802vw;
    height:20.885vw;
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 8;
    background:url('../img/zhen.png') top center no-repeat;
    background-size:cover;
    margin: -13vw 0 0 -6.8vw;
}
.turntable-bg .rotate {
    width:38.645vw;
    height:38.645vw;
    position: absolute;
    left:0;
    top:0;
}
.go_btn{
    width:12.5vw;
    height:12.5vw;
    background:url('../img/go_btn.png') top center no-repeat;
    background-size:cover;
    cursor: pointer;
    position: absolute;
    left: 0.7vw;
    top: 6.8vw;
}
.go_btn.kai:hover{
    background:url('../img/go_btn_hover.png') top center no-repeat;
    background-size:cover;
}
.j_0{
    width:9.583vw;
    height:9.583vw;
    /*background:url('../img/j_0.png') top center no-repeat;*/
    background-size:cover;
    position: absolute;
    left: 14.55vw;
    top: 1vw;
}
.j_0.win{
    /*background:url('../img/j_0_hover.png') top center no-repeat;*/
    background-size:cover;
}
.j_1{
    width:9.583vw;
    height:9.583vw;
    /*background:url('../img/j_1.png') top center no-repeat;*/
    background-size:cover;
    position: absolute;
    left: 24vw;
    top: 5.1vw;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.j_1.win{
    /*background:url('../img/j_1_hover.png') top center no-repeat;*/
    background-size:cover;
}
.j_2{
    width:9.583vw;
    height:9.583vw;
    /*background:url('../img/j_2.png') top center no-repeat;*/
    background-size:cover;
    position: absolute;
    left: 28vw;
    top: 14.6vw;
}
.j_2.win{
    /*background:url('../img/j_2_hover.png') top center no-repeat;*/
    background-size:cover;
}
.j_3{
    width:9.583vw;
    height:9.583vw;
    /*background:url('../img/j_3.png') top center no-repeat;*/
    background-size:cover;
    position: absolute;
    left: 24vw;
    top: 24vw;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.j_3.win{
    /*background:url('../img/j_3_hover.png') top center no-repeat;*/
    background-size:cover;
}
.j_4{
    width:9.583vw;
    height:9.583vw;
    /*background:url('../img/j_4.png') top center no-repeat;*/
    background-size:cover;
    position: absolute;
    left: 14.5vw;
    top: 28vw;
}
.j_4.win{
    /*background:url('../img/j_4_hover.png') top center no-repeat;*/
    background-size:cover;
}
.j_5{
    width:9.583vw;
    height:9.583vw;
    /*background:url('../img/j_5.png') top center no-repeat;*/
    background-size:cover;
    position: absolute;
    left: 4.6vw;
    top: 24vw;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);

}
.j_5.win{
    /*background:url('../img/j_5_hover.png') top center no-repeat;*/
    background-size:cover;
}
.j_6{
    width:9.583vw;
    height:9.583vw;
     /*background:url('../img/j_6.png') top center no-repeat;*/
    background-size:cover;
    position: absolute;
    left: 1vw;
    top: 14.6vw;
}
.j_6.win{
    /*background:url('../img/j_6_hover.png') top center no-repeat;*/
    background-size:cover;
}
.j_7{
    width:9.583vw;
    height:9.583vw;
    /*background:url('../img/j_7.png') top center no-repeat;*/
    background-size:cover;
    position: absolute;
    left: 5.35vw;
    top: 5.1vw;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.j_7.win{
    /*background:url('../img/j_7_hover.png') top center no-repeat;*/
    background-size:cover;
}
.pop{
    padding-right:0 !important;
}
#list_jl{
    width: 42.5vw;
    height:14.8vw;
    overflow-y: auto;
    left: 8vw;
    top: 7vw;
    position: absolute;
}
#list_jl li{
    font-size:1.2vw;
    padding:0 0 0.625vw;
    font-weight:bold;
    position: relative;
}
#list_jl li span{
    margin-right:6.875vw;
}
#list_jl li i{
    font-style: normal;
    width:2vw;
    display:inline-block;
}
#list_jl li a{
    display:inline-block;
    background:url('../img/copy.png') top center no-repeat;
    background-size:cover;
    width:3.802vw;
    height:1.562vw;
    margin-left:1vw;
    overflow: hidden;
    text-indent:-9999px;
    vertical-align:middle;
    position:absolute;
    top:0;
    right:2vw;
}
#list_jl li a:hover{
    background:url('../img/copy_hover.png') top center no-repeat;
    background-size:cover;
}
.modal-dialog.cj{
    width: 54.531vw;
    height:26.614vw;
    background:url('../img/gz_pop.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left:50%;
    top:50%; 
    margin:-13vw 0 0 -27vw;
}
.modal-dialog.jg{
    width: 54.531vw;
    height:26.614vw;
    background:url('../img/jg_pop.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left:50%;
    top:50%; 
    margin:-13vw 0 0 -27vw;
}
.modal-dialog.jl{
    width: 54.531vw;
    height:26.614vw;
    background:url('../img/list_bg.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    left:50%;
    top:50%; 
    margin:-13vw 0 0 -27vw;
}
#jl_close{
    width:2.396vw;
    height:2.396vw;
    background:url('../img/close.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    right: 0.74vw;
    top: 0.26vw;
    cursor: pointer
}
#jl_close:hover{
    background:url('../img/close_hover.png') top center no-repeat;
    background-size:cover;
}
#cj_close{
    width:2.396vw;
    height:2.396vw;
    background:url('../img/close.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    right: 0.74vw;
    top: 0.26vw;
    cursor: pointer;
}
#cj_close:hover{
    background:url('../img/close_hover.png') top center no-repeat;
    background-size:cover;
}
#jg_close{
    width:2.396vw;
    height:2.396vw;
    background:url('../img/close.png') top center no-repeat;
    background-size:cover;
    position: absolute;
    right: 0.74vw;
    top: 0.26vw;
    cursor: pointer;
}
#jg_close:hover{
    background:url('../img/close_hover.png') top center no-repeat;
    background-size:cover;
}
.vjs-big-play-centered .vjs-big-play-button{
    display:none !important;
}
.layer_item{
    width:61.093vw;
    height:34.375vw;
    background:#000;
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
}
#layer_item1{
    background:url('../img/layer1.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item2{
    background:url('../img/layer2.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item3{
    background:url('../img/layer3.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item4{
    background:url('../img/layer4.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item5{
    background:url('../img/layer5.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item6{
    background:url('../img/layer6.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item7{
    background:url('../img/layer7.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item8{
    background:url('../img/layer8.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item9{
    background:url('../img/layer9.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item10{
    background:url('../img/layer10.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item11{
    background:url('../img/layer11.jpg') top center no-repeat;
    background-size:100%;
}
#layer_item12{
    background:url('../img/layer12.jpg') top center no-repeat;
    background-size:100%;
}
.layer_close{
    width:11.562vw;
    height:3.7vw;
    position: absolute;
    right:14.375vw;
    bottom:1.666vw;
    cursor: pointer;
}
.info{
    height:177vw;
    background:url('../img/info_bg.jpg') top center no-repeat;
    background-size:100%;
    position: relative;
}
#info_close{
    background:url('../img/info_close.png') top center no-repeat;
    background-size:100%;
    display: block;
    width:3.7vw;
    height:3.7vw;
    position: absolute;
    right:3vw;
    top:1vw;
}
#bk_btn{
    width:21.25vw;
    display: block;
    height:6.98vw;
    position: absolute;
    left: 38.5vw;
    bottom: 2.6vw;
}
@keyframes rotate-music {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}


@-webkit-keyframes rotate-music {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}

.paused{
    animation-play-state: paused;
    -webkit-animation-play-state: paused;
}


@media (max-width: 767px) {
    .info{
        height:21.68rem;
        background:url('../img/m/info_bg.jpg') top center no-repeat;
        background-size:100%;
        position: relative;
    }
    #info_close{
        width:0.8rem;
        height:0.8rem
    }
    #bk_btn{
        width:2.77rem;
        height:0.9rem;
        position: absolute;
        bottom:0.95rem;
        left:2.39rem;
    }
    .mOnOff{
        display: block;
        position: absolute;
        top:0.45rem;
        left:0.18rem;
    }
    .mOnOff .wcLine{
        width:0.34rem;
        height:0.05rem;
        background:#fff;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        position: absolute;
        top: 50%;
        left: 0;
        -webkit-transition: transform .3s, opacity .3s;
        transition: transform .3s, opacity .3s;
    }
    
    .mOnOff .wsLine{
        position: absolute;
        top: 50%;
        left: 0;
        transition: transform .3s, opacity .3s;
        -webkit-transition: transform .3s, opacity .3s;
        width:0.34rem;
        height:0.05rem;
        background:#fff;
        transform: translateY(calc(-50% - 0.1rem));
        -webkit-transform: translateY(calc(-50% - 0.1rem));
    }
    .mOnOff .wxLine{
        position: absolute;
        top: 50%;
        left: 0;
        width:0.34rem;
        height:0.05rem;
        background:#fff;
        transform: translateY(calc(-50% + 0.1rem));
        -webkit-transform: translateY(calc(-50% + 0.1rem));
        transition: transform .3s, opacity .3s;
        -webkit-transition: transform .3s, opacity .3s;
    }
    .mOnOff.act .wcLine{
            opacity: 0;
    }
    .mOnOff.act .wsLine{
        transform: translateY(-50%) rotate(45deg);
        -webkit-transform: translateY(-50%) rotate(45deg);
    }
    .mOnOff.act .wxLine{
        transform: translateY(-50%) rotate(-45deg);
        -webkit-transform: translateY(-50%) rotate(-45deg);
    }
    .bg1{
        height:8.35rem;
        background:url('../img/m/bg1.jpg') top center no-repeat;
        background-size:cover;
        position:relative;
    }
    .bg2{
        height:34.66rem;
        background:url('../img/m/bg2.jpg') top center no-repeat;
        background-size:cover;
        position:relative;
    }
    .nav_tab{
        width:1.52rem;
        height:auto;
        margin:0;
        background:#000f20;
        position: absolute;
        top:1.06rem;
        left:0.15rem;
        transition: transform .3s, opacity .3s;
        -webkit-transition: transform .3s, opacity .3s;
        opacity: 0;
        transform: scaleY(0);
        transform-origin: center top;
        -webkit-transform: scaleY(0);
        -webkit-transform-origin: center top;
        pointer-events:none;
    }
    .nav_tab.act{
        pointer-events: initial;
        opacity: 1;
        transform: scaleY(1);
        -webkit-transform: scaleY(1);
    }
    #nav6{
        margin-bottom:0.1rem;
    }
    .nav_con{
        height:0.96rem;
        background:#001020;
    }
    .nav_tab a{
        float:none;
        display: block;
        height: 0.504rem !important;
        width:100% !important;
        margin-left:0 !important;
    }
    .mLogo{
        width:0.7rem;
        height:0.55rem;
        left:3.48rem;
        top:0.24rem;
    }
    #yy_con{
        width:0.5rem;
        height:0.5rem;
        top:0.24rem;
        right:0.24rem;
    }
    #yy{
        width:0.5rem;
        height:0.5rem;
    }
    #tiao_bg{
        width: 0.13rem;
        height: 2.43rem;
        right: 1.35rem;
        top: 1.5rem;
    }
    .tiao_style i{
        width: 0.7rem;
        height: 0.7rem;
        left: -0.279rem;
        bottom: -0.35rem;
    }
    #tiao_1{
        width:0.13rem;
        height:0.53rem;
        top: -0.06rem;
    }
    #tiao_2{
        width: 0.13rem;
        height: 0.82rem;
        top:0.3rem
    }
    #tiao_2 span{
        background-size: cover;
    }
    #tiao_3{
        width:0.13rem;
        height: 0.64rem;
        top: 1.19rem;
    }
    #tiao_4{
        width: 0.13rem;
        height: 0.74rem;
        top: 1.87rem;
    }
    #tiao_1 strong{
        width:0.67rem;
        height:0.54rem;
        right: -0.8rem;
        top: 0.2rem;
    }
    #tiao_2 strong{
        width: 0.67rem;
        height: 0.54rem;
        right: -0.8rem;
        top: 0.55rem;
    }
    #tiao_3 strong{
        width:0.67rem;
        height:0.54rem;
        right: -0.8rem;
        top: 0.3rem;
    }
    #tiao_4 strong{
        width:0.67rem;
        height:0.54rem;
        right: -0.8rem;
        top: 0.3rem;
    }
    #hui_box{
        width: 1.62rem;
        height: 0.35rem;
        right: 0.1rem;
        bottom: 0.28rem;
        padding: 0.013rem 0 0 1.18rem;
    }
    #hui_box img{
        width: 0.15rem;
        top: -0.05rem;
    }
    #hui_box img:nth-child(2){
        left:-0.05rem
    }
    #cj_btn{
        width:1.26rem;
        height:0.42rem;
        left:0.76rem;
        top: 3.6rem;

    }
    #fx_btn{
        width:1.26rem;
        height:0.42rem;
        left:0.76rem;
        top: 4.2rem;
    }
    #jg_btn{
        width:1.26rem;
        height:0.42rem;
        left:0.76rem;
        top: 4.8rem;
    }
    .turntable-bg{
        transform: scale(1.18);
        -webkit-transform: scale(1.18);
        left: 2.5rem;
        top: 1.9rem;
    }
    #pinna_1{
        top:4.5rem;
        left: -1rem;
        width:9.64rem;
        height:2.7rem;
        background: url(../img/m/pinna_1.png) top center no-repeat;
        background-size: cover;
        -webkit-animation: opener1 2s ease-in-out alternate infinite;
        animation: opener1 2s ease-in-out alternate infinite;
    }
    #p2{
        top:0;
    }
    #vd_box{
        width:4.91rem;
        height:2.78rem;
        left:0.22rem;
        top: 1.5rem;
        
    }
    #swiperPage4{
        width: 2.3rem;
        height: 2.62rem;
        left: 0.5rem;
        top: 0.1rem;
    }
    #vd_tab_1{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_1:hover, #vd_tab_1.pitch{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_2{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_2:hover, #vd_tab_2.pitch{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_3{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_3:hover, #vd_tab_3.pitch{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_4{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_4:hover, #vd_tab_4.pitch{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_5{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_5:hover, #vd_tab_5.pitch{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_6{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_6:hover, #vd_tab_6.pitch{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_7{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_7:hover, #vd_tab_7.pitch{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_8{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_tab_8:hover, #vd_tab_8.pitch{
        width: 2.14rem;
        height: 0.55rem;
    }
    #vd_box_con{
        width:4.83rem;
        height:2.7rem;
    }
    #vd_box_icon{
        width:0.46rem;
        height:0.52rem;
        left:-0.03rem;
        top:-0.03rem;
    }
    #p3_bg_xia{
        width: 0.48rem;
        height: 0.52rem;
        bottom: -0.04rem;
        background-size: 100%;
    }
    #p3_bg{
        width: 3.4rem;
        height: 2.76rem;
        right: 0.3rem;
        top: 1.5rem;
    }
    #p3_bg .swiper-button-next{
        width:0.6rem;
        height:0.38rem;
        background-size:100%;
        bottom: -0.4rem;
        right: 0.8rem;
    }
    #p3_bg .swiper-button-prev{
        width:0.6rem;
        height:0.38rem;
        top: -0.5rem;
        right: 0.8rem;
        background-size:100%;
    }
    #p2_title{
        height: 1.12rem;
        top: -0.3rem;
    }
    #luck_bg{
        width: 8.3rem;
        height: 4.85rem;
        background: url(../img/m/luck_bg.png) top center no-repeat;
        background-size: cover;
        position: absolute;
        left: -0.8rem;
        top: 0.7rem;
    }
    #p3{
        top:5.53rem
    }
    #p3_title{
        height: 1.12rem;
    }
    .modal-dialog.cj{
        background: url(../img/m/gz_pop.png) top center no-repeat;
        background-size:100%;
        position: absolute;
        width:6.78rem;
        height:8.24rem;
        margin:-4.12rem 0 0 -3.39rem;
    }
    #cj_close{
        width: 0.42rem;
        height: 0.42rem;
        right: 0.15rem;
        top: 0.04rem;
    }
   /* #p3_bg{
        width:3.46rem;
        height:2.82rem;
        background: url(../img/m/p3_bg.png) top center no-repeat;
        background-size: cover;
        top:1.24rem;
        right:0.3rem
    }*/
    .modal-dialog.jg{
        width:6.81rem;
        height:3.38rem;
        background: url(../img/m/jg_pop.png) top center no-repeat;
        background-size:100%;
        margin:-1.69rem 0 0 -3.405rem;
    
    }
    #jg_close{
        width: 0.42rem;
        height: 0.42rem;
        right: 0.15rem;
        top: 0.04rem;
    }
    #p4{
        top: 10.2rem;
    }
    #p4_con{
        width: 110%;
        top: 1rem;
        left: -0.2rem;
        height: 5.2rem;
    }
    #join_btn{
        width: 1.8rem;
        height: 0.6rem;
        left: 3.2rem;
        top: 4.1rem;
    }
    #p4_title{
        height: 1.42rem;
    }
    #p5{
        top: 16rem;
    }
    #p5_title{
        height: 1.12rem;
    }
    #p5_list{
        width:6.72rem;
        height:7.47rem;
        background: url(../img/m/p5_list.png) top center no-repeat;
        background-size: cover;
        left:0.44rem;
        top:1.32rem;
    }
    #p5_list a{
        width:3.3rem;
        height:1.02rem;
        margin-bottom:0.2rem;
    }
    #p6{
        top: 25.5rem;
    }
    #btn_gs{
        width:2.9rem;
        height:0.82rem;
        left:0.57rem;
    }
    #btn_Twitte{
        width:2.9rem;
        height:0.82rem;
        right:0.57rem;
    }
    #bigLogo{
        width:3.02rem;
        height:2.22rem;
        left:2.26rem;
        top:1.62rem;
    }
    #download_apple{
        width:2.8rem;
        height:0.71rem;
        left: 2.4rem;
        top: 4.5rem;
    }
    #download_google{
        width: 2.8rem;
        height: 0.83rem;
        right: 2.3rem;
        top: 4.3rem;
    }
    #pinna_2{
        -webkit-animation: opener1 2s ease-in-out alternate infinite;
        animation: opener1 2s ease-in-out alternate infinite;
    }
    #ft_text{
        width:100%;
        height:3.39rem;
        background: url(../img/m/ft_text.jpg) top center no-repeat;
        background-size: cover;
    }
    #ft_text .ft_link1{
        width:1.36rem;
        height:0.18rem;
        top:1.31rem;
        left:2.15rem;
    }
    #ft_text .ft_link2{
        width:1.98rem;
        height:0.19rem;
        top:1.31rem;
        left:3.86rem;
    }
    #ft_text .ft_link3{
        width:2.75rem;
        height:0.19rem;
        top:1.68rem;
        left:2.51rem;
    }
    .modal-dialog.jl{
        width:6.78rem;
        height:8.24rem;
        background: url(../img/m/list_bg.png) top center no-repeat;
        background-size: cover;
        margin: -4.12rem 0 0 -3.39rem;
    }
    #list_jl{
        width: 6rem;
        height: 6.22rem;
        top: 1.22rem;
        left: 0.5rem;
        
    }
    #list_jl li{
        font-size:0.24rem;
    }
    #list_jl li span{
        margin-right:0.1rem;
    }
    #list_jl li a{
        width:0.8rem;
        height:0.35rem;
        background-size:100%;
    }
    #jl_close{
        width: 0.42rem;
        height: 0.42rem;
        right: 0.15rem;
        top: 0.04rem;
    }
    .layer_item{
        width:7.04rem;
        height:4.79rem;
        background:#000;
        position: absolute;
        left:50%;
        top:50%;
        transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
    }
    #layer_item1{
        background:url('../img/m/layer1.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item2{
        background:url('../img/m/layer2.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item3{
        background:url('../img/m/layer3.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item4{
        background:url('../img/m/layer4.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item5{
        background:url('../img/m/layer5.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item6{
        background:url('../img/m/layer6.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item7{
        background:url('../img/m/layer7.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item8{
        background:url('../img/m/layer8.jpg') top center no-repeat;
        background-size:100%;
        width:7.04rem;
        height:6.33rem;
    }
    #layer_item9{
        background:url('../img/m/layer9.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item10{
        background:url('../img/m/layer10.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item11{
        background:url('../img/m/layer11.jpg') top center no-repeat;
        background-size:100%;
    }
    #layer_item12{
        background:url('../img/m/layer12.jpg') top center no-repeat;
        background-size:100%;
    }
    .layer_close{
        width:1.77rem;
        height:0.57rem;
        position: absolute;
        right:1.69rem;
        bottom:0.29rem;
        cursor: pointer;
    }
    #list_jl li i{
        font-style: normal;
        display: inline-block;
        width:0.4rem;
    }
}