:root {
  --main-color: #ad0b40;
}

body {
  color: #000;
}

[data-layout="interview"] p {
  /* font-size: var(--fz16); */
  font-weight: 400;
  line-height: 1.875;
  text-align: left;
  font-weight: 500;
}

[data-layout="interview"] .bold {
  font-weight: bold;
}

[data-layout="interview"] .skewBg:before {
  height: 32%;
  left: 33%;
}

@media (min-width: 768px) {
  [data-layout="interview"] .PageHead {
    width: 100%;
    background-color: #333;
    height: calc(651 / 375 * 1rem);
  }

  [data-layout="interview"] .PageHead .thumb {
    mix-blend-mode: unset;
    clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 0% 100%);
    height: 100%;
    top: 0;
    position: absolute;
    width: 63%;
    left: 37%;
    transform-origin: left top;
  }

  [data-layout="interview"] .PageHead .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  [data-layout="interview"] .PageHead .PageHead_title {
    color: rgba(255, 255, 255, 0.06);
    position: absolute;
    top: 45%;
    left: 0;
    transform: translateY(-50%);
    margin-left: 0;
    padding-left: 0;
    font-size: calc(128 / 375 * 1rem);
    opacity: 1;
  }

  [data-layout="interview"] .PageHead .PageHead_title:after {
    bottom: calc(-64 / 375 * 1rem);
  }

  [data-layout="interview"] .PageHead .PageHead_shoulder {
    position: absolute;
    top: 45%;
    transform: translateY(-20%);
    display: flex;
  }

  [data-layout="interview"] .PageHead .PageHead_shoulder .c-slideText {
    flex-direction: column;
  }

  [data-layout="interview"] .PageHead .PageHead_shoulder > div div {
    font-weight: 700;
  }

  [data-layout="interview"] .PageHead .PageHead_shoulder > div div:last-child {
    margin-top: 10px;
  }

  [data-layout="interview"] .PageHead .PageHead_title .c-slideText {
    display: block;
  }

  [data-layout="interview"] .PageHead_sub {
    position: absolute;
    bottom: calc(130 / 375 * 1rem);
    font-size: var(--fz16);
    padding-left: 0.12rem;
    color: #fff;
  }

  [data-layout="interview"] .Main {
    width: 3.2rem;
    padding: 0;
    margin: 0.26666666rem auto;
  }
}

@media (max-width: 767px) {
  [data-layout="interview"] .Main {
    padding: 0.2133333333rem 0.0533333333rem;
  }

  [data-layout="interview"] .section2 .Main {
    padding-bottom: 0;
  }
}

[data-layout="interview"] .section1 .block {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

[data-layout="interview"] .section1 .block:not(:last-child) {
  margin-bottom: 0.3rem;
}

[data-layout="interview"] .section1 .block:nth-last-of-type(even) {
  flex-direction: row-reverse;
}

[data-layout="interview"] .section1 .block-texts {
  width: calc(546 / 375 * 1rem);
}

[data-layout="interview"] .question {
  color: var(--main-color);
  font-weight: 700;
  position: relative;
  padding-left: 0.15rem;
}

[data-layout="interview"] .question::before {
  content: "";
  display: block;
  width: calc(50 / 375 * 1rem);
  height: 1px;
  background-color: var(--main-color);
  position: absolute;
  transform: translateX(-0.15rem);
  top: 50%;
}

[data-layout="interview"] .section1 .block-texts .lead {
  font-size: var(--fz24);
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  margin-top: 0.0568rem;
}

[data-layout="interview"] .section1 .block-texts .text {
  margin-top: calc(31 / 375 * 1rem);
}

[data-layout="interview"] .section1 .block-texts .text p {
  line-height: 1.875;
  margin-bottom: 0.07rem;
  text-align: left;
  font-weight: 500;
}

[data-layout="interview"] .section1 .block-texts .text em {
  font-weight: 700;
  font-style: unset;
}

[data-layout="interview"] .section1 .block-img {
  width: calc(564 / 375 * 1rem);
}

[data-layout="interview"] .section2 .Main,
[data-layout="interview"] .section3 {
  display: flex;
  justify-content: space-between;
}

[data-layout="interview"] .section2 .text,
[data-layout="interview"] .section3 .text {
  width: calc(546 / 375 * 1rem);
}

[data-layout="interview"] .section2 .text p:last-of-type,
[data-layout="interview"] .section3 .text p:last-of-type {
  margin-top: var(--fz28);
}

[data-layout="interview"] .section2 img {
  display: block;
  width: 100vw;
}

[data-layout="interview"] .career {
  background-color: #fff;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 1.6rem);
  margin-bottom: 0.154666666rem;
  padding-right: 0;
  padding-top: 0.16rem;
  padding-bottom: 0.16rem;
  padding-left: 0.426666666rem;
}

@media (min-width: 1500px) {
  [data-layout="interview"] .career {
    padding-left: 0.826666666rem;
  }
}

[data-layout="interview"] .career-inner {
  display: flex;
  gap: calc(115 / 375 * 1rem);
}

[data-layout="interview"] .career-inner > div:first-child {
  width: calc(480 / 375 * 1rem);
}

[data-layout="interview"] .career-inner > div:last-child {
  width: calc(332 / 375 * 1rem);
}

[data-layout="interview"] .job-description {
  margin-top: calc(55 / 375 * 1rem);
}

[data-layout="interview"] .company-career ul li {
  font-weight: 500;
}

[data-layout="interview"] .company-career p,
[data-layout="interview"] .job-description p:first-child {
  color: var(--main-color);
  font-weight: 700;
}

[data-layout="interview"] .schedule-item2 {
  margin-top: 32px;
}

[data-layout="interview"] .section3 {
  padding-bottom: calc(94 / 375 * 1rem);
}

[data-layout="interview"] .related {
  display: flex;
  justify-content: space-between;
  gap: calc(71 / 375 * 1rem);
  padding-top: calc(94 / 375 * 1rem);
}

[data-layout="interview"] .related > div:first-child p {
  font-weight: 700;
}

[data-layout="interview"] .related ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(32 / 375 * 1rem);
  width: calc(928 / 375 * 1rem);
}

