body,html { margin:0; padding:0; font-size:14px; font-family:"Microsoft YaHei";  background:#000; color:#5d5649; }
ul, li, p, strong, h3, table, form, tr, td, ol, dl, dd, dt, map, area,h1,h3,h2,h4,h5,h6 { margin:0; padding:0; list-style:none; }
img { border:0; vertical-align:top; }
a { text-decoration:none; outline:none; color:#fff; *hide-focus:expression(this.hideFocus=true);}
.clr{ display:block; height:0; overflow:hidden; clear:both;}
.clr5{ display:block; height:0; overflow:hidden; clear:both; height:4px; }
.head li { float:left; }
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}

.ov99{ overflow:hidden; text-indent:-9999px; }
.cent{ text-align:center; }
.rigt{ text-align:right; }
.p2em{ text-indent:2em; }
.r{ float:right; }
.l{ float:left; }
.c:before , .c:after { content: ""; display: table; }
.c:after { clear: both; }
.hl:hover {
  -weblit-filter: brightness(1.2);
  filter: brightness(1.2);
  -webkit-transition: .3s;
  transition: .3s;
}
/* h1{ overflow:hidden; display:none; } */
::-webkit-scrollbar {
  width: 6px;
  background-color: #f5f5f5;
}
::-webkit-scrollbar-thumb {
  background-color: #999;
}



html{
  overflow-x: hidden;
}
body {
  width: 100%;
  font-family: "Microsoft YaHei", Helvetica, sans-serif;
  color: #434343;
  line-height: 1.5;
  background-color: #fff;
  overflow-x: hidden;
}
/* .bgs {
  position: absolute;
  width: 1920px;
  height: 2150px;
  top: 0;
  left: 50%;
  margin-left: -960px;
  background: url(../img/bg-pc.jpg) center;
} */
.mb {
  display: none;
}
.main {
  /* position: absolute;
  top: 0;
  left: 50%;
  margin-left: -960px; */
  margin: 0 auto;
  width: 100%;
  height: 2770px;
  max-width: 1920px;
  min-width: 1080px;
  overflow-y: hidden;
  background: url(../img/bg-pc.jpg) center top;
}
/* header */
.header {
  width: 100%;
  max-width: 1920px;  
}
.logo {
  display: inline-block;
  margin: 100px 0 0 29px;
  width: 194px;
  height: 87px;
  background: url(../img/logo.png) no-repeat;
}
.towebsite {
  float: right;
  margin: 100px 21px 0 0;
  width: 118px;
  height: 35px;
  background: url(../img/btn-tosite.png) no-repeat;
}
/* main */
.box {
  position: relative;
  margin: 0 auto;
  width: 1200px;
}
.person {
  opacity: 0;
  position: absolute;
  right: -93px;
  top: 0;
  width: 800px;
  height: 1094px;
  background: url(../img/person.png) no-repeat;
  pointer-events: none;
  -webkit-animation: fadeInUp .3s .5s forwards;
  -ms-animation: fadeInUp .3s .5s forwards;
  animation: fadeInUp .3s .5s forwards;
}
.slogan {
  display: inline-block;
  margin: -18px 0 0 48px;
  width: 610px;
  height: 740px;
  background: url(../img/slogan.png) no-repeat;
  -webkit-animation: fadeInLeft .5s forwards;
  -ms-animation: fadeInLeft .5s forwards;
  animation: fadeInLeft .5s forwards;
}
.icon-yy {
  display: block;
  margin: 400px 0 0 140px;
  width: 254px;
  height: 79px;
  background: url(../img/btn-yy.png) no-repeat;
  cursor: pointer;
  -webkit-animation: hl 1s 1s infinite alternate;
  -ms-animation: hl 1s 1s infinite alternate;
  animation: hl 1s 1s infinite alternate;
}
.video {
  position: relative;
  margin-top: 20px;
  margin-left: 34px;
  width: 463px;
  height: 265px;
  background: url(../img/video-box.png) center top no-repeat;
}
.video-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 91px;
  height: 86px;
  background: url(../img/btn-video.png) no-repeat;
  cursor: pointer;
  transition: .5s;
}
.video-btn:hover {
  opacity: .7;
}

