/* =========================================
   1. 基本設定（全ページ共通）
========================================= */

body {
  font-family: "メイリオ", sans-serif;
  margin: 0;
  padding: 0;
  background: #f5f5f5;
}

/* ▼ PCではスマホメニューを完全非表示（最優先） */
.sp-nav {
  display: none;
}

/* ▼ h1 を画面に表示せず、SEOだけ効かせる（重要） */
.h1-hidden {
  position: absolute;
  left: -9999px;
}

/* =========================================
   2. 新レイアウト（トップページ専用）
========================================= */

.content-wrap {
  max-width: 1600px;
  margin: 20px auto 40px;
  display: flex;
  gap: 30px;
  align-items: flex-start;
}

.left-column {
  width: 1300px;
}

/* ▼ ファーストビューの特徴枠 */
.illustration-style {
  background: #fffdf8;
  padding: 40px 30px;
  border-radius: 20px;
  border: 2px solid #f3e9d7;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
  max-width: 1000px;
  margin: 0 auto 60px;
  position: relative;
}

.illustration-style::before,
.illustration-style::after {
  content: "";
  position: absolute;
  width: 40px;
  height: 40px;
  background: url('leaf.svg') no-repeat center/contain;
  opacity: 0.7;
}

.illustration-style::before { top: -12px; left: -12px; }
.illustration-style::after { bottom: -12px; right: -12px; }

.illustration-style h2 {
  font-size: 2.3rem;
  font-weight: 700;
  color: #5a4a42;
  text-align: center;
  letter-spacing: 0.02em;
  margin: 10px 0 35px;
}

.illustration-style p {
  font-size: 1rem;
  line-height: 1.8;
  color: #5a4a42;
  margin-bottom: 20px;
}

.feature-card {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.feature-card h3,
.feature-card p {
  margin: 0 0 10px;
}


/* ▼ PC：特徴欄のブロック間のスペースを広げる */
.feature-card {
  margin-bottom: 40px;  /* ← ここを増やすだけでOK（24〜50pxが目安） */
}


/* ▼ ファーストビュー写真 */
.fv-wrap {
  width: 100%;
  margin-bottom: 0;
}

.fv-photo img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
}


/* ▼ NEWバッジ（PC・スマホ共通・統一版） */
.badge-new,
.badge-new-info {
  display: inline-block;
  background: #e63946;   /* 落ち着いた赤 */
  color: #fff;
  font-size: 11px;
  font-weight: bold;
  padding: 2px 6px;
  border-radius: 6px;
  margin-left: 6px;
  line-height: 1;
}

/* ▼ NEW の軽いアニメーション（任意） */
.badge-new,
.badge-new-info {
  animation: pop 1.2s ease infinite;
}

@keyframes pop {
  0% { transform: scale(1); }
  50% { transform: scale(1.12); }
  100% { transform: scale(1); }
}



/* =========================================
   3. サイドバー
========================================= */

.sidebar-fv {
  width: 300px;
  background: #eee;
  padding: 20px;
  border-radius: 4px;
  flex-shrink: 0;
}

.sidebar-photo {
  width: 100%;
  max-width: 240px;
  margin: 0 auto 10px;
  display: block;
  border-radius: 6px;
}

.sidebar-title {
  font-size: 1.1rem;
  font-weight: bold;
  color: #2a6ebb;
  margin-bottom: 10px;
  text-align: center;
}

.sidebar-office-name {
  text-align: center;
}

.sidebar-news {
  background: #f8faff;
  border: 1px solid #d0d8e8;
  padding: 15px;
  margin-bottom: 20px;
  border-radius: 6px;
}

.sidebar-news-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sidebar-news-list li {
  font-size: 0.9rem;
  padding: 6px 0;
  border-bottom: 1px solid #e0e6f0;
}

.sidebar-news-list .date {
  font-weight: bold;
  color: #2a6ebb;
  margin-right: 6px;
}

/* =========================================
   4. 取扱業務ナビ
========================================= */

/* ▼ 業務ナビを写真に負けないように強調 */
.global-nav {
  background: #f0f4fa; /* ← 淡い青で存在感UP */
  border-bottom: 1px solid #c7d4e5;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08); /* ← 上品な薄影 */
}

/* ▼ 業務ナビの上下余白を少し増やす（存在感UP） */
.service-nav {
  padding: 14px 0;
}

/* ▼ 各カードの枠線を少し濃くして視認性UP */
.service-nav a {
  border: 1px solid #ccc;
}

/* ▼ PCでは説明文を非表示 */
.nav-desc {
  display: none;
}

.global-nav-inner {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
}

.service-nav {
  list-style: none;
  margin: 0;
  padding: 10px 0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}

.service-nav li {
  flex: 1;
  min-width: 150px;
  text-align: center;
}

.service-nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 14px 5px;
  background: #ffffff;
  color: #333;
  text-decoration: none;
  font-size: 16px;
  border-radius: 6px;
  border: 1px solid #ddd;
  box-shadow: 0 1px 4px rgba(0,0,0,0.10);
  transition: 0.2s;
}

.service-nav a:hover {
  background: #e9f2ff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  transform: translateY(-3px);
}

.service-nav .icon svg {
  width: 34px;
  height: 34px;
  stroke: #5a4a42;
  transition: 0.2s;
}

.service-nav a:hover .icon svg {
  transform: scale(1.12);
  stroke: #5a4a42;
}

/* =========================================
   5. 取扱業務カード
========================================= */

.service-cards {
  margin-top: 40px;
}

.service-title {
  text-align: center;
  font-size: 1.6rem;
  color: #2a6ebb;
  margin-bottom: 25px;
  font-weight: bold;
  border-left: none !important;
  padding-left: 0 !important;
}

.service-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
}

.service-card {
  flex: 1;
  min-width: 260px;
  background: #f8faff;
  border: 1px solid #d0d8e8;
  border-radius: 8px;
  padding: 25px 20px;
  text-align: center;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  transition: 0.2s;
}

.service-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.service-card .icon {
  font-size: 55px;
  margin-bottom: 12px;
  line-height: 1;
}

.service-card p {
  font-size: 14px;
  line-height: 1.7;
  white-space: normal;
  word-break: break-word;
}

/* =========================================
   6. 代表挨拶
========================================= */

.greeting-flex {
  display: flex;
  align-items: center;
  gap: 30px;
  margin: 40px 0;
}

.greeting-photo-wrap {
  flex: 1;
  text-align: center;
}

.greeting-photo {
  width: 100%;
  max-width: 250px;
  border-radius: 8px;
}

.greeting-text {
  flex: 2;
}

.greeting-text h2 {
  margin-top: 0;
}

.greeting .btn,
.greeting-text .btn {
  display: inline-block;
  padding: 10px 20px;
  background: #2a6ebb;
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
}

/* =========================================
   7. 相続手続のご案内（トップページ）
========================================= */

.souzoku-info {
  max-width: 900px;
  margin: 40px auto;
  padding: 32px 28px;
  background: #f2f2f2;
  border: 1px solid #d9d9d9;
  border-radius: 10px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.05);
  line-height: 1.8;
}

