div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    vertical-align: top
  }
}

main, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block
}

html, body {
  margin: 0;
  padding: 0
}

html {
  font-size: 62.5%;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%
}

body {
  line-height: 1.4
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  font-size: unset
}

blockquote, q {
  quotes: none
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

hr {
  height: 0
}

img, embed, object {
  width: 100%;
  height: auto;
  border: 0;
  vertical-align: middle
}

svg:not(:root) {
  overflow: hidden
}

input, select {
  vertical-align: middle
}

input, button, textarea, select, optgroup, option {
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit
}

button, input, optgroup, select, textarea {
  margin: 0
}

input[type="submit"], input[type="radio"], input[type="checkbox"], input[type="button"], input[type="reset"] {
  cursor: pointer
}

input[type="radio"], input[type="checkbox"] {
  padding: 0
}

button, select {
  cursor: pointer
}

a {
  text-decoration: none;
  background-color: transparent
}

a:active, a:hover {
  outline: 0
}

ul, ol {
  list-style: none
}

* {
  box-sizing: border-box
}

*::before, *::after {
  box-sizing: border-box
}

.col-1 {
  width: 8.333333%
}

.col-2 {
  width: 16.666667%
}

.col-3 {
  width: 25%
}

.col-4 {
  width: 33.333333%
}

.col-5 {
  width: 41.666667%
}

.col-6 {
  width: 50%
}

.col-7 {
  width: 58.333333%
}

.col-8 {
  width: 66.666667%
}

.col-9 {
  width: 75%
}

.col-10 {
  width: 83.333333%
}

.col-11 {
  width: 91.666667%
}

.col-12 {
  width: 100%
}

@-webkit-keyframes rotate-self2 {
  0% {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
}

@keyframes rotate-self2 {
  0% {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }
}

@-webkit-keyframes lipai-scale {
  0%, 50%, 100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }
  25%, 75% {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
  }
}

@keyframes lipai-scale {
  0%, 50%, 100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }
  25%, 75% {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
  }
}

@-webkit-keyframes incentive-scale {
  0%, 100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }
  50% {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
  }
}

@keyframes incentive-scale {
  0%, 100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }
  50% {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
  }
}

@-webkit-keyframes incentive-hover {
  0%, 100% {
    -webkit-transform: scale(0.9) translate(-5%, 0);
    transform: scale(0.9) translate(-5%, 0)
  }
  45%, 55% {
    -webkit-transform: scale(0.9) translate(-5%, -50px);
    transform: scale(0.9) translate(-5%, -50px)
  }
}

@keyframes incentive-hover {
  0%, 100% {
    -webkit-transform: scale(0.9) translate(-5%, 0);
    transform: scale(0.9) translate(-5%, 0)
  }
  45%, 55% {
    -webkit-transform: scale(0.9) translate(-5%, -50px);
    transform: scale(0.9) translate(-5%, -50px)
  }
}

@-webkit-keyframes ferris-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}

@keyframes ferris-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}

@-webkit-keyframes lollipop-rotate {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1)
  }
  50% {
    -webkit-transform: rotate(180deg) scale(1.1);
    transform: rotate(180deg) scale(1.1)
  }
  100% {
    -webkit-transform: rotate(360deg) scale(1);
    transform: rotate(360deg) scale(1)
  }
}

@keyframes lollipop-rotate {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1)
  }
  50% {
    -webkit-transform: rotate(180deg) scale(1.1);
    transform: rotate(180deg) scale(1.1)
  }
  100% {
    -webkit-transform: rotate(360deg) scale(1);
    transform: rotate(360deg) scale(1)
  }
}

@-webkit-keyframes box-open {
  0% {
    -webkit-transform: rotateX(53deg);
    transform: rotateX(53deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  20%, 24% {
    -webkit-transform: rotateX(43deg);
    transform: rotateX(43deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  22%, 26% {
    -webkit-transform: rotateX(48deg);
    transform: rotateX(48deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
}

@keyframes box-open {
  0% {
    -webkit-transform: rotateX(53deg);
    transform: rotateX(53deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  20%, 24% {
    -webkit-transform: rotateX(43deg);
    transform: rotateX(43deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  22%, 26% {
    -webkit-transform: rotateX(48deg);
    transform: rotateX(48deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
}

@-webkit-keyframes title-up {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(100vw * 0.15));
    transform: translateY(calc(100vw * 0.15))
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.2);
    transform: translateY(0) scale(1.2)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
  100% {
    opacity: 1
  }
}

@keyframes title-up {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(100vw * 0.15));
    transform: translateY(calc(100vw * 0.15))
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.2);
    transform: translateY(0) scale(1.2)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
  100% {
    opacity: 1
  }
}

@-webkit-keyframes title-down {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(-100vw * .5));
    transform: translateY(calc(-100vw * .5))
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.2);
    transform: translateY(0) scale(1.2)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
  100% {
    opacity: 1
  }
}

@keyframes title-down {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(-100vw * .5));
    transform: translateY(calc(-100vw * .5))
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.2);
    transform: translateY(0) scale(1.2)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
  100% {
    opacity: 1
  }
}

@-webkit-keyframes title-up-desktop {
  0% {
    -webkit-transform: translateY(190px);
    transform: translateY(190px)
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.1);
    transform: translateY(0) scale(1.1)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
}

@keyframes title-up-desktop {
  0% {
    -webkit-transform: translateY(190px);
    transform: translateY(190px)
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.1);
    transform: translateY(0) scale(1.1)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
}

@-webkit-keyframes partial__sub--hover {
  0% {
    -webkit-transform: translate(0, 0) rotate(0);
    transform: translate(0, 0) rotate(0)
  }
  50% {
    -webkit-transform: translate(10px, 10px) rotate(10deg);
    transform: translate(10px, 10px) rotate(10deg)
  }
  100% {
    -webkit-transform: translate(15px, 15px) rotate(-10deg);
    transform: translate(15px, 15px) rotate(-10deg)
  }
}

@keyframes partial__sub--hover {
  0% {
    -webkit-transform: translate(0, 0) rotate(0);
    transform: translate(0, 0) rotate(0)
  }
  50% {
    -webkit-transform: translate(10px, 10px) rotate(10deg);
    transform: translate(10px, 10px) rotate(10deg)
  }
  100% {
    -webkit-transform: translate(15px, 15px) rotate(-10deg);
    transform: translate(15px, 15px) rotate(-10deg)
  }
}

@-webkit-keyframes opacify-none {
  0%, 70% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}

@keyframes opacify-none {
  0%, 70% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}

@-webkit-keyframes lightSpot-move {
  0% {
    -webkit-transform: translateX(-40px);
    transform: translateX(-40px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  20% {
    -webkit-transform: translateX(73px);
    transform: translateX(73px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  40% {
    -webkit-transform: translateX(220px);
    transform: translateX(220px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  60% {
    -webkit-transform: translateX(390px);
    transform: translateX(390px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  80% {
    -webkit-transform: translateX(525px);
    transform: translateX(525px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  100% {
    -webkit-transform: translateX(615px);
    transform: translateX(615px);
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
    opacity: .8
  }
}

@keyframes lightSpot-move {
  0% {
    -webkit-transform: translateX(-40px);
    transform: translateX(-40px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  20% {
    -webkit-transform: translateX(73px);
    transform: translateX(73px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  40% {
    -webkit-transform: translateX(220px);
    transform: translateX(220px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  60% {
    -webkit-transform: translateX(390px);
    transform: translateX(390px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  80% {
    -webkit-transform: translateX(525px);
    transform: translateX(525px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  100% {
    -webkit-transform: translateX(615px);
    transform: translateX(615px);
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
    opacity: .8
  }
}

@-webkit-keyframes card-twinkling {
  0% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  21.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  22% {
    -webkit-filter: brightness(1000%);
    filter: brightness(1000%)
  }
  22.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  34.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  35% {
    -webkit-filter: brightness(1000%);
    filter: brightness(1000%)
  }
  35.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  50% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  75% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  100% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
}

@keyframes card-twinkling {
  0% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  21.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  22% {
    -webkit-filter: brightness(1000%);
    filter: brightness(1000%)
  }
  22.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  34.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  35% {
    -webkit-filter: brightness(1000%);
    filter: brightness(1000%)
  }
  35.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  50% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  75% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  100% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
}

@-webkit-keyframes breathing-light {
  0%, 100% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  25% {
    -webkit-filter: brightness(200%) blur(2px);
    filter: brightness(200%) blur(2px)
  }
  50% {
    -webkit-filter: brightness(300%) blur(4px);
    filter: brightness(300%) blur(4px)
  }
  75% {
    -webkit-filter: brightness(200%) blur(2px);
    filter: brightness(200%) blur(2px)
  }
}

@keyframes breathing-light {
  0%, 100% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  25% {
    -webkit-filter: brightness(200%) blur(2px);
    filter: brightness(200%) blur(2px)
  }
  50% {
    -webkit-filter: brightness(300%) blur(4px);
    filter: brightness(300%) blur(4px)
  }
  75% {
    -webkit-filter: brightness(200%) blur(2px);
    filter: brightness(200%) blur(2px)
  }
}

@-webkit-keyframes cycle-flash {
  0% {
    opacity: 1;
    -webkit-filter: contrast(200%);
    filter: contrast(200%)
  }
  100% {
    opacity: .8;
    cursor: pointer
  }
}

@keyframes cycle-flash {
  0% {
    opacity: 1;
    -webkit-filter: contrast(200%);
    filter: contrast(200%)
  }
  100% {
    opacity: .8;
    cursor: pointer
  }
}

@-webkit-keyframes self-rotate {
  10%, 30%, 70%, 90% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg)
  }
  50% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg)
  }
  60% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg)
  }
  0%, 20%, 40%, 80%, 100% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg)
  }
}

@keyframes self-rotate {
  10%, 30%, 70%, 90% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg)
  }
  50% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg)
  }
  60% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg)
  }
  0%, 20%, 40%, 80%, 100% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg)
  }
}

@-webkit-keyframes chair-rotate {
  45%, 55% {
    -webkit-transform: scale(1.1) rotate(5deg);
    transform: scale(1.1) rotate(5deg)
  }
  50%, 60% {
    -webkit-transform: scale(1.1) rotate(-5deg);
    transform: scale(1.1) rotate(-5deg)
  }
  0%, 25%, 100% {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }
}

@keyframes chair-rotate {
  45%, 55% {
    -webkit-transform: scale(1.1) rotate(5deg);
    transform: scale(1.1) rotate(5deg)
  }
  50%, 60% {
    -webkit-transform: scale(1.1) rotate(-5deg);
    transform: scale(1.1) rotate(-5deg)
  }
  0%, 25%, 100% {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }
}

@-webkit-keyframes left-move {
  0%, 100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  25% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px)
  }
  75% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px)
  }
}

@keyframes left-move {
  0%, 100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  25% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px)
  }
  75% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px)
  }
}

