@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://ie-method.com
    Description: SWELL の子テーマ（ie-method カラースキーム適用・v15 takara構造ベース）
    Version: 1.0.0
    Author: イエメソッド編集部
    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ============================================
   ie-method カラースキーム（v15 2026-05-29 確定）
   メイン: フォレストグリーン #3F5A33 ／ CTA: ビビッドオレンジ #F26430
   ============================================ */
:root{
  --color_main:#3F5A33 !important;
  --color_main_dark:#2A3F22 !important;
  --color_main_thin:#E2EADB !important;
  --color_link:#3F5A33 !important;

  /* ロゴ表示サイズの強制上書き（v16 2026-05-29）
     SWELL は loos_customizer.logo_size_pc=240 を内部で 40px相当に変換するが、
     DBクローン直後はカスタマイザー画面で再保存していないと変換キャッシュが効かず、
     生の 240px が --logo_size_pc に焼かれてヘッダー帯が異常に太くなる現象が発生。
     子テーマ側で強制的に takara の dynamic CSS と同じ値に揃える。
     本番展開時は SWELL カスタマイザーで「ロゴサイズ」を一度保存すれば自動再計算されるが、
     この強制上書きは多重保険として残す（本番でも害なし）。 */
  --logo_size_pc:40px !important;
  --logo_size_sp:48px !important;
}

/* --- メインCTA（loos/button color=red）: CV色オレンジ＋ピル型 --- */
.swell-block-button.red_ .swell-block-button__link{
  background-color:#F26430 !important;
  border-radius:9999px !important;
}
.swell-block-button.red_ .swell-block-button__link:hover{
  background-color:#C44E1F !important;
}

/* --- 副CTA（loos/button color=green）: フォレストグリーンアウトライン
       2026-05-29 確定。比較系・補助動線用。メインCTA（オレンジ塗り）と階層を明確にし、
       hover でメインに反応がない場合のセカンドチョイスとして機能させる。
       SWELL 素の green_ #62D847 ライム緑がブランドと不整合なので強制上書き。 --- */
.swell-block-button.green_ .swell-block-button__link{
  background-color:transparent !important;
  color:#3F5A33 !important;
  border:2px solid #3F5A33 !important;
  border-radius:9999px !important;
  font-weight:700 !important;
  transition:.2s;
}
.swell-block-button.green_ .swell-block-button__link:hover{
  background-color:#3F5A33 !important;
  color:#ffffff !important;
}

/* --- h2：左バー＋極薄ティント（SWELL既定装飾は無効化） --- */
.post_content h2{
  background:#E2EADB;
  border:none;
  border-left:6px solid #3F5A33;
  border-radius:0 4px 4px 0;
  padding:.6em .7em;
  color:#2A3F22;
}
.post_content h2::before,
.post_content h2::after{display:none !important;}

/* --- h3：ウッド色左ボーダー（緑×ウッドのトーン差） --- */
.post_content h3{
  border:none;
  border-left:5px solid #A88656;
  padding:.1em .65em;
  color:#2A3F22;
}
.post_content h3::before,
.post_content h3::after{display:none !important;}

/* --- CTAボタン：PCで存在感を強化（縦余白・文字を拡大）--- */
@media (min-width:960px){
  .swell-block-button.red_ .swell-block-button__link{
    padding-top:1.15em !important;
    padding-bottom:1.15em !important;
    font-size:1.2em !important;
    font-weight:700 !important;
  }
}

/* --- CTAボタン：SPで文字が長くても自動折返しで読めるように
       2026-05-29 確定。SPだとCTA文言（28-32字）が1行に収まらず横スクロール or
       見切れになるケースがあった。SWELL素のbtn__linkは white-space:nowrap だが
       SPでは normal にして自然折返し＋line-height 1.45 で2行レイアウト前提に。 */
@media (max-width:600px){
  .swell-block-button .swell-block-button__link{
    white-space:normal !important;
    line-height:1.45 !important;
    padding-top:.95em !important;
    padding-bottom:.95em !important;
    font-size:.95em !important;
  }
  .swell-block-button .swell-block-button__link span{
    display:inline-block;
    word-break:keep-all;
    overflow-wrap:anywhere;
  }
  /* br-sp はSPで改行・PCでは消す（SWELL標準仕様） */
  br.br-sp{ display:inline; }
}
@media (min-width:601px){
  br.br-sp{ display:none; }
}

