/* /service/web: mobile-only shortcuts, 2026-09-21. */
.zz-web-jumpnav,
.zz-web-flowlink {
  display: none;
}

@media (max-width: 768px) {
  .zz-web-jumpnav {
    display: flex;
    flex-wrap: wrap;
    gap: 0 clamp(1.5rem, 8.5333vw, 2rem);
    margin-top: clamp(1.5rem, 6.4vw, 2rem);
  }
  .zz-web-jumpnav a {
    display: inline-flex;
    align-items: center;
    gap: clamp(.75rem, 3.2vw, 1rem);
    min-height: 2.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, .45);
    color: #fff;
    font-family: var(--ja_sans);
    font-size: clamp(.75rem, 3.4667vw, .8125rem);
    font-weight: 400;
    line-height: 2;
    letter-spacing: .04em;
    text-decoration: none;
    transition: opacity .25s ease;
  }
  .zz-web-jumpnav a:hover { opacity: .82; }
  .zz-web-jumpnav a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 4px;
  }
  .zz-web-flowlink {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    min-height: 2.75rem;
    margin-top: .5rem;
    color: #262627;
    font-size: .8125rem;
    line-height: 2;
    letter-spacing: .04em;
    text-decoration: underline;
    text-underline-offset: .3em;
    text-decoration-color: rgba(38, 38, 39, .3);
  }
  .zz-web-flowlink:focus-visible {
    outline: 2px solid #262627;
    outline-offset: 3px;
  }
  #web #works,
  #web #web_price,
  #web #web_approach {
    scroll-margin-top: calc(var(--hh) + 1rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .zz-web-jumpnav a { transition: none; }
}