/* 会社サイト・サービスサイト共通の型（見本）: 広告LP「まだ」の赤×墨色・紙の地・太いゴシック・黄色のボタンを、横に広い画面へ */
html,body.site{background:var(--paper)}
body.site{background:var(--paper) radial-gradient(rgba(20,20,29,.07) 1px,transparent 1.4px) 0 0/16px 16px}
.pc{display:none}

/* 頭: 白・1段・赤い枠のボタン */
.gh{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--rule)}
.gh__in{max-width:1200px;margin:0 auto;height:56px;padding:0 16px;display:flex;align-items:center;gap:24px}
.gh__logo{display:flex;align-items:baseline;gap:5px;text-decoration:none;color:var(--ink);white-space:nowrap}
.gh__logo b{font-weight:900;font-size:12px;letter-spacing:.04em}
.gh__logo strong{font-weight:900;font-size:22px;letter-spacing:.06em}
.gh__logo strong i{font-style:normal;color:var(--red)}
.gh__nav{display:none;margin-left:auto;gap:22px}
.gh__nav a{font-size:13.5px;font-weight:900;text-decoration:none;color:var(--ink);padding:4px 0;border-bottom:2px solid transparent}
.gh__nav a:first-child{color:var(--red);border-bottom-color:var(--red)}
.gh__btn{margin-left:auto;white-space:nowrap}

/* 最初の画面 */
.hero{position:relative}
.hero__in{max-width:1200px;margin:0 auto;padding:20px 18px 0}
.hero__h1{margin-top:12px;font-weight:900;line-height:1.12;letter-spacing:.01em}
.hero__h1 .l1{display:block;font-size:min(36px,9.2vw)}
.hero__h1 .l2{display:block;white-space:nowrap;font-size:min(60px,15vw);color:var(--red);letter-spacing:-.02em;margin:4px 0 2px -6px}
.hero__h1 .l2 .w{color:var(--red)}
.hero__h1 .l3{display:block;font-size:min(44px,11vw)}
.hero__sub{margin-top:14px;font-size:15px;font-weight:700;line-height:1.8;color:var(--ink2)}
.hero__sub b{color:var(--red);font-weight:900}
.hero__chips{margin-top:14px;display:flex;flex-direction:column;gap:7px}
.hero__chips li{position:relative;background:var(--sheet);border:1px solid var(--line);border-left:5px solid var(--red);padding:7px 12px 7px 34px;font-size:14px;font-weight:700;box-shadow:0 3px 0 rgba(20,20,29,.06)}
.hero__chips li::before{content:"✓";position:absolute;left:9px;top:50%;transform:translateY(-50%);width:18px;height:18px;border-radius:50%;background:var(--red);color:#fff;font-size:11px;display:grid;place-items:center;font-weight:900}
.hero__chips b{color:var(--red);font-weight:900;margin-left:.3em}
.hero__in{display:flex;flex-direction:column}
.hero__copy{display:contents}
.hero__copy .lead{order:1;align-self:flex-start}.hero__h1{order:2}.hero__art{order:3}.hero__sub{order:4}.hero__chips{order:5}.hero__cta{order:6}
.hero__cta{margin:16px -18px 0;background:var(--ink);padding:14px 16px 16px;text-align:center}
.hero__cta .hero__link{color:#fff}
.hero__link{display:inline-block;margin-top:12px;font-size:14px;font-weight:900;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--red);padding-bottom:2px}
.hero__link::after{content:" →";color:var(--red)}
.hero__art{margin-top:6px}
.hero .stage{margin:10px -4px 0}
.btn--y{background:var(--yel);color:var(--ink);box-shadow:0 4px 0 var(--yel-d)}
.btn--y::after{border-color:var(--ink)}

/* 実績の帯（墨色） */
.proof{margin-top:14px;background:var(--ink);color:#fff;padding:18px 16px 20px}
.proof__ttl{text-align:center;font-weight:900;font-size:15px;letter-spacing:.04em}
.proof__ttl::before,.proof__ttl::after{content:"＼";color:var(--yel);margin:0 .4em}
.proof__ttl::after{content:"／"}
.proof__list{max-width:1200px;margin:12px auto 0;display:grid;gap:8px}
.proof__list li{background:#fff;color:var(--ink);border-radius:8px;padding:10px 14px;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;border-top:4px solid var(--red)}
.proof__list small{width:100%;font-size:12.5px;font-weight:700;color:var(--ink2)}
.proof__list b{font-weight:900;font-size:16px}
.proof__list b em{font-style:normal;font-family:var(--f-n);font-size:34px;color:var(--red);margin:0 2px;line-height:1}
.proof__list span{font-weight:900;font-size:15px}

/* スマホの下: 黄色のボタン（LPと同じ墨色の帯） */
.hero__in + .proof{margin-top:0}

/* パソコン: 左に言葉・右に赤い板の2列 */
@media (min-width:1024px){
  .pc{display:inline}
  .gh__in{height:68px;padding:0 32px}
  .gh__logo strong{font-size:26px}
  .gh__nav{display:flex}
  .gh__btn{margin-left:8px}
  .hero__copy{display:block}
  .hero__cta{margin:22px 0 0;background:none;padding:0;text-align:left}
  .hero__cta .hero__link{color:var(--ink)}
  .hero__in{display:grid;grid-template-columns:1fr 520px;gap:40px;align-items:center;padding:44px 32px 36px}
  .hero__h1 .l1{font-size:44px}
  .hero__h1 .l2{font-size:84px}
  .hero__h1 .l3{font-size:58px}
  .hero__sub{font-size:17px;margin-top:20px}
  .hero__chips{flex-direction:row;flex-wrap:wrap;gap:8px}
  .hero__chips li{font-size:13.5px}
  .hero__cta{display:flex;align-items:center;gap:22px;margin-top:22px}
  .hero__cta .btn{width:330px}
  .hero__link{margin-top:0}
  .hero__art{margin-top:0}
  .hero .stage{height:528px;margin:0}
  .hero .fuki{font-size:14px}
  .hero .sheet{left:18px;top:18px;width:184px;padding:14px 14px 14px}
  .hero .sheet p{font-size:19px}
  .hero .hanko{width:80px;height:80px}
  .proof{padding:22px 32px 26px}
  .proof__list{grid-template-columns:repeat(3,1fr);gap:16px}
  .proof__list li{padding:12px 18px}
}
.nw{white-space:nowrap}