.section-notes {
  background: linear-gradient(180deg, var(--gray-800), var(--gray-700));
}
.notes-grid {
  display: grid; gap: 18px;
  grid-template-columns: repeat(3, 1fr);
}
.note-card {
  background: linear-gradient(180deg, #1c1e22, #16181b);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 18px;
  padding: 20px;
  box-shadow: var(--shadow);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.note-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 40px rgba(0,0,0,0.4);
  border-color: rgba(255,215,0,0.35);
}
.note-card h3 {
  margin: 0 0 8px; font-size: 18px; color: var(--gold);
}
.note-card p { margin: 0; color: var(--text); }
.note-card .em { color: var(--gold); }

@media (max-width: 1024px) { .notes-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .notes-grid { grid-template-columns: 1fr; } }

/* ===== Notice section (ご注意ください) ===== */
.section-notes {
  background: linear-gradient(180deg, var(--gray-800), var(--gray-700));
}

.notice-underline {
  display: grid;
  place-items: center;
  margin: 8px 0 28px;
}
.notice-underline .bar {
  width: 160px;
  height: 2px;
  background: linear-gradient(90deg, rgba(255,255,255,0), var(--gold), rgba(255,255,255,0));
  box-shadow: 0 0 18px rgba(255,215,0,0.35);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .9s cubic-bezier(.2,.8,.2,1) .1s;
}
.notice-underline.reveal.in-view .bar { transform: scaleX(1); }

.notice-body {
  color: var(--text);
  font-size: clamp(15px, 2vw, 16px);
  line-height: 1.9;
}
.notice-body p { margin: 0 0 14px; }
.notice-body strong { color: var(--text); font-weight: 700; }

/* PC/モバイル切替 */
.only-desktop { display: block; }
.only-mobile  { display: none; }

.br-desktop br { display: inline; }

@media (max-width: 768px) {
  .only-desktop { display: none; }
  .only-mobile  { display: block; }
  .br-desktop br { display: none; } /* スマホでは改行を抑制 */
}

/* 既存のreveal（スクロール出現）に馴染む微調整 ※任意 */
.notice-body .reveal { transition-delay: .1s; }
.notice-body .reveal:nth-of-type(2) { transition-delay: .2s; }
.notice-body .reveal:nth-of-type(3) { transition-delay: .3s; }
.notice-body .reveal:nth-of-type(4) { transition-delay: .4s; }
.notice-body .reveal:nth-of-type(5) { transition-delay: .5s; }
.notice-body .reveal:nth-of-type(6) { transition-delay: .6s; }

/* ===== Notes: readability boost (2ページ目のみ) ===== */

/* 背景の黒オーバーレイを少し濃くして可読性UP（3ページ目には影響しない） */
.notes-overlay{
  background:
    radial-gradient(1200px 600px at 90% 10%, rgba(255,255,255,0.08), transparent 60%),
    linear-gradient(to bottom, rgba(0,0,0,0.20), rgba(0,0,0,0.40));
}

/* コンテナ幅を少し広げ、中央寄せを保持 */
.section-notes .container.narrow { max-width: 980px; }

/* 本文全体を半透明のガラス風カードに（HTML変更なしでOK） */
.section-notes .notice-body{
  position: relative;
  margin: 0 auto;
  padding: clamp(20px, 3.5vw, 36px) clamp(20px, 3.5vw, 40px);
  border-radius: 18px;
  background: rgba(0,0,0,0.42);                /* 透過黒 */
  border: 1px solid rgba(255,255,255,0.06);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 20px 60px rgba(0,0,0,0.35);
}

/* テキストを白寄りに・軽いシャドウで読みやすく */
.section-notes .notice-body p{
  color:#fff;
  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
  font-size: clamp(16px, 2.2vw, 18px);
  line-height: 1.95;
  letter-spacing: .02em;
  margin: 0 0 14px;
}

/* 見出し下のバーも気持ち強めに（長さ・光り） */
.section-notes .notice-underline .bar{
  width: 190px;
  height: 2px;
  background: linear-gradient(90deg, rgba(255,255,255,0), var(--gold), rgba(255,255,255,0));
  box-shadow: 0 0 22px rgba(255,215,0,0.5);
}

/* モバイル最適化 */
@media (max-width: 768px){
  .section-notes .notice-body{
    padding: 18px 16px;
    border-radius: 14px;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
  }
  .section-notes .notice-body p{
    font-size: 16px;
    line-height: 1.95;
  }
}

/* Safari等で backdrop-filter が無い場合のフォールバック */
@supports not ((-webkit-backdrop-filter: blur(4px)) or (backdrop-filter: blur(4px))){
  .section-notes .notice-body{ background: rgba(0,0,0,0.62); }
}