html,
body {
  margin: 0;
  height: 960px;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
  font-family: 'microsoft yahei';
  background: #760a03;
}

canvas {
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  height: 100%;
  margin: auto
}

.board {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  text-align: center
}

.board-img {
  height: 100%
}

.board-btn {
  position: absolute;
  width: 67%;
  left: 17%;
  height: 10%;
  top: 69%;
  cursor: pointer
}

.share-btn {
  position: absolute;
  width: 67%;
  left: 17%;
  height: 10%;
  top: 82%;
  cursor: pointer
}

.board-text {
  position: absolute;
  width: 80%;
  max-height: 30%;
  overflow: hidden;
  top: 48%;
  left: 10%;
  color: #fee43d
}

.board-text span {
  font-size: 34px;
  color: #fff;
}

.share-tip {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: 80% auto
}

.loading {
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, .6);
  width: 100%;
  height: 100%
}

.loading-text {
  color: #fff;
  position: absolute;
  top: 40%;
  width: 100%;
  text-align: center
}

.start {
  position: relative;
  top: 0;
  left: 0;
  margin: 0 auto;
  width: 512px;
  text-align: center;
  background-size: contain!important;
  height: 910px;
}

.rule-btn{
  position: absolute;
  top: 20px;
  right: 22px;
  height: 41px;
  width: 141px;
  background-size: cover!important;
}

.start-btn {
  position: absolute;
  left: 127px;
  top: 649px;
  width: 268px;
  height: 72px;
  cursor: pointer;
  /* background-size: cover; */
  background-size: cover!important;
  /* -webkit-tap-highlight-color: transparent; */
  tap-highlight-color: transparent;
}


.record-btn {
  position: absolute;
  width: 188px;
  text-align: center;
  margin: 0 auto;
  top: 800px;
  height: 83px;
  left: 164px;
  cursor: pointer;
  background-size: contain!important;
}

.change-text{
  position: absolute;
  top: 737px;
  width: 100%;
  text-align: center;
  font-size: 37px;
  font-weight: bold;
  color: #fff;
}

.share-txt {
  color: #fff;
  font-size: 1.6rem;
  text-align: center;
  padding-top: 36%;
  font-family: 'microsoft yahei';
}


.to_big_btn:hover {
  transform: scale(1.1);
}