@charset "UTF-8";

/*---------------------------------------------------------
Special Interview 詳細（A + B）
---------------------------------------------------------*/
.interview_detail .title_h3 {
  margin-bottom: 20px;
}

.interview-header {
  display: grid;
  grid-template-columns: 55% 1fr;
  grid-template-rows: auto 1fr;
  column-gap: 4%;
  margin-bottom: 50px;
}

.interview-header__date {
  grid-column: 2;
  grid-row: 1;
  display: block;
  text-align: right;
  font-size: 1.7rem;
  margin-bottom: 0;
}

.interview-header__image {
  grid-column: 1;
  grid-row: 1 / 3;
}

.interview-header__image img {
  width: 100%;
  height: auto;
  display: block;
}

.interview-header__profile {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  font-size: 1.7rem;
  line-height: 1.8;
}

.interview-header__company,
.interview-header__position,
.interview-header__person {
  margin-bottom: 0.5em;
}

.interview-header__person {
  margin-bottom: 0;
}

.interview-header--no-image {
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
}

.interview-header--no-image .interview-header__date {
  grid-column: 1;
  grid-row: 1;
}

.interview-header--no-image .interview-header__profile {
  grid-column: 1;
  grid-row: 2;
  align-self: start;
}

.interview-block {
  margin-bottom: 50px;
}

.interview-block__heading {
  margin-bottom: 20px;
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 600;
}

.interview-block__text {
  margin-bottom: 30px;
}

.interview-block .img-box--count-1 {
  justify-content: flex-start;
}

.interview-block .img-box--count-1 li {
  width: 48%;
  margin-right: 0;
}

@media screen and (max-width:768px) {

  .interview-header {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    row-gap: 0;
    margin-bottom: 30px;
  }

  .interview-header__date {
    grid-column: 1;
    grid-row: 1;
    font-size: 1.2rem;
    margin-bottom: 10px;
  }

  .interview-header__image {
    grid-column: 1;
    grid-row: 2;
    margin-bottom: 20px;
  }

  .interview-header__profile {
    grid-column: 1;
    grid-row: 3;
    align-self: start;
    font-size: 1.2rem;
  }

  .interview-header--no-image .interview-header__profile {
    grid-row: 2;
  }

  .interview-block {
    margin-bottom: 30px;
  }

  .interview-block__heading {
    font-size: 1.4rem;
    margin-bottom: 15px;
  }

  .interview-block .img-box--count-1 li {
    width: 100%;
  }

}