@-webkit-keyframes lion-l-move {
  0%, 50%, 100% {
    -webkit-transform: translateX(-150px);
    transform: translateX(-150px)
  }
  60%, 70% {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  75% {
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px)
  }
}

@keyframes lion-l-move {
  0%, 50%, 100% {
    -webkit-transform: translateX(-150px);
    transform: translateX(-150px)
  }
  60%, 70% {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  75% {
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px)
  }
}

@-webkit-keyframes lion-r-move {
  0%, 50%, 100% {
    transform: translateX(130px);
    -webkit-transform: translateX(130px)
  }
  60%, 70%, 75% {
    transform: translateX(0);
    -webkit-transform: translateX(0)
  }
}

@keyframes lion-r-move {
  0%, 50%, 100% {
    transform: translateX(130px);
    -webkit-transform: translateX(130px)
  }
  60%, 70%, 75% {
    transform: translateX(0);
    -webkit-transform: translateX(0)
  }
}

@-webkit-keyframes car-run {
  0% {
    left: 0
  }
  10%, 13% {
    left: 15%;
    opacity: 1
  }
  40% {
    left: 70%;
    opacity: 1
  }
  100% {
    left: 200%
  }
}

@keyframes car-run {
  0% {
    left: 0
  }
  10%, 13% {
    left: 15%;
    opacity: 1
  }
  40% {
    left: 70%;
    opacity: 1
  }
  100% {
    left: 200%
  }
}

@-webkit-keyframes candle-light {
  0% {
    -webkit-transform: translate(-20px, 50px) scale(0);
    transform: translate(-20px, 50px) scale(0)
  }
  3% {
    -webkit-transform: translate(0, 0) scale(0.3);
    transform: translate(0, 0) scale(0.3)
  }
  8%, 100% {
    -webkit-transform: translate(0, 0) scale(1);
    transform: translate(0, 0) scale(1)
  }
}

@keyframes candle-light {
  0% {
    -webkit-transform: translate(-20px, 50px) scale(0);
    transform: translate(-20px, 50px) scale(0)
  }
  3% {
    -webkit-transform: translate(0, 0) scale(0.3);
    transform: translate(0, 0) scale(0.3)
  }
  8%, 100% {
    -webkit-transform: translate(0, 0) scale(1);
    transform: translate(0, 0) scale(1)
  }
}

@-webkit-keyframes flash-title {
  0% {
    background-position-y: 4870px
  }
  5% {
    background-position-y: 4870px
  }
  7% {
    background-position-y: 0
  }
  100% {
    background-position-y: 0
  }
}

@keyframes flash-title {
  0% {
    background-position-y: 4870px
  }
  5% {
    background-position-y: 4870px
  }
  7% {
    background-position-y: 0
  }
  100% {
    background-position-y: 0
  }
}

@-webkit-keyframes title-effect {
  0% {
    opacity: 1;
    -webkit-transform: scale(3.5);
    transform: scale(3.5)
  }
  10%, 40%, 45%, 53%, 100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  43%, 50% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
  }
}

@keyframes title-effect {
  0% {
    opacity: 1;
    -webkit-transform: scale(3.5);
    transform: scale(3.5)
  }
  10%, 40%, 45%, 53%, 100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  43%, 50% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
  }
}

