/*======================================
  全体的なデザイン調整
========================================*/
body:not(.wp-admin) {
    font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    background-color: #f8f9fa;
    color: #495057;
    line-height: 1.8;
}

a {
    color: #007bff;
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}

a:hover {
    color: #0056b3;
}

/* メインコンテンツエリアのラッパー */
/* トップページ(1カラム)用 */
body:not(.wp-admin).home #content-in,
/* 記事ページ等(2カラム)のメインカラム用 */
.single #main, 
.archive #main, 
.page:not(.home) #main {
    background-color: #ffffff;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.07);
}

@media screen and (max-width: 768px) {
    body:not(.wp-admin).home #content-in,
    .single #main, 
    .archive #main, 
    .page:not(.home) #main {
        padding: 20px;
    }
}

/* カラム落ち対策：paddingがwidthに影響しないようにする */
.single #main, .single #sidebar,
.archive #main, .archive #sidebar,
.page:not(.home) #main, .page:not(.home) #sidebar {
    box-sizing: border-box;
}

/*======================================
  ヘッダー下カルーセル
========================================*/
#carousel {
    background-color: transparent;
    border-bottom: none;
    margin-bottom: 30px;
}
.carousel-entry-card {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    transition: all 0.2s ease;
}
.carousel-entry-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.08);
}
.carousel-entry-card-thumb-image {
    border-radius: 8px 8px 0 0;
}
.carousel-entry-card-title {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    color: #343a40;
}
.cat-label {
    background-color: rgba(0, 123, 255, 0.8);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255,255,255,0.3);
}
.slick-dots li button:before { color: #007bff; opacity: 0.3; }
.slick-dots li.slick-active button:before { opacity: 1; }

/*======================================
  見出しのデザイン
========================================*/
.entry-content h2 {
    font-size: 1.75rem;
    font-weight: 700;
    color: #343a40;
    padding-bottom: 15px;
    margin-top: 50px;
    margin-bottom: 30px;
    border-bottom: 2px solid #f1f3f5;
    background-color: transparent;
    padding-left: 0;
    padding-right: 0;
}
.entry-content h2:first-of-type { margin-top: 0; }

/*======================================
  カード型グリッドレイアウトの共通設定 (最終修正)
========================================*/

/* 「注目記事」と「新着記事」両方のコンテナに適用 */
.entry-content .wp-block-latest-posts__list.is-grid,
.popular-entry-cards.widget-entry-cards {
    display: grid !important; /* display:grid を強制適用 */
    grid-template-columns: repeat(4, 1fr); /* 4つの均等なカラムを作成 */
    gap: 20px; /* カード間のすきま */
    padding: 0 !important;
    list-style: none !important;
}

/* 各カードアイテム */
.entry-content .wp-block-latest-posts__list.is-grid li,
.popular-entry-cards.widget-entry-cards .a-wrap {
    width: auto !important; /* テーマの幅指定をリセット */
    margin: 0 !important;
    padding: 0 !important;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
}

.entry-content .wp-block-latest-posts__list.is-grid li:hover,
.popular-entry-cards.widget-entry-cards .a-wrap:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
}

/* 画像 */
.entry-content .wp-block-latest-posts__featured-image img,
.popular-entry-cards.widget-entry-cards .card-thumb img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    border-bottom: 1px solid #e9ecef;
}

/* テキストコンテンツ部分の余白 */
.entry-content .wp-block-latest-posts__post-title,
.entry-content .wp-block-latest-posts__post-date,
.entry-content .wp-block-latest-posts__post-excerpt,
.popular-entry-cards.widget-entry-cards .card-content {
    padding: 0 20px;
    flex-grow: 1; /* 高さを揃える */
    display: flex;
    flex-direction: column;
}
.popular-entry-cards.widget-entry-cards .card-content {
    padding-bottom: 20px;
}


/* タイトル */
.entry-content a.wp-block-latest-posts__post-title,
.popular-entry-cards.widget-entry-cards .card-title {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    margin: 15px 0 8px;
    line-height: 1.5;
}

/* 日付 */
.entry-content .wp-block-latest-posts__post-date,
.popular-entry-cards.widget-entry-cards .post-date {
    font-size: 0.8rem;
    color: #6c757d;
    margin-bottom: 12px;
}

/* 抜粋文 */
.entry-content .wp-block-latest-posts__post-excerpt {
    font-size: 0.9rem;
    color: #495057;
    margin-top: 0;
    margin-bottom: 20px;
}

