/*
Theme Name: SYN Ownd Child
Template: syn-ownd
Theme URI: https://syn.design/
Author: 株式会社ウェブライダー
Author URI: https://web-rider.jp/
Description: SYN Ownd の子テーマ
Version: 1.0.0
Text Domain: syn-ownd-child
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/
@charset "utf-8";
/* トップの新着／人気のビュー数バッジを確実に上書き */
.home .common-list__view,
.home .widget-post__view,
.home .is-type-thumb .common-list__view,
.home .is-type-thumb .widget-post__view,
.home [class*="__view"],
.home [class*="-view"],
.home .view,
.home .views,
.home .meta-view,
.home .post-view,
.home .post-views {
  position: relative !important;
  display: inline-block !important;
  color: #111 !important;
  background: rgba(255,255,255,0.85) !important;
  background-image: none !important;
  border-radius: 6px !important;
  padding: 2px 8px !important;
  font-weight: 600 !important;
  font-size: 0.9em !important;
  box-shadow: 0 0 4px rgba(0,0,0,0.3) !important;
  z-index: 2 !important;
}

/* 子要素・疑似要素・SVGの塗りまで一括上書き */
.home .common-list__view *,
.home .widget-post__view *,
.home [class*="__view"] *,
.home [class*="-view"] *,
.home .view *,
.home .views * {
  color: #111 !important;
  fill: #111 !important;
  stroke: #111 !important;
}

/* 擬似要素（背景で上書きされるケース） */
.home .common-list__view::before,
.home .common-list__view::after,
.home .widget-post__view::before,
.home .widget-post__view::after,
.home [class*="__view"]::before,
.home [class*="-view"]::before,
.home .view::before,
.home .views::before,
.home [class*="__view"]::after,
.home [class*="-view"]::after,
.home .view::after,
.home .views::after {
  content: "" !important;
  background: rgba(255,255,255,0.0) !important; /* 覆い消し */
  box-shadow: none !important;
}

/* トップのレビュー数を確実に上書き（comomon-list_view 版）*/
.home p.comomon-list_view,
.home p.comomon-list_view *,
.home p.comomon-list_view::before,
.home p.comomon-list_view::after {
  color: #111 !important;
  background: rgba(255,255,255,0.88) !important;
  border-radius: 6px !important;
  padding: 2px 8px !important;
  font-weight: 600 !important;
  font-size: 0.9em !important;
  box-shadow: 0 0 4px rgba(0,0,0,0.3) !important;
  background-image: none !important;
  position: relative !important;
  display: inline-block !important;
  z-index: 2 !important;
}
/* ───────────────────────────────
   よく読まれている記事：スマホ専用 重なり強制解除（子テーマ版）
   ─────────────────────────────── */
@media screen and (max-width: 768px) {
  /* views（閲覧数）を通常フローに戻す */
  .widget-post_imgarea [class*="views"],
  .widget-post_imgarea .wpp-views,
  .widget-post_imgarea .widget-post_view {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    display: inline-block !important;
    margin-top: 0.4em !important;
    margin-left: 0 !important;
    z-index: auto !important;
  }

  /* 各記事カードを独立させる */
  .widget-post_item {
    display: block !important;
    position: relative !important;
    overflow: visible !important;
    height: auto !important;
    margin-bottom: 2em !important;
  }

  /* flex/gridを無効化して通常縦積みに */
  .widget-post.is-type-thumb {
    display: block !important;
  }
}
/* =======================================================
   よく読まれている記事：スマホ専用 最終レイアウト修正（完全版）
   ======================================================= */
@media screen and (max-width: 768px) {
  /* ▼ 閲覧数バッジを通常行に戻す */
  .widget-post.is-type-thumb .widget-post_imgarea [class*="views"],
  .widget-post.is-type-thumb .widget-post_imgarea .wpp-views,
  .widget-post.is-type-thumb .widget-post_imgarea .widget-post_view {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    display: inline-block !important;
    margin-top: 0.4em !important;
    z-index: 2 !important;
  }

  /* ▼ テキストエリアを通常フローに戻す */
  .widget-post.is-type-thumb .widget-post_txtarea {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    background: transparent !important;
    padding: 0 !important;
    margin-top: 8px !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
  }

  /* ▼ サムネとテキストを縦に並べる */
  .widget-post.is-type-thumb .widget-post_item > a.widget-post_link {
    display: block !important;
  }

  /* ▼ サムネイル画像の位置と比率を安定化 */
  .widget-post.is-type-thumb .widget-post_imgarea {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    position: relative !important;
    overflow: visible !important;
    margin-bottom: 0.6em !important;
  }

  /* ▼ 各カードを独立化して余白を確保 */
  .widget-post.is-type-thumb .widget-post_item {
    position: relative !important;
    overflow: visible !important;
    height: auto !important;
    margin-bottom: 1.8em !important;
  }
}

