/*
Theme Name: dmm-nijikenshin
Description: DMM 二次健診活用支援サービス 導入事例テーマ
Version: 1.0.0
*/

/* ==========================================================================
   Base
   ========================================================================== */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
  font-size: 16px;
  line-height: 1.8;
  color: #333;
  background-color: #f9f9f9;
  background-image: url('images/img_top_bg.webp');
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: scroll;
}

body.overflow-hidden {
  overflow: hidden;
}

/* SP用ベースfont-size: 14px / 375 * 100 = 3.7333vw */
@media (max-width: 768px) {
  html {
    font-size: 3.7333vw;
  }
  
  body {
    background-image: url('images/img_top_bg_sp.webp');
    background-size: 152.26% auto;
    background-repeat: repeat-y;
  }
}

a {
  color: #0073aa;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

img {
  max-width: 100%;
  height: auto;
}

ul,
ol {
  padding-left: 1.5em;
}

.container {
  max-width: min(78.0556vw, 1124px);
  margin: 0 auto;
  padding: 0;
}

@media (max-width: 768px) {
  .container {
    max-width: 100%;
    padding: 0 1rem;
  }
}

/* ==========================================================================
   Header
   PC: bg white, padding 4px 24px, border-radius 16px, shadow, justify-between
   SP: padding 8px 16px, gap 20px, border-radius 8px
   ========================================================================== */
.siteHeader {
  position: fixed;
  top: min(0.8333vw, 12px);
  left: 0;
  right: 0;
  z-index: 1000;
  padding: 0 min(1.6667vw, 24px);
  container-type: inline-size;
  container-name: siteHeader;
}

.siteHeader__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1120px;
  height: 66px;
  margin: 0 auto;
  padding: 0 min(1.6667vw, 24px);
  background: #fff;
  border-radius: min(1.1111vw, 16px);
  box-shadow: 0 min(0.3472vw, 5px) min(1.0417vw, 15px) rgba(44, 69, 125, 0.1);
}

/* ロゴ */
.siteHeader__logo {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.04em;
  color: #3f4f5f;
  text-decoration: none;
  flex-shrink: 0;
}

.siteHeader__logo:hover {
  text-decoration: none;
}

/* header: 1100px以上でロゴfont-sizeを1rem(16px)に */
@media (min-width: 1100px) {
  .siteHeader__logo {
    font-size: 1rem;
  }
}

/* PCナビゲーション */
.siteHeader__nav {
  display: flex;
  align-items: center;
  gap: 16px;
}

.siteHeader__menu {
  display: flex;
  gap: 16px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.siteHeader__menuItem {
  display: flex;
  align-items: center;
}

.siteHeader__menuItem a {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: #3f4f5f;
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.3s ease;
}

.siteHeader__menuItem a:hover {
  text-decoration: none;
  color: #00C17C;
}

/* header: 1100px以上でナビfont-sizeを1rem(16px)に */
@media (min-width: 1100px) {
  .siteHeader__menuItem a {
    font-size: 1rem;
  }
}

/* PCボタンエリア */
.siteHeader__buttons {
  display: flex;
  gap: 16px;
}

.siteHeader__button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  padding: 0 16px;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.04em;
  border-radius: 8px;
  text-decoration: none;
  white-space: nowrap;
}

.siteHeader__button:hover {
  text-decoration: none;
}

.siteHeader__buttonPrimary {
  background: #00C17C;
  color: #fff;
  width: 132px;
}

.siteHeader__buttonPrimary:hover {
  background: #00AD6F;
}

.siteHeader__buttonSecondary {
  background: #FC7F26;
  color: #fff;
  width: 165px;
}

.siteHeader__buttonSecondary:hover {
  background: #EB6605;
}

/* header: 1100px以上でボタンfont-sizeを1rem(16px)に */
@media (min-width: 1100px) {
  .siteHeader__button {
    font-size: 1rem;
  }
}

/* SPボタン・ハンバーガー（PC非表示） */
.siteHeader__spButtons,
.siteHeader__hamburger {
  display: none;
}

@media (max-width: 1023px) {
  .siteHeader {
    top: 0.75rem;
    /* 12px - 本番と同じ */
    left: 0;
    right: 0;
    padding: 0 1rem;
    /* 16px */
  }

  .siteHeader__inner {
    gap: 0.75rem;
    /* 12px */
    padding: 0.5rem 1rem;
    /* 8px 16px */
    height: 53px;
    border-radius: 0.5rem;
    /* 8px */
  }

  /* ロゴ（SP非表示） */
  .siteHeader__logo {
    display: none;
  }

  /* PCナビゲーション（SP非表示） */
  .siteHeader__nav {
    display: none;
  }

  /* SPボタン（SP表示） */
  .siteHeader__spButtons {
    display: flex;
    gap: 0.857rem;
    /* 12px */
    flex: 1;
  }

  .siteHeader__spButton {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 130px;
    height: 37px;
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 14px;
    font-weight: 700;
    border-radius: 4px;
    text-decoration: none;
    white-space: nowrap;
  }

  .siteHeader__spButton:hover {
    text-decoration: none;
    opacity: 0.9;
  }

  .siteHeader__spButtonPrimary {
    background: #00c17c;
    color: #fff;
  }

  .siteHeader__spButtonSecondary {
    background: #FC7F26;
    border: none;
    color: #fff;
  }

  /* ハンバーガー（SP表示） */
  .siteHeader__hamburger {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 20px;
    height: 16px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    flex-shrink: 0;
  }

  .siteHeader__hamburgerLine {
    display: block;
    width: 100%;
    height: 2px;
    background: #00c17c;
    border-radius: 9999px;
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform-origin: center;
  }

  /* ハンバーガー開いた状態（×に変形） */
  .siteHeader__hamburger.is-open .siteHeader__hamburgerLine:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .siteHeader__hamburger.is-open .siteHeader__hamburgerLine:nth-child(2) {
    opacity: 0;
  }

  .siteHeader__hamburger.is-open .siteHeader__hamburgerLine:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }
}

/* ==========================================================================
   ドロワーメニュー（SP用）
   ========================================================================== */
.drawerMenu {
  display: none;
}

/* SPスタイル: 1023px以下 (本番サイト準拠) */
@media (max-width: 1023px) {
  .drawerMenu {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1001;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .drawerMenu.is-open {
    pointer-events: auto;
    opacity: 1;
  }

  .drawerMenu__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
  }

  .drawerMenu__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: 80%;
    height: 100%;
    background: #fff;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    overflow-y: auto;
    padding: 5rem 1.5rem 2rem;
  }

  .drawerMenu.is-open .drawerMenu__panel {
    transform: translateX(0);
  }

  .drawerMenu__close {
    position: absolute;
    top: 1.25rem;
    right: 1.25rem;
    width: 1.5rem;
    height: 1.5rem;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
  }

  .drawerMenu__closeLine {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 2px;
    background: #00c17c;
    border-radius: 1px;
  }

  .drawerMenu__closeLine:nth-child(1) {
    transform: rotate(45deg);
  }

  .drawerMenu__closeLine:nth-child(2) {
    transform: rotate(-45deg);
  }

  .drawerMenu__nav {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }

  .drawerMenu__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .drawerMenu__item {
    border-bottom: 1px solid #e5e5e5;
  }

  .drawerMenu__link {
    display: block;
    padding: 1rem 0;
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: #333;
    text-decoration: none;
    transition: color 0.3s ease;
  }

  .drawerMenu__link:hover {
    color: #00C17C;
    text-decoration: none;
  }

  .drawerMenu__buttons {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .drawerMenu__button {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.875rem 1rem;
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    text-align: center;
  }

  .drawerMenu__button:hover {
    text-decoration: none;
  }

  .drawerMenu__buttonPrimary {
    background: #00C17C;
    color: #fff;
  }

  .drawerMenu__buttonPrimary:hover {
    background: #00AD6F;
  }

  .drawerMenu__buttonSecondary {
    background: #FC7F26;
    color: #fff;
  }

  .drawerMenu__buttonSecondary:hover {
    background: #EB6605;
  }
}

/* ==========================================================================
   パンくずリスト（ヒーロー内）
   PC: left 158px, top 100px, gap 8px, 14px, line-height 1.8, 白文字
   SP: height 50px, padding 16px 20px, gap 8px, 12px, line-height 1.5, letter-spacing 0.6px
   ========================================================================== */
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
}

.breadcrumb__list {
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.breadcrumb__item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.breadcrumb__link {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  color: #fff;
  text-decoration: none;
}

.breadcrumb__link:hover {
  text-decoration: none;
}

.breadcrumb__linkTextSp {
  display: none;
}

.breadcrumb__text {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  color: #fff;
}

.breadcrumb__textSp {
  display: none;
}

.breadcrumb__separator {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5px;
  height: 8px;
  color: #fff;
}

.breadcrumb__separator svg {
  width: 100%;
  height: 100%;
}

@media (max-width: 926px) {
  .breadcrumb {
    display: block;
    line-height: 1.4;
  }

  .breadcrumb__list {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    color: #fff;
  }

  .breadcrumb__item {
    display: inline;
  }

  .breadcrumb__separator {
    display: inline-flex;
    vertical-align: middle;
    width: 0.571rem;
    /* 8px */
    height: 0.571rem;
    /* 8px */
    margin: 0 0.286rem;
    /* 4px */
  }

  .breadcrumb__link {
    font-size: 0.857rem;
    /* 12px */
    letter-spacing: 0.6px;
  }

  .breadcrumb__linkTextPc {
    display: none;
  }

  .breadcrumb__linkTextSp {
    display: inline;
  }

  .breadcrumb__text {
    font-size: 0.857rem;
    /* 12px */
    letter-spacing: 0.6px;
    display: inline;
  }

  .breadcrumb__textPc {
    display: none;
  }

  .breadcrumb__textSp {
    display: inline;
  }
}

@media (max-width: 768px) {
  .breadcrumb {
    padding: 1.143rem 0;
    /* 16px */
  }
}

/* ==========================================================================
   ヒーローセクション
   PC: 背景1440x389, パンくず top 100px left 158px, 見出し top 155px left 158px
   SP: 背景375x281, ヘッダーpadding-top 10px, パンくず height 50px, 見出し top 115px left 16px
   ========================================================================== */
.hero {
  position: relative;
  width: 100%;
  height: 389px;
  overflow: hidden;
}

.hero__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: scaleY(-1);
}

@media (max-width: 768px) {
  .hero__bg {
    transform: none;
  }
}

.hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero__content {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 1120px;
  height: 100%;
  padding-top: 100px;
  padding-left: 24px;
  padding-right: 24px;
  z-index: 1;
}

.hero__header {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 1000px;
  margin-top: 30px;
}

.hero__title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
}

.hero__icon {
  flex-shrink: 0;
  width: 17px;
  height: 52px;
}

.hero__icon img {
  width: 100%;
  height: 100%;
}

.hero__iconSp {
  display: none;
}

.hero__titleText {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 1.44px;
  color: #fff;
}

.hero__description {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
  color: #fff;
  margin: 0;
}

.hero__descriptionSp {
  display: none;
}

@media (max-width: 768px) {
  .hero {
    height: 20.071rem; /* 281px - Figma仕様 */
  }

  .hero__bg img {
    object-fit: fill;
  }

  .hero__content {
    left: 0;
    transform: none;
    max-width: none;
    padding-top: 4.5rem;
    /* 63px */
    padding-left: 1.143rem; /* 16px - Figma仕様 */
    padding-right: 1.143rem; /* 16px - Figma仕様 */
  }

  .hero__header {
    gap: 0.714rem;
    /* 10px */
    width: 24.5rem;
    /* 343px */
    margin-top: 0;
    padding-left: 0;
  }

  .hero__title {
    gap: 0.429rem;
    /* 6px */
    height: 2.071rem;
    /* 29px */
  }

  .hero__icon {
    width: 0.929rem;
    /* 13px */
    height: 3.714rem;
    /* 52px */
  }

  .hero__iconPc {
    display: none;
  }

  .hero__iconSp {
    display: block;
  }

  .hero__titleText {
    font-size: 1.714rem;
    /* 24px */
    letter-spacing: 0.96px;
  }

  .hero__description {
    font-size: 1rem;
    /* 14px */
    font-weight: 700;
  }

  .hero__descriptionPc {
    display: none;
  }

  .hero__descriptionSp {
    display: block;
  }
}

