@import url("https://fonts.googleapis.com/earlyaccess/notosanstc.css");
@import url("https://fonts.googleapis.com/css?family=Kanit:600");
@import url("https://fonts.googleapis.com/css?family=Kanit:400");

html,
body {
    font-size: 14px;
    font-family: PingFangSC, Microsoft JhengHei, sans-serif;
    -webkit-text-size-adjust: none;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    height: 100%;
    position: relative
}
body{
    overflow-x: hidden;
    overflow-y: auto;
}

html,
button,
input,
optgroup,
select,
textarea {
    line-height: 1.15
}

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

main,
details {
    display: block
}

summary {
    display: list-item
}

template,
[hidden] {
    display: none
}

h1 {
    font-size: 2em;
    margin: 0.67em 0
}

hr {
    height: 0;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

hr,
button,
input {
    overflow: visible
}

pre,
code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    text-decoration: none;
    display: block;
    background-color: transparent;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

a:active,
a:hover,
a:focus {
    outline-width: 0;

}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

progress,
sub,
sup {
    vertical-align: baseline
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative
}

sub {
    bottom: -0.25em
}

sup {
    top: -0.5em
}




button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%
}

button,
select {
    text-transform: none
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner,
legend,
[type="checkbox"],
[type="radio"] {
    padding: 0
}

iframe,
img {
    vertical-align: bottom
}

img,
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: 0.35em 0.75em 0.625em
}

legend,
[type="checkbox"],
[type="radio"] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

legend {
    color: inherit;
    display: table;
    max-width: 100%;
    white-space: normal
}

textarea {
    overflow: auto
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto
}

[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

::-moz-selection {
    color: #fff;
    text-shadow: none;
    background-color: rgba(83, 83, 83, 0.65)
}

::selection {
    color: #fff;
    text-shadow: none;
    background-color: rgba(83, 83, 83, 0.65)
}

#logo>a {
    text-indent: 120%;
    overflow: hidden;
    white-space: nowrap
}


.head_icon{
    margin-right: 5px;
}


.phone_size img{
    margin-top: -400px;
    /* margin-top: -260px; */
    max-width: 100%;
}

@-webkit-keyframes head-slide {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes head-slide {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-webkit-keyframes pig-desk-head-slide {
    0% {
        -webkit-transform: translate3d(-50%, -100%, 0);
        transform: translate3d(-50%, -100%, 0)
    }

    100% {
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0)
    }
}

@keyframes pig-desk-head-slide {
    0% {
        -webkit-transform: translate3d(-50%, -100%, 0);
        transform: translate3d(-50%, -100%, 0)
    }

    100% {
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0)
    }
}

@-webkit-keyframes m-home-stage {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -50%, 0);
        transform: translate3d(0, -50%, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes m-home-stage {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -50%, 0);
        transform: translate3d(0, -50%, 0)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-webkit-keyframes home-stage {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -50%, 0);
        transform: translate3d(0, -50%, 0)
    }

    99.999% {
        z-index: 0
    }

    100% {
        opacity: 1;
        z-index: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes home-stage {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -50%, 0);
        transform: translate3d(0, -50%, 0)
    }

    99.999% {
        z-index: 0
    }

    100% {
        opacity: 1;
        z-index: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-webkit-keyframes img-box {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3)
    }

    33.33% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }

    66.66% {
        z-index: 0;
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9)
    }

    100% {
        opacity: 1;
        z-index: 2;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@keyframes img-box {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3)
    }

    33.33% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }

    66.66% {
        z-index: 0;
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9)
    }

    100% {
        opacity: 1;
        z-index: 2;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@-webkit-keyframes bg-animate {
    0% {
        opacity: .2;
        -webkit-transform: scale3d(0.6, 0.6, 1);
        transform: scale3d(0.6, 0.6, 1)
    }

    60% {
        opacity: 1
    }

    100% {
        opacity: .1;
        z-index: 1;
        -webkit-transform: scale3d(2, 2, 1);
        transform: scale3d(2, 2, 1)
    }
}

@keyframes bg-animate {
    0% {
        opacity: .2;
        -webkit-transform: scale3d(0.6, 0.6, 1);
        transform: scale3d(0.6, 0.6, 1)
    }

    60% {
        opacity: 1
    }

    100% {
        opacity: .1;
        z-index: 1;
        -webkit-transform: scale3d(2, 2, 1);
        transform: scale3d(2, 2, 1)
    }
}

@-webkit-keyframes golden-title-flash {

    0%,
    33.33% {
        opacity: 1
    }

    66.66%,
    100% {
        opacity: 0
    }
}

@keyframes golden-title-flash {

    0%,
    33.33% {
        opacity: 1
    }

    66.66%,
    100% {
        opacity: 0
    }
}

@-webkit-keyframes right-small-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(0, 8px, 0);
        transform: translate3d(0, 8px, 0)
    }

    65% {
        -webkit-transform: translate3d(-8px, 0, 0);
        transform: translate3d(-8px, 0, 0)
    }
}

@keyframes right-small-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(0, 8px, 0);
        transform: translate3d(0, 8px, 0)
    }

    65% {
        -webkit-transform: translate3d(-8px, 0, 0);
        transform: translate3d(-8px, 0, 0)
    }
}

@-webkit-keyframes d-right-small-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(0, 12px, 0);
        transform: translate3d(0, 12px, 0)
    }

    65% {
        -webkit-transform: translate3d(-12px, 0, 0);
        transform: translate3d(-12px, 0, 0)
    }
}

@keyframes d-right-small-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(0, 12px, 0);
        transform: translate3d(0, 12px, 0)
    }

    65% {
        -webkit-transform: translate3d(-12px, 0, 0);
        transform: translate3d(-12px, 0, 0)
    }
}

@-webkit-keyframes right-pig-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 4px, 0);
        transform: translate3d(0, 4px, 0)
    }

    35% {
        -webkit-transform: translate3d(-4px, 12px, 0);
        transform: translate3d(-4px, 12px, 0)
    }

    65% {
        -webkit-transform: translate3d(-12px, -4px, 0);
        transform: translate3d(-12px, -4px, 0)
    }
}

@keyframes right-pig-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 4px, 0);
        transform: translate3d(0, 4px, 0)
    }

    35% {
        -webkit-transform: translate3d(-4px, 12px, 0);
        transform: translate3d(-4px, 12px, 0)
    }

    65% {
        -webkit-transform: translate3d(-12px, -4px, 0);
        transform: translate3d(-12px, -4px, 0)
    }
}

@-webkit-keyframes d-right-pig-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 6px, 0);
        transform: translate3d(0, 6px, 0)
    }

    35% {
        -webkit-transform: translate3d(-6px, 18px, 0);
        transform: translate3d(-6px, 18px, 0)
    }

    65% {
        -webkit-transform: translate3d(-18px, -6px, 0);
        transform: translate3d(-18px, -6px, 0)
    }
}

@keyframes d-right-pig-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 6px, 0);
        transform: translate3d(0, 6px, 0)
    }

    35% {
        -webkit-transform: translate3d(-6px, 18px, 0);
        transform: translate3d(-6px, 18px, 0)
    }

    65% {
        -webkit-transform: translate3d(-18px, -6px, 0);
        transform: translate3d(-18px, -6px, 0)
    }
}

@-webkit-keyframes left-small-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(0, -8px, 0);
        transform: translate3d(0, -8px, 0)
    }

    65% {
        -webkit-transform: translate3d(8px, 0, 0);
        transform: translate3d(8px, 0, 0)
    }
}

@keyframes left-small-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(0, -8px, 0);
        transform: translate3d(0, -8px, 0)
    }

    65% {
        -webkit-transform: translate3d(8px, 0, 0);
        transform: translate3d(8px, 0, 0)
    }
}

@-webkit-keyframes d-left-small-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(0, -12px, 0);
        transform: translate3d(0, -12px, 0)
    }

    65% {
        -webkit-transform: translate3d(12px, 0, 0);
        transform: translate3d(12px, 0, 0)
    }
}

@keyframes d-left-small-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(0, -12px, 0);
        transform: translate3d(0, -12px, 0)
    }

    65% {
        -webkit-transform: translate3d(12px, 0, 0);
        transform: translate3d(12px, 0, 0)
    }
}

@-webkit-keyframes left-pig-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }

    35% {
        -webkit-transform: translate3d(4px, -12px, 0);
        transform: translate3d(4px, -12px, 0)
    }

    65% {
        -webkit-transform: translate3d(12px, 4px, 0);
        transform: translate3d(12px, 4px, 0)
    }
}

@keyframes left-pig-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }

    35% {
        -webkit-transform: translate3d(4px, -12px, 0);
        transform: translate3d(4px, -12px, 0)
    }

    65% {
        -webkit-transform: translate3d(12px, 4px, 0);
        transform: translate3d(12px, 4px, 0)
    }
}

@-webkit-keyframes d-left-pig-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, -6px, 0);
        transform: translate3d(0, -6px, 0)
    }

    35% {
        -webkit-transform: translate3d(6px, -18px, 0);
        transform: translate3d(6px, -18px, 0)
    }

    65% {
        -webkit-transform: translate3d(18px, 6px, 0);
        transform: translate3d(18px, 6px, 0)
    }
}

@keyframes d-left-pig-move {

    0%,
    100% {
        -webkit-transform: translate3d(0, -6px, 0);
        transform: translate3d(0, -6px, 0)
    }

    35% {
        -webkit-transform: translate3d(6px, -18px, 0);
        transform: translate3d(6px, -18px, 0)
    }

    65% {
        -webkit-transform: translate3d(18px, 6px, 0);
        transform: translate3d(18px, 6px, 0)
    }
}