@-webkit-keyframes title-mask {
  0%, 100% {
    opacity: 1
  }
  20% {
    -webkit-filter: brightness(300%);
    filter: brightness(300%)
  }
  25%, 50% {
    opacity: 0;
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
}

@keyframes title-mask {
  0%, 100% {
    opacity: 1
  }
  20% {
    -webkit-filter: brightness(300%);
    filter: brightness(300%)
  }
  25%, 50% {
    opacity: 0;
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
}

@-webkit-keyframes pig-move {
  20% {
    -webkit-transform: rotate(0) translate(0, 15%);
    transform: rotate(0) translate(0, 15%)
  }
  40% {
    -webkit-transform: rotate(-5deg) translate(0, 6%);
    transform: rotate(-5deg) translate(0, 6%)
  }
  50% {
    -webkit-transform: rotate(5deg) translate(0, 6%);
    transform: rotate(5deg) translate(0, 6%)
  }
  60% {
    -webkit-transform: rotate(-5deg) translate(0, 6%);
    transform: rotate(-5deg) translate(0, 6%)
  }
  0%, 100% {
    -webkit-transform: rotate(0deg) translate(0, 0);
    transform: rotate(0deg) translate(0, 0)
  }
}

@keyframes pig-move {
  20% {
    -webkit-transform: rotate(0) translate(0, 15%);
    transform: rotate(0) translate(0, 15%)
  }
  40% {
    -webkit-transform: rotate(-5deg) translate(0, 6%);
    transform: rotate(-5deg) translate(0, 6%)
  }
  50% {
    -webkit-transform: rotate(5deg) translate(0, 6%);
    transform: rotate(5deg) translate(0, 6%)
  }
  60% {
    -webkit-transform: rotate(-5deg) translate(0, 6%);
    transform: rotate(-5deg) translate(0, 6%)
  }
  0%, 100% {
    -webkit-transform: rotate(0deg) translate(0, 0);
    transform: rotate(0deg) translate(0, 0)
  }
}

@-webkit-keyframes description-start {
  0%, 40% {
    opacity: 0;
    -webkit-transform: translate(0);
    transform: translate(0)
  }
  50%, 60%, 70%, 80%, 90% {
    -webkit-transform: translate(-10px, 0);
    transform: translate(-10px, 0)
  }
  45%, 55%, 65%, 75%, 85%, 95% {
    -webkit-transform: translate(10px, 0);
    transform: translate(10px, 0)
  }
  100% {
    -webkit-transform: none;
    transform: none;
    opacity: 1
  }
}

@keyframes description-start {
  0%, 40% {
    opacity: 0;
    -webkit-transform: translate(0);
    transform: translate(0)
  }
  50%, 60%, 70%, 80%, 90% {
    -webkit-transform: translate(-10px, 0);
    transform: translate(-10px, 0)
  }
  45%, 55%, 65%, 75%, 85%, 95% {
    -webkit-transform: translate(10px, 0);
    transform: translate(10px, 0)
  }
  100% {
    -webkit-transform: none;
    transform: none;
    opacity: 1
  }
}

@-webkit-keyframes description-shake {
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate(-10px, 0);
    transform: translate(-10px, 0)
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate(10px, 0);
    transform: translate(10px, 0)
  }
  0%, 100% {
    -webkit-transform: none;
    transform: none;
    opacity: 1
  }
}

@keyframes description-shake {
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate(-10px, 0);
    transform: translate(-10px, 0)
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate(10px, 0);
    transform: translate(10px, 0)
  }
  0%, 100% {
    -webkit-transform: none;
    transform: none;
    opacity: 1
  }
}

@keyframes rotate-self2 {
  0% {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
}

@-webkit-keyframes blink {
  0%, 25%, 100% {
    -webkit-filter: brightness(1);
    filter: brightness(1)
  }
  18.9%, 22.9% {
    -webkit-filter: brightness(2);
    filter: brightness(2)
  }
  19%, 23% {
    -webkit-filter: brightness(1);
    filter: brightness(1)
  }
}

@keyframes blink {
  0%, 25%, 100% {
    -webkit-filter: brightness(1);
    filter: brightness(1)
  }
  18.9%, 22.9% {
    -webkit-filter: brightness(2);
    filter: brightness(2)
  }
  19%, 23% {
    -webkit-filter: brightness(1);
    filter: brightness(1)
  }
}

@-webkit-keyframes light-rotate {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5)
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@keyframes light-rotate {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5)
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@-webkit-keyframes title-color {
  0% {
    -webkit-filter: hue-rotate(0deg);
    filter: hue-rotate(0deg)
  }
  100% {
    -webkit-filter: hue-rotate(45deg);
    filter: hue-rotate(45deg)
  }
}

@keyframes title-color {
  0% {
    -webkit-filter: hue-rotate(0deg);
    filter: hue-rotate(0deg)
  }
  100% {
    -webkit-filter: hue-rotate(45deg);
    filter: hue-rotate(45deg)
  }
}

@-webkit-keyframes partial__sub {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}

@keyframes partial__sub {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}

@-webkit-keyframes circle_rotate {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }
  16% {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
  }
  50% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
  83% {
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg)
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
}

@keyframes circle_rotate {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }
  16% {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
  }
  50% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
  83% {
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg)
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
}

@-webkit-keyframes circle_translateY_m {
  0%, 100% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
  25% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px)
  }
  50% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
  75% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px)
  }
}

@keyframes circle_translateY_m {
  0%, 100% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
  25% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px)
  }
  50% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
  75% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px)
  }
}

@-webkit-keyframes circle_translateY {
  0%, 100% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px)
  }
  25% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px)
  }
  50% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px)
  }
  75% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px)
  }
}

@keyframes circle_translateY {
  0%, 100% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px)
  }
  25% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px)
  }
  50% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px)
  }
  75% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px)
  }
}

@-webkit-keyframes color__change {
  0%, 100% {
    -webkit-filter: hue-rotate(0deg);
    filter: hue-rotate(0deg)
  }
  25% {
    -webkit-filter: hue-rotate(90deg);
    filter: hue-rotate(90deg)
  }
  50% {
    -webkit-filter: hue-rotate(180deg);
    filter: hue-rotate(180deg)
  }
  75% {
    -webkit-filter: hue-rotate(270deg);
    filter: hue-rotate(270deg)
  }
}

@keyframes color__change {
  0%, 100% {
    -webkit-filter: hue-rotate(0deg);
    filter: hue-rotate(0deg)
  }
  25% {
    -webkit-filter: hue-rotate(90deg);
    filter: hue-rotate(90deg)
  }
  50% {
    -webkit-filter: hue-rotate(180deg);
    filter: hue-rotate(180deg)
  }
  75% {
    -webkit-filter: hue-rotate(270deg);
    filter: hue-rotate(270deg)
  }
}

body {
  font-family: PingFangTC-regular, "LiHei Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Source Han Sans TC", "Microsoft JhengHei", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.clearfix::after {
  content: "";
  display: block;
  clear: both
}

.note ol {
  list-style-type: decimal
}

.note ul {
  list-style-type: disc
}

.block--center {
  margin-left: auto;
  margin-right: auto
}

.text--right {
  text-align: right
}

.text--center {
  text-align: center
}

.text--left {
  text-align: left
}

.m-top--xs {
  margin-top: 1%
}

.m-top--sm {
  margin-top: 2%
}

.m-top--md {
  margin-top: 3%
}

.m-top--lg {
  margin-top: 4%
}

.m-bottom--xs {
  margin-bottom: 1%
}

.m-bottom--sm {
  margin-bottom: 2%
}

.m-bottom--md {
  margin-bottom: 3%
}

.m-bottom--lg {
  margin-bottom: 4%
}

.m-bottom--xl {
  margin-bottom: 5%
}

.m-right--xs {
  margin-right: 1%
}

.m-right--sm {
  margin-right: 2%
}

.m-right--md {
  margin-right: 3%
}

.m-right-px--xs {
  margin-right: 5px
}

.m-right-px--sm {
  margin-right: 10px
}

.m-right-px--md {
  margin-right: 15px
}

.m-right--em {
  margin-right: 0.5em
}

.padding-xs {
  padding: 1%
}

.padding-sm {
  padding: 2%
}

.padding-md {
  padding: 3%
}

.padding-lg {
  padding: 4%
}

.p-bottom--xs {
  padding-bottom: 1%
}

.p-bottom--sm {
  padding-bottom: 2%
}

.p-bottom--md {
  padding-bottom: 3%
}

.p-bottom--lg {
  padding-bottom: 4%
}

.p-bottom--xl {
  padding-bottom: 5%
}

.default-border {
  border: 1px solid #8a8a8d
}

.layout--main {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 960px
}

.one-screen {
  width: 100%;
  height: 100vh
}

.n-pic {
  position: relative
}

@keyframes rotate-self2 {
  0% {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
  }
}

@keyframes lipai-scale {
  0%, 50%, 100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }
  25%, 75% {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
  }
}

