/* グローバルナビの最後のメニュー項目(=LINEで相談する)を緑背景に */
.l-header__gnav .c-gnav > li:last-child > a {
background-color: #06C755 !important;
color: #FFFFFF !important;
transition: background-color 0.2s !important;
}
.l-header__gnav .c-gnav > li:last-child > a:hover {
background-color: #05A847 !important;
color: #FFFFFF !important;
}
.l-fixHeader__gnav .c-gnav > li:last-child > a {
background-color: #06C755 !important;
color: #FFFFFF !important;
transition: background-color 0.2s !important;
}
.l-fixHeader__gnav .c-gnav > li:last-child > a:hover {
background-color: #05A847 !important;
color: #FFFFFF !important;
}
/* ============================================
* TOPページ /home のフォントサイズ — fluid typography v3
* clamp(min, fluid, max) で画面幅に連続追従させて
* 機種依存の中途半端な折り返しを防ぐ。
* 日本語の不規則な改行抑制に word-break: keep-all + overflow-wrap: break-word。
* 短い固定見出しは white-space: nowrap で1行確定。
* メディアクエリ(@media)は使わない(clamp が連続的に変化するため)。
* ============================================ */
/* 共通:見出しの日本語改行制御 */
.page-id-5582 h1,
.page-id-5582 h2,
.page-id-5582 h3 {
word-break: keep-all !important;
overflow-wrap: break-word !important;
}
/* ヒーロー大見出し(h1)— HTML側の
で2行に分割される前提。
8字「誰に相談しよう?」が必ず1行に収まるサイズ上限を設定 */
.page-id-5582 .hero h1 {
font-size: clamp(30px, 8vw, 72px) !important;
line-height: 1.35 !important;
letter-spacing: -0.01em !important;
}
/* ヒーロー lead 文 */
.page-id-5582 .hero .lead {
font-size: clamp(16px, 2vw + 10px, 24px) !important;
line-height: 1.95 !important;
}
/* trust-bar(営業電話0回 / あなたのペースで / 専門家へ橋渡し) */
.page-id-5582 .trust-num {
font-size: clamp(20px, 3.5vw + 8px, 36px) !important;
line-height: 1.35 !important;
}
.page-id-5582 .trust-num .unit {
font-size: 0.85em !important;
}
.page-id-5582 .trust-label {
font-size: clamp(14px, 1.2vw + 11px, 20px) !important;
line-height: 1.7 !important;
}
/* セクション見出し h2(ご相談から解決まで〜 等) */
.page-id-5582 .section-heading h2 {
font-size: clamp(24px, 5vw + 6px, 44px) !important;
line-height: 1.4 !important;
}
.page-id-5582 .section-heading .sub {
font-size: clamp(16px, 1.5vw + 12px, 22px) !important;
line-height: 1.8 !important;
}
/* ステップカード — 短い見出しは nowrap で1行確定 */
.page-id-5582 .step-card-rich h3 {
font-size: clamp(16px, 4.5vw, 24px) !important;
white-space: nowrap !important;
overflow: visible !important;
line-height: 1.4 !important;
}
.page-id-5582 .step-card-rich p {
font-size: clamp(14px, 1.2vw + 11px, 19px) !important;
line-height: 1.9 !important;
}
/* サービスカード — h3 はやや長め(「無料 or 有償引取」等)なので nowrap せず word-break: keep-all のみ */
.page-id-5582 .service-body h3 {
font-size: clamp(18px, 2.5vw + 10px, 26px) !important;
line-height: 1.4 !important;
}
.page-id-5582 .service-body p {
font-size: clamp(15px, 1.2vw + 12px, 19px) !important;
line-height: 1.9 !important;
}
.page-id-5582 .service-stat .num {
font-size: clamp(20px, 2.5vw + 12px, 32px) !important;
}
.page-id-5582 .service-stat .lbl {
font-size: clamp(11px, 0.5vw + 10px, 14px) !important;
}
/* データセクション(円グラフ等の大きな数字) */
.page-id-5582 .donut-num {
font-size: clamp(36px, 5vw + 12px, 54px) !important;
line-height: 1.1 !important;
}
.page-id-5582 .donut-num small {
font-size: clamp(18px, 2vw + 8px, 28px) !important;
}
.page-id-5582 .donut-caption {
font-size: clamp(16px, 1.4vw + 12px, 21px) !important;
line-height: 1.9 !important;
}
.page-id-5582 .donut-lbl {
font-size: clamp(13px, 0.6vw + 11px, 16px) !important;
}
/* 藤本プロフィール */
.page-id-5582 .profile-content p {
font-size: clamp(16px, 1.5vw + 12px, 22px) !important;
line-height: 1.95 !important;
}
.page-id-5582 .profile-content h3 {
font-size: clamp(22px, 3.5vw + 10px, 36px) !important;
line-height: 1.4 !important;
}
/* 最終 CTA セクション */
.page-id-5582 .section-final-cta h2 {
font-size: clamp(26px, 5.5vw + 6px, 48px) !important;
line-height: 1.4 !important;
}
.page-id-5582 .section-final-cta p {
font-size: clamp(16px, 1.5vw + 12px, 22px) !important;
line-height: 1.9 !important;
}
/* 汎用本文(その他 p / li) */
.page-id-5582 .post_content p,
.page-id-5582 .post_content li,
.page-id-5582 section p,
.page-id-5582 section li,
.page-id-5582 .text-block,
.page-id-5582 .lead-text {
font-size: clamp(16px, 1.2vw + 12px, 20px) !important;
line-height: 1.95 !important;
}
/* CTA ボタン内の文言(折り返し防止) */
.page-id-5582 .btn-line-primary,
.page-id-5582 .btn-secondary {
font-size: clamp(14px, 1.2vw + 11px, 18px) !important;
white-space: nowrap !important;
}
/* ============================================
* フッター余白の完全除去(メニュー非表示・コピーライトのみの状態)
* ============================================ */
.l-footer {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.l-footer__inner {
padding: 0 !important;
}
.l-footer__widgetArea {
display: none !important;
}
.l-footer__foot {
padding: 16px 0 !important;
margin: 0 !important;
}
.l-footer__foot .l-container {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.copyright {
margin: 0 !important;
padding: 0 !important;
}
/* ============================================
* グレーライン除去(全ページ共通)
* 本文コンテナ周りの border / box-shadow + フッター直上の区切り線を全部消す。
* SWELL は .l-footer や .l-footer__foot に border-top を出すことがあるため、
* フッター内部・周辺の境界系プロパティをまとめて none にする。
* ============================================ */
/* 1) 本文コンテナの border / shadow / 背景 */
.l-content,
.l-content.l-container,
.l-mainContent,
.l-mainContent__inner,
.l-articleSection,
.l-articleBottom,
.l-postBottom,
.l-postFooter,
#content {
border: none !important;
box-shadow: none !important;
background: transparent !important;
}
.l-mainContent::before,
.l-mainContent::after,
.l-content::before,
.l-content::after,
.l-articleBottom::before,
.l-articleBottom::after,
.l-postBottom::before,
.l-postBottom::after,
.post_content::before,
.post_content::after {
display: none !important;
border: none !important;
background: transparent !important;
content: none !important;
height: 0 !important;
}
/* 2) フッター本体・内部要素すべての境界線を強制 none に */
.l-footer,
.l-footer__inner,
.l-footer__widgetArea,
.l-footer__nav,
.l-footer__foot,
.l-footer__foot .l-container,
.l-footer__copyright,
.copyright,
.p-footerCTA,
.p-footerSearch {
border-top: none !important;
border-bottom: none !important;
border-left: none !important;
border-right: none !important;
box-shadow: none !important;
outline: none !important;
}
/* 3) フッター周辺の ::before / ::after で表現される細線対策 */
.l-footer::before,
.l-footer::after,
.l-footer__inner::before,
.l-footer__inner::after,
.l-footer__foot::before,
.l-footer__foot::after {
display: none !important;
content: none !important;
border: none !important;
background: transparent !important;
height: 0 !important;
}
/* 4) フッター直前の body 末尾 / メインコンテンツの底辺 shadow も保険で消す */
.l-body,
#body_wrap,
body {
box-shadow: none !important;
}
.l-body::after,
#body_wrap::after,
body::after {
display: none !important;
content: none !important;
border: none !important;
background: transparent !important;
height: 0 !important;
}