/*reset*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  -webkit-text-size-adjust: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-weight: normal;
  font-style: normal; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

a {
  text-decoration: none; }

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  font-size: 100%; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0; }

*:not(input, textarea) {
  -webkit-touch-callout: none;
  -webkit-user-select: none; }

.cf:after,
.cf:before {
  content: '';
  display: table; }

.cf:after {
  clear: both; }

.cf {
  zoom: 1; }

.fl {
  float: left;
  display: inline; }

.fr {
  float: right;
  display: inline; }

.dis_none {
  display: none; }

.seo {
  position: absolute;
  left: 1000px;
  width: 1000px;
  font-size: 0; }

html {
  height: 100%; }

body, html {
  width: 100%;
  min-height: 800px;
  height: 100%;
  position: relative;
  overflow: hidden;
  background-image: -webkit-radial-gradient(50% 50%, circle closest-side, #676666 0%, #333132 84%, #333132 100%); }

header {
  position: absolute;
  left: 0;
  top: 0;
  height: 80px;
  width: 100%; }
#scene{
  height: 100% !important;
}
.header {
  background: black;
  position: absolute;
  left: 0;
  top: 0;
  height: 80px;
  width: 100%;
  padding-left: 30px; }

.width990 {
  width: 990px; }

header a {
  background: url("../images/logo.png") no-repeat left center;
  display: block;
  content: "";
  height: 81px;
  width: 640px; }

.bgThink1 {
  position: absolute;
  left: 50px;
  top: 0; }

.bgThink2 {
  position: absolute;
  left: 0;
  top: 0; }

.banner {
  width: 552px;
  height: 192px;
  top: 13% !important; }

.tips {
  width: 100%;
  height: 242px;
  position: relative; }

.tips > div {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%; }

.noGame > img:nth-of-type(1) {
  position: absolute;
  left: 187px;
  top: 0; }

.noGame > img:nth-of-type(2) {
  position: absolute;
  left: 73px;
  top: 64px; }

.noGame > img:nth-of-type(3) {
  position: absolute;
  left: 345px;
  top: 64px; }

.noGame > img:nth-of-type(4) {
  position: absolute;
  left: 63px;
  top: 128px; }

.noGame > img:nth-of-type(5) {
  position: absolute;
  left: 219px;
  top: 128px; }

.noStart, .noGame, .err {
  width: 100%;
  display: none; }

.err {
  text-align: center; }

.err > div:nth-of-type(1) {
  font-size: 100px;
  color: #fff;
  line-height: 100px;
  font-family: arial; }

.err > div:nth-of-type(2) {
  font-size: 26px;
  color: #fff;
  font-family: "Microsoft YaHei"; }

.noStart > img {
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  position: absolute; }

.footer {
  position: absolute;
  top: inherit !important;
  bottom: 0;
  width: 100%; }

.centerObj {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%); }

.ad {
  color: #97A9F4;
  height: 154px;
  width: 546px;
  float: left;
  background: #121212;
  text-align: center;
  position: relative;
  -webkit-clip-path: polygon(34px 0, 100% 0, 100% 100%, 0 100%, 0% 44px);
  clip-path: polygon(34px 0, 100% 0, 100% 100%, 0 100%, 0% 44px); }

.gameList {
  transition: all .3s;
  -webkit-transition: all .3s;
  background-color: #e9e9e9;
  overflow: hidden;
  height: 0; }

/*.gameList.slide{ display: block;}*/
.gameList ul {
  padding: 20px 0 55px;
  width: 524px;
  margin: 0 auto;
  transition: all .3s;
  -webkit-transition: all .3s; }

.gameList li {
  width: 522px;
  margin-bottom: 16px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid #d3d3d3;
  box-sizing: border-box;
  padding: 20px 20px 20px 146px;
  position: relative; }

.gameList li a {
  display: block;
  min-height: 106px; }

.gameList li img {
  position: absolute;
  left: 20px;
  top: 20px; }

.gameList li span {
  display: block; }

.gameList li span:nth-of-type(1) {
  color: #0f0f0f;
  font: 24px/1em "Microsoft YaHei"; }

.gameList li span:nth-of-type(2) {
  color: #818181;
  font: 20px/1.2em "Microsoft YaHei";
  margin-top: 5px; }

.lzInfo {
  background: #fff;
  height: 290px;
  position: relative;
  padding-top: 20px; }

.gameList.slide ~ .lzInfo {
  margin-top: -20px; }

.phoneMsg {
  background: url("../images/phone.png") no-repeat;
  width: 217px;
  height: 124px;
  position: absolute;
  left: 30px;
  top: 14px; }

.code {
  position: absolute;
  right: 30px;
  top: 6px; }

.code > img {
  width: 144px;
  height: 144px; }

