@charset "UTF-8";
/* ==========================================================
   SWA（SEO Writing App）生成記事用スタイル  2026-10-03
   対象: 本文内に nav.seo-toc を持つ記事だけ（他の記事には影響しない）
   配色: テーマのアクセント #0f9a9e / 淡色 #cdeeee（学び方ガイド既存記事に合わせる）
   ========================================================== */
.b_detail_content:has(> .seo-toc) {
  --swa-accent: #0f9a9e;
  --swa-light: #cdeeee;
  --swa-pale: #f2fafa;
  --swa-text: #333;
  font-size: 16px;
  line-height: 1.9;
  color: var(--swa-text);
}

/* 段落 */
.b_detail_content:has(> .seo-toc) > p {
  font-size: 16px;
  line-height: 2;
  margin: 0 0 1.4em;
}
.b_detail_content:has(> .seo-toc) > p:empty { display: none; }
.b_detail_content:has(> .seo-toc) strong {
  font-weight: 700;
  background: linear-gradient(transparent 62%, #fff3a8 62%);
}

/* 見出し */
.b_detail_content:has(> .seo-toc) > h2 {
  font-size: 22px;
  line-height: 1.5;
  font-weight: 700;
  text-align: left;
  margin: 3.2em 0 1.2em;
  padding: .55em .8em;
  border-left: 6px solid var(--swa-accent);
  background: var(--swa-pale);
  scroll-margin-top: 90px;
}
.b_detail_content:has(> .seo-toc) > h3 {
  font-size: 19px;
  line-height: 1.5;
  font-weight: 700;
  color: var(--swa-accent);
  margin: 2.2em 0 .9em;
  padding: 0 0 .35em;
  border-bottom: 2px solid var(--swa-light);
}
.b_detail_content:has(> .seo-toc) > h4 {
  font-size: 17px;
  line-height: 1.5;
  font-weight: 700;
  margin: 1.8em 0 .7em;
  padding-left: .6em;
  border-left: 3px solid var(--swa-light);
}

/* 本文中のリスト */
.b_detail_content:has(> .seo-toc) > ul,
.b_detail_content:has(> .seo-toc) > ol {
  margin: 0 0 1.6em;
  padding: 1em 1.2em 1em 2.4em;
  background: #fafafa;
  border-radius: 6px;
}
.b_detail_content:has(> .seo-toc) > ul > li { list-style: disc; }
.b_detail_content:has(> .seo-toc) > ol > li { list-style: decimal; }
.b_detail_content:has(> .seo-toc) > ul > li,
.b_detail_content:has(> .seo-toc) > ol > li {
  font-size: 16px;
  line-height: 1.8;
  margin: .3em 0;
}

/* 画像 */
.b_detail_content:has(> .seo-toc) figure {
  margin: 1.5em 0 2em;
  text-align: center;
}
.b_detail_content:has(> .seo-toc) figure br { display: none; }
.b_detail_content:has(> .seo-toc) figure img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto !important;
  border-radius: 8px;
}
.b_detail_content:has(> .seo-toc) figure.seo-eyecatch { margin: 0 0 1.8em; }
.b_detail_content:has(> .seo-toc) figure.seo-eyecatch img { border-radius: 4px; }

/* この記事のポイント */
.b_detail_content:has(> .seo-toc) .seo-aeo-summary {
  margin: 0 0 1.8em;
  padding: 1.1em 1.4em;
  background: var(--swa-pale);
  border: 2px solid var(--swa-light);
  border-radius: 8px;
}
.b_detail_content:has(> .seo-toc) .seo-aeo-summary h3 {
  font-size: 17px;
  font-weight: 700;
  color: var(--swa-accent);
  margin: 0 0 .4em;
  padding: 0;
  border: 0;
}
.b_detail_content:has(> .seo-toc) .seo-aeo-summary p {
  font-size: 16px;
  line-height: 1.8;
  margin: 0;
}

/* 目次 */
.b_detail_content:has(> .seo-toc) .seo-toc {
  margin: 0 0 2.4em;
  padding: 1.1em 1.4em 1.2em;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
}
.b_detail_content:has(> .seo-toc) .seo-toc h3 {
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 .6em;
  padding: 0 0 .4em;
  border-bottom: 1px solid #eee;
  color: var(--swa-text);
}
.b_detail_content:has(> .seo-toc) .seo-toc ul {
  margin: 0;
  padding: 0;
  counter-reset: swa-toc;
}
.b_detail_content:has(> .seo-toc) .seo-toc li {
  list-style: none;
  font-size: 15px;
  line-height: 1.6;
  margin: 0;
  padding: .35em 0 .35em 2.2em;
  position: relative;
  border-bottom: 1px dashed #eee;
}
.b_detail_content:has(> .seo-toc) .seo-toc li:last-child { border-bottom: 0; }
.b_detail_content:has(> .seo-toc) .seo-toc li::before {
  counter-increment: swa-toc;
  content: counter(swa-toc);
  position: absolute;
  left: 0;
  top: .4em;
  width: 1.6em;
  height: 1.6em;
  line-height: 1.6em;
  font-size: 12px;
  text-align: center;
  color: #fff;
  background: var(--swa-accent);
  border-radius: 50%;
}
.b_detail_content:has(> .seo-toc) .seo-toc a {
  color: var(--swa-text);
  text-decoration: none;
}
.b_detail_content:has(> .seo-toc) .seo-toc a:hover {
  color: var(--swa-accent);
  text-decoration: underline;
}

/* スマホ */
@media screen and (max-width: 640px) {
  .b_detail_content:has(> .seo-toc) > p,
  .b_detail_content:has(> .seo-toc) > ul > li,
  .b_detail_content:has(> .seo-toc) > ol > li { font-size: 15px; }
  .b_detail_content:has(> .seo-toc) > h2 { font-size: 19px; margin-top: 2.6em; }
  .b_detail_content:has(> .seo-toc) > h3 { font-size: 17px; }
  .b_detail_content:has(> .seo-toc) .seo-aeo-summary,
  .b_detail_content:has(> .seo-toc) .seo-toc { padding: 1em; }
}