/* ============================================================
   symptoms-shoulder.css — 肩痛ページ専用スタイル
   ベース: symptoms-lowback.css（lb-* クラス）を継承
   追加: sh-* クラスで肩痛専用レイアウトを定義
============================================================ */

/* ===== チェックリスト：読みやすさ優先グリッド ===== */
.sh-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.8rem;
  margin: 2rem 0 2rem;
}

@media (max-width: 680px) {
  .sh-check-grid {
    grid-template-columns: 1fr;
  }
}

/* チェック項目の文字・行間 */
.sh-check-grid .lb-checklist li {
  font-size: 15px;
  line-height: 1.85;
  letter-spacing: 0.02em;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: strict;
}

/* ===== ボディポイント：5カラム対応 ===== */
.sh-points-grid {
  grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 900px) {
  .sh-points-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 560px) {
  .sh-points-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== 骨折・脱臼注意書き（黄色系） ===== */
.sh-fracture-notice {
  margin-top: 1rem;
  border-left: 3px solid var(--c-gold);
  background: rgba(212, 175, 80, 0.06);
}

.sh-fracture-notice p {
  color: #5a4a1a;
}
