html {
  font-family: Microsoft JhengHei, 'Arial', sans-serif;
  overflow-x: hidden;
}
html * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body {
  margin: 0;
  overflow-x: hidden;
  padding-top: 60px;
}
header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0px 60px;
  -webkit-box-shadow: -2px 2px 4px 0px rgba(0,0,0,0.2);
  box-shadow: -2px 2px 4px 0px rgba(0,0,0,0.2);
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 10;
  width: 100%;
  background-color: #fff;
  height: 60px;
}
@media screen and (max-width: 1365px) {
  header {
    padding: 0 30px;
  }
}
@media screen and (max-width: 1279px) {
  header {
    padding-right: 0px;
  }
}
header .left a img {
  width: 210px;
  display: block;
  height: 45px;
  margin-top: 7.5px;
}
header .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
header .right a {
  line-height: 57px;
  border-bottom: 3px solid #fff;
  padding: 0px 30px;
  color: #000;
  text-decoration: none;
  font-weight: 600;
  cursor: pointer;
  font-size: 20px;
}
header .right a:hover,
header .right a.active {
  border-bottom: 3px solid #f2b942;
}
header .right a:hover.lottery,
header .right a.active.lottery {
  border-color: #ff6161;
}
@media screen and (max-width: 1365px) {
  header .right a {
    padding: 0 15px;
  }
}
header .right a.lottery {
  color: #ff6161;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 1279px) {
  header .right a.lottery {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
  }
}
header .right a.lottery img {
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  margin-right: 5px;
}
@media screen and (max-width: 1279px) {
  header .right a.lottery img.red {
    display: none;
  }
}
header .right a.lottery img.white {
  display: none;
}
@media screen and (max-width: 1279px) {
  header .right a.lottery img.white {
    display: block;
  }
}
header .right .close {
  position: absolute;
  width: 60px;
  height: 60px;
  top: 0px;
  right: 0px;
  display: none;
  background-image: url("../img/close.png");
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 1279px) {
  header .right {
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: #197643;
    left: 0px;
    top: 0px;
    display: block;
    padding: 0 60px;
    padding-top: 60px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
    -o-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
    transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  }
  header .right.active {
    visibility: visible;
    opacity: 1;
  }
  header .right a {
    color: #fff;
    display: block;
    border-bottom: 1px solid rgba(138,218,183,0.3);
    text-align: center;
    font-size: 20px;
    line-height: 60px;
  }
  header .right a:hover,
  header .right a.active {
    border-bottom: 1px solid rgba(138,218,183,0.3);
  }
  header .right a:last-of-type {
    border: none;
  }
  header .right .close {
    display: block;
  }
}
header .sandwich {
  width: 60px;
  height: 60px;
  display: none;
  background-image: url("../img/sandwich.png");
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 1279px) {
  header .sandwich {
    display: block;
  }
}
#index .preload-images {
  background: url("../img/index-section-1-button-active.png"), url("../img/index-button-now-active.png"), url("../img/index-button-more-active.png"), url("../img/index-section-4-tab-1-active.png"), url("../img/index-section-4-tab-2-active.png"), url("../img/index-section-4-tab-3-active.png");
}
section.section-1 {
  height: 800px;
  background-image: url("../img/index-section-1-bg.jpg");
  background-size: auto 100%;
  background-position: center;
  position: relative;
  max-width: 100%;
}
@media screen and (max-width: 767px) {
  section.section-1 {
    height: 500px;
  }
  section.section-1 img {
    max-width: 320px;
  }
}
section.section-1 .train {
  position: absolute;
  top: 365px;
  left: -1357px;
  -webkit-animation-name: left-to-right;
  animation-name: left-to-right;
  -webkit-animation-duration: 6s;
  animation-duration: 6s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
@media screen and (max-width: 767px) {
  section.section-1 .train {
    top: 240px;
    -webkit-animation-name: left-to-right-slow;
    animation-name: left-to-right-slow;
  }
}
section.section-1 .center {
  position: absolute;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
section.section-1 .center .heading {
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
section.section-1 .center .heading.show {
  -webkit-animation-name: pop;
  animation-name: pop;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
section.section-1 .center .avatar {
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  margin-top: -40px;
  position: relative;
  max-width: 100%;
}
@media screen and (max-width: 767px) {
  section.section-1 .center .avatar {
    margin-top: -20px;
  }
}
section.section-1 .center .avatar.show {
  -webkit-animation-name: pop;
  animation-name: pop;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
section.section-1 .center .avatar .hand {
  position: absolute;
  right: 120px;
  top: 110px;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}
@media screen and (max-width: 767px) {
  section.section-1 .center .avatar .hand {
    right: 70px;
    top: 60px;
  }
  section.section-1 .center .avatar .hand img {
    width: 70px;
  }
}
section.section-1 .center .avatar .button {
  width: 178px;
  height: 68px;
  background-image: url("../img/index-section-1-button.png");
  -webkit-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  cursor: pointer;
  position: absolute;
  left: 229px;
  bottom: 0px;
}
section.section-1 .center .avatar .button:hover {
  background-image: url("../img/index-section-1-button-active.png");
}
@media screen and (max-width: 767px) {
  section.section-1 .center .avatar .button {
    width: 118px;
    height: 45px;
    background-size: cover;
    left: calc(50% - 59px);
    bottom: -10px;
  }
}
section.section-1 .center .support {
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  section.section-1 .center .support {
    margin-top: 60px;
    padding: 0px 30px;
  }
  section.section-1 .center .support img {
    max-width: 100%;
  }
}
@-moz-keyframes left-to-right {
  0% {
    transform: translateX(0px);
  }
  100% {
    transform: translateX(4000px);
  }
}
@-webkit-keyframes left-to-right {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(4000px);
    transform: translateX(4000px);
  }
}
@-o-keyframes left-to-right {
  0% {
    transform: translateX(0px);
  }
  100% {
    transform: translateX(4000px);
  }
}
@keyframes left-to-right {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(4000px);
    transform: translateX(4000px);
  }
}
@-moz-keyframes left-to-right-slow {
  0% {
    transform: translateX(0px);
  }
  100% {
    transform: translateX(2000px);
  }
}
@-webkit-keyframes left-to-right-slow {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}
@-o-keyframes left-to-right-slow {
  0% {
    transform: translateX(0px);
  }
  100% {
    transform: translateX(2000px);
  }
}
@keyframes left-to-right-slow {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}
section.common {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 60px 0px;
}
@media screen and (max-width: 1023px) {
  section.common {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 60px 30px;
  }
}
@media screen and (max-width: 374px) {
  section.common {
    padding: 60px 15px;
  }
}
section.common .left {
  text-align: center;
  width: 500px;
  opacity: 0;
  -webkit-transform: translateX(-100px);
  -ms-transform: translateX(-100px);
  transform: translateX(-100px);
  -webkit-transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
}
section.common .left.show {
  -webkit-transform: translateX(0px);
  -ms-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
@media screen and (max-width: 1023px) {
  section.common .left {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  section.common .left img {
    max-width: 100%;
  }
}
section.common .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 500px;
  opacity: 0;
  -webkit-transform: translateX(100px);
  -ms-transform: translateX(100px);
  transform: translateX(100px);
  -webkit-transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
}
@media screen and (max-width: 1023px) {
  section.common .right {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    text-align: center;
  }
}
section.common .right.show {
  -webkit-transform: translateX(0px);
  -ms-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
section.common .right .heading {
  color: #197643;
  font-size: 36px;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  section.common .right .heading {
    font-size: 30px;
  }
}
section.common .right .text {
  margin: 15px 0px;
  font-size: 26px;
  line-height: 36px;
}
@media screen and (max-width: 1023px) {
  section.common .right .text {
    text-align: left;
  }
}
@media screen and (max-width: 767px) {
  section.common .right .text {
    font-size: 20px;
  }
}
section.common .right .button {
  width: 152px;
  height: 43px;
  cursor: pointer;
  -webkit-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  margin: 30px 0px;
  display: block;
}
section.common .right .button.now {
  background-image: url("../img/index-button-now.png");
}
section.common .right .button.now:hover {
  background-image: url("../img/index-button-now-active.png");
}
section.common .right .button.more {
  background-image: url("../img/index-button-more.png");
}
section.common .right .button.more:hover {
  background-image: url("../img/index-button-more-active.png");
}
@media screen and (max-width: 1023px) {
  section.common .right .button {
    display: inline-block;
  }
}
section.section-3 {
  background-color: #e5edf8;
}
section.section-4 .tab-headings {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  section.section-4 .tab-headings {
    margin-left: -15px;
    margin-right: -15px;
  }
}
@media screen and (max-width: 1023px) {
  section.section-4 .tab-headings {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}
section.section-4 .tab-headings .tab-heading {
  width: 150px;
  height: 46px;
  -webkit-transition: all 200ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 200ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 200ms cubic-bezier(0.68, 0, 0.265, 1);
  margin-right: 15px;
  background-size: cover;
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  section.section-4 .tab-headings .tab-heading {
    width: 112px;
    height: 34px;
    margin-right: 5px;
  }
}
@media screen and (max-width: 374px) {
  section.section-4 .tab-headings .tab-heading {
    width: 100px;
    height: 30px;
  }
}
section.section-4 .tab-headings .tab-heading.one {
  background-image: url("../img/index-section-4-tab-1.png");
}
section.section-4 .tab-headings .tab-heading.one:hover,
section.section-4 .tab-headings .tab-heading.one.active {
  background-image: url("../img/index-section-4-tab-1-active.png");
}
section.section-4 .tab-headings .tab-heading.two {
  background-image: url("../img/index-section-4-tab-2.png");
}
section.section-4 .tab-headings .tab-heading.two:hover,
section.section-4 .tab-headings .tab-heading.two.active {
  background-image: url("../img/index-section-4-tab-2-active.png");
}
section.section-4 .tab-headings .tab-heading.three {
  background-image: url("../img/index-section-4-tab-3.png");
}
section.section-4 .tab-headings .tab-heading.three:hover,
section.section-4 .tab-headings .tab-heading.three.active {
  background-image: url("../img/index-section-4-tab-3-active.png");
}
section.section-4 .tabs {
  position: relative;
  height: 300px;
}
@media screen and (max-width: 1023px) {
  section.section-4 .tabs {
    width: 100%;
    height: 300px;
  }
}
section.section-4 .tabs .tab {
  position: absolute;
  top: 0px;
  left: 0px;
  opacity: 0;
  -webkit-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  visibility: hidden;
}
@media screen and (max-width: 1023px) {
  section.section-4 .tabs .tab {
    width: 100%;
  }
}
section.section-4 .tabs .tab.active {
  opacity: 1;
  visibility: visible;
}
section.section-4 .tabs .tab .heading {
  font-size: 36px;
}
@media screen and (max-width: 767px) {
  section.section-4 .tabs .tab .heading {
    font-size: 30px;
  }
}
section.section-4 .tabs .tab .text {
  font-size: 26px;
}
@media screen and (max-width: 767px) {
  section.section-4 .tabs .tab .text {
    font-size: 20px;
  }
}
section.section-5 {
  background-color: #fef3d8;
}
@media screen and (max-width: 1023px) {
  section.section-5 .mc {
    text-align: center !important;
  }
}
section.section-5 .heading {
  font-size: 36px;
}
@media screen and (max-width: 767px) {
  section.section-5 .heading {
    font-size: 30px;
  }
}
section.section-5 .text {
  font-size: 22px;
}
@media screen and (max-width: 767px) {
  section.section-5 .text {
    font-size: 20px;
  }
}
section.section-6 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 60px 0px;
}
@media screen and (max-width: 1023px) {
  section.section-6 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}
section.section-6 .box {
  padding: 0px 120px;
  text-align: center;
}
@media screen and (max-width: 1023px) {
  section.section-6 .box {
    width: 100%;
    padding: 0px 30px;
    margin: 30px 0px;
  }
}
section.section-6 .box .heading {
  font-size: 28px;
  font-weight: 600;
  color: #197643;
}
@media screen and (max-width: 767px) {
  section.section-6 .box .heading {
    font-size: 26px;
  }
}
section.section-6 .box img {
  margin: 30px 0px;
}
section.section-6 .box .button {
  width: 152px;
  height: 43px;
  cursor: pointer;
  -webkit-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 300ms cubic-bezier(0.68, 0, 0.265, 1);
  display: inline-block;
}
section.section-6 .box .button.now {
  background-image: url("../img/index-button-now.png");
}
section.section-6 .box .button.now:hover {
  background-image: url("../img/index-button-now-active.png");
}
section.section-6 .box .button.more {
  background-image: url("../img/index-button-more.png");
}
section.section-6 .box .button.more:hover {
  background-image: url("../img/index-button-more-active.png");
}
section.section-6 .left {
  opacity: 0;
  -webkit-transform: translateX(-100px);
  -ms-transform: translateX(-100px);
  transform: translateX(-100px);
  -webkit-transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
}
section.section-6 .left.show {
  -webkit-transform: translateX(0px);
  -ms-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
section.section-6 .right {
  opacity: 0;
  -webkit-transform: translateX(100px);
  -ms-transform: translateX(100px);
  transform: translateX(100px);
  -webkit-transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 600ms cubic-bezier(0.68, 0, 0.265, 1);
}
section.section-6 .right.show {
  -webkit-transform: translateX(0px);
  -ms-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
footer {
  background-color: #327215;
  color: #fff;
  text-align: center;
  padding: 20px 30px;
  font-size: 16px;
}
@media screen and (max-width: 767px) {
  footer {
    font-size: 15px;
  }
}
footer .links {
  margin-top: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  footer .links {
    font-size: 15px;
  }
}
footer a {
  text-decoration: none;
  color: #fff;
}
section.choose {
  min-height: calc(100vh - 147px);
  background-position: center bottom;
  background-size: auto 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: 60px;
}
@media screen and (max-width: 1023px) {
  section.choose {
    min-height: calc(100vh - 189px);
  }
}
@media screen and (max-width: 767px) {
  section.choose {
    min-height: calc(100vh - 205px);
    padding-top: 30px;
  }
}
@media screen and (max-width: 374px) {
  section.choose {
    min-height: calc(100vh - 201px);
  }
}
section.choose.apply {
  background-image: url("../img/apply-bg.jpg");
}
section.choose.use {
  background-image: url("../img/use-bg.jpg");
}
section.choose .center .wrap {
  position: relative;
}
@media screen and (max-width: 767px) {
  section.choose .center .wrap {
    padding-right: 0px;
    padding: 0px 30px;
    padding-bottom: 90px;
  }
}
section.choose .center .wrap .heading {
  color: #197643;
  font-size: 48px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  section.choose .center .wrap .heading {
    font-size: 36px;
  }
}
section.choose .center .wrap .choices a {
  display: block;
  margin-top: 15px;
}
section.choose .center .wrap .choices a img {
  max-width: 100%;
}
section.choose .center .wrap img.boy {
  position: absolute;
  bottom: 0px;
  right: -200px;
}
@media screen and (max-width: 767px) {
  section.choose .center .wrap img.boy {
    display: none;
  }
}
#apply {
  background-image: url("../img/apply-bg-light.jpg");
  background-position: center bottom 87px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-color: #d2e9e6;
}
@media screen and (max-width: 872px) {
  #apply {
    background-position: center bottom 108px;
  }
}
@media screen and (max-width: 785px) {
  #apply {
    background-position: center bottom 129px;
  }
}
@media screen and (max-width: 767px) {
  #apply {
    background-image: none;
  }
  #apply section.slide-section {
    background-image: url("../img/apply-bg-light.jpg");
    background-size: auto 50%;
    background-position: center bottom;
    background-repeat: no-repeat;
  }
}
#use {
  background-image: url("../img/use-bg-light.jpg");
  background-position: center bottom 87px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-color: #eff5fb;
}
@media screen and (max-width: 872px) {
  #use {
    background-position: center bottom 108px;
  }
}
@media screen and (max-width: 785px) {
  #use {
    background-position: center bottom 129px;
  }
}
@media screen and (max-width: 767px) {
  #use {
    background-image: none;
  }
  #use section.slide-section {
    background-image: url("../img/use-bg-light.jpg");
    background-size: auto 50%;
    background-position: center bottom;
    background-repeat: no-repeat;
  }
}
section.slide-section {
  min-height: calc(100vh - 147px);
  overflow: auto;
  max-width: 800px;
  margin: 0px auto;
  position: relative;
  padding-bottom: 30px;
}
section.slide-section * {
  outline: none;
}
@media screen and (max-width: 767px) {
  section.slide-section {
    padding-top: 0px;
  }
}
section.slide-section a.back {
  margin-left: 30px;
}
section.slide-section a.back img {
  display: block;
}
@media screen and (max-width: 767px) {
  section.slide-section a.back {
    display: block;
    margin-left: 0px;
    background-color: #0d8455;
  }
}
section.slide-section .slides .slide {
  text-align: center;
  padding: 0px 15px;
}
section.slide-section .slides .slide .heading {
  font-size: 20px;
  margin-bottom: 15px;
}
section.slide-section .slides .slide img {
  display: inline-block;
  max-width: 338px;
}
@media screen and (max-width: 767px) {
  section.slide-section .slides .slide img {
    max-width: 100%;
  }
}
section.slide-section .prev {
  position: absolute;
  left: 30px;
  top: 420px;
  cursor: pointer;
}
section.slide-section .prev.slick-disabled {
  display: none !important;
}
@media screen and (max-width: 767px) {
  section.slide-section .prev {
    left: 5px;
  }
  section.slide-section .prev img {
    width: 20px;
  }
}
section.slide-section .next {
  position: absolute;
  right: 30px;
  top: 420px;
  cursor: pointer;
}
section.slide-section .next.slick-disabled {
  display: none !important;
}
@media screen and (max-width: 767px) {
  section.slide-section .next {
    right: 5px;
  }
  section.slide-section .next img {
    width: 20px;
  }
}
section.slide-section .pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  section.slide-section .pagination {
    margin-top: 15px;
    max-width: 100vw;
    padding: 0 20px;
  }
}
section.slide-section .pagination ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 0px;
  margin-bottom: 30px;
  padding: 0;
  background-color: #fff;
  padding: 3px;
  border-radius: 21px;
}
@media screen and (max-width: 767px) {
  section.slide-section .pagination ul {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}
section.slide-section .pagination ul li {
  list-style-type: none;
  line-height: 36px;
  border: 2px solid #fff;
  width: 40px;
  text-align: center;
  border-radius: 50%;
}
section.slide-section .pagination ul li.slick-active {
  border: 2px solid #147344;
}
section.slide-section .pagination ul li.slick-active button {
  color: #147344;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
section.slide-section .pagination ul li button {
  border: none;
  padding: 0;
  margin: 0;
  font-size: 22px;
  color: #ccc;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #fff;
}
section.slide-section .detail-heading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  border-top: 1px solid #c9c9c9;
  border-bottom: 1px solid #c9c9c9;
  padding: 0px 30px;
  cursor: pointer;
  background-color: #b9d6d2;
}
@media screen and (max-width: 767px) {
  section.slide-section .detail-heading {
    margin-top: 15px;
  }
}
section.slide-section .detail-heading .title {
  color: #147344;
  font-weight: 600;
  font-size: 20px;
  line-height: 50px;
}
section.slide-section .detail-heading .icon {
  color: #fff;
  background-color: #147344;
  font-weight: 600;
  font-size: 18px;
  width: 30px;
  line-height: 30px;
  height: 30px;
  border-radius: 50%;
  margin-top: 10px;
}
section.slide-section .detail-content {
  background-color: #b9d6d2;
  color: #555;
  font-size: 16px;
  padding: 30px;
  text-align: left;
  border-bottom: 1px solid #c9c9c9;
  line-height: 30px;
}
section.slide-section .detail-content.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
section.slide-section .detail-content.flex .box {
  width: 50%;
}
section.slide-section .detail-content ol {
  padding: 0;
  margin: 0;
}
section.slide-section .detail-content ol li {
  padding: 0;
  margin: 0;
  margin-left: 18px;
}
section.slide-section .vc {
  margin-top: 280px;
}
#shop {
  background-color: #fef3d8;
}
#shop section.shop {
  min-height: calc(100vh - 147px);
  padding: 60px 30px;
}
@media screen and (max-width: 1023px) {
  #shop section.shop {
    min-height: calc(100vh - 189px);
  }
}
@media screen and (max-width: 767px) {
  #shop section.shop {
    min-height: calc(100vh - 205px);
    padding-top: 30px;
  }
}
@media screen and (max-width: 374px) {
  #shop section.shop {
    min-height: calc(100vh - 201px);
  }
}
#shop section.shop .center {
  max-width: 800px;
  margin: 0 auto;
}
#shop section.shop .center .heading {
  color: #147344;
  font-size: 44px;
  font-weight: 600;
  margin-bottom: 45px;
  margin-left: 75px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 767px) {
  #shop section.shop .center .heading {
    margin-left: 0px;
    font-size: 32px;
  }
}
#shop section.shop .center .heading .img {
  display: none;
}
@media screen and (max-width: 767px) {
  #shop section.shop .center .heading .img {
    display: block;
    margin-left: 15px;
  }
  #shop section.shop .center .heading .img img {
    width: 140px;
    margin-top: 10px;
  }
}
#shop section.shop .center .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 30px;
}
#shop section.shop .center .flex .icon {
  min-width: 60px;
  width: 60px;
  margin-right: 15px;
}
#shop section.shop .center .flex .words .title {
  font-weight: 600;
  font-size: 28px;
  margin-bottom: 10px;
}
#shop section.shop .center .flex .words .text {
  font-size: 24px;
}
@media screen and (max-width: 767px) {
  #shop section.shop .center .flex .words .text {
    font-size: 16px;
  }
}
#shop section.shop .center .flex .words ul {
  margin: 0;
  padding: 0;
}
#shop section.shop .center .flex .words ul li {
  margin: 0;
  padding: 0;
  margin: 10px 0px;
  margin-left: 20px;
  font-size: 24px;
}
@media screen and (max-width: 767px) {
  #shop section.shop .center .flex .words ul li {
    font-size: 16px;
  }
}
#shop section.shop .center .flex-big {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-left: 75px;
}
@media screen and (max-width: 767px) {
  #shop section.shop .center .flex-big {
    padding-left: 0px;
  }
  #shop section.shop .center .flex-big .right {
    display: none;
  }
}
#shop section.shop .center .flex-big .left {
  margin-right: 30px;
}
@media screen and (max-width: 767px) {
  #shop section.shop .center .flex-big .left {
    margin-right: 0px;
  }
}
#shop section.shop .center .flex-big .left .flex-small {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 30px;
}
#shop section.shop .center .flex-big .left .flex-small .icon {
  width: 30px;
  min-width: 30px;
  margin-right: 10px;
}
#shop section.shop .center .flex-big .left .flex-small .words .title-small {
  font-size: 24px;
  font-weight: 600;
}
#shop section.shop .center .flex-big .left .flex-small .words a {
  display: inline-block;
  margin-top: 15px;
}
#shop section.shop .center .flex-big .left .flex-small .red {
  color: #d5242e;
}
#shop section.shop .center .flex-big .left .flex-small .text {
  margin-top: 10px;
  font-size: 22px;
}
@media screen and (max-width: 767px) {
  #shop section.shop .center .flex-big .left .flex-small .text {
    font-size: 16px;
  }
}
#lottery .hide {
  display: none !important;
}
#lottery section.hero {
  position: relative;
}
@media screen and (max-width: 1023px) {
  #lottery section.hero {
    display: none;
  }
}
#lottery section.hero img.hero {
  width: 100%;
  display: block;
}
#lottery section.hero img.mouse {
  position: absolute;
  bottom: 0px;
  left: calc(50% - 13px);
  width: 25px;
  -webkit-animation-name: mouse;
  animation-name: mouse;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 800ms;
  animation-duration: 800ms;
  -webkit-animation-timing-function: cubic-bezier(0.68, 0, 0.265, 1);
  animation-timing-function: cubic-bezier(0.68, 0, 0.265, 1);
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  display: block;
}
#lottery section.hero img.t1 {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
#lottery section.hero img.t1.show {
  -webkit-animation-name: pop;
  animation-name: pop;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
}
#lottery section.hero img.t2 {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
#lottery section.hero img.t2.show {
  -webkit-animation-name: pop;
  animation-name: pop;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -webkit-animation-delay: 300ms;
  animation-delay: 300ms;
}
#lottery section.hero .people-wrap {
  position: absolute;
  width: 100%;
  top: 0px;
  height: 100%;
  left: 0px;
  opacity: 0;
  -webkit-transition: all 500ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 500ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 500ms cubic-bezier(0.68, 0, 0.265, 1);
  -webkit-transition-delay: 600ms;
  -o-transition-delay: 600ms;
  transition-delay: 600ms;
  -webkit-transform: translateY(20px);
  -ms-transform: translateY(20px);
  transform: translateY(20px);
}
#lottery section.hero .people-wrap.show {
  opacity: 1;
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
}
#lottery section.hero img.people {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
}
#lottery section.hero img.a1 {
  position: absolute;
  width: 5.8%;
  top: 50%;
  left: 5%;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
