/* ==========================================================
   blog.css — ブログ一覧（home.php） / 記事詳細（single.php）
   ========================================================== */
.layout{display:grid;grid-template-columns:2.1fr 1fr;gap:44px;align-items:start;}
@media (max-width:880px){.layout{grid-template-columns:1fr;}}

/* 一覧カード */
.article-list{display:flex;flex-direction:column;gap:22px;}
.article-card{
  display:grid;grid-template-columns:150px 1fr;gap:20px;border:1px solid var(--border);border-radius:10px;
  padding:16px;transition:box-shadow .15s, transform .15s;
}
.article-card:hover{box-shadow:0 6px 18px rgba(27,43,75,.08);transform:translateY(-1px);}
@media (max-width:520px){.article-card{grid-template-columns:1fr;}}
.thumb{
  width:150px;height:110px;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,var(--cream),#eee5d2);
  display:flex;align-items:center;justify-content:center;color:var(--gold-dark);font-size:26px;flex-shrink:0;
}
.thumb img{width:100%;height:100%;object-fit:cover;}
@media (max-width:520px){.thumb{width:100%;height:150px;}}
.article-meta{display:flex;align-items:center;gap:10px;font-size:11.5px;color:var(--muted);margin-bottom:8px;}
.cat-tag{background:var(--gold-dark);color:#fff;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:4px;}
.article-title{font-size:15.5px;font-weight:700;color:var(--navy);margin-bottom:6px;line-height:1.5;}
.article-card:hover .article-title{color:var(--gold-dark);}
.article-excerpt{font-size:12.5px;color:var(--muted);}

/* サイドバー（一覧・詳細共通） */
.side-block{border:1px solid var(--border);border-radius:10px;padding:22px;margin-bottom:26px;}
.side-block h3{font-size:14.5px;color:var(--navy);margin-bottom:16px;display:flex;align-items:center;gap:8px;}
.side-block h3::before{content:"";width:5px;height:16px;background:var(--gold);border-radius:2px;}
.popular-item{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);align-items:center;}
.popular-item:last-child{border-bottom:none;}
.popular-num{
  width:24px;height:24px;border-radius:50%;background:var(--navy);color:#fff;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.popular-item .t{font-size:12.5px;color:var(--text);line-height:1.5;}
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px;}
.tag-cloud span, .tag-cloud a{
  font-size:11.5px;background:var(--cream);border:1px solid var(--border);color:var(--navy);
  padding:6px 12px;border-radius:16px;
}

.quick-card{background:var(--cream);border:1px solid var(--border);border-radius:10px;padding:24px;text-align:center;}
.quick-card h3{color:var(--navy);font-size:14.5px;margin-bottom:10px;}
.quick-card p{font-size:12px;color:var(--muted);margin-bottom:16px;}
.quick-card .num{font-size:20px;font-weight:700;color:var(--navy);margin-bottom:14px;}
.quick-card .btns2{display:flex;flex-direction:column;gap:8px;}
.quick-card .btns2 .pill-btn{justify-content:center;}