@-webkit-keyframes right-left-move {
    0% {
        -webkit-transform: translate3d(-9px, 0, 0);
        transform: translate3d(-9px, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(3px, 0, 0);
        transform: translate3d(3px, 0, 0)
    }

    65% {
        -webkit-transform: translate3d(-6px, 0, 0);
        transform: translate3d(-6px, 0, 0)
    }

    100% {
        -webkit-transform: translate3d(9px, 0, 0);
        transform: translate3d(9px, 0, 0)
    }
}

@keyframes right-left-move {
    0% {
        -webkit-transform: translate3d(-9px, 0, 0);
        transform: translate3d(-9px, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(3px, 0, 0);
        transform: translate3d(3px, 0, 0)
    }

    65% {
        -webkit-transform: translate3d(-6px, 0, 0);
        transform: translate3d(-6px, 0, 0)
    }

    100% {
        -webkit-transform: translate3d(9px, 0, 0);
        transform: translate3d(9px, 0, 0)
    }
}

@-webkit-keyframes d-right-left-move {
    0% {
        -webkit-transform: translate3d(-12px, 0, 0);
        transform: translate3d(-12px, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(4px, 0, 0);
        transform: translate3d(4px, 0, 0)
    }

    65% {
        -webkit-transform: translate3d(-8px, 0, 0);
        transform: translate3d(-8px, 0, 0)
    }

    100% {
        -webkit-transform: translate3d(12px, 0, 0);
        transform: translate3d(12px, 0, 0)
    }
}

@keyframes d-right-left-move {
    0% {
        -webkit-transform: translate3d(-12px, 0, 0);
        transform: translate3d(-12px, 0, 0)
    }

    35% {
        -webkit-transform: translate3d(4px, 0, 0);
        transform: translate3d(4px, 0, 0)
    }

    65% {
        -webkit-transform: translate3d(-8px, 0, 0);
        transform: translate3d(-8px, 0, 0)
    }

    100% {
        -webkit-transform: translate3d(12px, 0, 0);
        transform: translate3d(12px, 0, 0)
    }
}

@-webkit-keyframes m-sexy-bg-animate {
    0% {
        opacity: .3;
        -webkit-transform: scale3d(0.8, 0.8, 1);
        transform: scale3d(0.8, 0.8, 1)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }

    100% {
        opacity: .2;
        -webkit-transform: scale3d(1.2, 1.2, 1);
        transform: scale3d(1.2, 1.2, 1)
    }
}

@keyframes m-sexy-bg-animate {
    0% {
        opacity: .3;
        -webkit-transform: scale3d(0.8, 0.8, 1);
        transform: scale3d(0.8, 0.8, 1)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }

    100% {
        opacity: .2;
        -webkit-transform: scale3d(1.2, 1.2, 1);
        transform: scale3d(1.2, 1.2, 1)
    }
}

@-webkit-keyframes sexy-bg-animate {
    0% {
        opacity: .4;
        -webkit-transform: scale3d(1.6, 1.6, 1);
        transform: scale3d(1.6, 1.6, 1)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale3d(2, 2, 1);
        transform: scale3d(2, 2, 1)
    }

    100% {
        opacity: .3;
        -webkit-transform: scale3d(2.4, 2.4, 1);
        transform: scale3d(2.4, 2.4, 1)
    }
}

@keyframes sexy-bg-animate {
    0% {
        opacity: .4;
        -webkit-transform: scale3d(1.6, 1.6, 1);
        transform: scale3d(1.6, 1.6, 1)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale3d(2, 2, 1);
        transform: scale3d(2, 2, 1)
    }

    100% {
        opacity: .3;
        -webkit-transform: scale3d(2.4, 2.4, 1);
        transform: scale3d(2.4, 2.4, 1)
    }
}

@-webkit-keyframes d-sexy-bg-animate {
    0% {
        opacity: .3;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale3d(1.2, 1.2, 1);
        transform: scale3d(1.2, 1.2, 1)
    }

    100% {
        opacity: .2;
        -webkit-transform: scale3d(1.4, 1.4, 1);
        transform: scale3d(1.4, 1.4, 1)
    }
}

@keyframes d-sexy-bg-animate {
    0% {
        opacity: .3;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }

    50% {
        opacity: 1;
        -webkit-transform: scale3d(1.2, 1.2, 1);
        transform: scale3d(1.2, 1.2, 1)
    }

    100% {
        opacity: .2;
        -webkit-transform: scale3d(1.4, 1.4, 1);
        transform: scale3d(1.4, 1.4, 1)
    }
}

@-webkit-keyframes m-process-arrow {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    50%,
    100% {
        -webkit-transform: translate3d(0, 14px, 0);
        transform: translate3d(0, 14px, 0)
    }
}

@keyframes m-process-arrow {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    50%,
    100% {
        -webkit-transform: translate3d(0, 14px, 0);
        transform: translate3d(0, 14px, 0)
    }
}

@-webkit-keyframes process-arrow {

    0%,
    20% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    60%,
    100% {
        -webkit-transform: translate3d(14px, 0, 0);
        transform: translate3d(14px, 0, 0)
    }
}

@keyframes process-arrow {

    0%,
    20% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    60%,
    100% {
        -webkit-transform: translate3d(14px, 0, 0);
        transform: translate3d(14px, 0, 0)
    }
}

@-webkit-keyframes gif-effect {
    0% {
        opacity: 0
    }

    47% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    97% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes gif-effect {
    0% {
        opacity: 0
    }

    47% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    97% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-webkit-keyframes ae-girls-ig {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    100% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
}

@keyframes ae-girls-ig {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    100% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
}

/* html,
#about,
#lottery {
    background-color: #ebeef3;
} */

header,
section,
footer {
    min-width: 320px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

section {
    color: #A67712;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

section+section {
    position: relative
}

section ul {
    padding-left: 18px
}

section .img-box {
    width: 100%;
    height: 0;
    position: relative
}

section .img-box>div,
section .img-box>h2,
section .img-box>h3,
section .img-box>img {
    pointer-events: none;
    position: absolute
}

.wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
}

.wrap h2 {
    font-size: 32px;
    line-height: 40px;
    margin: 0 0 12px 0;
 
}

.wrap h3,
.wrap p {
    line-height: 24px
}

.wrap h3 {
    font-size: 20px;
    text-indent: 28px;
    margin: 0 0 28px 0
}

.wrap p {
    font-size: 1.2rem;
    margin: 0 0 26px 0;
    line-height: 2;
}

.wrap ol {
    list-style: none;
    padding-left: 0
}

.wrap li {
    font-size: 16px;
    line-height: 30px;
    width: 100%;
    /*15rem*/

}

.wrap li>b {
    font-weight: normal
}

.wrap li>span {
    margin-left: 10px
}

.wrap .img-box>div {
    height: 0;
    background-size: cover
}

.wrap .content-box {
    /*padding-top: 45px*/
}

.choice_bg{
    position: relative;
}

.choice_icon{
    color: #ca992d;
    position: absolute;
    top: 65%;
    right: -18px;
    font-size: 14px;
}



.en .wrap h2,
.th .wrap h2,
.vn .wrap h2 {
    font-size: 28px
}

.en .wrap h3,
.th .wrap h3,
.vn .wrap h3 {
    font-size: 18px;
    text-indent: 0
}

.en .wrap li>span,
.th .wrap li>span,
.vn .wrap li>span {
    margin-left: 0
}

.th .btn-box>a,
.vn .btn-box>a {
    padding: 0 14px
}

.th {
    word-spacing: 2px
}

.th>#about p,
.th>#lottery p {
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.85), 0 1px 8px rgba(0, 0, 0, 0.85)
}
#head {
    width: 100vw;
    height: 54px;
    background: linear-gradient(to bottom, #FDFDFD , #d8d8d8);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    box-shadow: 0 1px 0 #A67712, 0 2px 0 #A67712, 0 3px 0 #A67712, 0 4px 0 #A67712, 0 10px 20px rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}

#head.head--fixed {
    position: fixed;
    -webkit-animation: head-slide .4s;
    animation: head-slide .4s;
}

#head.menu--open {
    -webkit-animation-duration: 0s;
    animation-duration: 0s
}

#head.menu--open .menu-wrap {
    -webkit-transition: -webkit-transform .4s;
    transition: -webkit-transform .4s;
    -o-transition: transform .4s;
    transition: transform .4s;
    transition: transform .4s, -webkit-transform .4s;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    overflow: auto
}

#head.menu--open #logo>a {
    width: 100%;
    height: 60px;
    background-position: 30px 12px;
    top: 30px;
    left: 0
}

#head.menu--open #head__m-btn {
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.3);
    -webkit-transform: rotate3d(0, 0, 1, -180deg);
    transform: rotate3d(0, 0, 1, -180deg);
    -moz-transform: rotate3d(0, 0, 1, -180deg);
    -ms-transform: rotate3d(0, 0, 1, -180deg);
    -o-transform: rotate3d(0, 0, 1, -180deg);
}

#head.menu--open #head__m-btn>span {
    opacity: 0
}

#head.menu--open #head__m-btn:before,
#head.menu--open #head__m-btn:after {
    width: 32px
}

#head.menu--open #head__m-btn:before {
    margin-top: auto;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg)
}

#head.menu--open #head__m-btn:after {
    margin-bottom: auto;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg)
}

#logo>a {
    width: 72px;
    height: 35px;
    background: url("../images/logo.png") no-repeat 0 0/72px 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: fixed;
    top: 10px;
    left: 10px
}

.menu-wrap {
    width: 100%;
    height: 100%;
    background-color: #0C0D15;
    background-image: -webkit-linear-gradient(315deg, rgba(0, 0, 0, 0) 46%, rgba(0, 0, 0, 0.1) 46%, rgba(0, 0, 0, 0.1) 54%, rgba(0, 0, 0, 0) 54%), -webkit-linear-gradient(top, rgba(255, 255, 255, 0.1) 15%, rgba(0, 0, 0, 0.1) 78%, rgba(179, 179, 179, 0.1) 100%);
    background-image: -o-linear-gradient(315deg, rgba(0, 0, 0, 0) 46%, rgba(0, 0, 0, 0.1) 46%, rgba(0, 0, 0, 0.1) 54%, rgba(0, 0, 0, 0) 54%), -o-linear-gradient(top, rgba(255, 255, 255, 0.1) 15%, rgba(0, 0, 0, 0.1) 78%, rgba(179, 179, 179, 0.1) 100%);
    background-image: linear-gradient(135deg, rgba(0, 0, 0, 0) 46%, rgba(0, 0, 0, 0.1) 46%, rgba(0, 0, 0, 0.1) 54%, rgba(0, 0, 0, 0) 54%), linear-gradient(180deg, rgba(255, 255, 255, 0.1) 15%, rgba(0, 0, 0, 0.1) 78%, rgba(179, 179, 179, 0.1) 100%);
    background-size: 7px 7px, cover;
    -webkit-box-shadow: 0 -1px 0 #f2be4b inset, 0 -2px 0 #a67712 inset, 0 -3px 0 #bda12e inset, 0 -4px 0 #ffeb9d inset;
    box-shadow: 0 -1px 0 #f2be4b inset, 0 -2px 0 #a67712 inset, 0 -3px 0 #bda12e inset, 0 -4px 0 #ffeb9d inset;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 90px 0 60px;
    position: fixed;
    top: 0;
    left: 100%;
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    -o-transition: transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s
}

.menu-wrap ul {
    list-style: none;
    padding-left: 0
}

.menu-wrap a {
    color: #797979;
    font-size: 26px;
    font-weight: 200;
    padding-left: 30px;
    line-height: 60px;
    text-transform: capitalize;
    display: block;
    -webkit-transition: color .4s;
    -o-transition: color .4s;
    transition: color .4s
}