/* ==========================================================================
   Archive - 一覧ページ
   PC: top 412px, left 158px, width 1124px
   SP: top 319px, width 375px
   ========================================================================== */
.caseArchive {
  padding: min(1.5972vw, 23px) 0 0 0;
}

@media (max-width: 768px) {
  .caseArchive {
    padding: 2.6886rem 0 0 0; /* 37.64px */
  }
}

/* ==========================================================================
   詳細ページヘッダー（背景+パンくず）
   PC: 背景高さ376px、top -168pxで下向きの弧を表示
   SP: 背景高さ168px、top -9pxで下向きの弧を表示
   ========================================================================== */
.caseSingleHero {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.caseSingleHero__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.caseSingleHero__bg img {
  width: 100%;
}

/* PC版: 769px以上 - 高さ固定、横のみ広がる */
@media (min-width: 769px) {
  .caseSingleHero {
    height: 208px;
  }

  .caseSingleHero__bg {
    height: 208px;
  }

  .caseSingleHero__bg img {
    width: 100%;
    height: 208px;
    object-fit: fill;
  }
}

.caseSingleHero__content {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 1120px;
  height: 100%;
  padding-top: 100px;
  padding-left: min(1.6667vw, 24px);
  padding-right: min(1.6667vw, 24px);
  z-index: 1;
}

@media (max-width: 768px) {
  .caseSingleHero {
    height: 10.714rem;
    /* 150px */
  }

  .caseSingleHero__bg {
    height: 100%;
  }

  .caseSingleHero__bg img {
    height: 100%;
    object-fit: cover;
  }

  .caseSingleHero__content {
    left: 0;
    transform: none;
    max-width: none;
    padding-top: 4.5rem;
    /* 63px */
    padding-left: 1.429rem;
    /* 20px */
    padding-right: 1.429rem;
    /* 20px */
  }
}

/* ==========================================================================
   絞り込み検索アコーディオン
   1440px基準: 1440px以上は固定、1440px以下は比率を保って縮小
   計算式: px値 / 1440 * 100 = vw値
   ========================================================================== */

.caseFilterAccordion {
  margin-bottom: min(3.4722vw, 50px);
  background: #fff;
  border: min(0.2083vw, 3px) solid #f1f6e8;
  border-radius: min(1.0417vw, 15px);
  overflow: hidden;
}

@media (max-width: 768px) {
  .caseFilterAccordion {
    margin-bottom: 1.875rem;
    border: 0.1875rem solid #f1f6e8;
    border-radius: 0.9375rem;
  }
}

.caseFilterAccordion__toggle {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: min(2.0833vw, 30px);
  background: #fff;
  border: 0;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.6667vw, 24px);
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #3f4f5f;
  cursor: pointer;
  transition: background 0.3s;
}

@media (max-width: 768px) {
  .caseFilterAccordion__toggle {
    padding: 0.9375rem 1.875rem;
    font-size: 1.2857rem;
  }
}

.caseFilterAccordion__toggle:hover {
  background: #fafafa;
}

.caseFilterAccordion__icon {
  width: min(1.1806vw, 17px);
  height: min(0.625vw, 9px);
  flex-shrink: 0;
  color: #3f4f5f;
  transition: transform 0.3s ease;
}

@media (max-width: 768px) {
  .caseFilterAccordion__icon {
    width: 0.9375rem;
    height: 0.4375rem;
  }
}

.caseFilterAccordion.is-open .caseFilterAccordion__icon {
  transform: rotate(180deg);
}

.caseFilterAccordion__content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.caseFilterAccordion.is-open .caseFilterAccordion__content {
  max-height: min(55.5556vw, 800px);
}

@media (max-width: 768px) {
  .caseFilterAccordion.is-open .caseFilterAccordion__content {
    max-height: 35rem; /* 490px - SP用に十分な高さを確保 */
  }
}

/* 絞り込みフォーム */
.caseFilter {
  padding: 0 min(2.0833vw, 30px) min(2.0833vw, 30px);
}

@media (max-width: 768px) {
  .caseFilter {
    padding: 0 1.875rem 1.25rem;
  }
}

.caseFilter__divider {
  width: 100%;
  height: 1px;
  background: #e1e2eb;
  margin-bottom: min(2.0833vw, 30px);
}

@media (max-width: 768px) {
  .caseFilter__divider {
    margin-bottom: 0.625rem;
  }
}

.caseFilter__group {
  margin-bottom: min(1.0417vw, 15px);
}

.caseFilter__group:last-of-type {
  margin-bottom: 0;
}

.caseFilter__label {
  display: flex;
  align-items: center;
  gap: min(0.3472vw, 5px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.3889vw, 20px);
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #3f4f5f;
  margin: 0 0 min(0.6944vw, 10px) 0;
}

@media (max-width: 768px) {
  .caseFilter__label {
    font-size: 1.1429rem;
    gap: 0.3125rem;
    margin-bottom: 0.625rem;
  }
}

.caseFilter__dot {
  display: inline-block;
  width: min(0.7639vw, 11px);
  height: min(0.7639vw, 11px);
  background: #00ad6f;
  border-radius: 50%;
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .caseFilter__dot {
    width: 0.5625rem;
    height: 0.5625rem;
  }
}

.caseFilter__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: min(0.6944vw, 10px);
}

.caseFilter__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: min(0.3472vw, 5px) min(1.0417vw, 15px);
  background: #fff;
  border: 1px solid #3f4f5f;
  border-radius: min(3.4722vw, 50px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: 1.5;
  color: #3f4f5f;
  cursor: pointer;
  transition: all 0.2s ease;
}

@media (max-width: 768px) {
  .caseFilter__buttons {
    gap: 0.714rem; /* 10px */
  }

  .caseFilter__button {
    padding: 0.125rem 0.6875rem;
    font-size: 0.8571rem;
    line-height: 1.75;
    border-radius: 3.125rem;
  }
}

.caseFilter__button:hover {
  background: #3f4f5f;
  color: #fff;
}

.caseFilter__button.is-active {
  background: #3f4f5f;
  border-color: #3f4f5f;
  color: #fff;
}

.caseFilter__button.is-disabled {
  opacity: 0.4;
  pointer-events: none;
  cursor: not-allowed;
}

.caseFilter__actions {
  display: flex;
  justify-content: center;
  margin-top: min(2.0833vw, 30px);
}

@media (max-width: 768px) {
  .caseFilter__actions {
    margin-top: 1.7857rem; /* 25px */
  }
}

.caseFilter__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: min(13.9583vw, 201px);
  height: min(3.4722vw, 50px);
  padding: min(0.6944vw, 10px);
  background: #00c17c;
  color: #fff;
  border: 0;
  border-radius: min(0.6944vw, 10px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 18px);
  font-weight: 700;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: background 0.3s;
}

@media (max-width: 768px) {
  .caseFilter__submit {
    width: 15.786rem; /* 221px */
    max-width: calc(100% - 3.75rem); /* 親のpadding分を引く */
    height: 3.125rem;
    padding: 0.625rem 1rem;
    font-size: 1.125rem;
    border-radius: 0.625rem;
  }
}

.caseFilter__submit:hover {
  background: #00a96b;
}

/* ==========================================================================
   Case Results & List
   1440px基準: 1440px以上は固定、1440px以下は比率を保って縮小
   計算式: px値 / 1440 * 100 = vw値
   SP基準: 375px
   ========================================================================== */

.caseResults {
  margin-top: 0;
  display: flex;
  flex-direction: column;
  gap: min(1.3889vw, 20px);
}

.caseResults__count {
  display: flex;
  align-items: center;
  gap: 0;
  margin: 0;
  color: #3f4f5f;
}

.caseResults__number {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.caseResults__unit {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: -0.0108em;
}

.caseResults__text {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.caseResults__empty {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.1111vw, 16px);
  font-weight: 500;
  line-height: 1.5;
  color: #3f4f5f;
  margin: 0;
}

.caseList {
  display: grid;
  grid-template-columns: repeat(3, min(24.7222vw, 356px));
  gap: min(1.9444vw, 28px);
  justify-content: flex-start;
}

@media (max-width: 768px) {
  .caseResults {
    margin-top: 0;
    gap: 2.857rem; /* 40px */
  }

  .caseResults__number {
    font-size: 1.286rem;
    /* 18px */
  }

  .caseResults__unit {
    font-size: 1rem;
    /* 14px */
  }

  .caseResults__text {
    font-size: 1rem;
    /* 14px */
  }

  .caseResults__empty {
    font-size: 1rem;
  }

  .caseList {
    grid-template-columns: 1fr;
    gap: 1.786rem; /* 25px */
  }
}

.caseCard {
  margin: 0;
}

@media (max-width: 768px) {
  .caseCard {
    width: 100%;
  }
}

.caseCard a {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  transition: opacity 0.3s;
}

.caseCard a:hover {
  opacity: 0.8;
}

.caseCard__thumbnailWrapper {
  width: 100%;
  overflow: hidden;
  border-radius: min(1.3889vw, 20px) min(1.3889vw, 20px) 0 0;
  border: 1px solid #d2d7db;
  border-bottom: none;
  box-sizing: border-box;
}

@media (min-width: 769px) {
  .caseCard__thumbnailWrapper {
    width: min(24.7222vw, 356px);
  }
}

@media (max-width: 768px) {
  .caseCard__thumbnailWrapper {
    width: 100%;
    border-radius: 1.25rem 1.25rem 0 0;
  }
}

.caseCard a:hover .caseCard__thumbnailWrapper {
  border-color: #e1e2eb;
}

.caseCard__thumbnail {
  width: 100%;
  aspect-ratio: 356 / 210;
  overflow: hidden;
  border-radius: min(1.3889vw, 20px) min(1.3889vw, 20px) 0 0;
}

@media (max-width: 768px) {
  .caseCard__thumbnail {
    aspect-ratio: 356 / 210;
    border-radius: 1.25rem 1.25rem 0 0;
  }
}

.caseCard__thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.caseCard__content {
  width: 100%;
  background: #fff;
  border: 1px solid #d2d7db;
  border-top: none;
  border-radius: 0 0 min(1.3889vw, 20px) min(1.3889vw, 20px);
  padding: min(1.0417vw, 15px);
  display: flex;
  flex-direction: column;
  gap: min(0.6944vw, 10px);
  box-sizing: border-box;
}

@media (min-width: 769px) {
  .caseCard__content {
    width: min(24.7222vw, 356px);
  }
}

@media (max-width: 768px) {
  .caseCard__content {
    width: 100%;
    border-radius: 0 0 1.25rem 1.25rem;
    padding: 0.9375rem;
    gap: 0.625rem;
  }
}

.caseCard a:hover .caseCard__content {
  border-color: #e1e2eb;
}

.caseCard__logo {
  width: min(8.5417vw, 123px);
  height: min(3.1944vw, 46px);
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  .caseCard__logo {
    width: 7.6875rem;
    height: 2.875rem;
  }
}

.caseCard__logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

.caseCard__logoPlaceholder {
  background: #f4f4f4;
}

.caseCard__logoPlaceholder p {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.1111vw, 16px);
  font-weight: 700;
  line-height: 1.8;
  color: #ccc;
  margin: 0;
  text-align: center;
}

@media (max-width: 768px) {
  .caseCard__logoPlaceholder p {
    font-size: 1rem;
  }
}

.caseCard__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.1111vw, 16px);
  font-weight: 700;
  line-height: min(1.4583vw, 21px);
  color: #3f4f5f;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  max-height: min(2.8472vw, 41px);
}

@media (max-width: 768px) {
  .caseCard__title {
    font-size: 1rem;
    line-height: 1.3125rem;
    max-height: 2.5625rem;
  }
}

.caseCard__company {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 700;
  line-height: min(1.4583vw, 21px);
  color: #3f4f5f;
  margin: 0;
}

