html,body{
    position: relative;
    display: block;
    width:100%;
    height: 100%; 
}
.container{
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    min-height: 950px;
    margin: 0px auto;
    max-width: 1920px;
    overflow: hidden;
}
.inner{
    position:relative;
    display:block;
    width:980px;
    margin:0px auto;
    z-index:1;    
}
.wrap{
	position:absolute;
	width:100%;
	height:100%;
	left:0px;
	top:0px;
    z-index:1;
    opacity:0;
    transition:all 0.6s ease-out;
    -webkit-transition:all 0.6s ease-out;
    -moz-transition:all 0.6s ease-out;         
}
.wrap.active{
    z-index:3;
    opacity:1;    
}
.video-wrap {
    position: absolute;
    height: 1080px;
    left: 50%;
    top: 0;
    z-index: 1;
    margin-left: -960px
}
.logo{
    position: absolute;
    display:block;
    width:90px;
    height:74px;
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat 0px 0px;
    left:30px;
    top:-100px;
    z-index:9;
    opacity:0; 
    transition:all 1.2s ease-out;
    -webkit-transition:all 1.2s ease-out;
    -moz-transition:all 1.2s ease-out;       
}
.logo.show{
    opacity:1; 
    top:20px; 
}
.logo.gohome{
    width:196px;
    height:70px;
    background-position:-107px 0px;
    left:134px;
    top:-100px;
    opacity:0px; 
    transition:all 1.2s ease-out;
    -webkit-transition:all 1.2s ease-out;
    -moz-transition:all 1.2s ease-out;      
}
.logo.gohome.show{
    opacity:1; 
    top:20px;
}
.first{
    position: absolute;
    display: block;
    width:108px;
    height:28px;
    z-index:0; 
    line-height:28px;  
    text-indent:38px;
    color:rgba(255, 255, 255,1); 
    border:1px solid rgba(255, 255, 255, 0.55);
    top:20px;
    right:220px;
    transition:all .6s ease-out;
    -webkit-transition:all .6s ease-out;
    -moz-transition:all .6s ease-out;
    -ms-transition:all .6s ease-out;
    -o-transition:all .6s ease-out;    
}
.first.show{
    z-index:9; 
}
.first i{
    position: absolute;
    display:block;
    width:11px;
    height:9px;
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -432px 0px;
    left:16px;
    top:8px;
    transition:all .2s ease-out;
    -webkit-transition:all .2s ease-out;
    -moz-transition:all .2s ease-out;
    -ms-transition:all .2s ease-out;
    -o-transition:all .2s ease-out;      
}
.first:hover{
    background:#c93;
    border:1px solid #c93;  
}
.first:hover i{
    left:10px; 
}
.nav-wrap {
    border: 1px solid rgba(255, 255, 255, 0.55);
    position: absolute;
    top:-100px;
    right: 20px;
    z-index: 9;
    transition:all 1.2s ease-out;
    -webkit-transition:all 1.2s ease-out;
    -moz-transition:all 1.2s ease-out;
}
.nav-wrap.show{
    opacity:1;
    top:20px;  
}
.nav-wrap li {
    float: left;
    color: #cfc3bc;
    line-height: 28px
}
.nav-wrap li.last {
    padding: 0 10px;
    cursor: pointer
}
.nav-wrap li a {
    display: block;
    width: 38px;
    height: 28px;
    border-right: 1px solid rgba(255, 255, 255, 0.55);
    position: relative;
    transition: background-color .6s ease-out;
    -webkit-transition: background-color .6s ease-out;
    -moz-transition: background-color .6s ease-out;
    -ms-transition: background-color .6s ease-out;
    -o-transition: background-color .6s ease-out;
    background: url(https://static.web.sdo.com//woool/pic/woool_act/20170615_zhongzhou/icon.png?v=3) no-repeat
}
.nav-wrap li a:hover {
    background-color: #c93;
}
.nav-wrap li a.link1 {
    background-position: 13px -138px
}
.nav-wrap li a.link1:hover {
    background-position: -31px -138px
}
.nav-wrap li a.link2 {
    background-position: 13px -173px
}
.nav-wrap li a.link2:hover {
    background-position: -31px -173px
}
.nav-wrap li a.link3 {
    background-position: 11px -209px
}
.nav-wrap li a.link3:hover {
    background-position: -33px -209px
}
.nav-wrap a img {
    position: absolute;
    left: -2px;
    top: 23px;
    display: none
}
.nav-wrap a.link3:hover img {
    display: block
}
.music {
    width: 16px;
    height: 1px;
    position: relative;
    float: right;
    margin-left: 10px;
    top: 18px
}
.music i {
    width: 1px;
    height: 2px;
    position: absolute;
    bottom: 0;
    background-color: #cfc3bc
}
.music i:nth-of-type(1) {
    left: 0
}
.music i:nth-of-type(2) {
    left: 3px
}
.music i:nth-of-type(3) {
    left: 6px
}
.music i:nth-of-type(4) {
    left: 9px
}
.music i:nth-of-type(5) {
    left: 12px
}
.music.play i:nth-of-type(1) {
    -webkit-animation: wave .66s linear infinite;
    animation: wave .66s linear infinite
}
.music.play i:nth-of-type(2) {
    -webkit-animation: wave .8s linear infinite;
    animation: wave .8s linear infinite
}
.music.play i:nth-of-type(3) {
    -webkit-animation: wave .7s linear infinite;
    animation: wave .7s linear infinite
}
.music.play i:nth-of-type(4) {
    -webkit-animation: wave .5s linear infinite;
    animation: wave .5s linear infinite
}
.music.play i:nth-of-type(5) {
    -webkit-animation: wave .9s linear infinite;
    animation: wave .9s linear infinite
}
#fixed-bottom{
    position:fixed;
    width:100%;
    height:100px;
    z-index:9;
    left:0px;
    opacity:0; 
    bottom:-200px;
    transition:all 1.2s ease-out;
    -webkit-transition:all 1.2s ease-out;
    -moz-transition:all 1.2s ease-out;
    -ms-transition:all 1.2s ease-out;
    -o-transition:all 1.2s ease-out;
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/fixed-bottom-bg.png") repeat-x;     
}
#fixed-bottom.show{
    bottom:0px;
    opacity:1;  
}
#fixed-bottom .line{
    position: absolute;
    bottom:-20px; 
    display:block;
    width:100%;
    border-top:1px solid rgba(255, 255, 255, 0.55);
    transition:all .6s ease-out;
    -webkit-transition:all .6s ease-out;
    -moz-transition:all .6s ease-out;
    -ms-transition:all .6s ease-out;
    -o-transition:all .6s ease-out;   
}
#fixed-bottom:hover .line{
    bottom:80px; 
}
#fixed-bottom a{
    position: absolute;
    text-align: center;
    top:14px;
}
#fixed-bottom a:after{
    position: absolute;
    display:block;
    content:"";
    width:22px;
    height:22px;
    background-color:rgba(255,196,53, 0.4);
    left:21px;
    top:-25px;
    display:none; 
    border-radius:50%;       
}
#fixed-bottom a span{
    font-size:16px; 
}
#fixed-bottom a b{
    font-size:12px; 
    font-weight:normal;
    line-height:1.6;  
}
#fixed-bottom a.link1{
    left:54px;
    color:#fff;   
}
#fixed-bottom a.link2{
    left:313px;
    color:#cdb374;  
}
#fixed-bottom a.link3{
    right:336px;
    color:rgba(255, 255, 255, 0.4);
    cursor:default;   
}
#fixed-bottom a.link4{
    right:76px;
    color:rgba(255, 255, 255, 0.4);
    cursor: default;  
}
#fixed-bottom a em{
    position:absolute;
    display:block;
    width:14px;
    height:14px;
    border-radius:50%;
    top:-21px;
    left:50%;
    margin-left:-7px;    
    background-color:#fff;    
}
#fixed-bottom a.link2 em{
    background-color:#ffc435; 
}
#fixed-bottom a.link3 em,
#fixed-bottom a.link4 em{
    background-color:#473e40; 
}
#fixed-bottom a.link2:after{
    display: block;
}
#fixed-bottom .arrow{
    position: absolute;
    display:block;
    width:82px;
    height:18px;
    left:50%;
    margin-left:-41px;
    bottom:6px;
    transition:all .3s ease-out;
    -webkit-transition:all .3s ease-out;
    -moz-transition:all .3s ease-out;
    -ms-transition:all .3s ease-out;
    -o-transition:all .3s ease-out;   
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -470px 0px;    
}
#fixed-bottom:hover .arrow{
    bottom:-40px; 
}
/*SVG*/
circle {
    -webkit-transition: stroke-dasharray .25s;
    transition: stroke-dasharray .25s;
}
/*======home page======*/
.home .loading{
    background: url(https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/load-bg.jpg)  no-repeat top center;
    background-color: #000000;
    height:1030px; 
    z-index:2;
    position:absolute;
    display:block;
    left:0px;
    top:0px;
    width:100%;    
}
.home .content{
    position:absolute;
    left:0px;
    top:0px;
    z-index:1;    
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/home-bg2.jpg") no-repeat top center;
    background-color: #FFFFFF;
    height:1030px;
    width:100%;  
}
.home .content .btn{
    position:absolute;
    display:block;  
    width: 250px;
    height: 78px;
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/home-icon.png);
    background-position:-219px -76px;
    left: 50%;
    margin-left: -125px;
    top: 552px;
    z-index:3; 
    cursor: pointer;
    animation-delay: 1.5s;
    -webkit-animation-delay: 1.5s;
    animation-direction: 1s;
    -webkit-animation-duration: 1s;
}
.home .content .btn:hover{
    background-position:-450px -490px;
}
.home .title{   
    width: 682px;
    height: 230px;
    position: absolute;
    left: 50%;
    margin-left: -341px;
    top: 246px;
    z-index:3; 
}
.home .title>div{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/home-icon.png);
    position: absolute;
}
.home .title .t1{
    background-position: 0 -219px;
    width: 256px;
    height: 223px;
    transition: all .1s ease-out .2s;
    -webkit-transition: all .1s ease-out .2s;
    -moz-transition: all .1s ease-out .2s;
    -ms-transition: all .1s ease-out .2s;
    -o-transition: all .1s ease-out .2s
}
.home .title .t2{
    background-position: -288px -219px;
    width: 195px;
    height: 195px;  
    left: 200px;
    top: 20px;
    transition: all .1s ease-out .2s;
    -webkit-transition: all .1s ease-out .4s;
    -moz-transition: all .1s ease-out .4s;
    -ms-transition: all .1s ease-out .4s;
    -o-transition: all .1s ease-out .4s
}
.home .title .t3{
    background-position: 0 -488px;
    width: 140px;
    height: 190px;  
    left: 342px;
    top: 22px;
    transition: all .1s ease-out .6s;
    -webkit-transition: all .1s ease-out .6s;
    -moz-transition: all .1s ease-out .6s;
    -ms-transition: all .1s ease-out .6s;
    -o-transition: all .1s ease-out .6s
}
.home .title .t4{
    background-position: -182px -488px;
    width: 180px;
    height: 207px;
    left: 470px;
    top: 20px;
    transition: all .1s ease-out .8s;
    -webkit-transition: all .1s ease-out .8s;
    -moz-transition: all .1s ease-out .8s;
    -ms-transition: all .1s ease-out .8s;
    -o-transition: all .1s ease-out .8s
}
.home .title .sybol{
    width: 38px;
    height: 50px;
    background-position: -663px 0;
    right: 0;
    top: 50%;
    margin-top: -25px;
    transition: all .1s ease-out 1.4s;
    -webkit-transition: all .1s ease-out 1.4s;
    -moz-transition: all .1s ease-out 1.4s;
    -ms-transition: all .1s ease-out 1.4s;
    -o-transition: all .1s ease-out 1.4s;
    transform: scale(6,6);
    -webkit-transform: scale(6,6);
    -moz-transform: scale(6,6);
    -ms-transform: scale(6,6);
    -o-transform: scale(6,6);
    opacity: 0;
}
.home .title>div{
    transform: scale(3,3);
    -webkit-transform: scale(3,3);
    -moz-transform: scale(3,3);
    -ms-transform: scale(3,3);
    -o-transform: scale(3,3);
    opacity: 0
}
.home .title.show>div{
    transform: scale(1,1);
    -webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -ms-transform: scale(1,1);
    -o-transform: scale(1,1);
    opacity: 1
}
.home .title.show .sybol {
    transform: scale(1,1);
    -webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -ms-transform: scale(1,1);
    -o-transform: scale(1,1);
    opacity: 1
}
.home .sm-title{
    position: absolute;
    top: 466px;
    width: 474px;
    height: 54px;
    background: url(https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/home-icon.png) -108px 0;
    left: 50%;
    z-index:3; 
    margin-left: -237px;
    animation-delay: .7s;
    -webkit-animation-delay: .7s;
    animation-duration: 2s;
    -moz-animation-duration: 2s;
}
.home .load-text,.load-text-active{
    height: 224px;
    width: 288px;
    overflow: hidden;
    top: 448px;
    position: absolute;
    z-index: 2; 
    left: 50%;
    margin-left: -144px;   
}
.home .load-text-grey>div{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/loadword.png);
    height: 50px;
    width: 288px;   
}
.home .load-text-grey .p1{
    background-position-y: 10px;
    animation-delay: 1s;
    -webkit-animation-delay: 1s;
}
.home .load-text-grey .p2{
    background-position-y: -40px;
    animation-delay: 2.5s;
    -webkit-animation-delay: 2.5s;
}
.home .load-text-grey .p3{
    background-position-y: -90px;
    animation-delay: 3s;
    -webkit-animation-delay: 3s;
}
.home .load-text-grey .p4{
    background-position-y: -140px;
    animation-delay: 4s;
    -webkit-animation-delay: 4s;
}
.home .load-text-active>div{
    height: 50px;
    width: 288px;
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/loadword.png);
    opacity: 0;
    transition: all 1s; 
    background-position-x: -309px;
}
.home .load-text-active .p1{
    background-position-y: 10px;
    animation-delay: .5s;
    -webkit-animation-delay: .5s;
}
.home .load-text-active .p2{
    background-position-y: -40px;
    animation-delay: 1.5s;
    -webkit-animation-delay: 1.5s;
}
.home .load-text-active .p3{
    background-position-y: -90px;
    animation-delay: 2.5s;
    -webkit-animation-delay: 2.5s;
}
.home .load-text-active .p4{
    background-position-y: -140px;
    animation-delay: 3.5s;
    -webkit-animation-delay: 3.5s;
}

