.elementor-399 .elementor-element.elementor-element-6cc2e42{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-a3b68fe *//* セクション全体背景 */


/* PC：5カラム / SP：横スクロール */
.treatment-slider {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  max-width: 1140px;
  margin: 0 auto;
}

/* カード共通 */
.treatment-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 24px 20px;
  border-radius: 16px;
  background: #f3f6fa;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04);
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* ホバー時の浮き上がり */
.treatment-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
}

/* アイコン */
.treatment-icon {
  margin-bottom: 16px;
}
.treatment-icon img {
  max-width: 72px;
  height: auto;
}

/* テキスト部分 */
.treatment-body {
  margin-bottom: 0;
}

/* タイトル＋矢印を横並びに */
.treatment-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}

.treatment-title {
  font-family: "M PLUS Rounded 1c", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 20px;
  font-weight: 700;
  color: #333333;
  margin: 0;
}

.treatment-sub {
  font-family: "M PLUS Rounded 1c", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 12px;
  color: #777777;
  margin: 0;
}

/* 矢印丸ボタン */
.treatment-arrow-circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #6065af;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* 矢印アイコン画像 */
.treatment-arrow-circle img {
  width: 14px;
  height: 14px;
  transition: transform 0.25s ease;
}

/* ホバー・タップ時に矢印が「スッ」と動く */
.treatment-card:hover .treatment-arrow-circle img,
.treatment-card:active .treatment-arrow-circle img {
  transform: translateX(3px);
}

/* ---- スマホ用：スライド式（横スクロール） ---- */
@media (max-width: 767px) {
  .treatment-slider {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    gap: 12px;
    padding-bottom: 8px;
  }

  .treatment-card {
    min-width: 72%;        /* 画面の7割くらいを1枚が占有 */
    scroll-snap-align: center;
  }
}
/* アイコン */
.treatment-icon {
  margin-bottom: 16px;
  display: flex;               /* 横並びレイアウトをflexに */
  align-items: center;         /* 縦方向センター */
  justify-content: center;     /* 横方向センター */
}

.treatment-icon img {
  max-width: 92px;
  height: auto;
  display: block;
}
/* =================================
   タブレットサイズ調整（～1024px）
   ================================= */
@media (max-width: 1024px) {
  .treatment-slider {
    gap: 12px;
  }

  .treatment-card {
    padding: 20px 16px;
  }

  .treatment-title {
    font-size: 18px;
  }

  .treatment-sub {
    font-size: 11px;
  }

  .treatment-icon img {
    max-width: 80px;
  }

  .treatment-arrow-circle {
    width: 28px;
    height: 28px;
  }

  .treatment-arrow-circle img {
    width: 12px;
    height: 12px;
  }
}

/* =================================
   スマホ（～767px）：さらにコンパクトに
   ※ 既存の @media (max-width: 767px) の
      「中に」追加してもOKです
   ================================= */
@media (max-width: 767px) {
  .treatment-card {
    min-width: 58%;        /* 1枚を少しだけ大きく見せるなら 70〜90%で調整 */
    padding: 18px 14px;
  }

  .treatment-title {
    font-size: 16px;
  }

  .treatment-sub {
    font-size: 11px;
  }

  .treatment-icon img {
    max-width: 72px;
  }

  .treatment-arrow-circle {
    width: 26px;
    height: 26px;
  }

  .treatment-arrow-circle img {
    width: 11px;
    height: 11px;
  }
}

/* =================================
   超小さい端末（～360px）向け微調整
   ================================= */
@media (max-width: 360px) {
  .treatment-card {
    min-width: 58%;
    padding: 16px 12px;
  }

  .treatment-title {
    font-size: 15px;
  }

  .treatment-sub {
    font-size: 10px;
  }

  .treatment-icon img {
    max-width: 64px;
  }
}/* End custom CSS */