@charset "utf-8";

/* ==========================================
   追加：トップ画像上の運営元テキスト（横いっぱい白背景・ノーマルフォント）
   ========================================== */
.top-company-text {
  color: #000000 !important;
  font-family: sans-serif !important;
  
  /* 太字ではなくノーマル（標準の太さ）に設定 */
  font-weight: normal !important; 
  
  text-align: left !important;
  margin: 0 !important;
  display: block !important;
  
  /* 緑丸のフォントサイズ（19px）に指定 */
  font-size: 17px !important; 
  
  /* 上のあきと、画像との間の余白調整 */
  padding-top: 25px !important;   /* テキストの上のあき */
  padding-bottom: 10px !important; /* テキストと画像の間 */
  
  /* スマホ表示で画面の左右端に張り付かないためのクッション余白 */
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* PC表示の際のレイアウト微調整 */
@media (min-width: 768px) {
  .top-company-text {
    padding-top: 25px !important;   /* PC時はさらに上を広くあける */
    padding-bottom: 10px !important; /* PC時のテキストと画像の間 */
    padding-left: 0 !important;     /* PC時は画像の左端と綺麗に直線を揃える */
  }
}

/* ==========================================
   1. 共通・パーツ共通スタイル
   ========================================== */

/* bodyに「overflow-x: hidden;」を追加して、想定外の横はみ出しを強制カットします */
html, body {
  overflow-x: hidden;
}
body {
  /* ★既存の余白に、フォーム用の基本フォント・文字色・背景色を合体させました */
  font-family: "Montserrat", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  color: #333;
  background-color: #fff;
  padding-bottom: 0px; /* 下部固定バナー廃止に伴い完全にフラット化 */
}
@media (min-width: 768px) {
  body {
    padding-bottom: 0px; 
  }
}

/* スマ用改行コントロール */
.br-sp {
  display: none;
}
@media screen and (max-width: 1080px) {
  .br-pc {
    display: none;
  }
  .br-sp {
    display: inline-block;
  }
}

/* 背景色設定 */
.top_bg2 {
  background: #fff7ee;
}

/* 追加背景色 */
.bg-white { background-color: #ffffff; }
.bg-beige { background-color: #f7efdc; }
.bg-blue2 { background-color: #ecf3fd; }

/* 共通調整 */
img {
  display: block;
  width: 100%;
  height: auto;
}
.lp-container {
  max-width: 1000px;
  margin: 0 auto;
  overflow: hidden; /* ★これを追加！中のrowのマージンによるはみ出しを一括カットします */
}

/* 文字の下にアンダーライン */
.solid {
  border-bottom: solid 2px #8C6239;
}


/* ==========================================
   2. コンテンツボックス・カード装飾
   ========================================== */

/* 紫枠の丸角ボックス */
.rounded-box {
  display: block;
  border: 4px solid #93278f;
  border-radius: 10px;
  background-color: #f3ebff;
  padding: 20px;
  margin-left: 5px;
  margin-right: 5px;
  box-sizing: border-box;
}

/* 4つの裏付け・居住支援セクションのカード */
.card-container {
  max-width: 100%;
  border: 2px solid #942d91;
  border-radius: 12px;
  overflow: hidden;
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  background-color: #fff;
}
.card-container .card-header {
  background-color: #942d91;
  color: #ffffff;
  padding: 12px 20px;
  letter-spacing: 0.05em;
}
.card-container .card-body {
  padding: 25px 20px;
  color: #333;
}

/* 「不安」リストのチェックマーク装飾 */
.check-icon-text {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: sans-serif;
  font-weight: bold;
  color: #333;
}
.check-mark {
  position: relative;
  display: inline-block;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}
.check-mark::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 25px;
  height: 25px;
  border: 4px solid #e52520;
  box-sizing: border-box;
}
.check-mark::after {
  content: "";
  position: absolute;
  top: -9px;
  left: 8px;
  width: 15px;
  height: 25px;
  border-right: 5px solid #e52520;
  border-bottom: 4px solid #e52520;
  transform: rotate(45deg);
}


/* ==========================================
   3. QAアコーディオン
   ========================================== */
.qa-wrapper {
  padding: 12px 10px;
}
.qa-item {
  background-color: #ffffff;
  border: 2px solid #7cb1eb;
  border-radius: 8px;
  overflow: hidden;
}
.qa-question {
  color: #1f6aba;
  padding: 20px 24px;
  font-size: 19px; 
  font-weight: bold;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  user-select: none;
  text-decoration: none;
  line-height: 1.4;
  transition: background-color 0.2s;
}
.qa-question:hover {
  background-color: #f4f8fc;
  color: #1f6aba;
}
.qa-question::after {
  content: '＋';
  font-size: 23px; 
  color: #1f6aba;
  font-weight: bold;
  margin-left: 15px;
}
.qa-question:not(.collapsed)::after {
  content: '－';
}
.qa-answer {
  background-color: #ffffff;
  border-top: 2px dashed #7cb1eb;
  padding: 24px;
  font-size: 17px; 
  line-height: 1.7;
  color: #333333;
}
.qa-wrapper .qa-answer-box {
  display: flex;
  align-items: flex-start;
}
.qa-answer .prefix-a {
  color: #d9333f;
  font-weight: bold;
  font-size: 27px; 
  margin-right: 16px;
  line-height: 1.2;
}
.qa-answer-content {
  flex: 1;
  word-break: break-all;
}

@media (max-width: 767.98px) {
  .qa-question {
    font-size: 10px !important;  
    padding: 16px 15px !important; 
  }
  .qa-question::after {
    font-size: 14px !important; 
  }
  .qa-answer {
    font-size: 9px !important;  
    padding: 16px !important;
  }
  .qa-answer .prefix-a {
    font-size: 16px !important;  
    margin-right: 10px !important;
  }
}

/* ==========================================
   4. 実績・指定一覧カード（自治体一覧）
   ========================================== */
.custom-grid-container {
  padding: 20px 0;
  margin-bottom: 90px !important;
}
.status-card {
  background-color: #ffffff;
  border: 1px solid #606060;
  display: flex;
  flex-direction: column;
  text-align: center;
  overflow: hidden;
  height: 100%;
}
.status-header {
  color: #ffffff;
  font-size: 20px; 
  font-weight: bold;
  height: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 1px;
}
.status-body {
  padding: 15px 10px;
  color: #333333;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  line-height: 1.4;
  background-color: #ffffff;
}
.status-body .main-text {
  font-size: 14px; 
  font-weight: bold;
  display: block;
}
.status-body .sub-text {
  font-size: 9px; 
  font-weight: normal;
  margin: 4px 0;
  display: block;
  color: #444444;
}
.status-full-card {
  color: #ffffff;
  font-size: 12px; 
  font-weight: bold;
  text-align: center;
  padding: 12px 10px;
  border: 1px solid #606060;
  line-height: 1.4;
}

/* 各種イメージカラー */
.bg-green { background-color: #00a651; }
.bg-blue { background-color: #0054a6; }
.bg-purple { background-color: #910782; }
.bg-light-blue { background-color: #0069d9; }
.bg-navy { background-color: #0b2f83; }
.bg-cyan { background-color: #00b7ce; }
.bg-gray-blue { background-color: #5887b2; }

@media (max-width: 767.98px) {
  .custom-grid-container {
    margin-bottom: 55px !important;
  }
  .status-header {
    font-size: 14px !important; 
    height: 85px;
  }
  .status-body {
    padding: 8px 6px;
  }
  .status-body .main-text {
    font-size: 8px !important; 
  }
  .status-body .sub-text {
    font-size: 5px !important; 
  }
  .status-full-card {
    font-size: 7px !important; 
    padding: 8px 4px;
  }
}


/* ==========================================
   5. 3連サービスカード（元の大きさを維持）
   ========================================== */
.service-card {
  background-color: #ffffff;
  border: 2px solid #cccccc;
  padding: 35px 20px;
  text-align: center;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}
.service-icon {
  width: 125px;
  height: auto;
  margin-bottom: 25px;
}
.service-title {
  font-size: 25px; 
  font-weight: bold;
  line-height: 1.3;
  margin-bottom: 20px;
}
.color-blue { color: #3c76a6; }
.color-green { color: #598245; }
.color-orange { color: #e68b35; }

.service-text {
  font-size: 18px; 
  font-weight: bold;
  color: #444444;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 767.98px) {
  .service-card {
    padding: 25px 15px;
  }
  .service-icon {
    width: 110px;
    margin-bottom: 15px;
  }
  .service-title {
    font-size: 25px !important; 
    margin-bottom: 15px;
  }
  .service-text {
    font-size: 19px !important; 
  }
}


/* ==========================================
   6. 4連特徴カード（配色・余白最適化 ＆ アイコンサイズ完全復帰版）
   ========================================== */
.feature-section-title {
  font-size: 30px !important; 
  font-weight: bold !important; 
  color: #534741 !important;
  text-align: center !important;
  margin-top: 10px !important;  
  margin-bottom: 20px !important; 
  letter-spacing: 0.05em !important;
  padding: 0 15px !important;
  display: block !important;
}

.feature-card {
  background-color: #ffffff;
  border: 2px solid #4484b4 !important; 
  padding: 35px 6px; 
  text-align: center;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}
.feature-title {
  font-size: 23px; 
  font-weight: bold;
  line-height: 1.3;
  margin-bottom: 25px;
  color: #4484b4 !important; 
}
.feature-icon {
  width: 115px !important;
  height: auto !important;
  margin-bottom: 25px !important;
  display: inline-block !important;
}
.feature-text {
  font-size: 17px; 
  font-weight: bold;
  color: #444444;
  line-height: 1.6;
  margin: 0;
}
.feature-card-row {
  margin-bottom: 90px !important; 
}

@media (max-width: 767.98px) {
  .feature-section-title {
    font-size: 26px !important; 
    margin-top: 5px !important;
    margin-bottom: 15px !important; 
  }
  .feature-card {
    padding: 25px 10px;
  }
  .feature-title {
    font-size: 23px !important; 
    margin-bottom: 15px;
  }
  .feature-icon {
    width: 95px !important;
    margin-bottom: 15px !important;
  }
  .feature-text {
    font-size: 15px !important; 
  }
  .feature-card-row {
    margin-bottom: 55px !important; 
  }
}


/* ==========================================
   7. 各セクション共通タイトル見出し（各タイトル2pxアップ設定）
   ========================================== */
.section-title-block {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin-top: 90px !important;
  margin-bottom: 40px !important;
  padding: 10px 0 !important;
}

.section-title-block .section-sub-top-title {
  font-size: 19px !important; 
  font-weight: bold !important;
  color: #534741 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  margin-top: 0 !important;
  margin-bottom: 12px !important;
  letter-spacing: 0.03em !important;
  display: block !important;
}

.section-title-block .section-common-title {
  font-size: 38px !important; 
  font-weight: bold !important;
  color: #534741 !important;
  line-height: 1.4 !important;
  text-align: center !important;
  margin-top: 0 !important;
  margin-bottom: 25px !important;
  letter-spacing: 0.03em !important;
  overflow-wrap: break-word !important;
  word-break: normal !important; 
  display: block !important;
}

.section-title-block .title-dots {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 15px !important;
  margin-top: 0 !important;
}
.section-title-block .title-dots span {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  display: inline-block !important;
}
.section-title-block .title-dots .dot-blue   { background-color: #3c76a6 !important; }
.section-title-block .title-dots .dot-green  { background-color: #598245 !important; }
.section-title-block .title-dots .dot-orange { background-color: #e68b35 !important; }

.col-12.text-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

@media (max-width: 767.98px) {
  .section-title-block {
    margin-top: 55px !important;
    margin-bottom: 25px !important;
  }
  .section-title-block .section-sub-top-title {
    font-size: 12px !important; 
    margin-bottom: 6px !important;
  }
  .section-title-block .section-common-title {
    font-size: 24px !important; 
  }
  .section-title-block .title-dots {
    gap: 10px !important;
  }
  .section-title-block .title-dots span {
    width: 14px !important;
    height: 14px !important;
  }
}


/* ==========================================
   9. 実績上の紹介文テキスト（ベースフォント）
   ========================================== */
.intro-section-text {
  font-size: 26px !important; 
  font-weight: bold !important;
  color: #534741 !important;
  line-height: 1.6 !important;
  text-align: center !important;
  margin-top: 60px !important;
  margin-bottom: 40px !important;
  letter-spacing: 0.05em !important;
  padding: 0 15px !important;
  display: block !important;
}

@media (max-width: 767.98px) {
  .intro-section-text {
    font-size: 19px !important; 
    margin-top: 40px !important;
    margin-bottom: 25px !important;
  }
}


/* ==========================================
   10. 部分強調付きの紹介文テキスト（pc_03・緑文字さらに拡大版）
   ========================================== */
.highlight-intro-text {
  font-size: 26px !important; 
  font-weight: bold !important;
  color: #534741 !important;
  line-height: 1.7 !important;
  text-align: center !important;
  margin-top: 60px !important;
  margin-bottom: 40px !important;
  letter-spacing: 0.05em !important;
  padding: 0 15px !important;
  display: block !important;
}

.highlight-intro-text .text-green-large {
  color: #598245 !important;
  font-size: 38px !important; 
  font-weight: 900 !important;
  display: inline-block !important;
}

@media (max-width: 767.98px) {
  .highlight-intro-text {
    font-size: 18px !important; 
    margin-top: 40px !important;
    margin-bottom: 25px !important;
  }
  .highlight-intro-text .text-green-large {
    font-size: 26px !important; 
  }
}


/* ==========================================
   11. 3色カラー構成の紹介文テキスト（上余白を詰め＆文字拡大＆下余白拡大）
   ========================================== */
.triple-color-text {
  font-size: 24px !important; 
  font-weight: bold !important;
  color: #534741 !important;
  line-height: 1.7 !important;
  text-align: center !important;
  margin-top: 10px !important;  
  margin-bottom: 60px !important; 
  letter-spacing: 0.05em !important;
  padding: 0 15px !important;
  display: block !important;
}

@media (max-width: 767.98px) {
  .triple-color-text {
    font-size: 18px !important;   /* 20pxから18pxに2ポイント下げました */
    margin-top: 5px !important;   
    margin-bottom: 40px !important; 
  }
}

/* ==========================================
   12. 青色指定の紹介文テキスト（あべこべ完全解消版）
   ========================================== */

@media (max-width: 1024px) {
  .blue-title-text {
    font-size: 26px !important; 
    margin-top: 50px !important;
    margin-bottom: 20px !important;
    font-weight: bold !important;
    color: #4484b4 !important;
    line-height: 1.7 !important;
    text-align: center !important;
    letter-spacing: 0.05em !important;
    padding: 0 15px !important;
    display: block !important;
  }
}

@media (min-width: 1025px) {
  .blue-title-text {
    font-size: 29px !important; 
    margin-top: 45px !important;
    margin-bottom: 10px !important;
    font-weight: bold !important;
    color: #4484b4 !important;
    line-height: 1.7 !important;
    text-align: center !important;
    letter-spacing: 0.05em !important;
    padding: 0 15px !important;
    display: block !important;
  }
}


/* ==========================================
   12-2. 青色指定の紹介文テキスト（あべこべ完全解消版）会社部分
   ========================================== */

@media (max-width: 1024px) {
  .blue-title-text2 {
    font-size: 26px !important; 
    margin-top: 15px !important; 
    margin-bottom: 20px !important;
    font-weight: bold !important;
    color: #4484b4 !important;
    line-height: 1.7 !important;
    text-align: center !important;
    letter-spacing: 0.05em !important;
    padding: 0 15px !important;
    display: block !important;
  }
}

@media (min-width: 1025px) {
  .blue-title-text2 {
    font-size: 29px !important; 
    margin-top: 15px !important;
    margin-bottom: 10px !important;
    font-weight: bold !important;
    color: #4484b4 !important;
    line-height: 1.7 !important;
    text-align: center !important;
    letter-spacing: 0.05em !important;
    padding: 0 15px !important;
    display: block !important;
  }
}


/* ==========================================
   13. 強制スタイル上書き（lp-container内の色バグを完全解消）
   ========================================== */

.force-color-blue {
  color: #1a62b1 !important;
}
.force-color-pink {
  color: #d11c62 !important;
}
.force-color-green {
  color: #5e8749 !important;
}


/* ==========================================
   14. 住まい・生活・将来セクション専用の完全出し分けスイッチ
   ========================================== */

@media (max-width: 767.98px) {
  .only-for-pc-block {
    display: none !important;
  }
  .only-for-sp-block {
    display: block !important;
    width: 100% !important; 
  }
}

@media (min-width: 768px) {
  .only-for-pc-block {
    display: block !important;
  }
  .only-for-sp-block {
    display: none !important;
  }
}


/* ==========================================
   15. 完全分離型カスタムヘッダー（ボタン画像＆スマホ中央寄せ決定版）
   ========================================== */

.custom-header-section {
  width: 100%;
  background-color: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  padding: 10px 20px;
}
.header-logo-img {
  max-height: 65px;
  width: auto !important;
  display: inline-block !important;
}
.header-right-box-pc {
  display: flex;
  align-items: center;
  gap: 20px;
}
.header-tel-img {
  max-height: 55px;
  width: auto !important;
}
.header-form-btn-img {
  max-height: 55px;
  width: auto !important;
  transition: transform 0.2s, opacity 0.2s;
}
.header-form-btn-img:hover {
  opacity: 0.9;
  transform: scale(1.02);
}

@media (max-width: 767.98px) {
  .header-pc-layout {
    display: none !important;
  }
  .header-sp-layout {
    display: block !important;
    text-align: center !important;
    width: 100%;
    padding: 5px 0;
  }
  .header-logo-img {
    max-height: 50px;
    margin: 0 auto !important;
    display: inline-block !important;
  }
}

@media (min-width: 768px) {
  .header-pc-layout {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    max-width: 1000px;
    margin: 0 auto;
  }
  .header-sp-layout {
    display: none !important;
  }
}


/* ==========================================
   16. Pマーク・個人情報保護セクション（文字標準＆罫線最細版・旧指定）
   ========================================== */

.pmark-box-pc {
  max-width: 1000px !important;
  margin: 50px auto !important;
  border: 1px solid #3c76a6 !important;
  padding: 40px !important;
  display: flex !important;
  align-items: center !important;
  gap: 45px !important;
  background-color: #ffffff !important;
  box-sizing: border-box !important;
}
.pmark-logo-zone-pc {
  flex-shrink: 0 !important;
}
.pmark-img-pc {
  width: 135px !important;
  height: auto !important;
  display: block !important;
}
.pmark-content-zone-pc {
  text-align: left !important;
  font-family: sans-serif !important;
}
.pmark-title-pc {
  font-size: 24px !important; 
  color: #1a62b1 !important;
  font-weight: 900 !important;
  margin-top: 0 !important;
  margin-bottom: 18px !important;
  letter-spacing: 0.02em !important;
}
.pmark-text-pc {
  font-size: 11px !important; 
  color: #534741 !important;
  line-height: 1.7 !important;
  font-weight: normal !important;
  margin: 0 !important;
  letter-spacing: 0.02em !important;
}

.pmark-box-sp {
  margin: 40px 15px !important;
  border: 1px solid #3c76a6 !important;
  padding: 35px 20px !important;
  background-color: #ffffff !important;
  box-sizing: border-box !important;
  font-family: sans-serif !important;
}
.pmark-logo-zone-sp {
  margin-bottom: 25px !important;
  text-align: center !important;
}
.pmark-img-sp {
  width: 115px !important;
  height: auto !important;
  margin: 0 auto !important;
  display: block !important;
  text-align: center;
}
.pmark-title-sp {
  font-size: 18px !important; 
  color: #1a62b1 !important;
  font-weight: 900 !important;
  text-align: center !important;
  margin-top: 0 !important;
  margin-bottom: 22px !important;
  line-height: 1.4 !important;
  letter-spacing: 0.02em !important;
}
.pmark-text-sp {
  font-size: 10px !important; 
  color: #534741 !important;
  line-height: 1.7 !important;
  font-weight: normal !important;
  margin: 0 !important;
  text-align: left !important;
  letter-spacing: 0.02em !important;
}


/* ==========================================
   17. サポート事例詳細ボタン（完全テキストボタン化版）
   ========================================== */

.btn-support-case-pc {
  display: inline-block !important;
  background-color: #3c76a6 !important;
  color: #ffffff !important;
  font-size: 18px !important; 
  font-weight: bold !important;
  text-decoration: none !important;
  padding: 16px 80px !important;
  margin-top: 30px !important;
  margin-bottom: 50px !important;
  letter-spacing: 0.05em !important;
  transition: opacity 0.2s !important;
}
.btn-support-case-pc:hover {
  opacity: 0.85 !important;
  color: #ffffff !important;
}

.btn-support-case-sp {
  display: block !important;
  background-color: #3c76a6 !important;
  color: #ffffff !important;
  font-size: 14px !important; 
  font-weight: bold !important;
  text-decoration: none !important;
  padding: 16px 0 !important;
  width: 90% !important;
  margin: 25px auto 40px auto !important;
  letter-spacing: 0.03em !important;
  text-align: center !important;
  transition: opacity 0.2s !important;
}
.btn-support-case-sp:hover {
  opacity: 0.85 !important;
  color: #ffffff !important;
}


/* ==========================================
   18. インラインスタイル移行用クラス
   ========================================== */

.problem-title-pc {
  font-size: 50px !important; 
  font-weight: bold !important; 
  color: #f38a3b !important;
  line-height: 1.4 !important;
  text-align: center !important;
  margin-top: 90px !important;
  margin-bottom: 10px !important;
  letter-spacing: 0.03em !important;
  display: block !important;
}
.problem-title-sp {
  font-size: 26px !important; 
  font-weight: bold !important; 
  color: #f38a3b !important;
  line-height: 1.4 !important;
  text-align: center !important;
  margin-top: 60px !important;
  margin-bottom: 20px !important;
  letter-spacing: 0.03em !important;
  display: block !important;
}
.problem-intro-box {
  font-family: sans-serif !important;
  text-align: center !important;
  line-height: 1.8 !important;
  color: #534741 !important;
  font-weight: bold !important;
  letter-spacing: 0.03em !important;
  padding: 0 15px !important;
  margin-top: 15px !important;
  margin-bottom: 45px !important;
  width: 100% !important;
  display: block !important;
}
.problem-text-pc {
  font-size: 28px !important; 
}
.problem-span-blue-pc {
  font-size: 33px !important; 
  font-weight: bold !important;
}
.problem-span-pink-pc {
  font-size: 33px !important; 
  font-weight: bold !important;
}
.problem-text-sp {
  font-size: 17px !important; /* 19pxから17pxへ2ポイント下げました */
  line-height: 1.7 !important;
}
.problem-span-blue-sp {
  font-size: 26px !important; 
  font-weight: bold !important;
}
.problem-span-pink-sp {
  font-size: 26px !important; 
  font-weight: bold !important;
}

.solutions-text-pc {
  font-family: sans-serif !important;
  text-align: center !important;
  line-height: 1.8 !important;
  color: #534741 !important;
  font-weight: bold !important;
  letter-spacing: 0.03em !important;
  padding: 0 15px !important;
  margin-top: 50px !important;
  margin-bottom: 50px !important;
  width: 100% !important;
  font-size: 26px !important; 
}
.solutions-span-blue-pc {
  font-size: 36px !important; 
  color: #3c76a6 !important;
  font-weight: 900 !important;
}
.solutions-span-green-pc {
  font-size: 36px !important; 
  color: #598245 !important;
  font-weight: 900 !important;
}
.solutions-span-orange-pc {
  font-size: 36px !important; 
  color: #e68b35 !important;
  font-weight: 900 !important;
}
.solutions-text-sp {
  font-family: sans-serif !important;
  text-align: center !important;
  line-height: 1.7 !important;
  color: #534741 !important;
  font-weight: bold !important;
  letter-spacing: 0.03em !important;
  padding: 0 15px !important;
  margin-top: 50px !important;
  margin-bottom: 50px !important;
  width: 100% !important;
  font-size: 19px !important; 
}
.solutions-span-blue-sp {
  font-size: 32px !important; 
  color: #3c76a6 !important;
  font-weight: 900 !important;
}
.solutions-span-green-sp {
  font-size: 32px !important; 
  color: #598245 !important;
  font-weight: 900 !important;
}
.solutions-span-orange-sp {
  font-size: 32px !important; 
  color: #e68b35 !important;
  font-weight: 900 !important;
}

.custom-qa-padding {
  padding: 0 5px;
}
.qa-note-text {
  font-size: 20px;
  color: #666666;
}


/* ==========================================
   19. 居住支援法人の概要と役割（消失バグを完全復旧！）
   ========================================== */
.overview-box {
  background-image: url('../images/keisen.png') !important;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  padding: 60px 60px 95px 60px !important; 
  margin: 60px auto !important;
  max-width: 860px !important;
  box-sizing: border-box !important;
  background-color: #ffffff !important; 
}
.overview-title-container {
  text-align: center !important;
  margin-bottom: 35px !important;
}
.overview-title {
  font-size: 30px !important; 
  color: #4484b4 !important;
  font-weight: bold !important;
  display: inline-block !important;
  border-bottom: 2px solid #4484b4 !important;
  padding-bottom: 15px !important;
  margin: 0 !important;
}
.overview-text {
  font-size: 19px !important; 
  color: #333333 !important;
  line-height: 1.8 !important;
  text-align: left !important;
  margin-bottom: 30px !important;
  font-weight: normal !important; 
}
.overview-text strong {
  font-weight: bold !important; 
}
.overview-text:last-of-type {
  margin-bottom: 40px !important;
}
.overview-btn-wrap {
  text-align: center !important;
}
.overview-btn {
  display: inline-block !important;
  background-color: #4484b4 !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: bold !important;
  text-decoration: none !important;
  padding: 12px 40px !important;
  transition: opacity 0.2s !important;
}
.overview-btn:hover {
  opacity: 0.85 !important;
}
@media (max-width: 767.98px) {
  .overview-box {
    padding: 40px 25px 70px 25px !important; 
    margin: 40px 10px !important;
  }
  .overview-title {
    font-size: 22px !important; 
    padding-bottom: 10px !important;
  }
  .overview-text {
    font-size: 16px !important; 
    line-height: 1.7 !important;
    margin-bottom: 20px !important;
  }
  .overview-btn {
    font-size: 14px !important;
    padding: 12px 0 !important;
    width: 100% !important;
    max-width: 290px !important;
  }
}


/* ==========================================
   21. ベージュエリア下部追加テキスト（限界引き上げ＆文字拡大版）
   ========================================== */
.beige-footer-text {
  font-size: 34px !important;     
  font-weight: bold !important;
  color: #534741 !important; 
  line-height: 1.5 !important;
  margin-top: -55px !important;   
  margin-bottom: 90px !important; 
  letter-spacing: 0.03em !important;
  display: block !important;
}

@media (max-width: 767.98px) {
  .beige-footer-text {
    font-size: 22px !important;   /* 24pxから22pxに2ポイント下げました */
    margin-top: 20px !important;  /* マイナスマージンを解消し、画像との間に余白を作りました */
    margin-bottom: 55px !important;
  }
}


/* ==========================================
   23. 新フッターお問い合わせエリア
   ========================================== */
.footer-lead-text {
  font-size: 34px !important; 
  font-weight: bold !important;
  color: #000000 !important;
  margin-top: 30px !important;
  margin-bottom: 25px !important;
  letter-spacing: 0.03em !important;
}
.footer-btn-wrap {
  text-align: center !important;
  margin-bottom: 30px !important;
}
.footer-contact-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: #f38a3b !important; 
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: bold !important;
  text-decoration: none !important;
  width: 100% !important;
  max-width: 520px !important; 
  padding: 18px 0 !important;
  border-radius: 10px !important; 
  transition: opacity 0.2s !important;
  letter-spacing: 0.05em !important;
  box-shadow: 0 4px 12px rgba(243, 138, 59, 0.15) !important;
}
.footer-contact-btn:hover {
  opacity: 0.88 !important;
  color: #ffffff !important;
}

@media (max-width: 767.98px) {
  .footer-lead-text {
    font-size: 22px !important;
    margin-bottom: 20px !important;
  }
  .footer-contact-btn {
    font-size: 18px !important;
    padding: 14px 0 !important;
    max-width: 90% !important;
  }
}


/* ==========================================
   24. 会社情報フッターエリア（★各種調整の上書き）
   ========================================== */
.custom-footer-info {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}
.footer-logo-text {
  font-size: 14px !important;
  font-weight: bold !important;
  color: #333333 !important;
  margin-bottom: 6px !important;
  letter-spacing: 0.02em !important;
}
.footer-info-logo {
  max-width: 325px !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
  margin-bottom: 8px !important;
}
.footer-address {
  font-size: 13px !important;
  font-weight: bold !important;
  color: #333333 !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
  letter-spacing: 0.01em !important;
}
/* PC表示の時は住所が絶対に複数行に折れ曲がらないように固定 */
@media (min-width: 768px) {
  .footer-address {
    white-space: nowrap !important;
  }
}

/* ★新設：差し替えた tel.png 画像用のサイズ最適化クラス */
.footer-info-tel {
  max-width: 360px !important; /* 表示イメージの比率にジャストフィットする幅 */
  width: 100% !important;
  height: auto !important;
  display: inline-block !important;
}

.footer-info-pmark {
  max-width: 80px !important;
  width: 100% !important;
  height: auto !important;
  display: inline-block !important;
}

@media (max-width: 767.98px) {
  .custom-footer-info {
    text-align: center !important;
  }
  .footer-logo-text {
    font-size: 12px !important;
  }
  .footer-info-logo {
    margin: 0 auto 8px auto !important;
    max-width: 290px !important;
  }
  .footer-address {
    font-size: 12px !important;
    margin-top: 6px !important;
  }
  .footer-info-tel {
    margin-top: 15px !important;
    max-width: 300px !important; /* スマホ画面に綺麗に収まるサイズに微圧縮 */
  }
  .footer-info-pmark {
    margin-top: 20px !important;
    max-width: 70px !important;
  }
}


/* ==========================================
   20. タイトル連動文字オレンジ化（★カラーの強制適用を一番最後に補強）
   ========================================== */
.text-orange {
  color: #f38a3b !important;
}
/* ==========================================
   ★追加：「誰に相談すればいいか分からない」下の説明文のみSPサイズを下げる
   ========================================== */
@media (max-width: 767.98px) {
  .bg-beige .triple-color-text {
    font-size: 16px !important; /* 前回の18pxからさらに2ポイント下げて16pxに指定 */
  }
}