@charset "UTF-8";
/* REBRU ページ固有スタイル（共通 site.css の後に読む） */
:root { --rb-ink: #231815; }
.rb-hero { background: #231815; color: #fff; }
.rb-hero__inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px 40px; align-items: center; }
.rb-hero__photo { padding: 0; }
.rb-hero__photo img { width: 100%; height: auto; display: block; }
.rb-hero__inner { max-width: 1000px; margin: 0 auto; padding: 56px 20px 64px; }
.rb-wordmark { margin: 0; font-family: var(--sl-font-latin); font-size: clamp(48px, 7vw, 76px); font-weight: 800; letter-spacing: .06em; line-height: 1; color: #fff; }
.rb-wordmark sup { font-size: .28em; vertical-align: top; margin-left: .1em; }
.rb-wordmark small { display: block; margin-top: 10px; font-family: var(--sl-font); font-size: 13px; font-weight: 500; letter-spacing: .2em; color: #d9d2cc; }
.rb-hero p { margin: 18px 0 0; font-size: 15px; letter-spacing: .08em; color: #d9d2cc; }
.rb-hero p strong { display: block; font-size: 20px; color: #fff; letter-spacing: .12em; margin-bottom: 6px; }
.rb-lead { max-width: 720px; margin: 0 auto; font-size: 16px; line-height: 2; }
.rb-lead strong { text-align: center; font-size: 20px; margin-bottom: 14px; }
.rb-lead strong { display: block; font-size: 20px; margin-bottom: 8px; }
.rb-features { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; counter-reset: f; }
.rb-features li { counter-increment: f; display: grid; grid-template-columns: 56px 1fr; gap: 14px; align-items: start; padding-bottom: 22px; border-bottom: 1px solid var(--sl-line); }
.rb-features li::before { content: counter(f, decimal-leading-zero); font-family: var(--sl-font-latin); font-size: 26px; font-weight: 800; color: var(--rb-ink); line-height: 1.1; }
.rb-features h3 { margin: 0 0 6px; font-size: 18px; font-weight: 700; }
.rb-features p { margin: 0; font-size: 15px; color: var(--sl-ink-2); }
.rb-item { display: grid; grid-template-columns: 1fr 1.3fr; gap: 24px 40px; align-items: center; padding: 36px 0; border-bottom: 1px solid var(--sl-line); }
.rb-item:last-child { border-bottom: 0; }
.rb-item h3 { margin: 0 0 10px; font-family: var(--sl-font-latin); font-size: 24px; font-weight: 800; letter-spacing: .02em; }
.rb-item h3 small { display: block; font-family: var(--sl-font); font-size: 13px; font-weight: 500; color: var(--sl-ink-2); }
.rb-item .disc { display: inline-block; margin-bottom: 8px; padding: 2px 10px; background: #b42318; color: #fff; font-size: 12px; font-weight: 700; border-radius: 3px; }
.rb-item p { margin: 0 0 10px; font-size: 15px; }
.rb-kitbanner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 24px; background: #1b1613; color: #fff; text-decoration: none; padding: 28px 32px; margin-top: 8px; }
.rb-kitbanner:hover { color: #fff; opacity: .92; }
.rb-kitbanner img { width: 100%; height: auto; }
.rb-kitbanner .t1 { display: block; font-family: var(--sl-font-latin); font-size: 14px; letter-spacing: .12em; color: #d9d2cc; }
.rb-kitbanner .t2 { display: block; font-family: var(--sl-font-latin); font-size: 26px; font-weight: 800; color: #4cd6e0; margin: 4px 0; }
.rb-kitbanner .t3 { display: block; font-size: 14px; }
.rb-kitbanner .btn { margin-top: 14px; }
@media screen and (max-width: 672px) {
  .rb-hero__inner { grid-template-columns: 1fr; padding: 32px 20px; }
  .rb-item, .rb-kitbanner { grid-template-columns: 1fr; }
  .rb-lead { font-size: 15px; }
}