/* ==========================================================================
   メインコンテンツ：横幅1344px最大拡張版レイアウト
   ========================================================================== */

/* カード内部の余白 */
.msb-content-card .msb-card-body {
  padding: 24px 48px 24px 48px;
  box-sizing: border-box;
}
/* 上部ヒーロー画像 */
.msb-content-card .msb-hero-image img {
  padding: 48px 48px 0px 48px;
}

/* 飾り線付きの見出し【1段階拡大: 1.35rem → 1.55rem】 */
.msb-card-body .msb-section-title {
  font-size: 1.55rem;
  font-weight: 700;
  color: #1e293b;
  margin: 44px 0 20px 0; /* 文字サイズに合わせて少し余白を広く */
  padding: 0 0 8px 0;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #3a6b73;
  background: none;
  text-align: left;
}

/* 最初の見出しの上の余白をゼロに */
.msb-card-body .msb-section-title:first-of-type {
  margin-top: 0;
}

/* 本文テキストのクッキリ化【1段階拡大: 0.95rem → 1.05rem】 */
.msb-card-body .msb-text {
  font-size: 1.05rem;
  line-height: 1.75; /* 文字サイズに合わせて行間を1.75から1.8へ微調整 */
  color: #334155;
  margin: 0 0 0px 0;
  text-align: left;
}

/* リンクテキスト（青文字） */
.msb-card-body .msb-link {
  color: #2563eb;
  text-decoration: none;
  font-weight: 500;
  display: inline;
  background: none;
  padding: 0;
}
.msb-card-body .msb-link:hover {
  color: #1d4ed8;
  text-decoration: underline;
}

/* --------------------------------------------------------------------------
   特定エリアの個別装飾（方針・リスト）
   -------------------------------------------------------------------------- */

/* 「方針」のグレー背景ボックス */
.msb-card-body .msb-policy-box {
  background-color: #f8fafc;
  border-left: 4px solid #94a3b8;
  padding: 24px;
  margin: 24px 0;
  border-radius: 0 8px 8px 0;
}

/* 方針のタイトル【1段階拡大: 0.95rem → 1.05rem】 */
.msb-policy-box .msb-policy-heading {
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 12px 0;
  font-size: 1.05rem;
}

/* 方針の箇条書き */
.msb-policy-box .msb-policy-list {
  margin: 0;
  padding-left: 20px;
  list-style-type: disc;
}
/* 方針の各項目【1段階拡大: 0.9rem → 1.0rem】 */
.msb-policy-box .msb-policy-list li {
  font-size: 1.0rem;
  line-height: 1.75;
  color: #475569;
  margin-bottom: 12px;
  padding: 0;
  background: none;
}
.msb-policy-box .msb-policy-list li:last-child {
  margin-bottom: 0;
}

/* 法令・リンク集（横幅が広がっても崩れないスタイリッシュな点線仕切り） */
.msb-card-body .msb-links-list {
  list-style-type: none;
  padding: 0;
  margin: 0 0 24px 0;
}
/* 法令リストの項目【1段階拡大: 0.95rem → 1.05rem】 */
.msb-links-list li {
  padding: 12px 0; /* 文字が大きくなった分、上下パディングを少し広げてスッキリと */
  margin: 0;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 1px dashed #e2e8f0;
  font-size: 1.05rem;
  background: none;
  text-align: left;
}
.msb-links-list li:last-child {
  border-bottom: none;
}

/* --------------------------------------------------------------------------
   スマートフォン向けの画面幅調整（画面幅768px以下の時）
   -------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  .msb-main-container {
    padding: 0px;
  }

  /* 上部ヒーロー画像 */
.msb-content-card .msb-hero-image img {
    width:100%;
  padding: 0px;
}

  .msb-content-card .msb-card-body {
    padding: 16px 16px 0px 16px;
  }
  
  /* スマホ版見出し【1.18rem → 1.3rem】 */
  .msb-card-body .msb-section-title {
    font-size: 1.3rem;
    margin: 16px 0 16px 0;
  }
  
  /* スマホ版本文・リンク集【ベースを1.0remへ拡大】 */
  .msb-card-body .msb-text,
  .msb-links-list li,
  .msb-policy-box .msb-policy-heading {
    font-size: 1.0rem;
  }
  
  /* スマホ版方針リスト【0.95remへ拡大】 */
  .msb-policy-box .msb-policy-list li {
    font-size: 0.95rem;
  }
  
  .msb-card-body .msb-policy-box {
    padding: 16px;
    margin: 16px 0;
  }
}


/* ==========================================================================
   科目選択ページ専用スタイル（index.phpのクラス名とは一切重複しません）
   ========================================================================== */

