/* ==========================================================
   new-top.css
   div#content > .new-content 専用スタイル
   既存CSS (bootstrap / template / aly) には影響しない

   FLOCSS風レイヤー構成:
     Foundation → Layout → Component → Project → Utility → Responsive
   ========================================================== */

/* ===== Foundation ===== */

.new-content {
  --nc-color-primary: #005bac;
  --nc-color-primary-dark: #0a62a9;
  --nc-color-secondary: #2e8b57;
  --nc-color-text: #333;
  --nc-color-text-light: #666;
  --nc-color-border: #ABABAB;
  --nc-color-border2: #DDDDDD;
  --nc-color-black: #000;
  --nc-color-bg: #fff;
  --nc-max-width: 1220px;
  --nc-inner-padding: 70px;
  --nc-radius: 8px;
  --nc-transition: 0.3s ease;

  margin: 0;
  padding: 0;
  font-size: 1rem; /* 1rem = 16px 換算ベース */
  font-family: "YuGothic", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  color: var(--nc-color-text);
}

/* KV 以外の直下要素に max-width を適用（KV は #content 全幅を使う） */
.new-content > *:not(.kv):not(.kv__spacer) {
  margin-left: auto;
  margin-right: auto;
}

.new-content *,
.new-content *::before,
.new-content *::after {
  box-sizing: border-box;
}

.new-content img {
  max-width: 100%;
  height: auto;
  display: block;
}

.new-content a {
  color: var(--nc-color-primary);
  text-decoration: none;
  transition: color var(--nc-transition);
}

@media (hover: hover) {
  .new-content a:hover {
    color: var(--nc-color-primary);
    text-decoration: underline;
  }
}

.new-content a:focus-visible {
  outline: 2px solid var(--nc-color-primary);
  outline-offset: 2px;
}

/* ===== 汎用: テキストリンク アイコン ===== */
/* ボタン・画像リンク・バナー等は除外し、テキストリンクのみ対象 */

/* 外部リンク（PDFを除く）: ブランクアイコン（currentColor でテキスト色に追従） */
.new-content a[target="_blank"]:not([href*=".pdf"]):not(.cta-btn):not(.kv__btn):not(.nc-img-banner):not(.nc-img-lighten):not(.news-carousel__card):not(.campus-life__card):not(.interview__card):not(.banner-section__link)::after {
  content: '';
  display: inline-block;
  width: 0.875em;   /* 14/16 = 0.875em: フォントサイズに追従 */
  height: 1em;
  margin-left: 0.25em;
  vertical-align: -0.1em;
  background-color: currentColor;
  mask-image: url("data:image/svg+xml,%3Csvg width='14' height='16' viewBox='0 0 14 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_332_1145)'%3E%3Cpath d='M9.50233 13.5175H7.89538V14.3809H1.59805V4.05076H2.65354V2.43164H0V16H9.50233V13.5175Z' fill='%23444444'/%3E%3Cpath d='M13.997 0H3.36511V12.7588H14V0H13.997ZM4.96316 11.1397V1.61912H12.3901V11.1397H4.96316Z' fill='%23444444'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_332_1145'%3E%3Crect width='14' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  mask-repeat: no-repeat;
  mask-size: contain;
  transition: background-color var(--nc-transition);
}

/* PDFリンク: PDFアイコン（カラーSVGのため background-image で表示） */
.new-content a[href*=".pdf"]:not(.cta-btn):not(.kv__btn):not(.nc-img-banner):not(.nc-img-lighten):not(.news-carousel__card):not(.campus-life__card):not(.interview__card):not(.banner-section__link)::after {
  content: '';
  display: inline-block;
  width: 0.875em;   /* 14/14 = square: フォントサイズに追従 */
  height: 0.875em;
  margin-left: 0.25em;
  vertical-align: -0.05em;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_396_413)'%3E%3Cpath d='M8.35069 4.30347H0V8.11782H8.35069V4.30347Z' fill='%23FF001F'/%3E%3Cpath d='M1.30135 5.15625H2.13273C2.27061 5.15625 2.39547 5.17079 2.50704 5.19973C2.61861 5.2288 2.71399 5.27118 2.79289 5.32698C2.87193 5.38278 2.9327 5.45028 2.97533 5.52948C3.01797 5.60869 3.03929 5.69971 3.03929 5.80232C3.03929 5.92279 3.01423 6.02663 2.96398 6.11359C2.91373 6.20068 2.84549 6.27262 2.75897 6.32953C2.67246 6.38644 2.57141 6.42881 2.4561 6.45677C2.34065 6.48473 2.21787 6.49865 2.08747 6.49865H1.81657V7.26519H1.30121V5.15637L1.30135 5.15625ZM1.81671 6.1471H2.02739C2.09259 6.1471 2.15461 6.14205 2.21357 6.13207C2.27241 6.12197 2.3239 6.10423 2.36778 6.07849C2.41166 6.05287 2.44613 6.01936 2.47119 5.9781C2.49624 5.93683 2.50884 5.88498 2.50884 5.8224C2.50884 5.71302 2.46745 5.6327 2.38467 5.58134C2.30189 5.52997 2.19655 5.50435 2.06864 5.50435H1.81657V6.1471H1.81671Z' fill='%23FDFDFD'/%3E%3Cpath d='M4.23541 5.15625C4.41841 5.15625 4.58521 5.17744 4.73568 5.21981C4.88615 5.26218 5.0153 5.32587 5.12314 5.41062C5.23097 5.49549 5.3143 5.60093 5.37327 5.72694C5.43224 5.85307 5.46173 5.99978 5.46173 6.16706C5.46173 6.35897 5.42657 6.52353 5.35638 6.66076C5.2862 6.79798 5.19083 6.91179 5.07053 7.00221C4.9501 7.09262 4.80905 7.15901 4.64737 7.20139C4.48555 7.24376 4.31445 7.26495 4.13394 7.26495H3.4079V5.15613H4.23555L4.23541 5.15625ZM3.92326 6.91032H4.10003C4.20537 6.91032 4.30753 6.89861 4.40664 6.87521C4.50562 6.85181 4.59283 6.81165 4.66813 6.75474C4.74343 6.69783 4.80351 6.62195 4.84864 6.52711C4.89376 6.43226 4.91633 6.31241 4.91633 6.1673C4.91633 5.95531 4.84864 5.79296 4.71326 5.68025C4.57788 5.56755 4.39598 5.51125 4.16786 5.51125H3.9234V6.91044L3.92326 6.91032Z' fill='%23FDFDFD'/%3E%3Cpath d='M7.37273 5.15625V5.51113H6.3834V6.07011H7.28995V6.42154H6.3834V7.26507H5.86804V5.15625H7.37273Z' fill='%23FDFDFD'/%3E%3Cpath d='M13.8684 3.6472L10.2938 0.117143C10.2095 0.0421271 10.0951 0 9.97595 0H4.04162L2.26437 0.00147814L2.26312 3.75326H3.83038V1.42062L4.04176 1.42259H9.2499V4.227H13.2648H14.0001V3.93002C14.0001 3.82396 13.9528 3.72221 13.8685 3.6472H13.8684ZM10.5737 1.98995L11.8814 3.15362H10.5737V1.98995Z' fill='%23444444'/%3E%3Cpath d='M12.4798 12.4615L12.2215 12.4724H3.79109V8.66819L2.26314 8.6757V13.3453L2.26245 13.9997H2.41998H12.2215L14 14V4.77722H12.4798V12.4615Z' fill='%23444444'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_396_413'%3E%3Crect width='14' height='14' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-size: contain;
}

/* ===== 汎用: a > img ホバー拡大 ===== */
/* img が直接の子である a タグに適用。ボタンコンポーネントは除外 */
.new-content a:has(> img):not(.cta-btn):not(.kv__btn):not(.nc-img-banner):not(.nc-img-lighten) {
  overflow: hidden;
}

.new-content a:has(> img):not(.cta-btn):not(.kv__btn):not(.nc-img-banner):not(.nc-img-lighten) img {
  transition: transform var(--nc-transition);
}

@media (hover: hover) {
  .new-content a:has(> img):not(.cta-btn):not(.kv__btn):not(.nc-img-banner):not(.nc-img-lighten):hover img {
    transform: scale(1.2);
  }
}

.new-content button:focus-visible {
  outline: 2px solid var(--nc-color-primary);
  outline-offset: 2px;
}

/* マウス/タッチ操作時はデフォルトアウトラインを非表示（キーボード時は :focus-visible で表示） */
.new-content :focus:not(:focus-visible) {
  outline: none;
}

/* ===== Component: u-visually-hidden ===== */
/* template.css の #content h2 { position: relative } が詳細度で勝つため
   !important で確実に上書き */

.new-content .u-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* template.css の #content h2::before 装飾線を無効化 */
.new-content .u-visually-hidden::before,
.new-content .u-visually-hidden::after {
  content: none !important;
}

/* ===== Utility: 改行制御 ===== */
/* u-br-pc: PCで改行・SPで非表示。<br class="u-br-pc"> で使用 */
/* u-br-sp: SPで改行・PCで非表示。<br class="u-br-sp"> で使用 */
@media (max-width: 767px) {
  .new-content .u-br-pc { display: none; }
}
@media (min-width: 768px) {
  .new-content .u-br-sp { display: none; }
}

/* ============================================================
   ■ template.css 干渉リセット
   .new-content スコープ内で既存スタイルの影響を完全に無効化する

   【干渉スタイル（template.css）と詳細度】
   #content h2          → padding-left:10px; border-left:solid 3.5px #0A62A9
                           specificity: (1,0,1) = 101pt
   .index #content h2   → font-size:1.5em; text-align:center; margin-bottom:2.5em
                           specificity: (1,1,1) = 111pt
   .index #content h2:before → content:'' 装飾ライン
                           specificity: (1,1,2) = 112pt
   #content h3          → border-bottom:solid 1px #AAA; padding-bottom:8px
   .index #content h3   → border-bottom:solid 1px #AAA; padding-bottom:8px
                           いずれも (1,1,1) = 111pt
   #content h4/h5       → margin-bottom:2rem   (1,0,1) = 101pt

   【なぜ .new-content .xxx__title では上書きできないか】
   .new-content .news-section__title など = (0,2,0) = 20pt
   → (1,1,1) = 111pt の .index #content h2 に負ける
   → text-align / font-size / margin がすべて template.css に上書きされる

   【対策方針：!important を活用した 2 段階リセット】
   ① このブロック: .new-content h2/h3 に !important を設定
      → specificity (0,1,1) の !important として機能
   ② 各コンポーネント: .new-content .xxx__title など (0,2,0) に !important を設定
      → (0,2,0) > (0,1,1) のため、!important 同士でもコンポーネント側が勝つ
   ============================================================ */

