@charset "utf-8";
/* ============================================================
   六代鍼灸接骨院 — デザインリフレッシュ層（仮ページ用）
   方針: 文言・ブロックの順序は一切変更しない。見た目だけを整える。
   既存テーマ x-t9 / VK Blocks の上に後載せする。
   ============================================================ */

/* ---------- 1. トークン ---------- */
:root{
  --rk-ink:        #1b1a18;
  --rk-ink-2:      #55524d;
  --rk-ink-3:      #8a867f;
  --rk-brand:      #51bcd7;   /* 既存ブランドシアン（塗り用） */
  --rk-brand-deep: #1a8dab;   /* 文字・線用に彩度を落とした濃色 */
  --rk-brand-ink:  #0f6d87;
  --rk-tint:       #eef8fb;   /* シアンの極薄面 */
  --rk-tint-2:     #dcf0f6;
  --rk-paper:      #ffffff;
  --rk-paper-2:    #f7f5f2;   /* 温かみのあるオフホワイト */
  --rk-line:       rgba(27,26,24,.10);
  --rk-line-2:     rgba(27,26,24,.06);
  --rk-shadow:     0 1px 2px rgba(27,26,24,.04), 0 8px 24px rgba(27,26,24,.06);
  --rk-shadow-lg:  0 2px 4px rgba(27,26,24,.04), 0 18px 48px rgba(27,26,24,.10);
  --rk-radius:     14px;
  --rk-radius-lg:  22px;
  --rk-serif: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --rk-sans:  "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP",
              "Yu Gothic Medium", "Yu Gothic", Meiryo, system-ui, sans-serif;
  --rk-bar-h: 0px;
}

/* ---------- 2. ベース ---------- */
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  font-family: var(--rk-sans);
  color: var(--rk-ink);
  background: var(--rk-paper);
  line-height: 1.9;
  letter-spacing: .04em;
  font-feature-settings: "palt" 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  padding-bottom: var(--rk-bar-h);
}
p{ line-height:1.95; }
img, video{ max-width:100%; height:auto; }
a{ color: var(--rk-brand-ink); text-underline-offset:.25em; }
a:hover{ color: var(--rk-brand-deep); }

/* コンクリート地のテクスチャを廃して、清潔な面に置き換える */
.rk-surface{ background-image:none !important; background-color: var(--rk-paper-2) !important; }
.rk-surface--tint{ background-image:none !important; background-color: var(--rk-tint) !important; }

/* ---------- 3. 見出し ---------- */
h1,h2,h3,h4,
.wp-block-heading,
.wp-block-post-title{
  font-family: var(--rk-serif);
  font-weight: 600;
  letter-spacing: .08em;
  line-height: 1.55;
  color: var(--rk-ink);
}
h2.wp-block-heading{ font-size: clamp(1.45rem, 1.1rem + 1.3vw, 2.05rem); }
h3.wp-block-heading{ font-size: clamp(1.15rem, .95rem + .8vw, 1.45rem); }

/* 「営業時間 / アクセス」等の両端罫見出しを、細い罫＋余白で上品に */
.is-style-vk-heading-both_ends{ display:flex; align-items:center; gap:1.1em; }
.is-style-vk-heading-both_ends::before,
.is-style-vk-heading-both_ends::after{
  content:""; flex:1 1 auto; height:1px;
  background: linear-gradient(90deg, transparent, var(--rk-line), transparent);
}
.is-style-vk-heading-both_ends .vk-heading__text-wrapper{ flex:0 0 auto; padding:0; }

/* 見出し直下の英字サブタイトル（Access / Consultation time など） */
.rk-subtitle,
.wp-block-heading + p.has-primary-color{
  font-family: var(--rk-sans) !important;
  font-size: .72rem !important;
  letter-spacing: .28em !important;
  text-transform: uppercase;
  color: var(--rk-brand-deep) !important;
  margin-top: .6em !important;
}

/* ---------- 4. セクションのリズム ---------- */
.wp-site-blocks > main > .wp-block-group,
main > .wp-block-group{ padding-block: clamp(56px, 7vw, 104px); }
main .wp-block-group.alignfull{ padding-inline: max(20px, env(safe-area-inset-left)); }
.wp-block-spacer{ max-height: 72px; }