#lottery section.hero img.a2 {
  position: absolute;
  width: 6%;
  top: 53%;
  left: 18%;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
#lottery section.hero img.a3 {
  position: absolute;
  width: 6.3%;
  top: 52%;
  left: 72%;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
#lottery section.hero img.a4 {
  position: absolute;
  width: 5.7%;
  top: 58%;
  left: 87%;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
#lottery section.hero.mobile {
  position: relative;
  display: none;
}
@media screen and (max-width: 1023px) {
  #lottery section.hero.mobile {
    display: block;
  }
}
#lottery section.hero.mobile img.hero {
  width: 100%;
  display: block;
}
#lottery section.hero.mobile img.mouse {
  position: absolute;
  bottom: 0px;
  left: calc(50% - 13px);
  width: 25px;
  -webkit-animation-name: mouse;
  animation-name: mouse;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 800ms;
  animation-duration: 800ms;
  -webkit-animation-timing-function: cubic-bezier(0.68, 0, 0.265, 1);
  animation-timing-function: cubic-bezier(0.68, 0, 0.265, 1);
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  display: block;
}
#lottery section.hero.mobile img.t1 {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
#lottery section.hero.mobile img.t1.show {
  -webkit-animation-name: pop;
  animation-name: pop;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
}
#lottery section.hero.mobile img.t2 {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
#lottery section.hero.mobile img.t2.show {
  -webkit-animation-name: pop;
  animation-name: pop;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -webkit-animation-delay: 300ms;
  animation-delay: 300ms;
}
#lottery section.hero.mobile .people-wrap {
  position: absolute;
  width: 100%;
  top: 0px;
  height: 100%;
  left: 0px;
  opacity: 0;
  -webkit-transition: all 500ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 500ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 500ms cubic-bezier(0.68, 0, 0.265, 1);
  -webkit-transition-delay: 600ms;
  -o-transition-delay: 600ms;
  transition-delay: 600ms;
  -webkit-transform: translateY(20px);
  -ms-transform: translateY(20px);
  transform: translateY(20px);
}
#lottery section.hero.mobile .people-wrap.show {
  opacity: 1;
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
}
#lottery section.hero.mobile img.people {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
}
#lottery section.hero.mobile img.a1 {
  position: absolute;
  width: 5.8%;
  top: 78%;
  left: 5%;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