[data-layout="interview"] .related ul li a {
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* gap: calc( 24 / 375 * 1rem); */
  transition: all 0.3s;
}

[data-layout="interview"] .related ul li a:hover {
  opacity: 0.7;
}

[data-layout="interview"] .related .image {
  width: calc(223 / 375 * 1rem);
  aspect-ratio: 223 / 126;
}

[data-layout="interview"] .related .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

[data-layout="interview"] .related ul li div:last-child {
  padding-left: calc(22 / 375 * 1rem);
}

[data-layout="interview"] .related ul li div p:first-child {
  font-weight: 700;
  line-height: 1.6;
}

[data-layout="interview"] .related ul li div p:last-child {
  font-size: var(--fz14);
  line-height: 1.5;
  margin-top: 10px;
  color: #666;
  font-weight: 500;
}

[data-layout="interview"] .intertour {
  margin-top: calc(137 / 375 * 1rem);
}

[data-layout="interview"] .intertour p {
  font-size: var(--fz13);
  font-weight: 700;
  text-align: center;
}

[data-layout="interview"] .intertour img {
  width: 100%;
  margin-top: calc(8 / 375 * 1rem);
}

[data-layout="interview"] .hiddenPC {
  display: none;
}

@media (max-width: 767px) {
  [data-layout="interview"] .hiddenSP {
    display: none;
  }

  [data-layout="interview"] .hiddenPC {
    display: block;
  }

  [data-layout="interview"] .section1 .block {
    flex-direction: column;
  }

  [data-layout="interview"] .section1 .block:nth-last-of-type(even) {
    flex-direction: column;
  }

  [data-layout="interview"] .section1 .block-texts {
    width: 100%;
    font-size: var(--fz16);
  }

  [data-layout="interview"] .section1 .block-texts .lead {
    font-size: var(--fz20);
    font-weight: 700;
    line-height: 1.6;
    letter-spacing: 0.05em;
    margin-top: 0.0568rem;
  }

  [data-layout="interview"] .question {
    padding-left: 0.05rem;
  }

  [data-layout="interview"] .question::before {
    width: calc(10 / 375 * 1rem);
    transform: translateX(-0.05rem);
    top: 50%;
  }

  [data-layout="interview"] .section1 .block:not(:last-child) {
    margin-bottom: 0.1rem;
  }

  [data-layout="interview"] .section1 .block-img {
    width: 100%;
  }

  [data-layout="interview"] .section2 .Main,
  [data-layout="interview"] .section3 {
    flex-direction: column;
    gap: 30px;
  }

  [data-layout="interview"] .section2 .text,
  [data-layout="interview"] .section3 .text {
    width: 100%;
  }

  [data-layout="interview"] .career {
    background-color: #fff;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 0.44rem);
    margin-bottom: 0.154666666rem;
    padding-right: 0.09333rem;
    padding-top: 0.16rem;
    padding-bottom: 0.16rem;
    padding-left: 0.09333rem;
  }

  [data-layout="interview"] .career-inner {
    flex-direction: column;
    gap: calc(50 / 375 * 1rem);
  }

  [data-layout="interview"] .career-inner > div:first-child {
    width: 100%;
  }

  [data-layout="interview"] .career-inner > div:last-child {
    width: 100%;
  }

  [data-layout="interview"] .section3 {
    padding-bottom: calc(50 / 375 * 1rem);
  }

  [data-layout="interview"] .related {
    flex-direction: column;
    gap: calc(30 / 375 * 1rem);
    padding-top: calc(50 / 375 * 1rem);
  }

  [data-layout="interview"] .related ul {
    width: 100%;
    grid-template-columns: 1fr;
    gap: calc(28 / 375 * 1rem);
  }

  [data-layout="interview"] .related ul li {
    width: 100%;
  }

  [data-layout="interview"] .related ul li a {
    grid-template-columns: 1fr;
    gap: calc(12 / 375 * 1rem);
  }

  [data-layout="interview"] .related ul li div:last-child {
    padding-left: 0;
  }

  [data-layout="interview"] .related ul li div p:last-child {
    margin-top: 0;
  }

  [data-layout="interview"] .related .image {
    width: 100%;
    padding-left: 0;
  }

  [data-layout="interview"] .intertour {
    margin-top: 30px;
  }

  [data-layout="interview"] .intertour img {
    width: 80%;
    margin: calc(8 / 375 * 1rem) auto 0;
  }

  [data-layout="interview"] .company-career ul li {
    font-size: 0.0373333rem;
    line-height: 0.0653333rem;
  }

  [data-layout="interview"] .related > div:first-of-type > p {
    font-size: calc(20 / 375 * 1rem);
  }
}