.openListBtn {
  animation: bgThink1 2s infinite;
  -webkit-animation: bgThink1 2s infinite;
  overflow: hidden;
  background: url("../images/slideOn.png") center top no-repeat;
  width: 100%;
  height: 60px;
  position: absolute;
  top: -26px;
  left: 0; }

.openListBtn > span {
  transition: all .3s;
  -webkit-transition: all .3s;
  text-align: center;
  color: #8a6c14;
  display: block;
  width: 100%;
  font: 20px/94px "Microsoft YaHei"; }

.gameList.slide ~ .lzInfo .openListBtn > span {
  opacity: 0; }

.gameList.slide ~ .lzInfo .openListBtn {
  animation: none;
  -webkit-animation: none; }

#canvas {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%); }

.banner {
  animation: zoomInDown 1s;
  -webkit-animation: zoomInDown 1s; }

.footerBox {
  width: 990px;
  margin: 0 auto;
  height: 156px; }

.border-bottom::after {
  content: "";
  width: 100%;
  height: 2px;
  position: absolute;
  bottom: 0;
  left: 0;
  background-image: -webkit-linear-gradient(0deg, #f29607 0%, #f29607 25%, #0888f3 25%, #0888f3 50%, #da251e 50%, #da251e 75%, #8bde10 75%, #8bde10 100%); }

.adBox {
  text-align: center;
  padding-bottom: 27px;
  font-size: 0; }

.adBox > div {
  height: 26px;
  background: #201e1f;
  color: #c2c2c2;
  text-align: center;
  padding: 0 20px;
  margin: 2px 5px;
  font: 17px/26px "Microsoft YaHei";
  font-style: italic;
  display: inline-block; }

.info {
  width: 444px;
  float: right;
  height: 154px; }

.ad {
  font: 22px/38px "Microsoft YaHei"; }

.ad > div {
  width: 100%; }

.ad > div > div {
  display: inline-block;
  margin: 0 10px; }

.ad > div > span {
  color: #8E7E4C; }

.ad > div > div > span {
  font-size: 26px; }

.box-shadow {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.61); }

.codeBanner {
  top: 38% !important;
  width: 208px;
  height: 289px;
  background-color: rgba(235, 235, 235, 0.16);
z-index: 1000;
}

.codeBanner > h3 {
  text-align: center;
  font: 28px/72px "Microsoft YaHei";
  color: #d8d8d8; }

.codeBanner > h4 {
  text-align: center;
  font: 18px/32px "Microsoft YaHei";
  color: #000000;
  letter-spacing: 4px; }

.codeBanner > div {
  width: 180px;
  margin: 0 auto;
  height: 180px;
  background: #fff;
  padding: 10px; }

@-webkit-keyframes zoomInDown {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
@keyframes zoomInDown {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
.bgThink1 {
  animation: bgThink1 2s infinite;
  -webkit-animation: bgThink1 2s infinite; }

.bgThink2 {
  animation: bgThink1 2s 1s infinite;
  -webkit-animation: bgThink1 2s 1s infinite; }

@keyframes bgThink1 {
  0%,100% {
    transform: translateY(0px);
    -webkit-transform: translateY(0px); }
  50% {
    transform: translateY(-10px);
    -webkit-transform: translateY(-10px); } }
@-webkit-keyframes bgThink1 {
  0%,100% {
    transform: translateY(0px);
    -webkit-transform: translateY(0px); }
  50% {
    transform: translateY(-10px);
    -webkit-transform: translateY(-10px); } }
.overflow {
  overflow: hidden; }

.overflow-x {
  overflow-x: hidden; }

.pos-a {
  position: absolute; }

.pa {
  position: absolute;
  top: 0;
  left: 0; }

.pa-r {
  position: absolute;
  top: 0;
  right: 0; }

.pa-b {
  position: absolute;
  bottom: 0;
  left: 0; }

.pa-br {
  position: absolute;
  bottom: 0;
  right: 0; }

.pos-r {
  position: relative; }

.pr {
  position: relative;
  top: 0;
  left: 0; }

.tce {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

.ce {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto; }

.mCe {
  position: absolute;
  left: 0 !important;
  right: 0 !important;
  margin-right: auto;
  margin-left: auto; }

.vCe {
  position: absolute;
  top: 0;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto; }

.text-center {
  text-align: center; }

.margin-auto {
  margin-right: auto;
  margin-left: auto; }

.border-50 {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%; }

.bg-back {
  height: 100% !important;
  width: 100% !important; }

.bg-back-w {
  width: 100% !important; }

.bg-back-h {
  height: 100% !important; }

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

.text-line {
  text-decoration: line-through; }

.transform-skewX {
  transform: skewX(-30deg); }

.transform-skewX-lose {
  transform: skewX(30deg); }

/*# sourceMappingURL=index.css.map */