/* 強制再読み込み防止キャッシュバスター */
body::after { content: "ver2025-11-10"; display: none; }

/* スマホで4位と5位の閲覧数が重なる場合の最終余白固定 */
@media screen and (max-width: 768px) {
  .widget-post.is-type-thumb .widget-post_item {
    margin-bottom: 2.4em !important;
  }
}

/* ── スマホ：よく読まれている記事の 4位↔5位 重なりを確実解消 ── */
@media (max-width: 768px) {
  /* リスト自体を縦並び＆行間を明示 */
  .widget-post.is-type-thumb ul.widget-post_list {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;          /* 行間を確保 */
  }

  /* 各行（li）の余白と衝突要素の初期化 */
  .widget-post.is-type-thumb ul.widget-post_list > li.widget-post_item {
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  /* 念のための下余白（gapが効かない環境向け保険） */
  .widget-post.is-type-thumb ul.widget-post_list > li.widget-post_item + li.widget-post_item {
    margin-top: 28px !important;
  }

  /* 画像エリアやテキストエリアは通常フローへ */
  .widget-post.is-type-thumb .widget-post_imgarea,
  .widget-post.is-type-thumb .widget-post_txtarea {
    position: static !important;
    overflow: visible !important;
  }

  /* 閲覧数バッジは行内表示に固定 */
  .widget-post.is-type-thumb .widget-post_imgarea [class*="views"],
  .widget-post.is-type-thumb .wpp-views,
  .widget-post.is-type-thumb .widget-post__view,
  .widget-post.is-type-thumb .common-list__view {
    position: static !important;
    display: inline-block !important;
    margin-top: .35em !important;
  }

  /* ランク丸数字などの見出し要素が上に被さらないよう初期化 */
  .widget-post.is-type-thumb .widget-post_rank,
  .widget-post.is-type-thumb [class*="rank"] {
    top: 8px !important;
    left: 8px !important;
    transform: none !important;
  }
}
/* ───────── スマホ：人気記事ウィジェットを“素の縦並び”に初期化 ───────── */
@media (max-width: 768px) {
  /* リスト自体を block に戻し、行間は margin で確保 */
  .widget-post.is-type-thumb ul.widget-post_list {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* 各アイテムは block + 下に確実な余白 */
  .widget-post.is-type-thumb ul.widget-post_list > li.widget-post_item {
    display: block !important;
    position: static !important;
    margin: 0 0 22px !important;   /* ←足りなければ 26～30 に上げる */
    padding: 0 !important;
    clear: both !important;        /* 浮動要素の回り込みを断つ */
    overflow: visible !important;
    contain: layout paint !important; /* 重なりの計算を分離 */
  }

  /* a全体を通常フローに。内部の絶対配置を無効化 */
  .widget-post.is-type-thumb .widget-post_item_

	/* ── よく読まれている記事（SYN Ranking）の“縦スクロール化”を全面解除 ── */

/* ウィジェットの外枠と中枠：高さ固定とoverflowを無効化 */
.widget_synx_ranking_widget,
.widget_synx_ranking_widget *[class*="scroll"],
#synx_ranking_widget-5,
#synx_ranking_widget-5 *[class*="scroll"] {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* リスト本体も同様に解放 */
.widget_synx_ranking_widget ul.widget-post_list,
#synx_ranking_widget-5 ul.widget-post_list {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  display:

	  /* ── SYN「よく読まれている記事」：スクロール化を解除し、5件すべて見せる ── */
/* ウィジェット外枠と中身から高さ固定とoverflowを除去（PC/スマホ共通） */
#synx_ranking_widget-5,
#synx_ranking_widget-5 .widget-post_list {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  -webkit-overflow-scrolling: auto !important;
}

/* “5件目以降を消す”指定の打ち消し（テーマ側のnth-child対策） */
#synx_ranking_widget-5 .widget-post_list > li.widget-post_item:nth-child(n+5) {
  display: list-item !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}

/* 各行の余白と切れ防止（rank丸数字やviewsバッジが欠けないように） */
#synx_ranking_widget-5 .widget-post_item {
  position: static !important;
  overflow: visible !important;
  margin: 0 0 18px !important;
}