/* h2 — 左ボーダー・左パディング・font-size・margin を一括リセット */
.new-content h2 {
  padding-left: 0 !important;     /* #content h2 { padding-left:10px } を打消し */
  border-left: none !important;   /* #content h2 { border-left:solid 3.5px #0A62A9 } を打消し */
  border-radius: 0 !important;    /* #content h2 { border-radius:2px } を打消し */
  font-size: inherit !important;  /* .index #content h2 { font-size:1.5em } を打消し
                                     ※各 __title の font-size !important で上書き可 */
  text-align: inherit !important; /* .index #content h2 { text-align:center } を打消し
                                     ※各 __title の text-align !important で上書き可 */
  margin: 0 !important;           /* .index #content h2 { margin-bottom:2.5em } を打消し
                                     ※各 __title の margin !important で上書き可 */
}

/* h2 疑似要素装飾ライン — 一括リセット
   （各 __title::before/after でも個別に無効化済みだが、将来追加の h2 も予防的にカバー） */
.new-content h2::before,
.new-content h2::after {
  content: none !important;  /* .index #content h2:before { content:'' } 装飾ラインを打消し */
  display: none !important;
}

/* h3 — 下ボーダー・下パディング・font-size・margin を一括リセット */
.new-content h3 {
  border-bottom: none !important; /* #content h3 / .index #content h3 { border-bottom:solid 1px #AAA } を打消し */
  padding-bottom: 0 !important;   /* #content h3 / .index #content h3 { padding-bottom:8px } を打消し */
  font-size: inherit !important;  /* #content h3 { font-size:1.4em } を打消し
                                     ※各コンポーネントの font-size !important で上書き可 */
  margin: 0 !important;           /* #content h3 { margin-bottom:2rem } を打消し
                                     ※各コンポーネントの margin !important で上書き可 */
}

/* h3 疑似要素 — 念のため一括リセット */
.new-content h3::before,
.new-content h3::after {
  content: none !important;
  display: none !important;
}

/* h4, h5 — margin を一括リセット */
.new-content h4,
.new-content h5 {
  margin: 0 !important; /* #content h4/h5 { margin-bottom:2rem } を打消し */
}

/* ===== Project: S1 KV動画エリア ===== */

.new-content .kv {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin: 0;
  padding: 0;
  container-name: kv;
  container-type: inline-size;
}

.new-content .kv__media {
  position: relative;
  width: 100%;
  /* ファーストビューで画面いっぱいに: 100svh - 固定ヘッダー高さ(90px) */
  height: calc(100vh - 90px);   /* fallback */
  height: calc(100svh - 90px);
  background: #1a1a2e;
}

.new-content .kv__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* KV コントロールボタン群 — PC: 左下 */
.new-content .kv__controls {
  position: absolute;
  bottom: 21px;
  left: 22px;
  display: flex;
  gap: 11px;
  z-index: 2;
}

.new-content .kv__btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 15px 5px 6px;
  background: var(--nc-color-primary-dark);
  color: #fff;
  border: 2px solid transparent;
  border-radius: 25px;
  font-size: 0.875rem;
  font-family: "YuGothic", "Yu Gothic", sans-serif;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  text-decoration: none;
  transition: background var(--nc-transition), color var(--nc-transition);
  min-height: 36px;
}

