/*
Theme Name: shikaku-jimu-child
Template: swell
Version: 3.0.0
Description: シカクと事務転職 子テーマ — 信頼の濃紺×安心のソフトグリーン / 30代文系・非IT事務(経理/不動産/金融)転職特化
*/

@import url("https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@400;500;700;800&family=Noto+Serif+JP:wght@600;700&display=swap");

/* =========================================================
   カラーシステム
   Main:   #1E3A6E (Deep Navy)
   Accent: #2F9E74 (Soft Green)
   ========================================================= */
:root {
  --color-main:       #1E3A6E;
  --color-main-dark:  #142A52;
  --color-main-mid:   #2A4E8A;
  --color-main-light: #3A6CB8;
  --color-accent:     #2F9E74;
  --color-accent-dark:#237D59;
  --color-accent-light:#5CC79E;
  --color-accent-bg:  #EAF7F1;
  --color-bg:         #F4F6FA;
  --color-bg-white:   #FFFFFF;
  --color-text:       #1A1A2E;
  --color-text-muted: #5A6070;
  --color-border:     #D0D9EA;
  --shadow-sm:        0 1px 4px rgba(30,58,110,.10);
  --shadow-md:        0 4px 20px rgba(30,58,110,.14);
  --shadow-lg:        0 8px 40px rgba(30,58,110,.18);
  --radius-sm:        6px;
  --radius-md:        12px;
  --radius-lg:        20px;
  --max-w:            1080px;
}

/* SWELL変数との連携 */
body, .l-header, .l-content, .l-container {
  --color_main:   #1E3A6E;
  --color_accent: #2F9E74;
}

/* =========================================================
   Base
   ========================================================= */
body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: "M PLUS 1p", "Noto Sans JP", sans-serif;
  -webkit-font-smoothing: antialiased;
  line-height: 1.8;
}

/* =========================================================
   Typography
   ========================================================= */
h1, h2, h3, h4, h5, h6 {
  font-family: "Noto Serif JP", "M PLUS 1p", serif;
  font-weight: 700;
  line-height: 1.45;
  color: var(--color-main);
}

.l-article h2, article h2 {
  border-left: 4px solid var(--color-accent);
  background: linear-gradient(90deg, #EBF0F8 0%, transparent 100%);
  padding: .65em 1em;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: 1.2rem;
  margin-top: 2.5em;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 800;
}

.l-article h3, article h3 {
  position: relative;
  padding-left: 1em;
  font-size: 1.05rem;
  margin-top: 1.8em;
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 700;
}
.l-article h3::before, article h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 1em;
  background: var(--color-accent);
  border-radius: 2px;
}

/* =========================================================
   ヘッダー
   ========================================================= */
.l-header {
  background: var(--color-main) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.25) !important;
}

.l-header__bar { background: var(--color-main) !important; }

/* ロゴ */
.c-headLogo__link,
.c-headLogo.-txt .c-headLogo__link,
.p-siteName a {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font-family: "Noto Serif JP", serif !important;
  font-weight: 700 !important;
  white-space: nowrap;
}
.c-headLogo__img { filter: brightness(10) !important; }

/* グローバルナビ */
.c-gnav > li > a,
.p-globalNav a,
.p-globalNav__item a {
  color: rgba(255,255,255,.9) !important;
  font-size: .85rem;
  font-weight: 500;
  letter-spacing: .02em;
}
.c-gnav > li > a:hover,
.p-globalNav a:hover { color: var(--color-accent-light) !important; }

