@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ====================================================================
   Life Shift ブランド適用（SWELL）
   ==================================================================== */
:root{
  --color_main:#15803d !important;          /* コーポレートグリーン */
  --color_main_rgb:21,128,61 !important;
  --color_main_thin:rgba(21,128,61,.07) !important;
  --color_link:#1773cf !important;          /* リンク＝ブランドブルー */
}

/* デモ用メインビジュアルを非表示（コラムは記事一覧を主役に） */
.p-mainVisual{display:none !important;}

/* メインサイト（lifeshifting.jp）へ戻る上部バー（相互リンク） */
.ls-topbar{background:linear-gradient(90deg,#0f6b32,#1f9e5a);color:#fff;font-size:13px;position:relative;z-index:100}
.ls-topbar-inner{max-width:1160px;margin:0 auto;padding:7px 18px;display:flex;align-items:center;gap:14px}
.ls-topbar a{color:#fff;text-decoration:none;font-weight:700}
.ls-topbar a:hover{text-decoration:underline}
.ls-topbar span{color:rgba(255,255,255,.85);font-weight:500}
.ls-topbar .ls-cta{margin-left:auto;background:#fff;color:#0f6b32;padding:3px 14px;border-radius:999px}
.ls-topbar .ls-cta:hover{background:#eafff1;text-decoration:none}
@media(max-width:600px){.ls-topbar span{display:none}.ls-topbar-inner{padding:6px 12px;gap:10px}}

/* 著者ボックスにロゴをアバター表示（確実な方法） */
.p-authorBox{display:flex;gap:20px;align-items:center}
.p-authorBox__l{flex:none;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:84px;text-align:center}
.p-authorBox__l::before{content:"";display:block;width:68px;height:68px;border-radius:16px;background:#fff url(https://lifeshifting.jp/blog/wp-content/uploads/2026/06/life-shift-avatar.jpg) center/contain no-repeat;border:1px solid #e3ebf3;box-shadow:0 6px 16px -8px rgba(11,19,34,.25)}
.p-authorBox__name{font-weight:700}
@media(max-width:600px){.p-authorBox{gap:14px}.p-authorBox__l{min-width:72px}.p-authorBox__l::before{width:58px;height:58px}}

/* トップの投稿スライダーを停止（記事一覧と二重のため） */
.p-postSlider{display:none !important;}

/* ============================================================
   コラム プロUIデザイン（メインサイト lifeshifting.jp と統一）
   ============================================================ */
:root{
  --ls-ink:#14202e; --ls-body:#2b333d; --ls-muted:#6b7682;
  --ls-grad:linear-gradient(100deg,#1773cf 0%,#2da45f 55%,#8fce3f 100%);
  --ls-line:#e7ecf2;
}
/* ベース */
body{font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;color:var(--ls-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.c-postTitle,.p-postList__title,.c-widget__title,.p-toc__title,.p-authorBox__name,.c-pageTitle{font-family:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif;letter-spacing:.01em}
.c-postTimes,.p-postList__date,time,.c-postMeta__item{font-family:"Space Grotesk","Helvetica Neue",sans-serif;letter-spacing:.02em}

/* 記事タイトル */
.c-postTitle{font-size:clamp(1.6rem,3.6vw,2.2rem) !important;line-height:1.5 !important;font-weight:700;color:var(--ls-ink)}

/* アイキャッチ */
.p-postEyecatch,.p-articleThumb,.c-postThumb__figure{border-radius:16px;overflow:hidden}
.p-postEyecatch{box-shadow:0 24px 56px -26px rgba(11,19,34,.34)}

/* 本文タイポ */
.post_content{font-size:1.04rem;line-height:2;color:var(--ls-body)}
.post_content p{margin:1.4em 0}
.post_content a:not([class*="button"]){color:#1773cf;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px;transition:color .2s}
.post_content a:not([class*="button"]):hover{color:#157a42}
.post_content strong{color:#157a42;font-weight:700}
.post_content ul,.post_content ol{margin:1.4em 0;padding-left:1.55em}
.post_content li{margin:.55em 0;line-height:1.85}
.post_content ul li::marker{color:var(--color_main)}

/* h2：重い全幅ブロックを廃止 → 洗練された下線＋グラデーション・アクセント */
.post_content h2{
  background:none !important;background-color:transparent !important;color:var(--ls-ink) !important;
  border:0 !important;border-bottom:2px solid var(--ls-line) !important;border-radius:0 !important;
  font-family:"Zen Kaku Gothic New",sans-serif !important;font-weight:700 !important;
  font-size:clamp(1.34rem,2.6vw,1.62rem) !important;line-height:1.5 !important;
  padding:0 0 .55em !important;margin:2.9em 0 1.2em !important;position:relative !important;box-shadow:none !important;
}
.post_content h2::before{display:none !important;content:none !important}
.post_content h2::after{content:"" !important;position:absolute !important;left:0 !important;bottom:-2px !important;width:66px !important;height:2px !important;background:var(--ls-grad) !important;border-radius:2px !important}

/* h3 */
.post_content h3{
  background:none !important;background-color:transparent !important;color:var(--ls-ink) !important;
  border:0 !important;border-left:4px solid var(--color_main) !important;border-radius:0 !important;
  font-family:"Zen Kaku Gothic New",sans-serif !important;font-weight:700 !important;font-size:1.2rem !important;
  padding:.05em 0 .05em .65em !important;margin:2.1em 0 .8em !important;box-shadow:none !important;
}
.post_content h3::before{display:none !important;content:none !important}

/* blockquote */
.post_content blockquote{border-left:4px solid var(--color_main);background:#f5faf6;border-radius:0 10px 10px 0;padding:1em 1.3em;margin:1.6em 0;color:#2d4034}

/* 目次（SWELL .p-toc） */
.p-toc{background:#f5faf6 !important;border:1px solid #d9ebe0 !important;border-radius:16px !important;padding:1.3em 1.6em !important}
.p-toc__title{color:#157a42 !important;font-family:"Zen Kaku Gothic New",sans-serif !important;font-weight:700 !important}
.p-toc a{color:var(--ls-body) !important;text-decoration:none}
.p-toc a:hover{color:var(--color_main) !important;text-decoration:underline}

/* 本文内CTA */
.post_content p:has(> a[href*="#contact"]){background:#f3faf5;border:1px solid #cfe9d8;border-radius:16px;padding:1.7em;text-align:center;margin:2.6em 0}
.post_content a[href*="#contact"]{display:inline-block;background:var(--ls-grad);color:#fff !important;text-decoration:none !important;font-weight:700;padding:14px 34px;border-radius:999px;box-shadow:0 12px 26px -12px rgba(45,164,95,.6);transition:transform .25s,box-shadow .25s}
.post_content a[href*="#contact"]:hover{transform:translateY(-2px);box-shadow:0 18px 32px -12px rgba(45,164,95,.7)}

/* 記事カード（一覧・関連） */
.p-postList__link{border-radius:16px;overflow:hidden;border:1px solid var(--ls-line);background:#fff;box-shadow:0 12px 30px -24px rgba(11,19,34,.34);transition:box-shadow .3s,border-color .3s}
.p-postList__item{transition:transform .3s ease}
.p-postList__item:hover{transform:translateY(-6px)}
.p-postList__item:hover .p-postList__link{box-shadow:0 28px 52px -24px rgba(11,19,34,.34);border-color:transparent}
.c-postThumb__figure img{transition:transform .55s ease}
.p-postList__item:hover .c-postThumb__figure img{transform:scale(1.06)}
.p-postList__title{font-size:1.04rem;line-height:1.55;font-weight:700;color:var(--ls-ink)}
.p-postList__body{padding:16px 18px 20px}
.c-postThumb__cat .c-postThumb__catLabel,.c-postThumb__catLabel,.cat-label{background:var(--color_main) !important;border-radius:6px !important;font-weight:700;letter-spacing:.02em;font-size:.7rem}

/* セクション見出し（著者/関連/サイドバー） */
.c-secTitle{font-family:"Zen Kaku Gothic New",sans-serif !important;font-weight:700 !important}
.c-widget__title{border-left:5px solid var(--color_main);padding-left:.55em;font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700}
.c-pageTitle{font-weight:700}

/* SWELLボタンをブランドグラデーションに */
.swell-block-button.is-style-btn_solid .swell-block-button__link,.wp-element-button.is-style-btn_solid{background-image:var(--ls-grad) !important;border:0 !important}

/* 引用ボックスの二重線を解消（SWELL標準の装飾縦線を消し、緑1本に） */
.post_content blockquote::before{display:none !important;content:none !important}
.post_content blockquote{padding-left:1.3em !important}

/* ブログ一覧トップのデザインヘッダー */
.ls-bloghead{grid-column:1/-1;width:100%;order:-1;flex-basis:100%;text-align:center;padding:10px 16px 38px;box-sizing:border-box}
.ls-bloghead__eyebrow{font-family:"Space Grotesk",sans-serif;font-weight:600;letter-spacing:.3em;font-size:.78rem;color:#2da45f;display:inline-block;margin-bottom:10px}
.ls-bloghead__title{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700;font-size:clamp(1.7rem,4vw,2.4rem);color:var(--ls-ink);line-height:1.3;margin:0}
.ls-bloghead__title::after{content:"";display:block;width:60px;height:3px;background:var(--ls-grad);border-radius:3px;margin:14px auto 0}
.ls-bloghead__lead{margin:16px auto 0;max-width:600px;color:var(--ls-muted);font-size:.95rem;line-height:1.85}

/* ============================================================
   メディア級リッチ化：カテゴリchips／注目記事ヒーロー／読了時間
   ============================================================ */
/* カテゴリーナビ chips */
.ls-catnav{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:24px}
.ls-chip{display:inline-block;padding:8px 18px;border-radius:999px;border:1px solid var(--ls-line);background:#fff;color:#42505f;font-size:.86rem;font-weight:700;text-decoration:none;transition:color .2s,border-color .2s,background .2s}
.ls-chip:hover{border-color:var(--color_main);color:var(--color_main)}
.ls-chip.-on{background:var(--ls-grad);color:#fff;border-color:transparent}

/* 読了時間バッジ */
.ls-readtime{margin:0 0 1.5em !important}
.ls-readtime span{display:inline-block;background:#f0f6f2;color:#157a42;font-family:"Space Grotesk","Helvetica Neue",sans-serif;font-weight:600;font-size:.8rem;padding:5px 14px;border-radius:999px;border:1px solid #d9ebe0;letter-spacing:.02em}

/* 注目記事ヒーロー（一覧の先頭カードを大型・横型に） */
@media(min-width:782px){
  .p-postList.-type-card .p-postList__item:first-of-type{flex:0 0 100% !important;width:100% !important;max-width:100% !important;position:relative}
  .p-postList.-type-card .p-postList__item:first-of-type .p-postList__link{display:flex !important;flex-direction:row !important;align-items:stretch}
  .p-postList.-type-card .p-postList__item:first-of-type .p-postList__thumb{flex:0 0 56%;width:56%;margin:0}
  .p-postList.-type-card .p-postList__item:first-of-type .c-postThumb__figure{height:100%;border-radius:0}
  .p-postList.-type-card .p-postList__item:first-of-type .c-postThumb__figure img{height:100% !important;min-height:280px;object-fit:cover}
  .p-postList.-type-card .p-postList__item:first-of-type .p-postList__body{flex:1;display:flex;flex-direction:column;justify-content:center;padding:30px 36px}
  .p-postList.-type-card .p-postList__item:first-of-type .p-postList__title{font-size:1.55rem;line-height:1.5;margin-bottom:.5em}
  .p-postList.-type-card .p-postList__item:first-of-type .p-postList__link::before{content:"PICK UP";position:absolute;top:18px;left:18px;z-index:3;background:var(--ls-grad);color:#fff;font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:.7rem;letter-spacing:.12em;padding:6px 14px;border-radius:999px;box-shadow:0 8px 18px -8px rgba(45,164,95,.6)}
}

/* アーカイブの標準見出しは非表示（デザインヘッダーに一本化） */
.archive .c-pageTitle{display:none !important;}

/* ============================================================
   追従する目次（サイドバー・スクロール追従）
   ============================================================ */
.ls-stoc{position:sticky;top:88px;background:#fff;border:1px solid var(--ls-line);border-radius:14px;padding:18px 20px;margin-bottom:24px;max-height:calc(100vh - 120px);overflow:auto}
.ls-stoc__title{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700;color:#157a42;font-size:1rem;margin:0 0 .9em;padding-left:.55em;border-left:4px solid var(--color_main)}
.ls-stoc__list{list-style:none;margin:0;padding:0}
.ls-stoc__item{margin:.1em 0}
.ls-stoc__item a{display:block;padding:7px 10px;border-radius:8px;color:#42505f;text-decoration:none;font-size:.86rem;line-height:1.55;border-left:2px solid transparent;transition:background .2s,color .2s,border-color .2s}
.ls-stoc__item.-h3 a{padding-left:24px;font-size:.81rem;color:#5f6b7a}
.ls-stoc__item a:hover{background:#f3faf5;color:var(--color_main)}
.ls-stoc__item.-active a{color:#157a42;background:#f0f6f2;border-left-color:var(--color_main);font-weight:700}
/* デスクトップ：追従目次を表示し、本文内のインライン目次は非表示 */
@media(min-width:1024px){ .post_content .p-toc{display:none !important} }
/* モバイル：追従目次は隠し、インライン目次を使用 */
@media(max-width:1023px){ .ls-stoc{display:none !important} }

/* ============================================================
   ヘッダー整理：緑の二重帯を解消し、白基調のクリーンなヘッダーに
   ============================================================ */
/* SWELLヘッダーバー（キャッチ＋SNS）を白背景に */
.l-header__bar{background:#fff !important;border-bottom:1px solid var(--ls-line) !important}
/* 冗長なキャッチコピーは非表示（ページ見出しと重複のため） */
.c-catchphrase{display:none !important}
/* SNSアイコンは白地に映る色へ */
.l-header__bar .c-iconList__link{color:#8a94a0 !important}
.l-header__bar .c-iconList__link:hover{color:var(--color_main) !important}
/* ロゴ（サイト名）を黒・ブランドフォントで */
.l-header__logo a,.c-headLogo a,.c-headLogo{color:var(--ls-ink) !important;font-family:"Zen Kaku Gothic New",sans-serif !important;font-weight:700}
/* ヘッダー全体は白 */
.l-header,.l-header__inner{background:#fff !important}

/* ============================================================
   ヘッダー仕上げ：SNS帯省略／LSロゴ画像／グローバルナビ
   ============================================================ */
/* SNSの白帯を省きタイトに（ロゴを上部バー直下に） */
.l-header__bar{display:none !important}
/* ロゴにLSマーク画像を付与（テキストの前） */
.l-header__logo a{display:inline-flex !important;align-items:center}
.l-header__logo a::before{content:"";display:inline-block;width:30px;height:30px;background:url(https://lifeshifting.jp/blog/wp-content/uploads/2026/06/life-shift-avatar.jpg) center/contain no-repeat;margin-right:10px;border-radius:7px;flex:none}
/* グローバルナビをブランド調に */
.c-gnav__item>a,.l-header__nav a{font-weight:600;color:var(--ls-ink)}
.c-gnav__item>a:hover,.l-header__nav a:hover{color:var(--color_main)}

/* 固定（追従）ヘッダーのロゴにもLSマークを付与し統一 */
.l-fixHeader__logo a{display:inline-flex !important;align-items:center}
.l-fixHeader__logo a::before{content:"";display:inline-block;width:26px;height:26px;background:url(https://lifeshifting.jp/blog/wp-content/uploads/2026/06/life-shift-avatar.jpg) center/contain no-repeat;margin-right:9px;border-radius:6px;flex:none}

/* 本文内の無料ツール導線をボタン化（青系で問い合わせCTAと差別化） */
.post_content a[href*="/tools"]{display:inline-block;background:linear-gradient(100deg,#1466cf,#1784b0 60%,#22a36a);color:#fff !important;text-decoration:none !important;font-weight:700;padding:13px 30px;border-radius:999px;box-shadow:0 10px 24px -10px rgba(23,115,207,.55);transition:transform .25s,box-shadow .25s}
.post_content a[href*="/tools"]:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(23,115,207,.6)}
.post_content p:has(> a[href*="/tools"]){background:#eef6fb;border:1px solid #cfe0ef;border-radius:16px;padding:1.6em;text-align:center;margin:2.4em 0}

/* AI体験デモへの導線（本文内）も同様にボタン化 */
.post_content a[href*="/ai-demo"]{display:inline-block;background:linear-gradient(100deg,#1466cf,#1784b0 60%,#22a36a);color:#fff !important;text-decoration:none !important;font-weight:700;padding:13px 30px;border-radius:999px;box-shadow:0 10px 24px -10px rgba(23,115,207,.55);transition:transform .25s,box-shadow .25s}
.post_content a[href*="/ai-demo"]:hover{transform:translateY(-2px)}
.post_content p:has(> a[href*="/ai-demo"]){background:#eef6fb;border:1px solid #cfe0ef;border-radius:16px;padding:1.6em;text-align:center;margin:2.4em 0}

/* 成熟度診断への導線もボタン化 */
.post_content a[href*="/maturity"]{display:inline-block;background:linear-gradient(100deg,#1466cf,#1784b0 60%,#22a36a);color:#fff !important;text-decoration:none !important;font-weight:700;padding:13px 30px;border-radius:999px;box-shadow:0 10px 24px -10px rgba(23,115,207,.55);transition:transform .25s,box-shadow .25s}
.post_content a[href*="/maturity"]:hover{transform:translateY(-2px)}
.post_content p:has(> a[href*="/maturity"]){background:#eef6fb;border:1px solid #cfe0ef;border-radius:16px;padding:1.6em;text-align:center;margin:2.4em 0}

/* ============================================================
   ブログ一覧・カテゴリーは1カラム中央寄せ（メディア風・全幅）
   ※記事個別ページの追従目次サイドバーは維持する
   ============================================================ */
.blog .l-content > .l-sidebar,
.archive .l-content > .l-sidebar{display:none !important}
.blog main.l-mainContent,
.archive main.l-mainContent{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
/* 一覧の内側は中央に収める（横長になりすぎないよう上限） */
.blog .ls-bloghead,
.archive .ls-bloghead{max-width:1080px;margin-left:auto;margin-right:auto}

/* ============================================================
   グローバルナビのドロップダウン（無料ツール等）を読みやすく
   ============================================================ */
.c-gnav .sub-menu,
.l-fixHeader .sub-menu{
  min-width:262px;
  background:#fff !important;
  border:1px solid #e3e8ee;
  border-radius:14px;
  box-shadow:0 18px 40px -16px rgba(15,40,30,.34),0 4px 12px -6px rgba(15,40,30,.16) !important;
  padding:8px;
  margin-top:10px;
}
/* 無料ツールのドロップダウンは右寄せにして画面外クリップを防ぐ */
.c-gnav .menu-item:has(> .sub-menu a[href*="/ai-demo"]) > .sub-menu,
.c-gnav .menu-item:has(> .sub-menu a[href*="/maturity"]) > .sub-menu,
.l-fixHeader .menu-item:has(> .sub-menu a[href*="/ai-demo"]) > .sub-menu{
  left:auto !important;
  right:0 !important;
}
/* 各項目：余白を確保し文字を濃く・読みやすく */
.c-gnav .sub-menu .menu-item,
.l-fixHeader .sub-menu .menu-item{border:none !important;margin:0 !important}
.c-gnav .sub-menu a,
.l-fixHeader .sub-menu a{
  display:flex !important;
  align-items:center;
  gap:8px;
  padding:11px 14px !important;
  border-radius:9px;
  font-size:14px;
  font-weight:600;
  line-height:1.4;
  color:var(--ls-ink) !important;
  white-space:nowrap;
  transition:background .18s,color .18s;
}
/* SWELL標準のシェブロンをブランド色のドットに統一 */
.c-gnav .sub-menu a::before,
.l-fixHeader .sub-menu a::before{
  content:"" !important;
  flex:none;
  width:6px;height:6px;
  border-radius:50%;
  background:var(--color_main);
  opacity:.55;
  transition:opacity .18s,transform .18s;
}
.c-gnav .sub-menu a:hover,
.l-fixHeader .sub-menu a:hover{
  background:#eef7f0;
  color:var(--color_main) !important;
}
.c-gnav .sub-menu a:hover::before,
.l-fixHeader .sub-menu a:hover::before{opacity:1;transform:scale(1.25)}