@charset "UTF-8";
/* -------------------------------------------
  トップページ
  /index.html
------------------------------------------- */
.top-mainvisual {
  position: relative;
  margin-top: calc(-1 * var(--header-height));
  background: linear-gradient(180deg, #FFFFFF 0%, #EEFFFA 80%);
}
.top-mainvisual > picture {
  position: relative;
  display: block;
}
.top-mainvisual > picture::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 1366/690;
  background: url(/assets/images/top/mainvisual_deco.svg) center center/cover no-repeat;
}
@media screen and (max-width: 768px) {
  .top-mainvisual > picture::before {
    aspect-ratio: 375/424;
    background-image: url(/assets/images/top/mainvisual_deco-sp.svg);
  }
}
.top-mainvisual > picture img {
  position: relative;
}
.top-mainvisual__block {
  position: absolute;
  top: calc(var(--header-height) + 3vw);
  right: 3vw;
  width: 32.2108345534%;
}
@media screen and (max-width: 768px) {
  .top-mainvisual__block {
    top: calc(var(--header-height) + 5vw);
    right: 5vw;
    width: 58.6666666667%;
  }
}
.top-mainvisual__block div {
  width: 52.5114155251%;
  margin: 3rem 0 0 auto;
}
@media screen and (max-width: 768px) {
  .top-mainvisual__block div {
    display: none;
  }
}
.top-mainvisual__block img {
  width: 100%;
}
.top-course {
  --card-height: 19.6rem;
  width: min(90%, 102.4rem);
  margin: calc(-1 * var(--card-height)) auto 0;
  display: grid;
  gap: 2.5rem;
  grid-template-columns: repeat(3, 1fr);
}
@media screen and (max-width: 768px) {
  .top-course {
    --card-height: 11.2rem;
    display: flex;
    flex-direction: column;
  }
}
.top-course__card {
  position: relative;
}
.top-course__card > span {
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
}
.top-course__card a {
  display: block;
  border-radius: 0.8rem;
  background-color: rgba(238, 243, 244, 0.9);
  -webkit-backdrop-filter: blur(0.4rem);
          backdrop-filter: blur(0.4rem);
  box-shadow: 0.4rem 0.4rem 0.8rem 0 rgba(0, 0, 0, 0.15);
  overflow: hidden;
}
.top-course__card a dl {
  min-height: var(--card-height);
  padding: 3.5rem 3.2rem 0;
}
@media screen and (max-width: 768px) {
  .top-course__card a dl {
    padding: 2rem;
  }
}
.top-course__card a dl dt {
  position: relative;
  margin-bottom: 1rem;
}
.top-course__card a dl dt::after {
  content: "";
  position: absolute;
  top: calc(50% - 1.25rem);
  right: 0;
  width: 2.5rem;
  height: 2.5rem;
  -webkit-mask: url(/assets/images/common/icon_linkbtn--sm.svg) center center/contain no-repeat;
          mask: url(/assets/images/common/icon_linkbtn--sm.svg) center center/contain no-repeat;
}
.top-course__card a dl dt div {
  line-height: 1;
  font-size: 3rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: currentColor;
}
@media screen and (max-width: 768px) {
  .top-course__card a dl dt div {
    font-size: 2.544rem;
  }
}
@media screen and (min-width: 768px) {
  .top-course__card a dl dt div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.8rem;
  }
  .top-course__card a dl dt div span {
    position: relative;
    padding: 0 1rem 0.2rem 1rem;
    font-family: Noto Sans JP;
    overflow: hidden;
  }
  .top-course__card a dl dt div span::before {
    content: "";
    position: absolute;
    z-index: -2;
    top: 0;
    height: 100%;
  }
}
@media screen and (max-width: 768px) {
  .top-course__card a dl dt div {
    position: relative;
    display: inline-block;
    padding: 0 1rem 0.2rem 1rem;
    overflow: hidden;
  }
  .top-course__card a dl dt div::before {
    content: "";
    position: absolute;
    z-index: -2;
    top: 0;
    height: 100%;
  }
}
.top-course__card a.is-view dl dt div span {
  color: var(--clr-white);
  transition: color 0.5s 0.5s;
}
.top-course__card a.is-view dl dt div span::before {
  animation: course-title-bg 0.7s cubic-bezier(0.455, 0.03, 0.515, 0.955) forwards;
}
.top-course__card a.is-view dl dt div span:nth-child(2)::before {
  animation-delay: 0.1s;
}
.top-course__card a.is-view dl dt div span::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -20rem;
  left: -20rem;
  width: 20rem;
  height: 20rem;
  background: radial-gradient(circle, rgba(255, 255, 0, 0.5) 0%, rgba(255, 255, 0, 0) 50%);
}
@media screen and (max-width: 768px) {
  .top-course__card a.is-view dl dt div::before {
    animation: course-title-bg 0.7s cubic-bezier(0.455, 0.03, 0.515, 0.955) forwards;
  }
}
@media (hover: hover) {
  .top-course__card a.is-view:hover dl dt div span::after {
    top: 100%;
    left: 100%;
    transition: all 1s ease-in-out;
  }
}
.top-course__card a figure {
  position: relative;
  overflow: hidden;
}
.top-course__card a figure::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 325/128;
}
@media screen and (max-width: 768px) {
  .top-course__card a figure::after {
    aspect-ratio: 343/48;
  }
}
.top-course__card a figure img {
  aspect-ratio: 325/200;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 768px) {
  .top-course__card a figure img {
    aspect-ratio: 343/104;
  }
}
@media (hover: hover) {
  .top-course__card a figure img {
    transition: 0.3s ease-out;
  }
  .top-course__card a:hover figure img {
    transform: scale(1.1);
  }
}
.top-course--advanced dt::after,
.top-course--advanced span::before {
  background-color: var(--clr-green);
}
.top-course--advanced figure::after {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(0, 144, 89, 0.5) 100%);
}
@media screen and (max-width: 768px) {
  .top-course--advanced div::before {
    background-color: var(--clr-green);
  }
}
.top-course--comprehensive dt::after,
.top-course--comprehensive span::before {
  background-color: var(--clr-aqua);
}
.top-course--comprehensive figure::after {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(74, 177, 206, 0.5) 100%);
}
@media screen and (max-width: 768px) {
  .top-course--comprehensive div::before {
    background-color: var(--clr-aqua);
  }
}
.top-course--athlete dt::after,
.top-course--athlete span::before {
  background-color: var(--clr-purple);
}
.top-course--athlete figure::after {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(60, 80, 183, 0.5) 100%);
}
@media screen and (max-width: 768px) {
  .top-course--athlete div::before {
    background-color: var(--clr-purple);
  }
}
.top-sec {
  position: relative;
  padding-top: 22.5rem;
}
@media screen and (max-width: 768px) {
  .top-sec {
    padding-top: 12.8rem;
  }
}
.top-sec.deco01::before {
  content: "";
  position: absolute;
  top: 10.4rem;
  right: 8%;
  aspect-ratio: 10/8;
  width: 10rem;
  background: url(/assets/images/top/tri_deco01.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .top-sec.deco01::before {
    top: 4.8rem;
    width: 4.6rem;
  }
}
.top-sec.deco02::before {
  content: "";
  position: absolute;
  top: 10.4rem;
  right: 8%;
  aspect-ratio: 10/8;
  width: 10rem;
  background: url(/assets/images/top/tri_deco02.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .top-sec.deco02::before {
    top: 4.8rem;
    width: 4.6rem;
  }
}
.top-sec.deco03::before {
  content: "";
  position: absolute;
  top: 10.4rem;
  left: 6%;
  aspect-ratio: 10/8;
  width: 10rem;
  background: url(/assets/images/top/tri_deco03.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .top-sec.deco03::before {
    top: 4.8rem;
    width: 4.6rem;
  }
}
.top-sec.deco04::before {
  content: "";
  position: absolute;
  top: 10.4rem;
  right: 6%;
  aspect-ratio: 10/8;
  width: 10rem;
  background: url(/assets/images/top/tri_deco03.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .top-sec.deco04::before {
    top: 4.8rem;
    width: 4.6rem;
  }
}
.top-sec__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top-sec__header {
    width: 88%;
    margin: 0 auto;
  }
}
.top-sec__header h2 {
  font-family: "Roboto", sans-serif;
  font-size: 5.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  background: var(--grad-type03);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media screen and (max-width: 768px) {
  .top-sec__header h2 {
    font-size: 2.968rem;
  }
}
.top-sec__header h2 + div {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2.4rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .top-sec__header h2 + div {
    font-size: 1.484rem;
  }
}
.top-sec__header h2 + div::before {
  content: "";
  width: 2.8rem;
  height: 0;
  margin-right: 1rem;
  border-top: solid 0.1rem currentColor;
}
.top-sec__header p {
  margin-top: 2.4rem;
}
@media screen and (max-width: 768px) {
  .top-sec__header p {
    text-align: left;
  }
}
.top-event__inner {
  margin-top: 4.8rem;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .top-event__inner {
    flex-direction: column;
  }
}
.top-event__image {
  width: 54.9048316252%;
}
@media screen and (max-width: 768px) {
  .top-event__image {
    width: 100%;
  }
}
.top-event__image .slide {
  width: 85%;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .top-event__image .slide {
    width: 95%;
    margin: 0 auto 0 0;
  }
}
.top-event__image .slide .slick-list {
  border-radius: 0 0.8rem 0.8rem 0;
  box-shadow: 2px 6px 16px 0px rgba(0, 0, 0, 0.1);
}
.top-event__image .slide-item a {
  display: block;
  overflow: hidden;
}
.top-event__image .slide-item a figure {
  position: relative;
}
.top-event__image .slide-item a figure picture img {
  aspect-ratio: 640/356;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 768px) {
  .top-event__image .slide-item a figure picture img {
    aspect-ratio: 351/224;
  }
}
.top-event__image .slide-item a figure figcaption {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 0 5.6rem;
  background: linear-gradient(116.79deg, rgba(54, 126, 202, 0.49) 0%, rgba(54, 126, 202, 0.14) 99.45%);
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: var(--clr-white);
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
.top-event__image .slide-item a figure figcaption::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--clr-blue);
  opacity: 0;
  transition: 0.3s ease;
}
.top-event__image .slide-item a figure figcaption::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0.6rem;
  height: 100%;
  background: linear-gradient(to bottom, #367ECA 0%, #48BFFA 36.84%, #60EBDD 66.92%, #6EE1A4 100%);
}
.top-event__image .slide-item a figure figcaption > * {
  position: relative;
}
.top-event__image .slide-item a figure figcaption h2 {
  margin-bottom: 2.4rem;
  padding-bottom: 2.4rem;
  border-bottom: solid 0.2rem rgba(255, 255, 255, 0.3);
  font-size: 2.4rem;
}
@media (hover: hover) {
  .top-event__image .slide-item a:hover figure figcaption::before {
    opacity: 0.3;
  }
}
.top-event__image .slide .slick-dots {
  margin-top: var(--space-xl);
  display: flex;
  justify-content: flex-start;
  gap: 1.2rem;
  line-height: 0;
}
@media screen and (max-width: 768px) {
  .top-event__image .slide .slick-dots {
    justify-content: center;
  }
}
.top-event__image .slide .slick-dots li button {
  width: 0.8rem;
  aspect-ratio: 1/1;
  line-height: 2;
  border-radius: 50%;
  background-color: #ccc;
  overflow: hidden;
}
.top-event__image .slide .slick-dots li.slick-active button {
  background-color: var(--clr-blue);
}
.top-event__thumb {
  width: 38.4333821376%;
}
@media screen and (max-width: 768px) {
  .top-event__thumb {
    width: 90%;
    margin: var(--space-xl) auto;
  }
}
.top-event__thumb .slide-thumb .slick-track {
  transform: unset !important;
  display: block;
}
@media screen and (max-width: 768px) {
  .top-event__thumb .slide-thumb .slick-track {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 2.5rem;
  }
  .top-event__thumb .slide-thumb .slick-track::before, .top-event__thumb .slide-thumb .slick-track::after {
    content: none;
  }
}
.top-event__thumb .slide-thumb .slick-track .slick-slide {
  position: relative;
  float: none;
  width: 100% !important;
  padding: 2.4rem 0 2.4rem 3.2rem;
  border-bottom: 1px solid rgba(69, 62, 60, 0.2);
  font-size: 2rem;
  font-weight: 700;
  transition: 0.3s;
}
@media screen and (max-width: 768px) {
  .top-event__thumb .slide-thumb .slick-track .slick-slide {
    display: flex;
    padding: 1.6rem 0;
    font-size: 1.5rem;
  }
}
.top-event__thumb .slide-thumb .slick-track .slick-slide::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0.3rem;
  height: 100%;
  background: linear-gradient(to bottom, #367ECA 0%, #48BFFA 36.84%, #60EBDD 66.92%, #6EE1A4 100%);
  opacity: 0;
  transition: 0.3s;
}
@media (hover: hover) {
  .top-event__thumb .slide-thumb .slick-track .slick-slide:hover {
    border-bottom-color: transparent;
    background-color: rgb(238, 243, 244);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
    color: var(--clr-blue);
  }
  .top-event__thumb .slide-thumb .slick-track .slick-slide:hover::before {
    opacity: 1;
  }
}
.top-event__thumb .slide-thumb .slick-track .slick-slide.slick-current {
  border-bottom-color: transparent;
  background-color: rgb(238, 243, 244);
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
  color: var(--clr-blue);
}
.top-event__thumb .slide-thumb .slick-track .slick-slide.slick-current::before {
  opacity: 1;
}
.top-event__thumb .slide-thumb .slick-track .slick-slide > p {
  width: min(90%, 36.8rem);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.6rem;
}
@media screen and (max-width: 768px) {
  .top-event__thumb .slide-thumb .slick-track .slick-slide > p {
    width: 100%;
    gap: 0.8rem;
  }
}
.top-event__thumb .slide-thumb .slick-track .slick-slide > p::after {
  content: "";
  width: 2.5rem;
  aspect-ratio: 1/1;
  margin-left: auto;
  background-color: currentColor;
  -webkit-mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/contain no-repeat;
          mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .top-event__thumb .slide-thumb .slick-track .slick-slide > p::after {
    width: 1.6rem;
    margin-right: 0.5rem;
  }
}
.top-event__thumb .slide-thumb .slick-track .slick-slide a {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.top-pickup__inner {
  width: min(84%, 144rem);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .top-pickup__inner {
    width: 100%;
    flex-direction: column;
  }
}
@media screen and (min-width: 769px) {
  .top-pickup__header {
    width: 30.5944055944%;
    align-items: flex-start;
    text-align: left;
  }
  .top-pickup__header p {
    margin: auto 0 calc(var(--space-xl) + 0.8rem) 0;
  }
}
.top-pickup__banners {
  width: 62.9370629371%;
}
@media screen and (max-width: 768px) {
  .top-pickup__banners {
    width: 91.4666666667%;
    margin: var(--space-2xl) auto 0;
  }
}
.top-pickup__banners .slide-caption {
  margin-top: 1rem;
  font-size: 1.4rem;
}
.top-pickup__banners .slick-dots {
  margin-top: var(--space-xl);
  display: flex;
  justify-content: flex-start;
  gap: 1.2rem;
  line-height: 0;
}
@media screen and (max-width: 768px) {
  .top-pickup__banners .slick-dots {
    justify-content: center;
  }
}
.top-pickup__banners .slick-dots li button {
  width: 0.8rem;
  aspect-ratio: 1/1;
  line-height: 2;
  border-radius: 50%;
  background-color: #ccc;
  overflow: hidden;
}
.top-pickup__banners .slick-dots li.slick-active button {
  background-color: var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .top-message {
    overflow-x: hidden;
  }
}
.top-message__img {
  position: relative;
  z-index: -1;
  padding-top: 7.6rem;
}
@media screen and (max-width: 768px) {
  .top-message__img {
    padding-top: 0;
  }
}
.top-message__img picture {
  position: relative;
  display: block;
  border-radius: 50% 50% 0 0/100% 100% 0 0;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .top-message__img picture {
    position: relative;
    left: -25vw;
    width: 150vw;
    border-radius: 50% 50% 0 0/100% 100% 0 0;
  }
}
.top-message__img picture img {
  aspect-ratio: 1366/692;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 768px) {
  .top-message__img picture img {
    display: block;
    aspect-ratio: 375/320;
    width: 100vw;
    margin: 0 auto;
  }
}
.top-message__img picture::after {
  content: "";
  position: absolute;
  bottom: -7.6rem;
  left: 0;
  width: 100%;
  height: 38.8rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(153, 196, 234, 0.8) 65.87%, #338AD5 100%);
}
@media screen and (max-width: 768px) {
  .top-message__img picture::after {
    bottom: 0;
    height: 14rem;
  }
}
.top-message__img p {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top-message__img p {
    bottom: 1.6rem;
  }
}
.top-message__img p img {
  width: 66.9106881406%;
}
@media screen and (max-width: 768px) {
  .top-message__img p img {
    width: 87.2%;
  }
}
@media screen and (min-width: 769px) {
  .top-message__inner {
    position: relative;
    width: min(90%, 99rem);
    margin: 0 auto;
  }
  .top-message__block {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
  .top-message__header {
    position: relative;
    display: block;
  }
  .top-message__header h2 {
    position: absolute;
    top: 0;
    left: 0;
    transform: rotate(90deg) translate(10.5rem, 5rem);
  }
  .top-message__header h2 + div {
    writing-mode: vertical-rl;
  }
  .top-message__header h2 + div::before {
    width: 0;
    height: 2.8rem;
    margin: 0 0 1rem 0;
    border-right: solid 0.1rem currentColor;
  }
  .top-message__lead {
    margin-top: 4.8rem;
  }
}
@media screen and (max-width: 768px) {
  .top-message__lead {
    width: 88%;
    margin: 1.6rem auto 3.2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
  }
}
.top-feature {
  position: relative;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .top-feature {
    padding-top: 6.4rem;
  }
}
.top-feature::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--grad-type02);
  opacity: 0.6;
}
.top-feature::after {
  content: "";
  position: absolute;
  z-index: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 1366/500;
  border-radius: 6.4rem 6.4rem 0 0;
  background-color: var(--clr-lgray);
}
@media screen and (max-width: 768px) {
  .top-feature::after {
    aspect-ratio: 375/350;
    border-radius: 3.2rem 3.2rem 0 0;
  }
}
.top-feature__inner {
  position: relative;
  z-index: 1;
  width: min(84%, 114.4rem);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: auto auto;
  gap: 2.4rem;
}
@media screen and (max-width: 768px) {
  .top-feature__inner {
    width: 90%;
    display: flex;
    flex-direction: column;
  }
}
.top-feature__inner > div {
  padding: 4.8rem 2.4rem;
  border-radius: 0.8rem;
  background-color: var(--clr-white);
  box-shadow: 0.4rem 0.4rem 0.8rem 0 rgba(0, 0, 0, 0.15);
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top-feature__inner > div {
    padding: 3.2rem 1.6rem;
  }
}
.top-feature__inner > div h3 {
  display: inline-block;
  margin-bottom: 4rem;
  text-align: center;
  border-bottom: solid 0.1rem currentColor;
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--clr-blue);
}
.top-feature__inner > div a {
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 0.8rem;
  border: solid 0.1rem var(--clr-lgray);
  background-color: var(--clr-lgray);
  text-align: left;
}
.top-feature--overview {
  grid-row: 1/3;
  grid-column: 1/2;
  padding: 4.8rem 3.2rem;
}
.top-feature--overview h3 {
  color: var(--clr-green) !important;
}
@media (hover: hover) {
  .top-feature--overview p a {
    transition: background-color 0.3s ease;
  }
  .top-feature--overview p a:hover {
    background-color: rgba(0, 144, 89, 0.3);
  }
}
.top-feature--overview ul {
  margin-top: 2.4rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(4, 1fr);
  gap: 1.6rem;
}
@media screen and (max-width: 768px) {
  .top-feature--overview ul {
    margin-top: 1.6rem;
    gap: 0.8rem;
  }
}
.top-feature--overview ul li a {
  padding: 2.4rem 1.6rem;
}
@media screen and (max-width: 768px) {
  .top-feature--overview ul li a {
    padding: 0.5rem 0.8rem;
  }
}
.top-feature--overview ul li a::after {
  content: "";
  width: 2.5rem;
  aspect-ratio: 1/1;
  background-color: var(--clr-green);
  -webkit-mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/contain no-repeat;
          mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .top-feature--overview ul li a::after {
    width: 2rem;
  }
}
@media (hover: hover) {
  .top-feature--overview ul li a {
    transition: background-color 0.2s ease, color 0.2s ease;
  }
  .top-feature--overview ul li a:hover {
    background-color: var(--clr-green);
    color: var(--clr-white);
  }
  .top-feature--overview ul li a:hover::after {
    background-color: var(--clr-white);
  }
}
.top-feature--overview ul li:last-child {
  grid-column: 1/3;
}
.top-feature--overview ul li:last-child a {
  background-color: var(--clr-green);
  text-align: center;
  color: var(--clr-white);
}
.top-feature--overview ul li:last-child a::after {
  background-color: var(--clr-white);
}
.top-feature--overview ul li:last-child a span {
  flex: 1;
}
@media (hover: hover) {
  .top-feature--overview ul li:last-child a {
    transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
  }
  .top-feature--overview ul li:last-child a:hover {
    border-color: var(--clr-green);
    background-color: var(--clr-lgray);
    color: var(--clr-green);
  }
  .top-feature--overview ul li:last-child a:hover::after {
    background-color: var(--clr-green);
  }
}
.top-feature--community ul {
  display: flex;
  gap: 1.3rem;
}
@media screen and (max-width: 768px) {
  .top-feature--community ul {
    gap: 0.8rem;
  }
}
.top-feature--community ul li {
  flex: 1;
}
.top-feature--community ul li a {
  height: 100%;
  padding: 4.8rem 1.6rem 4.8rem 2.4rem;
}
@media screen and (max-width: 768px) {
  .top-feature--community ul li a {
    padding: 1.2rem;
    flex-direction: column;
  }
  .top-feature--community ul li a span {
    flex: 1;
    margin-bottom: 0.8rem;
    display: flex;
    align-items: center;
    text-align: center;
  }
}
.top-feature--community ul li a::after {
  content: "";
  width: 2.5rem;
  aspect-ratio: 1/1;
  background-color: var(--clr-blue);
  -webkit-mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/contain no-repeat;
          mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .top-feature--community ul li a::after {
    width: 2rem;
  }
}
@media (hover: hover) {
  .top-feature--community ul li a {
    transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
  }
  .top-feature--community ul li a:hover {
    background-color: var(--clr-blue);
    color: var(--clr-white);
  }
  .top-feature--community ul li a:hover::after {
    background-color: var(--clr-white);
  }
}
.top-feature--visitor p a {
  position: relative;
  padding: 0 3.2rem 0 4rem;
  aspect-ratio: 500/193;
  background: url(/assets/images/top/access_img.jpg) center center/cover no-repeat;
  overflow: hidden;
  font-size: 2.4rem;
  color: var(--clr-white);
}
@media screen and (max-width: 768px) {
  .top-feature--visitor p a {
    font-size: 2rem;
  }
}
.top-feature--visitor p a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--clr-blue);
  mix-blend-mode: multiply;
  opacity: 0.5;
}
.top-feature--visitor p a::after {
  content: "";
  position: relative;
  width: 4.8rem;
  aspect-ratio: 1/1;
  background-color: currentColor;
  -webkit-mask: url(/assets/images/common/icon_linkbtn--lg.svg) center center/contain no-repeat;
          mask: url(/assets/images/common/icon_linkbtn--lg.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .top-feature--visitor p a::after {
    width: 2rem;
  }
}
.top-feature--visitor p a span {
  position: relative;
}
@media (hover: hover) {
  .top-feature--visitor p a::before {
    transition: opacity 0.3s;
  }
  .top-feature--visitor p a:hover::before {
    opacity: 0.9;
  }
}
.top-instagram {
  background-color: var(--clr-lgray);
}
.top-instagram__inner {
  position: relative;
  width: min(90%, 114.4rem);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .top-instagram__inner {
    width: 100%;
  }
}
.top-instagram__header {
  position: absolute;
  top: 0;
  left: 0;
  align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .top-instagram__header {
    position: static;
    align-items: center;
  }
}
.top-instagram__image {
  width: 70%;
  margin-left: auto;
  display: flex;
  gap: 1.6rem;
}
@media screen and (max-width: 768px) {
  .top-instagram__image {
    width: 100%;
    margin: var(--space-2xl) 0 0 0;
    gap: 0.8rem;
  }
}
.top-instagram__image > div {
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
@media screen and (max-width: 768px) {
  .top-instagram__image > div {
    gap: 0.8rem;
  }
}
.top-instagram__image > div:first-child {
  align-items: flex-end;
}
.top-instagram__image > div:first-child > :first-child {
  width: 81%;
}
.top-instagram__image > div:last-child > :first-child {
  width: 60%;
}
.top-instagram__image > div:last-child > :last-child {
  width: 71%;
}
.top-instagram__image figure img {
  border-radius: 0.8rem;
}
@media screen and (max-width: 768px) {
  .top-instagram__image figure img {
    border-radius: 0.4rem;
  }
}
.top-other {
  background-color: var(--clr-lgray);
}
.top-other__inner {
  width: min(90%, 114.4rem);
  margin: 0 auto;
}
.top-other__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4rem;
}
@media screen and (max-width: 768px) {
  .top-other__list {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 2.4rem 0.9rem;
  }
}
.top-other__list a {
  display: block;
}
.top-other__list a figure div {
  position: relative;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: rgb(233, 235, 230);
}
.top-other__list a figure div img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
.top-other__list a figure figcaption {
  position: relative;
  z-index: 1;
  margin-top: -2.4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.7rem;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .top-other__list a figure figcaption {
    gap: 0.8rem;
    font-size: 1.5rem;
  }
}
.top-other__list a figure figcaption::before {
  content: "";
  width: 4.8rem;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: url(/assets/images/common/icon_linkbtn--sm-white.svg) center center/50% auto no-repeat var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .top-other__list a figure figcaption::before {
    width: 4rem;
  }
}
@media (hover: hover) {
  .top-other__list a figure div {
    transition: background-color 0.3s ease;
  }
  .top-other__list a:hover figure div {
    background-color: var(--clr-white);
  }
  .top-other__list a:hover figure figcaption {
    color: var(--clr-blue);
  }
}
.top-news {
  background-color: var(--clr-lgray);
}
.top-news__inner {
  width: min(90%, 114.4rem);
  margin: 0 auto;
  padding-bottom: 15rem;
}
.top-news__list {
  margin: var(--space-3xl) 0;
}
.top-news__list li {
  padding-bottom: 2.4rem;
  border-bottom: solid 1px rgba(69, 62, 60, 0.3);
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: 14rem 10rem auto;
  align-items: center;
  gap: 4.8rem;
}
.top-news__list li:not(:last-child) {
  margin-bottom: 2.4rem;
}
@media screen and (max-width: 768px) {
  .top-news__list li {
    grid-template-columns: 12rem auto;
    gap: 1.6rem;
  }
}
.top-news__list li > span {
  border-radius: 5rem;
  background-color: #453E3C;
  text-align: center;
  font-size: 1.4rem;
  color: var(--clr-white);
}
.top-news__list li > a {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .top-news__list li > a {
    grid-column: 1/3;
  }
}
.top-news__list li > a::after {
  content: "";
  width: 2.5rem;
  aspect-ratio: 1/1;
  margin-left: 2rem;
  background-color: currentColor;
  -webkit-mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/98% auto no-repeat;
          mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/98% auto no-repeat;
}
@media screen and (max-width: 768px) {
  .top-news__list li > a::after {
    width: 3.5rem;
  }
}
@media (hover: hover) {
  .top-news__list li > a {
    transition: color 0.3s ease;
  }
  .top-news__list li > a:hover {
    color: var(--clr-blue);
  }
}

@keyframes course-title-bg {
  0% {
    left: -50%;
    width: 0;
    opacity: 0;
  }
  100% {
    left: 0;
    width: 100%;
    opacity: 1;
  }
}
/* お知らせ */
.bg-gray {
  min-height: 2000px;
  background-color: var(--clr-lgray);
}

/* -------------------------------------------
  入試イベント
  /admissions-events/
------------------------------------------- */
/* event-section */
.event-section {
  margin: 20rem 0;
}
@media screen and (max-width: 768px) {
  .event-section {
    margin: 10rem 0;
  }
}
.event-section:first-of-type {
  margin-top: 0;
}

/* event-sched */
.event-sched {
  width: min(90%, 114.4rem);
  margin: 8rem auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  gap: 1.5em;
  font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
  .event-sched {
    margin: 4rem auto;
    gap: 1.5rem;
  }
}
.event-sched li {
  width: 20.375em;
}
@media screen and (max-width: 768px) {
  .event-sched li {
    width: calc((100% - 2em) / 2);
  }
}
@media screen and (max-width: 480px) {
  .event-sched li {
    width: min(100%, 33rem);
  }
}
.event-sched li a {
  position: relative;
  display: block;
  min-height: 11.125em;
  border-radius: 0.625em;
  background-color: var(--clr-bg);
  display: flex;
  justify-content: space-between;
  text-decoration: none;
  font-feature-settings: "palt";
  color: var(--clr-text);
}
.event-sched li a .event-sched--date {
  flex: 1;
  position: relative;
  min-width: 6.25em;
  line-height: 1;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .event-sched li a .event-sched--date {
    width: 6.25em;
  }
}
.event-sched li a .event-sched--date .oc-month {
  position: relative;
  display: inline-block;
  line-height: 1;
  font-family: "Roboto", sans-serif;
  font-size: 1.875em;
  font-weight: 700;
  letter-spacing: -0.1em;
}
.event-sched li a .event-sched--date .oc-month::after {
  content: "";
  width: 1em;
  height: 0;
  border-top: solid 1px currentColor;
  transform: rotate(-45deg);
  position: absolute;
  bottom: 0.2em;
  right: -0.7em;
  font-family: "Roboto", sans-serif;
  font-size: 0.8em;
  font-weight: 100;
}
.event-sched li a .event-sched--date .oc-day {
  position: relative;
  display: inline-block;
  top: 0.75em;
  font-family: "Roboto", sans-serif;
  font-size: 2.8125em;
  font-weight: 700;
  letter-spacing: -0.03em;
}
.event-sched li a .event-sched--date .oc-week {
  display: block;
  margin-top: 3em;
  font-family: "Roboto", sans-serif;
  font-size: 0.6875em;
  font-weight: 700;
}
.event-sched li a .event-sched--info {
  position: relative;
  padding: 1em;
}
@media screen and (max-width: 768px) {
  .event-sched li a .event-sched--info {
    padding: 1em 1.5em;
  }
}
.event-sched li a .event-sched--info::before {
  content: "";
  position: absolute;
  top: 1em;
  left: 0;
  width: 0;
  height: calc(100% - 2em);
  border-left: dotted 1px currentColor;
}
.event-sched li a .event-sched--info dt {
  margin-bottom: 0.3em;
  line-height: 1.4;
  font-size: 1.5em;
  font-weight: 700;
}
.event-sched li a .event-sched--info dd {
  min-width: 11em;
  line-height: 1.5;
  font-size: 0.9375em;
  letter-spacing: 0;
}
.event-sched li a .event-sched--info dd:last-child span {
  display: inline-block;
  margin-top: 0.5em;
  padding: 0.05em 1em 0.1em;
  border-radius: 5em;
  background-color: rgba(51, 138, 213, 0.5);
  font-weight: 700;
  color: #FFF;
}
.event-sched li.soon a {
  pointer-events: none;
}
.event-sched li.soon .event-sched--info dd:last-child span::before {
  content: "申込開始前";
}
.event-sched li.closed a {
  pointer-events: none;
}
.event-sched li.closed .event-sched--info dd:last-child span::before {
  content: "受付終了";
}
.event-sched li.open {
  width: 27.6875em;
}
@media screen and (max-width: 768px) {
  .event-sched li.open {
    width: calc((100% - 2em) / 2);
    margin-top: 3.5em;
  }
}
@media screen and (max-width: 480px) {
  .event-sched li.open {
    width: min(100%, 33rem);
  }
}
.event-sched li.open a {
  margin-left: 5em;
}
@media screen and (max-width: 768px) {
  .event-sched li.open a {
    margin-left: 0;
  }
}
.event-sched li.open a .event-sched--date {
  max-width: 11.125em;
  height: 11.125em;
  margin: 0 0.5em 0 -5em;
  padding-top: 0.5em;
  border-radius: 100%;
  background-color: var(--clr-blue);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #FFF;
  transition: 0.3s;
}
@media screen and (max-width: 768px) {
  .event-sched li.open a .event-sched--date {
    position: absolute;
    top: -4em;
    right: 0;
    width: 10em;
    height: 10em;
    margin: 0;
  }
}
.event-sched li.open a .event-sched--date > div {
  margin-top: -1.2em;
}
.event-sched li.open a .event-sched--date .oc-month {
  font-size: 3em;
}
.event-sched li.open a .event-sched--date .oc-day {
  font-size: 4.5em;
}
.event-sched li.open a .event-sched--date .oc-week {
  font-size: 1.125em;
}
.event-sched li.open a .event-sched--info {
  position: relative;
  flex: 1;
  border-left: none;
  overflow: hidden;
}
.event-sched li.open a .event-sched--info::before {
  content: none;
}
.event-sched li.open a .event-sched--info::after {
  content: "";
  position: absolute;
  bottom: -0.5em;
  right: -0.5em;
  width: 4.5em;
  height: 4.5em;
  border-radius: 50%;
  background: url(/assets/images/event/date_icon.svg) center center/cover no-repeat var(--clr-blue);
  transition: 0.3s;
}
.event-sched li.open a .event-sched--info dd:last-child span {
  background-color: var(--clr-blue);
  transition: 0.3s;
}
.event-sched li.open a .event-sched--info dd:last-child span::before {
  content: "申込受付中";
}
@media (hover: hover) {
  .event-sched li.open a:hover .event-sched--date {
    background-color: #91BEE5;
  }
  .event-sched li.open a:hover .event-sched--info::after {
    background-color: #91BEE5;
  }
  .event-sched li.open a:hover .event-sched--info dd:last-child span {
    background-color: #91BEE5;
  }
}

/* detail-item */
.detail-item__header {
  position: relative;
  width: min(90%, 114.4rem);
  margin: 5rem auto;
  padding-bottom: 2.4rem;
  border-bottom: solid 0.2rem var(--clr-bg);
}
@media screen and (max-width: 768px) {
  .detail-item__header {
    margin: 3rem auto;
  }
}
.detail-item__header::before {
  content: "";
  width: 4.8rem;
  height: 4.8rem;
  background: url(/assets/images/event/acc-btn--plus.svg) center center/contain no-repeat;
  transition: 0.3s;
}
@media screen and (max-width: 768px) {
  .detail-item__header::before {
    width: 3rem;
    height: 3rem;
  }
}
.detail-item__header::after {
  content: "";
  position: absolute;
  bottom: -0.2rem;
  left: 0;
  width: 28%;
  height: 0.2rem;
  background: linear-gradient(to right, #5AA343 0%, #66AF88 30%, #48BFFA 60%, #367ECA 100%);
}
.detail-item__header h2 {
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .detail-item__header h2 {
    font-size: 2rem;
    font-weight: 600;
  }
}
@media (hover: hover) {
  .detail-item__header::after {
    transition: width 0.3s;
  }
  .detail-item__header:hover::after {
    width: 100%;
  }
}
.detail-item__header.is-open::before {
  transform: rotate(180deg);
  background-image: url(/assets/images/event/acc-btn--minus.svg);
}
.detail-item__header.is-open::after {
  width: 100%;
}
.detail-item__main-body {
  margin-bottom: 10rem;
}
@media screen and (max-width: 768px) {
  .detail-item__main-body {
    margin-bottom: 6rem;
  }
}
.detail-item__main-body > *:not(.event-detail01, .event-detail02) {
  width: min(90%, 114.4rem);
  margin-right: auto;
  margin-left: auto;
}
.detail-item__main-body .button-link,
.detail-item__main-body .button-file {
  margin-top: var(--space-xl);
}

/* event-detail01 */
.event-detail01:nth-child(odd) {
  background-color: rgba(238, 243, 244, 0.5);
}
.event-detail01 > div {
  width: min(90%, 114.4rem);
  margin: 0 auto;
  padding: 8rem 0;
  gap: 7%;
}
@media screen and (max-width: 768px) {
  .event-detail01 > div {
    width: 88%;
    padding: 6rem 0;
    flex-direction: column;
    gap: 3rem;
  }
}
.event-detail01:nth-child(even) > div {
  flex-direction: row-reverse;
}
@media screen and (max-width: 768px) {
  .event-detail01:nth-child(even) > div {
    flex-direction: column;
  }
}
.event-detail01__textarea {
  flex: 1;
}
.event-detail01__textarea p {
  margin-bottom: 1em;
  font-size: 1.6rem;
}
.event-detail01__textarea .button-file {
  margin-top: var(--space-2xl);
}
.event-detail01__title {
  margin-bottom: 5rem;
  display: flex;
  align-items: center;
  gap: 2.4rem;
  line-height: 1.4;
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .event-detail01__title {
    margin-bottom: 3rem;
    gap: 1.6rem;
    font-size: 2rem;
  }
}
.event-detail01__title::before {
  content: "";
  width: 7.5rem;
  height: 6rem;
  padding-left: 0.4rem;
  background: url(/assets/images/event/program_num.svg) center left/contain no-repeat;
  display: flex;
  align-items: flex-end;
  line-height: 1;
  font-family: "Roboto", sans-serif;
  font-size: 4.8rem;
  font-weight: 600;
  color: var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .event-detail01__title::before {
    width: 6rem;
    height: 5rem;
    font-size: 4rem;
  }
}
.event-detail01:nth-child(1) .event-detail01__title::before {
  content: "01";
}
.event-detail01:nth-child(2) .event-detail01__title::before {
  content: "02";
}
.event-detail01:nth-child(3) .event-detail01__title::before {
  content: "03";
}
.event-detail01:nth-child(4) .event-detail01__title::before {
  content: "04";
}
.event-detail01:nth-child(5) .event-detail01__title::before {
  content: "05";
}
.event-detail01:nth-child(6) .event-detail01__title::before {
  content: "06";
}
.event-detail01:nth-child(7) .event-detail01__title::before {
  content: "07";
}
.event-detail01:nth-child(8) .event-detail01__title::before {
  content: "08";
}
.event-detail01__subttl {
  margin: 2.4rem 0 0.5rem;
}
.event-detail01__imagearea {
  width: 42%;
}
@media screen and (max-width: 768px) {
  .event-detail01__imagearea {
    width: 100%;
  }
}
.event-detail01__imagearea .mt-be-image img {
  border-radius: 0.8rem;
}

/* event-detail02 */
.event-detail02 {
  width: min(90%, 114.4rem);
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .event-detail02 {
    width: auto;
  }
}
.event-detail02 .js-scrollable::-webkit-scrollbar {
  display: none;
}
@media screen and (max-width: 768px) {
  .event-detail02 .js-scrollable__inner {
    width: 100rem;
    padding: 0 5vw;
  }
}
.event-detail02__table {
  width: 100%;
  table-layout: fixed;
}
.event-detail02__table td {
  padding: 1em;
  border: solid 1px var(--clr-white);
  background-color: rgba(238, 243, 244, 0.3);
  text-align: center;
}
.event-detail02__table thead td {
  background-color: var(--clr-blue);
  color: var(--clr-white);
}
.event-detail02__table thead td:first-child {
  border-radius: 0.8rem 0 0 0;
}
.event-detail02__table thead td:last-child {
  border-radius: 0 0.8rem 0 0;
}
.event-detail02__table tbody tr:nth-child(even) td {
  background-color: var(--clr-bg);
}

/* -------------------------------------------
  クラブ活動
  /schoollife/club/
------------------------------------------- */
.club__list li > a {
  display: block;
}
.club__list li > a figure {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
}
.club__list li > a figure div {
  border-radius: 0.8rem;
  overflow: hidden;
}
.club__list li > a figure div img {
  aspect-ratio: 365/219;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.club__list li > a figure figcaption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 2.4rem;
  font-weight: 600;
}
.club__list li > a figure figcaption::after {
  content: "";
  width: 3.4rem;
  aspect-ratio: 1/1;
  background-color: var(--clr-blue);
  -webkit-mask: url(/assets/images/common/icon_linkbtn--modal.svg) center center/contain no-repeat;
          mask: url(/assets/images/common/icon_linkbtn--modal.svg) center center/contain no-repeat;
}
@media (hover: hover) {
  .club__list li > a figure div img {
    transition: transform 0.3s ease;
  }
  .club__list li > a figure figcaption {
    transition: color 0.3s ease;
  }
  .club__list li > a:hover figure div img {
    transform: scale(1.1);
  }
  .club__list li > a:hover figure figcaption {
    color: var(--clr-blue);
  }
}
.club__list li > a[href="#"] {
  pointer-events: none;
}
.club__list li > a[href="#"] figure figcaption::after {
  content: none;
}
.club__list li p {
  margin-top: var(--space-xl);
}

.club-detail__image {
  position: sticky;
  float: left;
  top: 8rem;
  left: 8rem;
  width: 43.4034416826%;
}
@media screen and (max-width: 768px) {
  .club-detail__image {
    position: static;
    float: none;
    width: 100%;
    margin-bottom: var(--space-2xl);
  }
}
.club-detail__image img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.8rem;
}
.club-detail__text {
  padding-left: 48.4034416826%;
}
@media screen and (max-width: 768px) {
  .club-detail__text {
    padding-left: 0;
  }
}
.club-detail__text h1 {
  position: relative;
  margin-bottom: var(--space-3xl);
  padding-bottom: var(--space-xl);
  border-bottom: solid 2px var(--clr-white);
  font-size: 3.2rem;
}
@media screen and (max-width: 768px) {
  .club-detail__text h1 {
    margin-bottom: var(--space-2xl);
    font-size: 2.4rem;
  }
}
.club-detail__text h1::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 28%;
  height: 2px;
  background: var(--grad-type01);
}
.club-detail__table {
  width: 100%;
  border: none;
}
.club-detail__table:first-child {
  margin-top: calc(var(--space-xl) * -1);
}
.club-detail__table tr th, .club-detail__table tr td {
  padding: var(--space-xl) 0;
  border: none;
  border-bottom: solid 1px rgba(69, 62, 60, 0.3);
  text-align: left;
}
@media screen and (max-width: 768px) {
  .club-detail__table tr th, .club-detail__table tr td {
    display: block;
    padding: var(--space-xl) 0;
  }
}
.club-detail__table tr th {
  width: 7em !important;
  color: var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .club-detail__table tr th {
    width: 100% !important;
    padding-bottom: 0;
    border-bottom: none;
  }
}
.club-detail__table tr td {
  width: calc(100% - 7em) !important;
  padding-left: var(--space-3xl);
}
@media screen and (max-width: 768px) {
  .club-detail__table tr td {
    width: 100% !important;
    padding: var(--space-sm) 0 var(--space-xl) 0;
  }
}
@media screen and (max-width: 768px) {
  .club-detail__table:last-child tr th, .club-detail__table:last-child tr td {
    border-bottom: none;
  }
}

