/* sp-lib-nav — 元は各HTML内の<style>ブロック（102ページで使用） */
@media (max-width:920px){
  /* カテゴリタブ6個：2列×3段で整列（重なり解消） */
  /* ヘッダー枠：高さ固定を解除（説明文がタブに重なる問題の解消） */
  #s_header,#s_header-inner{width:auto !important;height:auto !important;overflow:visible !important;padding:14px 8px 6px !important}
  #s_header-inner h1,#s_header-inner h2{float:none !important;margin:0 0 6px !important;text-align:center !important}
  #s_header-inner img{display:inline-block}
  .s_navi{width:auto !important;margin:0 0 16px !important}
  .s_navi ul{width:auto !important;height:auto !important;overflow:visible !important;
    display:flex !important;flex-wrap:wrap;justify-content:center;gap:6px}
  .s_navi li{float:none !important;width:150px !important;height:40px !important}
  .s_navi li a{width:150px !important;height:40px !important}
  /* 本文背景：色帯付き画像を無地に置き換え（文字の読みやすさ改善） */
  #s01_contents,#s02_contents,#s03_contents,#s04_contents,#s05_contents,#s06_contents{
    background:#ffffff !important}
  #s_main_list,#s_main_detail{background:#ffffff !important;width:auto !important;padding:0 10px !important}
  #s_main_detail-inner{width:auto !important}
  /* 本文の文字を拡大 */
  #s_main p,#s_main li,#s_main td,#s_main dd,#s_main dt{font-size:16px !important;line-height:1.9 !important}
  #s_detail_text{padding:16px 6px 10px !important}
  #s_detail_text p{text-indent:0 !important}
  #s_detail_comment_text{padding:18px 12px 10px !important}

  /* ★2026-08-12：体験談一覧を1件ずつカード枠で区切る（PC版と同じ見え方に）
     ・背景をうすいベージュに戻し、各体験談を白いカードとして浮かせる
     ・PC用の「破れ紙」上端画像はスマホでは枠と重複するため非表示 */
  #s_main_list{background:#F5F2E9 !important;padding:12px 10px 2px !important}
  #s_main_list .s_list{float:none !important;width:auto !important;
    margin:0 0 14px !important;padding:0 !important}
  #s_main_list .s_list_top{display:none !important}
  #s_main_list .s_list_box{width:auto !important;margin:0 !important;
    padding:14px 16px 12px !important;background:#FFFFFF !important;
    border:1px solid #DFD8C6;border-radius:8px;
    box-shadow:0 1px 3px rgba(0,0,0,.07)}
  #s_main_list .s_list_box-inner{width:auto !important}
}


/* ============================================================
   ★2026-08-13：スマホの本文を読みやすく
   ・文字を 16px → 17.5px
   ・文字色を #4D4D4D → #3A3A3A（満月カウンセリングと同じ濃さ）
   対象：shinga_library の list01〜06 と detail 全96ページ
============================================================ */
@media screen and (max-width: 920px) {
	/* 体験談の本文（詳細ページ） */
	#s_detail_text p,
	#s_detail_comment_text p,
	#s_main_detail td,
	#s_main_detail th,
	#s_main_detail td li,
	#s_main_detail ul li,
	/* 体験談カードの本文（一覧ページ）
	   ※sp-content-fix.css の #S_main p{font-size:16px !important} に
	     打ち勝つよう、ID を含めて指定を強くしている */
	#s_main .s_list_box-inner p,
	#s_main .s_list_box-inner li,
	#s_main_list .s_list_box-inner p,
	#s_main_list .s_list_box-inner li,
	#s_main #s_main-inner p,
	#s_main #s_main-inner li {
		font-size: 17.5px !important;
		line-height: 1.9;
	}

	/* 文字色を濃く（個別に色を指定している見出し・リンクはそのまま） */
	#s_main,
	#s_main_detail,
	#s_main_list,
	#s_detail_comment,
	.s_list_box-inner {
		color: #3A3A3A;
	}

	/* 体験者の属性表記（Ｍ．Ｔ（４８）千葉 健康食品販売業 など）は小さめのまま */
	#s_main_detail div[id$="_title"] p {
		font-size: 15px !important;
	}
}


/* ------------------------------------------------------------
　　★2026-08-13：スマホの左右の余白を圧縮して本文の幅を広げる
　　（#s_main 15 + #s_main_list 10 + カード16 = 左右41px あった）
------------------------------------------------------------ */
@media screen and (max-width: 920px) {
	#s_main { padding-left: 10px !important; padding-right: 10px !important; }
	#s_main_list { padding-left: 0 !important; padding-right: 0 !important; }
	#s_main_detail,
	#s_main_detail-inner,
	#s_detail_comment { padding-left: 5px !important; padding-right: 5px !important; }
}

/* ------------------------------------------------------------
　　★2026-08-13：体験談の段落と段落のあいだに空きを作る
　　　base.css で #s_detail_text p{margin:0} となっており、
　　　段落が0pxで詰まって一続きの文章に見えていた。
　　　（PC・スマホ共通。HTMLは変更していない）
------------------------------------------------------------ */
#s_detail_text p,
#s_detail_comment_text p {
	margin-bottom: 1.1em;
}
#s_detail_text p:last-child,
#s_detail_comment_text p:last-child {
	margin-bottom: 0;
}

/* ------------------------------------------------------------
　　★2026-08-17：一覧ページ（list01〜06）の「歯抜け」解消
　　　カードは float:left で並んでおり、高さが揃わない
　　　（254px と 277px が混在）ため、背の高いカードに
　　　次のカードが引っかかって左側が空くことがあった。
　　　PC・タブレットでは2列のグリッドに変更して、
　　　どのカードも必ず左右そろって並ぶようにする。
　　　※920px以下は既存の1列表示のまま
------------------------------------------------------------ */
@media screen and (min-width: 921px) {
	#s_main_list-inner {
		display: grid;
		grid-template-columns: 1fr 1fr;
		align-items: start;
		overflow: visible;
	}
	#s_main_list-inner .s_list {
		float: none;
		width: auto;
	}
}