.home .tohome-btn{
    width: 156px;
    height: 41px;
    line-height: 41px;
    border: 2px solid #5a4f49;
    position: absolute;
    left: 50%;
    margin-left: -78px;
    color: #cfc3bc;
    text-align: center;
    top: 678px;
    cursor: pointer;
    display:none;
}
.home .tohome-btn:hover{
    border: 2px solid #d1a75d;
    background-color: #d1a75d;
    color: #FFFFFF; 
}
.home .top-ani {
    height: 240px;
    width: 320px;
    left: 50%;
    margin-left: -170px;
    position: absolute;
    top: 170px;
}
.home .top-ani>div{
    background-image: url(https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/loading-top.png);
    height: 100%;
    position: absolute;
    width: 100%;
    transition: all 1s;
    opacity: 0;
}
.home .top-ani .step5{
    background-position: 0 0;
}
.home .top-ani .step4{
    background-position: 0 -270px;
}
.home .top-ani .step3{
    background-position: 0 -530px;
}
.home .top-ani .step2{
    background-position: 0 -760px;
}
.home .top-ani .step1{
    background-position: 0 -990px;
}
.home .loading #precent {
    margin: 0 auto;
    color: #cfc3bc;
    font-size: 28px;
    padding-top: 36px;
    font-family: SimSun;
    display:block;
    width:100%;
    text-align: center;
    top:648px;
    position: absolute;   
}
.video-wrap2{
    display:none; 
}
.home .video-filter{
    position: absolute;
    display:block;
    width:100%;
    height:237px; 
    z-index:1;
    left:0px;
    top:0px;
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/video-filter.png") repeat-x;      
}
/*======content page======*/
.content .inner-page{
    position: absolute;
    display:none;
    width:100%;
    height:100%;
    left:0px;
    top:0px;     
}
.content .inner-page.active{
    display:block;
    z-index:3;  
}
.content .loading{
    position: absolute;
    display:block;
    width:100%; 
    height:100%;
    left:0px;
    top:0px;  
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/loading1-bg.jpg") no-repeat top center;   
}
.content .center{
    position: absolute;
    display:block;
    width:250px;
    height:220px;
    left:50%;
    top:50%;
    margin-left:-125px;
    margin-top:-110px;
    z-index:1;        
}
.content .svg-wrap{
    position: relative;
    display:block;
    width:200px;
    height:200px;
    margin: 0px auto;
    top:-30px;       
}
.content .center p{
    position: absolute;
    display:block;
    width:100%;
    left:0px;
    bottom:44px;
    text-align: center;
    color:#fff;
    font-size:16px;      
}
.content .center span{
    position: absolute;
    display:block;
    width:100%;
    left:0px;
    bottom:10px;
    font-size:14px;
    color:#fff;
    text-align: center;      
}
.content .center i{
    position: absolute;
    display:block;
    left:50%;
    top:50%; 
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat;  
}
.content .center em{
    position: absolute;
    display:block;
    width: 144px;
    height:144px;
    left:50%;
    top:50%;
    margin-left:-72px;
    margin-top:-72px;    
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/rotate-bg.png") no-repeat top center;
    animation: rotateL 8s linear infinite;
    -webkit-animation: rotateL 8s linear infinite;
    -moz-animation: rotateL 8s linear infinite;
    -o-animation: rotateL 8s linear infinite;
    -ms-animation: rotateL 8s linear infinite;   
}
.content .inner-cont{
    position: absolute;
    display:none;
    width:100%;
    height:100%;
    left:0px;
    top:0px;    
}
.inner-cont .inner{
    z-index:3;
    opacity:0; 
    transition:all 1.2s ease-out;
    -webkit-transition:all 1.2s ease-out;
    -moz-transition:all 1.2s ease-out; 
}
.inner-cont .inner.show{
    opacity:1; 
}
.inner-cont .title{
    position: absolute;
    display:block;
    left:40px;
    top:224px;
    z-index:3;
    opacity:0;  
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/scene-title.png") no-repeat;
    transition:all 1.2s ease-out;
    -webkit-transition:all 1.2s ease-out;
    -moz-transition:all 1.2s ease-out;
    transform:translateX(-200px);
    -webkit-transform:translateX(-200px);
    -moz-transform:translateX(-200px);    
}
.inner-cont .title.show{
    opacity:1;
    transform:translateX(0px);
    -webkit-transform:translateX(0px);
    -moz-transform:translateX(0px);  
}
.inner-cont span.btn{
    position: absolute;
    display:block;
    top:230px;
    cursor:pointer;
    z-index:3;
    opacity:0;  
    transition:transform,opacity 1.2s ease-out 0.6s;
    -webkit-transition:-webkit-transform,opacity 1.2s ease-out 0.6s;
    -moz-transition:-moz-transform,opacity 1.2s ease-out 0.6s;
    transform:translateX(-20px);
    -webkit-transform:translateX(-20px);
    -moz-transform:translateX(-20px);  
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat;   
}
.inner-cont span.btn.show{
    opacity:1; 
    transform:translateX(0px);
    -webkit-transform:translateX(0px);
    -moz-transform:translateX(0px);
}
.inner-cont span.view{
    position:absolute;
    display:block;
    cursor: pointer;
    z-index:3; 
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat;  
}
.inner-cont span.view:after{
    position: absolute;
    display:block;
    width:50px;
    height:50px;
    content: "";
    left:50%;
    top:50%;
    margin-left:-26px;
    margin-top:-25px;
    border-radius:50%;        
}
.inner-cont .detail{
    position:absolute;
    display:none;
    width:100%;
    height:100%;
    left:0px;
    top:0px;
    z-index:3;   
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    animation-duration: 0.6s;
  	-webkit-animation-duration: 0.6s;
  	-moz-animation-duration: 0.6s;
  	-o-animation-duration: 0.6s;
    animation-fill-mode: both;   
}
.inner-cont .detail .txt{
    position: absolute;
    display:block;
    left:-50px;
    top:230px;
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/role-title.png") no-repeat;    
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
    animation-duration: 1.2s;
    -webkit-animation-duration: 1.2s;
    -moz-animation-duration: 1.2s;
    -o-animation-duration: 1.2s;
    animation-fill-mode: both;
    animation-delay: .5s;
    -webkit-animation-delay: .5s;
}
.inner-cont .detail .reBtn{
    position: absolute;
    display:block; 
    border:1px solid rgba(255, 255, 255, 0.5);
    width:140px;
    height:40px;
    text-align: center;
    line-height:40px;
    color:#fff;
    cursor:pointer;   
    animation-duration: 1.2s;
    -webkit-animation-duration: 1.2s;
    -moz-animation-duration: 1.2s;
    -o-animation-duration: 1.2s;
    animation-fill-mode: both; 
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
    animation-delay: 1.2s;
    -webkit-animation-delay: 1.2s;   
}
.inner-cont .detail .reBtn:after{
    position: absolute;
    content: "";
    display:block;
    left:40px;
    width:6px;
    height:11px;  
    font-size:20px; 
    top:15px;
    transition:all 0.3s ease-out;
    -webkit-transition:all 0.3s ease-out;
    -moz-transition:all 0.3s ease-out;
    -ms-transition:all 0.3s ease-out;
    -o-transition:all 0.3s ease-out;
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -336px 0px;    
}
.inner-cont .detail .reBtn:hover:after{
    left:30px; 
}
/*庆功殿*/
.loading1 .center i{
    width:99px;
    height:49px;
    margin-left:-50px;
    margin-top:-25px; 
    background-position:0px -214px;      
}
.qgd{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/qgd-bg.jpg") no-repeat top center;
}
.qgd .title{
    width:246px;
    height:328px;
    background-position:0px 0px;  
}
.qgd span.btn{
    width:40px;
    height:130px;
    left:314px; 
    background-position:-125px -82px;   
}
.qgd span.btn:hover{
    background-position:-175px -82px; 
}
.qgd span.view{
    width:80px;
    height:80px;
    background-position:0px -676px;
    right:380px;
    top:346px;
    text-align:center;
    line-height:80px;       
}
.qgd span.view:after{
    border:1px solid rgba(255,245,128,0.85);
    -webkit-animation-name: colorCircle;
    animation-name: colorCircle;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-duration: 4s!important;
    -webkit-animation-duration: 4s!important;
}
.qgd .detail{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/qgd-detail-bg.jpg") no-repeat top center;
}
.qgd .detail .txt{
    width:476px;
    height:440px;  
    background-position:0px 0px; 
}
.qgd .detail .reBtn{
    left:100px; 
    top:690px; 
}
/*幻境沙城*/
.loading2 .center i{
    width:96px;
    height:56px;
    margin-left:-48px;
    margin-top:-28px; 
    background-position:0px -278px;      
}
.hjsc{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjsc-bg.jpg") no-repeat top center;
}
.hjsc .title{
    width:226px;
    height:375px;
    background-position:0px -376px;  
}
.hjsc span.btn1{
    width:40px;
    height:130px;
    left:288px; 
    background-position:-224px -82px;   
}
.hjsc span.btn2{
    width:40px;
    height:130px;
    left:288px;
    top:390px;  
    background-position:-316px -82px;   
}
.hjsc span.btn1:hover{
    background-position:-270px -82px; 
}
.hjsc span.btn2:hover{
    background-position:-363px -82px; 
}
.hjsc span.view{
    width:104px;
    height:104px;
    background-position:-123px -664px;
    right:20%;
    top:20%;
    text-align:center;
    line-height:80px;       
}
.hjsc span.view:after{
    border:1px solid rgba(255,77,3,0.95);
    -webkit-animation-name: colorCircle;
    animation-name: colorCircle;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-duration: 4s!important;
    -webkit-animation-duration: 4s!important;
    margin-left: -25px;
    margin-top: -26px;
}
.hjsc span.view1{
    left:320px;
    top:362px;  
}
.hjsc span.view2{
    right:300px;
    top:154px;  
}
.hjsc .detail1{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjsc-detail1-bg.jpg?v=20170628") no-repeat top center;
}
.hjsc .detail2{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjsc-detail2-bg.jpg?v=20170628") no-repeat top center;
}
.hjsc .detail1 .txt{
    width:471px;
    height:476px;  
    background-position:0px -484px; 
}
.hjsc .detail2 .txt{
    width:479px;
    height:445px;  
    background-position:0px -1034px; 
}
.hjsc .detail1 .reBtn{
    left:110px; 
    top:725px; 
}
.hjsc .detail2 .reBtn{
    left:110px; 
    top:696px; 
}
/*幻境禁地*/
.loading4 .center i{
    width:101px;
    height:62px;
    margin-left:-50px;
    margin-top:-31px; 
    background-position:0px -470px;      
}
.hjjd{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjjd-bg.jpg") no-repeat top center;
}
.hjjd .title{
    width:222px;
    height:370px;
    background-position:-336px 0px;  
}
.hjjd span.btn1{
    width:40px;
    height:130px;
    left:288px; 
    background-position:-414px -82px;   
}
.hjjd span.btn2{
    width:40px;
    height:130px;
    left:288px;
    top:390px;  
    background-position:-125px -239px;   
}
.hjjd span.btn1:hover{
    background-position:-463px -82px; 
}
.hjjd span.btn2:hover{
    background-position:-175px -238px; 
}
.hjjd span.view{
    width:104px;
    height:104px;
    background-position:-244px -664px;
    right:20%;
    top:20%;
    text-align:center;
    line-height:80px;       
}
.hjjd span.view:after{
    border:1px solid rgba(34,198,223,0.95);
    -webkit-animation-name: colorCircle;
    animation-name: colorCircle;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-duration: 4s!important;
    -webkit-animation-duration: 4s!important;
}
.hjjd span.view1{
    left:232px;
    top:374px;  
}
.hjjd span.view2{
    right:136px;
    top:302px;  
}
.hjjd .detail1{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjjd-detail1-bg.jpg") no-repeat top center;
}
.hjjd .detail2{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjjd-detail2-bg.jpg?v=20170628") no-repeat top center;
}
.hjjd .detail1 .txt{
    width:474px;
    height:512px;
    top:180px;   
    background-position:0px -1549px; 
}
.hjjd .detail2 .txt{
    width:468px;
    height:506px;
    top:170px;   
    background-position:-733px 0px; 
}
.hjjd .detail1 .reBtn{
    left:110px; 
    top:650px; 
}
.hjjd .detail2 .reBtn{
    left:110px; 
    top:696px; 
}
/*幻境  灵犀仙岛*/
.loading5 .center i{
    width:87px;
    height:64px;
    margin-left:-44px;
    margin-top:-32px; 
    background-position:0px -559px;      
}
.lxxd{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjxd-bg.jpg") no-repeat top center;
}
.lxxd .title{
    width:206px;
    height:484px;
    background-position:-336px -464px;  
}
.lxxd span.btn1{
    width:40px;
    height:130px;
    left:262px; 
    background-position:-224px -238px;   
}
.lxxd span.btn2{
    width:40px;
    height:130px;
    left:262px;
    top:390px;  
    background-position:-316px -238px;   
}
.lxxd span.btn1:hover{
    background-position:-270px -238px; 
}
.lxxd span.btn2:hover{
    background-position:-363px -238px; 
}
.lxxd span.view{
    width:104px;
    height:104px;
    background-position:-342px -664px;
    right:20%;
    top:20%;
    text-align:center;
    line-height:80px;       
}
.lxxd span.view:after{
    border:1px solid rgba(110,249,0,0.95);
    -webkit-animation-name: colorCircle;
    animation-name: colorCircle;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-duration: 4s!important;
    -webkit-animation-duration: 4s!important;
}
.lxxd span.view1{
    left:200px;
    top:146px;  
}
.lxxd span.view2{
    right:316px;
    top:240px;  
}
.lxxd .detail1{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/lxxd-detail1-bg.jpg") no-repeat top center;
}
.lxxd .detail2{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/lxxd-detail2-bg.jpg") no-repeat top center;
}
.lxxd .detail1 .txt{
    width:474px;
    height:504px;
    top:180px;   
    background-position:-727px -565px; 
}
.lxxd .detail2 .txt{
    width:496px;
    height:560px;
    top:170px;   
    background-position:-705px -1111px; 
}
.lxxd .detail1 .reBtn{
    left:110px; 
    top:700px; 

}
.lxxd .detail2 .reBtn{
    left:110px; 
    top:750px; 
}
/*幻境  神威狱*/
.loading3 .center i{
    width:96px;
    height:60px;
    margin-left:-48px;
    margin-top:-30px; 
    background-position:0px -384px;      
}
.swy{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/swy-bg.jpg") no-repeat top center;
}
.swy .title{
    width:210px;
    height:448px;
    background-position:0px -830px;  
}
.swy span.btn1{
    width:40px;
    height:130px;
    left:264px; 
    background-position:-414px -238px;   
}
.swy span.btn1:hover{
    background-position:-463px -238px; 
}
.swy span.view{
    width:104px;
    height:104px;
    background-position:-451px -675px;
    text-align:center;
    line-height:80px;       
}
.swy span.view:after{
    border:1px solid rgba(246,71,2,0.95);
    -webkit-animation-name: colorCircle;
    animation-name: colorCircle;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-duration: 4s!important;
    -webkit-animation-duration: 4s!important;
}
.swy span.view1{
    left:476px;
    top:192px;  
}
.swy .detail1{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/swy-detail1-bg.jpg") no-repeat top center;
}
.swy .detail1 .txt{
    width:478px;
    height:590px;
    top:150px;   
    background-position:-1243px 0px; 
}
.swy .detail1 .reBtn{
    left:110px; 
    top:760px; 
}
/*幻境 中州*/
.loading0 .center i{
    width:98px;
    height:58px;
    margin-left:-49px;
    margin-top:-29px; 
    background-position:0px -124px;      
}
.hjzz{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjzz-bg.jpg") no-repeat top center;
}
.hjzz .title{
    width:226px;
    height:494px;
    top:214px; 
    background-position:-634px 0px;  
}
.hjzz span.btn1{
    width:40px;
    height:130px;
    left:280px; 
    background-position:-515px -82px;   
}
.hjzz span.btn2{
    width:40px;
    height:130px;
    left:280px;
    top:390px;  
    background-position:-560px -82px;   
}
.hjzz span.btn1:hover{
    background-position:-515px -238px; 
}
.hjzz span.btn2:hover{
    background-position:-560px -238px; 
}
.hjzz span.view{
    width:104px;
    height:104px;
    background-position:12px -758px;
    right:20%;
    top:20%;
    text-align:center;
    line-height:80px;       
}
.hjzz span.view:after{
    border:1px solid rgba(247,240,19,0.95);
    -webkit-animation-name: colorCircle;
    animation-name: colorCircle;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-duration: 4s!important;
    -webkit-animation-duration: 4s!important;
}
.hjzz span.view1{
    left:220px;
    top:360px;  
}
.hjzz span.view2{
    right:500px;
    top:510px;  
}
.hjzz span.door{
    position: absolute;
    cursor:pointer;
    width:80px;
    height:120px;
}
.hjzz span.door1{
    position: absolute;
    width:82px;
    height:80px;
    right:220px;
    top:470px;    
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -131px -770px;   
}
.hjzz span.door2{
    left:126px;
    top:256px;  
}
.hjzz span.door3{
    left:74px;
    top:607px;  
}
.hjzz span.door4{
    right:132px;
    top:102px;  
}
.hjzz span.door5{
    right:236px;
    top:595px;  
}
.hjzz .detail1{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjzz-detail1-bg.jpg") no-repeat top center;
}
.hjzz .detail2{
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/hjzz-detail2-bg.jpg?v=20170628") no-repeat top center;
}
.hjzz .detail1 .txt{
    width:474px;
    height:445px;
    top:180px;   
    background-position:-1248px -623px; 
}
.hjzz .detail2 .txt{
    width:476px;
    height:476px;
    top:170px;   
    background-position:-1247px -1111px; 
}
.hjzz .detail1 .reBtn{
    left:110px; 
    top:650px; 
}
.hjzz .detail2 .reBtn{
    left:110px; 
    top:680px; 
}
/*导航地图*/
.nav-map{
    position: absolute;
    display:block;
    width:100%;
    height:100%;
    left:0px;
    top:0px;
    z-index:0;
    opacity:0; 
    transition:all 0.8s ease-out;
    -webkit-transition:all 0.8s ease-out;
    -moz-transition:all 0.8s ease-out;
    display:block;  
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/nav-map-bg.jpg") no-repeat top center;      
}
.nav-map.show{
    z-index:6; 
    opacity:1;  
}
.nav-map .item{
    position: absolute;
    width:50px;
    height:50px;
    color:rgba(255, 255, 255,1);
    cursor:pointer;
    transition:all 0.4s ease-out;
    -webkit-transition:all 0.4s ease-out;
    -moz-transition:all 0.4s ease-out;      
}
.nav-map .item:hover,.nav-map .item.current{
    color:#ffc435; 
}
.nav-map .item i{
    position: absolute;
    opacity:0.55; 
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat; 
}
.nav-map .item h3{
    position: absolute;
    width:70px;
    height:80px; 
    text-align: center; 
}
.nav-map .item span{
    position: absolute;
    width:80px;
    height:30px;
    color:#ffc435;
    text-align: center;
    line-height:30px;  
    border:1px solid #ffc435;
    opacity:0;
    transition:all 0.4s ease-out;
    -webkit-transition:all 0.4s ease-out;
    -moz-transition:all 0.4s ease-out;       
}
.nav-map .item:hover span{
    opacity:1;  
}
.nav-map .item b{
    position:absolute;
    width:10px;
    height:10px;
    left:50%;
    top:50%;
    margin-left:-5px;
    margin-top:-5px;
    border-radius:50%;     
    border:1px solid #d0d1ce;  
}
.nav-map .item:hover b,
.nav-map .item.current b{
    border:none;
    width:22px;
    height:22px;
    margin-left:-11px;
    margin-top:-11px;     
    background-color:rgba(205,179,116, 0.25); 
}
.nav-map .item b:after{
    position:absolute;
    display:block;
    content:"";
    width:6px;
    height:6px;
    background-color:#d0d1ce;
    left:50%;
    top:50%;
    margin-left:-3px;
    margin-top:-3px;
    border-radius:50%;          
}
.nav-map .item:hover b:after,
.nav-map .item.current b:after{
    width:12px;
    height:12px;
    margin-left:-6px;
    margin-top:-6px;
    background-color:#ffc435;     
}
.nav-map .item.current span{
    opacity:0; 
}
.nav-map .item1{
    left:-21px;
    top:354px;  
}
.nav-map .item1 i{
    width:125px;
    height:75px;
    right:-120px;
    top:-25px;   
    background-position:0px -881px;   
}
.nav-map .item1:hover i,
.nav-map .item1.current i{
    background-position:0px -967px; 
}
.nav-map .item1 h3{
    left:-60px;
    top:18px;  
}
.nav-map .item1 span{
    left:-68px;
    bottom:-26px;  
}
.nav-map .item2{
    left:260px;
    top:287px;  
}
.nav-map .item2 i{
    width:130px;
    height:65px;
    right:-44px;
    top:-58px;   
    background-position:-152px -881px;   
}
.nav-map .item2:hover i,
.nav-map .item2.current i{
    background-position:-152px -967px; 
}
.nav-map .item2 h3{
    left:-8px;
    top:40px;  
}
.nav-map .item2 span{
    left:-16px;
    bottom:-48px;  
}
.nav-map .item3{
    left:310px;
    top:620px;  
}
.nav-map .item3 i{
    width:125px;
    height:73px;
    right:-48px;
    top:-72px;   
    background-position:-296px -881px;   
}
.nav-map .item3:hover i,
.nav-map .item3.current i{
    background-position:-296px -967px; 
}
.nav-map .item3 h3{
    left:-8px;
    top:40px;  
}
.nav-map .item3 span{
    left:-16px;
    bottom:-48px;  
}
.nav-map .item4{
    right:263px;
    top:572px;  
}
.nav-map .item4 i{
    width:109px;
    height:68px;
    right:-28px;
    top:40px;   
    background-position:-431px -881px;   
}
.nav-map .item4:hover i,
.nav-map .item4.current i{
    background-position:-431px -967px; 
}
.nav-map .item4 h3{
    left:-8px;
    top:-6px;  
}
.nav-map .item4 span{
    left:-16px;
    bottom:70px;  
}
.nav-map .item5{
    right:72px;
    top:394px;  
}
.nav-map .item5 i{
    width:130px;
    height:80px;
    right:38px;
    top:-16px;   
    background-position:-560px -881px;   
}
.nav-map .item5:hover i,
.nav-map .item5.current i{
    background-position:-560px -967px; 
}
.nav-map .item5 h3{
    left:40px;
    top:18px;  
}
.nav-map .item5 span{
    left:36px;
    bottom:-34px;  
}
.nav-map .item6{
    right:310px;
    top:248px;  
}
.nav-map .item6 i{
    width:104px;
    height:78px;
    right:-28px;
    top:-68px;   
    background-position:-709px -881px;   
}
.nav-map .item6:hover i,
.nav-map .item6.current i{
    background-position:-709px -967px; 
}
.nav-map .item6 h3{
    left:-8px;
    top:40px;  
}
.nav-map .item6 span{
    left:-14px;
    bottom:-52px;  
}
/*旋转轮盘*/
.circle-wrap{
    position: absolute;
    width:295px;
    height:295px;
    z-index:7;
    right:-400px;
    top:50%;
    opacity:0; 
    margin-top:-147px;
    transition:all 0.6s ease-out;
    -webkit-transition:all 0.6s ease-out;
    -moz-transition:all 0.6s ease-out;       
}
.circle-wrap.show{
    right:-160px;
    opacity:1;  
}
.circle-wrap .circle{
    position: absolute;
    display:block;
    width:100%;
    height:100%;
    left:0px;
    top:0px;
    z-index:1;
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/nav-circle-bg.png") no-repeat top center;      
}
.circle-wrap .circle span{
    position: absolute;
    width:18px;
    height:18px;
    cursor: pointer;
    color:#fff;    
}
.circle-wrap .circle i{
    position: absolute;
    font-style: normal;
    width:72px;
    height:36px;
    text-align:center;
    line-height:36px;   
}
.circle-wrap .circle .sp1{
    left:36px;
    top:36px;  
}
.circle-wrap .circle .sp1 i{
    left:-66px;
    top:-8px;  
}
.circle-wrap .circle .sp2{
    left:-6px;
    top:138px;
    cursor: default;
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -838px 0px;    
}
.circle-wrap .circle .sp2 i{   
    left: -78px;
    top:-8px;
    font-size:16px;
    color:#cdb374;
    font-weight:bold;      
}
.circle-wrap .circle .sp3{
    left:36px;
    bottom:36px;  
}
.circle-wrap .circle .sp3 i{
    left:-66px;
    top:-8px;  
}
.circle-wrap .mapbtn{
    position:absolute;
    display:block;
    width:50px;
    height:38px;
    top:50%;
    z-index:2; 
    margin-top:-19px;
    left:70px;
    cursor:pointer;    
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -773px -2px;     
}
.circle-wrap .mapbtn i{
    position:absolute;
    display:block; 
    width:22px;
    height:32px;
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -709px -2px;
    left:15px;
    top:-18px;     
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;   
	animation-fill-mode: both;
	animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-duration: 1s;
	-webkit-animation-duration: 1s;
	-moz-animation-duration: 1s;
	-o-animation-duration: 1s;
}
.circle-wrap .mapbtn:hover i{
	-webkit-animation-name: bounce;
    animation-name: bounce;
}
/*关闭导航圆盘*/
.close-circle{
    position: absolute;
    display: block;
    z-index:7;
    width:70px;
    height:140px;
    right:-80px;
    top:50%;
    opacity:0; 
    margin-top:-70px;
    cursor:pointer;    
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -709px -83px;
    transition:all 0.6s ease-out;
    -webkit-transition:all 0.6s ease-out;
    -moz-transition:all 0.6s ease-out;    
}
.close-circle.show{
    right:0px;
    opacity:1;  
}
.close-circle span{
    position: absolute;
    display:block;
    width:25px;
    height:25px;
    left:30px;
    top:50%;
    margin-top:-13px;
    transition:all 0.4s ease-out;
    -webkit-transition:all 0.4s ease-out;
    -moz-transition:all 0.4s ease-out; 
    background: url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/icon.png") no-repeat -376px -4px;     
}
.close-circle:hover span{
    transform:rotate(180deg);
    -webkit-transform:rotate(180deg);
    -moz-transform:rotate(180deg);
}


