@charset "UTF-8";
:root {
  --color-main: #876FAC;
  --color-sub: #6C40AF;
  --color-grad-main-start: #876FAC;
  --color-grad-main-mid: #D78794;
  --color-grad-main-end: #F0D4BB;
  --color-grad-sub-start: #EDEAF4;
  --color-grad-sub-end: #EDEAF4;
  --grad-main: linear-gradient(
    115deg,
    var(--color-grad-main-start),
    var(--color-grad-main-mid) 60%,
    var(--color-grad-main-end)
  );
  --grad-sub: linear-gradient(
    90deg,
    var(--color-grad-sub-start),
    var(--color-grad-sub-end)
  );
}

/* メイン画像 */
.mainimg .catch {
  margin-top: -7.4em;
}
.mainimg .catch span {
  background-color: #9359EB;
}

/* 目指せる職業のリスト画像 */
.career_options dd {
  background-image: url(../img/department/sound/arrow.svg);
}

/* ◯◯科はこんな学科 */
.about_department h3 {
  color: #9359EB;
}
.about_department li + li {
  margin-top: 1.3em;
}
.about_department figure {
  margin-block: 1em 1.3em;
}

/* Pick Up */
.pick_up {
  background: linear-gradient(90deg, rgba(135, 111, 172, 0.37), rgba(215, 135, 148, 0.37) 60%, rgba(240, 212, 187, 0.37));
}
.pick_up .images {
  display: grid;
  gap: 1.2820512821vw;
  /* img:nth-child(3) {
    grid-column: 1 / -1;
  } */
}
@media (width >= 768px) {
  .pick_up .images {
    gap: 1em;
  }
}
@media (width >= 768px) {
  .pick_up .images.col {
    grid-template-columns: repeat(3, 1fr);
  }
}
.pick_up .text {
  display: grid;
  justify-items: center;
  gap: 0.4em;
}
.pick_up .text span {
  padding-inline: 0.4em;
  background-color: #fff;
  font-weight: bold;
  font-size: 114%;
}
.pick_up .button {
  margin-top: 1.5em;
}
@media (width >= 768px) {
  .pick_up .button {
    max-width: 500px;
    margin-inline: auto;
  }
}
@media (width >= 768px) {
  .pick_up .pickup3 {
    grid-column: 1/-1;
  }
}

/* ◯◯科授業について */
.about_class {
  background: linear-gradient(85deg, #E6D5FF, #FFBCC7 60%, #FCD3AE);
  padding-bottom: 12.8205128205vw;
}
@media (width >= 768px) {
  .about_class {
    padding-bottom: 50px;
  }
}
.about_class .qualifications h4 {
  background: linear-gradient(var(--color-grad-main-start), var(--color-grad-main-mid) 60%, var(--color-grad-main-end));
}

/* 講師紹介 */
.instructor_introduction {
  background-color: #E1DCE8;
  padding-bottom: 12.8205128205vw;
}
@media (width >= 768px) {
  .instructor_introduction {
    padding-bottom: 50px;
  }
}
.instructor_introduction h3 {
  margin-bottom: -6.4102564103vw;
}
@media (width >= 768px) {
  .instructor_introduction h3 {
    margin-bottom: 0;
  }
}
@media (width >= 768px) {
  .instructor_introduction .vender-wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
  }
}
.instructor_introduction .vendor {
  margin-top: 14.1025641026vw;
  padding-inline: 3.8461538462vw;
}
@media (width >= 768px) {
  .instructor_introduction .vendor {
    margin-top: 40px;
    padding-inline: 0;
  }
}
.instructor_introduction .logo {
  margin: 6.4102564103vw 3.8461538462vw 3.8461538462vw;
  display: flex;
  align-items: center;
}
@media (width >= 768px) {
  .instructor_introduction .logo {
    margin: 25px 15px 15px;
    height: 9%;
  }
}
.instructor_introduction .logo img {
  mix-blend-mode: multiply;
}
.instructor_introduction p {
  line-height: 1.75;
}

/* 担任の先生からのメッセージ */
.teacher_message {
  background: none;
}
@media (width < 767px) {
  .teacher_message .teachers {
    padding-inline: 5.1282051282vw;
  }
}
@media (width >= 768px) {
  .teacher_message .teachers > * {
    max-width: 300px;
  }
}

/* Campus Life */
.campus_life {
  background: linear-gradient(90deg, #E6D5FF, #FFBCC7 60%, #FCD3AE);
}
.campus_life .one_day .btn-tap {
  background: linear-gradient(var(--color-grad-main-start), var(--color-grad-main-mid) 60%, var(--color-grad-main-end));
}
.campus_life .tap1 {
  top: 29.2307692308vw;
  right: 10.5128205128vw;
}
@media (width >= 768px) {
  .campus_life .tap1 {
    top: 115px;
    right: 41px;
  }
}
.campus_life .tap2 {
  top: 56.4102564103vw;
  right: 2.0512820513vw;
}
@media (width >= 768px) {
  .campus_life .tap2 {
    top: 225px;
    right: 8px;
  }
}
.campus_life .tap3 {
  top: 71.7948717949vw;
  right: 10.7692307692vw;
}
@media (width >= 768px) {
  .campus_life .tap3 {
    top: 286px;
    right: 42px;
  }
}
.campus_life .personal {
  padding-left: 34.6153846154vw;
  background-size: 32.5641025641vw;
  background-image: url(../img/department/sound/ttl-personal.svg);
}
@media (width >= 768px) {
  .campus_life .personal {
    padding-left: 135px;
    background-size: 127px;
  }
}
.campus_life .personal em {
  font-style: normal;
  color: var(--color-main);
}
.campus_life .faq dt {
  background-image: url(../img/department/sound/ico-q.svg);
}
.campus_life .faq dd {
  background-image: url(../img/department/sound/ico-a.svg);
}