/* =========================================================
   detail-page.css  —  아이탐라 상세 페이지 공통 스타일
   모든 카테고리(생활정보·부동산·중고차·구인·보험)에 적용
   ========================================================= */

/* ── 레이아웃 기반 ───────────────────────────────────── */
.dp-layout {
  max-width: 1800px;
  margin: 0 auto;
  display: flex;
  background-color: #FAFAFA;
  min-height: 100vh;
}
.dp-side {
  width: 160px;
  flex-shrink: 0;
  background-color: #F5F5F5;
}
.dp-main {
  flex: 1;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  padding: 32px 48px;
  min-width: 0;
}
@media (max-width: 1400px) {
  .dp-side { display: none; }
}
@media (max-width: 768px) {
  .dp-main { padding: 16px 16px; }
}

/* ── 헤더 ─────────────────────────────────────────────── */
.dp-header {
  background: #fff;
  border-bottom: 1px solid #E0E0E0;
  position: sticky;
  top: 0;
  z-index: 100;
}
.dp-header-inner {
  max-width: 1800px;
  margin: 0 auto;
  padding: 12px 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.dp-header-left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.dp-logo img {
  height: 44px;
  display: block;
}
.dp-header-cat {
  font-size: 14px;
  font-weight: 600;
  color: #1a3fa4;
  background: #E3F2FD;
  padding: 4px 12px;
  border-radius: 20px;
  text-decoration: none;
  white-space: nowrap;
}
.dp-header-cat:hover { background: #BBDEFB; }
.dp-header-right {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dp-list-link {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #555;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  padding: 6px 10px;
  border-radius: 8px;
  transition: background 0.15s;
}
.dp-list-link:hover { background: #F3F4F6; }
@media (max-width: 600px) {
  .dp-header-inner { padding: 10px 16px; }
  .dp-logo img { height: 36px; }
  .dp-header-cat { display: none; }
}

/* ── 뒤로 버튼 ────────────────────────────────────────── */
.dp-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #6B7280;
  background: none;
  border: none;
  cursor: pointer;
  margin-bottom: 20px;
  font-size: 14px;
  font-weight: 500;
  font-family: inherit;
  padding: 0;
  transition: color 0.15s;
}
.dp-back:hover { color: #1a3fa4; }

/* ── Not Found ────────────────────────────────────────── */
.dp-not-found {
  display: none;
  text-align: center;
  padding: 80px 24px;
}
.dp-not-found h2 { font-size: 20px; color: #374151; margin-bottom: 8px; }
.dp-not-found p  { font-size: 15px; color: #9CA3AF; margin-bottom: 24px; }
.dp-not-found-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.dp-not-found-btn {
  padding: 10px 24px; border-radius: 10px; font-size: 14px; font-weight: 600;
  text-decoration: none; cursor: pointer; border: none; font-family: inherit;
  background: #1a3fa4; color: #fff;
}
.dp-not-found-btn.ghost { background: #F1F5F9; color: #374151; }

/* ── 이미지 갤러리 (공통: 메인 좌 + 썸네일 우) ────────── */
.dp-gallery {
  display: grid;
  grid-template-columns: 1fr 110px;
  gap: 10px;
  margin-bottom: 24px;
  border-radius: 16px;
  overflow: hidden;
  background: #f3f4f6;
  width: 100%;
  box-sizing: border-box;
}
.dp-gallery.no-sub { grid-template-columns: 1fr; }
.dp-gallery.no-sub .dp-gallery-sub { display: none; }
.dp-gallery-main {
  position: relative;
  aspect-ratio: 4/3;
  background: #E5E7EB;
  overflow: hidden;
  cursor: zoom-in;
  border-radius: 12px;
}
.dp-gallery-main img {
  width: 100%; height: 100%; object-fit: contain; object-position: center;
  display: block; background: #f3f4f6;
  transition: opacity 0.3s;
}
.dp-gallery-sub {
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 2px;
  max-height: 480px;
  width: 100%;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.dp-gallery-sub::-webkit-scrollbar { width: 4px; }
.dp-gallery-sub::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
.dp-gallery-thumb {
  width: 100%;
  aspect-ratio: 1/1;
  background: #E5E7EB;
  overflow: hidden;
  cursor: pointer;
  position: relative;
  border-radius: 8px;
  flex-shrink: 0;
  border: 2px solid transparent;
  transition: border-color 0.15s;
}
.dp-gallery-thumb.active { border-color: #1e40af; }
/* 썸네일 최대 크기 제한 — 1~2개만 있을 때 너무 크게 늘어나지 않도록 */
.dp-gallery-thumb { max-width: 110px; max-height: 110px; }
.dp-gallery-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 0.2s;
}
.dp-gallery-thumb:hover img { transform: scale(1.06); }
.dp-gallery-thumb.has-more::after {
  content: attr(data-more);
  position: absolute; inset: 0;
  background: rgba(0,0,0,.45);
  color: #fff; font-size: 18px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}

/* ── 부동산 썸네일: 가로 스크롤 (re-thumbs 복원) ── */
.re-thumbs.dp-gallery-sub {
  flex-direction: row;
  overflow-x: auto;
  overflow-y: hidden;
  max-height: none;
  gap: 8px;
  padding-bottom: 4px;
  scrollbar-width: none;
}
.re-thumbs.dp-gallery-sub::-webkit-scrollbar { display: none; }
.re-thumbs.dp-gallery-sub .dp-gallery-thumb {
  flex: 0 0 74px;
  width: 74px;
  height: 74px;
  aspect-ratio: auto;
  max-width: none;
  max-height: none;
  border-radius: 10px;
  border: 2px solid transparent;
}
.re-thumbs.dp-gallery-sub .dp-gallery-thumb.active { border-color: #1d4ed8; }

/* ── 부동산 갤러리: 원래 레이아웃 (메인 전체폭 + 하단 썸네일) ── */
.dp-gallery--re {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 8px;
}
.dp-gallery--re .dp-gallery-main {
  aspect-ratio: 16/10;
  border-radius: 0;
}
.dp-gallery--re .dp-gallery-main img { object-fit: cover; }
.dp-gallery--re .dp-gallery-sub {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr 1fr;
  flex-direction: unset;
  overflow-y: visible;
  max-height: none;
  gap: 8px;
  padding: 0;
}
.dp-gallery--re .dp-gallery-thumb {
  aspect-ratio: 16/10;
  border-radius: 0;
  width: auto;
  max-width: none;
  max-height: none;
  border: none;
}

@media (max-width: 768px) {
  .dp-gallery { grid-template-columns: 1fr; }
  .dp-gallery-main { aspect-ratio: 16/10; }
  .dp-gallery-sub {
    flex-direction: row;
    overflow-x: auto; overflow-y: hidden;
    max-height: none;
    gap: 8px;
    padding: 8px 0;
    width: 100%;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
    -webkit-overflow-scrolling: touch;
  }
  .dp-gallery-sub::-webkit-scrollbar { height: 4px; width: auto; }
  .dp-gallery-sub::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
  .dp-gallery-thumb { width: 76px; min-width: 76px; aspect-ratio: 1/1; flex-shrink: 0; }
  .dp-gallery--re { grid-template-columns: 1fr; }
  .dp-gallery--re .dp-gallery-sub { display: flex; flex-direction: row; grid-template-columns: unset; grid-template-rows: unset; }
  .dp-gallery--re .dp-gallery-thumb { width: 80px; min-width: 80px; aspect-ratio: 4/3; }
  .dp-gallery--re .dp-gallery-main { aspect-ratio: 16/9; }
}

/* ── 정보 카드 (제목/뱃지/액션) ─────────────────────── */
.dp-card {
  background: #fff;
  border-radius: 20px;
  padding: 28px 28px;
  margin-bottom: 16px;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
  border: 1px solid #E8E8E8;
}
.dp-card-sm { padding: 20px 24px; }

/* 뱃지 열 */
.dp-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
  align-items: center;
}
.dp-badge {
  padding: 4px 12px;
  border-radius: 20px;
  font-size:13px;
  font-weight: 600;
  display: inline-block;
}
.dp-badge-cat  { background: #E3F2FD; color: #1a3fa4; }
.dp-badge-type { background: #ECFDF5; color: #059669; }
.dp-badge-prem { background: #FFF3E0; color: #D97706; }
.dp-badge-tag  { background: #F3F4F6; color: #4B5563; border: 1px solid #E5E7EB; }
.dp-badge-sub  { background: #6D28D9; color: #fff; }
.dp-badge-pin  { background: #EF4444; color: #fff; }

/* 제목 */
.dp-title {
  font-size: 26px;
  font-weight: 800;
  color: #111827;
  line-height: 1.3;
  margin-bottom: 6px;
}
.dp-subtitle {
  font-size: 14px;
  color: #6B7280;
  margin-bottom: 14px;
  line-height: 1.5;
}
/* 가격 (부동산/중고차 등) */
.dp-price {
  font-size: 22px;
  font-weight: 800;
  color: #1a3fa4;
  margin-bottom: 12px;
}
.dp-price-sub {
  font-size: 13px;
  color: #9CA3AF;
  font-weight: 400;
  margin-left: 6px;
}

/* 헤더 행: 제목 섹션 + 액션 버튼 */
.dp-info-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.dp-info-body { flex: 1; min-width: 0; }

/* 액션 버튼 (공유/찜/문의) */
.dp-actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}
.dp-icon-btn {
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 2px solid #E8E8E8;
  background: #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all 0.2s;
  color: #374151;
}
.dp-icon-btn:hover { background: #F9FAFB; border-color: #D1D5DB; }
.dp-icon-btn.liked { border-color: #FED7D7; background: #FFF5F5; color: #EF4444; }
.dp-icon-btn.liked svg { stroke: #EF4444; fill: #EF4444; }
@media (max-width: 600px) {
  .dp-info-row { flex-direction: column; }
  .dp-title { font-size: 20px; }
}

/* 메타 항목 (위치, 한줄소개 등) */
.dp-meta-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 16px;
}
.dp-meta-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: #374151;
}
.dp-meta-label {
  flex-shrink: 0;
  width: 90px;
  font-weight: 600;
  color: #6B7280;
  font-size: 13px;
}
.dp-meta-value { line-height: 1.5; }

/* ── 태그 ─────────────────────────────────────────────── */
.dp-tags {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px;
}
.dp-tag {
  padding: 4px 10px;
  border-radius: 20px;
  font-size:13px;
  font-weight: 500;
  background: #F8F9FA;
  color: #424242;
  border: 1px solid #E8E8E8;
}

/* ── 섹션 카드 (콘텐츠/스펙/사양 등) ──────────────────── */
.dp-section { margin-bottom: 16px; }
.dp-section-title {
  font-size: 17px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 2px solid #F3F4F6;
}
.dp-section-body { font-size: 14px; color: #374151; line-height: 1.7; }

/* 정보 행 테이블 */
.dp-rows {}
.dp-row {
  display: flex;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px solid #F3F4F6;
  font-size: 14px;
  gap: 12px;
}
.dp-row:last-child { border-bottom: none; }
.dp-row-label {
  flex-shrink: 0;
  width: 100px;
  font-weight: 600;
  color: #6B7280;
}
.dp-row-value { color: #111827; line-height: 1.5; }

/* ── 스펙 그리드 (중고차 등) ──────────────────────────── */
.dp-specs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.dp-spec-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  background: #F8FAFC;
  border-radius: 12px;
}
.dp-spec-icon { color: #6B7280; flex-shrink: 0; margin-top: 1px; }
.dp-spec-label { font-size:13px; color: #9CA3AF; margin-bottom: 3px; }
.dp-spec-value { font-size: 14px; font-weight: 600; color: #111827; }
@media (max-width: 600px) {
  .dp-specs { grid-template-columns: repeat(2, 1fr); }
}

/* ── 태그 목록 (특징) ─────────────────────────────────── */
.dp-feat-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.dp-feat-tag {
  padding: 6px 14px;
  background: #EFF6FF;
  border: 1px solid #BFDBFE;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  color: #1D4ED8;
}

/* ── CTA 버튼 ─────────────────────────────────────────── */
.dp-cta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.dp-cta-btn {
  flex: 1 1 120px;
  min-width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 20px;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  border: none;
  font-family: inherit;
  text-decoration: none;
  transition: all 0.2s;
}
.dp-cta-primary { background: #1a3fa4; color: #fff; }
.dp-cta-primary:hover { background: #152e82; }
.dp-cta-outline { background: #fff; border: 2px solid #1a3fa4; color: #1a3fa4; }
.dp-cta-outline:hover { background: #EFF6FF; }
.dp-cta-kakao { background: #FEE500; color: #3C1E1E; }
.dp-cta-kakao:hover { background: #F5DA00; }
.dp-cta-home { background: #F1F5F9; color: #374151; }
.dp-cta-home:hover { background: #E2E8F0; }
.dp-cta-apply { background: #059669; color: #fff; flex: 2 1 200px; }
.dp-cta-apply:hover { background: #047857; }
.dp-cta-apply:disabled,
.dp-cta-apply.applied { background: #9CA3AF; cursor: not-allowed; }
@media (max-width: 480px) {
  .dp-cta { flex-direction: column; }
  .dp-cta-btn { flex: none; }
}

/* ── 구인구직 전용 ────────────────────────────────────── */
.dp-company-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}
.dp-company-logo {
  width: 56px; height: 56px;
  border-radius: 14px;
  background: #E3F2FD;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  font-weight: 700;
  color: #1a3fa4;
  overflow: hidden;
  flex-shrink: 0;
}
.dp-company-logo img { width: 100%; height: 100%; object-fit: cover; }
.dp-company-name { font-size: 14px; color: #6B7280; font-weight: 500; }
.dp-key-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-top: 16px;
}
.dp-key-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  background: #F8FAFC;
  border-radius: 12px;
}
.dp-key-label { font-size:13px; color: #9CA3AF; margin-bottom: 3px; }
.dp-key-value { font-size: 14px; font-weight: 600; color: #111827; }
.dp-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dp-list { list-style: none; padding: 0; margin: 0; }
.dp-list li {
  padding: 8px 0;
  border-bottom: 1px solid #F3F4F6;
  font-size: 14px; color: #374151;
}
.dp-list li:last-child { border-bottom: none; }
.dp-list li::before { content: "✓ "; color: #059669; font-weight: 700; }
@media (max-width: 600px) {
  .dp-key-grid { grid-template-columns: 1fr; }
  .dp-two-col { grid-template-columns: 1fr; }
}

/* ── 보험/금융 전용 ───────────────────────────────────── */
.dp-price-box {
  background: #EFF6FF;
  border-radius: 14px;
  padding: 16px 20px;
  margin-bottom: 16px;
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.dp-price-label { font-size: 13px; color: #6B7280; font-weight: 500; }
.dp-price-value { font-size: 24px; font-weight: 800; color: #1a3fa4; }

/* ── 중고차 옵션 ──────────────────────────────────────── */
.dp-car-options-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.dp-option-group-title {
  font-size: 14px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 10px;
}
.dp-option-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.dp-option-tag {
  padding: 6px 14px;
  background: #EFF6FF;
  border: 1px solid #BFDBFE;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  color: #1D4ED8;
}

/* ── 정비 이력 ────────────────────────────────────────── */
.dp-history-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dp-history-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 16px;
  background: #F8FAFC;
  border-radius: 12px;
  border-left: 3px solid #BFDBFE;
}
.dp-history-date {
  font-size: 13px;
  font-weight: 700;
  color: #1a3fa4;
  min-width: 70px;
  flex-shrink: 0;
}
.dp-history-content {
  font-size: 14px;
  color: #374151;
}

/* ── 판매자 정보 ──────────────────────────────────────── */
.dp-dealer-row {
  display: flex;
  align-items: center;
  gap: 20px;
}
.dp-dealer-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #E3F2FD;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #1a3fa4;
}
.dp-dealer-info { flex: 1; }
.dp-dealer-name {
  font-size: 16px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 8px;
}
.dp-dealer-contacts {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.dp-dealer-contact-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #4B5563;
}
.dp-dealer-contact-item svg { color: #9CA3AF; flex-shrink: 0; }

/* ── 로딩 스피너 ──────────────────────────────────────── */
.dp-loading {
  text-align: center;
  padding: 60px 24px;
  color: #9CA3AF;
  font-size: 14px;
}
.dp-spinner {
  width: 32px; height: 32px;
  border: 3px solid #E5E7EB;
  border-top-color: #1a3fa4;
  border-radius: 50%;
  animation: dp-spin 0.7s linear infinite;
  margin: 0 auto 12px;
}
@keyframes dp-spin { to { transform: rotate(360deg); } }

/* ── 이미지 라이트박스 ────────────────────────────────── */
.dp-lightbox {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.9);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
}
.dp-lightbox.active { display: flex; }
.dp-lightbox img {
  max-width: 92vw; max-height: 92vh;
  object-fit: contain;
  border-radius: 8px;
}
.dp-lightbox-close {
  position: absolute; top: 20px; right: 20px;
  background: none; border: none; color: #fff;
  font-size: 28px; cursor: pointer; line-height: 1;
}

/* ── 구독 배지 오버레이 ───────────────────────────────── */
.dp-sub-overlay {
  position: absolute; bottom: 10px; left: 10px;
  background: #6D28D9; color: #fff;
  padding: 4px 10px; border-radius: 8px;
  font-size:13px; font-weight: 700;
  display: flex; align-items: center; gap: 4px;
}
.dp-sub-overlay img { width: 16px; height: 16px; border-radius: 3px; }

/* ── 지원하기 모달 ────────────────────────────────────── */
.dp-modal-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 9990;
  display: none;
  align-items: flex-end;
  justify-content: center;
}
.dp-modal-overlay.active { display: flex; }
.dp-modal-box {
  background: #fff;
  border-radius: 24px 24px 0 0;
  width: min(540px, 100%);
  max-height: 90vh;
  overflow-y: auto;
  padding: 28px 24px 40px;
  position: relative;
}
.dp-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.dp-modal-title { font-size: 18px; font-weight: 700; }
.dp-modal-close {
  background: none; border: none; font-size: 22px;
  cursor: pointer; color: #9CA3AF; padding: 4px;
}
.dp-resume-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px;
  border: 2px solid #E5E7EB;
  border-radius: 14px;
  margin-bottom: 10px;
  cursor: pointer;
  background: #fff;
  width: 100%;
  text-align: left;
  transition: border-color 0.15s;
}
.dp-resume-item:hover { border-color: #93C5FD; }
.dp-resume-item.selected { border-color: #1a3fa4; background: #EFF6FF; }
.dp-resume-icon { color: #6B7280; flex-shrink: 0; }
.dp-resume-name { font-size: 14px; font-weight: 600; color: #111827; }
.dp-resume-meta { font-size:13px; color: #9CA3AF; margin-top: 2px; }

/* ── 반응형 ───────────────────────────────────────────── */
@media (max-width: 480px) {
  .dp-card { padding: 18px 16px; border-radius: 14px; }
  .dp-title { font-size: 18px; }
  .dp-specs { grid-template-columns: 1fr 1fr; }
}


.dp-header-center{flex:1;display:flex;justify-content:center;min-width:0;padding:0 20px;}
.dp-breadcrumb{max-width:100%;font-size:13px;line-height:1.3;color:#7b8494;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;}
.dp-breadcrumb span{vertical-align:middle;}
.dp-breadcrumb .is-current{color:#394150;font-weight:600;}
.dp-breadcrumb-sep{display:inline-block;margin:0 6px;color:#b1b8c4;}
@media (max-width:768px){.dp-header-center{display:none;}}


/* breadcrumb patch start */
.dp-header-center {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  justify-content: center;
  padding: 0 20px;
}
.dp-category-breadcrumb {
  display: none;
  max-width: 560px;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #6b7280;
  font-size:13px;
  line-height: 1.2;
  text-align: center;
}
.dp-category-breadcrumb.is-visible {
  display: block;
}
.dp-category-breadcrumb .sep {
  margin: 0 6px;
  color: #9ca3af;
}
.dp-category-breadcrumb .last {
  color: #374151;
  font-weight: 700;
}
@media (max-width: 980px) {
  .dp-header-center {
    display: none;
  }
}
/* breadcrumb patch end */


/* [HOTFIX 260321] 생활정보 상세 모바일 정보행(카카오 문의) 실제 구조 보정
   대상: detail-page.css + dp-renderers.js 가 생성하는 .dp-row 구조
*/
@media (max-width: 768px) {
  .dp-row {
    display: block !important;
    grid-template-columns: none !important;
    padding: 12px 0 !important;
    gap: 0 !important;
  }
  .dp-row-label {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 8px 0 !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    line-height: 1.5 !important;
  }
  .dp-row-value {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: left !important;
    line-height: 1.6 !important;
    word-break: break-all !important;
    overflow-wrap: anywhere !important;
  }
  .dp-row-value a {
    display: inline-block !important;
    max-width: 100% !important;
    line-height: 1.6 !important;
    word-break: break-all !important;
    overflow-wrap: anywhere !important;
    vertical-align: top !important;
  }
}


/* [FINAL FIX] 카카오 문의 라벨 깨짐 강제 해결 */
@media (max-width: 768px) {

  .dp-row-label {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    display: block !important;

    /* 핵심: 세로 깨짐 방지 */
    writing-mode: horizontal-tb !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;

    letter-spacing: 0 !important;
  }

  .dp-row {
    display: block !important;
  }

  .dp-row-value {
    display: block !important;
    margin-top: 6px !important;
  }
}