/* PRÉLUDE 2026.10.31 | 特集記事のスマホ表示崩れ修正
   - 旧テンプレート記事（美顔器・毛穴・敏感肌・抜け毛・頭皮のベタつき・美容の間違い8選）の余白・関連アイテム・パンくずを他の特集と揃える
   - 旧テンプレート記事に共通フッターを追加（フッター用スタイルをここに同梱）
   - 全特集：比較カードの「まとめ買いリストに入れる」が360px幅でも1行に収まるように
   商品画像・A8リンク・広告コードには触れません。 */

/* ---------- 共通フッター（site.css を読み込まないページ用に同梱） ---------- */
.pst-footer .site-wrap{max-width:1400px;margin:auto;padding:0 clamp(16px,3vw,42px)}
.pst-footer{background:#f4ebe8;border-top:1px solid #ddcec6;padding:50px 0 22px;margin-top:60px;color:#4b3d38;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",system-ui,sans-serif}
.pst-footer .footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}
.pst-footer .footer-logo{font:34px/1.4 "Cormorant Garamond",Georgia,serif;letter-spacing:.18em;color:#75545e}
.pst-footer .footer-grid small,.pst-footer .footer-grid p{font-size:11px;line-height:2.2;color:#78685e;margin:0 0 6px}
.pst-footer .footer-grid h3{font-size:12px;letter-spacing:.1em;margin:0 0 8px;font-weight:600;border:0;padding:0;font-family:inherit}
.pst-footer .footer-grid a{display:block;font-size:11px;padding:3px 0;color:#726056;text-decoration:none}
.pst-footer .footer-bottom{font-size:10px;border-top:1px solid #dbc9bd;margin-top:33px;padding-top:17px;color:#826f65;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media(max-width:760px){
  .pst-footer .footer-grid{grid-template-columns:1fr 1fr;gap:16px}
  .pst-footer .footer-grid>div:first-child{grid-column:span 2}
}
/* フッター直前の余白を詰める（旧テンプレートは下余白が大きいため） */
.deep-story,main.wrap,main.guide{margin-bottom:0!important;padding-bottom:30px!important}

/* ---------- 全特集：比較カードのボタン ---------- */
@media(max-width:560px){
  .pb-row .bl-add{letter-spacing:0;padding-left:8px;padding-right:8px;font-size:12px}
}

/* ---------- 旧テンプレート（.deep-story / 頭皮 main.wrap / 8選 main.guide） ---------- */
@media(max-width:560px){
  /* 横余白を他の特集と同じ16pxに */
  .deep-story{padding:0 16px!important;margin-top:22px!important}
  main.wrap{padding-left:16px!important;padding-right:16px!important;padding-top:22px!important}
  .deep-story>.back:first-child,main.wrap>.back:first-child{margin:0 0 18px}

  /* パンくず・ラベルが「美容家／電」のように単語の途中で切れないように */
  .deep-story .kicker,main.wrap .tag{word-break:keep-all;overflow-wrap:anywhere;line-height:1.9}

  /* 見出しの1〜2文字だけの改行を減らす（対応ブラウザのみ） */
  .deep-story h1,.deep-story h2,main.wrap h1,main.wrap h2,main.guide h1,main.guide h2,.mind-article h1{text-wrap:pretty}

  /* 関連アイテム：2列＋1つだけ余る並びをやめ、サムネイル付きの1列リストに */
  .deep-story .related{grid-template-columns:1fr!important;gap:8px!important}
  .deep-story .related a{display:grid!important;grid-template-columns:64px minmax(0,1fr);gap:12px;align-items:center;padding:10px!important;font-size:13px!important;line-height:1.7!important}
  .deep-story .related img{width:64px!important;margin:0!important}
}
