/* ==========================================================================
   ゼロスタ 記事一覧デザイン
   対象: トップページ・カテゴリー/タグ一覧ページの「メイン記事一覧」のみ
   (#contentInner 内の .kanren に限定。サイドバーの新着記事ウィジェットや
   関連記事ウィジェットも同じ .kanren クラスを使い回しているため、
   誤って巻き込まないようスコープを絞っている)

   横並び3列のカードグリッドで、アイキャッチ画像とタイトルのみを表示する。
   色はテーマ標準のまま変更しない。
   ========================================================================== */

/* ---- 一覧全体: 3列グリッド ---- */
#contentInner .kanren {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px 24px;
}

/* ---- 1件分のカード ---- */
#contentInner .kanren dl.clearfix {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	border: none !important;
	background: none;
}

/* ---- サムネイル(カード上部、横幅いっぱい) ----
   テーマ標準の .kanren dt { float:left; width:100px; } を打ち消す */
#contentInner .kanren dt {
	float: none;
	width: 100%;
	margin: 0;
}

#contentInner .kanren dt img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1200 / 630;
	object-fit: cover;
}

/* ---- タイトルのみ表示、日付・抜粋は非表示 ----
   テーマ標準の .kanren dd { padding-left:115px; } を打ち消す */
#contentInner .kanren dd {
	float: none;
	width: 100%;
	margin: 0;
	padding-left: 0;
}

#contentInner .kanren dd h3 {
	margin: 12px 0 0;
	font-size: 1rem;
	line-height: 1.5;
}

#contentInner .kanren dd .blog_info,
#contentInner .kanren dd .st-excerpt {
	display: none !important;
}

/* ---- タブレット: 2列 ---- */
@media screen and (max-width: 959px) {
	#contentInner .kanren {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ---- スマホ: 1列 ---- */
@media screen and (max-width: 599px) {
	#contentInner .kanren {
		grid-template-columns: 1fr;
	}
}