/* レスポンシブ設定 */
@media (max-width: 1024px) {
    .entry-content .wp-block-latest-posts__list.is-grid,
    .popular-entry-cards.widget-entry-cards {
        grid-template-columns: repeat(2, 1fr); /* タブレットで2列 */
    }
}

@media (max-width: 768px) {
    .entry-content .wp-block-latest-posts__list.is-grid,
    .popular-entry-cards.widget-entry-cards {
        grid-template-columns: 1fr; /* スマホで1列 */
    }
}
/* カルーセルのサムネイルをカード枠いっぱいに表示 */
.carousel-entry-card-thumb-image {
  width: 100%;         /* 親コンテナ幅いっぱい */
  height: 160px;       /* お好みの高さに */
  overflow: hidden;    /* はみ出し部分を隠す */
  border-radius: 8px 8px 0 0; /* 元の角丸を残す */
}

.carousel-entry-card-thumb-image img {
  display: block;      /* 余計な隙間を消す */
  width: 100%;         /* コンテナ幅に合わせる */
  height: 100%;        /* コンテナ高さに合わせる */
  object-fit: cover;   /* アスペクトを保ったまま切り抜いてフィット */
}


/*======================================
  「このサイトについて」「運営者情報」セクション
========================================*/
.column-wrap.column-2 {
    display: flex; align-items: center; gap: 40px; margin-top: 20px;
}
.column-wrap .column-left,
.column-wrap .column-right { flex: 1; width: 50%; }

@media screen and (max-width: 768px) {
    .column-wrap.column-2 { flex-direction: column; }
    .column-wrap .column-left,
    .column-wrap .column-right { width: 100%; }
}
.column-wrap .wp-block-image img { border-radius: 8px; }

/*======================================
  リストのスタイル調整（青い点の二重表示を修正）
========================================*/
/* 「新着記事」以外のリスト（ul）自体にスタイルを適用 */
.entry-content ul:not(.wp-block-latest-posts__list) {
    list-style: none; /* これでブラウザ標準の黒い点を消します */
    padding-left: 0;  /* 元の箇条書き用の余白もリセットします */
}

/* リストの各項目（li）のスタイル */
.entry-content ul:not(.wp-block-latest-posts__list) li {
    padding-left: 1.6em; /* 新しい青い点のための余白を確保 */
    position: relative;
    margin-bottom: 1em;
}

/* カスタムした青い点を疑似要素で追加 */
.entry-content ul:not(.wp-block-latest-posts__list) li::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0.1em;
    color: #007bff;
    font-size: 1.3em;
    line-height: 1;
}

.entry-content ul li strong {
    font-weight: 600;
    color: #343a40;
}
/*======================================
  【修正1】サイドバー「人気記事」「新着記事」のデザイン統一
========================================*/
/* ウィジェットの共通スタイル */
#sidebar .widget-entry-cards {
    display: flex !important;
    flex-direction: column;
    gap: 15px;
    list-style: none !important;
    padding: 0 !important;
}

/* 各カードのスタイル */
#sidebar .widget-entry-cards .a-wrap {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    padding: 12px !important;
    border-radius: 10px;
    border: 1px solid #e9ecef;
    background-color: #fff;
    width: 100% !important;
    margin: 0 !important;
    text-decoration: none !important;
    transition: transform 0.2s ease-out, box-shadow 0.2s ease-out, background-color 0.2s ease-out;
}

#sidebar .widget-entry-cards .a-wrap:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
    background-color: #f8faff;
}

/* 画像コンテナ */
#sidebar .widget-entry-cards .card-thumb {
    width: 100px;
    height: 65px;
    flex-shrink: 0;
}

/* 画像 */
#sidebar .widget-entry-cards .card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
    border-bottom: none !important;
}

/* テキストコンテンツ */
#sidebar .widget-entry-cards .card-content {
    padding: 0 !important;
    flex: 1;
    min-width: 0;
}

/* タイトル */
#sidebar .widget-entry-cards .card-title {
    margin: 0 !important;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 600;
    color: #343a40;
    word-break: break-word;
}

/* Gutenberg のエディタ内コンテンツに余白を付与 */
.editor-styles-wrapper,
.edit-post-visual-editor__content-area,
.block-editor-block-list__layout {
  padding-left: 20px !important;
  padding-right: 20px !important;
  box-sizing: border-box;
}