@charset "UTF-8";
@import url(animate.min.css);
/*$vw:100/1080*1vw;*/
* {
  border: none;
  margin: 0;
  padding: 0;
  font-family: 'MicrosoftYaHei', 微软雅黑,serif; }

a, a:link, a:visited, a:hover, a:active {
  text-decoration: none; }

@media screen and (max-width: 320px) {
  html {
    font-size: 42.667px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 321px) and (max-width: 360px) {
  html {
    font-size: 48px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 361px) and (max-width: 375px) {
  html {
    font-size: 50px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 376px) and (max-width: 393px) {
  html {
    font-size: 52.4px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 394px) and (max-width: 412px) {
  html {
    font-size: 54.93px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 413px) and (max-width: 414px) {
  html {
    font-size: 55.2px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 415px) and (max-width: 480px) {
  html {
    font-size: 64px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 481px) and (max-width: 540px) {
  html {
    font-size: 72px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 541px) and (max-width: 640px) {
  html {
    font-size: 85.33px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 641px) and (max-width: 720px) {
  html {
    font-size: 96px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 721px) and (max-width: 768px) {
  html {
    font-size: 102.4px;
    font-size: -webkit-calc(13.33333333vw);
    font-size: calc(13.33333333vw); } }
@media screen and (min-width: 769px) {
  html {
    font-size: 102.4px; }

  #container {
    width: 769px;
    margin: 0 auto; } }
.clear {
  clear: both;
  *height: 1%; }
  .clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden; }

img {
  display: block; }

li {
  list-style: none; }

.lf {
  float: left; }

.rt {
  float: right; }

input, select {
  -webkit-appearance: none; }

body {
  font-size: 15px;
  position: relative;
  color: #333; }

[v-cloak] {
  display: none; }

.animated2s {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

.animated3s {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

.animated4s {
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

.animated2s.infinite, .animated3s.infinite, .animated4s.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

body {
  background: #e8d8bd; }

#container {
  position: fixed;
  width: 100vmax;
  height: 100vmin;
  top: 0;
  left: 0;
  overflow-y: hidden; }
  #container.portrait {
    -weblit-transform: rotateZ(90deg) translateY(-100%);
    transform: rotateZ(90deg) translateY(-100%);
    -weblit-transform-origin: 0 0;
    transform-origin: 0 0; }
  #container .portrait {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vmax;
    height: 100vmin;
    background: #383737;
    text-align: center;
    z-index: 99; }

section {
  position: absolute;
  width: 100vmax;
  height: 100vmin;
  left: 0;
  top: 0;
  overflow-y: auto; }

#bg {
  z-index: -1; }
  #bg .btn_rule {
    position: fixed;
    width: 12.6851851852vmin;
    top: 2.7777777778vmin;
    left: 4.6296296296vmin; }
  #bg.blur {
    filter: blur(2px); }
  #bg .bg {
    width: 470.7407407407vmin;
    height: 100%; }
  #bg .scene .coin {
    position: absolute;
    width: 6.4814814815vmin;
    left: 50%;
    margin-left: -3.2407407407vmin;
    bottom: 7.4074074074vmin;
    animation-fill-mode: forwards; }
  #bg .scene li:nth-child(1) {
    position: absolute;
    left: 24.7222222222vmin;
    bottom: 40.7407407407vmin;
    width: 17.1296296296vmin; }
    #bg .scene li:nth-child(1) .scene {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 17.1296296296vmin; }
    #bg .scene li:nth-child(1) .scene2 {
      position: absolute;
      left: 3.0555555556vmin;
      bottom: 0;
      width: 13.9814814815vmin; }
    #bg .scene li:nth-child(1) .label {
      position: absolute;
      left: 13.1481481481vmin;
      bottom: 10.5555555556vmin;
      width: 2.4074074074vmin; }
  #bg .scene li:nth-child(2) {
    position: absolute;
    left: 135vmin;
    top: 0;
    width: 21.0185185185vmin;
    height: 23.1481481481vmin; }
    #bg .scene li:nth-child(2) .coin {
      bottom: auto;
      top: 6.4814814815vmin; }
    #bg .scene li:nth-child(2) .scene {
      position: absolute;
      left: 0;
      top: 0;
      width: 21.0185185185vmin; }
    #bg .scene li:nth-child(2) .label {
      position: absolute;
      left: 15.6481481481vmin;
      top: 3.9814814815vmin;
      width: 2.4074074074vmin; }
  #bg .scene li:nth-child(3) {
    position: absolute;
    left: 168.5185185185vmin;
    top: 31.7592592593vmin;
    width: 51.1111111111vmin;
    height: 27.7777777778vmin; }
    #bg .scene li:nth-child(3) .coin {
      bottom: auto;
      top: 0; }
    #bg .scene li:nth-child(3) .scene {
      position: absolute;
      left: 14.8148148148vmin;
      top: -0.6481481481vmin;
      width: 14.8148148148vmin; }
    #bg .scene li:nth-child(3) .label {
      position: absolute;
      left: 30.3703703704vmin;
      top: 3.9814814815vmin;
      width: 2.4074074074vmin; }
  #bg .scene li:nth-child(4) {
    position: absolute;
    left: 212.8703703704vmin;
    top: 85.1851851852vmin;
    width: 16.9444444444vmin; }
    #bg .scene li:nth-child(4) .coin {
      bottom: auto;
      top: 0; }
    #bg .scene li:nth-child(4) .scene {
      position: absolute;
      left: 0;
      top: 0;
      width: 16.9444444444vmin; }
    #bg .scene li:nth-child(4) .scene2 {
      position: absolute;
      left: 0;
      top: 0;
      width: 16.9444444444vmin; }
    #bg .scene li:nth-child(4) .label {
      position: absolute;
      left: 17.037037037vmin;
      top: -4.3518518519vmin;
      width: 2.4074074074vmin; }
  #bg .scene li:nth-child(5) {
    position: absolute;
    left: 270.9259259259vmin;
    bottom: 39.1666666667vmin;
    width: 16.9444444444vmin; }
    #bg .scene li:nth-child(5) .scene {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 16.9444444444vmin; }
    #bg .scene li:nth-child(5) .scene2 {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 16.9444444444vmin; }
    #bg .scene li:nth-child(5) .label {
      position: absolute;
      left: 12.5vmin;
      bottom: 6.2037037037vmin;
      width: 2.4074074074vmin; }
  #bg .scene li:nth-child(6) {
    position: absolute;
    left: 349.2592592593vmin;
    top: 53.9814814815vmin;
    width: 44.3518518519vmin; }
    #bg .scene li:nth-child(6) .coin {
      bottom: auto;
      top: 4.6296296296vmin;
      margin-left: 0; }
    #bg .scene li:nth-child(6) .scene {
      position: absolute;
      left: 0;
      top: 0;
      width: 44.3518518519vmin; }
    #bg .scene li:nth-child(6) .label {
      position: absolute;
      left: 17.2222222222vmin;
      top: 4.537037037vmin;
      width: 2.4074074074vmin; }
  #bg .btn_question img {
    pointer-events: none;
    position: absolute;
    width: 13.5185185185vmin;
    top: -19.3518518519vmin;
    left: 50%;
    margin-left: -6.7592592593vmin;
    animation: pointer 2s infinite linear; }