.souzoku-info h2 {
  font-size: 24px;
  font-weight: 700;
  color: #1a4f8b;
  margin-bottom: 18px;
  border-left: none;
  padding-left: 0;
}

.souzoku-info p {
  font-size: 16px;
  margin-bottom: 18px;
  color: #333;
}

.souzoku-flow-simple {
  list-style: none;
  padding-left: 0;
  margin: 12px 0 22px;
}

.souzoku-flow-simple li {
  padding: 6px 0;
  font-size: 16px;
  font-weight: 600;
  color: #1a1a1a;
}

.souzoku-btn-wrap {
  text-align: center;
  margin-top: 25px;
}

.souzoku-btn {
  display: inline-block;
  background: #1a4f8b;
  color: #fff;
  padding: 14px 32px;
  border-radius: 6px;
  text-decoration: none;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.5px;
  transition: 0.2s;
}

.souzoku-btn:hover {
  opacity: 0.88;
  transform: translateY(-1px);
}

/* =========================================
   8. ヘッダー（PC版）
========================================= */

.site-header {
  background: linear-gradient(90deg, #e8f1ff, #ffffff);
  padding: 20px 0;
  border-bottom: 3px solid #2a5db0;
}

.header-inner {
  width: 95%;
  max-width: 1500px;
  padding: 0 20px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.site-title {
  display: flex;
  align-items: center;
  gap: 6px;
}

.site-title-text {
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-start;
  text-align: left;
  line-height: 1.2;
}

.logo-image {
  height: 110px;
  width: auto;
}

.site-title a.office-name {
  font-size: 36px !important;
  font-weight: 900 !important;
  color: #1b4f9c !important;
  text-decoration: none;
  letter-spacing: 3px;
  padding-bottom: 6px;
  display: inline-block;
  text-shadow:
    0px 2px 2px rgba(255,255,255,0.8),
    0px -2px 3px rgba(0,0,0,0.25);
}

.site-subtitle {
  font-size: 20px;
  font-weight: 700;
  color: #2a5db0;
  margin-top: 4px;
  letter-spacing: 1.5px;
}

.header-nav-center ul {
  list-style: none;
  display: flex;
  gap: 0;
  margin: 0;
  padding: 0;
  border-left: 1px solid #1b4f9c;
}

.header-nav-center ul li {
  border-right: 1px solid #1b4f9c;
  padding-right: 10px;
}

.header-nav-center a {
  color: #1b4f9c;
  text-decoration: none;
  font-size: 16px;
  font-weight: 700;
  padding: 8px 12px;
  letter-spacing: 0.03em;
  display: block;
}

.header-nav-center a:hover {
  text-decoration: underline;
}

.header-contact-inline {
  text-align: right;
  margin-left: 20px;
}

.header-contact-inline .contact-lead {
  font-size: 16px;
  font-weight: 700;
  color: #2a5db0;
  margin-bottom: 2px;
  line-height: 1.2;
}

.header-contact-inline .contact-phone {
  font-size: 28px;
  font-weight: 900;
  color: #1b4f9c;
  margin-bottom: 2px;
  letter-spacing: 1px;
  line-height: 1.1;
}

.header-contact-inline .contact-time {
  font-size: 16px;
  color: #555;
  line-height: 1.2;
}

/* ▼ PC版：電話番号ブロックを一体化（スマホCSSの干渉を防ぐ） */
.header-contact-inline {
  text-align: right;
  line-height: 1.1 !important;
}

.header-contact-inline p {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.1 !important;
}

.header-contact-inline .contact-lead {
  font-size: 16px !important;
  font-weight: 700;
  color: #2a5db0;
  margin-bottom: 2px !important;
  line-height: 1.1 !important;
}

.header-contact-inline .contact-phone {
  font-size: 28px !important;
  font-weight: 900;
  color: #1b4f9c;
  margin-bottom: 2px !important;
  letter-spacing: 1px;
  line-height: 1.1 !important;
}

.header-contact-inline .contact-time {
  font-size: 16px !important;
  color: #555;
  line-height: 1.1 !important;
}

/* =========================================
   9. フッター
========================================= */

.site-footer {
  background: #ffffff;
  border-top: 1px solid #ddd;
  margin-top: 40px;
  padding: 20px 0;
}

.site-footer p {
  text-align: center;
  font-size: 14px;
  color: #555;
  margin: 0;
}


/* ▼ page top ボタン（柔らかい四角＋白い山型アイコン） */
.back-to-top {
  position: fixed;
  right: 20px;
  bottom: 20px;

  width: 60px;
  height: 60px;

  background: rgba(27, 79, 156, 0.85); /* ← 濃青の半透明（背景色を逆に） */
  backdrop-filter: blur(4px);
  border-radius: 14px;                 /* 柔らかい四角 */
  border: 1px solid rgba(255, 255, 255, 0.35);

  display: block;
  cursor: pointer;

  /* ▼ 白い山型アイコン（大きめ） */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="%23ffffff" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"/></svg>');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 38px;               /* ← アイコンを大きく */

  box-shadow: 0 4px 12px rgba(0,0,0,0.18);
  transition: 0.25s ease;
  z-index: 999;

  opacity: 0;
  pointer-events: none;
}

/* ▼ 表示状態 */
.back-to-top.show {
  opacity: 1;
  pointer-events: auto;
}

/* ▼ ホバー時 */
.back-to-top:hover {
  background: rgba(27, 79, 156, 0.95); /* 少し濃く */
  border-color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 6px 16px rgba(0,0,0,0.25);
}




/* =========================================
   10. 相続手続き案内ページ（ヘッダー色に統一・PC専用）
========================================= */

/* ▼ 相続ページ：流れの数字だけを強調（HTML変更なし） */
.souzoku-page .flow-list li {
  position: relative;
}

/* ▼ li の先頭にある「数字＋句点」だけを強調 */
.souzoku-page .flow-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
}

/* ▼ 実際の数字部分を強調する */
.souzoku-page .flow-list li {
  font-size: 18px; /* 全体の文字サイズはそのまま */
}

.souzoku-page .flow-list li span.num {
  font-size: 32px;      /* 数字だけ大きく */
  font-weight: 700;     /* 太く */
  color: #1b4f9c;       /* 濃青で統一 */
}



/* ▼ ページ全体の中央揃え */
.souzoku-page {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
}

/* ▼ ページタイトル（淡い青に合わせる） */
.souzoku-page .page-title {
  font-size: 30px;
  font-weight: 800;
  color: #1b4f9c;
  margin-bottom: 35px;
  padding-left: 16px;
  border-left: none;
  letter-spacing: 0.03em;
}

/* ▼ 重要ポイントボックス（淡青ベース） */
.souzoku-info-box {
  background: #f3f7ff;
  border: 1px solid #cfdcf5;
  padding: 26px;
  margin-bottom: 15px;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.9;
}


/* ▼ 説明文にくっつく注意ポイント（内部リンク案内） */
.inner-link {
  background: #fff4d9;              /* 淡いクリーム色：重要ボックスと区別 */
  padding: 16px 18px;
  margin: 10px 0 26px;              /* 上は詰める／下は少し広げる */
  border-radius: 6px;
  font-size: 15.5px;
  line-height: 1.85;
  color: #5a4a42;
  box-shadow: 0 2px 5px rgba(0,0,0,0.04);
}

/* ▼ inner-link 内の箇条書き */
.inner-link ul {
  margin: 0;
  padding-left: 1.4em;              /* 箇条書きの左位置を調整 */
}

.inner-link li {
  margin-bottom: 12px;              /* 箇条書き同士の余白 */
}

.inner-link li:last-child {
  margin-bottom: 0;                 /* 最後だけ余白なし */
}

/* ▼ ボタン風リンク（カッコ付きに見える） */
.link-btn a {
  display: inline-block;
  padding: 4px 10px;
  background: #e8f1fb;              /* 淡い青 */
  color: #1b4f9c;                   /* 濃青 */
  border: 1px solid #c7d8ea;        /* 薄い青の枠線 */
  border-radius: 4px;
  font-weight: 700;
  text-decoration: none;
  transition: 0.2s ease;
}

.link-btn a:hover {
  background: #d9e9f8;
  border-color: #b6cce0;
}




/* ▼ セクション見出し（淡青ライン） */
.flow-section h2,
.section-block h2 {
  font-size: 24px;
  font-weight: 700;
  color: #1b4f9c;
  margin: 40px 0 20px;
  padding-left: 0;
  border-left: none;
}

/* ▼ 流れのカード（白×淡青） */
.flow-list li {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 18px;
  margin-bottom: 10px;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.9;
}

/* ▼ 流れの補足（淡青の薄い帯） */
.flow-note {
  background: #eef4ff;
  border-left: 4px solid #a8c4f0;
  padding: 12px;
  margin-top: 14px;
  border-radius: 6px;
  font-size: 15px;
  color: #1b3f7a;
}

/* ▼ 詳細説明ボックス（白×淡青） */
.detail-box {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 20px;
  margin-bottom: 12px;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.8;
}

.detail-box h3 {
  font-size: 22px;
  color: #1b4f9c;
  margin-bottom: 12px;
}

/* ▼ 注意書き（淡いクリーム色） */
.detail-box .note {
  background: #fff8e6;
  border-left: 4px solid #e6c88f;
  padding: 12px;
  margin-top: 14px;
  border-radius: 6px;
  font-size: 15px;
  color: #5a4a42;
}

/* ▼ FAQ（個々のカード化をやめて、全体をひとまとめに） */
.section-block {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 22px 24px;
  margin: 20px 0;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.9;
}

.section-block h2 {
  font-size: 26px;
  font-weight: 700;
  color: #1b4f9c;
  margin-bottom: 25px;
  padding-left: 0;
  border-left: none;
}

.section-block .faq-item {
  background: transparent;
  border: none;
  padding: 0;
  margin-bottom: 22px;
  box-shadow: none;
}

.section-block .faq-item h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1b4f9c;
  margin-bottom: 6px;
}

