/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 13 2026 | 08:08:30 */
/* --- 4列表示専用：カスタム最新投稿ブロック (ban-posts-4col) --- */

/* 1. リスト全体のグリッド設定 */
.wp-block-latest-posts.ban-posts-4col {
display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important; /* セクション4のgapに合わせる */
    list-style: none !important;
    padding: 0 !important;
    margin: 40px auto !important;
    width: 100% !important;
    max-width: var(--max) !important;
}

/* 2. 各投稿カードの設定 */
.ban-posts-4col li {
display: flex !important;
    flex-direction: column !important;
    padding: 0 !important; /* カード全体のパディングをゼロにする */
    margin: 0 !important;
    overflow: hidden !important; /* 角丸からはみ出る画像をカット */
    background: #000000; /* セクション4風の黒背景 */
    border: 1px solid var(--border);
    border-radius: var(--radius);
}

.ban-posts-4col li:hover {
    transform: translateY(-5px); /* ホバー時に少し浮かす演出 */
}

/* 3. 画像の設定 */
.ban-posts-4col .wp-block-latest-posts__featured-image {
width: 100% !important;
    margin: 0 !important; /* マージンをゼロに */
    padding: 0 !important; /* パディングをゼロに */
    line-height: 0 !important; /* 下側の微細な隙間を消す */
}

.ban-posts-4col .wp-block-latest-posts__featured-image img {
width: 100% !important;
    height: auto !important;
    display: block !important; /* inline要素の隙間を排除 */
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* 4. テキスト部分の設定 */
.ban-posts-4col .wp-block-latest-posts__post-title {
padding: 20px 15px 10px 15px !important; /* 画像と密着しすぎないよう上を少しあける */
    margin: 0 !important;
    color: #000000;
    text-align: center;
}

.ban-posts-4col .wp-block-latest-posts__post-excerpt {
padding: 0 15px 20px 15px !important;
    margin: 0 !important;
    color: #cccccc;
    text-align: center;
}

/* --- レスポンシブ対応 --- */


/* スマホ (2列) */
@media (max-width: 768px) {
.wp-block-latest-posts.ban-posts-4col {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
        padding: 0 10px !important;
    }
    .ban-posts-4col .wp-block-latest-posts__featured-image img {
        height: 150px !important; /* スマホでは画像を少し低く */
    }
}