.menu-wrap a:hover,
.menu-wrap a.active {
    color: #A67712;
    filter: invert(55%) sepia(74%) saturate(498%) hue-rotate(3deg) brightness(95%) contrast(96%);
}





.lang {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 30px
}

.lang>a {
    padding-left: 0;
    text-align: center;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 52px;
    -ms-flex: 0 0 52px;
    flex: 0 0 52px
}

.lang>a+a {
    margin-left: 20px;
    position: relative
}

.lang>a+a:before {
    content: "";
    width: 2px;
    height: 32px;
    background-color: #434343;
    position: absolute;
    top: 14px;
    left: -11px
}

#head__m-btn>span,
#head__m-btn:before,
#head__m-btn:after {
    width: 28px;
    height: 1px;
    background-color: #434343;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

#head__m-btn {
    width: 44px;
    height: 44px;
    position: absolute;
    top: 5px;
    right: 5px;
    -webkit-transition: background-color .4s, border-radius .4s, -webkit-transform .4s;
    transition: background-color .4s, border-radius .4s, -webkit-transform .4s;
    -o-transition: background-color .4s, border-radius .4s, transform .4s;
    transition: background-color .4s, border-radius .4s, transform .4s;
    transition: background-color .4s, border-radius .4s, transform .4s, -webkit-transform .4s
}

#head__m-btn>span {
    -webkit-transition: opacity .4s;
    -o-transition: opacity .4s;
    transition: opacity .4s
}

#head__m-btn:before,
#head__m-btn:after {
    content: "";
    -webkit-transition: width .4s, -webkit-transform .4s;
    transition: width .4s, -webkit-transform .4s;
    -o-transition: width .4s, transform .4s;
    transition: width .4s, transform .4s;
    transition: width .4s, transform .4s, -webkit-transform .4s
}

#head__m-btn:before {
    margin-top: 13px
}

#head__m-btn:after {
    margin-bottom: 12px
}

#about:before,
#e-sports:before,
#lottery:before,
#chess:before,
#sexy:before,
#home-box>.img-box:before {
    content: "";
    pointer-events: none;
    width: 100%;
    height: 0;
    background-size: cover;
    position: absolute;
    left: 0;
    -webkit-animation: bg-animate 18s -4.5s linear infinite both paused;
    animation: bg-animate 18s -4.5s linear infinite both paused
}

#home.active .img-box:before,
#about.active:before,
#e-sports.active:before,
#lottery.active:before,
#chess.active:before {
    -webkit-animation-play-state: running;
    animation-play-state: running
}

#about,
#e-sports,
#lottery,
#chess,
#sexy {
    overflow: hidden;
    padding: 60px 0px
}

.btn-box>a,
#chess,
.process-icon {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#cfcece));
    background-image: -webkit-linear-gradient(top, #fdfdfd 0%, #cfcece 100%);
    background-image: -o-linear-gradient(top, #fdfdfd 0%, #cfcece 100%);
    background-image: linear-gradient(180deg, #fdfdfd 0%, #cfcece 100%)
}




#e-sports,
.process-icon {
    background-image: url(../images/contact-bg.jpg);
}





#lottery p {
    color: #000;
    /* text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75), 0 1px 6px rgba(0, 0, 0, 0.75); */
    font-size: 1.2rem;
    font-weight: 500;

}


#about p {
    color: #000;
    /* text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75), 0 1px 6px rgba(0, 0, 0, 0.75); */
    font-size: 1.2rem;
    padding-top: 3rem;
    font-weight: 500;

}



#chess h2,
#chess h3,
#chess li {
    color: #A17100;
}

#e-sports h2,
#e-sports h3,
#e-sports li,
    {
    color: #fff;
}

#e-sports p,
#chess p {
    color: #535353;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 3px rgba(255, 255, 255, 0.6);
    font-weight: 500;
}

.btn-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    /* -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center */
}

.btn-box>a {
    color: #A17100;
    font-size: 16px;
    line-height: 45px;
    text-align: center;
    border-radius: 4px;
    background-color: #fdfdfd;
    -webkit-box-shadow: 0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, 0.25) inset, 0 17px 12px -12px rgba(0, 0, 0, 0.7);
    box-shadow: 0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, 0.25) inset, 0 17px 12px -12px rgba(0, 0, 0, 0.7);
    padding: 0 28px;
    -webkit-transition: background-color .4s, -webkit-box-shadow .4s;
    transition: background-color .4s, -webkit-box-shadow .4s;
    -o-transition: background-color .4s, box-shadow .4s;
    transition: background-color .4s, box-shadow .4s;
    transition: background-color .4s, box-shadow .4s, -webkit-box-shadow .4s;
 
}

.btn-box>a+a {
    margin-left: 20px
}

.btn-box>a:hover {
    color: #A17100;
    background-color: #cfcece;
    background-image: none;
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) inset, 0 -1px 0 rgba(255, 255, 255, 0.4) inset, 0 0 0 1px rgba(0, 0, 0, 0.4), 0 1px 3px 1px rgba(0, 0, 0, 0.6);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) inset, 0 -1px 0 rgba(255, 255, 255, 0.4) inset, 0 0 0 1px rgba(0, 0, 0, 0.4), 0 1px 3px 1px rgba(0, 0, 0, 0.6)
}



.btn-box1 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}



.btn-box1>a {
    color: #A17100;
    font-size: 16px;
    line-height: 45px;
    text-align: center;
    border-radius: 4px;
    background-color: #fdfdfd;
    -webkit-box-shadow: 0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, 0.25) inset, 0 17px 12px -12px rgba(0, 0, 0, 0.7);
    box-shadow: 0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, 0.25) inset, 0 17px 12px -12px rgba(0, 0, 0, 0.7);
    padding: 0 28px;
    -webkit-transition: background-color .4s, -webkit-box-shadow .4s;
    transition: background-color .4s, -webkit-box-shadow .4s;
    -o-transition: background-color .4s, box-shadow .4s;
    transition: background-color .4s, box-shadow .4s;
    transition: background-color .4s, box-shadow .4s, -webkit-box-shadow .4s;
    opacity:0.5
}

.btn-box1>a+a {
    margin-left: 20px
}

.btn-box1>a:hover {
    color: #A17100;
    background-color: #cfcece;
    background-image: none;
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) inset, 0 -1px 0 rgba(255, 255, 255, 0.4) inset, 0 0 0 1px rgba(0, 0, 0, 0.4), 0 1px 3px 1px rgba(0, 0, 0, 0.6);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) inset, 0 -1px 0 rgba(255, 255, 255, 0.4) inset, 0 0 0 1px rgba(0, 0, 0, 0.4), 0 1px 3px 1px rgba(0, 0, 0, 0.6)
}



#home {
    height: 100%;
    max-height: 736px
}

#home>.home-wrap {
    width: 100%;
    min-width: 320px;
    height: 100%;
    max-height: 736px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
    padding-top: 54px;
    position: fixed;
    top: 0;
    left: 0
}

#home.active .home-stage {
    -webkit-animation: m-home-stage .5s ease-out both;
    animation: m-home-stage .5s ease-out both
}

#home.active .img-box {
    -webkit-animation: img-box 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) both;
    animation: img-box 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) both
}

#home.active .year {
    -webkit-animation: right-small-move 6s infinite alternate;
    animation: right-small-move 6s infinite alternate
}

#home.active .title {
    animation: left-small-move 8s infinite reverse
}

#home.active .R-girl {
    -webkit-animation: right-pig-move 10s infinite;
    animation: right-pig-move 10s infinite
}

#home.active .home-intside-cloth {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0)
}

#home-box .title span:after,
#home-box .title span:before {
    content: "";
    background-image: -webkit-radial-gradient(#fff159 0%, rgba(255, 241, 89, 0) 69%);
    background-image: -o-radial-gradient(#fff159 0%, rgba(255, 241, 89, 0) 69%);
    background-image: radial-gradient(#fff159 0%, rgba(255, 241, 89, 0) 69%);
    position: absolute;
    z-index: 1;
    -webkit-animation: golden-title-flash 0.75s infinite alternate;
    animation: golden-title-flash 0.75s infinite alternate
}

#home-box .year:before,
#home-box .year:after,
#home-box .year>div:before {
    content: "";
    height: 0;
    background-size: cover;
    position: absolute;
    z-index: -1
}

#home-box {
    height: 100%;
    background: url("../images/home_bg.jpg") no-repeat center/cover;
    position: relative
}

#home-box.first>.home-intside-cloth {
    -webkit-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s
}

#home-box.first>.home-stage,
#home-box.first>.img-box {
    -webkit-animation-delay: .5s;
    animation-delay: .5s
}

#home-box.first>.img-box:before,
#home-box.first .title,
#home-box.first .year,
#home-box.first .R-girl,
#home-box.first .L-girl {
    -webkit-animation-delay: .8s;
    animation-delay: .8s
}

#home-box>div {
    position: absolute
}

#home-box>.home-outside-cloth,
#home-box>.home-intside-cloth,
#home-box>.img-box,
#home-box>.home-stage {
    width: 100%;
    left: 0
}

#home-box>.home-stage {
    height: 100%;
    background: url("../images/home_stage.png") no-repeat bottom center/auto 100%;
    top: 0
}

#home-box>.img-box {
    padding-bottom: 94.4%;
    bottom: 22%
}

#home-box>.img-box:before {
    background-image: url("../images/home_move_bg.png");
    padding-bottom: 31.11888%;
    bottom: 50%
}

#home-box>.img-box>.R-girl {
    width: 48.26667%;
    left: 45.73333%;
    top: -155px
}

#home-box>.img-box>.L-girl {
    display: none
}

#home-box .year em,
#home-box .title em {
    display: block;
    position: relative
}

#home-box .year em:after,
#home-box .title em:after {
    content: attr(data-word);
    text-shadow: none;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0
}

#home-box .year .silver-title,
#home-box .title .silver-title {
    color: #3b0404;
    text-shadow: 1px 2px 0 #3b0404, 0 0 5px rgba(0, 0, 0, 0.5), 0 0 18px rgba(0, 0, 0, 0.2)
}