/* ---------- 5. ヒーロー（スライダー） ---------- */
.vk_slider .wp-block-cover,
.vk_slider_item .wp-block-cover{
  min-height: clamp(360px, 46vw, 600px) !important;
}
.vk_slider .wp-block-cover__video-background{ object-fit:cover; }
/* 文字の可読性を確保する上下グラデーション（元の写真は残す） */
.vk_slider_item .wp-block-cover::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(180deg, rgba(12,20,24,.42) 0%, rgba(12,20,24,.14) 42%, rgba(12,20,24,.52) 100%);
}
.vk_slider_item .wp-block-cover__inner-container{ position:relative; z-index:2; }
.vk_slider_item .wp-block-cover p,
.vk_slider_item .wp-block-cover h1,
.vk_slider_item .wp-block-cover h2{
  font-family: var(--rk-serif);
  font-size: clamp(1.15rem, .72rem + 1.9vw, 2.3rem) !important;
  line-height: 1.85;
  letter-spacing: .1em;
  text-shadow: 0 2px 18px rgba(0,0,0,.42);
  color:#fff !important;
}
.vk_slider .swiper-button-next,
.vk_slider .swiper-button-prev{
  width:44px; height:44px; border-radius:50%;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(6px);
  box-shadow: var(--rk-shadow);
  transition: background .2s, transform .2s;
}
.vk_slider .swiper-button-next:hover,
.vk_slider .swiper-button-prev:hover{ background:#fff; transform:scale(1.06); }
.vk_slider .swiper-button-next::after,
.vk_slider .swiper-button-prev::after{ font-size:14px !important; color: var(--rk-ink); font-weight:700; }
.vk_slider .swiper-pagination-bullet{
  width:8px; height:8px; background:#fff; opacity:.5;
  transition: width .25s, opacity .25s;
}
.vk_slider .swiper-pagination-bullet-active{ width:26px; border-radius:4px; opacity:1; }

/* ---------- 6. ヘッダー ---------- */
header.wp-block-template-part{
  position: sticky; top:0; z-index:900;
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--rk-line-2);
  box-shadow: 0 1px 0 rgba(27,26,24,.02);
}
header .custom-logo{ width:auto; height:clamp(38px, 4.4vw, 56px); }
header .wp-block-navigation__container{ gap: clamp(14px, 1.6vw, 30px); }
header .wp-block-navigation-item__content{
  font-family: var(--rk-sans);
  font-size:.9rem; font-weight:600; letter-spacing:.06em;
  color: var(--rk-ink); text-decoration:none !important;
  padding-block:.5em; position:relative;
}
header .wp-block-navigation-item__content::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background: var(--rk-brand); transform:scaleX(0); transform-origin:center;
  transition: transform .24s ease;
}
header .wp-block-navigation-item__content:hover::after{ transform:scaleX(1); }
header .wp-block-navigation__responsive-container-open,
header .wp-block-navigation__responsive-container-close{ color: var(--rk-ink); }

