@charset "UTF-8";
/*
Theme Name: Cocoon Child
Template: cocoon-master
Version: 1.1.3
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;800;900&family=Zen+Maru+Gothic:wght@400;500;700;900&display=swap');

:root{
  --ss-cream:#FBF7F1;
  --ss-card:#FFFFFF;
  --ss-ink:#3B3A38;
  --ss-sub:#6F6E6A;
  --ss-teal:#3A9D8E;
  --ss-teal-d:#2E7A70;
  --ss-coral:#F08A5D;
  --ss-coral-d:#DC744A;
  --ss-tint:#FFF3E9;
  --ss-line:#ECE3D6;
  --ss-radius:16px;
  --ss-font:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Maru Gothic Pro","BIZ UDPGothic","Noto Sans JP",sans-serif;
}

/* ============================================================
   1. ベース・タイポグラフィ
   ============================================================ */
body{
  background-color:var(--ss-cream) !important;
  color:var(--ss-ink);
  font-family:var(--ss-font);
  letter-spacing:.01em;
  line-height:1.95;
}
#container,.wrap,#main,#content,.content-in,#main-in{ background-color:transparent; }

.entry-content,.article-body,.post-content{
  font-size:18px;
  line-height:1.95;
  color:var(--ss-ink);
}
.entry-content p{ margin-bottom:1.4em; }
.entry-content strong,.entry-content b{ color:var(--ss-ink); }
.entry-content a{ color:var(--ss-teal-d); text-underline-offset:2px; }

.entry-content h2{
  font-size:1.45em; font-weight:800; line-height:1.5;
  color:var(--ss-ink);
  background:transparent; border:none;
  border-left:6px solid var(--ss-teal);
  padding:.2em 0 .2em .65em;
  margin:2em 0 .8em;
}
.entry-content h3{
  font-size:1.2em; font-weight:800; line-height:1.55;
  color:var(--ss-teal-d);
  border:none; border-bottom:2px dotted var(--ss-line);
  padding-bottom:.25em; margin:1.7em 0 .6em;
}
.entry-content h4{ font-size:1.08em; font-weight:700; color:var(--ss-ink); }

.entry-content blockquote{
  background:var(--ss-card);
  border:none; border-left:5px solid var(--ss-coral);
  border-radius:12px;
  padding:1em 1.2em; margin:1.6em 0;
  color:var(--ss-ink); font-style:normal;
  box-shadow:0 3px 12px rgba(0,0,0,.05);
}