/* ホバー: 白背景に反転（枠線なし） */
@media (hover: hover) {
  .new-content .kv__btn:hover {
    background: #fff;
    border-color: transparent;
    text-decoration: none;
  }

  .new-content .kv__btn:hover span {
    background: linear-gradient(167.977deg, #0a62a9 4.2306%, #1aafba 110.8%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }

}

.new-content .kv__btn:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.new-content .kv__btn-icon {
  width: 25px;
  height: 25px;
  flex-shrink: 0;
}

/* アイコン circle: デフォルト白 / ホバーでグラデーション */
.new-content .kv__btn-icon circle {
  fill: #fff;
}

@media (hover: hover) {
  .new-content .kv__btn:hover .kv__btn-icon circle {
    fill: url(#kv-icon-grad);
  }
}

/* アイコン path: デフォルト青 / ホバーで白 */
.new-content .kv__btn-icon path {
  fill: var(--nc-color-primary-dark);
}

@media (hover: hover) {
  .new-content .kv__btn:hover .kv__btn-icon path {
    fill: #fff;
  }
}

/* フローティングお知らせカード群 — PC: 右下に2枚並列 */
.new-content .kv__floating {
  position: absolute;
  bottom: 21px;
  right: 0;
  display: flex;
  gap: 16px;
  z-index: 2;
  padding-right: 30px;
}

/* カード共通 — overflow: visible で閉じるボタンがはみ出せるようにする */
.new-content .kv__floating-card {
  position: relative;
  width: 274px;
  height: 103px;
  border: 3px solid rgba(255, 255, 255, 0.5);
  border-radius: 10px;
  overflow: visible;
}

/* テキストバージョン */
.new-content .kv__floating-card--text {
  background: rgba(255, 255, 255, 0.92);
  border: 5px solid rgba(10, 98, 169, 0.15);
}

.new-content .kv__floating-body {
  font-size: 0.875rem;
  line-height: 1.7;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: calc(100% - 12px); /* 上下のパディングを考慮してテキストエリアの高さを調整 */
}

/* テキスト版の全体リンク */
.new-content .kv__floating-card--text .kv__floating-link {
  padding: 12px 13px 0 11px;
  display: flex;
  align-content: center;
  color: var(--nc-color-text);
  text-decoration: none;
}

@media (hover: hover) {
  .new-content .kv__floating-card--text .kv__floating-link:hover {
    color: var(--nc-color-primary);
    text-decoration: underline;
  }
}

/* 画像バージョン */
.new-content .kv__floating-card--image {
  padding: 0;
}

.new-content .kv__floating-link {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 7px;
}

.new-content .kv__floating-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 7px;
  transition: transform var(--nc-transition);
}

@media (hover: hover) {
  .new-content .kv__floating-link:hover .kv__floating-img {
    transform: scale(1.2);
  }
}

.new-content .kv__floating-close {
  position: absolute;
  top: -9px;
  right: -8px;
  width: 26px;
  height: 26px;
  background: var(--nc-color-primary-dark);
  color: #fff;
  border: 2px solid transparent;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background var(--nc-transition);
}

/* タッチターゲット拡張（WCAG 2.5.5: 44×44px 確保） */
.new-content .kv__floating-close::after {
  content: '';
  position: absolute;
  inset: -9px;
}

/* ホバー: 白背景 + グラデーション border */
@media (hover: hover) {
  .new-content .kv__floating-close:hover {
    background:
      linear-gradient(#fff, #fff) padding-box,
      linear-gradient(167.977deg, #0a62a9 4.2306%, #1aafba 110.8%) border-box;
  }
}

.new-content .kv__floating-close svg {
  width: 12px;
  height: 12px;
}

/* アイコン path: デフォルト白 / ホバーでグラデーション */
.new-content .kv__floating-close svg path { fill: #fff; }
@media (hover: hover) {
  .new-content .kv__floating-close:hover svg path { fill: url(#kv-icon-grad); }
}

/* KV下部の余白（right_column_KV は 760px、kv_mov は 710px → 50px余白） */
.new-content .kv__spacer {
  height: 50px;
}

/* ===== Project: S2 ニュースカルーセル ===== */

.new-content .news-carousel {
  padding: 0 0 100px;
  background: var(--nc-color-bg);
}

.new-content .news-carousel__inner {
  max-width: var(--nc-max-width);
  margin: 0 auto;
  padding: 0 var(--nc-inner-padding);
}

/* --- カルーセルカード --- */
.new-content .news-carousel__card {
  display: block;
  border-radius: 20px;
  overflow: hidden;
  text-decoration: none;
}

@media (hover: hover) {
  .new-content .news-carousel__card:hover {
    text-decoration: none;
    opacity: 0.85;
  }

  .new-content .news-carousel__card:hover img {
    transform: scale(1.2);
  }
}

.new-content .news-carousel__card img {
  width: 100%;
  aspect-ratio: 340 / 230;
  object-fit: cover;
  display: block;
  border-radius: 20px;
  transition: transform var(--nc-transition);
}

/* --- Splide 上書き: トラック --- */
.new-content .js-news-splide .splide__track {
  border-radius: 20px;
}

/* --- Splide 上書き: デフォルトの矢印・ページネーションを非表示 --- */
.new-content .js-news-splide .splide__arrows {
  display: none;
}

.new-content .js-news-splide .splide__pagination {
  display: none;
}

/* --- コントロールバー --- */
/* PC: controls フル幅・ドット中央・ボタン右端 */
.new-content .news-carousel__controls {
  position: relative;
  height: 50px;
  margin-top: 12px;
}

/* --- ページネーションドット --- */
.new-content .news-carousel__dots {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: 15px;
}

.new-content .news-carousel__dot {
  width: 10px;
  min-height: 44px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.new-content .news-carousel__dot::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #d9d9d9;
  transition: background var(--nc-transition), transform var(--nc-transition);
}

.new-content .news-carousel__dot.is-active::after {
  background: #0a62a9;
}

@media (hover: hover) {
  .new-content .news-carousel__dot:hover::after,
  .new-content .news-carousel__dot:focus-visible::after {
    background: #0a62a9;
    transform: scale(1.2);
  }
}

/* --- ボタン群（一時停止 + 矢印）: PC は右端固定 --- */
.new-content .news-carousel__btns {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 25px;
}

.new-content .news-carousel__arrows {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* --- 共通ボタンスタイル（一時停止・矢印）: 共通ベース --- */
.new-content .news-carousel__pause,
.new-content .news-carousel__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  min-width: 44px;
  min-height: 44px;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
  color: #fff;
  transition: transform var(--nc-transition), opacity var(--nc-transition), filter var(--nc-transition);
}

/* --- 全矢印ボタン: 青グラデーション（アクティブ時） --- */
.new-content .news-carousel__pause,
.new-content .news-carousel__arrow {
  background: linear-gradient(136deg, #0a62a9 4.23%, #1aafba 110.8%);
}

/* --- 非アクティブ（終端）: グレー・ポインター無効 --- */
.new-content .news-carousel__arrow.is-disabled {
  background: #ddd;
  cursor: default;
  pointer-events: none;
}

/* --- ホバー: 拡大 + 明るく（ポインターデバイスのみ） --- */
@media (hover: hover) {
  .new-content .news-carousel__pause:hover,
  .new-content .news-carousel__pause:focus-visible,
  .new-content .news-carousel__arrow:not(.is-disabled):hover,
  .new-content .news-carousel__arrow:not(.is-disabled):focus-visible {
    filter: brightness(1.2);
    transform: scale(1.2);
  }
}

.new-content .news-carousel__pause svg,
.new-content .news-carousel__arrow svg {
  width: 50px;
  height: 50px;
  flex-shrink: 0;
}

/* ===== Component: CTA Button ===== */

.new-content .cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 20px;
  padding: 15px 28px;
  /* Figma: linear-gradient(166.65deg, #0a62a9 4.23%, #1aafba 110.8%) */
  background: linear-gradient(166.65deg, #0a62a9 4.23%, #1aafba 110.8%);
  color: #fff;
  border-radius: 30px;
  font-size: 1.125rem;
  font-weight: 700;
  text-decoration: none;
  border: none;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  /* transition は color のみ（背景は ::after で管理） */
  transition: color var(--nc-transition);
}

/* ホバー時の単色背景（グラデーション→単色を opacity で切り替え） */
.new-content .cta-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: #0a62a9;
  opacity: 0;
  transition: opacity var(--nc-transition);
}

/* テキストと矢印を ::after より手前に */
.new-content .cta-btn__text,
.new-content .cta-btn svg {
  position: relative;
  z-index: 1;
}

.new-content .cta-btn__text {
  white-space: nowrap;
}

/* 矢印アイコンのスライドアニメーション */
.new-content .cta-btn svg {
  flex-shrink: 0;
  transition: transform var(--nc-transition);
}

@media (hover: hover) {
  .new-content .cta-btn:hover {
    text-decoration: none;
    color: #fff;
  }
  .new-content .cta-btn:hover::after {
    opacity: 1;
  }
  .new-content .cta-btn:hover svg {
    transform: translateX(5px);
  }
  /* 外部リンクアイコン: 右上方向にアニメーション */
  .new-content .cta-btn--blank:hover svg {
    transform: translate(3px, -3px);
  }
}

.new-content .cta-btn:focus-visible {
  outline: 3px solid var(--nc-color-primary);
  outline-offset: 3px;
}

.new-content .cta-btn--center {
  display: flex;
  width: fit-content;
  margin: 2rem auto 0;
}

.new-content .cta-btn--sm {
  padding: 10px 25px;
  font-size: 1.125rem;
  gap: 8px;
}

/* アローボタン（白背景 #4）
   Default: 白背景 / #0a62a9 テキスト・ボーダー
   Hover  : #0a62a9 ソリッド背景 / 白テキスト・矢印 5px 右スライド */
.new-content .cta-btn--outline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 5px 20px;
  background: #fff;
  color: #0a62a9;
  border: 1px solid transparent;
  border-radius: 15px;
  font-size: 0.875rem; /* 14px */
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color var(--nc-transition),
    color var(--nc-transition),
    border-color var(--nc-transition);
}

.new-content .cta-btn--outline svg {
  flex-shrink: 0;
  color: inherit;
  transition: transform var(--nc-transition);
}

@media (hover: hover) {
  .new-content .cta-btn--outline:hover {
    background: #0a62a9;
    color: #fff;
    text-decoration: none;
  }
  .new-content .cta-btn--outline:hover svg {
    transform: translateX(5px);
  }
}

.new-content .cta-btn--outline:focus-visible {
  outline: 3px solid var(--nc-color-primary);
  outline-offset: 3px;
}

/* S4: 青カード上の .cta-btn--outline — 白+青2色フォーカスリング (WCAG 2.4.11) */
.new-content .features__card .cta-btn--outline:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--nc-color-primary);
}

/* ===== Component: 画像バナー (.nc-img-banner) ===== */
/* 使い方: <a class="nc-img-banner"> に追加するだけ */

.new-content .nc-img-banner {
  display: block;
  border: 1px solid var(--nc-color-border2);
  overflow: hidden;
  transition: border-color var(--nc-transition);
}

@media (hover: hover) {
  .new-content .nc-img-banner:hover {
    border-color: var(--nc-color-black);
    text-decoration: none;
  }
}

/* ===== Component: 画像明るさ (.nc-img-lighten) ===== */
/* 使い方: <a class="nc-img-lighten"> に追加するだけ */

.new-content .nc-img-lighten img {
  transition: filter var(--nc-transition);
}

@media (hover: hover) {
  .new-content .nc-img-lighten:hover img {
    filter: brightness(1.05);
    text-decoration: none;
  }
}

/* ===== Project: S3 新着情報 ===== */

.new-content .news-section {
  position: relative;
  padding: 160px 0 100px;
  overflow-x: clip;   /* __bg-text の横はみ出しを抑制 */
  overflow-y: visible; /* __bg の top:-52px を切り取らない */
}

@keyframes ncFeaturesFloat {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-15px); }
}

@keyframes ncNewsGrad {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes ncBgGradDiag {
  0%   { background-position: 0% 0%; }
  50%  { background-position: 100% 100%; }
  100% { background-position: 0% 0%; }
}

.new-content .news-section__bg {
  position: absolute;
  top: -42px;
  left: 0;
  right: 0;
  height: 588px; /* Figma PC bg高さに固定 → clip-path角度がテキスト上端と一致 */
  background: linear-gradient(150deg, #0a62a9 0%, #1aafba 50%, #0a62a9 100%);
  background-size: 200% 200%;
  clip-path: polygon(0 0, 100% 16.84%, 100% 100%, 0 83.16%);
  z-index: 0;
}

.new-content .news-section__bg.is-animated {
  animation: ncNewsGrad 8s ease infinite;
}

.new-content .news-section__bg-text {
  font-family: 'Konkhmer Sleokchher', sans-serif;
  font-size: clamp(5rem, 12vw, 9rem);
  color: #fff;
  position: absolute;
  top: auto;
  bottom: calc(100% - 190px); /* Figma: NEWS下端y=248, inner上端y=160 → デスクリプタ補正30px */
  right: 50%;
  transform: translateX(50%);
  width: 100%;
  max-width: 1220px;
  text-align: right;
  line-height: 1;
  z-index: 1;
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
  margin: 0;
}

.new-content .news-section__inner {
  position: relative;
  z-index: 2;
  max-width: 980px;
  margin: 0 auto;
  padding: 30px 50px;
  background: #fff;
  border-radius: 30px;
  overflow: hidden;
}

.new-content .news-section__title {
  font-size: 2.5rem !important;   /* リセット( font-size:inherit !important )を上書き */
  font-weight: 700;
  color: #000;
  margin: 0 0 1.25rem !important; /* リセット( margin:0 !important )を上書き */
  text-align: left !important;
}

.new-content .news-section__title::before,
.new-content .news-section__title::after {
  content: none !important;
}

.new-content .news-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin-bottom: 1.875rem;
}

.new-content .news-filter__tag {
  padding: 6px 15px;
  background: rgba(10, 98, 169, 0.15);
  color: #333;
  border: none;
  border-radius: 16px;
  font-size: 0.875rem;
  font-family: inherit;
  cursor: pointer;
  transition: background var(--nc-transition);
  min-height: 33px;
}

@media (hover: hover) {
  .new-content .news-filter__tag:hover {
    background: rgba(10, 98, 169, 0.28);
  }
}

.new-content .news-filter__tag.is-active,
.new-content .news-filter__tag[aria-pressed="true"] {
  background: #0a62a9;
  color: #fff;
  font-weight: 700;
}

.new-content .news-section__list {
  display: flex;
  flex-direction: column;
  gap: 15px;
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
  background: transparent;
}

.new-content .news-section__item {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  padding: 6px 0;
  background-image: radial-gradient(circle, var(--nc-color-border) 1px, transparent 1px);
  background-size: 6px 3px;
  background-position: left bottom;
  background-repeat: repeat-x;
}

.new-content .news-section__item:last-child {
  background-image: none;
}

.new-content .news-section__item.is-hidden {
  display: none;
}

.new-content .news-section__date {
  flex-shrink: 0;
  font-size: 1rem;
  color: #0a62a9;
  font-weight: 700;
  min-width: 6.5em;
}

.new-content .news-section__text {
  font-size: 1rem;
  line-height: 1.6;
}

.new-content .news-section__text a {
  color: var(--nc-color-text);
}

@media (hover: hover) {
  .new-content .news-section__text a:hover {
    color: var(--nc-color-primary);
    text-decoration: underline;
  }
}

.new-content .news-section__cta-wrap {
  display: none;
}

.new-content .news-section__cta-wrap.is-visible {
  display: flex;
  justify-content: center;
}

.new-content .news-section__list.is-hidden {
  display: none;
}

/* S3 今月の産技高専コンテンツ */
.new-content .news-monthly {
  display: none;
  padding-bottom: 20px;
}

.new-content .news-monthly.is-visible {
  display: block;
}

.new-content .news-monthly__columns {
  display: flex;
  gap: 15px;
  margin-bottom: 1.25rem;
}

.new-content .news-monthly__campus {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 15px;
  min-width: 0;
}

.new-content .news-monthly__campus-head {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.new-content .news-monthly__campus-title {
  font-size: 1.125rem !important;
  font-weight: 700 !important;
  color: #0a62a9 !important;
  text-align: left !important;
  margin: 0 !important;
  padding: 0 !important;
}

.new-content .news-monthly__campus-title::before,
.new-content .news-monthly__campus-title::after {
  content: none !important;
}

.new-content .news-monthly__campus-divider {
  border: none;
  border-bottom: 1px dashed #bbb;
  margin: 0;
}

.new-content .news-monthly__items {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.new-content .news-monthly__item {
  font-size: 1rem;
  line-height: 1.6;
  color: #000;
  margin: 0;
}

.new-content .news-monthly__day {
  display: block;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.4;
}

.new-content .news-monthly__desc {
  display: block;
  font-size: 1rem;
  font-weight: 500;
}

/* S3 オープンカレッジコンテンツ */
.new-content .news-opencollege {
  display: none;
  padding-bottom: 20px;
}

.new-content .news-opencollege.is-visible {
  display: block;
}

.new-content .news-opencollege__cards {
  display: flex;
  gap: 30px;
}

.new-content .news-opencollege__card {
  margin: 0;
  flex: 1 1 0;
  min-width: 0;
  max-width: 480px;
}

.new-content .news-opencollege__link {
  display: block;
}

.new-content .news-opencollege__link img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== Project: S4 Features ===== */

.new-content .features {
  position: relative;
  padding: 100px 0 50px;
}

.new-content .features__inner {
  display: flow-root; /* BFC確立: bg-textのmargin-topコラプスを防ぐ */
  width: 87%;
  max-width: 1080px;
  margin: 0 auto;
}

.new-content .features__bg-text {
  font-family: 'Konkhmer Sleokchher', sans-serif;
  font-size: clamp(3rem, 12vw, 9.375rem);
  background: linear-gradient(168.965deg, #0a62a9 4.2306%, #1aafba 110.8%);
  background-size: 300% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  white-space: nowrap;
  line-height: 0.867; /* = 130px / 150px (Figma line-height) */
  pointer-events: none;
  user-select: none;
}

.new-content .features__bg-text.is-animated {
  animation: ncBgGradDiag 5s ease-in-out infinite;
}

.new-content .features__bg {
  position: absolute;
  top: 100px;
  right: 12.70%; /* Figma: 155px / 1220px = 12.70% */
  width: 191px;
  pointer-events: none;
  user-select: none;
  will-change: transform; /* 視差のためGPUレイヤー昇格 */
}

.new-content .features__bg img {
  width: 100%;
  height: auto;
}


.new-content .features__header {
  margin: 0 auto 3.5rem;
  text-align: left;
}

.new-content .features__title {
  font-size: 2.5rem !important;
  font-weight: 700;
  color: #000;
  margin: 0 0 0.75rem !important;
  text-align: left !important;
}

.new-content .features__title::before,
.new-content .features__title::after {
  content: none !important;
}

.new-content .features__sub {
  font-size: 1.625rem;
  font-weight: 700;
  color: #000;
  line-height: 1.55;
  margin: 0;
}

.new-content .features__block {
  display: flex;
  align-items: flex-end;
  position: relative;
  margin: 0 auto 4.375rem;
}

.new-content .features__block:last-of-type {
  margin-bottom: 0;
}

.new-content .features__block--reverse {
  flex-direction: row-reverse;
}

/* S4: features__block 写真スライドイン */
@media (prefers-reduced-motion: no-preference) {
  .new-content .features__img-wrap {
    transition: transform 0.85s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.85s ease;
  }
  .new-content .features__block:not(.features__block--reverse):not(.is-visible) .features__img-wrap {
    transform: translateX(-60px);
    opacity: 0;
  }
  .new-content .features__block--reverse:not(.is-visible) .features__img-wrap {
    transform: translateX(60px);
    opacity: 0;
  }
}

.new-content .features__img-wrap {
  flex: 0 0 77%;
  position: relative;
  z-index: 0;
  overflow: hidden;
}

/* PC: ブロック別クリップ形状（Figma SVGパスをpolygon%に変換） */
.new-content .features__block--b1 .features__img-wrap {
  /* M0 63 L555.5 0 L832 99 V430.5 L234.5 508 L0 430.5 Z (832×508) */
  clip-path: polygon(0% 12.40%, 66.77% 0%, 100% 19.49%, 100% 84.74%, 28.18% 100%, 0% 84.74%);
}

.new-content .features__block--b2 .features__img-wrap {
  /* M0 24 L223.5 41.5 L832 0 V469 L600.5 426 L0 488.5 Z (832×488.5) */
  clip-path: polygon(0% 4.91%, 26.86% 8.49%, 100% 0%, 100% 96.02%, 72.18% 87.20%, 0% 100%);
}

.new-content .features__block--b3 .features__img-wrap {
  /* M0 153 L254 0 L832 64 V520.5 L514 562 L0 520.5 Z (832×562) */
  clip-path: polygon(0% 27.22%, 30.53% 0%, 100% 11.39%, 100% 92.62%, 61.78% 100%, 0% 92.62%);
}

.new-content .features__img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform var(--nc-transition);
}

.new-content .features__card {
  flex: 0 0 33.6%;
  margin-left: -10.16%; /* Figma: -124px / 1220px = -10.16% */
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-end;
  background: linear-gradient(136.433deg, #0a62a9 4.2306%, #1aafba 110.8%);
  border-radius: 10px;
  padding: 40px 30px 30px 30px;
}

.new-content .features__card--left {
  margin-left: 0;
  margin-right: -10.16%; /* Figma: -124px / 1220px = -10.16% */
  background: linear-gradient(135.018deg, #1aafba 4.2052%, #0a62a9 96.484%);
  padding-right: 25px;  /* Figma PC 94:1283: pr=25px (default is 30px) */
}

.new-content .features__card-inner {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 25px;
  margin-bottom: auto;
}

.new-content .features__card-title {
  /* カード幅（29.23%×(vw-220px)-60px）に10文字フィットするvw計算値: calc(3vw - 13.25px) */
  font-size: clamp(1rem, calc(3vw - 13.25px), 1.875rem) !important;
  font-weight: 700;
  color: #fff;
  line-height: 1.333;  /* Figma PC: leading-[40px] / 30px = 1.333 */
  margin: 0 !important;
}

.new-content .features__card-title::before,
.new-content .features__card-title::after {
  content: none !important;
}

.new-content .features__card-text {
  /* タイトルと同比率でスケール */
  font-size: clamp(0.875rem, calc(1.8vw - 8px), 1.125rem);
  color: #fff;
  line-height: 1.5;  /* Figma: leading-[normal]（日本語 normal ≈ 1.4～1.5） */
  margin: 0;
}

.new-content .features__card-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  color: #0a62a9;
  font-size: 0.875rem;
  font-weight: 700;
  text-decoration: none;
  padding: 5px 20px;
  border-radius: 15px;
  transition: opacity var(--nc-transition);
  align-self: flex-end;
}

@media (hover: hover) {
  .new-content .features__card-btn:hover {
    text-decoration: none;
    opacity: 0.85;
    color: #0a62a9;
  }
}

.new-content .features__num {
  position: absolute;
  bottom: calc(100% - 0.12em);
  right: 0;
  font-family: 'M PLUS 1p', 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: clamp(5rem, 10vw, 7.5rem);
  background: linear-gradient(126.098deg, #0a62a9 4.2306%, #1aafba 110.8%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  line-height: 1;
  pointer-events: none;
  user-select: none;
  margin: 0;
}

.new-content .features__num--left {
  right: auto;
  left: 0;
  background: linear-gradient(126.098deg, #1aafba 4.2306%, #0a62a9 110.8%);
  -webkit-background-clip: text;
  background-clip: text;
}

/* ===== Project: S5 キャンパスライフ + 学生インタビュー ===== */

.new-content .campus-life {
  position: relative;
  padding: 220px 0 80px;
  margin: 100px 0 50px;
    overflow-x: clip;
    overflow-y: visible;
}
.new-content .campus-life__bg {
    position: absolute;
    top: 10px;
    left: 0;
    right: 0;
    height: 87%;
    background: linear-gradient(130deg, #0A62A9 4.23%, #1AAFBA 110.8%);
    background-size: 300% 300%;
    clip-path: polygon(0 75px, 100% 0, 100% 100%, 0 calc(100% - 75px));
    z-index: -1;
}

.new-content .campus-life__bg.is-animated {
  animation: ncBgGradDiag 5s ease-in-out infinite;
}

.new-content .campus-life__bg-text {
  font-family: 'Konkhmer Sleokchher', sans-serif;
  font-size: clamp(3rem, 12vw, 9.375rem);
  color: #fff;
  position: absolute;
  top: 63px;
  right: 50%;
  transform: translateX(50%);
  width: 100%;
  max-width: 1220px;
  text-align: right;
  line-height: 0.867;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  margin: 0;
}

.new-content .campus-life__bg2 {
    position: absolute;
    top: 160px;
    left: -70px;
    width: 458px;
    pointer-events: none;
    user-select: none;
    z-index: -1;
}

.new-content .campus-life__header {
  max-width: var(--nc-max-width);
  margin: 0 auto 4.375rem;
  padding: 0 var(--nc-inner-padding);
  text-align: right;
}

.new-content .campus-life__title {
  font-size: 2.5rem !important;
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.75rem !important;
  text-align: right !important;
}

.new-content .campus-life__title::before,
.new-content .campus-life__title::after {
  content: none !important;
}

.new-content .campus-life__sub {
  font-size: 1.625rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.55;
  margin: 0;
  text-align: right;
}

.new-content .campus-life__cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 25px;
  max-width: var(--nc-max-width);
  margin: 0 auto 2rem;
  padding: 0 var(--nc-inner-padding);
}

.new-content .campus-life__card {
  flex: 0 0 320px;
  width: 320px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 13px;
  padding: 11px 10px;
  text-decoration: none;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
}

@media (hover: hover) {
  .new-content .campus-life__card:hover {
    text-decoration: none;
  }

  .new-content .campus-life__card:hover .campus-life__card-img {
    transform: scale(1.2);
  }

  .new-content .campus-life__card:hover .campus-life__card-label-text {
    background: linear-gradient(165.734deg, #0a62a9 4.23%, #1aafba 110.8%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }

  .new-content .campus-life__card:hover .campus-life__card-label svg {
    transform: translateX(5px);
  }
}

/* S5: 青セクション上 campus-life カード — 白+青2色フォーカスリング (WCAG 2.4.11) */
.new-content .campus-life__card:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--nc-color-primary);
}

.new-content .campus-life__card-img-wrap {
  width: 300px;
  height: 215px;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 15px 15px 0 0;
}

.new-content .campus-life__card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.new-content .campus-life__card-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: transparent;
  color: #0a62a9;
  font-size: 1.125rem;
  font-weight: 700;
}

.new-content .campus-life__card-label-text {
  flex-shrink: 0;
}

.new-content .campus-life__card-label svg {
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.new-content .campus-life__more {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background: #fff;
  border-radius: 15px;
  padding: 10px;
  width: fit-content;
  margin: 0 auto 6rem;
  text-decoration: none;
  color: inherit;
  transition: opacity var(--nc-transition);
}

.new-content .campus-life__more-imgs-wrap {
  overflow: hidden;
  border-radius: 10px 10px 0 0;
}

.new-content .campus-life__more-imgs {
  display: flex;
  gap: 0;
  transition: transform 0.4s ease;
}

.new-content .campus-life__more-imgs img {
  width: 154px;
  height: 107px;
  object-fit: cover;
  border-radius: 0;
  flex-shrink: 0;
}

.new-content .campus-life__more-link {
  display: inline-flex;
  align-items: center;
  gap: 20px;
  color: #0a62a9;
  font-size: 1.125rem;
  font-weight: 700;
  white-space: nowrap;
}

@media (hover: hover) {
  .new-content .campus-life__more:hover {
    text-decoration: none;
  }
  .new-content .campus-life__more:hover .campus-life__more-imgs {
    transform: scale(1.05);
  }
}

/* S5: 青セクション上 campus-life__more — 白+青2色フォーカスリング (WCAG 2.4.11) */
.new-content .campus-life__more:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--nc-color-primary);
}

.new-content .interview {
  max-width: var(--nc-max-width);
  margin: 0 auto;
  padding: 0 var(--nc-inner-padding);
}

.new-content .interview__title {
  font-size: 1.625rem !important;
  font-weight: 700;
  color: #fff;
  margin: 0 0 1.5rem !important;
  text-align: left;
}

.new-content .interview__title::before,
.new-content .interview__title::after {
  content: none !important;
}

.new-content .interview__cards {
  max-width: 1010px;
  margin: 0 0 1.25rem;
  visibility: visible; /* Splide のデフォルト visibility:hidden を上書き（PC は JS 初期化なし） */
}

/* PC: Splide 構造でも 3カラム grid として表示 */
@media (min-width: 768px) {
  .new-content .interview__cards .splide__track {
    overflow: visible;
  }

  .new-content .interview__cards .splide__list {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5625rem;
    margin: 0;
  }

  .new-content .interview__cards .splide__slide {
    width: auto !important;
  }
}

.new-content .interview__card {
  position: relative;
}

.new-content .interview__card-link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
}

@media (hover: hover) {
  .new-content .interview__card-link:hover {
    text-decoration: none;
  }

  .new-content .interview__card-link:hover .interview__img {
    transform: scale(1.2);
  }

  .new-content .interview__card-link:hover .interview__name-text,
  .new-content .interview__card-link:hover .interview__info {
    background: linear-gradient(to right, #0a62a9, #1aafba);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
  }
}

/* S5: 青セクション上インタビューカードリンク — 白+青2色フォーカスリング (WCAG 2.4.11) */
.new-content .interview__card-link:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--nc-color-primary);
}

/* S5: 青セクション上 .cta-btn（インタビューCTA）— 白+青2色フォーカスリング (WCAG 2.4.11) */
.new-content .campus-life .cta-btn:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--nc-color-primary);
}

.new-content .interview__img-wrap {
  border: 10px solid #fff;
  border-radius: 20px 20px 0 0;
  overflow: hidden;
  aspect-ratio: 320 / 480;
}

.new-content .interview__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.new-content .interview__meta {
  position: relative;
  margin-top: -62px;
  padding: 15px 10px;
  background: transparent;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.new-content .interview__name {
  display: inline-block;
  font-size: 1.125rem;
  font-weight: 700;
  background: #fff;
  border-radius: 0 20px 0 0;
  padding: 10px 30px 0 15px;
  margin-bottom: 0;
}

.new-content .interview__name-text {
  display: block;
  color: #000;
}

.new-content .interview__info {
  display: block;
  font-size: 0.875rem;
  color: #000;
  line-height: 1.571;
  padding: 0 15px;
}

/* SP カルーセル UI はデフォルト非表示（SP @media 内で display:flex） */
.new-content .interview__carousel-ui {
  display: none;
}

/* ===== Project: S6 本科紹介 ===== */

.new-content .main-course {
  overflow: hidden;
  position: relative;
}

.new-content .main-course__header {
  position: relative;
  max-width: var(--nc-max-width);
  margin: 0 auto;
  padding: clamp(120px, 20vw, 270px) var(--nc-inner-padding) 30px;
}

.new-content .main-course__bg-text {
  font-family: 'Konkhmer Sleokchher', sans-serif;
  font-size: clamp(3.5rem, 10.42vw, 9.375rem);
  background: linear-gradient(168.965deg, #0a62a9 4.2306%, #1aafba 110.8%);
  background-size: 300% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  position: absolute;
  top: 0.1em;
  left: var(--nc-inner-padding);
  line-height: 0.867;
  pointer-events: none;
  user-select: none;
  margin: 0;
}

.new-content .main-course__bg-text.is-animated {
  animation: ncBgGradDiag 5s ease-in-out infinite;
}

.new-content .main-course__title {
  font-size: 2.5rem !important;
  font-weight: 700;
  color: var(--nc-color-text);
  margin: 0 !important;
  text-align: left !important;
}

.new-content .main-course__title::before,
.new-content .main-course__title::after {
  content: none !important;
}

.new-content .main-course__campus {
  max-width: var(--nc-max-width);
  margin: 0 auto;
  padding-bottom: 60px;
}

.new-content .main-course__hero-wrap {
  position: relative;
  overflow: hidden; /* campus-en がヒーロー画像外（panel領域）にはみ出すのを防ぐ */
}

.new-content .main-course__hero-wrap--right {
  text-align: right;
}

.new-content .main-course__hero {
  aspect-ratio: 992 / 562;
  object-fit: cover;
  display: block;
}

.new-content .main-course__campus--arakawa .main-course__hero {
  aspect-ratio: 1063 / 567;
  margin-right: 0;
  margin-left: auto;
}

.new-content .main-course__campus-en {
  position: absolute;
  bottom: 140px;
  left: 50px;
  font-family: 'Konkhmer Sleokchher', sans-serif;
  font-size: clamp(2.5rem, 6.9vw, 6.25rem);
  color: #fff;
  line-height: 1;
  margin: 0;
  padding: 0 0.25em 0.15em;
  pointer-events: none;
  user-select: none;
}

.new-content .main-course__campus-en--right {
  left: auto;
  right: 50px;
  text-align: right;
}

.new-content .main-course__panel {
  max-width: 1100px;
  margin: -175px auto 3rem;
  position: relative;
  z-index: 1;
  padding: 30px 38px;
  background: #fff;
  border-radius: 30px;
}

.new-content .main-course__panel-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}

.new-content .main-course__campus-name {
  font-size: 2.5rem !important;
  font-weight: 700;
  color: #000;
  margin: 0 !important;
  flex-shrink: 0;
}

.new-content .main-course__campus-name::before,
.new-content .main-course__campus-name::after {
  content: none !important;
}

.new-content .main-course__campus--arakawa .main-course__campus-name {
  color: #000;
}

/* 荒川キャンパス: ボタン・タグは品川と同じ青グラジェント（Figma準拠） */

/* モチーフSVG */
.new-content .main-course__motif {
  position: absolute;
  top: 48px;
  right: 0;
  width: clamp(180px, 29vw, 420px);
  pointer-events: none;
  user-select: none;
  z-index: 0;
  will-change: transform; /* 視差のためGPUレイヤー昇格 */
}

.new-content .main-course__motif img {
  width: 100%;
  height: auto;
  display: block;
}

.new-content .main-course__btns {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-left: auto;
}

.new-content .main-course__imgs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 21px;
  margin-bottom: 1.5rem;
}

.new-content .main-course__imgs img {
  width: 100%;
  aspect-ratio: 240 / 170;
  object-fit: cover;
  display: block;
  border-radius: 4px;
}

.new-content .main-course__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.new-content .main-course__campus--arakawa .main-course__tags {
  gap: 15px;
  justify-content: center;
}

.new-content .main-course__tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  background: rgba(10, 98, 169, 0.15);
  border: none;
  color: #333;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  transition: background var(--nc-transition), color var(--nc-transition), box-shadow var(--nc-transition);
}

.new-content .main-course__tag svg {
  flex-shrink: 0;
  color: inherit;
  transition: transform var(--nc-transition);
}

@media (hover: hover) {
  .new-content .main-course__tag:hover {
    background: transparent;
    box-shadow: 0 0 0 3px rgba(10, 98, 169, 0.15);
    color: #000;
    text-decoration: none;
  }

  .new-content .main-course__tag:hover svg {
    transform: translateX(5px);
  }
}

/* ===== Project: S7 専攻科紹介 ===== */

.new-content .advanced-course {
  position: relative;
  background: #fff;
  overflow: hidden;
}

.new-content .advanced-course__motif {
  position: absolute;
  top: 60px;
  left: 0;
  width: clamp(160px, 23vw, 281px);
  pointer-events: none;
  z-index: 1;
  will-change: transform; /* 視差のためGPUレイヤー昇格 */
}

.new-content .advanced-course__header {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  /* bg-text が 2行（ADVANCED / COURSES）のため padding-top は
     top(0.1em) + 2行高さ(font-size × line-height × 2) = font-size × 1.834 を確保する。
     font-size: clamp(3rem, 12vw, 9.375rem) → 必要 padding: 12vw×1.834 ≈ 22vw
     23vw + 余白・上限 290px（旧270px比+20px）で全幅域での重なりを解消 */
  padding: clamp(150px, 23vw, 290px) 0 30px;
}

.new-content .advanced-course__bg-text {
  font-family: 'Konkhmer Sleokchher', sans-serif;
  font-size: clamp(3rem, 12vw, 9.375rem);
  background: linear-gradient(168.965deg, #0a62a9 4.2306%, #1aafba 110.8%);
  background-size: 300% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  position: absolute;
  top: 0.1em;
  right: 0;
  line-height: 0.867;
  pointer-events: none;
  user-select: none;
  margin: 0;
  text-align: right;
}

.new-content .advanced-course__bg-text.is-animated {
  animation: ncBgGradDiag 5s ease-in-out infinite;
}

.new-content .advanced-course__title {
  font-size: 2.5rem !important;
  font-weight: 700;
  color: var(--nc-color-text);
  margin: 0 !important;
  text-align: right !important;
}

.new-content .advanced-course__title::before,
.new-content .advanced-course__title::after {
  content: none !important;
}

.new-content .advanced-course__body {
  max-width: var(--nc-max-width);
  margin: 0 auto 3rem;
  padding: 0 var(--nc-inner-padding);
}

.new-content .advanced-course__hero-wrap {
  display: block;
  position: relative;
  text-decoration: none;
}

.new-content .advanced-course__hero-frame {
  overflow: hidden;
  line-height: 0;
  /* Figma SVG path: M0 56L279.644 0L1079.5 67.5V578.848L881.5 669.5L0 578.848V56Z (viewBox 1080×670)
     → 6点ポリゴン: (0,56)(279.644,0)(1079.5,67.5)(1079.5,578.848)(881.5,669.5)(0,578.848) */
  clip-path: polygon(0% 8.36%, 25.89% 0%, 100% 10.07%, 100% 86.40%, 81.62% 99.93%, 0% 86.40%);
  /* isolation group: 全子要素を先に合成してからclip-pathを適用（scale後も形状維持） */
  filter: brightness(1);
}

.new-content .advanced-course__hero {
  aspect-ratio: 1080 / 670;
  object-fit: cover;
  display: block;
  width: 100%;
  transition: transform 0.4s ease;
}

.new-content .advanced-course__overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #fff;
  border-radius: 0 30px 0 0;
  padding: 30px 30px 10px;
  max-width: 540px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
}

.new-content .advanced-course__overlay-title {
  font-size: 1.625rem !important;
  font-weight: 700;
  color: #000;
  line-height: 1.538;
  margin: 0 !important;
  padding-bottom: 15px;
  transition: color 0.4s ease;
}

.new-content .advanced-course__overlay-title::before,
.new-content .advanced-course__overlay-title::after {
  content: none !important;
}



/* cta-btnホバー時に hero-wrap 全体もホバー表現を連動させる */

.new-content .advanced-course__hero-wrap:has(.cta-btn:hover) .advanced-course__overlay-title {
  color: #005bac;
}

/* ===== Project: S8 受検情報 ===== */

.new-content .admissions {
  position: relative;
  margin: 100px 0 50px;
  overflow: hidden;
}

.new-content .admissions__bg {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 80%;
  overflow: hidden;
  background: linear-gradient(167.977deg, #0a62a9 4.2306%, #1aafba 110.8%);
  background-size: 200% 200%;
  /* SVG設計値 99px で斜め切り（aspect-ratioを使わず全高に追従） */
  clip-path: polygon(0 0, 100% 99px, 100% 100%, 0 calc(100% - 99px));
  z-index: 0;
}

.new-content .admissions__bg.is-animated {
  animation: ncNewsGrad 8s ease infinite;
}

/* bg-text: .admissions の直接子として配置（overflow:hidden でクリップ） */
.new-content .admissions__bg-text {
  font-family: 'Konkhmer Sleokchher', sans-serif;
  font-size: clamp(3rem, 12vw, 9.375rem);
  color: #fff;
  position: absolute;
  top: 58px; /* section基準34px + bg offset24px = bg要素基準58px */
  left: max(var(--nc-inner-padding), calc(50% - calc(var(--nc-max-width) / 2) + var(--nc-inner-padding)));
  /* 左端からの残り幅に制限（left + max-width = 100%：右端でクリップ） */
  max-width: calc(100% - max(var(--nc-inner-padding), calc(50% - calc(var(--nc-max-width) / 2) + var(--nc-inner-padding))));
  overflow: hidden;
  line-height: 0.867;
  z-index: 1;
  pointer-events: none;
  user-select: none;
  margin: 0;
  white-space: nowrap;
}

/* span は inline のまま <br> で改行（display:block不要） */

.new-content .admissions__inner {
  position: relative;
  z-index: 2;
  max-width: var(--nc-max-width);
  margin: 0 auto;
  /* bg-text底辺 (34px + font-size×1.734) に追従するレスポンシブ値
     font-size=clamp(3rem,12vw,9.375rem) → 20.8vw+50px でほぼ一致 */
  padding: clamp(200px, calc(50px + 20.8vw), 320px) var(--nc-inner-padding) 80px;
}

.new-content .admissions__title {
  font-size: 2.5rem !important;
  font-weight: 700;
  color: #fff;
  margin: 0 0 1.25rem !important;
  text-align: left !important;
}

.new-content .admissions__title::before,
.new-content .admissions__title::after {
  content: none !important;
}

.new-content .admissions__cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 25px;
  max-width: var(--nc-max-width);
  margin: 0 auto 2rem;
}

.new-content .admissions__card {
  background: #fff;
  border-radius: 20px;
  flex: 0 0 320px;
  width: 320px;
  overflow: hidden;
}

.new-content .admissions__card-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 13px;
  padding: 11px 10px;
  width: 100%;
  text-decoration: none;
  color: var(--nc-color-text);
}