@keyframes pointer {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(-20%); } }
  #bg .btn_question li:nth-child(1) {
    position: absolute;
    top: 39.8148148148vmin;
    left: 138.7037037037vmin;
    width: 21.2037037037vmin;
    height: 22.6851851852vmin; }
  #bg .btn_question li:nth-child(2) {
    position: absolute;
    top: 36.4814814815vmin;
    left: 232.4074074074vmin;
    width: 20.462962963vmin;
    height: 21.2037037037vmin; }
  #bg .btn_question li:nth-child(3) {
    position: absolute;
    top: 72.4074074074vmin;
    left: 297.962962963vmin;
    width: 28.6111111111vmin;
    height: 28.0555555556vmin; }

.status {
  pointer-events: none;
  z-index: 5; }
  .status .logo {
    position: absolute;
    width: 57.6851851852vmin;
    top: 3.8888888889vmin;
    left: 4.6296296296vmin; }
  .status .logo2 {
    position: absolute;
    width: 41.9444444444vmin;
    bottom: 3.8888888889vmin;
    left: 4.6296296296vmin; }
  .status .note {
    position: absolute;
    height: 3.2407407407vmin;
    bottom: 3.8888888889vmin;
    right: 4.6296296296vmin; }
  .status .coin {
    position: absolute;
    top: 2.7777777778vmin;
    right: 2.7777777778vmin; }
    .status .coin .text {
      position: absolute;
      width: 20.462962963vmin;
      right: 46.9444444444vmin;
      top: 1.1111111111vmin; }
    .status .coin ul {
      position: absolute;
      right: 0;
      top: 0;
      width: 46.2037037037vmin; }
      .status .coin ul li {
        float: left;
        width: 6.4814814815vmin;
        margin-right: 0.9259259259vmin; }
        .status .coin ul li:last-child {
          margin-right: 0; }
        .status .coin ul li img {
          width: 100%; }