/* -------------------------------------------
  お知らせ
  /news/
------------------------------------------- */
.news-contents {
  width: min(90%, 114.4rem);
  margin: 0 auto;
}
.news-categories {
  margin-bottom: 12rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}
.news-categories li:first-child {
  margin-right: calc(var(--space-xl) - 0.8rem);
  padding-right: var(--space-xl);
  border-right: solid 1px #ccc;
}
.news-categories li a {
  padding: 0.4rem 3.2rem;
  border: solid 1px var(--clr-blue);
  border-radius: 5rem;
  display: inline-flex;
  font-size: 1.4rem;
  color: var(--clr-blue);
  transition: background-color 0.3s ease, color 0.3s ease;
}
@media screen and (max-width: 768px) {
  .news-categories li a {
    padding: 0.2rem 2.4rem;
  }
}
.news-categories li a.current {
  background-color: var(--clr-blue);
  color: var(--clr-white);
}
@media (hover: hover) {
  .news-categories li a:hover {
    background-color: var(--clr-blue);
    color: var(--clr-white);
  }
}
.news-entries {
  margin: var(--space-3xl) 0;
}
.news-entries li {
  padding-bottom: 2.4rem;
  border-bottom: solid 1px rgba(69, 62, 60, 0.3);
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: 14rem 10rem auto;
  align-items: center;
  gap: 4.8rem;
}
.news-entries li:not(:last-child) {
  margin-bottom: 2.4rem;
}
@media screen and (max-width: 768px) {
  .news-entries li {
    grid-template-columns: 12rem auto;
    gap: 1.6rem;
  }
}
.news-entries li > span {
  border-radius: 5rem;
  background-color: #453E3C;
  text-align: center;
  font-size: 1.4rem;
  color: var(--clr-white);
}
.news-entries li > a {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .news-entries li > a {
    grid-column: 1/3;
  }
}
.news-entries li > a::after {
  content: "";
  flex-shrink: 0;
  width: 2.5rem;
  aspect-ratio: 1/1;
  margin: 0 2rem;
  background-color: currentColor;
  -webkit-mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/98% auto no-repeat;
          mask: url(/assets/images/common/icon_linkbtn--md.svg) center center/98% auto no-repeat;
}
@media screen and (max-width: 768px) {
  .news-entries li > a::after {
    margin: 0 0.5rem 0 1rem;
  }
}
@media (hover: hover) {
  .news-entries li > a {
    transition: color 0.3s ease;
  }
  .news-entries li > a:hover {
    color: var(--clr-blue);
  }
}
.news-pagenation {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--space-2xl);
}
.news-pagenation li a {
  display: inline-block;
  padding: 0.8rem 1.5rem;
  border: solid 1px var(--clr-blue);
  border-radius: 5rem;
  color: var(--clr-blue);
}
@media (hover: hover) {
  .news-pagenation li a {
    transition: background-color 0.3s ease, color 0.3s ease;
  }
  .news-pagenation li a:hover {
    background-color: var(--clr-blue);
    color: var(--clr-white);
  }
}
.news-entry__header {
  position: relative;
  height: 28.5rem;
  background: linear-gradient(0deg, #FFFFFF 80%, rgba(245, 246, 244, 0.5) 100%);
}
@media screen and (max-width: 768px) {
  .news-entry__header {
    height: 25.2rem;
  }
}
.news-entry__header::before {
  content: "";
  position: absolute;
  top: auto;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 15.2rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(74, 177, 206, 0.2) 100%);
}
.news-entry__header::after {
  content: none;
}
.news-entry__header > * {
  position: relative;
}
.news-entry__header h1 {
  font-size: 3.2rem;
}
@media screen and (max-width: 768px) {
  .news-entry__header h1 {
    font-size: 2.6rem;
  }
}
.news-entry__outline {
  margin: var(--space-xl) 0 var(--space-sm);
  display: flex;
  align-items: center;
}
.news-entry__outline span {
  min-width: 14rem;
  margin-right: var(--space-xl);
  padding: 0 2rem;
  border-radius: 5rem;
  background-color: var(--clr-text);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  color: var(--clr-white);
}
.news-entry__body {
  width: min(100%, 105rem);
  margin: 0 auto;
}
.news-entry__body > * {
  margin-bottom: var(--space-md);
}
.news-entry__body h1 {
  position: relative;
  overflow: hidden;
  margin: 10rem 0 5rem;
  padding: 0.7em 1em;
  border-radius: 0.8rem;
  background-color: var(--clr-bg);
  text-align: center;
  font-size: 3.2rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .news-entry__body h1 {
    margin-bottom: 3.5rem;
    font-size: 2.2rem;
  }
}
.news-entry__body h1::after {
  content: "";
  position: absolute;
  bottom: -0.8rem;
  left: 0;
  width: 100%;
  height: 1.6rem;
  border-radius: 100% 100% 0 0;
  background: var(--grad-type03);
}
@media screen and (max-width: 768px) {
  .news-entry__body h1::after {
    bottom: -0.6rem;
    height: 1.2rem;
  }
}
.news-entry__body h2 {
  position: relative;
  margin: 8rem 0 var(--space-3xl);
  padding-bottom: var(--space-xl);
  border-bottom: solid 0.2rem var(--clr-bg);
  font-size: 3rem;
}
@media screen and (max-width: 768px) {
  .news-entry__body h2 {
    font-size: 2rem;
  }
}
.news-entry__body h2::after {
  content: "";
  position: absolute;
  bottom: -0.2rem;
  left: 0;
  width: 28%;
  height: 0.2rem;
  background: var(--grad-type03);
}
.news-entry__body h3 {
  margin: 5rem 0 var(--space-xl);
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--clr-blue);
}
.news-entry__body h4 {
  margin: var(--space-2xl) 0 var(--space-lg);
  font-size: 2.4rem;
  font-weight: 700;
}
.news-entry__body h5 {
  margin: 5rem 0 var(--space-md);
  font-size: 1.6rem;
  font-weight: 700;
}
.news-entry__body p {
  line-height: 1.8;
}
.news-entry__body ul {
  margin-left: 2rem;
}
.news-entry__body ul li {
  list-style-type: disc;
}
.news-entry__body ol {
  margin-left: 2rem;
}
.news-entry__body ol li {
  list-style-type: decimal;
}
.news-entry__body hr {
  margin: var(--space-3xl) 0;
  border: solid var(--clr-bg);
  border-width: 3px 0 0 0;
}
.news-entry__body table {
  width: 100%;
  max-width: 100%;
  border: none;
}
.news-entry__body table col {
  width: auto !important;
}
.news-entry__body table th {
  width: 25%;
  padding: 1em 1em 1em 0;
  border-bottom: solid var(--clr-blue);
  border-width: 0 0 0.2rem 0;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .news-entry__body table th {
    padding-right: 0;
    vertical-align: top;
  }
}
.news-entry__body table td {
  padding: 1em 0 1em 2em;
  border-bottom: solid var(--clr-bg);
  border-width: 0 0 0.2rem 0;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .news-entry__body table td {
    padding-left: 1em;
    vertical-align: top;
  }
}
.news-entry__body a {
  text-decoration: underline;
  color: var(--clr-blue);
}
.news-entry__image {
  margin-bottom: var(--space-xl);
}
.news-entry__image.col2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-xl);
}
@media screen and (max-width: 768px) {
  .news-entry__image.col2 {
    grid-template-columns: 1fr;
  }
}

