@charset "UTF-8";
/* ============================================
   問いの編集室 - マガジン専用CSS
   magazine.css
   ============================================ */
/**
 * uaplus.css version 0.3.0
 */
@layer {
  *, *::after, *::before {
    box-sizing: border-box;
  }
  :focus-visible {
    outline-offset: 3px;
  }
  html {
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
  }
  html {
    line-height: 1.5;
  }
  html {
    scrollbar-gutter: stable;
  }
  h1 {
    font-size: 2em;
    margin-block: 0.67em;
  }
  abbr[title] {
    cursor: help;
    text-decoration-line: underline;
    text-decoration-style: dotted;
  }
  @media (forced-colors: active) {
    mark {
      color: HighlightText;
      background-color: Highlight;
    }
  }
  audio, iframe, img, svg, video {
    max-block-size: 100%;
    max-inline-size: 100%;
  }
  fieldset {
    min-inline-size: 0;
  }
  label:has(+ input:not([type=radio], [type=checkbox]), select, textarea) {
    display: block;
  }
  textarea:not([rows]) {
    min-block-size: 6em;
  }
  button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
  }
  [type=search] {
    -webkit-appearance: textfield;
  }
  @supports (-webkit-touch-callout: none) {
    [type=search] {
      border: 1px solid -apple-system-secondary-label;
      background-color: canvas;
    }
  }
  input:where([type=tel], [type=url], [type=email], [type=number]):not(:placeholder-shown) {
    direction: ltr;
  }
  table {
    border-collapse: collapse;
    border: 1px solid;
  }
  th, td {
    border: 1px solid;
    padding: 0.25em 0.5em;
    vertical-align: top;
  }
  dialog::backdrop {
    background: oklch(0% 0 0deg / 0.3);
  }
  dialog, [popover], dialog::backdrop {
    opacity: 0;
    transition: opacity 150ms ease-out, display 150ms allow-discrete, overlay 150ms allow-discrete;
  }
  dialog[open], :popover-open, dialog[open]::backdrop {
    opacity: 1;
  }
  @starting-style {
    dialog[open], :popover-open, dialog[open]::backdrop {
      opacity: 0;
    }
  }
  [hidden]:not([hidden=until-found]) {
    display: none !important;
  }
  img {
    display: block;
  }
  summary {
    cursor: default;
  }
  iframe {
    border: none;
  }
  @supports (position-area: block-end span-inline-end) {
    [popover] {
      margin: 0;
      position-area: block-end span-inline-end;
    }
  }
}
/**********************************
* Media queries breakpoints
**********************************/
/* Extra small screen / phone
------------------------*/
/* Small screen / tablet
------------------------*/
/* Medium screen / desktop
------------------------*/
/* Large screen / wide desktop
------------------------*/
/* So media queries don't overlap when required, provide a maximum
------------------------*/
/**********************************
* Responsive mixins
**********************************/
/* --- CSS変数 --- */
:root {
  --yellow: #E5F500;
  --blue: #007FE8;
  --blue-rgb: 0, 127, 232;
}

/* --- リセット・基本設定 --- */
html {
  scrollbar-gutter: stable;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
}

.global-wrapper {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, Meiryo, sans-serif;
  color: #000;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.8;
}

.global-wrapper *,
.global-wrapper *::before,
.global-wrapper *::after {
  box-sizing: border-box;
}
.global-wrapper :where(a) {
  color: inherit;
  text-decoration: none;
}
.global-wrapper :where(figure) {
  margin: 0;
}
.global-wrapper :where(img) {
  max-width: 100%;
  height: auto;
}
.global-wrapper :where(h1, h2, h3, h4, h5, h6) {
  margin: 0;
}
.global-wrapper :where(p) {
  margin: 0;
}
.global-wrapper :where(ul) {
  margin: 0;
}

.contents {
  overflow: hidden;
}

.header {
  position: sticky;
  top: 0;
  z-index: 100;
}
@media screen and (min-width: 768px) {
  .header {
    position: static;
  }
}
.header__group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 2.6666666667vw;
  background: #fff;
}
@media screen and (min-width: 768px) {
  .header__group {
    padding-left: 1.875vw;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    transform: translateY(-100%);
    transition: transform 0.3s ease;
  }
  .header__group.is-active {
    transform: translateY(0);
  }
}

.header-logo {
  display: flex;
  align-items: center;
  gap: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .header-logo {
    gap: 1.25vw;
  }
}
.header-logo__img {
  width: 38.9333333333vw;
  height: 9.6vw;
}
@media screen and (min-width: 768px) {
  .header-logo__img {
    width: 16.875vw;
    height: 3.4375vw;
  }
}
.header-logo__text {
  font-size: 3.7333333333vw;
  font-weight: 600;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .header-logo__text {
    font-size: 1.09375vw;
  }
}

.global-nav-open-button {
  background: #455272;
  border: none;
  cursor: pointer;
  display: grid;
  gap: 1.0666666667vw;
  padding: 4.6666666667vw 4.2666666667vw;
  width: 18.6666666667vw;
}
@media screen and (min-width: 768px) {
  .global-nav-open-button {
    gap: 0.78125vw;
    padding: 1.25vw 1.09375vw;
    width: 6.640625vw;
  }
}
.global-nav-open-button__line {
  width: 100%;
  height: 1px;
  background: #fff;
}

.global-nav {
  position: fixed;
  top: 0;
  right: 0;
  width: 90.4vw;
  max-height: 100%;
  overflow: auto;
  background: #fff;
  transform: translateX(100%);
  transition: transform 0.3s ease;
  z-index: 101;
  padding: 0 4.2666666667vw 6.4vw;
}
@media screen and (min-width: 768px) {
  .global-nav {
    width: 63.125vw;
    padding: 1.875vw 1.875vw 3.75vw;
    display: grid;
    grid-template-columns: 476fr 260fr;
    gap: 0 1.875vw;
  }
}
.global-nav.is-open {
  transform: translateX(0);
}
.global-nav__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .global-nav__heading {
    padding-left: 1.25vw;
    grid-column: 1/span 2;
  }
}
@media screen and (max-width: 767px) {
  .global-nav__heading .header-logo__img {
    display: none;
  }
}

.overlay {
  position: fixed;
  inset: 0;
  background: rgba(var(--blue-rgb), 0.1);
  opacity: 0;
  pointer-events: none;
  transition: 0.3s;
  z-index: 100;
}
.overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}

