@charset "UTF-8";
/* 1440pxの文字サイズ。下限はスマホのpxで、狭い画面ではそれより小さくしない */
/* FVなど、1440pxを超えても画面幅に合わせる文字 */
/* 行間は1440px時点の、文字サイズに対する比率 */
/* ---------------------------------------------
   基本設定
--------------------------------------------- */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  box-sizing: border-box;
}

*, *::before, *::after {
  box-sizing: inherit;
}

/* ---------------------------------------------
   マージン／パディング初期化
--------------------------------------------- */
body, h1, h2, h3, h4, h5, h6, p,
ul, ol, li, dl, dt, dd,
figure, blockquote, pre,
fieldset, legend {
  margin: 0;
  padding: 0;
}

/* ---------------------------------------------
   ベース要素（値は持たせない）
--------------------------------------------- */
body {
  text-rendering: optimizeSpeed;
}

/* ---------------------------------------------
   タイポグラフィ初期化
--------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

strong, b {
  font-weight: inherit;
}

em, i {
  font-style: inherit;
}

/* ---------------------------------------------
   リスト／リンク
--------------------------------------------- */
ul, ol {
  list-style: none;
}

a {
  color: inherit;
  text-decoration: none;
  transition: opacity 0.3s ease;
}

a:hover,
a:focus-visible {
  opacity: 0.8;
}

/* ---------------------------------------------
   メディア要素
--------------------------------------------- */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

svg {
  vertical-align: middle;
}

/* ---------------------------------------------
   テーブル
--------------------------------------------- */
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

/* ---------------------------------------------
   フォーム要素
--------------------------------------------- */
input, button, textarea, select {
  font: inherit;
  color: inherit;
  background: transparent;
  border: none;
  outline: none;
}

button {
  cursor: pointer;
}

textarea {
  resize: vertical;
}

/* ---------------------------------------------
   フォーカス（アクセシビリティ）
--------------------------------------------- */
:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* ---------------------------------------------
   WordPress固有要素対策
--------------------------------------------- */
.alignnone,
.aligncenter,
.alignright,
.alignleft {
  display: block;
  margin: 0 auto;
}

.wp-caption {
  max-width: 100%;
}

/* ---------------------------------------------
   電話番号リンク無効化（PCのみ）
--------------------------------------------- */
@media (hover: hover) {
  .tel-link {
    pointer-events: none;
    cursor: text;
  }
}
/* ---------------------------------------------
   html / body
--------------------------------------------- */
html {
  overflow-x: hidden;
}

body {
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(0.875rem, 1.6vw, 0.9rem);
  line-height: 1.5;
  color: #1c1c1c;
  background-color: #fff;
  overflow-x: hidden;
}

/* ---------------------------------------------
   テキスト要素
--------------------------------------------- */
p {
  font-size: clamp(0.875rem, 1.6vw, 0.9rem);
}

small {
  font-size: clamp(0.75rem, 1.4vw, 0.75rem);
}

/* ---------------------------------------------
   リンク
--------------------------------------------- */
a {
  color: inherit;
}

/* ---------------------------------------------
   ページ内アンカーリンク
   固定ヘッダー（高さ70px）に見出しが隠れないよう、
   id属性を持つ要素全般にスクロール位置の余白を確保する
   （JS：initAnchorScroll と対で使用。JS未実行時のフォールバックにもなる）
--------------------------------------------- */
:where([id]) {
  scroll-margin-top: 70px;
}

/* ------------------------------------------------------------------------------
  レイアウト : ヘッダー
------------------------------------------------------------------------------ */
.l-header {
  position: relative;
  z-index: 20;
  background: #fff;
  color: #18242c;
}

.l-header__pill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 94px;
  padding: 0 29px;
  gap: 24px;
}

.l-header__logo {
  width: 280px;
  max-width: 42vw;
  flex-shrink: 0;
}
.l-header__logo a {
  display: block;
  line-height: 0;
}

.l-header__logo-img {
  display: block;
  width: 100%;
  height: auto;
}

.l-header__nav {
  margin-left: auto;
}

.l-header__menu {
  display: flex;
  align-items: center;
  gap: 48px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.l-header__menu-item a {
  position: relative;
  display: inline-block;
  color: #18242c;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  /* 文字幅と同じ下線。文字の 5px 下、太さ 2px。
     表示は左端から右へ開く。ホバーアウトは右端を軸に、左から右へ消える */
}
.l-header__menu-item a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -7px;
  left: 0;
  height: 2px;
  background: #d11031;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (hover: hover) {
  .l-header__menu-item a:hover::after {
    transform: scaleX(1);
    transform-origin: left center;
  }
}
@media (prefers-reduced-motion: reduce) {
  .l-header__menu-item a::after {
    transition: none;
  }
}
.l-header__hamburger {
  display: none;
  position: relative;
  z-index: 30;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.l-header__hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  margin: 5px auto;
  background: #18242c;
}

.l-header__mask {
  display: none;
}

/* ------------------------------------------------------------------------------
  スマホメニュー（980px以下）
------------------------------------------------------------------------------ */
@media (max-width: 980px) {
  /* ロゴが縮んだ分、バーの高さも詰める */
  .l-header__pill {
    min-height: 72px;
  }
  .l-header__hamburger {
    display: block;
    margin-left: auto;
  }
  .l-header__nav {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 25;
    width: min(80%, 320px);
    height: 100vh;
    height: 100dvh;
    margin: 0;
    padding: 94px 24px 40px;
    background: #fff;
    transform: translateX(100%);
    visibility: hidden;
    transition: transform 0.4s ease, visibility 0.4s ease;
  }
  .l-header__nav.active {
    transform: translateX(0);
    visibility: visible;
  }
  .l-header__menu {
    flex-direction: column;
    align-items: flex-start;
    gap: 28px;
  }
  .l-header__menu-item a {
    font-size: 16px;
  }
  .l-header__mask {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 15;
    background: #000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.4s ease, visibility 0.4s ease;
  }
  .l-header__mask.active {
    opacity: 0.5;
    visibility: visible;
    pointer-events: auto;
  }
  .l-header__hamburger.active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }
  .l-header__hamburger.active span:nth-child(2) {
    opacity: 0;
  }
  .l-header__hamburger.active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }
  .l-header__hamburger.active span {
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
}
html.is-header-menu-open {
  overflow: hidden;
}

/* ------------------------------------------------------------------------------
  レイアウト : フッター
------------------------------------------------------------------------------ */
/* 帯リボン（アニメ前は静的配置） */
.sec-footer-ribbon {
  position: relative;
  z-index: 2;
  margin-bottom: -80px;
  line-height: 0;
  pointer-events: none;
}
.sec-footer-ribbon img {
  display: block;
  width: 100%;
  height: auto;
}

/* よくあるご質問の下端に帯を重ね、FVの太い帯と同じくブラウザ幅いっぱいに出す */
body:has(.sec-qa) .sec-footer-ribbon {
  height: 35.2083333333vw;
  margin-top: -17.2222222222vw;
  margin-bottom: -17.0138888889vw;
  overflow: hidden;
}
body:has(.sec-qa) .sec-footer-ribbon img {
  position: absolute;
  top: 0;
  left: -5.5555555556%;
  width: 105.5555555556%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

/* 見えたらFVの太い帯と同じく、左から右へ出す */
html.is-footer-ribbon .sec-footer-ribbon {
  opacity: 0;
  clip-path: inset(0 100% 0 0);
}

/* 今後の展望の下端に帯を重ねる。Figmaの bottom_ribbon はセクション下端から262px上、フッターへ245px入る */
body:has(.sec-future) .sec-footer-ribbon {
  height: 35.2083333333vw;
  margin-top: -18.1944444444vw;
  margin-bottom: -17.0138888889vw;
  overflow: hidden;
}
body:has(.sec-future) .sec-footer-ribbon img {
  position: absolute;
  top: 0;
  left: -5.5555555556%;
  width: 105.5555555556%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

/* 帯のアニメーション前、セクション間の隙間をフッターの赤で埋める */
body:has(.sec-qa) .sec-footer,
body:has(.sec-future) .sec-footer {
  z-index: 0;
}

body:has(.sec-qa) .sec-footer::before,
body:has(.sec-future) .sec-footer::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 100%;
  left: 0;
  height: 1.6666666667vw;
  background: #d11031;
}

.sec-footer {
  position: relative;
  z-index: 1;
  background: #d11031;
  color: #fff;
}

.sec-footer__inner {
  position: relative;
  max-width: 1440px;
  margin: 0 auto;
  padding: 100px 24px 48px;
}

/* 帯がブラウザ幅に合わせて高くなる分、文言を帯の下へ下げる */
body:has(.sec-qa) .sec-footer__inner {
  padding-top: max(100px, 6.9444444444vw);
}

.sec-footer__catch {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
}

.sec-footer__label {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.4;
}

.sec-footer__label-line {
  display: block;
  width: 306px;
  max-width: 100%;
  height: auto;
  margin-top: 12px;
}

.sec-footer__title {
  margin: 16px 0 0;
  font-size: 64px;
  font-weight: 800;
  line-height: 70px;
}

.sec-footer__lead {
  margin: 20px 0 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 30px;
}

.sec-footer__nav {
  margin-top: 56px;
}

.sec-footer__nav-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 16px;
  font-weight: 600;
  line-height: 30px;
  letter-spacing: 0.05em;
}
.sec-footer__nav-list li {
  display: flex;
  align-items: center;
}
.sec-footer__nav-list li:not(:last-child)::after {
  content: "|";
  margin: 0 0.75em;
}
.sec-footer__nav-list a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.sec-footer__pagetop {
  position: fixed;
  right: 44px;
  /* コピーライト1行分（上下20px + 行高30px）の上、内側下端から24px */
  bottom: 94px;
  /* フッターの外に置き、帯やヘッダーより手前に出す */
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: 20px;
  background: #ba112a;
  opacity: 0;
  visibility: hidden;
  transform: translateY(16px);
  pointer-events: none;
  transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s linear 0.4s;
}
.sec-footer__pagetop.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s linear 0s;
}

