*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;overflow-x:hidden}html.locked{overflow:hidden}html.unlocked{scroll-snap-type:y mandatory;overflow-y:scroll}body{color:#fff;background:#000;min-height:100vh;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;overflow-x:hidden}header h1.logo{z-index:999;position:absolute;top:52px;left:50px}.fixedHeader{z-index:999;text-align:right;position:fixed;top:48px;right:50px}.fixedHeader>a{margin-left:10px;transition:transform .2s,opacity .2s;display:inline-block}.fixedHeader>a:hover{opacity:.8;transform:scale(1.05)}.oneday{margin-top:8px}.oneday a{transition:opacity .2s}.oneday a:hover{opacity:.7}body:after{content:"";pointer-events:none;z-index:100;background:radial-gradient(#0000 0% 40%,#0000004d 70%,#000000b3 100%);width:100%;height:100%;position:fixed;top:0;left:0}.section-nav{z-index:200;opacity:0;pointer-events:none;flex-direction:column;gap:15px;transition:opacity .5s;display:flex;position:fixed;top:50%;right:30px;transform:translateY(-50%)}.section-nav.visible{opacity:1;pointer-events:auto}.nav-dot{cursor:pointer;background:#ffffff4d;border:2px solid #0000;border-radius:50%;width:12px;height:12px;transition:all .3s}.nav-dot:hover{background:#ff646480}.nav-dot.active{background:#760800;border-color:#fff0;transform:scale(1.2);box-shadow:0 0 15px #ff646499}.section{scroll-snap-align:start;scroll-snap-stop:always;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.section-content{z-index:10;flex-direction:column;align-items:center;width:100%;max-width:1200px;padding:60px 40px;display:flex}.section-title{letter-spacing:8px;text-transform:uppercase;background:linear-gradient(135deg,#ff6b6b,orange,#ff6b6b) 0 0/200% 200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:10px;font-size:3rem;font-weight:700;animation:3s infinite gradientShift}.section-subtitle{color:#ffffffb3;letter-spacing:2px;margin-bottom:50px;font-size:1.2rem}@keyframes gradientShift{0%,to{background-position:0%}50%{background-position:100%}}.fade-in-element{opacity:0;transition:opacity .8s ease-out,transform .8s ease-out;transform:translateY(40px)}.fade-in-element.visible{opacity:1;transform:translateY(0)}.fade-in-element.delay-1{transition-delay:.2s}.fade-in-element.delay-2{transition-delay:.4s}.fade-in-element.delay-3{transition-delay:.6s}.fade-in-element.delay-4{transition-delay:.8s}.section-main{background:#000}.video-background{object-fit:cover;z-index:0;opacity:0;width:100%;height:100%;transition:opacity 1s ease-in-out;position:absolute;top:0;left:0}.video-background.active{opacity:1}.magic-circle-container{z-index:10;cursor:pointer;mix-blend-mode:screen;width:510px;height:510px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.magic-piece{opacity:0;mix-blend-mode:lighten;filter:brightness(1.2)saturate(1.3);background-image:url(../img/봉인진.webp);background-size:1020px 1020px;width:510px;height:510px;transition:opacity .5s ease-in-out;position:absolute}.magic-piece.visible{opacity:1}.piece-1{background-position:0 0}.piece-2{background-position:-510px 0}.piece-3{background-position:0 -510px}.piece-4{background-position:-510px -510px}.click-hint{color:#ff6464b3;letter-spacing:2px;font-size:14px;transition:opacity .5s ease-in-out;position:absolute;bottom:-50px;left:50%;transform:translate(-50%)}.click-hint.hidden{opacity:0}.magic-circle-container.completed{animation:1.5s ease-in-out forwards fadeOut}@keyframes fadeOut{to{opacity:0;pointer-events:none}}.main-title-container{z-index:5;pointer-events:none;justify-content:center;align-items:center;width:96%;max-width:1080px;transition:opacity .8s ease-out;display:flex;position:absolute;bottom:15%;left:50%;transform:translate(-50%);-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 15% 85%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0%,#000 15% 85%,#0000 100%)}.main-title-container.hidden{opacity:0}.main-flame-overlay{object-fit:cover;pointer-events:none;z-index:1;width:150%;height:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.main-title-img{object-fit:contain;z-index:2;width:100%;height:auto;position:relative}.story-container{z-index:15;opacity:0;pointer-events:none;width:90%;max-width:900px;padding:60px 100px;transition:opacity .5s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.story-container.visible{opacity:1}.story-container:before{content:"";z-index:-1;background:radial-gradient(50% 50%,#000000f2 0%,#000000d9 15%,#000000b3 30%,#00000080 45%,#0000004d 60%,#00000026 75%,#0000000d 90%,#0000 100%);position:absolute;inset:-300px -400px}.story-line{color:#fff;text-align:center;opacity:0;width:100%;font-family:UnifrakturMaguntia,cursive;font-size:26px;font-style:normal;font-weight:400;line-height:1.8;transition:opacity .8s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.story-line.visible{opacity:1}.story-line .highlight{color:#fff;font-weight:700}@keyframes chainDrop{0%,to{transform:translateY(0)}50%{transform:translateY(8px)}}@keyframes chainFade{0%,to{opacity:.4}50%{opacity:1}}.chain-indicator{opacity:0;pointer-events:none;flex-direction:column;align-items:center;transition:opacity .8s;display:flex;position:fixed;bottom:40px;left:50%;transform:translate(-50%)}.chain-indicator.visible{opacity:1;pointer-events:auto}.chain-top-diamond{border:1px solid #fff;width:14px;height:14px;transform:rotate(45deg)}.chain-link{background:#fff;width:1px;height:12px}.chain-small-diamond{border:1px solid #fff;width:8px;height:8px;animation:2s ease-in-out infinite chainFade;transform:rotate(45deg)}.chain-small-diamond:nth-child(4){animation-delay:.2s}.chain-small-diamond:nth-child(6){animation-delay:.4s}.chain-arrow-section{flex-direction:column;align-items:center;margin-top:8px;animation:2s ease-in-out infinite chainDrop;display:flex}.chain-arrow-line{background:linear-gradient(#ffeccb,#d4af704d);width:1px;height:20px}.chain-arrow-head{gap:2px;display:flex}.chain-arrow-head span{background:#fff0d7;width:6px;height:1px}.chain-arrow-head span:first-child{transform:rotate(45deg)translate(2px)}.chain-arrow-head span:last-child{transform:rotate(-45deg)translate(-2px)}.chain-text{letter-spacing:4px;color:#fff;margin-top:15px;font-family:Cinzel,serif;font-size:9px}.section-boss{background:#0a0a0a url(../img/sec2_background.webp) 50%/cover no-repeat;position:relative;overflow:hidden}.flame-overlay{object-fit:cover;z-index:100;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0;will-change:transform;transform:translateZ(0);backface-visibility:hidden}.corner-frame{z-index:5;pointer-events:none;width:120px;height:auto;position:absolute}.corner-tl{top:20px;left:20px}.corner-tr{top:20px;right:20px;transform:scaleX(-1)}.corner-bl{bottom:20px;left:20px;transform:scaleY(-1)}.corner-br{bottom:20px;right:20px;transform:scale(-1)}.boss-layout{z-index:10;align-items:center;gap:0;width:100%;height:100%;padding:40px 280px 40px 0;display:flex}.boss-visual{justify-content:center;align-items:center;width:1372px;height:845px;display:flex;position:absolute;left:-230px}.boss-image{object-fit:contain;filter:drop-shadow(0 0 60px #ff643299);width:100%;height:100%}.boss-content-area{z-index:20;flex-direction:column;gap:40px;width:500px;margin-left:auto;display:flex;position:relative}.boss-title-area{flex-direction:column;align-items:center;gap:20px;display:flex}.boss-title-img{object-fit:contain;width:100%;height:auto}.title-underline{width:100%;height:auto}#accessoryItemName{white-space:pre-line;text-align:center}.accessory-panel{border:1px solid #ffc86426;border-radius:20px;padding:25px;position:relative;overflow:visible}.accessory-panel-bg{z-index:0;pointer-events:none;width:690px;height:auto;position:absolute;top:55%;left:50%;transform:translate(-50%,-50%)}.accessory-panel>:not(.accessory-panel-bg){z-index:1;position:relative}.accessory-info-row{align-items:flex-start;gap:20px;margin-bottom:20px;display:flex}.accessory-item-display{flex-direction:column;align-items:center;gap:12px;min-width:100px;display:flex}.accessory-item-icon{background:#1e1914e6;border:2px solid #ffc86480;border-radius:12px;justify-content:center;align-items:center;width:80px;height:80px;display:flex;overflow:hidden}.accessory-main-icon{object-fit:contain;width:90%;height:90%}.accessory-item-name{color:#fff;text-align:center;max-width:100px;font-family:Noto Serif JP,serif;font-size:13px;font-weight:900;line-height:1.3}.accessory-stats-box{flex:1;justify-content:center;align-items:flex-start;min-height:150px;display:flex;overflow:visible}.accessory-stats-img{object-fit:contain;width:95%;height:100%}.accessory-categories{border-top:1px solid #ffffff1a;gap:30px;padding-top:15px;display:flex}.accessory-category{align-items:center;gap:15px;display:flex}.category-label{color:#ffffff80;letter-spacing:1px;text-transform:uppercase;font-size:11px}.category-icons{gap:10px;display:flex}.accessory-icon-item{cursor:pointer;background:#000c;border:2px solid #ffc8644d;border-radius:50%;width:50px;height:50px;transition:all .3s;overflow:hidden}.accessory-icon-item:hover{border-color:#ffc864b3;transform:scale(1.1);box-shadow:0 0 15px #ffc8644d}.accessory-icon-item.active{border-color:#ffc864e6;box-shadow:0 0 20px #ffc86480}.accessory-icon-img{object-fit:cover;width:100%;height:100%}.section-class{background:#0a0a0a url(../img/sec3_back.webp) 50%/cover no-repeat;position:relative}.smoke-overlay{object-fit:cover;z-index:100;pointer-events:none;mix-blend-mode:screen;opacity:.6;width:100%;height:100%;position:absolute;top:0;left:0}.class-character{z-index:10;justify-content:center;align-items:center;width:65%;height:110%;display:flex;position:absolute;left:-2%;transform:translateY(-50%)}.class-char-img{object-fit:contain;filter:drop-shadow(0 0 40px #6363633f);width:100%;height:100%}.sec3-frame{z-index:5;pointer-events:none;width:auto;height:25%;position:absolute;top:86%;right:20px;transform:translateY(-50%)}.class-content-area{z-index:15;flex-direction:column;align-items:center;gap:50px;display:flex;position:absolute;top:50%;right:400px;transform:translateY(-50%)}.class-title-area{justify-content:center;display:flex}.shine-wrapper{display:inline-block;position:relative}.sec3-title-img{max-width:400px;height:auto;display:block}.shine-overlay{pointer-events:none;background:linear-gradient(90deg,#0000 0%,#ffffff03 15%,#ffffff0a 25%,#ffffff1f 35%,#ffffff47 50%,#ffffff1f 65%,#ffffff0a 75%,#ffffff03 85%,#0000 100%) 0 0/250% 200%;width:100%;height:100%;animation:10s linear infinite metalShine;position:absolute;top:0;left:0;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}@keyframes metalShine{0%{opacity:0;background-position:200% 0}5%{opacity:1}95%{opacity:1}to{opacity:0;background-position:-200% 0}}.play-btn-area{justify-content:center;align-items:center;display:flex}.play-btn-link{cursor:pointer;background:0 0;border:none;outline:none;justify-content:center;align-items:center;padding:0;display:flex;position:relative}.play-effect{object-fit:contain;opacity:0;z-index:1;pointer-events:none;width:600px;height:600px;transition:opacity .3s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.play-btn-link:hover .play-effect{opacity:1}.play-btn-img{z-index:2;width:150px;height:auto;transition:transform .3s;position:relative}.play-btn-link:hover .play-btn-img{transform:scale(1.05)}.video-modal{z-index:10000;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.video-modal.active{display:flex}.video-modal-overlay{cursor:pointer;background:#000000e6;width:100%;height:100%;position:absolute;top:0;left:0}.video-modal-content{z-index:10001;width:90%;max-width:900px;position:relative}.video-modal-close{color:#fff;cursor:pointer;z-index:10002;background:0 0;border:none;font-size:36px;transition:opacity .3s;position:absolute;top:-40px;right:0}.video-modal-close:hover{opacity:.7}.video-modal-wrapper{background:#000;width:100%;padding-bottom:56.25%;position:relative}.video-modal-wrapper iframe{width:100%;height:100%;position:absolute;top:0;left:0}.section-other{background:url(../img/sec4_back.webp) 50%/cover no-repeat;position:relative}.other-bg{z-index:1;background:linear-gradient(#0009 0%,#0000004d 100%);width:100%;height:100%;position:absolute;top:0;left:0}.other-container{z-index:10;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:60px 40px;display:flex;position:relative}.other-heading{text-align:center;letter-spacing:.05em;color:#b19862;text-transform:none;margin-bottom:-128px;font-family:DM Serif Text,serif;font-size:6rem;font-style:italic;font-weight:400}.other-and{margin-bottom:40px}.other-list{justify-content:center;align-items:center;margin:0 0 50px;padding:0;list-style:none;display:flex}.other-list li{margin:0 15px}.other-list li a{text-decoration:none;transition:all .3s;display:block}.other-list li a:hover{transform:translate(-5px,-8px)}.other-list li img{max-width:100%;height:auto;transition:all .3s;display:block}.other-list li a:hover img{box-shadow:0 10px 30px #ffc86433}.other-placeholder{background:linear-gradient(135deg,#1a1a1a,#2a1a1a);border:1px solid #ffffff1a;border-radius:12px;justify-content:center;align-items:center;width:250px;height:150px;transition:all .3s;display:flex}.other-list li a:hover .other-placeholder{border-color:#ffc86466;box-shadow:0 10px 30px #ffc86426}.other-placeholder span{color:#ffffff80;letter-spacing:2px;font-size:14px}.other-btn-wrap{margin-bottom:40px}.detail-btn{text-transform:uppercase;letter-spacing:6px;color:#fff;cursor:pointer;background-color:#0000;background-image:linear-gradient(150deg,#ffe76c33,#ffb3011a);background-position:50%;background-repeat:no-repeat;background-size:calc(100% - 15px) calc(100% - 15px);justify-content:center;width:298px;padding:0 2rem;font-size:1rem;font-weight:900;line-height:4rem;text-decoration:none;transition:transform .1s,box-shadow .3s,background-color .3s linear,background-size .3s ease-in-out .3s,line-height .3s .3s,padding .3s .3s;display:flex;position:relative;box-shadow:0 0 0 1px #ebab161a,inset 0 0 0 1px #ffd8291a}.detail-btn:hover{background-color:#ffbb29;background-size:100% 100%;padding:0 calc(2rem - 10px);line-height:calc(4rem - 15px);transition:transform .1s,background-size .3s ease-in-out,background-color .3s,line-height .3s,padding .3s,box-shadow .3s;box-shadow:0 0 15px 1px #ffbb2966,inset 0 0 0 1px #ffbb29}.detail-btn:active{transform:scale(.95)}.detail-btn:before,.detail-btn:after{content:"";opacity:1;background-color:#ffbb29;border-radius:50%;width:4px;height:4px;animation:2s linear infinite detailBtnCorner;position:absolute;top:0;left:0;transform:translate(-50%)translateY(-50%)scale(1)}.detail-btn:after{animation-duration:2.5s}.detail-btn:hover:before,.detail-btn:hover:after{opacity:0;filter:blur(2px);transition:all .7s;transform:translate(-50%)translateY(-50%)scale(2);box-shadow:0 0 15px 1px #ffbb29}@keyframes detailBtnCorner{0%{top:0;left:0}15%{top:0;left:50%}30%{top:0;left:100%}40%{top:50%;left:100%}50%{top:100%;left:100%}65%{top:100%;left:50%}80%{top:100%;left:0}90%{top:50%;left:0}to{top:0;left:0}}.site-footer{text-align:center;margin-top:50px}.site-footer p{color:#fff6;letter-spacing:1px;font-size:.85rem}@media (max-width:1600px){.boss-layout{transform:scale(min(calc(100vw/768),1));transform-origin:50%;flex-direction:column;justify-content:center;align-items:center;gap:0;padding:40px 15px 20px}.boss-visual{order:2;width:650px;height:auto;margin:-15px 0;position:relative;left:-60px}.boss-image{object-fit:contain;width:100%;height:auto}.boss-content-area{z-index:auto;display:contents}.boss-title-area{order:1;gap:0;width:320px}.boss-title-img{width:100%}.title-underline{order:3;width:220px;margin-top:0}.accessory-panel{border-radius:16px;order:4;width:420px;margin-top:10px;padding:15px}.accessory-panel-bg{width:520px}.accessory-info-row{gap:15px;margin-bottom:15px}.accessory-item-display{gap:8px;min-width:80px}.accessory-item-icon{width:65px;height:65px}.accessory-item-name{max-width:80px;font-size:12px}.accessory-stats-box{min-height:140px}.accessory-stats-img{width:300px}.accessory-categories{justify-content:center;gap:10px;width:100%;padding-top:0}.accessory-category{width:100%}.category-icons{flex-wrap:wrap;justify-content:center;gap:8px;width:100%}.accessory-icon-item{width:40px;height:40px}.corner-frame{width:50px;top:10px}.corner-tl{left:10px}.corner-tr{right:10px}.corner-bl{bottom:10px;left:10px}.corner-br{bottom:10px;right:10px}.section-class{transform:scale(min(calc(100vw/500),1));transform-origin:50%;flex-direction:column;justify-content:center;align-items:center;padding:20px 15px;display:flex}.smoke-overlay{z-index:50}.class-character{z-index:10;order:1;width:450px;height:auto;position:relative;top:0;left:0;transform:none}.class-char-img{object-fit:contain;width:100%;height:auto}.sec3-frame{display:none}.class-content-area{order:2;gap:20px;margin-top:-30px;position:relative;top:auto;right:auto;transform:none}.class-title-area{order:1}.sec3-title-img{max-width:280px}.play-btn-area{order:2}.play-btn-img{width:80px}.play-effect{width:300px;height:300px}}@media (max-width:1024px){.class-character{width:400px}.sec3-title-img{max-width:250px}.play-btn-img{width:70px}.play-effect{width:280px;height:280px}}@media (max-width:1024px) and (orientation:portrait){.main-title-container{bottom:25%}.corner-bl,.corner-br{display:none}}@media (max-width:768px){header h1.logo{display:none}.fixedHeader{top:29px;right:15px}.oneday{display:none}.section-nav{gap:12px;right:15px}.nav-dot{width:10px;height:10px}.section-title{letter-spacing:4px;font-size:2rem}.section-subtitle{margin-bottom:30px;font-size:1rem}.section-content{padding:40px 20px}.magic-circle-container{width:280px;height:280px}.magic-piece{background-size:560px 560px;width:280px;height:280px}.piece-2{background-position:-280px 0}.piece-3{background-position:0 -280px}.piece-4{background-position:-280px -280px}.click-hint{letter-spacing:0;font-size:12px;bottom:-40px}.main-title-container{width:90%;max-width:500px;top:50%;bottom:auto;transform:translate(-50%,-50%)}.main-title-img{width:150%}.story-container{padding:40px 30px}.story-container:before{inset:-100px}.story-line{font-size:16px;line-height:1.8}.chain-indicator{width:100%;bottom:30px;left:0;right:0;transform:scale(.85)}.chain-text{text-align:center;letter-spacing:0;width:100%}body:after{display:none}.section-main:after{content:"";pointer-events:none;z-index:100;background:radial-gradient(#0000 0% 40%,#0000004d 70%,#000000b3 100%);width:100%;height:100%;position:absolute;top:0;left:0}.corner-bl,.corner-br{display:none}.class-character{width:350px}.sec3-title-img{max-width:220px}.play-btn-img{width:65px}.play-effect{width:250px;height:250px}.other-container{padding:40px 20px}.other-heading{margin-bottom:10px;font-size:3rem}.other-and{width:80px;margin-bottom:25px}.other-list{flex-wrap:wrap;gap:15px;margin-bottom:30px}.other-list li{margin:5px}.other-list li img{max-width:150px}.other-placeholder{width:150px;height:100px}.detail-btn{letter-spacing:4px;width:240px;font-size:.85rem}.other-btn-wrap{margin-bottom:30px}.site-footer{margin-top:30px}}@media (max-width:480px){.main-title-container{width:95%;max-width:350px}.story-container{padding:30px 20px}.story-line{font-size:14px;line-height:1.7}.magic-circle-container{width:220px;height:220px}.magic-piece{background-size:440px 440px;width:220px;height:220px}.piece-2{background-position:-220px 0}.piece-3{background-position:0 -220px}.piece-4{background-position:-220px -220px}.click-hint{font-size:10px;bottom:-35px}.accessory-info-row{gap:10px;margin-bottom:12px}.accessory-item-display{gap:6px;min-width:55px}.accessory-item-icon{width:50px;height:50px}.accessory-item-name{max-width:55px;font-size:10px}.accessory-icon-item{width:37px;height:37px}.category-label{min-width:50px;font-size:9px}.corner-frame{width:35px}.class-character{width:300px}.class-content-area{gap:15px}.sec3-title-img{max-width:180px}.play-btn-img{width:55px}.play-effect{width:200px;height:200px}.other-container{padding:30px 15px}.other-heading{letter-spacing:.02em;margin-bottom:5px;font-size:2.5rem}.other-and{width:60px;margin-bottom:20px}.other-list{gap:10px;margin-bottom:25px}.other-list li img{max-width:130px}.other-placeholder{width:130px;height:80px}.other-placeholder span{font-size:11px}.detail-btn{letter-spacing:3px;width:200px;font-size:.75rem;line-height:3.5rem}.detail-btn:hover{line-height:calc(3.5rem - 15px)}}@media (max-width:360px){.magic-circle-container{width:180px;height:180px}.magic-piece{background-size:360px 360px;width:180px;height:180px}.piece-2{background-position:-180px 0}.piece-3{background-position:0 -180px}.piece-4{background-position:-180px -180px}.class-character{width:260px}.sec3-title-img{max-width:150px}.play-btn-img{width:45px}.play-effect{width:180px;height:180px}.other-heading{font-size:2rem}.other-and{width:50px;margin-bottom:15px}.other-list li img{max-width:110px}.other-placeholder{width:110px;height:70px}.other-placeholder span{font-size:10px}.detail-btn{letter-spacing:2px;width:180px;font-size:.7rem;line-height:3rem}.detail-btn:hover{line-height:calc(3rem - 10px)}}