.global-nav-close-button {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.global-nav-close-button img {
  width: 18.6666666667vw;
  height: 12.2666666667vw;
}
@media screen and (min-width: 768px) {
  .global-nav-close-button img {
    width: 7.421875vw;
    height: 4.84375vw;
  }
}

.primary-nav {
  padding: 4.2666666667vw;
  list-style: none;
}
@media screen and (min-width: 768px) {
  .primary-nav {
    padding: 1.25vw 1.25vw 0;
  }
}
.primary-nav__item:not(:last-child) {
  border-bottom: 1px solid #CCCCCC;
}
.primary-nav__link {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  padding: 2.6666666667vw 2.6666666667vw 2.4vw;
  gap: 0 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .primary-nav__link {
    padding: 0.8984375vw 0.78125vw 0.8203125vw;
    gap: 0 0.625vw;
  }
  .primary-nav__link:hover .primary-nav__text {
    color: var(--blue);
  }
  .primary-nav__link:hover .icon--arrow-right {
    color: var(--blue);
  }
}
.primary-nav__en {
  font-weight: 600;
  font-size: 2.6666666667vw;
  line-height: 1.2;
  color: var(--blue);
}
@media screen and (min-width: 768px) {
  .primary-nav__en {
    font-size: 0.859375vw;
  }
}
.primary-nav__text {
  font-weight: 600;
  font-size: 4vw;
  line-height: 1.6;
}
@media screen and (min-width: 768px) {
  .primary-nav__text {
    font-size: 2.03125vw;
    line-height: 1.4;
    transition: color 0.3s ease;
  }
}
.primary-nav .icon--arrow-right {
  grid-row: 1/span 2;
  grid-column: 2;
  width: 9.0666666667vw;
}
@media screen and (min-width: 768px) {
  .primary-nav .icon--arrow-right {
    width: 2.65625vw;
    transition: color 0.3s ease;
  }
}

.side-navs {
  background: rgba(var(--blue-rgb), 0.1);
  padding: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .side-navs {
    padding: 1.25vw;
    display: grid;
    grid-template-rows: auto 1fr;
  }
}

.secondary-nav {
  margin-bottom: 4.2666666667vw;
  display: grid;
  gap: 1px;
  list-style: none;
  padding: 0;
}
@media screen and (min-width: 768px) {
  .secondary-nav {
    margin-bottom: 1.25vw;
  }
}
.secondary-nav__link {
  display: block;
  background: #fff;
  padding: 1.0666666667vw;
  font-size: 3.7333333333vw;
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .secondary-nav__link {
    padding: 0.625vw;
    font-size: 1.09375vw;
    transition: all 0.3s ease;
  }
  .secondary-nav__link:hover {
    color: #fff;
    background: var(--blue);
  }
}

.header-sns {
  width: 45.3333333333vw;
  margin-inline: auto;
  padding: 1.0666666667vw 0;
}
@media screen and (min-width: 768px) {
  .header-sns {
    width: 13.28125vw;
    display: grid;
    place-content: center;
  }
}
.header-sns__inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .header-sns__inner {
    gap: 0 0.625vw;
  }
}
.header-sns__item svg {
  width: 10.6666666667vw;
  height: 10.6666666667vw;
  color: #000;
}
@media screen and (min-width: 768px) {
  .header-sns__item svg {
    width: 3.75vw;
    height: 3.75vw;
    transition: color 0.3s ease;
  }
}
@media screen and (min-width: 768px) {
  .header-sns__item:hover svg {
    color: var(--blue);
  }
}

.footer {
  background: #333333;
  color: #fff;
  padding: 10.6666666667vw 4.2666666667vw 6.4vw;
}
@media screen and (min-width: 768px) {
  .footer {
    padding: 3.125vw 7.8125vw 1.875vw;
  }
}

.footer-sns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4.2666666667vw;
  margin-bottom: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .footer-sns {
    gap: 1.25vw;
    margin-bottom: 1.25vw;
  }
}
.footer-sns__item {
  display: block;
  width: 12.8vw;
  height: 12.8vw;
}
@media screen and (min-width: 768px) {
  .footer-sns__item {
    width: 3.75vw;
    height: 3.75vw;
    transition: color 0.3s ease;
  }
  .footer-sns__item:hover {
    color: var(--blue);
  }
}
.footer-sns__item img {
  width: 100%;
}

.footer-links {
  font-size: 3.4666666667vw;
  margin-bottom: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .footer-links {
    font-size: 1.015625vw;
    margin-bottom: 1.875vw;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 1.25vw;
  }
}
.footer-links__title {
  text-align: center;
  margin-bottom: 4.2666666667vw;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .footer-links__title {
    margin-bottom: 0;
  }
}
.footer-links__list {
  display: grid;
  gap: 2.1333333333vw;
  grid-template-columns: 1fr 1fr;
}
@media screen and (min-width: 768px) {
  .footer-links__list {
    display: flex;
    gap: 0.625vw;
  }
}
.footer-links__list-item {
  border: 1px solid #fff;
  padding: 0.9333333333vw;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .footer-links__list-item {
    width: 100%;
    padding: 0.9765625vw 0;
    transition: all 0.3s ease;
  }
  .footer-links__list-item:hover {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
  }
}

.footer-cta-button {
  background: #fff;
  color: #000;
  display: block;
  margin-bottom: 4.2666666667vw;
  padding: 2.1333333333vw;
  text-align: center;
  font-size: 3.4666666667vw;
}
@media screen and (min-width: 768px) {
  .footer-cta-button {
    margin-bottom: 1.25vw;
    padding: 0.625vw;
    font-size: 1.015625vw;
    transition: all 0.3s ease;
  }
  .footer-cta-button:hover {
    background: var(--blue);
    color: #fff;
  }
}
.footer-cta-button span {
  font-size: 4vw;
}
@media screen and (min-width: 768px) {
  .footer-cta-button span {
    font-size: 1.171875vw;
  }
}

.copyright {
  font-size: 3.4666666667vw;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .copyright {
    font-size: 1.171875vw;
  }
}

[data-animate] {
  opacity: 0;
  transition: all 0.6s ease;
}

.is-animated {
  opacity: 1;
}

[data-animate=slide-to-top] {
  transform: translateY(30px);
}
[data-animate=slide-to-top].is-animated {
  transform: translateX(0);
}

[data-animate=slide-to-left] {
  transform: translateX(30px);
}
[data-animate=slide-to-left].is-animated {
  transform: translateX(0);
}

[data-animate=slide-to-right] {
  transform: translateX(-30px);
}
[data-animate=slide-to-right].is-animated {
  transform: translateX(0);
}

[data-animate-onload=fluffy-1].is-animated {
  animation: fluffy-1-sp 3s ease-in-out infinite;
}
@media screen and (min-width: 768px) {
  [data-animate-onload=fluffy-1].is-animated {
    animation: fluffy-1-pc 3s ease-in-out infinite;
  }
}

@keyframes fluffy-1-sp {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-2.6666666667vw);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes fluffy-1-pc {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-0.78125vw);
  }
  100% {
    transform: translateY(0);
  }
}
[data-animate-onload=fluffy-2].is-animated {
  animation: fluffy-2-sp 3s ease-in-out infinite;
}
@media screen and (min-width: 768px) {
  [data-animate-onload=fluffy-2].is-animated {
    animation: fluffy-2-pc 3s ease-in-out infinite;
  }
}

@keyframes fluffy-2-sp {
  0% {
    transform: translateY(-2.6666666667vw);
  }
  50% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-2.6666666667vw);
  }
}
@keyframes fluffy-2-pc {
  0% {
    transform: translateY(-0.78125vw);
  }
  50% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-0.78125vw);
  }
}
.icon {
  display: inline-block;
  position: relative;
}
.icon::before {
  content: "";
  position: absolute;
  inset: 0;
}