@keyframes incentive-scale {
  0%, 100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }
  50% {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
  }
}

@keyframes incentive-hover {
  0%, 100% {
    -webkit-transform: scale(0.9) translate(-5%, 0);
    transform: scale(0.9) translate(-5%, 0)
  }
  45%, 55% {
    -webkit-transform: scale(0.9) translate(-5%, -50px);
    transform: scale(0.9) translate(-5%, -50px)
  }
}

@keyframes ferris-rotate {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}

@keyframes lollipop-rotate {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1)
  }
  50% {
    -webkit-transform: rotate(180deg) scale(1.1);
    transform: rotate(180deg) scale(1.1)
  }
  100% {
    -webkit-transform: rotate(360deg) scale(1);
    transform: rotate(360deg) scale(1)
  }
}

@keyframes box-open {
  0% {
    -webkit-transform: rotateX(53deg);
    transform: rotateX(53deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  20%, 24% {
    -webkit-transform: rotateX(43deg);
    transform: rotateX(43deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  22%, 26% {
    -webkit-transform: rotateX(48deg);
    transform: rotateX(48deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom
  }
}

@keyframes title-up {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(100vw * 0.15));
    transform: translateY(calc(100vw * 0.15))
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.2);
    transform: translateY(0) scale(1.2)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
  100% {
    opacity: 1
  }
}

@keyframes title-down {
  0% {
    opacity: 0;
    -webkit-transform: translateY(calc(-100vw * .5));
    transform: translateY(calc(-100vw * .5))
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.2);
    transform: translateY(0) scale(1.2)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
  100% {
    opacity: 1
  }
}

@keyframes title-up-desktop {
  0% {
    -webkit-transform: translateY(190px);
    transform: translateY(190px)
  }
  70%, 80% {
    -webkit-transform: translateY(0) scale(1.1);
    transform: translateY(0) scale(1.1)
  }
  75%, 100% {
    -webkit-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
}

@keyframes partial__sub--hover {
  0% {
    -webkit-transform: translate(0, 0) rotate(0);
    transform: translate(0, 0) rotate(0)
  }
  50% {
    -webkit-transform: translate(10px, 10px) rotate(10deg);
    transform: translate(10px, 10px) rotate(10deg)
  }
  100% {
    -webkit-transform: translate(15px, 15px) rotate(-10deg);
    transform: translate(15px, 15px) rotate(-10deg)
  }
}

@keyframes opacify-none {
  0%, 70% {
    opacity: 1
  }
  100% {
    opacity: 0
  }
}

@keyframes lightSpot-move {
  0% {
    -webkit-transform: translateX(-40px);
    transform: translateX(-40px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  20% {
    -webkit-transform: translateX(73px);
    transform: translateX(73px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  40% {
    -webkit-transform: translateX(220px);
    transform: translateX(220px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  60% {
    -webkit-transform: translateX(390px);
    transform: translateX(390px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  80% {
    -webkit-transform: translateX(525px);
    transform: translateX(525px);
    -webkit-filter: brightness(500%);
    filter: brightness(500%);
    opacity: .8
  }
  100% {
    -webkit-transform: translateX(615px);
    transform: translateX(615px);
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
    opacity: .8
  }
}

@keyframes card-twinkling {
  0% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  21.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  22% {
    -webkit-filter: brightness(1000%);
    filter: brightness(1000%)
  }
  22.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  34.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  35% {
    -webkit-filter: brightness(1000%);
    filter: brightness(1000%)
  }
  35.5% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  50% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  75% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  100% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
}

@keyframes breathing-light {
  0%, 100% {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
  25% {
    -webkit-filter: brightness(200%) blur(2px);
    filter: brightness(200%) blur(2px)
  }
  50% {
    -webkit-filter: brightness(300%) blur(4px);
    filter: brightness(300%) blur(4px)
  }
  75% {
    -webkit-filter: brightness(200%) blur(2px);
    filter: brightness(200%) blur(2px)
  }
}

@keyframes cycle-flash {
  0% {
    opacity: 1;
    -webkit-filter: contrast(200%);
    filter: contrast(200%)
  }
  100% {
    opacity: .8;
    cursor: pointer
  }
}

@keyframes self-rotate {
  10%, 30%, 70%, 90% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg)
  }
  50% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg)
  }
  60% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg)
  }
  0%, 20%, 40%, 80%, 100% {
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg)
  }
}

@keyframes chair-rotate {
  45%, 55% {
    -webkit-transform: scale(1.1) rotate(5deg);
    transform: scale(1.1) rotate(5deg)
  }
  50%, 60% {
    -webkit-transform: scale(1.1) rotate(-5deg);
    transform: scale(1.1) rotate(-5deg)
  }
  0%, 25%, 100% {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }
}

@keyframes left-move {
  0%, 100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  25% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px)
  }
  75% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px)
  }
}

@keyframes lion-l-move {
  0%, 50%, 100% {
    -webkit-transform: translateX(-150px);
    transform: translateX(-150px)
  }
  60%, 70% {
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  75% {
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px)
  }
}

@keyframes lion-r-move {
  0%, 50%, 100% {
    transform: translateX(130px);
    -webkit-transform: translateX(130px)
  }
  60%, 70%, 75% {
    transform: translateX(0);
    -webkit-transform: translateX(0)
  }
}

@keyframes car-run {
  0% {
    left: 0
  }
  10%, 13% {
    left: 15%;
    opacity: 1
  }
  40% {
    left: 70%;
    opacity: 1
  }
  100% {
    left: 200%
  }
}

@keyframes candle-light {
  0% {
    -webkit-transform: translate(-20px, 50px) scale(0);
    transform: translate(-20px, 50px) scale(0)
  }
  3% {
    -webkit-transform: translate(0, 0) scale(0.3);
    transform: translate(0, 0) scale(0.3)
  }
  8%, 100% {
    -webkit-transform: translate(0, 0) scale(1);
    transform: translate(0, 0) scale(1)
  }
}

@keyframes flash-title {
  0% {
    background-position-y: 4870px
  }
  5% {
    background-position-y: 4870px
  }
  7% {
    background-position-y: 0
  }
  100% {
    background-position-y: 0
  }
}

@keyframes title-effect {
  0% {
    opacity: 1;
    -webkit-transform: scale(3.5);
    transform: scale(3.5)
  }
  10%, 40%, 45%, 53%, 100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
  43%, 50% {
    opacity: 1;
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
  }
}

@keyframes title-mask {
  0%, 100% {
    opacity: 1
  }
  20% {
    -webkit-filter: brightness(300%);
    filter: brightness(300%)
  }
  25%, 50% {
    opacity: 0;
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
  }
}

@keyframes pig-move {
  20% {
    -webkit-transform: rotate(0) translate(0, 15%);
    transform: rotate(0) translate(0, 15%)
  }
  40% {
    -webkit-transform: rotate(-5deg) translate(0, 6%);
    transform: rotate(-5deg) translate(0, 6%)
  }
  50% {
    -webkit-transform: rotate(5deg) translate(0, 6%);
    transform: rotate(5deg) translate(0, 6%)
  }
  60% {
    -webkit-transform: rotate(-5deg) translate(0, 6%);
    transform: rotate(-5deg) translate(0, 6%)
  }
  0%, 100% {
    -webkit-transform: rotate(0deg) translate(0, 0);
    transform: rotate(0deg) translate(0, 0)
  }
}

@keyframes description-start {
  0%, 40% {
    opacity: 0;
    -webkit-transform: translate(0);
    transform: translate(0)
  }
  50%, 60%, 70%, 80%, 90% {
    -webkit-transform: translate(-10px, 0);
    transform: translate(-10px, 0)
  }
  45%, 55%, 65%, 75%, 85%, 95% {
    -webkit-transform: translate(10px, 0);
    transform: translate(10px, 0)
  }
  100% {
    -webkit-transform: none;
    transform: none;
    opacity: 1
  }
}

@keyframes description-shake {
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate(-10px, 0);
    transform: translate(-10px, 0)
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate(10px, 0);
    transform: translate(10px, 0)
  }
  0%, 100% {
    -webkit-transform: none;
    transform: none;
    opacity: 1
  }
}

@keyframes rotate-self2 {
  0% {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
}

@keyframes blink {
  0%, 25%, 100% {
    -webkit-filter: brightness(1);
    filter: brightness(1)
  }
  18.9%, 22.9% {
    -webkit-filter: brightness(2);
    filter: brightness(2)
  }
  19%, 23% {
    -webkit-filter: brightness(1);
    filter: brightness(1)
  }
}

@keyframes light-rotate {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5)
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@keyframes title-color {
  0% {
    -webkit-filter: hue-rotate(0deg);
    filter: hue-rotate(0deg)
  }
  100% {
    -webkit-filter: hue-rotate(45deg);
    filter: hue-rotate(45deg)
  }
}

@keyframes partial__sub {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}

@keyframes circle_rotate {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }
  16% {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg)
  }
  50% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
  83% {
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg)
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
}