/* ===== 記事詳細 ===== */
.article-body{max-width:800px;}
.article-body .lead{font-size:15px;color:var(--text);margin-bottom:30px;}
.toc{background:var(--cream);border:1px solid var(--border);border-radius:10px;padding:22px 26px;margin-bottom:36px;}
.toc h4{color:var(--navy);font-size:14.5px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.toc ol{padding-left:20px;font-size:13.5px;list-style:decimal;}
.toc li{margin-bottom:8px;color:var(--gold-dark);font-weight:600;}
.toc li a{color:inherit;}

.article-body h2{font-size:20px;color:var(--navy);margin:40px 0 16px;padding-bottom:10px;border-bottom:2px solid var(--gold);}
.article-body h3{font-size:16px;color:var(--navy);margin:26px 0 12px;}
.article-body p{font-size:14.5px;margin-bottom:16px;color:var(--text);}
.article-body ul, .article-body ol{margin:0 0 16px 22px;font-size:14.5px;list-style:disc;}
.article-body ol{list-style:decimal;}
.article-body li{margin-bottom:6px;}
.article-body img{border-radius:8px;margin:16px 0;}

.pull-note{
  background:var(--cream);border-left:4px solid var(--gold);padding:16px 20px;font-size:13.5px;
  color:var(--muted);margin:24px 0;border-radius:0 6px 6px 0;
}
table.compare{width:100%;border-collapse:collapse;margin:20px 0;font-size:13px;}
table.compare th{background:var(--navy);color:#fff;padding:10px 12px;text-align:left;}
table.compare td{padding:10px 12px;border-bottom:1px solid var(--border);}
table.compare tr:nth-child(even){background:var(--cream);}

.share-row{
  display:flex;align-items:center;justify-content:center;gap:12px;margin:44px 0 10px;
  padding:22px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);
}
.share-row span.lbl{font-size:13px;color:var(--muted);margin-right:6px;}
.share-icon{
  width:38px;height:38px;border-radius:50%;background:var(--cream);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--navy);
}
.author-box{display:flex;gap:16px;align-items:center;border:1px solid var(--border);border-radius:10px;padding:20px;margin:30px 0;}
.author-avatar{
  width:56px;height:56px;border-radius:50%;background:var(--cream);border:1.5px solid var(--gold);
  display:flex;align-items:center;justify-content:center;font-size:22px;color:var(--gold-dark);flex-shrink:0;overflow:hidden;
}
.author-avatar img{width:100%;height:100%;object-fit:cover;}
.author-box .name{font-weight:700;color:var(--navy);font-size:14px;margin-bottom:4px;}
.author-box .desc{font-size:12px;color:var(--muted);}

.related-title{font-size:17px;font-weight:700;color:var(--navy);margin:44px 0 20px;}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media (max-width:700px){.related-grid{grid-template-columns:1fr;}}
.related-card{border:1px solid var(--border);border-radius:10px;overflow:hidden;}
.related-thumb{height:110px;background:linear-gradient(135deg,var(--cream),#eee5d2);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--gold-dark);overflow:hidden;}
.related-thumb img{width:100%;height:100%;object-fit:cover;}
.related-card .p{padding:14px;}
.related-card .cat{font-size:10px;font-weight:700;color:var(--gold-dark);margin-bottom:6px;}
.related-card .t{font-size:12.5px;font-weight:700;color:var(--navy);line-height:1.5;}
.related-card .pr{font-size:14px;font-weight:700;color:var(--navy);margin-top:6px;}

.cat-list a{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--border);font-size:13px;color:var(--text);}
.cat-list a:last-child{border-bottom:none;}
.cat-list a:hover{color:var(--gold-dark);}

/* ===== プライバシーポリシー等、長文の法的ページ用スタイル ===== */
.privacy-body h2{
  font-size:19px;color:var(--navy);margin:36px 0 14px;
  padding-bottom:8px;border-bottom:2px solid var(--gold);
}
.privacy-body h2:first-child{margin-top:0;}
.privacy-body h3{font-size:15.5px;color:var(--navy);margin:22px 0 10px;}
.privacy-body p{font-size:14px;color:var(--text);margin-bottom:14px;line-height:1.9;}
.privacy-body ul,
.privacy-body ol{margin:0 0 16px 22px;font-size:14px;line-height:1.9;}
.privacy-body li{margin-bottom:6px;}
.privacy-body table{width:100%;border-collapse:collapse;margin:16px 0 8px;font-size:13.5px;}
.privacy-body table th,
.privacy-body table td{border:1px solid var(--border);padding:12px 16px;text-align:left;vertical-align:top;}
.privacy-body table th{background:var(--cream);color:var(--navy);font-weight:700;width:180px;}
.privacy-note{font-size:12.5px;color:var(--muted);margin-top:36px;padding-top:20px;border-top:1px solid var(--border);}