* {
     margin: 0;
     padding: 0;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
 }
 
 html,
 body {
     height: 100%;
     overflow: hidden;
     font-family: 'Microsoft YaHei', sans-serif;
 }
 
 .loading {
     position: fixed;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     background-color: #fff;
     color: #000;
     text-align: center;
     z-index: 100;
 }
 
 .loading .load-box {
     width: 10%;
     font-size: 12px;
     color: #b3965d;
     position: absolute;
     left: 45%;
     top: 50%;
     transform: translateY(-70%);
 }
 
 .loading .lt {
     margin-top: 10px;
 }
 
 .wrap {
     width: 100%;
     height: 100%;
     overflow: hidden;
 }
 
 .screen {
     width: 100%;
     height: 100%;
     overflow: hidden;
     -webkit-backface-visibility: hidden;
     -webkit-perspective: 1000;
     position: relative;
 }
 
 img {
     display: block;
     width: 100%;
 }
 
 .bg-layer {
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     z-index: 0;
 }
 
 .show-bg {
     background: url(../img/home-bg.jpg) 50% 50% no-repeat;
     background-size: cover;
     -webkit-animation: zoombg 10s linear infinite;
     animation: zoombg 10s linear infinite;
 }
 
 @keyframes zoombg {
     0% {
         transform: scale(1);
     }
     50% {
         transform: scale(1.2);
     }
     100% {
         transform: scale(1);
     }
 }
 
 @-webkit-keyframes zoombg {
     0% {
         -webkit-transform: scale(1);
     }
     50% {
         -webkit-transform: scale(1.2);
     }
     100% {
         -webkit-transform: scale(1);
     }
 }
 
 .screen .mod {
     position: absolute;
     z-index: 10;
 }
 
 .screen .logo {
     width: 17.3%;
     left: 41.5%;
     top: 3%;
 }
 
 .screen .huati {
     width: 78.6%;
     left: 11%;
     top: 62%;
     -webkit-transform: translateY(-50%);
     transform: translateY(-50%);
 }
 
 .screen .copy {
     width: 59.3%;
     left: 20%;
     bottom: 8%;
 }
 
 .screen .arrow {
     width: 5%;
     left: 47.5%;
     bottom: 3%;
     -webkit-animation: arrowani 1s linear infinite;
     animation: arrowani 1s linear infinite;
 }
 
 @keyframes arrowani {
     0% {
         transform: translateY(0)
     }
     50% {
         transform: translateY(40%)
     }
     100% {
         transform: translateY(0)
     }
 }
 
 @-webkit-keyframes arrowani {
     0% {
         -webkit-transform: translateY(0)
     }
     50% {
         -webkit-transform: translateY(40%)
     }
     100% {
         -webkit-transform: translateY(0)
     }
 }
 
 .screen2 {}
 
 .liuwen {
     width: 23.06%;
     top: 50%;
     left: 6%;
 }
 
 .cuishiyuan {
     width: 24%;
     top: 50%;
     right: 4%;
 }
 
 .liuwentext {
     left: 26%;
     top: 12%;
     color: #b3965d;
     font-size: 13px;
     font-weight: bold;
 }
 
 .cuishiyuantext {
     top: 21%;
     color: #b3965d;
     font-size: 13px;
     left: 34%;
     font-weight: bold;
 }
 
 .liuwentext b,
 .cuishiyuantext b {
     opacity: 0;
     font-weight: normal;
 }
 
 .screen2 .con {
     width: 43.6%;
     margin: 55% auto 0;
     position: relative;
     z-index: 10;
 }
 
 .screen2 .con .link {
     width: 93.27%;
     margin: 9% auto 0;
     display: block;
 }
 
 .screen2 .con .show-qrcode {
     width: 87%;
     margin: 0% auto 0;
     display: block;
     padding: 10%;
 }
 
 .screen2 .video {
     width: 100%;
     left: 0;
     bottom: 0;
 }
 
 .qrcode-guide {
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     background-color: rgba(0, 0, 0, 0.8);
     display: none;
 }
 
 .qrcode-guide .close {
     right: 2%;
     top: 2%;
     width: 5%;
 }
 
 .qrcode-guide .qrcode-box {
     width: 41%;
     left: 30%;
     top: 45%;
     transform: translateY(-70%);
     -webkit-transform: translateY(-70%);
 }
 
 .qrcode-guide .qrcode-box .qrcode {
     width: 98%;
     margin: 0 auto 10%;
 }
 
 .dl {
     position: absolute;
     width: 8.8%;
     left: 0;
     top: 0;
     opacity: 0.7;
     z-index: 0;
     -webkit-transform-origin: 50% 0;
     -webkit-animation: dlani 0.8s linear infinite alternate;
 }
 
 .dl1 {
     left: 10%;
 }
 
 .dl2 {
     width: 6.2%;
     top: 31%;
     left: 62%;
 }
 
 .dl3 {
     width: 8%;
     top: 42%;
     left: 12%;
 }
 
 .dl4 {
     width: 8%;
     top: 64%;
     left: 82%;
 }
 
 .qian {
     position: absolute;
     width: 8%;
     z-index: 0;
     -webkit-animation: xz 2s infinite linear;
     animation: xz 2s infinite linear;
 }
 
 .qian1 {
     width: 7%;
     top: 2%;
     left: 75%;
 }
 
 .qian2 {
     width: 7%;
     top: 22%;
     left: -4%;
 }
 
 .qian3 {
     width: 8%;
     top: 52%;
     left: 88%;
 }
 
 .qian4 {
     width: 8%;
     top: 78%;
     left: 18%;
 }
 
 .ling {
     position: absolute;
     width: 3%;
     z-index: 0;
     -webkit-animation: op 0.8s linear infinite alternate;
 }
 
 .ling1 {
     left: 70%;
     top: 1%;
 }
 
 .ling2 {
     left: 10%;
     top: 60%;
 }
 
 .ling3 {
     left: 6%;
     top: 75%;
 }
 
 @-webkit-keyframes dlani {
     0% {
         -webkit-transform: rotate(10deg);
     }
     100% {
         -webkit-transform: rotate(-10deg);
     }
 }
 
 @-webkit-keyframes op {
     0% {
         opacity: 0.3;
         -webkit-transform: scale(1);
     }
     100% {
         opacity: 1;
         -webkit-transform: scale(1.1);
     }
 }
 
 @media screen and (min-aspect-ratio: 360/525) {
     .screen2 .con {
         width: 40%;
     }
 }

 @media screen and (min-aspect-ratio: 480/649) {
     .screen2 .con {
         width: 35%;
     }
 }

 @media screen and (min-aspect-ratio: 480/650) {
     .screen2 .con {
         width: 35%;
     }
 }


 
 @media screen and (max-width: 320px) {
     .cuishiyuantext {
         left: 27%;
     }
 }
 
 @media screen and (max-height: 470px) {
     .screen .logo {
         width: 15%;
     }
     .screen2 .con {
         width: 38%;
         margin-top: 45%;
     }
     .liuwen {
         top: 53%;
     }
     .cuishiyuan {
         top: 55%;
     }
     .cuishiyuantext {
         margin-top: 3%
     }
 }
 
 .pf {
     position: absolute;
     z-index: 0;
     top: 0;
     left: 0;
     opacity: 0.7;
 }
 
 .pf1 {
     width: 5%;
          -webkit-animation: xz 2.8s infinite linear;
     animation: xz 2.8s infinite linear;

 }
 
 .pf2 {
     width: 7%;
          -webkit-animation: xz 2.8s infinite linear;
     animation: xz 2.8s infinite linear;

 }
 
 .pf3 {
     width: 3.7%;
     -webkit-animation: xz 2s infinite linear;
     animation: xz 2s infinite linear;
 }
 
 .pf4 {
     width: 5%;
     -webkit-animation: xz 2.5s infinite linear;
     animation: xz 2.5s infinite linear;
 }
 
 .pf5 {
     width: 8%;
     -webkit-animation: xz 2s infinite linear;
     animation: xz 2s infinite linear;
 }
 
 .pf6 {
     width: 6%;
     -webkit-animation: xz 2.5s infinite linear;
     animation: xz 2.5s infinite linear;
 }
 
 .pf7 {
     width: 3%;
     -webkit-animation: xz 2.5s infinite linear;
     animation: xz 2.5s infinite linear;
 }
 
 .pf8 {
     width: 4%;
     -webkit-animation: xz 2.5s infinite linear;
     animation: xz 2.5s infinite linear;
 }
 
 .pf9 {
     width: 7%;
     -webkit-animation: xz 2.5s infinite linear;
     animation: xz 2.5s infinite linear;
 }
 
 .pf10 {
     width: 7%;
     -webkit-animation: xz 2s infinite linear;
     animation: xz 2s infinite linear;
 }
 
 .pf11 {
     width: 5%;
     -webkit-animation: xz 2.5s infinite linear;
     animation: xz 2.5s infinite linear;
 }
 
 .pf12 {
     width: 5%;
     -webkit-animation: xz 2s infinite linear;
     animation: xz 2s infinite linear;
 }
 
 @-webkit-keyframes xz {
     100% {
         -webkit-transform: rotate(-360deg);
     }
 }
 
 @keyframes xz {
     100% {
         transform: rotate(-360deg);
     }
 }
 
 .fudong {
     animation: 1s linear 0s none infinite alternate fudong;
 }
 
 @keyframes fudong {
     from {
         transform: translate3d(0, 0, 0);
         opacity: 1;
     }
     to {
         transform: translate3d(0, 7px, 0);
         opacity: .8;
     }
 }
 
 .fudong {
     -webkit-animation: 1s linear 0s none infinite alternate fudong;
 }
 
 @-webkit-keyframes fudong {
     from {
         -webkit-transform: translate3d(0, 0, 0);
         opacity: 1;
     }
     to {
         -webkit-transform: translate3d(0, 7px, 0);
         opacity: .8;
     }
 }