.section-block .faq-item p {
  margin: 0 0 10px;
  color: #1b3f7a;
  line-height: 1.8;
}

.section-block .faq-item:last-child {
  margin-bottom: 0;
}

/* ▼ 電話ボタンを中央に配置 */
.contact-btn {
  text-align: center;
  margin: 30px 0;
}

/* 淡く上品な電話ボタン */
.btn-blue {
  display: inline-block;
  background: #e8f1fb;          /* 淡い青 */
  color: #1a4f7a;               /* 落ち着いた青文字 */
  padding: 14px 28px;
  border-radius: 6px;           /* 角丸で柔らかく */
  border: 1px solid #c7d8ea;    /* 細い淡い枠線 */
  font-size: 18px;
  text-decoration: none;
  transition: 0.25s ease;
}

/* ホバー時：上品に色が濃くなる */
.btn-blue:hover {
  background: #d9e9f8;
  border-color: #b6cce0;
}



/* =========================================
   11. 事務所案内ページ（サイズ感アップ・PC）
========================================= */

/* ▼ ページ全体の幅と中央揃え */
.access-page {
  width: 90%;
  max-width: 980px;   /* ← 少し広げる */
  margin: 0 auto;
}

/* ▼ ページタイトル（少し大きく） */
.access-page h2 {
  font-size: 32px;    /* ← 30 → 32 */
  font-weight: 900;
  color: #1b4f9c;
  text-align: center;
  margin: 15px 0 40px;
  letter-spacing: 0.03em;
}

/* ▼ 情報ブロック */
.office-info {
  margin-bottom: 35px;
}

/* ▼ 1行ごとの情報（ラベル＋値） */
.info-row {
  display: flex;
  padding: 12px 0;     /* ← 少し余白を増やす */
  border-bottom: 1px solid #e5e5e5;
  gap: 25px;
}

/* ▼ ラベル（左側） */
.info-label {
  width: 160px;        /* ← 140 → 160 で読みやすく */
  font-weight: 700;
  color: #1b4f9c;
  font-size: 16px;     /* ← 15 → 16 */
  flex-shrink: 0;
}

/* ▼ 値（右側） */
.info-value {
  font-size: 16px;     /* ← 15 → 16 */
  line-height: 1.8;    /* ← 少し広げる */
  color: #333;
}

/* ▼ セクション見出し */
.access-page h3 {
  font-size: 22px;     /* ← 20 → 22 */
  font-weight: 800;
  color: #1b4f9c;
  margin: 30px 0 14px;
}

/* ▼ 本文 */
.access-page p,
.access-page li {
  font-size: 16px;     /* ← 15 → 16 */
  line-height: 1.8;
  color: #333;
}

/* ▼ セクション全体 */
.access-page section {
  padding: 6px 0 20px;
  margin-bottom: 22px;
  border: none;
  background: transparent;
}

/* ▼ Googleマップ（大きく・見やすく） */
.map-wrap {
  text-align: center;
  margin: 15px 0 30px;
}

.map-wrap iframe {
  width: 100%;
  max-width: 750px;    /* ← 550 → 750 に拡大 */
  height: 420px;       /* ← 300 → 420 に拡大 */
  border: none;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}

/* ▼ 駐車場写真（少し大きく） */
.parking-photos {
  display: flex;
  gap: 16px;
  margin-top: 12px;
}

.parking-photos img {
  width: 46%;          /* ← 40% → 46% に拡大 */
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}

/* ▼ Googleマップ下の「Googleマップで開く」リンク */
.map-open-link {
  text-align: center;
  margin-top: 8px;
}

.map-open-link a {
  font-size: 15px;
  color: #1b4f9c;
  text-decoration: underline;
  transition: 0.2s;
}

.map-open-link a:hover {
  opacity: 0.7;
}


/* =========================================
   12. 司法書士紹介ページ（整形済み）
========================================= */

/* ▼ ページ全体の中央揃え */
.profile-page {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
}

/* ▼ ページタイトル */
.profile-page .page-title {
  font-size: 32px;
  font-weight: 900;
  color: #1b4f9c;
  margin-bottom: 30px;
  padding-left: 16px;
  border-left: 6px solid #a8c4f0;
  letter-spacing: 0.03em;
}