.rule-box {
  margin: 270px auto 0 auto;
  position: relative;
  width: 1126px;
  height: 507px;
  background: url(../img/rule-box-bg.png) no-repeat;
  padding: 120px 40px 40px 50px;
  box-sizing: border-box;
}
.rule-box li {
  margin-bottom: 30px;
  color: #fffefe;
  font-size: 18px;
  line-height: 36px;
  display: flex;
}
.rule-box li i {
  flex-shrink: 0;
  display: block;
  margin-right: 8px;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 32px;
  text-align: center;
  color: #000;
  font-style: normal;
  background-color: #fff140;
}
.rule-box li a {
  color: #afdc6d;
}
.rule-box li a.mb {
  display: none;
}
.rule-box li em {
  color: #75d0ff;
  font-weight: bold;
  font-style: normal;
}
.rule-box li img {
  margin: 15px 0 45px 25px;
}

.gift-box {
  margin: 30px auto 0 auto;
  position: relative;
  width: 1118px;
  height: 955px;
  background: url(../img/gift-box-bg.jpg) no-repeat;
}
.gift {
  width: 196px;
  height: 156px;
  position: absolute;
  cursor: pointer;
}
.gift img {
  visibility: hidden;
  opacity: 0;
  width: 372px;
  height: 221px;
  margin-left: -88px;
  margin-top: -241px;
  transition: .3s;
}

.gift-1:hover img {
  visibility: initial;
  opacity: 1;
}

.gift-2:hover img {
  visibility: initial;
  opacity: 1;
}

.gift.gift-1 {
  left: 570px;
  top: 520px;
}

.gift.gift-2 {
  left: 820px;
  top: 734px;
}

/* tk */
.cover {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .7);
  z-index: 4;
}
.tk {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  z-index: 6;
}
.tk .close {
  position: absolute;
  top: 0;
  right: -10px;
  width: 52px;
  height: 52px;
  background: url(../img/tk-close.png) no-repeat;
  cursor: pointer;
}
.share-tip {
  box-sizing: border-box;
  padding: 40px 80px 0 80px;
  width: 893px;
  height: 537px;
  line-height: 30px;
  background: url(../img/tk-b-bg.png) no-repeat;
  font-size: 24px;
  color: #070b19;
}

.share-tip .name {
  color: #c20092;
}

.share-tip i {
  font-style:normal;
}

.share-tip p {
  text-indent: 40px;
  line-height: 2;
}

.share-tip p:first-of-type {
  text-indent: initial;
}

.share-tip .bold {
  font-weight: bold;
}

.icon-share {
  display: block;
  margin: 30px auto auto;
  width: 218px;
  height: 63px;
  background: url(../img/btn-share.png) no-repeat;
}

.share-icon {
  width: 723px;
  height: 357px;
  background: url(../img/tk-s-bg.png) no-repeat;
}
.share-icon .tit {
  display: block;
  margin: 50px auto 0;
  text-align: center;
  color: #070b19;
  font-size: 36px;
  font-weight: bold;
}
/*.share-icon ul {
  margin-top: 30px;
  text-align: center;
}
 .share-icon li {
  display: inline-block;
  margin: 0 8.5px;
  width: 53px;
  height: 53px;
  background: url(../img/share-icon.png) no-repeat;
  cursor: pointer;
}
.share-icon li:nth-child(2) {
  background-position-x: -70px;
}
.share-icon li:nth-child(3) {
  background-position-x: -140px;
}
.share-icon li:nth-child(4) {
  background-position-x: -210px;
}
.share-icon li:nth-child(5) {
  background-position-x: -280px;
} */

body #share {
  margin-top: 50px;
  text-align: center;
}
body .ztsharebutton a {
  display: inline-block;
  margin-right: 44px;
  width: 90px;
  height: 90px;
  background: url(../img/share-icon.png) no-repeat;
  cursor: pointer;
  transition: .5s;
}

body .ztsharebutton a:last-of-type {
margin-right: 0;
}
body .ztsharebutton a:hover {
  filter: brightness(1.3);
}
body .ztsharebutton .share_sina {
  background-position: 0 0;
}
body .ztsharebutton .share_qqzone {
  background-position: -134px 0;
}
body .ztsharebutton .share_qq {
  background-position: -268px 0;
}
/*body .ztsharebutton .share_bdtieba {*/
/*  background-position: -402px 0;*/
/*}*/
body .ztsharebutton .share_weixin {
  background-position: -392px 0;
}

body #ztshare_weixin_qrcode_dialog {
  border: solid 2px #e073ff;
  border-radius: 12px;
}

#share span {
  display: none;
}
/*footer*/
body .footer_main {
  padding-top: 20px;
  height: 197px;
  background: url(../img/footer-bg.jpg) repeat-x;
}
body .footer .nr {
  height: auto;
}


@-webkit-keyframes hl {
  to{
    -webkit-filter: brightness(1.5);
    filter: brightness(1.5);
  }  
}