/* ------------------------------
 お客様インタビュー */
#add_customizer_6_wrapper {
  width: 100%;
}

/* スライダー全体 */
#add_customizer_6_wrapper .content .interview-swiper {
  padding: 40px 0;
  box-sizing: border-box;
  position: relative;
}
#add_customizer_6_wrapper .content .interview-swiper > .swiper-wrapper {
  gap: 8px;
}

/* スマホの時要調整 */
#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list {
  max-width: 33.333%;
}

/* カード本体 */
#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list
  .interview-card {
  background: #fff;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* 画像部分 */
#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list
  .interview-card
  .card-image {
  position: relative;
  min-height: 62%;
  overflow: hidden;
}

#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list
  .interview-card
  .card-image
  img {
  width: 100%;
  display: block;
  transform: scale(1);
  transition: transform 0.6s cubic-bezier(0.2, 0.65, 0.2, 1), filter 0.6s;
  will-change: transform;
}
/* ホバー時の拡大 */
#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list
  .interview-card:hover
  .card-image
  img {
  transform: scale(1.1);
  /* filter: brightness(1.05); */
}

/* 会社名ラベル */
#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list
  .interview-card
  .company-label {
  position: absolute;
  bottom: 8px;
  left: 8px;
  background: #0094ff;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  padding: 4px 8px;
  border-radius: 2px;
}

/* テキスト部分 */
#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list
  .interview-card
  .card-content {
  padding: 16px;
  text-align: left;
  min-height: 180px;
}

#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list
  .interview-card
  .card-content
  h3 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 8px;
  line-height: 1.4;
}

#add_customizer_6_wrapper
  .content
  .interview-swiper
  > .swiper-wrapper
  > .interview-list
  .interview-card
  .card-content
  p {
  font-size: 14px;
  color: #555;
  line-height: 1.6;
}

@media (max-width: 768px) {
  #add_customizer_6_wrapper
    .content
    .interview-swiper
    > .swiper-wrapper
    > .interview-list
    .interview-card
    .card-content
    h3 {
    font-size: 14px;
  }
  #add_customizer_6_wrapper
    .content
    .interview-swiper
    > .swiper-wrapper
    > .interview-list
    .interview-card
    .card-content
    p {
    font-size: 13px;
  }
}

/* Swiperのナビゲーションボタン */
#add_customizer_6_wrapper .content .interview-swiper .swiper-button-next {
  right: -5% !important;
}
#add_customizer_6_wrapper .content .interview-swiper .swiper-button-prev {
  left: -5% !important;
}
#add_customizer_6_wrapper .content .interview-swiper .swiper-button-next,
#add_customizer_6_wrapper .content .interview-swiper .swiper-button-prev {
  color: #0094ff;
  top: 50% !important;
  transform: translateY(-50%);
}

#add_customizer_6_wrapper .content .interview-swiper .swiper-button-next::after,
#add_customizer_6_wrapper
  .content
  .interview-swiper
  .swiper-button-prev::after {
  font-size: 20px;
}

/* もっと見るのリンク（ラッパー） */
#add_customizer_6_wrapper .content .more-link {
  font-size: 14px;
  padding: 2em;
  text-align: center;
}

/* a をボタン風に（横並び・中央揃え） */
#add_customizer_6_wrapper .content .more-link .btn {
  display: inline-flex;
  align-items: center;
  gap: 8px; /* 文字と矢印の間隔 */
  padding: 1em 4em;
  border: 1px solid #0090d4;
  border-radius: 4px;
  background: #fff;
  color: #0090d4;
  text-decoration: none;
  font-size: 1em;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.25s ease, color 0.25s ease;
}

/* ホバー/フォーカス時の色反転 */
#add_customizer_6_wrapper .content .more-link .btn:hover,
#add_customizer_6_wrapper .content .more-link .btn:focus-visible {
  background: #0090d4;
  color: #fff;
}

/* テキスト側は幅決め不要（自然に伸縮） */
#add_customizer_6_wrapper .content .more-link .btn .text {
  white-space: nowrap; /* 1行にしたい */
}

/* 矢印（SVG想定） */
#add_customizer_6_wrapper .content .more-link .btn .arrow-wrap {
  display: inline-flex; /* transformが効く&中央揃え */
  align-items: center;
  height: 1em;
  transform-origin: left center; /* 左基点で伸ばす */
  transform: scale(1, 1);
  transition: transform 0.4s ease;
}

/* ホバーで矢印が横に伸びる */
#add_customizer_6_wrapper .content .more-link .btn:hover .arrow-wrap {
  transform: scale(1.4, 1);
}

/* 矢印SVGのサイズ＆色継承 */
#add_customizer_6_wrapper .content .more-link .btn .arrow-wrap svg {
  height: 1em;
  width: auto;
  vertical-align: middle;
}
#add_customizer_6_wrapper .content .more-link .btn .arrow-wrap svg > polyline {
  stroke: currentColor; /* テキスト色と同期 */
}
#add_customizer_6_wrapper
  .content
  .more-link
  .btn:hover
  .arrow-wrap
  svg
  > polyline {
  stroke-width: 2px;
}