#home-box .year .silver-title:after {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(15%, #fff), color-stop(78%, #d9d9d9), to(#9C0505));
    background-image: -webkit-linear-gradient(top, #f33534 15%, #f33534 78%, #9C0505 100%);
    background-image: -o-linear-gradient(top, #f33534 15%, #f33534 78%, #9C0505 100%);
    background-image: linear-gradient(180deg, #f33534 15%, #f33534 78%, #9C0505 100%)
}


#home-box .title .silver-title:after {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(15%, #fff), color-stop(78%, #d9d9d9), to(#f4f4f4));
    background-image: -webkit-linear-gradient(top, #fff 15%, #d9d9d9 78%, #f4f4f4 100%);
    background-image: -o-linear-gradient(top, #fff 15%, #d9d9d9 78%, #f4f4f4 100%);
    background-image: linear-gradient(180deg, #fff 15%, #d9d9d9 78%, #f4f4f4 100%)
}

#home-box .year {
    width: 92.8%;
    margin: 0;
    left: -12.6%;
    top: 85px;
    z-index: 0
}

/* #home-box .year:before {
    width: 20.97701%;
    padding-bottom: 16.95402%;
    background-image: url("../images/home_icon_1.png");
    left: 65%;
    bottom: 10.5%
}

#home-box .year:after {
    width: 34.48276%;
    padding-bottom: 31.32184%;
    background-image: url("../images/home_icon_2.png");
    left: 0;
    bottom: 0
    } */
    

#home-box .year>div {
    padding: 5.5% 7.5% 13% 16.5%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

/* #home-box .year>div:before {
    width: 23.27586%;
    padding-bottom: 21.26437%;
    background-image: url("../images/home_icon_3.png")
} */

#home-box .title {
    width: 85.33333%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 55%
}

#home-box .title span {
    display: inline-block;
    position: relative
}

#home-box .title>span:before {
    width: 18px;
    height: 18px;
    top: 50%;
    right: 0;
    -webkit-transform: translate(48%, -16.667%);
    -ms-transform: translate(48%, -16.667%);
    transform: translate(48%, -16.667%);
    -webkit-animation-delay: -0.25s;
    animation-delay: -0.25s
}

#home-box .title>span:after {
    width: 26px;
    height: 26px;
    top: 50%;
    left: 8%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

#home-box .title>span>span:before,
#home-box .title>span>span:after {
    width: 14px;
    height: 14px
}

#home-box .title>span>span:before {
    top: 50%;
    right: 57%;
    -webkit-animation-delay: -0.75s;
    animation-delay: -0.75s
}

#home-box .title>span>span:after {
    bottom: 50%;
    left: 60%;
    margin-bottom: 0.23em;
    -webkit-animation-delay: -0.5s;
    animation-delay: -0.5s
}

#home-box .title .golden-title {
    color: #dca558;
    text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.2), 1px 2px 0 #2c0303, 0 0 5px rgba(0, 0, 0, 0.5), 0 0 18px rgba(0, 0, 0, 0.2)
}

#home-box .title .golden-title:after {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(15%, #ffe57a), color-stop(78%, #dda558), to(#ffca6c));
    background-image: -webkit-linear-gradient(top, #ffe57a 15%, #dda558 78%, #ffca6c 100%);
    background-image: -o-linear-gradient(top, #ffe57a 15%, #dda558 78%, #ffca6c 100%);
    background-image: linear-gradient(180deg, #ffe57a 15%, #dda558 78%, #ffca6c 100%);
    padding-right: 0.2em
}

#home-box .title .golden-title:before {
    content: "";
    width: 100%;
    height: 0;
    background-image: url("../images/home_title_shadow.png");
    background-size: cover;
    padding-bottom: 7.85414%;
    margin-bottom: -1.35vw;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1;
    -webkit-transform: scale(1.25);
    -ms-transform: scale(1.25);
    transform: scale(1.25)
}

#home-box>.home-intside-cloth {
    height: 89%;
    /*background: url("../images/home_inside_cloth.png") no-repeat center bottom/cover;*/
    top: 12%;
    z-index: 1;
    -webkit-transform: translate3d(0, -13%, 0);
    transform: translate3d(0, -13%, 0);
    -webkit-transition: -webkit-transform .5s ease-out;
    transition: -webkit-transform .5s ease-out;
    -o-transition: transform .5s ease-out;
    transition: transform .5s ease-out;
    transition: transform .5s ease-out, -webkit-transform .5s ease-out
}

#home-box>.home-outside-cloth {
    height: 100%;
    -webkit-box-shadow: 0 -100px 0 #0C0D15;
    box-shadow: 0 -100px 0 #0C0D15;
    top: -5.8vw;
    z-index: 1
}

#home-box>.home-outside-cloth:before,
#home-box>.home-outside-cloth:after {
    content: "";
    width: 100%;
    height: 100%;
    background: url("../images/home_outside_cloth.png") no-repeat 0 0/170% auto;
    position: absolute;
    top: 0
}

#home-box>.home-outside-cloth:before {
    left: 0;
    background-position-x: right
}

#home-box>.home-outside-cloth:after {
    right: 0;
    background-position-x: left
}

.zh #home-box>.img-box,
.en #home-box>.img-box,
.vn #home-box>.img-box {
    font-family: "Noto Sans TC", sans-serif
}

.zh #home-box>.img-box .year>div:before {
    top: -8%;
    right: 20.5%
}

.zh #home-box>.img-box .year em:first-of-type {
    font-size: 18vw;
    text-align: center;
    text-indent: -0.25em
}

.zh #home-box>.img-box .year em:last-of-type {
    font-size: 11vw
}

.zh #home-box>.img-box .title {
    font-size: 9vw;
    line-height: 1.7;
    padding-left: .35em
}

.en #home-box>.img-box .year,
.vn #home-box>.img-box .year {
    font-size: 12vw;
    line-height: 1.4
}

.en #home-box>.img-box .year>div:before,
.vn #home-box>.img-box .year>div:before {
    top: -8%
}

.en #home-box>.img-box em,
.vn #home-box>.img-box em {
    -webkit-transform: scale(1, 1.1);
    -ms-transform: scale(1, 1.1);
    transform: scale(1, 1.1)
}

.en #home-box>.img-box .year>div:before {
    right: 5%
}

.en #home-box>.img-box .year em+em {
    text-indent: 1.2em
}

.en #home-box>.img-box .title {
    line-height: 2.7
}

.en #home-box>.img-box .title>.silver-title {
    font-size: 6vw
}

.en #home-box>.img-box .golden-title {
    font-size: 5.1vw
}

.vn #home-box>.img-box .year>div:before {
    right: 8%
}

.vn #home-box>.img-box .year em+em {
    text-indent: 0.25em
}

.vn #home-box>.img-box .title {
    line-height: 3
}

.vn #home-box>.img-box .title>.silver-title {
    font-size: 5.6vw
}

.vn #home-box>.img-box .golden-title {
    font-size: 4.2vw
}

.th {
    font-family: 'Kanit', sans-serif
}

.th #home-box>.img-box .year {
    font-size: 9.5vw;
    line-height: 3.2
}

.th #home-box>.img-box .year>div {
    padding-left: 8%
}

.th #home-box>.img-box .year>div:before {
    top: 0;
    right: 5%
}

.th #home-box>.img-box .year em {
    -webkit-transform: scale(1, 1.2);
    -ms-transform: scale(1, 1.2);
    transform: scale(1, 1.2)
}

.th #home-box>.img-box .year em:empty {
    display: none
}

.th #home-box>.img-box .title {
    line-height: 1.95
}

.th #home-box>.img-box .title>.silver-title {
    font-size: 8.5vw
}

.th #home-box>.img-box .golden-title {
    font-size: 7.1vw
}

#about {
    background: url("../images/about_bg.jpg") no-repeat center top/300% auto, url("../images/about_bg_after.jpg") repeat center bottom/300% auto
}

#about:before {
    background-image: url("../images/about_move_bg.png");
    padding-bottom: 44.27083%;
    margin-top: 24.4%
}

#about.active .about-f-coin {
    -webkit-animation: right-pig-move 8s linear infinite alternate;
    animation: right-pig-move 8s linear infinite alternate
}

#about.active .about-cards {
    animation: left-small-move 8s -2s infinite reverse
}

#about.active .about-rich-god {
    -webkit-animation: left-pig-move 9s infinite;
    animation: left-pig-move 9s infinite
}

#about.active .about-ship {
    -webkit-animation: right-small-move 7s infinite;
    animation: right-small-move 7s infinite
}

#about.active .about-balls {
    animation: right-pig-move 10s -7s infinite alternate-reverse
}

#about.active .about-p-coin {
    -webkit-animation: left-small-move 10s infinite;
    animation: left-small-move 10s infinite
}

#about.active .hand-move {
    animation: right-pig-move 10s -7s infinite alternate-reverse;
}

#about .img-box {
    padding-bottom: 85.85097%
}

#about .about-f-coin {
    width: 54.54545%;
    top: 7.61194%;
    left: 20.26826%
}

#about .about-cards {
    width: 24.88823%;
    top: 51.19403%;
    left: 60.9538%
}

#about .about-girl {
    width: 50.45455%;
    top: 8.35821%;
    left: 28.31595%
}

#about .about-girl_02 {
    width: 49.45455%;
    top: 15.35821%;
    left: 25.31595%;
}

/*#about .about-girl_02 {
    width: 47.45455%;
    top: 10.35821%;
    left: 25.31595%;
}*/

#about .about-img-box_02 {
    width: 96.87034%;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 18%;
}

#about .about-rich-god {
    width: 37.85395%;
    top: 30.1194%;
    /*16.1194%;*/
    left: 57.82414%
}

#about .about-ship {
    width: 35.76751%;
    top: 38.20896%;
    left: 9.09091%
}

#about .about-balls {
    width: 29.4456%;
    top: 22.53731%;
    left: 14.90313%
}

#about .about-img-box {
    width: 96.87034%;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

#about .about-p-coin {
    width: 100%;
    top: 8.50746%;
    left: 0
}

#about p>strong {
    color: #fff
}

/* #e-sports:before {
    background-image: url("../images/e_sports_move_bg.png");
    padding-bottom: 23.02083%;
    margin-top: 23.5%
} */

#e-sports.active .e-sports-desktop {
    animation: right-left-move 12s -2s infinite alternate-reverse both
}

#e-sports.active .e-sports-pad {
    -webkit-animation: left-small-move 10s -3s infinite;
    animation: left-small-move 10s -3s infinite
}

#e-sports.active .e-sports-phone {
    -webkit-animation: right-pig-move 8s infinite;
    animation: right-pig-move 8s infinite
}

#e-sports.active .e-sports-coin {
    -webkit-animation: left-pig-move 10s 2s infinite both;
    animation: left-pig-move 10s 2s infinite both
}

#e-sports .img-box {
    padding-bottom: 78.1874%
}

#e-sports .e-sports_device_shadow {
    width: 89.55453%;
    right: 0;
    bottom: 0
}

#e-sports .e-sports-desktop {
    width: 78.34101%;
    top: 0;
    left: 10.44547%
}

#e-sports .e-sports-pad {
    width: 29.95392%;
    top: 21.80747%;
    right: 0
}

#e-sports .e-sports-phone {
    width: 12.74962%;
    top: 43.41847%;
    left: 56.06759%
}

