:root{--border-animation-duration:2s}.scroll-wave{z-index:1000;opacity:.9;width:40px;height:60px;margin-top:335px;transition:opacity .5s;position:relative}.scroll-wave span{border:2px solid #c9a959b3;border-radius:50%;width:30px;height:30px;animation:2s ease-out infinite waveExpand;position:absolute;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 0 10px #c9a95966,0 0 20px #c9a95933,inset 0 0 8px #c9a9591a}.scroll-wave span:nth-child(2){animation-delay:.5s}.scroll-wave span:nth-child(3){animation-delay:1s}@keyframes waveExpand{0%{opacity:1;transform:translate(-50%)scale(.3);box-shadow:0 0 10px #c9a95999,0 0 20px #c9a95966,inset 0 0 8px #c9a95933}to{opacity:0;transform:translate(-50%)scale(1.5);box-shadow:0 0 15px #c9a9591a,0 0 30px #c9a9590d,inset 0 0 8px #c9a95900}}body.scrolled .scroll-wave{opacity:0;pointer-events:none}@font-face{font-family:LOTTERIACHAB;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2302@1.0/LOTTERIACHAB.woff2)format("woff2");font-weight:400;font-style:normal}body,h1,h2,h3,p,ul,li{margin:0;padding:0}a{color:#fff;text-decoration:none;display:block}li{list-style:none}img{vertical-align:top}*{box-sizing:border-box}body{background-color:#000;height:6300px;font-family:Roboto,Arial,sans-serif;overflow-x:hidden}#wrap,.maincontain,.title,.btn-wrap,.pagination-group-slide .swiper-pagination,#modal .modal-bg,ul,ul2,ul3{justify-content:center;align-items:center;display:flex}#wrap{background-position:50%;background-repeat:no-repeat;flex-direction:column;width:100%;min-width:1900px;position:relative}header{z-index:10;position:fixed;top:60px;right:50px}#top_button{z-index:10;opacity:0;cursor:pointer;position:fixed;bottom:60px;right:100px}.logo{z-index:5;margin-top:10px;position:absolute;top:75px;left:70px}#hide{z-index:20;opacity:1;transition:opacity 3s;position:absolute}.mobile{z-index:5;width:100%;display:none;position:absolute;top:0;left:0}.special{justify-content:center;margin-left:-7px;display:flex}video#bgvid{display:none}:root{--bg-deep:#0a0a0f;--bg-mid:#12121a;--accent-gold:#c9a959;--accent-rose:#8b6b6b;--accent-slate:#4a5568;--glow-primary:#c9a95926;--glow-secondary:#8b6b6b1f}.background-container{z-index:-1;position:fixed;inset:0;overflow:hidden}.base-gradient{background:radial-gradient(ellipse 80% 50% at 20% 40%,#1e1b26e6 0%,transparent 50%),radial-gradient(ellipse 60% 40% at 80% 60%,#1a202ccc 0%,transparent 50%),linear-gradient(180deg,var(--bg-deep)0%,var(--bg-mid)100%);position:absolute;inset:0}.aurora{filter:blur(80px);opacity:0;width:150%;height:150%;animation:12s ease-in-out infinite aurora-breathe;position:absolute}.aurora-1{background:radial-gradient(ellipse at center,var(--glow-primary)0%,transparent 70%);animation-delay:0s;top:-30%;left:-25%}.aurora-2{background:radial-gradient(ellipse at center,var(--glow-secondary)0%,transparent 70%);animation-delay:4s;top:20%;right:-30%}.aurora-3{background:radial-gradient(#4a55681a 0%,#0000 70%);animation-delay:8s;bottom:-20%;left:10%}@keyframes aurora-breathe{0%,to{opacity:.3;transform:scale(1)translate(0)}50%{opacity:.6;transform:scale(1.1)translate(2%,2%)}}.wave-layer{-webkit-mask-composite:source-in;background:repeating-linear-gradient(120deg,#0000 0%,#c9a95905 10%,#0000 20%);animation:25s linear infinite wave-drift;position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 15% 70%,#0000 100%),linear-gradient(#0000 0%,#000 10% 90%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0%,#000 15% 70%,#0000 100%),linear-gradient(#0000 0%,#000 10% 90%,#0000 100%);-webkit-mask-composite:source-in;mask-composite:intersect}@keyframes wave-drift{0%{transform:translate(-50%)skew(-5deg)}to{transform:translate(0%)skew(-5deg)}}.particles{position:absolute;inset:0}.particle{background:var(--accent-gold);opacity:0;border-radius:50%;width:2px;height:2px;animation:6s ease-in-out infinite particle-glow;position:absolute}@keyframes particle-glow{0%,to{opacity:0;transform:scale(.5)}50%{opacity:.6;transform:scale(1)}}.light-streak{opacity:0;background:linear-gradient(#0000,#c9a9591a,#c9a95905,#0000);width:1px;height:30vh;animation:15s linear infinite streak-fall;position:absolute}@keyframes streak-fall{0%{opacity:0;transform:translateY(-100%)rotate(15deg)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(100vh)rotate(15deg)}}.noise-overlay{opacity:.03;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");position:absolute;inset:0}.vignette{background:radial-gradient(ellipse at center,transparent 40%,var(--bg-deep)100%);pointer-events:none;position:absolute;inset:0}.play{padding-top:12px}.home{margin-right:20px;padding-top:12px}.oneday{clear:both;text-align:right;margin-top:60px}.left{float:left}.right{float:right}.maincontain{flex-direction:column;width:100%;margin-top:475px;position:relative}.title{z-index:8;flex-direction:row;max-height:1900px;margin-left:-18px;position:absolute}.item{z-index:7;text-align:center}button:focus,button:active{outline:none}.modal{opacity:0;z-index:1;will-change:opacity,transform,filter;background-position:50%;background-size:cover;border-radius:3px;width:40px;height:40px;transition:opacity .25s,box-shadow .25s,filter .25s,transform .25s;position:absolute;overflow:hidden}.modal2{opacity:0;z-index:1;will-change:opacity,transform,filter;background-position:50%;background-size:cover;border-radius:3px;width:65px;height:65px;transition:opacity .25s,box-shadow .25s,filter .25s,transform .25s;position:absolute;overflow:hidden}.tip{width:27px;height:29px;left:calc(50%-100px);z-index:15;pointer-events:all;background-image:url(../img/det.webp);margin-top:-22px;margin-left:-651px;position:absolute;top:30%}#modal_id:hover{opacity:1;background-image:url(../img/tip.webp);width:399px;height:569px;transition:all .3s;transform:perspective(100px)rotateX(0)rotateY(0)rotate(0)scale(1)translate(0,0);box-shadow:0 50px 80px #ffffff26,0 15px 100px #ffffff26,0 5px 100px #fffefe1a}a{color:#666;text-decoration:none}.btn-wrap{z-index:10;cursor:pointer;margin-top:887px;position:absolute}.btn-wrap>a{cursor:pointer;line-height:23px}#modal{z-index:15;width:100%;height:100%;position:fixed;top:0;left:0;transform:scale(0)}#modal .modal-bg{background:#000000b3;height:100%}#modal .modal-bg .modal-cont{max-width:1185px;display:inline-block;position:relative}#modal .modal-bg .modal-cont h2{font-size:30px}#modal .modal-bg .modal-cont p{font-size:18px}#modal .modal-bg .modal-cont .close{background:radial-gradient(circle,#ffffff1a,#0000);border-radius:50%;margin:49px -1px;padding:9px;transition:all .3s;animation:2s ease-in-out infinite glowPulse;position:absolute;top:0;right:0;box-shadow:0 0 20px #ffffff4d}#modal .modal-bg .modal-cont .close:hover{background:radial-gradient(circle,#fff3,#0000);transform:rotate(90deg)scale(1.1);box-shadow:0 0 30px #fff9,0 0 50px #ffd70066,inset 0 0 20px #fff3}#modal .modal-bg .modal-cont .close svg{fill:#fff;vertical-align:top;cursor:pointer;filter:drop-shadow(0 0 5px #fffc);width:24px;transition:all .3s}#modal .modal-bg .modal-cont .close:hover svg{filter:drop-shadow(0 0 10px gold)drop-shadow(0 0 20px #fffc)}@keyframes glowPulse{0%,to{box-shadow:0 0 20px #ffffff4d,0 0 30px #ffd70033}50%{box-shadow:0 0 30px #ffffff80,0 0 50px #ffd70066}}#modal.two{animation:1s cubic-bezier(.165,.85,.44,1) forwards unfoldIn;transform:scaleY(.01)scaleX(0)}#modal.two .modal-bg .modal-cont{margin-top:-67px;animation:.5s cubic-bezier(.165,.85,.44,1) .8s forwards zoomIn;transform:scale(0)}#modal.two.out{animation:1s cubic-bezier(.165,.85,.44,1) forwards unfoldOut;transform:scale(1)}#modal.two.out .modal-bg .modal-cont{animation:.5s cubic-bezier(.165,.85,.44,1) forwards zoomOut;transform:scale(0)}@keyframes unfoldIn{0%{transform:scaleY(.005)scaleX(0)}50%{transform:scaleY(.005)scaleX(1)}to{transform:scaleY(1)scaleX(1)}}@keyframes unfoldOut{0%{transform:scaleY(1)scaleX(1)}50%{transform:scaleY(.005)scaleX(1)}to{transform:scaleY(.005)scaleX(0)}}@keyframes zoomIn{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes zoomOut{0%{transform:scale(1)}to{transform:scale(0)}}.swiper{width:1500px;max-width:100%}.pagination-group-slide .swiper-pagination{flex-wrap:wrap;margin:50px auto;position:static}.pagination-group-slide .swiper-pagination-bullet{opacity:1;background:50% no-repeat;border-radius:0;outline:none;width:146px;height:60px;position:relative}.pagination-group-slide .swiper-pagination-bullet-active:after{content:"";background:url(../img/m_on.webp) 50%/contain no-repeat;width:100%;height:70px;margin:0 auto;display:block;position:absolute;top:-5px;left:0;right:0}.pagination-group-slide .swiper-pagination-bullet:first-child{background-image:url(../img/m1_off.webp)}.pagination-group-slide .swiper-pagination-bullet.swiper-pagination-bullet-active:first-child{background-image:url(../img/m1_on.webp)}.pagination-group-slide .swiper-pagination-bullet:nth-child(2){background-image:url(../img/m2_off.webp)}.pagination-group-slide .swiper-pagination-bullet.swiper-pagination-bullet-active:nth-child(2){background-image:url(../img/m2_on.webp)}.nav-group-slide2 .swiper-button-prev,.nav-group-slide2 .swiper-button-next{background:50%/contain no-repeat;width:24px;height:39px}.nav-group-slide2 .swiper-button-prev{background-image:url(../img/lbtn.webp);left:10px;right:auto}.nav-group-slide2 .swiper-button-next{background-image:url(../img/rbtn.webp);left:auto;right:10px}.nav-group-slide2 .swiper-button-prev:after,.nav-group-slide2 .swiper-button-next:after{display:none}.pagination-group2-slide{display:block}.button{--offset:10px;--border-size:1.8px;appearance:none;color:#facf93;text-transform:uppercase;cursor:pointer;letter-spacing:.25em;box-shadow:inset 0 0 0 var(--border-size)currentcolor;background:#fdc16c;border:0;border-radius:0;outline:none;padding:.5em 4em;font-weight:700;transition:background .3s;display:block;position:relative}a2{letter-spacing:.25em;color:#000;font-weight:600}.button:hover{background:#fdc16c}.button__horizontal,.button__vertical{top:var(--horizontal-offset,0);right:var(--vertical-offset,0);bottom:var(--horizontal-offset,0);left:var(--vertical-offset,0);will-change:transform;transition:transform .5s;position:absolute}.button__horizontal:before,.button__vertical:before{content:"";border:inherit;position:absolute}.button__horizontal{--vertical-offset:calc(var(--offset)*-1);border-top:var(--border-size)solid currentcolor;border-bottom:var(--border-size)solid currentcolor}.button__horizontal:before{top:calc(var(--vertical-offset) - var(--border-size));bottom:calc(var(--vertical-offset) - var(--border-size));left:calc(var(--vertical-offset)*-1);right:calc(var(--vertical-offset)*-1)}.button:hover .button__horizontal{transform:scaleX(0)}.button__vertical{--horizontal-offset:calc(var(--offset)*-1);border-left:var(--border-size)solid currentcolor;border-right:var(--border-size)solid currentcolor}.button__vertical:before{top:calc(var(--horizontal-offset)*-1);bottom:calc(var(--horizontal-offset)*-1);left:calc(var(--horizontal-offset) - var(--border-size));right:calc(var(--horizontal-offset) - var(--border-size))}.button:hover .button__vertical{transform:scaleY(0)}.PC{flex-direction:column;justify-content:center;align-items:center;width:100%;margin-top:100px;display:flex;overflow:visible}.limited,.costume,.character,.skill,.progression,.original{justify-content:center;width:100%;margin-bottom:40px;display:flex;position:relative;overflow:visible}.special{z-index:1000;justify-content:center;width:100%;margin-bottom:40px;display:flex;position:relative;overflow:visible}.limited{z-index:10}.special{z-index:9}.character{z-index:8}.skill{z-index:7}.progression{z-index:6}.original{z-index:5}.limited>img{z-index:-1;position:relative}.special>img{z-index:-2;position:relative}p{color:#fff;justify-content:center;align-items:center;height:80px;font-size:12px;font-weight:700;display:flex}[id^=ul]{justify-content:center;gap:0;width:100%;margin-left:0;padding:0;display:flex;position:absolute;left:0}#ul{margin-top:217px;margin-left:-4px}#ul2{margin-top:422px;margin-left:-4px}#ul3{margin-top:632px;margin-left:-4px}#ul4{margin-top:842px;margin-left:-4px}#ul5{margin-top:230px}#ul6{margin-top:396px}#ul6-1{margin-top:562px}#ul7{margin-top:166px}#ul8{margin-top:332px}#ul9-1{margin-top:166px}#ul9{margin-top:332px}#ul10{margin-top:498px}#ul11{margin-top:664px}#ul12{margin-top:166px}#ul13{margin-top:332px}#ul14{margin-top:166px}#ul15{margin-top:332px}#ul16{margin-top:498px}li{text-align:center;flex-direction:column;align-items:center;width:144px;margin-top:-14px;display:flex}li img{margin:0 auto;display:block}[class^=item]:not(.item,.item97,.item98){object-fit:none;width:74px;height:74px}.item97,.item98{object-fit:none;width:68px;height:68px;margin-left:0}.item1{object-position:-226px -151px}.item2{object-position:-151px -1px}.item3{object-position:-226px -1px}.item4{object-position:-301px -1px}.item5{object-position:-1px -1px}.item6,.item7{object-position:-76px -1px}.item8{object-position:-151px -376px}.item9{object-position:-301px -301px}.item10{object-position:-1px -376px}.item11{object-position:-76px -376px}.item12{object-position:-376px -301px}.item13{object-position:-601px -301px}.item14{object-position:-451px -301px}.item15{object-position:-826px -301px}.item16{object-position:-451px -301px}.item17{object-position:-526px -301px}.item18{object-position:-676px -301px}.item19{object-position:-751px -301px}.item21{object-position:-826px -226px}.item22{object-position:-601px -226px}.item24{object-position:-151px -301px}.item25{object-position:-451px -1px}.item26{object-position:-226px -376px}.item27{object-position:-301px -376px}.item28{object-position:-376px -376px}.item29{object-position:-376px -1px}.item30{object-position:-526px -376px}.item31{object-position:-601px -376px}.item32{object-position:-676px -451px}.item33{object-position:-151px -226px}.item34{object-position:-76px -301px}.item35{object-position:-1px -76px}.item36{object-position:-76px -76px}.item37{object-position:-151px -76px}.item38{object-position:-226px -76px}.item39{object-position:-301px -76px}.item40{object-position:-376px -76px}.item41{object-position:-451px -76px}.item42{object-position:-526px -76px}.item43{object-position:-601px -76px}.item44{object-position:-676px -76px}.item45{object-position:-151px -151px}.item46{object-position:-826px -1px}.item47{object-position:-751px -76px}.item48{object-position:-826px -76px}.item49{object-position:-1px -151px}.item50{object-position:-76px -151px}.item51{object-position:-601px -1px}.item52{object-position:-751px -1px}.item53{object-position:-76px -451px}.item54{object-position:-676px -1px}.item55{object-position:-526px -1px}.item56{object-position:-826px -151px}.item57{object-position:-301px -151px}.item58{object-position:-376px -151px}.item59{object-position:-451px -151px}.item60{object-position:-601px -151px}.item61{object-position:-676px -151px}.item62{object-position:-151px -451px}.item63{object-position:-751px -151px}.item64{object-position:-451px -376px}.item65{object-position:-676px -376px}.item66{object-position:-826px -376px}.item67{object-position:-751px -376px}.item68{object-position:-76px -226px}.item69{object-position:-1px -151px}.item70{object-position:-1px -301px}.item71{object-position:-226px -301px}.item72{object-position:-676px -226px}.item73{object-position:-751px -226px}.item74{object-position:-826px -226px}.item75{object-position:-751px -451px}.item76{object-position:-226px -451px}.item77{object-position:-301px -451px}.item78{object-position:-376px -451px}.item79{object-position:-451px -451px}.item80{object-position:-526px -451px}.item81{object-position:-601px -451px}.item82{object-position:-826px -451px}.item83{object-position:-1px -526px}.item84{object-position:-76px -526px}.item85{object-position:-151px -526px}.item86{object-position:-451px -601px}.item87{object-position:-752px -601px}.item88{object-position:-826px -601px}.item89{object-position:-1px -601px}.item90{object-position:-1px -676px}.item94{object-position:-826px -526px}.item95{object-position:-376px -226px}.item96{object-position:-226px -526px}.item97{object-position:-301px -526px}.item98{object-position:-380px -530px}.item100{object-position:-451px -526px}.item101{object-position:-526px -526px}.item102{object-position:-601px -526px}.item103{object-position:-676px -526px}.item104{object-position:-751px -526px}.item105{object-position:-76px -601px}.item106{object-position:-151px -601px}.item107{object-position:-226px -601px}.item108{object-position:-301px -601px}.item109{object-position:-376px -601px}.item110{object-position:-526px -601px}.item111{object-position:-601px -601px}.item112{object-position:-676px -601px}.item113{object-position:-77px -677px}.scroll{opacity:0;transition:all .8s}.scrollRight{transform:translate(-20vw)}.scrollLeft{transform:translate(20vw)}.scrollUp{transform:translateY(10vw)}.scrollDown{transform:translateY(-10vw)}.scrollAction{opacity:1;transform:translate(0)}#body .scroll{border-radius:50%}html{scroll-behavior:auto}@media screen and (max-width:700px){body,html{width:100%;height:100%;position:relative}.home{float:right;margin-top:20px;margin-right:0}.mobile img{width:100%}.mobile{text-align:center;justify-content:center;width:100%;display:block}header{top:-10px;right:10px}#hide,#wrap,.play,.flipbook-viewport{display:none}.background-container{display:block;transform:translateZ(0)}.PC{display:none}}@media screen and (min-width:701px){.PC{overflow:visible!important}}@media screen and (min-width:1900px){body{overflow-x:hidden}}.nav-group-slide .swiper-button-prev{background:url(../img/lbtn.webp) no-repeat;width:65px;height:104px;margin-top:-5px;left:-120px}.nav-group-slide .swiper-button-prev:after,.nav-group-slide .swiper-button-next:after{display:none}.nav-group-slide .swiper-button-next{background:url(../img/rbtn.webp) no-repeat;width:65px;height:104px;margin-top:-5px;right:-120px}.section2 .swiper-slide img{width:100%;margin:0 auto;display:block}.wrapper{min-width:min(40rem,100%)}:root{--angle:0deg;--gradX:50%;--gradY:50%;--c1:#ffc86480;--c2:#a8efff1a;--d:2s}#behemoth_id:hover{background-image:url(../img/behemothpet.webp)}#ziz_id:hover{background-image:url(../img/ziz.webp)}#leviathan_id:hover{background-image:url(../img/Leviathan.webp)}#grim_id:hover{background-image:url(../img/Grim_reaper.webp)}#soul_id:hover{background-image:url(../img/soul_Reaper.webp)}#popo_id:hover,#popo_id.open{background-image:url(../img/Popolion.webp)}#ziz_id:hover{opacity:1;width:506px;height:408px;margin-top:-10px;margin-left:-50px;transition:all .3s;transform:perspective(100px)rotateX(0)rotateY(0)rotate(0)scale(1)translate(0,0)}#leviathan_id:hover{opacity:1;width:553px;height:406px;margin-top:-10px;margin-left:-40px;transition:all .3s;transform:perspective(100px)rotateX(0)rotateY(0)rotate(0)scale(1)translate(0,0)}#behemoth_id:hover{opacity:1;width:614px;height:375px;margin-top:-10px;margin-left:-100px;transition:all .3s;transform:perspective(100px)rotateX(0)rotateY(0)rotate(0)scale(1)translate(0,0)}#grim_id:hover{opacity:1;width:607px;height:355px;margin-top:-10px;margin-left:-100px;transition:all .3s;transform:perspective(100px)rotateX(0)rotateY(0)rotate(0)scale(1)translate(0,0)}#soul_id:hover{opacity:1;width:549px;height:363px;margin-top:-10px;margin-left:-100px;transition:all .3s;transform:perspective(100px)rotateX(0)rotateY(0)rotate(0)scale(1)translate(0,0)}#popo_id:hover,#popo_id.open{opacity:1;width:514px;height:380px;margin-top:-10px;margin-left:-40px;transition:all .3s;transform:perspective(100px)rotateX(0)rotateY(0)rotate(0)scale(1)translate(0,0)}.popo,.ziz,.behemoth,.leviathan,.soul,.grim{position:relative}.soul{z-index:905}.grim{z-index:904}.leviathan{z-index:903}.ziz{z-index:902}.behemoth{z-index:901}.popo{z-index:900}.soul:hover,.grim:hover,.leviathan:hover,.ziz:hover,.behemoth:hover,.popo:hover{z-index:9999}.box3{border:.2rem solid;border-image:conic-gradient(from var(--angle),#fff8a81a,#2196f3 .1turn,#00bcd4 .15turn,var(--c2).25turn)10;cursor:pointer;width:74px;height:74px;animation:borderRotate var(--border-animation-duration)ease-in-out infinite forwards;margin-top:-3px;position:relative}.box4{border:.2rem solid;border-image:conic-gradient(from var(--angle),#fff8a81a,#ffdea8 .1turn,#ffd27e .15turn,var(--c2).25turn)10;cursor:pointer;width:74px;height:74px;animation:borderRotate var(--border-animation-duration)ease-in-out infinite forwards;position:relative}.box4 img{position:relative}@property --angle{syntax:"<angle>";inherits:true;initial-value:90deg}@keyframes borderRotate{0%{--angle:0deg}to{--angle:360deg}}