@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-slider {
  padding: 100px 0 110px;
  background-image: url("../images/top/interview-bk.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}
@media screen and (max-width: 767px) {
  .interview-slider {
    padding: 30px 0 50px;
  }
}
.interview-slider .slider__body {
  position: relative;
}
.interview-slider .slick-prev,
.interview-slider .slick-next {
  top: 45%;
  width: 4.83%;
  height: 15.65%;
}
@media screen and (max-width: 767px) {
  .interview-slider .slick-prev,
  .interview-slider .slick-next {
    top: 26%;
    width: 40px;
    height: 40px;
  }
}
.interview-slider .slick-prev {
  left: 2.34375vw;
  transform: translateY(-50%) rotate(180deg);
  background: url("../images/common/arrow-wo.svg") no-repeat center center/contain;
}
@media screen and (max-width: 767px) {
  .interview-slider .slick-prev {
    left: 0;
  }
}
.interview-slider .slick-next {
  right: 2.34375vw;
  background: url("../images/common/arrow-wo.svg") no-repeat center center/contain;
}
@media screen and (max-width: 767px) {
  .interview-slider .slick-next {
    right: 0;
  }
}
.interview-slider .slick-slide {
  margin: 0 20px;
}
.interview-slider .slick-dots {
  position: absolute;
  bottom: -60px;
  left: 0;
  display: flex;
  gap: 15px;
  justify-content: center;
  width: 100%;
  padding: 30px 0 0;
}
.interview-slider .slick-dots li {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: #c4bfbf;
}
@media screen and (max-width: 767px) {
  .interview-slider .slick-dots li {
    width: 10px;
    height: 10px;
    margin: 0 10px;
  }
}
.interview-slider .slick-dots li.slick-active {
  background-color: #CD561D;
}
.interview-slider .slide-tgl-btn {
  bottom: 133px;
  left: calc(50% - 115px);
  transform: translate(-50%);
}
@media screen and (max-width: 767px) {
  .interview-slider .slide-tgl-btn {
    bottom: 123px;
    left: calc(50% - 130px);
  }
}
.interview-slider .slide-tgl-btn button {
  background-color: #CD561D;
}
.interview-slider .slide-tgl-btn button::before, .interview-slider .slide-tgl-btn button::after {
  background-color: #fff;
}
.interview-slider__contents {
  display: flex;
  gap: 40px;
  justify-content: center;
  max-width: calc(1400px + 16vw);
  padding: 0 8vw;
  margin: 3.125vw auto 66px;
}
@media screen and (max-width: 767px) {
  .interview-slider__contents {
    padding: 0;
    margin-top: 16px;
  }
}
.interview-slider__title {
  display: flex;
  gap: 19px;
  flex-direction: column;
  margin: 0 0 80px 9.375vw;
}
@media screen and (max-width: 767px) {
  .interview-slider__title {
    margin: 0 0 40px;
  }
}
@media screen and (max-width: 767px) {
  .interview-slider__title svg:first-of-type {
    width: 70%;
  }
}
@media screen and (max-width: 767px) {
  .interview-slider__title svg:last-of-type {
    width: 70%;
  }
}
.interview-slider__button-more {
  display: block;
  width: 408px;
  font-weight: 700;
  font-size: 1.125rem;
  color: #6E2A0A;
  padding: 0 47px 0 0;
  margin: 130px auto 0;
  line-height: 70px;
  text-align: center;
  border-top: 2px solid #6E2A0A;
  border-bottom: 2px solid #6E2A0A;
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 34 33.999"><path fill="%23963A00" d="M-714-320a16.889,16.889,0,0,1-12.021-4.979A16.887,16.887,0,0,1-731-337a16.889,16.889,0,0,1,4.979-12.021A16.889,16.889,0,0,1-714-354a16.889,16.889,0,0,1,12.021,4.979A16.889,16.889,0,0,1-697-337a16.888,16.888,0,0,1-4.979,12.02A16.889,16.889,0,0,1-714-320Zm-1.551-23.45h0l-1.382,1.382,5.068,5.068-5.068,5.069,1.382,1.382L-709.1-337l-6.449-6.45Z" transform="translate(731 354)" /></svg>');
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 40px;
}
@media screen and (max-width: 767px) {
  .interview-slider__button-more {
    max-width: 320px;
    font-size: 1rem;
    line-height: 55px;
    background-size: 32px;
  }
}
@media screen and (max-width: 767px) {
  .interview-slider .interview-article {
    width: 100%;
  }
}
.interview-slider .interview-article:hover {
  transform: scale(0.98);
}

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