.entry-content table{ border-collapse:collapse; width:100%; border-radius:10px; overflow:hidden; }
.entry-content table th{ background:var(--ss-teal); color:#fff; border-color:#fff; padding:.6em; }
.entry-content table td{ border-color:var(--ss-line); padding:.6em; }
.entry-content ul li::marker{ color:var(--ss-teal); }

/* ============================================================
   2. ヘッダー・ナビ
   ============================================================ */
.site-name-text,.logo-text,.site-name a{ color:var(--ss-teal-d) !important; font-weight:900; }
#header,.header-container{ background:var(--ss-card); }
.navi-in>.menu-header{ background:var(--ss-card); }
.navi-in a{ color:var(--ss-ink); font-weight:700; }
.navi-in a:hover{ background:var(--ss-teal); color:#fff; }
.navi-in>ul>li>a:hover{ color:#fff; }

/* Cocoon グローバルナビ背景を白に統一 */
.navi,#navi-header-in,.navi-header-in{ background:var(--ss-card) !important; }
.navi a,.navi-in a{ color:var(--ss-ink) !important; font-weight:700; }

/* ============================================================
   3. ボタン
   ============================================================ */
.wp-block-button__link,
.entry-content .btn,
a.ss-cta,.ss-cta{
  display:inline-block;
  background:var(--ss-coral) !important;
  color:#fff !important;
  font-weight:900;
  border:none !important;
  border-radius:14px !important;
  padding:16px 26px;
  text-decoration:none;
  box-shadow:0 5px 0 var(--ss-coral-d);
  transition:filter .15s, transform .05s;
}
.wp-block-button__link:hover,.entry-content .btn:hover,a.ss-cta:hover,.ss-cta:hover{
  filter:brightness(1.03); color:#fff !important;
}
.wp-block-button__link:active,a.ss-cta:active{ transform:translateY(2px); box-shadow:0 3px 0 var(--ss-coral-d); }
.ss-cta--lg{ font-size:17px; padding:18px 30px; }
.ss-cta--block{ display:block; text-align:center; width:100%; box-sizing:border-box; }
.ss-cta-note{ font-size:12px; color:var(--ss-sub); margin-top:11px; }

/* ============================================================
   4. 記事カード
   ============================================================ */
.a-wrap,.card,.entry-card,.related-entry-card{
  border-radius:var(--ss-radius) !important;
  border:1.5px solid var(--ss-line) !important;
  background:var(--ss-card);
  box-shadow:0 2px 10px rgba(0,0,0,.03);
  overflow:hidden;
}
.entry-card-title,.card-title,.a-wrap .entry-card-title{
  font-weight:800; color:var(--ss-ink); line-height:1.55;
}
.cat-label,.category-label{
  background:#eaf4f1 !important; color:var(--ss-teal-d) !important;
  border-radius:14px; font-weight:800; border:none;
}
.entry-card-meta,.entry-card-snippet{ color:var(--ss-sub); }

/* ============================================================
   5. 著者・ウィジェット
   ============================================================ */
.author-box,.widget{
  background:var(--ss-card);
  border:1.5px solid var(--ss-line);
  border-radius:var(--ss-radius);
}
.widget-title,.widget h3{
  color:var(--ss-ink); font-weight:800;
  border-bottom:2px solid var(--ss-teal); padding-bottom:6px;
}

/* ============================================================
   6. フッター
   ============================================================ */
.footer,#footer{ background:#3a4a45; color:#cfe0db; }
.footer a,#footer a{ color:#bfe8df; }

/* ============================================================
   .ss-* カスタムコンポーネント
   ============================================================ */
.ss-scope,.ss-scope *{ box-sizing:border-box; }
.ss-scope{ font-family:var(--ss-font); color:var(--ss-ink); }
.ss-scope a{ text-decoration:none; }
.ss-ph{ position:relative;
  background:repeating-linear-gradient(45deg,#e8efee,#e8efee 7px,#f0f5f4 7px,#f0f5f4 14px);
  display:flex; align-items:center; justify-content:center; }
.ss-ph::after{ content:attr(data-ph); font-family:ui-monospace,Menlo,monospace;
  font-size:11px; color:#94aeab; letter-spacing:.05em; }

/* ヒーロー */
.ss-hero{ text-align:center; padding:30px 20px 26px; }
.ss-eyebrow{ display:inline-block; font-size:13px; font-weight:700; color:var(--ss-teal-d);
  background:#eaf4f1; padding:5px 14px; border-radius:20px; margin-bottom:15px; }
.ss-hero h1{ font-size:25px; line-height:1.65; font-weight:900; margin:0 0 14px; }
.ss-mark{ background:linear-gradient(transparent 62%,#ffe0b8 62%); padding:0 2px; }
.ss-hero p{ font-size:15px; color:var(--ss-sub); line-height:1.95; margin:0 auto 22px; max-width:560px; }

/* エントリーグリッド */
.ss-entries{ padding:6px 20px 26px; }
.ss-sectitle{ font-size:20px; font-weight:900; text-align:center; line-height:1.5; margin:0 0 18px; }
.ss-egrid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; max-width:560px; margin:0 auto; }
.ss-ecard{ background:var(--ss-card); border:1.5px solid var(--ss-line); border-radius:var(--ss-radius);
  padding:18px 14px; text-align:center; display:flex; flex-direction:column; gap:4px;
  box-shadow:0 2px 8px rgba(0,0,0,.03); color:var(--ss-ink); }
.ss-ecard .ss-eicon{ font-size:28px; }
.ss-ecard b{ font-size:14.5px; }
.ss-ecard small{ font-size:11.5px; color:var(--ss-sub); }

/* リードマグネット */
.ss-lead{ max-width:600px; margin:8px auto 26px; padding:24px 22px; background:var(--ss-tint);
  border:2px dashed #f0c79a; border-radius:20px; text-align:center; }
.ss-lbadge{ display:inline-block; font-size:12.5px; font-weight:800; color:#a4622f; margin-bottom:10px; }
.ss-lead h2{ font-size:19px; line-height:1.6; font-weight:900; margin:0 0 10px; }
.ss-lead p{ font-size:14px; color:var(--ss-sub); line-height:1.9; margin:0 0 18px; }

/* 信頼バー */
.ss-trustbar{ display:flex; max-width:600px; margin:0 auto; background:var(--ss-card);
  border:1px solid var(--ss-line); border-radius:14px; overflow:hidden; }
.ss-trustbar .ss-tb{ flex:1; padding:16px 8px; text-align:center; border-right:1px solid var(--ss-line); }
.ss-trustbar .ss-tb:last-child{ border-right:none; }
.ss-tb b{ display:block; font-size:18px; font-weight:900; color:var(--ss-teal-d); }
.ss-tb b small{ font-size:10px; font-weight:700; }
.ss-tb span{ font-size:10px; color:var(--ss-sub); line-height:1.4; display:block; margin-top:3px; }

/* チェックリスト */
.ss-checks{ list-style:none; padding:0; margin:0 0 20px; display:flex; flex-direction:column; gap:11px; }
.ss-checks li{ position:relative; padding:14px 16px 14px 46px; background:var(--ss-card);
  border:1.5px solid var(--ss-line); border-radius:14px; font-size:14.5px; line-height:1.7; }
.ss-checks li::before{ content:"✓"; position:absolute; left:15px; top:13px; width:22px; height:22px;
  background:var(--ss-teal); color:#fff; border-radius:50%; font-size:13px; text-align:center; line-height:22px; }

/* 著者ボックス */
.ss-author{ max-width:600px; margin:0 auto; background:var(--ss-card); border:1.5px solid var(--ss-line);
  border-radius:18px; padding:22px; text-align:center; box-shadow:0 2px 8px rgba(0,0,0,.03); }
.ss-author .ss-ava{ width:76px; height:76px; border-radius:50%; margin:0 auto 12px; }
.ss-author .ss-aname{ font-weight:900; font-size:17px; }
.ss-author .ss-arole{ font-size:12px; color:var(--ss-teal-d); font-weight:700; margin-bottom:10px; }
.ss-author p{ font-size:13px; color:var(--ss-sub); line-height:1.85; text-align:left; margin:0; }

/* LPコンポーネント */
.ss-lp{ max-width:680px; margin:0 auto; }
.ss-lp-top{ display:flex; align-items:center; justify-content:space-between; padding:14px 22px;
  border-bottom:1px solid var(--ss-line); background:var(--ss-card); }
.ss-lp-brand{ font-weight:900; color:var(--ss-teal-d); font-size:16px; }
.ss-lp-secure{ font-size:11px; color:var(--ss-teal-d); font-weight:700; background:#eaf4f1; padding:4px 10px; border-radius:14px; }
.ss-lp-hero{ padding:30px 22px; text-align:center; }
.ss-lp-hero h1{ font-size:24px; line-height:1.65; font-weight:900; margin:12px 0; }
.ss-lp-hero p{ font-size:14px; color:var(--ss-sub); line-height:1.9; margin:0 0 18px; }
.ss-lp-split{ display:flex; gap:16px; align-items:center; text-align:left; margin:0 0 20px; }
.ss-lp-pdf{ flex:0 0 130px; height:160px; border-radius:14px; box-shadow:0 8px 22px rgba(0,0,0,.12); }
.ss-lp-get{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.ss-lp-get li{ font-size:13.5px; line-height:1.5; padding-left:24px; position:relative; font-weight:500; }
.ss-lp-get li::before{ content:"✓"; position:absolute; left:0; top:1px; color:#fff; background:var(--ss-teal);
  width:18px; height:18px; border-radius:50%; font-size:11px; text-align:center; line-height:18px; }
.ss-section{ padding:24px 22px; }
.ss-pains{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:11px; }
.ss-pains li{ background:var(--ss-card); border:1.5px solid var(--ss-line); border-radius:14px;
  padding:14px 16px 14px 42px; position:relative; font-size:14px; line-height:1.65; }
.ss-pains li::before{ content:"？"; position:absolute; left:14px; top:13px; width:21px; height:21px;
  background:var(--ss-coral); color:#fff; border-radius:50%; font-size:13px; text-align:center; line-height:21px; font-weight:800; }
.ss-pain-after{ text-align:center; font-size:14.5px; font-weight:700; color:var(--ss-teal-d); margin-top:18px; }
.ss-course{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.ss-cstep{ display:flex; gap:13px; align-items:center; background:var(--ss-card); border:1.5px solid var(--ss-line);
  border-radius:14px; padding:13px 15px; }
.ss-cday{ flex:0 0 auto; font-size:11px; font-weight:800; color:#fff; background:var(--ss-teal);
  padding:6px 10px; border-radius:14px; min-width:54px; text-align:center; white-space:nowrap; }
.ss-cstep b{ font-size:13.5px; display:block; line-height:1.45; }
.ss-cstep small{ font-size:11px; color:var(--ss-sub); }
.ss-voice{ background:var(--ss-tint); padding:24px 22px; }
.ss-voice .ss-vq{ max-width:600px; margin:0 auto 14px; }
.ss-voice .ss-vq:last-child{ margin-bottom:0; }
.ss-voice .ss-vq p{ font-size:14px; line-height:1.95; font-weight:500; margin:0; }
.ss-voice .ss-vq span{ font-size:11.5px; color:var(--ss-sub); display:block; margin-top:8px; }
.ss-form{ background:var(--ss-card); padding:26px 22px; }
.ss-form h2{ font-size:19px; text-align:center; font-weight:900; margin:0 0 18px; }
.ss-field{ margin-bottom:14px; max-width:520px; margin-left:auto; margin-right:auto; }
.ss-field label{ display:block; font-size:12.5px; font-weight:700; margin-bottom:6px; }
.ss-field input{ width:100%; height:48px; background:var(--ss-cream); border:1.5px solid var(--ss-line);
  border-radius:12px; padding:0 14px; font-size:15px; font-family:inherit; }

/* カテゴリリスト */
.ss-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:14px; max-width:680px; }
.ss-lcard{ display:flex; gap:13px; background:var(--ss-card); border:1.5px solid var(--ss-line);
  border-radius:14px; padding:12px; align-items:center; box-shadow:0 2px 8px rgba(0,0,0,.03); color:var(--ss-ink); }
.ss-lthumb{ flex:0 0 92px; height:68px; border-radius:10px; }
.ss-lcard .ss-pill{ display:inline-block; font-size:11px; font-weight:800; color:var(--ss-teal-d);
  background:#eaf4f1; padding:4px 12px; border-radius:14px; margin-bottom:7px; }
.ss-lcard h3{ font-size:14.5px; line-height:1.55; margin:0; font-weight:800; }
.ss-lcard .ss-meta{ font-size:11.5px; color:var(--ss-sub); margin-top:6px; }
.ss-subfilter{ display:flex; gap:8px; overflow-x:auto; padding:4px 0 18px; }
.ss-subfilter a{ flex:0 0 auto; font-size:13px; font-weight:700; color:var(--ss-teal-d);
  padding:7px 15px; border:1.5px solid var(--ss-line); border-radius:20px; background:var(--ss-card); }
.ss-subfilter a.is-on{ background:var(--ss-teal); color:#fff; border-color:var(--ss-teal); }
.ss-more{ display:block; width:100%; max-width:680px; margin:18px 0 0; padding:15px; background:var(--ss-card);
  border:2px solid var(--ss-teal); color:var(--ss-teal-d); font-weight:800; font-size:14.5px;
  border-radius:14px; cursor:pointer; font-family:inherit; }

/* カテゴリ見出し */
.ss-cathead{ text-align:center; padding:26px 20px 18px; }
.ss-cathead .ss-cat-ico{ font-size:34px; }
.ss-cathead h1{ font-size:25px; font-weight:900; margin:6px 0 10px; }
.ss-cathead p{ font-size:13.5px; color:var(--ss-sub); line-height:1.9; max-width:560px; margin:0 auto; }

/* ============================================================
   レスポンシブ
   ============================================================ */
@media (max-width:560px){
  .ss-egrid{ grid-template-columns:1fr 1fr; }
  .ss-lp-split{ flex-direction:column; text-align:center; }
  .ss-lp-pdf{ flex-basis:auto; width:160px; height:200px; }
  .ss-lp-get{ text-align:left; }
}




/* スマホ下部フッターナビ: Cocoon設定で制御 */

/* ─── スマホ フォントサイズ最適化 ─── */
@media(max-width:768px){
  .ss-hero h1{ font-size:20px !important; line-height:1.5; }
  .ss-hero p{ font-size:14px !important; }
  .ss-sectitle{ font-size:16px !important; }
  .ss-ecard b{ font-size:13px !important; }
  .ss-ecard small{ font-size:11px !important; }
  .ss-lead h2{ font-size:16px !important; }
  .entry-content{ font-size:15px; }
  .entry-content h2{ font-size:1.25em !important; }
  .entry-content h3{ font-size:1.1em !important; }
}