/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
@import url("css2-NotoSansTCwght100300400500700900_swap.css");

button,hr,input {
    overflow: visible
}

audio,canvas,progress,video {
    display: inline-block
}

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

html {
    font-family: sans-serif;
    line-height: 1.15;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

menu,article,aside,details,footer,header,nav,section {
    display: block
}

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

figcaption,figure,main {
    display: block
}

figure {
    margin: 1em 40px
}

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

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

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

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

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

b,strong {
    font-weight: bolder
}

dfn {
    font-style: italic
}

mark {
    background-color: #ff0;
    color: #000
}

small {
    font-size: 80%
}

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

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

audio:not([controls]) {
    display: none;
    height: 0
}

img {
    border-style: none
}

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

button,input,optgroup,select,textarea {
    font-family: sans-serif;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,select {
    text-transform: none
}

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

[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

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

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

textarea {
    overflow: auto
}

[type=checkbox],[type=radio] {
    box-sizing: border-box;
    padding: 0
}

[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-cancel-button,[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

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

summary {
    display: list-item
}

[hidden],template {
    display: none
}

ul,ol {
    margin: 0;
    padding: 0;
    list-style: none
}

p {
    margin: 0
}

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

body {
    color: #666;
    font-family: "Noto Sans TC", sans-serif;
    background-color: #f5efe7
}

@media (min-width: 900px) {
    body {
        font-weight:300
    }
}

a {
    outline: 0;
    color: #666;
    text-decoration: none;
    transition: color .2s
}

a:hover {
    color: #333;
    text-decoration: underline
}

p {
    line-height: 1.5
}

em {
    font-style: normal
}

h1,h2,h3,h4,h5,h6 {
    margin: 0;
    color: #333;
    letter-spacing: -0.02em;
    font-weight: 400
}

h1 {
    font-size: 2.25em
}

@media (min-width: 900px) {
    h1 {
        font-size:46px
    }
}

h2 {
    font-size: 1.625em
}

@media (min-width: 900px) {
    h2 {
        font-size:28px
    }
}

h3 {
    font-size: 1.25em
}

@media (min-width: 900px) {
    h3 {
        font-size:22px
    }
}

h4 {
    font-size: 1em
}

@media (min-width: 900px) {
    h4 {
        font-size:18px
    }
}

#nctGnb {
    display: none
}

@media (min-width: 900px) {
    #nctGnb {
        display:block
    }
}

#nctGnb .ncGnb .wrap {
    max-width: 1260px !important
}

.nctGnb--small {
    transition: all .2s;
    min-height: 0 !important;
    height: 0 !important;
    overflow: hidden
}

#nctGnb .gnbMenu .myInfo p {
    height: 40px !important
}

#nctGnb .gnbMenu .myInfo p.user.FB span:before {
    padding-right: 20px !important
}

#nctFooter {
    position: relative;
    display: block;
    height: 55px !important;
    padding: 10px 0 15px 0 !important;
    border-top: none !important
}

@media (min-width: 600px) {
    #nctFooter {
        display:block;
        height: 140px !important;
        padding: 40px 0 !important;
        border-top: 1px solid #ebebeb !important
    }
}

#nctFooter .ncFooterMini {
    font-size: 11px
}

#nctFooter .ncFooter {
    max-width: 1260px !important;
    padding: 0 1em !important
}

#nctFooter .ncFooter .footerMenu {
    right: 1em !important
}

.bottom-footer {
    position: relative;
    border-top: 1px solid #ebebeb;
    background: #fff
}

.bottom-footer .bottom-footer__inner:after {
    content: "";
    display: table;
    clear: both
}

@media (min-width: 600px) {
    .bottom-footer .bottom-footer__inner {
        padding:20px 0
    }
}

@media (min-width: 900px) {
    .bottom-footer .bottom-footer__inner {
        padding:20px 1em
    }
}

.bottom-footer .bottom-footer__inner .bottom-footer__maintain {
    margin-bottom: 25px;
    padding: 14px 0;
    font-size: 14px;
    text-align: center;
    border-bottom: 1px solid #ebebeb
}

@media (min-width: 600px) {
    .bottom-footer .bottom-footer__inner .bottom-footer__maintain {
        float:left;
        margin-bottom: 0;
        border-bottom: none;
        text-align: left
    }
}