#e-sports .e-sports-coin {
    width: 31.1828%;
    top: 54.6169%;
    left: 0
}

#lottery {
    background: url("../images/lottery_bg.jpg") no-repeat center bottom/300% auto, url("../images/lottery_bg_before.jpg") repeat center top/300% auto
}

/* #lottery:before {
    background-image: url("../images/lottery_move_bg.png");
    padding-bottom: 37.71739%;
    margin-top: 18.6%;
    margin-top: 98.6%
} */

#lottery.active .lottery-lotterys {
    -webkit-animation: left-small-move 9s 1s infinite;
    animation: left-small-move 9s 1s infinite
}

#lottery.active .lottery-car {
    -webkit-animation: right-left-move 12s -2s infinite alternate both;
    animation: right-left-move 12s -2s infinite alternate both
}

#lottery.active .lottery-ball {
    -webkit-animation: left-pig-move 8s infinite;
    animation: left-pig-move 8s infinite
}

#lottery .img-box {
    padding-bottom: 120%;
    /*84.1195%*/
}

#lottery .lottery-img-bg {
    width: 83.80503%;
    background-image: url("../images/lottery_img_bg.png");
    padding-bottom: 84.1195%;
    top: 0;
    left: 0
}

#lottery .lottery-lotterys {
    width: 81.28931%;
    top: 6.54206%;
    left: .62893%;
}

#lottery .lottery-world {
    width: 81.28931%;
    /*top: 6.54206%;
    left: .62893%*/
}

#lottery .lottery-car {
    width: 93.39623%;
    top: 47.1028%;
    left: 6.60377%
}

#lottery .lottery-ball {
    width: 14.46541%;
    top: 73.64486%;
    left: 9.43396%
}

#chess {
    background-image: url("../images/chess_bg.jpg");
}

#chess:before {
    background-image: url("../images/chess_move_bg.png");
    padding-bottom: 30.41451%;
    margin-top: 29.2%
}

#chess.active .chess-girl {
    -webkit-animation: right-left-move 12s -2s infinite alternate both;
    animation: right-left-move 12s -2s infinite alternate both
}

#chess.active .chess-cow {
    -webkit-animation: left-pig-move 10s 1.6s infinite alternate both;
    animation: left-pig-move 10s 1.6s infinite alternate both
}

#chess.active .chess-card-man {
    -webkit-animation: right-pig-move 8s infinite both;
    animation: right-pig-move 8s infinite both
}

#chess.active .chess-prime {
    -webkit-animation: right-small-move 7s infinite;
    animation: right-small-move 7s infinite
}

#chess .img-box {
    padding-bottom: 99.53198%
}

#chess .chess-img-bg {
    width: 92.35569%;
    /* background-image: url("../images/chess_img_bg.png"); */
    padding-bottom: 92.35569%;
    top: 4.07524%;
    left: 6.70827%
}

#chess .chess-girl {
    width: 80.18721%;
    top: 0;
    left: 6.86427%
}

#chess .chess-cow {
    width: 32.91732%;
    top: 40.59561%;
    left: 59.43838%
}

#chess .chess-card-man {
    width: 39.31357%;
    top: 43.10345%;
    left: 1.71607%
}

#chess .chess-prime {
    width: 100%;
    top: 7.68025%;
    left: 0
}

#sexy {
    background-image: url("../images/sexy_move_bg.jpg");
}

/* #sexy:before {
    background-image: url("../images/sexy_move_bg.jpg");
    background-position: center;
    -webkit-box-shadow: 0 0 5px #0b0b0b;
    box-shadow: 0 0 5px #0b0b0b;
    padding-bottom: 96%;
    top: 0
} */

#sexy.active:before {
    -webkit-animation: m-sexy-bg-animate 12s linear infinite both;
    animation: m-sexy-bg-animate 12s linear infinite both
}

#sexy.active .sexy-girls {
    animation: right-left-move 12s -2s infinite alternate-reverse both
}

#sexy.active .sexy-coin {
    -webkit-animation: right-pig-move 9s infinite;
    animation: right-pig-move 9s infinite
}

#sexy.active .sexy-card {
    -webkit-animation: left-pig-move 9s -1.5s infinite;
    animation: left-pig-move 9s -1.5s infinite
}

#sexy h2>em {
    color: #A67712;
}

#sexy p {
    color: #000000;
    /* text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6), 0 0 3px rgba(0, 0, 0, 0.8) */
}

#sexy .img-box {
    padding-bottom: 89.69072%
}

#sexy .sexy-girls {
    width: 100.25037%;
    top: 0;
    left: 2.52577%;
}

#sexy .sexy-coin {
    width: 19.29308%;
    top: 17.56979%;
    right: 0
}

#sexy .sexy-card {
    width: 27.39323%;
    top: 60.75534%;
    left: 0
}

#process {
    text-align: center;
    background: url("../images/m_process_bg.jpg") no-repeat center top/cover;
    padding: 25px 0;
    border: 1px solid;
}

#process h2 {
    font-size: 36px
}

#process h3 {
    font-size: 24px;
    font-weight: normal;
    text-indent: 0
}
#process .row {
    margin: 0;
    justify-content: space-between;
    align-items: stretch;
}
#process .row .col {
    width: 50%;
}
#process.active .arrow {
    -webkit-animation: m-process-arrow .8s linear infinite;
    animation: m-process-arrow .8s linear infinite
}

.process-box>li {
    padding: 15px 0
}

.process-box>.arrow {
    width: 82px;
    height: 32px;
    padding: 2px 0 16px;
    margin: 0 auto
}

.process-box>.arrow:before,
.process-box>.arrow:after {
    content: "";
    width: 0;
    height: 0;
    display: block
}

.process-box>.arrow:before {
    border-width: 16px 41px 0 41px;
    border-style: solid;
    border-color: transparent rgba(0, 0, 0, 0.5)
}

.process-box>.arrow:after {
    border-width: 16px 41px 0 41px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.5) transparent transparent transparent
}

.process-box p {
    font-size: 16px;
    margin: 10px 0 0
}

.process-box i {
    font-style: normal;
    font-weight: 100
}

.process-icon {
    width: 90px;
    height: 90px;
    background-color: #fff;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 9px 25px rgba(0, 0, 0, 0.5);
    box-shadow: 0 9px 25px rgba(0, 0, 0, 0.5);
    padding: 20px;
    margin: 0 auto
}

.process-icon:after {
    content: "";
    width: 100%;
    height: 100%;
    background-image: url("../images/process_icon.jpg");
    background-size: 300px 50px;
    display: block
}

.process-icon.icon-2:after {
    background-position-x: -50px
}

.process-icon.icon-3:after {
    background-position-x: -100px
}

.process-icon.icon-4:after {
    background-position-x: -150px
}

.process-icon.icon-5:after {
    background-position-x: -200px
}

.process-icon.icon-0:after {
    background-position-x: -250px
}

#foot {
    color: #000;
    font-size: 14px;
    font-weight: 200;
    text-align: center;
    background-color: #ffffff;
    padding: 30px 20px 0;
    position: relative
}

#foot>.btn-box {
    font-weight: normal;
    position: relative
}

#goToTop {
    cursor: pointer;
    width: 62px;
    height: 62px;
    background-color: #ffffff;
    border-top: 1px solid #A67712;
    border-left: 1px solid #A67712;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, 45deg);
    transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, 45deg)
}

#goToTop>span {
    width: 8px;
    height: 8px;
    display: block;
    border: 1px solid #000;
    border-bottom-style: none;
    border-right-style: none;
    position: absolute;
    top: 13px;
    left: 13px
}

#goToTop>span+span {
    top: 17px;
    left: 17px
}

.foot-contact {
    padding-top: 20px
}

.foot-contact>.contact-item {
    color: #fff;
    font-size: 16px;
    line-height: 35px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.foot-contact img {
    width: 25px;
    margin-right: 6px
}

.foot-notice {
    line-height: 22px;
    padding: 5px;
    margin-bottom: 0
}

.copy-right {
    line-height: 50px;
    margin: 0
}

.pop-banner {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.pop-banner>.banner-block {
    margin: auto 36px;
    position: relative
}

.pop-banner .banner-close {
    width: 40px;
    height: 40px;
    background-color: #fff;
    border-radius: 50%;
    cursor: pointer;
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);
    position: absolute;
    top: -20px;
    right: -20px;
    -webkit-transition: -webkit-transform .4s;
    transition: -webkit-transform .4s;
    -o-transition: transform .4s;
    transition: transform .4s;
    transition: transform .4s, -webkit-transform .4s
}

.pop-banner .banner-close:before,
.pop-banner .banner-close:after {
    content: "";
    width: 25px;
    height: 3px;
    background-color: #000;
    border-radius: 5px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0
}

.pop-banner .banner-close:before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.pop-banner .banner-close:after {
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg)
}