@media (hover: hover) {
  .new-content .admissions__card-link:hover {
    text-decoration: none;
  }

  .new-content .admissions__card-link:hover .admissions__card-img {
    transform: scale(1.2);
  }

  .new-content .admissions__card-link:hover .admissions__card-label {
    background: linear-gradient(165.734deg, #0a62a9 4.23%, #1aafba 110.8%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }

  .new-content .admissions__card-link:hover .admissions__card-label svg {
    transform: translateX(5px);
    color: #1aafba;
  }
}

/* S8: overflow:hidden でクリップされるため、リンク自身のアウトラインを抑制 */
.new-content .admissions__card-link:focus-visible {
  outline: none;
}

/* S8: 親カードにフォーカスリングを移譲 — 白+青2色リング (WCAG 2.4.11) */
.new-content .admissions__card:has(.admissions__card-link:focus-visible) {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--nc-color-primary);
}

.new-content .admissions__card-img-wrap {
  width: 300px;
  height: 215px;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 15px 15px 0 0;
}

.new-content .admissions__card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.new-content .admissions__card-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: transparent;
  color: #0a62a9;
  font-size: 1.125rem;
  font-weight: 700;
}

.new-content .admissions__card-label svg {
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

/* ===== Project: S9 バナーエリア ===== */

.new-content .banner-section {
  padding: 40px 0;
  background: #efefef;
}

.new-content .banner-section__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
  max-width: var(--nc-max-width);
  margin: 0 auto;
  padding: 0 var(--nc-inner-padding);
}