/* ▼ 経歴＋写真（左：文章／右：写真） */
.career-flex {
  display: flex !important;
  flex-direction: row !important;   /* ← 右に写真を固定 */
  gap: 40px;                        /* ← 余白を広めに */
  align-items: flex-start;
  margin-bottom: 40px;
}

/* ▼ 写真 */
.career-photo {
  width: 300px;                     /* ← 見やすい大きさ */
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.15);
  display: block;
}

.career-name {
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: #1b4f9c;
  margin-top: 10px;
}

/* ▼ 左側テキスト（経歴） */
.career-text h3 {
  font-size: 24px;
  font-weight: 800;
  color: #1b4f9c;
  margin-bottom: 12px;
}

.career-text p {
  font-size: 16px;
  line-height: 1.9;
  color: #333;
  margin-bottom: 18px;
}

.career-list {
  margin: 0 0 20px 18px;
  padding: 0;
}

.career-list li {
  margin-bottom: 6px;
  font-size: 16px;
  color: #1b3f7a;
  line-height: 1.7;
}

/* ▼ セクション見出し */
.profile-page h3 {
  font-size: 22px;
  font-weight: 800;
  color: #1b4f9c;
  margin: 35px 0 12px;
  padding-left: 12px;
  border-left: 4px solid #a8c4f0;
}

/* ▼ 各セクションの本文 */
.profile-page p {
  font-size: 16px;
  line-height: 1.9;
  color: #333;
  margin-bottom: 16px;
}

/* ▼ リスト（実績・専門分野など） */
.profile-page ul {
  margin: 0 0 20px 18px;
  padding: 0;
}

.profile-page ul li {
  margin-bottom: 6px;
  font-size: 16px;
  color: #1b3f7a;
  line-height: 1.7;
}

/* =========================================
   13. 遺言書作成ページ（公正証書・自筆証書）
========================================= */

/* ▼ 相続ページ：流れの数字だけを強調（HTML変更なし） */
.yuigon-page .flow-list li {
  position: relative;
}

/* ▼ li の先頭にある「数字＋句点」だけを強調 */
.yuigon-page .flow-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
}

/* ▼ 実際の数字部分を強調する */
.yuigon-page .flow-list li {
  font-size: 18px; /* 全体の文字サイズはそのまま */
}

.yuigon-page .flow-list li span.num {
  font-size: 32px;      /* 数字だけ大きく */
  font-weight: 700;     /* 太く */
  color: #1b4f9c;       /* 濃青で統一 */
}


/* ▼ ページ全体の中央揃え（相続ページと同じ） */
.yuigon-page {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
}

/* ▼ ページタイトル（相続ページと同じ濃青） */
.yuigon-page .page-title {
  font-size: 30px;
  font-weight: 800;
  color: #1b4f9c;
  margin-bottom: 35px;
  padding-left: 16px;
  border-left: none;
  letter-spacing: 0.03em;
}

/* ▼ セクション全体（相続ページと同じカードレイアウト） */
.yuigon-page .section-block {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 22px 24px;
  margin: 20px 0;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.9;
}

/* ▼ セクション見出し（相続ページと同じ） */
.yuigon-page .section-block h2 {
  font-size: 26px;
  font-weight: 700;
  color: #1b4f9c;
  margin-bottom: 25px;
  padding-left: 0;
  border-left: none;
}

/* ▼ detail-box（公正証書・自筆証書の説明） */
.yuigon-page .detail-box {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 20px;
  margin-bottom: 18px;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.8;
}

.yuigon-page .detail-box h3 {
  font-size: 22px;
  color: #1b4f9c;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* ▼ 流れ（flow-list）を相続ページと同じカードに */
.yuigon-page .flow-list li {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 18px;
  margin-bottom: 10px;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.9;
  position: relative;
  padding-left: 58px; /* 数字バッジのスペース */
}


/* ▼ flow-note（補足） */
.yuigon-page .flow-note {
  background: #eef4ff;
  border-left: 4px solid #a8c4f0;
  padding: 12px;
  margin-top: 14px;
  border-radius: 6px;
  font-size: 15px;
  color: #1b3f7a;
}

/* ▼ FAQ（相続ページと同じ） */
.yuigon-page .faq-item {
  background: transparent;
  border: none;
  padding: 0;
  margin-bottom: 22px;
  box-shadow: none;
}

.yuigon-page .faq-item h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1b4f9c;
  margin-bottom: 6px;
}

.yuigon-page .faq-item p {
  margin: 0 0 10px;
  color: #1b3f7a;
  line-height: 1.8;
}

/* ▼ FAQテーブル（相続ページと統一） */
.yuigon-page .faq-table {
  width: 100%;
  border-collapse: collapse;
  margin: 15px 0;
  font-size: 0.95rem;
}

.yuigon-page .faq-table th,
.yuigon-page .faq-table td {
  border: 1px solid #d5e3ff;
  padding: 10px 12px;
  line-height: 1.6;
}

.yuigon-page .faq-table th {
  background: #eef4ff;
  font-weight: bold;
  color: #1b4f9c;
}

/* ▼ アイコン色（相続ページと同じブラウン） */
.yuigon-page .icon svg {
  stroke: #7a6f5a;
}

/* =========================================
   14. 成年後見ページ（法定後見・任意後見）
========================================= */

/* ▼ flow-list：数字強調（遺言ページと同じ） */
.kouken-page .flow-list li {
  position: relative;
}

/* ▼ li の先頭にある「数字＋句点」だけを強調 */
.kouken-page .flow-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
}

/* ▼ 数字部分を強調 */
.kouken-page .flow-list li {
  font-size: 18px;
}

.kouken-page .flow-list li span.num {
  font-size: 32px;
  font-weight: 700;
  color: #1b4f9c;
}

/* ▼ ページ全体の中央揃え */
.kouken-page {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
}

/* ▼ ページタイトル */
.kouken-page .page-title {
  font-size: 30px;
  font-weight: 800;
  color: #1b4f9c;
  margin-bottom: 35px;
  padding-left: 16px;
  border-left: none;
  letter-spacing: 0.03em;
}

/* ▼ セクション全体（カードレイアウト） */
.kouken-page .section-block {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 22px 24px;
  margin: 20px 0;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.9;
}

/* ▼ セクション見出し */
.kouken-page .section-block h2 {
  font-size: 26px;
  font-weight: 700;
  color: #1b4f9c;
  margin-bottom: 25px;
  padding-left: 0;
  border-left: none;
}

/* ▼ detail-box（法定後見・任意後見の説明） */
.kouken-page .detail-box {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 20px;
  margin-bottom: 18px;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.8;
}

.kouken-page .detail-box h3 {
  font-size: 22px;
  color: #1b4f9c;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* ▼ flow-list（手続きの流れ） */
.kouken-page .flow-list li {
  background: #ffffff;
  border: 1px solid #d5e3ff;
  padding: 18px;
  margin-bottom: 10px;
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.05);
  color: #1b3f7a;
  line-height: 1.9;
  position: relative;
  padding-left: 58px;
}

