/* ========== 不動産相続ページ専用CSS ========== */
/* ページ全体の設定 */
.inheritance-page {
    position: relative;
}

.inheritance-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 計算式の特別スタイル */
.inheritance-content .fontsize20,
.inheritance-content .fontsize19 {
    display: block !important;
    text-align: center !important;
    margin: 20px auto !important;
    font-size: 20px !important;
    color: #07377f !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
    padding: 15px 20px !important;
    border-radius: 10px !important;
    border-left: 5px solid #00a5df !important;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1) !important;
    max-width: 600px !important;
    font-weight: 700 !important;
}

/* 強調テキスト */
.inheritance-content .content strong {
    color: #07377f !important;
    font-weight: 700 !important;
}

/* 見出しスタイルの統一 */
.inheritance-content .h3 h3,
.inheritance-content .h4 h4,
.inheritance-content .h5 h5 {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #07377f !important;
    text-align: center !important;
    margin: 60px 0 40px 0 !important;
    position: relative !important;
    padding-bottom: 15px !important;
}

.inheritance-content .h3 h3::after,
.inheritance-content .h4 h4::after,
.inheritance-content .h5 h5::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 60px !important;
    height: 3px !important;
    background: #00a5df !important;
}

/* サブ見出し（h4_2）のスタイル */
.inheritance-content .h4_2 h4 {
    font-size: 24px !important;
    color: #00a5df !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%) !important;
    padding: 15px 20px !important;
    border-radius: 10px !important;
    border: 2px solid #e9ecef !important;
    margin: 40px auto !important;
    max-width: 500px !important;
}

/* レイアウトボックスの調整 */
.inheritance-content .wrapbox3 {
    display: flex !important;
    align-items: flex-start !important;
    gap: 40px !important;
    margin: 40px 0 !important;
}

