@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイル
************************************/
/* 必要ならばここにコードを書く */

/* =========================
   版面・行間・リンク
========================= */
body { font-feature-settings: "palt"; }
.entry-content { font-size: 16.5px; line-height: 1.9; color: #222; }
.entry-content p { margin: 0 0 1.2em; }
.entry-content a { text-decoration: underline; text-underline-offset: .2em; }

/* =========================
   見出し（読みやすい階層）
========================= */
.article h1.entry-title {
  font-size: clamp(22px,2.6vw,32px);
  line-height: 1.25; font-weight: 800; margin-bottom: .4em;
}
.entry-content h2{
  font-size: 1.35rem; margin: 2.0em 0 .8em; font-weight: 800;
  border-left: 4px solid #222; padding-left: .6em;
}
.entry-content h3{
  font-size: 1.15rem; margin: 1.6em 0 .6em; font-weight: 700;
  border-bottom: 1px solid #eee; padding-bottom: .2em;
}
.entry-content h4{ font-size: 1.05rem; margin: 1.2em 0 .4em; font-weight: 700; color: #333; }

/* =========================
   目次（Cocoonの自動TOC）
========================= */
.toc, .toc-widget {
  border: 1px solid #eee; border-radius: 12px; padding: 12px 14px; background: #fafafa;
}
.toc-title{ font-weight: 800; margin-bottom: 6px; }
.toc a { text-decoration: none; }

/* =========================
   表・引用・コード
========================= */
.entry-content table{ width:100%; border-collapse: collapse; margin:1.2em 0; }
.entry-content th, .entry-content td{ border:1px solid #eaeaea; padding:.7em .8em; }
.entry-content tbody tr:nth-child(odd){ background:#fcfcfc; }

.entry-content blockquote{
  margin:1.2em 0; padding:1em;
  border:1px solid #eee; border-left:4px solid #999; background:#fafafa; color:#333;
}
.entry-content pre, .entry-content code{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
.entry-content pre{
  background:#0f172a; color:#e2e8f0; padding:12px 14px; border-radius:10px; overflow:auto;
}

/* =========================
   画像・キャプション
========================= */
.eye-catch{ margin:1.0em 0; border-radius:12px; overflow:hidden; }
.wp-block-image img{ border-radius:12px; }
.wp-caption-text, figcaption{ color:#666; font-size: 13px; text-align: center; margin-top:.4em; }

/* =========================
   ボタン（ブロックとショートコード系）
========================= */
.wp-block-button .wp-block-button__link,
.button, .btn, a.btn{
  display:inline-block; padding:10px 16px; border-radius:999px;
  border:1px solid #ddd; background:#fff; transition: transform .06s ease, background .2s;
}
.wp-block-button .wp-block-button__link:hover,
.button:hover, .btn:hover, a.btn:hover{ transform: translateY(-1px); }

/* =========================
   パンくず・メタ情報
========================= */
.breadcrumb { font-size: 13px; color:#777; }
.breadcrumb a{ text-decoration: none; }
.rg-post-meta{ display:flex; gap:12px; flex-wrap:wrap; color:#777; font-size:.9rem; margin:.2em 0 1.2em; }
.rg-post-meta time{ color:#555; }
.rg-post-meta .rg-rt{ background:#f2f2f2; border-radius:999px; padding:.2em .6em; }

/* =========================
   関連記事（Cocoon標準と混在OK）
========================= */
.rg-sec-ttl{ font-size:1.1rem; font-weight:800; margin:2em 0 .8em; }
.rg-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media (max-width:960px){ .rg-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:560px){ .rg-grid{ grid-template-columns: 1fr; } }
.rg-card{ border:1px solid #eee; border-radius:12px; overflow:hidden; background:#fff; transition: transform .08s ease; }
.rg-card:hover{ transform: translateY(-2px); }
.rg-card__thumb img{ display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.rg-card__ph{ display:flex; align-items:center; justify-content:center; aspect-ratio:16/9; background:#f5f5f5; color:#999; font-weight:700; }
.rg-card__body{ padding:12px; }
.rg-card__title{ font-size:15px; margin:0 0 6px; font-weight:700; line-height:1.45; }
.rg-card__meta{ display:flex; gap:8px; color:#888; font-size:12px; }

/* =========================
   検索結果（標準検索の見た目だけ整える）
========================= */
/* 検索結果の各記事をカード風に */
.search .entry-card, .archive .entry-card{
  border:1px solid #eee; border-radius:12px; overflow:hidden; background:#fff; margin-bottom:16px;
}
.search .entry-card-thumb img{ aspect-ratio:16/9; object-fit:cover; }
.search .entry-card-title a{ text-decoration:none; }

/* 検索フォーム（標準ウィジェット）を丸型に */
.widget_search .search-edit, .search-form .search-field{
  border:1px solid #ddd; border-radius:999px; padding:9px 12px;
}
.search-form .search-submit{ border-radius:999px; }

/* =========================
   余白の調整（広告・SNS・コメント上）
========================= */
.share-button, .sns-share{ margin: 24px 0; }
.ad-area, .ad { margin: 18px 0; }
.comment-area{ margin-top: 28px; }

/* 縦型/タイルのカード角丸と軽い浮き上がり */
.entry-card, .card-thumb, .entry-card-wrap {
  border-radius: 12px; overflow: hidden;
}
.entry-card {
  border: 1px solid #eee; background:#fff; transition: transform .08s ease;
}
.entry-card:hover { transform: translateY(-2px); }
.entry-card-thumb img, .card-thumb img {
  aspect-ratio: 16/9; object-fit: cover; width: 100%; height: auto;
}

/* 抜粋の行間を少しだけ締めて一覧性UP */
.entry-card-content .entry-card-snippet { line-height: 1.7; }

/* 3列時のカラム隙間（テーマによっては不要） */
.archive .entry-cards, .index .entry-cards { gap: 16px; }