/* about·guide·privacy 공통: 메인과 같은 상단 로고·메뉴, 광고 자리 */
body {
  padding-top: max(env(safe-area-inset-top), 16px);
}
.top {
  position: relative;
  z-index: 4;
  padding-top: 4px;
  margin-bottom: 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.home,
.logo,
.menu-btn img {
  display: block;
}
.menu-btn {
  position: relative;
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
  transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1);
}
.menu-btn::before {
  content: "";
  position: absolute;
  inset: -11px;
}
.menu-btn:active {
  transform: scale(0.92);
}
.menu {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  min-width: 140px;
  padding: 6px;
  background: #000;
  border: 2px solid #fe49ce;
}
.menu:not([hidden]) {
  animation: menu-drop 220ms cubic-bezier(0.23, 1, 0.32, 1);
}
.menu.closing {
  animation: menu-fold 160ms cubic-bezier(0.23, 1, 0.32, 1) forwards;
}
.menu a {
  display: block;
  padding: 10px 12px;
  font: 14px GalmuriMono11, monospace;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
}
.menu a:active {
  background: #c80d96;
}
.menu a[aria-current] {
  color: #feb649;
}
@media (hover: hover) {
  .menu a:hover {
    color: #fe49ce;
  }
}
@keyframes menu-drop {
  from {
    clip-path: inset(0 0 100% 0);
  }
  to {
    clip-path: inset(0);
  }
}
@keyframes menu-fold {
  from {
    clip-path: inset(0);
  }
  to {
    clip-path: inset(0 0 100% 0);
  }
}
.ad {
  display: none;
  margin: 32px 0;
  text-align: center;
}
.ad.on {
  display: block;
}
.ad:has(ins[data-ad-status="unfilled"]) {
  display: none;
}