
/* 사이트 <head>에 1회 로드. 이미지 url('../../img/...')은 아임웹 업로드 URL로 교체 */
/* 아임웹 우선순위 대응: 클래스 규칙에 !important 자동 부여됨 (요소/전역 선택자는 제외) */

/* ============================================
   법률사무소 바람 — Preview 공통 스타일
   ============================================ */

@font-face {
  font-family: 'GounBatang';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/GowunBatang-Regular.woff') format('woff');
  font-weight: normal;
  font-display: swap;
}
@font-face {
  font-family: 'GounBatang';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/GowunBatang-Bold.woff') format('woff');
  font-weight: 700;
  font-display: swap;
}

:root {
  /* 컬러 토큰 (기획안 컬러 가이드) */
  --color-main: #51A7A2;
  --color-main-dark: #449791;
  --color-sub: #1E2E3E;
  --color-sub-2: #5CAAA1;
  --color-point: #6F7A82;
  --color-bg: #FFFFFF;
  --color-bg-2: #F4F6F7;
  --color-line: #D7DBDE;

  /* 타이포 */
  --font-base: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;

  /* 레이아웃 */
  --max-width: 1200px;
  --header-height: 72px;
  --section-pad-y: 120px;
  --radius: 10px;
  --radius-lg: 16px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
*::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
body {
  font-family: var(--font-base);
  color: var(--color-sub);
  font-size: 17px;
  line-height: 1.5;
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; }
ul, ol { list-style: none; }

.container {
  max-width: var(--max-width) !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}

/* ===== 헤더 ===== */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border-bottom: 1px solid var(--color-line) !important;
}
.site-header__inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: var(--header-height) !important;
}
.site-header__logo {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--color-main) !important;
}
.site-header__logo img {
  height: 26px !important;
  width: auto !important;
  max-width: 160px !important;
  display: block !important;
  object-fit: contain !important;
}
.site-header__logo span {
  color: var(--color-sub) !important;
  font-weight: 600 !important;
  margin-left: 4px !important;
  font-size: 16px !important;
}
.site-header__nav {
  display: flex !important;
  gap: 36px !important;
}
.site-header__nav a {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--color-sub) !important;
  padding: 6px 0 !important;
  position: relative !important;
  transition: color 0.2s !important;
}
.site-header__nav a:hover,
.site-header__nav a.is-active {
  color: var(--color-main) !important;
}
.site-header__nav a.is-active::after {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -4px !important;
  height: 2px !important;
  background: var(--color-main) !important;
}
.site-header__menu-toggle {
  display: none !important;
  flex-direction: column !important;
  gap: 5px !important;
  padding: 8px !important;
}
.site-header__menu-toggle span {
  width: 22px !important;
  height: 2px !important;
  background: var(--color-sub) !important;
  transition: transform 0.2s, opacity 0.2s !important;
}

/* ===== 푸터 (라이트 톤) ===== */
.site-footer {
  background: #F4F6F7 !important;
  color: var(--color-point) !important;
  padding: 72px 0 40px !important;
  font-size: 14px !important;
  border-top: 1px solid var(--color-line) !important;
}
.site-footer__inner {
  display: flex !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 40px !important;
}
.site-footer__logo {
  display: block !important;
  margin-bottom: 20px !important;
}
.site-footer__logo img {
  height: 40px !important;
  width: auto !important;
  max-width: 200px !important;
  display: block !important;
  object-fit: contain !important;
}
.site-footer__brand {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--color-sub) !important;
  margin-bottom: 16px !important;
  letter-spacing: -0.02em !important;
}
.site-footer__info p { margin-bottom: 8px !important; color: var(--color-point) !important; }
.site-footer__info a { color: var(--color-point) !important; transition: color 0.2s !important; }
.site-footer__info a:hover { color: var(--color-main) !important; }
.site-footer__bottom {
  margin-top: 44px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--color-line) !important;
  font-size: 13px !important;
  color: var(--color-point) !important;
  opacity: 0.7 !important;
}

/* ===== 플로팅바 ===== */
.floating-bar {
  position: fixed !important;
  right: 24px !important;
  bottom: 24px !important;
  z-index: 40 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  transition: opacity 0.35s ease, transform 0.35s ease !important;
}
.floating-bar.is-hidden {
  opacity: 0 !important;
  transform: translateY(24px) !important;
  pointer-events: none !important;
}
.floating-bar__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 14px 24px !important;
  min-width: 168px !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  letter-spacing: -0.01em !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
  position: relative !important;
  overflow: hidden !important;
}
.floating-bar__btn--call {
  background: #303E4D !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(48, 62, 77, 0.30) !important;
  cursor: pointer !important;
}
.floating-bar__btn--kakao {
  background: #FEE500 !important;
  color: #181600 !important;
  box-shadow: 0 10px 24px rgba(254, 229, 0, 0.32) !important;
}
.floating-bar__btn:hover {
  transform: translateY(-2px) !important;
}
.floating-bar__btn .ico {
  width: 20px !important;
  height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.floating-bar__btn .ico img,
.floating-bar__btn .ico svg {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}
/* 전화 버튼 호버 슬라이드 (PC만) */
.floating-bar__btn-text {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  transition: transform 0.4s cubic-bezier(0.4,0,0.2,1), opacity 0.3s ease !important;
  white-space: nowrap !important;
}
.floating-bar__btn-text--hover {
  position: absolute !important;
  top: 50% !important;
  left: 0 !important;
  right: 0 !important;
  transform: translateY(calc(-50% + 120%)) !important;
  opacity: 0 !important;
  justify-content: center !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: 0.02em !important;
}
@media (hover: hover) {
  .floating-bar__btn--call:hover .floating-bar__btn-text--default {
    transform: translateY(-160%) !important;
    opacity: 0 !important;
  }
  .floating-bar__btn--call:hover .floating-bar__btn-text--hover {
    transform: translateY(-50%) !important;
    opacity: 1 !important;
  }
}
@media (hover: none) {
  .floating-bar__btn--call { cursor: pointer !important; }
  .floating-bar__btn-text--hover { display: none !important; }
}

/* ===== 공통 버튼 (pill) ===== */
.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 14px 32px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  transition: background-color 0.45s cubic-bezier(0.22, 0.61, 0.36, 1),
              color 0.45s cubic-bezier(0.22, 0.61, 0.36, 1),
              border-color 0.45s cubic-bezier(0.22, 0.61, 0.36, 1),
              box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
  white-space: nowrap !important;
  position: relative !important;
  border: 1px solid transparent !important;
  line-height: 1.4 !important;
}
.btn .btn__arrow {
  display: inline-block !important;
  font-size: 1em !important;
  line-height: 1 !important;
  transition: transform 0.35s ease !important;
}
.btn:hover .btn__arrow { transform: translateX(5px) !important; }

.btn--primary {
  background: var(--color-sub) !important;
  color: #fff !important;
  border-color: var(--color-sub) !important;
  box-shadow: 0 6px 16px rgba(30,46,62,0.12) !important;
}
.btn--primary:hover {
  background: var(--color-main) !important;
  border-color: var(--color-main) !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 28px rgba(81,167,162,0.30) !important;
}

.btn--outline {
  background: transparent !important;
  border-color: var(--color-line) !important;
  color: var(--color-point) !important;
}
.btn--outline:hover {
  background: var(--color-main) !important;
  color: #fff !important;
  border-color: var(--color-main) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 24px rgba(81,167,162,0.28) !important;
}