/* ▼ flow-note（補足） */
.kouken-page .flow-note {
  background: #eef4ff;
  border-left: 4px solid #a8c4f0;
  padding: 12px;
  margin-top: 14px;
  border-radius: 6px;
  font-size: 15px;
  color: #1b3f7a;
}

/* ▼ FAQ */
.kouken-page .faq-item {
  background: transparent;
  border: none;
  padding: 0;
  margin-bottom: 22px;
  box-shadow: none;
}

.kouken-page .faq-item h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1b4f9c;
  margin-bottom: 6px;
}

.kouken-page .faq-item p {
  margin: 0 0 10px;
  color: #1b3f7a;
  line-height: 1.8;
}

/* ▼ FAQテーブル */
.kouken-page .faq-table {
  width: 100%;
  border-collapse: collapse;
  margin: 15px 0;
  font-size: 0.95rem;
}

.kouken-page .faq-table th,
.kouken-page .faq-table td {
  border: 1px solid #d5e3ff;
  padding: 10px 12px;
  line-height: 1.6;
}

.kouken-page .faq-table th {
  background: #eef4ff;
  font-weight: bold;
  color: #1b4f9c;
}

/* ▼ アイコン色（ブラウン） */
.kouken-page .icon svg {
  stroke: #7a6f5a;
}

/* ▼ PCではスマホ専用要素を非表示にする */
.sp-only {
  display: none;
}



/* ▼ お知らせ欄：右側（説明文＋リンク）を縦に積む */
.sidebar-news-list li {
  display: flex;
  align-items: flex-start;
}

.sidebar-news-list .date {
  width: 80px;
  flex-shrink: 0;
  white-space: nowrap;
}

/* ▼ 右側を「縦に積む1カラム」にする */
.sidebar-news-list .text,
.sidebar-news-list .links {
  display: block;   /* ← これが最重要！ */
}

/* ▼ リンクの左位置を説明文と完全に揃える */
.sidebar-news-list .links {
  margin-left: 0 !important;   /* ← ここがズレの原因だった */
  margin-top: 2px;
  white-space: nowrap;
}

/* ▼ 日付と文章の間にスペースを作る */
.sidebar-news-list .right {
  margin-left: 8px;   /* ← 好みで 4〜10px に調整可能 */
}


/* ▼ PC とスマホで改行を切り替える */
.pc-br { display: inline; }
.sp-br { display: none; }

@media screen and (max-width: 768px) {
  .pc-br { display: none; }
  .sp-br { display: inline; }
}


/* ▼ 相続手続きの流れリストを左から少し右に寄せる */
.souzoku-flow-simple {
  padding-left: 2em !important;  /* ← 1em = 文字1つ分の幅 */
}


/* =========================================
   15. 住所変更登記義務化
========================================= */

/* ▼ ページ全体の中央揃え（プロフィールページと同じ） */
.address-change-page {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
}

/* ▼ ページタイトル（中央揃えに変更） */
.address-change-page h2 {
  font-size: 32px;
  font-weight: 900;
  color: #1b4f9c;
  margin-bottom: 30px;
  text-align: center;
  letter-spacing: 0.03em;
  border-left: none;     /* 左線は不要 */
  padding-left: 0;
}

/* ▼ セクション全体（プロフィールの career-flex を流用） */
.address-change-page .career-flex {
  display: block;        /* 写真がないので block に */
  margin-bottom: 40px;
}

/* ▼ 左側テキスト（プロフィールのデザインを流用） */
.address-change-page .career-text h3 {
  font-size: 24px;
  font-weight: 800;
  color: #1b4f9c;
  margin-bottom: 12px;
}

.address-change-page .career-text p {
  font-size: 16px;
  line-height: 1.9;
  color: #333;
  margin-bottom: 18px;
}

/* ▼ 箇条書き（プロフィールページと同じ） */
.address-change-page .career-list {
  margin: 0 0 20px 18px;
  padding: 0;
}

.address-change-page .career-list li {
  margin-bottom: 6px;
  font-size: 16px;
  color: #1b3f7a;
  line-height: 1.7;
}

/* ▼ h3 のデザイン（プロフィールページと統一） */
.address-change-page h3 {
  font-size: 22px;
  font-weight: 800;
  color: #1b4f9c;
  margin: 35px 0 12px;
  padding-left: 12px;
  border-left: 4px solid #a8c4f0;
}

/* ▼ 本文（プロフィールページと同じ） */
.address-change-page p {
  font-size: 16px;
  line-height: 1.9;
  color: #333;
  margin-bottom: 16px;
}

/* ▼ リスト（プロフィールページと同じ） */
.address-change-page ul {
  margin: 0 0 20px 18px;
  padding: 0;
}

.address-change-page ul li {
  margin-bottom: 6px;
  font-size: 16px;
  color: #1b3f7a;
  line-height: 1.7;
}



/* =========================================
   16. スマホ用スタイル
========================================= */

/* ▼ スマホ最適化（768px以下） */
@media screen and (max-width: 768px) {


/* ▼ スマホ：本文の横幅を最小スマホ幅に固定（改行が安定） */
.feature-text p {
  max-width: 320px;
  margin: 0 auto;
}


  /* ▼ レイアウト（スマホは縦並び） */
   .content-wrap {
   display: block !important;
   width: 100% !important;
   margin: 0 !important;
   padding: 0 !important;
  }
  

  .left-column,
  .sidebar-fv,
  .sidebar {
    float: none !important;
    width: 100% !important;
  }

  /* ▼ ヘッダー（スマホ縮小） */
  .header-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 0 10px;
  }

  .logo-image { height: 40px !important; }

  .site-title a.office-name {
    font-size: 20px !important;
    line-height: 1.1;
  }

  .site-subtitle { font-size: 10px !important; }




/* ▼ ハンバーガー（おしゃれな丸＋中央揃えの白い三本線） */
.hamburger-menu {
  order: 2;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50%;
  background: #1b4f9c; /* 丸の色（落ち着いた濃紺） */
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: center; /* ← 中央揃えのポイント */
  gap: 5px;            /* 線の間隔 */
  cursor: pointer;
  flex-shrink: 0;
  z-index: 2000;

  /* ▼ おしゃれ感UP：影を入れる */
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
}

/* ▼ 三本線（白・中央揃え） */
.hamburger-menu span {
  display: block;
  height: 2px !important;
  background: #fff;
  border-radius: 2px;
  transition: 0.3s ease;
}

/* ▼ 上・中・下でだんだん短く（中央揃えでも自然に見える長さ） */
.hamburger-menu span:nth-child(1) { width: 20px; }
.hamburger-menu span:nth-child(2) { width: 14px; }
.hamburger-menu span:nth-child(3) { width: 10px; }
  
  
  
/* ▼ ハンバーガー → 完全に中央で交差する × */
.hamburger-menu.active span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
  width: 20px;
}

.hamburger-menu.active span:nth-child(2) {
  opacity: 0;
}

.hamburger-menu.active span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
  width: 20px;
}  