/* ハンバーガー */
.c-menuBtn span,
.p-menuBtn span { background: #FFFFFF !important; }

/* =========================================================
   SWELL MV 有効化 (2026-06-13)
   ========================================================= */

/* 旧カスタムヒーロー非表示 (SWELL MV に移行) */
.ccl-hero { display: none !important; }

/* トップページ サイドバー非表示 */
.top #sidebar,
.home #sidebar { display: none !important; }

/* トップページ フル幅 */
.top .l-mainContent,
.home .l-mainContent {
  max-width: 100% !important;
  width: 100% !important;
  flex: 1 1 100% !important;
}
.top .l-article,
.home .l-article {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* =========================================================
   ヒーローセクション
   ========================================================= */
.ccl-hero {
  background: linear-gradient(150deg, #0D2240 0%, #1E3A6E 45%, #2A5298 100%);
  color: #FFFFFF;
  padding: 5rem 1.5rem 4rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}

/* 背景装飾 — 斜めライン */
.ccl-hero::before {
  content: "";
  position: absolute;
  top: -40%;
  right: -10%;
  width: 55%;
  height: 200%;
  background: rgba(255,255,255,.04);
  transform: rotate(-18deg);
  pointer-events: none;
}
.ccl-hero::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--color-accent) 0%, var(--color-accent-light) 50%, var(--color-accent) 100%);
}

.ccl-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 760px;
  margin: 0 auto;
}

/* バッジ */
.ccl-hero-badge {
  display: inline-block;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 50px;
  font-size: .78rem;
  font-weight: 700;
  padding: .35em 1.2em;
  margin-bottom: 1.5rem;
  letter-spacing: .08em;
  color: rgba(255,255,255,.95);
}

/* メインタイトル */
.ccl-hero-title {
  font-family: "Noto Serif JP", serif;
  font-size: clamp(1.9rem, 5vw, 2.8rem);
  font-weight: 700;
  line-height: 1.35;
  margin: 0 0 1.25rem;
  color: #FFFFFF !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.25);
  -webkit-text-fill-color: #FFFFFF !important;
}
.ccl-hero-title span {
  color: var(--color-accent-light) !important;
  -webkit-text-fill-color: var(--color-accent-light) !important;
}

/* サブテキスト */
.ccl-hero-sub {
  font-size: 1rem;
  line-height: 1.8;
  color: rgba(255,255,255,.85) !important;
  margin: 0 0 2.25rem;
  font-weight: 400;
}

/* CTAボタン */
.ccl-hero-cta {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  background: var(--color-accent) !important;
  color: #FFFFFF !important;
  font-weight: 700;
  font-size: 1.05rem;
  padding: 1em 2.4em;
  border-radius: 50px;
  text-decoration: none !important;
  box-shadow: 0 6px 24px rgba(232,123,42,.5);
  transition: transform .2s ease, box-shadow .2s ease;
  min-height: 52px;
  letter-spacing: .02em;
}
.ccl-hero-cta::after { content: "→"; font-size: .9em; }
.ccl-hero-cta:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 32px rgba(232,123,42,.6);
  color: #FFFFFF !important;
  text-decoration: none !important;
}

/* =========================================================
   数字バッジ行（実績の可視化）
   ========================================================= */
.ccl-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  background: #FFFFFF;
  border-bottom: 1px solid var(--color-border);
}

.ccl-badge {
  flex: 1;
  min-width: 120px;
  padding: 1.5rem 1rem;
  text-align: center;
  border-right: 1px solid var(--color-border);
  position: relative;
}
.ccl-badge:last-child { border-right: none; }

.ccl-badge-num {
  display: block;
  font-family: "Noto Serif JP", serif;
  font-size: clamp(1.6rem, 3.5vw, 2.2rem);
  font-weight: 700;
  color: var(--color-main);
  line-height: 1.1;
  margin-bottom: .3rem;
}

.ccl-badge-label {
  display: block;
  font-size: .75rem;
  color: var(--color-text-muted);
  line-height: 1.4;
  font-weight: 500;
}

/* =========================================================
   カテゴリセクション
   ========================================================= */
.ccl-cat-section {
  padding: 3.5rem 1.5rem;
  background: var(--color-bg);
}

.ccl-cat-section-title {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 1.4rem;
  color: var(--color-main);
  margin: 0 0 .5rem;
  font-weight: 700;
}
.ccl-cat-section-sub {
  text-align: center;
  font-size: .88rem;
  color: var(--color-text-muted);
  margin: 0 0 2rem;
}

