@charset "UTF-8";
/* ============================================================
   教育事業ページ追加分（本番では common.css の末尾に追記）
   ============================================================ */

/* 背景色を明示（未指定だと表示環境によって背景が白にならない場合がある） */
html,
body {
  background: #fff; }

/* ヘッダー：ナビ8項目化に合わせて言語ボタン・ロゴとの重なりを解消
   （既存サイトでも1110px前後以下で Contact が言語ボタンに重なっていた） */
@media screen and (min-width: 1101px) and (max-width: 1399px) {
  .l-gnav {
    padding-left: 160px;
    padding-right: 190px; } }

@media screen and (min-width: 768px) and (max-width: 1100px) {
  .l-gnav {
    padding-left: 70px;
    padding-right: 160px; }
  .l-gnav-link:not(:last-child) {
    margin-right: 12px; }
  .l-gnav-link a {
    font-size: 1.1rem; } }  /* u-text-18 相当。8項目を1行に収めるための例外 */

/* ---------------------------
   教育ページ

   文字サイズのルール（既存サイトの仕組みに合わせる）
   ・基準：html 16px（1101px以上）／14px（1100px以下）。サイズはすべて rem
   ・サイズは既存の u-text-* クラスで指定し、ここでは font-size を書かない
     （u-text-20 以上はスマホで自動的に一段小さくなる）
       英字大見出し   .m-h .label        3.75rem（既存）
       英字中見出し   .m-h02 .label      2.8rem（既存）
       キャッチ       u-text-30
       日本語小見出し u-text-20
       強調の数値     u-text-22
       本文           u-text-16（= 1rem・指定なしと同じ）
       カード内本文   u-text-14
       ラベル・注記   u-text-13（最小サイズ。これより小さくしない）
   ・アイコン：既存で読み込み済みの Material Icons Outlined を使い、色は #FF9E4A
       アイコンは 2rem で統一（白い丸・カードの中に単独で置く）
   ・文字色：本文 #2E2E2E（既存）／補足 #5F5F5F／強調 #FF9E4A（既存）
--------------------------- */
.m-eduBtns {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto; }
.m-eduBtns .m-btn02.u-bd-c1 {
  background: #fff; }
.m-eduPoints {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  text-align: center; }
  .m-eduPoint-ico {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin: 0 auto;
    border-radius: 50%;
    background: #fff;
    color: #FF9E4A; }
    .m-eduPoint-ico .material-icons-outlined {
      font-size: 2rem; }
  .m-eduPoint-label {
    display: block;
    margin-top: 10px;
    font-weight: bold; }
.m-eduFacts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px; }
.m-eduFact {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: #fff;
  padding: 28px 16px;
  text-align: center; }
  .m-eduFact-ico {
    margin-bottom: 8px;
    font-size: 2rem;
    line-height: 1;
    color: #FF9E4A; }
  .m-eduFact-label {
    color: #5F5F5F; }
  .m-eduFact-value {
    margin-top: 6px;
    font-weight: bold;
    color: #FF9E4A; }
  .m-eduFact-note {
    margin-top: 4px; }
.m-eduSteps {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px 36px; }
.m-eduStep {
  position: relative;
  background: #fff;
  padding: 28px 20px; }
  .m-eduStep:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -24px;
    transform: translateY(-50%);
    border-style: solid;
    border-width: 9px 0 9px 12px;
    border-color: transparent transparent transparent #FF9E4A; }
  .m-eduStep-num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0 auto;
    border-radius: 50%;
    background: #FF9E4A;
    color: #fff;
    font-family: 'EB Garamond', serif; }
  .m-eduStep-h {
    margin-top: 14px;
    text-align: center;
    font-weight: bold; }
  .m-eduStep-txt {
    margin-top: 10px; }
.m-eduAdvisorImg {
  max-width: 360px;
  margin: 0 auto; }
  .m-eduAdvisorImg img {
    display: block;
    width: 100%;
    height: auto; }
.m-eduNote {
  color: #5F5F5F; }
/* 箇条書き：「・」と<br>の手打ちだと2行目が頭に揃わず読みにくいため、
   ぶら下げインデント＋項目間の余白で1項目ずつ区切って見せる */
.m-eduList {
  list-style: none;
  padding: 0; }
  .m-eduList li {
    position: relative;
    padding-left: 1.25em;
    line-height: 1.8; }
    .m-eduList li + li {
      margin-top: 0.5em; }
    .m-eduList li::before {
      content: '';
      position: absolute;
      top: 0.7em;
      left: 0.25em;
      width: 0.45em;
      height: 0.45em;
      border-radius: 50%;
      background: #FF9E4A; }
  /* 経歴は1項目が長いので、区切り線で段を分ける */
  .m-eduList.is-career li {
    padding-top: 0.75em;
    padding-bottom: 0.75em;
    border-bottom: 1px solid #E5E5E5; }
    .m-eduList.is-career li + li {
      margin-top: 0; }
    .m-eduList.is-career li::before {
      top: 1.45em; }
.m-eduSubH {
  padding-left: 0.6em;
  border-left: 4px solid #FF9E4A;
  font-weight: bold;
  line-height: 1.4; }
/* アドバイザー名：呼び名（Dr. 理恵）を大きく、正式名・肩書きを一段下げて併記 */
.m-eduAdvisor-role {
  color: #5F5F5F;
  font-weight: bold;
  letter-spacing: 0.1em; }
.m-eduAdvisor-name {
  margin-top: 0.2em;
  font-weight: bold;
  line-height: 1.3; }
.m-eduAdvisor-fullname {
  margin-top: 0.3em;
  font-weight: bold; }
.m-eduAdvisor-sep {
  margin: 0 0.3em;
  color: #FF9E4A; }
.m-eduAdvisor-tag {
  display: inline-block;
  margin-top: 0.8em;
  padding: 0.2em 0.8em;
  background: #FFF3E8;
  color: #2E2E2E; }
.m-partner-list.is-edu {
  padding: 0; }
  .m-partner-list.is-edu .m-column04 {
    padding: 0 10px; }
  .m-partner-list.is-edu .m-column04-label {
    font-size: 1rem; }  /* u-text-16 相当。学校名が長いため Partner（1.2rem）より一段下げる */
  .m-partner-list.is-edu .m-partner-ul li {
    white-space: normal; }
  .m-partner-list.is-edu .m-column04:nth-child(2) .m-partner-ul {
    margin-left: 0; }
@media screen and (max-width: 1100px) {
  .m-eduSteps {
    grid-template-columns: 1fr;
    gap: 30px;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto; }
  .m-eduStep {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 4px 14px;
    padding: 18px 16px; }
    .m-eduStep:not(:last-child)::after {
      top: auto;
      right: auto;
      bottom: -22px;
      left: 50%;
      transform: translateX(-50%);
      border-width: 12px 9px 0 9px;
      border-color: #FF9E4A transparent transparent transparent; }
    .m-eduStep-num {
      grid-row: 1 / 3;
      width: 40px;
      height: 40px;
      margin: 0; }
    .m-eduStep-h {
      margin-top: 0;
      text-align: left; }
      .m-eduStep-h br {
        display: none; }
    .m-eduStep-txt {
      margin-top: 0; } }
@media screen and (max-width: 767px) {
  .m-eduPoints {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 10px; }
  .m-eduPoint-ico {
    width: 56px;
    height: 56px; }
  .m-eduFacts {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px; }
  .m-eduFact {
    padding: 20px 10px; }
  .m-eduBtns.m-btnCols.is-2col {
    grid-template-columns: 1fr; }
  .m-eduAdvisorImg {
    max-width: 240px; } }