/* ホバースタイルは .nc-img-banner に委譲 */

.new-content .banner-section__item img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
}

/* ===== Responsive ===== */

/* KV: floating カードが controls と重なる幅で縦積みに（コンテナクエリ） */
@container kv (max-width: 960px) {
  .kv__floating {
    flex-direction: column;
  }
}

/* PC: サイドバー有り */
@media (min-width: 1024.98px) {
  .new-content {
    width: calc(100vw - 220px);
  }
}

/* Tablet: サイドバー崩壊後 */
@media (max-width: 1024px) {
  .new-content {
    --nc-inner-padding: 30px;
    width: 100%;
  }
}

/* SP: Figma SP版準拠 */
@media (max-width: 767px) {
  .new-content {
    --nc-inner-padding: 25px;
  }

  /* S1 KV: SP版は画面高さいっぱいに表示
     #header-menu は fixed・高さ74px（≤1024px）のため 100svh - 74px で画面ちょうどに収める */
  .new-content .kv__media {
    aspect-ratio: unset;
    height: calc(100vh - 74px);   /* fallback for older browsers */
    height: calc(100svh - 74px);  /* small viewport height - fixed header */
    max-height: none;
  }

  /* S1 KV: ボタン位置を左上に変更 */
  .new-content .kv__controls {
    top: 19px;
    bottom: auto;
    left: 13px;
  }

  /* S1 KV: floating を1個のみ表示、中央配置 */
  .new-content .kv__floating {
    bottom: 27px;
    right: 50%;
    transform: translateX(50%);
    padding-right: 0;
  }

  .new-content .kv__floating-card:nth-child(2) {
    display: none;
  }

  .new-content .kv__floating-card {
    width: 274px;
  }

  /* S2 カルーセル: SP コントロールバー調整 */
  /* SP: controls全幅・ドット左寄せ・ボタン右端 */
  .new-content .news-carousel__controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: auto;
    margin-top: 20px;
  }

  .new-content .news-carousel__dots {
    position: static;
    transform: none;
    gap: 5px;
  }

  .new-content .news-carousel__btns {
    position: static;
    transform: none;
  }
}