#cover .title {
  position: absolute;
  top: 31.2962962963vmin;
  left: 50%;
  transform: translateX(-50%);
  width: 94.8148148148vmin; }
#cover .btn_start {
  position: absolute;
  width: 22.3148148148vmin;
  top: 67.5vmin;
  left: 50%;
  margin-left: -11.1574074074vmin; }
#cover .btn_rule {
  position: absolute;
  top: 79.537037037vmin;
  left: 50%;
  transform: translateX(-50%); }
  #cover .btn_rule .radio {
    float: left;
    width: 5.2777777778vmin; }
  #cover .btn_rule .btn {
    float: left;
    margin-left: 2.8703703704vmin;
    width: 57.1296296296vmin; }

#rule .bg {
  position: absolute;
  background: url("../images/pop_bg2.png") no-repeat;
  background-size: 100% 100%;
  top: 50%;
  left: 50%;
  width: 104.7222222222vmin;
  height: 85.8333333333vmin;
  margin-left: -52.3611111111vmin;
  margin-top: -41.0648148148vmin; }
  #rule .bg .close {
    position: absolute;
    width: 3.5185185185vmin;
    top: 2.962962963vmin;
    right: 3.8888888889vmin; }
  #rule .bg .scroll {
    position: absolute;
    top: 8.3333333333vmin;
    left: 4.6296296296vmin;
    right: 4.6296296296vmin;
    bottom: 4.6296296296vmin;
    overflow-y: auto; }
    #rule .bg .scroll div {
      margin-bottom: 1.8518518519vmin;
      text-align: justify;
      font-size: 13px; }

#chat li {
  position: absolute;
  bottom: 14.3518518519vmin;
  background: url("../images/chat_bg.png") no-repeat;
  background-size: 100% 100%;
  width: 80.0925925926vmin;
  height: 29.9074074074vmin;
  left: 50%;
  margin-left: -40.0462962963vmin; }
  #chat li .people1 {
    position: absolute;
    width: 36.4814814815vmin;
    top: -24.537037037vmin;
    left: 46.3888888889vmin; }
  #chat li .text1 {
    position: absolute;
    width: 73.4259259259vmin;
    top: 2.5vmin;
    left: 3.6111111111vmin; }
  #chat li .people2 {
    position: absolute;
    width: 22.4074074074vmin;
    top: -22.1296296296vmin;
    left: 49.1666666667vmin; }
  #chat li .text2 {
    position: absolute;
    width: 47.5925925926vmin;
    top: 2.5vmin;
    left: 3.6111111111vmin; }
  #chat li .people3 {
    position: absolute;
    width: 20.1851851852vmin;
    top: -20.7407407407vmin;
    left: 51.0185185185vmin; }
  #chat li .text3 {
    position: absolute;
    width: 59.6296296296vmin;
    top: 2.5vmin;
    left: 3.6111111111vmin; }
  #chat li .name {
    position: absolute;
    height: 6.3888888889vmin;
    right: 11.9444444444vmin;
    top: -4.1666666667vmin; }
  #chat li .close {
    position: absolute;
    width: 2.5925925926vmin;
    top: 2.7777777778vmin;
    right: 2.7777777778vmin; }
  #chat li .btn {
    position: absolute;
    width: 32.8703703704vmin;
    bottom: 3.2407407407vmin;
    left: 50%;
    margin-left: -16.4351851852vmin; }

