:root{
  --bz-header-h:64px;
}

.bz-header{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:var(--bz-header-h);
  z-index:1000;
  background:rgba(22,31,24,.78);
  border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  transform:translate3d(0,0,0);
  transition:transform .28s ease,background .2s ease,box-shadow .2s ease;
}
.bz-header-logo{
  width: 200px;
}
.bz-header.is-hidden{
  transform:translate3d(0,calc(var(--bz-header-h) * -1),0);
}

.bz-header-inner{
  max-width:1400px;
  height:100%;
  margin:0 auto;
  padding:0 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.pc-only{display:flex;}
.sp-only{display:none;}

.bz-header-nav{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
}

.bz-header-nav a{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:0 14px;
  border-radius:8px;
  color:#eef3e7;
  font-weight:700;
  text-decoration:none;
}

.bz-menu-toggle{
  display:none;
  width:44px;
  height:44px;
  padding:0;
  border:none;
  border-radius:8px;
  background:rgba(255,255,255,.06);
  box-shadow:none;
  position:relative;
}

.bz-menu-toggle:hover{
  transform:none;
  background:rgba(255,255,255,.1);
}

.bz-menu-toggle span{
  position:absolute;
  left:12px;
  width:20px;
  height:2px;
  background:#fff;
  border-radius:999px;
  transition:transform .24s ease,opacity .2s ease,top .24s ease;
}

.bz-menu-toggle span:nth-child(1){top:15px;}
.bz-menu-toggle span:nth-child(2){top:21px;}
.bz-menu-toggle span:nth-child(3){top:27px;}

.bz-menu-toggle.is-active span:nth-child(1){top:21px;transform:rotate(45deg);}
.bz-menu-toggle.is-active span:nth-child(2){opacity:0;}
.bz-menu-toggle.is-active span:nth-child(3){top:21px;transform:rotate(-45deg);}

.bz-mobile-menu-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.42);
  opacity:0;
  visibility:hidden;
  transition:opacity .28s ease,visibility .28s ease;
  z-index:1090;
}

.bz-mobile-menu{
  position:fixed;
  top:0;
  right:0;
  width:min(86vw,360px);
  height:100dvh;
  background:linear-gradient(180deg,#162018,#1e2a1f);
  border-left:1px solid rgba(255,255,255,.08);
  box-shadow:-18px 0 40px rgba(0,0,0,.3);
  transform:translate3d(100%,0,0);
  transition:transform .34s cubic-bezier(.22,.8,.2,1);
  z-index:1101;
  display:flex;
  flex-direction:column;
  will-change:transform;
}

.bz-mobile-menu.is-open{
  transform:translate3d(0,0,0);
}

.bz-mobile-menu-backdrop.is-open{
  opacity:1;
  visibility:visible;
}

.bz-mobile-menu-head{
  height:64px;
  padding:0 14px 0 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.bz-mobile-menu-nav{
  display:flex;
  flex-direction:column;
  padding:14px;
  gap:4px;
}

.bz-mobile-menu-nav a{
  display:flex;
  align-items:center;
  min-height:48px;
  padding:0 12px;
  border-radius:10px;
  color:#f3f6ee;
  font-weight:700;
  text-decoration:none;
}

body.is-menu-open{
  overflow:hidden;
}
.bz-mobile-menu-close{
  width: 100px;
}
@media (max-width:900px){
  .pc-only{display:none !important;}
  .sp-only{display:inline-flex !important;}
  .bz-menu-toggle{display:inline-flex;align-items:center;justify-content:center;}
  .bz-header-inner{padding:0 12px 0 14px;}
}