@keyframes circle_translateY_m {
  0%, 100% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
  25% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px)
  }
  50% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
  75% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px)
  }
}

@keyframes circle_translateY {
  0%, 100% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px)
  }
  25% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px)
  }
  50% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px)
  }
  75% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px)
  }
}

@keyframes color__change {
  0%, 100% {
    -webkit-filter: hue-rotate(0deg);
    filter: hue-rotate(0deg)
  }
  25% {
    -webkit-filter: hue-rotate(90deg);
    filter: hue-rotate(90deg)
  }
  50% {
    -webkit-filter: hue-rotate(180deg);
    filter: hue-rotate(180deg)
  }
  75% {
    -webkit-filter: hue-rotate(270deg);
    filter: hue-rotate(270deg)
  }
}

.logo {
  display: none
}

@media screen and (min-width: 960px) {
  .logo {
    display: block;
    position: absolute;
    top: 25px;
    left: calc(50% - 450px);
    z-index: 101
  }
  .logo img {
    width: 70%;
    height: auto
  }
}

.promo__group--scroll-x {
  background: center 0 url(bg-scroll-x-m.png) no-repeat;
  background-size: 99%
}

.promo__group--scroll-x .scroll-x__wrap {
  padding: 0.75% 0;
  width: 96.8%
}

.promo__group--scroll-x .scroll-x__wrap .scroll-x__zone {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow-x: scroll;
  -ms-overflow-x: auto;
  scrollbar-width: none
}

.promo__group--scroll-x .scroll-x__wrap .scroll-x__zone::after {
  content: "";
  display: block;
  clear: both
}

.promo__group--scroll-x .scroll-x__wrap .scroll-x__zone li {
  float: left
}

.promo__group--scroll-x .scroll-x__wrap .scroll-x__zone::-webkit-scrollbar {
  display: none
}

.promo__group--scroll-x .scroll-x__wrap .scroll-x__zone li {
  width: 28%;
  -webkit-box-flex: 1;
  -ms-flex: 1 0 28%;
  flex: 1 0 28%
}

@media screen and (min-width: 960px) {
  .promo__group--scroll-x {
    background: center 0 url(bg-scroll-x.png) no-repeat;
    background-size: auto
  }
  .promo__group--scroll-x .scroll-x__wrap {
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    width: 864px
  }
  .promo__group--scroll-x .scroll-x__wrap .scroll-x__zone {
    overflow-x: visible
  }
  .promo__group--scroll-x .scroll-x__wrap .scroll-x__zone li {
    width: 20%;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 20%;
    flex: 1 0 20%;
    padding: 7px 0
  }
  .promo__group--scroll-x .scroll-x__wrap .scroll-x__zone li img {
    width: 100%
  }
}

body {
  background-color: #13024c
}

@media screen and (min-width: 960px) {
  .header__wrap img {
    width: auto
  }
}

.btn--promo {
  -webkit-transition: all 0.5s;
  transition: all 0.5s
}

.btn--promo:hover {
  -webkit-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
  -webkit-filter: brightness(120%);
  filter: brightness(120%)
}

.layout--main {
  position: relative
}

.sp__wrap {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  margin-left: auto;
  margin-right: auto
}

@media screen and (min-width: 960px) {
  .sp__wrap {
    max-width: 960px;
    overflow: visible
  }
}

.main_group {
  overflow: hidden;
  background-image: url(bg-960-01.jpg);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center top;
  -webkit-transform-origin: left;
  -ms-transform-origin: left;
  transform-origin: left;
  height: auto;
  min-height: calc(100vw * 1)
}

.main_group .title__wrap--main img {
  top: calc(100vw * .15);
  left: calc(100vw * .019);
  width: 50%;
  z-index: 2
}

.main_group .title__bg {
  top: calc(100vw * .028);
  left: calc(-100vw * .031);
  width: 84%;
  z-index: 1
}

.main_group .main__product {
  z-index: 21
}

.main_group .main__titleSub {
  top: calc(100vw * .48);
  left: calc(100vw * .03);
  width: 48%;
  z-index: 2
}

