@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 4%;
  margin: 0px auto;
  max-width: 1500px;
  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;
}
/**************************/
@keyframes sloagn {
  0% {
    transform: translate(-100%, 0);
    opacity: 0;
  }
  100% {
    transform: translate(0, 0);
    opacity: 1;
  }
}
@keyframes card {
  0% {
    transform: translate(100%, 0);
    opacity: 0;
  }
  100% {
    transform: translate(0, 0);
    opacity: 1;
  }
}
.kv {
  padding: 0 0 6vw 0;
  background: url("../images/kv_BG01.jpg") center top no-repeat #6c5faf;
  -moz-background-size: 100% auto;
  -webkit-background-size: 100% auto;
  -o-background-size: 100% auto;
  background-size: 100% auto;
  text-align: center;
}
.kvLeft {
  display: inline-block;
  width: 60%;
  margin: 7.6vw 2vw 0 0;
  vertical-align: top;
  animation: sloagn 0.5s ease-in forwards 0s 1;
}
.kvLeft > div:nth-child(2) {
  width: 60%;
  margin: 3vw auto 0 auto;
}
.kvRight {
  display: inline-block;
  width: 29.3%;
  margin: 5vw 2vw 0 auto;
  vertical-align: top;
  animation: card 0.5s ease-in forwards 0s 1;
}
header {
  background: #FFFFFF;
  height: 3vw;
  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 img {
  height: 100%;
  width: auto;
  display: block;
}
header a {
  height: 2vw;
  width: auto;
  margin: 0.5vw 0 0 2vw;
  display: inline-block;
  cursor: pointer;
}
/***************************/
.block02 {
  padding: 6.4vw 0;
  background: #3a3773;
}
.block02 span {
  display: inline-block;
}
.block02 b {
  color: #ffd33c;
}
.block02 .txt01 {
  font-size: 1.8em;
  color: #ffffff;
  text-align: center;
  line-height: 1.6em;
  margin: 0 0 3vw 0;
}
.block02 .txt02 {
  font-size: 2.6em;
  color: #ffffff;
  text-align: center;
  line-height: 1.6em;
}
/***************************/
.block03 {
  padding: 6.4vw 0;
  background: url("../images/kv_BG02.jpg") center top repeat-y;
  -moz-background-size: 110% auto;
  -webkit-background-size: 110% auto;
  -o-background-size: 110% auto;
  background-size: 110% auto;
}
/***************************/
.title-A {
  position: relative;
  width: 70%;
  margin: 0 auto;
  text-align: center;
}
.title-A img {
  height: 100%;
  width: auto;
}
.title-A .line {
  position: absolute;
  width: 100%;
  height: 2px;
  background: #8576d1;
  left: 0;
  top: 50%;
  z-index: 10;
}
.title-A .pic {
  display: inline-block;
  position: relative;
  z-index: 15;
  height: 3em;
  background: #6c5fb0;
  width: auto;
  padding: 0 2em;
}
.title-D {
  position: relative;
  width: 70%;
  margin: 0 auto;
  text-align: center;
}
.title-D img {
  height: 100%;
  width: auto;
}
.title-D .line {
  position: absolute;
  width: 100%;
  height: 2px;
  background: #bdb9f0;
  left: 0;
  top: 50%;
  z-index: 10;
}
.title-D .pic {
  display: inline-block;
  position: relative;
  z-index: 15;
  height: 3em;
  background: #928dd6;
  width: auto;
  padding: 0 2em;
}
.title-B {
  width: 18%;
  margin: 3.4vw auto 0 auto;
}
.partition {
  background: url("../images/line.png") right top repeat-x;
  height: 6px;
  width: 100%;
  margin: 0 auto 0 auto;
}
.backup {
  text-align: right;
  font-size: 1.2em;
  line-height: 1.4em;
  color: #cec5ff;
  width: 100%;
  margin: 1vw auto 0 auto;
  padding: 0 4% 3em 0;
}
.awardBox1 {
  padding: 3vw 0;
  text-align: center;
}
.awardBox1 .card {
  display: inline-block;
  width: 32%;
  vertical-align: top;
  margin: 1.6em 3vw 0 0;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 8px 8px 0px #5c5196;
}
.awardBox1 .text {
  display: inline-block;
  vertical-align: top;
  text-align: center;
}
.awardBox1 .text > div:nth-child(1) {
  /***姓名***/
  font-size: 1.6em;
  color: #ffffff;
  margin: 0 0 2em 0;
}
.awardBox1 .text > div:nth-child(1) span {
  display: inline-block;
  margin: 0 0.5em;
}
.awardBox1 .text > div:nth-child(2) {
  /***標題***/
  font-size: 3.4em;
  color: #ffffff;
  font-weight: bold;
  margin: 0 0 0.4em 0;
}
.awardBox1 .text > div:nth-child(3) {
  /***內文***/
  font-size: 1.6em;
  line-height: 1.5em;
  color: #ffffff;
  margin: 0 0 2em 0;
}
.awardBox1 .text > div:nth-child(3) span {
  display: inline-block;
}
.awardBox1 .text > div:nth-child(4) {
  /***製卡***/
  display: inline-block;
  border-radius: 300px;
  font-size: 1.2em;
  color: #cec5ff;
  background: #5c509e;
  padding: 0.5em 1em;
}
.awardBox2 {
  text-align: center;
}
.awardBox2 img {
  height: 100%;
  width: auto;
}
.awardBox2 .title-C {
  display: inline-block;
  vertical-align: top;
}
.awardBox2 .title-C > div:nth-child(1) {
  /***.***/
  display: inline-block;
  height: 0.8em;
  vertical-align: bottom;
  margin: 0 0 0.8em 0;
}
.awardBox2 .title-C > div:nth-child(2) {
  /***獎***/
  display: inline-block;
  height: 2.4em;
  vertical-align: bottom;
}
.awardBox2 .title-C > div:nth-child(3) {
  /***分隔***/
  display: inline-block;
  height: 1.2em;
  vertical-align: bottom;
  margin: 0 1.6em;
}
.awardBox2 .text {
  display: inline-block;
  width: 76%;
  vertical-align: top;
  text-align: left;
}
.awardBox2 .gift {
  text-align: left;
  height: 2.4em;
}
.awardBox2 .name {
  font-size: 1.6em;
  color: #ffffff;
  text-align: left;
  margin: 0 0 2em 0;
}
.awardBox2 .name > div {
  display: inline-block;
  width: 47%;
  padding: 1em 0 0 0;
}
.awardBox2 .name > div:nth-child(odd) {
  margin: 0 4% 0 0;
}
.awardBox2 .name2 {
  font-size: 1.6em;
  color: #ffffff;
  text-align: left;
  margin: 0 0 2em 0;
}
.awardBox2 .name2 > div {
  display: inline-block;
  width: 30%;
  padding: 1em 0 0 0;
}
.awardBox2 .name2 > div:nth-child(3n+2) {
  margin: 0 4%;
}
.awardBox2 .partition {
  background: url("../images/line.png") right top repeat-x;
  height: 6px;
  width: 100%;
  margin: 3em auto 3.6em auto;
}
/***************************/
.block04 {
  padding: 6.4vw 0;
  background: #928dd6;
  color: #ffffff;
}
.block04 .text {
  font-size: 1.4em;
  line-height: 1.4em;
  text-align: center;
  margin: 1em 0 1.4em 0;
}
.block04 .listDot {
  list-style: disc;
  width: 98%;
  font-size: 1.4em;
  line-height: 1.4em;
  text-align: left;
  padding: 0;
  margin: 0 auto 0 2%;
}
.block04 .listDot li {
  padding: 0 0 0.5em 0;
}
/***************************/
@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);
  }
}
.block05 {
  padding: 6.4vw 0 0 0;
  background: #6c5fb0;
  text-align: center;
}
.block05 .text {
  display: inline-block;
  margin: 0 4vw 3vw 0;
  vertical-align: middle;
}
.block05 .text img {
  height: 100%;
  width: auto;
}
.block05 .text > div:nth-child(1) {
  /***標題****/
  display: inline-block;
  height: 3em;
  margin: 0 0 1.5em 0;
}
.block05 .text > div:nth-child(2) {
  /***內文****/
  font-size: 1.6em;
  line-height: 1.6em;
  color: #ffffff;
  text-align: center;
  margin: 0 0 1.5em 0;
}
.block05 .text > div:nth-child(2) > span {
  display: inline-block;
}
.block05 .text > a {
  display: inline-block;
  height: 4.8em;
  animation: btn 2s linear infinite;
}
.block05 .pic {
  display: inline-block;
  width: 40%;
  vertical-align: middle;
  border: 3px solid #ffffff;
  border-radius: 20px;
  overflow: hidden;
  margin: 0 0 4vw 0;
  background: #ffffff;
}
/***************************/
.block06 {
  padding: 4vw 0 4vw 0;
  background: #6c5fb0;
  text-align: center;
}
.noteBtn {
  position: relative;
  width: 20%;
  cursor: pointer;
  margin: 0 auto 2vw auto;
}
.noteBtn .pic {
  position: relative;
  z-index: 10;
}
.noteBtnClose {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 15;
}
.noteBox {
  display: none;
  font-size: 1.4em;
  line-height: 1.6em;
  color: #ffffff;
  text-align: left;
}
.noteBox .listNum {
  list-style: decimal;
  padding: 0;
  margin: 0 0 0 1.5em;
}
.noteBox li {
  padding: 0 0 1em 0;
}
.noteBox a {
  text-decoration: underline;
  color: #8fea30;
}
.noteBox a:hover {
  color: #8fea30;
}
/***************************************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 / 60);
  }
  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;
  }
  .pc {
    display: none;
  }
  .mo {
    display: block;
  }
  .kv {
    padding: 0 0 8vw 0;
    background: url("../images/kv_BG01m.jpg") center top no-repeat #6c5faf;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    text-align: center;
    min-height: 88vh;
  }
  .kvLeft {
    display: block;
    width: 90%;
    margin: 0 auto;
    vertical-align: top;
    animation: sloagn 0.5s ease-in forwards 0s 1;
  }
  .kvLeft > div:nth-child(3) {
    width: 70%;
    margin: 3vw auto 0 auto;
  }
  .kvLeft > div:nth-child(4) {
    width: 80%;
    margin: 6vw auto 4vw auto;
  }
  .kvRight {
    display: block;
    width: 36%;
    margin: 0 auto;
    vertical-align: top;
    padding: 0 4vw 0 0;
    animation: card 0.5s ease-in forwards 0s 1;
  }
  /***************************/
  .block02 {
    padding: 10vw 0;
    background: #3a3773;
  }
  /***************************/
  .block03 {
    padding: 10vw 0;
    background: url("../images/kv_BG01m.jpg") center top repeat-y;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
  }
  /***************************/
  .title-A {
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }
  .title-D {
    position: relative;
    width: 70%;
    margin: 0 auto;
    text-align: center;
  }
  .title-D img {
    height: 100%;
    width: auto;
  }
  .title-D .line {
    position: absolute;
    width: 100%;
    height: 2px;
    background: #bdb9f0;
    left: 0;
    top: 50%;
    z-index: 10;
  }
  .title-D .pic {
    display: inline-block;
    position: relative;
    z-index: 15;
    height: 3em;
    background: #928dd6;
    width: auto;
    padding: 0 2em;
  }
  .title-B {
    width: 30%;
    margin: 6vw auto 0 auto;
  }
  .partition {
    background: url("../images/line.png") right top repeat-x;
    height: 6px;
    width: 100%;
    margin: 2em auto;
  }
  .backup {
    text-align: right;
    font-size: 1.2em;
    line-height: 1.4em;
    color: #cec5ff;
    width: 100%;
    margin: 1vw auto 0 auto;
    padding: 0 4% 3em 0;
  }
  .awardBox1 {
    padding: 3vw 0;
    text-align: center;
  }
  .awardBox1 .card {
    display: block;
    width: 50%;
    vertical-align: top;
    margin: 0em auto 3em auto;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 8px 8px 0px #5c5196;
  }
  .awardBox2 {
    text-align: center;
  }
  .awardBox2 img {
    height: 100%;
    width: auto;
  }
  .awardBox2 .title-C {
    display: block;
    width: 100%;
    vertical-align: top;
    margin: 0 auto;
  }
  .awardBox2 .title-C > div:nth-child(1) {
    /***.***/
    display: none;
  }
  .awardBox2 .title-C > div:nth-child(2) {
    /***獎***/
    display: inline-block;
    height: 3em;
    vertical-align: bottom;
  }
  .awardBox2 .title-C > div:nth-child(3) {
    /***分隔***/
    display: none;
  }
  .awardBox2 .text {
    display: block;
    width: 100%;
    vertical-align: top;
    text-align: center;
    margin: 2em 0 0 0;
  }
  .awardBox2 .gift {
    text-align: center;
    height: 2.4em;
    display: inline-block;
    margin: 0 0 1em 0;
  }
  .awardBox2 .name {
    font-size: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .awardBox2 .name > div {
    display: inline-block;
    width: 49%;
    padding: 1em 0 0 0;
    margin: 0 auto;
  }
  .awardBox2 .name > div:nth-child(odd) {
    margin: 0 auto;
  }
  .awardBox2 .name2 {
    font-size: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .awardBox2 .name2 > div {
    display: inline-block;
    width: 32%;
    padding: 1em 0 0 0;
  }
  .awardBox2 .name2 > div:nth-child(3n+2) {
    margin: 0 0%;
  }
  .awardBox2 .partition {
    background: url("../images/line.png") right top repeat-x;
    height: 6px;
    width: 100%;
    margin: 3em auto 3.6em auto;
  }
  /***************************/
  .block04 {
    padding: 10vw 0;
    background: #928dd6;
    color: #ffffff;
  }
  .block04 .text {
    font-size: 1.4em;
    line-height: 1.4em;
    text-align: left;
    margin: 1em 0 1.4em 0;
  }
  .block04 .listDot {
    list-style: disc;
    width: 98%;
    font-size: 1.4em;
    line-height: 1.4em;
    text-align: left;
    padding: 0;
    margin: 0 auto 0 1.5em;
  }
  .block04 .listDot li {
    padding: 0 0 0.5em 0;
  }
  /***************************/
  .block05 {
    padding: 10vw 0 0 0;
    background: #6c5fb0;
    text-align: center;
  }
  .block05 .text {
    display: inline-block;
    margin: 0 2vw 2vw 0;
    vertical-align: middle;
  }
  .block05 .text img {
    height: 100%;
    width: auto;
  }
  .block05 .text > div:nth-child(1) {
    /***標題****/
    height: 2.4em;
    margin: 0 0 1.5em 0;
  }
  .block05 .text > div:nth-child(2) {
    /***內文****/
    font-size: 1.6em;
    line-height: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 1em 0;
  }
  .block05 .text > a {
    display: inline-block;
    height: 4em;
    animation: btn 2s linear infinite;
  }
  .block05 .pic {
    display: inline-block;
    width: 44%;
    vertical-align: middle;
    border: 3px solid #ffffff;
    border-radius: 20px;
    overflow: hidden;
    margin: 0 0 4vw 0;
    background: #ffffff;
  }
  /***************************/
  .block06 {
    padding: 6vw 0 6vw 0;
    background: #6c5fb0;
    text-align: center;
    margin: -2em 0 0 0;
  }
  .noteBtn {
    position: relative;
    width: 26%;
    cursor: pointer;
    margin: 0 auto 2vw 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;
  }
  .pc {
    display: none;
  }
  .mo {
    display: block;
  }
  .kv {
    padding: 0 0 8vw 0;
    background: url("../images/kv_BG01m.jpg") center top no-repeat #6c5faf;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    text-align: center;
    min-height: 88vh;
  }
  .kvLeft {
    display: block;
    width: 90%;
    margin: 0 auto;
    vertical-align: top;
    animation: sloagn 0.5s ease-in forwards 0s 1;
  }
  .kvLeft > div:nth-child(3) {
    width: 70%;
    margin: 3vw auto 0 auto;
  }
  .kvLeft > div:nth-child(4) {
    width: 80%;
    margin: 6vw auto 4vw auto;
  }
  .kvRight {
    display: block;
    width: 36%;
    margin: 0 auto;
    vertical-align: top;
    padding: 0 4vw 0 0;
    animation: card 0.5s ease-in forwards 0s 1;
  }
  /***************************/
  .block02 {
    padding: 10vw 0;
    background: #3a3773;
  }
  /***************************/
  .block03 {
    padding: 10vw 0;
    background: url("../images/kv_BG01m.jpg") center top repeat-y;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
  }
  /***************************/
  .title-A {
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }
  .title-D {
    position: relative;
    width: 70%;
    margin: 0 auto;
    text-align: center;
  }
  .title-D img {
    height: 100%;
    width: auto;
  }
  .title-D .line {
    position: absolute;
    width: 100%;
    height: 2px;
    background: #bdb9f0;
    left: 0;
    top: 50%;
    z-index: 10;
  }
  .title-D .pic {
    display: inline-block;
    position: relative;
    z-index: 15;
    height: 3em;
    background: #928dd6;
    width: auto;
    padding: 0 2em;
  }
  .title-B {
    width: 30%;
    margin: 6vw auto 0 auto;
  }
  .partition {
    background: url("../images/line.png") right top repeat-x;
    height: 6px;
    width: 100%;
    margin: 2em auto;
  }
  .backup {
    text-align: right;
    font-size: 1.2em;
    line-height: 1.4em;
    color: #cec5ff;
    width: 100%;
    margin: 1vw auto 0 auto;
    padding: 0 4% 3em 0;
  }
  .awardBox1 {
    padding: 3vw 0;
    text-align: center;
  }
  .awardBox1 .card {
    display: block;
    width: 50%;
    vertical-align: top;
    margin: 0em auto 3em auto;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 8px 8px 0px #5c5196;
  }
  .awardBox2 {
    text-align: center;
  }
  .awardBox2 img {
    height: 100%;
    width: auto;
  }
  .awardBox2 .title-C {
    display: block;
    width: 100%;
    vertical-align: top;
    margin: 0 auto;
  }
  .awardBox2 .title-C > div:nth-child(1) {
    /***.***/
    display: none;
  }
  .awardBox2 .title-C > div:nth-child(2) {
    /***獎***/
    display: inline-block;
    height: 3em;
    vertical-align: bottom;
  }
  .awardBox2 .title-C > div:nth-child(3) {
    /***分隔***/
    display: none;
  }
  .awardBox2 .text {
    display: block;
    width: 100%;
    vertical-align: top;
    text-align: center;
    margin: 2em 0 0 0;
  }
  .awardBox2 .gift {
    text-align: center;
    height: 2.4em;
    display: inline-block;
    margin: 0 0 1em 0;
  }
  .awardBox2 .name {
    font-size: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .awardBox2 .name > div {
    display: inline-block;
    width: 49%;
    padding: 1em 0 0 0;
    margin: 0 auto;
  }
  .awardBox2 .name > div:nth-child(odd) {
    margin: 0 auto;
  }
  .awardBox2 .name2 {
    font-size: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .awardBox2 .name2 > div {
    display: inline-block;
    width: 32%;
    padding: 1em 0 0 0;
  }
  .awardBox2 .name2 > div:nth-child(3n+2) {
    margin: 0 0%;
  }
  .awardBox2 .partition {
    background: url("../images/line.png") right top repeat-x;
    height: 6px;
    width: 100%;
    margin: 3em auto 3.6em auto;
  }
  /***************************/
  .block04 {
    padding: 10vw 0;
    background: #928dd6;
    color: #ffffff;
  }
  .block04 .text {
    font-size: 1.4em;
    line-height: 1.4em;
    text-align: center;
    margin: 1em auto 1.4em auto;
    width: 70%;
  }
  .block04 .listDot {
    list-style: disc;
    width: 98%;
    font-size: 1.4em;
    line-height: 1.4em;
    text-align: left;
    padding: 0;
    margin: 0 auto 0 1.5em;
  }
  .block04 .listDot li {
    padding: 0 0 0.5em 0;
  }
  /***************************/
  .block05 {
    padding: 10vw 0 0 0;
    background: #6c5fb0;
    text-align: center;
  }
  .block05 .text {
    display: inline-block;
    margin: 0 2vw 2vw 0;
    vertical-align: middle;
  }
  .block05 .text img {
    height: 100%;
    width: auto;
  }
  .block05 .text > div:nth-child(1) {
    /***標題****/
    height: 2.4em;
    margin: 0 0 1.5em 0;
  }
  .block05 .text > div:nth-child(2) {
    /***內文****/
    font-size: 1.6em;
    line-height: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 1em 0;
  }
  .block05 .text > a {
    display: inline-block;
    height: 4em;
    animation: btn 2s linear infinite;
  }
  .block05 .pic {
    display: inline-block;
    width: 44%;
    vertical-align: middle;
    border: 3px solid #ffffff;
    border-radius: 20px;
    overflow: hidden;
    margin: 0 0 4vw 0;
    background: #ffffff;
  }
  /***************************/
  .block06 {
    padding: 6vw 0 6vw 0;
    background: #6c5fb0;
    text-align: center;
    margin: -2em 0 0 0;
  }
  .noteBtn {
    position: relative;
    width: 26%;
    cursor: pointer;
    margin: 0 auto 2vw 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 / 40);
  }
  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;
  }
  .pc {
    display: none;
  }
  .mo {
    display: block;
  }
  .kv {
    padding: 0 0 12vw 0;
    background: url("../images/kv_BG01m.jpg") center top no-repeat #6c5faf;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    text-align: center;
    min-height: 100vh;
  }
  .kvLeft {
    display: block;
    width: 90%;
    margin: 0 auto;
    vertical-align: top;
    animation: sloagn 0.5s ease-in forwards 0s 1;
  }
  .kvLeft > div:nth-child(3) {
    width: 88%;
    margin: 4vh auto 0 auto;
  }
  .kvLeft > div:nth-child(4) {
    width: 98%;
    margin: 6vh auto 4vh auto;
  }
  .kvRight {
    display: block;
    width: 44%;
    margin: 0 auto;
    vertical-align: top;
    padding: 0 4vw 0 0;
    animation: card 0.5s ease-in forwards 0s 1;
  }
  /***************************/
  .block02 {
    padding: 14vw 0;
    background: #3a3773;
  }
  .block02 .txt01 {
    font-size: 1.8em;
    color: #ffffff;
    text-align: center;
    line-height: 1.6em;
    margin: 0 0 8vw 0;
  }
  .block02 .txt02 {
    font-size: 2.2em;
    color: #ffffff;
    text-align: center;
    line-height: 1.6em;
  }
  /***************************/
  .block03 {
    padding: 12vw 0;
    background: url("../images/kv_BG01m.jpg") center top repeat-y;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
  }
  /***************************/
  .title-A {
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }
  .title-D {
    position: relative;
    width: 80%;
    margin: 0 auto;
    text-align: center;
  }
  .title-D img {
    height: 100%;
    width: auto;
  }
  .title-D .line {
    position: absolute;
    width: 100%;
    height: 2px;
    background: #bdb9f0;
    left: 0;
    top: 50%;
    z-index: 10;
  }
  .title-D .pic {
    display: inline-block;
    position: relative;
    z-index: 15;
    height: 3em;
    background: #928dd6;
    width: auto;
    padding: 0 2em;
  }
  .title-B {
    width: 46%;
    margin: 6vw auto 0 auto;
  }
  .partition {
    background: url("../images/line.png") right top repeat-x;
    height: 6px;
    width: 100%;
    margin: 2em auto;
  }
  .backup {
    text-align: right;
    font-size: 1.2em;
    line-height: 1.4em;
    color: #cec5ff;
    width: 100%;
    margin: 1vw auto 0 auto;
    padding: 0 4% 3em 0;
  }
  .awardBox1 {
    padding: 3vw 0;
    text-align: center;
  }
  .awardBox1 .card {
    display: block;
    width: 80%;
    vertical-align: top;
    margin: 0em auto 3em auto;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 8px 8px 0px #5c5196;
  }
  .awardBox1 .text {
    display: inline-block;
    vertical-align: top;
    text-align: center;
  }
  .awardBox1 .text > div:nth-child(1) {
    /***姓名***/
    font-size: 1.6em;
    color: #ffffff;
    margin: 0 0 2em 0;
  }
  .awardBox1 .text > div:nth-child(1) span {
    display: inline-block;
    margin: 0 0.5em;
  }
  .awardBox1 .text > div:nth-child(2) {
    /***標題***/
    font-size: 3em;
    color: #ffffff;
    font-weight: bold;
    margin: 0 0 0.4em 0;
    font-family: "Microsoft YaHei";
  }
  .awardBox1 .text > div:nth-child(3) {
    /***內文***/
    font-size: 1.6em;
    line-height: 1.5em;
    color: #ffffff;
    margin: 0 0 2em 0;
  }
  .awardBox1 .text > div:nth-child(3) span {
    display: inline-block;
  }
  .awardBox1 .text > div:nth-child(4) {
    /***製卡***/
    display: inline-block;
    border-radius: 300px;
    font-size: 1.4em;
    color: #cec5ff;
    background: #5c509e;
    padding: 0.5em 1em;
  }
  .awardBox2 {
    text-align: center;
  }
  .awardBox2 img {
    height: 100%;
    width: auto;
  }
  .awardBox2 .title-C {
    display: inline-block;
    width: 64%;
    vertical-align: top;
    margin: 0 auto;
    border-bottom: 1px dashed #e8c369;
    padding: 0 0 1.4em 0;
  }
  .awardBox2 .title-C > div:nth-child(1) {
    /***.***/
    display: none;
  }
  .awardBox2 .title-C > div:nth-child(2) {
    /***獎***/
    display: inline-block;
    height: 3em;
    vertical-align: bottom;
  }
  .awardBox2 .title-C > div:nth-child(3) {
    /***分隔***/
    display: none;
  }
  .awardBox2 .text {
    display: block;
    width: 100%;
    vertical-align: top;
    text-align: center;
    margin: 1.4em 0 0 0;
  }
  .awardBox2 .gift {
    text-align: center;
    height: 2.4em;
    display: inline-block;
    margin: 0 0 1em 0;
  }
  .awardBox2 .name {
    font-size: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .awardBox2 .name > div {
    display: block;
    width: 100%;
    padding: 1em 0 0 0;
    margin: 0 auto;
  }
  .awardBox2 .name > div:nth-child(odd) {
    margin: 0 auto;
  }
  .awardBox2 .name2 {
    font-size: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 2em 0;
  }
  .awardBox2 .name2 > div {
    display: inline-block;
    width: 49%;
    padding: 1em 0 0 0;
  }
  .awardBox2 .name2 > div:nth-child(3n+2) {
    margin: 0 0%;
  }
  .awardBox2 .partition {
    background: url("../images/line.png") right top repeat-x;
    height: 6px;
    width: 100%;
    margin: 3em auto 3.6em auto;
  }
  /***************************/
  .block04 {
    padding: 12vw 0;
    background: #928dd6;
    color: #ffffff;
  }
  .block04 .text {
    width: 94%;
    font-size: 1.4em;
    line-height: 1.4em;
    text-align: center;
    margin: 1em auto 1.4em auto;
  }
  .block04 .listDot {
    list-style: disc;
    width: 90%;
    font-size: 1.4em;
    line-height: 1.4em;
    text-align: left;
    padding: 0;
    margin: 0 auto 0 1.5em;
  }
  .block04 .listDot li {
    padding: 0 0 0.5em 0;
  }
  /***************************/
  .block05 {
    padding: 10vw 0 0 0;
    background: #6c5fb0;
    text-align: center;
  }
  .block05 .text {
    display: inline-block;
    margin: 0 2vw 2vw 0;
    vertical-align: middle;
  }
  .block05 .text img {
    height: 100%;
    width: auto;
  }
  .block05 .text > div:nth-child(1) {
    /***標題****/
    height: 3em;
    margin: 0 0 1.5em 0;
  }
  .block05 .text > div:nth-child(2) {
    /***內文****/
    font-size: 1.6em;
    line-height: 1.6em;
    color: #ffffff;
    text-align: center;
    margin: 0 0 1em 0;
  }
  .block05 .text > a {
    display: inline-block;
    height: 5em;
    animation: btn 2s linear infinite;
  }
  .block05 .pic {
    display: inline-block;
    width: 80%;
    vertical-align: middle;
    border: 2px solid #ffffff;
    border-radius: 10px;
    overflow: hidden;
    margin: 10vw 0 4vw 0;
    background: #ffffff;
  }
  /***************************/
  .block06 {
    padding: 6vw 0 6vw 0;
    background: #6c5fb0;
    text-align: center;
    margin: -2em 0 0 0;
  }
  .noteBtn {
    position: relative;
    width: 38%;
    cursor: pointer;
    margin: 0 auto 2vw auto;
  }
}