/* ============================================================================
   2026-06-18 スマホUI 全ページ統一（たけさん指示）
   トップ(post-top.php)で実装した sticky ヘッダー / 検索バー / カテゴリタブ /
   Yahoo!風記事リストを、カテゴリ・タグ・検索・記事個別など全ページに適用する。
   フロントは post-top.php のinlineが優先（同値なので競合なし）。すべて @media<=768px。
   ============================================================================ */
@media (max-width:768px){
  /* --- sticky スクロール挙動：ロゴ+ハンバーガーは流して消す、検索+タブを上部固定 --- */
  #masthead.site-header{ position:static !important; height:auto !important; }
  .site-header-main{ position:relative !important; }
  .openbtn1{ position:absolute !important; top:0 !important; right:0 !important; z-index:5 !important; }
  html{ overflow-x:clip !important; }
  body{ overflow:visible !important; overflow-x:clip !important; }
  /* 旧・固定ヘッダー用オフセットを解除（masthadが流れる方式に変更したため） */
  #content.site-content_single{ margin-top:0 !important; }

  /* --- 検索バー＋カテゴリタブ（sticky固定） --- */
  .uc-mb{ display:block; background:#fff; position:sticky; top:env(safe-area-inset-top,0px); z-index:600; box-shadow:0 2px 6px rgba(0,0,0,.06); }
  .uc-mb-search{ padding:8px 12px; }
  .uc-mb-search form{ display:flex; align-items:center; height:46px; background:#f1f2f4; border:1px solid #e2e4e8; border-radius:10px; padding:0 4px 0 12px; margin:0; }
  .uc-mb-mag{ width:18px; height:18px; fill:#9aa1ad; flex:0 0 auto; }
  .uc-mb-search input[type="search"]{ flex:1; min-width:0; border:0; outline:0; background:transparent; font-size:15px; margin-left:8px; color:#333; -webkit-appearance:none; }
  .uc-mb-go{ flex:0 0 auto; border:0; background:#2bb8c2; color:#fff; font-size:14px; font-weight:700; padding:7px 15px; border-radius:6px; }
  .uc-mb-tabs{ display:flex; overflow-x:auto; -webkit-overflow-scrolling:touch; background:#fff; border-top:1px solid #eceef1; border-bottom:1px solid #eceef1; }
  .uc-mb-tabs::-webkit-scrollbar{ display:none; }
  .uc-mb-tabs a{ flex:0 0 auto; position:relative; padding:9px 11px; font-size:13px; font-weight:600; color:#444; text-decoration:none; white-space:nowrap; }
  .uc-mb-tabs a + a::before{ content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); height:16px; width:1px; background:#e2e4e8; }
  .uc-mb-tabs a.on{ color:#0e8c97; font-weight:700; box-shadow:inset 0 -3px 0 #2bb8c2; }

  /* --- Yahoo!風 記事リスト（全テンプレ共通：li.archive を完全gridで定義） --- */
  #main .archiveWrap{ display:block !important; margin:0 !important; padding:0 !important; width:auto !important; }
  #main li.archive{ width:100% !important; margin:0 !important; padding:0 !important; list-style:none; border-bottom:1px solid #f0f1f3; background:#fff; }
  #main li.archive .article-link{ display:grid !important; grid-template-columns:130px 1fr !important; grid-template-areas:"cat cat" "thumb content" !important; column-gap:12px; align-items:start; padding:11px 12px; text-decoration:none; }
  #main li.archive figure{ grid-area:thumb !important; width:130px !important; height:82px !important; min-height:0 !important; margin:0 !important; border-radius:6px; overflow:hidden; background-color:#eef2ff; background-size:cover !important; background-position:center !important; background-repeat:no-repeat; align-self:start; }
  #main li.archive figure.uc-mb-thumb{ background-image:var(--uc-thumb) !important; }
  #main li.archive figure.uc-mb-thumb img{ display:none !important; }
  #main li.archive figure img{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:center !important; display:block; }
  #main li.archive .cat{ grid-area:cat !important; justify-self:start; align-self:start; display:inline-block; margin:0 0 2px !important; padding:0 !important; background:transparent !important; background-color:transparent !important; border:0 !important; color:#0e8c97 !important; font-size:12.5px !important; line-height:1.4 !important; font-weight:700; border-radius:0 !important; }
  #main li.archive .entry-content{ grid-area:content !important; display:flex; flex-direction:column; min-width:0; padding:0; }
  #main li.archive .entry-content .entry-title-new{ order:1; margin:0 !important; font-size:16px !important; line-height:1.55 !important; font-weight:600; color:#1a1d26; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  #main li.archive .entry-content .date{ order:2; margin:5px 0 0 !important; font-size:12px; color:#9aa1ad; }

  /* --- アーカイブ見出しはスマホで控えめに（h1/h2を1行圧縮、説明文は非表示） --- */
  #main .page_title, #main .page-title{ font-size:18px !important; margin:14px 12px 4px !important; padding:0 !important; line-height:1.4 !important; }
  #main .page-header{ padding:0 !important; border:0 !important; margin:0 !important; }
  #main .taxonomy-description{ display:none !important; }
  #main .breadcrumbs{ font-size:11px; padding:6px 12px 0 !important; }
}