.icon--arrow-right {
  width: 13.6vw;
  height: 3.7333333333vw;
}
@media screen and (min-width: 768px) {
  .icon--arrow-right {
    width: 4.0625vw;
    height: 0.9375vw;
  }
}

.icon--pdf {
  width: 4.6666666667vw;
  height: 5.7333333333vw;
}
@media screen and (min-width: 768px) {
  .icon--pdf {
    width: 1.9921875vw;
    height: 2.4609375vw;
  }
}

.global-wrapper .button--primary {
  font-size: 4vw;
  font-weight: 700;
  line-height: 1.4;
  border-radius: 26.6666666667vw;
  padding: 4vw 6.1333333333vw 4vw 10.4vw;
  border: 1px solid var(--yellow);
  min-width: 74.6666666667vw;
  width: fit-content;
  background: var(--yellow);
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .global-wrapper .button--primary {
    font-size: 1.171875vw;
    border-radius: 7.8125vw;
    padding: 1.25vw 1.796875vw 1.25vw 3.046875vw;
    min-width: 20.3125vw;
  }
  .global-wrapper .button--primary:hover {
    transition: all 0.3s ease;
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
  }
}
.global-wrapper .button--primary .icon--arrow-right {
  margin: 0 0 2.1333333333vw 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .global-wrapper .button--primary .icon--arrow-right {
    margin: 0 0 0.46875vw 0.9375vw;
    transition: color 0.3s ease;
  }
}
.global-wrapper .button--primary .icon--pdf {
  margin-left: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .global-wrapper .button--primary .icon--pdf {
    margin-left: 1.25vw;
    transition: color 0.3s ease;
  }
}

.section-en-title {
  margin-bottom: 2.9333333333vw;
  width: fit-content;
  padding-top: 0.8vw;
}
@media screen and (min-width: 768px) {
  .section-en-title {
    padding-top: 0.46875vw;
    margin-bottom: 1.015625vw;
  }
}
.section-en-title img {
  display: block;
  height: 3.3333333333vw;
}
@media screen and (min-width: 768px) {
  .section-en-title img {
    height: 1.5625vw;
  }
}

.section-title {
  margin-bottom: 4.2666666667vw;
  font-size: 6.9333333333vw;
  line-height: 1.4;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .section-title {
    margin-bottom: 1.875vw;
    font-size: 4.6875vw;
  }
}

.section-lead {
  font-size: 4.8vw;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .section-lead {
    font-size: 1.5625vw;
  }
}

.pagetop {
  position: fixed;
  z-index: 10;
  bottom: 25.6vw;
  right: -4.2666666667vw;
  display: block;
  width: 22.4vw;
  height: 22.4vw;
}
@media screen and (min-width: 768px) {
  .pagetop {
    bottom: 10.859375vw;
    right: 1.25vw;
    width: 8.046875vw;
    height: 8.046875vw;
  }
  .pagetop:hover svg {
    color: #1569F9;
  }
}
.pagetop::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url(../images/pagetop_circle.svg) center center/cover no-repeat;
  position: absolute;
  inset: 0;
  animation: pagetop 8s linear infinite;
}
.pagetop svg {
  mix-blend-mode: multiply;
  display: block;
  width: 100%;
  height: 100%;
  color: transparent;
  transition: color 0.3s ease;
}

@keyframes pagetop {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.floating-banner {
  display: block;
  width: 54.1333333333vw;
  height: 19.2vw;
  position: fixed;
  z-index: 10;
  right: 1.6vw;
  bottom: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .floating-banner {
    width: 21.875vw;
    height: 7.734375vw;
    right: 1.25vw;
    bottom: 1.875vw;
    transition: opacity 0.3s ease;
  }
  .floating-banner:hover {
    opacity: 0.4;
  }
}
.floating-banner img {
  width: 100%;
}

.hero {
  padding: 4.8vw 3.2vw 14.9333333333vw;
  position: relative;
  z-index: 2;
}
@media screen and (min-width: 768px) {
  .hero {
    padding: 5vw 6.640625vw 12.03125vw;
  }
}
.hero__title {
  margin-bottom: 1.8666666667vw;
  position: relative;
}
@media screen and (min-width: 768px) {
  .hero__title {
    position: absolute;
    top: 0.625vw;
    left: 0;
    right: 0;
    margin: auto;
    width: fit-content;
  }
}
.hero__title-img {
  width: 89.8666666667vw;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .hero__title-img {
    width: 70.859375vw;
  }
}
.hero__title-circle {
  display: flex;
  justify-content: center;
  position: absolute;
  bottom: -8.2666666667vw;
  left: 0;
  right: 0;
  margin: auto;
}
@media screen and (min-width: 768px) {
  .hero__title-circle {
    bottom: -3.28125vw;
  }
}
.hero__title-circle span {
  font-size: 6.4vw;
  font-weight: 900;
  line-height: 1;
  display: block;
  padding: 2.5333333333vw 2.9333333333vw 3.3333333333vw;
  border: 1px solid #000;
  border-radius: 100%;
  background: #fff;
}
@media screen and (min-width: 768px) {
  .hero__title-circle span {
    font-size: 3.125vw;
    padding: 1.1328125vw 1.25vw 1.3671875vw;
  }
}
.hero__title-circle span:not(:first-child) {
  margin-left: -1.0666666667vw;
}
@media screen and (min-width: 768px) {
  .hero__title-circle span:not(:first-child) {
    margin-left: -0.3125vw;
  }
}
.hero__image {
  display: block;
  margin-bottom: 5.6vw;
}
@media screen and (min-width: 768px) {
  .hero__image {
    margin-bottom: 0;
  }
}
.hero__subtitle {
  font-size: 5.8666666667vw;
  line-height: 1.5;
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .hero__subtitle {
    writing-mode: vertical-rl;
    position: absolute;
    top: 16.953125vw;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 1.25vw;
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 0.9375vw;
    letter-spacing: 0.16em;
  }
  .hero__subtitle::after {
    content: "";
    display: block;
    width: 1px;
    height: 10.390625vw;
    background: #000;
  }
}
.hero__illust {
  position: absolute;
}
.hero__illust--bus {
  width: 20.2666666667vw;
  height: 12vw;
  top: 51.2vw;
  right: -0.8vw;
}
@media screen and (min-width: 768px) {
  .hero__illust--bus {
    width: 14.609375vw;
    height: 8.75vw;
    top: 14.453125vw;
    right: 0.703125vw;
  }
}
.hero__illust--river {
  width: 14.016vw;
  height: 18.1333333333vw;
  top: 61.3333333333vw;
  left: -4.2666666667vw;
  z-index: -1;
}
@media screen and (min-width: 768px) {
  .hero__illust--river {
    width: 6.58203125vw;
    height: 7.94296875vw;
    top: 32.64375vw;
    left: 2.1875vw;
  }
}
.hero__illust--daruma {
  display: none;
}
@media screen and (min-width: 768px) {
  .hero__illust--daruma {
    display: block;
    width: 16.25vw;
    height: 9.8046875vw;
    top: 50.546875vw;
    left: 12.578125vw;
  }
}
.hero__illust--fish {
  width: 24.2666666667vw;
  height: 16.2666666667vw;
  top: 87.2vw;
  right: 18.1333333333vw;
}
@media screen and (min-width: 768px) {
  .hero__illust--fish {
    width: 14.0625vw;
    height: 9.375vw;
    top: 44.425vw;
    right: 21.015625vw;
  }
}

.floating-logo {
  display: none;
}
@media screen and (min-width: 768px) {
  .floating-logo {
    position: absolute;
    top: 22.109375vw;
    left: 0;
    background: #fff;
    display: block;
    padding: 3.125vw 0;
    width: 19.6875vw;
  }
  .floating-logo__img {
    width: 16.875vw;
    margin: 0 auto 0.46875vw;
  }
  .floating-logo__text {
    display: block;
    text-align: center;
    font-size: 1.09375vw;
    font-weight: 600;
    line-height: 1;
  }
}

#practical {
  scroll-margin-top: 12vw;
}
@media screen and (min-width: 768px) {
  #practical {
    scroll-margin-top: 4.140625vw;
  }
}