@media (max-width: 768px) {
  .caseCard__company {
    font-size: 0.875rem;
    line-height: 1.3125rem;
  }
}

.caseCard__meta {
  display: flex;
  flex-direction: column;
  gap: min(0.2778vw, 4px);
  margin: 0;
}

@media (max-width: 768px) {
  .caseCard__meta {
    gap: 0.25rem;
  }
}

.caseCard__metaItem {
  display: flex;
  align-items: center;
}

.caseCard__metaItem dt {
  width: min(4.5139vw, 65px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 700;
  line-height: min(1.4583vw, 21px);
  color: #00ad6f;
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .caseCard__metaItem dt {
    width: 4.0625rem;
    font-size: 0.875rem;
    line-height: 1.3125rem;
  }
}

.caseCard__metaItem dd {
  flex: 1;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: min(1.4583vw, 21px);
  color: #3f4f5f;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .caseCard__metaItem dd {
    font-size: 0.875rem;
    line-height: 1.3125rem;
  }
}

/* ==========================================================================
   Pagination
   1440px基準: 1440px以上は固定、1440px以下は比率を保って縮小
   計算式: px値 / 1440 * 100 = vw値
   SP基準: 375px
   ========================================================================== */

.casePagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(0.6944vw, 10px);
}

@media (max-width: 768px) {
  .casePagination {
    gap: 0.5rem;
  }
}

.casePagination__arrow,
.casePagination__number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(3.1944vw, 46px);
  height: min(3.1944vw, 46px);
  border-radius: 50%;
  border: 1px solid #d2d7db;
  background: #fff;
  text-decoration: none;
  color: #3f4f5f;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.0417vw, 15px);
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.2;
  transition: all 0.3s;
}

@media (max-width: 768px) {
  .casePagination__arrow,
  .casePagination__number {
    width: 2.875rem;
    height: 2.875rem;
    font-size: 0.9375rem;
  }
}

.casePagination__arrow {
  padding: 0;
}

.casePagination__arrow svg {
  width: min(0.4167vw, 6px);
  height: min(0.6944vw, 10px);
}

@media (max-width: 768px) {
  .casePagination__arrow svg {
    width: 0.375rem;
    height: 0.625rem;
  }
}

.casePagination__arrow:hover,
.casePagination__number:hover {
  background: #e5f5ed;
  border-color: #e5f5ed;
  text-decoration: none;
}

.casePagination__arrowDisabled {
  background: #d2d7db;
  border-color: #d2d7db;
  color: #3f4f5f;
  cursor: not-allowed;
  pointer-events: none;
}

.casePagination__numberCurrent {
  background: #00c17c; /* Figma仕様 */
  border-color: #00c17c; /* Figma仕様 */
  color: #fff; /* Figma仕様 */
  font-weight: 400;
  pointer-events: none;
}

.casePagination__dots {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 4px;
  color: #3f4f5f;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.2em;
}


/* ==========================================================================
   Single - 詳細ページ
   PC基準: 1440px / SP基準: 375px (rem = 14px)
   Figma PC detail: node-id=1878-59186
   2カラムレイアウト: 左701px + gap73px + 右350px = 1124px
   ========================================================================== */

/* 詳細ページではサイト全体の背景画像を非表示 */
body.single {
  background-image: none;
  background-color: #fff;
}

.caseSingle {
  padding: 0;
  padding-top: min(2.0833vw, 30px);
  background: transparent;
}

/* 2カラムコンテナ */
.caseSingle__container {
  display: flex;
  gap: min(5.0694vw, 73px);
  max-width: min(78.0556vw, 1124px);
  margin: 0 auto;
  padding: 0;
  align-items: stretch;
}

/* 左カラム：記事 */
.caseArticle {
  display: flex;
  flex-direction: column;
  gap: min(4.8611vw, 70px);
  width: min(48.6806vw, 701px);
  flex-shrink: 0;
}

/* 記事ヘッダー+サムネイル+サマリー+目次をグループ化 */
.caseArticle__intro {
  display: flex;
  flex-direction: column;
  gap: min(1.3889vw, 20px);
}

/* 右カラム：サイドバー */
.caseSidebar {
  width: min(24.3056vw, 350px);
  flex-shrink: 0;
  display: block;
}

/* サイドバー内の企業情報ボックス */
.caseSidebar > .sidebarBox {
  margin-bottom: min(2.0833vw, 30px);
}

/* サイドバーのスティッキーエリア（バナー以下を固定） */
.caseSidebar__sticky {
  position: sticky;
  top: min(6.9444vw, 100px);
  display: flex;
  flex-direction: column;
  gap: min(2.0833vw, 30px);
}

/* ヘッダー部分 */
.caseHeader {
  display: flex;
  flex-direction: column;
  gap: min(0.6944vw, 10px);
  width: 100%;
}

.caseHeader__company {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 16px);
  font-weight: 700;
  line-height: 1.5;
  color: #3f4f5f;
  margin: 0;
}

.caseHeader__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.875vw, 24px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #3f4f5f;
  margin: 0;
}

.caseHeader__date {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 16px);
  font-weight: 400;
  line-height: 1.5;
  color: #3f4f5f;
  margin: 0;
}

/* アイキャッチ画像 */
.caseThumbnail {
  width: 100%;
}

.caseThumbnail img {
  width: 100%;
  height: auto;
  border-radius: min(1.5625vw, 20px);
  display: block;
}

/* 導入前の課題・導入後の効果エリア */
.caseSummary {
  display: flex;
  flex-direction: column;
  gap: min(1.171875vw, 15px);
  padding: min(1.171875vw, 15px);
  background: #f2f3f5;
  border-radius: min(1.5625vw, 20px);
}

.caseSummary__box {
  background: #fff;
  border-radius: min(0.78125vw, 10px);
  padding: min(1.171875vw, 15px) min(1.5625vw, 20px);
}

.caseSummary__header {
  margin-bottom: min(0.78125vw, 10px);
  padding-bottom: min(0.625vw, 8px);
  border-bottom: 1px solid #e1e2eb;
}

.caseSummary__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 16px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #3f4f5f;
  margin: 0;
}

.caseSummary__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.caseSummary__item {
  display: flex;
  align-items: flex-start;
}

.caseSummary__icon {
  flex-shrink: 0;
  width: min(1.328125vw, 17px);
  height: min(2.03125vw, 26px);
  margin-right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.caseSummary__icon img {
  width: min(1.09375vw, 14px);
  height: min(1.015625vw, 13px);
}

.caseSummary__text {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.09375vw, 14px);
  font-weight: 500;
  line-height: 1.8;
  color: #3f4f5f;
}

/* SP（モバイル）レスポンシブ */
@media (max-width: 768px) {
  .caseSingle {
    padding: 0;
    padding-top: 1.6886rem; /* 23.64px - ヘッダーとコンテンツの余白 */
  }

  .caseSingle__container {
    flex-direction: column;
    max-width: 100%;
    gap: 0;
    padding: 0 1.143rem;
    /* 16px */
  }

  .caseArticle {
    width: 100%;
    gap: 3.571rem; /* 50px - セクション間 */
  }

  .caseArticle__intro {
    gap: 1.429rem; /* 20px - ヘッダー/サムネイル/サマリー/目次間 */
  }

  .caseSidebar {
    display: none;
  }

  .caseHeader {
    gap: 0.714rem;
    /* 10px - Figma値 */
  }

  .caseHeader__company {
    font-size: 1.143rem;
    /* 16px */
  }

  .caseHeader__title {
    font-size: 1.429rem;
    /* 20px */
    line-height: 1.4;
  }

  .caseHeader__date {
    font-size: 1.143rem;
    /* 16px */
  }

  .caseThumbnail img {
    border-radius: 1.071rem;
    /* 15px */
  }

  .caseSummary {
    gap: 0.714rem;
    /* 10px */
    padding: 0.714rem;
    /* 10px */
    border-radius: 1.071rem;
    /* 15px */
  }

  .caseSummary__box {
    padding: 0.714rem;
    /* 10px */
    border-radius: 0.714rem;
    /* 10px */
  }

  .caseSummary__header {
    margin-bottom: 0.714rem;
    /* 10px */
    padding-bottom: 0.571rem;
    /* 8px */
    border-bottom: 1px solid #e1e2eb;
  }

  .caseSummary__title {
    font-size: 1.143rem;
    /* 16px */
  }

  .caseSummary__list {
    gap: 0.714rem;
    /* 10px */
  }

  .caseSummary__item {
    align-items: flex-start;
    gap: 0;
  }

  .caseSummary__icon {
    width: 1.357rem;
    /* 19px */
    height: 1.357rem;
    /* 19px */
    margin-right: 0;
  }

  .caseSummary__icon img {
    width: 1rem;
    /* 14px */
    height: 0.929rem;
    /* 13px */
  }

  .caseSummary__text {
    font-size: 1rem;
    /* 14px */
    line-height: 1.4;
  }
}

/* 本文 */
.caseContent {
  font-family: 'Zen Maru Gothic', sans-serif;
  color: #3f4f5f;
  display: flex;
  flex-direction: column;
  gap: min(2.0833vw, 30px);
}

/* H2の直後のH3は間隔を詰める */
.caseContent h2 + h3 {
  margin-top: calc(min(1.3889vw, 20px) - min(2.0833vw, 30px));
}

/* H3の直後のPは間隔を詰める (20pxに) */
.caseContent h3 + p {
  margin-top: calc(min(1.3889vw, 20px) - min(2.0833vw, 30px));
}

/* Pの連続は間隔を詰める (5pxに) */
.caseContent p + p {
  margin-top: calc(min(0.3472vw, 5px) - min(2.0833vw, 30px));
}

.caseContent h2 {
  font-size: min(1.5278vw, 22px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0;
  margin: 0;
  padding-bottom: min(0.6944vw, 10px);
  border-bottom: 2px solid #00ad6f;
}

.caseContent h2:first-child {
  margin-top: 0;
}

.caseContent h3 {
  font-size: min(1.3889vw, 20px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
  margin: 0;
}

.caseContent p {
  font-size: min(1.25vw, 16px);
  font-weight: 500;
  line-height: 1.7;
  margin: 0;
}

.caseContent ul,
.caseContent ol {
  font-size: min(1.09375vw, 14px);
  font-weight: 500;
  line-height: 1.8;
  margin: 0;
  padding-left: 1.5em;
}

.caseContent li {
  margin-bottom: min(0.390625vw, 5px);
}

.caseContent img {
  border-radius: min(1.3889vw, 20px);
  margin: 0;
  width: 100%;
  height: auto;
}

/* SP本文レスポンシブ */
@media (max-width: 768px) {
  .caseContent {
    gap: 2.143rem; /* 30px */
  }

  /* SP版: H2の直後のH3は間隔を詰める (10pxに) */
  .caseContent h2 + h3 {
    margin-top: calc(0.714rem - 2.143rem);
  }

  /* SP版: H3の直後のPは間隔を詰める (10pxに) */
  .caseContent h3 + p {
    margin-top: calc(0.714rem - 2.143rem);
  }

  /* SP版: Pの連続は間隔を詰める (5pxに) */
  .caseContent p + p {
    margin-top: calc(0.357rem - 2.143rem);
  }

  .caseContent h2 {
    font-size: 1.286rem; /* 18px */
    line-height: 1.3;
    margin: 0;
    padding-bottom: 0.714rem; /* 10px */
  }

  .caseContent h2:first-child {
    margin-top: 0;
  }

  .caseContent h3 {
    font-size: 1.143rem; /* 16px */
    line-height: 1.4;
    margin: 0;
  }

  .caseContent p {
    font-size: 1rem; /* 14px */
    line-height: 1.5;
    margin: 0;
  }

  .caseContent ul,
  .caseContent ol {
    font-size: 1rem; /* 14px */
    line-height: 1.6;
    margin: 0;
  }

  .caseContent li {
    margin-bottom: 0.286rem; /* 4px */
  }

  .caseContent img {
    border-radius: 1.071rem; /* 15px */
    margin: 0;
  }
}

/* サイドバー - ボックス共通 */
.sidebarBox {
  border: 1px solid #e1e2eb;
  border-radius: min(0.6944vw, 10px);
  padding: min(1.3889vw, 20px);
}

.sidebarBox__header {
  display: flex;
  align-items: center;
  gap: min(0.3472vw, 5px);
  margin-bottom: min(1.0417vw, 15px);
}

.sidebarBox__dot {
  width: min(0.7639vw, 11px);
  height: min(0.7639vw, 11px);
  background: #00ad6f;
  border-radius: 50%;
  flex-shrink: 0;
}

.sidebarBox__heading {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.3889vw, 20px);
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.04em;
  color: #3f4f5f;
}

.sidebarBox__body {
  display: flex;
  flex-direction: column;
  gap: min(0.6944vw, 10px);
}

.sidebarBox__item {
  display: flex;
  flex-direction: column;
  gap: min(0.2778vw, 4px);
}

.sidebarBox__label {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 700;
  line-height: 1.3;
  color: #00ad6f;
  margin: 0;
}

.sidebarBox__value {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.1111vw, 16px);
  font-weight: 500;
  line-height: 1.3;
  color: #3f4f5f;
  margin: 0;
}