.pop-banner .banner-close:hover {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.pop-banner .banner-img>img {
    width: 100%;
    display: block
}

.pop-banner .banner-img>img:last-of-type {
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: gif-effect 10.6s linear infinite;
    animation: gif-effect 10.6s linear infinite
}

.aeGirlsIg,
.contact-item-fixed {
    width: 80px;
    max-width: 30%;
    cursor: pointer;
    position: fixed;
    right: 50px;
    z-index: 1
}

.aeGirlsIg {
    bottom: 40px;
    -webkit-animation: ae-girls-ig 1s infinite alternate;
    animation: ae-girls-ig 1s infinite alternate
}

/* .aeGirlsIg>img {
    width: 100%
} */

.contact-item-fixed {
    height: 30px;
    bottom: 5px;
    font-weight: bold;
    font-size: 0px;
    padding: 0 2.5%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #222;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.contact-item-fixed>a {
    border-radius: 100px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 47%;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #fffffe), to(#fcd4a5));
    background: -webkit-linear-gradient(top, #fffffe 10%, #fcd4a5 100%);
    background: -o-linear-gradient(top, #fffffe 10%, #fcd4a5 100%);
    background: linear-gradient(to bottom, #fffffe 10%, #fcd4a5 100%);
    -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.6), 0 0 1px #fff inset;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.6), 0 0 1px #fff inset;
    -webkit-transition: .2s;
    -o-transition: .2s;
    transition: .2s
}

.contact-item-fixed>a:hover {
    -webkit-transform: translateY(1px);
    -ms-transform: translateY(1px);
    transform: translateY(1px)
}

.contact-item-fixed>a>img {
    height: 70%;
    margin-right: 3px
}

.contact-item-fixed.cif-skype {
    bottom: 53px
}

.contact-item-fixed.cif-mail {
    bottom: 10px
}

@media screen and (max-width: 320px) {
    .en .btn-box>a {
        padding: 0 14px
    }

    .th .btn-box>a,
    .vn .btn-box>a {
        padding: 0 8px
    }

    .th .btn-box>a+a,
    .vn .btn-box>a+a {
        margin-left: 12px
    }

    .vn .menu-wrap a {
        font-size: 25px
    }

    .vn .btn-box>a {
        font-size: 14px
    }

    .lang {
        margin-top: 0
    }

    #foot>p {
        font-size: 12px
    }
}

@media screen and (min-width: 568px) {

    .th>#about .btn-box>a,
    .vn>#about .btn-box>a,
    .en>#about .btn-box>a {
        padding: 0 8px
    }



    .th>#about .btn-box>a {
        font-size: 14px
    }

    .vn>#about .btn-box>a {
        font-size: 13px
    }

    .zh #home-box>.img-box .year {
        line-height: 1.1
    }

    .zh #home-box>.img-box .year em:first-of-type {
        font-size: 6.3vw;
        text-indent: 0
    }

    .zh #home-box>.img-box .year em:last-of-type {
        font-size: 3.85vw
    }

    .zh #home-box>.img-box .title {
        font-size: 3vw;
        line-height: 1.3;
        padding-top: 2.5vw;
        padding-left: 0
    }

    .en #home-box .title>.silver-title,
    .vn #home-box .title>.silver-title {
        text-shadow: 1px 1px 0 #3b0404, 0 0 5px rgba(0, 0, 0, 0.5), 0 0 18px rgba(0, 0, 0, 0.2)
    }

    .en #home-box>.img-box .year,
    .vn #home-box>.img-box .year {
        font-size: 4.2vw
    }

    .en #home-box>.img-box .title,
    .vn #home-box>.img-box .title {
        line-height: 1.8;
        padding-top: 2.5vw
    }

    .en #home-box>.img-box .golden-title,
    .vn #home-box>.img-box .golden-title {
        text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.2), 1px 1px 0 #2c0303, 0 0 5px rgba(0, 0, 0, 0.5), 0 0 18px rgba(0, 0, 0, 0.2)
    }

    .en #home-box>.img-box .year em+em {
        text-indent: 1em
    }

    .en #home-box>.img-box .title>.silver-title {
        font-size: 2.1vw
    }

    .en #home-box>.img-box .golden-title {
        font-size: 1.8vw
    }

    .vn #home-box>.img-box .year em+em {
        text-indent: 1em
    }

    .vn #home-box>.img-box .title>.silver-title {
        font-size: 2vw
    }

    .vn #home-box>.img-box .golden-title {
        font-size: 1.6vw
    }

    .th #home-box>.img-box .year {
        font-size: 3.325vw
    }

    .th #home-box>.img-box .title {
        line-height: 1.5;
        padding-top: 1.5vw
    }

    .th #home-box>.img-box .title>.silver-title {
        font-size: 3vw
    }

    .th #home-box>.img-box .golden-title {
        font-size: 2.5vw
    }

    #home.active .L-girl {
        -webkit-animation: left-pig-move 12s infinite alternate;
        animation: left-pig-move 12s infinite alternate
    }

    #home.active .home-stage {
        -webkit-animation-name: home-stage;
        animation-name: home-stage
    }

    #home-box>.img-box {
        text-align: center;
        width: calc(127.18vh - 68px);
        max-width: 100%;
        height: 100%;
        padding-bottom: 0;
        margin: auto;
        right: 0;
        bottom: 0
    }

    #home-box>.img-box:before {
        margin: auto;
        top: 0;
        bottom: 0
    }

    /* #home-box>.img-box>.year,
    #home-box>.img-box>.year-exp {
        width: 64.41667%;
        top: 6.90021%;
        left: 14.58333%
    } */


    #home-box>.img-box>.year,
    #home-box>.img-box>.year-exp {
        width: 62.41667%;
        top: 19.90021%;
        left: -24.41667%;
    }

    #home-box>.img-box>.year-exp {
        padding-bottom: 35.16667%
    }

    #home-box>.img-box>.title,
    #home-box>.img-box>.title-exp {
        width: 59.41667%;
        top: 38.74735%
    }

    #home-box>.img-box>.title-exp {
        padding-bottom: 22.41667%
    }

    #home-box>.img-box>.R-girl {
        width: 30.16667%;
        top: 8.59873%;
        left: 68.75%
    }

    #home-box>.img-box>.L-girl {
        width: 29.91667%;
        display: block;
        top: 12.50955%;
        left: 22.25%;
    }

    #home-box>.home-intside-cloth {
        top: 16%;
        -webkit-transform: translate3d(0, -17%, 0);
        transform: translate3d(0, -17%, 0)
    }

    #home-box>.home-outside-cloth {
        top: -3.5vw
    }

    #home-box>.home-outside-cloth:before {
        display: none
    }

    #home-box>.home-outside-cloth:after {
        background-size: 100% auto
    }

    #about,
    #e-sports,
    #sexy,
    #chess,
    #lottery {
        padding: 40px 20px
    }

    #about:before,
    #e-sports:before,
    #sexy:before,
    #chess:before,
    #lottery:before {
        margin: auto 0;
        top: 0;
        bottom: 0
    }

    #about>.wrap,
    #e-sports>.wrap,
    #sexy>.wrap,
    #chess>.wrap,
    #lottery>.wrap {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center
    }

    #about .img-box,
    #e-sports .img-box,
    #sexy .img-box,
    #chess .img-box,
    #lottery .img-box {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 45%;
        -ms-flex: 0 0 45%;
        flex: 0 0 45%
    }

    #about .content-box,
    #e-sports .content-box,
    #sexy .content-box,
    #chess .content-box,
    #lottery .content-box {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 55%;
        -ms-flex: 0 0 55%;
        flex: 0 0 55%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        position: relative;
        z-index: 1
    }

    #about .content-box,
    #sexy .content-box,
    #lottery .content-box {
        padding: 0 5px 0 25px
    }

    #e-sports .img-box,
    #chess .img-box {
        -webkit-box-ordinal-group: 0;
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0
    }

    #e-sports .content-box,
    #chess .content-box {
        padding: 0 25px 0 5px
    }

    #about .img-box {
        padding-bottom: 60.93294%
            /*44.93294%*/
    }

    #about .btn-box>a {
        padding: 0 24px
    }

    #e-sports .img-box {
        padding-bottom: 35.18433%
    }

    #lottery .img-box {
        padding-bottom: 37.85377%
    }

    #chess .img-box {
        padding-bottom: 44.78939%
    }

    #sexy:before {
        width: 45%;
        padding-bottom: 25.2439%
    }

    #sexy.active:before {
        -webkit-animation-name: sexy-bg-animate;
        animation-name: sexy-bg-animate
    }

    #sexy .img-box {
        padding-bottom: 40.36082%
    }

    .pop-banner>.banner-block {
        max-width: 260px;
        margin: auto
    }

    .aeGirlsIg,
    .contact-item-fixed {
        max-width: 14%
    }

    .contact-item-fixed {
        padding: 0 1%
    }


}

@media screen and (min-width: 640px) {
    .en>#about .btn-box>a {
        padding: 0 18px
    }

    .vn>#about .btn-box>a {
        font-size: 14px
    }

    .th>#about .btn-box>a,
    .vn>#about .btn-box>a {
        padding: 0 14px
    }

    #head.menu--open #logo>a {
        height: 47px;
        background-position: 30px 6px;
        top: 30px;
        left: 0
    }

    .menu-wrap {
        padding: 77px 0 48px
    }

    .menu-wrap a {
        line-height: 50px
    }

    .lang>a+a:before {
        top: 9px
    }

    #process {
        background: url("../images/process_bg.jpg") no-repeat center/cover;
        border: 1px solid;
    }

    #process.active .arrow {
        -webkit-animation: process-arrow 1s linear infinite;
        animation: process-arrow 1s linear infinite
    }

    .process-box {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 25px 0 5px
    }

    .process-box>li {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 72px;
        -ms-flex: 0 0 72px;
        flex: 0 0 72px;
        padding: 0
    }

    .process-box>.arrow {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 24px;
        -ms-flex: 0 0 24px;
        flex: 0 0 24px;
        height: 60px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        padding: 6px 16px 0 0;
        margin: 0
    }

    .process-box>.arrow:before {
        border-width: 30px 0 30px 12px;
        border-color: rgba(0, 0, 0, 0.5) transparent
    }

    .process-box>.arrow:after {
        border-width: 30px 0 30px 12px;
        border-color: transparent transparent transparent rgba(0, 0, 0, 0.5)
    }

    .process-box p {
        margin-top: 21px
    }

    .process-box i {
        font-size: 12px;
        display: block
    }

    .process-icon {
        width: 72px;
        height: 72px;
        padding: 16px;
        -webkit-box-shadow: 0 7px 20px rgba(0, 0, 0, 0.5);
        box-shadow: 0 7px 20px rgba(0, 0, 0, 0.5)
    }

    .process-icon:after {
        background-size: 240px 40px
    }

    .process-icon.icon-2:after {
        background-position-x: -40px
    }

    .process-icon.icon-3:after {
        background-position-x: -80px
    }

    .process-icon.icon-4:after {
        background-position-x: -120px
    }

    .process-icon.icon-5:after {
        background-position-x: -160px
    }

    .process-icon.icon-0:after {
        background-position-x: -200px
    }

    .pop-banner>.banner-block {
        max-width: 300px
    }
}

@media screen and (min-width: 768px) {

    .th>#about .btn-box>a,
    .vn>#about .btn-box>a {
        font-size: 16px
    }

    .en>#about .btn-box>a,
    .th>#about .btn-box>a,
    .vn>#about .btn-box>a {
        padding: 0 24px
    }

    #about,
    #e-sports,
    #sexy,
    #chess,
    #lottery {
        padding: 70px 20px
    }

    #about,
    #lottery {
        background-size: 150% auto
    }

    .process-box>li {
        -webkit-flex-basis: 90px;
        -ms-flex-preferred-size: 90px;
        flex-basis: 90px
    }

    .process-box>.arrow {
        padding: 15px 18px 0 2px
    }

    .process-box i {
        font-size: 14px
    }

    .process-icon {
        width: 90px;
        height: 90px;
        -webkit-box-shadow: 0 9px 25px rgba(0, 0, 0, 0.5);
        box-shadow: 0 9px 25px rgba(0, 0, 0, 0.5);
        padding: 20px;
        margin: 0 auto
    }

    .process-icon:after {
        background-size: 300px 50px
    }

    .process-icon.icon-2:after {
        background-position-x: -50px
    }

    .process-icon.icon-3:after {
        background-position-x: -100px
    }

    .process-icon.icon-4:after {
        background-position-x: -150px
    }

    .process-icon.icon-5:after {
        background-position-x: -200px
    }

    .process-icon.icon-0:after {
        background-position-x: -250px
    }

    .foot-contact {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .foot-contact>.contact-item+.contact-item {
        margin-left: 40px
    }

    .pop-banner>.banner-block {
        max-width: 500px
    }
}

