/*****全体stylesheet*****/

html,
body {
  color: #383838;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-size: 10px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5;
}

img {
  vertical-align: top;
}

ul,
ol,
menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

a:hover {
  filter: brightness(1.05);
  opacity: .95;
}

#wrapper {
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
  margin: 0 auto;
  min-width: 1200px;
  max-width: 1920px;
  width: 100%;
  clear: both;
}

#content {
  margin-top: 0;
}

/* リニューアル ここから */
.main-hdr {
  height: 460px;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.slide-anime-fade-item {
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  transition: opacity 2s ease-in-out;
  width: 1920px;
  z-index: 0;
}

.slide-anime-fade-item.current {
  opacity: 1;
  pointer-events: auto;
  z-index: 1;
}

.slide-anime-fade-item.next {
  transition-delay: 5s;
  opacity: 1;
  z-index: 2;
}

.main-hdr-image img {
  width: 100%;
}

.main-hdr-ttl {
  left: 8rem;
  position: absolute;
  text-shadow: 0 0 1em #f2f7f3,
    0 -2px .5em #f2f7f3,
    2px -2px .5em #f2f7f3,
    2px 0 .5em #f2f7f3,
    2px 2px .5em #f2f7f3,
    0 2px .5em #f2f7f3,
    -2px 2px .5em #f2f7f3,
    -2px 0 .5em #f2f7f3,
    -2px -2px .5em #f2f7f3;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

.main-hdr-ttl-txt {
  color: #009380;
  display: block;
  font-size: 3.4rem;
  font-weight: 500;
  line-height: 1.1;
  width: fit-content;
}

.main-hdr-ttl-txt:not(:last-of-type) {
  margin-bottom: 1rem;
}

@media (max-width: 1500px) {
  .main-hdr {
    height: calc(460 / 1500 * 100vw);
    min-height: 368px;
  }

  .slide-anime-fade-item {
    width: 128%;
  }

  .main-hdr-ttl {
    left: clamp(6.4rem, 5.33vw, 8rem);
  }

  .main-hdr-ttl-txt {
    font-size: clamp(2.72rem, 2.26vw, 3.4rem);
  }
}

.section-ttl {
  align-items: center;
  background-color: #009380;
  color: #fff;
  display: flex;
  font-size: 3.5rem;
  font-weight: 500;
  height: 9rem;
  justify-content: center;
  text-align: center;
}

.category {
  padding: 42px 0 50px;
}

.category-list {
  display: flex;
  justify-content: space-between;
  list-style: none;
  margin: 0 auto;
  width: 900px;
}

.category-list-item {
  width: 280px;
}

.category-list-item-a {
  align-items: center;
  background: linear-gradient(180deg, #69c7b7, #009380);
  border-radius: 1rem;
  color: #fff;
  display: flex;
  font-size: 3.5rem;
  justify-content: center;
  height: 80px;
  text-align: center;
  text-decoration: none;
}

.schools-ctr {
  background-color: #e2edf8;
  padding: 4rem 0 10rem
}

.schools-ttl {
  align-items: center;
  display: flex;
  font-size: 3.5rem;
  font-weight: 900;
  justify-content: center;
  letter-spacing: .05em;
  margin: 0 auto;
  text-align: center;
  width: fit-content;
}

.schools-ttl::before {
  background: url(../img/icon_loupe_pc.svg) no-repeat center / contain;
  content: "";
  display: block;
  height: 4.5rem;
  margin-right: .2em;
  width: 4.5rem;
}

.schools-list {
  display: grid;
  grid-template-columns: repeat(2, 374px);
  justify-content: space-between;
  margin: 5rem auto 0;
  width: 798px;
}

.schools-list-item {
  width: 100%;
}

.schools-list-item-a {
  align-items: center;
  background-color: #263b94;
  border-radius: 1rem;
  display: flex;
  color: #fff;
  font-size: 3rem;
  font-weight: 500;
  height: 6rem;
  justify-content: center;
  text-align: center;
  text-decoration: none;
  width: 100%;
}

/* 東進 注目イベント */
.featured.section-ctr {
  margin-top: 2rem;
}

.featured-splide-item-img {
  width: 632px;
}

.featured-splide-pagination {
  margin-top: 1rem;
  position: static;
}

.featured-splide-page {
  background-color: #d7d7d7;
  border-radius: 0;
  height: 1rem;
  margin: .5rem .5rem 1rem;
  width: 1rem;
}

.featured-splide-page.is-active {
  background-color: #626262;
  transform: scale(1);
}

/* おすすめコンテンツ */
.recommended-list {
  display: grid;
  grid-column-gap: 1rem;
  grid-template-columns: repeat(4, 280px);
  margin: 5.7rem auto 8rem;
  width: 1200px;
}

.recommended-list-item-a {
  display: block;
}

.recommended-list-item-a img {
  width: 100%;
}

/* 合格実績 */
.admission-results .section-ttl {
  background-color: #f58ea4;
  letter-spacing: .1em;
}

.admission-results-content {
  background:
    linear-gradient(90deg, #fde8ed, #fde8ed 6%, transparent 11%, transparent 89%, #fde8ed 97%, #fde8ed) no-repeat center top / 1920px 100%,
    linear-gradient(transparent 65%, #fde8ed 75%, #fde8ed) no-repeat center bottom / 100% 100%,
    url(../img/bg_admission-results_pc.png) no-repeat center top / auto, #fde8ed;
  padding: 10rem 0 12.5rem;
}

.admission-results-list {
  display: grid;
  grid-column-gap: .5rem;
  grid-row-gap: 1.2rem;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 auto;
  width: 1000px;
}

.admission-results-list-item {
  width: 300px;
}

.admission-results-list-item-a {
  align-content: center;
  border-radius: 1rem;
  color: #fff;
  display: flex;
  flex-wrap: wrap;
  height: 14rem;
  justify-content: center;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
}

.chuugaku .admission-results-list-item-a {
  background-color: rgba(57, 187, 103, .9);
}

.koukou .admission-results-list-item-a {
  background-color: rgba(0, 147, 128, .9);
}

.daigaku .admission-results-list-item-a {
  background-color: rgba(38, 59, 148, .9);
}

.admission-results-list-item-a-sub {
  display: block;
  font-size: 3rem;
  font-weight: 500;
  width: 100%;
}

.admission-results-list-item-a-main {
  display: block;
  font-size: 4rem;
  font-weight: 500;
  width: 100%;
}

.admission-voices-bnr {
  align-content: center;
  align-items: center;
  background: rgba(245, 142, 164, .9) url(../img/bnr_admission-voices_bg_pc.png) no-repeat center right / contain;
  border-radius: 1rem;
  box-sizing: border-box;
  color: #fff;
  display: flex;
  flex-wrap: wrap;
  height: 15rem;
  line-height: 1.3;
  margin: 6rem auto 0;
  padding-left: 7rem;
  text-decoration: none;
  width: 100rem;
}

.admission-voices-bnr-sub {
  display: block;
  font-size: 2.2rem;
  font-weight: 500;
  letter-spacing: -.02em;
  width: 100%;
}

.admission-voices-bnr-main {
  display: block;
  font-size: 5rem;
  font-weight: 500;
  letter-spacing: .1em;
  width: 100%;
}

.admission-results-bnr {
  display: block;
  margin: 7.7rem auto 0;
  width: 960px;
}

.admission-results-bnr img {
  width: 100%;
}

.admission-results-bnr-annotation {
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.6;
  margin: 3rem auto 0;
  padding: 0;
  text-align: center;
}

/* 東進四国 SNS */
.sns.section-ctr {
  padding-bottom: 7.3rem;
}

.sns-list {
  align-items: center;
  display: grid;
  grid-template-columns: repeat(3, 290px);
  justify-content: space-between;
  margin: 7rem auto 0;
  width: 1000px;
}

.sns-list-item-a {
  display: block;
}

.sns-list-item-a img {
  width: 100%;
}

/* ↓　合格実績ページ用　↓ */
.jisseki-hdr {
  border-bottom: 2rem solid #162776;
  overflow-x: hidden;
  position: relative;
}

.jisseki-hdr-ttl {
  left: 50%;
  position: relative;
  transform: translateX(-50%);
  width: 1920px;
}

.jisseki-hdr-ttl img {
  width: 100%;
}

.jisseki-ctr {
  text-align: center;
}

.jisseki-jhs-hs-bg {
  background-color: #fce7f0;
}

.jisseki-inquiry {
  display: block;
  margin: 8vw auto 0;
  width: 94vw;
}

.jisseki-bnr {
  margin: 8vw auto 0;
  width: 94vw;
}

/* ↓　合格体験記ページ用　↓ */
#content.taikenki {
  padding-bottom: 13.5rem;
}

.taikenki-hdr {
  align-items: center;
  background: url(../img/mv_taikenki_pc.png) no-repeat center / cover;
  border-bottom: 1rem solid #f4afba;
  box-sizing: border-box;
  display: flex;
  height: 250px;
  justify-content: center;
  min-height: 177.5px;
  width: 100%;
}

.taikenki-hdr-ttl {
  color: #ec798c;
  font-size: 5.6rem;
  font-weight: 700;
  letter-spacing: .05em;
}

@media(max-width:1600px) {
  .taikenki-hdr {
    background: url(../img/mv_taikenki_pc.png) no-repeat center / auto 100%;
    height: 15.625vw;
  }

  .taikenki-hdr-ttl {
    font-size: clamp(4.2rem, 3.5vw, 5.6rem);
  }
}

.taikenki-ctr {
  margin: 0 auto;
  width: 1100px;
}

.taikenki-cat-list {
  display: grid;
  grid-template-columns: repeat(2, 360px);
  justify-content: space-between;
  margin: 4.5rem auto 0 0;
  width: 730px;
}

.taikenki-cat-list-item {
  align-items: center;
  background-color: #feeef2;
  color: #ec798c;
  cursor: pointer;
  display: flex;
  font-size: 2.4rem;
  font-weight: 700;
  justify-content: center;
  min-height: 6rem;
  width: 100%;
}

.taikenki-cat-list-item.active {
  background-color: #ec798c;
  color: #fff;
  cursor: auto;
}

.taikenki-content-wrapper {
  background-color: #ffe4ea;
  border-top: .8rem solid #ec798c;
  padding: 3rem 0 7rem;
}

.taikenki-content {
  display: none;
}

.taikenki-content.active {
  column-gap: 6rem;
  display: grid;
  grid-template-columns: repeat(2, 480px);
  justify-content: center;
  row-gap: 3rem;
}

.taikenki-item {
  background-color: #fff;
  margin: 0 auto;
  width: 100%;
}

.taikenki-content[data-content="2"] .taikenki-item {
  background: url(../img/bg_taikenki_article-2-top_pc.png) no-repeat left top / auto,
    url(../img/bg_taikenki_article-2-bottom_pc.png) no-repeat left bottom / auto,
    #fff;
  padding: 65px 0 80px;
}

.taikenki-content[data-content="1"] .taikenki-item-hdr-top {
  align-content: center;
  align-items: center;
  background: url(../img/bg_taikenki_article-1-top_pc.png) no-repeat left top / auto,
    url(../img/bg_taikenki_article-1-bottom_pc.png) no-repeat left bottom / auto;
  column-gap: 2rem;
  display: grid;
  grid-template-columns: 1fr 160px;
  grid-template-rows: auto auto;
  height: 250px;
  padding: 0 1.5rem 0 .5rem;
}

.taikenki-content[data-content="2"] .taikenki-item-hdr-top {
  align-content: center;
  align-items: center;
  background: url(../img/icon_goukaku_pc.svg) no-repeat left center / 80px;
  border-bottom: 2px solid #ec798c;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  height: 9.5rem;
  margin: 0 auto;
  padding: 0 1rem 0 9rem;
  width: 450px;
}

.taikenki-item-hdr-schools {
  align-content: center;
  align-items: center;
  background: url(../img/icon_goukaku_pc.svg) no-repeat left center / 80px;
  display: flex;
  flex-wrap: wrap;
  min-height: 80px;
  padding-left: 80px;
}

.taikenki-content[data-content="1"] .taikenki-item-hdr-schools {
  grid-area: 1 / 1 / 2 / 2;
  margin-top: 4rem;
}

.taikenki-content[data-content="2"] .taikenki-item-hdr-schools {
  background-image: none;
  min-height: auto;
  padding-left: 0;
  width: 100%;
}

.taikenki-item-hdr-schools-item {
  color: #ec798c;
  font-weight: 700;
  line-height: 1.2;
}

.taikenki-content[data-content="1"] .taikenki-item-hdr-schools-item {
  font-size: 1.72rem;
  letter-spacing: -.03em;
  margin-left: .5rem;
  width: 100%;
}

.taikenki-content[data-content="2"] .taikenki-item-hdr-schools-item {
  font-size: 3rem;
  line-height: 1;
}

.taikenki-content[data-content="1"] .taikenki-photo {
  grid-area: 1 / 2 / 3 / 3;
  width: 100%;
}

.taikenki-content[data-content="1"] .taikenki-photo img {
  width: 100%;
}


.taikenki-content[data-content="1"] .taikenki-item-hdr-bottom {}

.taikenki-item-hdr-ttl {
  color: #5a5a5a;
  line-height: 1.4;
  text-align: center;
}

.taikenki-content[data-content="1"] .taikenki-item-hdr-ttl {
  align-self: start;
  grid-area: 2 / 1 / 3 / 2;
  margin-bottom: 1rem;
  text-align: right;
}

.taikenki-content[data-content="2"] .taikenki-item-hdr-ttl {
  align-items: baseline;
  display: flex;
  justify-content: space-between;
  letter-spacing: -.05em;
  line-height: 1.2;
  padding: 0;
  width: 100%;
}

.taikenki-content[data-content="2"] .active .taikenki-item-hdr-ttl::after {
  transform: rotate(180deg);
}

.taikenki-content[data-content="1"] .taikenki-item-hdr-ttl-school {
  font-size: 1.6rem;
  font-weight: 500;
  margin-right: .8em;
}

.taikenki-content[data-content="2"] .taikenki-item-hdr-ttl-school {
  font-size: 1.6rem;
  font-weight: 500;
}

.taikenki-content[data-content="1"] .taikenki-item-hdr-ttl-name {
  font-size: 2rem;
  font-weight: 500;
}

.taikenki-content[data-content="2"] .taikenki-item-hdr-ttl-name {
  font-size: 2.5rem;
  font-weight: 500;
  margin: 0 0 0 auto;
}

.taikenki-content[data-content="1"] .taikenki-item-hdr-ttl-name span {
  font-size: 1.5rem;
  font-weight: 500;
}

.taikenki-content[data-content="2"] .taikenki-item-hdr-ttl-name span {
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: -.2em;
}

.taikenki-content[data-content="1"] .taikenki-item-hdr-readmore {
  background-color: #ec798c;
  color: #fff;
  cursor: pointer;
  font-size: 1.8rem;
  font-weight: 500;
  margin: 0;
  text-align: center;
}

.taikenki-content[data-content="1"] .taikenki-item-wrapper {
  background-color: rgba(236, 121, 140, .7);
  backdrop-filter: blur(1rem);
  -webkit-backdrop-filter: blur(1rem);
  display: none;
  position: fixed;
  height: 100vh;
  height: 100dvh;
  left: 0;
  top: 0;
  width: 100vw;
  z-index: 1000;
}

.taikenki-content[data-content="2"] .taikenki-item-wrapper {}

.taikenki-content[data-content="1"] .taikenki-item-content-wrapper {
  height: 85%;
  left: 50%;
  max-width: 1000px;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 95%;
}

@media (max-height: 650px) {
  .taikenki-content[data-content="1"] .taikenki-item-content-wrapper {
    top: 5rem;
    transform: translate(-50%, 0);
  }
}

.taikenki-content[data-content="1"] .taikenki-item-content {
  background-color: #fff;
  box-sizing: border-box;
  overflow-y: scroll;
  height: 100%;
  padding: 3rem 0;
}

.mdl-close {
  background-color: transparent;
  border: none;
  height: 5rem;
  padding: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: translateY(-100%);
  width: 5rem;
}

.mdl-close::before,
.mdl-close::after {
  border-top: .3rem solid #fff;
  content: "";
  display: block;
  position: absolute;
  width: 100%;
}

.mdl-close::before {
  transform: rotate(-45deg);
}

.mdl-close::after {
  transform: rotate(45deg);
}

.taikenki-content[data-content="1"] .taikenki-item-content-ctr:not(:first-of-type) {
  margin-top: 2.5rem;
}

.taikenki-content[data-content="2"] .taikenki-item-content-ctr {
  padding: .3rem 0 0;
}

.taikenki-content[data-content="1"] .taikenki-item-ttl {
  background-color: #ec798c;
  box-sizing: border-box;
  border-radius: 3rem;
  color: #fff;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.5;
  margin-left: 6.5%;
  padding: 0 3.5rem;
  width: fit-content;
}

.taikenki-content[data-content="1"] .taikenki-item-txt {
  font-size: 1.8rem;
  line-height: 1.66;
  margin: 2.5rem auto 0;
  padding: 0;
  width: 83%;
}

.taikenki-content[data-content="2"] .taikenki-item-txt {
  font-size: 1.6rem;
  letter-spacing: -.02em;
  line-height: 1.375;
  margin: 0 auto;
  padding: 0;
  width: 445px;
}