.sidebarBox__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: min(0.3472vw, 5px) min(1.0417vw, 15px);
  background: #fff;
  border: 1px solid #3f4f5f;
  border-radius: min(3.4722vw, 50px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: 1.5;
  color: #3f4f5f;
  width: fit-content;
  transition: background 0.3s, color 0.3s;
}

a.sidebarBox__tag:hover {
  background: #3f4f5f;
  color: #fff;
  text-decoration: none;
}

.sidebarBox__tags {
  display: flex;
  flex-wrap: wrap;
  gap: min(0.6944vw, 10px);
}

.sidebarBox__tagLink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: min(0.3472vw, 5px) min(1.0417vw, 15px);
  background: #fff;
  border: 1px solid #3f4f5f;
  border-radius: min(3.4722vw, 50px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 500;
  line-height: 1.5;
  color: #3f4f5f;
  transition: all 0.3s;
  text-decoration: none;
}

.sidebarBox__tagLink:hover {
  background: #3f4f5f;
  color: #fff;
  text-decoration: none;
}

/* サイドバー - ホワイトペーパーバナー */
.sidebarWpBanner {
  display: block;
  position: relative;
  width: 100%;
  height: min(11.1806vw, 161px);
  border: 2px solid #13c4ce;
  border-radius: min(0.7228vw, 10.409px);
  overflow: hidden;
  text-decoration: none;
  background: linear-gradient(-55.969deg, rgb(227, 255, 218) 12.163%, rgb(237, 255, 190) 87.837%);
}

.sidebarWpBanner__illust {
  position: absolute;
  top: min(1.875vw, 27px);
  left: min(16.9444vw, 244px);
  width: min(7.9167vw, 114px);
  height: min(22.6753vw, 326.525px);
  background: url('images/img_sidebar_wp_illust.svg') center/contain no-repeat;
  pointer-events: none;
}

.sidebarWpBanner__content {
  position: absolute;
  top: min(1.1806vw, 17px);
  left: min(1.0417vw, 15px);
  width: min(18.6111vw, 268px);
  display: flex;
  flex-direction: column;
  gap: min(0.2778vw, 4px);
}

.sidebarWpBanner__dots {
  position: absolute;
  top: min(2.0139vw, 29px);
  left: min(1.5972vw, 23px);
  width: min(4.0625vw, 58.5px);
  height: min(0.2083vw, 3px);
  background: url('images/img_sidebar_wp_dots.svg') left center/contain no-repeat;
}

.sidebarWpBanner__dots span {
  display: none;
}

.sidebarWpBanner__subtitle {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 18px);
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: #3f4f5f;
  margin: 0;
}

.sidebarWpBanner__badges {
  display: flex;
  align-items: center;
  gap: min(0.3472vw, 5px);
}

.sidebarWpBanner__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: min(0.1389vw, 2px) min(0.6944vw, 10px);
  border-radius: min(2.7778vw, 40px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.1111vw, 16px);
  font-weight: 700;
  line-height: 1.65;
  color: #fff;
}

.sidebarWpBanner__badgeYellow {
  background: #edb937;
}

.sidebarWpBanner__badgeGreen {
  background: #21c188;
}

.sidebarWpBanner__no {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 18px);
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: #3f4f5f;
}

.sidebarWpBanner__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.8056vw, 26px);
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.15em;
  color: #3f4f5f;
  margin: 0;
}

.sidebarWpBanner__footer {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: min(1.8056vw, 26px);
  background: #13c4ce;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(0.6944vw, 10px);
}

.sidebarWpBanner__footerText {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.0417vw, 15px);
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: #fff;
}

.sidebarWpBanner__footerArrow {
  display: flex;
  align-items: center;
  justify-content: center;
}

.sidebarWpBanner__footerArrow svg {
  width: min(1.84vw, 15.61px);
  height: min(1.84vw, 15.61px);
}

/* サイドバー - 資料ダウンロードバナー */
.sidebarDlBanner {
  display: block;
  position: relative;
  width: 100%;
  height: min(11.1806vw, 161px);
  border: 2px solid #13c4ce;
  border-radius: min(0.7228vw, 10.409px);
  overflow: hidden;
  text-decoration: none;
  background: #34424f;
}

.sidebarDlBanner__bg {
  position: absolute;
  inset: 0;
  background: url('images/img_cta_dl_bg.webp') center/cover no-repeat;
}

.sidebarDlBanner__content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: min(0.3614vw, 5.204px);
  z-index: 1;
}

.sidebarDlBanner__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: min(0.1807vw, 2.602px) min(0.7228vw, 10.409px);
  background: #f2f3f5;
  border-radius: min(0.4167vw, 6px) min(0.7361vw, 10.6px) min(0.7361vw, 10.6px) 0;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.6326vw, 9.108px);
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: 0.04em;
  color: #03afb9;
}

.sidebarDlBanner__text {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.4457vw, 20.818px);
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: #fff;
  width: max-content;
}

.sidebarDlBanner__arrow {
  position: absolute;
  bottom: min(-0.0236vw, -0.34px);
  right: min(-0.0236vw, -0.34px);
  width: min(1.807vw, 26.022px);
  height: min(1.807vw, 26.022px);
  background: #13c4ce;
  border-radius: 0 0 0 min(0.7228vw, 10.409px);
  display: flex;
  align-items: center;
  justify-content: center;
  transform: rotate(90deg);
  z-index: 2;
}

.sidebarDlBanner__arrow svg {
  width: min(1.0843vw, 15.613px);
  height: min(1.0843vw, 15.613px);
  transform: rotate(-90deg);
}

/* サイドバー - お問い合わせボックス */
.sidebarContact {
  position: relative;
  width: 100%;
  height: min(12.7778vw, 184px);
  border-radius: min(0.6944vw, 10px);
  overflow: hidden;
}

.sidebarContact__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-image: url('images/img_contact_bnr_bg_pc.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.sidebarContact__bg::before,
.sidebarContact__bg::after {
  display: none;
}

.sidebarContact__bg::before {
  width: min(18.4611vw, 266px);
  height: min(18.4611vw, 266px);
  left: min(-11.4583vw, -165px);
  top: min(-4.6528vw, -67px);
  background: radial-gradient(circle, rgba(197, 241, 183, 0.5) 0%, transparent 70%);
}

.sidebarContact__bg::after {
  width: min(12.3646vw, 178.05px);
  height: min(12.3646vw, 178.05px);
  right: min(-4.0139vw, -57.82px);
  top: min(-2.1528vw, -31px);
  background: radial-gradient(circle, rgba(200, 240, 180, 0.3) 0%, transparent 70%);
}

.sidebarContact__content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: min(0.9722vw, 14px);
  width: min(18.3333vw, 264px);
}

.sidebarContact__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.5278vw, 22px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.04em;
  text-align: center;
  color: #00ad6f;
  margin: 0;
}

.sidebarContact__desc {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.1111vw, 16px);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.04em;
  text-align: center;
  color: #3f4f5f;
  margin: 0;
}

.sidebarContact__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: min(3.4722vw, 50px);
  background: #00c17c;
  border: 2px solid #fff;
  border-radius: min(0.8333vw, 12px);
  box-shadow: 0 min(0.3472vw, 5px) min(1.0417vw, 15px) rgba(44, 69, 125, 0.2);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #fff;
  text-decoration: none;
  transition: all 0.3s;
}

.sidebarContact__btn:hover {
  background: #00a868;
  text-decoration: none;
}

/* 戻るリンク */
.caseBack {
  margin-top: min(2.34375vw, 30px);
  text-align: center;
}

.caseBack a {
  display: inline-flex;
  align-items: center;
  gap: min(0.390625vw, 5px);
  padding: min(0.78125vw, 10px) min(1.5625vw, 20px);
  background: #fff;
  border: 1px solid #3f4f5f;
  border-radius: min(3.125vw, 40px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.09375vw, 14px);
  font-weight: 500;
  color: #3f4f5f;
  transition: all 0.3s;
}

.caseBack a:hover {
  background: #f5f5f5;
  text-decoration: none;
}

/* SP戻るリンク */
@media (max-width: 768px) {
  .caseBack {
    margin-top: 1.429rem;
    /* 20px */
  }

  .caseBack a {
    padding: 0.714rem 1.143rem;
    /* 10px 16px */
    font-size: 1rem;
    /* 14px */
    border-radius: 2.857rem;
    /* 40px */
  }
}

/* 企業情報 */
.caseCompanyInfo {
  border: 1px solid #e1e2eb;
  border-radius: min(0.78125vw, 10px);
  padding: min(1.5625vw, 20px);
  margin-top: min(3.125vw, 40px);
}

.caseCompanyInfo__header {
  display: flex;
  align-items: center;
  gap: min(0.390625vw, 5px);
  margin-bottom: min(1.171875vw, 15px);
}

.caseCompanyInfo__dot {
  width: min(0.859375vw, 11px);
  height: min(0.859375vw, 11px);
  background: #00ad6f;
  border-radius: 50%;
  flex-shrink: 0;
}

.caseCompanyInfo__heading {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.5625vw, 20px);
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.04em;
  color: #3f4f5f;
}

.caseCompanyInfo__body {
  display: flex;
  flex-direction: column;
  gap: min(0.78125vw, 10px);
}

.caseCompanyInfo__item {
  display: flex;
  flex-direction: column;
  gap: min(0.3125vw, 4px);
}

.caseCompanyInfo__label {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.09375vw, 14px);
  font-weight: 700;
  line-height: 1.3;
  color: #00ad6f;
  margin: 0;
}

.caseCompanyInfo__value {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 16px);
  font-weight: 500;
  line-height: 1.3;
  color: #3f4f5f;
  margin: 0;
}

.caseCompanyInfo__item:has(.caseCompanyInfo__tag) {
  gap: min(0.625vw, 8px);
}

.caseCompanyInfo__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: min(0.390625vw, 5px) min(1.171875vw, 15px);
  background: #fff;
  border: 1px solid #3f4f5f;
  border-radius: min(3.90625vw, 50px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.09375vw, 14px);
  font-weight: 500;
  line-height: 1.5;
  color: #3f4f5f;
  width: fit-content;
}

/* SP 企業情報 */
@media (max-width: 768px) {
  .caseCompanyInfo {
    border-radius: 0.714rem;
    /* 10px */
    padding: 1.071rem;
    /* 15px */
    margin-top: 2.143rem;
    /* 30px */
  }

  .caseCompanyInfo__header {
    gap: 0.357rem;
    /* 5px */
    margin-bottom: 1.071rem;
    /* 15px */
  }

  .caseCompanyInfo__dot {
    width: 0.643rem;
    /* 9px */
    height: 0.643rem;
    /* 9px */
  }

  .caseCompanyInfo__heading {
    font-size: 1.143rem;
    /* 16px */
    letter-spacing: 0.04em;
  }

  .caseCompanyInfo__body {
    gap: 0.714rem;
    /* 10px */
  }

  .caseCompanyInfo__item {
    gap: 0.286rem;
    /* 4px */
  }

  .caseCompanyInfo__label {
    font-size: 1rem;
    /* 14px */
  }

  .caseCompanyInfo__value {
    font-size: 1rem;
    /* 14px */
  }

  .caseCompanyInfo__item:has(.caseCompanyInfo__tag) {
    gap: 0.571rem;
    /* 8px */
  }

  .caseCompanyInfo__tag {
    padding: 0.143rem 0.786rem;
    /* 2px 11px */
    border-radius: 3.571rem;
    /* 50px */
    font-size: 0.857rem;
    /* 12px */
  }
}