.ccl-cat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  max-width: var(--max-w);
  margin: 0 auto;
}

.ccl-cat-card {
  background: #FFFFFF;
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
  padding: 1.6rem 1.25rem 1.4rem;
  text-decoration: none !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: .5rem;
  box-shadow: var(--shadow-sm);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s;
}
.ccl-cat-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: var(--color-main-light);
  text-decoration: none !important;
}

.ccl-cat-icon {
  font-size: 2rem;
  line-height: 1;
  margin-bottom: .25rem;
}

.ccl-cat-name {
  font-weight: 700;
  font-size: .95rem;
  color: var(--color-main);
  line-height: 1.3;
}

.ccl-cat-desc {
  font-size: .78rem;
  color: var(--color-text-muted);
  line-height: 1.5;
  margin: 0;
}

/* =========================================================
   選ばれる理由（強み）セクション
   ========================================================= */
.ccl-strengths {
  background: var(--color-main);
  padding: 4rem 1.5rem;
}

.ccl-strengths-title {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 1.4rem;
  color: #FFFFFF;
  margin: 0 0 2.5rem;
  font-weight: 700;
  -webkit-text-fill-color: #FFFFFF !important;
}
.ccl-strengths-title::after {
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  background: var(--color-accent);
  margin: .6rem auto 0;
  border-radius: 2px;
}

.ccl-strength-item {
  max-width: 680px;
  margin: 0 auto 1.5rem;
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 1.25rem;
  align-items: flex-start;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-md);
  padding: 1.5rem 1.75rem;
  transition: background .2s;
}
.ccl-strength-item:last-child { margin-bottom: 0; }
.ccl-strength-item:hover { background: rgba(255,255,255,.11); }

.ccl-strength-num {
  font-family: "Noto Serif JP", serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--color-accent);
  line-height: 1;
  text-align: center;
  padding-top: .15rem;
}

.ccl-strength-title {
  font-weight: 700;
  font-size: 1.05rem;
  color: #FFFFFF;
  margin: 0 0 .5rem;
  -webkit-text-fill-color: #FFFFFF !important;
  font-family: "M PLUS 1p", sans-serif;
}

.ccl-strength-desc {
  font-size: .88rem;
  color: rgba(255,255,255,.80);
  line-height: 1.75;
  margin: 0;
}

/* =========================================================
   編集部紹介ブロック
   ========================================================= */
.ccl-editorial-block {
  background: #FFFFFF;
  border-top: 4px solid var(--color-accent);
  padding: 2.5rem 1.5rem;
  text-align: center;
  max-width: 100%;
}

.ccl-editorial-block p {
  max-width: 640px;
  margin: 0 auto .75rem;
  font-size: .92rem;
  color: var(--color-text-muted);
  line-height: 1.8;
}

.ccl-editorial-link {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  color: var(--color-main) !important;
  font-weight: 700;
  font-size: .92rem;
  text-decoration: none !important;
  border-bottom: 2px solid var(--color-accent);
  padding-bottom: .1em;
  transition: color .18s;
}
.ccl-editorial-link:hover { color: var(--color-accent) !important; }

/* =========================================================
   記事内 CTA ・ボタン
   ========================================================= */
.wp-block-button .wp-block-button__link,
a.c-btn {
  background: var(--color-accent) !important;
  color: #FFFFFF !important;
  border-radius: 50px !important;
  font-weight: 700 !important;
  padding: .9em 2.2em !important;
  box-shadow: 0 4px 16px rgba(232,123,42,.35) !important;
  transition: transform .18s, box-shadow .18s !important;
  min-height: 48px !important;
  font-size: 1rem !important;
}
.wp-block-button .wp-block-button__link:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 7px 20px rgba(232,123,42,.45) !important;
}

.has-black-background-color,
.has-gray-background-color { background-color: var(--color-accent) !important; }

