@charset "UTF-8";
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
html{font-size:100%;}
main{padding-top:3%;}
body{background-color:#ececec;color:#353535;font-family:'Noto+Sans+JP','Montserrat:ital';font-weight:400;}
img{max-width:100%;vertical-align:bottom;}
li{list-style:none;}
a{color:#0c0909;text-decoration:none;transition:all 0.3s ease;}
a:hover{opacity:0.7;}
h2{font-size: 20px;}

.section-title{justify-content:flex-start;font-size:clamp(14px,3.5vw,24px);letter-spacing:0.1em;display:flex;align-items:center;gap:2%;margin-bottom:3%;opacity:0;transform:translateX(-50px);transition:opacity 0.8s ease,transform 0.8s ease;}
.section-title.is-active{opacity:1;transform:translateX(0);}
.section-title::after{content:"";width:90px;height:1px;background:#000;margin-left:1%;opacity:0;transform:translateX(-20px);transition:opacity 0.8s ease 0.2s,transform 0.8s ease 0.2s;}
.section-title.is-active::after{opacity:1;transform:translateX(0);}


#loader{position:fixed;inset:0;background:#fff;display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity 0.4s ease,visibility 0.4s ease;}
#loader.is-hidden{opacity:0;visibility:hidden;}
.loader-percent{font-size:28px;font-weight:500;letter-spacing:0.08em;color:#121212;}

#header{width:100%;height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 50px;top:0;left:0;z-index:10;}
#header .logo{width:100%;max-width:320px;line-height:0;}
#header .logo a{display:block;text-decoration:none;color:#353535;font-weight:700;letter-spacing:.1em;font-size: clamp(16px,5vw,32px);line-height: 0%;}
#header .navi .menu{display:flex;align-items:center;font-size:18px;font-weight:600;color:#353535;letter-spacing:.1em;}
#header .navi .menu li{margin-left:30px;}
#header .navi .menu li a{display:inline-block;position:relative;overflow:hidden;text-decoration:none;color:inherit;height:2.2em;line-height:1.1;padding:0 12px;white-space:nowrap;}
#header .navi .menu li a span{display:block;text-align:center;transition:transform 0.6s;}
#header .navi .menu li a span:first-child{transform:translateY(0);}
#header .navi .menu li a span:last-child{position:absolute;top:0;left:0;width:100%;transform:translateY(2.2em);}
#header .navi .menu li a:hover span:first-child{transform:translateY(-2.2em);}
#header .navi .menu li a:hover span:last-child{transform:translateY(0);}
#header .navi .menu .menu-contact a{color:#8CA61A;font-weight:700;}
#header .mask{display: none}
.hamburger{display:none;width:30px;height:22px;flex-direction:column;justify-content:space-between;cursor:pointer}
.hamburger span{display:block;height:2px;background:#fff;width:100%}
.hamburger.is-show{display:block;}


@media screen and (max-width:767px){
#header .navi{width:80%;height:100vh;background-color:#1f1f1f;position:fixed;top:0;left:-120%;z-index:20;transition:all 0.6s;}
#header .navi.active{left:0;}
#header .navi .menu{width:100%;height:100vh;flex-direction:column;padding:6% 0;overflow:auto;}
#header .navi .menu li{width:100%;border-top:solid 1px #fff;margin-left:0;}
#header .navi .menu li a{height:auto;min-width:0;color:#fff;font-weight:300;letter-spacing:0.1em;display:block;width:100%;padding:2%;}
#header .logo{max-width:80px;margin-top:0;}
#header .hamburger{width:50px;height:50px;cursor:pointer;position:fixed;top:5px;right:10px;z-index:30;}
#header .hamburger span{width:30px;height:1px;background-color:#1f1f1f;display:inline-block;position:absolute;left:10px;transition:all 0.4s;}
#header .hamburger.active span{background-color:#ffffff;}
#header .hamburger span:nth-of-type(1){top:16px;}
#header .hamburger span:nth-of-type(2){top:25px;}
#header .hamburger span:nth-of-type(3){top:34px;}
#header .hamburger.active span:nth-of-type(1){top:24px;transform:rotate(-45deg);}
#header .hamburger.active span:nth-of-type(2){opacity:0;}
#header .hamburger.active span:nth-of-type(3){top:24px;transform:rotate(45deg);}
#header .mask.active{width:100%;height:100%;background:#000;display:block;opacity:0.8;position:fixed;top:0;left:0;}
#header .navi .menu li a .txt-en{display:none;}
#header .navi .menu li a .txt-jp{position:static;opacity:1;transform:none;display:block;}
}
@media screen and (max-width:767px){
.hamburger{display:block;position:fixed;top:4%;right:5%;width:32px;height:24px;z-index:30;cursor:pointer;}
.hamburger span{position:absolute;left:0;width:100%;height:2px;background:#333;transition:0.3s;}
.hamburger span:nth-child(1){top:0;}
.hamburger span:nth-child(2){top:11px;}
.hamburger span:nth-child(3){bottom:0;}
.navi{position:fixed;top:0;right:-100%;width:80%;height:100vh;background:#fff;z-index:20;transition:0.3s;padding:20% 8%;}
.navi .menu{display:block;}
.navi .menu li{margin-bottom:8%;}
.navi.active{right:0;}
.mask{display:none;}
.mask.active{display:block;position:fixed;top:0;left:0;width:100%;height:100vh;background:rgba(0,0,0,0.4);z-index:10;}
.hamburger.active span:nth-child(1){top:11px;transform:rotate(45deg);}
.hamburger.active span:nth-child(2){opacity:0;}
.hamburger.active span:nth-child(3){bottom:11px;transform:rotate(-45deg);}
}
.wrapper{max-width:1200px;margin:0 auto;}

.btn {width:100%;max-width:200px;background-color:#fff;display:block;border:solid 1px #1f1f1f;font-size:14px;padding:1% 0;text-align:center;position:relative;z-index:10;margin:0 auto;}
.btn::before{content:"";width:100%;height:100%;position:absolute;top:0;left:0;z-index:-10;background-color:#1f1f1f;transform-origin:100% 50%;transform:scaleX(0);transition:transform ease 0.3s;}
.btn:hover{color:#fff;opacity:1;}
.btn:hover::before{transform-origin:0% 50%;transform:scaleX(1);}
.btn a{color:#1f1f1f;position:relative;z-index:20;}
.btn:hover a{color:#fff;}

.fadein{opacity:0;transform:translateY(30px);transition:1s;}
.fadein.show{opacity:1;transform:translateY(0);}

@media screen and (max-width:767px){
.section-title{display:flex;margin-bottom:3.2%;font-size:clamp(18px,3vw,24px);}
.section-title::after{width:50px;margin-top:0.8%;margin-left:0.4%;}
}

#footer{border-top:solid 1px #1f1f1f;padding:4% 0 2%;}
#footer .footer-menu{display:flex;align-items:center;justify-content:center;}
#footer .footer-menu li{font-size:14px;position:relative;padding-right:3%;}
#footer .footer-menu li:first-child{margin-left:0;}

#footer .copyright{font-size:10px;text-align:center;margin-top:2%;}

#cursor{position:fixed;left:0;top:0;width:14px;height:14px;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);z-index:9999;opacity:0;transition:transform .12s ease,opacity .2s ease,background-color .2s ease,border-color .2s ease;border:2px solid transparent;background:transparent;}
#cursor.is-show{opacity:1;}
#cursor.is-menu{width:50px;height:50px;background:rgba(255,106,0,0.15);}
#header .navi a{cursor:none;}

#fixed-btn{position:fixed;bottom:2%;right:2%;z-index:10;display:none;}
#fixed-btn img{width:50px;height:auto;display:block;}
h3{font-size: clamp(14px,4vw,20px)}