#l_animation{position:relative;z-index:1000;pointer-events:none}
#l_animation .pageLoad{display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;z-index:100;width:100%;height:100vh;background:var(--blue900);color:var(--white900);font-size:3rem}
#l_animation .pageLoad .logo{filter:blur(10rem);will-change:filter;opacity:0;width:28.2rem}
#l_animation .pageShift{position:fixed;top:0;left:0;z-index:100;width:100%;height:100vh;pointer-events:auto;transform:scaleY(0);transform-origin:bottom center;background:#ffffa2}
#l_container{position:relative;z-index:100;overflow:clip}
#l_container section{position:relative;z-index:10}
#l_footer{position:relative;z-index:100;background:url(/asset/img/footer_bg.webp) no-repeat center;background-size:cover;padding:95rem 0 10rem}
#l_footer.is-hide{display:none}
#l_footer p.copy{text-align:center}
#l_header{position:relative;top:0;left:0;z-index:300;letter-spacing:var(--ls700)}
#l_header.is-hide{opacity:0;visibility:hidden}
#l_header.is-fixed .logo{top:5rem}
#l_header.is-fixed .gnav{top:5rem;opacity:0;visibility:hidden}
#l_header.is-fixed button.drawerBtn{opacity:1;visibility:visible}
#l_header.is-fixed button.drawerBtn.is-open i{left:2rem;width:3rem}
#l_header.is-fixed button.drawerBtn.is-open i:nth-child(1){top:3.5rem;transform:rotate(45deg)}
#l_header.is-fixed button.drawerBtn.is-open i:nth-child(2){top:3.5rem;transform:rotate(-45deg)}
#l_header.is-fixed .drawer.is-open{opacity:1;visibility:visible}
#l_header .logo{position:fixed;top:10rem;left:10rem;z-index:20;transition:top .8s var(--easeOutQuart)}
#l_header .logo a{display:inline-block}
#l_header .logo a img{width:28.2rem}
#l_header .gnav{position:fixed;top:10rem;right:10rem;z-index:10;font-family:var(--en);transition:top .8s var(--easeOutQuart),opacity .3s,visibility .3s}
#l_header .gnav ul li+li{margin-top:2rem}
#l_header .gnav ul li a{display:inline-block;font-size:15px}
#l_header .drawer{position:fixed;top:0;right:4rem;z-index:10;transition:opacity .5s,visibility .5s;background:rgba(13,53,77,.8);padding:14rem 4rem 4rem;opacity:0;visibility:hidden;font-family:var(--en);font-size:15px}
#l_header .drawer ul li+li{margin-top:1.5rem}
#l_header .drawer ul li a{display:inline-block}
#l_header button.drawerBtn{position:fixed;top:3.7rem;right:10rem;z-index:20;width:7rem;height:7rem;cursor:pointer;transition:top .8s var(--easeOutQuart),opacity .3s,visibility .3s;opacity:0;visibility:hidden}
#l_header button.drawerBtn:before{content:'';position:absolute;margin:auto;top:0;left:0;z-index:1;width:100%;height:100%;border-radius:10rem;background:var(--white100);transition:transform .8s var(--easeOutQuart);transform:scale(0)}
#l_header button.drawerBtn:hover:before{transform:scale(1)}
#l_header button.drawerBtn:hover i{background:var(--black900)}
#l_header button.drawerBtn:hover i:nth-child(1){top:3rem}
#l_header button.drawerBtn:hover i:nth-child(2){top:4rem}
#l_header button.drawerBtn i{position:absolute;left:3rem;z-index:10;width:1rem;height:1px;background:var(--white100);transition:background .3s,top .3s var(--easeOutQuart),transform .8s var(--easeOutQuart)}
#l_header button.drawerBtn i:nth-child(1){top:2.5rem}
#l_header button.drawerBtn i:nth-child(2){top:4.5rem}
#l_modal{display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;width:100%;height:100vh;z-index:500;background:rgba(13,53,77,.8);cursor:pointer;padding:0 5rem;transition:opacity .3s;opacity:0;pointer-events:none}
#l_modal.is-show{opacity:1;pointer-events:auto}
#l_modal .close{transition:opacity .3s;cursor:pointer;position:absolute;top:0;right:0;z-index:10;width:8rem;height:8rem;cursor:pointer}
#l_modal .close:hover{opacity:var(--opacity500)}
#l_modal .close i{position:absolute;top:4rem;left:1.5rem;width:5rem;height:1px;background:var(--white100);transform:rotate(45deg)}
#l_modal .close i:last-child{transform:rotate(-45deg)}
#l_modal .wrapper{max-width:100rem;max-height:80vh}
#l_modal .wrapper .panel{display:none;cursor:auto;max-width:100rem;max-height:80vh}
#l_modal .wrapper .panel.is-show{display:block}
#l_modal .wrapper .panel.floor img{max-width:100rem;max-height:80vh}
@media screen and (max-width:1615px){
#l_header .logo a img{width:16.4rem}
}
@media screen and (max-width:767px){
#l_animation .pageLoad .logo{width:40rem}
#l_footer{padding:50rem 0 7rem;font-size:1.6rem}
#l_header.is-fixed button.drawerBtn{top:3.7rem}
#l_header .logo{left:7rem}
#l_header .logo a img{width:26rem}
#l_header .gnav{display:none}
#l_header .drawer{right:0;width:100%;height:100vh;padding:29rem 7rem 7rem;font-size:3rem;overflow-y:scroll}
#l_header .drawer.is-open{opacity:1;visibility:visible}
#l_header .drawer ul li+li{margin-top:5rem}
#l_header button.drawerBtn{top:9rem;right:5rem;opacity:1;visibility:visible}
#l_header button.drawerBtn.is-open i{left:2rem;width:3rem}
#l_header button.drawerBtn.is-open i:nth-child(1){top:3.5rem;transform:rotate(45deg)}
#l_header button.drawerBtn.is-open i:nth-child(2){top:3.5rem;transform:rotate(-45deg)}
}
/*# sourceMappingURL=layout.css.map */