.bottom-footer .bottom-footer__inner .bottom-footer__rating {
    display: block;
    padding: 58px 0 0;
    margin: 0 auto;
    font-size: 11px;
    background: url("../image/icon.png") 50% -50px no-repeat;
    line-height: 1.3;
    text-align: center
}

@media (min-width: 600px) {
    .bottom-footer .bottom-footer__inner .bottom-footer__rating {
        float:right;
        height: 45px;
        padding: 1px 50px 0 0;
        margin: 0;
        text-align: right;
        background-position: right -50px
    }
}

#status {
    top: 60px;
    left: 0;
    position: absolute;
    z-index: 1000000
}

.overflow-container {
    overflow: hidden
}

@media (min-width: 900px) {
    .loading-container {
        top:20px;
        left: 0;
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 100000;
        background-color: #fff
    }
}

.loading-section {
    top: 50%;
    left: 0;
    position: absolute;
    width: 100%
}

.loading-section:after {
    top: 50%;
    left: 0;
    position: absolute;
    width: 100%;
    height: 1px;
    z-index: -1;
    content: "";
    display: block;
    background-color: #ddd
}

.loading-section .loading-logo {
    top: 50%;
    left: -20px;
    position: absolute;
    width: 100%;
    height: 121px;
    margin: -140px auto 0;
    background: url("../image/loading.png") 50% -121px no-repeat;
    overflow: hidden
}

.loading-section .loading-logo #loadedLogo {
    left: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    background: url("../image/loading.png") 50% 0 no-repeat
}

.loading-section #loading {
    width: 0%;
    height: 1px;
    background-color: #c5a068
}

.loading-txt {
    top: 50%;
    left: 0;
    position: absolute;
    width: 100%;
    height: 21px;
    margin: 20px auto 0 auto;
    text-align: center
}

html,body {
    width: 100%;
    height: 100%
}

.container {
    max-width: 1260px;
    margin-left: auto;
    margin-right: auto;
    min-width: 320px;
    padding: 0 1em
}

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

.container:after {
    content: "";
    display: table;
    clear: both
}

@media (min-width: 1260px) {
    .container {
        padding:0
    }
}

.section {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden
}

.inner {
    max-width: 1260px;
    margin-left: auto;
    margin-right: auto;
    position: relative
}

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

.landing-container {
    position: relative;
    min-width: 320px;
    background: #ffffff url("../image/bg_m_v2.jpg") 50% 0 no-repeat;
    background-size: cover;
    overflow: hidden
}

@media (min-width: 900px) {
    .landing-container {
        height: 960px;
        background: url("../image/bg_pc1.jpg") 50% 0 no-repeat;
        background-size: 1920px auto;
        position: relative;
    }
    .landing-container:before,.landing-container:after {
        position: absolute;
        pointer-events: none;
        width: 100%;
        height: 100%;
        content: "";
        display: block;
        z-index: 7;
    }
    .landing-container:before {
        background: url("../image/mist1.png") no-repeat 50% 0;
    }
    .landing-container:after {
        background: url("../image/mist2.png") no-repeat 50% 0;
    }
}
@-webkit-keyframes fade {
  50% {opacity: 1;}
}
@keyframes fade {
  50% {opacity: 1;}
}

/*.sns-list {
    display: none
}*/
.sns-list {
    display:block;
    top: 10px;
    right: 10px;
    position: absolute;
    z-index: 10
}

.sns-list a {
    width: 40px;
    height: 40px;
    display: inline-block;
    margin-left: 5px;
    border: 1px solid #b5b5b5;
    border-radius: 30px;
    background: rgba(0,0,0,0.6) url("../image/sns.png") no-repeat;
    background-size: auto 40px;
    text-indent: -9999px;
    -webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;
}

.sns-list a:hover{
    -webkit-filter:contrast(150%);filter:contrast(150%);
    background-color: rgba(0,0,0,.3);
}

.sns-list a.link-fb {
    background-position: 0 0
}

.sns-list a.link-gamer {
    background-position: -40px 0
}