/* ========================================
   資料ダウンロードバナー（新規実装）
   PC: 700×245px (Figma準拠)
   SP: 343×289px (24.5rem×20.643rem)
   ======================================== */

/* PC版ベース */
.dlBanner {
  display: block;
  position: relative;
  width: min(48.611vw, 700px);
  height: min(17.014vw, 245px);
  margin: 0 auto;
  border-radius: min(1.389vw, 20px);
  overflow: hidden;
  text-decoration: none;
}

.dlBanner:hover {
  text-decoration: none;
}

.dlBanner:hover .dlBanner__btn {
  background: #ff9f67;
}

/* 背景グラデーション */
.dlBanner__bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(-49.67deg, #c5f1b7 22.12%, #00c17c 51.19%, #00ada7 73.9%);
}

/* 装飾：左上の円 */
.dlBanner__decorationCircle {
  position: absolute;
  top: max(-4.375vw, -63px);
  left: max(-4.097vw, -59px);
  width: min(15.833vw, 228px);
  height: min(15.833vw, 228px);
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
}

/* 装飾：右下の波 */
.dlBanner__decorationWave {
  position: absolute;
  bottom: max(-9.722vw, -140px);
  right: max(-16.667vw, -240px);
  width: min(34.722vw, 500px);
  height: min(34.722vw, 500px);
  background: rgba(255, 255, 255, 0.15);
  border-radius: 50%;
}

/* PC：コンテンツエリア（左側） */
.dlBanner__content {
  position: absolute;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: min(1.181vw, 17px);
  top: min(2.708vw, 39px);
  left: min(1.875vw, 27px);
  width: min(27.778vw, 400px);
}

/* タイトル */
.dlBanner__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.528vw, 22px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.04em;
  color: #fff;
  margin: 0;
  white-space: nowrap;
}

/* 説明文コンテナ */
.dlBanner__desc {
  display: block;
}

/* 説明文テキスト */
.dlBanner__descText {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.111vw, 16px);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.04em;
  color: #fff;
  margin: 0;
  white-space: nowrap;
}

.dlBanner__descTextPc {
  display: block;
}

.dlBanner__descTextSp {
  display: none;
}

/* PC：画像エリア（右側） */
.dlBanner__imagesPc {
  position: absolute;
  top: min(2.708vw, 39px);
  left: min(31.181vw, 449px);
  width: min(15.833vw, 228px);
  height: min(12.847vw, 185px);
  z-index: 1;
}

.dlBanner__imagesSp {
  display: none;
}

/* 画像共通 */
.dlBanner__image {
  position: absolute;
  overflow: hidden;
}

.dlBanner__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
}

/* PC画像1 */
.dlBanner__imagesPc .dlBanner__image1 {
  width: min(12.986vw, 187px);
  height: min(7.361vw, 106px);
  top: 0;
  left: min(1.875vw, 27px);
  transform: rotate(8.96deg);
  box-shadow: 1px 0 5px rgba(61, 120, 99, 0.25);
  z-index: 1;
}

/* PC画像2 */
.dlBanner__imagesPc .dlBanner__image2 {
  width: min(12.917vw, 186px);
  height: min(7.292vw, 105px);
  top: min(2.222vw, 32px);
  left: min(1.042vw, 15px);
  box-shadow: 1px 0 5px rgba(61, 120, 99, 0.25);
  z-index: 2;
}

/* PC画像3 */
.dlBanner__imagesPc .dlBanner__image3 {
  width: min(12.986vw, 187px);
  height: min(7.292vw, 105px);
  top: min(4.653vw, 67px);
  left: 0;
  transform: rotate(-4.17deg);
  box-shadow: 1px 0 5px rgba(61, 120, 99, 0.5);
  z-index: 3;
}

/* ボタン */
.dlBanner__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: min(3.472vw, 50px);
  padding: min(0.694vw, 10px) min(1.389vw, 20px);
  background: #ff7e33;
  border: 2px solid #fff;
  border-radius: min(0.833vw, 12px);
  box-shadow: 0 min(0.347vw, 5px) min(1.042vw, 15px) #00c17c;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 18px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #fff;
  white-space: nowrap;
  transition: background 0.3s;
}

/* .case-content内でのDLバナースタイルリセット */
.caseContent .dlBanner__title {
  font-size: min(1.528vw, 22px);
  padding-bottom: 0;
  border-bottom: none;
  color: #fff;
}

.caseContent .dlBanner__descText {
  font-size: min(1.111vw, 16px);
  line-height: 1.4;
  color: #fff;
}

/* ========================================
   SP版 (max-width: 768px)
   ======================================== */
@media (max-width: 768px) {
  .dlBanner {
    width: 24.5rem;
    height: 20.643rem;
    margin: 0 auto;
    border-radius: 1.429rem;
  }

  .dlBanner__decorationCircle {
    top: -4.5rem;
    left: -4.214rem;
    width: 16.286rem;
    height: 16.286rem;
  }

  .dlBanner__decorationWave {
    bottom: -5.714rem;
    right: -10.714rem;
    width: 20rem;
    height: 20rem;
  }

  /* SP：コンテンツを中央配置 */
  .dlBanner__content {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: auto;
    align-items: center;
    gap: 1.214rem;
  }

  .dlBanner__title {
    font-size: 1.571rem;
    text-align: center;
    white-space: nowrap;
  }

  /* SP：説明文と画像を横並び */
  .dlBanner__desc {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
  }

  .dlBanner__descText {
    font-size: 1.143rem;
    white-space: nowrap;
  }

  .dlBanner__descTextPc {
    display: none;
  }

  .dlBanner__descTextSp {
    display: block;
  }

  .dlBanner__imagesPc {
    display: none;
  }

  /* SP：画像を説明文の横に配置 */
  .dlBanner__imagesSp {
    display: block;
    position: relative;
    width: 7.384rem;
    height: 6.786rem;
    flex-shrink: 0;
  }

  .dlBanner__imagesSp .dlBanner__image {
    position: absolute;
    box-shadow: 1px 0 5px rgba(61, 120, 99, 0.25);
  }

  .dlBanner__imagesSp .dlBanner__image1 {
    width: 6.862rem;
    height: 3.869rem;
    top: 0;
    left: 0.98rem;
    transform: rotate(8.96deg);
    z-index: 1;
  }

  .dlBanner__imagesSp .dlBanner__image2 {
    width: 6.815rem;
    height: 3.837rem;
    top: 1.184rem;
    left: 0.558rem;
    transform: none;
    z-index: 2;
  }

  .dlBanner__imagesSp .dlBanner__image3 {
    width: 6.851rem;
    height: 3.845rem;
    top: 2.452rem;
    left: 0;
    transform: rotate(-4.17deg);
    z-index: 3;
  }

  .dlBanner__btn {
    height: 3.571rem;
    padding: 0.714rem 1.429rem;
    border-radius: 0.857rem;
    font-size: 1.286rem;
  }

  /* SP: .case-content内でのDLバナースタイルリセット */
  .caseContent .dlBanner__title {
    font-size: 1.571rem;
    padding-bottom: 0;
    border-bottom: none;
    color: #fff;
  }

  .caseContent .dlBanner__descText {
    font-size: 1.143rem;
    line-height: 1.4;
    color: #fff;
  }
}

/* ========================================
   SP用サイドバー（SP版のみ表示）
   ======================================== */
.caseSpSidebar {
  display: none;
}

@media (max-width: 768px) {
  .caseSpSidebar {
    display: flex;
    flex-direction: column;
    gap: 1.071rem;
  }

  /* SP サイドバーボックス共通 */
  .spSidebarBox {
    border: 1px solid #e1e2eb;
    border-radius: 0.714rem;
    padding: 1.071rem;
  }

  .spSidebarBox__header {
    display: flex;
    align-items: center;
    gap: 0.357rem;
    margin-bottom: 1.071rem;
  }

  .spSidebarBox__dot {
    width: 0.643rem;
    height: 0.643rem;
    background: #00ad6f;
    border-radius: 50%;
  }

  .spSidebarBox__heading {
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 1.143rem;
    font-weight: 700;
    color: #3f4f5f;
    letter-spacing: 0.04em;
  }

  .spSidebarBox__body {
    display: flex;
    flex-direction: column;
    gap: 0.714rem;
  }

  .spSidebarBox__item {
    display: flex;
    flex-direction: column;
    gap: 0.286rem;
  }

  .spSidebarBox__label {
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: #00ad6f;
    line-height: 1.286;
    margin: 0;
  }

  .spSidebarBox__value {
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 1rem;
    font-weight: 500;
    color: #3f4f5f;
    line-height: 1.286;
    margin: 0;
  }

  .spSidebarBox__tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.143rem 0.786rem;
    border: 1px solid #3f4f5f;
    border-radius: 3.571rem;
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 0.857rem;
    font-weight: 500;
    color: #3f4f5f;
    line-height: 1.5;
    background: #fff;
    width: fit-content;
    transition: background 0.3s, color 0.3s;
  }

  a.spSidebarBox__tag:hover {
    background: #3f4f5f;
    color: #fff;
    text-decoration: none;
  }

  .spSidebarBox__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.714rem;
  }

  .spSidebarBox__tagLink {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.143rem 0.786rem;
    border: 1px solid #3f4f5f;
    border-radius: 3.571rem;
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 0.857rem;
    font-weight: 500;
    color: #3f4f5f;
    line-height: 1.5;
    background: #fff;
    text-decoration: none;
    transition: background 0.3s, color 0.3s;
  }

  .spSidebarBox__tagLink:hover {
    background: #3f4f5f;
    color: #fff;
  }

  /* SP用：ホワイトペーパーバナー（sidebar-wp-bannerを再利用） */
  .sidebarWpBanner {
    height: 11.5rem;
    border-radius: 0.743rem;
  }

  .sidebarWpBanner__illust {
    top: 1.929rem;
    left: 17.429rem;
    width: 8.143rem;
    height: 23.323rem;
  }

  .sidebarWpBanner__dots {
    top: 2.071rem;
    left: 1.643rem;
    width: 4.179rem;
    height: 0.214rem;
  }

  .sidebarWpBanner__content {
    top: 1.214rem;
    left: 1.071rem;
    width: 19.143rem;
    gap: 0.286rem;
  }

  .sidebarWpBanner__subtitle {
    font-size: 1.286rem;
  }

  .sidebarWpBanner__badges {
    gap: 0.357rem;
  }

  .sidebarWpBanner__badge {
    padding: 0.143rem 0.714rem;
    border-radius: 2.857rem;
    font-size: 1.143rem;
  }

  .sidebarWpBanner__no {
    font-size: 1.286rem;
  }

  .sidebarWpBanner__title {
    font-size: 1.857rem;
    letter-spacing: 0.15em;
  }

  .sidebarWpBanner__footer {
    height: 1.857rem;
    gap: 0.357rem;
  }

  .sidebarWpBanner__footerText {
    font-size: 1.071rem;
  }

  .sidebarWpBanner__footerArrow svg {
    width: 1.114rem;
    height: 1.114rem;
  }
}

/* 前後の記事ナビゲーション - カード型 */
.caseNav {
  display: flex;
  justify-content: center;
  gap: min(1.1111vw, 16px);
  margin-top: 0;
}

.caseNav__card {
  display: flex;
  gap: min(1.171875vw, 15px);
  align-items: flex-start;
  padding: min(1.171875vw, 15px);
  background: #fff;
  border: 1px solid #d2d7db;
  border-radius: min(0.6944vw, 10px);
  text-decoration: none;
  transition: border-color 0.3s, opacity 0.3s;
}