@media screen and (min-width: 568px) and (max-width: 767px) and (orientation: portrait) {
    
    #home {
        max-height: 100%
    }

    #home>.home-wrap {
        max-height: 100%
    }

    #home-box>.img-box {
        width: 100%;
        height: 0;
        padding-bottom: 94.4%;
        bottom: 20%
    }

    #home-box>.img-box>.year,
    #home-box>.img-box>.year-exp {
        width: 92.8%;
        top: 0;
        left: -5.6%
    }

    #home-box>.img-box>.year-exp {
        padding-bottom: 50.66667%
    }

    #home-box>.img-box>.title,
    #home-box>.img-box>.title-exp {
        width: 85.33333%;
        top: 45.19774%
    }

    #home-box>.img-box>.title-exp {
        padding-bottom: 32.26667%
    }

    #home-box>.img-box>.R-girl {
        width: 48.26667%;
        top: 0;
        left: 71.73333%
    }

    #home-box>.img-box>.L-girl {
        display: none
    }

    #home-box>.home-intside-cloth {
        top: 12%;
        -webkit-transform: translate3d(0, -13%, 0);
        transform: translate3d(0, -13%, 0)
    }

    #home-box>.home-outside-cloth {
        top: -5.8vw
    }

    #home-box>.home-outside-cloth:before {
        display: block
    }

    #home-box>.home-outside-cloth:after {
        background-size: 170% auto
    }
}

@media screen and (min-width: 768px) and (max-width: 1000px) and (orientation: portrait) {

    .wrap-slider {
        max-width: 774px;
        margin: 0 auto;
    }


    #home {
        padding-top: 54px
    }

    #home:before {
        content: "";
        height: 100%;
        display: block;
        background: url("../images/home_bg.jpg") no-repeat center/cover
    }

    #home-box {
        background: none
    }

    #home-box>.img-box {
        height: 0;
        max-width: 98%;
        padding-bottom: 76.93%;
        top: 0
    }

    #home-box>.img-box .year .silver-title,
    #home-box>.img-box .title .silver-title {
        text-shadow: 2px 3px 0 #3b0404, 0 0 10px rgba(0, 0, 0, 0.5), 0 0 36px rgba(0, 0, 0, 0.2)
    }

    #home-box>.img-box .title .golden-title {
        text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.2), 2px 3px 0 #2c0303, 0 0 10px rgba(0, 0, 0, 0.5), 0 0 36px rgba(0, 0, 0, 0.2)
    }

    .zh #home-box>.img-box .year>div {
        padding-bottom: 18%
    }

    .zh #home-box>.img-box .year em:first-of-type {
        font-size: 11vw
    }

    .zh #home-box>.img-box .year em:last-of-type {
        font-size: 6.7vw
    }

    .zh #home-box>.img-box .title {
        font-size: 5.5vw;
        line-height: 1.35;
        padding-top: 5vw;
        left: -293px;
    }

    .en #home-box>.img-box .year,
    .vn #home-box>.img-box .year {
        font-size: 6.4vw
    }

    .en #home-box>.img-box .year>div,
    .vn #home-box>.img-box .year>div {
        padding-bottom: 16%
    }

    .en #home-box>.img-box .title,
    .vn #home-box>.img-box .title {
        padding-right: 1.5vw
    }

    .en #home-box>.img-box .title {
        padding-top: 5.5vw
    }

    .en #home-box>.img-box .title>.silver-title {
        font-size: 3.8vw
    }

    .en #home-box>.img-box .golden-title {
        font-size: 3.2vw
    }

    .vn #home-box>.img-box .year em+em {
        text-indent: 0
    }

    .vn #home-box>.img-box .title {
        line-height: 1.85;
        padding-top: 6.2vw
    }

    .vn #home-box>.img-box .title>.silver-title {
        font-size: 3.6vw
    }

    .vn #home-box>.img-box .golden-title {
        font-size: 2.8vw
    }

    .th #home-box>.img-box .year {
        font-size: 5.6vw
    }

    .th #home-box>.img-box .year>div {
        padding: 5.5% 7.5% 18% 9%
    }

    .th #home-box>.img-box .title {
        padding-top: 5vw
    }

    .th #home-box>.img-box .title>.silver-title {
        font-size: 5.2vw
    }

    .th #home-box>.img-box .golden-title {
        font-size: 4.4vw
    }
}

@media screen and (min-width: 1024px) {

    .wrap-slider {
        max-width: 774px;
        margin: 0 auto;
    }

    .en .wrap h2,
    .th .wrap h2,
    .vn .wrap h2 {
        margin-bottom: 2px
    }

    .en .wrap h3,
    .en .wrap p,
    .th .wrap h3,
    .th .wrap p,
    .vn .wrap h3,
    .vn .wrap p {
        line-height: 1.6
    }

    .en .wrap h3,
    .th .wrap h3,
    .vn .wrap h3 {
        text-indent: 28px;
        margin-bottom: 1em
    }

    .en .wrap p,
    .th .wrap p,
    .vn .wrap p {
        margin-bottom: 1em
    }

    .en .wrap p+.btn-box,
    .th .wrap p+.btn-box,
    .vn .wrap p+.btn-box {
        padding-top: 6px
    }

    .zh #home-box>.img-box .year>div {
        padding-bottom: 15%
    }

    .zh #home-box>.img-box .year>div:before {
        right: 18.5%
    }

    .zh #home-box>.img-box .year em:first-of-type {
        font-size: 13.5vh
    }

    .zh #home-box>.img-box .year em:last-of-type {
        font-size: 8.25vh
    }

    .zh #home-box>.img-box .title {
        font-size: 7.75vh;
        left: -934px;
    }

    .en #home-box>.img-box .year,
    .vn #home-box>.img-box .year {
        font-size: 9vh
    }

    .en #home-box>.img-box .year>div,
    .vn #home-box>.img-box .year>div {
        padding: 5.5% 9.5% 16% 16.5%
    }

    .en #home-box>.img-box .title,
    .vn #home-box>.img-box .title {
        padding-top: 6.9vh;
        padding-right: 2.5vh
    }

    .en #home-box>.img-box .title>.silver-title {
        font-size: 4.6vh
    }

    .en #home-box>.img-box .golden-title {
        font-size: 3.9vh
    }

    .vn #home-box>.img-box .year em+em {
        text-indent: 0
    }

    .vn #home-box>.img-box .title {
        line-height: 2.1
    }

    .vn #home-box>.img-box .title>.silver-title {
        font-size: 4.2vh
    }

    .vn #home-box>.img-box .golden-title {
        font-size: 3.2vh
    }

    .th .menu-wrap a[text] {
        font-size: 12px;
        padding: 0 8px
    }

    .th #home-box>.img-box .year {
        font-size: 6.9vh
    }

    .th #home-box>.img-box .year>div {
        padding: 5.5% 7.5% 16% 9%
    }

    .th #home-box>.img-box .title {
        line-height: 1.55;
        padding-top: 3.6vh
    }

    .th #home-box>.img-box .title>.silver-title {
        font-size: 6.6vh
    }

    .th #home-box>.img-box .golden-title {
        font-size: 5.5vh
    }

    #head.menu--open #logo>a,
    #logo>a {
        width: 91px;
        height: 44px
    }

    #head {
        height: 64px;
        padding: 0
    }

    #head.menu--open .menu-wrap {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    #head.menu--open #logo>a {
        background-position: 0 0
    }

    .menu-wrap {
        width: auto;
        background: none;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-shadow: none;
        box-shadow: none;
        padding: 10px;
        position: initial;
        text-align: center;
        display: block;
        margin-left: 1rem;
    }

    .menu-wrap>ul {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;

    }

    .menu-wrap a {
        font-size: 14px;
        font-weight: normal;
        line-height: 44px;
        text-indent: 0;
        cursor: pointer;
        padding: 0 12px
    }

    #logo {
        margin-right: auto
    }

    #logo>a {
        background-size: 91px 44px;
        padding: 0;
        position: initial
    }

    .lang {
        margin: 0 0 0 auto
    }

    .lang>a {
        -webkit-flex-basis: auto;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        padding: 0 12px
    }

    .lang>a+a {
        margin-left: 0
    }

    .lang>a+a:before {
        width: 1px;
        height: 12px;
        top: 16px;
        left: 0
    }

    #head__m-btn {
        display: none
    }

    #home {
        max-height: 100%;
        padding-top: 64px
    }

    #home:before {
        content: "";
        height: 100%;
        display: block;
        background: url("../images/home_bg.jpg") no-repeat center/cover
    }

    #home>.home-wrap {
        max-height: 100%;
        padding-top: 0px
    }

    #home-box {
        background: none
    }

    #home-box>.img-box {
        width: calc(127.19vh - 80px)
    }

    #home-box>.img-box .year .silver-title,
    #home-box>.img-box .title .silver-title {
        text-shadow: 3px 3px 0 #3b0404, 0 0 10px rgba(0, 0, 0, 0.5), 0 0 36px rgba(0, 0, 0, 0.2)
    }

    #home-box>.img-box .title .golden-title {
        text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.2), 3px 3px 0 #2c0303, 0 0 10px rgba(0, 0, 0, 0.5), 0 0 36px rgba(0, 0, 0, 0.2)
    }

    #home-box>.home-intside-cloth {
        top: 15%;
        -webkit-transform: translate3d(0, -16%, 0);
        transform: translate3d(0, -16%, 0)
    }

    #home-box .title>span:before {
        width: 26px;
        height: 26px
    }

    #home-box .title>span:after {
        width: 36px;
        height: 36px
    }

    #home-box .title>span>span:before,
    #home-box .title>span>span:after {
        width: 20px;
        height: 20px
    }

    #process h2 {
        font-weight: normal
    }

    #process h3 {
        font-weight: 300
    }

    .process-box>.arrow {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 32px;
        -ms-flex: 0 0 32px;
        flex: 0 0 32px;
        height: 82px;
        padding-top: 26px
    }

    .process-box>.arrow:before,
    .process-box>.arrow:after {
        border-width: 20px 0 20px 16px
    }

    .process-box>li {
        -webkit-flex-basis: 100px;
        -ms-flex-preferred-size: 100px;
        flex-basis: 100px
    }

    .process-box i {
        font-size: 16px
    }


}





@media screen and (min-width: 576px) and (max-width: 1023px) {
    #logo-hide-02 {
        display: none;
    }
    .wrap li {
        font-size: 16px;
        line-height: 30px;
        width: 48%;
    }
}



