.head, .foot{
  --head-ink:#0B0C10;
  --orange:#F2622A;
  --orange-dark:#D0491A;
  --text:#14181E;
  --text-2:#4C535D;
  --text-3:#818892;
  --line:#E3E6EB;
  --line-2:#EDEFF3;
  --paper-2:#F3F4F7;
  --font:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",system-ui,sans-serif;
  font-family:var(--font);
  font-size:16px;
  font-weight:400;
  line-height:1.95;
  color:var(--text);
  letter-spacing:normal;
}

.head a, .foot a{text-decoration:none}

.head button{font:inherit;color:inherit}

.head p, .foot p{margin:0}

@media (max-width:640px){
  .head, .foot{font-size:15.5px}
}

.wrap{width:100%;max-width:1180px;margin-inline:auto;padding-inline:clamp(22px,5.2vw,48px)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:60px;padding:0 30px;border-radius:999px;
  font-size:16px;font-weight:900;text-decoration:none;border:2px solid transparent;
  transition:transform .2s,background .2s,color .2s,border-color .2s;
}
.btn .arw{width:26px;height:2px;background:currentColor;position:relative;flex:none}
.btn .arw::after{content:"";position:absolute;right:0;top:-3px;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.btn-main{background:var(--orange);color:#fff;box-shadow:0 18px 38px -20px rgba(242,98,42,.95)}
.btn-main:hover{background:var(--orange-dark);color:#fff;transform:translateY(-2px)}
.btn-line{background:#fff;color:var(--text);border-color:var(--line)}
.btn-line:hover{border-color:var(--orange);color:var(--orange)}
.band-accent .btn-main{background:#fff;color:var(--orange-dark);box-shadow:0 18px 38px -22px rgba(0,0,0,.5)}
.band-accent .btn-main:hover{background:#fff;color:var(--orange-dark)}
.btn-sm{min-height:46px;padding:0 22px;font-size:14px}

.head{
  position:sticky;top:0;z-index:100;background:var(--head-ink);
  border-bottom:1px solid rgba(255,255,255,.10);
  
  transition:background .4s,border-color .4s,backdrop-filter .4s;
}
.head.is-scrolled{
  background:rgba(255,255,255,.95);
  backdrop-filter:saturate(150%) blur(12px);
  border-bottom-color:var(--line-2);
}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:74px}

.logo{display:flex;align-items:center;gap:11px;text-decoration:none}

.logo img{width:48px;height:48px;border-radius:0;object-fit:contain}
.logo span{font-size:16px;font-weight:900;letter-spacing:.02em;white-space:nowrap}

.head .logo img{width:48px;height:48px;border-radius:0;flex:none;object-fit:contain}
.head .logo-txt{display:flex;flex-direction:column;justify-content:center}
.head .logo .nm{
  font-size:18px;font-weight:900;letter-spacing:.02em;white-space:nowrap;
  line-height:1.15;color:#fff;transition:color .4s;
}
.head .logo .tag{
  font-size:12px;font-weight:900;letter-spacing:.055em;white-space:nowrap;
  line-height:1.15;color:var(--orange);margin-top:2px;transition:color .4s;
}
.head.is-scrolled .logo .nm{color:var(--text)}

.head.is-scrolled .logo .tag{color:var(--orange-dark)}

.nav{display:flex;align-items:center;gap:clamp(14px,2vw,26px)}
.nav a:not(.btn){font-size:15px;font-weight:700;color:#fff;text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;transition:color .4s,border-color .2s}
.nav a:not(.btn):hover{color:var(--orange);border-bottom-color:var(--orange)}
.head.is-scrolled .nav a:not(.btn){color:var(--text)}
.head.is-scrolled .nav a:not(.btn):hover{color:var(--orange)}
.nav .btn-main{color:#fff}

.burger{display:none;width:46px;height:46px;border:1px solid rgba(255,255,255,.42);border-radius:12px;background:transparent;cursor:pointer;padding:0;transition:background .4s,border-color .4s}
.burger i{display:block;width:20px;height:2px;background:#fff;margin:4px auto;transition:transform .2s,opacity .2s,background .4s}
.head.is-scrolled .burger{border-color:var(--line);background:#fff}
.head.is-scrolled .burger i{background:var(--text)}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.foot{background:var(--paper-2);border-top:1px solid var(--line);padding:clamp(40px,5vw,56px) 0 28px}
.foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:30px;padding-bottom:26px;border-bottom:1px solid var(--line)}
.foot-links{display:flex;flex-wrap:wrap;gap:clamp(16px,2.6vw,30px)}
.foot-links a{font-size:13.5px;font-weight:700;text-decoration:none;color:var(--text-2)}
.foot-links a:hover{color:var(--orange)}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:20px;font-size:12.5px;color:var(--text-3)}

@media (max-width:920px){
  .burger{display:grid;place-content:center;order:3}
  
  
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;
    background:var(--head-ink);border-bottom:1px solid rgba(255,255,255,.14);padding:10px clamp(22px,5.2vw,48px) 22px;
    box-shadow:0 24px 40px -28px rgba(0,0,0,.6);
    transition:none}
  .head.is-scrolled .nav{background:#fff;border-bottom-color:var(--line);box-shadow:0 24px 40px -28px rgba(20,24,30,.4)}
  
  .head.menu-open{transition:none}
  .nav.is-open{display:flex}
  .head-in{position:relative}
  .nav a:not(.btn){padding:15px 0;border-bottom:1px solid rgba(255,255,255,.14);transition:none}
  .head.is-scrolled .nav a:not(.btn){border-bottom-color:var(--line-2)}
  .nav .btn{margin-top:14px;width:100%}
}

@media (max-width:768px){
  .foot-links a{display:flex;align-items:center;min-height:44px;min-width:44px}
  .logo{min-height:44px}
  #burger{min-width:44px;min-height:44px}
}

@media (max-width:430px){
  
  .head .logo img{width:38px;height:38px}
  .head .logo .nm{font-size:16px}
  .head .logo .tag{font-size:12px;letter-spacing:.01em}
}