@charset "UTF-8";
/* =============================================
common
============================================= */
/* ctaボタン */
.btn-cta {
  width: calc(300px * (750 / 390));
  font-size: calc(15px * (750 / 390));
  letter-spacing: 0.08em;
  padding-block: calc(20px * (750 / 390));
  padding-right: 1em;
  background-size: calc(7px * (750 / 390)) auto;
}
@media screen and (max-width: 750px) {
  .btn-cta {
    width: calc(300 / 390 * 100vw);
    font-size: calc(15 / 390 * 100vw);
    padding-block: calc(20 / 390 * 100vw);
    background-size: calc(7 / 390 * 100vw) auto;
  }
}
.text-note {
  font-size: calc(11px * (750 / 390));
  color: #aeacac;
  letter-spacing: -0.04em;
  line-height: 1.2;
}
@media screen and (max-width: 750px) {
  .text-note {
    font-size: calc(11 / 390 * 100vw);
  }
}
/* =============================================
kv
============================================= */
.kv {
  position: relative;
}

.kv__title {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 750px;
  left: 50%;
  transform: translateX(-50%);
  top: 1.3%;
}
@media screen and (max-width: 750px) {
  .kv__title {
    width: calc(375 / 390 * 100vw);
  }
}
.kv__copy {
  display: block;
  text-align: right;
  font-size: calc(10px * (750 / 390));
  color: #fff;
  letter-spacing: -0.04em;
  line-height: 1.2;
  position: absolute;
  bottom: calc(6.5px * (750 / 390));
  right: calc(16px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .kv__copy {
    font-size: calc(10 / 390 * 100vw);
    bottom: calc(6.5 / 390 * 100vw);
    right: calc(16 / 390 * 100vw);
  }
}
/* =============================================
intro
============================================= */
.intro {
  position: relative;
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center top;
  background-image: url(../../images2026/shogaku/bg_intro.webp?20260617);
  padding-top: calc(60px * (750 / 390));
  padding-bottom: calc(90px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .intro {
    padding-top: calc(60 / 390 * 100vw);
    padding-bottom: calc(90 / 390 * 100vw);
  }
}

.intro__heading {
  display: block;
  position: relative;
  width: calc(330px * (750 / 390));
  margin-top: calc(95px * (750 / 390));
  margin-inline: auto;
}
@media screen and (max-width: 750px) {
  .intro__heading {
    width: calc(330 / 390 * 100vw);
    margin-top: calc(95 / 390 * 100vw);
  }
}

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

.intro__text {
  text-align: center;
  margin-top: calc(-13px * (750 / 390));
  font-weight: 700;
  font-size: calc(16px * (750 / 390));
  line-height: 180%;
  color: #012880;
}
@media screen and (max-width: 750px) {
  .intro__text {
    margin-top: calc(-13 / 390 * 100vw);
    font-size: calc(16 / 390 * 100vw);
  }
}

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

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

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

.membership-benefit__heading_sub1 {
  display: block;
  width: 245px;
  margin-left: auto;
  margin-right: calc(11px * (750 / 390));
  margin-top: calc(-6px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit__heading_sub1 {
    width: calc(245 / 750 * 100vw);
    margin-right: calc(11 / 390 * 100vw);
    margin-top: calc(-6 / 390 * 100vw);
  }
}

.membership-benefit__image {
  display: block;
  margin-left: auto;
  width: 664px;
}
@media screen and (max-width: 750px) {
  .membership-benefit__image {
    width: calc(664 / 750 * 100vw);
  }
}

.membership-benefit__items {
  position: relative;
  margin-bottom: calc(35px * (750 / 390));
  margin-top: calc(-50px * (750 / 390));
  padding-bottom: calc(60px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit__items {
    margin-bottom: calc(35 / 390 * 100vw);
    margin-top: calc(-50 / 390 * 100vw);
    padding-bottom: calc(60 / 390 * 100vw);
  }
}

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

.membership-benefit__item img {
  position: relative;
  display: inline-block;
  transition: transform 1s cubic-bezier(0.7, 0, 0.3, 1);
}

.membership-benefit__item01 img {
  right: calc(-46px * (750 / 390));
  transform: translate(50%, 0%) rotate(7.27deg);
}
@media screen and (max-width: 750px) {
  .membership-benefit__item01 img {
    right: calc(-46 / 390 * 100vw);
  }
}

.is-visible .membership-benefit__item01 img {
  transform: translate(0, 0) rotate(0);
}

.membership-benefit__item01 .text-note {
  padding-left: calc(17px * (750 / 390));
  margin-top: calc(-31px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit__item01 .text-note {
    padding-left: calc(17 / 390 * 100vw);
    margin-top: calc(-31 / 390 * 100vw);
  }
}

.membership-benefit__item02 {
  text-align: right;
  margin-top: calc(23px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .membership-benefit__item02 {
    margin-top: calc(23 / 390 * 100vw);
  }
}

.membership-benefit__item02 img {
  right: calc(41px * (750 / 390));
  transform: translate(-50%, 0%) rotate(-7.27deg);
  width: 671px;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item02 img {
    right: calc(41 / 390 * 100vw);
    width: calc(671 / 750 * 100vw);
  }
}

.is-visible .membership-benefit__item02 img {
  transform: translate(0, 0) rotate(0);
}

.membership-benefit__item02 .text-note {
  padding-right: calc(19px * (750 / 390));
  margin-top: calc(-36px * (750 / 390));
  text-align: right;
}
@media screen and (max-width: 750px) {
  .membership-benefit__item02 .text-note {
    padding-right: calc(19 / 390 * 100vw);
    margin-top: calc(-36 / 390 * 100vw);
  }
}

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

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

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

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

.request-benefit__item img {
  position: relative;
  display: inline-block;
  transition: transform 1s cubic-bezier(0.7, 0, 0.3, 1);
}

.request-benefit__image1 {
  display: block;
  width: calc(365px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__image1 {
    width: calc(365 / 390 * 100vw);
  }
}

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

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

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

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

.request-benefit__item01 {
  z-index: 2;
  width: 494px;
  top: calc(19px * (750 / 390));
  left: calc(17px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__item01 {
    width: calc(494 / 750 * 100vw);
    top: calc(19 / 390 * 100vw);
    left: calc(17 / 390 * 100vw);
  }
}
.request-benefit__items .request-benefit__item01 .text-note {
  position: absolute;
  bottom: calc(-3px * (750 / 390));
  left: 0;
  transform: translate(0, 100%);
}
@media screen and (max-width: 750px) {
  .request-benefit__items .request-benefit__item01 .text-note {
    bottom: calc(-3 / 390 * 100vw);
  }
}

.request-benefit__item02 {
  width: 231px;
  top: 0;
  right: calc(17px * (750 / 390));
  top: calc(34px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__item02 {
    width: calc(231 / 750 * 100vw);
    top: 0;
    right: calc(17 / 390 * 100vw);
    top: calc(34 / 390 * 100vw);
  }
}

.request-benefit__item02 .text-note {
  position: absolute;
  right: calc(18px * (750 / 390));
  bottom: 0;
  display: flex;
  flex-direction: column;
  gap: calc(4px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__item02 .text-note {
    right: calc(18 / 390 * 100vw);
    gap: calc(4 / 390 * 100vw);
  }
}

.request-benefit__item03 {
  z-index: 2;
  width: 233px;
  top: calc(379px * (750 / 390));
  left: calc(20px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__item03 {
    width: calc(233 / 750 * 100vw);
    top: calc(379 / 390 * 100vw);
    left: calc(20 / 390 * 100vw);
  }
}

.request-benefit__item04 {
  z-index: 2;
  width: 491px;
  top: calc(351px * (750 / 390));
  right: calc(10px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit__item04 {
    width: calc(491 / 750 * 100vw);
    top: calc(351 / 390 * 100vw);
    right: calc(10 / 390 * 100vw);
  }
}

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

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

/* =============================================
.campaign
============================================= */
.campaign {
  position: relative;
  z-index: 3;
  background-image: url(../../images2026/shogaku/bg_campaign.webp);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  margin-top: calc(-34px * (750 / 390));
  padding-top: calc(71px * (750 / 390));
  padding-bottom: calc(69px * (750 / 390));
  padding-inline: calc(9px * (750 / 390));
  border: calc(7px * (750 / 390)) solid #de1d2f;
}
@media screen and (max-width: 750px) {
  .campaign {
    margin-top: calc(-34 / 390 * 100vw);
    padding-top: calc(71 / 390 * 100vw);
    padding-bottom: calc(69 / 390 * 100vw);
    padding-inline: calc(9 / 390 * 100vw);
    border: calc(7 / 390 * 100vw) solid #de1d2f;
  }
}

.campaign__label {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 638px;
  z-index: 1;
}
@media screen and (max-width: 750px) {
  .campaign__label {
    width: calc(638 / 750 * 100vw);
  }
}

.campaign__heading1 {
  display: flex;
  flex-direction: column;
  text-align: center;
  color: #012880;
  font-weight: 900;
  line-height: 1.15;
}

.campaign__heading1 span:first-child {
  font-size: calc(22px * (750 / 390));
  letter-spacing: 0.18em;
}
@media screen and (max-width: 750px) {
  .campaign__heading1 span:first-child {
    font-size: calc(22 / 390 * 100vw);
  }
}

.campaign__heading1 span:last-child {
  font-size: calc(42px * (750 / 390));
  letter-spacing: 0.03em;
}
@media screen and (max-width: 750px) {
  .campaign__heading1 span:last-child {
    font-size: calc(42 / 390 * 100vw);
  }
}

.campaign__heading2 {
  display: block;
  width: 486px;
  margin-inline: auto;
  margin-top: calc(25px * (750 / 390));
  margin-bottom: calc(28px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .campaign__heading2 {
    width: calc(486 / 750 * 100vw);
    margin-top: calc(25 / 390 * 100vw);
    margin-bottom: calc(28 / 390 * 100vw);
  }
}

.campaign__items {
  position: relative;
  background-color: #fff7d9;
  border-radius: calc(10px * (750 / 390));
  padding-block: calc(16px * (750 / 390));
  padding-inline: calc(9px * (750 / 390));
  margin-bottom: calc(42px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .campaign__items {
    border-radius: calc(10 / 390 * 100vw);
    padding-block: calc(16 / 390 * 100vw);
    padding-inline: calc(9 / 390 * 100vw);
    margin-bottom: calc(42 / 390 * 100vw);
  }
}

.campaign__items .text-note {
  margin-top: calc(4px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .campaign__items .text-note {
    margin-top: calc(4 / 390 * 100vw);
  }
}

.campaign__item {
  width: 626px;
  margin-inline: auto;
}
@media screen and (max-width: 750px) {
  .campaign__item {
    width: calc(626 / 750 * 100vw);
  }
}

.campaign__item .item-label {
  margin-bottom: calc(8px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .campaign__item .item-label {
    margin-bottom: calc(8 / 390 * 100vw);
  }
}

.campaign__item02 {
  margin-top: calc(30px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .campaign__item02 {
    margin-top: calc(30 / 390 * 100vw);
  }
}

/* =============================================
.moodal2026
============================================= */
.modal2026__close {
  background: none;
  border: none;
}
.modal2026__content__more {
  font-family: "Zen Maru Gothic", sans-serif;
}
.modal2026__heading {
  display: block;
  margin-inline: auto;
  width: 567px;
  margin-top: calc(14px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .modal2026__heading {
    width: calc(567 / 750 * 100vw);
    margin-top: calc(14 / 390 * 100vw);
  }
}
.modal2026__slider__item .text-note {
  bottom: calc(18px * (750 / 390));
}

@media screen and (max-width: 750px) {
  .modal2026__slider__item .text-note {
    bottom: calc(18 / 390 * 100vw);
  }
}
.modal2026__box {
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  border-radius: calc(10px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .modal2026__box {
    border-radius: calc(10 / 390 * 100vw);
  }
}
.membership-benefit-modal-01 .modal2026__box {
  background-image: url(../../images2026/shogaku/bg_modal_type1.webp);
}

.membership-benefit-modal-01 .modal2026__slider {
  height: calc(253px * (750 / 390));
  min-height: calc(253px * (750 / 390));
  background-image: none;
}
@media screen and (max-width: 750px) {
  .membership-benefit-modal-01 .modal2026__slider {
    height: calc(253 / 390 * 100vw);
    min-height: calc(253 / 390 * 100vw);
  }
}

.request-benefit-modal-01 .modal2026__box {
  background-image: url(../../images2026/shogaku/bg_modal_type2.webp);
}

.request-benefit-modal-01 .modal2026__slider {
  height: calc(290px * (750 / 390));
  min-height: calc(290px * (750 / 390));
  background-size: 81%;
  background-position: top 23% right 49%;
  background-image: url(../../images2026/shogaku/bg_modal_type3.webp);
  padding-top: calc(10px * (750 / 390));
}
@media screen and (max-width: 750px) {
  .request-benefit-modal-01 .modal2026__slider {
    height: calc(290 / 390 * 100vw);
    min-height: calc(290 / 390 * 100vw);
    padding-top: calc(10px * (750 / 390));
  }
}