@charset "UTF-8";

/* =============================================
kv
============================================= */
.kv {
  position: relative;
  z-index: 1;
}

.kv__title {
  position: absolute;
  top: 1.5%;
  left: 0;
  width: 674px;
}
@media screen and (max-width: 750px) {
  .kv__title {
    width: calc(674 / 750 * 100vw);
  }
}

/* =============================================
membership-benefit
============================================= */
.membership-benefit {
  position: relative;
  z-index: 0;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  background-image: url(../../images2026/chugaku_koukou/bg_membership_benefit.webp);
  margin-top: calc(-135px * (750 / 390));
  padding-top: calc(110px * (750 / 390));
  padding-bottom: calc(84px * (750 / 390));
  overflow: hidden;
}
@media screen and (max-width: 750px) {
  .membership-benefit {
    margin-top: calc(-135 / 390 * 100vw);
    padding-top: calc(110 / 390 * 100vw);
    padding-bottom: calc(84 / 390 * 100vw);
  }
}

.membership-benefit > .text-note {
  text-align: right;
  padding-right: calc(16px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit > .text-note {
    padding-right: calc(16 / 390 * 100vw);
  }
}

.membership-benefit__heading1 {
  display: block;
  width: 676px;
  margin-inline: auto;
  margin-top: calc(42px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit__heading1 {
    width: calc(676 / 750 * 100vw);
    margin-top: calc(42 / 390 * 100vw);
  }
}

.membership-benefit__heading2 {
  display: block;
  width: 676px;
  margin-top: calc(62px * (750 / 390));
  margin-inline: auto;
}
@media screen and (max-width: 750px) {
  .membership-benefit__heading2 {
    width: calc(676 / 750 * 100vw);
    margin-top: calc(62 / 390 * 100vw);
  }
}

.membership-benefit__image2 {
  position: relative;
  display: block;
  width: 100%;
  margin-top: calc(14px * (750 / 390));
  margin-bottom: calc(64px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit__image1 {
    margin-top: calc(14 / 390 * 100vw);
    margin-bottom: calc(64 / 390 * 100vw);
  }
}

.membership-benefit__items {
  position: relative;
  width: 100%;
  margin-top: calc(-32px * (750 / 390));
  height: calc(926px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit__items {
    margin-top: calc(-32 / 390 * 100vw);
    height: calc(926 / 390 * 100vw);
  }
}

.membership-benefit__item {
  position: absolute;
  z-index: 1;
}

.membership-benefit__item01 {
  z-index: 2;
  top: 0;
  left: calc(-17px * (750 / 390));
  width: 542px;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item01 {
    left: calc(-17 / 390 * 100vw);
    width: calc(542 / 750 * 100vw);
  }
}

.membership-benefit__item01 .text-note {
  position: absolute;
  left: calc(32px * (750 / 390));
  bottom: 0;
  transform: translate(0, 100%);
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item01 .text-note {
    left: calc(32 / 390 * 100vw);
  }
}

.membership-benefit__item02 {
  z-index: 1;
  top: calc(56px * (750 / 390));
  right: calc(-2px * (750 / 390));
  width: 279px;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item02 {
    top: calc(56 / 390 * 100vw);
    right: calc(-2 / 390 * 100vw);
    width: calc(279 / 750 * 100vw);
  }
}

.membership-benefit__item03 {
  z-index: 1;
  top: calc(371px * (750 / 390));
  left: calc(-5px * (750 / 390));
  width: 279px;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item03 {
    top: calc(371 / 390 * 100vw);
    left: calc(-5 / 390 * 100vw);
    width: calc(279 / 750 * 100vw);
  }
}

.membership-benefit__item04 {
  z-index: 2;
  top: calc(314px * (750 / 390));
  right: calc(-13px * (750 / 390));
  width: 542px;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item04 {
    top: calc(314 / 390 * 100vw);
    right: calc(-13 / 390 * 100vw);
    width: calc(542 / 750 * 100vw);
  }
}

.membership-benefit__item04 .text-note {
  position: absolute;
  right: calc(32px * (750 / 390));
  bottom: 0;
  transform: translate(0, 100%);
}
@media screen and (max-width: 750px) {
  .membership-benefit__item04 .text-note {
    right: calc(32 / 390 * 100vw);
  }
}

.membership-benefit__item05 {
  z-index: 2;
  top: calc(600px * (750 / 390));
  left: calc(-17px * (750 / 390));
  width: 542px;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item05 {
    top: calc(600 / 390 * 100vw);
    left: calc(-17 / 390 * 100vw);
    width: calc(542 / 750 * 100vw);
  }
}

.membership-benefit__item05 .btn-detail {
  position: absolute;
  translate: 0 100%;
  bottom: calc(-17px * (750 / 390));
  left: calc(36px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit__item05 .btn-detail {
    bottom: calc(-17 / 390 * 100vw);
    left: calc(36 / 390 * 100vw);
  }
}

.membership-benefit__item06 {
  z-index: 1;
  top: calc(656px * (750 / 390));
  right: calc(-3px * (750 / 390));
  width: 279px;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item06 {
    top: calc(656 / 390 * 100vw);
    right: calc(-3 / 390 * 100vw);
    width: calc(279 / 750 * 100vw);
  }
}

.membership-benefit__item06 .text-note {
  position: absolute;
  right: calc(19px * (750 / 390));
  bottom: calc(-90px * (750 / 390));
  translate: 0 100%;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item06 .text-note {
    right: calc(19 / 390 * 100vw);
    bottom: calc(-90 / 390 * 100vw);
  }
}

/* =============================================
request-benefit
============================================= */
.request-benefit {
  background-image: url(../../images2026/chugaku_koukou/bg_request_benefit.webp);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  position: relative;
  z-index: 2;
  padding-top: calc(56px * (750 / 390));
  padding-bottom: calc(210px * (750 / 390));
  overflow: hidden;
}
@media screen and (max-width: 750px) {
  .request-benefit {
    padding-top: calc(56 / 390 * 100vw);
    padding-bottom: calc(210 / 390 * 100vw);
  }
}

.request-benefit__heading {
  display: block;
  margin-inline: auto;
  width: 660px;
}
@media screen and (max-width: 750px) {
  .request-benefit__heading {
    width: calc(660 / 750 * 100vw);
  }
}

.request-benefit__items {
  position: relative;
  height: calc(420px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__items {
    height: calc(420 / 390 * 100vw);
  }
}

.request-benefit__items .text-note {
  position: absolute;
  bottom: 0;
  left: calc(16px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__items .text-note {
    left: calc(16 / 390 * 100vw);
  }
}

.request-benefit__items .btn-detail {
  position: absolute;
  bottom: 0;
  right: calc(16px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__items .btn-detail {
    right: calc(16 / 390 * 100vw);
  }
}

.request-benefit__item {
  position: absolute;
}

.request-benefit__item01 {
  top: calc(-30px * (750 / 390));
  left: calc(-11.3px * (750 / 390));
  width: calc(410px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__item01 {
    top: calc(-30 / 390 * 100vw);
    left: calc(-11.3 / 390 * 100vw);
    width: calc(410 / 390 * 100vw);
  }
}

.request-benefit__item02 {
  top: 0;
  left: calc(-158px * (750 / 390));
  width: calc(515px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__item02 {
    left: calc(-158 / 390 * 100vw);
    width: calc(515 / 390 * 100vw);
  }
}

.request-benefit__item03 {
  top: calc(-44px * (750 / 390));
  right: calc(-151px * (750 / 390));
  width: calc(448px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__item03 {
    top: calc(-44 / 390 * 100vw);
    right: calc(-151 / 390 * 100vw);
    width: calc(448 / 390 * 100vw);
  }
}

/* =============================================
.campaign
============================================= */
.campaign {
  position: relative;
  z-index: 3;
  margin-top: calc(-190px * (750 / 390));
  padding-top: calc(143px * (750 / 390));
  padding-bottom: calc(56px * (750 / 390));
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  background-image: url(../../images2026/chugaku_koukou/bg_campaign.webp);
}
@media screen and (max-width: 750px) {
  .campaign {
    margin-top: calc(-190 / 390 * 100vw);
    padding-top: calc(143 / 390 * 100vw);
    padding-bottom: calc(56 / 390 * 100vw);
  }
}

.campaign__heading {
  display: flex;
  flex-direction: column;
  text-align: center;
  color: #0D59A4;
  font-weight: 700;
  line-height: 1.45;
}

.campaign__heading span:first-child {
  font-size: calc(16px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .campaign__heading span:first-child {
    font-size: calc(16 / 390 * 100vw);
  }
}

.campaign__heading span:last-child {
  font-size: calc(18px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .campaign__heading span:last-child {
    font-size: calc(18 / 390 * 100vw);
  }
}

.campaign__heading_sub {
  display: block;
  width: 324px;
  margin-inline: auto;
  margin-top: calc(4px * (750 / 390));
  margin-bottom: calc(16px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .campaign__heading_sub {
    width: calc(324 / 750 * 100vw);
    margin-top: calc(4 / 390 * 100vw);
    margin-bottom: calc(16 / 390 * 100vw);
  }
}
