/* 先頭見出し（中央ぞろえ + 網掛け） */
.page-heading{
  text-align:center;
  margin:0 0 20px;
  padding:18px 16px;
  font-size:clamp(22px,4vw,40px);
  font-weight:800;
  letter-spacing:.04em;
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow);
  background:
    repeating-linear-gradient(
      45deg,
      #f1f5f9,
      #f1f5f9 10px,
      #ffffff 10px,
      #ffffff 20px
    );
}

.hero{
  background:linear-gradient(115deg,rgba(16,185,129,.12),rgba(6,182,212,.12));
  border:1px solid var(--border);
  border-radius:20px;
  padding:34px 28px;
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
}
.hero::after{
  content:"";
  position:absolute;
  right:-60px;top:-60px;
  width:200px;height:200px;
  background:radial-gradient(circle at center, rgba(16,185,129,.18), rgba(16,185,129,0) 60%);
  filter:blur(4px);
}
.title{margin:0 0 6px;font-size:clamp(24px,3.5vw,40px);font-weight:800;letter-spacing:.02em}
.subtitle{margin:0;color:var(--muted);font-size:clamp(14px,2.2vw,18px)}
.tag{
  display:inline-block;margin-top:14px;padding:6px 12px;border-radius:999px;
  background:#ecfdf5;color:#065f46;font-weight:600;font-size:13px;border:1px solid #d1fae5;
}

section{margin-top:36px}
h2{
  font-size:clamp(18px,2.6vw,24px);
  margin:0 0 14px;
  display:flex;align-items:center;gap:10px;
}
h2 .dot{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:inline-block}
p{margin:0 0 12px}
ul,ol{margin:10px 0 0 1.2em;padding:0}
li{margin:.3em 0}

.note{
  background:#f8fafc;border:1px solid var(--border);border-radius:var(--radius);
  padding:16px 18px;color:#0f172a
}

.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:18px;
}
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  padding:16px 16px 14px;
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
}
.card .label{
  display:inline-flex;align-items:center;gap:8px;
  font-weight:700;margin-bottom:6px;font-size:16px;
}
.card .emoji{font-size:20px}
.em{
  font-weight:800;color:#065f46;background:#ecfdf5;border:1px solid #d1fae5;
  padding:6px 10px;border-radius:10px;display:inline-block;margin-top:10px
}

.steps{counter-reset:step}
.step{
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  padding:14px 16px;box-shadow:var(--shadow);display:flex;gap:12px;align-items:flex-start
}
.step + .step{margin-top:10px}
.step::before{
  counter-increment:step;content:counter(step);
  flex:0 0 auto;display:inline-grid;place-items:center;
  width:28px;height:28px;border-radius:50%;
  color:#fff;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent-2));
  margin-top:2px
}

.muted{color:var(--muted)}
.footer{margin-top:28px;font-size:14px;color:var(--muted)}

li.blue{ color:#0000FF; }  /* 文字色だけ変わる */
span.blue{ color:#0000FF; }  /* 文字色だけ変わる */

/* スマホ最適化の追加CSS /
/ 画像や長いURLのはみ出し防止 */
html{-webkit-text-size-adjust:100%}
body{overflow-wrap:anywhere}
img,svg,video{max-width:100%;height:auto;display:block}
a{word-break:break-word}

/* iPhoneのノッチ安全域 */
@supports(padding:max(0px)){
  .wrap{
    padding-left:max(20px, env(safe-area-inset-left));
    padding-right:max(20px, env(safe-area-inset-right));
    padding-top:max(32px, env(safe-area-inset-top));
    padding-bottom:max(64px, env(safe-area-inset-bottom));
  }
}

/* 〜640pxでのレイアウト最適化 */
@media (max-width:640px){
  .wrap{padding:20px 14px 56px}
  .page-heading{
    margin:8px 0 16px;
    padding:12px;
    font-size:clamp(20px,6vw,28px);
    border-radius:12px;
  }
  .hero{padding:20px 16px;border-radius:16px}
  .title{font-size:clamp(20px,6vw,28px)}
  .subtitle{font-size:14px}
  h2{font-size:18px;gap:8px}
  .grid{grid-template-columns:1fr;gap:12px}
  .card{padding:14px}
  .steps .step{padding:12px;gap:10px}
  .step::before{width:24px;height:24px;font-size:12px}
  ul,ol{margin-left:1em}
  .tag{margin-top:10px;padding:8px 12px;font-size:12px}
}

/* h2 見出し：薄いグレー（ベタ） */
h2{
  background:#f3f4f6;
  background-image:none;     /* 以前の網掛けが残っても打ち消す保険 */
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:10px 12px;
}

/* 応募フォーム ボタン画像 */
.btn-apply{
  display:inline-flex;
  align-items:center;
  margin-left:8px;     /* 「フォームはこちらから：」との間隔 */
  text-decoration:none;/* 画像リンクの下線を消す */
}
.btn-apply img{
  height:40px;         /* ボタンの見た目サイズ（調整可） */
  width:auto;
  display:block;
  vertical-align:middle;
}
@media (max-width:640px){
  .btn-apply img{ height:36px; 
}
}