.caseNav__card:hover {
  border-color: #e1e2eb;
  text-decoration: none;
}

.caseNav__card:hover .caseNav__content,
.caseNav__card:hover .caseNav__thumbnail img {
  opacity: 0.8;
}

.caseNav__cardPrev {
  flex-direction: row;
}

.caseNav__cardNext {
  flex-direction: row;
}

.caseNav__content {
  display: flex;
  flex-direction: column;
  gap: min(0.390625vw, 5px);
  width: min(14.21875vw, 182px);
}

.caseNav__label {
  display: flex;
  align-items: center;
  gap: min(0.546875vw, 7px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.171875vw, 15px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.04em;
  color: #3f4f5f;
}

.caseNav__labelPc {
  display: inline;
}

.caseNav__labelSp {
  display: none;
}

.caseNav__labelNext {
  flex-direction: row;
}

.caseNav__arrow {
  width: min(0.9375vw, 12px);
  height: min(0.78125vw, 10px);
  flex-shrink: 0;
}

.caseNav__arrowNext {
  transform: rotate(180deg) scaleY(-1);
}

.caseNav__info {
  display: flex;
  flex-direction: column;
  gap: min(0.234375vw, 3px);
}

.caseNav__company {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9375vw, 12px);
  font-weight: 500;
  line-height: 1.5;
  color: #3f4f5f;
  margin: 0;
}

.caseNav__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.09375vw, 14px);
  font-weight: 500;
  line-height: 1.09;
  color: #3f4f5f;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  max-height: min(2.34375vw, 30px);
}

.caseNav__thumbnailPc {
  width: min(8.984375vw, 115px);
  flex-shrink: 0;
}

.caseNav__thumbnailPc img {
  width: 100%;
  height: min(6.015625vw, 77px);
  object-fit: cover;
  border-radius: min(0.390625vw, 5px);
  display: block;
}

.caseNav__thumbnailSp {
  display: none;
}

/* SP ナビゲーション */
@media (max-width: 768px) {
  .caseNav {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 0.786rem;
    /* 11px */
    margin-top: 0;
  }

  .caseNav__card {
    flex-direction: column;
    width: 11.857rem;
    /* 166px */
    padding: 0.714rem;
    /* 10px */
    border-color: #e1e2eb;
    border-radius: 0.714rem;
    /* 10px */
    gap: 0.357rem;
    /* 5px */
  }

  .caseNav__cardPrev,
  .caseNav__cardNext {
    flex-direction: column;
  }

  .caseNav__content {
    display: flex;
    flex-direction: column;
    gap: 0.357rem;
    /* 5px */
    width: 10.429rem;
    /* 146px */
  }

  .caseNav__label {
    font-size: 1.071rem;
    /* 15px */
    gap: 0.5rem;
    /* 7px */
    flex-direction: row;
  }

  .caseNav__labelPc {
    display: none;
  }

  .caseNav__labelSp {
    display: inline;
  }

  .caseNav__labelNext {
    flex-direction: row;
    justify-content: flex-end;
    width: 100%;
  }

  .caseNav__arrow {
    width: 0.857rem;
    /* 12px */
    height: 0.714rem;
    /* 10px */
  }

  .caseNav__arrowNext {
    transform: rotate(180deg) scaleY(-1);
  }

  .caseNav__company {
    font-size: 0.857rem;
    /* 12px */
  }

  .caseNav__cardNext .caseNav__company {
    text-align: right;
  }

  .caseNav__cardNext .caseNav__title {
    text-align: right;
  }

  .caseNav__title {
    font-size: 1rem;
    /* 14px */
    max-height: 2.143rem;
    /* 30px */
  }

  .caseNav__thumbnailPc {
    display: none;
  }

  .caseNav__thumbnailSp {
    display: block;
    width: 10.429rem;
    /* 146px */
  }

  .caseNav__thumbnailSp img {
    width: 100%;
    height: 7rem;
    /* 98px */
    object-fit: cover;
    border-radius: 0.357rem;
    /* 5px */
    display: block;
  }
}

/* 一覧ページに戻るボタン */
.caseBackBtn {
  display: flex;
  justify-content: center;
  margin-top: calc(min(1.3889vw, 20px) - min(4.8611vw, 70px));
}

.caseBackBtn__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(20.625vw, 264px);
  height: min(3.59375vw, 46px);
  padding: min(0.78125vw, 10px) min(2.34375vw, 30px);
  background: #fff;
  border: 1px solid #d2d7db;
  border-radius: min(0.78125vw, 10px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.171875vw, 15px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.04em;
  color: #3f4f5f;
  text-decoration: none;
  transition: border-color 0.3s, opacity 0.3s;
}

.caseBackBtn__link:hover {
  border-color: #e1e2eb;
  text-decoration: none;
}

.caseBackBtn__link:hover {
  opacity: 0.8;
}

/* SP 一覧ページに戻るボタン */
@media (max-width: 768px) {
  .caseBackBtn {
    margin-top: calc(1.429rem - 3.571rem);
    /* 20px - 50px (親gap相殺) */
  }

  .caseBackBtn__link {
    width: 18.929rem;
    /* 265px */
    height: 3.286rem;
    /* 46px */
    padding: 0.714rem 2.143rem;
    /* 10px 30px */
    border-radius: 0.714rem;
    /* 10px */
    font-size: 1.071rem;
    /* 15px */
    border-color: #e1e2eb;
  }
}

/* ==========================================================================
   TOC+ 目次スタイル（ピクセルパーフェクト）
   ========================================================================== */
/*
   PC: 1280px基準 → min(vw, px)
   SP: 375px基準 → rem
   
   Figmaデザイン:
   - PC: width 700px, padding 15px 30px, border 3px #f1f6e8, radius 15px
   - タイトル: 24px Bold, #3f4f5f
   - 大見出し: 14px Bold, #3f4f5f, line-height 1.5
   - 小見出し: 12px Medium, #3f4f5f, line-height 1.7, dot 3px
*/

/* コンテナ - デフォルトスタイルを完全リセット */
#toc_container,
.toc_container_header {
  all: unset;
  display: block;
}

#toc_container {
  background: #fff !important;
  border: min(0.234vw, 3px) solid #f1f6e8 !important;
  border-radius: min(1.172vw, 15px) !important;
  padding: min(1.172vw, 15px) min(2.344vw, 30px) !important;
  width: 100% !important;
  max-width: min(54.688vw, 700px) !important;
  margin: calc(min(1.3889vw, 20px) - min(4.8611vw, 70px)) 0 min(2.7778vw, 40px) 0 !important;
  font-family: 'Zen Maru Gothic', sans-serif !important;
  box-sizing: border-box !important;
}

/* 目次タイトル部分 */
#toc_container p.toc_title,
#toc_container .toc_title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 0 min(1.172vw, 15px) 0 !important;
  border-bottom: 1px solid #f1f6e8 !important;
  margin: 0 0 min(1.172vw, 15px) 0 !important;
  cursor: pointer !important;
  font-size: min(1.875vw, 24px) !important;
  font-weight: 700 !important;
  color: #3f4f5f !important;
  letter-spacing: 0.04em !important;
  line-height: 1 !important;
  background: none !important;
}

/* 開閉トグルテキストを非表示にしてアイコンに置換 */
#toc_container .toc_toggle,
#toc_container .toc_toggle a,
#toc_container span.toc_toggle {
  font-size: 0 !important;
  color: transparent !important;
  position: relative !important;
  display: block !important;
  width: min(1.328vw, 17px) !important;
  height: min(0.703vw, 9px) !important;
}

#toc_container .toc_toggle::after,
#toc_container span.toc_toggle::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: min(1.328vw, 17px) !important;
  height: min(0.703vw, 9px) !important;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 17 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 8L8.5 1L16 8' stroke='%233f4f5f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  transition: transform 0.3s ease !important;
}

/* 閉じている時のアイコン */
#toc_container.contracted .toc_toggle::after,
#toc_container.contracted span.toc_toggle::after {
  transform: rotate(180deg) !important;
}

/* 目次リスト */
#toc_container ul,
#toc_container ul.toc_list,
#toc_container .toc_list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
}

/* 大見出し（ul > li） */
#toc_container .toc_list > li,
#toc_container ul.toc_list > li {
  margin: 0 0 min(0.781vw, 10px) 0 !important;
  padding: 0 !important;
  list-style: none !important;
  background: none !important;
}

#toc_container .toc_list > li:last-child,
#toc_container ul.toc_list > li:last-child {
  margin-bottom: 0 !important;
}

#toc_container .toc_list > li > a,
#toc_container ul.toc_list > li > a {
  font-size: min(1.094vw, 14px) !important;
  font-weight: 700 !important;
  color: #3f4f5f !important;
  letter-spacing: 0.05em !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
  display: block !important;
  background: none !important;
  padding: 0 !important;
}

#toc_container .toc_list > li > a:hover,
#toc_container ul.toc_list > li > a:hover {
  text-decoration: underline !important;
}

/* 小見出し（ul > li > ul > li） */
#toc_container .toc_list li ul,
#toc_container ul.toc_list li ul {
  list-style: none !important;
  padding: 0 !important;
  margin: min(0.234vw, 3px) 0 0 0 !important;
  background: none !important;
}

#toc_container .toc_list li ul li,
#toc_container ul.toc_list li ul li {
  padding: 0 0 0 min(1.25vw, 16px) !important;
  margin: 0 0 min(0.234vw, 3px) 0 !important;
  position: relative !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: min(0.625vw, 8px) !important;
  list-style: none !important;
  background: none !important;
}

#toc_container .toc_list li ul li::before,
#toc_container ul.toc_list li ul li::before {
  content: '' !important;
  display: block !important;
  width: min(0.234vw, 3px) !important;
  height: min(0.234vw, 3px) !important;
  min-width: 3px !important;
  min-height: 3px !important;
  background: #3f4f5f !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  margin-top: min(0.703vw, 9px) !important;
}

#toc_container .toc_list li ul li a,
#toc_container ul.toc_list li ul li a {
  font-size: min(0.938vw, 12px) !important;
  font-weight: 500 !important;
  color: #3f4f5f !important;
  letter-spacing: 0.05em !important;
  line-height: 1.7 !important;
  text-decoration: none !important;
  background: none !important;
  padding: 0 !important;
}

#toc_container .toc_list li ul li a:hover,
#toc_container ul.toc_list li ul li a:hover {
  text-decoration: underline !important;
}

/* ==========================================================================
   TOC+ SP（スマートフォン）
   ========================================================================== */
@media (max-width: 768px) {
  #toc_container {
    width: 100% !important;
    max-width: none !important;
    padding: 1.071rem !important; /* 15px */
    border-width: 0.214rem !important; /* 3px */
    border-radius: 1.071rem !important; /* 15px */
    margin: calc(1.429rem - 3.571rem) 0 2.857rem !important; /* 20px - 50px (親gap相殺), bottom 40px */
  }

  #toc_container p.toc_title,
  #toc_container .toc_title {
    padding: 0 0 1.071rem 0 !important; /* 15px */
    margin: 0 0 1.071rem 0 !important; /* 15px */
    font-size: 1.286rem !important; /* 18px */
    letter-spacing: 0.04em !important;
  }

  #toc_container .toc_toggle,
  #toc_container .toc_toggle a,
  #toc_container span.toc_toggle {
    width: 1.071rem !important; /* 15px */
    height: 0.5rem !important; /* 7px */
  }

  #toc_container .toc_toggle::after,
  #toc_container span.toc_toggle::after {
    width: 1.071rem !important; /* 15px */
    height: 0.5rem !important; /* 7px */
  }

  /* 大見出し */
  #toc_container .toc_list > li,
  #toc_container ul.toc_list > li {
    margin: 0 0 0.429rem 0 !important; /* 6px */
  }

  #toc_container .toc_list > li > a,
  #toc_container ul.toc_list > li > a {
    font-size: 1rem !important; /* 14px */
    line-height: 1.5 !important;
    letter-spacing: 0.05em !important;
  }

  /* 小見出し */
  #toc_container .toc_list li ul,
  #toc_container ul.toc_list li ul {
    margin: 0.214rem 0 0 0 !important; /* 3px */
  }

  #toc_container .toc_list li ul li,
  #toc_container ul.toc_list li ul li {
    padding: 0 0 0 0.357rem !important; /* 5px */
    margin: 0 0 0.214rem 0 !important; /* 3px */
    gap: 0.571rem !important; /* 8px */
  }

  #toc_container .toc_list li ul li::before,
  #toc_container ul.toc_list li ul li::before {
    width: 0.214rem !important; /* 3px */
    height: 0.214rem !important; /* 3px */
    min-width: 3px !important;
    min-height: 3px !important;
    margin-top: 0.607rem !important; /* 約8.5px */
  }

  #toc_container .toc_list li ul li a,
  #toc_container ul.toc_list li ul li a {
    font-size: 0.857rem !important; /* 12px */
    line-height: 1.7 !important;
    letter-spacing: 0.05em !important;
  }
}