/* -------------------------------------------
  コース紹介
  /course/
------------------------------------------- */
.course-mv {
  width: min(90%, 114.4rem);
  margin: 0 auto;
}
.course-title--lg {
  position: relative;
  display: inline-block;
  padding: 0 var(--space-xl);
  color: var(--clr-white);
}
.course-title--lg::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.course-title--lg.clr--green::before {
  background-color: var(--clr-green);
}
.course-title--lg.clr--aqua::before {
  background-color: var(--clr-aqua);
}
.course-title--lg.clr--purple::before {
  background-color: var(--clr-purple);
}
.course-title--md {
  margin-bottom: var(--space-xl);
  padding-bottom: var(--space-sm);
  font-size: 2.4rem;
}
.course-outline dt {
  margin-bottom: var(--space-sm);
  font-weight: 700;
}
.course-sec {
  width: min(90%, 114.4rem);
  margin: 12rem auto 0;
  display: flex;
  gap: 8rem;
}
@media screen and (max-width: 768px) {
  .course-sec {
    margin-top: 6.8rem;
    flex-direction: column;
    gap: var(--space-2xl);
  }
}
.course-sec__text {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3xl);
}
@media screen and (max-width: 768px) {
  .course-sec__text {
    gap: var(--space-2xl);
  }
}
.course-sec__image {
  width: 41.6958041958%;
}
@media screen and (max-width: 768px) {
  .course-sec__image {
    width: 100%;
  }
}
.course-sec__image img {
  aspect-ratio: 477/286;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.8rem;
}
.course-subsec {
  margin-top: 12rem;
}
@media screen and (max-width: 768px) {
  .course-subsec {
    margin-top: 6rem;
  }
}
.course-about__text dt {
  margin-top: var(--space-3xl);
  font-size: 2.4rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .course-about__text dt {
    font-size: 1.8rem;
  }
}
.course-about__text dd {
  margin-top: var(--space-sm);
  margin-bottom: var(--space-3xl);
}
.course-graduate h3 {
  line-height: 0.7;
  font-family: var(--fnt-montserrat);
  font-size: 3.2rem;
  font-weight: 400;
}
@media screen and (max-width: 768px) {
  .course-graduate h3 {
    margin-bottom: 0;
    line-height: 1.1;
    text-align: left;
  }
}
.course-graduate h3.green {
  color: var(--clr-green);
}
.course-graduate h3.purple {
  color: var(--clr-purple);
}
.course-graduate__inner {
  display: flex;
  flex-direction: row-reverse;
  align-items: stretch;
  border-radius: 1.6rem;
  background-color: var(--clr-bg);
}
@media screen and (max-width: 768px) {
  .course-graduate__inner {
    flex-direction: column;
  }
}
.course-graduate__img {
  position: relative;
  width: 40rem;
  border-radius: 0 1.6rem 1.6rem 0;
}
@media screen and (max-width: 768px) {
  .course-graduate__img {
    width: 100%;
    border-radius: 0.8rem 0.8rem 0 0;
  }
}
.course-graduate__img.green {
  background-color: var(--clr-green);
}
.course-graduate__img.purple {
  background-color: var(--clr-purple);
}
.course-graduate__img figure {
  position: relative;
  height: 100%;
}
@media screen and (max-width: 768px) {
  .course-graduate__img figure {
    aspect-ratio: 1/1;
  }
}
.course-graduate__img figure img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.course-graduate__img figure figcaption {
  position: absolute;
  top: 1.6rem;
  right: 2.4rem;
  writing-mode: vertical-rl;
  font-size: 2rem;
  color: var(--clr-white);
}
@media screen and (max-width: 768px) {
  .course-graduate__img figure figcaption {
    right: 1.6rem;
  }
}
.course-graduate__img figure figcaption div {
  margin-top: -1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
}
.course-graduate__img figure figcaption div::before {
  content: "（";
  font-size: 4rem;
  font-weight: 100;
}
.course-graduate__img figure figcaption div::after {
  content: "）";
  font-size: 4rem;
  font-weight: 100;
}
.course-graduate__img figure figcaption div span {
  font-size: 1.2rem;
}
.course-graduate__img > p {
  position: absolute;
  bottom: 8rem;
  left: -4rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .course-graduate__img > p {
    bottom: 0;
    left: 0;
  }
}
.course-graduate__img > p span {
  padding: 0.5rem 1rem;
  background-color: var(--clr-white);
  line-height: 1.4;
  font-size: 2.4rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .course-graduate__img > p span {
    padding: 1rem 1rem 1rem 0;
    line-height: 1.5;
    font-size: 1.8rem;
  }
}
.course-graduate__img > p span:not(:first-child) {
  margin-top: -1rem;
}
@media screen and (max-width: 768px) {
  .course-graduate__img > p span:not(:first-child) {
    margin-top: -1.5rem;
  }
}
.course-graduate__img > p span.green {
  color: var(--clr-green);
}
.course-graduate__img > p span.purple {
  color: var(--clr-purple);
}
.course-graduate__text {
  position: relative;
  flex: 1;
  padding: 4.8rem;
}
@media screen and (max-width: 768px) {
  .course-graduate__text {
    padding: 2.4rem;
  }
}
.course-graduate__text::before {
  content: "";
  position: absolute;
  top: 10.7rem;
  right: -3.2rem;
  width: 3.2rem;
  aspect-ratio: 32/54;
  background-color: var(--clr-bg);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
@media screen and (max-width: 768px) {
  .course-graduate__text::before {
    top: -2rem;
    right: 4.2rem;
    width: 4.2rem;
    aspect-ratio: 42/21;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
  }
}
.course-graduate__text > p:not(:first-child) {
  margin-top: var(--space-lg);
}
.course-graduate__point {
  margin-top: var(--space-xl);
  display: inline-flex;
  padding: 2.4rem 5rem 2.4rem 3.2rem;
  border-radius: 0.8rem;
  background-color: var(--clr-white);
}
@media screen and (max-width: 768px) {
  .course-graduate__point {
    display: block;
    padding: 1.6rem;
  }
}
.course-graduate__point dl dt {
  margin-bottom: 0.8rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--clr-green);
}
.course-graduate__point dl dd {
  margin-top: 0.4rem;
}
.course-graduate__point dl dd strong {
  margin-right: 1rem;
}
.course-graduate__point > div.course-up__box-number {
  width: 22rem;
}
@media screen and (max-width: 768px) {
  .course-graduate__point > div.course-up__box-number {
    margin: var(--space-xl) auto 0;
  }
}
.course-graduate__point > div.course-up__box-number::before {
  left: 10%;
}
.course-teacher {
  width: 98.4rem;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .course-teacher {
    width: 100%;
  }
}
.course-teacher h3 {
  line-height: 0.7;
  text-align: right;
  font-family: var(--fnt-montserrat);
  font-size: 3.2rem;
  font-weight: 400;
  color: var(--clr-aqua);
}
@media screen and (max-width: 768px) {
  .course-teacher h3 {
    margin-bottom: -0.7rem;
    line-height: 1.1;
    text-align: left;
  }
}
.course-teacher__inner {
  padding: 2.4rem 3.2rem;
  border-radius: 1.6rem;
  background: url(/assets/images/course/sougou/teacher_bg.svg) center bottom/100% auto no-repeat var(--clr-bg);
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: var(--space-3xl);
}
@media screen and (max-width: 768px) {
  .course-teacher__inner {
    padding: 3.2rem 2.4rem 2.4rem;
    border-radius: 1.2rem;
    background-image: url(/assets/images/course/sougou/teacher_bg-sp.svg);
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-md);
  }
}
.course-teacher__inner dl {
  flex: 1;
}
@media screen and (max-width: 768px) {
  .course-teacher__inner dl {
    font-size: 1.5rem;
  }
}
.course-teacher__inner dl dt {
  font-weight: 700;
  letter-spacing: 0.2em;
}
.course-teacher__inner dl dd {
  margin-top: var(--space-md);
  letter-spacing: 0.15em;
}
.course-teacher__inner figure {
  position: relative;
  bottom: -2.4rem;
  width: 28.5rem;
  margin-top: -2.4rem;
}
@media screen and (max-width: 768px) {
  .course-teacher__inner figure {
    left: -0.8rem;
    width: 100%;
  }
}
.course-teacher__inner figure img {
  width: 16rem;
}
.course-teacher__inner figure img.tokushin {
  width: 20.3rem;
}
.course-teacher__inner figure img.athlete {
  width: 21.4rem;
}
@media screen and (max-width: 768px) {
  .course-teacher__inner figure img {
    width: auto !important;
    height: 18rem;
  }
}
.course-teacher__inner figure figcaption {
  position: absolute;
  bottom: 4rem;
  right: 0;
  padding: 0.8rem 1.8rem;
  border-radius: 5rem;
  background-color: var(--clr-white);
  font-size: 1.2rem;
  color: var(--clr-aqua);
}
.course-up__block {
  padding: 3.2rem;
  border-radius: 1.6rem;
  background-color: var(--clr-bg);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2.4rem;
}
@media screen and (max-width: 768px) {
  .course-up__block {
    grid-template-columns: 1fr;
  }
}
.course-up__box {
  padding: 2.4rem;
  border-radius: 0.8rem;
  background-color: var(--clr-white);
}
.course-up__box-header {
  height: 5.4rem;
  margin-bottom: 1.6rem;
}
@media screen and (max-width: 768px) {
  .course-up__box-header {
    height: 7.8rem;
  }
}
.course-up__box-header > * {
  display: inline-block;
  margin-right: 0.5rem;
}
.course-up__box-header strong {
  font-size: 2rem;
  font-weight: 700;
  color: var(--clr-green);
}
.course-up__box-number {
  position: relative;
  padding-bottom: 1rem;
}
.course-up__box-number::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 20%;
  width: 22rem;
  aspect-ratio: 220/122;
  background: url(/assets/images/course/tokushin/up_arrow.svg) center center/contain no-repeat;
  opacity: 0.5;
  mix-blend-mode: multiply;
}
@media screen and (max-width: 768px) {
  .course-up__box-number::before {
    left: 15%;
  }
}
.course-up__box-number > div {
  position: relative;
  width: 13.4rem;
  aspect-ratio: 1/1;
  border: solid 1px var(--clr-green);
  border-radius: 50%;
  background-color: var(--clr-white);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.course-up__box-number p:first-child {
  font-size: 1.1rem;
}
.course-up__box-number p:last-child {
  line-height: 1;
}
.course-up__box-number p strong {
  position: relative;
  font-family: "Jost", sans-serif;
  font-size: 5rem;
  font-weight: 400;
  letter-spacing: -0.2rem;
  background: var(--grad-type01);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.course-up__box-number p strong::before {
  content: "";
  position: absolute;
  bottom: 1.5rem;
  left: 0;
  width: 100%;
  height: 1rem;
  background-color: var(--clr-yellow);
  mix-blend-mode: multiply;
}
.course-up__box-number p strong::after {
  content: "";
  position: absolute;
  bottom: 1.5rem;
  right: 0;
  width: 0.5rem;
  height: 1rem;
  background-color: var(--clr-yellow);
  mix-blend-mode: multiply;
}
.course-up__box-number p span {
  margin-left: 0.2rem;
  font-size: 1.3rem;
}
.course-up__box-other {
  margin-top: 2.4rem;
}
.course-up__box-other dt {
  margin-bottom: 0.4rem;
  font-weight: 700;
}
.course-up__box-other dd {
  display: inline-block;
  margin: 0 0.4rem 0 0;
  font-size: 1.4rem;
}
.course-up__box-other dd span {
  font-size: 1.2rem;
}
.course-elective__list {
  margin-top: var(--space-3xl);
}
.course-subnav {
  margin-top: 5rem;
  display: flex;
  gap: var(--space-xl);
}
@media screen and (max-width: 768px) {
  .course-subnav {
    flex-direction: column;
    gap: var(--space-sm);
  }
}
.course-subnav li {
  flex: 1;
}
.course-subnav li a {
  position: relative;
  padding: var(--space-xl) 0;
  border-radius: 0.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--clr-aqua);
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .course-subnav li a {
    padding: 2rem 0;
    font-size: 1.5rem;
  }
}
.course-subnav li a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: solid 1px var(--clr-aqua);
  border-radius: 0.8rem;
}
.course-subnav li a::after {
  content: "";
  position: absolute;
  bottom: -0.5rem;
  right: -0.5rem;
  width: 4.8rem;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: currentColor;
  -webkit-mask: url(/assets/images/course/subnav_arrow.svg) center center/contain no-repeat;
          mask: url(/assets/images/course/subnav_arrow.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .course-subnav li a::after {
    width: 4rem;
  }
}
@media (hover: hover) {
  .course-subnav li a {
    transition: background-color 0.3s ease, color 0.3s ease;
  }
  .course-subnav li a::after {
    transition: background-color 0.3s ease;
  }
  .course-subnav li a:hover {
    background-color: var(--clr-aqua);
    color: var(--clr-white);
  }
}

/* -------------------------------------------
  箕面学園とは
  /about/
------------------------------------------- */
.about-greeting {
  direction: rtl;
}
.about-greeting > * {
  direction: ltr;
}
.about-greeting > div p {
  margin-top: var(--space-lg);
  line-height: 1.8;
}
.about-greeting figure img {
  border-radius: 1.6rem;
}
.about-history th {
  vertical-align: top;
  text-align: right;
  white-space: nowrap;
}

/* -------------------------------------------
  3分で分かるMINOGAKU
  /overview/
------------------------------------------- */
@media screen and (max-width: 768px) {
  .ov-main {
    background: url(/assets/images/overview/qa_bg--sm.svg) center bottom/100% auto no-repeat;
  }
}
.ov-section {
  margin: 22.4rem 0;
}
@media screen and (max-width: 768px) {
  .ov-section {
    margin: 12.8rem 0;
  }
}
.ov-section__inner:not(:last-child) {
  margin-bottom: 12rem;
}
.ov-section__inner .top-course {
  margin-top: 0;
}
@media screen and (max-width: 768px) {
  .ov-section__inner .top-course {
    width: 100%;
  }
}

.ov {
  /* 数字でわかる */
}
.ov-num > * {
  padding: 1.6rem;
  border-radius: 0.8rem;
  background-color: var(--clr-bg);
}
@media screen and (max-width: 768px) {
  .ov-num > * {
    padding: 1.6rem 1.2rem;
  }
}
.ov-num > *.ov-point {
  position: relative;
}
.ov-num > *.ov-point::before {
  --width: 10rem;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(calc(var(--width) / -3), calc(var(--width) / -2));
  width: var(--width);
  aspect-ratio: 1/1;
  background: url(/assets/images/overview/point.svg) center center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .ov-num > *.ov-point::before {
    --width: 6rem;
    transform: translate(-1rem, -1rem);
  }
}
.ov-num__title {
  display: flex;
  justify-content: center;
  text-align: center;
}
.ov-num__title span {
  min-width: 19rem;
  padding: 0.5rem 2rem;
  border-radius: 10rem;
  background-color: var(--clr-white);
  font-size: 1.8rem;
  color: var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .ov-num__title span {
    font-size: 1.3rem;
  }
}
.ov-num__inner.type-a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.ov-num__inner.type-b {
  display: flex;
  justify-content: center;
  align-items: center;
}
.ov-num__inner .text {
  text-align: center;
  font-size: 1.4rem;
}
.ov-num .block-a {
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 0.5rem;
}
.ov-num .block-a .number {
  position: relative;
  font-family: "Jost", sans-serif;
  font-size: 12.8rem;
  font-weight: 400;
  letter-spacing: -0.3rem;
}
@media screen and (max-width: 768px) {
  .ov-num .block-a .number {
    font-size: min(12.8rem, 30vw);
  }
}
.ov-num .block-a .number::before {
  content: "";
  position: absolute;
  bottom: 1rem;
  left: 0;
  width: 100%;
  height: 1.8rem;
  background-color: var(--clr-yellow);
  mix-blend-mode: multiply;
}
.ov-num .block-a .number::after {
  content: "";
  position: absolute;
  bottom: 1rem;
  right: 0;
  width: 0.8rem;
  height: 1.8rem;
  background-color: var(--clr-yellow);
  mix-blend-mode: multiply;
}
.ov-num .block-a .unit {
  transform: translateY(-0.5em);
  font-weight: 700;
}
.ov-num .block-b {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.ov-num .number {
  line-height: 1;
  background: var(--grad-type01);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ov-num01 {
  margin-top: 10rem;
  display: grid;
  grid-template-columns: 1fr 24.5614035088% 24.5614035088%;
  grid-template-rows: auto auto;
  gap: 1.4rem;
}
@media screen and (max-width: 768px) {
  .ov-num01 {
    margin-top: 6rem;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
}
.ov-num01-01 {
  grid-row: 1/3;
  grid-column: 1/2;
}
@media screen and (max-width: 768px) {
  .ov-num01-01::before {
    transform: translate(-1rem, -4rem) !important;
  }
}
.ov-num01-01 .type-d {
  padding-top: 4rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .type-d {
    padding-top: 2rem;
  }
}
.ov-num01-01 .block-c {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c {
    gap: 2.5rem;
  }
}
.ov-num01-01 .block-c-left .text {
  transform: translateX(-1.6rem);
  font-size: 1.4rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c-left .text {
    font-size: 1.1rem;
  }
}
.ov-num01-01 .block-c-left .block-a .number {
  font-size: 8rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c-left .block-a .number {
    font-size: 5.4rem;
  }
}
.ov-num01-01 .block-c-left .block-a .number::before, .ov-num01-01 .block-c-left .block-a .number::after {
  bottom: 0.8rem;
  height: 1rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c-left .block-a .number::before, .ov-num01-01 .block-c-left .block-a .number::after {
    bottom: 0.5rem;
  }
}
.ov-num01-01 .block-c-left .block-a .unit {
  font-size: 1.4rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c-left .block-a .unit {
    font-size: 1.1rem;
  }
}
.ov-num01-01 .block-c-left hr {
  width: 60%;
  margin: 1.6rem auto;
  transform: translateX(-1.6rem);
  border: none;
  border-bottom: dashed 1px #453E3C;
}
.ov-num01-01 .block-c-right .text {
  text-align: left;
  font-size: 1.8rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c-right .text {
    font-size: 1.4rem;
  }
}
.ov-num01-01 .block-c-right .block-a {
  padding-left: 2.4rem;
}
.ov-num01-01 .block-c-right .block-a .number {
  font-size: 18.4rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c-right .block-a .number {
    font-size: 11.4rem;
  }
}
.ov-num01-01 .block-c-right .block-a .number::before, .ov-num01-01 .block-c-right .block-a .number::after {
  bottom: 2rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c-right .block-a .number::before, .ov-num01-01 .block-c-right .block-a .number::after {
    bottom: 1rem;
  }
}
.ov-num01-01 .block-c-right .block-a .unit {
  font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 .block-c-right .block-a .unit {
    font-size: 1.4rem;
  }
}
.ov-num01-01 figure {
  padding-bottom: 1.6rem;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .ov-num01-01 figure {
    width: 50%;
    margin: 0 auto;
  }
}
.ov-num01-02 {
  grid-row: 1/2;
  grid-column: 2/3;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ov-num01-02 .type-a {
  flex: 1;
  margin: 2rem 0 3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2.4rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-02 .type-a {
    margin: 1rem 0 0.5rem;
    gap: 1.5rem;
  }
}
.ov-num01-03 {
  grid-row: 1/2;
  grid-column: 3/4;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ov-num01-03 .type-a {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2.4rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-03 .type-a {
    margin: 1rem 0 0.5rem;
    gap: 1.5rem;
  }
}
.ov-num01-04 {
  position: relative;
  grid-row: 2/3;
  grid-column: 2/4;
  display: flex;
  flex-direction: column;
}
.ov-num01-04 .type-e {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-04 .type-e {
    margin-top: 2rem;
    gap: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .ov-num01-04 .type-a {
    width: 50%;
  }
}
.ov-num01-04 figure {
  margin-top: -4rem;
}
@media screen and (max-width: 768px) {
  .ov-num01-04 figure {
    width: 36%;
    margin: -2rem 0 0 1rem;
  }
}
.ov-num01-04 .text {
  font-size: 1.6rem;
  font-weight: 700;
}
.ov-num01-04 .block-a .number {
  line-height: 0;
  padding-bottom: 0.8rem;
}
.ov-num01-04 .block-a .number::before, .ov-num01-04 .block-a .number::after {
  bottom: 0;
}
@media screen and (max-width: 768px) {
  .ov-num01-01, .ov-num01-02, .ov-num01-03, .ov-num01-04 {
    grid-column: auto;
    grid-row: auto;
  }
}
.ov-num02 {
  margin-top: 1.4rem;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 1.4rem;
}
@media screen and (max-width: 768px) {
  .ov-num02 {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
}
.ov-num02-01 {
  position: relative;
  grid-row: 1/2;
  grid-column: 1/3;
}
.ov-num02-01 .type-c {
  --width: 20.4rem;
  position: absolute;
  top: calc(50% - var(--width) / 2);
  left: 2.4rem;
  width: 20.4rem;
  aspect-ratio: 1/1;
  border: solid 1px var(--clr-green);
  border-radius: 50%;
  background-color: var(--clr-white);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .ov-num02-01 .type-c {
    position: static;
    margin: 2rem auto 0;
  }
}
.ov-num02-01 .block-a .number {
  font-size: 7.6rem;
}
.ov-num02-01 .block-a .number::before, .ov-num02-01 .block-a .number::after {
  bottom: 0;
}
.ov-num02-01 figure {
  display: block;
  width: 67.6354029062%;
  margin: -3.2rem 4rem 0 auto;
}
@media screen and (max-width: 768px) {
  .ov-num02-01 figure {
    width: 100%;
    margin: 0;
    text-align: center;
  }
}
.ov-num02-02 {
  grid-row: 1/2;
  grid-column: 3/4;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ov-num02-02 .type-a {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2.4rem;
}
.ov-num02-03 {
  grid-row: 2/3;
  grid-column: 1/2;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ov-num02-03 .block-a {
  flex: 1;
  padding: 2rem 0 3rem;
}
@media screen and (max-width: 768px) {
  .ov-num02-03 .block-a {
    padding: 1rem 0 0;
  }
}
.ov-num02-03 .block-a .number {
  font-size: 11.2rem;
}
@media screen and (max-width: 768px) {
  .ov-num02-03 .block-a .number {
    font-size: min(11.2rem, 30vw);
  }
}
.ov-num02-03 figure {
  width: 10rem;
  margin-left: 1rem;
}
@media screen and (max-width: 768px) {
  .ov-num02-03 figure {
    width: 30%;
  }
}
.ov-num02-04 {
  grid-row: 2/3;
  grid-column: 2/3;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ov-num02-04 .block-b {
  flex: 1;
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}
.ov-num02-04 .block-b .number {
  font-size: 9.6rem;
}
@media screen and (max-width: 768px) {
  .ov-num02-04 .block-b .number {
    font-size: min(9.6rem, 30vw);
  }
}
@media screen and (max-width: 768px) {
  .ov-num02-04 .block-a {
    flex: 1;
  }
}
.ov-num02-04 figure {
  width: 9.5rem;
  margin-left: 1rem;
}
@media screen and (max-width: 768px) {
  .ov-num02-04 figure {
    width: 30%;
  }
}
.ov-num02-05 {
  grid-row: 2/3;
  grid-column: 3/4;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ov-num02-05 .type-a {
  flex: 1;
  margin-bottom: 3rem;
}
@media screen and (max-width: 768px) {
  .ov-num02-05 .type-a {
    margin-top: 1rem;
    margin-bottom: 0;
  }
}
.ov-num02-05 .block-a {
  position: relative;
}
.ov-num02-05 .sub {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(calc(-100% - 0.5rem), -50%);
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .ov-num02-05 .sub {
    font-size: min(1.4rem, 4.6vw);
  }
}
@media screen and (max-width: 768px) {
  .ov-num02-01, .ov-num02-02, .ov-num02-03, .ov-num02-04, .ov-num02-05 {
    grid-column: auto;
    grid-row: auto;
  }
}

@media (hover: hover) {
  .ov-num * .block-a .number::before {
    width: 0;
  }
  .ov-num * .block-a .number::after {
    right: 100%;
    opacity: 0;
  }
  .ov-num * .block-a .number.is-view::before {
    animation: number 0.5s cubic-bezier(0.65, 0, 0.35, 1) forwards;
  }
  .ov-num * .block-a .number.is-view::after {
    animation: number_last 0.5s cubic-bezier(0.65, 0, 0.35, 1) forwards;
  }
}
@keyframes number {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@keyframes number_last {
  0% {
    right: 100%;
    opacity: 0;
  }
  100% {
    right: 0;
    opacity: 1;
  }
}
.ov {
  /* 新しくなった */
}
.ov-progress {
  margin-top: 4.8rem;
  border-radius: 0.8rem;
  background: url(/assets/images/overview/progress_deco.svg) right center/100% auto no-repeat var(--clr-bg);
}
@media screen and (max-width: 768px) {
  .ov-progress {
    background: url(/assets/images/overview/progress_deco--sm.svg) center center/cover no-repeat var(--clr-bg);
  }
}
.ov-progress__inner {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .ov-progress__inner {
    flex-direction: column;
  }
}
.ov-progress .text {
  flex: 1;
  padding: 4.8rem 0 4.8rem 6.4rem;
}
@media screen and (max-width: 768px) {
  .ov-progress .text {
    width: 100%;
    padding: 3.2rem 1.6rem;
  }
}
.ov-progress figure {
  padding: 3.9rem 0 0.8rem 0;
  width: 46.8531468531%;
}
@media screen and (max-width: 768px) {
  .ov-progress figure {
    width: 100%;
    padding: 0 3% 10% 5%;
  }
}
.ov-progress h5 {
  display: inline-block;
  margin-bottom: var(--space-xl);
  font-size: 2.4rem;
  background: var(--grad-type03);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ov-progress dl {
  display: grid;
  gap: 0.8rem 2rem;
  grid-template-columns: 16.5rem 1fr;
}
.ov-progress dl dt {
  display: flex;
  justify-content: space-between;
}
.ov-progress dl dt::after {
  content: "：";
  margin-left: 1rem;
}
@media screen and (max-width: 768px) {
  .ov-progress dl.type01 {
    grid-template-columns: 7em 1fr;
  }
  .ov-progress dl.type02 {
    grid-template-columns: 1fr;
  }
  .ov-progress dl.type02 dt {
    justify-content: flex-start;
  }
}
.ov-progress hr {
  width: 8rem;
  height: 0;
  margin: 3.2rem 0;
  border-top: dashed 1px #453E3C;
}
.ov-gallery {
  margin-top: -10rem;
}
@media screen and (max-width: 768px) {
  .ov-gallery {
    margin-top: -5rem;
  }
}
.ov-slider {
  margin-top: 2.4rem;
}
.ov-slider .slick-slide {
  padding: 0 1.2rem;
}

.ov {
  /* 生徒が答える */
}
.ov-qa {
  background: url(/assets/images/overview/qa_bg.svg) -7% center/80% auto no-repeat;
}
@media screen and (max-width: 768px) {
  .ov-qa {
    background-size: contain;
  }
}
.ov-qalist dt {
  display: flex;
  align-items: center;
  margin-top: 4.8rem;
  line-height: 2;
}
@media screen and (max-width: 768px) {
  .ov-qalist dt {
    margin-top: 2.4rem;
  }
}
.ov-qalist dt::before {
  content: "Q";
  width: 5.6rem;
  aspect-ratio: 1/1;
  margin-right: 2rem;
  border-radius: 50%;
  background-color: var(--clr-green);
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  font-family: "Inter", sans-serif;
  font-size: 3.2rem;
  font-weight: 700;
  color: var(--clr-white);
}
@media screen and (max-width: 768px) {
  .ov-qalist dt::before {
    width: 3.2rem;
    margin-right: 0.8rem;
    font-size: 2rem;
  }
}
.ov-qalist dt span {
  position: relative;
  display: inline;
  background: linear-gradient(transparent 60%, var(--clr-yellow) 0%);
  font-size: 2.4rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .ov-qalist dt span {
    font-size: 1.8rem;
  }
}
.ov-qalist dt span::before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 1rem;
  height: 1.44rem;
  background-color: var(--clr-yellow);
  mix-blend-mode: multiply;
}
@media screen and (max-width: 768px) {
  .ov-qalist dt span::before {
    height: 1.08rem;
  }
}
.ov-qalist dd {
  margin-top: 2rem;
  display: flex;
  align-items: flex-start;
  gap: 2.4rem;
}
@media screen and (max-width: 768px) {
  .ov-qalist dd {
    margin-top: 1.6rem;
    gap: 1.2rem;
  }
}
.ov-qalist dd::after {
  content: "";
  width: 12rem;
  aspect-ratio: 1/1;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
}
@media screen and (max-width: 768px) {
  .ov-qalist dd::after {
    width: 4rem;
  }
}
.ov-qalist dd p {
  position: relative;
  flex: 1;
  padding: 3.2rem;
  border: solid 1px var(--clr-green);
  border-radius: 0.8rem;
  background-color: var(--clr-bg);
}
@media screen and (max-width: 768px) {
  .ov-qalist dd p {
    padding: 1.6rem;
  }
}
.ov-qalist dd p::after {
  content: "";
  position: absolute;
  top: 2.8rem;
  right: -1.7rem;
  width: 1.7rem;
  aspect-ratio: 17/16;
  background: url(/assets/images/overview/qa_arrow.svg) left center/contain no-repeat;
}
@media screen and (max-width: 768px) {
  .ov-qalist dd p::after {
    top: 1.4rem;
    right: -1rem;
    width: 1rem;
    background: url(/assets/images/overview/qa_arrow-sm.svg) left center/contain no-repeat;
  }
}
.ov-qalist dd.type01::after {
  background-image: url(/assets/images/overview/qa_icon01.png);
}
.ov-qalist dd.type02::after {
  background-image: url(/assets/images/overview/qa_icon02.png);
}

.ov {
  /* 映像でわかる */
}
.ov-youtube iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}

/* -------------------------------------------
  送信完了
  /thanks.html
------------------------------------------- */
.thanks .button-link a {
  padding-right: 3em;
  padding-left: 3em;
  background-color: var(--clr-blue);
  color: var(--clr-white);
}
.thanks .button-link a::after {
  content: none;
}

/* -------------------------------------------
  受験案内
  /exam-guide/
------------------------------------------- */
.exam-guide__dl {
  display: grid;
  grid-template-columns: 32rem 1fr;
}
@media screen and (max-width: 768px) {
  .exam-guide__dl {
    grid-template-columns: 1fr;
  }
}
.exam-guide__dl > dt {
  position: relative;
  padding: 3.2rem 0;
  border-bottom: solid 2px var(--clr-lgray);
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .exam-guide__dl > dt {
    padding: 0;
    border-bottom: none;
  }
  .exam-guide__dl > dt:not(:first-child) {
    margin-top: var(--space-2xl);
  }
}
.exam-guide__dl > dt::before {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 50%;
  height: 0;
  border-bottom: solid 2px var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .exam-guide__dl > dt::before {
    content: none;
  }
}
.exam-guide__dl > dd {
  padding: 3.2rem 0 3.2rem 0;
  border-bottom: solid 2px var(--clr-lgray);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--space-sm);
}
@media screen and (max-width: 768px) {
  .exam-guide__dl > dd {
    position: relative;
    padding: var(--space-sm) 0 var(--space-2xl);
  }
  .exam-guide__dl > dd::before {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 30%;
    height: 0;
    border-bottom: solid 2px var(--clr-blue);
  }
}
.exam-guide__dl > dd strong {
  font-size: 1.8rem;
}
.exam-guide__ol {
  margin-left: 3rem;
  font-size: 1.8rem;
  font-weight: bold;
}
.exam-guide__ol li {
  margin-bottom: 0.5em;
  list-style-type: decimal;
}

/* -------------------------------------------
  活躍する卒業生
  /schoollife/graduate.html
------------------------------------------- */
.sec-dialogue {
  width: min(90%, 103rem);
  margin: 0 auto;
}

.dialogue-header {
  text-align: center;
}
.dialogue-header h2 {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.dialogue-header h2 .en {
  line-height: 1;
  font-family: "Montserrat", sans-serif;
  font-size: 4.4rem;
  font-weight: 300;
}
@media screen and (max-width: 768px) {
  .dialogue-header h2 .en {
    font-size: 3.2rem;
  }
}
.dialogue-header h2 .ja {
  width: 100%;
  margin-top: 0.5rem;
  padding: 0 0 0.2rem;
  background: var(--grad-type01);
  font-size: 1.8rem;
  font-weight: 100;
  color: var(--clr-white);
}
.dialogue-intro {
  margin: 8rem auto 16rem;
}
@media screen and (max-width: 768px) {
  .dialogue-intro {
    margin: 6rem auto 8rem;
  }
}
.dialogue-intro h3 {
  position: relative;
  height: 3.7rem;
}
.dialogue-intro h3::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.3rem;
  background: var(--grad-type01);
}
.dialogue-intro h3 span {
  line-height: 1;
  font-family: "Montserrat", sans-serif;
  font-size: 4rem;
  font-weight: 400;
  background: var(--grad-type01);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.dialogue-intro__inner {
  position: relative;
  background-color: var(--clr-bg);
  display: flex;
  align-items: stretch;
}
@media screen and (max-width: 768px) {
  .dialogue-intro__inner {
    flex-direction: column;
  }
}
.dialogue-intro__inner::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 1.6rem;
  left: 1.6rem;
  width: 100%;
  height: 100%;
  background: var(--grad-type01);
}
@media screen and (max-width: 768px) {
  .dialogue-intro__inner::before {
    left: 1.2rem;
  }
}
.dialogue-intro__inner figure {
  padding: 4.8rem 6.4rem;
}
@media screen and (max-width: 768px) {
  .dialogue-intro__inner figure {
    padding: 2.4rem;
  }
}
.dialogue-intro__inner figure img {
  width: 35.5rem;
}
.dialogue-intro__inner > div {
  position: relative;
  flex: 1;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .dialogue-intro__inner > div {
    min-height: initial;
    padding: 0 2.4rem 3.6rem;
    font-size: 1.5rem;
  }
}
.dialogue-intro__inner > div > * {
  position: relative;
}
.dialogue-intro__inner > div > span {
  position: absolute;
  bottom: 0;
  right: 0;
  line-height: 1;
  font-family: "Montserrat", sans-serif;
  font-size: 11.2rem;
  font-weight: 700;
  color: var(--clr-white);
  opacity: 0.3;
}
@media screen and (max-width: 768px) {
  .dialogue-intro__inner > div > span {
    top: -3.2rem;
    bottom: auto;
    right: auto;
    left: 0;
    font-size: 5.6rem;
  }
}
.dialogue-intro h4 {
  margin-bottom: 4rem;
  color: var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .dialogue-intro h4 {
    margin-bottom: 2rem;
  }
}
.dialogue-intro h4 strong {
  font-size: 3.2rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .dialogue-intro h4 strong {
    font-size: 2.4rem;
  }
}
.dialogue-intro h4 span {
  margin-left: 2rem;
  font-size: 1.8rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .dialogue-intro h4 span {
    font-size: 1.5rem;
  }
}
.dialogue-intro p {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .dialogue-intro p {
    padding-left: 2rem;
  }
}
.dialogue-intro p::before {
  content: "";
  width: 4rem;
  height: 0;
  margin-right: 1rem;
  border-top: solid 2px currentColor;
}
.dialogue-intro dl {
  margin-top: 1.5rem;
  display: flex;
  gap: 2rem;
}
@media screen and (max-width: 768px) {
  .dialogue-intro dl {
    margin-top: 1rem;
    padding-left: 2rem;
  }
}
.dialogue-intro dl ul li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.dialogue-interview__list dt {
  margin-bottom: 3.2rem;
  display: flex;
  align-items: center;
  gap: 1.6rem;
  font-size: 1.8rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .dialogue-interview__list dt {
    margin: 0 10% 2rem 0;
    font-size: 1.5rem;
  }
}
.dialogue-interview__list dt:not(:first-of-type) {
  margin-top: 4rem;
}
.dialogue-interview__list dt::before {
  content: "";
  width: 4.8rem;
  height: 0;
  border-top: solid 2px currentColor;
}
.dialogue-interview__list dd {
  position: relative;
  border-radius: 0.8rem; /* ボックスの角丸 */
  background: var(--clr-bg); /* 中身の背景 */
  padding: 2.4rem;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .dialogue-interview__list dd {
    margin-right: 1rem;
  }
}
.dialogue-interview__list dd::before {
  content: "";
  position: absolute;
  inset: 0; /* 全面に広げる */
  border-radius: inherit;
  padding: 1px; /* 枠の太さ */
  background: var(--grad-type04);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; /* 内側をくり抜く */
  mask-composite: exclude;
  z-index: -1;
}
.dialogue-interview__list dd > span {
  position: absolute;
  top: calc(50% - 0.8rem);
  right: -1.6rem;
  width: 1.7rem;
  height: 1.6rem;
  background-color: #78B573;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
@media screen and (max-width: 768px) {
  .dialogue-interview__list dd > span {
    right: -0.9rem;
    width: 1rem;
    height: 1.2rem;
  }
}
.dialogue-interview__list dd > span::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.7rem);
  right: 0.2rem;
  width: 1.5rem;
  height: 1.4rem;
  background-color: var(--clr-bg);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
@media screen and (max-width: 768px) {
  .dialogue-interview__list dd > span::after {
    top: calc(50% - 0.5rem);
    width: 0.8rem;
    height: 1rem;
  }
}

.dialogue-img {
  position: relative;
  width: min(68rem, 78%);
  margin: 19rem auto 0;
  overflow: visible;
}
@media screen and (max-width: 768px) {
  .dialogue-img {
    margin-top: 8rem;
  }
}
.dialogue-img::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--grad-type01);
  transform: rotate(-8deg);
}
.dialogue-img div {
  position: relative;
}

/* -------------------------------------------
  学校行事
  /schoollife/school-events.html
------------------------------------------- */
.event-block:not(:first-of-type) {
  margin-top: 10rem;
}

.event-list .slick-list {
  margin: 0 -1.2rem;
}
.event-list .slick-track {
  display: flex;
  min-width: 100%;
}
.event-list__item {
  margin: 0 1.2rem;
}
.event-list__item > div {
  aspect-ratio: 315/219;
}
.event-list__item > div img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 0.8rem;
}
.event-list__item figcaption {
  margin-top: 2.4rem;
  display: grid;
  grid-template-rows: auto auto;
  gap: 1.6rem;
  font-weight: 700;
}
.event-list__item figcaption strong {
  font-size: 2.4rem;
  font-weight: 700;
}
.event-list__number {
  width: 18.8rem;
  height: 4.8rem;
  margin-top: 4.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Roboto", sans-serif;
  color: var(--clr-blue);
}
.event-list__arrows {
  position: relative;
  width: 18.7rem;
  height: 4.8rem;
  margin-top: -4.8rem;
  display: flex;
  justify-content: space-between;
}
.event-list__arrows::before {
  content: "←";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 4.8rem;
  aspect-ratio: 1/1;
  border: solid 1px #ddd;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ddd;
}
.event-list__arrows::after {
  content: "→";
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  width: 4.8rem;
  aspect-ratio: 1/1;
  border: solid 1px #ddd;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ddd;
}
.event-list__arrows .slick-arrow {
  width: 4.8rem;
  aspect-ratio: 1/1;
  border: solid 1px var(--clr-blue);
  border-radius: 50%;
  background-color: var(--clr-white);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--clr-blue);
}
@media (hover: hover) {
  .event-list__arrows .slick-arrow {
    transition: background-color 0.3s ease, color 0.3s ease;
  }
  .event-list__arrows .slick-arrow:hover {
    background-color: var(--clr-blue);
    color: var(--clr-white);
  }
}

.event-section .course-sec__text {
  display: block;
}
.event-section .section__header-md {
  width: 100%;
}

.pickup-block {
  display: flex;
  gap: 8rem;
}
@media screen and (max-width: 768px) {
  .pickup-block {
    flex-direction: column;
    gap: 3rem;
  }
}
.pickup-block:not(:last-child) {
  margin-bottom: 8rem;
}
.pickup-block__text {
  flex: 1;
}
.pickup-block__title {
  margin-bottom: 1.6rem;
  display: flex;
  align-items: center;
  line-height: 1;
}
.pickup-block__title span:first-child {
  margin-left: -1rem;
  font-family: "Roboto", sans-serif;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--clr-blue);
  transform: rotate(90deg);
}
.pickup-block__title span:nth-child(2) {
  margin-left: -0.75rem;
  font-family: "Roboto", sans-serif;
  font-size: 4rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--clr-blue);
}
@media screen and (max-width: 768px) {
  .pickup-block__title span:nth-child(2) {
    font-size: 3.2rem;
  }
}
.pickup-block__title strong {
  margin-bottom: 0.5rem;
  margin-left: 2rem;
  font-size: 3.2rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .pickup-block__title strong {
    margin-left: 1rem;
    font-size: 1.8rem;
  }
}
.pickup-block figure {
  width: min(47.7rem, 100%);
  aspect-ratio: 477/286;
}
.pickup-block figure img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.8rem;
}

/* -------------------------------------------
  教育・進学
  /education/
------------------------------------------- */
.education-policy {
  margin-top: 5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4rem;
}
@media screen and (max-width: 768px) {
  .education-policy {
    flex-direction: column;
    gap: 2rem;
  }
}
.education-policy li {
  font-family: serif;
  font-size: 3.6rem;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .education-policy li {
    font-size: 3rem;
  }
}/*# sourceMappingURL=style.css.map */