@charset "utf-8";
@font-face {
  font-family: Flama;
  src: url(../font/FlamaSemicondensed-Ultralight.woff);
}
/****************************/
html,
body {
  margin: 0px;
  padding: 0px;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Roboto", "Droid Sans", PingFang TC, "黑體-繁", Heiti TC, "蘋果儷中黑", Apple LiGothic Medium, Arial, "微軟正黑體", "Microsoft JhengHei", "Microsoft Yahei";
  height: 100%;
  background: #ffffff;
  font-size: 20px;
}
.loading {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #ffffff;
  z-index: 999;
  left: 0px;
  top: 0px;
  text-align: center;
}
.loading > div {
  position: fixed;
  display: inline-block;
  width: 13%;
  left: 43.5%;
  top: 26vh;
}
#stage {
  position: relative;
  overflow: hidden;
  background: #FFFFFF;
  font-size: calc(100vw / 100);
}
a {
  cursor: pointer;
  outline: none;
  hlbr: expression(this.onFocus=this.blur());
}
img {
  border: 0;
  width: 100%;
  height: auto;
  display: block;
}
.borderWidth {
  position: relative;
  width: 100%;
  padding: 0px 0%;
  margin: 0px auto;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
}
.borderWidth::after {
  clear: both;
  display: block;
  content: "";
}
section,
div,
span {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
}
.textPurple {
  color: #785dc3;
}
.textGreen {
  color: #349100;
}
.textRed {
  color: #FF0004;
}
.mo {
  display: none;
}
/**************************/
header {
  background: #FFFFFF;
  height: 3vw;
  width: 100%;
  text-align: left;
}
header img {
  height: 100%;
  width: auto;
  display: block;
}
header a {
  height: 2vw;
  width: auto;
  margin: 0.5vw 0 0 2vw;
  display: inline-block;
  cursor: pointer;
}
.kv {
  position: relative;
  background: url("../images/KV_BG.jpg") center bottom no-repeat #eee2ff;
  -moz-background-size: 100% auto;
  -webkit-background-size: 100% auto;
  -o-background-size: 100% auto;
  background-size: 100% auto;
  width: 100%;
  min-height: 48.8vw;
  z-index: 400;
  overflow: hidden;
}
.kv_bottom {
  position: absolute;
  background: url("../images/KV_bottom.png") center bottom no-repeat;
  -moz-background-size: 100% auto;
  -webkit-background-size: 100% auto;
  -o-background-size: 100% auto;
  background-size: 100% auto;
  width: 100%;
  left: 0;
  bottom: 0;
  z-index: 100;
}
.kv_main {
  position: relative;
  width: 70%;
  margin: 3.5vw auto 0 auto;
}
.kv_main::after {
  clear: both;
  display: block;
  content: "";
}
@keyframes zoomer {
  0% {
    opacity: 0;
    transform: scale(0.1);
  }
  25% {
    opacity: 0.7;
    transform: scale(1.3);
  }
  50% {
    opacity: 1;
    transform: scale(0.7);
  }
  70% {
    opacity: 1;
    transform: scale(1.05);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes smoke {
  0% {
    opacity: 0;
    transform: scale(0.3) translate3d(0, 0%, 0) rotate(0deg);
  }
  40% {
    opacity: 1;
    transform: scale(0.6) translate3d(0, -100%, 0) rotate(90deg);
  }
  80% {
    opacity: 0.7;
    transform: scale(1) translate3d(0, -150%, 0) rotate(180deg);
  }
  100% {
    opacity: 0;
    transform: scale(1) translate3d(0, -164%, 0) rotate(200deg);
  }
}
@keyframes text {
  0% {
    transform: translate3d(0, 0%, 0);
  }
  50% {
    transform: translate3d(0, 10%, 0);
  }
  100% {
    transform: translate3d(0, 0%, 0);
  }
}
.slogan {
  position: relative;
  width: 55%;
  margin: 0 0 0 6.5%;
  z-index: 50;
  float: left;
  opacity: 0;
  animation-duration: 1.2s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
}
.slogan .dec00 {
  position: relative;
  z-index: 40;
}
.slogan .date {
  position: absolute;
  width: 24%;
  right: -15%;
  top: -5%;
  z-index: 50;
  transform: rotate(10deg);
}
.slogan .dec01 {
  position: absolute;
  width: 49.82%;
  right: 1.6%;
  top: -5%;
  z-index: 50;
}
.slogan .dec02 {
  position: absolute;
  width: 19.7%;
  right: -5.2%;
  top: 60%;
  z-index: 35;
}
.Bankee {
  position: relative;
  width: 27%;
  float: right;
  z-index: 40;
  margin: 17.4vw 11.4% 0 0;
  opacity: 0;
  animation-delay: 0.3s;
  animation-duration: 1.2s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
}
.Bankee .dec00 {
  position: relative;
  z-index: 40;
}
.Bankee .dec01 {
  position: absolute;
  width: 21.55%;
  right: 3%;
  top: -65%;
  z-index: 35;
}
.Bankee .dec02 {
  position: absolute;
  width: 25%;
  right: -38%;
  top: 23%;
  z-index: 30;
}
.Bankee .dec03 {
  position: absolute;
  width: 70%;
  left: -68%;
  bottom: -2%;
  z-index: 50;
}
.Bankee .dec04 {
  position: absolute;
  width: 96%;
  right: 0%;
  top: -40%;
  z-index: 100;
  animation: text 4.6s ease-out infinite;
}
.Bankee .dec05 {
  display: none;
}
.Bankee .smoke01 {
  position: absolute;
  width: 15%;
  right: -8.6%;
  top: 30%;
  z-index: 80;
  opacity: 0;
  animation: smoke 6s linear infinite;
}
.Bankee .smoke02 {
  position: absolute;
  width: 6%;
  right: -10%;
  top: 0%;
  z-index: 80;
  opacity: 0;
  animation: smoke 4s linear 0s infinite;
}
.Bankee .smoke03 {
  position: absolute;
  width: 11%;
  right: 0%;
  top: -10%;
  z-index: 80;
  opacity: 0;
  animation: smoke 5s linear 1.5s infinite;
}
.Bankee .smoke04 {
  position: absolute;
  width: 9%;
  right: 40%;
  top: 0%;
  z-index: 80;
  opacity: 0;
  animation: smoke 10s linear 0s infinite;
}
.Bankee .smoke05 {
  position: absolute;
  width: 5%;
  left: 6%;
  top: 26%;
  z-index: 80;
  opacity: 0;
  animation: smoke 4s linear 0s infinite;
}
.Bankee .smoke06 {
  position: absolute;
  width: 8%;
  left: 12%;
  top: 30%;
  z-index: 80;
  opacity: 0;
  animation: smoke 6.6s linear 0.6s infinite;
}
/**************************/
@keyframes btn {
  0% {
    transform: scale(1, 1);
  }
  5% {
    transform: scale(1.1, 1.1);
  }
  10% {
    transform: scale(1, 1);
  }
  15% {
    transform: scale(1.1, 1.1);
  }
  20% {
    transform: scale(1, 1);
  }
  36% {
    transform: rotate(5deg);
  }
  42% {
    transform: rotate(-4deg);
  }
  48% {
    transform: rotate(4deg);
  }
  54% {
    transform: rotate(-4deg);
  }
  60% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
.Block02 {
  position: relative;
  z-index: 700;
  padding: 5vw 0 7vw 0;
}
.Block02 .Text01 {
  font-family: "Microsoft Yahei";
  font-size: 2.5em;
  line-height: 2em;
  font-weight: bold;
  text-align: center;
  margin: 0 0 2em 0;
}
.Block02 .Text01 span {
  display: inline-block;
}
.Block02 .Text01 img {
  display: inline-block;
  padding: 0;
  width: 3.6em;
  height: auto;
  padding: 0 0 0.1em 0;
  vertical-align: text-bottom;
}
.Block02 .Text02 {
  color: #ec0000;
  font-size: 2em;
  line-height: 1em;
  font-weight: bold;
  text-align: center;
  margin: 0 0 1em 0;
}
.myBtn {
  width: 24%;
  margin: 0 auto;
  animation: btn 2s linear infinite;
}
/**************************/
.Block03 {
  position: relative;
  z-index: 700;
  padding: 5vw 0 5vw 0;
  background: #f0f0f0;
  text-align: center;
}
.Block03 .Text01 {
  border-right: 3px solid #ffffff;
  margin: 0 -2px 1.5vw 0;
}
.Block03 .Text02 {
  border-left: 3px solid #c1c1c1;
  margin: 0 0 1.5vw -3px;
}
.Block03 .Text {
  display: inline-block;
  width: 48%;
  background: rgba(44, 42, 185, 0);
  text-align: center;
  vertical-align: top;
}
.Block03 .Text > div {
  position: relative;
  width: 56%;
  margin: 0 auto;
  padding: 3vw 0;
}
.Block03 .Text > div .pic00 {
  width: 100%;
  margin: 0 0 2em 0;
}
.Block03 .Text > div .pic01 {
  position: absolute;
  width: 24%;
  transform: rotate(-10deg);
  left: -4%;
  top: -9%;
}
.Block03 .Text > div .pic02 {
  position: absolute;
  width: 26.6%;
  transform: rotate(10deg);
  right: -14%;
  top: -18%;
}
.Block03 .Text > div .btn02 {
  width: 25%;
  margin: 1em auto 0 auto;
}
.Block03 .Text > div > p {
  color: #4f4f4f;
  text-align: center;
  font-size: 1.5em;
  line-height: 1em;
  font-weight: bold;
}
.Block03 .Text > div > p span {
  font-size: 0.7em;
  font-weight: normal;
}
.noteOpen,
.noteClose {
  position: absolute;
  left: 0;
  top: 0;
}
.noteBtn {
  display: inline-block;
  background: #a4a4a4;
  border-radius: 300px;
  color: #ffffff;
  text-decoration: none;
  font-size: 1.4em;
  line-height: 1em;
  font-weight: bold;
  vertical-align: baseline;
  padding: 0.5em 1.2em 0.5em 1.2em;
  margin: 1em auto 0em auto;
  cursor: pointer;
}
.noteBtn > span {
  position: relative;
  display: inline-block;
  width: 0.8em;
  height: 0.8em;
  margin: 0 0 0 0.5em;
  vertical-align: baseline;
  text-decoration: none;
}
.note {
  font-size: 1.1em;
  line-height: 2em;
  width: 90%;
  margin: 0 auto;
}
.noteBox {
  display: none;
  text-align: left;
  padding: 1em 1.5em;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 50px;
  margin: 1.5em 0 0 0;
}
.note .title {
  color: #6b3fbd;
  font-size: 1.2em;
  line-height: 1em;
  font-weight: bold;
  margin: 2em 0 0.5em 0;
}
.note a {
  color: #825dc7;
  text-decoration: underline;
}
.note a:hover {
  color: #ff8400;
}
.noteNum {
  list-style: decimal;
  padding: 0;
  margin: 0 0 1.6em 1.6em;
}
.noteDot {
  list-style: disc;
  padding: 0;
  margin: 0 0 1.6em 1.6em;
}
/***************************************pad01  start*********************************************/
@media screen and (min-width: 651px) and (max-width: 850px) {
  .loading {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #ffffff;
    z-index: 997;
    left: 0px;
    top: 0px;
    text-align: center;
  }
  .loading > div {
    position: fixed;
    display: inline-block;
    width: 30%;
    left: calc((100% - 30%) / 2);
    top: 25vh;
  }
  #stage {
    position: relative;
    overflow: hidden;
    background: #FFFFFF;
    font-size: calc(100vw / 62);
  }
  header {
    background: #FFFFFF;
    height: 8vw;
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    text-align: left;
  }
  header a {
    height: 4.5vw;
    width: auto;
    margin: 1.5vw 0 0 3vw;
    display: inline-block;
    cursor: pointer;
  }
  /*******************************************/
  .kv {
    position: relative;
    background: url("../images/KV_BG_mo.jpg") center 60vh no-repeat #eee2ff;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    width: 100%;
    z-index: 400;
    overflow: hidden;
  }
  .kv_bottom {
    position: absolute;
    background: url("../images/KV_bottom_mo.png") center bottom no-repeat;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    width: 100%;
    height: 16vh;
    left: 0;
    bottom: 0;
    z-index: 100;
  }
  .kv_main {
    position: relative;
    width: 100%;
    margin: 0vw auto 0 auto;
  }
  .kv_main::after {
    clear: both;
    display: block;
    content: "";
  }
  @keyframes zoomer {
    0% {
      opacity: 0;
      transform: scale(0.1);
    }
    25% {
      opacity: 0.7;
      transform: scale(1.3);
    }
    50% {
      opacity: 1;
      transform: scale(0.7);
    }
    70% {
      opacity: 1;
      transform: scale(1.05);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  @keyframes smoke {
    0% {
      opacity: 0;
      transform: scale(0.3) translate3d(0, 0%, 0) rotate(0deg);
    }
    40% {
      opacity: 1;
      transform: scale(0.6) translate3d(0, -100%, 0) rotate(90deg);
    }
    80% {
      opacity: 0.7;
      transform: scale(1) translate3d(0, -150%, 0) rotate(180deg);
    }
    100% {
      opacity: 0;
      transform: scale(1) translate3d(0, -164%, 0) rotate(200deg);
    }
  }
  @keyframes text {
    0% {
      transform: translate3d(0, 0%, 0);
    }
    50% {
      transform: translate3d(0, -10%, 0);
    }
    100% {
      transform: translate3d(0, 0%, 0);
    }
  }
  .slogan {
    position: relative;
    width: 76%;
    margin: 0 auto;
    z-index: 50;
    float: none;
    opacity: 0;
    animation-duration: 1.2s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
  }
  .slogan .date {
    position: absolute;
    width: 22%;
    right: -5%;
    top: auto;
    bottom: 0%;
    z-index: 50;
    transform: rotate(15deg);
  }
  .slogan .dec01 {
    position: absolute;
    width: 49.82%;
    right: 1.6%;
    top: -5%;
    z-index: 50;
  }
  .slogan .dec02 {
    position: absolute;
    width: 19.7%;
    right: 30%;
    top: auto;
    bottom: 0%;
    z-index: 35;
    transform: rotateY(180deg) rotateZ(30deg);
  }
  .Bankee {
    position: relative;
    width: 50%;
    float: none;
    z-index: 60;
    margin: 0vw auto;
    padding: 7vw 0 4vw 0;
    opacity: 0;
    animation-delay: 0.3s;
    animation-duration: 1.2s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
  }
  .Bankee .dec00 {
    position: relative;
    z-index: 40;
  }
  .Bankee .dec01 {
    display: none;
  }
  .Bankee .dec02 {
    position: absolute;
    width: 25%;
    right: -38%;
    top: 30%;
    z-index: 30;
  }
  .Bankee .dec03 {
    position: absolute;
    width: 56%;
    left: -40%;
    bottom: 9%;
    z-index: 50;
  }
  .Bankee .dec04 {
    position: absolute;
    width: 70%;
    right: auto;
    left: -38%;
    top: 13%;
    z-index: 100;
    animation: text 4.6s ease-out infinite;
  }
  .Bankee .dec05 {
    display: block;
    position: absolute;
    width: 21.55%;
    right: 3%;
    top: 0%;
    z-index: 35;
  }
  .Bankee .smoke01 {
    position: absolute;
    width: 15%;
    right: -8.6%;
    top: 30%;
    z-index: 80;
    opacity: 0;
    animation: smoke 6s linear infinite;
  }
  .Bankee .smoke02 {
    position: absolute;
    width: 6%;
    right: -10%;
    top: 0%;
    z-index: 80;
    opacity: 0;
    animation: smoke 4s linear 0s infinite;
  }
  .Bankee .smoke03 {
    position: absolute;
    width: 11%;
    right: 0%;
    top: -10%;
    z-index: 80;
    opacity: 0;
    animation: smoke 5s linear 1.5s infinite;
  }
  .Bankee .smoke04 {
    position: absolute;
    width: 9%;
    right: 40%;
    top: 0%;
    z-index: 80;
    opacity: 0;
    animation: smoke 10s linear 0s infinite;
  }
  .Bankee .smoke05 {
    position: absolute;
    width: 5%;
    left: 6%;
    top: 26%;
    z-index: 80;
    opacity: 0;
    animation: smoke 4s linear 0s infinite;
  }
  .Bankee .smoke06 {
    position: absolute;
    width: 8%;
    left: 12%;
    top: 30%;
    z-index: 80;
    opacity: 0;
    animation: smoke 6.6s linear 0.6s infinite;
  }
  /**************************/
  .Block02 {
    position: relative;
    padding: 12vw 0 12vw 0;
    background: #ffffff;
    z-index: 700;
  }
  .Block02 .Text01 {
    font-family: "Microsoft Yahei";
    font-size: 2.5em;
    line-height: 2em;
    font-weight: bold;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .Block02 .Text01 span {
    display: inline-block;
  }
  .Block02 .Text01 img {
    display: inline-block;
    padding: 0;
    width: 3.6em;
    height: auto;
    padding: 0 0 0.1em 0;
    vertical-align: text-bottom;
  }
  .myBtn {
    width: 40%;
    margin: 0 auto;
    animation: btn 2s linear infinite;
  }
  /**************************/
  .Block03 {
    position: relative;
    z-index: 700;
    padding: 8vw 0 10vw 0;
    background: #f0f0f0;
    text-align: center;
  }
  .Block03 .Text01 {
    border-right: 0px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    margin: 0 auto 0vw auto;
  }
  .Block03 .Text02 {
    border-left: 0px solid #c1c1c1;
    border-top: 2px solid #c1c1c1;
    margin: 0 auto 1.5em auto;
  }
  .Block03 .Text {
    display: block;
    width: 90%;
    background: rgba(44, 42, 185, 0);
    text-align: center;
    vertical-align: top;
  }
  .Block03 .Text > div {
    position: relative;
    width: 56%;
    margin: 0 auto;
    padding: 3vw 0;
  }
  .Block03 .Text > div .pic00 {
    width: 100%;
    margin: 0 0 2em 0;
  }
  .Block03 .Text > div .pic01 {
    position: relative;
    width: 22%;
    transform: rotate(0deg);
    left: auto;
    top: auto;
    margin: 0 auto;
  }
  .Block03 .Text > div .pic02 {
    position: relative;
    width: 22%;
    transform: rotate(0deg);
    right: auto;
    top: auto;
    margin: 0 auto 1em auto;
  }
  .Block03 .Text > div > p {
    color: #4f4f4f;
    text-align: center;
    font-size: 1.5em;
    line-height: 1em;
    font-weight: bold;
  }
  .Block03 .Text > div > p span {
    font-size: 0.7em;
    font-weight: normal;
  }
  .note {
    font-size: 1.3em;
    line-height: 2em;
    width: 90%;
    margin: 0 auto;
  }
}
/***************************************pad02  start*********************************************/
@media screen and (min-width: 441px) and (max-width: 650px) {
  .loading {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #ffffff;
    z-index: 997;
    left: 0px;
    top: 0px;
    text-align: center;
  }
  .loading > div {
    position: fixed;
    display: inline-block;
    width: 30%;
    left: calc((100% - 30%) / 2);
    top: 25vh;
  }
  #stage {
    position: relative;
    overflow: hidden;
    background: #FFFFFF;
    font-size: calc(100vw / 60);
  }
  header {
    background: #FFFFFF;
    height: 9vw;
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    text-align: left;
  }
  header a {
    height: 5vw;
    width: auto;
    margin: 2vw 0 0 3vw;
    display: inline-block;
    cursor: pointer;
  }
  /*******************************************/
  .kv {
    position: relative;
    background: url("../images/KV_BG_mo.jpg") center 60vh no-repeat #eee2ff;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    width: 100%;
    z-index: 400;
    overflow: hidden;
  }
  .kv_bottom {
    position: absolute;
    background: url("../images/KV_bottom_mo.png") center bottom no-repeat;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    width: 100%;
    height: 16vh;
    left: 0;
    bottom: 0;
    z-index: 100;
  }
  .kv_main {
    position: relative;
    width: 100%;
    margin: 0vw auto 0 auto;
  }
  .kv_main::after {
    clear: both;
    display: block;
    content: "";
  }
  @keyframes zoomer {
    0% {
      opacity: 0;
      transform: scale(0.1);
    }
    25% {
      opacity: 0.7;
      transform: scale(1.3);
    }
    50% {
      opacity: 1;
      transform: scale(0.7);
    }
    70% {
      opacity: 1;
      transform: scale(1.05);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  @keyframes smoke {
    0% {
      opacity: 0;
      transform: scale(0.3) translate3d(0, 0%, 0) rotate(0deg);
    }
    40% {
      opacity: 1;
      transform: scale(0.6) translate3d(0, -100%, 0) rotate(90deg);
    }
    80% {
      opacity: 0.7;
      transform: scale(1) translate3d(0, -150%, 0) rotate(180deg);
    }
    100% {
      opacity: 0;
      transform: scale(1) translate3d(0, -164%, 0) rotate(200deg);
    }
  }
  @keyframes text {
    0% {
      transform: translate3d(0, 0%, 0);
    }
    50% {
      transform: translate3d(0, -10%, 0);
    }
    100% {
      transform: translate3d(0, 0%, 0);
    }
  }
  .slogan {
    position: relative;
    width: 82%;
    margin: 0 auto;
    z-index: 50;
    float: none;
    opacity: 0;
    animation-duration: 1.2s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
  }
  .slogan .date {
    position: absolute;
    width: 22%;
    right: -5%;
    top: auto;
    bottom: 0%;
    z-index: 50;
    transform: rotate(15deg);
  }
  .slogan .dec01 {
    position: absolute;
    width: 49.82%;
    right: 1.6%;
    top: -5%;
    z-index: 50;
  }
  .slogan .dec02 {
    position: absolute;
    width: 19.7%;
    right: 30%;
    top: auto;
    bottom: 0%;
    z-index: 35;
    transform: rotateY(180deg) rotateZ(30deg);
  }
  .Bankee {
    position: relative;
    width: 50%;
    float: none;
    z-index: 40;
    margin: 0vw auto 0 auto;
    padding: 12vw 0 2vw 0;
    opacity: 0;
    animation-delay: 0.3s;
    animation-duration: 1.2s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
  }
  .Bankee .dec00 {
    position: relative;
    z-index: 40;
  }
  .Bankee .dec01 {
    display: none;
  }
  .Bankee .dec02 {
    position: absolute;
    width: 25%;
    right: -38%;
    top: 40%;
    z-index: 30;
  }
  .Bankee .dec03 {
    position: absolute;
    width: 56%;
    left: -40%;
    bottom: 5%;
    z-index: 50;
  }
  .Bankee .dec04 {
    position: absolute;
    width: 75%;
    right: auto;
    left: -38%;
    top: 12%;
    z-index: 100;
    animation: text 4.6s ease-out infinite;
  }
  .Bankee .dec05 {
    display: block;
    position: absolute;
    width: 21.55%;
    right: 3%;
    top: 3%;
    z-index: 35;
  }
  .Bankee .smoke01 {
    position: absolute;
    width: 15%;
    right: -8.6%;
    top: 30%;
    z-index: 80;
    opacity: 0;
    animation: smoke 6s linear infinite;
  }
  .Bankee .smoke02 {
    position: absolute;
    width: 6%;
    right: -10%;
    top: 0%;
    z-index: 80;
    opacity: 0;
    animation: smoke 4s linear 0s infinite;
  }
  .Bankee .smoke03 {
    position: absolute;
    width: 11%;
    right: 0%;
    top: -10%;
    z-index: 80;
    opacity: 0;
    animation: smoke 5s linear 1.5s infinite;
  }
  .Bankee .smoke04 {
    position: absolute;
    width: 9%;
    right: 40%;
    top: 0%;
    z-index: 80;
    opacity: 0;
    animation: smoke 10s linear 0s infinite;
  }
  .Bankee .smoke05 {
    position: absolute;
    width: 5%;
    left: 6%;
    top: 26%;
    z-index: 80;
    opacity: 0;
    animation: smoke 4s linear 0s infinite;
  }
  .Bankee .smoke06 {
    position: absolute;
    width: 8%;
    left: 12%;
    top: 30%;
    z-index: 80;
    opacity: 0;
    animation: smoke 6.6s linear 0.6s infinite;
  }
  /**************************/
  .Block02 {
    position: relative;
    z-index: 700;
    padding: 12vw 0 12vw 0;
  }
  .Block02 .Text01 {
    font-family: "Microsoft Yahei";
    font-size: 2.5em;
    line-height: 2em;
    font-weight: bold;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .Block02 .Text01 span {
    display: inline-block;
  }
  .Block02 .Text01 img {
    display: inline-block;
    padding: 0;
    width: 3.6em;
    height: auto;
    padding: 0 0 0.1em 0;
    vertical-align: text-bottom;
  }
  .myBtn {
    width: 40%;
    margin: 0 auto;
    animation: btn 2s linear infinite;
  }
  /**************************/
  .Block03 {
    position: relative;
    z-index: 700;
    padding: 8vw 0 6vw 0;
    background: #f0f0f0;
    text-align: center;
  }
  .Block03 .Text01 {
    border-right: 0px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    margin: 0 auto 0vw auto;
  }
  .Block03 .Text02 {
    border-left: 0px solid #c1c1c1;
    border-top: 2px solid #c1c1c1;
    margin: 0 auto 0em auto;
  }
  .Block03 .Text {
    display: block;
    width: 90%;
    background: rgba(44, 42, 185, 0);
    text-align: center;
    vertical-align: top;
  }
  .Block03 .Text > div {
    position: relative;
    width: 70%;
    margin: 0 auto;
    padding: 5vw 0;
  }
  .Block03 .Text > div .pic00 {
    width: 100%;
    margin: 0 0 2em 0;
  }
  .Block03 .Text > div .pic01 {
    position: relative;
    width: 22%;
    transform: rotate(0deg);
    left: auto;
    top: auto;
    margin: 0 auto;
  }
  .Block03 .Text > div .pic02 {
    position: relative;
    width: 22%;
    transform: rotate(0deg);
    right: auto;
    top: auto;
    margin: 0 auto 1em auto;
  }
  .Block03 .Text > div > p {
    color: #4f4f4f;
    text-align: center;
    font-size: 2em;
    line-height: 1em;
    font-weight: bold;
  }
  .Block03 .Text > div > p span {
    font-size: 0.7em;
    font-weight: normal;
  }
  .note {
    font-size: 1.6em;
    line-height: 2em;
    width: 90%;
    margin: 0 auto;
  }
}
/***************************************mobile start*********************************************/
@media screen and (max-width: 440px) {
  .loading {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #ffffff;
    z-index: 998;
    left: 0px;
    top: 0px;
    text-align: center;
  }
  .loading > div {
    position: fixed;
    display: inline-block;
    width: 46%;
    left: calc((100% - 46%) / 2);
    top: 25vh;
  }
  #stage {
    position: relative;
    overflow: hidden;
    background: #FFFFFF;
    font-size: calc(100vw / 44);
  }
  header {
    background: #FFFFFF;
    height: 12vw;
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    text-align: left;
  }
  header a {
    height: 7vw;
    width: auto;
    margin: 2.5vw 0 0 3vw;
    display: inline-block;
    cursor: pointer;
  }
  /*******************************************/
  .kv {
    position: relative;
    background: url("../images/KV_BG_mo.jpg") center 53vh no-repeat #eee2ff;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    width: 100%;
    z-index: 400;
    overflow: hidden;
  }
  .kv_bottom {
    position: absolute;
    background: url("../images/KV_bottom_mo.png") center bottom no-repeat;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    width: 100%;
    height: 16vh;
    left: 0;
    bottom: 0;
    z-index: 100;
  }
  .kv_main {
    position: relative;
    width: 100%;
    margin: 7vw auto 0 auto;
  }
  .kv_main::after {
    clear: both;
    display: block;
    content: "";
  }
  @keyframes zoomer {
    0% {
      opacity: 0;
      transform: scale(0.1);
    }
    25% {
      opacity: 0.7;
      transform: scale(1.3);
    }
    50% {
      opacity: 1;
      transform: scale(0.7);
    }
    70% {
      opacity: 1;
      transform: scale(1.05);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  @keyframes smoke {
    0% {
      opacity: 0;
      transform: scale(0.3) translate3d(0, 0%, 0) rotate(0deg);
    }
    40% {
      opacity: 1;
      transform: scale(0.6) translate3d(0, -100%, 0) rotate(90deg);
    }
    80% {
      opacity: 0.7;
      transform: scale(1) translate3d(0, -150%, 0) rotate(180deg);
    }
    100% {
      opacity: 0;
      transform: scale(1) translate3d(0, -164%, 0) rotate(200deg);
    }
  }
  @keyframes text {
    0% {
      transform: translate3d(0, 0%, 0);
    }
    50% {
      transform: translate3d(0, -10%, 0);
    }
    100% {
      transform: translate3d(0, 0%, 0);
    }
  }
  .slogan {
    position: relative;
    width: 94%;
    margin: 0 auto;
    z-index: 50;
    float: none;
    opacity: 0;
    animation-duration: 1.2s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
  }
  .slogan .date {
    position: absolute;
    width: 22%;
    right: -2%;
    top: auto;
    bottom: 0%;
    z-index: 50;
    transform: rotate(15deg);
  }
  .slogan .dec01 {
    position: absolute;
    width: 49.82%;
    right: 1.6%;
    top: -5%;
    z-index: 50;
  }
  .slogan .dec02 {
    position: absolute;
    width: 19.7%;
    right: 30%;
    top: auto;
    bottom: 0%;
    z-index: 35;
    transform: rotateY(180deg) rotateZ(30deg);
  }
  .Bankee {
    position: relative;
    width: 56%;
    float: none;
    z-index: 40;
    margin: 0vw auto 0 auto;
    padding: 12vw 0 3vw 0;
    opacity: 0;
    animation-delay: 0.3s;
    animation-duration: 1.2s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
  }
  .Bankee .dec00 {
    position: relative;
    z-index: 40;
  }
  .Bankee .dec01 {
    display: none;
  }
  .Bankee .dec02 {
    position: absolute;
    width: 23%;
    right: -32%;
    top: 22%;
    z-index: 30;
  }
  .Bankee .dec03 {
    position: absolute;
    width: 56%;
    left: -35%;
    bottom: 5%;
    z-index: 50;
  }
  .Bankee .dec04 {
    position: absolute;
    width: 80%;
    right: auto;
    left: -31%;
    top: 7%;
    z-index: 100;
    animation: text 4.6s ease-out infinite;
  }
  .Bankee .dec05 {
    display: block;
    position: absolute;
    width: 21.55%;
    right: 3%;
    top: 6%;
    z-index: 35;
  }
  .Bankee .smoke01 {
    position: absolute;
    width: 15%;
    right: -8.6%;
    top: 30%;
    z-index: 80;
    opacity: 0;
    animation: smoke 6s linear infinite;
  }
  .Bankee .smoke02 {
    position: absolute;
    width: 6%;
    right: -10%;
    top: 0%;
    z-index: 80;
    opacity: 0;
    animation: smoke 4s linear 0s infinite;
  }
  .Bankee .smoke03 {
    position: absolute;
    width: 11%;
    right: 0%;
    top: -10%;
    z-index: 80;
    opacity: 0;
    animation: smoke 5s linear 1.5s infinite;
  }
  .Bankee .smoke04 {
    position: absolute;
    width: 9%;
    right: 40%;
    top: 0%;
    z-index: 80;
    opacity: 0;
    animation: smoke 10s linear 0s infinite;
  }
  .Bankee .smoke05 {
    position: absolute;
    width: 5%;
    left: 6%;
    top: 26%;
    z-index: 80;
    opacity: 0;
    animation: smoke 4s linear 0s infinite;
  }
  .Bankee .smoke06 {
    position: absolute;
    width: 8%;
    left: 12%;
    top: 30%;
    z-index: 80;
    opacity: 0;
    animation: smoke 6.6s linear 0.6s infinite;
  }
  /**************************/
  .Block02 {
    position: relative;
    z-index: 700;
    padding: 20vw 0 12vw 0;
  }
  .Block02 .Text01 {
    font-family: "Microsoft Yahei";
    font-size: 2.5em;
    line-height: 1.5em;
    font-weight: bold;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .Block02 .Text01 span {
    display: inline-block;
  }
  .Block02 .Text01 img {
    display: inline-block;
    padding: 0;
    width: 3.6em;
    height: auto;
    padding: 0.8em 0 0.25em 0;
    vertical-align: text-bottom;
  }
  .myBtn {
    width: 50%;
    margin: 0 auto;
    animation: btn 2s linear infinite;
  }
  /**************************/
  .Block03 {
    position: relative;
    z-index: 700;
    padding: 8vw 0 10vw 0;
    background: #f0f0f0;
    text-align: center;
  }
  .Block03 .Text01 {
    border-right: 0px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    margin: 0 auto 0vw auto;
  }
  .Block03 .Text02 {
    border-left: 0px solid #c1c1c1;
    border-top: 2px solid #c1c1c1;
    margin: 0 auto 0em auto;
  }
  .Block03 .Text {
    display: block;
    width: 90%;
    background: rgba(44, 42, 185, 0);
    text-align: center;
    vertical-align: top;
  }
  .Block03 .Text > div {
    position: relative;
    width: 80%;
    margin: 0 auto;
    padding: 5vw 0;
  }
  .Block03 .Text > div .pic00 {
    width: 100%;
    margin: 0 0 2em 0;
  }
  .Block03 .Text > div .pic01 {
    position: relative;
    width: 22%;
    transform: rotate(0deg);
    left: auto;
    top: auto;
    margin: 0 auto 0.5em auto;
  }
  .Block03 .Text > div .pic02 {
    position: relative;
    width: 22%;
    transform: rotate(0deg);
    right: auto;
    top: auto;
    margin: 0 auto 1.2em auto;
    padding: 2em 0 0 0;
  }
  .Block03 .Text > div > p {
    color: #4f4f4f;
    text-align: center;
    font-size: 2em;
    line-height: 1em;
    font-weight: bold;
  }
  .Block03 .Text > div > p span {
    font-size: 0.9em;
    font-weight: normal;
  }
  .noteBtn {
    display: inline-block;
    background: #a4a4a4;
    border-radius: 300px;
    color: #ffffff;
    text-decoration: none;
    font-size: 1.2em;
    line-height: 1em;
    font-weight: bold;
    vertical-align: baseline;
    padding: 0.5em 1.2em 0.5em 1.2em;
    margin: 1em auto 0em auto;
    cursor: pointer;
  }
  .noteBtn > span {
    position: relative;
    display: inline-block;
    width: 0.8em;
    height: 0.8em;
    margin: 0 0 0 0.5em;
    vertical-align: baseline;
  }
  .note {
    font-size: 1.8em;
    line-height: 2em;
    width: 90%;
    margin: 0 auto;
  }
  .noteBox {
    display: none;
    text-align: left;
    padding: 1em 1.5em;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 20px;
    margin: 1.5em 0 0 0;
  }
}