.masky {
    -webkit-mask: url(https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/mask.png);
    -webkit-mask-size: 2500% 100%;
}
.active.masky {
    -webkit-mask-position: 0 0;
    -webkit-animation: maskIn .8s steps(24) forwards;
}
#fixed-bottom.start .line{
	bottom: 80px;
}
#fixed-bottom.start .arrow{
    bottom:-40px; 
}
.scrollNav{
    position:absolute;
    display: block;
    width:120px;
    left:70px;
    opacity:0; 
    top:50%;
    z-index:8; 
    margin-top:-110px;
    transition:all 1s ease-out 0.2s;
    -webkit-transition:all 1s ease-out 0.2s;
    -moz-transition:all 1s ease-out 0.2s;
    -o-transition:all 1s ease-out 0.2s;
    -ms-transition:all 1s ease-out 0.2s;     
}
.scrollNav.show{
    opacity:1;  
}
.scrollNav li{
    height:16px;
    cursor: pointer;
    margin:30px 0px; 
    position: relative; 
}
.scrollNav li span{
    position:absolute;
    display:none; 
    right:8px;
    top:0px;
    color:#fff; 
    line-height:16px;   
}
.scrollNav li.current span,.scrollNav li:hover span{
    display: block;
}
.scrollNav li i{
    position: absolute;
    display:none;
    width:16px;
    height:16px;
    border:1px solid #fff;
    border-radius:50%;    
}
.scrollNav li.current i,.scrollNav li:hover i{
    display:block;.
}
.scrollNav li em{
    position: absolute;
    display:block;
    width:6px;
    height:6px;
    left:6px;
    top:6px;  
    background-color:#fff;
    border-radius:50%;     
}
.scrollNav li.current em,.scrollNav li:hover em{
    width:6px;
    height:6px;
    left:6px;
    top:6px;    
}
.scrollNav li:after{
    position: absolute;
    content:"";
    display:block;
    width:0px;
    height:1px;
    background-color:#fff;
    left:18px;
    top:9px;
    opacity:0;       
}
.scrollNav li.current:after,
.scrollNav li:hover:after{
    width:36px;
    opacity:1;  
}
/*加入*/
#join-bottom{
    position: fixed;
    display:block;
    background:url("https://static.web.sdo.com/woool/pic/woool_act/20170622_MoYanZhongZhou/join-bottom.png?v=12") no-repeat;
    width:199px;
    height:199px;
    z-index:19;
    bottom:0px;
    right:-200px;
    cursor:pointer;
    opacity:0; 
    transition:all 1s ease-out 0.2s;
    -webkit-transition:all 1s ease-out 0.2s;
    -moz-transition:all 1s ease-out 0.2s;
    -o-transition:all 1s ease-out 0.2s;
    -ms-transition:all 1s ease-out 0.2s;       
}
#join-bottom.show{
    right:0px;
    opacity:1;  
}
/*pop*/
.pop {
    display: none
}
.pop .mask {
    position: fixed;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 9;
    background: url(https://static.web.sdo.com//woool/pic/woool_act/20170615_zhongzhou/pop-bg.png?v=3) repeat;
    background: rgba(0,0,0,.75)
}
.pop .content {
    position: fixed;
    display: block;
    z-index: 99;
    left: 50%;
    top: 50%
}
.pop .close {
    position: absolute;
    display: block;
    width: 38px;
    height: 38px;
    right: -42px;
    top: 0;
    cursor: pointer;
    background: url(https://static.web.sdo.com//woool/pic/woool_act/20170615_zhongzhou/icon.png?v=3) no-repeat -280px 0;
    transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out
}
.pop .close:hover {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg)
}
#joinPop .content {
    background: url(https://static.web.sdo.com//woool/pic/woool_act/20170615_zhongzhou/join1-bg.png?v=3) no-repeat top center;
    width: 540px;
    height: 430px;
    margin-left: -270px;
    margin-top: -215px
}
#joinPop input[type=text] {
    position: absolute;
    display: block;
    width: 338px;
    height: 42px;
    text-indent: 12px;
    line-height: 42px;
    left: 100px;
    border: 1px solid #4b423d;
    background: #1b1411;
    color: #cfc3bc
}
#joinPop #telTxt {
    bottom: 195px
}
#joinPop #codeTxt {
    bottom: 138px;
    width: 240px
}
#joinPop #valiImg {
    position: absolute;
    right: 102px;
    bottom: 138px;
    cursor: pointer;
    height: 42px
}
#joinPop .btn {
    position: absolute;
    display: block;
    width: 340px;
    height: 60px;
    left: 100px;
    bottom: 55px;
    cursor: pointer;
    background: url(https://static.web.sdo.com//woool/pic/woool_act/20170615_zhongzhou/icon.png?v=3) no-repeat 0 -1383px
}
#joinPop .btn:hover {
    background-position: 0 -1481px
}
::-moz-placeholder {
    color: #5f4c43
}
::-webkit-input-placeholder {
    color: #5f4c43
}
:-ms-input-placeholder {
    color: #5f4c43
}
#successPop .content {
    background: url(https://static.web.sdo.com//woool/pic/woool_act/20170615_zhongzhou/join2-bg.png?v=3) no-repeat top center;
    width: 540px;
    height: 280px;
    margin-left: -270px;
    margin-top: -140px
}
#successPop p {
    position: absolute;
    display: block;
    width: 100%;
    left: 0;
    bottom: 60px;
    line-height: 1.8;
    text-align: center;
    color: #cfc3bc
}