.inheritance-content .wrapbox3 .wrap7 {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.inheritance-content .wrapbox3 .wrap3 {
    flex: 0 0 300px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 画像のスタイル */
.inheritance-content .wrapbox3 img {
    width: 100% !important;
    max-width: 300px !important;
    height: auto !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1) !important;
    transition: transform 0.3s ease !important;
}

.inheritance-content .wrapbox3 img:hover {
    transform: translateY(-5px) !important;
}

/* バルーンの調整 */
.inheritance-content .balloon1-right,
.inheritance-content .balloon1-left {
    margin: 20px 0 !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .inheritance-content .wrapbox3 {
        flex-direction: column !important;
        gap: 30px !important;
    }
    
    .inheritance-content .wrapbox3 .wrap3 {
        flex: none !important;
        width: 100% !important;
    }
    
    .inheritance-content .h3 h3,
    .inheritance-content .h4 h4,
    .inheritance-content .h5 h5 {
        font-size: 24px !important;
    }
    
    .inheritance-content .h4_2 h4 {
        font-size: 20px !important;
        padding: 12px 15px !important;
    }
    
    .inheritance-content .fontsize20,
    .inheritance-content .fontsize19 {
        font-size: 18px !important;
        padding: 12px 15px !important;
    }
}

@media (max-width: 480px) {
    .inheritance-content {
        padding: 0 15px !important;
    }
    
    .inheritance-content .content p,
    .inheritance-content .wrapbox3 .wrap7 p {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }
}
/* テキストの統一配置（左寄せに変更） */
.inheritance-content .content p,
.inheritance-content .wrapbox3 .wrap7 p {
    text-align: left !important; /* center → left に変更 */
    margin-bottom: 25px !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
    color: #555 !important;
    max-width: 800px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ========== 売却メリットページ専用CSS ========== */
.merit-page {
    position: relative;
}

.merit-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 特殊ボックス（block2）のスタイル */
.merit-content .block2 {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-left: 5px solid #00a5df;
    padding: 40px 30px;
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    margin: 60px auto;
    max-width: 900px;
    text-align: center;
}

.merit-content .block2 .ttl {
    font-size: 28px;
    font-weight: 700;
    color: #07377f;
    margin-bottom: 20px;
}

.merit-content .block2 .txt {
    font-size: 16px;
    line-height: 1.8;
    color: #555;
}

/* MERIT番号のスタイル */
.merit-content .h4 h4 .fontsize24 {
    color: #00a5df !important;
    font-weight: 700 !important;
    margin-left: 10px !important;
}

/* ボックススタイル（box_line2） */
.merit-content .box_line2 {
    background: linear-gradient(135deg, #fff5f5 0%, #fef2f2 100%);
    border: 2px solid #fecaca;
    border-radius: 15px;
    padding: 30px;
    margin: 30px auto;
    max-width: 700px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.merit-content .box_line2 p {
    font-size: 16px;
    line-height: 1.8;
    color: #dc2626;
    font-weight: 600;
    margin: 0;
    text-align: left;
}

/* ボタンの統一スタイル */
.merit-content .button03 a {
    display: inline-block;
    background: linear-gradient(135deg, #00a5df 0%, #008abe 100%);
    color: white !important;
    padding: 15px 25px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(52, 152, 219, 0.3);
}

.merit-content .button03 a:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(52, 152, 219, 0.4);
    text-decoration: none;
    color: white !important;
}

/* レイアウト調整 */
.merit-content .wrapbox3,
.merit-content .wrapbox4 {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    margin: 40px 0;
}

.merit-content .wrapbox3 .wrap6,
.merit-content .wrapbox4 .wrap6 {
    flex: 1;
}

.merit-content .wrapbox3 .wrap4,
.merit-content .wrapbox4 .wrap4 {
    flex: 0 0 300px;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .merit-content .wrapbox3,
    .merit-content .wrapbox4,
    .merit-content .wrapbox {
        flex-direction: column;
        gap: 30px;
    }
    
    .merit-content .wrapbox3 .wrap4,
    .merit-content .wrapbox4 .wrap4 {
        flex: none;
        width: 100%;
    }
    
    .merit-content .block2 {
        padding: 30px 20px;
    }
    
    .merit-content .block2 .ttl {
        font-size: 24px;
    }
}

/* アンカーリンクのスクロール調整 - タイトルから表示 */
#chukai-flow {
    scroll-margin-top: 110px !important;
    padding-top: 20px !important;
}

/* h3タイトルが確実に見えるように */
#chukai-flow h3 {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 確実に反映させるための強力なCSS - 普通の色バージョン */
.content8 .box_line2 ul.recommend-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.content8 .box_line2 ul.recommend-list li {
    position: relative !important;
    padding: 15px 0 15px 30px !important;
    margin-bottom: 10px !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
    color: #333 !important;
    font-weight: 500 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    display: block !important;
}

.content8 .box_line2 ul.recommend-list li:last-child {
    border-bottom: none !important;
    margin-bottom: 0 !important;
}

.content8 .box_line2 ul.recommend-list li::before {
    content: '✓' !important;
    position: absolute !important;
    left: 0 !important;
    top: 15px !important;
    color: #00a5df !important;
    font-weight: bold !important;
    font-size: 18px !important;
    background: #fff !important;
    border-radius: 50% !important;
    width: 20px !important;
    height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid #00a5df !important;
}

/* カード自体も普通の色に */
.content8 .box_line2 {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
    border: 2px solid #dee2e6 !important;
    border-radius: 15px !important;
    padding: 25px 30px !important;
    margin: 30px auto !important;
    max-width: 700px !important;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1) !important;
    text-align: left !important;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .content8 .box_line2 {
        padding: 20px !important;
        margin: 20px auto !important;
    }
    
    .content8 .box_line2 ul.recommend-list li {
        font-size: 14px !important;
        padding: 12px 0 12px 25px !important;
    }
    
    .content8 .box_line2 ul.recommend-list li::before {
        font-size: 16px !important;
        top: 12px !important;
        width: 18px !important;
        height: 18px !important;
    }
}

/* ========== 会社案内ページ - 地図レスポンシブ対応 ========== */
.location-container {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 30px !important;
  align-items: flex-start !important;
  margin: 20px 0 !important;
}

.location-info {
  flex: 1 !important;
  min-width: 300px !important;
}

.location-map {
  flex: 1 !important;
  min-width: 300px !important;
  max-width: 100% !important;
}

.ggmap {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
}

.ggmap iframe {
  width: 100% !important;
  height: 300px !important;
  border: 0 !important;
  border-radius: 8px !important;
  display: block !important;
}

/* タブレット対応 */
@media (max-width: 768px) {
  .location-container {
    flex-direction: column !important;
    gap: 20px !important;
  }
  
  .location-info,
  .location-map {
    flex: none !important;
    width: 100% !important;
    min-width: auto !important;
  }
  
  .ggmap iframe {
    height: 250px !important;
  }
}

/* スマホ対応 */
@media (max-width: 480px) {
  .location-container {
    margin: 15px 0 !important;
    gap: 15px !important;
  }
  
  .ggmap {
    margin: 0 auto !important;
    max-width: calc(100vw - 40px) !important;
  }
  
  .ggmap iframe {
    height: 200px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  
  .atena-page-content {
    padding: 0 15px !important;
    overflow-x: hidden !important;
  }
}

/* 地図コンテナの幅制御 */
@media (max-width: 600px) {
  .location-map {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }
  
  .location-map .ggmap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* ========== 会社案内ページ - グループ会社カード（本文のインラインstyleから移設） ========== */
.page-company-group-card {
  text-align: center;
  padding: 30px 20px;
  background: #f8f9fa;
  border-radius: 8px;
  margin: 20px 0;
}

.page-company-group-card h5 {
  color: #07377f;
  margin-bottom: 15px;
}

.page-company-group-card p:not(:last-child) {
  color: #666;
  line-height: 1.6;
  margin-bottom: 20px;
}

.page-company-group-card p:last-child {
  margin: 0;
}

.page-company-group-card a {
  color: #00a5df;
  text-decoration: none;
  font-weight: 600;
  font-size: 16px;
  border-bottom: 2px solid #00a5df;
  padding-bottom: 2px;
  transition: all 0.3s;
}

.floating-sales-btn {
  position: fixed;
  bottom: 25px;
  right: 25px;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: linear-gradient(135deg, #00a5df, #07377f);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #fff;
  z-index: 9999; /* ← これで他の要素より前面に */
}

/* =========================
   モバイルで見出しがヘッダーに隠れる問題の修正
   末尾に追記してください
========================= */

/* ヘッダー高さの変数（必要に応じて微調整） */
:root {
  --atena-header-h: 72px;   /* タブレット〜小型端末の想定ヘッダー高さ */
}
@media (max-width: 480px) {
  :root {
    --atena-header-h: 64px; /* さらに小さい端末用 */
  }
}

/* ヒーロー全体をヘッダー分だけ下げる */
@media (max-width: 900px) {
  .page-visual-ttl {
    margin-top: var(--atena-header-h) !important;
  }
}

/* テキストが下に落ち過ぎるケースを防ぐ：下基準→上基準へ */
@media (max-width: 768px) {
  .page-visual {
    position: absolute !important;
    top: 40px !important;     /* 画面内で十分見える位置に */
    bottom: auto !important;  /* 既存の bottom を無効化 */
    left: 30px !important;
    right: 30px !important;
    max-width: calc(100% - 60px) !important;
  }
}

/* WP管理バー表示時（ログイン中）もずれないように */
@media (max-width: 900px) {
  body.admin-bar .atena-custom-header {
    top: 32px !important; /* WP管理バー高さ */
  }
  body.admin-bar .page-visual-ttl {
    margin-top: calc(var(--atena-header-h) + 32px) !important;
  }
}

.breadcrumb {
  padding: 12px 24px;
  max-width: 1200px;
  margin: 0 auto;
  font-size: 12.5px;
  color: #6f7782;
}

.breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding: 0;
  margin: 0;
  list-style: none;
}

.breadcrumb li {
  display: inline-flex;
  align-items: center;
}

.breadcrumb li:not(:last-child)::after {
  content: '›';
  margin: 0 8px;
  color: #9aa2ad;
}

.breadcrumb a {
  color: inherit;
  text-decoration: none;
}

.breadcrumb a:hover {
  color: #2f5aae;
  text-decoration: underline;
}