.main_group .title__decoration {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

.main_group .title__decoration img {
  width: 20%;
  position: absolute
}

.main_group .title__decoration img:nth-child(1), .main_group .title__decoration img:nth-child(2), .main_group .title__decoration img:nth-child(3), .main_group .title__decoration img:nth-child(4), .main_group .title__decoration img:nth-child(5) {
  display: none
}

.main_group .title__decoration img:nth-child(6) {
  top: calc(100vw * .22);
  right: calc(100vw * .24);
  width: 7%
}

.main_group .title__decoration img:nth-child(7) {
  top: calc(100vw * .56);
  left: calc(100vw * .03);
  width: 11%;
  -webkit-transform: rotate(50deg);
  -ms-transform: rotate(50deg);
  transform: rotate(50deg)
}

@media screen and (min-width: 960px) {
  .main_group {
    overflow: visible;
    min-height: 1053px
  }
  .main_group .title__wrap--main img {
    top: 140px;
    left: -3px;
    width: 59%
  }
  .main_group .title__bg {
    top: 15px;
    left: -75px;
    width: auto
  }
  .main_group .main__product {
    -webkit-transform: scale(0.98);
    -ms-transform: scale(0.98);
    transform: scale(0.98)
  }
  .main_group .main__titleSub {
    top: 495px;
    left: 9px;
    width: auto
  }
  .main_group .title__decoration img {
    width: auto
  }
  .main_group .title__decoration img:nth-child(1), .main_group .title__decoration img:nth-child(2), .main_group .title__decoration img:nth-child(3), .main_group .title__decoration img:nth-child(4), .main_group .title__decoration img:nth-child(5) {
    display: block
  }
  .main_group .title__decoration img:nth-child(1) {
    top: 1810px;
    left: calc(-120% + 765px);
    width: auto
  }
  .main_group .title__decoration img:nth-child(2) {
    top: 713px;
    left: calc(50% - 1055px);
    width: auto
  }
  .main_group .title__decoration img:nth-child(3) {
    top: 261px;
    left: calc(50% + 963px);
    width: auto
  }
  .main_group .title__decoration img:nth-child(4) {
    top: 337px;
    left: calc(50% - 930px);
    width: auto
  }
  .main_group .title__decoration img:nth-child(5) {
    top: 115px;
    left: calc(50% + 425px);
    width: auto
  }
  .main_group .title__decoration img:nth-child(6) {
    top: 75px;
    right: calc(50% - 532px);
    width: auto
  }
  .main_group .title__decoration img:nth-child(7) {
    top: 945px;
    left: calc(50% - 273px);
    width: auto
  }
}

.main_title {
  margin: 0 auto;
  position: relative;
  z-index: 21;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  height: 100%
}

.main_title img {
  position: absolute;
  height: auto;
  display: block
}

.promo__event {
  margin-top: calc(-100vw * 0.27);
  padding-bottom: 15px;
  position: relative;
  z-index: 21
}

.promo__event .event__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}

.promo__event .event__wrap::after {
  content: "";
  display: block;
  clear: both
}

.promo__event .event__wrap li {
  float: left
}

.promo__event .event__wrap li.incentive--01 {
  width: 28.75%;
  position: relative;
  top: calc(-100vw * 0.03125)
}

.promo__event .event__wrap li.incentive--02 {
  width: 24.375%
}

.promo__event .event__wrap li.incentive--03 {
  width: 25%
}

.promo__event .event__wrap li.incentive--04 {
  width: 21.875%
}

.promo__event .event__wrap li a img {
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  width: 100%
}

@media screen and (min-width: 960px) {
  .promo__event {
    margin-top: -298px
  }
  .promo__event .event__wrap li.incentive--01 {
    width: 30%;
    top: -160px
  }
  .promo__event .event__wrap li.incentive--02 {
    width: 24%
  }
  .promo__event .event__wrap li.incentive--03 {
    margin-top: -65px;
    width: 24.5%
  }
  .promo__event .event__wrap li.incentive--04 {
    margin-top: 60px;
    width: 21.5%
  }
  .promo__event .event__wrap li a img {
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    width: 100%
  }
  .promo__event .event__wrap li a img:hover {
    -webkit-animation: .4s circle_rotate;
    animation: .4s circle_rotate
  }
}

.sp__outFrame {
  background-color: #13024c;
  background-image: none;
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center top
}

@media screen and (min-width: 960px) {
  .sp__outFrame {
    background-image: url(bg-2560-01.jpg);
    background-size: 2560px 1063px;
    min-height: 1063px;
    overflow: hidden
  }
}

@media screen and (min-width: 960px) {
  .decoration-2-left {
    position: absolute;
    z-index: 4;
    top: 889px;
    left: calc(50% - 1118px);
    width: 668px;
    height: 783px;
    background: center top url(2-decoration-all-1.png) no-repeat;
    background-size: 668px 783px
  }
}

@media screen and (min-width: 960px) {
  .decoration-2-right {
    position: absolute;
    z-index: 4;
    top: 989px;
    right: calc(50% - 1070px);
    width: 514px;
    height: 783px;
    background: center top url(2-decoration-all-2.png) no-repeat;
    background-size: 514px 783px
  }
}

.bar_catchplay {
  display: block;
  background: center top url(bankbar_s.png) no-repeat;
  background-size: 96% auto;
  height: calc(100vw * 0.174);
  margin-bottom: 5px;
  position: relative;
  z-index: 3
}

@media screen and (min-width: 960px) {
  .bar_catchplay {
    background: center top url(bg-2560-bankbar.jpg) no-repeat, center top url(bankbar.png) no-repeat;
    height: 110px;
    background-size: 2560px 110px;
    margin-bottom: 0
  }
}

.promo__group .promo__wrap {
  position: relative;
  z-index: 0
}

.promo__group .promo__wrap .promo__slider, .promo__group .promo__wrap .video__wrap {
  position: absolute;
  z-index: 1;
  top: 20%;
  left: 0;
  width: 100%;
  height: 80%
}

.promo__group-3 {
  background: center 0 url(bg-2560-03.jpg) no-repeat;
  background-size: cover
}

.promo__group-3 .promo__wrap {
  padding-top: 62%
}

.promo__group-3 .promo__wrap .promo__slider {
  top: 20%
}

.promo__group-3 .promo__wrap .swiper-slide a {
  display: block;
  -webkit-transition: -webkit-transform 0.6s;
  transition: -webkit-transform 0.6s;
  transition: transform 0.6s;
  transition: transform 0.6s, -webkit-transform 0.6s;
  -webkit-transform: translateY(-20%) scale(0.5);
  -ms-transform: translateY(-20%) scale(0.5);
  transform: translateY(-20%) scale(0.5)
}

@media screen and (min-width: 768px) {
  .promo__group-3 .promo__wrap {
    padding-top: 57%
  }
  .promo__group-3 .promo__wrap .promo__slider {
    top: 19%
  }
  .promo__group-3 .promo__wrap .swiper-slide a {
    -webkit-transform: translateY(-10%) scale(0.8);
    -ms-transform: translateY(-10%) scale(0.8);
    transform: translateY(-10%) scale(0.8)
  }
  .promo__group-3 .promo__wrap .swiper-slide img {
    opacity: .8
  }
  .promo__group-3 .promo__wrap .swiper-slide-active a, .promo__group-3 .promo__wrap .swiper-slide-duplicate-active a {
    -webkit-transform: translateY(30%) scale(1.5);
    -ms-transform: translateY(30%) scale(1.5);
    transform: translateY(30%) scale(1.5)
  }
  .promo__group-3 .promo__wrap .swiper-slide-active img, .promo__group-3 .promo__wrap .swiper-slide-duplicate-active img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    opacity: 1
  }
}

.promo__group-3 .swiper-button-next, .promo__group-3 .swiper-button-prev {
  width: 17px;
  height: 31px;
  background-size: 17px 31px
}

@media screen and (min-width: 960px) {
  .promo__group-3 .swiper-button-next, .promo__group-3 .swiper-button-prev {
    width: 27px;
    height: 44px;
    background-size: 27px 44px
  }
}

.promo__group-4 {
  background: center 0 url(bg-2560-04.jpg) no-repeat;
  background-size: cover
}

.promo__group-4 .promo__wrap {
  padding-top: 71%
}

.promo__group-4 .promo__wrap .video__wrap {
  padding-bottom: 6%;
  top: 23%;
  width: 88%;
  height: 78%;
  left: 50%;
  -webkit-transform: translateX(-48.3%);
  -ms-transform: translateX(-48.3%);
  transform: translateX(-48.3%)
}

.promo__group-4 .promo__wrap .video__wrap iframe {
  width: 100%;
  height: 100%
}