.section-practical {
  padding: 4.5333333333vw 4.2666666667vw 18.1333333333vw;
  position: relative;
}
@media screen and (min-width: 768px) {
  .section-practical {
    padding: 2.5vw 7.8125vw 8.4375vw 4.878125vw;
  }
}

.section-heading--practical {
  text-align: center;
  margin-bottom: 4vw;
}
@media screen and (min-width: 768px) {
  .section-heading--practical {
    margin-bottom: 1.875vw;
  }
}
.section-heading--practical .section-en-title {
  margin-left: auto;
  margin-right: auto;
}

.practical-marquee {
  position: absolute;
  left: 0;
  width: 100%;
  overflow: hidden;
  z-index: -1;
}
.practical-marquee--to-left {
  top: 1.6vw;
}
@media screen and (min-width: 768px) {
  .practical-marquee--to-left {
    top: 0.625vw;
  }
}
.practical-marquee--to-left .practical-marquee__track {
  animation: practical-marquee-left 12s linear infinite;
}
.practical-marquee--to-right {
  bottom: 0;
}
.practical-marquee--to-right .practical-marquee__track {
  animation: practical-marquee-right 12s linear infinite;
}
.practical-marquee__track {
  display: flex;
  width: max-content;
}
.practical-marquee__img {
  width: 126.1333333333vw;
  flex-shrink: 0;
  margin-right: 10.6666666667vw;
}
@media screen and (min-width: 768px) {
  .practical-marquee__img {
    width: 63.90625vw;
    margin-right: 6.25vw;
  }
}

@keyframes practical-marquee-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-33.333333%);
  }
}
@keyframes practical-marquee-right {
  from {
    transform: translateX(-33.333333%);
  }
  to {
    transform: translateX(0);
  }
}
.pin {
  text-align: center;
}
.pin--soka .pin__title {
  font-size: 3.4666666667vw;
  line-height: 1.2;
}
@media screen and (min-width: 768px) {
  .pin--soka .pin__title {
    font-size: 1.328125vw;
  }
}
.pin--soka .pin__button {
  width: 4.2666666667vw;
  height: 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .pin--soka .pin__button {
    width: 2.34375vw;
    height: 3.0078125vw;
  }
}
.pin__title {
  font-size: 2.9333333333vw;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 1.0666666667vw;
}
@media screen and (min-width: 768px) {
  .pin__title {
    font-size: 1.328125vw;
    margin-bottom: 0.46875vw;
  }
}
.pin__button {
  appearance: none;
  border: none;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  width: 3.7333333333vw;
  height: 5.0666666667vw;
}
@media screen and (min-width: 768px) {
  .pin__button {
    width: 1.953125vw;
    height: 2.578125vw;
  }
}
.pin__button img {
  width: 100%;
  height: 100%;
}

.total {
  width: 16.5333333333vw;
  height: 16.5333333333vw;
  text-align: center;
  line-height: 1.2;
  font-size: 2.6666666667vw;
  font-weight: 700;
  border: 1px solid #BFEDAC;
  border-radius: 100%;
  padding-top: 2.4vw;
}
@media screen and (min-width: 768px) {
  .total {
    width: 9.84375vw;
    height: 10.234375vw;
    line-height: 1.2;
    font-size: 1.25vw;
    padding-top: 2.1875vw;
    border: 0.234375vw solid #BFEDAC;
  }
}
.total b {
  font-size: 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .total b {
    font-size: 3.125vw;
  }
}

.location-viewer {
  display: grid;
  gap: 2.4vw;
}
@media screen and (min-width: 768px) {
  .location-viewer {
    grid-template-columns: 676.8fr 400fr;
    gap: 3.125vw;
    align-items: flex-start;
  }
}

.location-map {
  position: relative;
}
.location-map__blank {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  pointer-events: none;
  transition: opacity 0.4s ease;
}
.location-map__blank.is-passed {
  opacity: 0;
}
.location-map__blank.is-passed ~ .location-map__img, .location-map__blank.is-passed ~ .pin, .location-map__blank.is-passed ~ .total {
  opacity: 1;
}
.location-map__img {
  opacity: 0;
  transition: opacity 0.4s ease;
}
.location-map .pin {
  opacity: 0;
  transition: opacity 0.4s ease, transform 0.2s ease;
  position: absolute;
}
@media screen and (min-width: 768px) {
  .location-map .pin:hover {
    transform: scale(1.2);
    transform-origin: center bottom;
  }
}
.location-map .pin--oume {
  top: 6.4vw;
  left: 35.4666666667vw;
}
@media screen and (min-width: 768px) {
  .location-map .pin--oume {
    top: 4.140625vw;
    left: 21.840625vw;
  }
}
.location-map .pin--akiruno {
  top: 18.9333333333vw;
  left: 33.8666666667vw;
}
@media screen and (min-width: 768px) {
  .location-map .pin--akiruno {
    top: 11.484375vw;
    left: 20.66875vw;
  }
}
.location-map .pin--soka {
  top: 25.6vw;
  left: 45.6vw;
}
@media screen and (min-width: 768px) {
  .location-map .pin--soka {
    top: 12.578125vw;
    left: 26.996875vw;
  }
}
.location-map .pin--hachiouji {
  top: 32vw;
  left: 34.1333333333vw;
}
@media screen and (min-width: 768px) {
  .location-map .pin--hachiouji {
    top: 18.28125vw;
    left: 25.98125vw;
  }
}
.location-map .pin--hino {
  top: 27.4666666667vw;
  left: 61.6vw;
}
@media screen and (min-width: 768px) {
  .location-map .pin--hino {
    top: 16.09375vw;
    left: 35.590625vw;
  }
}
.location-map .pin--tachikawa {
  top: 16.2666666667vw;
  left: 58.4vw;
}
@media screen and (min-width: 768px) {
  .location-map .pin--tachikawa {
    top: 10.546875vw;
    left: 35.2vw;
  }
}
.location-map .total {
  opacity: 0;
  transition: opacity 0.4s ease;
  position: absolute;
  left: 0;
  bottom: 8.2666666667vw;
}
@media screen and (min-width: 768px) {
  .location-map .total {
    left: 2.934375vw;
    bottom: 2.33125vw;
  }
}