@media (max-width: 767px) {
  .PageHead.-interview01 {
    background: url(../img/interview/interview1_mv_sp.png) no-repeat 50% /
      contain;
    background-position-y: top;
  }

  .PageHead.-interview02 {
    background: url(../img/interview/interview2_mv_sp.png) no-repeat 50% /
      contain;
    background-position-y: top;
  }

  .PageHead.-interview03 {
    background: url(../img/interview/interview3_mv_sp.png) no-repeat 50% /
      contain;
    background-position-y: top;
  }

  .PageHead.-interview04 {
    background: url(../img/interview/interview4_mv_sp.png) no-repeat 50% /
      contain;
    background-position-y: top;
  }

  .PageHead.-interview05 {
    background: url(../img/interview/interview5_mv_sp.png) no-repeat 50% /
      contain;
    background-position-y: top;
  }

  .PageHead.-interview06 {
    background: url(../img/interview/interview6_mv_sp.png) no-repeat 50% /
      contain;
    background-position-y: top;
  }

  .PageHead.-interview07 {
    background: url(../img/interview/interview7_mv_sp.png) no-repeat 50% /
      contain;
    background-position-y: top;
  }

  [data-layout="interview"] .PageHead {
    height: calc(520 / 375 * 1rem);
    background-color: #333;
    position: relative;
  }

  [data-layout="interview"] .PageHead .PageHead_title {
    color: #333;
    opacity: 0.3;
    /*color: hsla(0, 0%, 100%, .5);*/
    /* position: relative;
  left:15%;
  top:56%;*/
    font-size: calc(55 / 375 * 1rem);
    text-align: right;
    top: 60%;
    right: 0;
    padding-left: 0.0533333333rem;
    line-height: 0.096rem;
    margin-top: -0.0133333333rem;
    margin-bottom: -0.0133333333rem;
  }

  [data-layout="interview"] .PageHead:before {
    height: 100%;
    /*height: .7008213333rem;*/
    -webkit-transform: translateX(0.2826666667rem) skewX(-20deg);
    transform: translateX(0.2826666667rem) skewX(-20deg);
    border-left: 1px solid hsla(0, 0%, 100%, 0.3);
    left: 15%;
  }

  [data-layout="interview"] .PageHead .PageHead_title:after {
    position: absolute;
    left: 0;
    display: block;
    width: 100%;
    content: "";
    border-bottom: 1px solid hsla(0, 0%, 100%, 0.5);
  }

  [data-layout="interview"] .PageHead .PageHead_shoulder .c-slideText {
    text-align: right;
  }

  [data-layout="interview"] .PageHead .PageHead_shoulder .c-slideText div {
    font-weight: 700;
    font-size: calc(20 / 375 * 1rem);
    font-family: var(--fontJa);
    letter-spacing: 0.067em;
    line-height: 1.5;
  }

  [data-layout="interview"] .PageHead .PageHead_shoulder {
    position: absolute;
    top: 70%;
    right: 5%;
    padding-left: 0;
    padding-right: 0;
  }

  [data-layout="interview"] .PageHead_sub {
    position: absolute;
    right: 5%;
    bottom: 8%;
    text-align: right;
  }
  [data-layout="interview"] .PageHead_sub .c-slideText {
    text-align: right;
  }

  [data-layout="interview"] .PageHead_sub div {
    font-size: var(--fz13);
    color: #fff;
    font-weight: 500;
  }
}