/* 円は固定。矢印は上へ抜け、次の矢印が下から入る */
.sec-footer__pagetop-box {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.sec-footer__pagetop-track {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.4s ease;
}

.sec-footer__pagetop-arrow {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  transform: translate(-50%, -50%);
}
.sec-footer__pagetop-arrow img {
  display: block;
  width: 100%;
  height: auto;
  transform: rotate(90deg);
}
.sec-footer__pagetop-arrow {
  /* 次の矢印はボタン1つ分下で待つ */
}
.sec-footer__pagetop-arrow + .sec-footer__pagetop-arrow {
  top: 150%;
}

@media (hover: hover) {
  .sec-footer__pagetop:hover .sec-footer__pagetop-track {
    transform: translateY(-100%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .sec-footer__pagetop,
  .sec-footer__pagetop.is-visible {
    transform: none;
    transition: none;
  }
  .sec-footer__pagetop-track {
    transition: none;
  }
  .sec-footer__pagetop:hover .sec-footer__pagetop-track {
    transform: none;
  }
}
.sec-footer__copyright {
  margin: 0;
  padding: 20px 16px;
  background: #ba112a;
  color: #fff;
  font-size: 13px;
  font-weight: 400;
  line-height: 30px;
  letter-spacing: 0.15em;
  text-align: center;
}

@media (max-width: 768px) {
  /* 固定のお問い合わせバーが無いページでは、最下部に白い余白を出さない */
  body:not(:has(.l-footer-fixed)) {
    padding-bottom: 0;
  }
  .sec-footer__inner {
    padding-right: 20px;
    padding-bottom: 72px;
    padding-left: 20px;
  }
  .sec-footer__title {
    font-size: 36px;
    line-height: 1.25;
  }
  .sec-footer__label,
  .sec-footer__lead {
    font-size: 16px;
    line-height: 1.7;
  }
  /* 文字のまとまりを中央に置き、下線はラベルの文字幅だけにする */
  .sec-footer__catch {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: fit-content;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
  }
  .sec-footer__label {
    width: fit-content;
    padding-bottom: 12px;
    background-image: linear-gradient(#ba112a, #ba112a);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% 4px;
  }
  .sec-footer__label-line {
    display: none;
  }
  .sec-footer__nav {
    margin-top: 32px;
  }
  .sec-footer__nav-list {
    font-size: 14px;
    line-height: 1.6;
  }
  /* コピーライトの上。帯と同じ暗い赤なので、本文の赤の上に乗せる */
  .sec-footer__pagetop {
    right: 16px;
  }
  .sec-footer__copyright {
    padding: 16px 20px;
    letter-spacing: 0.04em;
    line-height: 1.6;
  }
}
/* 1行に収まらない幅では、リンクを縦に積んで区切り線を出さない */
@media (max-width: 520px) {
  .sec-footer__nav-list {
    flex-direction: column;
    gap: 8px;
  }
  .sec-footer__nav-list li:not(:last-child)::after {
    content: none;
  }
}
/* ------------------------------------------------------------------------------
  コンポーネント : セクション見出し
------------------------------------------------------------------------------ */
.c-index-title {
  color: #18242c;
}

.c-index-title__en {
  margin: 0;
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  font-weight: 700;
  font-style: italic;
  line-height: 1;
  letter-spacing: 0.1em;
  color: #d11031;
}

.c-index-title__ja {
  margin: 0;
  font-size: 36px;
  font-weight: 800;
  line-height: 70px;
}

@media (max-width: 768px) {
  .c-index-title__ja {
    font-size: 28px;
    line-height: 1.4;
  }
}
/* ------------------------------------------------------------------------------
  コンポーネント : 矢印付きテキストリンク
------------------------------------------------------------------------------ */
.c-view-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 5px 3px;
  border-bottom: 2px solid #d11031;
  color: #18242c;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 30px;
  text-decoration: none;
}

.c-view-more__icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}

/* 円は固定。矢印だけを三共と同じく2枚スライドさせる */
.c-view-more__arrow-box {
  display: block;
  width: 20px;
  height: 20px;
  overflow: hidden;
  border-radius: 50%;
  background: #d11031;
}

.c-view-more__arrow-track {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.4s ease;
}

.c-view-more__arrow {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
}
.c-view-more__arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}
.c-view-more__arrow {
  /* 次の矢印は進行方向の逆（左下）で待つ */
}
.c-view-more__arrow + .c-view-more__arrow {
  transform: translate(-100%, 100%);
}

@media (hover: hover) {
  .c-view-more:hover .c-view-more__arrow-track {
    transform: translate(100%, -100%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .c-view-more__arrow-track {
    transition: none;
  }
  .c-view-more:hover .c-view-more__arrow-track {
    transform: none;
  }
}
/* ------------------------------------------------------------------------------
  産学連携とは
------------------------------------------------------------------------------ */
/* メインビジュアル */
.sec-about-fv {
  position: relative;
  width: 100%;
  aspect-ratio: 1440/420;
  overflow: hidden;
  background: #fff;
}

/* 街並み。上部は白グラデーションで空に溶かす */
.sec-about-fv__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.sec-about-fv__bg img {
  position: absolute;
  top: -91.29%;
  left: 0;
  width: 100%;
  height: 214.45%;
  max-width: none;
}
.sec-about-fv__bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 60.2380952381%;
  background: linear-gradient(to top, rgba(255, 255, 255, 0.1) 12.981%, #fff 97.115%);
  pointer-events: none;
}

.sec-about-fv__body {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.sec-about-fv__shadow {
  position: absolute;
  top: -6.25vw;
  left: -0.2777777778vw;
  width: 54.7222222222vw;
  height: 36.3888888889vw;
  max-width: none;
  pointer-events: none;
}

.sec-about-fv__label,
.sec-about-fv__title,
.sec-about-fv__lead,
.sec-about-fv__label-line {
  position: absolute;
  margin: 0;
}

.sec-about-fv__label {
  top: 4.1666666667vw;
  left: 11.5277777778vw;
  color: #18242c;
  font-size: max(14px, 24 / 1440 * 100vw);
  font-weight: 600;
  line-height: 1.5;
}

.sec-about-fv__label-line {
  top: 7.5694444444vw;
  left: 11.5277777778vw;
  width: 21.25vw;
  height: 0.2777777778vw;
}

.sec-about-fv__title {
  top: 8.6805555556vw;
  left: 11.0416666667vw;
  color: #18242c;
  font-size: max(32px, 64 / 1440 * 100vw);
  font-weight: 800;
  line-height: 1.09375;
}

.sec-about-fv__title-em {
  color: #d11031;
}

.sec-about-fv__lead {
  top: 15.1388888889vw;
  left: 11.0416666667vw;
  color: #18242c;
  font-size: max(16px, 24 / 1440 * 100vw);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0.05em;
}

/* 下端の赤い帯。FVに重ね、右端はビューポートに合わせる */
.sec-about-fv__bottom-ribbon {
  position: relative;
  z-index: 4;
  height: 35.2083333333vw;
  margin-top: -18.125vw;
  /* 帯の下の白余白をさらに詰める。帯の最下端から約18px。帯はクリックを通す */
  margin-bottom: calc(-7.0757078729vw - 32px);
  overflow: hidden;
  pointer-events: none;
}
.sec-about-fv__bottom-ribbon img {
  position: absolute;
  top: 0;
  left: -3.8194444444%;
  width: 105.5555555556%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

/* 広い画面は帯が縦に伸び、左のパンくずとの空きだけ増える。帯の曲線に合わせ、詰めすぎないよう80px戻す */
@media (min-width: 1441px) {
  .sec-about-fv__bottom-ribbon {
    margin-bottom: calc(-17.04vw + 138px);
  }
}
/* 出現前。JSが html に is-about-fv を付けたときだけ隠す */
html.is-about-fv .sec-about-fv__bg,
html.is-about-fv .sec-about-fv__bottom-ribbon,
html.is-about-fv .sec-about-fv__body {
  opacity: 0;
}
html.is-about-fv .sec-about-fv__body {
  transform: translateY(24px);
}
html.is-about-fv .sec-about-fv__bottom-ribbon {
  clip-path: inset(0 100% 0 0);
}

@media (prefers-reduced-motion: reduce) {
  html.is-about-fv .sec-about-fv__bg,
  html.is-about-fv .sec-about-fv__bottom-ribbon,
  html.is-about-fv .sec-about-fv__body {
    opacity: 1;
    transform: none;
    clip-path: none;
  }
}
/* 768px以下。下層ページなのでトップより抑え、街並みは細い帯にする */
@media (max-width: 768px) {
  .sec-about-fv {
    aspect-ratio: auto;
    padding: 24px 20px calc(20px + 6vw);
  }
  /* 空を文字の後ろに残し、下端に街並みが見える切り抜き。上の白グラデーションはPCと同じ */
  .sec-about-fv__bg img {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 36%;
  }
  .sec-about-fv__body {
    position: relative;
    inset: auto;
    width: max-content;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
  }
  /* 文字のまとまりの中央。街並み全体は覆わない */
  .sec-about-fv__shadow {
    top: 50%;
    left: 50%;
    width: 150%;
    height: 158%;
    transform: translate(-50%, -50%);
  }
  .sec-about-fv__label,
  .sec-about-fv__title,
  .sec-about-fv__lead,
  .sec-about-fv__label-line {
    position: relative;
    top: auto;
    left: auto;
    width: auto;
    height: auto;
  }
  .sec-about-fv__label {
    width: fit-content;
    padding-bottom: 12px;
    font-size: 14px;
    background-image: linear-gradient(#d11031, #d11031);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% 4px;
  }
  .sec-about-fv__label-line {
    display: none;
  }
  .sec-about-fv__title {
    margin-top: 12px;
    font-size: 32px;
  }
  .sec-about-fv__lead {
    margin-top: 16px;
    font-size: 16px;
  }
  /* フッターの帯と同じ重なり。文字には被せず、街並みの下端に乗せる */
  .sec-about-fv__bottom-ribbon {
    margin-top: -17.2222222222vw;
  }
  .sec-about-fv__bottom-ribbon img {
    left: -5.5555555556%;
  }
}
/* イントロ */
.sec-about {
  position: relative;
  z-index: 1;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-about__frame {
  position: relative;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0548611111 * min(100vw, 1440px));
  padding-bottom: calc(0.0368055556 * min(100vw, 1440px));
}

/* 左右のイラスト。元画像全体を入れる */
.sec-about__illust {
  position: absolute;
  z-index: 0;
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}

.sec-about__illust--left {
  top: calc(0.00625 * min(100vw, 1440px));
  left: calc(-0.1145833333 * min(100vw, 1440px));
  width: calc(0.3125 * min(100vw, 1440px));
  height: calc(0.2083333333 * min(100vw, 1440px));
}

.sec-about__illust--right {
  top: calc(0.0756944444 * min(100vw, 1440px));
  left: calc(0.6423611111 * min(100vw, 1440px));
  width: calc(0.3125 * min(100vw, 1440px));
  height: calc(0.2083333333 * min(100vw, 1440px));
}

/* 本文だけをまとめて出す。左右イラストはパララックスのまま */
.sec-about__copy {
  position: relative;
  z-index: 1;
}

.sec-about__lead,
.sec-about__text {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  text-align: center;
}

.sec-about__lead {
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: 1.6666666667;
}

.sec-about__text {
  width: 77.5833333333%;
  margin-top: calc(0.0194444444 * min(100vw, 1440px));
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: 2.4;
}

/* 768px以下。本文を先に、イラストはその下 */
@media (max-width: 768px) {
  .sec-about__frame {
    display: flex;
    flex-direction: column;
    width: auto;
    padding: 8px 20px 0;
  }
  .sec-about__illust {
    position: relative;
    height: auto;
  }
  .sec-about__copy {
    order: 1;
  }
  /* 画面幅の64%。左端は画面の外へ */
  .sec-about__illust--left {
    order: 2;
    top: auto;
    left: auto;
    width: 64vw;
    max-width: 384px;
    margin-top: 16px;
    margin-bottom: 0;
    margin-left: calc(-20px - 6.4vw);
  }
  /* 画面幅の64%。右端は画面の外へ。上の透過と下の透過を重ねて隙間を詰める */
  .sec-about__illust--right {
    order: 3;
    top: auto;
    left: auto;
    width: 64vw;
    max-width: 384px;
    margin-top: -6vw;
    margin-bottom: -6vw;
    margin-left: auto;
    margin-right: calc(-20px - 6.4vw);
  }
  .sec-about__lead {
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-about__text {
    width: auto;
    margin-top: 16px;
    font-size: 15px;
    line-height: 1.8;
  }
}
/* 480px以下。PC用の改行だと行が折り返すので、文として流す */
@media (max-width: 480px) {
  .sec-about__lead br,
  .sec-about__text br {
    display: none;
  }
}
/* 取り組みの背景 */
.sec-background {
  position: relative;
  z-index: 1;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-background__frame {
  position: relative;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0347222222 * min(100vw, 1440px));
  padding-bottom: calc(0.0409722222 * min(100vw, 1440px));
}

.sec-background__head {
  position: relative;
  z-index: 1;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-background__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-background__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-background__body {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: calc(0.0354166667 * min(100vw, 1440px));
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
  padding-bottom: calc(0.0277777778 * min(100vw, 1440px));
}

/* 写真と本文を横並びのまままとめて出す。丸の装飾は含めない */
.sec-background__main {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: calc(0.0354166667 * min(100vw, 1440px));
  width: 100%;
}

.sec-background__photo {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: calc(0.375 * min(100vw, 1440px));
  height: calc(0.2534722222 * min(100vw, 1440px));
  border-radius: calc(0.0069444444 * min(100vw, 1440px));
  object-fit: cover;
}

.sec-background__copy {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: calc(0.4166666667 * min(100vw, 1440px));
}

.sec-background__lead {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-background__text {
  margin: calc(0.0090277778 * min(100vw, 1440px)) 0 0;
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(36 / 15);
}

/* 装飾の丸 */
.sec-background__dot {
  position: absolute;
  z-index: 0;
  max-width: none;
  pointer-events: none;
}

.sec-background__dot--blue {
  top: calc(-0.0069444444 * min(100vw, 1440px));
  left: calc(0.8270833333 * min(100vw, 1440px));
  width: calc(0.0159722222 * min(100vw, 1440px));
  height: calc(0.0159722222 * min(100vw, 1440px));
}

.sec-background__dot--pink {
  top: calc(0.1951388889 * min(100vw, 1440px));
  left: calc(-0.0416666667 * min(100vw, 1440px));
  width: calc(0.1083333333 * min(100vw, 1440px));
  height: calc(0.1083333333 * min(100vw, 1440px));
}

.sec-background__dot--pink-sm {
  top: calc(0.3638888889 * min(100vw, 1440px));
  left: calc(0.7041666667 * min(100vw, 1440px));
  width: calc(0.0347222222 * min(100vw, 1440px));
  height: calc(0.0347222222 * min(100vw, 1440px));
}

/* 1280px以下。写真を上、文章を下にする。行間は2.1まで寄せる */
@media (max-width: 1280px) {
  .sec-background__main {
    flex-direction: column;
    align-items: stretch;
    gap: 28px;
  }
  .sec-background__photo {
    width: 100%;
    height: auto;
  }
  .sec-background__copy {
    width: 100%;
  }
  .sec-background__text {
    line-height: 2.1;
  }
}
/* 768px以下。見出し、写真、本文の順に積む */
@media (max-width: 768px) {
  .sec-background {
    width: 100%;
  }
  .sec-background__frame {
    width: 100%;
    padding: 16px 20px 48px;
  }
  .sec-background__head {
    height: auto;
  }
  .sec-background__head .c-index-title__en {
    position: relative;
    top: auto;
    left: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-background__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-background__body {
    margin-top: 24px;
    padding-bottom: 0;
  }
  .sec-background__main {
    flex-direction: column;
    align-items: stretch;
    gap: 20px;
  }
  .sec-background__photo {
    width: 100%;
    height: auto;
    border-radius: 10px;
  }
  .sec-background__copy {
    width: 100%;
  }
  .sec-background__lead {
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-background__text {
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.9;
  }
  /* 写真の右上、左下、本文の右下 */
  .sec-background__dot--blue {
    top: -6px;
    left: auto;
    right: 4px;
    width: 16px;
    height: 16px;
  }
  .sec-background__dot--pink {
    top: calc(0.42 * (100vw - 40px));
    left: -32px;
    width: 80px;
    height: 80px;
  }
  .sec-background__dot--pink-sm {
    top: auto;
    bottom: 16px;
    left: auto;
    right: 0;
    width: 32px;
    height: 32px;
  }
}
/* 取り組みの目的 */
.sec-purpose {
  position: relative;
  /* 下の活動リボンより手前 */
  z-index: 2;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-purpose__frame {
  position: relative;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0347222222 * min(100vw, 1440px));
  padding-bottom: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-purpose__head {
  position: relative;
  z-index: 1;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-purpose__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-purpose__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-purpose__lead {
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 calc(0.0430555556 * min(100vw, 1440px));
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-purpose__list {
  display: flex;
  align-items: stretch;
  gap: calc(0.03125 * min(100vw, 1440px));
  margin: 0;
  padding: 0 0 calc(0.0208333333 * min(100vw, 1440px));
  list-style: none;
}

.sec-purpose__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(0.0125 * min(100vw, 1440px));
  flex: 0 0 auto;
  width: calc(0.2569444444 * min(100vw, 1440px));
  min-height: calc(0.2152777778 * min(100vw, 1440px));
  padding: calc(0.0125 * min(100vw, 1440px)) calc(0.0152777778 * min(100vw, 1440px));
  border-top: calc(0.0034722222 * min(100vw, 1440px)) solid #d11031;
  background: rgba(238, 238, 238, 0.5);
}

.sec-purpose__num {
  margin: 0;
  color: rgba(24, 36, 44, 0.3);
  font-family: "Figtree", sans-serif;
  font-size: max(28px, 36 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  font-style: italic;
  line-height: max(26px, 0.0180555556 * min(100vw, 1440px));
}

.sec-purpose__card-title {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 20 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(26 / 20);
}

.sec-purpose__card-text {
  margin: 0;
  color: #18242c;
  font-size: max(15px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 16);
}

/* 1280px以下。3枚のカードを縦に積む */
@media (max-width: 1280px) {
  .sec-purpose__list {
    flex-direction: column;
    gap: 20px;
  }
  .sec-purpose__card {
    width: 100%;
  }
}
/* 768px以下。見出し、リード、カードの順に積む */
@media (max-width: 768px) {
  .sec-purpose {
    width: 100%;
  }
  .sec-purpose__frame {
    width: 100%;
    padding: 40px 20px 48px;
  }
  .sec-purpose__head {
    height: auto;
  }
  .sec-purpose__head .c-index-title__en {
    position: relative;
    top: auto;
    left: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-purpose__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-purpose__lead {
    margin: 16px 0 24px;
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-purpose__list {
    flex-direction: column;
    gap: 16px;
    padding-bottom: 0;
  }
  .sec-purpose__card {
    width: 100%;
    min-height: 0;
    gap: 12px;
    padding: 16px 18px 18px;
    border-top-width: 5px;
  }
  .sec-purpose__num {
    font-size: 28px;
    line-height: 1;
  }
  .sec-purpose__card-title {
    font-size: 18px;
    line-height: 1.5;
  }
  .sec-purpose__card-text {
    font-size: 15px;
    line-height: 1.8;
  }
}
/* 学校と実施する主な活動 */
.sec-about-together {
  position: relative;
  z-index: 1;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-about-together__frame {
  position: relative;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0347222222 * min(100vw, 1440px));
  padding-bottom: calc(0.0694444444 * min(100vw, 1440px));
}

/* 上にはみ出す赤い帯 */
.sec-about-together__ribbon {
  position: absolute;
  z-index: 0;
  top: calc(-0.3027777778 * min(100vw, 1440px));
  left: calc(-0.1305555556 * min(100vw, 1440px));
  width: calc(1.5083333333 * min(100vw, 1440px));
  height: calc(0.5027777778 * min(100vw, 1440px));
  max-width: none;
  pointer-events: none;
  /* 1440pxの右端あたりで、担当者リボンと同じように背景へ消す */
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 64%, transparent 75%);
  mask-image: linear-gradient(to right, #000 0%, #000 64%, transparent 75%);
}

/* 担当者リボンと同じ。写真が画面下に入るまで左端に隠す */
html.is-about-ribbon .sec-about-together__ribbon {
  clip-path: inset(0 100% 0 0);
}

/* 見出しとリードをまとめて出す。リボンはワイプのまま */
.sec-about-together__intro {
  position: relative;
  z-index: 1;
}

.sec-about-together__head {
  position: relative;
  z-index: 1;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-about-together__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-about-together__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-about-together__lead {
  position: relative;
  z-index: 1;
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-about-together__card {
  position: relative;
  z-index: 1;
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
  border-radius: calc(0.0138888889 * min(100vw, 1440px));
  background: #fff;
  filter: drop-shadow(0 calc(0.0027777778 * min(100vw, 1440px)) calc(0.0069444444 * min(100vw, 1440px)) rgba(0, 0, 0, 0.25));
}

.sec-about-together__swiper {
  overflow: hidden;
  border-radius: inherit;
}

.sec-about-together__swiper .swiper-wrapper {
  display: flex;
}

.sec-about-together__swiper .swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: auto;
}

.sec-about-together__slide {
  display: flex;
  align-items: flex-start;
  gap: calc(0.0277777778 * min(100vw, 1440px));
  min-height: calc(0.2951388889 * min(100vw, 1440px));
  padding: calc(0.0208333333 * min(100vw, 1440px));
}

.sec-about-together__photo {
  flex: 0 0 auto;
  width: calc(0.375 * min(100vw, 1440px));
  height: calc(0.2534722222 * min(100vw, 1440px));
  border-radius: calc(0.0069444444 * min(100vw, 1440px));
  object-fit: cover;
}

.sec-about-together__copy {
  flex: 1 1 auto;
  min-width: 0;
}

.sec-about-together__school {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0 calc(0.0138888889 * min(100vw, 1440px));
  border: 1px solid #d11031;
  border-radius: calc(0.0138888889 * min(100vw, 1440px));
  background: rgba(209, 16, 49, 0.1);
  color: #d11031;
  font-size: max(13px, 14 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(40 / 14);
  white-space: nowrap;
}

.sec-about-together__title {
  margin: calc(0.0159722222 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
  white-space: nowrap;
}

.sec-about-together__date {
  margin: calc(-0.0069444444 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(12px, 12 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(40 / 12);
}

.sec-about-together__text {
  min-height: calc(0.0993055556 * min(100vw, 1440px));
  margin: calc(0.0111111111 * min(100vw, 1440px)) 0 0;
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(36 / 15);
}

.sec-about-together__link {
  display: inline-flex;
  align-items: center;
  gap: calc(0.0055555556 * min(100vw, 1440px));
  margin-top: calc(0.0118055556 * min(100vw, 1440px));
  padding: 0 calc(0.0034722222 * min(100vw, 1440px)) calc(0.0020833333 * min(100vw, 1440px));
  border-bottom: calc(0.0013888889 * min(100vw, 1440px)) solid #d11031;
  color: #18242c;
  font-size: max(15px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 16);
  text-decoration: none;
}

/* 円は固定。矢印だけを斜めにスライドさせる */
.sec-about-together__icon {
  flex: 0 0 auto;
  width: calc(0.0138888889 * min(100vw, 1440px));
  height: calc(0.0138888889 * min(100vw, 1440px));
}

.sec-about-together__arrow-box {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 50%;
  background: #d11031;
}

.sec-about-together__arrow-track {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.4s ease;
}

.sec-about-together__arrow {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sec-about-together__arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}
.sec-about-together__arrow {
  /* 次の矢印は進行方向の逆（左下）で待つ */
}
.sec-about-together__arrow + .sec-about-together__arrow {
  transform: translate(-100%, 100%);
}

@media (hover: hover) {
  .sec-about-together__link:hover .sec-about-together__arrow-track {
    transform: translate(100%, -100%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .sec-about-together__arrow-track {
    transition: none;
  }
  .sec-about-together__link:hover .sec-about-together__arrow-track {
    transform: none;
  }
}
.sec-about-together__pager {
  position: absolute;
  z-index: 2;
  right: calc(0.0274305556 * min(100vw, 1440px));
  bottom: calc(0.03125 * min(100vw, 1440px));
  display: flex;
  align-items: center;
  gap: calc(0.0138888889 * min(100vw, 1440px));
}

.sec-about-together__prev,
.sec-about-together__next {
  flex: 0 0 auto;
  width: calc(0.0326388889 * min(100vw, 1440px));
  height: calc(0.0326388889 * min(100vw, 1440px));
  padding: 0;
}
.sec-about-together__prev svg,
.sec-about-together__next svg {
  display: block;
  width: 100%;
  height: 100%;
}
.sec-about-together__prev circle,
.sec-about-together__next circle {
  fill: #fff;
  stroke: #ccc;
  transition: fill 0.4s ease, stroke 0.4s ease;
}
.sec-about-together__prev line,
.sec-about-together__next line {
  stroke: #d11031;
  transition: stroke 0.4s ease;
}

/* ホバー時はページトップボタンと同じ配色 */
@media (hover: hover) {
  .sec-about-together__prev:hover circle,
  .sec-about-together__next:hover circle {
    fill: #ba112a;
    stroke: #ba112a;
  }
  .sec-about-together__prev:hover line,
  .sec-about-together__next:hover line {
    stroke: #fff;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sec-about-together__prev circle,
  .sec-about-together__prev line,
  .sec-about-together__next circle,
  .sec-about-together__next line {
    transition: none;
  }
}
.sec-about-together__count {
  display: flex;
  align-items: center;
  gap: calc(0.0138888889 * min(100vw, 1440px));
  margin: 0;
  line-height: 26px;
}

.sec-about-together__current {
  color: #d11031;
  font-size: max(18px, 20 / 1440 * min(100vw, 1440px));
  font-weight: 500;
}

.sec-about-together__total {
  color: #000;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  font-weight: 500;
}

/* 1280px以下。写真を上、文章を下にする */
@media (max-width: 1280px) {
  .sec-about-together__slide {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
    min-height: 0;
  }
  .sec-about-together__swiper .swiper-wrapper {
    align-items: flex-start;
  }
  .sec-about-together__card {
    padding-bottom: 50px;
  }
  .sec-about-together__photo {
    width: 100%;
    height: auto;
  }
  .sec-about-together__school,
  .sec-about-together__title {
    white-space: normal;
  }
  .sec-about-together__text {
    line-height: 2.1;
  }
  .sec-about-together__pager {
    position: static;
    justify-content: center;
    margin-top: 8px;
  }
}
/* 768px以下。見出し、カードの順。カード内は写真の下に文章 */
@media (max-width: 768px) {
  .sec-about-together {
    width: 100%;
  }
  .sec-about-together__frame {
    width: 100%;
    padding: 36px 20px 48px;
  }
  .sec-about-together__head {
    height: auto;
  }
  .sec-about-together__head .c-index-title__en {
    position: relative;
    top: auto;
    left: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-about-together__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-about-together__lead {
    margin-top: 16px;
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-about-together__card {
    margin-top: 24px;
    padding-bottom: 50px;
    border-radius: 16px;
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.18));
  }
  .sec-about-together__slide {
    flex-direction: column;
    gap: 16px;
    min-height: 0;
    padding: 16px 16px 8px;
  }
  .sec-about-together__photo {
    width: 100%;
    height: auto;
    border-radius: 10px;
  }
  .sec-about-together__school {
    padding: 0 14px;
    border-radius: 16px;
    font-size: 13px;
    line-height: 32px;
    white-space: normal;
  }
  .sec-about-together__title {
    margin-top: 12px;
    font-size: 18px;
    line-height: 1.5;
    white-space: normal;
  }
  .sec-about-together__date {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.6;
  }
  .sec-about-together__text {
    min-height: 0;
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.8;
  }
  .sec-about-together__link {
    margin-top: 16px;
    font-size: 15px;
    line-height: 1.6;
  }
  .sec-about-together__icon {
    width: 20px;
    height: 20px;
  }
  .sec-about-together__pager {
    position: static;
    justify-content: center;
    gap: 12px;
    margin: 4px 0 0;
  }
  .sec-about-together__prev,
  .sec-about-together__next {
    width: 44px;
    height: 44px;
  }
  .sec-about-together__count {
    gap: 12px;
    line-height: 1;
  }
  .sec-about-together__current {
    font-size: 18px;
  }
  .sec-about-together__total {
    font-size: 14px;
  }
}
/* 大切にしている進め方。背景と上下の曲線だけブラウザ幅いっぱい */
.sec-approach {
  position: relative;
  z-index: 1;
  width: 100%;
  background: #fff4f5;
}

.sec-approach__wave {
  position: absolute;
  left: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 1440/85;
  pointer-events: none;
}
.sec-approach__wave img {
  display: block;
  width: 100%;
  height: 100%;
}

.sec-approach__wave--top {
  top: 0;
  transform: scaleY(-1);
}

.sec-approach__wave--bottom {
  bottom: 0;
}

.sec-approach__frame {
  position: relative;
  z-index: 1;
  width: calc(0.8333333333 * min(100%, 1440px));
  margin-right: auto;
  margin-left: auto;
  /* 曲線の高さ + もともとの空き + 追加50px。広い画面で曲線が伸びても空きは50px増える */
  padding-top: calc(5.9027777778% + 0.0347222222 * min(100vw, 1440px) + 50px);
  padding-bottom: calc(5.9027777778% + 0.0694444444 * min(100vw, 1440px) + 50px);
}

.sec-approach__head {
  position: relative;
  z-index: 1;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-approach__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-approach__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-approach__lead {
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-approach__list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(0.0173611111 * min(100vw, 1440px));
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 0;
  padding: 0;
  list-style: none;
}

.sec-approach__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.sec-approach__card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: calc(0.1770833333 * min(100vw, 1440px));
  padding: 0 calc(0.0486111111 * min(100vw, 1440px)) 0 calc(0.0277777778 * min(100vw, 1440px));
  border: 1px solid #ccc;
  border-radius: calc(0.0069444444 * min(100vw, 1440px));
  background: #fff;
  box-shadow: 0 calc(0.0027777778 * min(100vw, 1440px)) calc(0.0034722222 * min(100vw, 1440px)) rgba(0, 0, 0, 0.1);
}

.sec-approach__num {
  flex: 0 0 auto;
  width: calc(0.0444444444 * min(100vw, 1440px));
  margin: 0;
  color: #d11031;
  font-family: "Figtree", sans-serif;
  font-size: max(28px, 48 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  font-style: italic;
  line-height: max(28px, 0.0208333333 * min(100vw, 1440px));
}

.sec-approach__photo {
  flex: 0 0 auto;
  width: calc(0.2638888889 * min(100vw, 1440px));
  height: calc(0.1756944444 * min(100vw, 1440px));
  object-fit: cover;
}

.sec-approach__line {
  flex: 0 0 auto;
  width: 1px;
  height: calc(0.1270833333 * min(100vw, 1440px));
  background: rgba(24, 36, 44, 0.3);
}

.sec-approach__copy {
  flex: 0 0 auto;
  width: calc(0.3680555556 * min(100vw, 1440px));
}

.sec-approach__title {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 20 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(26 / 20);
}

.sec-approach__text {
  margin: calc(0.0166666667 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(15px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 16);
}

.sec-approach__arrow {
  display: block;
  width: calc(0.0270833333 * min(100vw, 1440px));
  height: calc(0.0145833333 * min(100vw, 1440px));
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
}

/* 1280px以下。番号、イラスト、文章の順に積む */
@media (max-width: 1280px) {
  .sec-approach__card {
    flex-direction: column;
    align-items: stretch;
    /* 番号と文章が枠に付かないようにする */
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .sec-approach__photo,
  .sec-approach__copy {
    width: 100%;
    height: auto;
  }
  .sec-approach__line {
    display: none;
  }
}
/* 768px以下。カード内は番号、イラスト、文章の順 */
@media (max-width: 768px) {
  .sec-approach__frame {
    width: 100%;
    padding: 56px 20px 64px;
  }
  .sec-approach__head {
    height: auto;
  }
  .sec-approach__head .c-index-title__en {
    position: relative;
    top: auto;
    left: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-approach__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-approach__lead {
    margin-top: 16px;
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-approach__list {
    gap: 0;
    margin-top: 24px;
  }
  .sec-approach__card {
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    padding: 16px 16px 18px;
    border-radius: 10px;
    gap: 0;
  }
  .sec-approach__num {
    width: auto;
    font-size: 28px;
    line-height: 1;
  }
  .sec-approach__photo {
    width: 100%;
    height: auto;
    /* 画像上端の透過分だけ上げて、イラストを番号の直下に置く */
    margin-top: calc(4px - 5.6%);
  }
  .sec-approach__line {
    display: none;
  }
  .sec-approach__copy {
    width: 100%;
    margin-top: 8px;
  }
  .sec-approach__title {
    font-size: 18px;
    line-height: 1.5;
  }
  .sec-approach__text {
    margin-top: 8px;
    font-size: 15px;
    line-height: 1.8;
  }
  .sec-approach__arrow {
    width: 28px;
    height: auto;
    margin-top: 16px;
    margin-bottom: 16px;
  }
}
/* 提供できること */
.sec-offer {
  position: relative;
  z-index: 1;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-offer__frame {
  position: relative;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0347222222 * min(100vw, 1440px));
  /* sec-future との間を半分にする */
  padding-bottom: calc(0.0347222222 * min(100vw, 1440px));
}

.sec-offer__head {
  position: relative;
  z-index: 1;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-offer__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  white-space: nowrap;
  transform: translateY(-50%);
}

.sec-offer__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}
.sec-offer__head .c-index-title__ja br {
  display: none;
}

.sec-offer__lead {
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-offer__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: calc(0.03125 * min(100vw, 1440px));
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 0;
  padding: calc(0.0347222222 * min(100vw, 1440px)) 0 calc(0.0347222222 * min(100vw, 1440px));
  list-style: none;
}

.sec-offer__card {
  width: 47.9166666667%;
}

.sec-offer__photo {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 575/280;
}

.sec-offer__body {
  display: flex;
  flex-direction: column;
  gap: calc(0.0125 * min(100vw, 1440px));
  min-height: calc(0.1597222222 * min(100vw, 1440px));
  padding: calc(0.0277777778 * min(100vw, 1440px)) calc(0.0152777778 * min(100vw, 1440px));
  border-top: calc(0.0034722222 * min(100vw, 1440px)) solid #d11031;
  background: rgba(238, 238, 238, 0.5);
}

.sec-offer__title {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 20 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(26 / 20);
}
.sec-offer__title br {
  display: none;
}

.sec-offer__text {
  margin: 0;
  color: #18242c;
  font-size: max(15px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 16);
}

/* 1280px以下。2列のカードを縦に積む */
@media (max-width: 1280px) {
  .sec-offer__list {
    flex-direction: column;
    gap: 20px;
  }
  .sec-offer__card {
    width: 100%;
  }
}
/* 768px以下。カードは写真、タイトル、本文の順で縦に積む */
@media (max-width: 768px) {
  .sec-offer {
    width: 100%;
  }
  .sec-offer__frame {
    width: 100%;
    padding: 40px 20px 48px;
  }
  .sec-offer__head {
    height: auto;
  }
  .sec-offer__head .c-index-title__en {
    position: relative;
    top: auto;
    left: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-offer__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-offer__head .c-index-title__ja br {
    display: inline;
  }
  .sec-offer__lead {
    margin-top: 16px;
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-offer__list {
    flex-direction: column;
    gap: 16px;
    margin-top: 24px;
    padding: 0;
  }
  .sec-offer__card {
    width: 100%;
  }
  .sec-offer__body {
    min-height: 0;
    gap: 8px;
    padding: 16px 18px 18px;
    border-top-width: 5px;
  }
  .sec-offer__title {
    font-size: 18px;
    line-height: 1.5;
  }
  .sec-offer__title br {
    display: inline;
  }
  .sec-offer__text {
    font-size: 15px;
    line-height: 1.8;
  }
}
/* ------------------------------------------------------------------------------
  今後の展望（sec-future）
  背景はよくあるご質問と同じく、画像は横幅いっぱいの本来の高さ。中身が増えても拡大しない
------------------------------------------------------------------------------ */
.sec-future {
  position: relative;
  z-index: 1;
  width: 100%;
  /* 1440pxまでは画像全体。それより広い画面は高さを止め、上の空を切る */
  min-height: calc(0.3994140625 * min(100vw, 1440px));
  overflow: hidden;
  /* 画像より上に出る空。グラデーションの上端と同じ色 */
  background-color: #b7e4fe;
}

.sec-future__bg {
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  /* 画像の上端に続く空 */
}
.sec-future__bg::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 100%;
  left: 0;
  height: 320px;
  background-image: linear-gradient(180deg, #b7e4fe 0%, #8ed4fe 42%, #55bffd 100%);
}
.sec-future__bg img {
  display: block;
  width: 100%;
  height: auto;
}

.sec-future__fade {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(0.0659722222 * min(100vw, 1440px));
  background-image: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0.8) 36.538%, rgba(255, 255, 255, 0.5) 60.096%, rgba(255, 255, 255, 0.2) 80%, rgba(255, 255, 255, 0) 100%);
  pointer-events: none;
}

.sec-future__frame {
  position: relative;
  z-index: 2;
  width: calc(0.8333333333 * min(100%, 1440px));
  margin-right: auto;
  margin-left: auto;
  /* 上側だけ sec-offer との間を半分にする */
  padding-top: calc(0.0694444444 * min(100vw, 1440px));
  padding-bottom: calc(0.1388888889 * min(100vw, 1440px));
}

.sec-future__head {
  position: relative;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-future__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  white-space: nowrap;
  transform: translateY(-50%);
}

.sec-future__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-future__lead {
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}
.sec-future__lead br {
  display: none;
}

.sec-future__panel {
  display: flex;
  flex-direction: column;
  gap: calc(0.0208333333 * min(100vw, 1440px));
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
  padding: calc(0.0208333333 * min(100vw, 1440px)) calc(0.0138888889 * min(100vw, 1440px));
  background: rgba(255, 255, 255, 0.8);
}

.sec-future__text,
.sec-future__note {
  margin: 0;
  color: #18242c;
  font-size: max(15px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 16);
}

.sec-future__note {
  padding-left: calc(0.0138888889 * min(100vw, 1440px));
  border-left: 2px solid #000;
}
.sec-future__note p {
  margin: 0;
}

.sec-future__links {
  display: flex;
  gap: calc(0.0208333333 * min(100vw, 1440px));
  margin: calc(0.0069444444 * min(100vw, 1440px)) 0 0;
  padding: 0;
  list-style: none;
}

.sec-future__links li {
  flex: 1 1 0;
  min-width: 0;
}

.sec-future__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(0.0138888889 * min(100vw, 1440px));
  height: 100%;
  padding: calc(0.0208333333 * min(100vw, 1440px)) calc(0.0138888889 * min(100vw, 1440px));
  background: rgba(255, 255, 255, 0.8);
  color: #18242c;
  font-size: max(15px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 16);
  text-decoration: none;
}

/* 円は固定。矢印だけを取り組み記事ボタンと同じく斜めにスライドさせる */
.sec-future__icon {
  flex: 0 0 auto;
  width: calc(0.0208333333 * min(100vw, 1440px));
  height: calc(0.0208333333 * min(100vw, 1440px));
}

.sec-future__arrow-box {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 50%;
  background: #d11031;
}

.sec-future__arrow-track {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.4s ease;
}

.sec-future__arrow {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sec-future__arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}
.sec-future__arrow {
  /* 次の矢印は進行方向の逆（左下）で待つ */
}
.sec-future__arrow + .sec-future__arrow {
  transform: translate(-100%, 100%);
}

@media (hover: hover) {
  .sec-future__link:hover .sec-future__arrow-track {
    transform: translate(100%, -100%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .sec-future__arrow-track {
    transition: none;
  }
  .sec-future__link:hover .sec-future__arrow-track {
    transform: none;
  }
}
/* 768px以下。見出しと本文を読みやすいサイズにし、背景の空は上、道はリンクの下に残す */
@media (max-width: 768px) {
  .sec-future__fade {
    height: 40px;
  }
  .sec-future__frame {
    width: 100%;
    padding: 48px 20px 148px;
  }
  .sec-future__head {
    height: auto;
  }
  .sec-future__head .c-index-title__en {
    position: relative;
    top: auto;
    left: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-future__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-future__lead {
    margin-top: 16px;
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-future__lead br {
    display: inline;
  }
  .sec-future__panel {
    gap: 16px;
    margin-top: 24px;
    padding: 16px 18px;
  }
  .sec-future__text,
  .sec-future__note {
    font-size: 15px;
    line-height: 1.8;
  }
  .sec-future__note {
    padding-left: 16px;
  }
  .sec-future__links {
    flex-direction: column;
    gap: 12px;
    margin-top: 16px;
  }
  .sec-future__links li {
    flex: 0 0 auto;
    width: 100%;
  }
  .sec-future__link {
    gap: 12px;
    padding: 16px 18px;
    font-size: 15px;
    line-height: 1.6;
  }
  .sec-future__icon {
    width: 30px;
    height: 30px;
  }
}
/* パンくず（帯とイントロの間）。帯より手前に置き、透過部分に寄ってもリンクを押せる */
.p-breadcrumb {
  position: relative;
  z-index: 5;
  max-width: 1440px;
  margin: 16px auto 32px;
  padding: 0 20px;
}

.p-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
  font-weight: 400;
  line-height: 21px;
  color: #000;
}

.p-breadcrumb__item {
  display: flex;
  align-items: center;
  gap: 6px;
}
.p-breadcrumb__item:not(:last-child)::after {
  content: ">";
  margin-left: 6px;
  color: #7f8c8d;
}

.p-breadcrumb__link {
  display: flex;
  align-items: center;
  color: #1f1f1f;
  text-decoration: none;
}

.p-breadcrumb__home-icon {
  display: block;
  width: 13px;
  height: 13px;
  margin-right: 15px;
}

/* ------------------------------------------------------------------------------
  Top : FV（sec-fv）
------------------------------------------------------------------------------ */
.sec-fv {
  position: relative;
  width: 100%;
  aspect-ratio: 1440/726;
  overflow: hidden;
  background: #fff;
}

/* 空と街並み。上部の白みは画像に含めず疑似要素で重ねる */
.sec-fv__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.sec-fv__bg img {
  position: absolute;
  top: -21.6%;
  left: -5.29%;
  width: 112.84%;
  height: 133.53%;
  max-width: none;
}
.sec-fv__bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 34.85%;
  background: linear-gradient(to top, rgba(255, 255, 255, 0.1) 12.981%, #fff 97.115%);
  pointer-events: none;
}

.sec-fv__stage {
  position: absolute;
  inset: 0;
}

/* 左のテキスト */
.sec-fv__body {
  position: absolute;
  z-index: 3;
  top: 14.19%;
  left: 6.67%;
  width: 32.43%;
  height: 27.7777777778vw;
}

.sec-fv__body-shadow {
  position: absolute;
  z-index: 0;
  top: -6.9444444444vw;
  left: -6.9444444444vw;
  width: 46.3194444444vw;
  height: 41.6666666667vw;
  max-width: none;
  pointer-events: none;
}

.sec-fv__label,
.sec-fv__title,
.sec-fv__lead,
.sec-fv__label-line {
  position: absolute;
  z-index: 1;
  margin: 0;
}

.sec-fv__label {
  top: 3.4722222222vw;
  left: 4.8611111111vw;
  color: #18242c;
  font-size: max(14px, 24 / 1440 * 100vw);
  font-weight: 600;
  line-height: 1.5;
}

.sec-fv__label-line {
  top: 6.875vw;
  left: 4.8611111111vw;
  width: 21.25vw;
  height: 0.2777777778vw;
}

.sec-fv__title {
  top: 7.9861111111vw;
  left: 4.375vw;
  color: #18242c;
  font-size: max(36px, 64 / 1440 * 100vw);
  font-weight: 800;
  line-height: 1.09;
}

.sec-fv__title-em {
  color: #d11031;
}

.sec-fv__lead {
  top: 19.7916666667vw;
  left: 4.375vw;
  color: #18242c;
  font-size: max(16px, 24 / 1440 * 100vw);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0.05em;
}

/* 写真。フレーム・写真・学校名は1枚。英字と下線だけ重ねる */
.sec-fv__media {
  position: absolute;
  z-index: 1;
  top: 22.73%;
  left: 51.94%;
  width: 38.89%;
  overflow: visible;
}

.sec-fv__media .swiper-wrapper {
  display: flex;
}

.sec-fv__media .swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: auto;
}

.sec-fv__media.swiper-fade .swiper-slide {
  pointer-events: none;
}

.sec-fv__media.swiper-fade .swiper-slide-active {
  pointer-events: auto;
}

.sec-fv__card {
  position: relative;
  transform: rotate(-2.77deg);
}

.sec-fv__card--reverse {
  transform: rotate(2.77deg);
}

.sec-fv__card-img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 4px 50px 5px rgba(255, 255, 255, 0.5);
}

.sec-fv__level {
  position: absolute;
  z-index: 2;
  top: calc(100% - 0.4em);
  right: 0;
  left: 0;
  margin: 0;
  color: #d11031;
  font-family: "Kaushan Script", cursive;
  font-size: max(22px, 36 / 1440 * 100vw);
  font-weight: 400;
  line-height: 1.2;
  text-align: center;
}

.sec-fv__level-line {
  position: absolute;
  z-index: 1;
  top: calc(100% - 0.15em);
  left: 50%;
  width: 36.6%;
  height: auto;
  margin: 0;
  transform: translateX(-50%) rotate(9.84deg);
}

/* 赤いリボン。画像のまま左から右へ出す */
.sec-fv__ribbon {
  position: absolute;
  z-index: 2;
  top: -0.41%;
  left: -33.96%;
  width: 150.83%;
  height: 99.72%;
  pointer-events: none;
}
.sec-fv__ribbon img {
  width: 100%;
  height: 100%;
  max-width: none;
}

/* レイヤー上部の bottom_ribbon。FV下端に重なり、下へはみ出す */
.sec-fv__bottom-ribbon {
  position: relative;
  z-index: 4;
  height: 35.2083333333vw;
  margin-top: -20.2083333333vw;
  overflow: hidden;
  pointer-events: none;
}
.sec-fv__bottom-ribbon img {
  position: absolute;
  top: 0;
  left: -3.8194444444%;
  width: 105.5555555556%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

/* 出現前。JSが html に is-fv を付けたときだけ隠す */
html.is-fv .sec-fv__bg,
html.is-fv .sec-fv__bottom-ribbon,
html.is-fv .sec-fv__body,
html.is-fv .sec-fv__media,
html.is-fv .sec-fv__ribbon {
  opacity: 0;
}
html.is-fv .sec-fv__body,
html.is-fv .sec-fv__media {
  transform: translateY(24px);
}
html.is-fv .sec-fv__bottom-ribbon,
html.is-fv .sec-fv__ribbon {
  clip-path: inset(0 100% 0 0);
}

@media (prefers-reduced-motion: reduce) {
  html.is-fv .sec-fv__bg,
  html.is-fv .sec-fv__bottom-ribbon,
  html.is-fv .sec-fv__body,
  html.is-fv .sec-fv__media,
  html.is-fv .sec-fv__ribbon {
    opacity: 1;
    transform: none;
    clip-path: none;
  }
}
/* 900px以下。帯と細いリボンは画面より大きくし、左右は切る */
@media (max-width: 900px) {
  .sec-fv__ribbon {
    top: 50%;
    left: 50%;
    width: 190%;
    height: auto;
    aspect-ratio: 2172/724;
    transform: translate(-50%, -50%);
  }
  .sec-fv__ribbon img {
    height: auto;
  }
}
/* 768px以下。文字を上、写真を下に積む */
@media (max-width: 768px) {
  .sec-fv {
    aspect-ratio: auto;
    padding: 28px 20px calc(48px + 12vw);
  }
  .sec-fv__bg img {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
  }
  .sec-fv__bg::after {
    height: 62%;
  }
  .sec-fv__stage {
    position: relative;
    inset: auto;
  }
  .sec-fv__body {
    position: relative;
    top: auto;
    left: auto;
    width: max-content;
    max-width: 100%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
  }
  .sec-fv__body-shadow {
    top: 50%;
    left: 50%;
    width: 148%;
    height: 170%;
    transform: translate(-50%, -50%);
  }
  .sec-fv__label,
  .sec-fv__title,
  .sec-fv__lead,
  .sec-fv__label-line {
    position: relative;
    top: auto;
    left: auto;
    width: auto;
    height: auto;
  }
  .sec-fv__label {
    font-size: 14px;
  }
  .sec-fv__label-line {
    display: block;
    width: 168px;
    margin-top: 8px;
  }
  .sec-fv__title {
    margin-top: 12px;
    font-size: 36px;
  }
  .sec-fv__lead {
    margin-top: 16px;
    font-size: 16px;
  }
  .sec-fv__media {
    position: relative;
    top: auto;
    left: auto;
    width: min(100%, 420px);
    margin: 36px auto 0;
  }
  .sec-fv__level {
    font-size: 22px;
  }
  .sec-fv__ribbon {
    top: calc(225px - 35vw);
    bottom: auto;
    left: 50%;
    width: 210%;
    height: auto;
    aspect-ratio: 2172/724;
    transform: translateX(-50%);
  }
  .sec-fv__ribbon img {
    height: auto;
  }
  /* フッターの帯と同じ高さ。透明を除いた赤が、写真の下端に重なる */
  .sec-fv__bottom-ribbon {
    margin-top: -17.2222222222vw;
  }
  .sec-fv__bottom-ribbon img {
    left: -5.5555555556%;
  }
}
/* ------------------------------------------------------------------------------
  Top : 導入（sec-intro）
------------------------------------------------------------------------------ */
.sec-intro {
  position: relative;
  z-index: 0;
  width: 100%;
  margin-top: calc(-0.0506944444 * min(100vw, 1440px));
}

.sec-intro__frame {
  position: relative;
  z-index: 2;
  width: min(100%, 1440px);
  aspect-ratio: 1440/622;
  margin-right: auto;
  margin-left: auto;
}

/* Figma: 1440枠に対して left -85 / top -195 / 1610×906。画面外にはみ出してよい */
.sec-intro__bg {
  position: absolute;
  z-index: 1;
  top: -31.3504823151%;
  left: -5.9027777778%;
  width: 111.8055555556%;
  height: 145.6591639871%;
  max-width: none;
  pointer-events: none;
}

/* 狭い幅だけ使う分割イラスト。広い幅では出さない */
.sec-intro__parts {
  display: none;
}

.sec-intro__text {
  position: absolute;
  z-index: 2;
  top: 11.4147909968%;
  left: 36.6666666667%;
  width: 28.4027777778%;
  margin: 0;
  color: #18242c;
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(0.0138888889 * min(100vw, 1440px));
  font-weight: 600;
  /* 行の間の空白が行箱にならないよう、行間は各行側で持つ */
  line-height: 0;
  letter-spacing: calc(0.0020833333 * min(100vw, 1440px));
  text-align: center;
}

/* 改行1行分。幅は文字幅に合わせ、中央寄せは親の text-align と同じ位置になる */
.sec-intro__line {
  display: block;
  width: max-content;
  max-width: none;
  margin-right: auto;
  margin-left: auto;
  line-height: 2;
}

.sec-intro__line-inner {
  display: block;
  line-height: 2;
  white-space: nowrap;
}

/* 文章グループの空行。元の br 1つ分 */
.sec-intro__gap {
  display: block;
  height: 2em;
}

/* 出現前。左から開くまでのあいだ隠す */
html.is-intro-text .sec-intro__line {
  clip-path: inset(0 100% 0 0);
}

/* 1024px以下。分割イラストを、PCの1枚絵に近い位置へ置く */
@media (max-width: 1024px) {
  .sec-intro {
    margin-top: -18.75vw;
    padding-bottom: 8px;
  }
  .sec-intro__frame {
    display: block;
    width: 100%;
    height: 620px;
    aspect-ratio: auto;
    margin-left: auto;
    padding: 0;
    transform: none;
  }
  .sec-intro__bg {
    display: none;
  }
  .sec-intro__parts {
    display: contents;
  }
  .sec-intro__part {
    position: absolute;
    z-index: 1;
    display: block;
    width: auto;
    height: auto;
    pointer-events: none;
  }
  /* 左上の二人、右上の街 */
  .sec-intro__parts--top .sec-intro__part:first-of-type {
    top: 0;
    left: -2%;
    width: 34%;
  }
  .sec-intro__parts--top .sec-intro__part:last-of-type {
    top: 4%;
    right: -2%;
    width: 36%;
  }
  /* 左下のクルマ、右下の地球 */
  .sec-intro__parts--bottom .sec-intro__part:first-of-type {
    bottom: 0;
    left: -4%;
    width: 40%;
  }
  .sec-intro__parts--bottom .sec-intro__part:last-of-type {
    right: -2%;
    bottom: 2%;
    width: 36%;
  }
  .sec-intro__text {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 0;
    width: 100%;
    margin: 0;
    font-size: 16px;
    letter-spacing: 0.06em;
    transform: translateY(-50%);
  }
}
/* 768px以下。1枚絵は出さず、分割イラストを文字の上下左右に置く */
@media (max-width: 768px) {
  .sec-intro {
    margin-top: 0;
    padding-bottom: 16px;
  }
  .sec-intro__frame {
    display: flex;
    flex-direction: column;
    width: 100%;
    aspect-ratio: auto;
    margin-left: auto;
    padding: 0;
    transform: none;
  }
  .sec-intro__bg {
    display: none;
  }
  .sec-intro__parts {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* 左右を画面の外へ少し出す */
    width: calc(100% + 48px);
    margin-right: -24px;
    margin-left: -24px;
  }
  .sec-intro__parts--top {
    order: 1;
    /* 帯をフッターと同じ高さにした分。下端にかかり、少し潜り込む */
    margin-top: calc(-9.4444444444vw - 16px);
  }
  .sec-intro__parts--bottom {
    order: 3;
    margin-top: 28px;
  }
  .sec-intro__part {
    position: static;
    width: 46%;
    height: auto;
  }
  .sec-intro__text {
    position: relative;
    top: auto;
    left: auto;
    order: 2;
    width: 100%;
    margin-top: 16px;
    margin-bottom: 0;
    font-size: 16px;
    letter-spacing: 0.06em;
    transform: none;
  }
}
/* ------------------------------------------------------------------------------
  Top : 産学連携に取り組む想い（sec-thoughts）
------------------------------------------------------------------------------ */
.sec-thoughts {
  position: relative;
  z-index: 0;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-thoughts__frame {
  position: relative;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0902777778 * min(100vw, 1440px));
  padding-bottom: calc(0.0694444444 * min(100vw, 1440px));
}

/* 縞の円。写真の左下で、写真の後ろ */
.sec-thoughts__disc {
  position: absolute;
  z-index: -1;
  top: calc(0.1847222222 * min(100vw, 1440px));
  left: calc(-0.0375 * min(100vw, 1440px));
  width: calc(0.1041666667 * min(100vw, 1440px));
  height: calc(0.1041666667 * min(100vw, 1440px));
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}

/* 右下のイラスト。枠内 left 798 / 上 567、650×370。
   Figma の y447 に本文の下がり 80px を足した 527 から、視差で本文に重ならないようさらに 40px 下げる */
.sec-thoughts__illust {
  position: absolute;
  z-index: 0;
  top: calc(0.39375 * min(100vw, 1440px));
  left: calc(0.5541666667 * min(100vw, 1440px));
  width: calc(0.4513888889 * min(100vw, 1440px));
  height: calc(0.2569444444 * min(100vw, 1440px));
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}

.sec-thoughts__head {
  position: relative;
  z-index: 1;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-thoughts__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-thoughts__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-thoughts__body {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: calc(0.0354166667 * min(100vw, 1440px));
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
}

.sec-thoughts__photo {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: calc(0.375 * min(100vw, 1440px));
  height: calc(0.2534722222 * min(100vw, 1440px));
  border-radius: calc(0.0069444444 * min(100vw, 1440px));
  object-fit: cover;
}

.sec-thoughts__copy {
  flex: 0 0 auto;
  width: calc(0.4166666667 * min(100vw, 1440px));
}

.sec-thoughts__lead {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-thoughts__text {
  margin: calc(0.0090277778 * min(100vw, 1440px)) 0 0;
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(36 / 15);
}

/* 1280px以下。写真を上、文章を下にする。行間は2.1まで寄せる */
@media (max-width: 1280px) {
  .sec-thoughts__frame {
    /* 右下イラストの高さに、視差20pxと余白を足す */
    padding-bottom: calc(19.0046156934vw + 56px);
  }
  .sec-thoughts__body {
    flex-direction: column;
    align-items: stretch;
    gap: 48px;
  }
  .sec-thoughts__photo {
    width: 100%;
    height: auto;
  }
  .sec-thoughts__copy {
    width: 100%;
  }
  .sec-thoughts__text {
    line-height: 2.1;
  }
  /* 写真の左下。写真の縦横比 1024×683 に合わせる */
  .sec-thoughts__disc {
    top: calc(45.166015625vw - 24px);
    left: -2.0833333333vw;
  }
  .sec-thoughts__illust {
    top: auto;
    right: 0;
    bottom: 0;
    left: auto;
    width: 33.3333333333vw;
    height: auto;
  }
}
/* 768px以下。見出し、写真、文章の順に積む */
@media (max-width: 768px) {
  .sec-thoughts {
    width: 100%;
  }
  .sec-thoughts__frame {
    width: 100%;
    /* 下のイラストが収まる高さ。上方向の視差20pxは本文側に寄せる */
    padding: 40px 20px calc(40px + 41vw);
  }
  .sec-thoughts__head {
    height: auto;
  }
  .sec-thoughts__head .c-index-title__en {
    position: relative;
    top: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-thoughts__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-thoughts__body {
    flex-direction: column;
    align-items: stretch;
    /* 円が写真下へ少し出る分だけ空ける */
    gap: 36px;
    margin-top: 24px;
  }
  .sec-thoughts__photo {
    width: 100%;
    height: auto;
    border-radius: 10px;
  }
  .sec-thoughts__copy {
    width: 100%;
  }
  .sec-thoughts__lead {
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-thoughts__text {
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.9;
  }
  /* 写真の左下。PCと同じく下端付近で、左へ少し出す */
  .sec-thoughts__disc {
    top: calc(0.4842 * (100vw - 40px));
    bottom: auto;
    left: -20px;
    width: calc(0.2778 * (100vw - 40px));
    height: calc(0.2778 * (100vw - 40px));
  }
  /* 文章のすぐ下。上方向の視差では本文に少しかかってよい */
  .sec-thoughts__illust {
    top: auto;
    right: 0;
    bottom: 24px;
    left: 0;
    width: 72%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
  }
}
/* ------------------------------------------------------------------------------
  Top : 産学連携とは（sec-collabo）
------------------------------------------------------------------------------ */
.sec-collabo {
  position: relative;
  z-index: 0;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-collabo__frame {
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0347222222 * min(100vw, 1440px));
  padding-bottom: calc(0.0694444444 * min(100vw, 1440px));
}

.sec-collabo__head {
  position: relative;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-collabo__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-collabo__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

/* 24pxで1行に収まらない幅だけ改行する */
.sec-collabo__break {
  display: none;
}

.sec-collabo__body {
  display: flex;
  align-items: center;
  gap: calc(0.0354166667 * min(100vw, 1440px));
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
  padding-bottom: calc(0.0277777778 * min(100vw, 1440px));
}

.sec-collabo__photo {
  flex: 0 0 auto;
  width: calc(0.375 * min(100vw, 1440px));
  height: calc(0.2534722222 * min(100vw, 1440px));
  border-radius: calc(0.0069444444 * min(100vw, 1440px));
  object-fit: cover;
  object-position: bottom;
}

.sec-collabo__copy {
  flex: 0 0 auto;
  width: calc(0.4166666667 * min(100vw, 1440px));
}

.sec-collabo__lead {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-collabo__text {
  margin: calc(0.0090277778 * min(100vw, 1440px)) 0 0;
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(36 / 15);
}

.sec-collabo__list {
  display: flex;
  align-items: stretch;
  gap: calc(0.03125 * min(100vw, 1440px));
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 0;
  padding: 0 0 calc(0.0208333333 * min(100vw, 1440px));
  list-style: none;
}

.sec-collabo__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(0.0125 * min(100vw, 1440px));
  flex: 0 0 auto;
  width: calc(0.2569444444 * min(100vw, 1440px));
  min-height: calc(0.1638888889 * min(100vw, 1440px));
  padding: calc(0.0125 * min(100vw, 1440px)) calc(0.0152777778 * min(100vw, 1440px));
  border-top: calc(0.0034722222 * min(100vw, 1440px)) solid #d11031;
  background: rgba(238, 238, 238, 0.5);
}

.sec-collabo__tag {
  margin: 0;
  padding: calc(0.0013888889 * min(100vw, 1440px)) calc(0.0069444444 * min(100vw, 1440px));
  background: #18242c;
  color: #fff;
  font-size: max(12px, 12 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(14 / 12);
}

.sec-collabo__card-title {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 20 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: 1.4;
}

.sec-collabo__card-text {
  margin: 0;
  color: #18242c;
  font-size: max(15px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 16);
}

.sec-collabo__more {
  display: flex;
  justify-content: center;
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
}

/* 1280px以下。写真を上、文章とカードを下に積む */
@media (max-width: 1280px) {
  .sec-collabo__body {
    flex-direction: column;
    align-items: stretch;
    gap: 28px;
  }
  .sec-collabo__photo {
    width: 100%;
    height: auto;
  }
  .sec-collabo__copy {
    width: 100%;
  }
  .sec-collabo__text {
    line-height: 2.1;
  }
  .sec-collabo__list {
    flex-direction: column;
    gap: 20px;
  }
  .sec-collabo__card {
    width: 100%;
  }
}
/* 768px以下。見出し、写真、文章、カードの順に積む */
@media (max-width: 768px) {
  .sec-collabo {
    width: 100%;
  }
  .sec-collabo__frame {
    width: 100%;
    padding: 40px 20px 48px;
  }
  .sec-collabo__head {
    height: auto;
  }
  .sec-collabo__head .c-index-title__en {
    position: relative;
    top: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-collabo__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-collabo__body {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
    margin-top: 24px;
    padding-bottom: 0;
  }
  .sec-collabo__photo {
    width: 100%;
    height: auto;
    border-radius: 10px;
  }
  .sec-collabo__copy {
    width: 100%;
  }
  .sec-collabo__lead {
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-collabo__text {
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.9;
  }
  .sec-collabo__list {
    flex-direction: column;
    gap: 16px;
    margin-top: 28px;
    padding-bottom: 0;
  }
  .sec-collabo__card {
    width: 100%;
    min-height: 0;
    gap: 12px;
    padding: 16px 18px 18px;
    border-top-width: 5px;
  }
  .sec-collabo__tag {
    padding: 2px 10px;
    font-size: 12px;
    line-height: 1.4;
  }
  .sec-collabo__card-title {
    font-size: 18px;
    line-height: 1.4;
  }
  .sec-collabo__card-text {
    font-size: 15px;
    line-height: 1.8;
  }
  .sec-collabo__more {
    margin-top: 28px;
  }
}
@media (max-width: 400px) {
  .sec-collabo__break {
    display: block;
  }
}
/* ------------------------------------------------------------------------------
  Top : 担当者紹介（sec-member）
------------------------------------------------------------------------------ */
.sec-member {
  position: relative;
  z-index: 0;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-member__frame {
  position: relative;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0347222222 * min(100vw, 1440px));
  padding-bottom: calc(0.0694444444 * min(100vw, 1440px));
}

/* FVと同じリボン画像。担当者の写真が見えたら左から右へ出す */
.sec-member__ribbon {
  position: absolute;
  z-index: 0;
  top: calc(-0.2979166667 * min(100vw, 1440px));
  left: calc(-0.1305555556 * min(100vw, 1440px));
  width: calc(1.5083333333 * min(100vw, 1440px));
  height: calc(0.5027777778 * min(100vw, 1440px));
  pointer-events: none;
  /* 1440pxの右端あたりで、左端と同じように白へ消す */
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 64%, transparent 75%);
  mask-image: linear-gradient(to right, #000 0%, #000 64%, transparent 75%);
}
.sec-member__ribbon img {
  width: 100%;
  height: 100%;
  max-width: none;
}

html.is-member-ribbon .sec-member__ribbon {
  clip-path: inset(0 100% 0 0);
}

.sec-member__head {
  position: relative;
  z-index: 1;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-member__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-member__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-member__body {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: calc(0.0354166667 * min(100vw, 1440px));
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
}

/* 写真とプロフィールを横並びのまままとめて出す。ドットは含めない */
.sec-member__main {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: calc(0.0354166667 * min(100vw, 1440px));
  width: 100%;
}

.sec-member__dots {
  position: absolute;
  z-index: 0;
  top: calc(-0.0222222222 * min(100vw, 1440px));
  left: calc(0.2868055556 * min(100vw, 1440px));
  width: calc(0.1041666667 * min(100vw, 1440px));
  height: calc(0.1041666667 * min(100vw, 1440px));
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}

.sec-member__photo {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: calc(0.3472222222 * min(100vw, 1440px));
  height: calc(0.3909722222 * min(100vw, 1440px));
  border-radius: calc(0.0069444444 * min(100vw, 1440px));
  object-fit: cover;
  object-position: bottom;
}

.sec-member__copy {
  flex: 0 0 auto;
  width: calc(0.4472222222 * min(100vw, 1440px));
  padding-top: calc(0.0173611111 * min(100vw, 1440px));
}

.sec-member__lead {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-member__role {
  margin: calc(0.0256944444 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(40 / 14);
}

.sec-member__name {
  margin: calc(0.0034722222 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 36);
}

.sec-member__kana {
  margin: 0;
  color: #18242c;
  font-size: max(12px, 12 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(40 / 12);
}

.sec-member__text {
  margin: calc(0.0194444444 * min(100vw, 1440px)) 0 0;
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(36 / 15);
}

/* 768px以下。見出し、写真、プロフィールの順に積む */
@media (max-width: 768px) {
  .sec-member {
    width: 100%;
  }
  .sec-member__frame {
    width: 100%;
    padding: 64px 20px 28px;
  }
  /* ループは見出しの右上。線は英語ラベルの上を通り、前のリンクにはかけない */
  .sec-member__ribbon {
    top: -97.435px;
    right: calc(18vw - 296px);
    left: auto;
    width: 640px;
    height: auto;
    aspect-ratio: 2172/724;
  }
  .sec-member__ribbon img {
    height: auto;
  }
  .sec-member__head {
    height: auto;
  }
  .sec-member__head .c-index-title__en {
    position: relative;
    top: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-member__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-member__body {
    margin-top: 24px;
  }
  .sec-member__main {
    flex-direction: column;
    gap: 24px;
  }
  .sec-member__photo {
    width: 100%;
    height: auto;
    border-radius: 10px;
  }
  /* 写真の右上。写真からはみ出した分だけ見える */
  .sec-member__dots {
    top: 0;
    right: -12px;
    left: auto;
    width: calc(0.28 * (100vw - 40px));
    height: calc(0.28 * (100vw - 40px));
  }
  .sec-member__copy {
    width: 100%;
    padding-top: 0;
  }
  .sec-member__lead {
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-member__role {
    margin-top: 20px;
    font-size: 14px;
    line-height: 1.6;
  }
  .sec-member__name {
    margin-top: 4px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-member__kana {
    font-size: 12px;
    line-height: 1.6;
  }
  .sec-member__text {
    margin-top: 16px;
    font-size: 15px;
    line-height: 1.9;
  }
}
/* ------------------------------------------------------------------------------
  Top : 学校とともにつくる学び（sec-together）
------------------------------------------------------------------------------ */
.sec-together {
  position: relative;
  z-index: 0;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-together__illust {
  position: absolute;
  z-index: 0;
  top: calc(-0.09375 * min(100vw, 1440px));
  left: calc(-0.0881944444 * min(100vw, 1440px));
  width: calc(0.25625 * min(100vw, 1440px));
  height: calc(0.1923611111 * min(100vw, 1440px));
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}

.sec-together__frame {
  position: relative;
  z-index: 1;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0347222222 * min(100vw, 1440px));
  padding-bottom: calc(0.0694444444 * min(100vw, 1440px));
}

.sec-together__head {
  position: relative;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-together__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-together__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-together__intro {
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
}

.sec-together__lead {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

/* 1行に収まらない幅だけ、読点のあとで改行する */
.sec-together__break {
  display: none;
}

.sec-together__desc {
  margin: calc(0.0090277778 * min(100vw, 1440px)) 0 0;
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(40 / 15);
}

.sec-together__card {
  position: relative;
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
  border-radius: calc(0.0138888889 * min(100vw, 1440px));
  background: #fff;
  filter: drop-shadow(0 calc(0.0027777778 * min(100vw, 1440px)) calc(0.0069444444 * min(100vw, 1440px)) rgba(0, 0, 0, 0.25));
}

.sec-together__swiper {
  overflow: hidden;
  border-radius: inherit;
}

.sec-together__swiper .swiper-wrapper {
  display: flex;
}

.sec-together__swiper .swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: auto;
}

.sec-together__slide {
  display: flex;
  align-items: flex-start;
  gap: calc(0.0277777778 * min(100vw, 1440px));
  min-height: calc(0.2951388889 * min(100vw, 1440px));
  padding: calc(0.0208333333 * min(100vw, 1440px));
}

.sec-together__photo {
  flex: 0 0 auto;
  width: calc(0.375 * min(100vw, 1440px));
  height: calc(0.2534722222 * min(100vw, 1440px));
  border-radius: calc(0.0069444444 * min(100vw, 1440px));
  object-fit: cover;
}

.sec-together__copy {
  flex: 1 1 auto;
  min-width: 0;
}

.sec-together__school {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0 calc(0.0138888889 * min(100vw, 1440px));
  border: 1px solid #d11031;
  border-radius: calc(0.0138888889 * min(100vw, 1440px));
  background: rgba(209, 16, 49, 0.1);
  color: #d11031;
  font-size: max(13px, 14 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(40 / 14);
  white-space: nowrap;
}

.sec-together__title {
  margin: calc(0.0145833333 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

.sec-together__date {
  margin: calc(-0.0069444444 * min(100vw, 1440px)) 0 0;
  color: #18242c;
  font-size: max(12px, 12 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(40 / 12);
}

.sec-together__text {
  min-height: calc(0.0833333333 * min(100vw, 1440px));
  margin: calc(0.0111111111 * min(100vw, 1440px)) 0 0;
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(36 / 15);
}

.sec-together__link {
  margin-top: calc(0.0277777778 * min(100vw, 1440px));
}

.sec-together__pager {
  position: absolute;
  z-index: 2;
  right: calc(0.0274305556 * min(100vw, 1440px));
  bottom: calc(0.03125 * min(100vw, 1440px));
  display: flex;
  align-items: center;
  gap: calc(0.0138888889 * min(100vw, 1440px));
}

.sec-together__prev,
.sec-together__next {
  flex: 0 0 auto;
  width: calc(0.0326388889 * min(100vw, 1440px));
  height: calc(0.0326388889 * min(100vw, 1440px));
  padding: 0;
}
.sec-together__prev svg,
.sec-together__next svg {
  display: block;
  width: 100%;
  height: 100%;
}
.sec-together__prev circle,
.sec-together__next circle {
  fill: #fff;
  stroke: #ccc;
  transition: fill 0.4s ease, stroke 0.4s ease;
}
.sec-together__prev line,
.sec-together__next line {
  stroke: #d11031;
  transition: stroke 0.4s ease;
}

/* ホバー時はページトップボタンと同じ配色 */
@media (hover: hover) {
  .sec-together__prev:hover circle,
  .sec-together__next:hover circle {
    fill: #ba112a;
    stroke: #ba112a;
  }
  .sec-together__prev:hover line,
  .sec-together__next:hover line {
    stroke: #fff;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sec-together__prev circle,
  .sec-together__prev line,
  .sec-together__next circle,
  .sec-together__next line {
    transition: none;
  }
}
.sec-together__count {
  display: flex;
  align-items: center;
  gap: calc(0.0138888889 * min(100vw, 1440px));
  margin: 0;
  line-height: 26px;
}

.sec-together__current {
  color: #d11031;
  font-size: max(18px, 20 / 1440 * min(100vw, 1440px));
  font-weight: 500;
}

.sec-together__total {
  color: #000;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  font-weight: 500;
}

/* 1280px以下。写真を上、文章を下にする */
@media (max-width: 1280px) {
  .sec-together__slide {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
    min-height: 0;
  }
  .sec-together__swiper .swiper-wrapper {
    align-items: flex-start;
  }
  .sec-together__card {
    padding-bottom: 50px;
  }
  .sec-together__photo {
    width: 100%;
    height: auto;
  }
  .sec-together__text {
    line-height: 2.1;
  }
  .sec-together__pager {
    position: static;
    justify-content: center;
    margin-top: 8px;
  }
}
/* 768px以下。見出し、導入、カードの順。カード内は写真の下に文章 */
@media (max-width: 768px) {
  .sec-together {
    width: 100%;
  }
  /* 電球はPCと同じく左へ少し出す。上の文章との間は詰めすぎない */
  .sec-together__illust {
    position: relative;
    top: auto;
    left: auto;
    width: 48vw;
    height: auto;
    margin-top: calc(16px - 11.04vw);
    margin-right: auto;
    margin-bottom: -4.8vw;
    margin-left: calc(-16px - 2.592vw);
  }
  .sec-together__frame {
    width: 100%;
    padding: 8px 20px 48px;
  }
  .sec-together__head {
    height: auto;
  }
  .sec-together__head .c-index-title__en {
    position: relative;
    top: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-together__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-together__intro {
    margin-top: 20px;
  }
  .sec-together__lead {
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-together__desc {
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.9;
  }
  .sec-together__card {
    margin-top: 24px;
    padding-bottom: 50px;
    border-radius: 16px;
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.18));
  }
  .sec-together__slide {
    flex-direction: column;
    gap: 16px;
    min-height: 0;
    padding: 16px 16px 8px;
  }
  .sec-together__photo {
    width: 100%;
    height: auto;
    border-radius: 10px;
  }
  .sec-together__school {
    padding: 0 14px;
    border-radius: 16px;
    font-size: 13px;
    line-height: 32px;
  }
  .sec-together__title {
    margin-top: 12px;
    font-size: 18px;
    line-height: 1.5;
  }
  .sec-together__date {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.6;
  }
  .sec-together__text {
    min-height: 0;
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.8;
  }
  .sec-together__link {
    margin-top: 16px;
  }
  .sec-together__pager {
    position: static;
    justify-content: center;
    gap: 12px;
    margin: 4px 0 0;
  }
  .sec-together__prev,
  .sec-together__next {
    width: 44px;
    height: 44px;
  }
  .sec-together__count {
    gap: 12px;
    line-height: 1;
  }
  .sec-together__current {
    font-size: 18px;
  }
  .sec-together__total {
    font-size: 14px;
  }
}
@media (max-width: 448px) {
  .sec-together__break {
    display: block;
  }
}
/* ------------------------------------------------------------------------------
  Top : 産学連携の取り組み（sec-collaboration）
------------------------------------------------------------------------------ */
.sec-collaboration {
  position: relative;
  z-index: 0;
  width: min(100%, 1440px);
  margin-right: auto;
  margin-left: auto;
}

.sec-collaboration__illust {
  position: absolute;
  z-index: 0;
  top: calc(-0.0541666667 * min(100vw, 1440px));
  left: calc(0.7180555556 * min(100vw, 1440px));
  width: calc(0.3125 * min(100vw, 1440px));
  height: calc(0.2347222222 * min(100vw, 1440px));
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}

.sec-collaboration__frame {
  position: relative;
  z-index: 1;
  width: 83.3333333333%;
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0347222222 * min(100vw, 1440px));
  padding-bottom: calc(0.0694444444 * min(100vw, 1440px));
}

.sec-collaboration__head {
  position: relative;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-collaboration__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-collaboration__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-collaboration__intro {
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
}

.sec-collaboration__lead {
  margin: 0;
  color: #18242c;
  font-size: max(18px, 24 / 1440 * min(100vw, 1440px));
  font-weight: 700;
  line-height: calc(40 / 24);
}

/* 1行に収まらない幅だけ、読点のあとで改行する */
.sec-collaboration__break {
  display: none;
}

.sec-collaboration__desc {
  margin: calc(0.0090277778 * min(100vw, 1440px)) 0 0;
  color: #000;
  font-size: max(15px, 15 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(40 / 15);
}

.sec-collaboration__list {
  display: flex;
  align-items: stretch;
  gap: calc(0.03125 * min(100vw, 1440px));
  margin: calc(0.0173611111 * min(100vw, 1440px)) 0 0;
  padding: 0;
  list-style: none;
}

.sec-collaboration__card {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  width: calc(0.2569444444 * min(100vw, 1440px));
  min-height: calc(0.2680555556 * min(100vw, 1440px));
}

.sec-collaboration__link {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
  border-top: calc(0.0034722222 * min(100vw, 1440px)) solid #d11031;
  color: inherit;
  text-decoration: none;
}

.sec-collaboration__photo-wrap {
  flex: 0 0 auto;
  overflow: hidden;
  height: calc(0.1388888889 * min(100vw, 1440px));
}

.sec-collaboration__photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.sec-collaboration__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(0.0125 * min(100vw, 1440px));
  padding: calc(0.0125 * min(100vw, 1440px)) calc(0.0152777778 * min(100vw, 1440px)) calc(0.0152777778 * min(100vw, 1440px));
  background: rgba(238, 238, 238, 0.5);
}

.sec-collaboration__date {
  margin: 0;
  padding: calc(0.0013888889 * min(100vw, 1440px)) calc(0.0069444444 * min(100vw, 1440px));
  background: #18242c;
  color: #fff;
  font-size: max(12px, 12 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(14 / 12);
}

.sec-collaboration__name {
  margin: 0;
  color: #18242c;
  font-size: max(16px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 600;
  line-height: calc(20 / 16);
}

.sec-collaboration__body .c-view-more {
  align-self: flex-end;
  margin-top: auto;
}

/* ホバーで画像を拡大し、外すと戻す */
@media (hover: hover) {
  .sec-collaboration__link:hover .sec-collaboration__photo {
    transform: scale(1.08);
  }
  .sec-collaboration__link:hover .c-view-more__arrow-track {
    transform: translate(100%, -100%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .sec-collaboration__photo {
    transition: none;
  }
  .sec-collaboration__link:hover .sec-collaboration__photo,
  .sec-collaboration__link:hover .c-view-more__arrow-track {
    transform: none;
  }
}
.sec-collaboration__more {
  display: flex;
  justify-content: center;
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
}

/* 1280px以下。3列だと見出しが詰まるので2列 */
@media (max-width: 1280px) {
  .sec-collaboration__list {
    flex-wrap: wrap;
    gap: 24px;
  }
  .sec-collaboration__card {
    width: calc((100% - 24px) / 2);
    min-height: 0;
  }
  .sec-collaboration__photo-wrap {
    height: auto;
    aspect-ratio: 370/200;
  }
}
/* 768px以下。見出し、導入、新着カードの順に積む */
@media (max-width: 768px) {
  .sec-collaboration {
    width: 100%;
  }
  /* PCと同じく右上。右へ少し出し、上のセクションへ少し重ねる */
  .sec-collaboration__illust {
    top: -24px;
    right: -12px;
    left: auto;
    width: min(200px, 38vw);
    height: auto;
  }
  .sec-collaboration__frame {
    width: 100%;
    padding: 40px 20px 48px;
  }
  .sec-collaboration__head {
    height: auto;
  }
  .sec-collaboration__head .c-index-title__en {
    position: relative;
    top: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-collaboration__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-collaboration__intro {
    margin-top: 20px;
  }
  .sec-collaboration__lead {
    font-size: 18px;
    line-height: 1.7;
  }
  .sec-collaboration__desc {
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.9;
  }
  .sec-collaboration__list {
    flex-direction: column;
    gap: 28px;
    margin-top: 28px;
  }
  .sec-collaboration__card {
    width: 100%;
    min-height: 0;
  }
  .sec-collaboration__link {
    border-top-width: 5px;
  }
  .sec-collaboration__photo-wrap {
    height: auto;
    aspect-ratio: 370/200;
  }
  .sec-collaboration__body {
    gap: 12px;
    padding: 16px 16px 18px;
  }
  .sec-collaboration__date {
    padding: 2px 10px;
    font-size: 12px;
    line-height: 1.4;
  }
  .sec-collaboration__name {
    font-size: 16px;
    line-height: 1.5;
  }
  .sec-collaboration__more {
    margin-top: 28px;
  }
}
@media (max-width: 386px) {
  .sec-collaboration__break {
    display: block;
  }
}
/* ------------------------------------------------------------------------------
  Top : よくあるご質問（sec-qa）
------------------------------------------------------------------------------ */
.sec-qa {
  position: relative;
  z-index: 1;
  width: 100%;
  /* 1440pxまでは画像全体。それより広い画面は高さを止め、上の空を切る */
  min-height: calc(0.3876953125 * min(100vw, 1440px));
  margin-right: auto;
  margin-left: auto;
  overflow: hidden;
  /* 画像より上に出る空。グラデーションの上端と同じ色 */
  background-color: #c5ebff;
}

/* 1440pxまでは qa_bg.jpg（1024×640）。それより広い画面は qa_bg_wide.jpg
   画像は横幅いっぱいの本来の高さ。開閉でも拡大しない */
.sec-qa__bg {
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  /* 画像の上端に続く空。写真の上端色でつなぐ */
}
.sec-qa__bg::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 100%;
  left: 0;
  height: 320px;
  background-image: linear-gradient(180deg, #c5ebff 0%, #7ed0fe 42%, #18a9fc 100%);
}
.sec-qa__bg img {
  display: block;
  width: 100%;
  height: auto;
}

.sec-qa__fade {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(0.0625 * min(100vw, 1440px));
  background-image: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0.8) 36.538%, rgba(255, 255, 255, 0.5) 60.096%, rgba(255, 255, 255, 0.2) 80%, rgba(255, 255, 255, 0) 100%);
  pointer-events: none;
}

.sec-qa__frame {
  position: relative;
  z-index: 2;
  width: calc(0.8333333333 * min(100%, 1440px));
  margin-right: auto;
  margin-left: auto;
  padding-top: calc(0.0694444444 * min(100vw, 1440px));
  /* 質問の下端から赤い帯の波形まで100px。帯の重なりは広い画面ほど増える */
  padding-bottom: max(160px, 100px + 3.125vw);
}

.sec-qa__head {
  position: relative;
  height: calc(0.0486111111 * min(100vw, 1440px));
}

.sec-qa__head .c-index-title__en {
  position: absolute;
  top: 0;
  left: 0;
  font-size: max(14px, 14 / 1440 * min(100vw, 1440px));
  letter-spacing: calc(0.0009722222 * min(100vw, 1440px));
  transform: translateY(-50%);
}

.sec-qa__head .c-index-title__ja {
  font-size: max(24px, 36 / 1440 * min(100vw, 1440px));
  line-height: calc(70 / 36);
}

.sec-qa__list {
  display: flex;
  flex-direction: column;
  gap: calc(0.0069444444 * min(100vw, 1440px));
  margin-top: calc(0.0173611111 * min(100vw, 1440px));
}

.sec-qa__item {
  background: rgba(255, 255, 255, 0.8);
}

.sec-qa__q {
  display: flex;
  align-items: center;
  gap: calc(0.0138888889 * min(100vw, 1440px));
  width: 100%;
  padding: calc(0.0208333333 * min(100vw, 1440px)) calc(0.0104166667 * min(100vw, 1440px));
  text-align: left;
}

.sec-qa__mark {
  position: relative;
  flex: 0 0 auto;
  width: calc(0.0208333333 * min(100vw, 1440px));
  height: calc(0.0208333333 * min(100vw, 1440px));
}

.sec-qa__mark img {
  display: block;
  width: 100%;
  height: 100%;
}

.sec-qa__mark-text {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: max(14px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: 1;
}

.sec-qa__mark--a {
  border-radius: 50%;
  background: #0c6cb5;
}

.sec-qa__q-text,
.sec-qa__a-text {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  color: #18242c;
  font-size: max(15px, 16 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 16);
}

.sec-qa__icon {
  flex: 0 0 auto;
  width: calc(0.0138888889 * min(100vw, 1440px));
  margin-left: auto;
  color: #18242c;
  font-size: max(16px, 20 / 1440 * min(100vw, 1440px));
  font-weight: 500;
  line-height: calc(30 / 20);
  text-align: center;
}

.sec-qa__icon::before {
  content: "＋";
}

.sec-qa__item.is-open .sec-qa__icon::before {
  content: "－";
}

.sec-qa__a {
  display: flex;
  align-items: flex-start;
  gap: calc(0.0138888889 * min(100vw, 1440px));
  height: 0;
  margin-top: 0;
  padding-right: calc(0.0104166667 * min(100vw, 1440px));
  padding-left: calc(0.0451388889 * min(100vw, 1440px));
  overflow: hidden;
  opacity: 0;
}

/* 768px以下。見出しと質問を読みやすいサイズにし、背景の空は上、道は質問の下に残す */
@media (max-width: 768px) {
  .sec-qa__fade {
    height: 40px;
  }
  .sec-qa__frame {
    width: 100%;
    padding: 48px 20px 148px;
  }
  .sec-qa__head {
    height: auto;
  }
  .sec-qa__head .c-index-title__en {
    position: relative;
    top: auto;
    font-size: 14px;
    letter-spacing: 0.1em;
    transform: none;
  }
  .sec-qa__head .c-index-title__ja {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.4;
  }
  .sec-qa__list {
    gap: 10px;
    margin-top: 20px;
  }
  .sec-qa__q {
    gap: 12px;
    padding: 14px 12px;
  }
  .sec-qa__mark {
    width: 28px;
    height: 28px;
  }
  .sec-qa__mark-text {
    font-size: 14px;
  }
  .sec-qa__q-text,
  .sec-qa__a-text {
    font-size: 15px;
    line-height: 1.6;
  }
  .sec-qa__icon {
    width: 16px;
    font-size: 16px;
    line-height: 1;
  }
  /* Qの文字始まりにAマークを揃える。12 + 28 + 12 */
  .sec-qa__a {
    gap: 12px;
    padding-right: 12px;
    padding-left: 52px;
  }
}
/* 1行に収まらない幅だけ、意味の切れ目で改行する */
.sec-qa__break {
  display: none;
}

@media (max-width: 452px) {
  .sec-qa__break--term {
    display: block;
  }
}
@media (max-width: 392px) {
  .sec-qa__break--school {
    display: block;
  }
}
/* ------------------------------------------------------------------------------
  スクロール出現アニメーション（共通・汎用）
  ※ 初期状態(opacity/transform)はCSSではなくjs/config.jsの initScrollReveal() が
    GSAPで付与する（JS未実行時に要素が消えたままにならないようにするため）
  ※ will-changeはページ読み込み時に全要素へ一括指定せず、アニメーション開始直前～
    完了直後だけjs/config.js側でインラインstyleとして付与/解除する
    （1ページ内に .u-reveal 対象が多数あるページで、画面外の要素までまとめて
      コンポジットレイヤー化され続けることによるスクロール時のもたつきを防ぐため）
  単体要素   : .u-reveal（既定=フェードアップ） / .u-reveal--fade / .u-reveal--scale
  グループ   : .u-reveal-group（既定=フェードアップ） / .u-reveal-group--scale
             直下の子要素が自動でスタガー登場する（子要素側の変更は不要）
------------------------------------------------------------------------------ */