@charset "UTF-8";
/*--
  font-family
--*/
/*--
  font-weight
  Noto Sans
--*/
/*--
  colors
  TODO 色増えすぎてるので整理したい
       変数として機能してないためそこも調整
--*/
/*
路線別色定義
----------------
kk : 京急線
ty : 東急東横線
sh : 東急新横浜線
mg : 東急目黒線
jt : JR東海道線
ji : JR鶴見線
js : JR湘南新宿ライン
jo : JR横須賀線
dt : 東急田園都市線
jh : JR横浜線
yg : 横浜市営地下鉄グリーンライン
yb : 横浜市営地下鉄ブルーライン
so : 相鉄本線
si : 相鉄いずみ野線
sy : 相鉄新横浜線
jk : JR京浜東北線・根岸線
ss : 金沢シーサイドライン
mm : みなとみらい線
ts : 東海道新幹線
jn : JR南武線
kd : こどもの国線
*/
/*--
  break points
--*/
/**
 * font-size
 *
 * @param $fontSize
 */
/**
 * vw
 *
 * for Mobile
 */
/**
 * letter-spacing
 *
 * @param $letterSpacingValue
 * @param $isMinus
 */
/**
 * line-height
 *
 * @param $fs
 * @param $lh
 */
/*--
  media queries
--*/
.interview-post .breadcrumb-area {
  margin: 0 auto 40px;
}
.interview-post .breadcrumb-area a {
  color: #6E2A0A;
}
.interview-post div#ez-toc-container ul.ez-toc-list a {
  color: #6E2A0A !important;
}
.interview-post__header {
  position: static;
  display: grid;
  gap: 53px 37px;
  grid-template-areas: "main-visual title-h2" "main-visual information" "main-visual taxonomies" "main-visual lead";
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(4, auto) 1fr;
  height: initial;
  padding: 35px 4.8vw 0 0;
  width: 100%;
  margin: 0 0 5vw;
  background: linear-gradient(to bottom, #ffef7e 0%, #fff59d 25%, #fffde7 60%, #fff 100%) no-repeat;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .interview-post__header {
    grid-template-columns: 100%;
    grid-template-rows: initial;
    grid-template-areas: "title-h2" "information" "taxonomies" "main-visual" "lead";
    gap: 24px;
    padding: 10vw 4vw 75px;
  }
}
.interview-post__header__information {
  grid-area: information;
  display: flex;
  flex-direction: column;
  font-weight: 900;
}
.interview-post__header__information .from-to {
  font-size: 1.125rem;
}
.interview-post__header__information .name {
  font-size: 1.5rem;
}
.interview-post__header__taxonomies {
  grid-area: taxonomies;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.interview-post__header__taxonomies .chip {
  font-weight: 400;
  font-size: 0.875rem;
  line-height: normal;
  padding: 5px 12px;
  border-radius: 30px;
  background-color: #fff;
}
.interview-post__header__lead {
  grid-area: lead;
  align-self: flex-start;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 178.5%;
  letter-spacing: -1.54px;
}
.interview-post__header__main-visual {
  grid-area: main-visual;
}
.interview-post__header__post-title {
  grid-area: title-h2;
  font-weight: 900;
  font-size: clamp(1.75rem, 2.0833333333vw, 2.5rem);
  letter-spacing: -1.8px;
  line-height: 163.3%;
}
@media screen and (max-width: 767px) {
  .interview-post__header__post-title {
    font-size: 1.625rem;
  }
}
.interview-post__body {
  max-width: 1000px;
  padding: 0 3vw;
  margin: 0 auto;
}
.interview-post__body > *:first-child {
  margin-top: 0;
}
.interview-post__body h2 {
  font-weight: 700;
  font-size: 1.5rem;
  color: #6E2A0A;
  margin: 1.5em 0 1em;
}
@media screen and (max-width: 767px) {
  .interview-post__body h2 {
    font-size: 1.25rem;
  }
}
.interview-post__body h3 {
  font-weight: 700;
  font-size: 1.375rem;
  color: #6E2A0A;
  margin: 4% 0;
}
@media screen and (max-width: 767px) {
  .interview-post__body h3 {
    font-weight: 700;
    font-size: 1.125rem;
  }
}
.interview-post__body h4 {
  font-size: 1.25rem;
  margin: 4% 0;
}
.interview-post__body iframe {
  margin: 4% 0;
  width: 100%;
}
.interview-post__body p:not([class]) {
  padding: 0 0 0 5.125vw;
  margin-top: 4%;
}
@media screen and (max-width: 767px) {
  .interview-post__body p:not([class]) {
    padding: 0;
  }
}
.interview-post__body figure {
  margin: 0 !important;
}
.interview-post__body figure img {
  margin: 5% 0 1%;
}
@media screen and (max-width: 767px) {
  .interview-post__body figure img {
    width: 100%;
  }
}
.interview-post__body figure figcaption {
  font-weight: 400;
  font-size: 1rem;
  text-align: left;
  margin: 0.5rem 0 1rem;
}
.interview-post__body a {
  color: #6E2A0A;
  transition: opacity 0.3s;
}
.interview-post__body a:hover {
  opacity: 0.7;
}
.interview-post__body blockquote {
  margin-top: 4%;
  padding: 1.25em 2em;
  background-color: #fffde7;
  font-style: italic;
  border-left: 5px solid #ffef7e;
}
.interview-post__body blockquote p:first-child {
  margin-top: 0;
}

.interview-slider {
  margin: 0 0 calc(7.3vw + 140px);
}
@media screen and (max-width: 767px) {
  .interview-slider {
    padding: 30px 4vw 100px;
  }
}
.interview-slider__title {
  align-items: center;
  margin: 0 0 70px;
}
.interview-slider .slide-tgl-btn {
  bottom: -66px;
}

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