/* Figma「理念」922:12999。共通ヘッダー・フッターには適用しない。 */
.koka-philosophy-page { margin: 0; background: #fff; min-width: 0; }
.koka-philosophy-page #wrapperPankuzu { display: block; }
.koka-philosophy-page #wrapperPankuzu #pankuzu .breadcrumbs article section ul { font-size: 14px; }
.koka-philosophy {
  --philosophy-blue: #003b93;
  --philosophy-light: #eefaff;
  --philosophy-gradient: linear-gradient(90deg, #ffe100 0%, #66bfbb 51.442%, #ffb1c2 100%);
  color: #000;
  font: 400 16px/2 'Noto Sans JP', 'Zen Kaku Gothic New', sans-serif;
}
.koka-philosophy *, .koka-philosophy *::before, .koka-philosophy *::after { box-sizing: border-box; }
.koka-philosophy :where(h1, h2, p, ol, ul, figure) { margin: 0; padding: 0; }
.koka-philosophy :where(ol, ul) { list-style: none; }
.koka-philosophy :where(h1, h2) { font-weight: 400; }
.koka-philosophy p { font-size: inherit; line-height: 2; }
.koka-philosophy img { display: block; max-width: 100%; height: auto; }
.koka-philosophy a, .koka-philosophy a:link, .koka-philosophy a:visited { color: inherit; text-decoration: none; }
.koka-philosophy a:hover { opacity: 1; }
.koka-philosophy a:focus-visible { outline: 3px solid var(--philosophy-blue); outline-offset: 5px; }
.koka-philosophy-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.koka-philosophy-container { width: calc(100% - 230px); max-width: 1170px; margin-inline: auto; }
.koka-philosophy-desktop-break { display: block; }

.koka-philosophy-hero { display: grid; grid-template-columns: 52.942% minmax(0, 1fr); align-items: center; }
.koka-philosophy-hero__photo { position: relative; aspect-ratio: 741.184 / 515.149; overflow: hidden; }
/* Figmaの校舎画像は縦長の原画像。表示窓と切り取り位置を維持する。 */
.koka-philosophy .koka-philosophy-hero__photo img { position: absolute; width: 165.79%; height: 300%; max-width: none; left: -65.83%; top: -152.72%; }
.koka-philosophy-hero__title { width: min(32.643vw, 550px); margin-top: 10px; margin-left: 4.571vw; overflow: hidden; }
.koka-philosophy-hero__title img { width: 100%; }
.koka-philosophy-intro { padding-top: 64px; padding-bottom: 116px; }
.koka-philosophy-intro h2 { font-size: 36px; line-height: 1.5; }
.koka-philosophy-intro p { margin-top: 22px; }

.koka-philosophy-principles { padding: 96px 0 160px; background: var(--philosophy-light); }
.koka-philosophy-principle + .koka-philosophy-principle { margin-top: 104px; }
.koka-philosophy-principle h2 { display: flex; align-items: center; gap: 24px; }
.koka-philosophy-gradient { flex: 0 0 auto; width: fit-content; margin-right: -.1em; color: #66bfbb; font-size: clamp(44px, 5.282vw, 73.946px); font-weight: 500; line-height: 1.1; letter-spacing: .1em; }
@supports (background-clip: text) {
  .koka-philosophy-gradient { background-image: var(--philosophy-gradient); background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
}
.koka-philosophy-principle__subtitle { font-size: 24px; line-height: 1.8; }
.koka-philosophy-principle p { margin-top: 24px; padding-left: 6px; }
.koka-philosophy-principle small { font-size: inherit; }
.koka-philosophy-principle:last-child p { margin-top: 36px; padding-left: 14px; }

.koka-philosophy-values { padding: 159px 0 156px; }
.koka-philosophy-values__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 577px); align-items: start; gap: 80px; width: calc(100% - 200px); max-width: 1200px; margin-inline: auto; }
.koka-philosophy-values__heading { margin: 0; padding: 5px 0 0 28px; }
.koka-philosophy-values__heading h2 { width: fit-content; color: #66bfbb; font-size: 96px; line-height: 100px; letter-spacing: .15em; }
.koka-philosophy-values__heading h2 span { display: block; }
@supports (background-clip: text) {
  .koka-philosophy-values__heading h2 { background: conic-gradient(from 90deg at 50% 50%, #ffb1c2 0%, #b3b8be 24.279%, #8cbbbd 36.418%, #66bfbb 48.558%, #8cc88c 61.418%, #b3d05e 74.279%, #c6d446 80.709%, #d9d92f 87.139%, #ecdd17 93.57%, #f5df0c 96.785%, #ffe100 100%); background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
}
.koka-philosophy-values__heading p { margin: 22px 0 0 7px; color: #444; font-size: 24px; line-height: 32px; letter-spacing: .15em; }
.koka-philosophy-values__list { display: grid; gap: 28px; }
.koka-philosophy-values__list li { display: flex; align-items: center; gap: 24px; min-height: 85px; padding: 18px 26px; background: var(--philosophy-light); color: var(--philosophy-blue); font-size: 24px; line-height: 32px; }
.koka-philosophy-values__number { flex: 0 0 34px; color: #cee3eb; font: 700 36px/32px 'Barlow Numerals', sans-serif; }

.koka-philosophy-related { width: calc(100% - 200px); max-width: 1200px; margin-inline: auto; padding-bottom: 178px; }
.koka-philosophy-related ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 32px; }
.koka-philosophy-related__link { display: flex; align-items: center; gap: 20px; min-height: 140px; padding: 20px 17px; background: #ecf2f9; transition: background-color .25s; }
.koka-philosophy-related__link:hover { background: #e1ebf6; }
.koka-philosophy-related__photo { position: relative; flex: 0 0 103.359px; height: 100px; mask: url('/img/outline/philosophy/portrait-mask-wide.svg') center / 100% 100% no-repeat; }
.koka-philosophy-related__link--history .koka-philosophy-related__photo, .koka-philosophy-related__link--gakuen .koka-philosophy-related__photo { flex-basis: 100px; mask-image: url('/img/outline/philosophy/portrait-mask-circle.svg'); }
.koka-philosophy .koka-philosophy-related__photo img { position: absolute; width: 154.217%; height: 106.265%; max-width: none; left: -25.143%; top: -3.013%; object-fit: cover; transition: scale .4s cubic-bezier(.22, 1, .36, 1); }
.koka-philosophy .koka-philosophy-related__link--policy img { left: -38.582%; }
.koka-philosophy .koka-philosophy-related__link--history img { width: 156.786%; height: 104.524%; left: -19.021%; top: -2.143%; }
.koka-philosophy .koka-philosophy-related__link--access img { width: 168.38%; height: 116.028%; left: 1.73%; top: -15.74%; }
.koka-philosophy .koka-philosophy-related__link--gakuen img { width: 156.786%; height: 104.524%; left: -26.428%; top: -2.143%; }
.koka-philosophy-related__link:hover img { scale: 1.035; }
.koka-philosophy-related__label { flex: 1; min-width: 0; font-size: 20px; font-weight: 500; line-height: 1.55; letter-spacing: .05em; }
.koka-philosophy-related__arrow { display: grid; place-items: center; flex: 0 0 35px; height: 35px; border-radius: 50%; background: #fff; color: var(--philosophy-blue); font-size: 15px; }

@media (min-width: 1200px) {
  .koka-philosophy-gradient { position: relative; top: -6px; }
  .koka-philosophy-principle:first-child h2 { gap: 20px; }
  .koka-philosophy-principle:nth-child(2) h2 { gap: 28px; }
  .koka-philosophy-values__heading h2 { position: relative; top: -8px; }
}
@media (max-width: 1199px) {
  .koka-philosophy-container { width: calc(100% - 104px); }
  .koka-philosophy-intro h2 { font-size: 30px; }
  .koka-philosophy-desktop-break { display: none; }
  .koka-philosophy-principle h2 { flex-wrap: wrap; gap: 12px 24px; }
  .koka-philosophy-values__inner { width: calc(100% - 104px); grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 40px; }
  .koka-philosophy-values__heading { padding-left: 0; }
  .koka-philosophy-values__heading h2 { font-size: 72px; line-height: 1.1; }
  .koka-philosophy-values__heading p { font-size: 18px; letter-spacing: .1em; }
  .koka-philosophy-values__list li { gap: 18px; font-size: 20px; padding-inline: 20px; }
  .koka-philosophy-related { width: calc(100% - 104px); }
  .koka-philosophy-related ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .koka-philosophy-related__link { gap: 16px; padding: 16px; }
  .koka-philosophy-related__label { font-size: 18px; }
}
@media (max-width: 1023px) {
  .koka-philosophy-container { width: calc(100% - 64px); }
  .koka-philosophy-intro { padding: 56px 0 72px; }
  .koka-philosophy-principles { padding: 72px 0 88px; }
  .koka-philosophy-principle + .koka-philosophy-principle { margin-top: 72px; }
  .koka-philosophy-principle__subtitle { font-size: 21px; }
  .koka-philosophy-values { padding: 88px 0 80px; }
  .koka-philosophy-values__inner { width: calc(100% - 64px); gap: 24px; }
  .koka-philosophy-values__heading h2 { font-size: 60px; }
  .koka-philosophy-values__list { gap: 18px; }
  .koka-philosophy-values__list li { gap: 14px; font-size: 17px; }
  .koka-philosophy-related { width: calc(100% - 64px); padding-bottom: 88px; }
  .koka-philosophy-related__photo { flex-basis: 82.687px; height: 80px; }
  .koka-philosophy-related__link--history .koka-philosophy-related__photo, .koka-philosophy-related__link--gakuen .koka-philosophy-related__photo { flex-basis: 80px; }
  .koka-philosophy-related__link { min-height: 112px; }
  .koka-philosophy-related__label { font-size: 16px; }
}
@media (max-width: 767px) {
  .koka-philosophy { font-size: 15px; }
  .koka-philosophy-container { width: calc(100% - 40px); }
  .koka-philosophy-hero { grid-template-columns: minmax(0, 1fr); }
  .koka-philosophy-hero__title { width: min(100% - 64px, 360px); margin: 32px auto 0; }
  .koka-philosophy-intro { padding: 40px 0 64px; }
  .koka-philosophy-intro h2 { font-size: 24px; line-height: 1.75; }
  .koka-philosophy-intro p { margin-top: 24px; }
  .koka-philosophy-principles { padding: 64px 0 72px; }
  .koka-philosophy-principle + .koka-philosophy-principle { margin-top: 56px; }
  .koka-philosophy-principle h2 { flex-direction: column; align-items: flex-start; gap: 16px; }
  .koka-philosophy-gradient { max-width: 100%; font-size: clamp(32px, 9.2vw, 52px); }
  .koka-philosophy-principle__subtitle { font-size: 18px; line-height: 1.75; }
  .koka-philosophy-principle p, .koka-philosophy-principle:last-child p { margin-top: 24px; padding-left: 0; }
  .koka-philosophy-principle small { display: inline-block; margin-top: 8px; font-size: 13px; line-height: 1.85; }
  .koka-philosophy-values { padding: 64px 0 56px; }
  .koka-philosophy-values__inner { width: calc(100% - 40px); grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .koka-philosophy-values__heading { padding: 0; }
  .koka-philosophy-values__heading h2 { font-size: clamp(56px, 16.4vw, 80px); letter-spacing: .1em; }
  .koka-philosophy-values__heading p { margin: 20px 0 0; font-size: 16px; line-height: 1.8; letter-spacing: .1em; }
  .koka-philosophy-values__list { gap: 12px; }
  .koka-philosophy-values__list li { gap: 16px; min-height: 76px; padding: 18px 16px; font-size: 16px; line-height: 1.75; }
  .koka-philosophy-values__number { flex-basis: 30px; font-size: 28px; }
  .koka-philosophy-related { width: calc(100% - 40px); padding-bottom: 72px; }
  .koka-philosophy-related ul { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .koka-philosophy-related__link { min-height: 98px; gap: 16px; padding: 14px; }
  .koka-philosophy-related__photo { flex-basis: 72.351px; height: 70px; }
  .koka-philosophy-related__link--history .koka-philosophy-related__photo, .koka-philosophy-related__link--gakuen .koka-philosophy-related__photo { flex-basis: 70px; }
  .koka-philosophy-related__arrow { flex-basis: 32px; height: 32px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .koka-philosophy-related__link, .koka-philosophy .koka-philosophy-related__photo img { transition: none; }
  .koka-philosophy-related__link:hover img { scale: none; }
}