@media screen and (min-width: 1024px) and (max-width: 1200px) {
    #logo-hide {
        display: none;
    }
    .wrap li {
    
        width: 50%;
    }
}



@media screen and (min-width: 1200px) {
    .wrap li {
    
        width: 50%;
    }

    .th .menu-wrap a[text] {
        font-size: 14px;
        padding: 0 10px
    }

    .vn>#e-sports .content-box,
    .vn>#sexy .content-box,
    .vn>#chess .content-box,
    .vn>#lottery .content-box,
    .en>#e-sports .content-box,
    .en>#sexy .content-box,
    .en>#chess .content-box,
    .en>#lottery .content-box,
    .th>#e-sports .content-box,
    .th>#sexy .content-box,
    .th>#chess .content-box,
    .th>#lottery .content-box {
        padding-left: 30px;
        padding-right: 30px
    }

    .vn>#about .content-box,
    .en>#about .content-box,
    .th>#about .content-box {
        padding-right: 20px;
        padding-left: 20px
    }

    .menu-wrap a {
        font-size: 16px
    }

    .wrap-slider {
        max-width: 774px;
        margin: 0 auto;
    }

    #home.active .year,
    #home.active .title,
    #home.active .L-girl,
    #home.active .R-girl {
        -webkit-animation-name: none;
        animation-name: none
    }

    #home-box>.home-outside-cloth {
        top: -4vw
    }

    #about,
    #lottery {
        background-size: initial
    }

    #about {
        padding: 20px 0
    }

    #lottery {
        padding: 100px 0
    }

    #chess {
        padding: 40px 0 0
    }

    #e-sports,
    #sexy {
        padding: 50px 0 0
    }

    #about .content-box,
    #sexy .content-box,
    #lottery .content-box {
        padding-right: 50px;
        padding-left: 30px
    }

    #e-sports .content-box,
    #chess .content-box {
        padding-right: 30px;
        padding-left: 50px
    }

    #e-sports .content-box,
    #sexy .content-box,
    #chess .content-box {
        padding-bottom: 50px
    }

    #sexy.active:before {
        -webkit-animation-name: d-sexy-bg-animate;
        animation-name: d-sexy-bg-animate
    }

    #sexy:before {
        width: 64%;
        padding-bottom: 35.90244%;
        left: -10%
    }
}

@media screen and (min-width: 1280px) and (max-width:1400px) {

    .phone_size img{

        max-width: 1400px;
    }

}

@media screen and (min-width: 1280px) {
    .wrap li {
    
        width: 50%;
    }



    .en .wrap h2,
    .th .wrap h2,
    .vn .wrap h2 {
        font-size: 32px
    }

    .en .wrap h3,
    .th .wrap h3,
    .vn .wrap h3 {
        font-size: 20px
    }

    .th .wrap p {
        font-size: 16px
    }


    .wrap-slider {
        max-width: 774px;
        margin: 0 auto;
    }


    #home:before {
        background-size: initial;
        background-position: 50% 80%
    }

    #sexy:before {
        left: -8%
    }

    #chess .chess-img-bg {
        height: 100%;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: calc(50% + 344px) calc(50% + 32px);
        background-size: 499px 499px;
        padding-bottom: 60px;
        top: -60px
    }

    #lottery .lottery-img-bg {
        height: 100%;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: calc(50% - 374px) calc(50% + 32px);
        background-size: 453px 454px;
        padding-bottom: 160px;
        top: -80px
    }

    .process-box {
        padding: 35px 0 15px
    }

    .process-box>li {
        -webkit-flex-basis: 126px;
        -ms-flex-preferred-size: 126px;
        flex-basis: 126px
    }

    .process-box>.arrow {
        -webkit-flex-basis: 52px;
        -ms-flex-preferred-size: 52px;
        flex-basis: 52px;
        height: 132px;
        padding: 48px 18px 0 4px
    }

    .process-box>.arrow:before,
    .process-box>.arrow:after {
        border-width: 30px 0 30px 25px
    }

    .process-box p {
        margin-top: 34px
    }

    .process-icon {
        width: 144px;
        height: 144px;
        -webkit-box-shadow: 0 14px 40px rgba(0, 0, 0, 0.5);
        box-shadow: 0 14px 40px rgba(0, 0, 0, 0.5);
        padding: 32px
    }

    .process-icon:after {
        background-size: 480px 80px
    }

    .process-icon.icon-2:after {
        background-position-x: -80px
    }

    .process-icon.icon-3:after {
        background-position-x: -160px
    }

    .process-icon.icon-4:after {
        background-position-x: -240px
    }

    .process-icon.icon-5:after {
        background-position-x: -320px
    }

    .process-icon.icon-0:after {
        background-position-x: -400px
    }
}

@media screen and (min-width: 1440px) {
    .wrap li {
    
        width: 50%;
    }

    .th .menu-wrap a[text] {
        font-size: 16px;
        padding: 0 12px
    }

    .wrap {
        max-width: 1300px;
        /* text-align: center; */
    }

    .wrap-slider {
        max-width: 900px;
        margin: 0 auto;
    }

    #home-box .title>span:before {
        width: 34px;
        height: 34px
    }

    #home-box .title>span:after {
        width: 48px;
        height: 48px
    }

    #home-box .title>span>span:before,
    #home-box .title>span>span:after {
        width: 26px;
        height: 26px
    }

    #about {
        padding: 30px 0
    }

    #e-sports,
    #sexy,
    #chess {
        padding: 60px 0 0
    }
    #e-sports .content-box,
    #sexy .content-box,
    #chess .content-box {
        padding-bottom: 60px
    }

    #lottery {
        padding: 120px 0
    }

    

    .pop-banner>.banner-block {
        max-width: 600px
    }

    #e-sports{
        min-height: 825px;
    }



}

@media screen and (min-width: 1600px) {


    .wrap li {
    
        width: 50%;
    }

    #home:before {
        background-position: center bottom
    }

    #about .img-box,
    #e-sports .img-box,
    #sexy .img-box,
    #chess .img-box,
    #lottery .img-box {
        -webkit-flex-basis: 55%;
        -ms-flex-preferred-size: 55%;
        flex-basis: 55%
    }

    #about .content-box,
    #e-sports .content-box,
    #sexy .content-box,
    #chess .content-box,
    #lottery .content-box {
        -webkit-flex-basis: 45%;
        -ms-flex-preferred-size: 45%;
        flex-basis: 45%
    }

    #about.active .about-f-coin {
        -webkit-animation-name: d-right-pig-move;
        animation-name: d-right-pig-move
    }

    #about.active .about-cards {
        -webkit-animation-name: d-left-small-move;
        animation-name: d-left-small-move
    }

    #about.active .about-rich-god {
        -webkit-animation-name: d-left-pig-move;
        animation-name: d-left-pig-move
    }

    #about.active .about-ship {
        -webkit-animation-name: d-right-small-move;
        animation-name: d-right-small-move
    }

    #about.active .about-balls {
        -webkit-animation-name: d-right-pig-move;
        animation-name: d-right-pig-move
    }

    #about.active .about-p-coin {
        -webkit-animation-name: d-left-small-move;
        animation-name: d-left-small-move
    }

    #about .img-box {
        padding-bottom: 54.91803%
    }

    #e-sports.active .e-sports-desktop {
        -webkit-animation-name: d-right-left-move;
        animation-name: d-right-left-move
    }

    #e-sports.active .e-sports-pad {
        -webkit-animation-name: d-left-small-move;
        animation-name: d-left-small-move
    }

    #e-sports.active .e-sports-phone {
        -webkit-animation-name: d-right-pig-move;
        animation-name: d-right-pig-move
    }

    #e-sports.active .e-sports-coin {
        -webkit-animation-name: d-left-pig-move;
        animation-name: d-left-pig-move
    }

    #e-sports .img-box {
        padding-bottom: 43.00307%
    }

    #sexy:before {
        left: -1%
    }

    #sexy.active .sexy-girls {
        -webkit-animation-name: d-right-left-move;
        animation-name: d-right-left-move
    }

    #sexy.active .sexy-coin {
        -webkit-animation-name: d-right-pig-move;
        animation-name: d-right-pig-move
    }

    #sexy.active .sexy-card {
        -webkit-animation-name: d-left-pig-move;
        animation-name: d-left-pig-move
    }

    #sexy .img-box {
        padding-bottom: 49.3299%
    }

    #chess.active .chess-girl {
        -webkit-animation-name: d-right-left-move;
        animation-name: d-right-left-move
    }

    #chess.active .chess-cow {
        -webkit-animation-name: d-left-pig-move;
        animation-name: d-left-pig-move
    }

    #chess.active .chess-card-man {
        -webkit-animation-name: d-right-pig-move;
        animation-name: d-right-pig-move
    }

    #chess.active .chess-prime {
        -webkit-animation-name: d-right-small-move;
        animation-name: d-right-small-move
    }

    #chess .img-box {
        padding-bottom: 54.74259%
    }

    #chess .chess-img-bg {
        background-position: calc(50% + 288px) calc(50% + 32px);
        background-size: 610px 610px
    }

    #lottery.active .lottery-lotterys {
        -webkit-animation-name: d-left-small-move;
        animation-name: d-left-small-move
    }

    #lottery.active .lottery-car {
        -webkit-animation-name: d-right-left-move;
        animation-name: d-right-left-move
    }

    #lottery.active .lottery-ball {
        -webkit-animation-name: d-left-pig-move;
        animation-name: d-left-pig-move
    }

    #lottery .img-box {
        padding-bottom: 46.26572%
    }

    #lottery .lottery-img-bg {
        background-position: calc(50% - 324px) calc(50% + 32px);
        background-size: 553px 555px
    }
}

@media screen and (min-width: 1800px) {

    .wrap li {
    
        width: 58%;
    }

    #home-box>.home-outside-cloth {
        top: -4.4vw
    }

    #sexy:before {
        left: 0
    }

    .pop-banner>.banner-block {
        max-width: 700px
    }
}

@media screen and (min-width: 2000px) {

    .wrap li {
    
        width: 50%;
    }

    body,
    #head,
    #home>.home-wrap {
        max-width: 1920px;
        margin: 0 auto
    }

    #head.head--fixed {
        left: 50%;
        -webkit-animation: pig-desk-head-slide .4s both;
        animation: pig-desk-head-slide .4s both
    }

    #home>.home-wrap {
        left: 50%;
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0)
    }

    #home-box>.home-intside-cloth {
        top: 15vw
    }

    section,
    #foot {
        -webkit-box-shadow: 0 0 600px 60px rgba(0, 0, 0, 0.75);
        box-shadow: 0 0 600px 60px rgba(0, 0, 0, 0.75)
    }
}

/*# sourceMappingURL=layout.min.css.map */