.location-news {
  background: #F7F7F7;
  padding: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .location-news {
    padding: 0.625vw;
    margin-top: 3.125vw;
  }
}
.location-news__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 2.1333333333vw 1.0666666667vw;
  margin-bottom: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .location-news__tags {
    gap: 0.3125vw 0.625vw;
    margin-bottom: 0.625vw;
  }
}

.location-news-tag {
  border: 1px solid var(--blue);
  border-radius: 26.6666666667vw;
  color: var(--blue);
  background: #fff;
  padding: 0.8vw 4vw;
  font-size: 3.2vw;
  line-height: 1;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
}
@media screen and (min-width: 768px) {
  .location-news-tag {
    font-size: 1.09375vw;
    padding: 0.234375vw 1.171875vw;
    transition: all 0.3s ease;
  }
}
.location-news-tag.is-active {
  color: #fff;
  background: var(--blue);
}
@media screen and (min-width: 768px) {
  .location-news-tag:hover {
    color: #fff;
    background: var(--blue);
  }
}

.location-news-list {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.8vw;
  height: 73.6vw;
  overflow: auto;
}
@media screen and (min-width: 768px) {
  .location-news-list {
    gap: 0.3125vw;
    height: 21.71875vw;
  }
}
.location-news-list__item {
  padding: 3.2vw 4.2666666667vw;
  background: #fff;
  display: none;
}
@media screen and (min-width: 768px) {
  .location-news-list__item {
    padding: 0.9375vw 1.25vw;
  }
}
.location-news-list__item.is-active {
  display: block;
}
@media screen and (min-width: 768px) {
  .location-news-list__item:hover .location-news-list__title {
    text-decoration: none;
    color: var(--blue);
  }
}
.location-news-list__meta {
  display: flex;
  align-items: center;
  gap: 2.1333333333vw;
  margin-bottom: 1.0666666667vw;
}
@media screen and (min-width: 768px) {
  .location-news-list__meta {
    gap: 0.625vw;
    margin-bottom: 0.3125vw;
  }
}
.location-news-list__date {
  font-size: 3.2vw;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .location-news-list__date {
    font-size: 1.09375vw;
  }
}
.location-news-list .location-news-tag {
  padding: 0.6666666667vw 1.8666666667vw 0.9333333333vw;
}
@media screen and (min-width: 768px) {
  .location-news-list .location-news-tag {
    padding: 0.15625vw 0.546875vw 0.234375vw;
  }
}
.location-news-list__title {
  display: block;
  grid-column: 1/span 2;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-size: 4vw;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .location-news-list__title {
    font-size: 1.171875vw;
    transition: all 0.3s ease;
  }
}

#partnership {
  scroll-margin-top: 12vw;
}
@media screen and (min-width: 768px) {
  #partnership {
    scroll-margin-top: 4.140625vw;
  }
}

.section-partnership {
  background: var(--blue);
  padding: 21.3333333333vw 4.2666666667vw;
  position: relative;
  z-index: 0;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .section-partnership {
    padding: 12.1875vw 7.8125vw;
  }
}
.section-partnership__illust--map {
  width: 54vw;
  height: 44vw;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -2;
}
@media screen and (min-width: 768px) {
  .section-partnership__illust--map {
    width: 67.34375vw;
    height: 42.7734375vw;
  }
}
.section-partnership__illust--flower {
  display: none;
}
@media screen and (min-width: 768px) {
  .section-partnership__illust--flower {
    display: block;
    position: absolute;
    top: 25.78125vw;
    right: 8.515625vw;
    z-index: -1;
    width: 10.78125vw;
    height: 10.78125vw;
  }
}

.section-heading--partnership {
  color: #fff;
  margin-bottom: 8.5333333333vw;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .section-heading--partnership {
    margin-bottom: 6.5625vw;
    text-align: left;
    width: 39.6875vw;
  }
}
.section-heading--partnership .section-en-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .section-heading--partnership .section-en-title {
    margin-left: 0;
  }
}

.partnership-catch {
  color: #fff;
  font-size: 4vw;
  line-height: 1;
  font-weight: 700;
  padding: 0 2.1333333333vw 2.4vw;
  width: fit-content;
  position: relative;
  z-index: 1;
  margin-bottom: -5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .partnership-catch {
    font-size: 2.34375vw;
    padding: 0 1.25vw 0.9375vw;
    margin-bottom: -1.953125vw;
  }
}
.partnership-catch::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  background: #000;
  height: 8.5333333333vw;
  z-index: -1;
}
@media screen and (min-width: 768px) {
  .partnership-catch::before {
    height: 3.90625vw;
  }
}
.partnership-catch span {
  margin-left: 1.6vw;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
  font-size: 9.3333333333vw;
}
@media screen and (min-width: 768px) {
  .partnership-catch span {
    margin-left: 0.46875vw;
    font-size: 6.40625vw;
  }
}

.partnership-points {
  margin-bottom: 17.0666666667vw;
}
@media screen and (min-width: 768px) {
  .partnership-points {
    margin-bottom: 7.8125vw;
    display: grid;
    gap: 4.375vw;
    grid-template-columns: auto 1fr;
  }
}
.partnership-points__eyecatch {
  display: block;
  width: 83.2vw;
  margin-left: -4.2666666667vw;
  margin-bottom: -4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .partnership-points__eyecatch {
    width: 49.21875vw;
    margin-left: -7.8125vw;
    margin-bottom: 0;
  }
}
.partnership-points-list {
  display: flex;
  flex-direction: column;
  gap: 10.6666666667vw;
  position: relative;
}
@media screen and (min-width: 768px) {
  .partnership-points-list {
    gap: 5.625vw;
    margin-top: 1.25vw;
  }
}

.partnership-point {
  color: #fff;
}
.partnership-point__title {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 5.0666666667vw;
  margin-bottom: 4.2666666667vw;
  font-size: 4.8vw;
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .partnership-point__title {
    gap: 1.25vw;
    margin-bottom: 1.25vw;
    font-size: 2.03125vw;
  }
}
.partnership-point__num {
  height: 6.4vw;
  margin: 0.8vw 0 1.3333333333vw;
}
@media screen and (min-width: 768px) {
  .partnership-point__num {
    height: 3.75vw;
    margin: 0.46875vw 0 0.78125vw;
  }
}
.partnership-point__text {
  font-size: 4vw;
}
@media screen and (min-width: 768px) {
  .partnership-point__text {
    font-size: 1.25vw;
  }
}

