@charset "UTF-8";

/* ==========================================================================
   Accordion: SP / PC 制御
   ========================================================================== */

/* --------------------------------------------------
   SP（〜768px）
   -------------------------------------------------- */
@media (max-width: 768px) {

  /* 見出しのベース調整 */
  .p-page-content .c-heading-lvl2 {
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
    border-bottom: 1px solid var(--color-border-light);
  }

  /* 既存の左端アクセント（::after）を解除 */
  .p-page-content .c-heading-lvl2::after {
    display: none;
  }

  /* トリガーボタン */
  .c-accordion-trigger {
    width: 100%;
    display: flex;
    align-items: flex-start; /* 複数行のとき天面揃え */
    padding: 20px 50px 20px 15px; /* 右側にアイコンスペースを確保 */
    background: #fff;
    border: none;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    font-size: var(--fs-base);
    font-weight: var(--fw-bold);
    color: var(--color-gray-700);
    position: relative;
    line-height: var(--lh-tight);
  }

  /* ホバー・タップ時も白を維持 */
  .c-accordion-trigger:hover,
  .c-accordion-trigger:active {
    background: #fff;
  }

  /* ＋／－ アイコン（共通） */
  .c-accordion-trigger::before,
  .c-accordion-trigger::after {
    content: "";
    position: absolute;
    top: 50%;
    background-color: var(--color-main);
    transition: all var(--transition-base);
  }

  /* 横棒 */
  .c-accordion-trigger::before {
    right: 20px;
    width: 16px;
    height: 2px;
    transform: translateY(-50%);
  }

  /* 縦棒 */
  .c-accordion-trigger::after {
    right: 27px;
    width: 2px;
    height: 16px;
    transform: translateY(-50%);
  }

  /* 開いている時：縦棒を回転させて消す（マイナスに変化） */
  .c-accordion-item.is-active .c-accordion-trigger::after {
    transform: translateY(-50%) rotate(90deg);
    opacity: 0;
  }

  /* 番号部分：折り返し禁止・固定 */
  .c-accordion-trigger__num {
    flex-shrink: 0;
    white-space: nowrap;
    padding-top: 0.1em;
  }

  /* コンテンツエリア */
  .c-accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height var(--transition-base) ease-out;
    background-color: #fff;
  }

  /* 開いている状態：境界線を表示（高さはJSで付与） */
  .c-accordion-item.is-active .c-accordion-content {
    border-bottom: 1px solid var(--color-border-light);
  }

  .c-accordion-content .c-listLink--v {
    padding: 15px;
    margin: 0;
  }

}


/* --------------------------------------------------
   PC（769px〜）
   -------------------------------------------------- */
@media (min-width: 769px) {

  /* 見出し：左寄せ・下線 */
  .p-page-content .c-heading-lvl2 {
    text-align: left !important;
    border-bottom: 5px solid var(--color-border);
  }

  /* =====================
     SP専用アコーディオン
     （.c-accordion--all がないもの）
     PCでは常に開いた状態で固定
     ===================== */
  .c-accordion-item:not(.c-accordion--all) .c-accordion-trigger {
    width: 100%;
    padding: 0 0 var(--spacing-sm) 0;
    text-align: left;
    background: none;
    border: none;
    color: inherit;
    font: inherit;
    display: block;
    pointer-events: none; /* クリック不可 */
    cursor: default;
  }

  /* アイコン非表示 */
  .c-accordion-item:not(.c-accordion--all) .c-accordion-trigger::before,
  .c-accordion-item:not(.c-accordion--all) .c-accordion-trigger::after {
    display: none !important;
  }

  /* 常に展開 */
  .c-accordion-item:not(.c-accordion--all) .c-accordion-content {
    max-height: none !important;
    overflow: visible !important;
    background: transparent !important;
  }

  /* =====================
     両用アコーディオン
     （.c-accordion--all があるもの）
     PCでも開閉可能・初期状態は「開」
     ★ !important を使わず JS の inline style に委ねる
     ===================== */
  .c-accordion--all .c-accordion-trigger {
    width: 100%;
    padding: 0 45px var(--spacing-sm) 0;
    text-align: left;
    background: none;
    border: none;
    color: inherit;
    font: inherit;
    display: block;
    pointer-events: auto !important;
    cursor: pointer;
  }

  /* アイコン表示（PC版 ＋/－）：形状・サイズ定義 */
  .c-accordion--all .c-accordion-trigger::before,
  .c-accordion--all .c-accordion-trigger::after {
    content: "";
    display: block !important;
    position: absolute;
    top: calc(50% - 6px); /* 少し上に移動 */
    background-color: var(--color-main);
    transition: all var(--transition-base);
  }

  /* 横棒 */
  .c-accordion--all .c-accordion-trigger::before {
    right: 20px;   /* 0px → 20px（左へ移動） */
    width: 28px;
    height: 3px;
    transform: translateY(-50%);
  }

  /* 縦棒 */
  .c-accordion--all .c-accordion-trigger::after {
    right: 32px;   /* 12px → 32px（左へ移動） */
    width: 3px;
    height: 28px;
    transform: translateY(-50%);
  }

  /* 開いている時：縦棒を回転させて消す（マイナスに変化） */
  .c-accordion--all.is-active .c-accordion-trigger::after {
    transform: translateY(-50%) rotate(90deg);
    opacity: 0;
  }

  /* ★ !important を付けない → JS の inline style（maxHeight）が優先される */
  .c-accordion--all .c-accordion-content {
    overflow: hidden;
    background-color: #fff;
    transition: max-height var(--transition-base) ease-out;
    /* max-height は JS が inline style で制御するため CSS では指定しない */
  }

  /* 開いている状態：境界線を表示 */
  .c-accordion--all.is-active .c-accordion-content {
    border-bottom: 1px solid var(--color-border-light);
  }

}

/* ==========================================================================
   Accordion: セクション間マージンの統一（上書き）
   .c-accordion-item に付与された u-mt-* を無効化し、間隔をゼロに統一する
   ========================================================================== */
.c-accordion-item {
  margin-top: 0 !important;
}




/* ==========================================================================
   アコーディオン化しない H2 の見た目調整（スマホ版でもPCデザインを維持）
   ========================================================================== */

/* SP版の調整（〜768px） */
@media (max-width: 768px) {
  .p-page-content .c-heading-lvl2--no-accordion {
    display: block !important;
    width: auto !important;
    padding: 0 0 var(--spacing-sm) 0 !important; /* アコーディオン風のパディングを削除 */
    background: transparent !important;         /* 白背景を解除 */
    border-bottom: 5px solid var(--color-border) !important; /* PC版と同じ太い下線を復活 */
    margin-top: var(--spacing-2xl) !important;
    margin-bottom: var(--spacing-xl) !important;
    font-size: var(--fs-heading-h2) !important;
    position: relative;
  }

  /* 下端の学科カラーアクセント（::after）を復活 */
  .p-page-content .c-heading-lvl2--no-accordion::after {
    display: block !important;
    content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 80px;
    height: 5px;
    background-color: var(--color-main) !important; /* 学科カラーを適用 */
  }
}