#question1 .pop {
  position: absolute;
  width: 61.2037037037vmin;
  height: 81.9444444444vmin;
  background: url("../images/pop_bg.png") no-repeat;
  background-size: 100% 100%;
  left: 50%;
  margin-left: -30.6018518519vmin;
  top: 10vmin; }
  #question1 .pop .label {
    position: absolute;
    width: 18.5185185185vmin;
    top: 1.8518518519vmin;
    left: 1.8518518519vmin; }
  #question1 .pop .img {
    position: absolute;
    width: 55.3703703704vmin;
    top: 7.1296296296vmin;
    left: 3.6111111111vmin; }
  #question1 .pop .note {
    position: absolute;
    top: 58.6111111111vmin;
    text-align: center;
    font-size: 2.7777777778vmin;
    width: 100%;
    box-sizing: border-box;
    padding: 0 2.7777777778vmin;
    font-weight: bold; }
    #question1 .pop .note span {
      font-size: 3.0555555556vmin;
      color: #915252;
      padding-left: 2.7777777778vmin; }
  #question1 .pop .btn {
    position: absolute;
    top: 67.1296296296vmin;
    text-align: center;
    width: 100%; }
    #question1 .pop .btn div {
      display: inline-block;
      min-width: 22.3148148148vmin;
      height: 7.3148148148vmin;
      line-height: 7.3148148148vmin;
      background: url("../images/btn_bg.png") no-repeat;
      background-size: 100% 100%;
      text-align: center;
      color: #fff8ed;
      font-size: 3.8888888889vmin;
      font-weight: bold;
      margin: 0 1.3888888889vmin; }
  #question1 .pop .answer {
    position: absolute;
    width: auto;
    height: 6.3888888889vmin;
    line-height: 6.3888888889vmin;
    background: url("../images/pop_answer.png") no-repeat;
    background-size: 100% 100%;
    top: 1.8518518519vmin;
    left: 1.8518518519vmin;
    color: #fff8ed;
    font-size: 3.0555555556vmin;
    font-weight: bold;
    text-align: center;
    padding: 0 1.3888888889vmin; }
  #question1 .pop .correct {
    position: absolute;
    width: 20.5555555556vmin;
    top: 39.1666666667vmin;
    left: 33.6111111111vmin; }
  #question1 .pop .wrong {
    position: absolute;
    width: 20.5555555556vmin;
    top: 1.3888888889vmin;
    left: 34.537037037vmin; }
  #question1 .pop .text {
    position: absolute;
    width: 5.6481481481vmin;
    top: 52.6851851852vmin;
    left: 4.3518518519vmin; }
  #question1 .pop .note2 {
    position: absolute;
    background: #e9d8bb;
    top: 57.1296296296vmin;
    left: 2.2222222222vmin;
    right: 2.2222222222vmin;
    color: #322f2b;
    line-height: 2.7777777778vmin;
    font-size: 2.4074074074vmin;
    box-sizing: border-box;
    padding: 1.3888888889vmin; }
  #question1 .pop .btn2 {
    position: absolute;
    width: 22.3148148148vmin;
    bottom: -2.1296296296vmin;
    left: 50%;
    margin-left: -11.1574074074vmin; }

#question2 .pop {
  position: absolute;
  width: 61.2037037037vmin;
  height: 81.9444444444vmin;
  background: url("../images/pop_bg.png") no-repeat;
  background-size: 100% 100%;
  left: 50%;
  margin-left: -30.6018518519vmin;
  top: 10vmin;
  padding: 12.4074074074vmin 6.3888888889vmin 0 6.3888888889vmin;
  box-sizing: border-box; }
  #question2 .pop .num {
    position: absolute;
    background: url("../images/pop_title_bg.png") no-repeat;
    background-size: 100% 100%;
    height: 6.3888888889vmin;
    line-height: 6.3888888889vmin;
    top: 1.8518518519vmin;
    left: 1.8518518519vmin;
    text-align: center;
    font-size: 4.1666666667vmin;
    letter-spacing: 0.2777777778vmin;
    font-weight: bold;
    padding: 0 2.7777777778vmin;
    color: #fff8ed; }
  #question2 .pop .title {
    font-size: 2.962962963vmin;
    line-height: 4.6296296296vmin;
    text-align: justify;
    margin-bottom: 5.462962963vmin; }
  #question2 .pop ul li div {
    display: inline-block;
    background: url("../images/btn_bg.png") no-repeat;
    background-size: 100% 100%;
    color: white;
    font-size: 3.3333333333vmin;
    min-width: 21.9444444444vmin;
    line-height: 3.7037037037vmin;
    padding: 1.8518518519vmin 1.8518518519vmin;
    margin-bottom: 1.8518518519vmin;
    box-sizing: border-box; }