/* アニメーションを滑らかに */
.hamburger-menu span {
  transition: 0.3s ease;
}




  /* ▼ 電話番号縮小 */
  .header-contact-inline {
    order: 3;
    width: 100%;
    text-align: center;
    margin-top: 6px !important;
  }

  .header-contact-inline .contact-phone a {
    font-size: 18px !important;
    font-weight: bold;
  }

  .header-contact-inline .contact-lead,
  .header-contact-inline .contact-time {
    font-size: 11px !important;
  }

  /* ▼ PCナビ非表示（スマホはハンバーガー） */
  .header-nav-center { display: none; }

/* ▼ スマホだけ表示 */
.sp-only {
  display: block;
}

/* ▼ PCだけ表示 */
.pc-only {
  display: none;
}

/* ▼ スマホナビ（上からスライドして開く） */
.sp-nav {
  display: block;
  position: absolute;
  top: -100%;
  left: 0;
  width: 100%;
  background: #fff;
  padding: 20px;
  transition: top 0.4s ease;
  z-index: 999;
}

/* ▼ スマホナビの背景色を淡く */
.sp-nav {
  background: #f4f8ff; /* ← 淡い青に変更 */
}


/* ▼ 黒ポツを消す */
.sp-nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ▼ 横線をしっかり目立たせる */
.sp-nav ul li {
  border-bottom: 2px solid #b5c7e6; /* ← 少し濃い青系で上品に強調 */
  padding: 14px 0;                 /* ← 行間を広げて押しやすく */
}

.sp-nav ul li a {
  color: #1b4f9c;
  text-decoration: none;
  font-size: 17px;
  display: block;
}


/* ▼ 開いたときに上から降りてくる */
.sp-nav.open {
  top: 0;
}

  
/* ▼ トップページ代表挨拶をスマホで確実に非表示 */
.greeting-flex.pc-only {
  display: none !important;
}

  /* ▼ greeting.html のスマホ調整 */
  .greeting-flex {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px 15px;
  }

  .greeting-photo-wrap {
    order: -1;
    text-align: center;
    margin-bottom: 15px;
  }

  .greeting-photo {
    width: 100%;
    max-width: 180px;
    height: auto;
    display: block;
    margin: 0 auto;
  }

  .greeting-text h2 {
    font-size: 20px;
    margin-bottom: 10px;
    text-align: center;
  }

  .greeting-text p {
    font-size: 15px;
    line-height: 1.9;
    margin-bottom: 16px;
  }

  .greeting-text .btn {
    display: inline-block;
    margin-top: 10px;
    font-size: 15px;
    padding: 10px 18px;
  }

 /* ▼ スマホ下部固定の電話バー */
  .sp-call-fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    box-sizing: border-box;
    background: #e8f1fb;
    color: #1b4f9c;
    text-align: center;
    padding: 12px 10px;
    font-size: 18px;
    font-weight: bold;
    z-index: 3000;
  }

  .sp-call-fixed a {
    color: #1b4f9c;
    text-decoration: none;
  }
  
  
  /* ▼ スマホで不動産登記（4番目）と商業登記（5番目）を非表示 */
.service-nav li:nth-child(4),
.service-nav li:nth-child(5) {
  display: none !important;
}


/* ▼ スマホ業務ナビを1行1ボタンにする */
.service-nav {
  flex-direction: column !important;
}

.service-nav li {
  width: 100% !important;
}

/* ▼ スマホ業務ナビのアイコンを小さくする */
.service-nav .icon svg {
  width: 24px !important;
  height: 24px !important;
  margin-bottom: 4px;
}


/* ▼ スマホ：特徴欄（illustration-style）を読みやすく縮小 */
.illustration-style {
  padding: 22px 16px !important;
  margin-bottom: 30px !important;
  padding-left: 4px !important;   /* ← 16px → 4px に圧縮 */
  padding-right: 10px !important; /* ← 右は少し残すと読みやすい */
}

.illustration-style h2 {
  font-size: 20px !important;   /* ← PCの2.3rem → スマホ最適サイズ */
  margin-bottom: 18px !important;
}


/* ▼ スマホ：特徴欄の見出し（h3）を小さく */
.feature-text h3 {
  font-size: 16px !important;
  line-height: 1.4 !important;
  margin-bottom: 10px !important;
}

/* ▼ スマホ：特徴欄の説明文（p）を小さく */
.feature-text p {
  font-size: 14px !important;
  line-height: 1.7 !important;
}


/* ▼ スマホ：特徴欄の SVG アイコンを小さくする */
.feature-card svg {
  width: 50px !important;
  height: 50px !important;
}



/* ▼ スマホ：取扱業務カードをコンパクトに */
.service-card {
  padding:  10px 12px !important;
  margin-bottom: 6px !important;
}

/* ▼ スマホ：service-grid の隙間（gap）を詰める */
.service-grid {
  gap: 6px !important;        /* 全方向の隙間を6pxに */
  row-gap: 6px !important;    /* 念のため明示 */
  column-gap: 6px !important; /* 念のため明示 */
}

/* ▼ スマホ：取扱業務カードのアイコンを確実に小さくする */
.service-card .icon svg {
  width: 32px !important;
  height: 32px !important;
  margin-bottom: 8px !important;
}


/* ▼ タイトル（h3）を小さく */
.service-card h3 {
  font-size: 16px !important;
  line-height: 1.4 !important;
  margin-bottom: 6px !important;
}

/* ▼ 説明文（p）を小さく */
.service-card p {
  font-size: 13px !important;
  line-height: 1.6 !important;
  margin-bottom: 8px !important;
}

/* ▼ カードの影を弱めて軽く */
.service-card {
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
}

/* ▼ スマホ：アイコンとタイトルの隙間をなくす */
.service-card .icon {
  margin-bottom: 2px !important; /* ほぼゼロに */
}

.service-card h3 {
  margin-top: 0 !important;      /* ブラウザ標準の余白を消す */
}

/* ▼ スマホ：詳しく見るボタンの文字を縮小 */
.service-card .service-btn {
  font-size: 14px !important;   /* PCの16px → スマホ14px */
  padding: 8px 14px !important; /* ボタン自体も少しコンパクトに */
}

/* ▼ スマホ：取扱業務タイトルの下の余白を詰める */
.service-title {
  margin-bottom: 12px !important; /* PCはもっと広い → スマホは詰める */
}

/* ▼ スマホ：カード内のタイトル（h3）の上余白をゼロに */
.service-card h3 {
  margin-top: 0 !important; /* ブラウザ標準の余白を消す */
}


/* ▼ スマホ：相続手続のご案内ブロックをコンパクトに */
.souzoku-info {
  padding: 16px 14px !important;
  margin-bottom: 14px !important;
}

/* ▼ タイトル（h2）をスマホ向けに縮小 */
.souzoku-info h2 {
  font-size: 18px !important;
  line-height: 1.4 !important;
  margin-bottom: 10px !important;
}

/* ▼ 説明文（p）をスマホ向けに縮小 */
.souzoku-info p {
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-bottom: 10px !important;
}

/* ▼ リスト（ul）の文字も縮小 */
.souzoku-info ul.souzoku-flow-simple li {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 4px !important;
}