/* ===== S3-S9 Responsive ===== */

/* Tablet (≤1024px) */
@media (max-width: 1024px) {

  .new-content .main-course__imgs {
    grid-template-columns: repeat(2, 1fr);
  }

  /* S4: サイドバーなし時のカード文字スケール（カード内容幅 29.23vw-60px に10文字フィット） */
  .new-content .features__card-title {
    font-size: clamp(1rem, calc(2.923vw - 6px), 1.875rem) !important;
  }

  .new-content .features__card-text {
    font-size: clamp(0.875rem, calc(1.75vw - 3.6px), 1.125rem);
  }
}

/* Mobile (≤767px) */
@media (max-width: 767px) {
  .new-content .news-section {
    padding: 40px 0 50px;
  }

  .new-content .news-section__inner {
    max-width: 87%;
    padding: 30px var(--nc-inner-padding);
  }

  .new-content .news-section__bg {
    /* Figma SP: M0 0 L390 38 V527 L0 489 → 38/527=7.21%, 489/527=92.79% */
    height: 527px;
    clip-path: polygon(0 0, 100% 7.21%, 100% 100%, 0 92.79%);
  }

  .new-content .news-section__bg-text {
    font-size: 3.75rem;
    bottom: calc(100% - 53px); /* Figma: NEWS下端y=54, inner上端y=40 → デスクリプタ補正13px込み */
    right: 0;
    transform: translateX(0);
  }

  .new-content .news-section__title {
    font-size: 1.875rem !important;
  }

  .new-content .news-filter {
    gap: 10px;
  }

  .new-content .news-filter__tag {
    font-size: 0.875rem;
    padding: 6px 14px;
  }

  .new-content .news-section__item {
    flex-direction: column;
    gap: 0.25rem;
    padding: 0 0 10px;
  }

  .new-content .news-monthly__columns {
    flex-direction: column;
    align-items: center;
    gap: 30px;
    margin-bottom: 1.875rem;
  }

  .new-content .news-monthly__campus {
    width: 290px;
  }

  .new-content .news-opencollege__cards {
    flex-direction: column;
    align-items: center;
  }

  .new-content .news-opencollege__card {
    flex: none;
    width: 290px;
  }

  .new-content .news-section__cta-wrap.is-visible .cta-btn {
    width: 300px;
    justify-content: center;
    padding: 15px 18px;
    font-size: 0.875rem;
    gap: 12px;
  }

  .new-content .features {
    padding: 75px 0 50px; /* Figma SP: h2 は section top から y=75 */
  }


  .new-content .features__bg-text {
    font-size: 3.75rem;
  }

  .new-content .features__bg {
    top: 115px; /* Figma SP: モチーフ y=115 (= h2 y=75 + 40px) */
    right: 0;
    width: 104px;
  }

  /* SP: image+card side-overlap (絶対配置でFigma SP再現) */
  .new-content .features__block {
    display: block;
    padding: 0;
    padding-bottom: 150px;  /* カードが画像下にはみ出す分 */
    margin-bottom: 3rem;
  }
  
  .new-content .features__block:not(.features__block--reverse) {
    margin-left: -7.5%;  /* Figma SP: 画像幅83%に対してカード幅70%が左にはみ出す分 */
  }

  .new-content .features__block.features__block--reverse {
    margin-right: -7.5%;  /* Figma SP: 画像幅83%に対してカード幅70%が右にはみ出す分 */
  }

  .new-content .features__img-wrap {
    flex: none;
    width: 83%;
    height: 260px;  /* object-fit:cover で縦比率を固定 */
    overflow: hidden;
  }

  .new-content .features__block--reverse .features__img-wrap {
    margin-left: auto;
    margin-right: 0;
  }

  .new-content .features__img {
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .new-content .features__title {
    font-size: 1.875rem !important;  /* 30px */
  }

  .new-content .features__sub {
    font-size: 1.375rem;  /* 22px */
    line-height: 1.364;
  }

  .new-content .features__card {
    position: absolute;
    top: 148px;  /* 画像高さ260px × 57% ≈ 148px (Figma SP: card top 280/380=73.7%) */
    right: 0;
    left: auto;
    flex: none;
    width: 70%;
    margin: 0;
    padding: 30px 15px 20px;
  }

  .new-content .features__card--left {
    right: auto;
    left: 0;
    margin: 0;
  }

  .new-content .features__card-inner {
    gap: 10px;
    margin-bottom: 0;
  }

  .new-content .features__card-title {
    font-size: 1.375rem !important;  /* 22px */
  }

  .new-content .features__card-text {
    font-size: 1rem;  /* 16px */
  }

  /* SP number: カード上辺に数字下辺を合わせる */
  .new-content .features__num {
    bottom: calc(100% - 0.12em);
    top: auto;
    right: 0;
    left: auto;
    font-size: 4.375rem;  /* 70px */
  }

  .new-content .features__num--left {
    right: auto;
    left: 0;
  }

  /* SP: features__block--b1 固有（Figma SP node 94:969 実測値）*/
  .new-content .features__block--b1 {
    padding-bottom: 175px;  /* img(380) + card overflow(160) + 余裕 */
  }

  .new-content .features__block--b1 .features__img-wrap {
    height: 380px;  /* Figma SP: 379.732px */
    /* M2.987 25.795 L230.662 0 L325.487 44 V284.851 L100.813 379.732 L0 348 Z (325.487×379.732) */
    clip-path: polygon(0.92% 6.79%, 70.86% 0%, 100% 11.59%, 100% 75.01%, 30.97% 100%, 0% 91.64%);
  }

  .new-content .features__block--b1 .features__card {
    top: 280px;  /* Figma SP: card top=280px（画像高さ380pxの73.7%） */
  }

  /* SP: features__block--b2 固有（Figma SP node 94:981 実測値）*/
  .new-content .features__block--b2 {
    padding-bottom: 140px;  /* img(445) + card overflow(~87px) + 余裕 */
  }

  .new-content .features__block--b2 .features__img-wrap {
    height: 445px;  /* Figma SP: 445px */
    /* M0 0 L216.648 35 L323.611 23 V445 L91.4046 404.5 L45.6108 422.5 Z (323.611×445) */
    clip-path: polygon(0% 0%, 66.94% 7.87%, 100% 5.17%, 100% 100%, 28.24% 90.90%, 14.09% 94.94%);
  }

  .new-content .features__block--b2 .features__card {
    top: 271px;  /* Figma SP: card top=271px（画像高さ445pxの60.9%） */
  }

  /* SP: features__block--b3 固有（Figma SP node 94:993 実測値）*/
  .new-content .features__block--b3 {
    padding-bottom: 185px;  /* img(368) + card overflow(~165px) + 余裕 */
  }

  .new-content .features__block--b3 .features__img-wrap {
    height: 368px;  /* Figma SP: 367.5px */
    /* M0 49 L83 0 L324 23 V321 L142.5 367.5 L0 349 Z (324×367.5) */
    clip-path: polygon(0% 13.33%, 25.62% 0%, 100% 6.26%, 100% 87.35%, 43.98% 100%, 0% 94.97%);
  }

  .new-content .features__block--b3 .features__card {
    top: 314px;  /* Figma SP: card top=314px（画像高さ368pxの85.3%） */
  }

  .new-content .campus-life {
    padding: 200px 0 60px;
  }

  /* SP: bg の傾き角度を Figma 実測値（約38px）に合わせる */
  .new-content .campus-life__bg {
    top: 30px;
    clip-path: polygon(0 38px, 100% 0, 100% 100%, 0 calc(100% - 38px));
  }

  /* SP: bg-text を右端に 2行表示（CAMPUS / LIFE） */
  .new-content .campus-life__bg-text {
    left: auto;
    right: -5px;
    top: 47px;
    transform: translateX(0);
    font-size: 3.75rem; /* 60px */
    text-align: right;
    white-space: normal;
    width: min-content;
    line-height: 1.083; /* 65px / 60px */
  }

  .new-content .campus-life__title {
    font-size: 1.875rem !important;
  }

  .new-content .campus-life__sub {
    font-size: 1.375rem;
    line-height: 1.364;
  }

  /* flex に変更したのでカード列数は自然に 1列になる（320px カードが 325px 幅に 1枚） */
  .new-content .campus-life__cards {
    gap: 20px;
  }

  .new-content .campus-life__more {
    flex-direction: column;
    align-items: center;
    gap: 10px;
    max-width: 320px;
    padding: 10px;
  }

  /* SP: 4枚を 2×2 グリッド、gap なし・各コーナーに10pxのradius */
  .new-content .campus-life__more-imgs-wrap {
    border-radius: 10px;
    width: 300px;
  }

  .new-content .campus-life__more-imgs {
    display: flex;
    flex-wrap: wrap;
    width: 300px;
    gap: 0;
  }

  .new-content .campus-life__more-imgs img {
    width: 150px;
    height: 107px;
    border-radius: 0;
    object-fit: cover;
  }

  .new-content .interview__title {
    font-size: 1.375rem !important;
  }

  /* SP: インタビュー Splide カルーセル */
  .new-content .interview__carousel-ui {
    display: flex;
    position: relative;
    height: 50px;
    margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
  }

  .new-content .interview__carousel-dots {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    display: flex;
    align-items: center;
    gap: 5px;
  }

  .new-content .interview__carousel-dot {
    width: 10px;
    min-height: 44px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .new-content .interview__carousel-dot::after {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #d9d9d9;
    transition: background var(--nc-transition), transform var(--nc-transition);
  }

  .new-content .interview__carousel-dot.is-active::after {
    background: #0a62a9;
  }

  @media (hover: hover) {
    .new-content .interview__carousel-dot:hover::after,
    .new-content .interview__carousel-dot:focus-visible::after {
      background: #0a62a9;
      transform: scale(1.2);
    }
  }

  .new-content .interview__carousel-btns {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    gap: 10px;
  }

  /* 矢印ボタン: news-carousel__arrow と同スタイル */
  .new-content .interview__carousel-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    min-width: 44px;
    min-height: 44px;
    background: linear-gradient(136deg, #0a62a9 4.23%, #1aafba 110.8%);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
    color: #fff;
    transition: transform var(--nc-transition), filter var(--nc-transition);
  }

  /* --- 非アクティブ（終端）: グレー・ポインター無効 --- */
  .new-content .interview__carousel-arrow.is-disabled {
    background: #ddd;
    cursor: default;
    pointer-events: none;
  }

  @media (hover: hover) {
    .new-content .interview__carousel-arrow:not(.is-disabled):hover,
    .new-content .interview__carousel-arrow:not(.is-disabled):focus-visible {
      filter: brightness(1.2);
      transform: scale(1.2);
    }
  }

  /* SP: インタビュー矢印 — 白+青2色フォーカスリング (WCAG 2.4.11) */
  .new-content .interview__carousel-arrow:not(.is-disabled):focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
    box-shadow: 0 0 0 6px var(--nc-color-primary);
  }

  .new-content .interview__carousel-arrow svg {
    width: 50px;
    height: 50px;
    flex-shrink: 0;
  }

  .new-content .campus-life__more-link {
    gap: 5px;
  }

  .new-content .interview .cta-btn {
    font-size: 1rem;
    width: 320px;
    justify-content: center;
  }

  .new-content .advanced-course__header {
    max-width: calc(100% - 24px);
    padding-top: 150px;
  }

  .new-content .main-course__campus {
    margin-bottom: 5rem;
  }

  .new-content .main-course__campus:last-child {
    margin-bottom: 0;
  }

  .new-content .main-course__campus-en {
    bottom: 117px; /* パネルの重なり(130px)より上に表示 */
    left: 25px;
  }
  .new-content .main-course__campus-en--right {
    right: 25px;
    left: auto;
  }

  .new-content .main-course__panel {
    margin: 0 25px 2rem;
    padding: 30px 20px;
  }

  .new-content .main-course__campus-name {
    font-size: 1.625rem !important;
  }

  .new-content .main-course__panel-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

  .new-content .main-course__imgs {
    display: none;
  }

  .new-content .main-course__btns {
    flex-direction: column;
    width: 100%;
  }

  .new-content .main-course__btns .cta-btn {
    width: 100%;
    justify-content: center;
    font-size: 1rem;
  }

  /* SP: hero を縦長のSP画像に対応 */
  .new-content .main-course__hero {
    width: calc(100% - 48px);
    aspect-ratio: unset;
    max-height: none;
  }

  /* SP: 荒川 hero は右寄せ */
  .new-content .main-course__campus--arakawa .main-course__hero {
    width: calc(100% - 48px);
    aspect-ratio: unset;
    margin-left: auto;
    display: block;
  }

  /* SP: パネルをhero画像と重ねる */
  .new-content .main-course__panel {
    margin: -130px 25px 2rem;
  }

  /* SP: タグを全幅行スタイルに変更 */
  .new-content .main-course__tags {
    flex-direction: column;
    gap: 15px;
  }

  .new-content .main-course__campus--arakawa .main-course__tags {
    justify-content: flex-start;
  }

  .new-content .main-course__tag {
    width: 100%;
    justify-content: space-between;
    border-radius: 20px;
    padding: 10px 18px;
  }

  /* SP: モチーフ */
  .new-content .main-course__motif {
    width: 214px;
    top: 83px;
    right: auto;
    left: 180px;
  }

  .new-content .advanced-course__motif {
    top: 41px;
    left: -56px;
    width: clamp(100px, 45vw, 176px);
  }

  .new-content .advanced-course__bg-text {
    font-size: 3.75rem;
    line-height: 65px;
  }

  .new-content .advanced-course__title {
    font-size: 1.875rem !important;
  }

  .new-content .advanced-course__hero-frame {
    /* SVGパス座標をパーセントに変換（admissions-bg-sp.svg viewBox:390×1108.5）
       SVG傾き(38/390)をhero縦横比(599/339)で補正: (38/390)÷(599/339)×100 = 5.51% */
    clip-path: polygon(0% 0%, 100% 5.51%, 100% 100%, 0% 94.49%);
  }

  .new-content .advanced-course__hero {
    aspect-ratio: 339 / 599;
    max-height: none;
  }

  .new-content .advanced-course__overlay {
    width: 279px;
    max-width: 279px;
    border-radius: 0 30px 0 0;
    padding: 30px 30px 10px 0;
    bottom: 0;
    left: 0;
  }

  .new-content .advanced-course__overlay-title {
    font-size: 1.375rem !important;
    line-height: 1.364;
    margin: 0 !important;
    padding-bottom: 0;
  }

  .new-content .advanced-course__overlay .cta-btn {
    height: 40px;
    border-radius: 20px;
    font-size: 0.875rem;
    padding: 5px 20px;
  }

  /* SP: セクション上部 30px (Figma section pt:30px) */
  .new-content .admissions {
    padding-top: 30px;
  }

  .new-content .admissions__bg {
    bottom: 0;
    /* SP: 3枚縦積みレイアウトに合わせ、最終カード画像下辺で切れるよう調整 */
    height: 88%;
    clip-path: polygon(0 0, 100% 38px, 100% 100%, 0 calc(100% - 38px));
  }

  /* SP: .admissions 直接子として絶対配置 */
  .new-content .admissions__bg-text {
    top: 24px;
    left: var(--nc-inner-padding);
    padding: 0;
    line-height: 60px;
    white-space: nowrap;
    max-width: calc(100% - var(--nc-inner-padding));
    overflow: hidden;
  }

  /* SP: bg-text をフローから外したため padding-top を補正
     bg-text top:34px(section基準) + 高さ120px(2行×60px) + 余白 = 160px */
  .new-content .admissions__inner {
    padding: 140px var(--nc-inner-padding) 80px;
  }

  .new-content .admissions__title {
    font-size: 1.875rem !important;
  }

  .new-content .admissions__cards {
    gap: 20px;
  }

  .new-content .banner-section__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
}

/* Small mobile (≤480px) */
@media (max-width: 480px) {
  /* campus-life__cards は flex に変更済みなので grid 指定不要 */
}

/* アニメーション無効化 */
@media (prefers-reduced-motion: reduce) {
  .new-content,
  .new-content *,
  .new-content *::before,
  .new-content *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .new-content .kv__video {
    animation: none;
  }
}

/* ===== 動画ツアー モーダル ===== */

/* Scoping: .new-content 内で fixed 配置 (body スクロール制御は JS 側) */

.new-content .video-modal {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  /* top: header(90px) + close btn overhang(35px) + 20px余白 = 145px */
  /* left/right: close btn overhang(35px) + 20px余白 = 55px（左右対称で水平中央維持） */
  padding: calc(90px + 55px) 55px 20px;
  overflow: hidden; /* __dialog に max-height 設定済みのため scrollbar 不要・右端グレー帯防止 */
}

.new-content .video-modal[hidden] {
  display: none;
}

/* オーバーレイ（半透明黒幕） */
.new-content .video-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
}

