main.interview {
  font-family: "Noto Sans JP", sans-serif;
  background-color: #f1f3f7;
}

.page-header {
  padding-top: 1.2rem;
  background-color: #f1f3f7;
}

@media screen and (max-width: 768px) {
  .page-header {
    padding-top: 3.2rem;
  }
}

.page-header .breadcrumb {
  line-height: 1;
}

.page-header .breadcrumb .breadcrumb-list .breadcrumb-item>a:not(.current) {
  letter-spacing: 0;
}

section.interview-list {
  padding-top: 7.7rem;
  padding-bottom: 12.8rem;
}

@media screen and (max-width: 768px) {
  section.interview-list {
    padding-top: 3.2rem;
    padding-bottom: 14.4rem;
  }
}

section.interview-list .wrapper>ul {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8rem;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul {
    grid-template-columns: 100%;
    gap: 10rem;
  }
}

section.interview-list .wrapper>ul>li {
  display: flex;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li {
    flex-direction: column;
    position: relative;
  }
}

section.interview-list .wrapper>ul>li .text {
  width: 79rem;
  max-width: 100%;
  background-color: #fff;
  display: grid;
  grid-template-columns: 1fr;
  border-radius: 0.5rem;
  gap: 2.4rem;
  padding: 7.2rem 33rem 7.2rem 5.6rem;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .text {
    width: 100%;
    padding: 2.4rem 1.2rem 22.9rem 1.6rem;
  }
}

/* section.interview-list .wrapper>ul>li .text>h2 {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.08em;
  padding: 0.65rem 2.4rem;
  border-radius: 10rem;
  border: 0.1rem solid #2f4387;
  color: #2f4387;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .text>h2 {
    width: 100%;
    padding: 0.5rem 0;
    margin-bottom: 0;
  }
}

section.interview-list .wrapper>ul>li .text>h2::before {
  display: none;
}

section.interview-list .wrapper>ul>li .text>h2::after {
  display: none;
} */

section.interview-list .wrapper>ul>li .text>p {
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: 0.08em;
  color: #1d1d1d;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .text>p {
    font-size: 2.4rem;
    line-height: 1.6;
  }
}

section.interview-list .wrapper>ul>li .text>h2 {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.08em;
}

section.interview-list .wrapper>ul>li .text>h2::before {
  content: attr(data-en);
  display: block;
  font-family: "Cormorant Garamond", serif;
  font-weight: 600;
  font-size: 2rem;
  line-height: 1;
  letter-spacing: 0;
  color: #2f4387;
  margin-bottom: 0.8rem;
}

section.interview-list .wrapper>ul>li .text>h2>span {
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.08em;
  margin-left: 1.6rem;
}

section.interview-list .wrapper>ul>li .text .link-button {
  max-width: 32.3rem;
  gap: 2.2rem;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .text .link-button {
    width: 30.3rem;
    padding: 1.05rem 1.8rem 1.05rem 2.6rem;
    white-space: nowrap;
    gap: 1.6rem;
  }
}

section.interview-list .wrapper>ul>li .image {
  position: absolute;
  width: 68.4rem;
  border-radius: 0.5rem;
  overflow: visible;
  transform: translate(calc(0% + 54.4rem), calc(0% + 3rem));
  display: grid;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .image {
    width: 30.3rem;
    height: 23rem;
    transform: translate(-50%, -50%);
    left: 50%;
    top: calc(100% - 5.1rem);
  }
}

section.interview-list .wrapper>ul>li .image>img {
  width: auto;
  height: 100%;
  object-fit: cover;
  border-radius: 0.5rem;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .image>img {
    width: 30.3rem;
    height: 23rem;
  }
}

section.interview-list .wrapper>ul>li .image .square {
  position: relative;
  width: 3.2rem;
  height: 3.2rem;
  transform: translate(51rem, -21rem);
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .image .square {
    transform: translate(19.5rem, -15.2rem);
    width: 2.16rem;
    height: 2.16rem;
  }
}

section.interview-list .wrapper>ul>li .image .square::before {
  content: "";
  position: absolute;
  width: 7.3rem;
  height: 7.3rem;
  background: linear-gradient(270deg, #33a7cc, #0d64d9);
  border-radius: 0.2rem;
  transform: translate(5.8rem, -14.5rem);
  opacity: 0.6;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .image .square::before {
    transform: translate(4.2rem, -9.2rem);
    width: 4.94rem;
    height: 4.94rem;
  }
}

section.interview-list .wrapper>ul>li .image .square::after {
  content: "";
  position: absolute;
  width: 2.8rem;
  height: 2.8rem;
  background: rgba(214, 230, 254, 0.6);
  border-radius: 0.2rem;
  transform: translate(7.5rem, 5.5rem);
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li .image .square::after {
    transform: translate(5rem, 4rem);
    width: 1.95rem;
    height: 1.9rem;
  }
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:not(:first-child) .text {
    padding-bottom: 22.4rem;
  }
}

/* @media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:not(:first-child) .image {
    transform: translate(calc(0% + 1.6rem), calc(0% + 43.4rem));
  }
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:not(:first-child) .image>img {
    width: 30.3rem;
    height: 24.3rem;
  }
} */

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:nth-child(2) .image>img {
    object-position: 30% center;
  }
}

section.interview-list .wrapper>ul>li:nth-child(2) .image .square {
  transform: translate(51.5rem, -20.5rem);
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:nth-child(2) .image .square {
    transform: translate(20rem, -17.5rem);
    width: 2.2rem;
    height: 2.2rem;
  }
}

section.interview-list .wrapper>ul>li:nth-child(2) .image .square::before {
  background: linear-gradient(270deg, rgba(146, 159, 250, 0.5019607843), #1d2ca1, #1160c6, #3eb2bf);
  transform: translate(5.8rem, -15.2rem);
  width: 7.5rem;
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:nth-child(2) .image .square::before {
    transform: translate(3.3rem, -8rem);
    width: 4.5rem;
    height: 4.5rem;
  }
}

section.interview-list .wrapper>ul>li:nth-child(2) .image .square::after {
  transform: translate(7rem, 5rem);
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:nth-child(2) .image .square::after {
    transform: translate(5.2rem, 6rem);
    width: 1.28rem;
    height: 1.9rem;
  }
}

section.interview-list .wrapper>ul>li:nth-child(3) .image .square {
  transform: translate(51rem, -20.5rem);
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:nth-child(3) .image .square {
    transform: translate(20rem, -17rem);
    width: 2.2rem;
    height: 2.2rem;
  }
}

section.interview-list .wrapper>ul>li:nth-child(3) .image .square::before {
  background: linear-gradient(90deg, #83a4d4, #b6fbff);
  transform: translate(6rem, -14.9rem);
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:nth-child(3) .image .square::before {
    transform: translate(3rem, -8.5rem);
    width: 4.5rem;
    height: 4.5rem;
  }
}

section.interview-list .wrapper>ul>li:nth-child(3) .image .square::after {
  transform: translate(7.2rem, 5rem);
}

@media screen and (max-width: 768px) {
  section.interview-list .wrapper>ul>li:nth-child(3) .image .square::after {
    transform: translate(4rem, 3rem);
    width: 2rem;
    height: 2rem;
  }
}

/*# sourceMappingURL=interview.css.map */