@charset "UTF-8";

/* メインビジュアル */

/* インタビューバナー */
.interview-bnr {
  margin-top: 6.0rem;
  margin-bottom: 6.0rem;
}
@media screen and (max-width: 767px) {
  .interview-bnr {
    margin-top: 4.0rem;
    margin-bottom: 2.0rem;
  }
}

/* 過去の合格実績 */
.results {
  max-width: 104rem;
  padding-left: 2rem;
  padding-right: 2rem;
  padding-bottom: 0 !important;
  margin-left: auto;
  margin-right: auto;
  background-color: transparent !important;
  margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
  .results {
    margin-bottom: 10px;
  }
}

.results .body {
  background-color: #e5eeff;
  padding: 2rem 0 4rem;
  display: none;
}

.results h3 {
  position: relative;
  cursor: pointer;
  margin-bottom: 0 !important;
  border-radius: 4px;
  background-color: #EAF2FA;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
}
@media screen and (max-width: 767px) {
  .results h3 {
    text-align: left !important;
    justify-content: flex-start;
  }
}

.results h3.is-small {
  font-size: 1.8rem !important;
  font-weight: 400 !important;
  background-color: #EAF2FA !important;
  color: #126dc0 !important;
}
.results h3.is-small span {
  font-weight: 500 !important;
}
.results h3.is-small::before,
.results h3.is-small::after {
  background-color: #126dc0 !important;
}

.results h3.is-small.open {
  background-color: #126dc0 !important;
  color: #FFF !important;
}
.results h3.is-small.open::before,
.results h3.is-small.open::after {
  background-color: #FFF !important;
}

.results h3 span {
  padding: 1.8rem 2.0rem !important;
  padding-right: 4rem !important;
}

.results h3::before,
.results h3::after {
  content: "";
  position: absolute;
  width: 2.0rem;
  height: 0.2rem;
  border-radius: 1.0rem;
  background-color: #FFF;
  transition: all 0.3s ease-in-out;
}
@media screen and (max-width: 767px) {
  .results h3::before,
  .results h3::after {
    width: 1.0rem;
  }
}

.results h3::before {
  top: 2.6rem;
  right: 3.8rem;
  transform: rotate(45deg);
}
@media screen and (max-width: 767px) {
  .results h3::before {
    top: 2.6rem;
    right: 2.6rem;
  }
}

.results h3::after {
  top: 2.6rem;
  right: 2.5rem;
  transform: rotate(-45deg);
}
@media screen and (max-width: 767px) {
  .results h3::after {
    top: 2.6rem;
    right: 2.0rem;
  }
}

.results h3.open::before {
  transform: rotate(-45deg);
}
.results h3.open::after {
  transform: rotate(45deg);
}