@media (min-width: 900px) {
    .sns-list {
        display:block;
        top: 20px;
        right: 10.3%;
        position: absolute;
        z-index: 10
    }

    .sns-list a {
        width: 53px;
        height: 53px;
        display: inline-block;
        margin-left: 10px;
        border: 1px solid #b5b5b5;
        border-radius: 30px;
        background: rgba(0,0,0,0.6) url("../image/sns.png") no-repeat;
        text-indent: -9999px;
        -webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;
    }
    
    .sns-list a:hover{
        -webkit-filter:contrast(150%);filter:contrast(150%);
        background-color: rgba(0,0,0,.3);
    }

    .sns-list a.link-fb {
        background-position: 0 0
    }

    .sns-list a.link-gamer {
        background-position: -53px 0
    }
}

@media (min-width: 900px) {
    .section-mobile {
        display:none
    }
}

.section-mobile img.blank {
    max-width: 100%
}

.section-mobile a {
    top: 0;
    left: 0;
    position: absolute;
    display: block;
    text-indent: -99999px;
}

.section-mobile a.btn-l2 {
    width: 100%;
    height: 17%;
    /*top: 36.5%;*/
    top: 28%;
}

.section-mobile a.btn-classic {
    width: 100%;
    height: 17%;
    /*top: 76%;*/
    top: 82%
}

.section-mobile a.btn-50 {
    width: 50%;
}
.section-mobile a.btn-bottom {
    top: 78.5%;
}

.section-mobile a.btn-classic.btn-50 {
    right: 0;
    left: 50%;
}

.section-mobile a.btn-l2_update,.section-mobile a.btn-classic_update{width:150px;height:150px;top:50%;left:50%;margin-top:-75px;margin-left:-75px;}
.section-mobile a.btn-l2_update{margin-top:-225px;margin-left:-190px;}
.section-mobile a.btn-classic_update{margin-top:70px;margin-left:35px;}

@media (min-width: 550px) {
    .section-mobile a.btn-l2_update,.section-mobile a.btn-classic_update{width:200px;height:200px;margin-top:-100px;margin-left:-100px;}
    .section-mobile a.btn-l2_update{margin-top:-50%;margin-left:-39%;}
    .section-mobile a.btn-classic_update{margin-top:22%;margin-left:15%;}
}

@media (min-width: 900px) {
    .section-obj {
        display:none
    }
}

@media (min-width: 900px) and (min-width: 900px) {
    .section-obj {
        display:block
    }
    .section-obj:before {
        position: absolute;
        pointer-events: none;
        width: 100%;
        height: 100%;
        content: "";
        display: block;
        background: url("../image/bg_pc2.png") no-repeat 50% 0;
        z-index: 5;
    }
    .section-obj:after {
        position: absolute;
        pointer-events: none;
        width: 100%;
        height: 100%;
        content: "";
        display: block;
        opacity: 0;
        background: url("../image/light.png") no-repeat 50% 0;
        z-index: 7;
        /*-webkit-transition:all .3s ease-out;
        -moz-transition:all .3s ease-out;
        -ms-transition:all .3s ease-out;
        -o-transition:all .3s ease-out;
        transition:all .3s ease-out;*/
        mix-blend-mode: lighten;
    }
}

.section-obj a {
    font-size: 0;
    line-height: 0;
    text-indent: -99999px;
}
.section-obj .update_title, .section-obj .update_logo, .section-obj .update_stitle, .section-obj .update_date {
    pointer-events: none;
    font-size: 0;
    line-height: 0;
    text-indent: -99999px;
}
.section-mobile .btn-update-l2 {
    position: absolute;
    top: 91%;
    width: 100%;
    height: 5.2%;
}
.section-mobile .btn-update-classic {
    position: absolute;
    top: 60%;
    width: 40%;
    height: 15%;
    right: 0;
    left: auto;
}




#video {
    display:none
}