/* --- CTAサブテキスト（is-style-cta-sub）: ボタン直下に密接配置・補助スタイル
       2026-05-29 確定。CTAボタンの下に置く小さな補助コピー（不安解消・特典の具体明示）。
       本文段落と同じスタイルだとボタンと無関係に見え、コピーが浮く。
       ボタン直下に詰めて中央寄せ・小さめ・補助カラーにすることで
       「ボタンに対する補助テキスト」と一目で認識できるグループ感を作る。 */
.post_content .is-style-cta-sub,
.is-style-cta-sub{
  margin-top:-.5em !important;
  margin-bottom:2.2em !important;
  font-size:.82em !important;
  line-height:1.55 !important;
  color:#7A7268 !important;
  text-align:center !important;
  letter-spacing:.01em;
}
/* SP：少し小さめ＋折返し時の読みやすさ確保 */
@media (max-width:600px){
  .post_content .is-style-cta-sub,
  .is-style-cta-sub{
    font-size:.78em !important;
    padding:0 .4em;
  }
}

/* --- ハブ/home の記事カードリンク（iem-card-grid）: CV最大化のCTR強化
       2026-05-29 確定。home と maker-ranking の各セクションで使用。
       素のテキストリンクだとリンク感が弱くCTRが落ちるため、
       タイトル+補足説明+矢印のカード型に。PC=2列 / SP=1列 でレスポンシブ。 */
.post_content .iem-card-grid,
.iem-card-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:0 0 26px;
  padding:0;
  list-style:none;
}
.post_content .iem-card-grid li,
.iem-card-grid li{
  list-style:none;
  margin:0;
  padding:0;
}
.post_content .iem-card-link,
.iem-card-link{
  display:block;
  background:#fff;
  border:1px solid #E6DFD2;
  border-radius:10px;
  padding:14px 46px 14px 18px;
  text-decoration:none !important;
  color:inherit;
  position:relative;
  transition:.18s;
}
.post_content .iem-card-link:hover,
.iem-card-link:hover{
  background:#F1ECE2;
  border-color:#3F5A33;
  box-shadow:0 4px 12px rgba(63,90,51,.10);
}
.iem-card-title{
  font-size:15.5px;
  font-weight:800;
  color:#2A3F22;
  margin:0 0 4px;
  line-height:1.45;
}
.iem-card-desc{
  font-size:12.5px;
  color:#7A7268;
  margin:0;
  line-height:1.5;
}
.iem-card-arrow{
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  color:#F26430;
  font-size:22px;
  font-weight:800;
  line-height:1;
  transition:transform .18s;
}
.iem-card-link:hover .iem-card-arrow{
  transform:translateY(-50%) translateX(4px);
}
@media (max-width:600px){
  .post_content .iem-card-grid,
  .iem-card-grid{ grid-template-columns:1fr; }
  .iem-card-title{ font-size:14.5px; }
}

/* --- FAQ：質問（Q）の文字に色をつける --- */
.swell-block-faq .faq_q{
  color:#3F5A33;
}

/* --- ヒーロー見出し：スマホ版のみ改行（br.br-sp）。PCは1行 --- */
.br-sp{display:none;}
@media (max-width:600px){
  .br-sp{display:inline;}
}

/* --- モバイル固定CTA（画面下スリムバー・スマホのみ）--- */
.m-fixed-cta{display:none;}
@media (max-width:600px){
  .m-fixed-cta{
    display:block;position:fixed;left:0;right:0;bottom:0;z-index:999;
    background:#F26430;box-shadow:0 -2px 8px rgba(0,0,0,.18);
  }
  .m-fixed-cta a{
    display:block;text-align:center;color:#fff;font-weight:700;
    padding:13px 10px;font-size:.95em;line-height:1.3;text-decoration:none;
  }
  /* 固定バーぶんの余白（最下部コンテンツが隠れないように）*/
  body{padding-bottom:54px;}
}