/*
Theme Name: Lightning Child Sample
Template: lightning
Version: 0.7.1
*/
/* --- ベース（必要最低限） --- */
body { background:#f8f8f8; color:#333; line-height:1.6; font-family:Arial, sans-serif; }
a { color:#003366; text-decoration:none; }
a:hover { color:#001f4d; }
/* --- ヘッダー配色だけ（以前のまま） --- */
.site-header.site-header--layout--nav-float,
.global-nav.global-nav--layout--float-right { background:#000 !important; }
.global-nav a,
.global-nav .global-nav-name,
.global-nav .global-nav-description { color:#fff !important; }
/* --- HOMEの先頭ブロック余白を詰めるだけ --- */
body.home .site-body,
body.home header#site-header { margin-top:0 !important; padding-top:0 !important; }
body.home .wp-block-video.alignfull { margin-top:0 !important; padding-top:0 !important; }
/* --- alignfull の横はみ出し防止（Lightningと競合しない範囲） --- */
body.home .wp-block-video.alignfull {
width:100vw !important;
max-width:100vw !important;
margin-left:calc(50% - 50vw) !important;
margin-right:calc(50% - 50vw) !important;
}
/* --- 動画自体はカバー表示でフィット。追加の高さ指定はしない --- */
body.home .wp-block-video.alignfull video {
display:block;
width:100%;
height:auto; /* 端末依存のvhは使わない */
object-fit:cover;
background:#000; /* 万一の帯用 */
}
/* --- フッター（以前のシンプル版） --- */
.site-footer { background:rgba(0,0,0,.8); color:#fff; text-align:center; padding:30px 20px; }
.site-footer-copyright p:nth-child(2){ display:none; }
/* PCフッターナビ横並び（任意） */
@media (min-width:1024px){
.site-footer .row,.site-footer .l-footer-widget__inner,.site-footer .footer-widget-area,.site-footer .widget-area{
display:flex !important; flex-wrap:wrap; justify-content:center; align-items:center; gap:20px;
}
.site-footer .col-lg-4.col-md-6{ display:contents !important; float:none !important; }
.site-footer .widget_nav_menu,.site-footer .widget_nav_menu .menu,.site-footer .widget_nav_menu ul{ display:contents !important; }
.site-footer .widget_nav_menu li{ display:inline-flex !important; align-items:center; margin:0; }
.site-footer .widget_nav_menu li+li{ margin-left:20px; }
.site-footer .widget_nav_menu a{ color:#fff !important; white-space:nowrap; }
}
/* SPはフッター簡素化（任意） */
@media (max-width:991.98px){
footer.site-footer .footer-nav,
footer.site-footer .site-footer-content,
footer.site-footer .site-footer-content .row,
footer.site-footer .site-footer-content .col-lg-4.col-md-6,
footer.site-footer .site-footer-content aside.widget,
footer.site-footer .menu.footer-nav-list,
footer.site-footer .menu-footernavigation-container{ display:none !important; }
footer.site-footer .container, footer.site-footer .site-footer-content{ padding-top:0 !important; padding-bottom:0 !important; margin:0 !important; }
}
/* --- ヒーロー動画の高さを80%に縮小（横幅は100%のまま） --- */
body.home .wp-block-video.alignfull video {
width: 100% !important; /* 横幅はそのまま */
height: 80vh !important; /* 画面高の80% */
object-fit: cover; /* トリミングして全体にフィット */
}
/* PC/タブレット：横フル・高さ80%（カバー） */
body.home .wp-block-video.alignfull video{
width:100% !important;
height:80vh !important; /* 画面高の80% */
object-fit:cover !important;
object-position:center center; /* 画角の中心でトリミング */
}
/* モバイル：アスペクト比固定で高さ自動（はみ出し防止） */
@media (max-width: 767.98px){
body.home .wp-block-video.alignfull video{
height:auto !important; /* ここでvhをやめる */
aspect-ratio:16 / 9; /* 16:9で安定 */
max-height:60svh; /* キーボード分を考慮した安全vhで上限 */
object-fit:cover !important;
}
}
/* ===== ヒーロー直下エリア ===== */
#kv-quick{ background:#0c0e10; color:#fff; position:relative; z-index:2; }
#kv-quick .kv-quick__wrap{
max-width:1100px; margin:0 auto; padding: clamp(20px,5vw,36px) 16px;
display:grid; gap:20px;
grid-template-columns: 1.2fr .8fr; align-items:start;
}
@media (max-width: 959.98px){
#kv-quick .kv-quick__wrap{ grid-template-columns: 1fr; }
}
/* フォーム */
.kv-quick__form{
background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.05));
border:1px solid rgba(255,255,255,.12);
border-radius:16px; padding:16px;
box-shadow: 0 10px 30px rgba(0,0,0,.25);
backdrop-filter: blur(4px) saturate(120%);
}
.kv-quick__row{
display:grid; gap:12px;
grid-template-columns: repeat(6, 1fr);
}
.kv-quick__field{ display:flex; flex-direction:column; gap:6px; }
.kv-quick__field select,
.kv-quick__field input{
width:100%; height:44px; border-radius:10px; border:1px solid rgba(255,255,255,.18);
background:rgba(20,22,25,.9); color:#fff; padding:0 12px; outline:none;
}
.kv-quick__label{ font-size:.85rem; opacity:.85; }
.kv-quick__field:nth-of-type(1){ grid-column: span 2; }
.kv-quick__field:nth-of-type(2){ grid-column: span 2; }
.kv-quick__field:nth-of-type(3){ grid-column: span 2; }
.kv-quick__field:nth-of-type(4){ grid-column: span 3; }
.kv-quick__field:nth-of-type(5){ grid-column: span 3; }
.kv-quick__field--wide{ grid-column: 1 / -1; }
.kv-quick__radios{ display:flex; gap:16px; flex-wrap:wrap; }
.kv-quick__radios input{ transform: translateY(1px); }
.kv-quick__submit{
grid-column: 1 / -1;
height:52px; border-radius:999px; border:0; cursor:pointer; font-weight:800; letter-spacing:.04em;
background:#fff; color:#111; box-shadow:0 12px 28px rgba(0,0,0,.25);
transition: transform .15s ease, box-shadow .15s ease;
}
.kv-quick__submit:hover{ transform: translateY(-1px); box-shadow:0 18px 36px rgba(0,0,0,.3); }
.kv-quick__submit:active{ transform: translateY(0); }
.kv-quick__note{ margin:.4rem 0 0; font-size:.82rem; opacity:.85; }
/* 信頼実績 */
.kv-quick__trust{
background:rgba(255,255,255,.04);
border:1px solid rgba(255,255,255,.12); border-radius:16px; padding:16px;
display:grid; gap:12px; grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 959.98px){
.kv-quick__trust{ grid-template-columns: 1fr 1fr; }
}
.trust__item{
background:rgba(0,0,0,.2); border:1px solid rgba(255,255,255,.08);
border-radius:12px; padding:14px; text-align:center;
}
.trust__num{ font-size: clamp(28px, 5vw, 40px); font-weight:900; line-height:1; }
.trust__num small{ font-size:.5em; opacity:.8; margin-left:.2em; }
.trust__label{ margin-top:6px; opacity:.9; font-weight:600; }
.trust__badges{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.badge{
display:inline-block; padding:6px 10px; border-radius:999px;
background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
font-size:.85rem; white-space:nowrap;
}
/* スクリーンリーダー用 */
.screen-reader-text{
position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
/* モバイル最適化 */
@media (max-width: 767.98px){
.kv-quick__row{ grid-template-columns: 1fr 1fr; }
.kv-quick__field:nth-of-type(1){ grid-column: span 2; }
.kv-quick__field:nth-of-type(2){ grid-column: span 1; }
.kv-quick__field:nth-of-type(3){ grid-column: span 1; }
.kv-quick__field:nth-of-type(4){ grid-column: span 1; }
.kv-quick__field:nth-of-type(5){ grid-column: span 1; }
.kv-quick__field--wide{ grid-column: 1 / -1; }
}
/* ===== Lightning ヘッダー最小復旧（G3を止めた環境向け） ===== */
/* ヘッダー全体 */
#site-header,
header#site-header {
position: relative;
z-index: 100;
background: #000; /* 必要なら変えてOK */
color: #fff;
}
/* 内側レイアウト */
#site-header .container,
#site-header .site-header-container,
#site-header .site-header__inner {
max-width: 1100px;
margin: 0 auto;
padding: 10px 16px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
}
/* ロゴ */
.site-branding,
.site-header-logo,
#site-header .custom-logo-link img {
display: block;
height: auto;
max-height: 46px;
}
/* グローバルナビ（PC） */
.global-nav,
.global-nav .menu,
.nav,
.nav ul {
margin: 0;
padding: 0;
list-style: none;
}
.global-nav .menu,
.nav .menu,
.global-nav .global-nav-list,
.nav.nav--line {
display: flex;
gap: 22px;
}
.global-nav a,
.nav a {
color: #fff;
text-decoration: none;
font-weight: 600;
line-height: 1;
display: inline-block;
padding: 10px 4px;
}
.global-nav a:hover,
.nav a:hover { opacity: .8; }
/* ドロップダウン（最低限） */
.menu-item-has-children { position: relative; }
.menu-item-has-children > .sub-menu {
position: absolute;
left: 0; top: 100%;
min-width: 200px;
padding: 8px 0;
background: #111;
border: 1px solid rgba(255,255,255,.1);
display: none;
z-index: 200;
}
.menu-item-has-children:hover > .sub-menu { display: block; }
.sub-menu li a { padding: 10px 12px; display: block; }
/* モバイル（簡易縦積み） */
@media (max-width: 959.98px){
#site-header .container,
#site-header .site-header-container,
#site-header .site-header__inner {
flex-wrap: wrap;
}
.global-nav .menu,
.nav .menu,
.global-nav .global-nav-list,
.nav.nav--line {
width: 100%;
gap: 0;
flex-direction: column;
border-top: 1px solid rgba(255,255,255,.15);
}
.global-nav a,
.nav a {
width: 100%;
padding: 12px 8px;
border-bottom: 1px solid rgba(255,255,255,.08);
}
.menu-item-has-children > .sub-menu {
position: static;
border: 0;
display: none;
}
.menu-item-has-children:focus-within > .sub-menu,
.menu-item-has-children:hover > .sub-menu { display: block; }
}
/* 以前の配色指定（必要なら） */
.site-header.site-header--layout--nav-float,
.global-nav.global-nav--layout--float-right { background:#000 !important; }
.global-nav a,
.global-nav .global-nav-name,
.global-nav .global-nav-description { color:#fff !important; }
/* ===== ヘッダーロゴのサイズを固定（Lightning） ===== */
/* ヘッダーのベース高さ（PC） */
#site-header,
header#site-header {
min-height: 64px; /* ヘッダーの目安高さ */
}
/* 横並び＆中央揃え */
#site-header .site-header__inner,
#site-header .site-header-container,
#site-header .container {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding-block: 8px; /* 上下の余白 */
}
/* ロゴボックスの溢れ防止 */
.site-branding,
.site-header-logo,
#site-header .custom-logo-link {
display: flex;
align-items: center;
max-height: 48px; /* ★上限を決める */
overflow: hidden; /* はみ出しカット */
}
/* 画像サイズを強制（縦優先） */
#site-header .custom-logo-link img,
#site-header .site-header-logo img,
#site-header .site-branding img {
height: 48px !important; /* ★ロゴの目標高さ */
width: auto !important; /* アスペクト比維持 */
max-width: 100%;
}
/* メニューのベース行高 */
#site-header nav a {
line-height: 1;
padding: 10px 8px;
}
/* モバイル時は少し小さく */
@media (max-width: 959.98px){
#site-header { min-height: 56px; }
.site-branding,
.site-header-logo,
#site-header .custom-logo-link { max-height: 40px; }
#site-header .custom-logo-link img,
#site-header .site-header-logo img,
#site-header .site-branding img { height: 40px !important; }
#site-header .site-header__inner,
#site-header .site-header-container,
#site-header .container { padding-block: 6px; }
}
/* 極小幅（iPhone SE等） */
@media (max-width: 375px){
.site-branding,
.site-header-logo,
#site-header .custom-logo-link { max-height: 36px; }
#site-header .custom-logo-link img,
#site-header .site-header-logo img,
#site-header .site-branding img { height: 36px !important; }
}
/* === ロゴが切れないように修正 === */
/* 1) さっきの overflow/height を無効化 */
.site-branding,
.site-header-logo,
#site-header .custom-logo-link {
overflow: visible !important;
max-height: none !important;
}
/* 2) 画像は「上限だけ」決めて縦横比を維持 */
#site-header .custom-logo-link img,
#site-header .site-header-logo img,
#site-header .site-branding img,
#site-header img.custom-logo {
display: block;
height: auto !important; /* ← 固定高さはやめる */
width: auto; /* ← 比率維持 */
max-height: 52px; /* ← PC時の上限だけ指定（お好みで 44〜56px） */
max-width: clamp(120px, 20vw, 240px); /* 横に長いロゴの暴走防止（任意） */
object-fit: contain; /* はみ出さず収まる */
}
/* 3) ヘッダーの上下余白（ロゴ上限に合わせて微調整） */
#site-header .site-header__inner,
#site-header .site-header-container,
#site-header .container {
padding-block: 8px; /* 6〜10pxでお好み調整 */
align-items: center;
}
/* 4) モバイルでは上限を少し下げる */
@media (max-width: 959.98px){
#site-header .custom-logo-link img,
#site-header .site-header-logo img,
#site-header .site-branding img,
#site-header img.custom-logo {
max-height: 44px; /* モバイル上限 */
}
}
@media (max-width: 375px){
#site-header .custom-logo-link img,
#site-header .site-header-logo img,
#site-header .site-branding img,
#site-header img.custom-logo {
max-height: 38px; /* 極小端末 */
}
}
/* --- 簡易フォームの衝突しない最小スタイル（#kv-quickだけに適用） --- */
#kv-quick .kvq { max-width: 900px; margin: 0 auto; padding: 16px; }
#kv-quick .kvq-row { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
#kv-quick label { display: block; font-size: 14px; color: #ddd; }
#kv-quick input[type="text"] { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid #333; background:#111; color:#fff; }
#kv-quick .kvq-radio { margin: 12px 0 6px; border: 0; padding: 0; }
#kv-quick .kvq-radio label { margin-right: 16px; color:#ddd; }
#kv-quick .kvq-btn { width: 100%; padding: 14px 16px; border-radius: 24px; border:0; background:#fff; color:#000; font-weight:700; }
@media (max-width: 768px){ #kv-quick .kvq-row { grid-template-columns: 1fr; } }
/* ヒーロー内の旧ボタン置き場を非表示（クラスは実際のものに置換） */
#kv .hero__btns { display:none !important; }
#kvq-cta-slot{ margin: 0 0 12px; }
#kvq-cta-slot .hero__btns{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
/* フォーム上の2ボタン */
#kv-quick #kvq-cta-slot{ margin:0 0 16px; width:100%; }
#kv-quick .kvq-cta-bar{
display:grid; grid-template-columns:1fr 1fr; gap:12px;
align-items:stretch;
}
#kv-quick .kvq-cta-bar a,
#kv-quick .kvq-cta-bar button,
#kv-quick .kvq-cta-bar .wp-block-button__link{
display:flex; align-items:center; justify-content:center;
height:48px; padding:0 20px; border-radius:9999px;
font-weight:600; line-height:1.2; text-decoration:none;
box-shadow:0 2px 6px rgba(0,0,0,.18);
}
/* 左＝塗り／右＝アウトライン（色は現状と合わせて最小調整） */
#kv-quick .kvq-cta-bar > *:first-child{
background:#fff; color:#111; border:1px solid transparent;
}
#kv-quick .kvq-cta-bar > *:last-child{
background:transparent; color:#fff; border:1px solid rgba(255,255,255,.55);
}
#kv-quick .kvq-cta-bar > *:first-child:hover{ filter:brightness(.96); }
#kv-quick .kvq-cta-bar > *:last-child:hover{ background:rgba(255,255,255,.06); }
/* スマホは縦並びで押しやすく */
@media (max-width:768px){
#kv-quick .kvq-cta-bar{ grid-template-columns:1fr; gap:10px; }
#kv-quick .kvq-cta-bar a,
#kv-quick .kvq-cta-bar button,
#kv-quick .kvq-cta-bar .wp-block-button__link{ height:52px; }
}
/* --- 無料簡易査定をスタート：クリック無効＆見出し風 --- */
#kv-quick .kvq-cta-bar > *:first-child {
pointer-events: none; /* クリックできない */
cursor: default; /* 通常カーソル */
background: transparent;
color: #fff; /* 白文字 */
border: none;
box-shadow: none;
font-weight: bold; /* 見出しっぽく強調 */
}
/* --- 電話でお問合せ：白枠アウトライン＋白文字 --- */
#kv-quick .kvq-cta-bar > *:last-child {
background: transparent;
color: #fff;
border: 2px solid #fff; /* 白枠 */
}
#kv-quick .kvq-cta-bar > *:last-child:hover {
background: rgba(255,255,255,.08); /* ホバー時にうっすら白背景 */
}
/* ====== フォーム上の2ボタン 最終調整 ====== */
/* 左：無料簡易査定をスタート → クリック不可＆見出し風（白文字・透明） */
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:first-child,
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:first-child a,
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:first-child .wp-block-button__link{
pointer-events: none !important;
cursor: default !important;
background: transparent !important;
color: #fff !important;
border: none !important;
box-shadow: none !important;
text-decoration: none !important;
outline: 0 !important;
font-weight: 700 !important;
}
/* 右：電話でお問合せ → 白枠アウトライン＋白文字（塗りなし） */
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:last-child,
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:last-child a,
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:last-child .wp-block-button__link{
background: transparent !important;
color: #fff !important;
border: 2px solid #fff !important;
box-shadow: none !important;
text-decoration: none !important;
}
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:last-child a:hover,
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:last-child .wp-block-button__link:hover{
background: rgba(255,255,255,.08) !important;
}
/* 高さを揃える（必要なら） */
#kv-quick #kvq-cta-slot .kvq-cta-bar a,
#kv-quick #kvq-cta-slot .kvq-cta-bar button,
#kv-quick #kvq-cta-slot .kvq-cta-bar .wp-block-button__link{
min-height: 48px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
/* ====== 無料簡易査定をスタート（クリック無効化） ====== */
a.btn.btn-primary[href="#inquiry-form"] {
pointer-events: none; /* クリック無効 */
cursor: default; /* 通常のカーソルに */
opacity: 1 !important; /* 半透明にしない */
text-decoration: none; /* 下線も消す */
}
/* ====== 電話でお問合せ（白枠アウトライン） ====== */
a.btn.btn-ghost[href^="tel:"] {
background: transparent !important; /* 背景なし */
color: #fff !important; /* 白文字 */
border: 2px solid #fff !important; /* 白枠 */
padding: 12px 24px !important;
display: inline-block;
text-align: center;
font-weight: 600;
text-decoration: none;
box-shadow: none !important;
}
a.btn.btn-ghost[href^="tel:"]:hover {
background: rgba(255,255,255,0.1) !important; /* ホバー時うっすら背景 */
color: #fff !important;
}
/* ====== 無料簡易査定をスタート（見出し風に変更） ====== */
a.btn.btn-primary[href="#inquiry-form"] {
pointer-events: none; /* クリック無効 */
cursor: default; /* 通常カーソル */
display: block; /* 横幅いっぱいに */
background: none !important;/* 背景なし */
border: none !important; /* 枠なし */
color: #fff !important; /* 白文字 */
font-size: 2rem; /* 大きめ文字 */
font-weight: 700; /* 太字 */
text-align: center; /* 中央寄せ */
text-decoration: none; /* 下線消す */
margin: 0 0 16px 0; /* 下に余白 */
}
/* スマホでは少し小さく */
@media (max-width: 768px) {
a.btn.btn-primary[href="#inquiry-form"] {
font-size: 1.5rem;
}
}
/* ── CTAバーの3つ目（廃車引取を申込む）を右カラムに揃える ── */
#kv-quick #kvq-cta-slot .kvq-cta-bar {
display: grid;
grid-template-columns: 1fr 1fr; /* 左=見出し / 右=ボタン列 */
gap: 12px;
align-items: stretch;
}
#kv-quick #kvq-cta-slot .kvq-cta-bar > * {
width: 100%;
}
/* 3つ目の要素を2列目（右）に配置して、電話の下に縦積み */
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:nth-child(3) {
grid-column: 2; /* 右カラムへ */
}
/* スマホでは1列に戻す（順序：見出し→電話→申込む） */
@media (max-width: 768px){
#kv-quick #kvq-cta-slot .kvq-cta-bar {
grid-template-columns: 1fr;
}
#kv-quick #kvq-cta-slot .kvq-cta-bar > *:nth-child(3) {
grid-column: auto;
}
}
/* 見た目統一（丸み・高さ・中央寄せ）※既にあれば不要 */
#kv-quick #kvq-cta-slot .kvq-cta-bar a,
#kv-quick #kvq-cta-slot .kvq-cta-bar .wp-block-button__link {
display: flex;
align-items: center;
justify-content: center;
min-height: 48px;
border-radius: 9999px;
text-decoration: none;
}
/* 電話ボタン（白枠アウトライン） */
a.btn.btn-ghost[href^="tel:"]{
background: transparent !important;
color: #fff !important;
border: 2px solid #fff !important;
box-shadow: none !important;
}
a.btn.btn-ghost[href^="tel:"]:hover{
background: rgba(255,255,255,.1) !important;
}
/* CTA行：左=見出し／右=ボタン縦積み */
#kvq-cta-slot .kvq-cta-bar{
display:grid;
grid-template-columns: 1fr 1fr;
gap:12px;
align-items:stretch;
}
/* 左（見出し）を左カラムへ固定 */
#kvq-cta-slot .kvq-cta-bar a.btn.btn-primary[href="#inquiry-form"]{
grid-column:1;
}
/* 右のラッパーを右カラムに固定、縦積み */
#kvq-cta-slot .kvq-cta-right{
grid-column:2;
display:flex;
flex-direction:column;
gap:12px;
width:100%;
}
/* ボタン見た目を統一 */
#kvq-cta-slot .kvq-cta-right a{
display:flex; align-items:center; justify-content:center;
min-height:48px; border-radius:9999px; text-decoration:none;
width:100%;
}
/* 電話＝白枠アウトライン */
#kvq-cta-slot .kvq-cta-right a[href^="tel:"]{
background:transparent; color:#fff; border:2px solid #fff;
}
#kvq-cta-slot .kvq-cta-right a[href^="tel:"]:hover{
background:rgba(255,255,255,.08);
}
/* 申込ボタン：電話と同じ白枠にしたい場合 */
#kvq-cta-slot .kvq-cta-right a[href*="goo.gl/forms"]{
background:transparent; color:#fff; border:2px solid #fff;
}
/* もし“塗り”にしたいなら上の3行を消して↓に変更
#kvq-cta-slot .kvq-cta-right a[href*="goo.gl/forms"]{
background:#111; color:#fff; border:0;
}
*/
/* スマホは1列（見出し→電話→申込） */
@media (max-width:768px){
#kvq-cta-slot .kvq-cta-bar{ grid-template-columns:1fr; }
#kvq-cta-slot .kvq-cta-right{ grid-column:auto; }
}
/* 申込ボタンを電話ボタンと同じ見た目＆サイズに */
a.btn.btn-primary[href^="https://goo.gl/forms"]{
background: transparent !important; /* 塗りなし */
color: #fff !important; /* 白文字 */
border: 2px solid #fff !important; /* 白枠 */
display: block !important;
width: 100% !important;
min-height: 48px !important;
border-radius: 9999px !important;
text-align: center !important;
padding: 12px 24px !important;
margin-top: 12px; /* 電話の下に適度な余白 */
}
a.btn.btn-primary[href^="https://goo.gl/forms"]:hover{
background: rgba(255,255,255,.1) !important;
}
/* ラッパー内は必ず縦に2つ並ぶ */
.kvq-cta-right{display:flex;flex-direction:column;gap:12px;width:100%}
.kvq-cta-right .btn{display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:9999px}
.kvq-cta-right .btn-ghost{background:transparent;color:#fff;border:2px solid #fff}
.kvq-cta-right .btn-primary{background:transparent;color:#fff;border:2px solid #fff}
/* 旧: #inquiry-form に飛ばすボタンを完全に非表示 */
#kv-quick .kv-quick__wrap .kvq-cta-bar a[href="#inquiry-form"]{
display: none !important;
}
/* 念のため：グリッドに空洞ができないように詰める */
#kv-quick .kv-quick__wrap{
grid-auto-flow: dense;
}
/* --- 簡易査定フォームの上余白を詰める --- */
#kv-quick {
margin-top: -20px; /* 上方向に引き上げる */
}
#kv-quick .kvq {
padding-top: 8px; /* 内側余白を最小限に */
}
/* ===== Lightning / VK系：スマホのサブメニュー配色調整 ===== */
@media (max-width: 959px) {
/* サブメニューの背景を白に */
.vk-mobile-nav .sub-menu,
.vk-mobile-nav-menu .sub-menu,
.global-nav .menu .sub-menu {
background: #fff !important;
}
/* サブメニューの文字色を濃く */
.vk-mobile-nav .sub-menu a,
.vk-mobile-nav-menu .sub-menu a,
.global-nav .menu .sub-menu a {
color: #222 !important;
}
/* 罫線とホバー時 */
.vk-mobile-nav .sub-menu li,
.vk-mobile-nav-menu .sub-menu li,
.global-nav .menu .sub-menu li {
border-color: #eee !important;
}
.vk-mobile-nav .sub-menu a:hover,
.vk-mobile-nav-menu .sub-menu a:hover,
.global-nav .menu .sub-menu a:hover,
.vk-mobile-nav .sub-menu a:focus,
.vk-mobile-nav-menu .sub-menu a:focus,
.global-nav .menu .sub-menu a:focus {
background: #f6f6f6 !important;
color: #000 !important;
}
/* 開閉アイコン（▼）やトグルの色も明るく */
.vk-menu-acc .acc-btn,
.vk-mobile-nav .vk-menu-acc .acc-btn,
.vk-mobile-nav .menu .accordion-toggle,
.global-nav .menu .acc-btn {
color: #222 !important;
border-color: #222 !important;
}
}
/* ===== 下部6セクション 視認性アップ（配置・デザイン骨格は不変更） ===== */
.lp6{--pad:28px; --radius:14px; --line:#e9e9e9; --ink:#222; --muted:#666;
--shadow:0 10px 24px rgba(0,0,0,.06); --accent1:#e60000; --accent2:#ff8a00}
/* セクション枠：白カード化＋うっすら影（既存配色を崩さない） */
.lp6 > *{
background:#fff; border:1px solid var(--line); border-radius:var(--radius);
padding:clamp(18px,3.5vw, var(--pad)); margin:18px 0; box-shadow:var(--shadow);
}
/* 見出しにアクセントバー（テキストやサイズは変えない） */
.lp6 h2{
position:relative; margin-top:0; line-height:1.3; color:var(--ink);
padding-left:14px;
}
.lp6 h2::before{
content:""; position:absolute; left:0; top:.35em; width:6px; height:1.1em;
border-radius:4px; background:linear-gradient(180deg,var(--accent1),var(--accent2));
}
/* グリッド化：カードの並びを整える（既存の列数を壊さない自動幅） */
.lp6 .wp-block-post-template,
.lp6 .wp-block-query .wp-block-post-template,
.lp6 .wp-block-columns,
.lp6 .grid {
display:grid; gap:16px;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
/* カード要素（投稿・グループ・ボックス）の共通スキン */
.lp6 .wp-block-post,
.lp6 .wp-block-group,
.lp6 .card,
.lp6 .box,
.lp6 .wp-block-column {
background:#fff; border:1px solid var(--line); border-radius:12px;
padding:14px; box-shadow:0 6px 14px rgba(0,0,0,.05);
}
/* サムネイル・画像の角丸統一 */
.lp6 img{border-radius:10px}
/* 文章の読みやすさ（行間/余白の微調整） */
.lp6 p{margin:.5em 0; line-height:1.9; color:var(--ink)}
.lp6 .meta, .lp6 small{color:var(--muted)}
/* リストをチェックマーク化（既存文言を変更せず視認性のみ向上） */
.lp6 ul{list-style:none; padding-left:0; margin:.6em 0}
.lp6 ul li{position:relative; padding-left:1.25em; margin:.35em 0}
.lp6 ul li::before{
content:"✓"; position:absolute; left:0; top:0; color:#16a34a; font-weight:800;
}
/* “作成中…”などプレースホルダの可読性確保（黒抜きの上に薄い枠） */
.lp6 .placeholder,
.lp6 img[alt*="作成中"]{
outline:1px dashed #cfcfcf; outline-offset:6px;
}
/* CTA/ボタン類（既存ボタンに軽い浮き上がり。色は現状踏襲） */
.lp6 a.button, .lp6 .wp-block-button__link, .lp6 .btn, .lp6 .more-link{
display:inline-flex; align-items:center; gap:.4em;
padding:.7em 1em; border-radius:10px; font-weight:700; text-decoration:none;
box-shadow:0 4px 10px rgba(0,0,0,.08); transition:transform .18s ease, box-shadow .18s ease;
}
.lp6 a.button:hover, .lp6 .wp-block-button__link:hover, .lp6 .btn:hover, .lp6 .more-link:hover{
transform:translateY(-2px); box-shadow:0 10px 18px rgba(0,0,0,.14);
}
/* FAQ( details/summary ) をカード風に（中身はそのまま） */
.lp6 details{border:1px solid var(--line); border-radius:10px; padding:12px 14px; background:#fff}
.lp6 details + details{margin-top:10px}
.lp6 summary{cursor:pointer; font-weight:700}
/* セクション下の余白を整え、連続してもダレないように */
.lp6 > *:last-child{margin-bottom:0}
/* スマホ最適化：カードのはみ出し防止・タップ感向上 */
@media (max-width: 768px){
.lp6{--pad:20px}
.lp6 a.button, .lp6 .wp-block-button__link, .lp6 .btn, .lp6 .more-link{min-height:44px}
}
/* 下部6ブロック：外側の背景だけ薄いグレーに（内側カードは白のまま） */
.lp6 > *{
background:#f7f7f7; /* 薄いグレー */
border-color:#ececec; /* 枠線も少し淡く */
}
/* 念のため：内側カードの白は維持（既に適用済みでも再宣言） */
.lp6 .wp-block-post,
.lp6 .wp-block-group,
.lp6 .card,
.lp6 .box,
.lp6 .wp-block-column{
background:#fff;
}
.lp6 > * > *{ background:#f7f7f7; border-color:#ececec; }
/* 下部6ブロック：外側（深さ1～3段目）だけ薄グレーに */
.lp6 > *,
.lp6 > * > *,
.lp6 > * > * > * {
background:#f7f7f7 !important;
border-color:#ececec !important;
}
/* 内側コンテンツ（4段目以降／カード類）は白のまま */
.lp6 > * > * > * > *,
.lp6 :where(.wp-block-post, .wp-block-group .wp-block-group, .card, .box, .wp-block-column) {
background:#fff !important;
}
/* 画像やサムネの角丸は維持 */
.lp6 img { border-radius:10px }
/* 下部6ブロック：直下に h2 を持つコンテナを薄グレー化（スマホ/PC共通） */
.lp6 :is(section, div, article):has(> h2) {
background: #f7f7f7 !important;
border-color: #ececec !important; /* 既存の枠線があれば淡くするだけ */
}
/* 内側のカード/列は白を維持（必要な場合だけ） */
.lp6 :is(section, div, article):has(> h2)
:where(.wp-block-group, .wp-block-post, .wp-block-column, .card, .box) {
background: #fff !important;
}
/* 必要時のみ使用（通常は不要） */
.lp6 :is(section,div,article):has(> h2) { padding: 8px; }
/* :has() 方式を使っている場合 */
.lp6 :is(section,div,article):has(> h2) {
background:#f7f7f7 !important; /* ← 濃くする：#f7f7f7 → #eee（お好みで #efefef, #e9e9e9 など） */
border-color:#ddd !important; /* 枠線も少しだけ濃く */
}
/* フォールバック（.lp6-outer クラス方式）の場合 */
.lp6 .lp6-outer {
background:#f7f7f7 !important; /* 同じく濃く */
border-color:#ddd !important;
}
/* 内側カードは白のまま維持（必要なら残す） */
.lp6 .lp6-outer :where(.wp-block-group,.wp-block-post,.wp-block-column,.card,.box){
background:#fff !important;
}
/* 固定CTA帯：常時表示の背景を強制保持 */
.fixed-cta{
position: fixed; /* 既にfixed想定 */
left: 0; right: 0; bottom: 0;
background: linear-gradient(90deg, var(--red, #e60000), var(--orange, #ff8a00)) !important;
color: #fff;
box-shadow: 0 -4px 14px rgba(0,0,0,.12);
z-index: 9999;
}
.fixed-cta a{
display:block;
padding: 14px 20px;
text-align:center;
font-weight:800;
text-decoration:none;
color:#fff !important; /* テーマのa色を無効化 */
}
.fixed-cta a:hover{ filter: brightness(0.95); }
/* 念のため：lp6配下でも帯色を最優先 */
.lp6 .fixed-cta,
.lp6-outer .fixed-cta{
background: linear-gradient(90deg, var(--red, #e60000), var(--orange, #ff8a00)) !important;
}
/* 管理バー表示時の被り回避（ログイン中だけ） */
.admin-bar .fixed-cta{ bottom: 46px; }
@media (min-width: 782px){
.admin-bar .fixed-cta{ bottom: 32px; }
}
/* 必要なら：帯の下に隠れるのを避ける軽微な余白（任意） */
/* @media (max-width: 1024px){ body{ padding-bottom: 72px; } } */
/* 固定CTAのボタン文字を必ず見えるように（白文字＋背景透過） */
.fixed-cta a,
.fixed-cta a:link,
.fixed-cta a:visited,
.fixed-cta a:hover,
.fixed-cta a:active,
.fixed-cta .wp-block-button__link,
.fixed-cta a.button {
color:#fff !important;
-webkit-text-fill-color:#fff !important; /* iOS/Safari の塗りつぶし対策 */
background: transparent !important; /* テーマの白背景を打消し */
border:none !important;
box-shadow:none !important; /* テーマのボタン影が白く見える場合に無効化 */
text-shadow:0 1px 0 rgba(0,0,0,.25); /* 視認性アップ（任意） */
}
/* 念のため：帯の色は維持（前回の指定のままでOK） */
.fixed-cta{
background: linear-gradient(90deg, var(--red, #e60000), var(--orange, #ff8a00)) !important;
}
/* 各セクション末尾CTA */
.cta-between {
margin: 28px 0;
text-align:center;
}
.cta-between .btns{
display:flex; gap:12px; justify-content:center; flex-wrap:wrap;
}
.cta-between .btn{
display:inline-block; font-weight:800; letter-spacing:.02em;
padding:12px 18px; border-radius:999px; text-decoration:none;
transition:transform .08s ease, opacity .2s ease, box-shadow .2s ease;
font-size: clamp(14px,2vw,16px);
}
.cta-between .btn:active{ transform: translateY(1px) scale(.99); }
/* オレンジ */
.cta-between .btn.btn-primary{
color:#fff; background:#ff6600; border:1px solid transparent;
box-shadow: 0 8px 20px rgba(255,102,0,.35);
}
.cta-between .btn.btn-primary:hover{
box-shadow: 0 10px 28px rgba(255,102,0,.45); opacity:.98;
}
/* 電話ボタン */
.cta-between .btn.btn-ghost{
color:#fff; background:#333; border:1px solid #333;
box-shadow: 0 6px 14px rgba(0,0,0,.2);
}
.cta-between .btn.btn-ghost:hover{ filter: brightness(1.05); }
/* ===== 各セクション末尾の2ボタンCTA（.cta-between）専用 ===== */
.km-sec .cta-between {
margin: 28px 0;
text-align: center;
}
.km-sec .cta-between .btns{
display:flex; gap:12px; justify-content:center; flex-wrap:wrap;
}
/* ベース：テーマの .btn を確実に上書き */
.km-sec .cta-between .btn{
display:inline-block; font-weight:800; letter-spacing:.02em;
padding:12px 18px; border-radius:999px; text-decoration:none;
transition:transform .08s ease, opacity .2s ease, box-shadow .2s ease;
font-size: clamp(14px,2vw,16px);
line-height:1; /* 高さのブレ防止 */
border:1px solid transparent; /* 既定の枠をリセット */
}
/* --- オレンジ（上部と同トーン）--- */
.km-sec .cta-between .btn.btn-primary{
color:#fff !important;
background:#ff6600 !important;
border-color:#ff6600 !important;
box-shadow: 0 8px 20px rgba(255,102,0,.35);
}
.km-sec .cta-between .btn.btn-primary:hover{
box-shadow: 0 10px 28px rgba(255,102,0,.45);
opacity:.98;
}
/* --- 電話ボタン：白背景でも埋もれない“濃色塗り” --- */
.km-sec .cta-between .btn.btn-ghost{
color:#fff !important;
background:#333 !important;
border-color:#333 !important;
box-shadow: 0 6px 14px rgba(0,0,0,.2);
}
.km-sec .cta-between .btn.btn-ghost:hover{
filter: brightness(1.05);
}
/* もし“枠線のみ”にしたい場合は↑の .btn-ghost を下で上書き（どちらか一方を使用） */
/*
.km-sec .cta-between .btn.btn-ghost{
color:#222 !important;
background: transparent !important;
border-color:#222 !important;
}
.km-sec .cta-between .btn.btn-ghost:hover{
background: rgba(0,0,0,.06);
}
*/