/* PR引用系CTAクラス */
.ccl-cta {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  background: var(--color-accent);
  color: #FFFFFF !important;
  font-weight: 700;
  font-size: 1rem;
  padding: .95em 2.4em;
  border-radius: 50px;
  text-decoration: none !important;
  box-shadow: 0 4px 16px rgba(232,123,42,.4);
  transition: transform .2s, box-shadow .2s;
  min-height: 52px;
}
.ccl-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 7px 22px rgba(232,123,42,.5);
  color: #FFFFFF !important;
}

/* =========================================================
   記事内コンポーネント
   ========================================================= */

/* 比較表 */
.ccl-compare-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 1.5rem 0; }
.ccl-compare-table { width: 100%; min-width: 500px; border-collapse: collapse; font-size: .88rem; }
.ccl-compare-table th {
  background: var(--color-main);
  color: #FFFFFF;
  padding: .75em 1em;
  text-align: center;
  font-weight: 700;
}
.ccl-compare-table td {
  padding: .65em 1em;
  text-align: center;
  border: 1px solid var(--color-border);
  vertical-align: middle;
}
.ccl-compare-table tr:nth-child(even) td { background: #F5F7FA; }
.ccl-compare-table .ccl-best {
  background: #EAF7F1 !important;
  font-weight: 700;
  color: var(--color-accent-dark);
}

/* FAQ */
.ccl-faq details {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  margin-bottom: .6rem;
  background: #FFFFFF;
  overflow: hidden;
}
.ccl-faq summary {
  padding: .9em 1.2em;
  font-weight: 700;
  font-size: .95rem;
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: flex-start;
  gap: .6em;
  color: var(--color-main);
  background: #F4F6FA;
}
.ccl-faq summary::-webkit-details-marker { display: none; }
.ccl-faq summary::before { content: "Q."; color: var(--color-accent); font-weight: 700; flex-shrink: 0; }
.ccl-faq summary::after { content: "＋"; margin-left: auto; flex-shrink: 0; color: var(--color-text-muted); }
.ccl-faq details[open] summary { border-bottom: 1px solid var(--color-border); }
.ccl-faq details[open] summary::after { content: "－"; }
.ccl-faq details > div { padding: .9em 1.2em; font-size: .92rem; line-height: 1.8; }
.ccl-faq details > div::before { content: "A."; color: #2A7A3B; font-weight: 700; margin-right: .4em; }

/* PR表記 */
.ccl-pr-notice {
  background: #FFFDE7;
  border-left: 4px solid #F5C842;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: .6em 1em;
  font-size: .82rem;
  color: #5A4900;
  margin: 0 0 1.5rem;
}

/* 著者ボックス */
.ccl-author-box {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 1.25rem;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  background: #FFFFFF;
  margin: 2.5rem 0;
  box-shadow: var(--shadow-sm);
}
.ccl-author-box__img {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 3px solid var(--color-main);
}
.ccl-author-box__name { font-weight: 700; font-size: 1rem; color: var(--color-main); margin-bottom: .2rem; }
.ccl-author-box__role { font-size: .8rem; color: var(--color-accent); font-weight: 700; margin-bottom: .4rem; }
.ccl-author-box__bio { font-size: .87rem; line-height: 1.7; color: var(--color-text-muted); }

/* 評価スコア */
.ccl-score-box {
  background: #F4F6FA;
  border-radius: var(--radius-md);
  padding: 1.25rem;
  margin: 1.5rem 0;
  border: 1px solid var(--color-border);
}
.ccl-score-row { display: flex; align-items: center; gap: .75rem; margin-bottom: .45rem; font-size: .88rem; }
.ccl-score-row__label { width: 8em; flex-shrink: 0; color: var(--color-text-muted); }
.ccl-score-bar { flex: 1; height: 10px; background: var(--color-border); border-radius: 5px; overflow: hidden; }
.ccl-score-bar__fill { height: 100%; background: linear-gradient(90deg, var(--color-main), var(--color-accent)); border-radius: 5px; }
.ccl-score-row__val { font-weight: 700; color: var(--color-accent); width: 3em; text-align: right; }

/* 関連カード */
.ccl-related-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.ccl-related-card {
  display: block;
  background: #FFFFFF;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 1rem;
  text-decoration: none !important;
  box-shadow: var(--shadow-sm);
  transition: box-shadow .2s, transform .2s;
}
.ccl-related-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.ccl-related-card__title { display: block; font-weight: 700; font-size: .92rem; color: var(--color-main); margin-bottom: .4rem; line-height: 1.4; }
.ccl-related-card__meta { display: block; font-size: .78rem; color: var(--color-text-muted); margin-bottom: .5rem; }
.ccl-related-card__cta {
  display: block;
  background: var(--color-accent);
  color: #FFFFFF !important;
  text-align: center;
  font-weight: 700;
  font-size: .82rem;
  padding: .5em .8em;
  border-radius: var(--radius-sm);
  text-decoration: none !important;
}

/* 商品カード */
.ccl-product-card { border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; background: #FFFFFF; box-shadow: var(--shadow-sm); transition: box-shadow .2s; }
.ccl-product-card:hover { box-shadow: var(--shadow-md); }
.ccl-product-card__img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.ccl-product-card__body { padding: .9rem 1rem; }
.ccl-product-card__name { font-weight: 700; font-size: .95rem; color: var(--color-main); margin-bottom: .35rem; line-height: 1.4; }
.ccl-product-card__comment { font-size: .82rem; background: #F4F6FA; border-left: 3px solid var(--color-accent); padding: .4em .7em; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; margin-bottom: .65rem; }
.ccl-product-card__cta { display: block; background: var(--color-accent); color: #FFFFFF !important; text-align: center; font-weight: 700; font-size: .88rem; padding: .65em 1em; border-radius: var(--radius-sm); text-decoration: none !important; }

/* PR引用ブロック */
.ccl-press-quote {
  border-left: 4px solid var(--color-main);
  background: #F4F6FA;
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: .92rem;
  line-height: 1.8;
}
.ccl-press-quote cite { display: block; margin-top: .6rem; font-size: .78rem; color: var(--color-text-muted); font-style: normal; }

/* =========================================================
   フォーカス・アクセシビリティ
   ========================================================= */
*:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 2px; }

/* =========================================================
   フッター
   ========================================================= */
.l-siteFooter,
.l-footer {
  background: var(--color-main-dark) !important;
  color: rgba(255,255,255,.8) !important;
}
.l-siteFooter a,
.l-footer a { color: rgba(255,255,255,.7) !important; }
.l-siteFooter a:hover,
.l-footer a:hover { color: var(--color-accent-light) !important; }
.l-footer__foot,
.l-siteFooter .l-footer__foot { background: rgba(0,0,0,.25) !important; }
.l-footer__foot *,
.c-footerCopy { color: rgba(255,255,255,.45) !important; font-size: .78rem !important; }

/* =========================================================
   スマホ対応（768px以下）
   ========================================================= */
@media (max-width: 768px) {
  .ccl-hero { padding: 3rem 1.25rem 2.5rem; }
  .ccl-hero-title { font-size: clamp(1.55rem, 6vw, 2rem); }
  .ccl-hero-sub { font-size: .92rem; }
  .ccl-hero-cta { font-size: .95rem; padding: .9em 2em; }

  .ccl-badges { flex-wrap: wrap; }
  .ccl-badge { flex: 1 1 50%; min-width: 0; border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
  .ccl-badge:nth-child(2n) { border-right: none; }
  .ccl-badge:nth-last-child(-n+2) { border-bottom: none; }

  .ccl-cat-grid { grid-template-columns: repeat(2, 1fr); }
  .ccl-cat-card { padding: 1.2rem .9rem; }

  .ccl-strength-item { grid-template-columns: 48px 1fr; gap: .9rem; padding: 1.2rem 1.25rem; }
  .ccl-strength-num { font-size: 1.5rem; }

  .ccl-related-cards { grid-template-columns: 1fr; }
  .l-article h2 { font-size: 1.05rem !important; }
  .l-article h3 { font-size: .98rem !important; }
  .ccl-author-box { flex-direction: column; }
}

@media (max-width: 480px) {
  .ccl-cat-grid { grid-template-columns: 1fr 1fr; gap: .6rem; }
  .ccl-cat-icon { font-size: 1.6rem; }
  .ccl-cat-name { font-size: .88rem; }
}

/* スマホナビ非表示 */
.l-header__spNav { display: none !important; }

/* =========================================================
   v3.1 — 新HTML構造対応パッチ (2026-06-12)
   ========================================================= */

/* 強みアイテム: コンテンツラッパー */
.ccl-strength-content {
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.ccl-strength-content .ccl-strength-title {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font-size: 1.05rem;
  font-weight: 700;
  color: #FFFFFF;
  -webkit-text-fill-color: #FFFFFF !important;
  font-family: "M PLUS 1p", sans-serif;
}
.ccl-strength-content .ccl-strength-desc {
  margin: 0;
  font-size: .88rem;
  color: rgba(255,255,255,.80);
  line-height: 1.75;
}

/* カスタムセクションタイトルH2: article h2スタイルをリセット */
h2.ccl-cat-section-title,
h2.ccl-strengths-title,
h2.ccl-editorial-title {
  border-left: none !important;
  background: none !important;
  padding: 0 !important;
  margin-top: 0 !important;
}

/* 編集部タイトル */
.ccl-editorial-title {
  font-family: "Noto Serif JP", serif;
  font-size: 1.35rem;
  color: var(--color-main);
  margin: 0 0 1rem;
  font-weight: 700;
  text-align: center;
}

/* セクション間余白 */
.ccl-cat-section + .ccl-strengths { margin-top: 0; }
.ccl-strengths + .ccl-editorial-block { margin-top: 0; }

/* モバイル: 強みアイテム */
@media (max-width: 768px) {
  .ccl-strength-item { grid-template-columns: 48px 1fr; gap: .9rem; padding: 1.2rem 1.25rem; }
  .ccl-strength-num { font-size: 1.5rem; }
}

/* =========================================================
   v3.2 — SWELL customizer h2 white color override (2026-06-12)
   SWELLが .post_content h2:where(...){color:#FFF} を注入するため
   ネスト選択子で特定性 0,2,1 に引き上げ
   ========================================================= */

/* カテゴリセクションタイトル → ネイビー */
.ccl-cat-section h2.ccl-cat-section-title,
.ccl-cat-section .ccl-cat-section-title {
  color: var(--color-main) !important;
  -webkit-text-fill-color: var(--color-main) !important;
}

/* 編集部タイトル → ネイビー */
.ccl-editorial-block h2.ccl-editorial-title,
.ccl-editorial-block .ccl-editorial-title {
  color: var(--color-main) !important;
  -webkit-text-fill-color: var(--color-main) !important;
}

/* 強みセクションタイトル → 白（ダーク背景上） */
.ccl-strengths h2.ccl-strengths-title,
.ccl-strengths .ccl-strengths-title {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* 強みセクション内 h3 → 白（SWELLがh3にも干渉する場合の保険） */
.ccl-strengths .ccl-strength-content h3,
.ccl-strengths h3.ccl-strength-title {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  border: none !important;
  background: none !important;
  padding: 0 !important;
  margin: 0 0 .3rem !important;
}

/* =========================================================
   フロントページ専用 (sjc-) 信頼の濃紺×安心のソフトグリーン
   ========================================================= */
.sjc-hero{background:linear-gradient(160deg,#1E3A6E 0%,#16315e 60%,#10264a 100%);color:#fff;border-radius:0 0 28px 28px;padding:56px 20px 60px;text-align:center;position:relative;overflow:hidden}
.sjc-hero:after{content:"";position:absolute;right:-60px;bottom:-60px;width:240px;height:240px;background:radial-gradient(circle,#2F9E74 0%,transparent 70%);opacity:.25}
.sjc-hero__inner{max-width:760px;margin:0 auto;position:relative;z-index:1}
.sjc-hero__eyebrow{display:inline-block;background:#2F9E74;color:#fff;font-weight:700;font-size:.82rem;padding:5px 16px;border-radius:999px;margin-bottom:18px;letter-spacing:.04em}
.sjc-hero__title{font-size:2.1rem;line-height:1.4;font-weight:800;margin:0 0 16px;color:#fff}
.sjc-hero__title span{color:#7BE0B6}
.sjc-hero__lead{font-size:1rem;line-height:1.9;opacity:.95;margin:0 0 30px}
.sjc-hero__btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.sjc-btn{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:170px;background:#fff;color:#1E3A6E;font-weight:800;padding:16px 22px;border-radius:14px;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,.18);transition:transform .15s,box-shadow .15s}
.sjc-btn:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.25)}
.sjc-btn__step{font-size:.7rem;color:#2F9E74;letter-spacing:.08em}
.sjc-btn--accent{background:#2F9E74;color:#fff}
.sjc-btn--accent .sjc-btn__step{color:#CFF3E3}
.sjc-sec{max-width:960px;margin:56px auto;padding:0 20px}
.sjc-sec__ttl{text-align:center;font-size:1.5rem;font-weight:800;color:#1E3A6E;margin:0 0 6px;position:relative}
.sjc-sec__ttl:after{content:"";display:block;width:48px;height:4px;background:#2F9E74;border-radius:2px;margin:10px auto 0}
.sjc-sec__sub{text-align:center;color:#667;font-size:.92rem;margin:0 0 28px}
.sjc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sjc-card{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid #e6ebf2;border-radius:16px;padding:22px;text-decoration:none;transition:border-color .15s,box-shadow .15s;box-shadow:0 2px 10px rgba(30,58,110,.05)}
.sjc-card:hover{border-color:#2F9E74;box-shadow:0 8px 22px rgba(47,158,116,.16)}
.sjc-card__tag{align-self:flex-start;background:#EAF7F1;color:#237D59;font-weight:700;font-size:.76rem;padding:3px 12px;border-radius:999px}
.sjc-card__ttl{color:#22324d;font-weight:700;font-size:1.02rem;line-height:1.6;flex:1}
.sjc-card__go{color:#2F9E74;font-weight:800;font-size:.9rem}
.sjc-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.sjc-cat{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid #e6ebf2;border-radius:14px;padding:20px 18px;text-decoration:none;text-align:center;transition:transform .15s,border-color .15s}
.sjc-cat:hover{transform:translateY(-2px);border-color:#1E3A6E}
.sjc-cat b{color:#1E3A6E;font-size:1.05rem}
.sjc-cat span{color:#7a869a;font-size:.8rem}
.sjc-about{background:#EAF7F1;padding:48px 20px;margin-top:56px}
.sjc-about__inner{max-width:760px;margin:0 auto;text-align:center}
.sjc-about__inner h2{color:#1E3A6E;font-size:1.35rem;font-weight:800;margin:0 0 14px}
.sjc-about__inner p{color:#3f4d63;line-height:1.95;margin:0 0 22px}
.sjc-about__link{display:inline-block;background:#1E3A6E;color:#fff;font-weight:700;padding:12px 30px;border-radius:999px;text-decoration:none}
.sjc-about__link:hover{background:#2F9E74}
@media(max-width:768px){
 .sjc-hero__title{font-size:1.6rem}
 .sjc-cards,.sjc-cats{grid-template-columns:1fr}
 .sjc-btn{width:100%}
 .sjc-hero__btns{flex-direction:column}
}

/* フロント: SWELL既定メインビジュアル非表示 + 色帯フルブリード */
.home #main_visual{display:none !important}
.home .sjc-hero,.home .sjc-about{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);width:100vw}
.home .sjc-hero{border-radius:0 0 30px 30px}
.home .post_content{margin-top:0 !important}

/* SWELL見出し干渉対策(feedback_swell_webkit_text_fill_gotcha)+既定h2装飾無効化 */
.sjc-sec__ttl{color:#1E3A6E !important;-webkit-text-fill-color:#1E3A6E !important;background:none !important;border:none !important;padding:0 !important}
.sjc-about__inner h2{color:#1E3A6E !important;-webkit-text-fill-color:#1E3A6E !important;background:none !important;border:none !important;padding:0 !important}
.sjc-sec__ttl:before,.sjc-about__inner h2:before{content:none !important;display:none !important}
.sjc-hero__title,.sjc-hero__title span{-webkit-text-fill-color:currentColor}
.sjc-hero__title{color:#fff !important;-webkit-text-fill-color:#fff !important}
.sjc-hero__title span{color:#7BE0B6 !important;-webkit-text-fill-color:#7BE0B6 !important}
/* ヘッダー〜ヒーロー間の余白を詰める */
.home .l-mainContent__inner,.home .p-articleThumb{padding-top:0 !important;margin-top:0 !important}
.home #content{padding-top:0 !important}
.home #content.l-container{padding-top:0 !important;margin-top:0 !important}
.home .l-mainContent{padding-top:0 !important}

/* 記事内コンポーネント (sjc-) */
.sjc-figure{margin:28px 0;padding:16px;background:#fff;border:1px solid #e6ebf2;border-radius:14px}
.sjc-table{width:100%;border-collapse:collapse;margin:24px 0;font-size:.95rem}
.sjc-table th{background:#1E3A6E;color:#fff;padding:12px;text-align:left;border:1px solid #1E3A6E}
.sjc-table td{padding:12px;border:1px solid #e0e7f1;vertical-align:top}
.sjc-table tbody tr:nth-child(even){background:#f5f8fc}
.sjc-cta{display:flex;flex-direction:column;align-items:center;gap:8px;margin:26px 0;padding:22px;background:#f3f6fb;border:1px solid #dbe4f0;border-radius:16px}
.sjc-cta--accent{background:#EAF7F1;border-color:#bfe6d5}
.sjc-cta__label{font-weight:700;color:#1E3A6E}
.sjc-cta__btn{display:inline-block;background:#1E3A6E;color:#fff !important;font-weight:800;padding:14px 36px;border-radius:999px;text-decoration:none;font-size:1.05rem;box-shadow:0 4px 14px rgba(30,58,110,.22)}
.sjc-cta--accent .sjc-cta__btn{background:#2F9E74;box-shadow:0 4px 14px rgba(47,158,116,.28)}
.sjc-cta__btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.sjc-cta__note{font-size:.8rem;color:#7a869a}
.sjc-disclosure{font-size:.8rem;color:#8a93a3;margin-top:28px;padding-top:14px;border-top:1px dashed #dde3ec}
blockquote{background:#f5f8fc;border-left:4px solid #2F9E74;margin:18px 0;padding:14px 18px;border-radius:0 8px 8px 0}

/* 記事本文 見出し可読性(SWELL/継承CSSのfill-color白文字対策) */
.post_content h2,article .post_content h2{color:#1E3A6E !important;-webkit-text-fill-color:#1E3A6E !important;background:#EAF7F1 !important;border:none !important;border-left:6px solid #2F9E74 !important;border-radius:0 10px 10px 0 !important;padding:14px 20px !important;font-weight:800}
.post_content h2:before,.post_content h2:after{content:none !important;display:none !important;background:none !important}
.post_content h3,article .post_content h3{color:#1E3A6E !important;-webkit-text-fill-color:#1E3A6E !important;border-left:4px solid #2F9E74 !important;padding-left:12px !important}
.post_content h3:before,.post_content h3:after{content:none !important;display:none !important}