@charset "utf-8";
/* STANCER トップ（site.css の後に読む） */
.st-logo img { height: 26px; width: auto; }
.sl-header .st-logo img { height: 22px; }
.sl-menu__top .st-logo img { height: 22px; }
.sl-footer__brand .st-logo img { height: 24px; filter: brightness(0) invert(1); }
@media screen and (max-width: 672px) { .sl-header .st-logo img, .sl-menu__top .st-logo img { height: 18px; } }

.st-hero { position: relative; overflow: hidden; background: #f7f8fa; }
.st-hero::before { content: ""; position: absolute; inset: 0; left: 45%;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'><path d='M28 0l28 16v32L28 64 0 48V16z M28 48.5l28 16v32L28 112.5 0 96.5v-32z' fill='none' stroke='%23d6dbe2' stroke-width='1.5'/></svg>");
  background-size: 56px 97px; opacity: .8;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 40%); mask-image: linear-gradient(to right, transparent, #000 40%); }
.st-hero__inner { position: relative; max-width: 1000px; margin: 0 auto; padding: clamp(56px, 10vw, 120px) 20px clamp(56px, 8vw, 96px); }
.st-hero__logo { margin: 0 0 28px; }
.st-hero__logo img { width: min(520px, 80%); height: auto; }
.st-hero__lead { margin: 0 0 12px; font-size: clamp(20px, 3vw, 30px); font-weight: 700; line-height: 1.5; letter-spacing: .02em; }
.st-hero__sub { margin: 0; max-width: 620px; font-size: 15px; line-height: 1.9; color: var(--sl-ink-2); }
.st-choose { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 40px; }
.st-choose__item { display: flex; flex-direction: column; gap: 6px; padding: 26px 26px 22px; background: #fff; border: 1px solid var(--sl-line); border-radius: 6px; text-decoration: none; color: var(--sl-ink); transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.st-choose__item:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(26,33,41,.10); border-color: #111; color: var(--sl-ink); }
.st-choose__item .en { font-family: var(--sl-font-latin); font-size: 26px; font-weight: 800; letter-spacing: .06em; line-height: 1.1; }
.st-choose__item .ja { font-size: 13px; font-weight: 700; color: var(--sl-ink-2); }
.st-choose__item .desc { margin-top: 8px; font-size: 14px; line-height: 1.8; color: var(--sl-ink-2); }
.st-choose__item .go { margin-top: 12px; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; }
.st-choose__item .go svg { width: 16px; height: 16px; transition: transform .15s ease; }
.st-choose__item:hover .go svg { transform: translateX(3px); }
.st-hero__links { margin: 24px 0 0; display: flex; flex-wrap: wrap; gap: 6px 8px; }
.st-hero__links a { padding: 6px 14px; border: 1px solid var(--sl-line); border-radius: 999px; background: #fff; font-size: 13px; color: var(--sl-ink-2); text-decoration: none; }
.st-hero__links a:hover { border-color: #111; color: #111; }
.st-body .sl-footer { margin-top: 0; }
.st-body .sl-menu__label, .st-body .sl-menu__list a.is-store { color: #111; }
.st-body .sl-menu__list a:hover, .st-body a { color: var(--sl-ink); }
.st-body .sl-menu__list a:hover .en { text-decoration: underline; }
@media screen and (max-width: 672px) {
  .st-choose { grid-template-columns: 1fr; }
  .st-hero::before { left: 0; -webkit-mask-image: linear-gradient(to bottom, transparent, #000 50%); mask-image: linear-gradient(to bottom, transparent, #000 50%); opacity: .5; }
}