/* 科目ページ専用の内部余白コンテナ（index.phpのmsb-card-bodyの別名） */
.msb-content-card .msb-sub-body {
  padding: 48px;
  box-sizing: border-box;
}

/* 科目ページ専用の見出し（デフォルトのシステムフォント・下線付き） */
.msb-sub-body .msb-sub-title {
  font-size: 1.55rem;
  font-weight: 700;
  color: #1e293b;
  margin: 44px 0 20px 0;
  padding: 0 0 8px 0;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #3a6b73;
  background: none;
  text-align: left;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
}

/* 最初の見出しの上の余白をゼロに */
.msb-sub-body .msb-sub-title:first-of-type {
  margin-top: 0;
}

/* 科目ページ専用の本文テキスト */
.msb-sub-body .msb-sub-text {
  font-size: 1.05rem;
  line-height: 1.8;
  color: #334155;
  margin: 0 0 6px 0; /* pタグ同士の間隔を狭く設定 */
  text-align: left;
}

/* --------------------------------------------------------------------------
   縦一列（1カラム）のモダンな科目選択リンク機構
   -------------------------------------------------------------------------- */

/* リンクを包む縦並びのコンテナ */
.msb-sub-body .msb-sub-list {
  display: flex;
  flex-direction: column;
  gap: 12px; /* ボタン同士の上下の隙間 */
  margin: 24px 0;
  width: 100%;
}

/* 一次試験・二次試験の区切り文字 */
.msb-sub-list .msb-sub-category {
  font-size: 1.1rem;
  font-weight: 700;
  color: #475569;
  padding: 8px 0;
  margin-top: 16px;
  border-bottom: 1px solid #e2e8f0;
}
.msb-sub-list .msb-sub-category:first-of-type {
  margin-top: 0;
}

/* 縦一列に並ぶ、横幅いっぱいの科目ボタン */
.msb-sub-list .msb-sub-card-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 24px;
  background-color: #f8fafc; /* 上品な超薄グレー */
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.25s ease;
}

/* 科目名 */
.msb-sub-card-link .msb-sub-name {
  font-size: 1.05rem;
  font-weight: 500;
  color: #1e293b;
  font-family: system-ui, -apple-system, sans-serif;
}

/* 右側の矢印アイコン（→） */
.msb-sub-card-link .msb-sub-arrow {
  font-size: 1.05rem;
  color: #94a3b8;
  transition: transform 0.25s ease;
}

/* ホバー時の洗練された演出 */
.msb-sub-list .msb-sub-card-link:hover {
  background-color: #ffffff;
  border-color: #3a6b73; /* 深緑のアクセントカラー */
  box-shadow: 0 4px 12px rgba(58, 107, 115, 0.06); /* ほんのり影をつける */
  transform: translateY(-1px); /* 軽く浮き上がらせる */
}

/* ホバー時に矢印を少し右に動かす */
.msb-sub-list .msb-sub-card-link:hover .msb-sub-arrow {
  color: #3a6b73;
  transform: translateX(4px);
}


/* --------------------------------------------------------------------------
   スマートフォン向けの画面幅調整（画面幅768px以下の時）
   -------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  .msb-content-card .msb-sub-body {
    padding: 28px 16px;
  }
  
  .msb-sub-body .msb-sub-title {
    font-size: 1.3rem;
    margin: 36px 0 16px 0;
  }
  
  .msb-sub-body .msb-sub-text,
  .msb-sub-list .msb-sub-category,
  .msb-sub-card-link .msb-sub-name,
  .msb-sub-card-link .msb-sub-arrow {
    font-size: 1.0rem;
  }

  .msb-sub-list .msb-sub-card-link {
    padding: 14px 20px;
  }
}

/* --------------------------------------------------------------------------
   未作成エリアのグレーアウト（クリック不可）設定
   -------------------------------------------------------------------------- */

/* リンクを完全に無効化し、カーソルを禁止マークにする */
.msb-sub-list .msb-sub-card-link.msb-sub-disabled {
  background-color: #f1f5f9; /* 通常より少し濃い目のグレー */
  border-color: #cbd5e1;     /* 枠線も薄く */
  pointer-events: none;      /* クリック（タップ）を完全に無効化 */
  cursor: not-allowed;       /* マウスホバー時に禁止マークを表示 */
  box-shadow: none;
  transform: none;
}

/* グレーアウト時の文字色と矢印色のトーンを落とす */
.msb-sub-card-link.msb-sub-disabled .msb-sub-name {
  color: #94a3b8;
  font-weight: 400; /* 文字の太さも少し細くして未アクティブ感を演出 */
}

.msb-sub-card-link.msb-sub-disabled .msb-sub-arrow {
  color: #cbd5e1;
}