header{
position:fixed;
width:100%;
height:100px;
background-color:transparent;
display:flex;
justify-content:space-between
background-image:url(../img/bg-navi.webp);
}

.vertical-menu{writing-mode:vertical-rl;text-align:left;text-orientation:upright;padding:0;margin-top:20px;height:200px;font-size:30px;z-index:1}.vertical-menu ul{list-style:none;padding:0}.vertical-menu ul li{margin-left:30px}.vertical-menu ul li a{color:#fff;font-family:"Yuji Syuku",serif}.vertical-menu ul li a{color:#fff;font-family:"Yuji Syuku",serif;position:relative}.vertical-menu ul li a::after{position:absolute;right:0;top:0;content:'';width:2px;height:100%;background:#fff;transform:scale(0,1);transform-origin:center top;transition:transform 0.3s;display:inline-block}.vertical-menu ul li a:hover::after{transform:scale(1,1)}a{text-decoration:none}header .logo{margin-top:20px;height:10px;z-index:1;position:absolute;right:5%}
header .logo img{width:150px}.l-header__mainimage:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background-color:rgba(64,64,64,.485)}hr{height:1px;border:0;border-top:1px solid #fff}address{font-style:normal}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-bottom:1.5rem}.footer{position:relative;padding:2rem 7rem;font-size:15px;color:#fff;background:transparent;top:0;left:0}.footer:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(64,64,64,.485)}.footer.about{background-image:url(../img/bg-about.webp)}.footer.feature{background-image:url(../img/bg-feature.webp)}.footer.message{background-image:url(../img/bg-message.webp)}.footer.service{background-image:url(../img/bg-service.webp)}.footer.contact{background-image:url(../img/bg-contact.webp)}.footer__navi-heading{font-weight:700;font-size:clamp(17px,1.8vw,19px)}.footer__navi li{margin-bottom:.75rem}.footer__address{margin-bottom:2rem}.footer__address a{text-decoration:underline}.footer a{color:#fff}@media (min-width:768px){.md-justify-between{justify-content:space-between}.grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:10px;text-align:center}.footer__address a{text-decoration:none;pointer-events:none}}@media (min-width:1024px){.lg-flex{display:flex}}.lg-flex{position:relative;z-index:2}.copyright{position:relative}.footer hr{position:relative}.footer .footer__address .comp-name{font-size:2.6rem;font-weight:700}@media (max-width:768px){.is-sp-768{display:block!important}.is-pc-768{display:none!important}.menu{display:flex!important}
header .logo{position:absolute;right:5%}header .logo img{width:120px}}.is-sp-768{display:none}.is-pc-768{display:block}.menu{position:fixed;top:20px;left:20px;align-items:center;justify-content:center;flex-direction:column;width:50px;height:50px;background-color:#fff;border-radius:50%;transition:transform 250ms ease;cursor:pointer;z-index:200}.menu span{position:relative;display:block;width:50%;height:2px;background-color:#444;float:left;transform-origin:center center;transition:transform 250ms ease;z-index:200}.menu span:nth-of-type(1){transform:translateY(-5px)}.menu span:nth-of-type(3){transform:translateY(5px)}#menu{display:none}#menu:checked~.menu{background-color:transparent;transform:rotate(360deg);transition:transform 250ms ease}#menu:checked~.menu span{background-color:#fff;transition:transform 250ms ease}#menu:checked~.menu span:nth-of-type(1){transform:translateY(1px) rotate(45deg)}#menu:checked~.menu span:nth-of-type(2){display:none}#menu:checked~.menu span:nth-of-type(3){transform:translateY(-1px) rotate(-45deg)}#menu:checked~.nav{left:0;transition:left 500ms ease}#menu:checked~main{transform:translateX(250px);transition:transform 500ms ease}
.nav{position:fixed;top:0;left:-300px;width:300px;height:100vh;margin:0;padding:0;background-image:url(../img/bg-nav.webp);transition:left 500ms ease;z-index:10}.nav:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;background-color:rgba(64,64,64,.485)}.nav ul{position:relative;list-style-type:none;margin:100px 0;padding:0}.nav ul li{position:relative;display:block;border-bottom:5px solid rgba(255,255,255,1)}.nav ul li a{position:relative;display:block;margin:0;padding:15px 20px;color:#fff;font-size:14px;font-weight:700;text-decoration:none;text-transform:uppercase}.nav ul li a:before{position:absolute;content:'';top:0;left:0;width:0;height:100%;transition:width 250ms ease;z-index:-1}.nav ul li a:hover{color:#444}.nav ul li a:hover:before{width:100%;height:100%;background-color:rgba(255,255,255,1);transition:width 250ms ease}