:root{
  --bg:#ebebeb;
  --black:#000;
  --ink:#141414;
  --amber:#f5a623;
  --amber-deep:#e08a00;
  --foam:#fffaf0;
  --c-about:#2d85fc;
  --c-biz:#ff9238;
  --c-news:#8756c3;
  --c-contact:#e50353;
  --en:"Roboto",sans-serif;
  --cond:"Roboto Condensed",sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:"Noto Sans JP",sans-serif;color:var(--black);background:var(--bg);line-height:1.75;font-feature-settings:"palt";overflow-x:hidden}
body.is-loading{overflow:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
ul,ol{list-style:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
.fw500{font-weight:500}.fw700{font-weight:700}.fw900{font-weight:900}
.sp{display:none}
@media (max-width:768px){.pc{display:none}.sp{display:inline}}
.inner{position:relative;width:min(1200px,100% - 80px);margin-inline:auto}
@media (max-width:768px){.inner{width:calc(100% - 40px)}}
.container{position:relative;overflow:hidden}

/* ============ Opening ============ */
.opening{position:fixed;inset:0;z-index:1000;background:var(--ink);display:grid;place-items:center;transition:clip-path .8s cubic-bezier(.77,0,.18,1) 2.4s,visibility 0s 3.3s;clip-path:inset(0 0 0 0)}
.opening.is-done{clip-path:inset(0 0 100% 0);visibility:hidden}
.opening__glass{width:90px;height:130px;position:relative;border:4px solid #fff;border-top:none;border-radius:0 0 12px 12px;overflow:hidden}
.opening__beer{position:absolute;left:0;right:0;bottom:0;height:0;background:linear-gradient(var(--amber),var(--amber-deep));animation:fill 1.4s cubic-bezier(.6,0,.3,1) .3s forwards}
.opening__beer::before{content:"";position:absolute;left:-10%;right:-10%;top:-16px;height:22px;background:var(--foam);border-radius:50%;box-shadow:12px 4px 0 var(--foam),-14px 6px 0 var(--foam)}
.opening__text{position:absolute;bottom:18%;left:0;right:0;text-align:center;color:#fff;font-family:var(--en);font-weight:900;font-size:14px;letter-spacing:.3em;opacity:0;animation:show .6s 1.4s forwards}
@keyframes fill{to{height:78%}}
@keyframes show{to{opacity:1}}

/* ============ Parallax words background ============ */
.parallax_bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.parallax_bg_track{will-change:transform}
.pbg_tile{padding:0 2vw}
.pbg_row{display:flex;align-items:flex-end;gap:0 2.4vw;white-space:nowrap;font-weight:900;line-height:1.08;letter-spacing:.01em;color:#f6f6f6;text-shadow:1px 2px 3px rgba(0,0,0,.07)}
.pbg_row span{display:block}
.main,.footer{position:relative;z-index:1}

/* ============ Header ============ */
.header{position:fixed;top:0;left:0;right:0;z-index:200;pointer-events:none}
.header_inner{display:flex;justify-content:space-between;align-items:flex-start}
.header_logo{pointer-events:auto;padding:22px 0 0 24px;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .4s}
.header_logo.is-hide{transform:translateY(-140%);opacity:0;pointer-events:none}
.logo{display:inline-block;line-height:0}
.logo img{height:34px;width:auto}
.header_btns{display:flex;pointer-events:auto}
.header_contact{width:124px;height:80px;display:grid;place-items:center;background:var(--c-contact);color:#fff;font-size:13px;font-weight:700;transition:filter .3s}
.header_contact:hover{filter:brightness(1.12)}
.hamburger{width:80px;height:80px;background:var(--black);position:relative;z-index:310}
.hamburger span{position:absolute;left:22px;right:22px;height:3px;background:#fff;transition:transform .4s,opacity .3s,top .4s}
.hamburger span:nth-child(1){top:27px}.hamburger span:nth-child(2){top:38px}.hamburger span:nth-child(3){top:49px}
.hamburger.is-open span:nth-child(1){top:38px;transform:rotate(45deg)}
.hamburger.is-open span:nth-child(2){opacity:0}
.hamburger.is-open span:nth-child(3){top:38px;transform:rotate(-45deg)}
@media (max-width:768px){
  .header_logo{padding:16px 0 0 16px}
  .logo img{height:24px}
  .header_contact{width:88px;height:60px;font-size:11px}
  .hamburger{width:60px;height:60px}
  .hamburger span{left:16px;right:16px}
  .hamburger span:nth-child(1){top:20px}.hamburger span:nth-child(2){top:28.5px}.hamburger span:nth-child(3){top:37px}
  .hamburger.is-open span:nth-child(1),.hamburger.is-open span:nth-child(3){top:28.5px}
}
.header_side,.header_sns,.header_gauge{display:none}
.header_contact_icon{display:none}
@media (max-width:768px){.header_contact{order:-1}}

/* PC：右端に縦いっぱいのサイドバー */
@media (min-width:769px){
  .container{padding-right:88px}
  .header_btns{position:fixed;top:0;right:0;bottom:0;width:88px;flex-direction:column;align-items:stretch;background:var(--black);z-index:320}
  .hamburger{width:88px;height:88px;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.14)}
  .hamburger span{left:28px;right:28px;height:2px}
  .hamburger span:nth-child(1){top:35px}.hamburger span:nth-child(2){top:43px}.hamburger span:nth-child(3){top:51px}
  .hamburger.is-open span:nth-child(1),.hamburger.is-open span:nth-child(3){top:43px}
  .header_side{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:34px;padding:24px 0}
  .header_side a{writing-mode:vertical-rl;display:flex;align-items:center;gap:12px;font-family:var(--en);font-weight:700;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5);transition:color .3s}
  .header_side a::before{content:"";width:8px;height:12px;background:var(--c);transform:scaleY(0);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  .header_side a:hover,.header_side a.is-current{color:#fff}
  .header_side a:hover::before,.header_side a.is-current::before{transform:none}
  .header_sns{display:flex;flex-direction:column;align-items:center;gap:18px;padding:22px 0 26px;border-top:1px solid rgba(255,255,255,.14)}
  .header_sns a{opacity:.6;transition:opacity .3s}
  .header_sns a:hover{opacity:1}
  .header_sns svg{width:18px;height:18px;fill:#fff}
  .header_contact{width:88px;height:88px;flex-shrink:0}
  .header_contact_icon{display:block;width:28px;height:28px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linejoin:round;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
  .header_contact:hover .header_contact_icon{transform:translateY(-3px) rotate(-8deg)}
  .header_contact_txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .header_gauge{display:block;position:absolute;left:0;top:88px;bottom:0;width:3px;background:rgba(255,255,255,.08);pointer-events:none}
  .header_gauge span{position:absolute;inset:0;background:linear-gradient(var(--foam) 0 6px,var(--amber) 6px,var(--amber-deep));transform-origin:bottom;transform:scaleY(0)}
}

/* Navigation overlay */
/* ============ Common parts ============ */
/* セクションラベル：01 ── ABOUT US */
body{counter-reset:sec}
.sec_label{counter-increment:sec;position:relative;width:min(1200px,100% - 80px);margin:0 auto 56px;display:flex;align-items:center;gap:18px;font-family:var(--en);font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.sec_label::before{content:counter(sec,decimal-leading-zero);order:-2;font-size:64px;font-weight:900;font-style:italic;letter-spacing:-.02em;line-height:1;color:var(--black)}
.sec_label::after{content:"";order:-1;width:56px;height:3px;background:var(--c)}
@media (max-width:768px){.sec_label{width:calc(100% - 40px);margin-bottom:36px;gap:14px}.sec_label::before{font-size:46px}.sec_label::after{width:36px}}

/* 見出し：文字の下にビールが注がれる */
.mark{padding:0 .08em;-webkit-box-decoration-break:clone;box-decoration-break:clone;
  background-image:linear-gradient(var(--foam),var(--foam)),linear-gradient(180deg,#f9bb40,var(--amber));
  background-repeat:no-repeat;background-size:100% 0,100% 0;
  background-position:0 calc(100% - .08em),0 calc(100% - .08em);
  transition:background-size 1s cubic-bezier(.3,.75,.25,1),background-position 1s cubic-bezier(.3,.75,.25,1)}
.is_show .mark{background-size:100% .1em,100% .36em;background-position:0 calc(100% - .44em),0 calc(100% - .08em)}
.mark+br+.mark{transition-delay:.25s}
.ttl{font-weight:900;line-height:1.55;letter-spacing:.02em}

/* 黒帯タイトル */
.band{display:inline-block;position:relative;color:#fff;font-weight:900;font-style:italic;padding:.06em .32em .1em .22em;line-height:1.25}
.band::before{content:"";position:absolute;inset:0;background:var(--black);transform:skewX(-12deg) scaleX(0);transform-origin:left center;transition:transform .5s cubic-bezier(.77,0,.18,1)}
.band .h{display:inline-block;overflow:hidden;vertical-align:bottom;position:relative}
.band .h>span{display:inline-block;transform:translateY(110%);transition:transform .6s cubic-bezier(.2,.8,.2,1) .4s}
.is_show .band::before,.is_show.band::before{transform:skewX(-12deg) scaleX(1)}
.is_show .band .h>span,.is_show.band .h>span{transform:none}
.band+br+.band{margin-top:.12em}

/* ピル型ボタン：ホバー・タップでビールが注がれる */
.btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:space-between;gap:20px;min-width:300px;padding:19px 26px 19px 32px;border:2px solid var(--black);border-radius:100px;background:#fff;color:var(--black);font-weight:700;font-size:16px;line-height:1.4;letter-spacing:.02em;-webkit-tap-highlight-color:transparent}
.btn svg{width:18px;height:18px;flex-shrink:0;stroke:currentColor;stroke-width:2.6;fill:none;transition:transform .4s}
.btn_beer{position:absolute;top:0;left:0;right:0;bottom:-24px;z-index:-1;background:linear-gradient(180deg,#f9bb40 0%,var(--amber) 40%,var(--amber-deep) 100%);transform:translateY(110%);transition:transform .9s cubic-bezier(.3,.75,.25,1) .12s}
.btn_beer::before{content:"";position:absolute;left:0;right:0;top:-9px;height:18px;
  background:radial-gradient(circle at 10px 9px,var(--foam) 8px,transparent 8.5px) 0 0/20px 18px repeat-x,linear-gradient(var(--foam),var(--foam)) 0 9px/100% 9px no-repeat;
  animation:foam 1.4s linear infinite paused}
.btn_beer::after{content:"";position:absolute;left:0;right:0;top:16px;height:200%;
  background:
    radial-gradient(circle at 14px 40px,rgba(255,255,255,.7) 1.6px,transparent 2.2px),
    radial-gradient(circle at 53px 12px,rgba(255,255,255,.55) 1.1px,transparent 1.6px),
    radial-gradient(circle at 88px 47px,rgba(255,255,255,.65) 2px,transparent 2.6px),
    radial-gradient(circle at 121px 25px,rgba(255,255,255,.5) 1px,transparent 1.5px),
    radial-gradient(circle at 37px 58px,rgba(255,255,255,.45) .9px,transparent 1.4px),
    radial-gradient(circle at 104px 4px,rgba(255,255,255,.6) 1.3px,transparent 1.8px);
  background-size:139px 64px;animation:bubbles 2.4s linear infinite paused}
.btn::after{content:"";position:absolute;left:50%;top:0;z-index:-1;width:5px;height:0;margin-left:-2.5px;border-radius:0 0 3px 3px;background:var(--amber);opacity:0}
.btn:hover .btn_beer,a:hover .btn .btn_beer,.btn.is-pour .btn_beer,a.is-pour .btn .btn_beer{transform:translateY(12px)}
.btn:hover .btn_beer::before,.btn:hover .btn_beer::after,a:hover .btn .btn_beer::before,a:hover .btn .btn_beer::after,.is-pour .btn_beer::before,.is-pour .btn_beer::after{animation-play-state:running}
.btn:hover::after,a:hover .btn::after,.btn.is-pour::after,a.is-pour .btn::after{animation:pour .9s ease-out}
.btn:hover svg,a:hover .btn svg{transform:translateX(4px)}
@keyframes pour{0%{height:0;opacity:1}35%{height:100%;opacity:1}100%{height:100%;opacity:0}}
@keyframes foam{to{background-position:20px 0,0 9px}}
@keyframes bubbles{to{transform:translateY(-64px)}}
.btn--s{min-width:210px;padding:13px 20px 13px 24px;font-size:14px}
.btn--light{border-color:#fff}
@media (max-width:768px){.btn{min-width:0;width:100%;max-width:340px;font-size:15px;padding:17px 22px 17px 26px}.btn--s{width:auto;font-size:14px;padding:12px 18px 12px 22px}}

.js_reveal.fade{opacity:0;transform:translateY(40px);transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1)}
.js_reveal.fade.is_show{opacity:1;transform:none}

/* ============ KV ============ */
.kv{position:relative;padding:110px 0 120px}
.kv_main{position:relative;width:min(1380px,100% - 60px);margin:0 auto;display:grid;grid-template-columns:auto 1fr;align-items:start}
.kv_word{font-family:var(--en);font-weight:900;font-style:italic;font-size:min(25vw,370px);line-height:.8;letter-spacing:-.055em;padding:.05em .1em .07em .02em;
  background:url(../img/kv.jpg) 30% 50%/125% auto no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;
  clip-path:inset(0 100% 0 0);transition:clip-path 1.2s cubic-bezier(.77,0,.18,1);animation:kvpan 16s ease-in-out infinite alternate}
@keyframes kvpan{to{background-position:75% 40%;background-size:150% auto}}
.is-ready .kv_word{clip-path:inset(-10% -10% -10% -10%)}
.kv_copy{margin-left:-2.5vw;padding-top:.6vw;position:relative;z-index:1}
.kv_ttl{font-weight:900;font-style:italic;font-size:min(10.6vw,156px);line-height:1.12;letter-spacing:-.02em;white-space:nowrap}
.kv_ttl .h{display:block;overflow:hidden;padding-right:.1em}
.kv_ttl .h>span{display:inline-block;transform:translateY(105%);transition:transform 1s cubic-bezier(.2,.8,.2,1) .5s}
.kv_ttl .h:nth-child(2)>span{transition-delay:.65s}
.is-ready .kv_ttl .h>span{transform:none}
.kv_txt{margin:1.6vw 0 0 -2vw;font-weight:900;font-style:italic;font-size:min(2.6vw,38px);line-height:1.5;letter-spacing:-.01em;opacity:0;transition:opacity 1s 1.1s}
.is-ready .kv_txt{opacity:1}
.kv_bottom{position:relative;display:flex;align-items:center;gap:20px;margin-top:2.6vw}
.kv_obi{font-size:min(2vw,28px);line-height:1.85;padding:.35em 1.4em .4em 1.1em}
.kv_obi::before{left:-40px}
.kv_scroll{position:absolute;right:5%;bottom:-40px;width:200px;height:200px;z-index:2}
.kv_scroll svg{width:100%;height:100%;animation:rotate 25s linear infinite}
.kv_scroll text{font-family:var(--en);font-weight:900;font-size:15.5px;letter-spacing:.28em;fill:var(--ink)}
.kv_scroll_center{position:absolute;inset:0;display:grid;place-items:center}
.kv_scroll_center svg{width:64px;height:64px;animation:none}
@keyframes rotate{to{transform:rotate(360deg)}}

.cat{display:inline-block;background:var(--black);color:#fff;font-size:11px;font-weight:700;padding:2px 10px;line-height:1.6}

@media (max-width:768px){
  .kv{padding:84px 0 72px}
  .kv_main{grid-template-columns:1fr;width:calc(100% - 32px)}
  .kv_word{font-size:44vw}
  .kv_copy{margin:-6vw 0 0;text-align:right}
  .kv_ttl{font-size:15.5vw}
  .kv_txt{margin:3vw 0 0;font-size:4.4vw;text-align:left}
  .kv_bottom{flex-direction:column;align-items:flex-start;gap:28px;margin-top:28px}
  .kv_obi{font-size:4vw}
  .kv_bottom .btn{margin-left:20px;width:calc(100% - 40px)}
  .kv_scroll{width:112px;height:112px;right:12px;top:-6px;bottom:auto}
  .kv_scroll_center svg{width:36px;height:36px}
}

/* ============ About ============ */
.aboutus{--c:var(--c-about);position:relative;padding-top:40px}
.aboutus_head{position:relative;z-index:2;max-width:640px}
.aboutus_ttl{font-size:min(4.3vw,62px)}
.aboutus_txt{margin:40px 0 44px;font-size:16px;font-weight:500;line-height:1.85}
/* サービス名が流れる帯 */
.svc_flow{position:relative;margin-top:140px;background:#fff;padding:44px 0;overflow:hidden}
.svc_row{display:flex;width:max-content;white-space:nowrap;font-weight:900;font-style:italic;line-height:1.15;letter-spacing:-.01em;color:var(--amber);animation:flow var(--d) linear infinite;animation-direction:var(--dir)}
.svc_row span{display:inline-flex;align-items:center;padding-right:.9em}
.svc_row span::after{content:"";width:.22em;height:.22em;margin-left:.9em;border-radius:50%;background:currentColor;opacity:.45}
.svc_row.is-light{color:#ffd56a}
.svc_row.is-deep{color:var(--amber-deep)}
@keyframes flow{to{transform:translateX(-50%)}}
.svc_flow_mug{position:absolute;left:50%;top:50%;width:min(26vw,340px);aspect-ratio:1;translate:-50% -50%;display:grid;place-items:center}
.svc_flow_mug svg{width:58%;transform-origin:50% 90%;animation:cheers 3.2s ease-in-out infinite}
@keyframes cheers{0%,62%,100%{transform:rotate(0)}70%{transform:rotate(-14deg)}78%{transform:rotate(4deg)}86%{transform:rotate(-2deg)}}
.aboutus_inner{display:grid;grid-template-columns:1fr minmax(0,420px);gap:64px;align-items:center}
.aboutus_logo{text-align:center}
.aboutus_logo img{width:min(26vw,360px);height:auto;margin:0 auto;opacity:0;transform:rotate(-90deg) scale(.9);transition:transform 1.4s cubic-bezier(.2,.8,.2,1),opacity .8s}
.aboutus_logo.is_show img{opacity:1;transform:none}

/* MVV */
.mvv{margin-top:120px;border-top:2px solid var(--black)}
.mvv_row{display:grid;grid-template-columns:240px 1fr;gap:40px;padding:56px 0;border-bottom:1px solid #c8c8c8}
.mvv_label{font-family:var(--en);font-weight:900;font-style:italic;font-size:30px;line-height:1.1}
.mvv_label span{display:block;margin-top:10px;font-family:"Noto Sans JP",sans-serif;font-style:normal;font-size:13px;font-weight:700}
.mvv_main{font-size:min(3.4vw,48px)}
.mvv_sub{margin-top:18px;font-size:15px;font-weight:500;line-height:1.9;max-width:720px}
.mvv_sub.en{font-family:var(--en);font-style:italic;font-weight:700;color:#777;letter-spacing:.02em}
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.values li{background:#fff;padding:32px 28px 36px}
.values_num{font-family:var(--en);font-weight:900;font-style:italic;font-size:40px;line-height:1;color:var(--amber)}
.values_ttl{margin-top:18px;font-family:var(--en);font-weight:900;font-style:italic;font-size:24px;line-height:1.25}
.values_txt{margin-top:14px;font-size:14px;font-weight:500;line-height:1.9}
@keyframes float{50%{transform:translateY(-10px)}}
@media (max-width:768px){
  .aboutus{padding-top:24px}
  .aboutus_ttl{font-size:7vw}
  .aboutus_txt{font-size:14px}
  .svc_flow{margin-top:120px;padding:28px 0}
  .svc_flow_mug{width:44vw}
  .aboutus_inner{grid-template-columns:1fr;gap:48px}
  .aboutus_logo img{width:56vw}
  .mvv{margin-top:80px}
  .mvv_row{grid-template-columns:1fr;gap:16px;padding:40px 0}
  .mvv_label{font-size:24px}
  .mvv_main{font-size:6.4vw}
  .mvv_sub{font-size:14px}
  .values{grid-template-columns:1fr;gap:16px}
}

/* ============ Business ============ */
.business{--c:var(--c-biz);position:relative;padding-top:120px}
.business_catch_ttl{font-weight:900;font-style:italic;font-size:min(5.4vw,78px);line-height:1.5;letter-spacing:-.01em}
.business_catch_txt{margin-top:48px;font-size:18px;font-weight:700;line-height:2.65}
.business_ttl_wrap{text-align:center;margin-top:120px}
.business_ttl{font-size:min(3.9vw,56px)}
.business_subttl{margin-top:56px;font-size:min(2.1vw,28px);font-weight:900;line-height:1.75}
@media (max-width:768px){
  .business{padding-top:96px}
  .business_catch_ttl{font-size:8.4vw}
  .business_catch_txt{font-size:14px;line-height:2.1;margin-top:32px}
  .business_ttl_wrap{margin-top:80px}
  .business_ttl{font-size:6.2vw}
  .business_subttl{font-size:15px;text-align:left;margin-top:32px}
}

/* 事業パネル：全幅横並び */
.biz_panels{display:flex;margin-top:96px;height:min(46vw,640px);background:var(--black)}
.biz_panels--wide{margin-top:0;height:min(30vw,420px);border-top:1px solid rgba(255,255,255,.22)}
.biz_panels--wide .biz_panel_more{grid-template-rows:1fr;opacity:1}
.biz_panels--wide:hover .biz_panel{flex-grow:.85}
.biz_panels--wide .biz_panel:hover{flex-grow:1.3}
.biz_panel{position:relative;flex:1 1 0;min-width:0;overflow:hidden;color:#fff;transition:flex-grow 1.3s cubic-bezier(.25,.8,.25,1)}
.biz_panel+.biz_panel{border-left:1px solid rgba(255,255,255,.22)}
.biz_panels:hover .biz_panel{flex-grow:.72}
.biz_panels .biz_panel:hover,.biz_panels .biz_panel:focus-visible{flex-grow:2.4}
.biz_panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.8s cubic-bezier(.25,.8,.25,1)}
.biz_panel:hover img{transform:scale(1.05)}
.biz_panel::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to top,rgba(0,0,0,.86) 0%,rgba(0,0,0,.4) 42%,rgba(0,0,0,0) 68%)}
.biz_panel_head{position:absolute;left:22px;right:22px;top:22px;z-index:1;display:flex;justify-content:flex-end;align-items:flex-start;gap:8px}
.biz_panel--dev .biz_panel_num{font-family:var(--en);font-weight:900;font-style:italic;font-size:42px;line-height:1;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.biz_panel_body{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:26px 26px 30px}
.biz_panel_catch{font-size:13px;font-weight:700;line-height:1.6}
.biz_panel_ttl{margin-top:6px;font-size:clamp(22px,2.2vw,34px);font-weight:900;line-height:1.25;word-break:keep-all}
.biz_panel_ttl small{display:block;margin-top:4px;font-size:12px;font-weight:700;opacity:.8}
.biz_panel_more{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 1.1s cubic-bezier(.25,.8,.25,1),opacity .8s .15s}
.biz_panel_more>div{overflow:hidden;min-width:300px}
.biz_panel:hover .biz_panel_more,.biz_panel:focus-visible .biz_panel_more{grid-template-rows:1fr;opacity:1}
.biz_panel_txt{margin-top:14px;max-width:420px;font-size:14px;font-weight:500;line-height:1.85}
.biz_panel .btn{margin:18px 0 2px}
.biz_swipe{display:none}
@media (max-width:960px){.biz_panels{height:62vw}.biz_panels--wide{height:40vw}}
@media (max-width:768px){
  .biz_panels{height:auto;margin-top:56px;padding:0 20px;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:none}
  .biz_panels::-webkit-scrollbar{display:none}
  .biz_panel{flex:0 0 80%;display:flex;flex-direction:column;background:var(--black);scroll-snap-align:center}
  .biz_panel img{position:relative;inset:auto;height:auto;aspect-ratio:1;object-position:50% 20%}
  .biz_panel::after{display:none}
  .biz_panel_body{position:relative;flex:1;padding:20px 20px 24px}
  .biz_panel+.biz_panel{border-left:none}
  .biz_panels:hover .biz_panel,.biz_panels .biz_panel:hover{flex-grow:0}
  .biz_panel_more{grid-template-rows:1fr;opacity:1}
  .biz_panel_more>div{min-width:0}
  .biz_panel_txt{font-size:13px}
  .biz_panels--wide{margin-top:12px;border-top:none}
  .biz_swipe{display:block;margin-top:14px;text-align:center;font-family:var(--en);font-size:12px;font-weight:700;letter-spacing:.2em}
  .biz_swipe span{display:inline-block;animation:swipe 1.6s ease-in-out infinite}
}
@keyframes swipe{50%{transform:translateX(6px)}}

/* ============ News ============ */
.news{--c:var(--c-news);position:relative;margin-top:200px;padding:120px 0 160px;background:rgba(245,245,245,.7)}
.news_inner{display:grid;grid-template-columns:1fr 600px;gap:40px}
.news_ttl{font-size:min(4.3vw,62px)}
.news_ttl_wrap .btn{margin-top:70px}
.news_list{border-top:1px solid #c8c8c8}
.news_list li{border-bottom:1px solid #c8c8c8}
.news_list a{display:block;padding:30px 0}
.news_list a:hover .news_list_txt{text-decoration:underline}
.news_list_info{display:flex;align-items:center;gap:10px;font-size:16px}
.news_list_txt{font-size:16px;font-weight:700;line-height:1.6;margin-top:4px}
@media (max-width:960px){
  .news{margin-top:120px;padding:96px 0 100px}
  .news_inner{grid-template-columns:1fr}
  .news_ttl{font-size:8vw}
  .news_ttl_wrap .btn{margin-top:32px}
  .news_list_txt{font-size:14px}
}

/* ============ Footer ============ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .opening{display:none}
  .js_reveal.fade{opacity:1;transform:none}
  .band::before{transform:skewX(-12deg) scaleX(1)}
  .mark{background-size:100% .1em,100% .36em;background-position:0 calc(100% - .44em),0 calc(100% - .08em)}
  .band .h>span,.kv_ttl .h>span{transform:none}
  .kv_word{clip-path:none}.kv_txt{opacity:1}
}

/* ============ お問い合わせCTA（トップ） ============ */
.cta{position:relative;margin-top:0;padding:150px 0 120px;overflow:hidden;background:linear-gradient(180deg,#f9bb40 0%,var(--amber) 45%,var(--amber-deep) 100%)}
.cta::before{content:"";position:absolute;left:0;right:0;top:0;height:64px;pointer-events:none;
  background:
    radial-gradient(circle at 21px 26px,var(--foam) 20px,transparent 20.5px) 0 0/58px 64px repeat-x,
    radial-gradient(circle at 15px 30px,var(--foam) 13px,transparent 13.5px) 31px 4px/58px 64px repeat-x,
    linear-gradient(var(--foam),var(--foam)) 0 0/100% 28px no-repeat;
  filter:drop-shadow(0 6px 8px rgba(160,90,0,.18));
  animation:cta_foam 14s linear infinite}
@keyframes cta_foam{to{background-position:58px 0,89px 4px,0 0}}
.cta::after{content:"";position:absolute;left:0;right:0;top:70px;height:200%;pointer-events:none;
  background:
    radial-gradient(circle at 30px 80px,rgba(255,255,255,.55) 3px,transparent 4px),
    radial-gradient(circle at 160px 30px,rgba(255,255,255,.4) 2px,transparent 3px),
    radial-gradient(circle at 260px 120px,rgba(255,255,255,.5) 4px,transparent 5px),
    radial-gradient(circle at 390px 60px,rgba(255,255,255,.35) 2px,transparent 3px),
    radial-gradient(circle at 470px 150px,rgba(255,255,255,.45) 3px,transparent 4px);
  background-size:520px 180px;animation:cta_bubbles 9s linear infinite}
@keyframes cta_bubbles{to{transform:translateY(-180px)}}
.cta_inner{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.cta_en{font-family:var(--en);font-weight:900;font-style:italic;font-size:min(13vw,180px);line-height:.85;letter-spacing:-.04em}
.cta_txt{margin-top:28px;font-size:18px;font-weight:700;line-height:1.8}
.cta .btn{border-color:var(--black)}
@media (max-width:768px){.cta{margin-top:0;padding:100px 0 80px}.cta_txt{font-size:15px}.cta_en{font-size:20vw}}

/* ============ 子ページ共通 ============ */
.page_hero{position:relative;padding:150px 0 72px}
.breadcrumb{display:flex;flex-wrap:wrap;gap:10px;font-family:var(--en);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#666}
.breadcrumb a:hover{color:var(--black)}
.page_ttl_en{display:block;margin-top:24px;font-family:var(--en);font-weight:900;font-style:italic;font-size:min(13vw,190px);line-height:.92;letter-spacing:-.04em;padding:.04em .1em .06em 0;width:max-content;max-width:100%;
  background:linear-gradient(to top,var(--amber-deep) 0%,var(--amber) 29%,var(--foam) 29%,var(--foam) 32.5%,var(--black) 32.5%) 0 0/100% 200% no-repeat;
  -webkit-background-clip:text;background-clip:text;color:transparent;transition:background-position 1.8s cubic-bezier(.3,.75,.25,1) .2s}
.is-ready .page_ttl_en{background-position:0 100%}
.page_ttl_ja{display:block;margin-top:22px;font-size:min(3vw,34px)}
.page_lead{margin-top:20px;font-size:15px;font-weight:500;line-height:1.9}
.sub_sec{position:relative;padding:96px 0}
.sub_sec+.sub_sec{padding-top:40px}
.sub_ttl{font-size:min(3.4vw,46px);margin-bottom:48px}
@media (max-width:768px){
  .page_hero{padding:110px 0 48px}
  .page_ttl_en{font-size:19vw}
  .page_ttl_ja{font-size:6vw}
  .page_lead{font-size:14px}
  .sub_sec{padding:72px 0}
  .sub_ttl{font-size:6.4vw;margin-bottom:32px}
}

/* About：メッセージ */
.message_lead{font-size:18px;font-weight:900;margin:28px 0 24px}
.message_body p{font-size:15px;font-weight:500;line-height:2}
.message_body p+p{margin-top:1.4em}

/* About：経営陣 */
.member_list{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.member_list li{background:#fff}
.member_photo{aspect-ratio:1;overflow:hidden;background:#f2f2f2}
.member_photo img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.member_list li:hover .member_photo img{transform:scale(1.04)}
.member_body{padding:18px 20px 22px}
.member_role{font-size:12px;font-weight:700}
.member_name{margin-top:4px;font-size:20px;font-weight:900;line-height:1.3}
.member_en{font-family:var(--en);font-weight:700;font-style:italic;font-size:12px;color:#777;letter-spacing:.04em}
@media (max-width:960px){.member_list{grid-template-columns:repeat(2,1fr);gap:12px}.member_name{font-size:17px}.member_role{font-size:11px}.member_body{padding:14px 14px 16px}}

/* About：沿革 */
.history{position:relative;border-left:3px solid var(--black);margin-left:8px}
.history li{position:relative;display:grid;grid-template-columns:140px 1fr;gap:24px;padding:22px 0 22px 40px;border-bottom:1px solid #c8c8c8}
.history li::before{content:"";position:absolute;left:-10px;top:31px;width:17px;height:17px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 4px var(--bg)}
.history time{font-family:var(--en);font-weight:900;font-style:italic;font-size:22px;line-height:1.3}
.history p{font-size:15px;font-weight:700;line-height:1.8}
@media (max-width:768px){.history li{grid-template-columns:1fr;gap:4px;padding-left:28px}.history li::before{top:27px}.history time{font-size:18px}}

/* 表（会社概要・特商法） */
.info_table{display:grid;grid-template-columns:220px 1fr;background:#fff}
.info_table dt,.info_table dd{padding:24px 32px;border-bottom:1px solid #e3e3e3;font-size:15px;line-height:1.85}
.info_table dt{font-weight:900;background:#fafafa}
.info_table dd{font-weight:500}
.info_table a{text-decoration:underline}
@media (max-width:768px){.info_table{grid-template-columns:1fr}.info_table dt{padding:16px 20px 6px;border-bottom:none}.info_table dd{padding:0 20px 16px}}

/* About：拠点 */
.access_list{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}
.access_list li{background:#fff;padding:36px 36px 40px}
.access_en{font-family:var(--en);font-weight:900;font-style:italic;font-size:34px;line-height:1}
.access_name{margin-top:10px;font-size:15px;font-weight:900}
.access_addr{margin:16px 0 26px;font-size:15px;font-weight:500;line-height:1.8}
@media (max-width:768px){.access_list{grid-template-columns:1fr;gap:20px}.access_list li{padding:28px 24px 30px}}

/* お知らせ一覧 */
.news_tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px}
.news_tabs button{padding:9px 20px;border:2px solid var(--black);border-radius:100px;background:#fff;font-size:13px;font-weight:700;transition:background .3s,color .3s}
.news_tabs button:hover{background:#fff4dd}
.news_tabs button[aria-pressed="true"]{background:var(--black);color:#fff}
.news_list--page a{display:grid;grid-template-columns:auto 1fr 24px;gap:8px 32px;align-items:center;padding:30px 8px;transition:background .3s,padding .3s}
.news_list--page a:hover{background:rgba(255,255,255,.6);padding-left:20px}
.news_list--page .news_list_txt{margin:0}
.news_list--page svg{width:18px;height:18px;stroke:var(--black);stroke-width:2.6;fill:none}
@media (max-width:768px){.news_list--page a{grid-template-columns:1fr;gap:6px;padding:24px 4px}.news_list--page svg{display:none}}

/* お知らせ詳細 */
.article{max-width:860px;margin:0 auto}
.article_meta{display:flex;align-items:center;gap:12px;font-family:var(--en);font-size:15px;font-weight:700}
.article_ttl{margin-top:18px;font-size:min(3vw,38px);line-height:1.6}
.article_eyecatch{margin-top:40px;aspect-ratio:16/9;overflow:hidden}
.article_eyecatch img{width:100%;height:100%;object-fit:cover}
.article_body{margin-top:48px;background:#fff;padding:56px 64px}
.article_body p{font-size:16px;font-weight:500;line-height:2.1}
.article_body p+p{margin-top:1.3em}
.article_body h2{margin:56px 0 20px;padding-left:18px;border-left:6px solid var(--amber);font-size:24px;font-weight:900;line-height:1.5}
.article_body ul{margin:20px 0;display:grid;gap:12px}
.article_body li{position:relative;padding-left:24px;font-size:15px;font-weight:500;line-height:1.9}
.article_body li::before{content:"";position:absolute;left:4px;top:.75em;width:9px;height:9px;border-radius:50%;background:var(--amber)}
.article_body strong{font-weight:900;background:linear-gradient(transparent 62%,rgba(245,166,35,.45) 62%)}
.article_nav{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:56px}
@media (max-width:768px){.article_ttl{font-size:6vw}.article_body{padding:32px 22px}.article_body p{font-size:15px}.article_body h2{font-size:19px;margin-top:40px}}

/* お問い合わせ */
.contact_grid{display:grid;grid-template-columns:320px 1fr;gap:64px;align-items:start}
.contact_info{display:grid;gap:28px}
.contact_info dt{font-family:var(--en);font-weight:900;font-style:italic;font-size:14px;letter-spacing:.08em}
.contact_info dd{margin-top:6px;font-size:16px;font-weight:700;line-height:1.7}
.contact_info dd a{text-decoration:underline}
.contact_note{font-size:13px;font-weight:500;line-height:1.9;color:#555}
.form{background:#fff;padding:56px 56px 60px}
.form_row+.form_row{margin-top:30px}
.form_label{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:900;margin-bottom:12px}
.req{display:inline-block;background:var(--amber);color:var(--black);font-size:11px;font-weight:900;padding:2px 9px;border-radius:100px}
.opt{display:inline-block;background:#e9e9e9;color:#555;font-size:11px;font-weight:700;padding:2px 9px;border-radius:100px}
.form input[type=text],.form input[type=email],.form input[type=tel],.form textarea{width:100%;padding:16px 18px;border:2px solid #d9d9d9;border-radius:12px;background:#fafafa;font:inherit;font-size:16px;transition:border-color .3s,background .3s}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--amber);background:#fff}
.form textarea{min-height:200px;resize:vertical}
.form_radios{display:flex;flex-wrap:wrap;gap:10px}
.form_radios label{cursor:pointer}
.form_radios input{position:absolute;opacity:0;pointer-events:none}
.form_radios span{display:inline-block;padding:10px 20px;border:2px solid #d9d9d9;border-radius:100px;font-size:14px;font-weight:700;transition:background .3s,border-color .3s}
.form_radios input:checked+span{background:var(--black);border-color:var(--black);color:#fff}
.form_radios input:focus-visible+span{outline:2px solid var(--amber);outline-offset:2px}
.form_agree{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700}
.form_agree input{width:20px;height:20px;accent-color:var(--amber)}
.form_agree a{text-decoration:underline}
.form_hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form_error{margin-top:28px;padding:14px 18px;border-radius:12px;background:#fdecef;color:#b00032;font-size:14px;font-weight:700;line-height:1.7}
.form_submit{margin-top:40px;text-align:center}
.form_submit .btn:disabled{opacity:.6;cursor:wait}
.form_submit .btn{cursor:pointer;font:inherit;font-weight:700}
.contact_thanks{background:#fff;padding:72px 48px;text-align:center}
.contact_thanks svg{width:72px;margin:0 auto 24px}
.contact_thanks h2{font-size:28px;font-weight:900}
.contact_thanks p{margin-top:16px;font-size:15px;font-weight:500;line-height:1.9}
@media (max-width:960px){.contact_grid{grid-template-columns:1fr;gap:40px}.form{padding:32px 22px 36px}}

/* 法務ページ */
.legal{max-width:880px;margin:0 auto;background:#fff;padding:64px 72px}
.legal_intro{font-size:15px;font-weight:500;line-height:2}
.legal h2{margin:48px 0 14px;font-size:20px;font-weight:900;line-height:1.5;display:flex;gap:12px}
.legal h2 span{font-family:var(--en);font-style:italic;color:var(--amber-deep)}
.legal p,.legal li{font-size:15px;font-weight:500;line-height:2}
.legal ul{margin-top:8px;display:grid;gap:4px}
.legal li{position:relative;padding-left:20px}
.legal li::before{content:"";position:absolute;left:2px;top:.85em;width:8px;height:8px;border-radius:50%;background:var(--amber)}
.legal a{text-decoration:underline}
.legal_sign{margin-top:56px;padding-top:24px;border-top:1px solid #e3e3e3;font-size:14px;font-weight:700;line-height:1.9;text-align:right}
@media (max-width:768px){.legal{padding:36px 22px}.legal h2{font-size:17px;margin-top:36px}}


/* お知らせ詳細：前後の記事 */
.article_pager{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:48px}
.article_pager a{display:block;background:#fff;padding:20px 24px;font-size:14px;font-weight:700;line-height:1.6;transition:background .3s}
.article_pager a:hover{background:#fff4dd}
.article_pager a span{display:block;margin-bottom:6px;font-family:var(--en);font-size:12px;letter-spacing:.14em;color:#777}
.article_pager_next{text-align:right}
@media (max-width:768px){.article_pager{grid-template-columns:1fr}.article_pager_next{text-align:left}}
.article_source{margin-top:40px;padding-top:20px;border-top:1px solid #e3e3e3;font-size:13px;color:#666}
.article_source a{text-decoration:underline}
.access_list--single{grid-template-columns:minmax(0,560px)}

/* ============ 受託開発・伴走支援 ============ */
.dev_hero{overflow:hidden}
.dev_hero .inner{position:relative;z-index:1}
.dev_hero_btns{margin-top:36px}
.dev_hero_okada{position:absolute;right:max(40px,6vw);bottom:0;height:min(46vw,620px);width:auto;-webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent 98%);mask-image:linear-gradient(to bottom,#000 62%,transparent 98%)}
.dev_issue{position:relative;display:grid;grid-template-columns:1fr 260px;gap:40px;align-items:end}
.dev_issue_list{display:grid;gap:14px}
.dev_issue_list li{display:flex;align-items:center;gap:20px;background:#fff;padding:24px 28px;font-size:17px;font-weight:700;line-height:1.6}
.dev_issue_list span{font-family:var(--en);font-weight:900;font-style:italic;font-size:28px;color:var(--amber);flex-shrink:0}
.dev_issue_okada{width:100%;height:auto;-webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent 98%);mask-image:linear-gradient(to bottom,#000 62%,transparent 98%)}
.dev_cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.dev_cards li{background:var(--black);color:#fff;padding:36px 32px 40px}
.dev_card_num{font-family:var(--en);font-weight:900;font-style:italic;font-size:48px;line-height:1;color:var(--amber)}
.dev_card_ttl{margin-top:20px;font-size:24px;font-weight:900;line-height:1.5}
.dev_card_txt{margin-top:16px;font-size:14px;font-weight:500;line-height:1.95;color:rgba(255,255,255,.85)}
.dev_fields{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--black);border:2px solid var(--black)}
.dev_fields li{background:#fff;padding:32px 28px 34px;transition:background .4s}
.dev_fields li:hover{background:#fff4dd}
.dev_field_en{font-family:var(--en);font-weight:900;font-style:italic;font-size:14px;letter-spacing:.06em;color:var(--amber-deep)}
.dev_field_ttl{margin-top:8px;font-size:21px;font-weight:900}
.dev_field_txt{margin-top:10px;font-size:14px;font-weight:500;line-height:1.85}
.dev_flow{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:none}
.dev_flow li{position:relative;background:#fff;padding:28px 24px 30px}
.dev_flow li:not(:last-child)::after{content:"";position:absolute;right:-13px;top:50%;width:10px;height:10px;border-top:3px solid var(--black);border-right:3px solid var(--black);transform:translateY(-50%) rotate(45deg);z-index:1}
.dev_flow span{display:inline-block;background:var(--amber);font-family:var(--en);font-weight:900;font-size:12px;letter-spacing:.1em;padding:3px 12px;border-radius:100px}
.dev_flow_ttl{margin-top:14px;font-size:20px;font-weight:900}
.dev_flow_txt{margin-top:10px;font-size:14px;font-weight:500;line-height:1.85}
.dev_cta{position:relative;display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:center;background:linear-gradient(180deg,#f9bb40,var(--amber) 50%,var(--amber-deep));padding:0 56px 0 24px;overflow:hidden}
.dev_cta img{width:100%;height:auto;align-self:end;margin-top:32px}
.dev_cta_ttl{font-size:32px;font-weight:900;line-height:1.5}
.dev_cta_txt{margin:14px 0 28px;font-size:15px;font-weight:700}
@media (max-width:960px){
  .dev_hero_okada{position:relative;right:auto;display:block;margin:32px auto 0;height:360px}
  .dev_issue{grid-template-columns:1fr}
  .dev_issue_okada{display:none}
  .dev_issue_list li{font-size:15px;padding:18px 20px;gap:14px}
  .dev_cards,.dev_fields{grid-template-columns:1fr}
  .dev_flow{grid-template-columns:1fr}
  .dev_flow li:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-13px;transform:translateX(-50%) rotate(135deg)}
  .dev_cta{grid-template-columns:1fr;padding:32px 24px 0;text-align:center}
  .dev_cta>div{order:-1}
  .dev_cta img{width:220px;margin:16px auto 0}
  .dev_cta_ttl{font-size:22px}
}

/* ============ Navigation drawer（右から注がれる） ============ */
.navigation{position:fixed;inset:0;z-index:300;visibility:hidden;pointer-events:none;transition:visibility 0s 1s}
.navigation.is-open{visibility:visible;pointer-events:auto;transition-delay:0s}
.navigation_backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .6s}
.navigation.is-open .navigation_backdrop{opacity:1}
.navigation_drawer{position:absolute;top:0;right:0;bottom:0;width:min(520px,100%);display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;padding:96px 48px 36px;color:var(--black);
  background:linear-gradient(180deg,#f9bb40 0%,var(--amber) 45%,var(--amber-deep) 100%);
  clip-path:inset(100% 0 0 0);transition:clip-path 1s cubic-bezier(.3,.75,.25,1)}
.navigation.is-open .navigation_drawer{clip-path:inset(0 0 0 0)}
.navigation_drawer::after{content:"";position:absolute;left:0;right:0;top:60px;height:200%;pointer-events:none;
  background:
    radial-gradient(circle at 30px 80px,rgba(255,255,255,.5) 3px,transparent 4px),
    radial-gradient(circle at 160px 30px,rgba(255,255,255,.35) 2px,transparent 3px),
    radial-gradient(circle at 260px 120px,rgba(255,255,255,.45) 4px,transparent 5px),
    radial-gradient(circle at 390px 60px,rgba(255,255,255,.3) 2px,transparent 3px);
  background-size:520px 180px;animation:cta_bubbles 9s linear infinite}
.navigation_foam{position:absolute;left:0;right:0;top:0;height:56px;pointer-events:none;
  background:
    radial-gradient(circle at 21px 22px,var(--foam) 18px,transparent 18.5px) 0 0/54px 56px repeat-x,
    radial-gradient(circle at 15px 26px,var(--foam) 12px,transparent 12.5px) 29px 4px/54px 56px repeat-x,
    linear-gradient(var(--foam),var(--foam)) 0 0/100% 24px no-repeat;
  filter:drop-shadow(0 6px 8px rgba(160,90,0,.18));animation:cta_foam 14s linear infinite}
.navigation_main{position:relative;z-index:1;display:grid}
.navigation_item{display:flex;align-items:baseline;gap:18px;padding:16px 0;border-bottom:1px solid rgba(0,0,0,.18);font-family:var(--en);font-weight:900;font-style:italic;font-size:46px;line-height:1;letter-spacing:-.02em;
  opacity:0;transform:translateY(24px);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1),padding-left .4s}
.navigation_item span{font-size:13px;font-style:normal;letter-spacing:.12em}
.navigation_item small{margin-left:auto;font-family:"Noto Sans JP",sans-serif;font-style:normal;font-weight:700;font-size:12px;letter-spacing:.04em}
.navigation_item:hover{padding-left:12px}
.navigation.is-open .navigation_item{opacity:1;transform:none}
.navigation.is-open .navigation_item:nth-child(1){transition-delay:.55s}
.navigation.is-open .navigation_item:nth-child(2){transition-delay:.63s}
.navigation.is-open .navigation_item:nth-child(3){transition-delay:.71s}
.navigation.is-open .navigation_item:nth-child(4){transition-delay:.79s}
.navigation_services{position:relative;z-index:1;margin-top:40px;opacity:0;transition:opacity .6s .9s}
.navigation.is-open .navigation_services{opacity:1}
.navigation_services_ttl{font-family:var(--en);font-weight:900;font-style:italic;font-size:13px;letter-spacing:.14em}
.navigation_chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.navigation_chips a{background:#fff;border-radius:100px;padding:9px 18px;font-size:13px;font-weight:700;transition:background .3s,color .3s}
.navigation_chips a:hover{background:var(--black);color:#fff}
.navigation_foot{position:relative;z-index:1;margin-top:auto;padding-top:40px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:var(--en);font-size:12px;font-weight:700;opacity:0;transition:opacity .6s 1s}
.navigation.is-open .navigation_foot{opacity:1}
.navigation_sns{display:flex;gap:18px}
.navigation_sns svg{width:22px;height:22px;fill:var(--black)}
@media (min-width:769px){.navigation_drawer{right:88px}}
@media (max-width:768px){.navigation_drawer{width:100%;padding:84px 24px 28px}.navigation_item{font-size:36px;gap:14px}}

/* ============ Footer ============ */
.footer{position:relative;background:var(--black);color:#fff;padding:72px 0 40px}
.footer::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,var(--foam) 0 14%,var(--amber) 14%,var(--amber-deep) 100%)}
.footer_top{display:grid;grid-template-columns:1fr auto;gap:40px 80px;align-items:start}
.footer .logo img{height:56px;filter:invert(1)}
.footer_tag{margin-top:18px;font-size:14px;font-weight:700;color:rgba(255,255,255,.75)}
.footer_nap{margin-top:24px;font-style:normal;font-size:13px;font-weight:500;line-height:1.9;color:rgba(255,255,255,.75)}
.footer_nap_name{font-size:14px;font-weight:700;color:#fff}
.footer_nav{display:flex;flex-wrap:wrap;gap:12px 40px;font-family:var(--en);font-weight:900;font-style:italic;font-size:24px;line-height:1}
.footer_services{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:24px;font-size:13px;font-weight:700;color:rgba(255,255,255,.8)}
.footer_services a::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--amber);margin-right:8px;vertical-align:middle}
.footer a{transition:opacity .3s}
.footer a:hover{opacity:.6}
.footer_bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-top:72px;padding-top:28px;border-top:1px solid rgba(255,255,255,.15);font-size:12px}
.footer_right{display:flex;align-items:center;gap:32px;flex-wrap:wrap}
.footer_legal{display:flex;flex-wrap:wrap;gap:8px 20px}
.footer_sns{display:flex;gap:16px}
.footer_sns svg{width:22px;height:22px;fill:#fff}
@media (max-width:768px){
  .footer{padding:56px 0 32px}
  .footer_top{grid-template-columns:1fr;gap:32px}
  .footer .logo img{height:40px}
  .footer_nav{font-size:20px;gap:10px 28px}
  .footer_bottom{flex-direction:column-reverse;align-items:flex-start;margin-top:48px}
}

/* SNSは公開先URLが決まるまで非表示 */
.header_sns,.navigation_sns,.footer_sns{display:none!important}