/* ---------- 7. ボタン ---------- */
.vk_button .vk_button_link,
.wp-block-button__link{
  border-radius: 999px !important;
  font-family: var(--rk-sans);
  font-weight: 700;
  letter-spacing: .06em;
  padding: .95em 2.1em !important;
  border: none !important;
  box-shadow: 0 6px 18px rgba(26,141,171,.22);
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.vk_button .vk_button_link:hover,
.wp-block-button__link:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(26,141,171,.30);
}
/* 「is-style-shine」の光沢アニメは古びて見えるので止める */
.vk_button.is-style-shine .vk_button_link::before,
.vk_button.is-style-shine .vk_button_link::after{ display:none !important; }
.vk_button_link_subCaption{
  font-size:.72rem; letter-spacing:.04em; opacity:.85; margin-top:.35em;
}
/* 「続きを読む」など小さめのボタン */
.vk_posts .vk_post_btn,
.wp-block-read-more{
  display:inline-block; border-radius:999px;
  border:1px solid var(--rk-brand-deep) !important;
  background:transparent !important; color: var(--rk-brand-ink) !important;
  font-size:.8rem; font-weight:700; letter-spacing:.06em;
  padding:.5em 1.4em !important; text-decoration:none !important;
  transition: background-color .2s, color .2s;
}
.vk_posts .vk_post_btn:hover,
.wp-block-read-more:hover{ background: var(--rk-brand-deep) !important; color:#fff !important; }

/* ---------- 8. 画像 ---------- */
.wp-block-image img{ border-radius: var(--rk-radius); }
.wp-block-image.is-style-rounded img{ border-radius:50%; }
figure.wp-block-image{ margin-block: 1.4em; }

/* ---------- 9. お知らせ（記事一覧） ---------- */
.wp-block-query .wp-block-post{
  background: var(--rk-paper);
  border: 1px solid var(--rk-line-2);
  border-radius: var(--rk-radius);
  padding: clamp(18px, 2.4vw, 28px);
  box-shadow: var(--rk-shadow);
  transition: transform .22s ease, box-shadow .22s ease;
}
.wp-block-query .wp-block-post:hover{ transform: translateY(-3px); box-shadow: var(--rk-shadow-lg); }
.wp-block-query .wp-block-post + .wp-block-post{ margin-top: 18px; }
.wp-block-post-title{ font-size: clamp(1.02rem, .9rem + .4vw, 1.22rem) !important; }
.wp-block-post-title a{ color: var(--rk-ink); text-decoration:none; }
.wp-block-post-title a:hover{ color: var(--rk-brand-ink); }
.wp-block-post-date, .wp-block-post-terms{
  font-family: var(--rk-sans); font-size:.76rem; letter-spacing:.06em; color: var(--rk-ink-3);
}
.wp-block-post-excerpt__excerpt{ color: var(--rk-ink-2); font-size:.92rem; }

/* ---------- 10. 表（営業時間・料金） ---------- */
.wp-block-table{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.wp-block-table table{
  border-collapse: separate; border-spacing:0;
  width:100%; background: var(--rk-paper);
  border:1px solid var(--rk-line); border-radius: var(--rk-radius); overflow:hidden;
  font-family: var(--rk-sans);
}
.wp-block-table th, .wp-block-table td{
  border:0; border-bottom:1px solid var(--rk-line-2);
  padding: .85em .7em; font-size:.92rem; text-align:center; vertical-align:middle;
}
.wp-block-table thead th,
.wp-block-table tr:first-child th{
  background: var(--rk-tint); color: var(--rk-brand-ink);
  font-weight:700; letter-spacing:.08em; border-bottom:1px solid var(--rk-tint-2);
}
.wp-block-table tbody tr:last-child th,
.wp-block-table tbody tr:last-child td{ border-bottom:0; }
.wp-block-table tbody tr:nth-child(even) td{ background: rgba(238,248,251,.45); }
.wp-block-table td:first-child, .wp-block-table th:first-child{ text-align:left; padding-left:1.1em; }

/* ---------- 11. リスト ---------- */
.is-style-vk-check-square-mark li{ line-height:1.85; margin-bottom:.5em; }
.wp-block-list li::marker{ color: var(--rk-brand-deep); }

/* ---------- 12. フッター ---------- */
footer.wp-block-template-part .rk-surface,
footer.wp-block-template-part > .wp-block-group{
  background-image:none !important;
  background-color: var(--rk-ink) !important;
  color: rgba(255,255,255,.82);
}
footer.wp-block-template-part p,
footer.wp-block-template-part a{ color: rgba(255,255,255,.82) !important; }
footer.wp-block-template-part a:hover{ color:#fff !important; }
footer.wp-block-template-part .custom-logo{ filter: invert(1) brightness(1.9); opacity:.94; }
footer .vk_icon_border{ border-color: rgba(255,255,255,.28) !important; }

/* ---------- 13. アクセス欄に足した要素 ---------- */
.rk-contact{
  display:flex; flex-wrap:wrap; gap:14px; margin-top:26px;
}
.rk-contact__btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  flex:1 1 220px; min-height:60px; padding:.9em 1.4em;
  border-radius:999px; font-family:var(--rk-sans); font-weight:700;
  letter-spacing:.06em; text-decoration:none !important; font-size:1.02rem;
  transition: transform .2s ease, box-shadow .2s ease;
}
.rk-contact__btn:hover{ transform: translateY(-2px); }
.rk-contact__btn--tel{
  background: var(--rk-brand-deep); color:#fff !important;
  box-shadow: 0 8px 22px rgba(26,141,171,.28);
}
.rk-contact__btn--tel small{ display:block; font-size:.66rem; letter-spacing:.14em; opacity:.9; font-weight:600; }
.rk-contact__btn--line{
  background:#06c755; color:#fff !important; box-shadow: 0 8px 22px rgba(6,199,85,.26);
}
.rk-contact__btn--jiko{
  background:#fff; color: var(--rk-brand-ink) !important;
  border:2px solid var(--rk-brand-deep);
}
.rk-map{
  margin-top:26px; border-radius: var(--rk-radius-lg); overflow:hidden;
  box-shadow: var(--rk-shadow); border:1px solid var(--rk-line-2); line-height:0;
}
.rk-map iframe{ width:100%; height:clamp(280px, 34vw, 420px); border:0; display:block; }

/* ---------- 14. 交通事故バナー（チャットLPへの入口） ---------- */
.rk-jiko{
  margin: 0 auto; max-width: 940px;
  background: linear-gradient(135deg, var(--rk-tint) 0%, #ffffff 100%);
  border:1px solid var(--rk-tint-2); border-radius: var(--rk-radius-lg);
  padding: clamp(24px, 3.4vw, 40px);
  display:flex; align-items:center; gap: clamp(16px, 2.4vw, 32px); flex-wrap:wrap;
  box-shadow: var(--rk-shadow);
}
.rk-jiko__body{ flex:1 1 320px; }
.rk-jiko__label{
  display:inline-block; font-family:var(--rk-sans); font-size:.68rem; font-weight:700;
  letter-spacing:.18em; color:#fff; background: var(--rk-brand-deep);
  padding:.35em 1em; border-radius:999px; margin-bottom:.9em;
}
.rk-jiko__title{
  font-family: var(--rk-serif); font-weight:600;
  font-size: clamp(1.15rem, .95rem + .8vw, 1.6rem); line-height:1.6; margin:0 0 .5em;
}
.rk-jiko__text{ font-size:.94rem; color: var(--rk-ink-2); margin:0; }
.rk-jiko__cta{ flex:0 0 auto; }

/* ---------- 15. スマホ固定CTAバー ---------- */
.rk-bar{
  position: fixed; left:0; right:0; bottom:0; z-index:1000;
  display:none; gap:1px; background: var(--rk-line);
  box-shadow: 0 -2px 18px rgba(27,26,24,.14);
  padding-bottom: env(safe-area-inset-bottom);
}
.rk-bar a{
  flex:1 1 0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; padding:.6em .2em; text-decoration:none !important;
  font-family: var(--rk-sans); font-size:.72rem; font-weight:700; letter-spacing:.04em;
  background:#fff; color: var(--rk-ink) !important; min-height:58px;
}
.rk-bar a svg{ width:20px; height:20px; }
.rk-bar .rk-bar__tel{ background: var(--rk-brand-deep); color:#fff !important; }
.rk-bar .rk-bar__line{ background:#06c755; color:#fff !important; }

/* ---------- 16. モバイル調整 ---------- */
@media (max-width: 781px){
  :root{ --rk-bar-h: 58px; }
  .rk-bar{ display:flex; }
  body{ letter-spacing:.02em; }
  .wp-site-blocks > main > .wp-block-group,
  main > .wp-block-group{ padding-block: clamp(44px, 9vw, 68px); }
  .wp-block-spacer{ max-height:40px !important; }

  /* 元サイトでスマホ時に文字が重なっていた列レイアウトを縦積みに矯正 */
  .wp-block-columns:not(.is-not-stacked-on-mobile){ display:block !important; }
  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column{
    width:100% !important; flex-basis:auto !important; margin-left:0 !important;
  }
  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column + .wp-block-column{
    margin-top: 1.6em;
  }
  /* 絶対配置で重なっているテキストを通常フローへ戻す */
  main .wp-block-group.rk-fix-overlap [style*="position:absolute"],
  main .wp-block-group.rk-fix-overlap [style*="position: absolute"]{
    position: static !important; transform:none !important; inset:auto !important;
  }
  .rk-contact__btn{ flex:1 1 100%; }
  .rk-jiko{ flex-direction:column; align-items:stretch; text-align:left; }
  .rk-jiko__cta{ width:100%; }
  .rk-jiko__cta .rk-contact__btn{ width:100%; }
  .wp-block-table th, .wp-block-table td{ font-size:.82rem; padding:.7em .45em; }
}

@media (min-width: 782px){
  .rk-map iframe{ height: 380px; }
}

/* ---------- 17. 動きの配慮 ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
  html{ scroll-behavior:auto; }
}

/* ---------- 18. 仮ページであることの帯 ---------- */
.rk-preview-flag{
  background: #1b1a18; color:#fff; font-family: var(--rk-sans);
  font-size:.74rem; letter-spacing:.08em; text-align:center; padding:.5em 1em;
  position: relative; z-index:1000;
}

/* ============================================================
   19. 実機確認後の追い込み（2026-08-21）
   ============================================================ */

/* 19-1. ヒーロー: 明るい写真の上でも文字が読めるようにする */
.vk_slider_item .wp-block-cover::after{
  background: linear-gradient(180deg,
    rgba(10,18,22,.22) 0%,
    rgba(10,18,22,.00) 30%,
    rgba(10,18,22,.00) 70%,
    rgba(10,18,22,.34) 100%) !important;
}
.vk_slider_item .wp-block-cover__inner-container p{
  text-shadow: 0 1px 2px rgba(0,0,0,.55), 0 6px 26px rgba(0,0,0,.45);
}

/* 19-2. 「続きを読む」を控えめなアウトラインボタンに */
.wp-block-post-excerpt__more-text{ margin-top:1.1em; }
.wp-block-post-excerpt__more-link{
  display:inline-block; border-radius:999px;
  border:1px solid var(--rk-brand-deep);
  background:transparent; color: var(--rk-brand-ink) !important;
  font-family: var(--rk-sans); font-size:.78rem; font-weight:700; letter-spacing:.08em;
  padding:.5em 1.5em; text-decoration:none !important;
  transition: background-color .2s ease, color .2s ease;
}
.wp-block-post-excerpt__more-link:hover{
  background: var(--rk-brand-deep); color:#fff !important;
}

/* 19-3. フッター: ロゴとアイコンを確実に白抜きにする */
footer.wp-block-template-part .custom-logo{
  filter: brightness(0) invert(1) !important;
  opacity: .92;
}
footer.wp-block-template-part .vk_icon_border{
  border-color: rgba(255,255,255,.35) !important;
}
footer.wp-block-template-part .vk_icon svg,
footer.wp-block-template-part .vk_icon i{ color:#fff !important; fill:#fff !important; }
footer.wp-block-template-part .wp-block-navigation-item__content{ color:rgba(255,255,255,.78) !important; }

/* 19-4. アクセス: 幽霊カラムを外したので中央に寄せる */
.rk-access .wp-block-columns{ justify-content:center; }
.rk-access .wp-block-column{ flex-basis:auto !important; max-width:720px; }
.rk-access .wp-block-list{ display:inline-block; text-align:left; }
.rk-access > .wp-block-group,
.rk-access .wp-block-columns{ margin-inline:auto; }
.rk-contact{ justify-content:center; max-width:720px; margin-inline:auto; }
.rk-map{ max-width:960px; margin-inline:auto; }

/* 19-5. 電話ボタン内の2段組み */
.rk-contact__btn--tel span{ display:block; text-align:center; line-height:1.35; }
.rk-contact__btn--tel span small{ display:block; }

/* 19-6. 記事カード内に残る区切り線を消す */
.wp-block-query .wp-block-post{ border-bottom:1px solid var(--rk-line-2) !important; }
.wp-block-query .wp-block-post hr,
.wp-block-query .wp-block-post .wp-block-separator{ display:none; }

/* 19-7. スマホの本文余白 */
@media (max-width:781px){
  .rk-access .wp-block-list{ display:block; }
  .vk_slider_item .wp-block-cover__inner-container p{ font-size: clamp(1.02rem,.7rem+1.6vw,1.4rem) !important; }
}

/* 19-8. フッターのロゴ（custom-logoではなく通常の画像ブロック）を白抜きにする */
footer.wp-block-template-part img{ filter: brightness(0) invert(1); opacity:.92; }
footer.wp-block-template-part .vk_icon img{ filter:none; opacity:1; }

/* 19-9. アクセス欄の地図（元サイトのiframe）を整える */
.rk-access iframe{
  width:100% !important; border:0; border-radius: var(--rk-radius-lg);
  box-shadow: var(--rk-shadow); display:block; min-height: 320px;
}
.rk-access .wp-block-columns{ gap: clamp(20px,3vw,44px); align-items:flex-start; }
@media (max-width:781px){
  .rk-access iframe{ min-height:260px; }
}

/* 19-10. 既存のフローティングLINEボタン（blog-floating-button）は、
   電話・LINE・交通事故をまとめた下部バーに一本化するため非表示にする。
   ※LINEの導線は下部バーの「LINE予約」が引き継ぐ */
.bfb_textBtn, .bfb_imgBtn, #bfb_btn_wrap{ display:none !important; }

/* 19-11. ヒーローの文字を本文カラム幅に揃える（左端に貼り付いていたため） */
.vk_slider_item .wp-block-cover__inner-container{
  width:100% !important; max-width:1140px !important; margin-inline:auto !important;
  padding-inline: clamp(20px, 3.2vw, 40px) !important;
}
.vk_slider_item .wp-block-cover__inner-container > .wp-block-columns{
  max-width:100% !important; margin-inline:auto !important;
}
/* 明るい写真のスライドでも文字が沈まないよう、左からの淡い暗幕を重ねる */
.vk_slider_item .wp-block-cover::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background: linear-gradient(100deg, rgba(10,18,22,.46) 0%, rgba(10,18,22,.26) 46%, rgba(10,18,22,.06) 100%);
}
@media (max-width:781px){
  .vk_slider_item .wp-block-cover::before{
    background: linear-gradient(180deg, rgba(10,18,22,.30) 0%, rgba(10,18,22,.44) 100%);
  }
}

/* 19-12. ヒーロースライダーを外したので、FVを画面最上部に詰める
   ※ main の第1子は視覚的非表示のh1なので、その次の要素を狙う */
body.home main > h1.screen-reader-text + *{ padding-top:0 !important; margin-top:0 !important; }
body.home main > h1.screen-reader-text + * > .wp-block-spacer:first-child,
body.home main > h1.screen-reader-text + * > .vk_spacer:first-child{ display:none !important; }
body.home main > h1.screen-reader-text + * > *:first-child{ margin-top:0 !important; }

/* ============================================================
   18.【目立たせる案 / RK_VARIANT=jiko】交通事故のご相談 導線
   2026-08-24 色味を視認性優先へ変更（恵太くん指示）。
   旧＝スレート×ゴールドは上品だが埋もれる。交通事故導線は
   「気づかれること」が最優先なので、朱赤をキーカラーに置く。
   本文・FVのシアン系とは補色関係になり、面が小さくても視線を拾う。
   ============================================================ */
:root{
  --rk-jiko-key:   #cf3d1d;   /* キーカラー（朱赤・白文字でコントラスト比4.8確保） */
  --rk-jiko-key2:  #b52f16;   /* 濃い側・白地の上の文字色にも使う（6.2） */
  --rk-jiko-key3:  #97230d;   /* さらに濃い側（グラデ終端） */
  --rk-jiko-pale:  rgba(255,255,255,.95);   /* 赤地の上の本文（淡色だと3.3で足りない） */
}

.rk-jikohero-wrap{
  background: var(--rk-paper);
  padding: clamp(18px, 2.6vw, 30px) 20px;
}
.rk-jikohero{
  display:flex; align-items:center; gap: clamp(14px, 2.2vw, 28px);
  max-width: 1040px; margin:0 auto;
  padding: clamp(20px, 2.6vw, 32px) clamp(20px, 3vw, 36px);
  border-radius: var(--rk-radius-lg);
  background: linear-gradient(135deg, var(--rk-jiko-key) 0%, var(--rk-jiko-key3) 100%);
  box-shadow: 0 2px 4px rgba(153,40,15,.18), 0 16px 40px rgba(153,40,15,.28);
  text-decoration:none !important; color:#fff !important;
  transition: transform .25s ease, box-shadow .25s ease;
}
.rk-jikohero:hover{ transform: translateY(-2px); color:#fff !important; }
.rk-jikohero__icon{
  flex:0 0 auto; width:54px; height:54px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.55);
  color:#fff;
}
.rk-jikohero__icon svg{ width:27px; height:27px; }
.rk-jikohero__body{ flex:1 1 auto; display:block; }
.rk-jikohero__label{
  display:inline-block; font-family: var(--rk-sans);
  font-size:.7rem; font-weight:700; letter-spacing:.16em;
  color: var(--rk-jiko-key2); background:#fff;
  padding:.32em .95em; border-radius:999px; margin-bottom:.7em;
}
.rk-jikohero__title{
  display:block; font-family: var(--rk-serif); font-weight:600;
  font-size: clamp(1.18rem, .95rem + .9vw, 1.6rem); line-height:1.55;
  letter-spacing:.06em; margin-bottom:.4em;
  text-shadow: 0 1px 2px rgba(120,30,10,.25);
}
.rk-jikohero__text{
  display:block; font-size:.9rem; line-height:1.85; color: var(--rk-jiko-pale);
}
.rk-jikohero__text b{ color:#fff; font-weight:700; }
.rk-jikohero__btn{
  flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  background:#fff; color: var(--rk-jiko-key2) !important;
  font-family: var(--rk-sans); font-weight:700; font-size:.95rem; letter-spacing:.04em;
  padding: 1em 1.8em; border-radius:999px; white-space:nowrap;
  box-shadow: 0 6px 18px rgba(90,20,5,.28);
}
.rk-jikohero:hover .rk-jikohero__btn{ background:#fff8f5; }

/* 下層ページ用の細帯 */
.rk-jikoribbon{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:.4em 1em; padding:.85em 20px;
  background: var(--rk-jiko-key2); color:#fff !important;
  text-decoration:none !important; font-size:.86rem; letter-spacing:.03em;
}
.rk-jikoribbon__label{
  font-family: var(--rk-sans); font-weight:700; font-size:.7rem; letter-spacing:.14em;
  color: var(--rk-jiko-key2); background:#fff;
  padding:.25em .8em; border-radius:999px;
}
.rk-jikoribbon__more{
  font-weight:700; color:#fff; border-bottom:1px solid rgba(255,255,255,.75);
}
.rk-jikoribbon:hover{ color:#fff !important; background: var(--rk-jiko-key); }

/* グローバルナビの「交通事故のご相談」 */
.rk-nav-jiko .wp-block-navigation-item__content{
  color:#fff !important;
  background: var(--rk-jiko-key);
  border-radius:999px; padding:.4em 1.1em !important;
  box-shadow: 0 2px 8px rgba(153,40,15,.28);
}
.rk-nav-jiko .wp-block-navigation-item__content:hover{
  background: var(--rk-jiko-key2); color:#fff !important;
}

/* スマホ固定バー：交通事故を主役にする */
.rk-bar .rk-bar__jiko{
  background: var(--rk-jiko-key); color:#fff !important;
}
.rk-bar .rk-bar__jiko svg{ color:#fff; }

@media (max-width: 781px){
  .rk-jikohero{
    flex-direction:column; align-items:stretch; text-align:left;
    padding: 22px 20px 20px;
  }
  .rk-jikohero__icon{ width:46px; height:46px; }
  .rk-jikohero__icon svg{ width:23px; height:23px; }
  .rk-jikohero__btn{ width:100%; margin-top:.5em; }
  .rk-jikoribbon{ font-size:.78rem; padding:.7em 16px; }
  .rk-jikoribbon__text{ flex:1 1 100%; text-align:center; }
}