#question3 .pop {
  position: absolute;
  min-width: 58.4259259259vmin;
  height: auto;
  background: url("../images/pop_bg3.png") no-repeat;
  background-size: 100% 100%;
  left: 50%;
  transform: translate(-50%);
  top: 24.8148148148vmin;
  padding: 11.1111111111vmin 2.7777777778vmin 0 2.7777777778vmin;
  box-sizing: border-box; }
  #question3 .pop .num {
    position: absolute;
    background: url("../images/pop_title_bg.png") no-repeat;
    background-size: 100% 100%;
    height: 6.3888888889vmin;
    line-height: 6.3888888889vmin;
    top: 1.8518518519vmin;
    left: 1.8518518519vmin;
    text-align: center;
    font-size: 4.1666666667vmin;
    letter-spacing: 0.2777777778vmin;
    font-weight: bold;
    padding: 0 2.7777777778vmin;
    color: #fff8ed; }
  #question3 .pop .title {
    text-align: center;
    margin-bottom: 2.7777777778vmin; }
    #question3 .pop .title img {
      display: inline-block;
      height: 9.8148148148vmin; }
      #question3 .pop .title img.type1 {
        height: 19.0740740741vmin; }
  #question3 .pop .answer {
    text-align: center;
    margin-bottom: 1.6666666667vmin; }
    #question3 .pop .answer li {
      position: relative;
      display: inline-block;
      margin: 0 0.462962963vmin;
      font-size: 4.2592592593vmin;
      line-height: 7.4074074074vmin;
      width: 7.4074074074vmin;
      height: 7.4074074074vmin; }
      #question3 .pop .answer li .box {
        background: #e2d5bb;
        border: 0.1851851852vmin solid #c7b89a;
        line-height: 7.037037037vmin; }
      #question3 .pop .answer li div {
        position: absolute;
        text-align: center;
        box-sizing: border-box;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
  #question3 .pop .option {
    text-align: center;
    width: 100%;
    height: 7.3148148148vmin; }
    #question3 .pop .option li {
      display: inline-block;
      margin: 0 0.7407407407vmin;
      background: url("../images/pop_option_bg.png") no-repeat;
      background-size: 100% 100%;
      width: 8.7962962963vmin;
      height: 7.3148148148vmin;
      line-height: 7.3148148148vmin;
      font-size: 4.2592592593vmin;
      min-height: 7.4074074074vmin;
      color: #fff8ed; }
  #question3 .pop .btn {
    width: 17.037037037vmin;
    margin: 3.1481481481vmin auto; }

#result .pop {
  position: absolute;
  width: 44.4444444444vmin;
  height: 27.962962963vmin;
  background: url("../images/pop_bg.png") no-repeat;
  background-size: 100% 100%;
  left: 50%;
  margin-left: -22.2222222222vmin;
  top: 33.8888888889vmin; }
#result .note1 {
  position: absolute;
  width: 34.0740740741vmin;
  top: 7.3148148148vmin;
  left: 50%;
  margin-left: -17.037037037vmin; }
#result .note2 {
  position: absolute;
  width: 38.3333333333vmin;
  top: 7.3148148148vmin;
  left: 50%;
  margin-left: -19.1666666667vmin; }
#result .note3 {
  position: absolute;
  width: 36.8518518519vmin;
  top: 4.537037037vmin;
  left: 50%;
  margin-left: -18.4259259259vmin; }
#result .note4 {
  position: absolute;
  width: 18.2407407407vmin;
  top: 8.7037037037vmin;
  left: 50%;
  margin-left: -9.1203703704vmin; }
#result .note5 {
  position: absolute;
  width: 16.5740740741vmin;
  top: 4.6296296296vmin;
  left: 50%;
  margin-left: -8.287037037vmin; }