/* スマホでの重なり最終上書き */
@media (max-width: 768px) {
  #synx_ranking_widget-5 .widget-post_imgarea [class*="views"],
  #synx_ranking_widget-5 .widget-post_view {
    position: static !important;
    top:auto !important; right:auto !important; bottom:auto !important; left:auto !important;
    display: inline-block !important;
    margin-top: .4em !important;
    z-index: 2 !important;
  }
  #synx_ranking_widget-5 .widget-post_txtarea {
    position: static !important;
    background: transparent !important;
    padding: 0 !important;
    margin-top: 8px !important;
    width:auto !important; height:auto !important; overflow:visible !important;
  }
  #synx_ranking_widget-5 .widget-post_imgarea {
    position: relative !important;
    overflow: visible !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    margin-bottom: .6em !important;
  }
}

/* よく読まれている記事（ランキング）だけ固定解除・高さ制限解除 */
#synx_ranking_widget-5.sidebar-fixed {
  position: static !important;
  top: auto !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  -webkit-overflow-scrolling: auto !important;
}

/* 内側リストの高さ/スクロールも解除 */
#synx_ranking_widget-5 .widget-post_list {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* 万一「5件目以降を隠す」指定が残っている場合の打ち消し */
#synx_ranking_widget-5 .widget-post_list > li.widget-post_item:nth-child(n+5) {
  display: list-item !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}

/* スマホでの重なりも再度明示的に解除（viewsバッジ／テキスト帯） */
@media (max-width: 768px) {
  #synx_ranking_widget-5 .widget-post_imgarea [class*="views"],
  #synx_ranking_widget-5 .widget-post_view {
    position: static !important;
    top:auto !importan
/* ──「よく読まれている記事」枠の固定と高さ制限を完全解除 ── */
/* 個別ID（例：synx_ranking_widget-5）に命中させる */
#synx_ranking_widget-5,
#synx_ranking_widget-5.sidebar-fixed {
  position: static !important;
  top: auto !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  -webkit-overflow-scrolling: auto !important;
}

/* 同系IDを前方一致/部分一致でも拾う（IDが異なる場合の保険） */
[id^="synx_ranking_widget-"],
[id*="ranking_widget"] {
  position: static !important;
  top: auto !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* 内側リストの高さ・スクロールも解除 */
[id^="synx_ranking_widget-"] .widget-post_list,
[id*="ranking_widget"] .widget-post_list {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* 各アイテムの余白を少し確保（4位と5位が食い込むのを防止） */
[id^="synx_ranking_widget-"] .widget-post_item,
[id*="ranking_widget"] .widget-post_item {
  height: auto !important;
  margin-bottom: 1.6em !important;
  overflow: visible !important;
}

/* スマホ時：viewsバッジとテキスト帯の重なりを確実に解除 */
@media (max-width: 768px) {
  [id^="synx_ranking_widget-"] .widget-post_imgarea [class*="views"],
  [id*="ranking_widget"] .widget-post_imgarea [class*="views"],
  [id^="synx_ranking_widget-"] .widget-post_view,
  [id*="ranking_widget"] .widget-post_view {
    position: static !important;
    top: auto !important; right: auto !important; bottom: auto !important; left: auto !important;
    display: inline-block !important;
    margin-top: .4em !important;
    z-index: 2 !important;
  }

  [id^="synx_ranking_widget-"] .widget-post_txtarea,
  [id*="ranking_widget"] .widget-post_txtarea {
    position: static !important;
    background: transparent !important;
    padding: 0 !important;
    margin-top: 8px !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
  }

  [id^="synx_ranking_widget-"] .widget-post_imgarea,
  [id*="ranking_widget"] .widget-post_imgarea {
    position: relative !important;
    overflow: visible !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    margin-bottom: .6em !important;
  }
}

/* 念のため：5件目がCSSで隠されているケースの打ち消し */
[id^="synx_ranking_widget-"] .widget-post_list > li:nth-child(5),
[id*="ranking_widget"] .widget-post_list > li:nth-child(5) {
  display: list-item !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}
	  
	  /* サイドバー固定を完全に解除（高さ・スクロール無効） */
.sidebar-fixed {
  position: static !important;
  top: auto !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  -webkit-overflow-scrolling: auto !important;
}

/* ランキングウィジェット本体と内側リストの高さ・スクロール解除 */
[id^="synx_ranking_widget-"],
[id^="synx_ranking_widget-"] .widget-post_list {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* 各アイテムの食い込み防止 */
[id^="synx_ranking_widget-"] .widget-post_item {
  height: auto !important;
  margin-bottom: 1.6em !important;
  overflow: visible !important;
}

/* 5件目が何かで非表示にされている場合の保険 */
[id^="synx_ranking_widget-"] .widget-post_list > li:nth-child(5) {
  display: list-item !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}