.promo__group-5 {
  background: center 0 url(bg-2560-05.jpg) no-repeat;
  background-size: 260% auto
}

.promo__group-5 .layout--main, .promo__group-5 .promo__wrap {
  max-width: 100%
}

@media screen and (min-width: 960px) {
  .promo__group-5 .layout--main, .promo__group-5 .promo__wrap {
    max-width: 1240px
  }
}

.promo__group-5 a {
  display: block
}

.promo__group-5 .promo__wrap {
  padding-top: 64%
}

.promo__group-5 .promo__wrap .promo__slider {
  height: 70%
}

@media screen and (min-width: 960px) {
  .promo__group-5 .promo__wrap .promo__slider {
    height: 70%;
    top: 21%
  }
}

.promo__group-5 .promo__wrap .swiper-slide a {
  -webkit-transition: -webkit-transform 0.6s;
  transition: -webkit-transform 0.6s;
  transition: transform 0.6s;
  transition: transform 0.6s, -webkit-transform 0.6s;
  -webkit-transform: translate(-48%, -15%) scale(0.7);
  -ms-transform: translate(-48%, -15%) scale(0.7);
  transform: translate(-48%, -15%) scale(0.7)
}

.promo__group-5 .promo__wrap .swiper-slide-active a, .promo__group-5 .promo__wrap .swiper-slide-next a, .promo__group-5 .promo__wrap .swiper-slide-duplicate-active a, .promo__group-5 .promo__wrap .swiper-slide-duplicate-next a {
  -webkit-transform: translate(-48%, 2%) scale(0.9);
  -ms-transform: translate(-48%, 2%) scale(0.9);
  transform: translate(-48%, 2%) scale(0.9)
}

.promo__group-5 .promo__wrap .promo-pager {
  bottom: 20px
}

.promo__group-5 .promo__wrap .promo-pager .swiper-pagination-bullet {
  margin: 0 8px;
  width: 16px;
  height: 16px
}

.promo__group-5 .promo__wrap .promo-pager .swiper-pagination-bullet-active {
  background-color: #b62e09
}

.promo__group-5 .promo__wrap .swiper-button-white {
  top: 93%;
  -webkit-transform: scale(0.6);
  -ms-transform: scale(0.6);
  transform: scale(0.6)
}

.promo__group-5 .promo__wrap .swiper-button-prev {
  left: 23%
}

.promo__group-5 .promo__wrap .swiper-button-next {
  right: 23%
}

.promo__group-5 .promo__wrap .button__wrap {
  position: absolute;
  z-index: 0;
  bottom: 0;
  left: 50%;
  width: 30%;
  height: 10%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%)
}

.promo__group-5 .promo__wrap .button__wrap .btn--see-more {
  margin-top: -12%
}

@media screen and (min-width: 960px) and (max-width: 1239px) {
  .promo__group-5 .promo__wrap {
    padding-top: 60%
  }
  .promo__group-5 .promo__wrap .swiper-slide a {
    -webkit-transform: translate(-30%, -23%) scale(0.6);
    -ms-transform: translate(-30%, -23%) scale(0.6);
    transform: translate(-30%, -23%) scale(0.6)
  }
  .promo__group-5 .promo__wrap .swiper-slide a img {
    width: 350px !important
  }
  .promo__group-5 .promo__wrap .swiper-slide-active a, .promo__group-5 .promo__wrap .swiper-slide-active+.swiper-slide a {
    -webkit-transform: translate(-34%, 0) scale(0.85);
    -ms-transform: translate(-34%, 0) scale(0.85);
    transform: translate(-34%, 0) scale(0.85)
  }
  .promo__group-5 .promo__wrap .button__wrap .btn--see-more {
    margin-top: -10%
  }
}

@media screen and (min-width: 1240px) {
  .promo__group-5 .promo__wrap {
    padding-top: 52%
  }
  .promo__group-5 .promo__wrap .swiper-slide a {
    -webkit-transform: scale(0.8) translate(-8%, -24%);
    -ms-transform: scale(0.8) translate(-8%, -24%);
    transform: scale(0.8) translate(-8%, -24%)
  }
  .promo__group-5 .promo__wrap .swiper-slide-active a, .promo__group-5 .promo__wrap .swiper-slide-active+.swiper-slide a {
    -webkit-transform: scale(0.9) translate(-1%, 4%);
    -ms-transform: scale(0.9) translate(-1%, 4%);
    transform: scale(0.9) translate(-1%, 4%)
  }
  .promo__group-5 .promo__wrap .button__wrap .btn--see-more {
    margin-top: -10%
  }
}

.promo__group-6 .promo__wrap {
  padding-top: 58%;
  background: center top url(bg-2560-06-m.png) no-repeat;
  background-size: contain
}

.promo__group-6 .promo__wrap .promo__slider {
  top: 23%;
  padding: 0 4.5%;
  width: 92%;
  background-size: 92%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%)
}

.promo__group-6 .promo__wrap .promo__slider .swiper-container {
  margin: 0 auto;
  width: 96%;
  height: 90%
}

.promo__group-6 .promo__wrap .promo__slider .swiper-slide {
  width: 50%;
  padding: 0 2%
}

.promo__group-6 .promo__wrap .promo__slider .swiper-slide a {
  -webkit-transform: translateY(0) scale(0.92);
  -ms-transform: translateY(0) scale(0.92);
  transform: translateY(0) scale(0.92)
}

.promo__group-6 .promo__wrap .promo__slider .swiper-slide img {
  -webkit-transition: -webkit-transform 1.2s;
  transition: -webkit-transform 1.2s;
  transition: transform 1.2s;
  transition: transform 1.2s, -webkit-transform 1.2s;
  -webkit-transform: rotate(8deg);
  -ms-transform: rotate(8deg);
  transform: rotate(8deg)
}

.promo__group-6 .promo__wrap .promo__slider .swiper-slide-visible img {
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg)
}

.promo__group-6 .promo__wrap .promo__slider .slider-bank-prev, .promo__group-6 .promo__wrap .promo__slider .slider-bank-next {
  width: calc(100vw * 0.06);
  height: calc(100vw * 0.06);
  margin-top: calc(-100vw * 0.073);
  background-size: calc(100vw * 0.1) calc(100vw * 0.1);
  opacity: 0
}

.promo__group-6 .promo__wrap .promo__slider .slider-bank-prev {
  margin-left: calc(-100vw * 0.0373)
}

.promo__group-6 .promo__wrap .promo__slider .slider-bank-next {
  margin-right: calc(-100vw * 0.0373)
}

.promo__group-6 .promo__wrap .promo-pager {
  bottom: calc(100vw * 0.03125);
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%)
}

.promo__group-6 .promo__wrap .promo-pager .swiper-pagination-bullet {
  margin: 0 2px;
  width: 6px;
  height: 6px;
  opacity: .8;
  background-color: #ffffff
}

.promo__group-6 .promo__wrap .promo-pager .swiper-pagination-bullet-active {
  background-color: #ff8383;
  opacity: 1
}

