に出力する。そのため全セレクタを .avis-front-page（bodyを指定しない）で記述し、#body_wrap 上のクラスにマッチさせる。 =========================================== */ /* --- CSS変数の上書き（根本対処） --- html要素に設定して全要素に波及させる --- */ .avis-front-page { --container-size: 100% !important; --swl-pad_container: 0px !important; --swl-pad_post_content: 0px !important; } /* --- #content（IDセレクタ）+ .l-container --- フルワイドを阻害している直接原因 --- */ .avis-front-page #content, .avis-front-page #content.l-container, .avis-front-page .l-container { max-width: 100% !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } /* --- .l-content --- margin: 0 auto 6em（左右中央寄せ＋下部余白）を解除 --- */ .avis-front-page .l-content, .avis-front-page #content.l-content { margin: 0 !important; padding: 0 !important; max-width: 100% !important; width: 100% !important; } /* --- 残りのSWELLラッパー群 --- */ .avis-front-page .l-body, .avis-front-page .l-body__inner { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; } .avis-front-page .l-mainContent, .avis-front-page .l-mainContent__inner, .avis-front-page .l-mainContent__inner.l-article, .avis-front-page .l-mainContent__body, .avis-front-page .l-mainContent__body.post_content, .avis-front-page .post_content { max-width: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important; } /* SWELLの投稿コンテンツ内の直接子要素にも幅制限がかかる */ .avis-front-page .post_content > *, .avis-front-page .entry-content > * { max-width: 100% !important; } /* 横スクロール防止 */ .avis-front-page .l-content, .avis-front-page .l-mainContent { overflow-x: hidden; } /* --- SWELLのサイドバー・ページタイトル・パンくず非表示 --- */ .avis-front-page .l-sidebar { display: none !important; } .avis-front-page .c-pageTitle, .avis-front-page .l-mainContent__title { display: none !important; } .avis-front-page .p-breadcrumb, .avis-front-page .c-breadcrumb { display: none !important; } /* --- ヒーローセクション --- SWELLヘッダーの高さ分を相殺して全画面表示 --- */ .avis-front-page .hero { margin-top: calc( -1 * var(--swl-fix_headerH, 64px) ); padding-top: var(--swl-fix_headerH, 64px); } /* SWELLのメインビジュアルが残っている場合に非表示（安全策） */ .avis-front-page .p-mainVisual, .avis-front-page .l-header__mv { display: none !important; } /* --- SWELLフッターとの接続 --- */ .avis-front-page .contact-section { margin-bottom: 0; } /* SWELLフッター前の余白をリセット */ .avis-front-page .l-content { padding-bottom: 0 !important; } /* --- Contact Form 7 スタイル上書き --- */ .avis-front-page .contact-form-wrap .wpcf7 { max-width: 100%; } .avis-front-page .contact-form-wrap .wpcf7-form-control:not(.wpcf7-submit) { background: transparent; border: none; border-bottom: 1px solid rgba(245, 245, 240, 0.28); color: #f5f5f0; padding: 0.8rem 0; font-family: 'Noto Sans JP', sans-serif; font-size: 0.9rem; outline: none; width: 100%; transition: border-color 0.3s; border-radius: 0; -webkit-appearance: none; } .avis-front-page .contact-form-wrap .wpcf7-form-control:not(.wpcf7-submit):focus { border-bottom-color: #f5f5f0; box-shadow: none; } .avis-front-page .contact-form-wrap .wpcf7-submit { background: #f5f5f0; color: #0a0a0a; border: none; padding: 0.9rem 2.5rem; font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; letter-spacing: 0.15em; text-transform: uppercase; cursor: pointer; transition: background 0.3s, transform 0.1s; border-radius: 0; } .avis-front-page .contact-form-wrap .wpcf7-submit:hover { background: #d9e1ea; } .avis-front-page .contact-form-wrap .wpcf7-not-valid-tip { color: #ff6b6b; font-size: 0.8rem; margin-top: 0.3rem; } .avis-front-page .contact-form-wrap .wpcf7-form-control::placeholder { color: #9a9a9a; } /* =========================================== SWELL レイアウト上書き - 下層サービスページ用 ============================================= 以下を既存の swell-overrides.css の末尾に追記してくださいセレクタ: .avis-service-page （body_class フィルタで追加されるクラス）注意: SWELLは body_class のクラスをではなく

に出力する。そのため .avis-service-page（bodyを指定しない）で記述。 =========================================== */ /* --- CSS変数の上書き（根本対処） --- */ .avis-service-page { --container-size: 100% !important; --swl-pad_container: 0px !important; --swl-pad_post_content: 0px !important; } /* --- #content（IDセレクタ）+ .l-container --- フルワイドを阻害している直接原因 --- */ .avis-service-page #content, .avis-service-page #content.l-container, .avis-service-page .l-container { max-width: 100% !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } /* --- .l-content --- margin: 0 auto 6em（左右中央寄せ＋下部余白）を解除 --- */ .avis-service-page .l-content, .avis-service-page #content.l-content { margin: 0 !important; padding: 0 !important; padding-bottom: 0 !important; max-width: 100% !important; width: 100% !important; } /* --- 残りのSWELLラッパー群 --- */ .avis-service-page .l-body, .avis-service-page .l-body__inner { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; } .avis-service-page .l-mainContent, .avis-service-page .l-mainContent__inner, .avis-service-page .l-mainContent__inner.l-article, .avis-service-page .l-mainContent__body, .avis-service-page .l-mainContent__body.post_content, .avis-service-page .post_content { max-width: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important; } /* SWELLの投稿コンテンツ内の直接子要素にも幅制限がかかる */ .avis-service-page .post_content > *, .avis-service-page .entry-content > * { max-width: 100% !important; } /* 横スクロール防止 */ .avis-service-page .l-content, .avis-service-page .l-mainContent { overflow-x: hidden; } /* --- サイドバー・ページタイトル非表示 --- */ .avis-service-page .l-sidebar { display: none !important; } .avis-service-page .c-pageTitle, .avis-service-page .l-mainContent__title { display: none !important; } /* --- ヒーローセクション --- SWELLヘッダーの高さ分を相殺して全画面表示 --- */ .avis-service-page .page-hero { margin-top: calc( -1 * var(--swl-fix_headerH, 64px) ); padding-top: var(--swl-fix_headerH, 64px); } /* SWELLのメインビジュアルが残っている場合に非表示（安全策） */ .avis-service-page .p-mainVisual, .avis-service-page .l-header__mv { display: none !important; } /* --- SWELLパンくず: デザイン上書き --- SWELLの標準位置に表示し、フォント・色をサイトトーンに合わせる --- */ .avis-service-page .p-breadcrumb { font-family: 'JetBrains Mono', monospace; font-size: 0.65rem; letter-spacing: 0.12em; border-bottom: 1px solid rgba(10,10,10,0.08); } /* パンくずリンク */ .avis-service-page .p-breadcrumb a { color: var(--gray-on-light); text-decoration: none; transition: color 0.3s; } .avis-service-page .p-breadcrumb a:hover { color: var(--black); } /* 現在ページ（リンクなし） */ .avis-service-page .p-breadcrumb__item:last-child { color: var(--black); } /* 区切り文字 */ .avis-service-page .p-breadcrumb .p-breadcrumb__item + .p-breadcrumb__item::before { color: rgba(10,10,10,0.3); } /* --- SWELLフッターとの接続 --- */ .avis-service-page .nav-band + .l-footer, .avis-service-page .l-content { padding-bottom: 0 !important; }