.partnership-cards {
  display: grid;
  gap: 8.5333333333vw;
  padding: 14.6666666667vw 0 18.9333333333vw;
  position: relative;
}
@media screen and (min-width: 768px) {
  .partnership-cards {
    gap: 3.75vw;
    padding: 9.6875vw 0 6.875vw;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.partnership-cards::before, .partnership-cards::after {
  content: "";
  display: block;
  position: absolute;
  background: url("../images/partnership-points_hr.svg") center center/contain no-repeat;
  width: 86.6666666667vw;
  height: 3.7333333333vw;
}
@media screen and (min-width: 768px) {
  .partnership-cards::before, .partnership-cards::after {
    width: 40.625vw;
    height: 1.953125vw;
  }
}
.partnership-cards::before {
  top: 0;
  right: -30.6666666667vw;
}
@media screen and (min-width: 768px) {
  .partnership-cards::before {
    right: -7.8125vw;
  }
}
.partnership-cards::after {
  bottom: 0;
  left: -56.8vw;
}
@media screen and (min-width: 768px) {
  .partnership-cards::after {
    left: -8.515625vw;
  }
}

@media screen and (min-width: 768px) {
  .partnership-card {
    display: flex;
    flex-direction: column;
  }
}
.partnership-card__img {
  aspect-ratio: 343/267;
  object-fit: cover;
}
@media screen and (min-width: 768px) {
  .partnership-card__img {
    aspect-ratio: 328/256;
  }
}
.partnership-card__title-wrapper {
  position: relative;
}
.partnership-card__title {
  padding: 2.1333333333vw 4.2666666667vw 2.1333333333vw 0;
  background: var(--blue);
  font-size: 4.8vw;
  font-weight: 700;
  line-height: 1.4;
  position: absolute;
  left: 0;
  bottom: 0;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .partnership-card__title {
    padding: 0.625vw 1.25vw 0.625vw 0;
    font-size: 1.5625vw;
  }
}
.partnership-card__text {
  font-size: 4vw;
  margin-bottom: 6.4vw;
  color: #fff;
}
@media screen and (min-width: 768px) {
  .partnership-card__text {
    padding-top: 1.25vw;
    font-size: 1.25vw;
    margin-bottom: 1.875vw;
  }
}
.partnership-card .button--primary {
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .partnership-card .button--primary {
    margin-top: auto;
  }
  .partnership-card .button--primary:hover {
    border-color: #fff;
  }
}

#community {
  scroll-margin-top: 12vw;
}
@media screen and (min-width: 768px) {
  #community {
    scroll-margin-top: 4.140625vw;
  }
}

.section-community {
  padding: 26.6666666667vw 4.2666666667vw 0;
  background: #FFFDEF;
  position: relative;
  z-index: 0;
}
@media screen and (min-width: 768px) {
  .section-community {
    padding: 30.15625vw 7.8125vw 0;
  }
}
.section-community__illust--footprints {
  position: absolute;
  bottom: -13.8666666667vw;
  left: -1.8666666667vw;
  width: 26.4vw;
  height: 37.0666666667vw;
  transform: rotate(105deg);
}
@media screen and (min-width: 768px) {
  .section-community__illust--footprints {
    bottom: -2.96875vw;
    left: 0.859375vw;
    width: 9.93984375vw;
    height: 14.771875vw;
    transform: rotate(106.23deg);
  }
}
.section-community__inner {
  padding: 6.1333333333vw 4vw;
  border: 1px solid #000;
  background: #fff;
}
@media screen and (min-width: 768px) {
  .section-community__inner {
    padding: 0;
    display: grid;
    grid-template-columns: 717fr 362fr;
  }
}

.community-slider {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  z-index: -1;
}
.community-slider__track {
  display: flex;
  width: max-content;
  animation: community-slider 12s linear infinite;
}
.community-slider__img {
  width: 39.2vw;
  flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .community-slider__img {
    width: 38.75vw;
  }
}

@keyframes community-slider {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-33.333333%);
  }
}
.section-heading--community {
  margin-bottom: 8.5333333333vw;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .section-heading--community {
    margin: -9.921875vw 0 1.25vw -1px;
    text-align: left;
    padding: 5.625vw 3.125vw 2.5vw;
    background: #fff;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    position: relative;
  }
  .section-heading--community::before {
    content: "";
    display: block;
    width: 1px;
    height: 11.5625vw;
    background: #000;
    position: absolute;
    top: 0;
    right: 0;
  }
}
.section-heading--community .section-en-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .section-heading--community .section-en-title {
    margin-left: 0;
  }
}
@media screen and (min-width: 768px) {
  .section-heading--community .section-title {
    font-size: 3.90625vw;
  }
}

.community-cards {
  display: grid;
  gap: 8.5333333333vw;
  margin-bottom: 8.5333333333vw;
}
@media screen and (min-width: 768px) {
  .community-cards {
    gap: 2.5vw;
    margin-bottom: 0;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column: 1/span 2;
    padding: 0 3.125vw 3.125vw;
  }
}

.community-card {
  display: grid;
  gap: 4.2666666667vw;
  grid-template-columns: 24vw 1fr;
}
@media screen and (min-width: 768px) {
  .community-card {
    display: block;
  }
}
@media screen and (min-width: 768px) {
  .community-card__image {
    padding: 0 1.796875vw;
    margin-bottom: 1.5625vw;
  }
}
.community-card__img {
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 100%;
}
.community-card__title {
  margin-bottom: 2.1333333333vw;
  font-size: 4.8vw;
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .community-card__title {
    margin-bottom: 1.25vw;
    font-size: 1.5625vw;
    text-align: center;
  }
}
.community-card__text {
  font-size: 4vw;
}
@media screen and (min-width: 768px) {
  .community-card__text {
    font-size: 1.25vw;
  }
}

@media screen and (min-width: 768px) {
  .community-buttons {
    grid-row: 1;
    grid-column: 2;
    padding: 2.265625vw 3.90625vw 0 0;
  }
}
.community-buttons .button {
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .community-buttons .button {
    margin-right: 0;
  }
}

#discover {
  scroll-margin-top: 12vw;
}
@media screen and (min-width: 768px) {
  #discover {
    scroll-margin-top: 4.140625vw;
  }
}

.section-discover {
  background: #FFFDEF;
  padding: 21.3333333333vw 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .section-discover {
    padding: 6.25vw 7.8125vw 6.25vw;
  }
}

