@charset "UTF-8";
/* ============================================================
   症例ページ（2026-10-12）
   DESIGN.md「症例ページ」に従う。使う色はパレットのみ:
   main #2563EB / dark #1E40AF / light #60A5FA / pale #EFF6FF
   pale2 #DBEAFE / sky #93C5FD / amber #F59E0B / text #282828
   ============================================================ */

/* ---------- 一覧グリッド ---------- */
.kanae-caseList {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
@media (min-width: 600px) {
  .kanae-caseList { gap: 24px; }
  .kanae-caseList.-col2,
  .kanae-caseList.-col3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
  .kanae-caseList.-col3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* 本文エリア（トップページのショートコード）内でも既定のリスト装飾を打ち消す */
.post_content .kanae-caseList,
.post_content .kanae-caseChips {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.post_content .kanae-caseList > li::before,
.post_content .kanae-caseChips > li::before { content: none; }
.kanae-caseList__empty { text-align: center; }

/* ---------- カード ---------- */
.kanae-caseCard {
  margin: 0;
  padding: 0;
  background: #FFFFFF;
  border: 1px solid #DBEAFE;
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.kanae-caseCard:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(30, 64, 175, 0.15);
}
.kanae-caseCard__link,
.post_content .kanae-caseCard__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: #282828;
  text-decoration: none;
}
.kanae-caseCard__thumb {
  position: relative;
  aspect-ratio: 16 / 10;
  background: linear-gradient(135deg, #DBEAFE, #93C5FD);
  overflow: hidden;
}
.kanae-caseCard__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.kanae-caseCard__noimg {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: #1E40AF;
  font-weight: 700;
  font-size: 1.1rem;
  letter-spacing: 0.3em;
  text-indent: 0.3em;
}
.kanae-caseCard__symptom {
  position: absolute;
  left: 12px;
  top: 12px;
  background: #2563EB;
  color: #FFFFFF;
  font-weight: 700;
  font-size: 0.8rem;
  line-height: 1;
  padding: 0.55em 0.95em;
  border-radius: 50px;
}
.kanae-caseBadge {
  display: inline-block;
  background: #F59E0B;
  color: #282828;
  font-weight: 700;
  font-size: 0.72rem;
  line-height: 1;
  letter-spacing: 0.08em;
  padding: 0.5em 0.85em;
  border-radius: 50px;
}
.kanae-caseCard__thumb .kanae-caseBadge {
  position: absolute;
  right: 12px;
  top: 12px;
}
.kanae-caseCard__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 18px 16px;
  flex: 1;
}
.kanae-caseCard__title,
.post_content .kanae-caseCard__title {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
  color: #282828;
  overflow-wrap: anywhere;
}
.kanae-caseChips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.kanae-caseChips li {
  margin: 0;
  background: #EFF6FF;
  color: #2563EB;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.5em 0.8em;
  border-radius: 50px;
}
.kanae-caseCard__excerpt,
.post_content .kanae-caseCard__excerpt {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.7;
  color: #282828;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.kanae-caseCard__meta {
  margin-top: auto;
  padding-top: 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  font-size: 0.78rem;
  color: #282828;
  opacity: 0.75;
}

/* ---------- 一覧ページ ---------- */
.kanae-caseArchive__lead {
  margin: 0 0 28px;
  line-height: 1.9;
  text-align: center;
}
.kanae-caseFilter {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0 0 32px;
}
.kanae-caseFilter__item {
  display: inline-block;
  border: 1px solid #2563EB;
  background: #FFFFFF;
  color: #2563EB;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.6em 1.1em;
  border-radius: 50px;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.kanae-caseFilter__item:hover,
.kanae-caseFilter__item.is-current {
  background: #2563EB;
  color: #FFFFFF;
}
.kanae-caseFilter__count {
  font-weight: 400;
  margin-left: 0.3em;
}
.kanae-case .c-pagination { margin-top: 40px; }

/* ---------- 詳細ページ: プロフィールカード ---------- */
.kanae-caseProfile {
  background: #EFF6FF;
  border-left: 4px solid #2563EB;
  border-radius: 12px;
  padding: 20px 24px;
  margin: 0 0 40px;
}
.kanae-caseProfile__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 8px;
}
.kanae-caseProfile__ttl {
  font-weight: 700;
  color: #1E40AF;
}
.kanae-caseProfile__symptoms {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}
.kanae-caseProfile__symptom {
  display: inline-block;
  background: #2563EB;
  color: #FFFFFF;
  font-weight: 700;
  font-size: 0.8rem;
  line-height: 1;
  padding: 0.55em 0.95em;
  border-radius: 50px;
  text-decoration: none;
}
.kanae-caseProfile__symptom:hover { background: #1E40AF; color: #FFFFFF; }
.kanae-caseProfile__list {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0 32px;
  margin: 0;
}
@media (min-width: 768px) {
  .kanae-caseProfile__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.kanae-caseProfile__list > div {
  display: flex;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px dashed #DBEAFE;
}
.kanae-caseProfile__list dt {
  flex: 0 0 7.5em;
  color: #2563EB;
  font-weight: 700;
  font-size: 0.9rem;
  line-height: 1.6;
}
.kanae-caseProfile__list dd {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.kanae-caseProfile__note {
  margin: 12px 0 0;
  font-size: 0.78rem;
  line-height: 1.6;
}

/* ---------- 詳細ページ: 予約CTA ---------- */
.kanae-caseCta {
  background: #1E40AF;
  color: #FFFFFF;
  border-radius: 12px;
  padding: 32px 24px;
  margin: 56px 0 0;
  text-align: center;
}
.kanae-caseCta__ttl {
  margin: 0 0 8px;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.5;
}
.kanae-caseCta__text {
  margin: 0 0 20px;
  font-size: 0.95rem;
  line-height: 1.8;
}
.kanae-caseCta__btns {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}
.kanae-caseCta__btn {
  display: inline-block;
  min-width: 220px;
  background: #FFFFFF;
  color: #2563EB;
  font-weight: 700;
  line-height: 1.4;
  padding: 0.9em 1.8em;
  border: 2px solid #FFFFFF;
  border-radius: 50px;
  text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.kanae-caseCta__btn:hover {
  color: #2563EB;
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(37, 99, 235, 0.3);
}
.kanae-caseCta__btn.-sub {
  background: transparent;
  color: #FFFFFF;
}
.kanae-caseCta__btn.-sub:hover { color: #FFFFFF; }

/* ---------- 詳細ページ: 関連症例・前後ナビ ---------- */
.kanae-caseRelated { margin-top: 56px; }
.kanae-caseRelated__ttl {
  margin: 0 0 24px;
  font-size: 1.3rem;
  font-weight: 700;
  text-align: center;
  color: #2563EB;
}
.kanae-caseNav {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 12px;
  margin-top: 40px;
}
@media (min-width: 600px) {
  .kanae-caseNav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.kanae-caseNav__item {
  display: block;
  padding: 14px 16px;
  border: 1px solid #DBEAFE;
  border-radius: 12px;
  color: #282828;
  font-size: 0.9rem;
  line-height: 1.6;
  text-decoration: none;
  overflow-wrap: anywhere;
}
.kanae-caseNav__item:hover { background: #EFF6FF; color: #282828; }
.kanae-caseNav__item.-next { text-align: right; }
.kanae-caseNav__label {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  color: #2563EB;
}

/* ---------- 動きを抑える設定のとき ---------- */
@media (prefers-reduced-motion: reduce) {
  .kanae-caseCard,
  .kanae-caseCta__btn,
  .kanae-caseFilter__item { transition: none; }
  .kanae-caseCard:hover,
  .kanae-caseCta__btn:hover { transform: none; }
}