#result .note6 {
  position: absolute;
  width: 33.7962962963vmin;
  top: 4.6296296296vmin;
  left: 50%;
  margin-left: -16.8981481481vmin; }
#result .close {
  position: absolute;
  width: 2.5925925926vmin;
  top: 2.037037037vmin;
  right: 2.037037037vmin; }
#result .btn_answer {
  position: absolute;
  width: 19.0740740741vmin;
  top: 18.1481481481vmin;
  left: 2.5vmin; }
#result .btn_end {
  position: absolute;
  width: 19.0740740741vmin;
  top: 18.1481481481vmin;
  right: 2.5vmin; }
#result .btn_end2 {
  position: absolute;
  width: 19.0740740741vmin;
  top: 19.2592592593vmin;
  left: 50%;
  margin-left: -9.537037037vmin; }
#result .btn_video {
  position: absolute;
  width: 19.0740740741vmin;
  top: 18.1481481481vmin;
  right: 2.5vmin; }
#result .btn_video2 {
  position: absolute;
  width: 19.0740740741vmin;
  top: 19.2592592593vmin;
  left: 50%;
  margin-left: -9.537037037vmin; }
#result .text {
  position: absolute;
  width: 100%;
  text-align: center;
  top: 10vmin;
  font-size: 2.2222222222vmin;
  line-height: 3.2407407407vmin; }
#result .btn_prize {
  position: absolute;
  width: 19.9074074074vmin;
  top: 17.962962963vmin;
  left: 50%;
  margin-left: -9.9537037037vmin; }
#result .btn_next {
  position: absolute;
  width: 17.5925925926vmin;
  top: 16.4814814815vmin;
  left: 50%;
  margin-left: -8.7962962963vmin; }
#result .btn_next2 {
  position: absolute;
  width: 17.5925925926vmin;
  bottom: -2.2222222222vmin;
  left: 50%;
  margin-left: -8.7962962963vmin; }
#result .title {
  position: absolute;
  width: 100%;
  top: 8.3333333333vmin;
  text-align: center; }
  #result .title img {
    display: inline-block;
    height: 6.2962962963vmin;
    margin-top: -4.6296296296vmin; }
    #result .title img.type1 {
      width: 70%;
      height: auto; }
#result .correct {
  position: absolute;
  width: 20.3703703704vmin;
  top: -5.1851851852vmin;
  right: -2.5925925926vmin; }
#result .answer {
  position: absolute;
  text-align: center;
  top: 17.2222222222vmin;
  font-size: 3.8888888889vmin;
  font-weight: bold;
  color: #71a074;
  width: 100%; }

#video .pop {
  position: absolute;
  width: 126.0185185185vmin;
  height: 73.6111111111vmin;
  background: url("../images/pop_bg3.png") no-repeat;
  background-size: 100% 100%;
  left: 50%;
  margin-left: -63.0092592593vmin;
  top: 15.5555555556vmin; }
  #video .pop .time {
    position: absolute;
    left: 5.5555555556vmin;
    top: 2.7777777778vmin; }
  #video .pop video {
    position: absolute;
    top: 9.2592592593vmin;
    height: 55.5555555556vmin;
    left: 5.5555555556vmin;
    width: 114.9074074074vmin;
    background: black; }
#video .close {
  position: absolute;
  width: 3.5185185185vmin;
  top: 2.962962963vmin;
  right: 3.8888888889vmin; }
#video .btn {
  position: absolute;
  width: 26.0185185185vmin;
  bottom: -3.1481481481vmin;
  left: 50%;
  margin-left: -13.0092592593vmin; }

#message .pop {
  position: absolute;
  background: url("../images/pop_bg2.png") no-repeat;
  background-size: 100% 100%;
  top: 50%;
  left: 50%;
  width: 44.4444444444vmin;
  height: 27.962962963vmin;
  margin-left: -22.2222222222vmin;
  margin-top: -13.9814814815vmin; }
#message .message {
  position: absolute;
  text-align: center;
  top: 11.1111111111vmin;
  left: 0;
  width: 100%; }
#message .close {
  position: absolute;
  width: 3.5185185185vmin;
  top: 2.962962963vmin;
  right: 3.8888888889vmin; }

/*# sourceMappingURL=index.css.map */