/* 閉じた状態のスタイル */
#toc_container.contracted p.toc_title,
#toc_container.contracted .toc_title {
  border-bottom: none !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

#toc_container.contracted .toc_list,
#toc_container.contracted ul.toc_list {
  display: none !important;
}


/* ==========================================================================
   資料バナー（ホワイトペーパー） PC
   ========================================================================== */
.wpBanner {
  display: block;
  width: min(27.344vw, 350px);
  height: min(12.578vw, 161px);
  border-radius: min(0.813vw, 10.409px);
  border: 2px solid #13c4ce;
  background: linear-gradient(-55.97deg, #e3ffda 12.16%, #edffbe 87.84%);
  position: relative;
  overflow: hidden;
  text-decoration: none;
  margin: min(2.5vw, 32px) auto;
}

.wpBanner__bgImage {
  position: absolute;
  top: min(-10.078vw, -129px);
  left: min(-6.172vw, -79px);
  width: min(39.766vw, 509px);
  height: auto;
  aspect-ratio: 1920 / 1280;
  background-image: url('images/img_wpBanner_bg.webp');
  background-size: cover;
  background-position: center;
  mix-blend-mode: overlay;
  pointer-events: none;
}

.wpBanner__illust {
  position: absolute;
  top: min(2.109vw, 27px);
  right: min(0.625vw, 8px);
  width: min(8.906vw, 114px);
  height: min(25.509vw, 326.525px);
  background-image: url('images/img_sidebar_wp_illust.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top center;
  pointer-events: none;
}

.wpBanner__content {
  position: absolute;
  top: min(1.328vw, 17px);
  left: min(1.172vw, 15px);
  width: min(20.938vw, 268px);
  display: flex;
  flex-direction: column;
  gap: min(0.313vw, 4px);
}

.wpBanner__subtitle {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.406vw, 18px);
  font-weight: 700;
  color: #3f4f5f;
  letter-spacing: 0.04em;
  line-height: 1.65;
  margin: 0;
}

.wpBanner__badges {
  display: flex;
  align-items: center;
  gap: min(0.391vw, 5px);
}

.wpBanner__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: min(0.156vw, 2px) min(0.781vw, 10px);
  border-radius: min(3.125vw, 40px);
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.25vw, 16px);
  font-weight: 700;
  color: #fff;
  line-height: 1.65;
}

.wpBanner__badgeYellow {
  background-color: #edb937;
}

.wpBanner__badgeGreen {
  background-color: #21c188;
}

.wpBanner__no {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.406vw, 18px);
  font-weight: 700;
  color: #3f4f5f;
  letter-spacing: 0.04em;
  line-height: 1.65;
}

.wpBanner__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(2.031vw, 26px);
  font-weight: 700;
  color: #3f4f5f;
  letter-spacing: 0.15em;
  line-height: 1.35;
  margin: 0;
}

.wpBanner__footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: min(2.031vw, 26px);
  background-color: #13c4ce;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(0.625vw, 8px);
}

.wpBanner__footerText {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.172vw, 15px);
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.04em;
  line-height: 1.65;
}

.wpBanner__footerArrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(1.22vw, 15.613px);
  height: min(1.22vw, 15.613px);
}

.wpBanner__footerArrow svg {
  width: 100%;
  height: 100%;
}

/* ==========================================================================
   資料バナー（ホワイトペーパー） SP
   ========================================================================== */
@media (max-width: 768px) {
  .wpBanner {
    width: calc(350 / 375 * 100vw);
    max-width: 350px;
    height: auto;
    aspect-ratio: 350 / 161;
    border-radius: 0.743rem; /* 10.409px */
    border-width: 0.143rem; /* 2px */
    margin: 1.143rem auto; /* 16px */
  }

  .wpBanner__bgImage {
    top: calc(-129 / 375 * 100vw);
    left: calc(-79 / 375 * 100vw);
    width: calc(509 / 375 * 100vw);
  }

  .wpBanner__illust {
    top: calc(27 / 375 * 100vw);
    right: calc(8 / 375 * 100vw);
    width: calc(114 / 375 * 100vw);
    height: calc(327 / 375 * 100vw);
  }

  .wpBanner__content {
    top: calc(17 / 375 * 100vw);
    left: calc(15 / 375 * 100vw);
    width: calc(268 / 375 * 100vw);
    gap: calc(4 / 375 * 100vw);
  }

  .wpBanner__subtitle {
    font-size: 1.286rem; /* 18px */
    letter-spacing: 0.04em;
  }

  .wpBanner__badges {
    gap: calc(5 / 375 * 100vw);
  }

  .wpBanner__badge {
    padding: 0.143rem 0.714rem; /* 2px 10px */
    border-radius: 2.857rem; /* 40px */
    font-size: 1.143rem; /* 16px */
  }

  .wpBanner__no {
    font-size: 1.286rem; /* 18px */
  }

  .wpBanner__title {
    font-size: 1.857rem; /* 26px */
    letter-spacing: 0.15em;
  }

  .wpBanner__footer {
    height: calc(26 / 375 * 100vw);
    min-height: 26px;
    gap: 0.571rem; /* 8px */
  }

  .wpBanner__footerText {
    font-size: 1.071rem; /* 15px */
  }

  .wpBanner__footerArrow {
    width: 1.115rem; /* 15.613px */
    height: 1.115rem; /* 15.613px */
  }
}

/* ==========================================================================
   CTA Section
   PC: 1124px container, gap 48px between title and cards, cards gap 48px
   SP: gap 32px between title and cards, cards gap 24px, cards 343px
   ========================================================================== */
.cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: min(3.3333vw, 48px);
  width: 100%;
  padding: 0 min(2.0833vw, 30px);
  padding-top: min(6.9444vw, 100px);
  padding-bottom: min(6.6667vw, 96px);
}

.cta__titleWrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: min(1.1111vw, 16px);
}

.cta__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(2.7778vw, 40px);
  font-weight: 700;
  color: #3f4f5f;
  letter-spacing: min(0.2778vw, 4px);
  line-height: 1;
  text-align: center;
  margin: 0;
  font-feature-settings: 'pwid';
}

.cta__titlePc {
  display: block;
}

.cta__titleSp {
  display: none;
}

.cta__titleSp p {
  margin: 0;
}

.cta__cards {
  display: flex;
  gap: min(3.3333vw, 48px);
  width: min(78.0556vw, 1124px);
  justify-content: center;
}

/* CTA Card - 共通スタイル */
.ctaCard {
  position: relative;
  width: min(37.3611vw, 538px);
  height: min(17.2222vw, 248px);
  border-radius: min(1.1111vw, 16px);
  overflow: hidden;
  display: block;
  text-decoration: none;
  box-shadow: 0 min(1.9444vw, 28px) min(2.5vw, 36px) rgba(6, 93, 62, 0.13);
}

.ctaCardContact {
  background-color: #3f4f5f;
  border: min(0.3472vw, 5px) solid #13c4ce;
}

.ctaCardDocument {
  background-color: #34424f;
  border: min(0.3472vw, 5px) solid #fc7f26;
}

.ctaCard__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.ctaCardDocument .ctaCard__bgWrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.ctaCardDocument .ctaCard__bgBase {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 200%;
  height: auto;
  opacity: 0.32;
}

.ctaCard__screenshot {
  position: absolute;
  opacity: 0.25;
  pointer-events: none;
}

.ctaCard__screenshot1 {
  width: min(22.6389vw, 326px);
  height: auto;
  top: max(-0.7576vw, -10.91px);
  left: min(8.7958vw, 126.66px);
  transform: rotate(8.962deg);
}

.ctaCard__screenshot2 {
  width: min(20.8921vw, 300.85px);
  height: auto;
  top: min(2.8729vw, 41.37px);
  left: min(7.5vw, 108px);
  box-shadow: min(0.5808vw, 8.364px) 0 min(0.7260vw, 10.455px) rgba(44, 69, 125, 0.5);
}

.ctaCard__screenshot3 {
  width: min(21.8024vw, 313.96px);
  height: auto;
  top: min(4.8097vw, 69.26px);
  left: min(5.9028vw, 85px);
  transform: rotate(-4.169deg);
  box-shadow: min(0.5808vw, 8.364px) 0 min(0.7260vw, 10.455px) rgba(44, 69, 125, 0.5);
}

.ctaCard__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #212426;
  mix-blend-mode: soft-light;
  opacity: 0.7;
}

.ctaCard__content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: min(0.5556vw, 8px);
}

.ctaCard__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: min(0.2778vw, 4px) min(1.1111vw, 16px);
  background-color: #f2f3f5;
  border-radius: min(0.5556vw, 8px) min(1.1458vw, 16.5px) min(1.1458vw, 16.5px) 0;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(0.9722vw, 14px);
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: 0.04em;
  font-feature-settings: 'pwid';
}

.ctaCard__badgeCyan {
  color: #03afb9;
}

.ctaCard__badgeOrange {
  color: #fc7f26;
}

.ctaCard__text {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(2.2222vw, 32px);
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  letter-spacing: 0.04em;
  line-height: 1.65;
  font-feature-settings: 'pwid';
}