@media (min-width: 900px) {
    .section-obj .obj {
        left:50%;
        position: absolute;
        font-size: 0
    }

    .section-obj .obj-fire {
        width: 887px;
        height: 840px;
        top: 0;
        z-index: 1;
        margin-left: -962px;
        background: url("../image/obj_fire.png") 0 0 no-repeat
    }

    .section-obj .obj-stone {
        width: 887px;
        height: 840px;
        top: 54px;
        z-index: 1;
        margin-left: -122px;
        background: url("../image/obj_stone.png") 0 0 no-repeat
    }

    .section-obj .obj-smoke-loop {
        width: 1851px;
        height: 696px;
        bottom: 0;
        left: -100%;
        z-index: 2;
        background: url("../image/obj_smoke_loop.png") 0 0 no-repeat
    }

    .section-obj .obj-smoke-loop1 {
        -webkit-animation: smoke 10s -0.5s infinite ease-out;
        animation: smoke 10s -0.5s infinite ease-out
    }

    @-webkit-keyframes smoke {
        from {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

        to {
            -webkit-transform: translateX(200%);
            transform: translateX(200%)
        }
    }

    @keyframes smoke {
        from {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

        to {
            -webkit-transform: translateX(200%);
            transform: translateX(200%)
        }
    }

    .section-obj .obj-smoke-loop2 {
        -webkit-animation: smoke2 20s -0.5s infinite ease-out;
        animation: smoke2 20s -0.5s infinite ease-out
    }

    @-webkit-keyframes smoke2 {
        from {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

        to {
            -webkit-transform: translateX(200%);
            transform: translateX(200%)
        }
    }

    @keyframes smoke2 {
        from {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

        to {
            -webkit-transform: translateX(200%);
            transform: translateX(200%)
        }
    }

    .section-obj .obj-smoke-loop3 {
        -webkit-animation: smoke3 30s -0.5s infinite ease-out;
        animation: smoke3 30s -0.5s infinite ease-out
    }

    @-webkit-keyframes smoke3 {
        from {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

        to {
            -webkit-transform: translateX(200%);
            transform: translateX(200%)
        }
    }

    @keyframes smoke3 {
        from {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

        to {
            -webkit-transform: translateX(200%);
            transform: translateX(200%)
        }
    }

    .section-obj .obj-smoke-loop4 {
        -webkit-animation: smoke4 40s -0.5s infinite ease-out;
        animation: smoke4 40s -0.5s infinite ease-out
    }

    @-webkit-keyframes smoke4 {
        from {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

        to {
            -webkit-transform: translateX(200%);
            transform: translateX(200%)
        }
    }

    @keyframes smoke4 {
        from {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

        to {
            -webkit-transform: translateX(200%);
            transform: translateX(200%)
        }
    }

    .section-obj .obj-smoke-left {
        width: 1131px;
        height: 638px;
        bottom: 0;
        z-index: 3;
        margin-left: -1160px;
        background: url("../image/obj_smoke_left.png") 0 0 no-repeat
    }

    .section-obj .obj-smoke-right {
        width: 1279px;
        height: 745px;
        bottom: 0;
        z-index: 3;
        margin-left: -118px;
        background: url("../image/obj_smoke_right.png") 0 0 no-repeat
    }

    .section-obj .obj-update {
        width: 371px;
        height: 45px;
        top: 214px;
        z-index: 9;
        margin-left: -186px
    }

    .section-obj .obj-update .obj-update-text {
        width: 100%;
        height: 100%;
        background: url("../image/obj_update_class_181214.png") 0 0 no-repeat;
        -webkit-animation: update 1s infinite ease-out;
        animation: update 1s infinite ease-out
    }

    @-webkit-keyframes update {
        0% {
            -webkit-transform: translate(0, 0);
            transform: translate(0, 0)
        }

        20% {
            -webkit-transform: translate(1px, 0);
            transform: translate(1px, 0)
        }

        30% {
            -webkit-transform: translate(0, 1px);
            transform: translate(0, 1px)
        }

        60% {
            -webkit-transform: translate(0, 0);
            transform: translate(0, 0)
        }

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

    @keyframes update {
        0% {
            -webkit-transform: translate(0, 0);
            transform: translate(0, 0)
        }

        20% {
            -webkit-transform: translate(1px, 0);

            transform: translate(1px, 0)
        }

        30% {
            -webkit-transform: translate(0, 1px);
            transform: translate(0, 1px)
        }

        60% {
            -webkit-transform: translate(0, 0);
            transform: translate(0, 0)
        }

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

    .section-obj .obj-update-l2 {
        width: 422px;
        height: 133px;
        top: 477px;
        z-index: 9;
        margin-left: -490px;
        background: url("../image/obj_update_l2_181214.png") 0 0 no-repeat
    }

    .section-obj .obj-update-classic {
        width: 422px;
        height: 133px;
        top: 495px;
        z-index: 9;
        margin-left: 81px;
        background: url("../image/obj_update_class_181214.png") 0 0 no-repeat
    }

    .section-obj [class*="logo-"] {
        -webkit-transition:all .3s ease;
        -moz-transition:all .3s ease;
        -ms-transition:all .3s ease;
        -o-transition:all .3s ease;
        transition:all .3s ease;
    }

    .section-obj .logo-l2 {
        background: url("../image/logo_l2.png") 50% 50% no-repeat;
        width: 270px;
        height: 220px;
        top: 650px;
        margin-left: -340px;
        z-index: 9;
    }

    .section-obj .logo-classic {
        background: url("../image/logo_classic.png") 50% 50% no-repeat;
        width: 270px;
        height: 220px;
        top: 650px;
        margin-left: 70px;
        z-index: 9;
    }
	
/* 秈﹛呼 */		

    .section-obj .btn-l2 {
        width: 348px;
        height: 55px;
        z-index: 9;
        /*top: 624px;
        margin-left: -400px;*/
        background: url("") 0 0 no-repeat;
        top: 710px;
        margin-left: -390px;
    }

    .section-obj .btn-l2:hover {
        background-position: 0 -55px ;
    }

    .section-obj .btn-classic {
        width: 344px;
        height: 55px;
        z-index: 9;
        /*top: 624px;
        margin-left: 170px;*/
        background: url("") 0 0 no-repeat;
        top: 710px;
        margin-left: 30px;
    }

    .section-obj .btn-classic:hover { background-position: 0 -55px;  }
	


/* э灿 */		
    .section-obj .btn-update-l2 {
        /*width: 433px;
        height: 77px;
        top: 785px;*/
        z-index: 9;
        margin-left: -216.5px;
        background: none
    }

    .section-obj .btn-update-l2:hover { background-position: 0 -77px;}
	
	.section-obj .btn-update-classic {
        /*width: 283px;
        height: 77px;
        top: 850px;*/
        z-index: 9;
        margin-left: -141.5px;
        background: none
    }

    .section-obj .btn-update-classic:hover { background-position: 0 -77px;  }
	
/* 笆秙 */	


    .section-obj .btn-event-l2 {
        width: 1109px;
        height: 67px;
        top: 730px;
        z-index: 9;
        margin-left: -960px;
        background: url("../image/btn_event_181214.png") 0 0 no-repeat
    }

    .section-obj .btn-event-l2:hover {
        background-position: 0 -62px
    }



/* 笆秙 */	
    .section-obj .btn-event-classic {
        width: 1109px;
        height: 67px;
        top: 800px;
        z-index: 9;
        margin-left: -150px;
        background: url("../image/btn_event_181214_2.png") 0 0 no-repeat
    }

    .section-obj .btn-event-classic:hover {
        background-position: 0 -64px
    }

/* 笆秙 */	



    .section-obj .btn-preview-classic {
        width: 320px;
        height: 91px;
        top: 660px;
        z-index: 9;
        margin-left: 66px;
        background: url("../image/btn_preview_classic_180614.png") 0 0 no-repeat
    }

    .section-obj .btn-preview-classic:hover {
        background-position: 0 -103px
    }
	
/* ㄈ */
    .section-obj .obj-aden-video {
        width: 480px;
        height: 269px;
        position: absolute;
        top: 273px;
        left: 50%;
        margin-left: -240px;
        display: block;
    }
    
    .section-obj .btn_aden {
        width: 480px;
        height: 72px;
        z-index: 9;
        top: 830px;
        left: 50%;
        margin-left: -240px;
        background: url("../image/btn_aden_190220.png") 0 0 no-repeat;
    }
    .section-obj .btn_aden:hover {
        background-position: 0 -72px;;
    }
    
    .section-obj .btn_aden_rotate, .section-obj .btn_aden_support {
        width: 369px;
        height: 72px;
        z-index: 9;
        top: 830px;
        left: 50%;
        background: url("../image/btn_aden_190227.png") 0 0 no-repeat;
    }
    .section-obj .btn_aden_rotate {
        margin-left: -400px;
    }
    .section-obj .btn_aden_rotate:hover {
        background-position: 0 -72px;
    }
    
    .section-obj .btn_aden_support {
        margin-left: 25px;
        background-position: -387px 0;
    }
    .section-obj .btn_aden_support:hover {
        background-position: -387px -72px;
    }
    
    .section-obj .btn_adenintro {
        width: 195px;
        height: 195px;
        z-index: 9;
        top: 445px;
        margin-left: -465px;
        border-radius: 100%;
        background: url("../image/btn_aden_intro.png") 0 0 no-repeat;
    }
    .section-obj .btn_adenintro:hover {
        background-position: 0 -195px;;
    }

	.section-obj .btn_aden_support2 {
        width: 480px;
        height: 72px;
        z-index: 9;
        top: 830px;
        left: 50%;
        margin-left: -240px;
        background: url("../image/btn_aden_190313.png") 0 0 no-repeat;
    }
    .section-obj .btn_aden_support2:hover {
        background-position: 0 -72px;;
    }
    
    .section-obj .btn_jinkamael {
        width: 300px;
        height: 400px;
        z-index: 9;
        top: 90px;
        margin-left: -150px;
    }
    
    .section-obj .update_title {
        position: absolute;
        top: 285px;
        left: 50%;
        margin-left: -487.5px;
        z-index: 5;
        width: 975px;
        height: 140px;
        opacity: 0;
        background: url("../image/title_v2.png") 0 0 no-repeat;
    }
    
    .section-obj .update_stitle {
        pointer-events: none;
        position: absolute;
        top: 260px;
        left: 50%;
        margin-left: -318px;
        z-index: 6;
        width: 636px;
        height: 465px;
        opacity: 0;
        background: url("../image/stitle_v2.png") 50% 0 no-repeat;
        z-index: 100;
    }
    
    .section-obj .update_date {
        pointer-events: none;
        position: absolute;
        top: 520px;
        left: 50%;
        margin-left: 135px;
        z-index: 6;
        width: 200px;
        height: 130px;
        opacity: 0;
        background: none 0 0 no-repeat;
        z-index: 100;
    }
    
    .section-obj .update_stitle-l2 {
        background: none 50% 0 no-repeat;
       margin-left: -560px;
    }
    .section-obj .update_stitle-classic {
        background: none 50% 0 no-repeat;
         margin-left: -70px;
    }
    
    .section-obj .update_char {
        position: absolute;
        top: 0;
        /*left: 50%;
        margin-left: -960px;*/
        width: 100%;
        height: 960px;
        background: url("../image/char_190802.png") 50% 50% no-repeat;
    }
    
    .section-obj .update_logo {
        position: absolute;
        top: 430px;
        left: 50%;
        margin-left: -455px;
        z-index: 1;
        width: 910px;
        height: 613px;
        opacity: 0;
        background: url("../image/obj_update_classic_191016.png") 0 0 no-repeat;
    }
    
    /* button */
    .section-obj .btn_event {
        position: absolute;
        top: 590px;
        left: 50%;
        margin-left: -113px;
        z-index: 1;
        width: 226px;
        height: 65px;
        opacity: 0;
        background: none;
    }

    #video {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
        min-width: 100%;
        min-height: 100%;
        width: auto;
        height: auto;
        overflow: hidden;
        display: block;
    }
    
    .section-obj .btn_update {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -400px;
        margin-left: -250px;
        width: 350px;
        height: 350px;
        -webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;
        opacity: 0;
        z-index: 10;
    }
    .section-obj .btn_update:before,.section-obj .btn_update:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .section-obj .btn_update:hover:before {
        animation:fadeScale 3.5s ease-out infinite;
    }
    .section-obj .btn-l2_update {
        width: 400px;
        height: 400px;
        margin-top: -220px;
        margin-left: -750px;
    }
    .section-obj .btn-l2_update:before {
        background: url("../image/btn01.png") 50% 50% no-repeat;
    }
    .section-obj .btn-l2_update:after {
        background: url("../image/btn01_txt.png") 50% 50% no-repeat;
    }
    .section-obj .btn-classic_update {
        margin-top: 0px;
        margin-left: 400px;
    }
    .section-obj .btn-classic_update:before {
        background: url("../image/btn02.png") 50% 50% no-repeat;
    }
    .section-obj .btn-classic_update:after {
        background: url("../image/btn02_txt.png") 50% 50% no-repeat;
    }
    
    .cloud-loop {
        bottom: 0;
        left: 0;
        position: absolute;
        width: 1920px;
        height: 470px;
        pointer-events: none;
        background: url("../image/cloud_loop.png") 50% 0 no-repeat;
        z-index: 7;
    }

    .cloud-loop.cloud-loop1 {
        -webkit-animation: cloud1 15s 0s infinite ease-out;
        animation: cloud1 15s 0s infinite ease-out;
    }
    .cloud-loop.cloud-loop2 {
        -webkit-animation: cloud2 30s 0s infinite ease-out;
        animation: cloud2 30s 0s infinite ease-out;
    }
    .cloud-loop.cloud-loop3 {
        -webkit-animation: cloud3 40s 0s infinite ease-out;
        animation: cloud3 40s 0s infinite ease-out;
    }
    .cloud-loop.cloud-loop4 {
        -webkit-animation: cloud4 60s 0s infinite ease-out;
        animation: cloud4 60s 0s infinite ease-out;
    }

    @-webkit-keyframes cloud1{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}
    @keyframes cloud1{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}
    @-webkit-keyframes cloud2{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}
    @keyframes cloud2{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}
    @-webkit-keyframes cloud3{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}
    @keyframes cloud3{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}
    @-webkit-keyframes cloud4{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}
    @keyframes cloud4{from{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(100%);transform:translateX(100%)}}
}

#nctFooter.rwd.lineage2 > .ncFooterMini:last-child{
    display: none;
}

.section-obj a{-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;}
.section-obj a:hover{-webkit-filter:contrast(150%);filter:contrast(150%);}


/** 20240417 animation -- START **/
/*.landing-container:after{animation-play-state:paused;}*/
.landing-container.up-show.up-classic{background-position-y:-1920px;}
.landing-container.up-show.up-l2 .section-obj:before{background-position-y:-1920px;}
.landing-container.up-show.up-classic .section-obj:after{opacity:1;animation:scaleLight 1.5s forwards cubic-bezier(0.25,0.1,0.25,1);transform-origin:80% 40%;}

.landing-container.up-show:after{content:"";opacity:0;width:100%;height:100%;background-position:50% -960px;position:absolute;pointer-events:none;/*-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;*/animation-play-state:running;}
.landing-container.up-l2:after{background-image:url("../image/bg_pc1.jpg");background-position:50% -960px;z-index:0;animation:changeBG1 3s forwards cubic-bezier(0.25,0.1,0.25,1);animation-iteration-count:1;}
.landing-container.up-classic:after{background-image:url("../image/bg_pc2.png");background-position:50% -960px;z-index:6;animation:changeBG2 3s forwards cubic-bezier(0.25,0.1,0.25,1);animation-iteration-count:1;}

.cloud-loop {
    opacity: 0.25;
}

.event1,.event2{opacity:0;width:100%;height:100%;position:absolute;}
.event1{left:0;clip-path:polygon(0 0, 60% 0, 40% 100%, 0% 100%);}
.event2{right:0;clip-path:polygon(60% 0, 100% 0, 100% 100%, 40% 100%);}

@-webkit-keyframes changeBG1 {
  100% {opacity:1;background-position-y:-960px;-webkit-filter:contrast(130%);filter:contrast(130%);}
}
@keyframes changeBG1 {
  100% {opacity:1;background-position-y:-960px;-webkit-filter:contrast(130%);filter:contrast(130%);}
}

@-webkit-keyframes changeBG2 {
  100% {opacity:1;background-position-y:-960px;-webkit-filter:contrast(130%);filter:contrast(130%);}
}
@keyframes changeBG2 {
  100% {opacity:1;background-position-y:-960px;-webkit-filter:contrast(130%);filter:contrast(130%);}
}
@-webkit-keyframes scaleLight {
  100% {transform:scale(2);opacity:0;}
}
@keyframes scaleLight {
  100% {transform:scale(2);opacity:0;}
}
@-webkit-keyframes fadeScale{
  0%,100%{opacity:0.4;transform-origin:50% 50%;}
  15%,85%{-webkit-filter:contrast(100%);filter:contrast(100%);}
  35%,65%{opacity:1;-webkit-filter:contrast(150%);filter:contrast(150%);}
  50%{-webkit-filter:contrast(100%);filter:contrast(100%);}
  100%{transform:scale(1.1,1.1);}
}
@keyframes fadeScale{
  0%,100%{opacity:0.4;transform-origin:50% 50%;}
  15%,85%{-webkit-filter:contrast(100%);filter:contrast(100%);}
  35%,65%{opacity:1;-webkit-filter:contrast(150%);filter:contrast(150%);}
  50%{-webkit-filter:contrast(100%);filter:contrast(100%);}
  100%{transform:scale(1.1,1.1);}
}
/** 20240417 animation -- END **/