@media screen and (min-width: 768px) {
  .discover-heading-group {
    display: grid;
    grid-template-columns: 30.9375vw 49.84375vw;
    gap: 3.59375vw;
  }
}
.discover-heading-group .section-heading--discover {
  margin-bottom: 8.5333333333vw;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .discover-heading-group .section-heading--discover {
    padding-top: 2.5vw;
    text-align: left;
  }
}
.discover-heading-group .section-heading--discover .section-en-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .discover-heading-group .section-heading--discover .section-en-title {
    margin-left: 0;
    margin-bottom: 1.796875vw;
  }
}
@media screen and (min-width: 768px) {
  .discover-heading-group .section-heading--discover .section-title {
    font-size: 3.90625vw;
  }
}
.discover-heading-group .discover-eyecatch {
  display: block;
  margin-right: 7.4666666667vw;
}
@media screen and (min-width: 768px) {
  .discover-heading-group .discover-eyecatch {
    margin-right: 0;
  }
}
.discover-description {
  background: #FFFDEF;
  border-top: 1px solid #000;
  border-left: 1px solid #000;
  padding: 6.1333333333vw 0 0 6.1333333333vw;
  margin: -8.5333333333vw 0 0 10.4vw;
  position: relative;
}
@media screen and (min-width: 768px) {
  .discover-description {
    border-left: 0;
    border-right: 1px solid #000;
    padding: 3.046875vw 3.046875vw 0 0;
    width: 52.34375vw;
    margin: -14.921875vw 0 0;
  }
}
.discover-description__title {
  margin-bottom: 4.2666666667vw;
  font-size: 4.8vw;
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .discover-description__title {
    margin-bottom: 1.25vw;
    font-size: 1.5625vw;
  }
}
.discover-description__text {
  margin-bottom: 8.5333333333vw;
  font-size: 4vw;
}
@media screen and (min-width: 768px) {
  .discover-description__text {
    margin-bottom: 2.5vw;
    font-size: 1.25vw;
  }
}
#culture {
  scroll-margin-top: 12vw;
}
@media screen and (min-width: 768px) {
  #culture {
    scroll-margin-top: 4.140625vw;
  }
}

.section-culture {
  padding: 21.3333333333vw 4.2666666667vw 25.6vw;
  background: url(../images/culture-section_bg_sp.jpg) center center/cover no-repeat;
  position: relative;
}
@media screen and (min-width: 768px) {
  .section-culture {
    padding: 6.25vw 7.8125vw 12.265625vw;
    background-image: url(../images/culture-section_bg_pc.jpg);
  }
}
.section-culture__illust--stadium {
  position: absolute;
  right: 4.2666666667vw;
  top: -14.4vw;
  width: 43.4666666667vw;
}
@media screen and (min-width: 768px) {
  .section-culture__illust--stadium {
    width: 32.1875vw;
    height: 19.296875vw;
    top: -6.71875vw;
    right: 5vw;
  }
}

.section-heading--culture {
  margin-bottom: 8.5333333333vw;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .section-heading--culture {
    text-align: left;
    margin-bottom: 3.28125vw;
  }
}
.section-heading--culture .section-en-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .section-heading--culture .section-en-title {
    margin-left: 0;
  }
}

.culture-medias {
  display: grid;
  gap: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .culture-medias {
    gap: 1.25vw;
  }
}

.culture-media {
  background: #fff;
  border: 1px solid #000;
  padding: 4vw 4vw 6.1333333333vw;
}
@media screen and (min-width: 768px) {
  .culture-media {
    padding: 2.421875vw;
    display: grid;
    gap: 2.5vw;
    grid-template-columns: 25.625vw 51.25vw;
  }
}
.culture-media__image {
  margin-bottom: 6.4vw;
}
@media screen and (min-width: 768px) {
  .culture-media__image {
    margin-bottom: 0;
  }
}
.culture-media__img {
  aspect-ratio: 311/215;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 768px) {
  .culture-media__img {
    aspect-ratio: 328/215;
  }
}
.culture-media__title {
  margin-bottom: 2.1333333333vw;
  font-size: 4.8vw;
  font-weight: 700;
  line-height: 1.4;
  padding: 2.1333333333vw 0;
}
@media screen and (min-width: 768px) {
  .culture-media__title {
    margin-bottom: 1.25vw;
    font-size: 1.71875vw;
    line-height: 1;
    padding: 0.625vw 0;
  }
}
.culture-media__text {
  margin-bottom: 6.4vw;
  font-size: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .culture-media__text {
    margin-bottom: 2.5vw;
    font-size: 1.25vw;
  }
}
.culture-media__buttons {
  margin-top: 6.4vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .culture-media__buttons {
    margin-top: 2.5vw;
    gap: 1.25vw;
    flex-direction: row;
    flex-wrap: wrap;
  }
}

#school {
  scroll-margin-top: 32vw;
}
@media screen and (min-width: 768px) {
  #school {
    scroll-margin-top: 15.625vw;
  }
}

.section-school {
  background: #EFF9FF;
  padding: 0 4.2666666667vw 21.3333333333vw;
  border-top: 1px solid #000;
  position: relative;
}
@media screen and (min-width: 768px) {
  .section-school {
    padding: 0 7.8125vw 6.25vw;
  }
}
.section-school__illust--sakura {
  position: absolute;
  width: 18.6666666667vw;
  height: 10.9333333333vw;
  top: -10.6666666667vw;
  left: 0;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .section-school__illust--sakura {
    width: 21.953125vw;
    height: 12.8125vw;
    top: -4.921875vw;
  }
}

.section-heading--school {
  background: #EFF9FF;
  text-align: center;
  padding: 4.2666666667vw 0;
  margin: -15.4666666667vw 0 8.5333333333vw;
  position: relative;
}
@media screen and (min-width: 768px) {
  .section-heading--school {
    width: 52.96875vw;
    padding: 2.5vw 0 1.25vw;
    margin: -6.015625vw auto 3.515625vw;
  }
}
.section-heading--school:before {
  content: "";
  display: block;
  height: 15.4666666667vw;
  width: 100%;
  border: 1px solid #000;
  border-bottom: 0;
  position: absolute;
  inset: 0;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .section-heading--school:before {
    height: 6.015625vw;
  }
}
.section-heading--school .section-en-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .section-heading--school .section-en-title {
    margin-bottom: 0.234375vw;
  }
}
@media screen and (min-width: 768px) {
  .section-heading--school .section-title {
    font-size: 3.90625vw;
    margin-bottom: 1.25vw;
  }
}

.school-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .school-nav {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 0.625vw;
  }
}
.school-nav__item:first-child {
  grid-column: 1/span 2;
}