/* ダイアログ本体（close ボタンのアンカー） */
.new-content .video-modal__dialog {
  position: relative;
  z-index: 1;
  /*
   * video-wrap の max-width: min(900px, (100dvh-325px)×16/9) と連動して縮む。
   * dialog の横幅 = video幅 + box border(30) + box padding(110) + 視覚的slack(90)
   * → min(1130px, (100dvh-325px)×16/9 + 230px)
   * 高さが831px未満のビューポートで dialog と video-wrap が同期して縮小する。
   */
  max-width: min(1130px, calc((100dvh - 325px) * (16 / 9) + 230px));
  min-width: 600px;
  width: 100%;
  /*
   * close btn overhang = 35px（70px / 2）
   * modal padding-top = 145px（header 90 + 35 + 20余白）
   * フレックス中央揃えで dialog が上にはみ出ると close btn がヘッダーに重なるため、
   * dialog の高さを「padding-top = 145px ちょうどから始まる」高さに制限する。
   * max-height = 100dvh - padding-top - padding-bottom = 100dvh - 145 - 20 = 100dvh - 165px
   */
  max-height: calc(100dvh - 165px);
  display: flex;
  flex-direction: column;
}

/* モーダルボックス（白い枠） */
.new-content .video-modal__box {
  background: #fff;
  border: 15px solid rgba(10, 98, 169, 0.15);
  padding: 30px 55px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* dialog の max-height に合わせて縮む */
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

/* タイトル */
.new-content .video-modal__title {
  font-size: 1.625rem; /* 26px */
  font-weight: 700;
  color: #0a62a9;
  line-height: 2.5rem; /* 40px */
  text-align: center;
  margin: 0 0 20px;
}

/* モーダルタイトル内 改行ユーティリティ
   <br class="nc-br-pc"> → PCのみ改行 / <br class="nc-br-sp"> → SPのみ改行 */
.new-content .nc-br-pc { display: block; }
.new-content .nc-br-sp { display: none;  }

/* 動画ラッパー（16:9 維持） */
.new-content .video-modal__video-wrap {
  width: 100%;
  /*
   * dialog max-height(100dvh-165) から非動画要素の高さを引いて逆算した幅上限（16:9維持）
   * 非動画オーバーヘッド = box border(30) + box padding(70) + title(60) = 160px
   * → max-width = (100dvh - 165 - 160) * 16/9 = (100dvh - 325px) * (16/9)
   */
  max-width: min(900px, calc((100dvh - 325px) * (16 / 9)));
  aspect-ratio: 16 / 9;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}

.new-content .video-modal__iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
  display: none;
}