/* ▼ ボタンのサイズもスマホ向けに */
.souzoku-info .souzoku-btn {
  font-size: 14px !important;
  padding: 8px 14px !important;
}



/* ▼ スマホ：サイドバー全体をさらにコンパクトに */
.sidebar.sidebar-fv {
  padding: 8px 10px !important;   /* ← 12px → 8px に圧縮 */
  margin-bottom: 10px !important; /* ← 16px → 10px */
}

/* ▼ スマホ：代表写真をさらに縮小 */
.sidebar-fv .sidebar-photo {
  width: 100% !important;
  max-width: 160px !important;    /* ← 200px → 160px に縮小 */
  margin: 0 auto 6px !important;  /* ← 10px → 6px */
  display: block;
  border-radius: 6px;
}

/* ▼ サイドバーのタイトル（事務所名） */
.sidebar-fv .sidebar-office-name,
.sidebar-fv .sidebar-title {
  font-size: 15px !important;     /* ← 16px → 15px */
  line-height: 1.3 !important;
  margin-bottom: 4px !important;  /* ← 6px → 4px */
}

/* ▼ サイドバー内の住所などの文章 */
.sidebar-fv .sidebar-office-info {
  font-size: 13px !important;     /* ← 14px → 13px */
  line-height: 1.5 !important;
  margin-bottom: 6px !important;  /* ← 10px → 6px */
}

/* ▼ 新着情報のリスト */
.sidebar-fv .sidebar-news-list li {
  font-size: 12.5px !important;   /* ← 13px → 12.5px */
  line-height: 1.45 !important;   /* ← 1.5 → 1.45 */
  padding: 8px 0 !important;      /* ← 4px → 2px */
}



/* ▼ スマホ：紹介ページを縦並びに */
.career-flex {
  flex-direction: column !important;
  gap: 14px !important; /* 写真と本文の間に余白 */
}


/* ▼ スマホ：写真を経歴より上に移動＋中央寄せ */
.career-photo-wrap {
  order: -1 !important;
  text-align: center !important;
  width: 100% !important;
}

.career-photo {
  width: 100% !important;
  max-width: 220px !important; /* ← スマホに最適なサイズ */
  margin: 0 auto !important;
  display: block;
  border-radius: 6px;
}

/* ▼ スマホ：名前のテキストも調整 */
.career-name {
  font-size: 14px !important;
  margin-top: 6px !important;
  text-align: center !important;
}

/* ▼ スマホ：本文の左右余白を少し詰める */
.career-text {
  padding: 0 6px !important;
}

/* ▼ スマホ：紹介ページのセクション間を詰める */
.profile-page h3 {
  margin: 12px 0 10px !important;  /* ← 35px → 22px に縮小 */
}

/* ▼ セクション全体の下余白も詰める */
.profile-page section {
  margin-bottom: 16px !important;  /* ← デフォルトより詰める */
  padding-bottom: 0 !important;
}

/* ▼ スマホ：紹介ページのタイトル（h2） */
.profile-page h2 {
  font-size: 22px !important;
  margin-bottom: 14px !important;
}

/* ▼ スマホ：セクション見出し（h3） */
.profile-page h3 {
  font-size: 18px !important;
  margin: 16px 0 8px !important;
  padding-left: 10px !important;
  border-left-width: 3px !important;
}