#lottery section.hero.mobile img.a2 {
  position: absolute;
  width: 6%;
  top: 79%;
  left: 21%;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
#lottery section.hero.mobile img.a3 {
  position: absolute;
  width: 6.3%;
  top: 72%;
  left: 68%;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
#lottery section.hero.mobile img.a4 {
  position: absolute;
  width: 5.7%;
  top: 82%;
  left: 90%;
  -webkit-animation-name: shake;
  animation-name: shake;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
#lottery .yellow-link {
  color: #f6b42c;
  font-weight: bold;
}
#lottery section.curve {
  background-image: url("../img/lottery-curve.jpg");
  background-size: cover;
  background-position: center;
  min-height: 266px;
  padding-top: 60px;
}
@media screen and (max-width: 1023px) {
  #lottery section.curve {
    background-image: url("../img/lottery-curve-m.png");
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
  }
}
#lottery section.curve .wrap {
  max-width: 900px;
  margin: 0 auto;
}
#lottery section.curve .flex-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 20px;
}
@media screen and (max-width: 1023px) {
  #lottery section.curve .flex-row {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}
#lottery section.curve .flex-row .left .tag {
  background-color: #168755;
  height: 40px;
  line-height: 40px;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  padding: 0px 20px;
  border-radius: 20px;
  min-width: 120px;
}
#lottery section.curve .flex-row .right {
  font-size: 30px;
  font-weight: bold;
  line-height: 40px;
  margin-left: 20px;
}
@media screen and (max-width: 1023px) {
  #lottery section.curve .flex-row .right {
    margin-left: 0px;
    font-size: 18px;
    line-height: 1.7em;
    margin-top: 15px;
  }
}
#lottery section.content {
  background-image: url("../img/lottery-bg.png");
  background-size: 100% auto;
  padding-bottom: 60px;
  background-color: #fff9e1;
}
@media screen and (max-width: 1023px) {
  #lottery section.content {
    padding-left: 20px;
    padding-right: 20px;
    background-image: none;
  }
}
#lottery section.content .center-wrap {
  max-width: 940px;
  margin: 0 auto;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .center-wrap {
    padding-top: 40px;
  }
}
#lottery section.content .title {
  text-align: center;
}
#lottery section.content .title img {
  max-width: 376px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .title img {
    max-width: 220px;
  }
}
#lottery section.content .heading {
  font-size: 36px;
  color: #cf5b06;
  font-weight: bold;
  margin-top: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#lottery section.content .heading.green {
  color: #00633e;
  margin-top: 60px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .heading {
    font-size: 25px;
  }
}
#lottery section.content .heading img {
  width: 40px;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  margin-right: 15px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .heading img {
    width: 60px;
  }
}
#lottery section.content .tag {
  font-weight: bold;
  font-size: 20px;
  color: #fff;
  display: inline-block;
  padding: 0px 20px;
  border-radius: 20px;
  height: 40px;
  line-height: 40px;
  margin-top: 30px;
}
#lottery section.content .tag.orange {
  background-color: #f56801;
}
#lottery section.content .tag.green {
  background-color: #00633e;
}
#lottery section.content .pad-left {
  padding-left: 20px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .pad-left {
    padding-left: 0px;
  }
}
#lottery section.content .s-head {
  font-weight: bold;
  font-size: 26px;
  margin-top: 15px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .s-head {
    font-size: 22px;
  }
}
#lottery section.content .s-head span {
  color: #ff5a61;
}
#lottery section.content .flex-chance {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-chance {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}
#lottery section.content .flex-chance .left .flex-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  width: 100%;
  max-width: 100%;
  -ms-flex-item-align: stretch;
  align-self: stretch;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-chance .left .flex-item {
    margin-top: 10px;
  }
}
#lottery section.content .flex-chance .left .flex-item .number {
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  background-color: #ffa265;
  width: 24px;
  min-width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 50%;
  text-align: center;
  margin-right: 15px;
  margin-top: 5px;
}
#lottery section.content .flex-chance .left .flex-item .text {
  font-size: 22px;
  line-height: 34px;
  width: 600px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-chance .left .flex-item .text {
    font-size: 18px;
    line-height: 1.7em;
    width: auto;
  }
}
#lottery section.content .flex-chance .right {
  margin-left: 15px;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-chance .right {
    text-align: center;
    margin-left: 0px;
    width: 100%;
  }
}
#lottery section.content .flex-chance .right img {
  width: 265px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-chance .right img {
    display: inline-block;
  }
}
#lottery section.content .flex-prize {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0px -5px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-prize {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}
#lottery section.content .flex-prize .item {
  padding: 0px 5px;
  width: 50%;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-prize .item {
    width: 100%;
  }
}
#lottery section.content .flex-prize .item .item-head {
  color: #ffa265;
  font-size: 18px;
  margin: 15px 0px;
  font-weight: bold;
}
#lottery section.content .flex-prize .item .item-head span {
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  background-color: #ffa265;
  display: inline-block;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  border-radius: 50%;
  margin-left: 5px;
}
#lottery section.content .flex-prize .item img {
  max-width: 100%;
}
#lottery section.content .ss-head {
  font-size: 20px;
  font-weight: bold;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .ss-head {
    font-size: 18px;
  }
}
#lottery section.content .ss-head.orange {
  color: #ffa265;
  margin-top: 30px;
}
#lottery section.content .ss-head.green {
  color: #53af38;
}
#lottery section.content .flex-item.prize {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-item.prize {
    margin-top: 10px;
  }
}
#lottery section.content .flex-item.prize .number {
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background-color: #ffa265;
  width: 20px;
  min-width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 50%;
  text-align: center;
  margin-right: 15px;
  margin-top: 5px;
}
#lottery section.content .flex-item.prize .text {
  font-size: 18px;
  line-height: 1.7em;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-item.prize .text {
    font-size: 15px;
  }
}
#lottery section.content .flex-item.prize .text span {
  color: #f56801;
  font-weight: bold;
}
#lottery section.content .flex-card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 30px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-card {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}
#lottery section.content .flex-card .left .text {
  margin-top: 15px;
  font-size: 22px;
  line-height: 1.7em;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-card .left .text {
    font-size: 18px;
  }
}
#lottery section.content .flex-card .left .text span {
  color: #53af38;
  font-weight: bold;
}
#lottery section.content .flex-card .right {
  margin-left: 30px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-card .right {
    margin-left: 0px;
    text-align: center;
    width: 100%;
  }
}
#lottery section.content .flex-card .right.pad {
  padding-top: 15px;
}
#lottery section.content .flex-card .right img {
  width: 300px;
}
#lottery section.content .grey {
  color: #7c7c7c;
  font-size: 18px;
  margin: 15px 0px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .grey {
    font-size: 15px;
  }
}
#lottery section.content .flex-item.card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-item.card {
    margin-top: 10px;
  }
}
#lottery section.content .flex-item.card .number {
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background-color: #53af38;
  width: 20px;
  min-width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 50%;
  text-align: center;
  margin-right: 15px;
  margin-top: 5px;
}
#lottery section.content .flex-item.card .text {
  font-size: 18px;
  line-height: 1.7em;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .flex-item.card .text {
    font-size: 15px;
  }
}
#lottery section.content .flex-item.card .text .head {
  font-weight: bold;
}
#lottery section.content .flex-item.card .text a {
  color: #f6b42c;
}
#lottery section.content .ss-head.mt {
  margin-top: 30px;
}
#lottery section.content .ss-head.mt10 {
  margin-top: 40px;
}
#lottery section.content .button-big-wrap {
  position: relative;
  margin-top: 30px;
}
#lottery section.content .button-big-wrap img {
  max-width: 100%;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .button-big-wrap img {
    display: none;
  }
}
#lottery section.content .button-big-wrap .button-wrap {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .button-big-wrap .button-wrap {
    position: static;
  }
}
#lottery section.content .button-big-wrap .button-wrap .button {
  width: 244px;
  height: 70px;
  background-image: url("../img/lottery-download.png");
  background-size: cover;
  background-position: center;
}
#lottery section.content .button-big-wrap .button-wrap .button:hover {
  background-image: url("../img/lottery-download-hover.png");
}
#lottery section.content .title.two {
  margin-top: 60px;
}
#lottery section.content .t2 {
  font-weight: bold;
  font-size: 22px;
  text-align: center;
  margin-top: 15px;
}
#lottery section.content .list-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 30px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .list-flex {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}
#lottery section.content .list-flex a {
  -webkit-transition: all 100ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 100ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 100ms cubic-bezier(0.68, 0, 0.265, 1);
  margin: 5px;
}
#lottery section.content .list-flex a:hover {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
@media screen and (max-width: 1023px) {
  #lottery section.content .list-flex a {
    width: 100%;
    text-align: center;
  }
  #lottery section.content .list-flex a.list-08 {
    -webkit-box-ordinal-group: 7;
    -ms-flex-order: 6;
    order: 6;
  }
  #lottery section.content .list-flex a.list-09 {
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
  }
  #lottery section.content .list-flex a.list-10 {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
  }
  #lottery section.content .list-flex a.list-11 {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }
  #lottery section.content .list-flex a.list-12 {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }
  #lottery section.content .list-flex a.list-s {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
  }
}
#lottery section.content .list-flex a img {
  width: 154px;
}
@media screen and (max-width: 1023px) {
  #lottery section.content .list-flex a img {
    width: 200px;
  }
}
#lottery .page-nav-desktop {
  position: fixed;
  top: 100px;
  right: -100px;
}
@media screen and (max-width: 1023px) {
  #lottery .page-nav-desktop {
    display: none;
  }
}
#lottery .page-nav-desktop img {
  width: 259px;
  display: block;
  -webkit-transition: all 100ms cubic-bezier(0.68, 0, 0.265, 1);
  -o-transition: all 100ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: all 100ms cubic-bezier(0.68, 0, 0.265, 1);
  cursor: pointer;
}
#lottery .page-nav-desktop img:hover {
  -webkit-transform: translateX(-30px);
  -ms-transform: translateX(-30px);
  transform: translateX(-30px);
}
#lottery .page-nav-mobile {
  display: none;
  position: fixed;
  bottom: 0px;
  left: 0px;
}
@media screen and (max-width: 1023px) {
  #lottery .page-nav-mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    background-color: #fff;
  }
}
#lottery .page-nav-mobile img {
  max-width: 256px;
  width: 100%;
  display: block;
}
@media screen and (max-width: 767px) {
  #lottery .page-nav-mobile img {
    max-width: 140px;
  }
}
@media screen and (max-width: 413px) {
  #lottery .page-nav-mobile img {
    max-width: 125px;
  }
}
#lottery .page-nav-mobile .item {
  position: relative;
}
#lottery .page-nav-mobile .item .line {
  position: absolute;
  left: 0px;
  top: 20%;
  width: 1px;
  height: 60%;
  background-color: #ccc;
}
@-moz-keyframes mouse {
  0% {
    transform: translateY(20px);
  }
  100% {
    transform: translateY(0px);
  }
}
@-webkit-keyframes mouse {
  0% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@-o-keyframes mouse {
  0% {
    transform: translateY(20px);
  }
  100% {
    transform: translateY(0px);
  }
}
@keyframes mouse {
  0% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@-moz-keyframes pop {
  0% {
    transform: scale(0);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
@-webkit-keyframes pop {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-o-keyframes pop {
  0% {
    transform: scale(0);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes pop {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-moz-keyframes shake {
  0% {
    transform: rotate(-15deg);
  }
  100% {
    transform: rotate(15deg);
  }
}
@-webkit-keyframes shake {
  0% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }
  100% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }
}
@-o-keyframes shake {
  0% {
    transform: rotate(-15deg);
  }
  100% {
    transform: rotate(15deg);
  }
}
@keyframes shake {
  0% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
  }
  100% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }
}