.school-accordion {
  border: 1px solid var(--blue);
  background: #fff;
  transition: background 0.4s ease;
}
.school-accordion:has(.is-open) {
  background: var(--blue);
}
@media screen and (min-width: 768px) {
  .school-accordion:hover {
    background: var(--blue);
  }
}
.school-accordion__toggle {
  cursor: pointer;
  font-size: 4.2666666667vw;
  font-weight: 700;
  line-height: 1.4;
  padding: 2.6666666667vw 9.0666666667vw 2.6666666667vw 2.4vw;
  position: relative;
}
@media screen and (min-width: 768px) {
  .school-accordion__toggle {
    font-size: 1.40625vw;
    padding: 0.8984375vw 3.828125vw 0.8984375vw 1.171875vw;
  }
}
.school-accordion__toggle::after {
  content: "";
  display: block;
  width: 6.4vw;
  height: 6.4vw;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 2.4vw;
  margin: auto;
  background: url(../images/icon_plus.svg) center center/contain no-repeat;
  transition: color 0.3s ease, background-color 0.3s ease;
}
@media screen and (min-width: 768px) {
  .school-accordion__toggle::after {
    width: 2.65625vw;
    height: 2.65625vw;
    right: 1.171875vw;
  }
}
.school-accordion__toggle.is-open {
  color: #fff;
}
.school-accordion__toggle.is-open::after {
  background-image: url(../images/icon_minus.svg);
}
@media screen and (min-width: 768px) {
  .school-accordion__toggle:not(.is-open):hover {
    color: #fff;
  }
  .school-accordion__toggle:not(.is-open):hover::after {
    filter: brightness(0) invert(1);
  }
}
.school-accordion__content {
  height: 0;
  overflow: hidden;
  transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.school-accordion__content-inner {
  background: #fff;
  margin: 0 2.4vw 2.4vw;
  padding: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .school-accordion__content-inner {
    margin: 0 1.171875vw 0.546875vw;
    padding: 0.78125vw;
  }
}

.school-list {
  list-style: none;
  padding: 0;
}
.school-list__item {
  font-size: 4vw;
  line-height: 1.6;
  position: relative;
  padding-left: 5.8666666667vw;
}
@media screen and (min-width: 768px) {
  .school-list__item {
    font-size: 1.25vw;
    line-height: 1.8;
    padding-left: 1.875vw;
  }
}
.school-list__item::before {
  content: "";
  display: block;
  width: 0.9333333333vw;
  height: 1.0666666667vw;
  background: #000;
  border-radius: 100%;
  position: absolute;
  top: 2.9333333333vw;
  left: 2.4vw;
}
@media screen and (min-width: 768px) {
  .school-list__item::before {
    width: 0.2734375vw;
    height: 0.3125vw;
    top: 1.09375vw;
    left: 0.78125vw;
  }
}

#student {
  scroll-margin-top: 12vw;
}
@media screen and (min-width: 768px) {
  #student {
    scroll-margin-top: 4.140625vw;
  }
}

.section-student {
  background: var(--blue);
  padding: 21.3333333333vw 4.2666666667vw;
  position: relative;
  z-index: 0;
}
@media screen and (min-width: 768px) {
  .section-student {
    padding: 6.25vw 7.8125vw;
  }
}
.section-student__illust--book {
  position: absolute;
  top: -4.8vw;
  right: 0;
  width: 66.7546666667vw;
  height: 78.4vw;
  z-index: -1;
}
@media screen and (min-width: 768px) {
  .section-student__illust--book {
    top: -3.203125vw;
    right: 0;
    width: 40vw;
    height: 42.55703125vw;
  }
}
@media screen and (min-width: 768px) {
  .section-student__inner {
    display: grid;
    grid-template-columns: 1fr auto;
  }
}

.section-heading--student {
  color: #fff;
  margin-bottom: 8.5333333333vw;
}
@media screen and (min-width: 768px) {
  .section-heading--student {
    margin-bottom: 3.75vw;
  }
}
.section-heading--student .section-en-title img {
  height: auto;
}
@media screen and (min-width: 768px) {
  .section-heading--student .section-title {
    font-size: 3.59375vw;
  }
}

.student-card-slider {
  overflow: hidden;
  margin: 0 -4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .student-card-slider {
    margin: 0 -7.8125vw;
    grid-column: 1/span 2;
  }
}
.student-card-slider__inner {
  margin-left: -2.1333333333vw;
  padding-right: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .student-card-slider__inner {
    margin-left: 0;
    padding-left: 5.3125vw;
    padding-right: 7.8125vw;
  }
}
.student-card-slider .swiper-slide {
  height: auto;
  padding-left: 6.4vw;
}
@media screen and (min-width: 768px) {
  .student-card-slider .swiper-slide {
    padding-left: 2.5vw;
  }
}
.student-card-slider .student-card {
  height: 100%;
}

.swiper-scrollbar.swiper-scrollbar-horizontal {
  margin: 8.5333333333vw 0 6.4vw;
  position: static;
  background: #fff;
  height: var(--swiper-scrollbar-size, 1.6vw);
}
@media screen and (min-width: 768px) {
  .swiper-scrollbar.swiper-scrollbar-horizontal {
    margin: 3.75vw 0 0;
    height: var(--swiper-scrollbar-size, 0.46875vw);
    grid-column: 1/span 2;
  }
}
.swiper-scrollbar.swiper-scrollbar-horizontal .swiper-scrollbar-drag {
  background: #989898;
  border: 1px solid #fff;
}

.student-card {
  display: grid;
  grid-template-rows: auto auto 1fr;
}
.student-card__name {
  font-size: 4.8vw;
  font-weight: 700;
  line-height: 1.6;
  color: #fff;
  margin-bottom: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .student-card__name {
    font-size: 1.484375vw;
    margin-bottom: 0.625vw;
  }
}
.student-card__image {
  border: 1px solid #000;
  border-bottom: 0;
}
.student-card__img {
  aspect-ratio: 293/316;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media screen and (min-width: 768px) {
  .student-card__img {
    aspect-ratio: 339/410;
  }
}
.student-card__body {
  border: 1px solid #000;
  border-top: 0;
  padding: 2.1333333333vw 4.2666666667vw 2.1333333333vw;
  background: #fff;
  position: relative;
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .student-card__body {
    padding: 0.625vw 1.25vw 0.625vw;
  }
}
.student-card__label {
  background: #000;
  color: #fff;
  font-size: 4vw;
  padding: 1.0666666667vw 2.6666666667vw;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-100%);
}
@media screen and (min-width: 768px) {
  .student-card__label {
    font-size: 1.171875vw;
    padding: 0 0.78125vw;
  }
}
.student-card__text {
  margin-bottom: 2.1333333333vw;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .student-card__text {
    margin-bottom: 1.25vw;
    font-size: 1.40625vw;
  }
}
.student-card .icon--arrow-right {
  display: block;
  margin: auto 0 2.6666666667vw auto;
}
@media screen and (min-width: 768px) {
  .student-card .icon--arrow-right {
    margin-bottom: 0.78125vw;
  }
}

@media screen and (min-width: 768px) {
  .student-buttons {
    grid-column: 2/2;
    grid-row: 1/1;
    margin-top: auto;
    margin-bottom: 3.75vw;
  }
}
.student-buttons .button--primary {
  margin: auto;
}
@media screen and (min-width: 768px) {
  .student-buttons .button--primary:hover {
    border-color: #fff;
  }
}

/* ============================================
   ユーティリティ
   ============================================ */
@media screen and (min-width: 768px) {
  .u-sp-show {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .u-tb-show {
    display: none;
  }
}

/*
   @use "area.header" as header;
   @use "area.footer" as footer;
   @use "area.main" as main;
   @use "area.side" as side;

   @use "pagetype.page" as page;
   @use "pagetype.post" as post;

   @use "page.home" as home;
   @use "page.about" as about;
   @use "page.detail" as detail;
   @use "page.living" as living;
   @use "page.research" as research;

   @use "parts.navigation" as navigation;
   @use "parts.megamenu" as megamenu;
   @use "parts.breadcrumb" as breadcrumb;
   @use "parts.title" as title;
   @use "parts.card" as card;
   @use "parts.pager" as pager;
   @use "parts.tag" as tag;
   @use "parts.button" as button;

   @use "utility";
*//*# sourceMappingURL=style.css.map */