@charset "UTF-8";
/* ==========================================================================
   法定研修 専門ページ  /shinka/legal-training/
   ※ デザイン基盤は療育研修LPと共有する。
      assets/css/ryoiku-training.css（--teal-* 等のトークン、.rt-* 共通コンポーネント、
      ヘッダー／フッター／CTA／FAQ／料金／レスポンシブ）を先に読み込み、
      このファイルでは「法定研修ページ固有のもの」だけを定義する。
      → 兄弟ページとして見た目が必ず一致し、CSSの二重管理を避けられる。
      → 将来 abuse-training 等を追加する際も同じ構成で足せる。
   ========================================================================== */

/* ===== 療育研修LPの body クラス依存ルールを、このページにも適用する ===== */
/* 子テーマ style.css の body{overflow:hidden scroll!important} を打ち消す。
   これが効いていると body 内側にスクロールバー分(約15px)が確保され、
   全セクションの背景が右端まで届かず白い帯が出る。 */
body.coconova-legal-page{overflow:visible!important;background:#fff}
body.coconova-legal-page .coconova-breadcrumb{--cocobc-accent:#1E9494}

/* ===== 01. 課題チェックリスト（どの研修を実施すればよいか迷っていませんか？） ===== */
.lt-worries{padding:var(--section-padding) 0;background:linear-gradient(180deg,var(--teal-50) 0%,#fff 60%)}
.lt-worries-head{text-align:center;margin-bottom:28px}
.lt-worry-list{list-style:none;display:grid;grid-template-columns:1fr;gap:10px;max-width:900px;margin:0 auto}
.lt-worry{display:flex;align-items:flex-start;gap:11px;background:#fff;border:1px solid var(--teal-100);border-radius:14px;padding:15px 16px;box-shadow:0 2px 10px rgba(30,148,148,.05)}
.lt-worry svg{flex-shrink:0;color:var(--teal-500);margin-top:3px}
.lt-worry span{font-family:var(--font-heading);font-size:15px;font-weight:700;color:var(--gray-800);line-height:1.65}
.lt-answer{max-width:900px;margin:26px auto 0;background:#fff;border:2px solid var(--teal-200);border-radius:20px;padding:26px 20px;text-align:center;box-shadow:0 8px 28px rgba(30,148,148,.1)}
.lt-answer-kicker{display:inline-block;font-family:var(--font-heading);font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--teal-600);background:var(--teal-50);border:1px solid var(--teal-100);border-radius:20px;padding:5px 16px;margin-bottom:14px}
.lt-answer h3{font-family:var(--font-heading);font-size:clamp(19px,4.4vw,25px);font-weight:700;color:var(--gray-900);line-height:1.5;margin-bottom:12px}
.lt-answer h3 em{font-style:normal;color:var(--teal-600)}
.lt-answer p{font-size:15.5px;color:var(--gray-700);line-height:1.9;max-width:660px;margin:0 auto}

/* ===== 02. 対応している主な研修（4カテゴリ） ===== */
.lt-cats{padding:var(--section-padding) 0;background:#fff}
.lt-cats-head{text-align:center;margin-bottom:30px}
.lt-cat-grid{display:grid;grid-template-columns:1fr;gap:14px;max-width:1080px;margin:0 auto}
.lt-cat{background:#fff;border:1px solid var(--gray-200);border-radius:18px;padding:24px 20px;display:flex;flex-direction:column;transition:border-color .25s,transform .25s,box-shadow .25s}
.lt-cat:hover{border-color:var(--teal-200);transform:translateY(-3px);box-shadow:0 10px 26px rgba(30,148,148,.09)}
.lt-cat-icon{width:48px;height:48px;border-radius:14px;background:var(--teal-50);border:1px solid var(--teal-100);display:flex;align-items:center;justify-content:center;color:var(--teal-500);margin-bottom:14px}
.lt-cat h3{font-family:var(--font-heading);font-size:17px;font-weight:700;color:var(--gray-900);line-height:1.5;margin-bottom:10px}
.lt-cat p{font-size:14.5px;color:var(--gray-700);line-height:1.85;flex:1}
.lt-cat-more{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-family:var(--font-heading);font-size:14px;font-weight:700;color:var(--teal-600)}
.lt-cat-more:hover{color:var(--teal-500);text-decoration:underline;text-underline-offset:3px}

/* ===== 03. その他の関連研修（テキストリスト） ===== */
.lt-other{max-width:900px;margin:30px auto 0;background:var(--gray-50);border:1px solid var(--gray-200);border-radius:18px;padding:24px 20px}
.lt-other-label{font-family:var(--font-heading);font-size:15px;font-weight:700;color:var(--gray-800);margin-bottom:12px;text-align:center}
.lt-other-list{list-style:none;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:14px}
.lt-other-list li{font-size:13.5px;color:var(--gray-700);background:#fff;border:1px solid var(--gray-200);border-radius:16px;padding:6px 14px}
.lt-other-note{font-size:14px;color:var(--gray-600);line-height:1.85;text-align:center;margin:0}

/* ===== 03b. 虐待防止研修 専門ページへの導線（兄弟スポークへの内部リンク） =====
   配色は虐待防止LP（ネイビー #12293F / ゴールド #D4AC5C）に合わせる。
   ※ これらのトークンは abuse-training.css 側の :root にあり、このページでは
      読み込まれないため、ここでは直値で指定する。 */
.lt-spoke{max-width:900px;margin:18px auto 0;background:#fff;border:1px solid #EBD9AE;border-radius:18px;
  padding:24px 22px;display:flex;flex-wrap:wrap;align-items:center;gap:18px;box-shadow:0 8px 26px rgba(18,41,63,.08)}
/* 見出しの行頭に合わせたいので、アイコンだけ上揃えにする */
.lt-spoke-icon{flex-shrink:0;align-self:flex-start;margin-top:2px;width:48px;height:48px;border-radius:14px;
  background:#FBF6EA;border:1px solid #EBD9AE;display:flex;align-items:center;justify-content:center;color:#9C7526}
.lt-spoke-body{flex:1 1 260px;min-width:0}
.lt-spoke-body h3{font-family:var(--font-heading);font-size:clamp(17px,2.4vw,20px);font-weight:700;
  color:var(--gray-900);line-height:1.55;margin:0 0 8px;text-wrap:balance}
.lt-spoke-body h3 em{font-style:normal;color:#9C7526}
.lt-spoke-body p{font-size:14.5px;color:var(--gray-700);line-height:1.85;margin:0}
.lt-spoke-act{flex-shrink:0}
.lt-spoke-btn{display:inline-flex;align-items:center;gap:9px;background:linear-gradient(135deg,#1B3A5C 0%,#12293F 120%);
  color:#fff;padding:14px 26px;border-radius:30px;font-family:var(--font-heading);font-size:15px;font-weight:700;
  letter-spacing:.03em;box-shadow:0 6px 20px rgba(18,41,63,.24);transition:transform .2s,box-shadow .2s}
.lt-spoke-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(18,41,63,.3)}

/* ===== 04. 特徴（3つの差別化ポイント） ===== */
.lt-points{padding:var(--section-padding) 0;background:linear-gradient(180deg,var(--teal-50) 0%,#fff 55%)}
.lt-points-head{text-align:center;margin-bottom:30px}
.lt-point-grid{display:grid;grid-template-columns:1fr;gap:14px;max-width:1000px;margin:0 auto}
.lt-point{background:#fff;border:1px solid var(--teal-100);border-radius:18px;padding:24px 20px;box-shadow:0 6px 22px rgba(30,148,148,.06)}
.lt-point-num{font-family:var(--font-en);font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--teal-400);margin-bottom:8px}
.lt-point h3{font-family:var(--font-heading);font-size:18px;font-weight:700;color:var(--gray-900);line-height:1.5;margin-bottom:10px}
.lt-point p{font-size:15px;color:var(--gray-700);line-height:1.9}
.lt-point p+p{margin-top:8px}
.lt-point strong{color:var(--teal-700)}
.lt-plus{max-width:1000px;margin:20px auto 0;background:#fff;border:1px dashed var(--teal-200);border-radius:16px;padding:20px 18px;text-align:center}
.lt-plus p{font-size:15px;color:var(--gray-700);line-height:1.9;margin:0}
.lt-plus strong{color:var(--teal-700)}

/* ===== 05. 制度についての注記（断定を避ける注意書き） ===== */
.lt-note{max-width:820px;margin:22px auto 0;background:var(--warm-50);border:1px solid var(--warm-200);border-radius:14px;padding:16px 18px;display:flex;gap:12px;align-items:flex-start}
.lt-note svg{flex-shrink:0;color:var(--orange-500);margin-top:2px}
.lt-note p{font-size:13.5px;color:var(--gray-700);line-height:1.85;margin:0}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media(min-width:600px){
  .lt-worry-list{grid-template-columns:repeat(2,1fr)}
  .lt-cat-grid{grid-template-columns:repeat(2,1fr)}
  .lt-point-grid{grid-template-columns:repeat(3,1fr)}
}
@media(min-width:900px){
  .lt-cat-grid{grid-template-columns:repeat(4,1fr);gap:20px}
  .lt-worry-list{grid-template-columns:repeat(3,1fr)}
  .lt-cat{padding:28px 22px}
  .lt-point{padding:30px 26px}
  .lt-answer{padding:34px 30px}
}

/* ==========================================================================
   Cocoon 親テーマのスタイル打ち消し（このページのみ）
   ※ ryoiku-training.css の同ブロックは .coconova-ryoiku-page 限定のため再宣言する
   ========================================================================== */
.coconova-legal-page h1,.coconova-legal-page h2,.coconova-legal-page h3,.coconova-legal-page h4{background:none!important;border:none!important}
.coconova-legal-page h1,.coconova-legal-page h2:not(.section-title),.coconova-legal-page h3,.coconova-legal-page h4{padding:0!important}
.coconova-legal-page .rt-about h3{padding-left:14px!important;border-left:4px solid var(--teal-300)!important}
/* Cocoon の ul/ol 既定（マーカー・余白）を打ち消す。
   ※ margin を一律 0 にすると中央寄せ（margin:0 auto）や要素間の余白まで
      消えてしまうため、list-style と padding だけを一括で打ち消し、
      margin は要素ごとに再指定する。 */
.coconova-legal-page .nav-links,.coconova-legal-page .footer-links,.coconova-legal-page .rt-feature-list,
.coconova-legal-page .rt-price-targets,.coconova-legal-page .rt-faq-list,
.coconova-legal-page .lt-worry-list,.coconova-legal-page .lt-other-list{list-style:none!important;padding:0!important}
.coconova-legal-page .nav-links,.coconova-legal-page .footer-links,.coconova-legal-page .rt-feature-list{margin:0!important}
.coconova-legal-page .rt-faq-list{margin:0 auto!important;max-width:800px!important}
.coconova-legal-page .lt-worry-list{margin:0 auto!important}
.coconova-legal-page .lt-other-list{margin:0 0 14px!important}
.coconova-legal-page .rt-price-targets{margin:8px 0 0!important}
.coconova-legal-page .rt-faq-list li,.coconova-legal-page .lt-worry-list li,.coconova-legal-page .lt-other-list li{list-style:none!important;margin:0!important}
.coconova-legal-page .rt-faq-list li{padding:0!important}
.coconova-legal-page .rt-faq-list li::before,.coconova-legal-page .lt-worry-list li::before,.coconova-legal-page .lt-other-list li::before{content:none!important}
.coconova-legal-page .rt-feature-list li{list-style:none!important;padding-left:22px!important;margin:0!important}
.coconova-legal-page img{border:none!important}
.coconova-legal-page .article,.coconova-legal-page .entry-content{padding:0!important;margin:0!important}
.coconova-legal-page #content,.coconova-legal-page .content{margin:0!important;padding:0!important;max-width:none!important}
.coconova-legal-page *{box-sizing:border-box!important}