@charset "UTF-8";
/* ============================================================
   case-enhance.css v2 — 導入事例ページ プレミアムスタイル
   style.min.css(html 62.5% = 1rem=10px) + style_case.css の上にレイヤー
   ============================================================ */

/* --- フォント強制上書き --- */
body.case,
body.case .l-main,
body.case .l-main__case {
  font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  font-feature-settings: "palt" 1 !important;
  text-rendering: optimizeLegibility !important;
  background: var(--slate-50, #FAFAFC) !important;
  color: var(--slate-700, #334155) !important;
}

/* --- 記事コンテナ --- */
.p-case__wrapper.p-article {
  max-width: 740px;
  margin: 0 auto;
  padding: 40px 20px;
}

@media (min-width: 880px) {
  .p-case__wrapper.p-article { padding: 48px 32px; }
}

/* --- パンくず --- */
.p_pannav,
.p_pannav li,
.p_pannav li a,
.p_pannav li span {
  font-size: 17px !important;
  color: var(--slate-400, #94A3B8) !important;
  font-family: 'Noto Sans JP', sans-serif !important;
  letter-spacing: 0.03em !important;
}

.p_pannav {
  max-width: 740px;
  margin: 0 auto 20px !important;
  padding: 0 20px;
}

.p_pannav li a:hover { color: var(--blue-600, #0284C7) !important; }

/* --- タイトル (h1) --- */
.p-article__h1 {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  color: var(--slate-900, #0F172A) !important;
  letter-spacing: 0.01em !important;
  padding-left: 14px !important;
  margin-bottom: 20px !important;
}

@media (min-width: 880px) {
  .p-article__h1 { font-size: 22px !important; }
}

.p-article__h1--bk {
  color: var(--blue-700, #0369A1) !important;
  font-size: 0.7em !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em !important;
  display: block !important;
  margin-bottom: 3px !important;
}

.p-article__h1::before {
  width: 4px !important;
  border-radius: 2px !important;
  background: linear-gradient(180deg, var(--blue-500, #0EA5E9), var(--blue-700, #0369A1)) !important;
}

/* --- ヒーロー画像 --- */
.p-article__hero {
  border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(12,74,110,0.05) !important;
  max-width: 100% !important;
  height: auto !important;
  margin-bottom: 28px !important;
  overflow: hidden;
}

/* --- ロゴ＆会社名 — 統一バランス --- */
.p-article__info {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-bottom: 28px !important;
  padding: 16px !important;
  background: var(--slate-50, #FAFBFD) !important;
  border: 1px solid var(--slate-200, #E2E8F0) !important;
  border-radius: 10px !important;
}

.p-article__logo {
  flex: 0 0 56px !important;
  width: 56px !important;
  height: 56px !important;
  border: 1px solid var(--slate-200, #E2E8F0) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff !important;
  padding: 4px !important;
}

.p-article__logo-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 4px !important;
}

.p-article__company {
  flex: 1 !important;
  min-width: 0 !important;
}

.p-article__name {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--slate-900, #0F172A) !important;
  letter-spacing: 0.02em !important;
  line-height: 1.35 !important;
  margin-bottom: 4px !important;
}

.p-article__industry {
  display: inline-block !important;
  background: var(--blue-700, #0369A1) !important;
  border-radius: 4px !important;
  font-size: 11.5px !important;
  letter-spacing: 0.04em !important;
  padding: 3px 8px !important;
  color: #fff !important;
  font-family: 'Noto Sans JP', sans-serif !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  height: auto !important;
}

/* --- 会社情報テーブル --- */
.p-article__detail {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin-bottom: 36px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 1px 3px rgba(12,74,110,0.03) !important;
  border: 1px solid #E2E8F0 !important;
  width: 100% !important;
}

.p-article__detail th,
.p-article__detail td {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 17px !important;
  letter-spacing: 0.02em !important;
  padding: 10px 12px !important;
  border-bottom: 1px solid var(--slate-200, #E2E8F0) !important;
  line-height: 1.6 !important;
  word-break: break-word !important;
}

.p-article__detail tr:last-child th,
.p-article__detail tr:last-child td { border-bottom: none !important; }

.p-article__detail th {
  background: var(--blue-50, #F0F9FF) !important;
  color: var(--blue-900, #0C4A6E) !important;
  font-weight: 600 !important;
  text-align: left !important;
  white-space: nowrap !important;
  vertical-align: top !important;
  width: 100px !important;
}

.p-article__detail td {
  background: #fff !important;
  color: var(--slate-700, #334155) !important;
  font-weight: 400 !important;
}

/* --- インタビューセクション --- */
.p-article__interview {
  border: 1px solid var(--slate-200, #E2E8F0) !important;
  border-radius: 12px !important;
  padding: 32px 24px !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(12,74,110,0.03) !important;
}

@media (min-width: 880px) {
  .p-article__interview { padding: 40px 32px !important; }
}

/* --- h2 見出し --- */
.p-article__hdg {
  font-family: 'Noto Sans JP', sans-serif !important;
  border-left: 3px solid var(--blue-500, #0EA5E9) !important;
  padding-left: 12px !important;
  border-bottom: none !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--slate-900, #0F172A) !important;
  letter-spacing: 0.02em !important;
  line-height: 1.4 !important;
  margin: 0 0 14px !important;
}

@media (min-width: 880px) {
  .p-article__hdg { font-size: 17px !important; }
}

.p-article__hdg::before { display: none !important; }

/* --- 本文 --- */
.p-article__doc {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 17px !important;
  line-height: 1.85 !important;
  color: var(--slate-700, #334155) !important;
  letter-spacing: 0.025em !important;
}

@media (min-width: 880px) {
  .p-article__doc { font-size: 14.5px !important; }
}

/* --- 記事内画像 --- */
.p-article__img {
  border-radius: 10px !important;
  box-shadow: 0 2px 6px rgba(12,74,110,0.04) !important;
  max-width: 100% !important;
  height: auto !important;
  margin-top: 20px !important;
}

/* --- セクション間スペーシング --- */
.p-article__section {
  margin-bottom: 32px !important;
}

@media (min-width: 880px) {
  .p-article__section { margin-bottom: 40px !important; }
}

.p-article__section:last-of-type { margin-bottom: 0 !important; }

/* ============================================================
   事例一覧ページ カード改善
   ============================================================ */

/* 一覧の見出し */
.c-hdg__h1 {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  margin-bottom: 24px !important;
}

.c-hdg__h1--grad {
  background: linear-gradient(90deg, var(--blue-700, #0369A1), var(--blue-500, #0EA5E9)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

/* カードリンク */
.c-thumb__link {
  width: 100% !important;
  border-radius: 12px !important;
  border: 1px solid var(--slate-200, #E2E8F0) !important;
  padding: 14px 14px 18px !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 1px 3px rgba(12,74,110,0.02) !important;
  font-family: 'Noto Sans JP', sans-serif !important;
}

/* カード間の余白調整 */
.c-thumb__item {
  margin-bottom: 20px !important;
  padding: 0 4px !important;
}

/* カードグリッド全体を広げる */
.c-thumb {
  max-width: 1200px !important;
  margin: 0 auto !important;
  gap: 0 !important;
}

@media (min-width: 600px) {
  .c-thumb__item { width: 50% !important; }
}

@media (min-width: 880px) {
  .c-thumb__item { width: 33.333% !important; }
}

.c-thumb__link:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 4px 12px rgba(12,74,110,0.08) !important;
  border-color: var(--blue-500, #0EA5E9) !important;
  opacity: 1 !important;
}

/* カード画像 — 全画像をアスペクト比16:9に統一 */
.c-thumb__img,
.c-thumb__link > img {
  border-radius: 8px !important;
  overflow: hidden !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16/9 !important;
  object-fit: cover !important;
  display: block !important;
  margin-bottom: 12px !important;
  background: var(--blue-50, #F0F9FF);
}

/* カード見出し（企業名） */
.c-thumb__hdg {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--blue-700, #0369A1) !important;
  letter-spacing: 0.01em !important;
  line-height: 1.4 !important;
  margin: 8px 0 5px !important;
  word-break: keep-all !important;
  overflow-wrap: anywhere !important;
}

/* 業種バッジ */
.c-thumb__industry {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em !important;
  margin-bottom: 4px !important;
}

.c-thumb__industry--label {
  background: var(--blue-700, #0369A1) !important;
  border-radius: 3px !important;
  font-size: 11px !important;
  padding: 2px 6px !important;
}

/* カード詳細テキスト */
.c-thumb__detail th,
.c-thumb__detail td {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  letter-spacing: 0.02em !important;
  color: var(--slate-600, #475569) !important;
  padding: 3px 0 3px 6px !important;
}

.c-thumb__detail th {
  font-weight: 600 !important;
  color: var(--slate-700, #334155) !important;
}

.c-thumb__detail th span {
  background: var(--blue-50, #F0F9FF) !important;
  border-radius: 3px !important;
  padding: 2px 6px !important;
  font-size: 11px !important;
}

/* 「詳しく見る」ボタン */
.c-thumb__btn {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  border-radius: 6px !important;
  padding: 6px 14px !important;
}

/* フィルターボタン・ナビ */
.c-filter__btn,
.c-filter button,
body.case .l-main button,
.p-case__nav-item a {
  font-family: 'Noto Sans JP', sans-serif !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em !important;
}

/* 一覧ナビ — セグメントコントロール（1行固定） */
.p-case__nav {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  justify-content: center !important;
  margin: 0 auto 40px !important;
  list-style: none !important;
  padding: 4px !important;
  background: var(--slate-100, #EEF2F6) !important;
  border-radius: 10px !important;
  width: fit-content !important;
}

.p-case__nav-item {
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
}

.p-case__nav-item a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 12px !important;
  border: none !important;
  border-radius: 7px !important;
  min-width: 0 !important;
  width: auto !important;
  color: var(--slate-500, #64748B) !important;
  background: transparent !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  text-decoration: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: none !important;
  height: 34px !important;
}

.p-case__nav-item a::after {
  display: none !important;
}

/* visited/linkの装飾も完全除去 */
.p-case__nav-item a:link,
.p-case__nav-item a:visited {
  text-decoration: none !important;
  color: var(--slate-500, #64748B) !important;
}

.p-case__nav-item a:hover {
  color: #0F172A !important;
  background: rgba(255,255,255,0.6) !important;
}

.p-case__nav-item a.is-page,
.p-case__nav-item a[href="/case/"].is-page,
.p-case__nav-item a.is-current {
  background: #fff !important;
  color: #0F172A !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04) !important;
  border-radius: 7px !important;
}

/* 事例セクションの上余白を統一 */
body.case .jo-section,
body.case-page .jo-section {
  padding-top: 48px !important;
}

@media (max-width: 640px) {
  .p-case__nav {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    margin: 0 0 28px !important;
    border-radius: 8px !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .p-case__nav-item a {
    padding: 8px 14px !important;
    font-size: 12px !important;
    height: 34px !important;
  }
}

/* ============================================================
   モバイル
   ============================================================ */
@media (max-width: 599px) {
  .p-case__wrapper.p-article { padding: 28px 16px; }
  .p-article__interview { padding: 24px 16px !important; }
  .p-article__detail th { white-space: normal !important; width: 80px !important; }
  .p-article__info { flex-direction: column !important; align-items: flex-start !important; }
  .p-article__logo { margin-bottom: 8px !important; }
  .p-article__company { width: 100% !important; }
  .c-thumb__hdg { font-size: 13px !important; }
  .c-thumb__detail th, .c-thumb__detail td { font-size: 11px !important; }
}