/* ===== Red on White: Text-Only Layout ===== */
:root{
  --bg:#ffffff;        /* 背景 */
  --text:#222;         /* 本文色 */
  --muted:#666;        /* 補助テキスト */
  --red:#D32F2F;       /* 主要赤 */
  --red-deep:#B71C1C;  /* 見出し/強調用の濃い赤 */
  --red-weak:#FFF5F5;  /* 薄赤の背景 */
  --border:#E5E7EB;    /* 罫線 */
  --maxw:860px;
  --radius:10px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font:16px/1.9 "Noto Sans JP", system-ui, -apple-system, Segoe UI, Roboto,
       "Hiragino Kaku Gothic ProN","Hiragino Sans", Meiryo, sans-serif;
}

/* メインコンテナ（文章のみ想定） */
main{
  max-width:var(--maxw);
  margin:32px auto 64px;
  padding:0 20px;
}

/* 見出し */
h1,h2,h3{color:#111; letter-spacing:.02em}
h1{font-size:clamp(24px,4.6vw,34px); margin:0 0 20px}
h2{
  font-size:clamp(20px,3.4vw,26px);
  margin:36px 0 10px;
  padding-left:.75em;
  border-left:6px solid var(--red);
}
h3{font-size:clamp(17px,2.6vw,20px); margin:24px 0 6px; color:var(--red-deep)}

p{margin:10px 0 16px}

/* 箇条書き */
ul{padding-left:1.3em; margin:6px 0 18px}
li{margin:.4em 0}
ul li::marker{color:var(--red)}

/* リンク */
a{color:var(--red); text-decoration:underline; text-underline-offset:.15em}
a:hover{opacity:.92}
a:focus-visible{outline:3px solid var(--red); outline-offset:2px}

/* 強調 */
strong{color:var(--red-deep)}
mark{background:var(--red-weak); padding:.08em .24em}

/* CTA（HTML変更なしで拡大＆中央配置） */
.cta,
a[href*="regapuri.php"]{
  display:block;
  width:clamp(260px, 80%, 420px); /* 端末幅に応じて伸縮 */
  margin:16px auto 24px;          /* 中央寄せ */
  text-align:center;
  background:var(--red);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  font-size:1.125rem;             /* 文字サイズUP */
  border:1px solid transparent;
  border-radius:999px;             /* 大きめピル形状 */
  padding:1rem 1.6rem;             /* 余白UP */
}
.cta:hover,
a[href*="regapuri.php"]:hover{ filter:saturate(112%) }
.cta:focus-visible,
a[href*="regapuri.php"]:focus-visible{
  outline:none; box-shadow:0 0 0 3px #fff, 0 0 0 6px var(--red);
}

/* 画面が広い時はさらに大きく */
@media (min-width: 768px){
  .cta,
  a[href*="regapuri.php"]{
    font-size:1.25rem;
    padding:1.1rem 2rem;
    width:clamp(300px, 38vw, 520px);
  }
}

/* 「18才未満禁止」を中央寄せ（HTML変更不要） */
p > strong:only-child{
  display:block;
  text-align:center;
}



/* 区切り & フッター */
hr{border:0; border-top:1px solid var(--border); margin:28px 0}
footer{border-top:1px solid var(--border); color:var(--muted); margin-top:40px; padding-top:20px}
small{color:var(--muted)}
/* ===== End ===== */


/* Header image (テキスト主体デザインに沿って、画像だけ表示) */
.hero{
  margin:0 0 24px;
}
.hero img{
  display:block;
  width:100%;
  max-width:1100px;   /* 本文幅に合わせて中央寄せ */
  height:auto;
  margin:0 auto;
  border-radius:10px; /* 角丸。不要なら削除 */
}

/* もう少し余白が欲しい場合 */
@media (min-width: 768px){
  .hero{ margin-bottom:32px; }
}

/* ※赤い枠線を付けたい時だけ有効化
.hero img{ border:4px solid var(--red); }
*/

/* 画像ブロック（ボタン直後用） */
figure.hero{ margin:20px auto 24px; }
figure.hero img{
  display:block;
  width:100%;
  max-width:1100px;   /* 本文幅に合わせて中央寄せ */
  height:auto;
  border-radius:10px; /* 角丸不要なら削除 */
}