.ctaCard__arrow {
  position: absolute;
  bottom: 0;
  right: 0;
  width: min(2.7778vw, 40px);
  height: min(2.7778vw, 40px);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.ctaCard__arrow::before {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: min(1.1111vw, 16px) 0 0 0;
}

.ctaCard__arrowCyan::before {
  background-color: #13c4ce;
}

.ctaCard__arrowOrange::before {
  background-color: #fc7f26;
}

.ctaCard__arrow svg {
  width: min(1.6667vw, 24px);
  height: min(1.6667vw, 24px);
  transform: rotate(-90deg);
  position: relative;
  z-index: 1;
}

/* CTA Section SP */
@media (max-width: 768px) {
  .cta {
    gap: 2.286rem; /* 32px */
    padding: 0 1.143rem;
    /* 16px */
    padding-top: 5rem; /* 70px - Figma仕様 */
    padding-bottom: 0; /* SP: site-footer margin-topで間隔を制御 */
  }

  .cta__title {
    font-size: 1.714rem; /* 24px */
    line-height: 1.65;
    letter-spacing: 0.069rem; /* 0.96px */
  }

  .cta__titlePc {
    display: none;
  }

  .cta__titleSp {
    display: block;
    text-align: center;
  }

  .cta__cards {
    flex-direction: column;
    gap: 1.714rem; /* 24px */
    width: 100%;
    align-items: center;
  }

  .ctaCard {
    width: 24.5rem; /* 343px */
    height: 9rem; /* 126px */
    border-radius: 0.571rem; /* 8px */
    border-width: 0.143rem; /* 2px */
    box-shadow: 0 1.275rem 1.639rem rgba(6, 93, 62, 0.13); /* 17.851px 22.952px - Figma仕様 */
  }

  .ctaCardDocument {
    background-color: #3f4f5f;
  }

  .ctaCard__bg {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .ctaCard__content {
    gap: 0;
  }

  .ctaCard__badge {
    padding: 0.143rem 0.571rem; /* 2px 8px */
    border-radius: 0.429rem 0.786rem 0.786rem 0;
    font-size: 0.857rem; /* 12px */
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.04em;
  }

  .ctaCard__text {
    font-size: 1.571rem; /* 22px */
    line-height: 1.5;
    letter-spacing: 0.04em;
    white-space: nowrap;
  }

  .ctaCard__arrow {
    width: 2rem; /* 28px */
    height: 2rem; /* 28px */
  }

  .ctaCard__arrow::before {
    border-radius: 0.7rem 0 0 0; /* 11.2px */
  }

  .ctaCard__arrow svg {
    width: 1.09375rem; /* 17.5px */
    height: 1.09375rem; /* 17.5px */
  }
}

/* ==========================================================================
   404 Error Page
   ========================================================================== */
.errorPage {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 80px);
  padding: min(6.9444vw, 100px) min(2.0833vw, 30px);
  text-align: center;
}

.errorPage__inner {
  max-width: 600px;
}

.errorPage__title {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(8.3333vw, 120px);
  font-weight: 700;
  color: #3f4f5f;
  line-height: 1;
  margin-bottom: min(1.6667vw, 24px);
}

.errorPage__message {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(2.2222vw, 32px);
  font-weight: 700;
  color: #3f4f5f;
  margin-bottom: min(1.1111vw, 16px);
}

.errorPage__description {
  font-size: min(1.1111vw, 16px);
  color: #666;
  margin-bottom: min(2.7778vw, 40px);
  line-height: 1.8;
}

.errorPage__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: min(16.6667vw, 240px);
  height: min(4.1667vw, 60px);
  padding: 0 min(2.0833vw, 30px);
  background: linear-gradient(90deg, #8cc63f 0%, #5fa439 100%);
  color: #fff;
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: min(1.1111vw, 16px);
  font-weight: 700;
  border-radius: min(2.0833vw, 30px);
  text-decoration: none;
  transition: opacity 0.3s ease;
}

.errorPage__button:hover {
  opacity: 0.8;
}

@media (max-width: 768px) {
  .errorPage {
    min-height: calc(100vh - 60px);
    padding: 4.286rem 1.143rem;
  }

  .errorPage__title {
    font-size: 5.714rem; /* 80px */
  }

  .errorPage__message {
    font-size: 1.429rem; /* 20px */
  }

  .errorPage__description {
    font-size: 1rem; /* 14px */
    margin-bottom: 2.143rem; /* 30px */
  }

  .errorPage__button {
    min-width: 12.857rem; /* 180px */
    height: 3.429rem; /* 48px */
    font-size: 1rem; /* 14px */
    border-radius: 1.714rem; /* 24px */
  }
}

/* ==========================================================================
   Footer Area Background (PC only)
   グラデーション背景 + 楕円装飾 + 波形 + 十字/四角装飾
   ========================================================================== */
.footerArea {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #fff;
  margin-top: 96px;
  min-height: min(54.7222vw, 788px); /* Figma仕様 */
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* 一覧ページ用：背景装飾なし */
.footerAreaNoBg {
  background: transparent;
}

.footerAreaNoBg .footerArea__bg {
  display: none;
}

/* 一覧ページ専用スタイル（PC） - 詳細ページには影響しない */
.home .footerArea {
  margin-top: 0;
  min-height: auto;
}

.home .cta {
  padding-top: min(6.6667vw, 96px);
}

.footerArea__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}

.footerArea__bgPc {
  display: block;
  background-image: url('images/img_footer_bg_pc.webp');
}

/* 個別装飾要素を非表示（背景画像に含まれるため） */
.footerArea__gradient,
.footerArea__ellipse,
.footerArea__wave,
.footerArea__cross,
.footerArea__square1,
.footerArea__square2 {
  display: none;
}

.footerArea__gradient {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 878px;
  background: linear-gradient(180deg, #f7fde8 4.934%, #eafdd8 47.893%, #e2fde1 96.676%);
}

.footerArea__ellipse {
  position: absolute;
  pointer-events: none;
}

.footerArea__ellipseLeft {
  width: 535.068px;
  height: 535.068px;
  top: -221.59px;
  left: -327.61px;
  transform: rotate(61.572deg);
  mix-blend-mode: multiply;
}

.footerArea__ellipseRight1 {
  width: 800px;
  height: 800px;
  top: -46.47%;
  right: -45.36%;
  transform: rotate(309.57deg);
}

.footerArea__ellipseRight2 {
  width: 477px;
  height: 554px;
  top: 19.29%;
  right: -12.29%;
}

.footerArea__wave {
  position: absolute;
  width: 1679px;
  height: 328.02px;
  top: -244px;
  left: 50%;
  transform: translateX(-50%) scaleY(-1);
}

.footerArea__cross {
  position: absolute;
  pointer-events: none;
}

.footerArea__cross1 {
  width: 77px;
  height: 77px;
  top: 217px;
  left: 105px;
}

.footerArea__cross1::before,
.footerArea__cross1::after {
  content: '';
  position: absolute;
  background: #ddf4d2;
}

.footerArea__cross1::before {
  width: 25.851px;
  height: 77.025px;
  top: 0;
  left: 50%;
  transform: translateX(-50%) rotate(0.318deg);
}

.footerArea__cross1::after {
  width: 25.851px;
  height: 77.025px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(90.318deg);
}

.footerArea__cross2 {
  width: 56.402px;
  height: 56.402px;
  top: 368px;
  left: -19px;
}

.footerArea__cross2::before,
.footerArea__cross2::after {
  content: '';
  position: absolute;
  background: #ccefbb;
}

.footerArea__cross2::before {
  width: 18.929px;
  height: 56.402px;
  top: 0;
  left: 50%;
  transform: translateX(-50%) rotate(0.318deg);
}

.footerArea__cross2::after {
  width: 18.929px;
  height: 56.402px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(90.318deg);
}

.footerArea__square1 {
  position: absolute;
  width: 77px;
  height: 77px;
  top: 217px;
  left: 105px;
  background: linear-gradient(180deg, #b5eb84 0%, #c6f1bc 88.85%);
}

.footerArea__square2 {
  position: absolute;
  width: 58px;
  height: 57px;
  top: 368px;
  left: -20px;
  background: linear-gradient(180deg, #c0ed86 22.209%, #a4eb97 100%);
}

.footerArea__content {
  position: relative;
  z-index: 1;
}

/* SP背景 */
.footerArea__bgSp {
  display: none;
}

@media (max-width: 768px) {
  .footerArea {
    min-height: 36.2857rem; /* 508px - Figma仕様 */
  }

  .footerArea__bgPc {
    display: none;
  }

  .footerArea__bgSp {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    background-image: url('images/img_footer_sp.webp');
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
  }

  .footerArea__bgSp .footerArea__gradient {
    height: 712px;
  }

  .footerArea__bgSp .footerArea__ellipseLeft {
    width: 240.507px;
    height: 240.507px;
    top: 178.53px;
    left: -119.47px;
    transform: rotate(145.018deg);
  }

  .footerArea__bgSp .footerArea__ellipseRight1 {
    width: 293.885px;
    height: 293.885px;
    top: -19.49%;
    right: -65.05%;
    transform: rotate(309.57deg);
  }

  .footerArea__bgSp .footerArea__ellipseRight2 {
    width: 192px;
    height: 193px;
    top: 67.13%;
    right: -10.4%;
  }

  .footerArea__bgSp .footerArea__wave {
    width: 437px;
    height: 110px;
    top: -80px;
    left: 50%;
    transform: translateX(-50%) scaleY(-1);
  }

  .footerArea__bgSp .footerArea__cross1 {
    width: 51.67px;
    height: 51.67px;
    top: 515px;
    left: 81.9px;
  }

  .footerArea__bgSp .footerArea__cross1::before,
  .footerArea__bgSp .footerArea__cross1::after {
    background: #ddf4d2;
  }

  .footerArea__bgSp .footerArea__cross1::before {
    width: 17.341px;
    height: 51.67px;
  }

  .footerArea__bgSp .footerArea__cross1::after {
    width: 17.341px;
    height: 51.67px;
  }

  .footerArea__bgSp .footerArea__cross2 {
    width: 37.836px;
    height: 37.836px;
    top: 616.51px;
    left: -1.95px;
  }

  .footerArea__bgSp .footerArea__cross2::before,
  .footerArea__bgSp .footerArea__cross2::after {
    background: #ccefbb;
  }

  .footerArea__bgSp .footerArea__cross2::before {
    width: 12.698px;
    height: 37.836px;
  }

  .footerArea__bgSp .footerArea__cross2::after {
    width: 12.698px;
    height: 37.836px;
  }

  .footerArea__bgSp .footerArea__square1 {
    width: 51.654px;
    height: 51.654px;
    top: 515.21px;
    left: 81.9px;
  }

  .footerArea__bgSp .footerArea__square2 {
    width: 38.908px;
    height: 38.237px;
    top: 616.51px;
    left: -1.95px;
  }
}

/* ==========================================================================
   Footer
   本番サイト準拠: px-4(16px), py-5(20px)
   pc:(820px~): text-h-base, text-sm, text-center
   ========================================================================== */
.siteFooter {
  position: relative;
  z-index: 1;
  background-color: #3f4f5f;
  padding: 1.25rem 1rem; /* 20px 16px */
}

.siteFooter__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 1rem; /* mb-4 */
  max-width: 1120px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
}

/* PC: 820px以上 */
@media (min-width: 820px) {
  .siteFooter__inner {
    margin-bottom: 1.5rem; /* pc:mb-6 */
  }
}

.siteFooter__company {
  display: flex;
  flex-direction: column;
}

.siteFooter__name {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 1.125rem; /* 18px = text-h-sm */
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.04em;
  line-height: 1.65;
  margin: 0;
  font-feature-settings: 'pwid';
}

/* PC: 820px以上 */
@media (min-width: 820px) {
  .siteFooter__name {
    font-size: 1.25rem; /* 20px = text-h-base */
  }
}

.siteFooter__address {
  display: flex;
  flex-direction: column;
}

.siteFooter__addressZip,
.siteFooter__addressDetail {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 0.75rem; /* 12px = text-xs */
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.04em;
  line-height: 1.5;
  margin: 0;
  font-feature-settings: 'pwid';
}

/* PC: 820px以上 */
@media (min-width: 820px) {
  .siteFooter__addressZip,
  .siteFooter__addressDetail {
    font-size: 0.875rem; /* 14px = text-sm */
    line-height: 1.65; /* leading-lg */
  }
}

.siteFooter__addressSp {
  display: none;
}

.siteFooter__bottom {
  display: flex;
  align-items: center;
  width: 100%;
}

.siteFooter__copyright {
  font-family: 'Zen Maru Gothic', sans-serif;
  font-size: 0.75rem; /* 12px = text-xs */
  font-weight: 700;
  color: #e1e2eb;
  letter-spacing: 0.04em;
  line-height: 1.5;
  margin: 0;
  font-feature-settings: 'pwid';
}

/* PC: 820px以上 */
@media (min-width: 820px) {
  .siteFooter__bottom {
    justify-content: center;
  }

  .siteFooter__copyright {
    font-size: 0.875rem; /* 14px = text-sm */
    line-height: 1.65; /* leading-lg */
    text-align: center;
  }
}

/* SP: CTAとフッター本体の余白 */
@media (max-width: 768px) {
  /* 詳細ページ: 50px @ 375px = 3.571rem */
  .footerArea .siteFooter {
    margin-top: 3.571rem;
  }

  /* 一覧ページ: 88px @ 375px = 6.286rem */
  .footerAreaNoBg .siteFooter {
    margin-top: 6.286rem;
  }
}

/* ==========================================================================
   SP版追従ボタン
   ========================================================================== */
.spStickyBtn {
  display: none;
}

@media (max-width: 768px) {
  .spStickyBtn {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0.679rem 3.929rem; /* 9.5px 55px */
    background: rgba(63, 79, 95, 0.5);
    z-index: 100;
  }

  .spStickyBtn__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 3.571rem;
    padding: 0.714rem 1.429rem;
    background: #ff7e33;
    border: 2px solid #fff;
    border-radius: 0.857rem;
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 1.286rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.04em;
    color: #fff;
    white-space: nowrap;
    transition: background 0.3s;
  }

  .spStickyBtn__link:hover {
    background: #ff9f67;
  }
}