.new-content .video-modal__iframe.is-playing {
  display: block;
}

/* ポスター（サンネイル + 再生ボタン） */
.new-content .video-modal__poster {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.new-content .video-modal__poster.is-hidden {
  display: none;
}

.new-content .video-modal__poster-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.new-content .video-modal__play-btn {
  position: relative;
  z-index: 1;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.25));
  will-change: transform; /* GPU レイヤーを常時昇格 → filter との compositing タイミングズレ防止 */
  transition: transform var(--nc-transition), opacity var(--nc-transition), filter var(--nc-transition);
}

.new-content .video-modal__play-btn:hover {
  transform: scale(1.08);
  opacity: 0.9;
}

.new-content .video-modal__play-btn:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 4px;
  border-radius: 50%;
}

/* 閉じるボタン */
.new-content .video-modal__close {
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(50%, -50%);
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: linear-gradient(166.65deg, #0a62a9 4.23%, #1aafba 110.8%);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  padding: 0;
  flex-shrink: 0;
  transition: opacity var(--nc-transition);
}

.new-content .video-modal__close:hover,
.new-content .video-modal__close:focus-visible {
  opacity: 0.85;
}

.new-content .video-modal__close:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

/* Tablet 以下: ヘッダー高さ74px に合わせオフセット調整 */
@media (max-width: 1024px) {
  .new-content .video-modal {
    padding: calc(74px + 55px) 55px 20px;
  }
}

/* SP (≦767px) */
@media (max-width: 767px) {
  .new-content .video-modal {
    /* SP close btn は40px → overhang 20px + 15px余白 = 35px */
    padding: calc(74px + 35px) 25px 15px;
  }

  .new-content .video-modal__dialog {
    max-width: 640px;
    /* SP: padding-top(109) + padding-bottom(15) = 124px */
    max-height: calc(100dvh - 124px);
  }

  .new-content .video-modal__box {
    border-width: 10px;
    padding: 10px 15px 15px;
  }

  .new-content .video-modal__title {
    font-size: 0.875rem; /* 14px */
    line-height: 1.375rem; /* 22px */
    text-align: left;
    width: 100%;
    margin-bottom: 15px;
  }

  .new-content .nc-br-pc { display: none;  }
  .new-content .nc-br-sp { display: block; }

  .new-content .video-modal__close {
    width: 40px;
    height: 40px;
  }

  .new-content .video-modal__close svg {
    width: 16px;
    height: 16px;
  }

  .new-content .video-modal__play-btn svg {
    width: 50px;
    height: 50px;
  }
}