/* ▼ スマホ：本文（p） */
.profile-page p {
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：リスト（経歴・実績・専門分野・資格など） */
.profile-page ul li {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 4px !important;
}

/* ▼ スマホ：経歴の小見出し（経歴の h3） */
.career-text h3 {
  font-size: 18px !important;
  margin-bottom: 8px !important;
}

/* ▼ スマホ：経歴の本文 */
.career-text p {
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：経歴リスト */
.career-list li {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 4px !important;
}





/* ▼ スマホ：相続ページのタイトル（h2） */
.souzoku-page .page-title {
  font-size: 22px !important;
  margin-bottom: 14px !important;
  padding-left: 10px !important;
}

/* ▼ スマホ：セクション見出し（h2 / h3） */
.souzoku-page h2,
.souzoku-page .section-block h2 {
  font-size: 18px !important;
  margin: 18px 0 8px !important;
  padding-left: 10px !important;
  border-left-width: 3px !important;
}

/* ▼ スマホ：相続ページの各手続タイトル（h3）を縮小 */
.souzoku-page h3 {
  font-size: 16px !important;
  line-height: 1.4 !important;
  margin: 14px 0 8px !important;
  padding-left: 10px !important;
  border-left-width: 3px !important;
}

/* ▼ スマホ：本文（p） */
.souzoku-page p {
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：リスト（flow-list・ul） */
.souzoku-page ul li,
.souzoku-page .flow-list li {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 6px !important;
  padding: 12px !important; /* カードの余白を圧縮 */
}

/* ▼ スマホ：数字バッジ（flow-list の数字） */
.souzoku-page .flow-list li span.num {
  font-size: 24px !important; /* PC 32px → スマホ最適 */
}

/* ▼ スマホ：flow-note（補足） */
.souzoku-page .flow-note {
  font-size: 13px !important;
  padding: 10px !important;
  margin-top: 10px !important;
}

/* ▼ スマホ：detail-box（説明カード） */
.souzoku-page .detail-box {
  padding: 14px !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：セクション間の余白を詰める */
.souzoku-page section,
.souzoku-page .section-block {
  margin-bottom: 16px !important;
  padding-bottom: 0 !important;
}

/* ▼ スマホ：電話相談ボタンの文字を縮小して1行に収める */
.contact-btn .btn-blue {
  font-size: 14px !important;   /* ← 必要に応じて 13px でもOK */
  white-space: nowrap !important; /* ← 強制的に1行にする */
  padding: 10px 12px !important;  /* ← ボタンの横幅も少し詰める */
}


/* ▼ スマホ：遺言ページのタイトル（h1） */
.yuigon-page .page-title {
  font-size: 22px !important;
  margin-bottom: 14px !important;
  padding-left: 10px !important;
}

/* ▼ スマホ：セクション見出し（h2 / h3） */
.yuigon-page h2,
.yuigon-page .section-block h2 {
  font-size: 18px !important;
  margin: 18px 0 8px !important;
  padding-left: 10px !important;
  border-left-width: 3px !important;
}


/* ▼ スマホ：遺言ページの各手続タイトル（h3）を縮小 */
.yuigon-page h3 {
  font-size: 16px !important;
  line-height: 1.4 !important;
  margin: 14px 0 8px !important;
  padding-left: 10px !important;
  border-left-width: 3px !important;
}


/* ▼ スマホ：本文（p） */
.yuigon-page p {
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：リスト（ul・flow-list） */
.yuigon-page ul li,
.yuigon-page .flow-list li {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 6px !important;
  padding: 12px !important;
}

/* ▼ スマホ：数字バッジ（flow-list の数字） */
.yuigon-page .flow-list li span.num {
  font-size: 24px !important;
}

/* ▼ スマホ：flow-note（補足） */
.yuigon-page .flow-note {
  font-size: 13px !important;
  padding: 10px !important;
  margin-top: 10px !important;
}

/* ▼ スマホ：detail-box（説明カード） */
.yuigon-page .detail-box {
  padding: 14px !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：セクション間の余白を詰める */
.yuigon-page section,
.yuigon-page .section-block {
  margin-bottom: 16px !important;
  padding-bottom: 0 !important;
}


/* ▼ スマホ：成年後見ページのタイトル（h1） */
.kouken-page .page-title {
  font-size: 22px !important;
  margin-bottom: 14px !important;
  padding-left: 10px !important;
}

/* ▼ スマホ：セクション見出し（h2 / h3） */
.kouken-page h2,
.kouken-page .section-block h2 {
  font-size: 18px !important;
  margin: 18px 0 8px !important;
  padding-left: 10px !important;
  border-left-width: 3px !important;
}


/* ▼ スマホ：成年後見ページの各手続タイトル（h3）を縮小 */
.kouken-page h3 {
  font-size: 16px !important;
  line-height: 1.4 !important;
  margin: 14px 0 8px !important;
  padding-left: 10px !important;
  border-left-width: 3px !important;
}


/* ▼ スマホ：本文（p） */
.kouken-page p {
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：リスト（ul・flow-list） */
.kouken-page ul li,
.kouken-page .flow-list li {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 6px !important;
  padding: 12px !important;
}

/* ▼ スマホ：数字バッジ（flow-list の数字） */
.kouken-page .flow-list li span.num {
  font-size: 24px !important;
}

/* ▼ スマホ：flow-note（補足） */
.kouken-page .flow-note {
  font-size: 13px !important;
  padding: 10px !important;
  margin-top: 10px !important;
}

/* ▼ スマホ：detail-box（説明カード） */
.kouken-page .detail-box {
  padding: 14px !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：セクション間の余白を詰める */
.kouken-page section,
.kouken-page .section-block {
  margin-bottom: 16px !important;
  padding-bottom: 0 !important;
}



/* ▼ スマホ：事務所案内ページのタイトル（h1） */
.access-page .page-title {
  font-size: 22px !important;
  margin-bottom: 14px !important;
  padding-left: 10px !important;
}

/* ▼ スマホ：セクション見出し（h2 / h3） */
.access-page h2,
.access-page h3 {
  font-size: 18px !important;
  margin: 18px 0 8px !important;
  padding-left: 10px !important;
  border-left-width: 3px !important;
}

/* ▼ スマホ：本文（p） */
.access-page p {
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-bottom: 12px !important;
}

/* ▼ スマホ：リスト（住所・駐車場など） */
.access-page ul li {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 6px !important;
}

/* ▼ スマホ：写真のサイズ調整 */
.access-page .office-photo {
  width: 100% !important;
  max-width: 320px !important;
  margin: 0 auto 12px !important;
  display: block;
  border-radius: 6px;
}

/* ▼ スマホ：Googleマップのサイズ調整 */
.access-page .map-wrap iframe {
  width: 100% !important;
  height: 260px !important;
  border-radius: 6px;
}

/* ▼ スマホ：セクション間の余白を詰める */
.access-page section {
  margin-bottom: 16px !important;
  padding-bottom: 0 !important;
}




/* ▼ スマホ：事務所案内の info-row をコンパクトに */
.access-page .info-row {
  display: flex !important;
  flex-direction: row !important;
  gap: 6px !important;
  margin-bottom: 10px !important;
  padding: 0 !important;
}

/* ▼ ラベル（左側）を小さく・細く */
.access-page .info-label {
  font-size: 13px !important;
  font-weight: bold !important;
  width: 80px !important;     /* ← ラベル幅を固定して揃える */
  flex-shrink: 0 !important;
  line-height: 1.4 !important;
}

/* ▼ 値（右側）を詰めて読みやすく */
.access-page .info-value {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ▼ スマホ：上に戻るボタンを電話バーの上に配置 */
.back-to-top {
  position: fixed;
  right: 16px;
  bottom: 80px !important; /* ← 電話バーより上にずらす */
  z-index: 4000 !important; /* ← 電話バーより前面に出す */
}


/* ▼ 横スクロール完全禁止（最重要） */
body {
  overflow-x: hidden !important;
}

html {
  overflow-x: hidden !important;
}

.content-wrap {
  overflow-x: hidden !important;
}


/* ▼ スマホ：固定電話バーに隠れないように下余白を確保 */
body {
  padding-bottom: 60px !important;
}


  .feature-text h3 {
    white-space: nowrap !important;
    font-size: 14px !important; /* ← 1行に収めるため少し縮小 */
  }


/* ▼ スマホ：特徴欄のアイコンと文章の横スペースを狭める */
.feature-card {
  gap: 6px !important;   /* ← 20px → 10px に圧縮 */
  padding-left: 4px !important;  /* ← 左の余白をギュッと詰める */
  align-items: center !important; /* ← アイコンと文字の縦位置も揃う */
}


/* ▼ スマホ：サービスカードの本文幅を固定して改行を安定 */

  .service-card p {
    max-width: 320px;
    margin: 0 auto;
  }


/* ▼ スマホ：相続手続案内の本文幅を固定して改行を安定 */

  .souzoku-info p {
    max-width: 320px;
    margin: 0 auto;
  }

  .nav-desc {
    display: block !important;
    font-size: 13px;
    line-height: 1.6;
    color: #555;
    margin-top: 6px;
    text-align: center;
  }


  /* ▼ 住所変更ページ：スマホ文字最適化 */
  .address-change-page .page-title {
    font-size: 1.4rem;
    line-height: 1.4;
    margin-bottom: 20px;
  }

  .address-change-page h3 {
    font-size: 1.2rem;
    margin-top: 24px;
    margin-bottom: 12px;
  }

  .address-change-page p {
    font-size: 0.95rem;
    line-height: 1.7;
    margin-bottom: 16px;
  }

  .address-change-page .career-list li {
    font-size: 0.95rem;
    line-height: 1.7;
    margin-bottom: 8px;
  }

  .address-change-page .career-flex {
    padding: 0 4px;
  }

  /* ▼ FAQ 全体の余白 */
  .faq-item {
    margin-bottom: 24px;
  }

  /* ▼ FAQ セクションの上余白を統一 */
  .address-change-page h3.faq-title {
    margin-top: 24px;
  }

  /* ▼ 質問（Q） */
  .faq-item h4 {
    font-size: 1rem; /* ← スマホ用に統一 */
    margin-bottom: 6px;
    color: #333;
    font-weight: 600;
  }

  /* ▼ 回答（A） */
  .faq-item p {
    font-size: 0.95rem; /* ← スマホ用に統一 */
    line-height: 1.7;
    margin: 0;
    color: #444;
  }

  /* ▼ 電話相談ボタン（スマホ用） */
  .contact-btn {
    text-align: center;
    margin: 40px 0 20px;
  }

  .contact-btn .btn-blue {
    display: inline-block;
    width: 100%;
    max-width: 320px;
    padding: 14px 0;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 6px;
    text-decoration: none;
  }



}