.btn--accent {
  background: var(--color-main) !important;
  color: #fff !important;
  border-color: var(--color-main) !important;
  box-shadow: 0 6px 16px rgba(81,167,162,0.22) !important;
}
.btn--accent:hover {
  background: var(--color-main-dark) !important;
  border-color: var(--color-main-dark) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 28px rgba(81,167,162,0.32) !important;
}

.btn--ghost {
  background: transparent !important;
  color: var(--color-sub) !important;
  border-color: transparent !important;
  padding: 8px 0 !important;
  border-radius: 0 !important;
  gap: 8px !important;
}
.btn--ghost::after {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 2px !important;
  height: 1px !important;
  background: var(--color-sub) !important;
  transform-origin: left !important;
  transition: transform 0.35s ease, background-color 0.45s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
.btn--ghost:hover {
  transform: translateY(-1px) !important;
  color: var(--color-main) !important;
}
.btn--ghost:hover::after {
  transform: scaleX(0.85) !important;
  background: var(--color-main) !important;
}

.btn--lg {
  padding: 13px 38px !important;
  font-size: 15px !important;
}

/* ===== 섹션 ===== */
.section {
  padding: var(--section-pad-y) 0 !important;
}
.section--bg {
  background: var(--color-bg-2) !important;
}
.section__header {
  text-align: center !important;
  margin-bottom: 64px !important;
}
.section__label,
.brand-section__label,
.page-intro__label {
  display: none !important;
}
.section__title {
  font-size: clamp(32px, 3.6vw, 44px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.25 !important;
  color: var(--color-sub) !important;
}
.section__subtitle {
  font-size: clamp(16px, 1.4vw, 19px) !important;
  color: var(--color-point) !important;
  margin-top: 20px !important;
  line-height: 1.5 !important;
}

/* ===== 카드 ===== */
.card {
  background: #fff !important;
  border: 1px solid var(--color-line) !important;
  border-radius: var(--radius-lg) !important;
  padding: 36px !important;
  transition: all 0.25s !important;
}
.card:hover {
  border-color: var(--color-main) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 14px 32px rgba(30, 46, 62, 0.06) !important;
}
.card__title {
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 12px !important;
  color: var(--color-sub) !important;
}
.card__body {
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: var(--color-point) !important;
}

/* ===== CTA 섹션 (각 페이지 하단) ===== */
.cta-section {
  position: relative !important;
  padding: 130px 0 110px !important;
  color: #fff !important;
  text-align: center !important;
  overflow: hidden !important;
}
.cta-section::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(15, 24, 33, 0.5) !important;
  pointer-events: none !important;
}
.cta-section > .container { position: relative !important; z-index: 1 !important; }
.cta-section__contacts {
  display: inline-flex !important;
  align-items: center !important;
  gap: 48px !important;
  margin-top: 56px !important;
  padding-top: 40px !important;
  border-top: 1px solid rgba(255,255,255,0.14) !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
}
.cta-contact__value a { color: inherit !important; transition: color 0.2s ease !important; }
.cta-contact__value a:hover { color: var(--color-main) !important; }
.cta-contact {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  color: #fff !important;
}
.cta-contact__icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: rgba(81,167,162,0.18) !important;
  color: var(--color-main) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.cta-contact__icon svg { width: 18px !important; height: 18px !important; }
.cta-contact__text {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  text-align: left !important;
}
.cta-contact__label {
  font-size: 11px !important;
  letter-spacing: 0.18em !important;
  color: rgba(255,255,255,0.55) !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
}
.cta-contact__value {
  font-size: 16px !important;
  font-weight: 500 !important;
  color: #fff !important;
  font-variant-numeric: tabular-nums !important;
}
.cta-section__title {
  font-family: 'Pretendard', sans-serif !important;
  font-size: clamp(32px, 3.8vw, 46px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.3 !important;
  margin-bottom: 28px !important;
  color: #fff !important;
}
.cta-section__body {
  font-size: clamp(16px, 1.3vw, 18px) !important;
  line-height: 1.85 !important;
  color: rgba(255,255,255,0.78) !important;
  margin: 0 auto 48px !important;
  max-width: 640px !important;
  letter-spacing: -0.01em !important;
  word-break: keep-all !important;
}
.cta-section__body br { display: inline !important; }
.nowrap { white-space: nowrap !important; }
.cta-section__buttons {
  display: flex !important;
  gap: 12px !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
}
.cta-section .btn {
  transition: background-color 0.5s cubic-bezier(0.22, 0.61, 0.36, 1),
              color 0.5s cubic-bezier(0.22, 0.61, 0.36, 1),
              border-color 0.5s cubic-bezier(0.22, 0.61, 0.36, 1),
              box-shadow 0.5s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
.cta-section .btn--primary {
  background: #fff !important;
  color: var(--color-sub) !important;
  border-color: #fff !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18) !important;
}
.cta-section .btn--primary:hover {
  background: var(--color-main) !important;
  color: #fff !important;
  border-color: var(--color-main) !important;
  box-shadow: 0 6px 24px rgba(81,167,162,0.45) !important;
  transform: translateY(-3px) !important;
}
.cta-section .btn--outline {
  background: transparent !important;
  border-color: rgba(255,255,255,0.55) !important;
  color: #fff !important;
}
.cta-section .btn--outline:hover {
  background: rgba(255,255,255,0.10) !important;
  color: #fff !important;
  border-color: #fff !important;
  transform: translateY(-3px) !important;
}

/* 버튼 아이콘 (이미지) */
.btn__icon {
  width: 20px !important;
  height: 20px !important;
  object-fit: contain !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
}

/* 카카오톡 버튼 (노란색) */
.btn--kakao {
  background: #FEE500 !important;
  color: #181600 !important;
  border-color: #FEE500 !important;
}
.btn--kakao:hover {
  background: #FFD600 !important;
  color: #181600 !important;
  border-color: #FFD600 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 28px rgba(254,229,0,0.32) !important;
}
.cta-section .btn--kakao {
  background: #FEE500 !important;
  color: #181600 !important;
  border-color: #FEE500 !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18) !important;
}
.cta-section .btn--kakao:hover {
  background: #FFD600 !important;
  color: #181600 !important;
  border-color: #FFD600 !important;
  box-shadow: 0 6px 24px rgba(254, 229, 0, 0.42) !important;
  transform: translateY(-3px) !important;
}

/* ===== 스크롤 리빌 애니메이션 ===== */
.reveal {
  opacity: 0 !important;
  transform: translateY(28px) !important;
  transition: opacity 0.85s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.85s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
  will-change: opacity, transform !important;
}
.reveal.is-visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}
.reveal-stagger > * {
  opacity: 0 !important;
  transform: translateY(20px) !important;
  transition: opacity 0.75s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.75s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
.reveal-stagger.is-visible > * {
  opacity: 1 !important;
  transform: translateY(0) !important;
}
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-stagger > * {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ===== 헤더 스크롤 변화 ===== */
.site-header { transition: background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important; }
.site-header.is-scrolled {
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 6px 20px rgba(30, 46, 62, 0.06) !important;
  border-bottom-color: transparent !important;
}

/* ===== 이미지/카드 호버 줌 ===== */
.intro__photo, .lawyer-photo {
  transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
}
.intro__photo:hover, .lawyer-photo:hover {
  transform: scale(1.015) !important;
}
.post-card__thumb {
  overflow: hidden !important;
  transition: transform 0.5s ease !important;
}
.post-card:hover .post-card__thumb { transform: scale(1.03) !important; }

/* ===== 카드 일괄 부드러운 전이 ===== */
.practice-card, .service-card, .post-card, .practice-detail__item, .info-block {
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1),
              box-shadow 0.35s ease,
              border-color 0.3s ease !important;
}

/* ===== 토스트 알림 (전화번호 복사 등) ===== */
.toast {
  position: fixed !important;
  bottom: 110px !important;
  left: 50% !important;
  transform: translateX(-50%) translateY(20px) !important;
  background: rgba(30,46,62,0.94) !important;
  color: #fff !important;
  padding: 14px 26px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  z-index: 100 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.3s ease, transform 0.3s ease !important;
  white-space: nowrap !important;
  box-shadow: 0 12px 28px rgba(30,46,62,0.25) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
}
.toast.is-visible {
  opacity: 1 !important;
  transform: translateX(-50%) translateY(0) !important;
}

/* ===== 반응형 ===== */
@media (max-width: 900px) {
  :root {
    --section-pad-y: 80px;
    --header-height: 60px;
  }
  .section__title { font-size: 28px !important; }
  .cta-section { padding: 72px 0 !important; }
  .cta-section__title { font-size: 24px !important; }
  .cta-section__contacts {
    flex-direction: column !important;
    gap: 18px !important;
    margin-top: 36px !important;
    padding-top: 28px !important;
  }
  .cta-section__buttons {
    flex-direction: column !important;
    align-items: center !important;
  }
  .cta-section__buttons .btn {
    width: 100% !important;
    max-width: 320px !important;
  }

  .site-header__nav {
    display: none !important;
    position: fixed !important;
    top: var(--header-height) !important;
    left: 0 !important;
    right: 0 !important;
    background: #fff !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 16px 24px 24px !important;
    border-bottom: 1px solid var(--color-line) !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06) !important;
  }
  .site-header__nav.is-open { display: flex !important; }
  .site-header__nav a {
    padding: 14px 0 !important;
    border-bottom: 1px solid var(--color-bg-2) !important;
  }
  .site-header__nav a.is-active::after { display: none !important; }
  .site-header__menu-toggle { display: flex !important; }

  .card { padding: 28px !important; }

  .site-header__logo img { height: 22px !important; max-width: 140px !important; }

  .floating-bar {
    right: 16px !important;
    bottom: 16px !important;
  }
  .floating-bar__btn {
    padding: 12px 18px !important;
    font-size: 14px !important;
  }

  .site-footer__inner { flex-direction: column !important; }
}

@media (max-width: 560px) {
  .container { padding: 0 20px !important; }
  .section__title { font-size: 24px !important; }
  .btn { padding: 12px 22px !important; font-size: 14px !important; }
}

/* ============================================================
   아임웹 테마 override 방지 가드
   (아임웹 기본 CSS가 우리 클래스를 우선순위로 덮어쓰는 것을 차단)
   ============================================================ */

/* 1) 폰트 — 본문 기본 + 명조 강조 */
.site-header, .site-footer, .floating-bar,
.hero, .section, .cta-section,
.hero *, .section *, .cta-section *,
.site-header *, .site-footer *, .floating-bar * {
  font-family: var(--font-base) !important;
}
.hero__title, .hero__title-line,
.hero__title-line--soft, .hero__title-line--bold,
.intro__top-title, .intro__sub-en, .intro__badge-sub,
.service-card__num,
.brand-section__title,
.lawyer-info__name span,
.practice-detail__no {
  font-family: 'GounBatang', 'Pretendard', serif !important;
}

/* 2) hero 서브카피·정렬 — 아임웹 p 마진/정렬 리셋 차단 */
.hero__content { text-align: center !important; }
.hero__title { margin: 0 0 44px !important; }
.hero__subtitle {
  max-width: 580px !important;
  margin: 0 auto 52px !important;
  text-align: center !important;
}
.hero__buttons { margin: 0 !important; }

/* 3) hero 스크롤 마우스 모양 — span display/border 리셋 차단 */
.hero__scroll-mouse {
  display: inline-block !important;
  width: 22px !important;
  height: 36px !important;
  border: 1.5px solid var(--color-sub) !important;
  border-radius: 14px !important;
  background: transparent !important;
}
.hero--dark .hero__scroll-mouse {
  border-color: rgba(255, 255, 255, 0.85) !important;
}
.hero__scroll-mouse::after { display: block !important; }

/* 4) 헤더·푸터 정렬 폭 통일 — 아임웹이 .container 폭을 흔드는 것 차단
   (헤더, 푸터 상단, 카피라이트가 모두 동일한 1200px 기준으로 정렬) */
.site-header__inner,
.site-footer__inner,
.site-footer__bottom {
  width: 100% !important;
  max-width: var(--max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box !important;
}
.site-footer__inner { display: flex !important; justify-content: space-between !important; }

/* 5) 아임웹 .container 클래스 충돌 — 테마가 .container 에 붙이는 clearfix
   ::before/::after 가 flex 아이템으로 끼어 space-between 을 깨는 것 차단 */
.site-header__inner::before, .site-header__inner::after,
.site-footer__inner::before, .site-footer__inner::after {
  content: none !important;
  display: none !important;
}

/* 6) iconify 아이콘 정렬 — 컨테이너 안에서 중앙·세로 정렬 보정 */
iconify-icon { vertical-align: middle; }
.cta-contact__icon, .practice-card__icon, .practice-detail__icon,
.info-block__icon, .service-card__icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.cta-contact__icon iconify-icon, .practice-card__icon iconify-icon,
.practice-detail__icon iconify-icon, .info-block__icon iconify-icon {
  display: block !important;
}

/* 7) CTA(상담) 섹션 — 아임웹 override 방지: 행간·정렬·버튼크기 강제 */
.cta-section { text-align: center !important; }
.cta-section__body { line-height: 1.85 !important; }
.cta-section__title { line-height: 1.3 !important; }
.cta-section__buttons {
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
.cta-section__contacts { justify-content: center !important; }
.cta-section .btn--lg {
  padding: 13px 38px !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
}
.cta-section .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 8) 플로팅바 — 항상 최상단 (아임웹 섹션에 묻히지 않도록) */
.floating-bar {
  position: fixed !important;
  z-index: 99999 !important;
}

/* ============================================================
   메인페이지 추가 보정 — imweb 전용 직접 수정 (재생성 안 함)
   ============================================================ */
/* (헤더 고정·플로팅바는 아임웹 설정으로 처리 → 관련 CSS 강제 제거함) */

/* (1) 상담(CTA) 세로 패딩·간격 축소 (전보다 늘어난 것 보정) */
.cta-section { padding: 92px 0 78px !important; }
.cta-section__contacts { margin-top: 40px !important; padding-top: 28px !important; }

/* (2) 푸터 — 로고/내용 좌측 정렬 + QUICK MENU 민트색 복구 */
.site-footer__inner { text-align: left !important; }
.site-footer__inner > div { text-align: left !important; }
.site-footer__brand { color: var(--color-main) !important; }

/* (3) 아임웹 에디터(Froala) 인라인 이미지 가운데 정렬 */
.fr-view img.fr-dib { margin: 0px auto !important; }

/* (4) 플로팅 전화 버튼 — 아이콘·텍스트 흰색 강제 (아임웹에서 color 빠지는 것 보정) */
.floating-bar__btn--call { color: #fff !important; }
.floating-bar__btn--call .floating-bar__btn-text,
.floating-bar__btn--call .ico,
.floating-bar__btn--call i[data-icon],
.floating-bar__btn--call iconify-icon { color: #fff !important; }
.floating-bar__btn--kakao,
.floating-bar__btn--kakao .floating-bar__btn-text { color: #181600 !important; }

/* (5) 아임웹 테마가 specificity로 이기는 경우 대비 — 강한 규칙으로 재정의
   (html body + 클래스 2중 = specificity (0,2,2), 우리 head 코드가 뒤에 로드돼 이김) */
html body .section__title.section__title {
  font-size: clamp(32px, 3.6vw, 44px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.25 !important;
  color: var(--color-sub) !important;
}
html body .service-section .section__title.section__title { color: #fff !important; }
html body .cta-section__title.cta-section__title {
  font-size: clamp(32px, 3.8vw, 46px) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: #fff !important;
}
html body .cta-section__body.cta-section__body {
  font-size: clamp(16px, 1.3vw, 18px) !important;
  line-height: 1.85 !important;
  color: rgba(255, 255, 255, 0.78) !important;
}

/* (6) 모바일 햄버거 — 아임웹이 빈 <span> 줄을 지우고  로 바꿔서 아이콘이 사라짐.
   span 대신 CSS 배경이미지(data-URI)로 직접 그림 (정화 무관).  는 font-size:0으로 숨김 */
html body .site-header__menu-toggle {
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  font-size: 0 !important;
  border: none !important;
  background-color: transparent !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231E2E3E' stroke-width='2' stroke-linecap='round'><path d='M4 7h16'/><path d='M4 12h16'/><path d='M4 17h16'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 24px 24px !important;
}

/* (7) 인트로 로고(법률사무소 바람 위 아이콘) 가운데 정렬 */
html body .intro__top { text-align: center !important; }
html body .intro__top-logo {
  display: block !important;
  float: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* (8) 부트스트랩 .container 폭 충돌 — width:750px/970px/1170px 무력화
   (우리는 max-width만 줘서 width 고정값이 그대로 먹어 좁아졌음) */
.container {
  width: auto !important;
}
.container::before, .container::after {
  content: none !important;
  display: none !important;
}

/* (10) 아이콘 컨테이너 — 아임웹이 빈 <i>에 끼워넣는  /공백 제거 + 중앙정렬
   (텍스트 없는 아이콘 원만 대상 — 체크리스트는 제외) */
.cta-contact__icon, .practice-card__icon, .practice-detail__icon,
.info-block__icon, .floating-bar__btn .ico {
  font-size: 0 !important;
  line-height: 0 !important;
}

/* (9) 모바일 CTA 연락처(tel·hours·email) 간격 — 세로 정렬 + 좁은 간격 */
@media (max-width: 900px) {
  html body .cta-section__contacts {
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    margin-top: 32px !important;
    padding-top: 24px !important;
  }
}

/* (11) 버튼 그림자 */
.btn--primary, .btn--kakao,
.cta-section .btn--primary, .cta-section .btn--kakao {
  box-shadow: 0 10px 24px rgba(30, 46, 62, 0.22) !important;
}
.hero__buttons .btn--primary {
  box-shadow: 0 10px 22px rgba(81, 167, 162, 0.32) !important;
}

/* (12) 태블릿(769~1024px) 전체 폰트 보정 — 768px 이하·1025px 이상은 clamp/모바일 자연 스케일에 맡김 */
@media (min-width: 769px) and (max-width: 1024px) {
  html body { font-size: 21px !important; }
  html body .section__title.section__title { font-size: 42px !important; }
  html body .section__subtitle { font-size: 21px !important; }
  html body .page-intro__title { font-size: 48px !important; }
  html body .page-intro__body { font-size: 21px !important; }
  html body .cta-section__title.cta-section__title { font-size: 44px !important; }
  html body .cta-section__body.cta-section__body { font-size: 21px !important; }
  html body .intro__top-title { font-size: 54px !important; }
  html body .intro__top-body { font-size: 21px !important; }
  html body .intro__body { font-size: 22px !important; }
  html body .intro__sub { font-size: 36px !important; }
  html body .intro__role { font-size: 18px !important; }
  html body .practice-card__title { font-size: 24px !important; }
  html body .practice-card__body { font-size: 18px !important; }
  html body .practice-detail__title { font-size: 36px !important; }
  html body .practice-detail__lead { font-size: 22px !important; }
  html body .practice-detail__body { font-size: 18px !important; }
  html body .service-card__title { font-size: 27px !important; }
  html body .service-card__body { font-size: 19px !important; }
  html body .info-block__title { font-size: 23px !important; }
  html body .info-block__body { font-size: 18px !important; }
  html body .cta-contact__value { font-size: 19px !important; }
  html body .cta-contact__label { font-size: 13px !important; }
  html body .lawyer-info__name { font-size: 40px !important; }
  html body .lawyer-info__role { font-size: 19px !important; }
  html body .career-list li { font-size: 18px !important; }
  html body .notice-list li { font-size: 18px !important; }
  html body .post-card__title { font-size: 20px !important; }
  html body .post-card__excerpt { font-size: 17px !important; }
  /* hero (home 전용) */
  html body .hero__kicker { font-size: 18px !important; }
  html body .hero__title-line--soft { font-size: 44px !important; }
  html body .hero__title-line--bold { font-size: 74px !important; }
  html body .hero__subtitle { font-size: 20px !important; }
  /* 버튼 — 전체 확대 (일반·CTA·hero·플로팅) */
  html body .btn { font-size: 17px !important; padding: 15px 34px !important; }
  html body .btn--lg { font-size: 18px !important; padding: 17px 42px !important; }
  html body .hero__buttons .btn { min-width: 200px !important; }
  html body .btn__icon { width: 24px !important; height: 24px !important; }
  html body .floating-bar__btn {
    font-size: 16px !important;
    padding: 16px 26px !important;
    min-width: 200px !important;
  }
  html body .floating-bar__btn .ico { width: 24px !important; height: 24px !important; }
  html body .floating-bar__btn iconify-icon { width: 24px !important; height: 24px !important; }
}

/* ============================================================
   (13) 아임웹 게시판 위젯 — 카드형(grid_02) 카드 디자인 스킨
   메인·콘텐츠 공통 (위젯 id 무관, 스킨 클래스 기준) · 페이지네이션은 건드리지 않음
   아임웹 기본 규칙은 #w...로만 잡혀 있고 !important가 없어 아래 !important가 이김
   ============================================================ */

/* 카드 전체를 흰 박스 + 라운드 + 테두리로 (기본은 썸네일에만 테두리가 있음) */
.widget.board .type_grid.grid_02 .card {
  border: 1px solid var(--color-line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  background: #fff !important;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}
/* 썸네일만 감싸던 기본 테두리/라운드 제거 → 카드로 통합 */
.widget.board .type_grid.grid_02 .card_wrapper {
  border: 0 !important;
  border-radius: 0 !important;
}
/* PC 호버: 살짝 떠오르고 민트 테두리 + 그림자 */
@media (min-width: 991px) {
  .widget.board .type_grid.grid_02 .card:hover {
    transform: translateY(-3px) !important;
    border-color: var(--color-main) !important;
    box-shadow: 0 14px 32px rgba(30, 46, 62, 0.08) !important;
  }
}
/* 이미지 없는 글: 우리 톤 그라데이션 플레이스홀더 */
.widget.board .type_grid.grid_02 .card.no-img .card_wrapper,
.widget.board .type_grid.grid_02 .card.no-img .card-head {
  background: linear-gradient(135deg, #E8EFEE 0%, #D7DBDE 100%) !important;
}
/* 본문(텍스트) 영역 — 좌우 패딩 복원 */
.widget.board .type_grid.grid_02 .card-body {
  display: block !important;
  background: #fff !important;
  padding: 20px 22px 24px !important;
}
/* 제목 — 카테고리 / 제목을 각자 줄로 세로 스택 */
.widget.board .type_grid.grid_02 .title {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--color-sub) !important;
  line-height: 1.5 !important;
  letter-spacing: -0.02em !important;
}
/* 카테고리 줄 (.icons = 'N' 뱃지는 제외) */
.widget.board .type_grid.grid_02 .title > span:not(.icons) {
  display: block !important;
  margin-bottom: 10px !important;
}
/* 요약 — 3줄 말줄임 */
.widget.board .type_grid.grid_02 .text {
  font-size: 14px !important;
  color: var(--color-point) !important;
  line-height: 1.5 !important;
  margin-top: 8px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
/* 카테고리 라벨 → 알약 뱃지 (게시판 설정에서 '카테고리' 체크 시 표시됨)
   글자색(color)은 강제하지 않음 → 아임웹 [게시판 ▸ 카테고리 관리]에서 카테고리별로 지정한 색이 그대로 적용됨 */
.widget.board .type_grid.grid_02 .title > span:not(.icons) > em {
  background: rgba(30, 46, 62, 0.06) !important; /* 알약 배경 — 연한 중립 회색(어떤 글자색도 잘 보임) */
  font-size: 12px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
}
/* (선택) 카테고리별로 배경까지 색을 맞추고 싶을 때 — 아임웹에서 지정한 색의 HEX를 넣어 사용
   예) 성공사례 = #00B8FF, 바람꿀팁 = #51A7A2 로 지정했다면 아래 주석을 풀고 HEX만 교체
.widget.board .type_grid.grid_02 .title em[style*="00B8FF"] { background: rgba(0, 184, 255, 0.1) !important; }
.widget.board .type_grid.grid_02 .title em[style*="51A7A2"] { background: rgba(81, 167, 162, 0.1) !important; }
*/
/* 빨간 'N' 새글 뱃지 숨김 (디자인 정리) */
.widget.board .list-group .addon-badge { display: none !important; }
.card {padding:0px !important}
  
/* ============================================================
   (14) 게시판 상세보기 페이지 전체 — 모든 게시판에 자동 적용
   (신규 게시판·신규 글 추가돼도 이 코드는 다시 안 건드려도 됨)
   ============================================================ */

body.full_board_view.post_view .view_tit {
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

body.full_board_view.post_view .board_txt_area h2 {
  font-size: 26px !important;
  font-weight: 700 !important;
  margin: 48px 0 16px !important;
}

body.full_board_view.post_view .board_txt_area h3 {
  font-size: 20px !important;
  font-weight: 700 !important;
  margin: 32px 0 12px !important;
}

body.full_board_view.post_view .board_txt_area,
body.full_board_view.post_view .board_txt_area p {
  font-size: 16px !important;
  line-height: 1.75 !important;
}

body.full_board_view.post_view .board_txt_area {
  max-width: 680px !important;
  margin: 0 auto !important;
}

/* ============================================================
   워드프레스 전용 보충 (2026-11-05 이누 · 아임웹 이전)
   아임웹 게시판 위젯 · 글 상세 · 상담 폼 · 지도 자리를 코드로 다시 그린다.
   ============================================================ */

body.bl-site { margin: 0 !important; }
.bl-main { display: block; }
.nowrap { white-space: nowrap; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* 카드형 게시판 (홈 최신 4 · 바람 콘텐츠 목록) */
.board-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 24px !important; margin-top: 48px; }
.board-page .board-grid { margin-top: 0; }
.post-card { background: #fff !important; border: 1px solid var(--color-line) !important; border-radius: var(--radius-lg) !important; overflow: hidden !important; transition: all 0.25s !important; display: flex !important; flex-direction: column !important; }
.post-card:hover { transform: translateY(-3px) !important; border-color: var(--color-main) !important; box-shadow: 0 14px 32px rgba(30,46,62,0.06) !important; }
.post-card__thumb { aspect-ratio: 1 / 1 !important; background: linear-gradient(135deg,#E8EFEE 0%,#D7DBDE 100%) !important; overflow: hidden !important; }
.post-card__thumb img { width: 100% !important; height: 100% !important; object-fit: cover !important; transition: transform 0.4s ease; }
.post-card:hover .post-card__thumb img { transform: scale(1.04); }
.post-card__body { padding: 22px 22px 26px !important; flex: 1 !important; display: flex !important; flex-direction: column !important; }
.post-card__cat { display: inline-block !important; align-self: flex-start !important; font-size: 12px !important; font-weight: 600 !important; color: var(--color-main) !important; padding: 4px 10px !important; background: rgba(81,167,162,0.1) !important; border-radius: 4px !important; margin-bottom: 14px !important; }
.post-card__cat--success { color: #b88646 !important; background: rgba(184,134,70,0.1) !important; }
.post-card__title { font-size: 17px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; line-height: 1.5 !important; color: var(--color-sub) !important; margin-bottom: 10px !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
.post-card__excerpt { font-size: 14px !important; color: var(--color-point) !important; line-height: 1.5 !important; display: -webkit-box !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; flex: 1 !important; }
.board-empty { text-align: center; color: var(--color-point); padding: 60px 0; }
@media (max-width: 1024px) { .board-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 560px) { .board-grid { grid-template-columns: 1fr !important; gap: 16px !important; } }

/* 글 상세 — 채권추심 바람(baram-debt.com) 글 디자인 틀을 법률 바람 색으로(11/5)
   머리띠(경로 · 분류 · 제목 · 요약 · 글쓴이) → 겹친 대표 사진 → 옆 목차 + 본문 → 글쓴이 상자 → 함께 읽을 글 */
.post-view { --pv-ink: var(--color-sub); --pv-text: #3A4654; --pv-mute: var(--color-point); --pv-mint: #EEF6F5; --pv-line: #E2E8EA; --pv-main: var(--color-main); --pv-dark: var(--color-main-dark); word-break: keep-all; }
.post-head { background: var(--pv-mint); padding: 56px 24px 48px; }
.post-head__inner { max-width: 820px; margin: 0 auto; text-align: center; }
.post-crumbs { display: flex; justify-content: center; gap: 8px; align-items: center; font-size: 13.5px; color: var(--pv-mute); margin-bottom: 22px; }
.post-crumbs a { color: var(--pv-mute); }
.post-crumbs a:hover { color: var(--pv-dark); }
.post-pill { display: inline-block; font-size: 13px; font-weight: 700; color: var(--pv-dark) !important; background: rgba(81,167,162,0.14); padding: 6px 14px; border-radius: 999px; margin-bottom: 18px; }
.post-pill--success { color: #a2742f !important; background: rgba(184,134,70,0.14); }
.post-head__title { font-size: 38px !important; line-height: 1.38 !important; font-weight: 700 !important; letter-spacing: -0.015em; color: var(--pv-ink); margin: 0; }
.post-head__desc { font-size: 16.5px; line-height: 1.75; color: var(--pv-text); margin: 18px auto 0; max-width: 680px; }
.post-byline { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 14px; margin-top: 28px; font-size: 14px; color: var(--pv-mute); }
.post-mark { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--pv-ink); color: #CFE9E6; font-size: 12.5px; font-weight: 800; letter-spacing: -0.02em; flex-shrink: 0; }
.post-byline__who { display: flex; flex-direction: column; text-align: left; line-height: 1.45; }
.post-byline__who strong { color: var(--pv-ink); font-size: 14.5px; }
.post-byline__who span { font-size: 13px; }
.post-byline__meta { display: flex; gap: 10px; padding-left: 14px; border-left: 1px solid #CBD8DA; }
.post-byline__meta > * + *::before { content: "·"; margin-right: 10px; color: #AEBCC0; }
.post-hero { max-width: 560px; margin: -4px auto 0; padding: 0 24px; }
.post-hero img { display: block; width: 100%; height: auto; border-radius: 18px; transform: translateY(28px); box-shadow: 0 24px 40px -30px rgba(30,46,62,0.45); }
.post-layout { display: grid; grid-template-columns: 220px minmax(0, 720px); gap: 56px; justify-content: center; max-width: 1100px; margin: 0 auto; padding: 84px 24px 40px; }
.post-toc--side { position: sticky; top: calc(var(--header-height) + 28px); align-self: start; max-height: calc(100vh - var(--header-height) - 56px); overflow: auto; padding-right: 4px; }
.post-toc__label { font-size: 12.5px; font-weight: 700; letter-spacing: 0.12em; color: var(--pv-mute); margin: 0 0 12px; }
.post-toc__list { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--pv-line); }
.post-toc__item a { display: block; padding: 7px 0 7px 14px; margin-left: -2px; border-left: 2px solid transparent; font-size: 13.5px; line-height: 1.5; color: var(--pv-mute); }
.post-toc__item--h3 a { padding-left: 26px; font-size: 13px; }
.post-toc__item a:hover, .post-toc__item a.is-on { color: var(--pv-ink); border-left-color: var(--pv-main); font-weight: 600; }
.post-toc--inline { display: none; border: 1px solid var(--pv-line); border-radius: 14px; background: #FAFCFC; margin: 0 0 28px; }
.post-toc--inline summary { cursor: pointer; list-style: none; padding: 15px 18px; font-weight: 700; font-size: 15px; display: flex; justify-content: space-between; color: var(--pv-ink); }
.post-toc--inline summary::-webkit-details-marker { display: none; }
.post-toc--inline summary span { font-size: 12.5px; color: var(--pv-mute); font-weight: 600; }
.post-toc--inline .post-toc__list { margin: 0 18px 16px; }
.post-article { min-width: 0; }
.post-view #ez-toc-container { display: none !important; }
.board_txt_area { max-width: none !important; margin: 0 !important; font-size: 17px !important; line-height: 1.9 !important; color: var(--pv-text); overflow-wrap: anywhere; }
.board_txt_area p { font-size: 17px !important; line-height: 1.9 !important; margin: 0 0 1.15em !important; }
.board_txt_area p:empty { display: none; }
.board_txt_area strong { color: var(--pv-ink); }
.board_txt_area h2 { font-size: 27px !important; font-weight: 700 !important; line-height: 1.45 !important; color: var(--pv-ink); margin: 2.4em 0 0.8em !important; padding-top: 1.2em; border-top: 1px solid var(--pv-line); scroll-margin-top: calc(var(--header-height) + 24px); }
.board_txt_area h2:first-of-type { border-top: 0; padding-top: 0; margin-top: 0 !important; }
.board_txt_area h3 { font-size: 20.5px !important; font-weight: 700 !important; line-height: 1.5 !important; color: var(--pv-ink); margin: 1.9em 0 0.6em !important; scroll-margin-top: calc(var(--header-height) + 24px); }
.board_txt_area img { display: block; max-width: 100%; height: auto; margin: 2em auto; border-radius: 14px; }
.board_txt_area a { color: var(--pv-dark); font-weight: 600; text-decoration: none; border-bottom: 1.5px solid rgba(81,167,162,0.5); }
.board_txt_area a:hover { border-bottom-color: var(--pv-dark); }
.board_txt_area ul, .board_txt_area ol { margin: 0 0 1.15em 1.2em; }
.board_txt_area ul { list-style: disc; }
.board_txt_area ol { list-style: decimal; }
.board_txt_area li { margin: 6px 0; padding-left: 4px; }
.board_txt_area li::marker { color: var(--pv-main); }
.board_txt_area li:empty { display: none; }
.board_txt_area table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--pv-line); border-radius: 12px; overflow: hidden; margin: 1.6em 0; font-size: 15.5px; line-height: 1.6; }
.board_txt_area th { background: var(--pv-ink); color: #fff; font-weight: 700; text-align: left; padding: 12px 16px; border: 0; }
.board_txt_area td { padding: 12px 16px; border: 0; border-top: 1px solid var(--pv-line); vertical-align: top; color: var(--pv-text); }
.board_txt_area tr:first-child td { border-top: 0; }
.board_txt_area thead + tbody tr:first-child td { border-top: 0; }
.board_txt_area blockquote { border-left: 3px solid var(--pv-main); background: #F4FAF9; padding: 16px 20px; border-radius: 0 12px 12px 0; color: var(--pv-text); margin: 1.6em 0; }
.board_txt_area hr { border: 0; border-top: 1px solid var(--pv-line); margin: 2.6em 0; }
.post-author { display: flex; gap: 20px; margin-top: 48px; padding: 28px; border-radius: 18px; background: var(--pv-mint); border: 1px solid #D6E8E6; }
.post-author__mark { width: 64px; height: 64px; font-size: 16px; }
.post-author__body p { margin: 0; }
.post-author__label { font-size: 12.5px; font-weight: 700; letter-spacing: 0.12em; color: var(--pv-dark); }
.post-author__name { font-size: 19px; font-weight: 700; color: var(--pv-ink); margin-top: 4px !important; }
.post-author__name span { display: block; font-size: 13.5px; font-weight: 500; color: var(--pv-mute); margin-top: 2px; }
.post-author__bio { font-size: 15px; line-height: 1.75; color: var(--pv-text); margin-top: 12px !important; }
.post-author__review { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-top: 16px !important; padding-top: 14px; border-top: 1px solid #D6E8E6; font-size: 14.5px; color: var(--pv-text); }
.post-author__review strong { color: var(--pv-dark); }
.post-author__review a { color: var(--pv-ink); font-weight: 700; border-bottom: 1px solid rgba(81,167,162,0.6); }
.post-author__review span { flex-basis: 100%; font-size: 13px; color: var(--pv-mute); }
.post-author__note { font-size: 13px; color: var(--pv-mute); margin-top: 10px !important; }
.post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 32px; }
.post-nav__item { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; border: 1px solid var(--pv-line); border-radius: 14px; background: #fff; color: var(--pv-ink); transition: border-color .2s, box-shadow .2s; }
.post-nav__item:hover { border-color: var(--pv-main); box-shadow: 0 10px 24px -18px rgba(30,46,62,0.4); }
.post-nav__item small { font-size: 12.5px; font-weight: 700; color: var(--pv-mute); }
.post-nav__item strong { font-size: 14.5px; font-weight: 600; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.post-nav__item--next { text-align: right; align-items: flex-end; }
.post-related { background: #F6F9F9; padding: 72px 24px 80px; margin-top: 32px; }
.post-related__title { font-size: 26px !important; font-weight: 700 !important; text-align: center; color: var(--pv-ink); margin: 0 0 32px !important; }
.post-related .board-grid { margin-top: 0; }
.board-grid--3 { grid-template-columns: repeat(3, 1fr) !important; }
.post-related__more { text-align: center; margin-top: 36px; }
@media (max-width: 1024px) {
  .post-layout { grid-template-columns: minmax(0, 720px); gap: 0; }
  .post-toc--side { display: none; }
  .post-toc--inline { display: block; }
  .board-grid--3 { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 767px) {
  .post-head { padding: 32px 20px 36px; }
  .post-head__title { font-size: 26px !important; }
  .post-head__desc { font-size: 15px; }
  .post-byline { gap: 10px; }
  .post-byline__meta { flex-basis: 100%; justify-content: center; border-left: 0; padding-left: 0; font-size: 13px; }
  .post-hero { padding: 0 16px; }
  .post-hero img { border-radius: 14px; transform: translateY(18px); }
  .post-layout { padding: 56px 20px 24px; }
  .board_txt_area, .board_txt_area p { font-size: 16px !important; line-height: 1.85 !important; }
  .board_txt_area h2 { font-size: 22px !important; }
  .board_txt_area h3 { font-size: 18.5px !important; }
  .post-author { gap: 14px; padding: 20px 18px; }
  .post-author__mark { width: 44px; height: 44px; font-size: 12px; }
  .post-author__name { font-size: 17px; }
  .post-author__bio { font-size: 14.5px; }
  .post-nav { grid-template-columns: 1fr; }
  .post-nav__item--next { text-align: left; align-items: flex-start; }
  .post-related { padding: 48px 20px 56px; }
  .post-related__title { font-size: 22px !important; margin-bottom: 20px !important; }
  .board-grid--3 { grid-template-columns: 1fr !important; gap: 12px !important; }
  .board-grid--3 .post-card { flex-direction: row !important; align-items: stretch !important; }
  .board-grid--3 .post-card__thumb { flex: 0 0 112px !important; width: 112px !important; aspect-ratio: 1 / 1 !important; }
  .board-grid--3 .post-card__body { padding: 14px 16px !important; justify-content: center !important; }
  .board-grid--3 .post-card__cat { margin-bottom: 8px !important; font-size: 11px !important; }
  .board-grid--3 .post-card__title { font-size: 15px !important; margin-bottom: 0 !important; }
  .board-grid--3 .post-card__excerpt { display: none !important; }
  .post-related__more { margin-top: 24px; }
}

/* 상담 신청 폼 */
.consult-form-section { padding-top: 0 !important; }
.consult-form { max-width: 760px; margin: 40px auto 0; padding: 40px 36px; background: #fff; border: 1px solid var(--color-line); border-radius: var(--radius-lg); }
.consult-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.consult-form__field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 18px; }
.consult-form__field label { font-size: 14px; font-weight: 700; color: var(--color-sub); }
.consult-form__field label em { color: var(--color-main); font-style: normal; margin-left: 2px; }
.consult-form input[type=text], .consult-form input[type=tel], .consult-form select, .consult-form textarea {
  width: 100%; font: inherit; font-size: 15px; color: var(--color-sub); padding: 13px 14px; border: 1px solid var(--color-line); border-radius: 8px; background: #fff; transition: border-color 0.2s;
}
.consult-form textarea { min-height: 160px; resize: vertical; line-height: 1.6; }
.consult-form input:focus, .consult-form select:focus, .consult-form textarea:focus { outline: none; border-color: var(--color-main); box-shadow: 0 0 0 3px rgba(81,167,162,0.15); }
.consult-form__agree { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--color-point); line-height: 1.5; margin: 6px 0 24px; }
.consult-form__agree input { margin-top: 3px; accent-color: var(--color-main); width: 16px; height: 16px; flex-shrink: 0; }
.consult-form__agree details { margin-top: 6px; font-size: 13px; }
.consult-form__agree summary { cursor: pointer; color: var(--color-main); }
.consult-form__submit { text-align: center; }
.consult-form__submit .btn { min-width: 220px; justify-content: center; }
.consult-form__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.consult-form__msg { max-width: 760px; margin: 24px auto 0; padding: 18px 22px; border-radius: 10px; font-size: 15px; line-height: 1.6; }
.consult-form__msg--ok { background: rgba(81,167,162,0.1); color: var(--color-main-dark); border: 1px solid rgba(81,167,162,0.35); }
.consult-form__msg--err { background: #fff4f2; color: #b4412f; border: 1px solid #f0c4bb; }
@media (max-width: 560px) {
  .consult-form { padding: 28px 20px; }
  .consult-form__row { grid-template-columns: 1fr; gap: 0; }
}

/* 오시는 길 지도 */
.location-section { padding-bottom: var(--section-pad-y) !important; padding-top: var(--section-pad-y) !important; }
.location-map--wp { max-width: 760px; margin: 24px auto 0 !important; }

/* 상담 폼 — SureForms(11/5) : 카드 틀은 코드 폼과 같게, 칸 모양만 맞춘다 */
.consult-form--srfm .srfm-form-container { max-width: none !important; }
.consult-form--srfm .srfm-block-label, .consult-form--srfm label.srfm-block-label { font-size: 14px !important; font-weight: 700 !important; color: var(--color-sub) !important; }
.consult-form--srfm input[type=text], .consult-form--srfm input[type=tel], .consult-form--srfm select, .consult-form--srfm textarea, .consult-form--srfm .srfm-input-common { font-family: inherit !important; font-size: 15px !important; border-radius: 8px !important; }
.consult-form--srfm .srfm-submit-container .srfm-button, .consult-form--srfm button.srfm-submit-button { min-width: 220px; justify-content: center; border-radius: 999px !important; font-family: inherit !important; font-weight: 700 !important; padding: 16px 32px !important; }
.consult-form--srfm .srfm-description { font-size: 13px !important; line-height: 1.6 !important; }

/* 글 상세: 아임웹 스크롤 리빌(.section > .container > *)이 긴 글 전체에 걸려
   화면에 12%가 안 들어와 영영 안 보이던 문제(11/5) — 글 본문은 바로 보이게 */
.post-view .reveal { opacity: 1 !important; transform: none !important; }

/* ---------- 하단 빠른 상담 바 (11/6, BL_VER 2026110604) ---------- */
.bl-quickbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; background: var(--color-sub); color: #fff; box-shadow: 0 -6px 24px rgba(30,46,62,0.18); padding-bottom: env(safe-area-inset-bottom); }
.bl-quickbar::after { content: ""; position: absolute; inset: 0 0 0 52%; background: #15222f; clip-path: polygon(70px 0, 100% 0, 100% 100%, 0 100%); z-index: 0; }
.bl-quickbar__in { position: relative; z-index: 1; max-width: 1280px; margin: 0 auto; padding: 0 24px; height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.bl-quickbar__left { display: flex; align-items: center; gap: 28px; }
.bl-quickbar a { color: #fff; text-decoration: none; }
.bl-quickbar__tel { display: flex; flex-direction: column; line-height: 1.2; }
.bl-quickbar__label { font-size: 14px; opacity: 0.85; display: inline-flex; align-items: center; gap: 6px; }
.bl-quickbar__tel strong { font-size: 24px; font-weight: 800; letter-spacing: -0.01em; }
.bl-quickbar__bar { width: 1px; height: 34px; background: rgba(255,255,255,0.3); }
.bl-quickbar__kakao { display: flex; align-items: center; gap: 10px; }
.bl-quickbar__kakao img { width: 34px; height: 34px; border-radius: 50%; }
.bl-quickbar__kakao strong { font-size: 20px; font-weight: 800; }
.bl-quickbar__form { position: relative; display: flex; align-items: center; gap: 10px; margin: 0; }
.bl-quickbar__form input[type=text], .bl-quickbar__form input[type=tel] { height: 48px; border: 0; border-radius: 4px; padding: 0 14px; font-size: 15px; background: #fff; color: var(--color-sub); }
.bl-quickbar__form input[name=name] { width: 140px; }
.bl-quickbar__form input[name=phone] { width: 210px; }
.bl-quickbar__form input:focus { outline: 2px solid var(--color-main); }
.bl-quickbar__agree { display: flex; align-items: center; gap: 8px; font-size: 13px; line-height: 1.3; color: #fff; cursor: pointer; margin: 0 6px; }
.bl-quickbar__agree input { width: 20px; height: 20px; accent-color: var(--color-main); margin: 0; }
.bl-quickbar__form button { height: 50px; padding: 0 26px; border: 0; border-radius: 4px; background: var(--color-main); color: #fff; font-size: 17px; font-weight: 700; cursor: pointer; }
.bl-quickbar__form button:hover { filter: brightness(1.07); }
.bl-quickbar__form button:disabled { opacity: 0.6; cursor: default; }
.bl-quickbar__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.bl-quickbar__msg { position: absolute; right: 0; bottom: calc(100% + 14px); margin: 0; padding: 12px 16px; border-radius: 8px; font-size: 14px; white-space: nowrap; background: #fff; color: var(--color-sub); box-shadow: 0 8px 24px rgba(0,0,0,0.15); opacity: 0; pointer-events: none; transform: translateY(6px); transition: all 0.2s; }
.bl-quickbar__msg.is-show { opacity: 1; transform: none; }
.bl-quickbar__msg.is-ok { border-left: 4px solid var(--color-main); }
.bl-quickbar__msg.is-err { border-left: 4px solid #d9573f; }
.bl-quickbar__go { display: none; }
body.bl-site { padding-bottom: 84px; }
/* 바가 전화 · 카톡을 맡으니 오른쪽 아래 떠 있는 버튼은 숨김 */
.bl-site .floating-bar { display: none !important; }
@media (max-width: 1100px) {
  .bl-quickbar__form input[name=name] { width: 110px; }
  .bl-quickbar__form input[name=phone] { width: 150px; }
  .bl-quickbar__left { gap: 18px; }
  .bl-quickbar__tel strong { font-size: 20px; }
  .bl-quickbar__kakao strong { font-size: 17px; }
}
/* 모바일: 폼 대신 버튼 3개(전화 · 카톡 · 상담 신청) */
@media (max-width: 860px) {
  .bl-quickbar::after { display: none; }
  .bl-quickbar__in { height: 60px; padding: 0; gap: 0; }
  .bl-quickbar__form, .bl-quickbar__bar { display: none; }
  .bl-quickbar__left { flex: 2; gap: 0; height: 100%; }
  .bl-quickbar__tel, .bl-quickbar__kakao, .bl-quickbar__go { flex: 1; height: 100%; display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 6px; font-size: 15px; font-weight: 700; }
  .bl-quickbar__tel strong { display: none; }
  .bl-quickbar__label { opacity: 1; font-size: 15px; font-weight: 700; }
  .bl-quickbar__kakao { background: #FEE500; color: #181600 !important; }
  .bl-quickbar__kakao img { width: 24px; height: 24px; }
  .bl-quickbar__kakao strong { font-size: 15px; font-weight: 700; color: #181600; }
  .bl-quickbar__go { flex: 1; background: var(--color-main); }
  body.bl-site { padding-bottom: 60px; }
}

/* ---------- 글 읽기 좋게 (11/6, BL_VER 2026110605) ----------
   한 문장 = 한 문단이던 아임웹 글: 같은 덩어리 문장은 촘촘히, 빈 줄 자리(.pv-gap)는 덩어리 간격 */
.board_txt_area { counter-reset: pvsec; }
.board_txt_area p { margin: 0 0 0.55em !important; }
.board_txt_area .pv-gap { height: 1.05em; }
.board_txt_area > p:first-child { font-size: 18.5px !important; color: var(--pv-ink); }
.board_txt_area h2 { position: relative; }
.board_txt_area h2:not([data-pv])::before { counter-increment: pvsec; content: counter(pvsec, decimal-leading-zero); display: block; width: fit-content; font-size: 13px; font-weight: 800; letter-spacing: 0.08em; color: var(--pv-dark); background: rgba(81,167,162,0.14); padding: 3px 10px; border-radius: 999px; margin-bottom: 14px; line-height: 1.6; }
.board_txt_area h2[data-pv="faq"]::before { content: "FAQ"; display: block; width: fit-content; font-size: 13px; font-weight: 800; letter-spacing: 0.08em; color: #fff; background: var(--pv-ink); padding: 3px 10px; border-radius: 999px; margin-bottom: 14px; line-height: 1.6; }
.board_txt_area .pv-kicker { display: block; font-size: 14px; font-weight: 700; color: var(--pv-mute); letter-spacing: 0; margin-bottom: 4px; }
.board_txt_area .pv-sep { display: none; }
/* 질문형 소제목 바로 아래 첫 문장 = 답 → 진하게 */
.board_txt_area h2 + p, .board_txt_area h3 + p { color: var(--pv-ink); font-weight: 600; }
.board_txt_area h3 { padding-left: 14px; border-left: 4px solid var(--pv-main); line-height: 1.45 !important; }
.board_txt_area strong { background: linear-gradient(transparent 60%, rgba(81,167,162,0.22) 0); padding: 0 1px; }
.board_txt_area a strong, .board_txt_area .pv-q strong { background: none; }
.board_txt_area .pv-table { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 1.6em 0; border-radius: 12px; }
.board_txt_area .pv-table table { margin: 0; min-width: 520px; }
.board_txt_area .pv-table td, .board_txt_area .pv-table th { word-break: keep-all; }
/* 자주 묻는 질문 카드 */
.board_txt_area .pv-faq-item { border: 1px solid var(--pv-line); border-radius: 14px; padding: 18px 20px 14px; margin: 0 0 12px; background: #fff; }
.board_txt_area .pv-faq-item .pv-gap { height: 0.5em; }
.board_txt_area .pv-q { font-size: 17.5px !important; margin-bottom: 10px !important; }
.board_txt_area .pv-q strong { color: var(--pv-ink); }
.board_txt_area .pv-a { color: var(--pv-text); }
.board_txt_area .pv-qa { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 7px; background: var(--pv-ink); color: #fff; font-size: 13px; font-weight: 800; margin-right: 10px; vertical-align: 2px; }
.board_txt_area .pv-qa--a { background: var(--pv-main); }
/* 근거 법령 · 함께 읽어 보세요 (본문에 저장된 상자) */
.board_txt_area .bl-lawref { margin: 2.4em 0 1.6em; padding: 20px 22px; border-radius: 14px; background: #F6F9F9; border: 1px solid var(--pv-line); }
.board_txt_area .bl-lawref__title { font-size: 14px !important; font-weight: 800; letter-spacing: 0.06em; color: var(--pv-dark); margin: 0 0 8px !important; }
.board_txt_area .bl-lawref ul { list-style: none; margin: 0; padding: 0; }
.board_txt_area .bl-lawref li { margin: 4px 0; padding: 0; font-size: 15.5px; }
.board_txt_area .bl-lawref li::before { content: "§"; color: var(--pv-main); font-weight: 800; margin-right: 8px; }
.board_txt_area .bl-lawref__note { font-size: 13px !important; line-height: 1.6 !important; color: var(--pv-mute); margin: 10px 0 0 !important; }
.board_txt_area .bl-more { margin: 2em 0 0 !important; padding: 14px 18px; border-left: 3px solid var(--pv-main); background: #F4FAF9; border-radius: 0 12px 12px 0; font-size: 15.5px !important; }
@media (max-width: 767px) {
  .board_txt_area > p:first-child { font-size: 17px !important; }
  .board_txt_area .pv-faq-item { padding: 16px 16px 12px; }
  .board_txt_area .pv-q { font-size: 16.5px !important; }
  .board_txt_area .bl-lawref { padding: 16px 18px; }
}
.board_txt_area h3.pv-q { border-left: 0; padding-left: 0; margin: 0 0 10px !important; font-size: 17.5px !important; }
.board_txt_area h3.pv-q + p { font-weight: 400; color: var(--pv-text); }