@media screen and (min-width: 960px) {
  .promo__group-6 .promo__wrap {
    padding-top: 46%;
    background: center top url(bg-2560-06.png) no-repeat
  }
  .promo__group-6 .promo__wrap .promo__slider {
    top: 30%
  }
  .promo__group-6 .promo__wrap .promo__slider .swiper-container {
    width: 100%
  }
  .promo__group-6 .promo__wrap .promo__slider .swiper-wrapper {
    top: 0
  }
  .promo__group-6 .promo__wrap .promo__slider .swiper-slide {
    width: 24%;
    padding: 0 8px
  }
  .promo__group-6 .promo__wrap .promo__slider .swiper-slide a {
    -webkit-transform: translateY(0) scale(1);
    -ms-transform: translateY(0) scale(1);
    transform: translateY(0) scale(1)
  }
  .promo__group-6 .promo__wrap .promo__slider .slider-bank-prev, .promo__group-6 .promo__wrap .promo__slider .slider-bank-next {
    width: 27px;
    height: 44px;
    margin-top: -120px;
    background-size: 27px 44px;
    opacity: 0
  }
  .promo__group-6 .promo__wrap .promo__slider .slider-bank-prev {
    margin-left: -20px
  }
  .promo__group-6 .promo__wrap .promo__slider .slider-bank-next {
    margin-right: -20px
  }
  .promo__group-6 .promo__wrap .promo-pager {
    bottom: 80px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
  }
  .promo__group-6 .promo__wrap .promo-pager .swiper-pagination-bullet {
    margin: 0 4px;
    width: 10px;
    height: 10px
  }
}
.promo__group-7 {
  background: center 0 url(bg-2560-04.jpg) no-repeat;
  background-size: 260% auto
}

.promo__group-7 a, .promo__group-8 a {
  display: block
}

.promo__group-7 .promo__wrap, .promo__group-8 .promo__wrap {
  background: center 0 url(bg-2560-07-m.png) no-repeat;
  background-size: contain;
  padding-top: 62%
}

.promo__group-7 .promo__wrap .promo__slider, .promo__group-8 .promo__wrap .promo__slider {
  top: 20%;
  width: 90%;
  height: 64%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%)
}

.promo__group-7 .promo__wrap .promo__slider .swiper-slide a, .promo__group-8 .promo__wrap .promo__slider .swiper-slide a {
  -webkit-transform: translateY(-2.5%) scale(0.9);
  -ms-transform: translateY(-2.5%) scale(0.9);
  transform: translateY(-2.5%) scale(0.9)
}

@media screen and (min-width: 960px) {
  .promo__group-7 .promo__wrap .promo__slider .swiper-slide, .promo__group-8 .promo__wrap .promo__slider .swiper-slide {
    width: 50%
  }
  .promo__group-7 .promo__wrap .promo__slider .swiper-slide a, .promo__group-8 .promo__wrap .promo__slider .swiper-slide a {
    -webkit-transform: scale(0.95) translateY(33%);
    -ms-transform: scale(0.95) translateY(33%);
    transform: scale(0.95) translateY(33%)
  }
}

.promo__group-7 .promo__wrap .promo__bngroup-prev, .promo__group-7 .promo__wrap .promo__bngroup-next, .promo__group-8 .promo__wrap .promo__bngroup-prev, .promo__group-8 .promo__wrap .promo__bngroup-next {
  width: calc(100vw * 0.04);
  height: calc(100vw * 0.04);
  margin-top: calc(-100vw * 0.01);
  background-size: calc(100vw * 0.04) calc(100vw * 0.06);
  opacity: 0
}

.promo__group-7 .promo__wrap .promo__bngroup-prev, .promo__group-8 .promo__wrap .promo__bngroup-prev {
  margin-left: calc(100vw * 0.02)
}

.promo__group-7 .promo__wrap .promo__bngroup-next, .promo__group-8 .promo__wrap .promo__bngroup-next {
  margin-right: calc(100vw * 0.02)
}

.promo__group-7 .promo__wrap .promo-pager, .promo__group-8 .promo__wrap .promo-pager {
  bottom: calc(100vw * 0.065);
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%)
}

.promo__group-7 .promo__wrap .promo-pager .swiper-pagination-bullet, .promo__group-8 .promo__wrap .promo-pager .swiper-pagination-bullet {
  margin: 0 2px;
  width: 6px;
  height: 6px;
  opacity: .8;
  background-color: #ffffff
}

.promo__group-7 .promo__wrap .promo-pager .swiper-pagination-bullet-active, .promo__group-8 .promo__wrap .promo-pager .swiper-pagination-bullet-active {
  background-color: #ff82bc;
  opacity: 1
}

@media screen and (min-width: 960px) {
  .promo__group-7 .promo__wrap, .promo__group-8 .promo__wrap {
    background: center 0 url(bg-2560-07.png) no-repeat;
    background-size: auto;
    padding-top: 43%
  }
  .promo__group-7 .promo__wrap .promo__slider, .promo__group-8 .promo__wrap .promo__slider {
    top: 15%
  }
  .promo__group-7 .promo__wrap .promo__bngroup-prev, .promo__group-7 .promo__wrap .promo__bngroup-next, .promo__group-8 .promo__wrap .promo__bngroup-prev, .promo__group-8 .promo__wrap .promo__bngroup-next {
    width: 27px;
    height: 44px;
    margin-top: -20px;
    background-size: 27px 44px
  }
  .promo__group-7 .promo__wrap .promo__bngroup-prev, .promo__group-8 .promo__wrap .promo__bngroup-prev {
    margin-left: 15px
  }
  .promo__group-7 .promo__wrap .promo__bngroup-next, .promo__group-8 .promo__wrap .promo__bngroup-next {
    margin-right: 15px
  }
  .promo__group-7 .promo__wrap .promo-pager, .promo__group-8 .promo__wrap .promo-pager {
    bottom: 70px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
  }
  .promo__group-7 .promo__wrap .promo-pager .swiper-pagination-bullet, .promo__group-8 .promo__wrap .promo-pager .swiper-pagination-bullet {
    margin: 0 4px;
    width: 10px;
    height: 10px
  }
}

.promo__group-88 {
  position: relative;
  top: 0;
  left: calc(100vw * 0.41);
  z-index: 21;
  transform: scale(0.7)translate(-10%, -20%)
}

.promo__group-88 .limit__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex
}

.promo__group-88 .limit__wrap::after {
  content: "";
  display: block;
  clear: both
}

.promo__group-88 .limit__wrap>div {
  float: left
}

.promo__group-88 .limit__wrap .limit__slider {
  width: 68%
}

.promo__group-88 .limit__wrap .limit__slider .swiper-button-white {
  top: calc(100vw * 0.58);
  -webkit-transform: scale(0.2);
  -ms-transform: scale(0.2);
  transform: scale(0.2)
}

.promo__group-88 .limit__wrap .limit__slider .swiper-button-white.swiper-button-prev {
  left: calc(50% - 30px)
}

.promo__group-88 .limit__wrap .limit__slider .swiper-button-white.swiper-button-next {
  right: calc(50% - 30px)
}

@media screen and (min-width: 960px) {
  .promo__group-88 {
    top: 100px;
    left: 396px;
    transform: scale(0.9)translate(10%, -15%)
  }
  .promo__group-88 .limit__wrap .limit__slider {
    width: 570px
  }
  .promo__group-88 .limit__wrap .limit__slider .swiper-button-white {
    top: 720px;
    -webkit-transform: scale(0.4);
    -ms-transform: scale(0.4);
    transform: scale(0.4)
  }
  .promo__group-88 .limit__wrap .limit__slider .swiper-button-white.swiper-button-prev {
    left: calc(65% - 50px)
  }
  .promo__group-88 .limit__wrap .limit__slider .swiper-button-white.swiper-button-next {
    right: calc(35% - 50px)
  }
}

@media screen and (min-width: 960px) {
  .promo__group {
    background-size: auto
  }
}