@charset "utf-8";


/* 下層 */
.space {
  height: 20px;
  background-color: #FAF6EC;
}

.interview-container {
  margin: 5vw 0;
}

.interview-head {
  display: flex;
  flex-direction: column-reverse;
  padding-bottom: 10vw ;
  gap: 20px;
}

@media (min-width:767px){
  .space {
    height: 40px;
  }
    .interview-head {
    flex-direction: row;
    padding-bottom: 5vw;
    gap: 4vw;
  }
}

@media (min-width:767px){
  .profile {
    width: 30vw;
    max-width: 400px;
  }
}

.profile dl {
  margin-bottom: 30px;
}

.profile dl dt {
  font-size: calc(1.8rem + (2.4 - 1.8 ) * ( 100vw - 37.5rem ) / (198 - 37.5 ));
  float: left;
  font-weight: 500;
  margin-right: 10px;
}

.profile dl dd {
  font-size: calc(1.2rem + (1.6 - 1.2 ) * ( 100vw - 37.5rem ) / (198 - 37.5 ));
  margin-bottom: 0;
}

.profile dl dd span {
  margin-top: 1.5%;
  margin-left: 30px;
  position: relative;
  display: inline-block;
}

.profile dl dd span::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 1px;
  background-color: #333333;
  position: absolute;
  top: 50%;
  margin-right: 10px;
  left: -30px;
}

.profile img {
  width: 100%;
  height: auto;
  margin-bottom: 10px;
}

.catchcopy {
  display: flex;
  align-items: center;
}
.catchcopy-inner {

}

.interview-container h3 {
  font-weight: 500;
  font-size: calc(2.2rem + (4 - 2.2 ) * ( 100vw - 37.5rem ) / (198 - 37.5 ));
  line-height: 2.2em;
  letter-spacing: 0.3em;
}

.interview-container h4 {
  color: #ff7900;
  letter-spacing: 0.2em;
  font-size: calc(1.6rem + (2 - 1.6 ) * ( 100vw - 37.5rem ) / (198 - 37.5 ));
  font-weight: 500;
  line-height: 2.2em;
  padding-bottom: 10px;
}

.interview-container .row p,figcaption {
  padding-bottom: 40px;
}

.interview-container p {
  font-size: calc(1.5rem + (1.8 - 1.5 ) * ( 100vw - 37.5rem ) / (198 - 37.5 ));
  line-height: 2.2em;
  text-align: justify;
  display: inline-block;
}

.interview-container .image {
  background-color: #ff7900;
}

.interview-container figure img {
  width: 100%;
  height: auto;
}

.interview-container figure {
  max-width: 90%;
  margin: 10px 10%;
}

.interview-container figcaption {
  margin: 0 10%;
  font-size: calc(1.5rem + (1.8 - 1.5 ) * ( 100vw - 37.5rem ) / (198 - 37.5 ));
  text-align: justify;
  opacity: 0.5;
}

.date {
  text-align: right;
}

/* footer */
footer {
  background-color: #ffffff;
}