@charset "utf-8";

/**
 * @author  : 김민성
 * @date    : 2026-08-06
 * @desc    : 서브 페이지 스타일
 */



/* 공통 영역 */
.sub-main {
    position: relative;
    padding-top: 92px;
}

.sub-main--default {
    background-color: #FBF9F4;
}

.sub-main--divorce {
    background-color: #231D16;
}

.sub-main--criminal {
    background-color: #040F11;
}

/* //공통 영역 */


/* [상단 영역] visual 텍스트 스타일 시작 */
.visual {
    position: relative;
    height: calc(100vh - 92px);
}

.visual__inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.visual__figure {
    position: relative;
    z-index: 2;
}

.visual__figure img {
    width: 100%;
    max-width: 800px;
    height: 100%;
    object-fit: contain;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 70%, rgba(0, 0, 0, 0) 100%);
}

.visual__gradient {
    position: absolute;
    top: 40px;
    z-index: 1;
}

.visual__gradient img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 10%, rgba(0, 0, 0, 0) 80%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 10%, rgba(0, 0, 0, 0) 80%);
    opacity: 0.15;
}

.visual__text {
    text-align: center;
}

.visual__title {
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 40px;
    line-height: 75.4px;
    letter-spacing: -5%;
    color: #383838;
}

.visual__title-point {
    font-weight: 700;
    vertical-align: baseline;
}

/* 타이틀 줄바꿈: 모바일에서만 노출 */
.visual__title-br {
    display: none;
}

.visual__desc {
    margin-top: 28px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 25px;
    line-height: 41px;
    letter-spacing: -1%;
    color: #601a18;
}
/* [상단 영역] visual 텍스트 스타일 끝 */


/* [About 영역] about 스타일 시작 */
.about {
    width: 100%;
    padding: 120px 0 150px;
    background: #fff;
    /* AOS fade-left/right 초기 transform 으로 인한 가로 스크롤 방지 */
    overflow-x: hidden;
}

.about__inner {
    max-width: 1100px;
    margin-inline: auto;
}

/* head : 라벨 + 타이틀 + 리드문 */
.about__label {
    font-family: 'noto-serif-kr';
    font-weight: 600;
    font-size: 14px;
    line-height: 35px;
    color: #961b1e;
}

.about__title {
    margin-top: 11px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 40px;
    line-height: 55px;
    letter-spacing: -2.4px;
    color: #0f0f0f;
}

.about__lead {
    margin-top: 30px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: -0.32px;
    color: #0f0f0f;
}

/* list : 이미지 · 텍스트 교차 배치 카드 3행 */
.about__list {
    display: flex;
    flex-direction: column;
    row-gap: 50px;
    margin-top: 90px;
}

.about__item {
    display: flex;
    align-items: stretch;
    column-gap: 14px;
}

.about__figure {
    flex: 1 1 0;
    border-radius: 15px;
    overflow: hidden;
}

.about__figure img {
    display: block;
    width: 100%;
    height: 165px;
    object-fit: cover;
    object-position: bottom;
}

.about__content {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    padding: 26px 26px 0px 26px;
    border-left: 0.5px solid #c8c8c8;
    border-right: 0.5px solid #c8c8c8;
}

.about__num {
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 20px;
    line-height: 26px;
    color: #5c0202;
}

.about__body {
    display: flex;
    flex-direction: column;
    row-gap: 13px;
}

.about__heading {
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 25px;
    line-height: 30px;
    letter-spacing: -1.25px;
    color: #5c0202;
}

.about__text {
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #151515;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.about .br-mo {
    display: none;
}
/* [About 영역] about 스타일 끝 */


/* [강조 문구 영역] motto 스타일 시작 */
.motto {
    width: 100%;
    padding: 46px 0 60px;
    background-color: #601a18;
}

.motto__inner {
    max-width: 992px;
    margin-inline: auto;
}

.motto__text {
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 30px;
    line-height: 52px;
    letter-spacing: -0.6px;
    text-align: center;
    color: #fff;
}

.motto__point {
    color: #efd3a4;
    vertical-align: baseline;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.motto .br-mo {
    display: none;
}
/* [강조 문구 영역] motto 스타일 끝 */


/* [변호사 소개 영역] attorney-intro 스타일 시작 */
.attorney-intro {
    position: relative;
    width: 100%;
    padding: 90px 0 200px;
    overflow: hidden;
}

.attorney-intro__bg {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
}

.attorney-intro__bg img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 80%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 80%);
    opacity: 0.15;
}

.attorney-intro__inner {
    max-width: 980px;
    margin-inline: auto;
}

/* head : 라벨 + 타이틀 + 리드문 */
.attorney-intro__label {
    font-family: 'noto-serif-kr';
    font-weight: 600;
    font-size: 18px;
    line-height: 45px;
    color: #601a18;
    text-align: center;
}

.attorney-intro__title {
    margin-top: 18px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 40px;
    line-height: 60px;
    letter-spacing: -2.4px;
    color: #0f0f0f;
    text-align: center;
}

.attorney-intro__desc {
    margin-top: 60px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 25px;
    line-height: 45px;
    letter-spacing: -0.25px;
    color: #601a18;
    text-align: center;
}

/* list : 변호사 프로필 카드 2개 */
.attorney-list {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    margin-top: 30px;
}

.attorney-card {
    position: relative;
    width: 100%;
    height: 480px;
    border-radius: 20px;
    overflow: hidden;
}

.attorney-card--primary {
    background-color: #601a18;
}

.attorney-card--secondary {
    background-color: #e0d5c3;
}

/* card : 좌측 텍스트 콘텐츠 */
.attorney-card__content {
    position: relative;
    z-index: 2;
    max-width: 440px;
    padding: 35px 0 0 58px;
    display: flex;
    flex-direction: column;
}

.attorney-card__position {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 15px;
    line-height: 32px;
    letter-spacing: 0;
}

.attorney-card__divider {
    margin: 0 5px;
    font-weight: 400;
    opacity: .7;
}

.attorney-card__name {
    margin-top: 12px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 36px;
    line-height: 32px;
    letter-spacing: -2px;
}

.attorney-card__headline {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 24px;
    line-height: 35px;
    letter-spacing: -0.5px;
}

.attorney-card--primary .attorney-card__headline {
    margin-top: 97px;
}

.attorney-card--secondary .attorney-card__headline {
    margin-top: 132px;
}

.attorney-card__desc {
    margin-top: 23px;
    font-family: 'pretendard';
    font-weight: 300;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -2%;
}

.attorney-card__badges {
    display: flex;
    column-gap: 6px;
    margin-top: 45px;
}

.attorney-card__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 39px;
    padding: 6px 19px;
    border-radius: 999px;
    border: 1px solid;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 0;
    white-space: nowrap;
}

/* card : 텍스트 컬러 분기 (primary : 버건디 배경 / secondary : 베이지 배경) */
.attorney-card--primary .attorney-card__position,
.attorney-card--primary .attorney-card__badge {
    color: #d5bb8f;
}

.attorney-card--primary .attorney-card__name,
.attorney-card--primary .attorney-card__headline,
.attorney-card--primary .attorney-card__desc {
    color: #fff;
}

.attorney-card--primary .attorney-card__badge {
    background-color: #601a18;
    border-color: #d5bb8f;
}

.attorney-card--secondary .attorney-card__position,
.attorney-card--secondary .attorney-card__name,
.attorney-card--secondary .attorney-card__headline,
.attorney-card--secondary .attorney-card__desc,
.attorney-card--secondary .attorney-card__badge {
    color: #601a18;
}

.attorney-card--secondary .attorney-card__badge {
    background-color: #e0d5c3;
    border-color: #601a18;
}

/* card : 우측 사진 + 장식 + 영문명 */
.attorney-card__media {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.attorney-card__deco {
    position: absolute;
    display: block;
    z-index: 1;
}

.attorney-card__deco img {
    display: block;
    width: 100%;
    height: 100%;
}

.attorney-card__photo {
    position: absolute;
    z-index: 2;
    display: block;
    border-radius: 20px;
    object-fit: cover;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 78%, rgba(0, 0, 0, 0) 95%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 78%, rgba(0, 0, 0, 0) 95%);
}

.attorney-card__eng-name {
    position: absolute;
    z-index: 3;
    left: 535px;
    top: 379px;
    padding-bottom: 8px;
    font-family: 'noto-serif-kr';
    font-weight: 200;
    font-size: 51px;
    line-height: 56px;
    white-space: nowrap;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.attorney-card--primary .attorney-card__deco {
    left: 627px;
    top: 53px;
    width: 291px;
    height: 291px;
}

.attorney-card--primary .attorney-card__photo {
    left: 609px;
    top: 42px;
    width: 274px;
    height: 427px;
}

.attorney-card--primary .attorney-card__eng-name {
    background-image: linear-gradient(to right, #d5bb8f 0%, #ffffff 100%);
}

.attorney-card--secondary .attorney-card__deco {
    left: 536px;
    top: 121px;
    width: 131px;
    height: 252px;
}

.attorney-card--secondary .attorney-card__photo {
    left: 563px;
    top: 18px;
    width: 411px;
    height: 442px;
    object-position: bottom;
}

.attorney-card--secondary .attorney-card__eng-name {
    background-image: linear-gradient(to right, #601a18 0%, #601a18 56.731%, #5f594f 100%);
}

/* watermark : 하단 영문 워터마크 */
.attorney-intro__watermark {
    position: absolute;
    bottom: 70px;
    right: -20px;
    font-family: 'noto-serif-kr';
    font-weight: 600;
    font-size: 65px;
    line-height: 1;
    color: #eae5d8;
    text-align: right;
    white-space: nowrap;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.attorney-intro .br-mo {
    display: none;
}
/* [변호사 소개 영역] attorney-intro 스타일 끝 */



/* [상담 플로팅 CTA] consult-fab — 모바일 전용 위젯이므로 PC 에서는 숨김.
   실제 레이아웃/스타일은 반응형 미디어쿼리(max-width:1024px) 블록에서 정의한다. */
.consult-fab {
    display: none;
}



/* [상담 CTA 영역] consult-cta 기본 스타일 및 변수 정의 */
.consult-cta {
    position: relative;
    width: 100%;
    height: 105px;
    background: linear-gradient(to bottom, transparent 0 14px, #1b272d 14px);
    z-index: 2;
    
    /* 기본 테마 색상 및 글자 색상 변수 설정 */
    --cta-bg-deco: #601a18;
    --cta-arrow-color: #961b1e;
    --cta-option-hover-color: #601a18;
    --cta-option-hover-bg: #f2ede3;
    
    /* 글자 색상 변수 */
    --cta-title-color: #fff;         /* 타이틀 글자 색상 */
    --cta-label-color: #aba195;      /* 라벨(상담분야, 연락처) 글자 색상 */
    --cta-submit-color: #fff;        /* 상담신청 버튼 글자 색상 */
}

.consult-cta__deco {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 1;
    pointer-events: none;
}

.consult-cta__deco::before {
    content: '';
    position: absolute;
    left: calc(50% - 1182px);
    top: 0;
    width: 1067.93px;
    height: 196.8px;
    background-color: var(--cta-bg-deco);
    clip-path: path('M945.69 0C956.29 0 966.2 5.25 972.16 14.02L1062.34 146.82C1076.78 168.07 1061.55 196.8 1035.87 196.8H32C14.33 196.8 0 182.47 0 164.8V32C0 14.33 14.33 0 32 0H945.69Z');
}

.consult-cta__inner {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1152px;
    height: 100%;
    padding-top: 14px;
    margin-inline: auto;
}

/* 타이틀 */
.consult-cta__title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 36px;
    line-height: 41px;
    letter-spacing: -0.72px;
    color: var(--cta-title-color); /* 변수 적용 */
    white-space: nowrap;
}

/* form : 상담분야 + 연락처 + 신청 버튼 */
.consult-cta__form {
    display: flex;
    align-items: center;
    column-gap: 32px;
}

.consult-cta__field {
    display: flex;
    align-items: center;
    column-gap: 12px;
}

.consult-cta__label {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 19px;
    letter-spacing: -0.38px;
    color: var(--cta-label-color); /* 변수 적용 */
    white-space: nowrap;
}

/* 공통 입력 필드 (셀렉트 토글 · tel 인풋) */
.consult-cta__input,
.consult-select__toggle {
    height: 39px;
    padding: 0 14px;
    border: 0;
    border-radius: 7px;
    background-color: rgba(255, 255, 255, 0.9);
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 16px;
    letter-spacing: -0.32px;
    color: #2b2b2b;
}

.consult-cta__input {
    width: 176px;
    box-sizing: border-box;
}

.consult-cta__input::placeholder {
    color: #aba195;
}

/* 커스텀 셀렉트 (상담분야 드롭다운) */
.consult-select {
    position: relative;
    width: 161px;
}

.consult-select__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
}

.consult-select__value {
    font-size: 16px;
    color: #2b2b2b;
}

.consult-select__value[data-placeholder] {
    color: #aba195;
}

/* 셀렉트 화살표 (▼ 인디케이터) */
.consult-select__arrow {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    position: relative;
}

.consult-select__arrow::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 40%;
    width: 6px;
    height: 6px;
    border-right: 2px solid var(--cta-arrow-color);
    border-bottom: 2px solid var(--cta-arrow-color);
    transform: translate(-50%, -50%) rotate(45deg);
    transition: transform 0.2s ease;
}

.consult-select__toggle[aria-expanded="true"] .consult-select__arrow::after {
    transform: translate(-50%, -20%) rotate(-135deg);
}

/* 셀렉트 옵션 리스트 (열림 상태) */
.consult-select__options {
    position: absolute;
    left: 0;
    top: calc(100% + 5px);
    z-index: 10;
    width: 100%;
    padding: 5px 0;
    border-radius: 7px;
    background-color: #fff;
    box-shadow: 0 6px 19px rgba(0, 0, 0, 0.18);
    overflow: hidden;
}

.consult-select__options[hidden] {
    display: none;
}

.consult-select__option {
    padding: 8px 14px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 14px;
    letter-spacing: -0.29px;
    color: #2b2b2b;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.consult-select__option:hover,
.consult-select__option[aria-selected="true"] {
    background-color: var(--cta-option-hover-bg);
    color: var(--cta-option-hover-color);
}

/* 상담신청 버튼 */
.consult-cta__submit {
    display: inline-flex;
    align-items: center;
    column-gap: 15px;
    height: 69px;
    margin-left: 13px;
    padding-left: 16px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.consult-cta__submit-text {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 30px;
    line-height: 1;
    color: var(--cta-submit-color); /* 변수 적용 */
    white-space: nowrap;
}

/* 버튼 우측 화살표 (→) */
.consult-cta__submit-arrow {
    position: relative;
    width: 30px;
    height: 30px;
    flex-shrink: 0;
}

.consult-cta__submit-arrow::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 3px;
    width: 21px;
    height: 2px;
    background-color: var(--cta-submit-color); /* 변수 적용 */
    transform: translateY(-50%);
}

.consult-cta__submit-arrow::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 4px;
    width: 10px;
    height: 10px;
    border-top: 2px solid var(--cta-submit-color); /* 변수 적용 */
    border-right: 2px solid var(--cta-submit-color); /* 변수 적용 */
    transform: translateY(-50%) rotate(45deg);
}
/* [상담 CTA 영역] consult-cta 스타일 끝 */


/* [상담 CTA 영역] consult-cta 스타일 -- 색상 레드 시작 */
.consult-cta.consult-cta--red {
    background: linear-gradient(to bottom, transparent 0 14px, #E0D5C3 14px);
    background-color: #fff;
    
    /* 배경 및 포인트 색상 */
    --cta-bg-deco: #961B1E;            
    --cta-arrow-color: #000;        
    --cta-option-hover-color: #601a18; 
    --cta-option-hover-bg: #f2ede3;    

    /* 글자 색상 (필요에 따라 원하는 색상으로 변경 가능합니다) */
    --cta-title-color: #fff;        /* 타이틀 글자 색상 */
    --cta-label-color: #000;        /* 라벨 글자 색상 */
    --cta-submit-color: #000;       /* 신청 버튼 및 화살표 글자 색상 */
}
/* [상담 CTA 영역] consult-cta 스타일 -- 색상 레드 끝 */



/* [오시는 길 영역] location 스타일 시작 */
.location {
    width: 100%;
    padding: 110px 0 180px;
}

.location__inner {
    max-width: 1100px;
    margin-inline: auto;
}

/* head : 라벨 + 타이틀 + 리드문 (중앙 정렬) */
.location__head {
    text-align: center;
}

.location__eyebrow {
    font-family: 'noto-serif-kr';
    font-weight: 600;
    font-size: 18px;
    line-height: 45px;
    color: #601a18;
}

.location__title {
    margin-top: 0;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 45px;
    line-height: 77px;
    letter-spacing: -2.7px;
    color: #0f0f0f;
}

.location__desc {
    margin-top: 60px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 25px;
    line-height: 45px;
    letter-spacing: -0.25px;
    color: #601a18;
}

.location__desc strong {
    font-weight: 700;
    vertical-align: baseline;
}

/* map : 약도 이미지 (컨테이너 풀폭 · 라운드) */
.location__map {
    margin-top: 34px;
    border-radius: 23px;
    overflow: hidden;
}

.location__map iframe {
    display: block;
    width: 100%;
    height: 386px;
    object-fit: cover;
}

/* info : 사무소 안내 / 교통 안내 2단 그리드 */
.location__info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 38px;
    margin-top: 84px;
}

.location__col-title {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 24px;
    line-height: 40px;
    letter-spacing: -0.5px;
    color: #201d1d;
}

.location__list {
    display: flex;
    flex-direction: column;
    row-gap: 60px;
    margin-top: 38px;
}

/* item : [아이콘] [라벨] [값] 가로 배치 */
.location__item {
    display: flex;
    align-items: flex-start;
    column-gap: 9px;
}

.location__icon {
    margin-top: 7px;
    flex: 0 0 21px;
    width: 17px;
    height: 17px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.location__icon--map {
    background-image: url(../images/sub01/ico_location_map.svg);
}

.location__icon--clock {
    background-image: url(../images/sub01/ico_location_clock.svg);
}

.location__icon--call {
    background-image: url(../images/sub01/ico_location_call.svg);
}

.location__icon--parking {
    background-image: url(../images/sub01/ico_location_parking.svg);
    width: 21px;
    height: 20px;
}

.location__icon--bus {
    background-image: url(../images/sub01/ico_location_bus.svg);
}

/* body : 라벨 열 + 값 열 */
.location__body {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: 74px 1fr;
    column-gap: 30px;
    align-items: flex-start;
}

.location__label {
    grid-column: 1;
    grid-row: 1;
    padding-top: 6px;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 16px;
    line-height: 21px;
    letter-spacing: -0.8px;
    color: #961b1e;
    white-space: nowrap;
}

.location__value {
    grid-column: 2;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 20px;
    line-height: 34px;
    letter-spacing: -0.45px;
    color: #450f0e;
}

.location__note {
    grid-column: 2;
    margin-top: 9px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 15px;
    line-height: 29px;
    color: #450f0e;
}

.location__tel {
    grid-column: 2;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 39px;
    line-height: 1;
    letter-spacing: -0.85px;
    color: #450f0e;
}

/* bus : 시내버스 번호 배지 + 정류장 */
.location__bus {
    grid-column: 2;
    display: flex;
    flex-direction: column;
    row-gap: 11px;
    margin-top: 12px;
}

.location__bus-row {
    display: flex;
    align-items: center;
    column-gap: 6px;
}

.location__bus-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 61px;
    height: 29px;
    border: 1.8px solid #961b1e;
    border-radius: 999px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 15px;
    letter-spacing: -0.85px;
    color: #961b1e;
    white-space: nowrap;
}

.location__bus-stop {
    margin-left: 8px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 16px;
    letter-spacing: -0.35px;
    color: #450f0e;
    white-space: nowrap;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.location .br-mo {
    display: none;
}
/* [오시는 길 영역] location 스타일 끝 */



/* [이혼전문센터 인트로 영역] divorce-intro 스타일 시작 */
.divorce-intro {
    width: 100%;
    padding: 80px 0 60px;
    background-color: #231D16;
    overflow: hidden;
}

.divorce-intro__inner {
    position: relative;
    max-width: 1200px;
    margin-inline: auto;
}

/* hero : 배경 이미지 배너 카드 (1200 x 577) */
.divorce-intro__hero {
    position: relative;
    height: 577px;
    border-radius: 21px;
    overflow: hidden;
}

.divorce-intro__hero-bg {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.divorce-intro__hero-bg img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: bottom;
}

/* hero : 하단 가독성 확보용 blur + 그라디언트 오버레이 (하단 208px) */
.divorce-intro__hero::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    height: 208px;
    background: linear-gradient(to bottom, rgba(109, 95, 80, 0) 0%, rgba(109, 95, 80, 0.51) 38%, rgba(109, 96, 79, 1) 100%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    mask-image: linear-gradient(to top, #000 55%, transparent 100%);
    -webkit-mask-image: linear-gradient(to top, #000 55%, transparent 100%);
}

/* 형사 센터 히로 부분 */
.divorce-intro__hero.intro--criminal::after {
    background: linear-gradient(to bottom, rgba(46, 66, 74, 0) 0%, rgba(46, 66, 74, 0.51) 38%, rgba(46, 66, 74, 1) 88%);
}

/* hero : 좌측 텍스트 블록 */
.divorce-intro__hero-body {
    position: absolute;
    z-index: 3;
    left: 60px;
    top: 384px;
}

.divorce-intro__eyebrow {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 40px;
    line-height: 39px;
    letter-spacing: -0.8px;
    color: #fff;
    white-space: nowrap;
}

.divorce-intro__lead {
    margin-top: 26px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 25px;
    line-height: 38px;
    letter-spacing: -0.5px;
    color: #fff;
    white-space: nowrap;
}

/* hero : 우측 CTA 버튼 (pill) */
.divorce-intro__cta {
    position: absolute;
    z-index: 3;
    right: 61px;
    top: 469px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    column-gap: 10px;
    width: 228px;
    height: 57px;
    padding: 14px 22px;
    border-radius: 130px;
    background-color: #961b1e;
    transition: background-color 0.2s ease;
}

.divorce-intro__cta:hover {
    background-color: #7d1416;
}

.divorce-intro__cta-text {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 15px;
    line-height: 1.2;
    color: #fff;
    white-space: nowrap;
}

.divorce-intro__cta-icon {
    display: inline-flex;
    flex-shrink: 0;
    width: 17px;
    height: 17px;
    color: #fff;
}

.divorce-intro--dark .divorce-intro__cta-icon {
    color: #040F11;
}

.divorce-intro__cta-icon svg {
    display: block;
    width: 100%;
    height: 100%;
}

/* head : 라벨(장식 라인 포함) + 타이틀 */
.divorce-intro__head {
    margin-top: 56px;
    padding-left: 15px;
}

.divorce-intro__tag {
    display: flex;
    align-items: center;
    column-gap: 10px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.16px;
    color: #988667;
}

.divorce-intro__tag-line {
    display: inline-block;
    width: 81px;
    height: 1px;
    background-color: #988667;
}

.divorce-intro__title {
    margin-top: 28px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 28px;
    line-height: 43px;
    letter-spacing: -0.5px;
    color: #fff;
}

.divorce-intro__title strong {
    font-weight: 700;
    vertical-align: baseline;
}

/* marquee : 상황 태그 2줄 (full-bleed, 무한 흐름) */
.divorce-intro__marquee {
    position: relative;
    left: 50%;
    width: 100vw;
    margin-top: 60px;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    row-gap: 14px;
}

.divorce-intro__row {
    display: flex;
    column-gap: 14px;
    width: max-content;
}

.divorce-intro__track {
    display: flex;
    flex-shrink: 0;
    column-gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
    will-change: transform;
}

.divorce-intro__row--1 .divorce-intro__track {
    animation: divorce-marquee-left 45s linear infinite;
}

.divorce-intro__row--2 .divorce-intro__track {
    animation: divorce-marquee-right 45s linear infinite;
}

/* row--3 : 모바일 전용 (PC/태블릿 숨김, 모바일 미디어쿼리에서 노출) */
.divorce-intro__row--3 {
    display: none;
}

.divorce-intro__row--3 .divorce-intro__track {
    animation: divorce-marquee-left 38s linear infinite;
}

@keyframes divorce-marquee-left {
    from { transform: translateX(0); }
    to   { transform: translateX(calc(-100% - 14px)); }
}

@keyframes divorce-marquee-right {
    from { transform: translateX(calc(-100% - 14px)); }
    to   { transform: translateX(0); }
}

/* chip : [아이콘] [문구] pill 태그 */
.divorce-intro__chip {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    height: 62px;
    padding: 0 25px 0 14px;
    border-radius: 49px;
    background-color: #3b3228;
    white-space: nowrap;
}

.divorce-intro__chip-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 39px;
    height: 39px;
    color: #988667;
}

.divorce-intro__chip-icon svg,
.divorce-intro__chip-icon img {
    display: block;
    width: 22px;
    height: 22px;
}

.divorce-intro__chip-text {
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    color: #fff;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.divorce-intro .br-mo {
    display: none;
}

/* 모션 최소화 사용자 : 마퀴 정지 */
@media (prefers-reduced-motion: reduce) {
    .divorce-intro__row--1 .divorce-intro__track,
    .divorce-intro__row--2 .divorce-intro__track,
    .divorce-intro__row--3 .divorce-intro__track {
        animation: none;
    }
}
/* [이혼전문센터 인트로 영역] divorce-intro 스타일 끝 */



/* [이혼 카테고리 인트로 영역] divorce-topic 스타일 시작 */
.divorce-topic {
    width: 100%;
    padding: 77px 0 0;
    border-bottom: 8px solid #E6DBC9;
    background-color: #231D16;
    overflow: hidden;
}

.divorce-topic__inner {
    max-width: 1200px;
    margin-inline: auto;
    text-align: center;
}

/* visual : 히어로 배너 이미지 (1200 x 286, 라운드 20) */
.divorce-topic__visual {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
}

.divorce-topic__image {
    display: block;
    width: 100%;
    height: 286px;
    object-fit: cover;
}

/* visual : 하단 blur + 페이드 오버레이 (하단 114px) */
.divorce-topic__visual::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 114px;
    background: linear-gradient(to bottom, rgba(109, 95, 80, 0) 0%, rgba(109, 95, 80, 0.51) 38%, rgba(109, 96, 79, 1) 100%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    mask-image: linear-gradient(to top, #000 40%, transparent 100%);
    -webkit-mask-image: linear-gradient(to top, #000 40%, transparent 100%);
    pointer-events: none;
}

/* 비주얼 토픽 상간소송 */
.divorce-topic__visual.topic--adultery::after {
    background: linear-gradient(to bottom, rgba(48, 48, 48, 0) 0%, rgba(48, 48, 48, 0.51) 38%, rgba(48, 48, 48, 1) 100%);
}

/* 비주얼 토픽 재산분할 */
.divorce-topic__visual.topic--property::after {
    background: linear-gradient(to bottom, rgba(173, 153, 120, 0) 0%, rgba(173, 153, 120, 0.51) 38%, rgba(173, 153, 120, 1) 100%);
}

/* 비주얼 토픽 양육권양육비 */
.divorce-topic__visual.topic--custody::after {
    background: linear-gradient(to bottom, rgba(109, 95, 80, 0) 0%, rgba(109, 95, 80, 0.51) 38%, rgba(109, 96, 79, 1) 100%);
}

/* 비주얼 토픽 상속 */
.divorce-topic__visual.topic--inheritance::after {
    background: linear-gradient(to bottom, rgba(56, 49, 41, 0) 0%, rgba(56, 49, 41, 0.51) 38%, rgba(56, 49, 41, 1) 100%);
}




/* tab : 세부 분야 탭 네비게이션 (등간격 112px, 하단 풀블리드 구분선) */
.divorce-tab {
    position: relative;
    margin-top: 47px;
}

/* tab : 하단 full-bleed 구분선 (1920 폭) */
.divorce-tab::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 100vw;
    height: 1px;
    transform: translateX(-50%);
    background-color: rgba(255, 255, 255, 0.15);
}

.divorce-tab__list {
    display: flex;
    justify-content: center;
}

.divorce-tab__item {
    position: relative;
    width: 112px;
    padding-bottom: 16px;
    text-align: center;
}

.divorce-tab__link {
    display: inline-block;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: -0.48px;
    color: #fff;
    white-space: nowrap;
    transition: color 0.2s ease;
}

/* tab : 활성 상태 (골드 텍스트 + 하단 인디케이터 밑줄) */
.divorce-tab__item.is-active .divorce-tab__link {
    font-weight: 600;
    color: #efd3a4;
}

.divorce-tab__item.is-active::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    height: 2px;
    background-color: #efd3a4;
}

/* text : 타이틀 + 서브 문구 (중앙 정렬) */
.divorce-topic__text {
    display: flex;
    height: 284px;
    flex-direction: column;
    justify-content: center;
}

.divorce-topic__title {
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 30px;
    line-height: 45px;
    letter-spacing: -0.6px;
    color: #fff;
}

.divorce-topic__desc {
    margin-top: 24px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #e6dbc9;
}

/* 카드 오버레이 : PC/태블릿 숨김 (모바일에서만 카드 위 노출) */
.divorce-topic__overlay {
    display: none;
}

/* 줄바꿈 : PC 기본은 모바일 전용 br 숨김 */
.divorce-topic .br-mo {
    display: none;
}
/* [이혼 카테고리 인트로 영역] divorce-topic 스타일 끝 */



/* [공통] 서브섹션 헤더(라벨 + 타이틀) 스타일 시작 */
.sec-head__label {
    display: inline-block;
    padding-bottom: 6px;
    border-bottom: 2px solid #917657;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 18px;
    line-height: 20px;
    letter-spacing: -0.36px;
    color: #917657;
}

.sec-head__title {
    margin-top: 20px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 35px;
    line-height: 50px;
    letter-spacing: -0.7px;
    color: #231d16;
}
/* [공통] 서브섹션 헤더(라벨 + 타이틀) 스타일 끝 */



/* [상간소송 진행 방식 영역] lawsuit-process 스타일 시작 */
.lawsuit-process {
    width: 100%;
    padding: 90px 0 0;
    background-color: #fff;
}

.lawsuit-process__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* sec-head : 축소 스펙(라벨 15 / 타이틀 30) — lawsuit-process 스코프 한정 */
.lawsuit-process .sec-head__label {
    padding-bottom: 3px;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
}

.lawsuit-process .sec-head__title {
    margin-top: 20px;
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
}

/* 소송 단계 서브 헤딩 (골드 라벨) */
.lawsuit-process__step-label {
    margin-top: 40px;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
    color: #917657;
}

/* list : 단계 행 스택 (상단 풀폭 구분선) */
.lawsuit-process__list {
    margin-top: 10px;
    border-top: 1px solid #917657;
}

/* item : [넘버칸 66] [단계명칸 120] [설명 1fr] 3열 그리드 (행 높이 66px) */
.lawsuit-process__item {
    display: grid;
    grid-template-columns: 66px 120px 1fr;
    min-height: 66px;
}

/* 넘버칸 : 브라운 풀필 셀 (행 스택 시 연속 컬럼) */
.lawsuit-process__num {
    padding: 20px 0 0 22px;
    background-color: #917657;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #fff;
}

/* 단계명칸 : 베이지 풀필 셀 */
.lawsuit-process__step {
    padding: 20px 0 0 22px;
    background-color: #f9f8f7;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 설명칸 : 우측 본문 (좌측 블록과 33px 간격) */
.lawsuit-process__desc {
    padding: 20px 0 20px 33px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 강조 문구 (위자료를 청구) : 레드 볼드 */
.lawsuit-process__point {
    font-weight: 700;
    font-style: normal;
    color: #961b1e;
    vertical-align: baseline;
}

/* 줄바꿈 : 모바일 전용 br 기본 숨김 (모바일 미디어쿼리에서 노출) */
.lawsuit-process .br-mo {
    display: none;
}
/* [상간소송 진행 방식 영역] lawsuit-process 스타일 끝 */



/* [이혼의 종류 영역] divorce-type 스타일 시작 */
.divorce-type {
    width: 100%;
    padding: 90px 0 0;
    background: #fff;
}

.divorce-type__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* sec-head : 축소 스펙(라벨 15 / 타이틀 30) — divorce-type 스코프 한정 */
.divorce-type .sec-head__label {
    padding-bottom: 3px;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
}

.divorce-type .sec-head__title {
    margin-top: 20px;
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
}

/* table : 이혼 종류 비교표 (4열 고정 레이아웃) */
.divorce-type__table-wrap {
    margin-top: 40px;
}

.divorce-type__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.divorce-type caption {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.divorce-type__table .col-type { width: 131px; }
.divorce-type__table .col-method { width: 256px; }
.divorce-type__table .col-period { width: 245px; }

.divorce-type__table th,
.divorce-type__table td {
    padding-left: 22px;
    text-align: left;
    vertical-align: middle;
}

/* thead : 컬럼 라벨 (골드 · 하단 브라운 구분선 2px) */
.divorce-type__table thead th {
    padding-top: 0;
    padding-bottom: 13px;
    border-bottom: 2px solid #917657;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
    color: #917657;
}

/* tbody : 데이터 행 (행 높이 66px, 하단 라이트 구분선) */
.divorce-type__table tbody th,
.divorce-type__table tbody td {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e5e3e0;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 구분 열 : 베이지 하이라이트 셀 */
.divorce-type__table tbody th {
    background-color: #f9f8f7;
    font-weight: 500;
    color: #231d16;
}

/* 마지막 행 : 하단 구분선 제거 */
.divorce-type__table tbody tr:last-child th,
.divorce-type__table tbody tr:last-child td {
    border-bottom: 0;
}

/* 강조 행 (조정이혼) : 포인트 레드 (방법 셀은 기본 다크 유지) */
.divorce-type__table .is-highlight th {
    font-weight: 700;
    color: #961b1e;
}

.divorce-type__table .is-highlight td {
    font-weight: 700;
    color: #961b1e;
}

.divorce-type__table .is-highlight td:first-of-type {
    font-weight: 500;
    color: #231d16;
}

/* 모바일 전용 줄바꿈 (PC·태블릿에서는 숨김) */
.divorce-type .br-mo {
    display: none;
}
/* [이혼의 종류 영역] divorce-type 스타일 끝 */



/* [재판상 이혼 사유 영역] divorce-reason 스타일 시작 */
.divorce-reason {
    width: 100%;
    padding: 120px 0 0;
    background: #fff;
}

.divorce-topic + .divorce-reason {
    padding: 90px 0 0;
}

.divorce-reason__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* sec-head : 축소 스펙(라벨 15 / 타이틀 30) — divorce-reason 스코프 한정 */
.divorce-reason .sec-head__label {
    padding-bottom: 3px;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
}

.divorce-reason .sec-head__title {
    margin-top: 20px;
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
}

/* list : 사유 카드 3열 균등 (간격 15px) */
.divorce-reason__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 15px;
    margin-top: 40px;
}

/* card : 상단 accent 라인 + 중앙 정렬 텍스트 */
.divorce-reason__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    padding: 30px 20px;
    border-top: 2px solid #917657;
    background-color: #f9f8f7;
    text-align: center;
}

.divorce-reason__card-title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.4px;
    color: #961b1e;
}

.divorce-reason__card-desc {
    margin-top: 15px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 줄바꿈 : 모바일 전용 br 기본 숨김 (모바일 미디어쿼리에서 노출) */
.divorce-reason .br-mo {
    display: none;
}
/* [재판상 이혼 사유 영역] divorce-reason 스타일 끝 */



/* [위자료 산정 기준 영역] alimony-standard 스타일 시작 */
.alimony-standard {
    width: 100%;
    padding: 120px 0 0;
    background: #fff;
}

.alimony-standard__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* sec-head : 축소 스펙(라벨 15 / 타이틀 30) — alimony-standard 스코프 한정 */
.alimony-standard .sec-head__label {
    padding-bottom: 3px;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
}

.alimony-standard .sec-head__title {
    margin-top: 20px;
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
}

/* list : 산정 기준 4열 균등 (간격 16px) */
.alimony-standard__list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 16px;
    margin-top: 56px;
}

/* item : 넘버 뱃지(상단 걸침) + 라벨 박스 */
.alimony-standard__item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 83px;
    padding: 0 20px;
    border-radius: 10px;
    background-color: #f9f8f7;
    text-align: center;
}

.alimony-standard__num {
    position: absolute;
    top: -16px;
    left: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    background-color: #917657;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 12px;
    line-height: 1;
    letter-spacing: -0.24px;
    color: #fff;
}

.alimony-standard__label {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 19px;
    line-height: 25px;
    letter-spacing: -0.38px;
    color: #231d16;
}
/* [위자료 산정 기준 영역] alimony-standard 스타일 끝 */



/* [자주 묻는 질문 영역] divorce-faq 스타일 시작 */

/* sec-head : 축소 스펙(라벨 15 / 타이틀 30) — divorce-faq 스코프 한정 */
.divorce-faq .sec-head__label {
    padding-bottom: 3px;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
}

.divorce-faq .sec-head__title {
    margin-top: 20px;
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
}

.divorce-faq {
    width: 100%;
    padding: 120px 0 120px;
    background: #fff;
}

/* inner : 좌측 헤더 + 우측 아코디언 2단 배치 */
.divorce-faq__inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1200px;
    margin-inline: auto;
}

.divorce-faq__head {
    flex: 0 0 auto;
}

/* list : 아코디언 (우측 790px 고정) */
.divorce-faq__list {
    flex: 0 0 790px;
}

.divorce-faq__item {
    border-top: 1px solid #d8d2c4;
}

.divorce-faq__item:first-child {
    border-top: 2px solid #917657;
}

.divorce-faq__item:last-child {
    border-bottom: 1px solid #d8d2c4;
}

.divorce-faq__question {
    margin: 0;
}

/* trigger : 질문 + 토글 아이콘 (전폭 버튼) */
.divorce-faq__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 16px;
    width: 100%;
    padding: 33px 11px;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.divorce-faq__q-text {
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.4px;
    color: #231d16;
}

/* icon : +(닫힘) / −(열림) 인디케이터 */
.divorce-faq__icon {
    position: relative;
    flex-shrink: 0;
    width: 19px;
    height: 19px;
}

.divorce-faq__icon::before,
.divorce-faq__icon::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: #961b1e;
    transition: opacity 0.2s ease;
}

.divorce-faq__icon::before {
    width: 19px;
    height: 2px;
    transform: translate(-50%, -50%);
}

.divorce-faq__icon::after {
    width: 2px;
    height: 19px;
    transform: translate(-50%, -50%);
}

/* panel : 답변 영역 (닫힘 기본 · 열림 노출) */
.divorce-faq__panel {
    padding: 0 11px;
}

.divorce-faq__answer {
    padding: 0 50px 33px 0;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
    word-break: keep-all;
}

/* 활성(열림) 상태 : 세로 막대 숨겨 − 표시 + 하단 여백 축소 */
.divorce-faq__item.is-active .divorce-faq__trigger {
    padding-bottom: 23px;
}

.divorce-faq__item.is-active .divorce-faq__icon::after {
    opacity: 0;
}

.divorce-faq__item:not(.is-active) .divorce-faq__panel {
    display: none;
}
/* [자주 묻는 질문 영역] divorce-faq 스타일 끝 */



/* [왜 화신인가 영역] why-hwashin 스타일 시작 */
.why-hwashin {
    width: 100%;
    padding: 71px 0 83px;
    background-color: #f1ece2;
}

/* inner : 좌측 인트로 + 우측 카드 2단 배치 */
.why-hwashin__inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1180px;
    margin-inline: auto;
}

/* intro : 라벨 + 타이틀 + 인증서 이미지 (좌측 컬럼) */
.why-hwashin__intro {
    flex: 0 0 auto;
}

/* head : 라벨(장식 라인 포함) + 타이틀 */
.why-hwashin__tag {
    display: flex;
    align-items: center;
    column-gap: 9px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.16px;
    color: #988667;
}

.why-hwashin__tag-line {
    display: inline-block;
    width: 81px;
    height: 1px;
    background-color: #988667;
}

.why-hwashin__title {
    margin-top: 22px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 28px;
    line-height: 43px;
    letter-spacing: -0.56px;
    color: #231d16;
}

.why-hwashin__title strong {
    font-weight: 700;
    color: #961b1e;
    vertical-align: baseline;
}

/* cert : 전문분야 등록증서 이미지 (176 x 250) */
.why-hwashin__cert {
    width: 176px;
    height: 250px;
    margin-top: 66px;
    border: 1px solid #e6dbc9;
    border-radius: 4px;
    box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.why-hwashin__cert img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* cards : 특장점 카드 3개 세로 배치 (우측 컬럼) */
.why-hwashin__cards {
    flex: 0 0 700px;
    display: flex;
    flex-direction: column;
    row-gap: 14px;
    margin-top: 14px;
}

/* card : 넘버 + 본문(제목 + 설명) 가로 배치 */
.why-hwashin__card {
    display: flex;
    align-items: flex-start;
    column-gap: 24px;
    min-height: 138px;
    padding: 25px 28px 24px;
    border-radius: 15px;
    background-color: #fff;
}

.why-hwashin__card-num {
    padding-top: 3px;
    flex-shrink: 0;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: #961b1e;
}

.why-hwashin__card-body {
    flex: 1 1 auto;
}

.why-hwashin__card-title {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -1px;
    color: #961b1e;
}

.why-hwashin__card-desc {
    margin-top: 12px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 14px;
    line-height: 23px;
    color: #231d16;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.why-hwashin .br-mo {
    display: none;
}
/* [왜 화신인가 영역] why-hwashin 스타일 끝 */



/* [서비스 카드 슬라이더 영역] service-slider 스타일 시작 */
.service-slider {
    width: 100%;
    padding: 120px 0;
    background-color: #FBF9F4;
    overflow: hidden;
}

.service-slider__inner {
    max-width: 1194px;
    margin-inline: auto;
}

/* head : 2줄 타이틀 (레드 강조 포인트) */
.service-slider__title {
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 28px;
    line-height: 43px;
    letter-spacing: -0.32px;
    color: #231d16;
}

.service-slider__title strong {
    font-weight: 700;
    color: #961b1e;
    vertical-align: baseline;
}

/* viewport : 슬라이드 트랙 영역
   inner(1194) 폭에 카드 3장(388×3 + gap 15×2)이 정확히 꽉 차고,
   4번째 이후 카드는 viewport 밖으로 넘쳐 clip되어 화면에는 3장만 노출된다. */
.service-slider__viewport {
    margin-top: 45px;
    overflow: hidden;
    /* 가로 드래그(스와이프)는 JS 가 처리하고 세로 스크롤은 브라우저에 양보 */
    touch-action: pan-y;
}

.service-slider__list {
    display: flex;
    column-gap: 15px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* slide : 카드 1장 (388 x 576 고정) */
.service-slider__slide {
    flex: 0 0 388px;
}

/* card : 배경 이미지 + 오버레이 텍스트 (카드 전체가 링크) */
.service-card {
    display: block;
    position: relative;
    width: 100%;
    height: 576px;
    border-radius: 17px;
    overflow: hidden;
}

.service-card__bg {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.service-card__bg img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.service-card:hover .service-card__bg img {
    transform: scale(1.04);
}

/* card : 상단 가독성 확보용 다크 그라디언트 (제목/소제목 영역) */
.service-card__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(35, 29, 22, 0.9) 0%, rgba(35, 29, 22, 0) 40%);
}

/* card : 하단 프로스티드 블러 밴드 (Figma Rectangle 105 · blur 50 재현)
   설명문·CTA가 놓이는 하단 224px를 배경 위로 흐리게 처리하고,
   위쪽 경계는 mask로 부드럽게 사라지도록 한다. */
.service-card__blur {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    height: 186px;
    background: linear-gradient(to top, rgba(35, 29, 22, 0.55) 0%, rgba(35, 29, 22, 0) 100%);
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    -webkit-mask-image: linear-gradient(to top, #000 75%, transparent 100%);
    mask-image: linear-gradient(to top, #000 55%, transparent 100%);
    pointer-events: none;
}

/* card : 텍스트 콘텐츠 (상단 그룹 · 하단 그룹 양끝 배치) */
.service-card__body {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 33px 30px;
}

.service-card__subtitle {
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 27px;
    letter-spacing: -0.16px;
    color: #e6dbc9;
}

.service-card__title {
    margin-top: 10px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 32px;
    line-height: 35px;
    letter-spacing: -1.6px;
    color: #fff;
}

.service-card__desc {
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 16px;
    line-height: 25px;
    letter-spacing: -0.16px;
    color: #fff;
}

/* card : 하단 CTA (원형 아이콘 + 텍스트) */
.service-card__link {
    display: inline-flex;
    align-items: center;
    column-gap: 13px;
    margin-top: 20px;
}

.service-card__link-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 47px;
    height: 47px;
    border-radius: 50%;
    background-color: #961b1e;
    color: #fff;
    transition: background-color 0.2s ease;
}

.service-card:hover .service-card__link-icon {
    background-color: #7d1416;
}

.service-card__link-icon svg {
    display: block;
    width: 20px;
    height: 20px;
}

.service-card__link-text {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 15px;
    line-height: 17px;
    letter-spacing: -0.07px;
    color: #fff;
}

/* controls : 이전 / 다음 네비게이션 (중앙 정렬) */
.service-slider__controls {
    display: flex;
    justify-content: center;
    column-gap: 11px;
    margin-top: 40px;
}

.service-slider__nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 39px;
    padding: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.service-slider__nav svg {
    display: block;
    width: 17px;
    height: 17px;
}

/* prev · next : 아웃라인 원형 (배경 없음, 통일) */
.service-slider__nav--prev,
.service-slider__nav--next {
    border: 1px solid #231d16;
    background-color: transparent;
    color: #231d16;
}

/* hover : 두 버튼 모두 다크 배경 + 흰 아이콘 */
.service-slider__nav:hover {
    border-color: #231d16;
    background-color: #231d16;
    color: #fff;
}

/* 타이틀 줄바꿈 : br-mo 는 모바일 전용 → PC 에서는 숨김 */
.service-slider .br-mo {
    display: none;
}
/* [서비스 카드 슬라이더 영역] service-slider 스타일 끝 */



/* [지금 당장 해야할 것 영역] action-now 스타일 시작 */
.action-now {
    width: 100%;
    padding: 40px 0 0;
    background-color: #fff;
}

.action-now__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* 타이틀 : 골드-브라운 소제목 (라벨형) */
.action-now__title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: -0.3px;
    color: #917657;
}

/* list : 행 스택 (상단 풀폭 구분선) */
.action-now__list {
    margin-top: 6px;
    border-top: 2px solid #d8d2c4;
}

/* row : [라벨박스 123] [설명 1fr] 2열 그리드 (행 높이 66px, 하단 라이트 구분선) */
.action-now__row {
    display: grid;
    grid-template-columns: 123px 1fr;
    align-items: center;
    min-height: 66px;
    border-bottom: 1px solid #e4dfd2;
}

/* 마지막 행 : 하단 구분선 제거 */
.action-now__row:last-child {
    border-bottom: 0;
}

/* term : 좌측 라벨 (라이트 박스) */
.action-now__term {
    align-self: stretch;
    display: flex;
    align-items: center;
    padding-left: 22px;
    background-color: #f9f8f7;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* desc : 우측 설명 (다크 본문 · 좌측 정렬) */
.action-now__desc {
    padding: 0 0 0 30px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
    text-align: left;
}

/* point : 강조 문구 (레드 볼드) */
.action-now__point {
    font-weight: 700;
    font-style: normal;
    color: #961b1e;
    vertical-align: baseline;
}

/* 모바일 전용 줄바꿈 : PC 기본 숨김 (라벨 "가압류 신청" 1줄 유지) */
.action-now .br-mo {
    display: none;
}
/* [지금 당장 해야할 것 영역] action-now 스타일 끝 */



/* [재산분할 서브(2_sub04) 델타] 피그마 스펙 반영 오버라이드 시작 */
/* - 공용 divorce-reason / alimony-standard 블록의 값 중 이 페이지 피그마와
 *   다른 부분만 modifier(.property-target / .property-ratio)로 스코프하여 재정의 */

/* 재산분할 대상 카드 타이틀 : 2줄 행간 확보 (공용 line-height:1 → 39px) */
.property-target .divorce-reason__card-title {
    line-height: 39px;
}

/* 재산분할 비율 라벨 : 21px (공용 22px 값 재정의) */
.property-ratio .alimony-standard__label {
    font-size: 19px;
    letter-spacing: -0.42px;
}
/* [재산분할 서브(2_sub04) 델타] 끝 */



/* =========================================================================
 * 양육권·양육비 서브 페이지(2_sub05) 전용 스타일
 * - 공용 블록(sec-head / alimony-standard / divorce-faq)은 기존 스타일 그대로 재사용
 * - 아래는 해당 페이지 디자인에 맞춘 델타(비교표 3열 변형 · 대응 카드 2열)만 정의
 * ========================================================================= */

/* [친권·양육권 비교표 영역] divorce-type(3열 변형) 스타일 시작 */
/* sub05 전용 컬럼(.col-belong)을 가진 표에만 적용 → 이혼 페이지(2_sub02) 4열 표에는 무영향 */
/* 축소 스펙 : sec-head·thead·tbody 는 base .divorce-type 스코프 그대로 상속(15 / 16·lh26 / 인셋 22 / 보더 2px) */
/* 컬럼 폭만 3열 레이아웃에 맞게 재지정 (구분 131px 은 base 상속 · 정의 auto · 이혼 후 귀속 413px) */
.divorce-type__table:has(.col-belong) .col-belong { width: 413px; }

/* tbody : 구분 컬럼(친권 / 양육권) 볼드 강조 (그 외 배경·폰트·간격은 base 상속) */
.divorce-type__table:has(.col-belong) tbody th {
    font-weight: 700;
}
/* [친권·양육권 비교표 영역] divorce-type(3열 변형) 스타일 끝 */



/* [양육비 미지급 대응 영역] custody-response(divorce-reason 2열 변형) 스타일 시작 */
/* list : 2열 균등 (간격 18px) — divorce-reason 3열 그리드를 재정의 */
.custody-response__list {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 18px;
}

/* card : 라이트 박스 + 상단 골드 accent 라인(base #917657 2px 유지) */
.custody-response__card {
    padding: 40px;
    background-color: #f9f8f7;
}

/* title : 레드 24px */
.custody-response__card-title {
    font-size: 24px;
    line-height: 1.3;
    letter-spacing: -0.48px;
    color: #961b1e;
}

/* desc : 17px 다크 본문 */
.custody-response__card-desc {
    margin-top: 20px;
    font-size: 17px;
    line-height: 29px;
    letter-spacing: -0.34px;
    color: #231d16;
}

/* desc : 강조 문장 (볼드) */
.custody-response__card-desc strong {
    font-weight: 700;
    color: #231d16;
}
/* [양육비 미지급 대응 영역] custody-response(divorce-reason 2열 변형) 스타일 끝 */



/* =========================================================================
 * 상속 서브 페이지(2_sub06) 전용 스타일
 * - 공용 블록(sec-head / divorce-type 표 / divorce-faq 아코디언)은 라이트 테마 그대로 재사용
 * - 아래는 이 페이지 디자인에 맞춘 델타(비교표 3열 변형 · 안내 카드 3열)만 정의
 * - 스코프: .inherit-core 하위로 한정 → 2_sub02 등 다른 페이지에는 무영향
 * - FAQ(divorce-faq)는 sub02와 완전히 동일하므로 별도 override 없음
 * ========================================================================= */

/* [상속의 핵심 영역] inherit-core 스타일 시작 (1200 축소 스펙) */
.inherit-core {
    width: 100%;
    padding: 90px 0 0;
    background-color: #fff;
}

.inherit-core__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* sec-head : 축소 스펙(라벨 15 / 타이틀 30) — inherit-core 스코프 한정 */
.inherit-core .sec-head__label {
    padding-bottom: 3px;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
}

.inherit-core .sec-head__title {
    margin-top: 20px;
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
}

/* table : 상속 승인·포기 비교표 (divorce-type__table 축소 base 재사용, 3열 델타만 정의) */
.inherit-core__table-wrap {
    margin-top: 40px;
}

/* caption 숨김 (.divorce-type 스코프 밖이므로 개별 정의) */
.inherit-core__table caption {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

/* 컬럼 폭 : 구분 153 / 기간 546 / 내용(나머지 1fr = 501) */
.inherit-core__table .col-division { width: 153px; }
.inherit-core__table .col-period   { width: 546px; }

/* thead : 내용·기간 라벨은 컬럼 좌측에 flush (구분만 22px 인셋) — 폰트·구분선은 base 15px 스펙 사용 */
.inherit-core__table thead th {
    padding-left: 0;
}

.inherit-core__table thead th:first-child {
    padding-left: 22px;
}

/* tbody : 내용·기간 셀은 컬럼 좌측에 flush (폰트 16/26는 base 스펙 사용) */
.inherit-core__table tbody th,
.inherit-core__table tbody td {
    padding-left: 0;
}

/* tbody : 구분 컬럼(승인 방식 라벨) — 123px 베이지 하이라이트 박스 + 22px 인셋 */
.inherit-core__table tbody th {
    padding-left: 22px;
    background: linear-gradient(#f9f8f7, #f9f8f7) left top / 123px 100% no-repeat;
}

/* 강조 행(상속포기) : 구분·기간 셀 버건디 볼드 / 내용 셀 다크 → base .divorce-type__table .is-highlight 규칙 그대로 상속 */

/* guide : 상속 안내 카드 3열 균등 (간격 15px) */
.inherit-core__guide {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 15px;
    margin-top: 40px;
}

/* card : 베이지 박스 + 상단 골드 accent 라인(2px) + 중앙 정렬 */
.inherit-core__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 230px;
    padding: 30px 40px;
    border-top: 2px solid #917657;
    background-color: #f9f8f7;
    text-align: center;
}

.inherit-core__card-title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.4px;
    color: #961b1e;
}

.inherit-core__card-desc {
    margin-top: 15px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* card-desc 내 부가 설명(청구 기간 안내) : 11px 연브라운 인라인 */
.inherit-core__card-note {
    font-size: 11px;
    letter-spacing: -0.22px;
    color: #8a765e;
}

/* 줄바꿈 : 모바일 전용 br 은 PC·태블릿에서 숨김 (모바일 미디어쿼리에서 노출) */
.inherit-core .br-mo {
    display: none;
}
/* [상속의 핵심 영역] inherit-core 스타일 끝 */



/* =========================================================================
 * 형사전문센터 서브 페이지(3_sub01) 전용 스타일
 * - 공용 블록(divorce-intro / why-hwashin / service-slider / service-card)은
 *   레이아웃을 그대로 재사용하고, 형사 테마(다크 뉴트럴 + 딥틸 + 골드)
 *   컬러 델타만 오버라이드로 정의
 * - 스코프: `--dark` 모디파이어 및 `.main:has(.stage-guide)` 컨텍스트로 한정
 *   → 이혼 계열(2_sub0x) 페이지에는 무영향
 * - 신규 섹션(stage-guide / consult-banner / sub-breadcrumb)은 이 페이지 전용
 * ========================================================================= */





/* [형사 인트로 다크 오버라이드] divorce-intro--dark 스타일 시작 */
/* 섹션 배경 : 이혼(#1a1410 웜) → 형사 테마 딥네이비 */
.divorce-intro--dark {
    background-color: #040f11;
}

/* 롤링(마퀴) 칩 배경 : 웜 브라운(#3b3228) → 형사 테마 딥네이비 그레이 */
.divorce-intro--dark .divorce-intro__chip {
    background-color: #212c31;
}

/* 히어로 CTA : 버건디(#961b1e) → 형사 테마 차콜 뉴트럴 */
.divorce-intro--dark .divorce-intro__cta {
    background-color: #D5BB8F;
}

.divorce-intro--dark .divorce-intro__cta-text {
    color: #040F11;
}

/*.divorce-intro--dark .divorce-intro__cta:hover {
    background-color: #2c2823;
}*/
/* [형사 인트로 다크 오버라이드] divorce-intro--dark 스타일 끝 */



/* [단계별 대응 안내 영역] stage-guide 스타일 시작 */
.stage-guide {
    width: 100%;
    padding: 100px 0 100px;
    background-color: #212C31;
}

.stage-guide__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* head : 골드 라벨(좌측 장식 라인) + 화이트 타이틀 */
.stage-guide__tag {
    display: flex;
    align-items: center;
    column-gap: 11px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.16px;
    color: #988667;
}

.stage-guide__tag-line {
    display: inline-block;
    width: 96px;
    height: 1px;
    background-color: #988667;
}

.stage-guide__title {
    margin-top: 35px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 34px;
    line-height: 52px;
    letter-spacing: -0.67px;
    color: #fff;
}

/* 타이틀 강조("단계") : 볼드 */
.stage-guide__title strong {
    font-weight: 700;
    vertical-align: baseline;
}

/* list : 단계 행 스택 */
.stage-guide__list {
    margin-top: 82px;
}

/* item : [단계명 171] [설명 1fr] 2열 그리드 (행 높이 89px, 상단 골드 라인) */
.stage-guide__item {
    display: grid;
    grid-template-columns: 171px 1fr;
    align-items: start;
    min-height: 89px;
    padding: 19px 0;
    margin: 0;
    border-top: 1px solid #bf9874;
}

.stage-guide__label {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 22px;
    line-height: 24px;
    letter-spacing: -0.44px;
    color: #dedede;
}

.stage-guide__desc {
    margin: 0;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.4px;
    color: #fff;
}

/* 강조 문구 : 골드 */
.stage-guide__desc strong {
    font-weight: 700;
    color: #edcb98;
    vertical-align: baseline;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.stage-guide .br-mo {
    display: none;
}
/* [단계별 대응 안내 영역] stage-guide 스타일 끝 */



/* [왜 화신인가 - 형사 테마] why-hwashin 딥틸 오버라이드 시작 */
.why-hwashin.why-hwashin--dark {
    background-color: #F2F0EB;
}

.why-hwashin.why-hwashin--dark .why-hwashin__tag{
    color: #226D77;
}

.why-hwashin.why-hwashin--dark .why-hwashin__tag-line{
    background-color: #226D77;
}

.why-hwashin.why-hwashin--dark .why-hwashin__title strong {
    color: #226D77;
}

.why-hwashin.why-hwashin--dark .why-hwashin__card-num {
    color: #226D77;
}

.why-hwashin.why-hwashin--dark .why-hwashin__card-title {
    color: #226D77;
}
/* [왜 화신인가 - 형사 테마] why-hwashin 딥틸 오버라이드 끝 */



/* [형사 서비스 슬라이더 - 형사 테마] service-slider--dark 오버라이드 시작 */
/* ※ 배경은 base(크림)를 유지하고, 형사 테마 액센트(딥틸/페일)만 교체 */
.service-slider--dark .service-slider__title {
    color: #293b43;
    font-weight: 600;
}

.service-slider--dark .service-slider__title strong {
    color: #226d77;
    font-weight: 800;
}

/* 카드 하단 CTA 아이콘 : 버건디 필 → 베이지 골드 원 + 다크 화살표 (Figma #d5bb8f) */
.service-slider--dark .service-card__link-icon {
    background-color: #d5bb8f;
    color: #231d16;
}

.service-slider--dark .service-card:hover .service-card__link-icon {
    background-color: #c8a86f;
}

/* 슬라이더 네비 : next는 채워진 다크 원 + 흰 화살표 (Figma 기본 활성 상태) */
/*.service-slider--dark .service-slider__nav--next {
    background-color: #231d16;
    color: #fff;
}*/
/* [형사 서비스 슬라이더 - 형사 테마] service-slider--dark 오버라이드 끝 */



/* [전화 상담 배너 영역] consult-banner 스타일 시작 */
.consult-banner {
    position: relative;
    width: 100%;
    height: 148px;
    background-color: #c8b482;
    overflow: hidden;
}

/* 우측 다크 사선 패널 (full-bleed) */
.consult-banner::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 34%;
    background-color: #1b272d;
    clip-path: polygon(90px 0, 100% 0, 100% 100%, 0 100%);
    z-index: 1;
}

.consult-banner__inner {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1440px;
    height: 100%;
    margin-inline: auto;
}

/* lead : 안내 문구 + 대표번호 (좌측 골드 영역) */
.consult-banner__lead {
    display: flex;
    align-items: center;
    column-gap: 40px;
}

.consult-banner__text {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 24px;
    line-height: 34px;
    letter-spacing: -0.48px;
    color: #231d16;
    white-space: nowrap;
}

.consult-banner__tel {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 40px;
    line-height: 1;
    letter-spacing: -0.8px;
    color: #1a1a1a;
    white-space: nowrap;
}

/* cta : 무료 상담 안내 + 화살표 (우측 다크 영역) */
.consult-banner__cta {
    display: inline-flex;
    align-items: center;
    column-gap: 16px;
}

.consult-banner__cta-text {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 26px;
    line-height: 1;
    letter-spacing: -0.52px;
    color: #fff;
    white-space: nowrap;
}

.consult-banner__cta-icon {
    display: inline-flex;
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    color: #fff;
    transition: transform 0.2s ease;
}

.consult-banner__cta-icon svg {
    display: block;
    width: 100%;
    height: 100%;
}

.consult-banner__cta:hover .consult-banner__cta-icon {
    transform: translateX(6px);
}
/* [전화 상담 배너 영역] consult-banner 스타일 끝 */



/* [형사 카테고리 인트로 영역] divorce-topic--dark(쿨톤 테마) 스타일 시작 */
/* 레이아웃·간격·타이포는 .divorce-topic 기본 스타일을 그대로 재사용하고,
   형사 디자인에 맞춘 쿨톤(다크 네이비 배경 + 블루그레이 포인트) 컬러만 덮어씀 */

/* section : 다크 네이비 배경으로 교체 */
.divorce-topic--dark {
    background-color: #040F11;
    border-bottom: 8px solid #CFDFE1;
}

/* visual : 하단 blur 오버레이 틴트를 네이비 톤으로 교체 */
.divorce-topic--dark .divorce-topic__visual::after {
    background: linear-gradient(to bottom, rgba(46, 66, 74, 0) 0%, rgba(46, 66, 74, 0.51) 38%, rgba(46, 66, 74, 1) 100%);
    mask-image: linear-gradient(to top, #000 15%, transparent 100%);
    -webkit-mask-image: linear-gradient(to top, #000 15%, transparent 100%);
}

/* tab : 활성 상태 포인트 컬러를 골드 → 블루그레이(#719aad)로 교체 */
.divorce-topic--dark .divorce-tab__item.is-active .divorce-tab__link {
    color: #719aad;
}

.divorce-topic--dark .divorce-tab__item.is-active::after {
    background-color: #719aad;
}

/* text : 서브 문구 컬러를 쿨 그레이(#dedede)로 교체 */
.divorce-topic--dark .divorce-topic__desc {
    color: #dedede;
}
/* [형사 카테고리 인트로 영역] divorce-topic--dark(쿨톤 테마) 스타일 끝 */



/* =========================================================================
 * 고소대리 서브 페이지(3_sub02) 전용 스타일
 * - 공용 블록(sec-head / divorce-faq 아코디언)은 레이아웃을 그대로 재사용하고
 *   형사 테마(딥틸 #226d77 + 페일틸 #f4f9fa + 서브라벨 #596c6f) 컬러만 오버라이드
 * - 신규 섹션(criminal-intro / criminal-step)은 이 페이지 전용
 * - 스코프: .criminal-intro / .criminal-step / .criminal-faq 하위로 한정
 *   → 이혼 계열(2_sub0x) 및 형사전문센터(3_sub01)에는 무영향
 * ========================================================================= */

/* [공통] 고소대리 페이지 서브헤더(라벨 + 타이틀) 컬러 오버라이드 시작 */
/* 라벨 : 골드(#988667) → 딥틸그레이(#596c6f) 15px 밑줄 */
.criminal-intro .sec-head__label,
.criminal-step .sec-head__label,
.criminal-faq .sec-head__label {
    padding-bottom: 3px;
    border-bottom-color: #596c6f;
    font-weight: 700;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.3px;
    color: #596c6f;
}

/* 타이틀 : 다크 잉크(#231d16) 30px 2줄 */
.criminal-intro .sec-head__title,
.criminal-faq .sec-head__title {
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
    color: #231d16;
}

/* 소송 단계 라벨 : 피그마 기준 밑줄 없음 (고소대리란/자주묻는질문과 달리 언더라인 X) */
.criminal-step .sec-head__label {
    padding-bottom: 0;
    border-bottom: 0;
}
/* [공통] 고소대리 페이지 서브헤더(라벨 + 타이틀) 컬러 오버라이드 끝 */



/* [고소대리란 카드 영역] criminal-intro 스타일 시작 */
.criminal-intro {
    width: 100%;
    padding: 90px 0 0;
    background-color: #fff;
}

.criminal-intro__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* list : 소개 카드 3열 균등 (간격 15px) */
.criminal-intro__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 15px;
    margin-top: 40px;
}

/* card : 상단 그레이(#596c6f) accent 라인 + 페일틸 박스 + 중앙 정렬 */
.criminal-intro__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 230px;
    padding: 30px;
    border-top: 2px solid #596c6f;
    background-color: #f4f9fa;
    text-align: center;
}

/* title : 딥틸 20px */
.criminal-intro__card-title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.4px;
    color: #226d77;
}

/* desc : 다크 잉크 16px 본문 */
.criminal-intro__card-desc {
    margin-top: 15px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.criminal-intro .br-mo {
    display: none;
}
/* [고소대리란 카드 영역] criminal-intro 스타일 끝 */



/* [소송 단계 영역] criminal-step 스타일 시작 */
.criminal-step {
    width: 100%;
    padding: 40px 0 0;
    background-color: #fff;
}

.criminal-step__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* table : 단계 안내표 (넘버 66 / 단계명 120 / 설명 1fr, 상단 그레이 하이라인) */
.criminal-step__table-wrap {
    margin-top: 10px;
    border-top: 2px solid #596c6f;
}

.criminal-step__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

/* caption 숨김 (스크린리더 전용) */
.criminal-step__table caption {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.criminal-step__table .col-num  { width: 66px; }
.criminal-step__table .col-name { width: 120px; }

.criminal-step__table th,
.criminal-step__table td {
    text-align: left;
    vertical-align: middle;
}

/* row : 행 높이 66px */
.criminal-step__row {
    height: 66px;
}

/* 넘버칸 : 딥틸 풀필 셀 (우측 2px 화이트 갭 · 하단 라이트 하이라인) */
.criminal-step__num {
    padding-left: 24px;
    border-right: 2px solid #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    background-color: #226d77;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #fff;
}

/* 단계명칸 : 페일틸 풀필 셀 */
.criminal-step__name {
    padding-left: 24px;
    border-bottom: 1px solid #dbe6e7;
    background-color: #f4f9fa;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 설명칸 : 우측 본문 (좌측 블록과 35px 간격) */
.criminal-step__desc {
    padding: 0 0 0 35px;
    border-bottom: 1px solid #dbe6e7;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

.criminal-step__row:last-child .criminal-step__num {border-bottom: 0;}
.criminal-step__row:last-child .criminal-step__name {border-bottom: 0;}
.criminal-step__row:last-child .criminal-step__desc {border-bottom: 0;}

/* 강조 문구 : 딥틸 볼드 */
.criminal-step__point {
    font-weight: 700;
    font-style: normal;
    color: #226d77;
    vertical-align: baseline;
}

/* 줄바꿈: 단계명 모바일 전용 br 은 PC 에서 숨김 (모바일에서 노출) */
.criminal-step .br-mo {
    display: none;
}
/* [소송 단계 영역] criminal-step 스타일 끝 */



/* [자주 묻는 질문 - 고소대리 테마] criminal-faq(divorce-faq 컬러 오버라이드) 시작 */
/* 레이아웃·아코디언 동작은 .divorce-faq 기본 스타일을 그대로 재사용하고 컬러/타이포만 교체 */

/* 구분선 : 웜(#d8d2c4) → 쿨 그레이 (전체 항목 중화) */
.criminal-faq .divorce-faq__item {
    border-top-color: #dcdedd;
}

/* 첫 항목 상단만 딥틸 그레이 액센트 라인 유지 */
.criminal-faq .divorce-faq__item:first-child {
    border-top-color: #596C6F;
}

.criminal-faq .divorce-faq__item:last-child {
    border-bottom-color: #dcdedd;
}

/* 질문 : 축소 스펙 20px 다크 잉크(피그마 box_title 기준) */
.criminal-faq .divorce-faq__q-text {
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.4px;
    color: #231d16;
}

/* 답변 : 축소 스펙 16px 다크 잉크(피그마 Header_note 기준) */
.criminal-faq .divorce-faq__answer {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 토글 아이콘(+/−) : 버건디(#601a18) → 딥틸(#226d77) */
.criminal-faq .divorce-faq__icon::before,
.criminal-faq .divorce-faq__icon::after {
    background-color: #226d77;
}
/* [자주 묻는 질문 - 고소대리 테마] criminal-faq(divorce-faq 컬러 오버라이드) 끝 */



/* =========================================================================
 * 음주운전 서브 페이지(3_sub03) 전용 스타일
 * - 공용 블록(sec-head / divorce-type 표 / divorce-faq 아코디언)은 레이아웃을
 *   그대로 재사용하고, 음주운전 테마(딥틸 #226d77 + 페일틸 #f4f9fa·#e5f2f5 +
 *   서브라벨 #596c6f + 베이지 #d5bb8f) 컬러 델타만 오버라이드
 * - 신규 섹션(dui-response 대응카드 2열 · dui-case 상황→대응→결과 흐름)은 이 페이지 전용
 * - 스코프: .divorce-type--dui / .dui-response 하위로 한정 (FAQ는 공용 .criminal-faq 재사용)
 *   → 이혼 계열(2_sub0x) 및 다른 형사 페이지에는 무영향
 * ========================================================================= */

/* [공통] 음주운전 페이지 서브헤더(라벨 + 타이틀) 컬러 오버라이드 시작 */
/* 라벨 : 골드(#988667) → 딥틸그레이(#596c6f) 18px 밑줄 */
.divorce-type--dui .sec-head__label,
.dui-response .sec-head__label {
    border-bottom-color: #596c6f;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -0.3px;
    color: #596c6f;
}

/* 타이틀 : 다크 잉크(#231d16) 30px 2줄 */
.divorce-type--dui .sec-head__title,
.dui-response .sec-head__title {
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
    color: #231d16;
}
/* [공통] 음주운전 페이지 서브헤더(라벨 + 타이틀) 컬러 오버라이드 끝 */



/* [혈중알코올농도별 처벌 기준표 영역] divorce-type--dui(3열 변형) 스타일 시작 */
/* 컬럼 폭 : 혈중농도 310 / 형사처벌 680 / 면허처분(나머지 1fr) */
.divorce-type--dui .divorce-type__table .col-level    { width: 310px; }
.divorce-type--dui .divorce-type__table .col-criminal { width: 680px; }

/* thead : 딥틸그레이 컬럼 라벨(18px) + 다크 하단 구분선 / 첫 컬럼 26px 인셋 */
.divorce-type--dui .divorce-type__table thead th {
    border-bottom-color: #231d16;
    font-weight: 600;
    font-size: 18px;
    color: #596c6f;
}

/* 정렬 : 형사처벌·면허처분 컬럼은 컬럼 경계에 맞춰 좌측 인셋 제거 (피그마 x=310·989) */
.divorce-type--dui .divorce-type__table thead th,
.divorce-type--dui .divorce-type__table tbody td {
    padding-left: 0;
}

/* 첫 컬럼(혈중농도)만 28px 인셋 유지 */
.divorce-type--dui .divorce-type__table thead th:first-child,
.divorce-type--dui .divorce-type__table tbody th {
    padding-left: 28px;
}

/* tbody : 데이터 셀(20px 다크 본문 + 쿨톤 하단 구분선) */
/* word-break:keep-all : 좁은 셀(태블릿·모바일)에서 한글이 음절 단위로 잘리지 않고 단어 단위로만 줄바꿈되도록
   (상속 속성 → ::before 라벨·좌측 혈중농도 셀에도 적용 / PC는 한 줄이라 무영향) */
.divorce-type--dui .divorce-type__table tbody th,
.divorce-type--dui .divorce-type__table tbody td {
    border-bottom-color: #dbe6e7;
    font-size: 20px;
    line-height: 23px;
    letter-spacing: -0.4px;
    color: #231d16;
    word-break: keep-all;
}

/* tbody : 혈중농도 컬럼(첫 열) — 페일틸 박스 하이라이트 (피그마 박스 폭 273px) */
.divorce-type--dui .divorce-type__table tbody th {
    font-weight: 600;
    background-color: transparent;
    background-image: linear-gradient(#f4f9fa, #f4f9fa);
    background-repeat: no-repeat;
    background-size: 273px 100%;
    background-position: left center;
}

.divorce-type--dui .divorce-type__table tbody td {
    font-weight: 500;
}

/* 강조 행(0.2% 이상) : 버건디(#601a18) → 딥틸(#226d77) */
.divorce-type--dui .divorce-type__table .is-highlight th,
.divorce-type--dui .divorce-type__table .is-highlight td {
    color: #226d77;
}

/* 강조 행(0.2% 이상) : 혈중농도 th + 형사처벌·면허처분 td 모두 볼드 (피그마 Bold) */
.divorce-type--dui .divorce-type__table .is-highlight th,
.divorce-type--dui .divorce-type__table .is-highlight td {
    font-weight: 700;
}
/* [혈중알코올농도별 처벌 기준표 영역] divorce-type--dui(3열 변형) 스타일 끝 */



/* [대응 방향 영역] dui-response 스타일 시작 */
.dui-response {
    width: 100%;
    padding: 120px 0 0;
    background-color: #fff;
}

.dui-response__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* list : 대응 방향 카드 2열 균등 (간격 15px) */
.dui-response__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
    margin-top: 40px;
}

/* card : 상단 딥틸 accent 라인 + 페일틸 박스 + 중앙 정렬 */
.dui-response__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 150px;
    padding: 30px;
    border-top: 2px solid #226d77;
    background-color: #f4f9fa;
    text-align: center;
}

/* title : 다크 잉크 20px, 화살표 이후 문구만 딥틸 볼드 강조 */
.dui-response__card-title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.4px;
    color: #231d16;
}

.dui-response__card-accent {
    font-weight: 700;
    color: #226d77;
}

/* desc : 다크 잉크 16px 본문 (강조 문장 볼드) */
.dui-response__card-desc {
    margin-top: 14px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

.dui-response__card-desc strong {
    font-weight: 700;
    color: #231d16;
}
/* [대응 방향 영역] dui-response 스타일 끝 */



/* [사례 흐름 영역] dui-case(상황 → 대응 → 결과) 스타일 시작 */
/* 3열 카드 사이에 베이지 원형 화살표 인디케이터 2개를 절대 배치 */
.dui-case {
    position: relative;
    margin-top: 50px;
}

.dui-case__flow {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 21px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* item : 라운드 카드 (기본 페일틸 · 중앙 정렬) */
.dui-case__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 138px;
    padding: 24px;
    border-radius: 8px;
    background-color: #f4f9fa;
    text-align: center;
}

/* item : 2번째(화신의 대응) — 톤 다운된 틸 박스 */
.dui-case__item:nth-child(2) {
    background-color: #e5f2f5;
}

/* item : 3번째(결과) — 딥틸 풀필 + 화이트 텍스트 */
.dui-case__item--result {
    background-color: #226d77;
}

.dui-case__label {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 19px;
    line-height: 24px;
    letter-spacing: -0.38px;
    color: #226d77;
}

.dui-case__item--result .dui-case__label {
    color: #e5f2f5;
}

.dui-case__desc {
    margin-top: 14px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.28px;
    color: #231d16;
}

.dui-case__item--result .dui-case__desc {
    font-weight: 700;
    font-size: 18px;
    line-height: 27px;
    letter-spacing: -0.37px;
    color: #fff;
}

/* arrow : 카드 사이 베이지 원형 인디케이터 (오른쪽 셰브론) */
.dui-case__arrow {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 37px;
    height: 37px;
    border-radius: 50%;
    background-color: #d5bb8f;
    transform: translateY(-50%);
}

.dui-case__arrow::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    border-top: 2px solid #231d16;
    border-right: 2px solid #231d16;
    transform: translate(-65%, -50%) rotate(45deg);
}

/* arrow : 1·2번 카드 경계 / 2·3번 카드 경계 중심 정렬 (컨테이너 폭 비례) */
.dui-case__arrow--first {
    left: calc(33.04% - 18.5px);
}

.dui-case__arrow--second {
    left: calc(66.96% - 18.5px);
}
/* [사례 흐름 영역] dui-case(상황 → 대응 → 결과) 스타일 끝 */



/* [자주 묻는 질문 - 음주운전 테마] FAQ 컬러 오버라이드는 공용 .criminal-faq 블록으로 통합 */



/* =========================================================================
 * 성범죄 서브 페이지(3_sub04) 전용 스타일
 * - 공용 블록(sec-head / divorce-faq 아코디언)은 레이아웃을 그대로 재사용하고,
 *   성범죄 테마(딥틸 #226d77 + 페일틸 #f4f9fa·#e5f2f5 + 서브라벨 #596c6f +
 *   베이지 #d5bb8f) 컬러 델타만 오버라이드
 * - 신규 섹션(criminal-response 초기대응 카드 3열 · criminal-stage 수사 단계표 ·
 *   criminal-case 상황→대응→결과 흐름)은 이 페이지 전용
 * - FAQ는 기존 .criminal-faq(고소대리 테마) 오버라이드를 공유 재사용
 * - 스코프: .sec-head--criminal / .criminal-response / .criminal-stage /
 *   .criminal-case 하위로 한정 → 이혼 계열 및 다른 형사 페이지에는 무영향
 * ========================================================================= */

/* [공통] 성범죄 페이지 서브헤더(라벨 + 타이틀) 컬러 오버라이드 시작 */
/* 라벨 : 골드(#988667) → 딥틸그레이(#596c6f) 15px 밑줄 */
.sec-head--criminal .sec-head__label {
    border-bottom-color: #596c6f;
    font-weight: 700;
    font-size: 15px;
    color: #596c6f;
}

/* 타이틀 : 다크 잉크(#231d16) 30px 2줄 */
.sec-head--criminal .sec-head__title {
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
    color: #231d16;
}
/* [공통] 성범죄 페이지 서브헤더(라벨 + 타이틀) 컬러 오버라이드 끝 */



/* [왜 초기 대응이 중요한가 영역] criminal-response 스타일 시작 */
.criminal-response {
    width: 100%;
    padding: 90px 0 0;
    background-color: #fff;
}

.criminal-response__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* list : 초기 대응 카드 3열 균등 (간격 15px) */
.criminal-response__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 15px;
    margin-top: 40px;
}

/* card : 상단 딥틸그레이 accent 라인 + 페일틸 박스 + 중앙 정렬 */
.criminal-response__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 190px;
    padding: 30px 0;
    border-top: 2px solid #596c6f;
    background-color: #f4f9fa;
    text-align: center;
}

/* title : 딥틸 20px */
.criminal-response__card-title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.4px;
    color: #226d77;
}

/* desc : 다크 잉크 16px 본문 */
.criminal-response__card-desc {
    margin-top: 15px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}
/* [왜 초기 대응이 중요한가 영역] criminal-response 스타일 끝 */



/* [수사 단계별 대응 전략 영역] criminal-stage 스타일 시작 */
.criminal-stage {
    width: 100%;
    padding: 40px 0 0;
    background-color: #fff;
}

.criminal-stage__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* head : 딥틸그레이 라벨형 소제목 (15px) */
.criminal-stage__title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: -0.3px;
    color: #596c6f;
}

/* table : 단계 안내표 (단계명 123 / 설명 1fr, 상단 딥틸그레이 하이라인) */
.criminal-stage__table-wrap {
    margin-top: 14px;
    border-top: 1px solid #596c6f;
}

.criminal-stage__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

/* caption 숨김 (스크린리더 전용) */
.criminal-stage__table caption {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.criminal-stage__table .col-stage { width: 123px; }

.criminal-stage__table th,
.criminal-stage__table td {
    text-align: left;
    vertical-align: middle;
}

/* 단계명칸 : 페일틸 풀필 셀 (행 높이 66px · 하단 웜그레이 구분선) */
.criminal-stage__step {
    height: 66px;
    padding-left: 22px;
    border-bottom: 1px solid #e5e3e0;
    background-color: #f4f9fa;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 설명칸 : 우측 본문 (좌측 라벨 박스와 30px 간격) */
.criminal-stage__desc {
    height: 66px;
    padding: 0 20px 0 30px;
    border-bottom: 1px solid #e5e3e0;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 마지막 행(재판) : 하단 구분선 없음 (피그마 기준) */
.criminal-stage__table tr:last-child .criminal-stage__step,
.criminal-stage__table tr:last-child .criminal-stage__desc {
    border-bottom: 0;
}

/* 강조 문구 : 딥틸 볼드 */
.criminal-stage__desc strong {
    font-weight: 700;
    color: #226d77;
    vertical-align: baseline;
}

/* 단계명 모바일 전용 줄바꿈 : PC 숨김(경찰 수사 · 검찰 단계는 한 줄) */
.criminal-stage .br-mo {
    display: none;
}
/* [수사 단계별 대응 전략 영역] criminal-stage 스타일 끝 */



/* [화신의 발빠른 대응사례 영역] criminal-case(상황 → 대응 → 결과) 스타일 시작 */
.criminal-case {
    width: 100%;
    padding: 120px 0 0;
    background-color: #fff;
}

.criminal-case__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* flow : 3열 카드 그리드 + 카드 경계에 화살표 인디케이터 2개 절대 배치 */
.criminal-case__flow {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 21px;
    margin-top: 40px;
}

/* card : 라운드 카드 (기본 페일틸 · 가로 중앙 / 세로 상단 정렬) */
.criminal-case__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: 138px;
    padding: 25px 20px;
    border-radius: 8px;
    background-color: #f4f9fa;
    text-align: center;
}

/* card : 화신의 대응 — 톤 다운된 틸 박스 */
.criminal-case__card--action {
    background-color: #e5f2f5;
}

/* card : 결과 — 딥틸 풀필 + 화이트 텍스트 */
.criminal-case__card--result {
    background-color: #226d77;
}

.criminal-case__card-head {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 19px;
    line-height: 24px;
    letter-spacing: -0.38px;
    color: #226d77;
}

.criminal-case__card--result .criminal-case__card-head {
    color: #e5f2f5;
}

.criminal-case__card-desc {
    margin-top: 15px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.28px;
    color: #231d16;
}

.criminal-case__card--result .criminal-case__card-desc {
    color: #fff;
}

/* desc : 결과 강조 문구 (22px 볼드) */
.criminal-case__card-desc--strong {
    font-weight: 700;
    font-size: 22px;
    line-height: 24px;
    letter-spacing: -0.44px;
}

/* arrow : 카드 사이 베이지 원형 인디케이터 (오른쪽 다크 셰브론) */
.criminal-case__arrow {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 37px;
    height: 37px;
    border-radius: 50%;
    background-color: #d5bb8f;
    transform: translateY(-50%);
}

.criminal-case__arrow::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 7px;
    height: 7px;
    border-top: 2px solid #231d16;
    border-right: 2px solid #231d16;
    transform: translate(-65%, -50%) rotate(45deg);
}

/* arrow : 1·2번 카드 경계 / 2·3번 카드 경계 중심 정렬 (컨테이너 폭 비례) */
.criminal-case__arrow--first {
    left: calc(33.16% - 18.5px);
}

.criminal-case__arrow--second {
    left: calc(67.19% - 18.5px);
}

/* 줄바꿈 : 모바일 전용 개행(br-mo)은 PC에서 숨김 (모바일 미디어쿼리에서 노출) */
.criminal-case .br-mo {
    display: none;
}
/* [화신의 발빠른 대응사례 영역] criminal-case(상황 → 대응 → 결과) 스타일 끝 */



/* =========================================================================
 * 사기죄 서브 페이지(3_sub05) 전용 스타일
 * - 공용 블록(sec-head / divorce-faq 아코디언)은 레이아웃을 그대로 재사용하고
 *   형사 테마(딥틸 #226d77 · 페일틸 #f4f9fa · 웜베이지 #f2f0eb ·
 *   서브라벨 #596c6f · 다크잉크 #231d16 · 네이비 #212c31) 컬러만 오버라이드
 * - 신규 섹션(fraud-strategy 피해자/피의자 전략 비교)은 이 페이지 전용
 * - 스코프: .fraud-strategy 하위로 한정 (FAQ는 공용 .criminal-faq 재사용)
 *   → 이혼 계열 및 다른 형사 페이지에는 무영향
 * ========================================================================= */

/* [피해자/피의자 전략 비교 영역] fraud-strategy 스타일 시작 */
.fraud-strategy {
    width: 100%;
    padding: 90px 0 0;
    background-color: #fff;
}

.fraud-strategy__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* head 오버라이드 : 라벨 골드→딥틸그레이 / 타이틀 다크잉크 30px */
.fraud-strategy .sec-head__label {
    border-bottom-color: #596c6f;
    font-weight: 700;
    font-size: 15px;
    color: #596c6f;
}

.fraud-strategy .sec-head__title {
    font-size: 30px;
    line-height: 42px;
    letter-spacing: -0.6px;
    color: #231d16;
}

/* groups : 피해자·피의자 두 그룹 세로 스택 (간격 40px) */
.fraud-strategy__groups {
    display: flex;
    flex-direction: column;
    row-gap: 40px;
    margin-top: 40px;
}

/* tag : 그룹 구분 pill 라벨 (175 x 43, 완전 라운드) */
.fraud-strategy__tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 43px;
    margin-bottom: 20px;
    padding: 0 23px;
    border-radius: 50px;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 15px;
    line-height: 1;
    letter-spacing: -0.3px;
    color: #fff;
    white-space: nowrap;
}

/* tag : 피해자 측 딥틸 / 피의자 측 네이비 */
.fraud-strategy__tag--victim {
    background-color: #226d77;
}

.fraud-strategy__tag--suspect {
    background-color: #212c31;
}

/* cards : 2열 균등 카드 (간격 15px) */
.fraud-strategy__cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
}

/* card : 상단 accent 라인 + 페일틸 박스 + 중앙 정렬 */
.fraud-strategy__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 149px;
    padding: 30px 40px;
    border-top: 2px solid #226d77;
    background-color: #f4f9fa;
    text-align: center;
}

/* card : 피의자 측 변형 (웜베이지 박스 + 네이비 accent) */
.fraud-strategy__card--suspect {
    border-top-color: #212c31;
    background-color: #f2f0eb;
}

/* title : 딥틸 20px (양측 공통) */
.fraud-strategy__card-title {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.4px;
    color: #226d77;
}

/* desc : 다크 잉크 16px 본문 */
.fraud-strategy__card-desc {
    margin-top: 10px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.32px;
    color: #231d16;
}

/* 줄바꿈 : 모바일 전용 개행(br-mo)은 PC에서 숨김 (모바일 미디어쿼리에서 노출) */
.fraud-strategy .br-mo {
    display: none;
}
/* [피해자/피의자 전략 비교 영역] fraud-strategy 스타일 끝 */



/* [자주 묻는 질문 - 사기죄 테마] FAQ 컬러 오버라이드는 공용 .criminal-faq 블록으로 통합 */



/* [전화 상담 유도 배너 영역] cta-call 스타일 시작 */
.cta-call {
    position: relative;
    width: 100%;
    height: 105px;
    background-color: #fff;
    overflow: hidden;
}

.cta-call::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0px;
    height: 90px;
    background-color: #212c31;
    z-index: 1;
}

.cta-call::after {
    content: '';
    position: absolute;
    left: calc(50% - 1178px);
    top: 0px;
    width: 1447.38px;
    height: 196.8px;
    background-color: #d5bb8f;
    clip-path: path('M1325.14 0C1335.74 0 1345.66 5.25 1351.61 14.02L1441.79 146.82C1456.22 168.07 1441.00 196.8 1415.32 196.8H32C14.33 196.8 0 182.47 0 164.8V32C0 14.33 14.33 0 32 0H1325.14Z');
    z-index: 2;
}

/* inner : 좌측 안내문구/전화번호 + 우측 CTA 양끝 배치 */
.cta-call__inner {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1340px;
    height: 100%;
    margin-inline: auto;
}

/* lead : 안내 문구 + 전화번호 (베이지 위, 다크 잉크) */
.cta-call__lead {
    display: flex;
    align-items: center;
    column-gap: 20px;
    padding-top: 10px;
}

.cta-call__text {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 25px;
    line-height: 41px;
    letter-spacing: -0.5px;
    color: #212c31;
    white-space: nowrap;
}

.cta-call__tel {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 39px;
    line-height: 51px;
    letter-spacing: -0.78px;
    color: #212c31;
    white-space: nowrap;
}

/* action : 우측 CTA (강조 문구 + 화살표, 다크 영역) */
.cta-call__action {
    display: inline-flex;
    align-items: center;
    column-gap: 15px;
    padding-top: 18px;
}

.cta-call__action-text {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 30px;
    line-height: 1;
    color: #fff;
    white-space: nowrap;
}

/* 강조 : "무료" (골드, ExtraBold) */
.cta-call__highlight {
    font-weight: 800;
    color: #d5bb8f;
    vertical-align: baseline;
}

/* 우측 화살표 (→) */
.cta-call__arrow {
    position: relative;
    flex-shrink: 0;
    width: 30px;
    height: 30px;
}

.cta-call__arrow::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 3px;
    width: 21px;
    height: 2px;
    background-color: #fff;
    transform: translateY(-50%);
}

.cta-call__arrow::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 4px;
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(-50%) rotate(45deg);
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.cta-call .br-mo {
    display: none;
}
/* [전화 상담 유도 배너 영역] cta-call 스타일 끝 */



/* [전화 상담 유도 배너 - 색상 변형] cta-call 컬러 베리에이션 시작
   사용법 : <section class="cta-call cta-call--wine"> 처럼 모디파이어 클래스를 함께 부여.
   각 변형은 색상 관련 속성만 오버라이드하며, 레이아웃/도형은 기본 스타일을 그대로 사용한다. */

/* Version 1 : 버건디 배경 + 크림 패널 (메인 브랜드 톤) */
.cta-call--wine {
    background-color: #FBF9F4;
}

.cta-call--wine::before {
    background-color: #E0D5C3;   /* 다크바 : 버건디 */
}

.cta-call--wine::after {
    background-color: #961B1E;    /* 사선 패널 : 크림 골드 */
}

.cta-call--wine .cta-call__text,
.cta-call--wine .cta-call__tel {
    color: #fff;              /* 패널 위 텍스트 : 딥 버건디 잉크 */
}

.cta-call--wine .cta-call__action-text {
    color: #000;                 /* 버건디바 위 CTA : 화이트 */
}

.cta-call--wine .cta-call__highlight {
    color: #961B1E;              /* 강조 "무료" : 크림 골드 */
}

.cta-call--wine .cta-call__arrow::before {
    background-color: #000;
}

.cta-call--wine .cta-call__arrow::after {
    border-top-color: #000;
    border-right-color: #000;
}

/* Version 2 : 딥 틸그린 배경 + 베이지 패널 (형사 테마 톤) */
.cta-call--forest::before {
    background-color: #1f4a4f;   /* 다크바 : 딥 틸그린 */
}

.cta-call--forest::after {
    background-color: #d5bb8f;    /* 사선 패널 : 베이지 골드 */
}

.cta-call--forest .cta-call__text,
.cta-call--forest .cta-call__tel {
    color: #17383c;              /* 패널 위 텍스트 : 딥 틸 잉크 */
}

.cta-call--forest .cta-call__action-text {
    color: #fff;                 /* 틸바 위 CTA : 화이트 */
}

.cta-call--forest .cta-call__highlight {
    color: #e6c88f;              /* 강조 "무료" : 베이지 골드 */
}

.cta-call--forest .cta-call__arrow::before {
    background-color: #fff;
}

.cta-call--forest .cta-call__arrow::after {
    border-top-color: #fff;
    border-right-color: #fff;
}

/**/
.cta-call--white {
    background: #FBF9F4;
}

/* [전화 상담 유도 배너 - 색상 변형] cta-call 컬러 베리에이션 끝 */



/* =========================================================================
   5_sub01 상담안내 페이지 (PC)
   ========================================================================= */
   
.sub-main--consultation {
    background-color: #1b2529;
}

/* [상담 히어로 영역] consult-hero 스타일 시작 */
.consult-hero {
    position: relative;
    width: 100%;
    min-height: 720px;
    background-color: #1b2529;
    overflow: hidden;
}

.consult-hero__inner {
    position: relative;
    max-width: 1440px;
    min-height: 720px;
    margin-inline: auto;
}

/* 비주얼 : 법봉·저울 벡터 (사용자 삽입, 텍스트 뒤 중앙 배치) */
.consult-hero__visual {
    position: absolute;
    left: 50%;
    top: 122px;
    transform: translateX(-50%);
    z-index: 1;
    width: 910px;
    max-width: 100%;
    pointer-events: none;
}

.consult-hero__img {
    display: block;
    width: 100%;
    height: auto;
}

/* 텍스트 : 비주얼 하단에 겹쳐 중앙 정렬 */
.consult-hero__text {
    position: absolute;
    left: 0;
    right: 0;
    top: 283px;
    z-index: 2;
    text-align: center;
}

.consult-hero__title {
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 40px;
    line-height: 60px;
    letter-spacing: -2.4px;
    color: #fff;
}

.consult-hero__desc {
    margin-top: 29px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 25px;
    line-height: 44px;
    letter-spacing: -0.5px;
    color: #e0d5c3;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.consult-hero .br-mo {
    display: none;
}
/* [상담 히어로 영역] consult-hero 스타일 끝 */



/* [상담 신청 영역] consult-apply 스타일 시작
   피그마 PC 스펙(Frame 1330×796) 기준. 좌측 다크 폼 패널 + 우측 베이지 안내 정보.
   메인 페이지 .contact 폼과 톤·사이즈를 맞추되, 섹션 전반은 축소 스케일 적용 */
.consult-apply {
    position: relative;
    width: 100%;
    background-color: #e4d9c5; /* 우측 정보 패널(베이지) full-bleed 배경 */
    overflow: hidden;
    padding-left: 140px;
}

/* 좌측 폼 패널(다크) full-bleed : 경계선을 중앙 기준 -212px 앵커링해 폭이 변해도 콘텐츠와 정렬 유지 */
.consult-apply::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: calc(50% - 212px);
    background-color: #203038;
    z-index: 1;
}

.consult-apply__inner {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1330px;
    min-height: 860px;
    margin-inline: auto;
    padding-top: 90px;
    padding-bottom: 90px;
}

/* 좌측 : 폼 패널 (피그마 입력필드 폭 611px 기준) */
.consult-apply__form-panel {
    flex: 0 0 611px;
    min-width: 0; /* 내부 flex 자식(연락처 input)의 고유폭이 패널을 밀어내지 않도록 */
}

.consult-apply__eyebrow {
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 23px;
    line-height: 1.6;
    letter-spacing: -0.23px;
    color: #d5bb8f;
}

.consult-apply__title {
    margin-top: 8px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 40px;
    line-height: 1.4;
    letter-spacing: -2px;
    color: #fff;
}

/* form : 세로 스택 */
.consult-form {
    margin-top: 56px;
}

.consult-form__field {
    display: flex;
    flex-direction: column;
    margin-top: 28px;
}

.consult-form__field:first-child {
    margin-top: 0;
}

.consult-form__row {
    display: flex;
    column-gap: 23px;
    margin-top: 28px;
}

.consult-form__row .consult-form__field {
    margin-top: 0;
}

.consult-form__field--half {
    flex: 1 1 0;
}

/* label : 흰색 세미볼드 + 필수(*) 골드 */
.consult-form__label {
    display: inline-block;
    margin-bottom: 12px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 16px;
    letter-spacing: -0.32px;
    color: #fff;
}

.consult-form__req {
    margin-left: 2px;
    font-size: 10px;
    vertical-align: top;
    color: #d5bb8f;
}

/* 공통 입력 필드 (다크 반투명 · 라이트 텍스트) */
.consult-form__input {
    box-sizing: border-box; /* reset 목록에 input/textarea 미포함 → 패딩으로 폭 초과(뚫림) 방지 */
    width: 100%;
    height: 45px;
    padding: 0 16px;
    border: 0;
    border-radius: 9px;
    background-color: rgba(52, 67, 74, 0.9);
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 18px;
    letter-spacing: -0.36px;
    color: #fff;
}

.consult-form__input::placeholder {
    color: #667378;
}

.consult-form__textarea {
    height: 121px;
    padding: 14px 16px;
    line-height: 1.5;
    resize: none;
}

/* 연락처 : 3분할 + 구분선 */
.consult-form__tel {
    display: flex;
    align-items: center;
    column-gap: 14px;
}

.consult-form__input--tel {
    flex: 1 1 0;
    width: auto;
    min-width: 0; /* input 고유폭 무시하고 3분할 균등 축소 (메인 .contact__input--phone 동일) */
    text-align: center;
}

.consult-form__tel-dash {
    flex: 0 0 14px;
    height: 2px;
    background-color: rgba(255, 255, 255, 0.3);
}

/* 커스텀 셀렉트 : 메인(.contact) 셀렉트와 동일한 구조·동작, 색상만 다크 톤으로 재정의 */
.consult-form .consult-select {
    position: relative;
    width: 100%;
}

/* 닫힘 상태: 인풋과 동일한 다크 반투명 필드 */
.consult-form .consult-select__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    height: 45px;
    padding: 0 16px;
    border: 0;
    border-radius: 9px;
    background-color: rgba(52, 67, 74, 0.9);
    cursor: pointer;
}

.consult-form .consult-select__value {
    overflow: hidden;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 18px;
    letter-spacing: -0.36px;
    color: #fff;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.consult-form .consult-select__value[data-placeholder] {
    font-weight: 300;
    color: #667378;
}

/* 화살표(∨): 열림 시 180° 회전 (메인 동일) */
.consult-form .consult-select__arrow {
    position: relative;
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    transition: transform 0.2s ease;
}

.consult-form .consult-select__arrow::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 35%;
    width: 8px;
    height: 8px;
    border-right: 1.5px solid #d5bb8f;
    border-bottom: 1.5px solid #d5bb8f;
    transform: translate(-50%, -50%) rotate(45deg);
}

.consult-form .consult-select__toggle[aria-expanded="true"] .consult-select__arrow {
    transform: rotate(180deg);
}

/* 기본 .consult-select 의 ::after 회전 오버라이드 방지 (화살표 컨테이너만 회전) */
.consult-form .consult-select__toggle[aria-expanded="true"] .consult-select__arrow::after {
    transform: translate(-50%, -50%) rotate(45deg);
}

/* 옵션 리스트(열림 상태): 필드 하단에 부착 (메인 동일, 다크 배경) */
.consult-form .consult-select__options {
    position: absolute;
    left: 0;
    top: calc(100% + 4px);
    z-index: 10;
    width: 100%;
    max-height: 264px; /* 약 6행 노출 후 스크롤 */
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    border-radius: 9px;
    background-color: #34434a;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
}

/* 옵션 행: 기본 연회색, hover·선택 시 골드 틴트 배경 + 흰 글자(SemiBold) */
.consult-form .consult-select__option {
    display: flex;
    align-items: center;
    height: 44px;
    padding: 0 16px;
    font-family: 'pretendard';
    font-weight: 300;
    font-size: 18px;
    letter-spacing: -0.36px;
    color: rgba(255, 255, 255, 0.65);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.consult-form .consult-select__option:hover,
.consult-form .consult-select__option:focus,
.consult-form .consult-select__option[aria-selected="true"] {
    background-color: rgba(213, 187, 143, 0.14);
    font-weight: 600;
    color: #fff;
}

/* 개인정보 동의 */
.consult-form__agree {
    display: flex;
    align-items: center;
    column-gap: 10px;
    margin-top: 40px;
}

.consult-form__check {
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    accent-color: #d5bb8f;
    cursor: pointer;
}

.consult-form__agree-label {
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 16px;
    letter-spacing: -0.32px;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
}

/* 제출 버튼 : 골드 알약형 + 우측 화살표 (hover 시 배경색만 전환) */
.consult-form__submit {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 20px;
    width: 262px;
    margin-top: 32px;
    padding: 20px 32px;
    border: 0;
    border-radius: 110px;
    background-color: #d5bb8f;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.consult-form__submit:hover,
.consult-form__submit:focus-visible {
    background-color: #c4a06a;
}

.consult-form__submit-text {
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 18px;
    line-height: 1;
    color: #203038;
}

.consult-form__submit-arrow {
    position: relative;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}

.consult-form__submit-arrow::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 2px;
    width: 17px;
    height: 2px;
    background-color: #203038;
    transform: translateY(-50%);
}

.consult-form__submit-arrow::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 3px;
    width: 9px;
    height: 9px;
    border-top: 2px solid #203038;
    border-right: 2px solid #203038;
    transform: translateY(-50%) rotate(45deg);
}

/* 우측 : 안내 정보(베이지 위 · 라벨은 청록 / 값은 다크 잉크) */
.consult-apply__info {
    flex: 0 0 416px;
    padding-top: 143px;
    color: #212c31;
}

.consult-info__item + .consult-info__item {
    margin-top: 92px;
}

.consult-info__label {
    display: flex;
    align-items: center;
    column-gap: 10px;
    font-family: 'pretendard';
    font-weight: 700;
    font-size: 22px;
    letter-spacing: -1.1px;
    color: #2e5b61;
}

.consult-info__value {
    margin-top: 30px;
    padding-left: 34px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 34px;
    line-height: 1;
    letter-spacing: -0.68px;
    color: #212c31;
}

.consult-info__value--tel {
    font-weight: 700;
    font-size: 42px;
    letter-spacing: -0.84px;
}

.consult-info__value--addr {
    margin-top: 28px;
    font-weight: 600;
    font-size: 25px;
    line-height: 1.44;
    letter-spacing: -0.5px;
}

.consult-info__tel {
    font-size: 42px;
    font-weight: 700;
    color: inherit;
}

.consult-info__note {
    margin-top: 18px;
    padding-left: 34px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 22px;
    line-height: 36px;
    letter-spacing: -0.4px;
    color: #212C31;
}

/* 안내 아이콘 (24px · 실제 SVG 에셋 · mask 로 청록 #2e5b61 재색상) */
.consult-info__icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    background-color: #2e5b61;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 20px auto; /* 24px 프레임 내 20px 글리프(피그마 8.33% 여백) */
    mask-size: 20px auto;
}

.consult-info__icon--clock {
    -webkit-mask-image: url(../images/sub01/ico_location_clock.svg);
    mask-image: url(../images/sub01/ico_location_clock.svg);
}

.consult-info__icon--call {
    -webkit-mask-image: url(../images/sub01/ico_location_call.svg);
    mask-image: url(../images/sub01/ico_location_call.svg);
}

.consult-info__icon--map {
    -webkit-mask-image: url(../images/sub01/ico_location_map.svg);
    mask-image: url(../images/sub01/ico_location_map.svg);
}

/* 모바일 전용 요소는 PC 에서 숨김 (안내 제목 / 제출버튼 '동의하고' 접두 / 개행) */
.consult-apply__info-title {
    display: none;
}

.consult-form__submit-pre {
    display: none;
}

.consult-apply .br-mo {
    display: none;
}
/* [상담 신청 영역] consult-apply 스타일 끝 */



/* [상담 FAQ 영역] consult-faq 스타일 시작
   레이아웃·아코디언 동작은 .divorce-faq 기본 스타일을 재사용하고,
   피그마(축소본) 기준으로 단일 컬럼(헤더 → 아코디언 → 전문센터 배너)으로 배치 */
   .consult-faq {
    background-color: #FBF9F4;
}

/* inner : 헤더 · 아코디언 · 배너를 세로로 쌓는 단일 컬럼 컨테이너 */
.consult-faq__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* head : 아코디언 위 헤더 블록(간격 78px) */
.consult-faq__head {
    margin-bottom: 78px;
}

.consult-faq .sec-head__label {
    padding-bottom: 0;
    border-bottom: 0;
    font-family: 'noto-serif-kr';
    font-weight: 600;
    font-size: 15px;
    line-height: 34px;
    letter-spacing: 0;
    color: #917657;
}

.consult-faq .sec-head__title {
    margin-top: 22px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 38px;
    line-height: 53px;
    letter-spacing: -2.3px;
    color: #0f0f0f;
}

.consult-faq__desc {
    margin-top: 23px;
    font-family: 'pretendard';
    font-weight: 500;
    font-size: 21px;
    line-height: 35px;
    letter-spacing: -0.2px;
    color: #917657;
}

/* list : 아코디언(전폭) */
.consult-faq__list {
    width: 100%;
}

.consult-faq .divorce-faq__item {
    border-top-color: #e2e2e2;
}

/* 첫 항목 상단선만 피그마 기준 골드(#917657) 1px */
.consult-faq .divorce-faq__item:first-child {
    border-top: 1px solid #917657;
}

.consult-faq .divorce-faq__item:last-child {
    border-bottom-color: #e2e2e2;
}

.consult-faq .divorce-faq__trigger {
    padding: 38px 16px;
}

.consult-faq .divorce-faq__panel {
    padding: 0 16px;
}

.consult-faq .divorce-faq__q-text {
    font-size: 22px;
    line-height: 28px;
    letter-spacing: -0.8px;
    color: #0f0f0f;
}

.consult-faq .divorce-faq__answer {
    padding-bottom: 38px;
    font-size: 15px;
    line-height: 25px;
    letter-spacing: -0.1px;
    color: #0f0f0f;
}

.consult-faq .divorce-faq__item.is-active .divorce-faq__trigger {
    padding-bottom: 22px;
}

/* icon : 토글(+/−) 축소(17px) */
.consult-faq .divorce-faq__icon {
    width: 17px;
    height: 17px;
}

.consult-faq .divorce-faq__icon::before {
    width: 17px;
}

.consult-faq .divorce-faq__icon::after {
    height: 17px;
}

.consult-faq .divorce-faq__icon::before,
.consult-faq .divorce-faq__icon::after {
    background-color: #0f0f0f;
}

/* centers : 하단 전문센터 배너(피그마 축소본 · 좌/우 컬러 패널 + 중앙 이미지)
   메인 .centers 구조를 참고하되 축소 수치(높이 160 / 패널 423 등)로 적용 */
.consult-centers {
    margin-top: 78px;
}

.consult-centers__row {
    display: flex;
    height: 160px;
}

/* 좌/우 컬러 패널: 타이틀 + 설명 + 원형 화살표 버튼 */
.consult-centers__panel {
    position: relative;
    flex: 0 0 423px;
    width: 423px;
    box-sizing: border-box;
    padding: 43px 0 0 53px;
    color: #fff;
}

.consult-centers__panel--divorce {
    background-color: #601a18;
}

.consult-centers__panel--criminal {
    flex: 0 0 422px;
    width: 422px;
    background-color: #293b43;
}

.consult-centers__title {
    margin-bottom: 14px;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 21px;
    line-height: 1;
    color: #fff;
}

.consult-centers__desc {
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 12px;
    line-height: 21px;
    color: #fff;
}

/* 원형 화살표 버튼: 좌/우 패널 내 배치 위치가 서로 달라 개별 지정 */
.consult-centers__btn {
    position: absolute;
    top: 83px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 6px;
    border: 0.5px solid #d5bb8f;
    border-radius: 50%;
}

.consult-centers__panel--divorce .consult-centers__btn {
    left: 352px;
}

.consult-centers__panel--criminal .consult-centers__btn {
    left: 322px;
}

.consult-centers__btn img {
    display: block;
    width: 23px;
    height: 23px;
    filter: brightness(0) saturate(100%) invert(77%) sepia(21%) saturate(958%) hue-rotate(345deg) brightness(91%) contrast(89%);
}

/* 중앙 이미지 */
.consult-centers__picture {
    flex: 1 1 auto;
    height: 160px;
}

.consult-centers__picture img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 줄바꿈 : PC 기본은 모바일 전용 br 숨김 (타이틀/설명 2줄 처리는 모바일에서만) */
.consult-faq .br-mo {
    display: none;
}
/* [상담 FAQ 영역] consult-faq 스타일 끝 */



/* [함께 짚어야 할 것 슬라이더 영역] related-topic 스타일 시작 */
/* 아이보리 섹션 위 카드 5장 무한 캐러셀 : 한 화면 2장 노출·1장씩 자동 롤링 + dot 5개 */
.related-topic {
    width: 100%;
    padding: 60px 0 85px;
    background-color: #f2f0eb;
}

.related-topic__inner {
    max-width: 1200px;
    margin-inline: auto;
}

/* head : 중앙 정렬 타이틀 (버건디 30px) — 공용 sec-head__title 값 오버라이드 */
.related-topic__head {
    text-align: center;
}

.related-topic__title {
    margin-top: 0;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 30px;
    line-height: 50px;
    letter-spacing: -0.6px;
    color: #961b1e;
}

/* slider : 뷰포트 + 좌우 컨트롤 + 인디케이터 배치 컨텍스트 */
.related-topic__slider {
    position: relative;
    margin-top: 38px;
}

/* viewport : 슬라이드 트랙 클리핑 영역 */
.related-topic__viewport {
    overflow: hidden;
}

.related-topic__track {
    display: flex;
    column-gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* slide : 카드 1장 = 뷰포트 절반 폭(간격 18px 반영) → 한 화면에 2장 노출, 1장씩 이동 */
.related-topic__slide {
    flex: 0 0 calc((100% - 18px) / 2);
}

/* card : 배경 이미지 + 좌측 다크 그라디언트 오버레이 (카드 전체가 링크, 591 x 180) */
.topic-card {
    position: relative;
    display: block;
    height: 180px;
    padding: 57px 29px 0;
    border-radius: 17px;
    overflow: hidden;
}

.topic-card__thumb {
    position: absolute;
    inset: 0;
    z-index: 1;
}

/* 반응형 <picture> 래퍼가 썸네일 영역을 그대로 채우도록 (모바일 전용 이미지 교체용) */
.topic-card__thumb picture {
    display: block;
    width: 100%;
    height: 100%;
}

.topic-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.topic-card:hover .topic-card__image {
    transform: scale(1.04);
}

/* card : 좌측이 진한 좌→우 그라디언트 (텍스트 가독성 확보) */
.topic-card__thumb::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, rgba(35, 29, 22, 0.9) 0%, rgba(35, 29, 22, 0) 100%);
}

/* card : 텍스트 콘텐츠 (오버레이 위) */
.topic-card__body {
    position: relative;
    z-index: 2;
}

.topic-card__title {
    display: block;
    font-family: 'pretendard';
    font-weight: 600;
    font-size: 29px;
    line-height: 35px;
    letter-spacing: -1.46px;
    color: #fff;
}

.topic-card__desc {
    display: block;
    margin-top: 14px;
    font-family: 'pretendard';
    font-weight: 400;
    font-size: 14px;
    line-height: 25px;
    letter-spacing: -0.14px;
    color: #fff;
}

/* card : 우측 하단 원형 화살표(↗) CTA (47 x 47 버건디 원 + SVG 아이콘) */
.topic-card__arrow {
    position: absolute;
    right: 29px;
    bottom: 24px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 47px;
    height: 47px;
    border-radius: 50%;
    background-color: #961b1e;
    transition: background-color 0.2s ease;
}

.topic-card:hover .topic-card__arrow {
    background-color: #7d1416;
}

.topic-card__arrow img {
    display: block;
    width: 20px;
    height: 20px;
}

/* indicator : 하단 중앙 dot 4개 (활성 : 버건디 pill) */
.related-topic__indicator {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 9px;
    margin-top: 41px;
}

.related-topic__dot {
    width: 7px;
    height: 7px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background-color: #d9d3c7;
    cursor: pointer;
    transition: width 0.25s ease, background-color 0.25s ease;
}

.related-topic__dot.is-active {
    width: 25px;
    background-color: #961b1e;
}

/* 줄바꿈: 모바일 전용 br 은 PC 에서 숨김 (모바일 미디어쿼리에서 노출) */
.related-topic .br-mo {
    display: none;
}
/* [함께 짚어야 할 것 슬라이더 영역] related-topic 스타일 끝 */



/* ============================================================
   반응형 미디어 쿼리
   ============================================================ */

/* ===================== 태블릿 (max-width: 1024px) ===================== */
@media (max-width: 1024px) {
    /* [상단 영역] visual 태블릿 스타일 시작 */
    .visual__figure img {
        max-width: 600px;
    }

    .visual__gradient {
        top: 30px;
    }

    .visual__title {
        font-size: 34px;
        line-height: 52px;
    }

    .visual__desc {
        margin-top: 24px;
        font-size: 22px;
        line-height: 36px;
    }
    /* [상단 영역] visual 태블릿 스타일 끝 */

    /* [About 영역] about 태블릿 스타일 시작 */
    .about {
        padding: 90px 0 110px;
    }

    .about__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .about__title {
        font-size: 34px;
        line-height: 48px;
        letter-spacing: -1.7px;
    }

    .about__list {
        margin-top: 70px;
    }

    .about__heading {
        font-size: 22px;
        line-height: 28px;
    }
    /* [About 영역] about 태블릿 스타일 끝 */

    /* [강조 문구 영역] motto 태블릿 스타일 시작 */
    .motto__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .motto__text {
        font-size: 26px;
        line-height: 44px;
    }
    /* [강조 문구 영역] motto 태블릿 스타일 끝 */

    /* [변호사 소개 영역] attorney-intro 태블릿 스타일 시작 */
    .attorney-intro {
        padding: 80px 0 140px;
    }

    .attorney-intro__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    /* 카드: PC 가로 절대배치 → 세로 스택 (사진 상단 / 텍스트 하단)
       PC 는 좌우 절대배치라 980px 미만에서 사진이 잘리므로 태블릿부터 스택으로 전환 */
    .attorney-card {
        display: flex;
        flex-direction: column;
        height: auto;
        border-radius: 30px;
    }

    /* media(사진 + 장식 + 영문명) 블록을 상단으로 이동 */
    .attorney-card__media {
        order: -1;
        position: relative;
        inset: auto;
        height: 360px;
    }

    .attorney-card__photo {
        left: 50%;
        top: 30px;
        transform: translateX(-50%);
    }

    .attorney-card--primary .attorney-card__photo {
        left: 50%;
        top: 30px;
        width: 199px;
        height: 310px;
        transform: translateX(-50%);
    }

    .attorney-card--secondary .attorney-card__photo {
        left: 50%;
        top: 30px;
        width: 296px;
        height: 318px;
    }

    .attorney-card__deco {
        transform: translateX(-50%);
    }

    .attorney-card--primary .attorney-card__deco {
        left: 50%;
        top: 24px;
        width: 211px;
        height: 211px;
    }

    .attorney-card--secondary .attorney-card__deco {
        left: calc(50% - 150px);
        top: 96px;
        width: 94px;
        height: 181px;
        transform: none;
    }

    /* 영문명: 사진 하단에 겹침 (primary 는 중앙 정렬) */
    .attorney-card__eng-name {
        left: 50%;
        top: 262px;
        transform: translateX(-50%);
        text-align: center;
    }

    /* 구성원(secondary) 영문명: 좌측 정렬 (텍스트 컬럼과 정렬), 색상은 PC 그라데이션 유지 */
    .attorney-card--secondary .attorney-card__eng-name {
        left: 25px;
        transform: none;
        text-align: left;
    }

    /* content: 하단 풀폭 좌측 정렬 */
    .attorney-card__content {
        max-width: 100%;
        padding: 24px 25px 30px;
    }

    /* headline: PC 세로 배치용 상단 여백 초기화 */
    .attorney-card--primary .attorney-card__headline,
    .attorney-card--secondary .attorney-card__headline {
        margin-top: 28px;
    }

    /* 구성원(secondary) 이름 · 헤드라인 · 설명은 검정 (position · badge 는 버건디 유지) */
    .attorney-card--secondary .attorney-card__name,
    .attorney-card--secondary .attorney-card__headline,
    .attorney-card--secondary .attorney-card__desc {
        color: #0f0f0f;
    }

    /* 대표(primary) 자격 배지: 풀폭 세로 스택 */
    .attorney-card--primary .attorney-card__badges {
        flex-direction: column;
        row-gap: 10px;
    }

    .attorney-card--primary .attorney-card__badge {
        width: 100%;
    }

    /* 워터마크 축소 */
    .attorney-intro__watermark {
        right: 0;
        font-size: 48px;
    }
    /* [변호사 소개 영역] attorney-intro 태블릿 스타일 끝 */

    /* [상담 플로팅 CTA] consult-fab 모바일 스타일 시작 (Figma 390 기준) */
    /* 모바일에서는 본문 인라인 상담 섹션 대신 하단 플로팅 CTA 를 사용
       (--members: 구성원/위치 페이지, --has-fab: FAB 를 추가한 그 외 페이지) */
    .consult-cta--members,
    .consult-cta--has-fab {
        display: none;
    }

    /* 하단 고정 바텀시트: 접힘=하단 quick-nav(64px) 위에 바만 노출, 펼침=quick-nav 자리까지 확장 */
    .consult-fab {
        display: block;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 65;                 /* quick-nav(60) 위, GNB 오버레이(100) 아래 */
        padding-bottom: 64px;        /* 아래 quick-nav 바 높이만큼 띄워 그 위에 표시 */
        pointer-events: none;        /* 투명 패딩 영역은 클릭 통과(아래 quick-nav 조작 허용) */
        /* consult-select(재사용) 가 참조하는 색상 변수 — .consult-cta 조상이 없으므로 여기서 정의 */
        --cta-arrow-color: #601a18;
        --cta-option-hover-bg: #f2ede3;
        --cta-option-hover-color: #601a18;
    }

    .consult-fab.is-open {
        padding-bottom: 0;           /* 펼치면 quick-nav 자리까지 차지 */
    }

    /* 실제 콘텐츠(바/패널)만 포인터 이벤트를 받는다 */
    .consult-fab__toggle,
    .consult-fab__panel {
        pointer-events: auto;
    }

    /* 접힘 바 = 피그마 node 5579 : 다크(#1b272d) 바(89px), 문구 "상담신청하기 →" 가운데 정렬.
       버건디 배너 + "지금 상담을 시작하세요" 는 펼침(.is-open)에서만 노출(node 5581 헤더).
       애니메이션 없이 즉시 전환한다. */
    .consult-fab__toggle {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;   /* 접힘 : 가운데 정렬 */
        width: 100%;
        height: 89px;
        padding: 0 20px;
        border: 0;
        background-color: #1b272d;
        cursor: pointer;
        overflow: hidden;
    }
    .consult-fab.is-open .consult-fab__toggle {
        background: none;
    }

    /* 펼침(헤더) : 좌측 정렬 + 다크 폼 위 배너 노출 높이 66px(피그마).
       SVG 배너는 128.8px 이지만 overflow:hidden 으로 이 높이만큼만 보인다. */
    .consult-fab.is-open .consult-fab__toggle {
        justify-content: flex-start;
        width: 400px;
        height: 66px;
    }

    /* 버건디 배너(Union SVG path) : 접힘엔 숨김, 펼침에만 표시.
       left:-95.38% / width:179.22% / height:128.805px = 피그마 좌표(left -372, w698.951,
       h128.805, 390 프레임)를 폭 비율로 옮긴 값 → 좌측 꽉 참 + 우상단 둥근 모서리 + 사선. */
    .consult-fab__toggle-shape {
        position: absolute;
        top: 0;
        left: -95.38%;
        width: 179.22%;
        height: 128.805px;
        display: none;
        pointer-events: none;
    }

    .consult-fab.is-open .consult-fab__toggle-shape {
        display: block;
    }

    /* 접힘 문구 : 상담신청하기 → (Bold, 흰색, 가운데) */
    .consult-fab__cta {
        position: relative;
        z-index: 1;
        display: inline-flex;
        align-items: center;
        column-gap: 10px;
    }

    .consult-fab.is-open .consult-fab__cta {
        display: none;
    }

    .consult-fab__cta-text {
        font-family: 'pretendard';
        font-weight: 700;
        font-size: 20px;
        letter-spacing: -0.4px;
        color: #fff;
    }

    .consult-fab__cta-arrow {
        position: relative;
        width: 22px;
        height: 22px;
    }

    .consult-fab__cta-arrow::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 1px;
        width: 15px;
        height: 2px;
        background-color: #fff;
        transform: translateY(-50%);
    }

    .consult-fab__cta-arrow::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 2px;
        width: 8px;
        height: 8px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        transform: translateY(-50%) rotate(45deg);
    }

    /* 펼침 헤더 문구 : 지금 상담을 시작하세요. (SemiBold, 흰색, 좌측) */
    .consult-fab__title {
        position: relative;
        z-index: 1;
        display: none;
        font-family: 'pretendard';
        font-weight: 600;
        font-size: 18px;
        letter-spacing: -0.44px;
        color: #fff;
    }

    .consult-fab.is-open .consult-fab__title {
        display: block;
    }

    /* 펼침 패널(폼) : 다크 배경. 애니메이션 없이 표시/숨김 */
    .consult-fab__panel {
        display: none;
        background-color: #1b272d;
    }

    .consult-fab.is-open .consult-fab__panel {
        display: block;
    }

    .consult-fab__form {
        display: flex;
        flex-direction: column;
        row-gap: 22px;
        padding: 33px 20px 26px;
    }

    .consult-fab__field {
        display: flex;
        align-items: center;
        column-gap: 14px;
    }

    .consult-fab__label {
        flex-shrink: 0;
        width: 80px;
        font-family: 'pretendard';
        font-weight: 600;
        font-size: 19px;
        letter-spacing: -0.38px;
        color: #aba195;
    }

    /* 셀렉트(재사용) · tel 인풋: 피그마(흰 알약, 높이 49) — 공용 베이스 위에 덮어쓴다 */
    .consult-fab .consult-select {
        flex: 1;
        width: auto;
    }

    .consult-fab .consult-select__toggle,
    .consult-fab__input {
        height: 49px;
        padding: 0 16px;
        border-radius: 9px;
        background-color: rgba(255, 255, 255, 0.92);
    }

    .consult-fab .consult-select__value {
        font-size: 18px;
    }

    .consult-fab__input {
        width: 100%;
        box-sizing: border-box;
        border: 0;
        font-family: 'pretendard';
        font-weight: 400;
        font-size: 18px;
        letter-spacing: -0.36px;
        color: #2b2b2b;
    }

    .consult-fab__input::placeholder {
        color: #aba195;
    }

    /* 상담신청 버튼 : 배경 없음(피그마 기준) — 흰색 굵은 텍스트 + 화살표, 우측 정렬 */
    .consult-fab__submit {
        align-self: flex-end;
        display: inline-flex;
        align-items: center;
        column-gap: 12px;
        margin-top: 6px;
        border: 0;
        background: none;
        cursor: pointer;
    }

    .consult-fab__submit-text {
        font-family: 'pretendard';
        font-weight: 700;
        font-size: 20px;
        letter-spacing: -0.4px;
        color: #fff;
        white-space: nowrap;
    }

    .consult-fab__submit-arrow {
        position: relative;
        flex-shrink: 0;
        width: 22px;
        height: 22px;
    }

    .consult-fab__submit-arrow::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 1px;
        width: 16px;
        height: 2px;
        background-color: #fff;
        transform: translateY(-50%);
    }

    .consult-fab__submit-arrow::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 2px;
        width: 8px;
        height: 8px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        transform: translateY(-50%) rotate(45deg);
    }

    /* 펼침 상태에서 하단 quick-nav 바를 감춘다 (애니메이션 없음) */
    body.consult-fab-open .quick-nav {
        display: none;
    }

    /* consult-fab 레드 테마(--red 페이지: 상간소송 등) : 구조는 동일, 색상만 교체
       다크(#1b272d)·버건디(#601a18) → 레드(#961b1e)·베이지(#E0D5C3)·다크 텍스트
       (배너 SVG fill 은 마크업 인라인에서 #961b1e 로 지정) */
    .consult-fab--red {
        --cta-arrow-color: #961b1e;
    }

    /* 접힘 바 : 다크 → 레드 (흰색 문구 유지) */
    .consult-fab--red .consult-fab__toggle {
        background-color: #961b1e;
    }

    /* 펼침 패널 : 다크 → 베이지 */
    .consult-fab--red .consult-fab__panel {
        background-color: #E0D5C3;
    }

    /* 라벨 : 뮤트 → 다크 (베이지 위 가독성) */
    .consult-fab--red .consult-fab__label {
        color: #231d16;
    }

    /* 상담신청 버튼 텍스트·화살표 : 흰색 → 다크 */
    .consult-fab--red .consult-fab__submit-text {
        color: #231d16;
    }

    .consult-fab--red .consult-fab__submit-arrow::before {
        background-color: #231d16;
    }

    .consult-fab--red .consult-fab__submit-arrow::after {
        border-color: #231d16;
    }

    /* consult-fab--inline (구성원 소개 · 오시는 길) : 다른 FAB 페이지와 달리 고정(fixed) 플로팅이
       아니라 일반 흐름에 놓인 정적 CTA. 버건디 배너 헤더('지금 상담을 시작하세요.') + 폼이
       항상 펼쳐져 있고 인터랙션(접힘/펼침)은 없다.
       (그 외 FAB 페이지는 기존 플로팅 '상담신청하기' 버튼 방식 그대로 유지) */

    /* CTA 를 고정(position:fixed) 해제하고 일반 문서 흐름에 배치한다.
       인터랙션 없이 항상 펼쳐진 정적 블록 — 하단 quick-nav 를 위한 패딩/pointer 도 해제.
       margin-top: 음수(-56px = 빨간 배너 높이)로 위 섹션에 배너만큼 겹쳐 올리고,
       position:relative + z-index 로 그 겹친 배너가 위 섹션 위에 그려지게 한다. */
    .consult-fab--inline {
        position: relative;
        z-index: 2;
        margin-top: -56px; /* 빨간 배너(토글 56px) 높이만큼 위로 */
        padding-bottom: 0;
        pointer-events: auto;
    }

    /* 토글 = 버건디 배너 헤더(좌측 정렬, 배경 투명). 배너 SVG(absolute)는 overflow:hidden 으로
       이 높이만큼만 노출된다. ※ .consult-fab--inline.consult-fab 로 특정성(0,3,0)을 확보해
       기본 `.consult-fab__toggle`(다크 바) 규칙을 확실히 덮어쓴다. */
    .consult-fab--inline.consult-fab .consult-fab__toggle {
        width: 350px;
        height: 56px;
        justify-content: flex-start;
        background: none;
        cursor: default; /* 더 이상 버튼이 아님(항상 열림) */
    }

    /* 버건디 배너(빨간 박스) 상시 노출 + 드롭섀도우로 페이지 배경에서 띄운다.
       비사각형 SVG 라 box-shadow 대신 filter:drop-shadow(도형 모양대로 그림자).
       토글이 66px 에서 overflow:hidden 으로 자르므로, 그림자를 페이지와 맞닿는
       우측 대각선 가장자리 쪽(우·하 방향)으로 보내 잘리지 않고 보이게 한다. */
    .consult-fab--inline .consult-fab__toggle-shape {
        display: block;
        filter: drop-shadow(2px 4px 7px rgba(0, 0, 0, 0.4));
    }

    /* 안내 문구 : 배너 위 상시 노출. .consult-fab--inline.consult-fab 로 특정성(0,3,0) 확보해
       기본 `.consult-fab__title{display:none}` 을 덮어쓴다. */
    .consult-fab--inline.consult-fab .consult-fab__title {
        display: block;
        text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45); /* 문구를 옅게 띄워 배경과 분리 */
    }

    /* 폼 패널 : 항상 펼쳐진 상태(인터랙션/슬라이드 없음) */
    .consult-fab--inline .consult-fab__panel {
        display: block;
        max-height: none;
        overflow: visible;
    }
    /* [상담 플로팅 CTA] consult-fab 모바일 스타일 끝 */

    /* [오시는 길 영역] location 태블릿 스타일 시작 */
    .location {
        padding: 90px 0 160px;
    }

    .location__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .location__title {
        font-size: 38px;
        line-height: 60px;
        letter-spacing: -2px;
    }

    .location__desc {
        margin-top: 40px;
        font-size: 22px;
        line-height: 38px;
    }

    .location__map iframe {
        height: 340px;
    }

    .location__info {
        column-gap: 30px;
        margin-top: 64px;
    }

    .location__tel {
        font-size: 34px;
    }
    /* [오시는 길 영역] location 태블릿 스타일 끝 */

    /* [이혼전문센터 인트로 영역] divorce-intro 태블릿 스타일 시작 */
    .divorce-intro {
        padding: 60px 0 50px;
    }

    .divorce-intro__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .divorce-intro__eyebrow {
        font-size: 34px;
    }

    .divorce-intro__lead {
        font-size: 22px;
        line-height: 34px;
    }

    .divorce-intro__title {
        font-size: 26px;
        line-height: 40px;
    }
    /* [이혼전문센터 인트로 영역] divorce-intro 태블릿 스타일 끝 */

    /* [왜 화신인가 영역] why-hwashin 태블릿 스타일 시작 */
    .why-hwashin {
        padding: 60px 0 70px;
    }

    /* 2단 유지하되 좌우 여백 축소 + 카드열을 가변폭으로 전환(700px 고정 → 축소 허용) */
    .why-hwashin__inner {
        max-width: 100%;
        padding-inline: 40px;
        column-gap: 40px;
    }

    .why-hwashin__cards {
        flex: 1 1 auto;
    }

    .why-hwashin__title {
        font-size: 26px;
        line-height: 40px;
    }
    /* [왜 화신인가 영역] why-hwashin 태블릿 스타일 끝 */

    /* [서비스 카드 슬라이더 영역] service-slider 태블릿 스타일 시작 */
    .service-slider {
        padding: 90px 0 140px;
    }

    /* inner 폭 해제 : 화면 폭에 맞춰 좌우 여백만 유지 */
    .service-slider__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .service-slider__title {
        font-size: 26px;
        line-height: 40px;
    }

    /* viewport : 좌측은 inner 여백(40px)에서 클립하고 우측만 화면 끝까지 확장한다.
       → 활성 카드 왼쪽엔 이전 카드가 보이지 않고, 우측에만 다음 카드가 잘려 노출된다. */
    .service-slider__viewport {
        margin-top: 40px;
        margin-right: -40px;
    }

    .service-slider__list {
        column-gap: 15px;
    }

    /* 카드폭 : 한 화면에 약 2.3장 노출(+ 우측 컷오프). JS 이동량은 offsetLeft 로 재계산됨 */
    .service-slider__slide {
        flex: 0 0 40vw;
    }

    /* 카드 높이 : 고정값 대신 비율 유지(388:576 ≈ 327:485) 로 폭에 따라 가변 */
    .service-card {
        height: auto;
        aspect-ratio: 327 / 485;
    }

    .service-slider__controls {
        margin-top: 32px;
    }
    /* [서비스 카드 슬라이더 영역] service-slider 태블릿 스타일 끝 */

    /* [전화 상담 유도 배너 영역] cta-call 태블릿 스타일 시작
       (≤1024 : PC 가로 1줄 배너가 폭 부족으로 깨지므로 세로 2단 적층 구조로 전환.
        변형 클래스(--wine/--forest 등)의 ::before/::after 배경색을 그대로 재활용해
        색상 하드코딩 없이 모든 페이지 대응) */
    .cta-call {
        height: auto;
        /* 레드 밴드 옆(우측 상단 삼각형)은 투명해야 하므로 변형 클래스의 배경색을 제거.
           (.cta-call 과 .cta-call--wine 은 동일 특정성이라 후순위인 이 규칙이 이김) */
        background-color: transparent;
        /* 위 섹션에 레드 밴드만큼 겹쳐 올린다 — 베이지(전화번호) 존이 원래 섹션 경계에서 시작.
           -122px = 베이지존(::before top) 위치. position:relative(기본) + z-index 로 위 섹션 위에 그려지게 한다. */
        margin-top: -122px;
        z-index: 1;
    }

    /* ::after → 상단 레드 블럭 : Figma 원본 Union path 를 mask 로 적용해
       좌측은 화면 밖으로 bleed(꽉 참), 우측 상단은 둥근 모서리 + 사선 처리.
       배경색은 변형 클래스(--wine 등)에서 상속 → 색상 시스템 유지 */
    .cta-call::after {
        left: 0;
        right: 0;
        top: 0;
        width: 100%;
        height: 140px;
        clip-path: none;
        -webkit-mask-image: url(../images/mobile/cta-call-shape.svg);
        mask-image: url(../images/mobile/cta-call-shape.svg);
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-size: 100% 100%;
        mask-size: 100% 100%;
        z-index: 0;                  /* 레드 밴드는 베이지 박스(::before) 뒤에 둔다 */
    }

    /* ::before → 베이지 존 : 전화번호/무료문구가 놓이는 하단 존만 채운다.
       top 을 레드 밴드 높이 부근으로 내려, 레드 밴드 옆(우측 상단 삼각형)은 투명하게 남긴다.
       (좌측은 레드 밴드가 top:0~밴드높이를 덮으므로 살짝 겹쳐 빈틈 없이 이어짐) */
    .cta-call::before {
        left: 0;
        right: 0;
        top: 92px;
        bottom: 0;
        height: auto;
        z-index: 1;                  /* 베이지 박스를 레드 밴드 위로 올려 깔끔한 상단 경계를 만든다 */
    }

    .cta-call__inner {
        flex-direction: column;
        align-items: stretch;
        max-width: 100%;
        height: auto;
        margin: 0;
    }

    /* lead : 안내문구(레드존) + 전화번호(베이지존) 세로 배치 */
    .cta-call__lead {
        flex-direction: column;
        align-items: stretch;
        column-gap: 0;
        padding-top: 0;
    }

    /* 안내 문구 : 상단 레드존, 좌측 정렬 / 자동 줄바꿈 허용
       height 는 레드 밴드(::after) 높이와 맞춰 전화번호가 그 아래에 오도록 함 */
    .cta-call__text {
        box-sizing: border-box;
        height: 100px;
        padding: 30px 40px 0;
        font-size: 26px;
        line-height: 38px;
        letter-spacing: -0.5px;
        white-space: normal;
        text-align: left;
    }

    /* 전화번호 : 하단 베이지존, 중앙 정렬 */
    .cta-call__tel {
        margin-top: 26px;
        font-size: 52px;
        line-height: 62px;
        letter-spacing: -1px;
        text-align: center;
        color: #fff;
    }
    
    .cta-call--wine .cta-call__tel{
        color: #961B1E;
    }

    /* action : 무료 문구 중앙 정렬, 화살표 숨김 */
    .cta-call__action {
        justify-content: center;
        column-gap: 0;
        padding-top: 0;
        margin-top: 14px;
        padding-bottom: 40px;
    }

    .cta-call__action-text {
        font-size: 30px;
        line-height: 1;
        text-align: center;
        white-space: normal;
    }

    .cta-call__arrow {
        display: none;
    }
    /* [전화 상담 유도 배너 영역] cta-call 태블릿 스타일 끝 */

    /* [이혼 카테고리 인트로 영역] divorce-topic 태블릿 스타일 시작 */
    .divorce-topic {
        padding: 60px 0 0;
    }

    /* inner : PC 고정폭(1200) → 유동폭 + 좌우 여백 */
    .divorce-topic__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    /* 히어로 배너 : 세로 비중 상향 */
    .divorce-topic__image {
        height: 320px;
    }

    .divorce-tab {
        margin-top: 36px;
    }

    /* 탭 : 5개 등간격 유지(1024 폭 내 수용), 고정폭 → 내용폭 + 여백 */
    .divorce-tab__item {
        width: auto;
        padding: 0 22px 14px;
    }

    /* 텍스트 : PC 고정높이(284) 해제 → 상하 여백으로 전환 */
    .divorce-topic__text {
        height: auto;
        padding: 44px 0 56px;
    }

    .divorce-topic__title {
        font-size: 26px;
        line-height: 40px;
    }

    .divorce-topic__desc {
        margin-top: 20px;
        font-size: 17px;
        line-height: 28px;
    }
    /* [이혼 카테고리 인트로 영역] divorce-topic 태블릿 스타일 끝 */

    /* [이혼의 종류 영역] divorce-type 태블릿 스타일 시작 */
    .divorce-type {
        padding-top: 60px;
    }

    .divorce-type__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .divorce-type .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }

    /* 4열 유지 · 고정 px 폭 → 가변(%) 로 완화하여 좁은 폭에서도 비율 유지 */
    .divorce-type__table .col-type { width: 14%; }
    .divorce-type__table .col-method { width: 26%; }
    .divorce-type__table .col-period { width: 24%; }

    .divorce-type__table th,
    .divorce-type__table td {
        padding-left: 16px;
    }
    /* [이혼의 종류 영역] divorce-type 태블릿 스타일 끝 */

    /* [친권·양육권 비교표 영역] divorce-type(3열 변형) 태블릿 스타일 시작 */
    /* 구분 열은 base 태블릿(.col-type 14%) 상속 · 고정 413px 였던 '이혼 후 귀속' 열만 가변(%)로 완화하여 좁은 폭에서도 정의 열이 눌리지 않도록 조정 */
    .divorce-type__table:has(.col-belong) .col-belong { width: 38%; }
    /* [친권·양육권 비교표 영역] divorce-type(3열 변형) 태블릿 스타일 끝 */

    /* [혈중알코올농도별 처벌 기준표 영역] divorce-type--dui 태블릿 스타일 시작 */
    /* 고정 px 폭(혈중농도 310 / 형사처벌 680)은 좁은 폭에서 넘치므로 가변(%)로 완화 · 본문 20→18px 축소 */
    .divorce-type--dui .divorce-type__table .col-level    { width: 26%; }
    .divorce-type--dui .divorce-type__table .col-criminal { width: 46%; }

    .divorce-type--dui .divorce-type__table tbody th,
    .divorce-type--dui .divorce-type__table tbody td {
        font-size: 18px;
        line-height: 22px;
    }

    /* 첫 컬럼(혈중농도) 인셋 축소 · 페일틸 박스는 컬럼 폭에 맞춰 가변 */
    .divorce-type--dui .divorce-type__table thead th:first-child,
    .divorce-type--dui .divorce-type__table tbody th {
        padding-left: 20px;
    }

    .divorce-type--dui .divorce-type__table tbody th {
        background-size: calc(100% - 16px) 100%;
    }
    /* [혈중알코올농도별 처벌 기준표 영역] divorce-type--dui 태블릿 스타일 끝 */

    /* [대응 방향/사례 흐름 영역] dui-response·dui-case 태블릿 스타일 시작 */
    /* PC 2열 카드 · 3열 사례 흐름 레이아웃은 유지하되, 컨테이너(1200 고정)만 가변으로 완화하고 좌우 여백 확보 */
    .dui-response {
        padding-top: 90px;
    }

    .dui-response__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    /* 사례 흐름 3열 간격·패딩 축소(좁은 폭에서 카드가 눌리지 않도록) · 화살표는 %기준이라 자동 정렬 */
    .dui-case__flow {
        column-gap: 14px;
    }

    .dui-case__item {
        padding: 20px 16px;
    }
    /* [대응 방향/사례 흐름 영역] dui-response·dui-case 태블릿 스타일 끝 */

    /* [재판상 이혼 사유 영역] divorce-reason 태블릿 스타일 시작 */
    .divorce-reason {
        padding-top: 90px;
    }

    .divorce-topic + .divorce-reason {
        padding-top: 70px;
    }

    .divorce-reason__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .divorce-reason .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }

    /* 3열 유지 · 간격/패딩 축소로 좁은 폭 대응 (슬라이드 아님) */
    .divorce-reason__list {
        column-gap: 12px;
        margin-top: 32px;
    }

    .divorce-reason__card {
        min-height: 180px;
        padding: 28px 16px;
    }
    /* [재판상 이혼 사유 영역] divorce-reason 태블릿 스타일 끝 */

    /* [위자료 산정 기준 영역] alimony-standard 태블릿 스타일 시작 */
    .alimony-standard {
        padding-top: 90px;
    }

    .alimony-standard__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .alimony-standard .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }

    /* list : 4열 → 2×2 그리드 (좁은 폭에서 라벨 줄바꿈 방지, 슬라이드 아님) */
    .alimony-standard__list {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 16px;
        row-gap: 32px; /* 상단 걸침 넘버 뱃지 공간 확보 */
        margin-top: 44px;
    }
    /* [위자료 산정 기준 영역] alimony-standard 태블릿 스타일 끝 */

    /* [자주 묻는 질문 영역] divorce-faq 태블릿 스타일 시작 */
    .divorce-faq {
        padding: 90px 0 180px;
    }

    /* inner : 좌측 헤더 + 우측 아코디언 2단 유지, 폭만 유연화 */
    .divorce-faq__inner {
        max-width: 100%;
        padding-inline: 40px;
        column-gap: 48px;
    }

    /* list : 790px 고정 → 남는 폭 채우도록 유연화 */
    .divorce-faq__list {
        flex: 1 1 auto;
        min-width: 0;
    }

    .divorce-faq .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }
    /* [자주 묻는 질문 영역] divorce-faq 태블릿 스타일 끝 */

    /* [상담 FAQ 영역] consult-faq 태블릿 스타일 시작 */
    /* inner : 1200 고정 컨테이너 → 좌우 여백 확보(엣지 붙음 방지) */
    .consult-faq__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    /* head : 헤더 → 아코디언 간격 축소 */
    .consult-faq__head {
        margin-bottom: 56px;
    }

    /* 타이틀 : 38 → 32 (좁아진 폭 대비 축소) */
    .consult-faq .sec-head__title {
        font-size: 32px;
        line-height: 46px;
        letter-spacing: -1.6px;
    }

    /* [전문센터 배너] consult-centers 태블릿 스타일 시작 */
    /* 가로 3분할(패널·이미지·패널) 유지 · 고정 폭(423) → 유연화 + 여백/타이틀 축소로 넘침 방지 */
    .consult-centers__panel,
    .consult-centers__panel--divorce,
    .consult-centers__panel--criminal {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        padding: 32px 16px 0 32px;
    }

    /* 타이틀 : 21 → 20 (좁아진 패널 대비) */
    .consult-centers__title {
        font-size: 20px;
    }

    /* 버튼 : 고정 left → 우측 정렬 */
    .consult-centers__panel--divorce .consult-centers__btn,
    .consult-centers__panel--criminal .consult-centers__btn {
        left: auto;
        right: 24px;
    }
    /* [전문센터 배너] consult-centers 태블릿 스타일 끝 */
    /* [상담 FAQ 영역] consult-faq 태블릿 스타일 끝 */

    /* [함께 짚어야 할 것 슬라이더 영역] related-topic 태블릿 스타일 시작 */
    /* PC 2장/뷰 가로 카드 유지 — 폭만 유연화(카드 폭은 JS가 자동 계산) */
    .related-topic {
        padding: 50px 0 72px;
    }

    .related-topic__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .related-topic__title {
        font-size: 26px;
        line-height: 40px;
        letter-spacing: -0.52px;
    }

    .related-topic__slider {
        margin-top: 30px;
    }

    .topic-card {
        height: 164px;
        padding: 44px 24px 0;
    }

    .topic-card__title {
        font-size: 24px;
        line-height: 30px;
        letter-spacing: -1.2px;
    }

    .topic-card__arrow {
        right: 24px;
        bottom: 20px;
        width: 42px;
        height: 42px;
    }

    .topic-card__arrow img {
        width: 18px;
        height: 18px;
    }
    /* [함께 짚어야 할 것 슬라이더 영역] related-topic 태블릿 스타일 끝 */

    /* [상간소송 진행 방식 영역] lawsuit-process 태블릿 스타일 시작 */
    /* inner : 1200 고정 → 풀폭 + 좌우 여백 (3열 그리드 구조는 유지) */
    .lawsuit-process__inner {
        max-width: 100%;
        padding-inline: 40px;
    }
    /* [상간소송 진행 방식 영역] lawsuit-process 태블릿 스타일 끝 */

    /* [지금 당장 해야할 것 영역] action-now 태블릿 스타일 시작 */
    /* inner : 1200 고정 → 풀폭 + 좌우 여백 (2열 그리드 123/1fr 구조는 유지) */
    .action-now__inner {
        max-width: 100%;
        padding-inline: 40px;
    }
    /* [지금 당장 해야할 것 영역] action-now 태블릿 스타일 끝 */

    /* [상속의 핵심 영역] inherit-core 태블릿 스타일 시작 */
    .inherit-core {
        padding-top: 60px;
    }

    /* inner : 1200 고정 → 풀폭 + 좌우 여백 */
    .inherit-core__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .inherit-core .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }

    /* 비교표 : 고정 px 폭(구분 153 / 기간 546) → 가변(%)로 완화하여 좁은 폭에서도 비율 유지 (3열·PC 레이아웃 유지) */
    .inherit-core__table .col-division { width: 16%; }
    .inherit-core__table .col-period   { width: 34%; }

    /* 인셋 22 → 16 축소 (thead 구분 라벨 · tbody 구분 셀) */
    .inherit-core__table thead th:first-child,
    .inherit-core__table tbody th {
        padding-left: 16px;
    }

    /* 구분 셀 베이지 박스 : 123px 고정 → 컬럼 폭에 맞춰 채움(좁은 폭에서 박스가 내용 열로 넘치지 않도록) */
    .inherit-core__table tbody th {
        background-size: 100% 100%;
    }

    /* 안내 카드 : 3열 유지 · 패딩만 축소 (슬라이드 아님) */
    .inherit-core__card {
        padding: 28px 20px;
    }
    /* [상속의 핵심 영역] inherit-core 태블릿 스타일 끝 */

    /* [단계별 대응 안내 영역] stage-guide 태블릿 스타일 시작 */
    /* inner : 1200 고정 → 100% + 좌우 40 패딩 (뷰포트 넘침 방지) */
    .stage-guide {
        padding: 80px 0;
    }

    .stage-guide__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    .stage-guide__title {
        margin-top: 28px;
        font-size: 30px;
        line-height: 46px;
    }

    .stage-guide__list {
        margin-top: 60px;
    }

    /* item : 2열 그리드 유지 · 단계명 열만 축소 (171 → 150) */
    .stage-guide__item {
        grid-template-columns: 150px 1fr;
    }

    .stage-guide__label {
        font-size: 20px;
    }

    .stage-guide__desc {
        font-size: 18px;
        line-height: 27px;
    }
    /* [단계별 대응 안내 영역] stage-guide 태블릿 스타일 끝 */

    /* [고소대리 소개/단계 영역] criminal-intro · criminal-step 태블릿 스타일 시작 */
    /* inner : 1200 고정 → 100% + 좌우 40 패딩 (뷰포트 넘침 방지) */
    .criminal-intro {
        padding-top: 70px;
    }

    .criminal-intro__inner,
    .criminal-step__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    /* 타이틀 : 30 → 26 축소 */
    .criminal-intro .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }

    /* 카드 : 3열 유지 · 간격/패딩만 축소해 좁은 폭 대응 */
    .criminal-intro__list {
        column-gap: 12px;
        margin-top: 32px;
    }

    .criminal-intro__card {
        padding: 26px 20px;
    }

    /* 단계표 : 넘버/단계명 열 폭 축소로 설명 공간 확보 */
    .criminal-step__table .col-num  { width: 56px; }
    .criminal-step__table .col-name { width: 104px; }

    .criminal-step__num,
    .criminal-step__name {
        padding-left: 18px;
    }

    .criminal-step__desc {
        padding-left: 28px;
    }
    /* [고소대리 소개/단계 영역] criminal-intro · criminal-step 태블릿 스타일 끝 */

    /* [초기대응/단계표 영역] criminal-response · criminal-stage 태블릿 스타일 시작 */
    /* inner : 1200 고정 → 100% + 좌우 40 패딩 (뷰포트 넘침 방지) */
    .criminal-response__inner,
    .criminal-stage__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    /* 상단 여백 축소 (90 → 70) */
    .criminal-response {
        padding-top: 70px;
    }

    /* 서브헤더 타이틀 : 30 → 26 축소 (criminal-response 스코프 한정) */
    .criminal-response .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }

    /* 초기대응 카드 : 3열 유지 · 간격/패딩만 축소해 좁은 폭 대응 */
    .criminal-response__list {
        column-gap: 12px;
        margin-top: 32px;
    }

    .criminal-response__card {
        padding: 28px 14px;
    }

    /* 단계표 : 단계명 열 폭 축소(123 → 104) · 설명 좌측 인셋 완화 */
    .criminal-stage__table .col-stage { width: 104px; }

    .criminal-stage__step {
        padding-left: 18px;
    }

    .criminal-stage__desc {
        padding-left: 24px;
    }
    /* [초기대응/단계표 영역] criminal-response · criminal-stage 태블릿 스타일 끝 */

    /* [화신의 발빠른 대응사례 영역] criminal-case 태블릿 스타일 시작 */
    /* inner : 1200 고정 → 100% + 좌우 40 패딩 (뷰포트 넘침 방지) */
    .criminal-case__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    /* 상단 여백 축소 (120 → 80) */
    .criminal-case {
        padding-top: 80px;
    }

    /* 서브헤더 타이틀 : 30 → 26 축소 (criminal-case 스코프 한정) */
    .criminal-case .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }

    /* flow : 3열 유지 · 간격 축소 */
    .criminal-case__flow {
        margin-top: 32px;
    }

    /* arrow : inner 폭이 유동으로 바뀌므로 카드 경계 위치를 폭 비례로 재보정 */
    /*         (3열 1fr · column-gap 21 · 화살표 37 기준: 경계중심 = W/3 ∓ g/6) */
    .criminal-case__arrow--first {
        left: calc(33.333% - 22px);
    }

    .criminal-case__arrow--second {
        left: calc(66.667% - 15px);
    }
    /* [화신의 발빠른 대응사례 영역] criminal-case 태블릿 스타일 끝 */

    /* [피해자/피의자 전략 비교 영역] fraud-strategy 태블릿 스타일 시작 */
    /* 섹션 상단 여백 축소 (90 → 80) · inner 유동폭 전환 */
    .fraud-strategy {
        padding-top: 80px;
    }

    .fraud-strategy__inner {
        max-width: 100%;
        padding-inline: 40px;
    }

    /* 타이틀 : 30 → 26 축소 (fraud-strategy 스코프 한정) */
    .fraud-strategy .sec-head__title {
        font-size: 26px;
        line-height: 38px;
    }

    /* cards : 2열 유지 · 카드 좌우 패딩 축소로 협소화 방지 (40 → 24) */
    .fraud-strategy__card {
        padding: 26px 24px;
    }
    /* [피해자/피의자 전략 비교 영역] fraud-strategy 태블릿 스타일 끝 */

    /* [상담 히어로 영역] consult-hero 태블릿 스타일 시작 */
    /* 히어로 전체 높이 축소 : PC 720 → 태블릿 600 */
    .consult-hero,
    .consult-hero__inner {
        min-height: 600px;
    }

    /* 비주얼(법봉·저울) : 폭 축소(910 → 760) 후 상단 위치 조정 */
    .consult-hero__visual {
        top: 100px;
        width: 760px;
    }

    /* 텍스트 : 축소된 비주얼 하단에 맞춰 위로 이동 */
    .consult-hero__text {
        top: 250px;
        padding-inline: 40px;
    }

    .consult-hero__title {
        font-size: 34px;
        line-height: 50px;
        letter-spacing: -1.9px;
    }

    .consult-hero__desc {
        margin-top: 22px;
        font-size: 21px;
        line-height: 36px;
        letter-spacing: -0.42px;
    }
    /* [상담 히어로 영역] consult-hero 태블릿 스타일 끝 */

    /* [상담 신청 영역] consult-apply 태블릿 스타일 시작 */
    /* PC 는 좌(다크 폼)·우(베이지 안내) 2단 + 중앙앵커 다크패널(::before).
       태블릿부터 세로 1단 스택으로 전환 : 다크 폼 패널(위) → 베이지 안내(아래) */
    .consult-apply {
        padding-left: 0;
    }

    .consult-apply::before {
        display: none; /* 중앙 앵커 다크 패널 해제 → 각 패널이 자체 배경 사용 */
    }

    .consult-apply__inner {
        flex-direction: column;
        max-width: 100%;
        min-height: 0;
        padding: 0;
    }

    /* 폼 패널 : 풀폭 다크 섹션 (자체 배경으로 full-bleed) */
    .consult-apply__form-panel {
        flex: none;
        width: 100%;
        box-sizing: border-box;
        padding: 70px 40px;
        background-color: #203038;
    }

    .consult-apply__title {
        font-size: 32px;
        letter-spacing: -1.6px;
    }

    /* 안내 정보 : 풀폭 베이지 섹션 (섹션 배경색 유지) */
    .consult-apply__info {
        display: flex;
        flex-direction: column;
        gap: 48px;
        flex: none;
        width: 100%;
        box-sizing: border-box;
        padding: 64px 40px 80px;
    }

    /* 항목 간격은 gap 으로 통일 (order 재배치와 무관하게 균등) */
    .consult-info__item + .consult-info__item {
        margin-top: 0;
    }

    /* 안내 제목 노출 + 순서 : 제목 → 사무소 위치 → 운영 시간 → 대표번호 (Figma) */
    .consult-apply__info-title {
        display: block;
        order: -2;
        font-family: 'pretendard';
        font-weight: 700;
        font-size: 30px;
        letter-spacing: -0.6px;
        color: #201d1d;
    }

    .consult-info__item:has(.consult-info__value--addr) {
        order: -1; /* 사무소 위치를 안내 최상단으로 */
    }
    /* [상담 신청 영역] consult-apply 태블릿 스타일 끝 */
}


/* ===================== 모바일 (max-width: 768px) ===================== */
@media (max-width: 768px) {
    /* [상단 영역] visual 모바일 스타일 시작 (Figma 390 기준) */
    .visual__figure img {
        max-width: 420px;
    }

    .visual__gradient {
        top: 20px;
    }

    .visual__text {
        padding-inline: 20px;
    }

    .visual__title {
        font-size: 32px;
        line-height: 43px;
    }

    .visual__title-br {
        display: inline;
    }

    .visual__desc {
        margin-top: 20px;
        font-size: 18px;
        line-height: 28px;
    }
    /* [상단 영역] visual 모바일 스타일 끝 */

    /* [About 영역] about 모바일 스타일 시작 (Figma 390 기준) */
    .about {
        padding: 70px 0 90px;
    }

    .about__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    .about__label {
        font-size: 16px;
        line-height: 22px;
    }

    .about__title {
        margin-top: 14px;
        font-size: 30px;
        line-height: 43px;
        letter-spacing: -1.2px;
    }

    .about__lead {
        margin-top: 24px;
        line-height: 26.5px;
        letter-spacing: -0.16px;
    }

    /* 이미지(상단) → 텍스트(하단) 세로 스택 */
    .about__list {
        row-gap: 40px;
        margin-top: 50px;
    }

    .about__item {
        flex-direction: column-reverse;
        row-gap: 6px;
    }

    /* 2번 카드는 DOM 순서상 이미지가 먼저이므로 정방향 스택 */
    .about__item--reverse {
        flex-direction: column;
    }

    .about__figure,
    .about__content {
        flex: none;
        width: 100%;
    }

    .about__figure img {
        height: 240px;
    }

    .about__content {
        row-gap: 18px;
        padding: 24px;
    }

    .about__num {
        font-size: 17px;
        line-height: 24px;
    }

    .about__body {
        row-gap: 12px;
    }

    .about__heading {
        font-size: 20px;
        line-height: 29.73px;
        letter-spacing: -1px;
    }

    /* 줄바꿈: 모바일 전용 br 노출 / PC 전용 br 숨김 */
    .about .br-mo {
        display: inline;
    }

    .about .br-pc {
        display: none;
    }
    /* [About 영역] about 모바일 스타일 끝 */

    /* [강조 문구 영역] motto 모바일 스타일 시작 (Figma 390 기준) */
    .motto {
        padding: 48px 0 54px;
    }

    .motto__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    .motto__text {
        font-size: 22px;
        line-height: 38px;
        letter-spacing: -0.88px;
    }

    /* 줄바꿈: 모바일 전용 br 노출 */
    .motto .br-mo {
        display: inline;
    }
    /* [강조 문구 영역] motto 모바일 스타일 끝 */

    /* [변호사 소개 영역] attorney-intro 모바일 스타일 시작 (Figma 390 기준) */
    .attorney-intro {
        padding: 60px 0 90px;
    }

    .attorney-intro__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* head : 라벨 + 타이틀 + 리드문 */
    .attorney-intro__label {
        font-size: 16px;
        line-height: 22px;
    }

    .attorney-intro__title {
        margin-top: 36px;
        font-size: 32px;
        line-height: 43px;
        letter-spacing: -1.6px;
    }

    .attorney-intro__desc {
        margin-top: 24px;
        font-size: 20px;
        line-height: 28px;
        letter-spacing: -0.2px;
    }

    .attorney-list {
        row-gap: 20px;
        margin-top: 24px;
    }

    /* card : 텍스트 콘텐츠 간격 · 타이포 */
    .attorney-card__content {
        padding: 20px 25px 30px;
    }

    .attorney-card__position {
        font-size: 14px;
        line-height: 23px;
        letter-spacing: -0.14px;
    }

    .attorney-card__name {
        margin-top: 8px;
        font-size: 30px;
        line-height: 30px;
        letter-spacing: -1.8px;
    }

    .attorney-card--primary .attorney-card__headline,
    .attorney-card--secondary .attorney-card__headline {
        margin-top: 26px;
    }

    .attorney-card__headline {
        font-size: 20px;
        line-height: 30px;
        letter-spacing: -0.4px;
    }

    .attorney-card__desc {
        margin-top: 12px;
        font-size: 16px;
        line-height: 25px;
        letter-spacing: -0.32px;
    }

    .attorney-card__badges {
        margin-top: 28px;
    }

    .attorney-card__badge {
        height: 50px;
        padding: 6px 20px;
        border-radius: 40px;
        font-size: 16px;
    }

    /* 영문명 (Figma 37px) */
    .attorney-card__eng-name {
        top: 268px;
        font-size: 37px;
        line-height: 41px;
    }

    /* watermark : 2줄 중앙 정렬 (Figma) */
    .attorney-intro__watermark {
        position: static;
        margin-top: 40px;
        right: auto;
        bottom: auto;
        font-size: 40px;
        line-height: 60px;
        text-align: right;
    }

    /* 줄바꿈: 모바일 전용 br 노출 / PC 전용 br 숨김 */
    .attorney-intro .br-mo {
        display: inline;
    }

    .attorney-intro .br-pc {
        display: none;
    }
    /* [변호사 소개 영역] attorney-intro 모바일 스타일 끝 */

    /* [오시는 길 영역] location 모바일 스타일 시작 (Figma 390 기준) */
    .location {
        padding: 70px 0 180px;
    }

    .location__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* head: 라벨 + 타이틀 + 리드문 */
    .location__eyebrow {
        font-size: 16px;
        line-height: 23px;
    }

    .location__title {
        margin-top: 36px;
        font-size: 32px;
        line-height: 43px;
        letter-spacing: -1.6px;
    }

    .location__desc {
        margin-top: 24px;
        font-size: 20px;
        line-height: 28px;
        letter-spacing: -0.2px;
    }

    /* map: 라운드 세로형 지도 */
    .location__map {
        margin-top: 64px;
        border-radius: 24px;
    }

    .location__map iframe {
        height: 452px;
    }

    /* info: 2단 그리드 → 1단 세로 적층 */
    .location__info {
        grid-template-columns: 1fr;
        row-gap: 56px;
        margin-top: 56px;
    }

    .location__col-title {
        font-size: 26px;
        line-height: 34px;
    }

    .location__list {
        row-gap: 40px;
        margin-top: 28px;
    }

    /* item: [아이콘] + [라벨 위 · 값 아래] 세로 적층 */
    .location__icon {
        flex: 0 0 17px;
        margin-top: 4px;
    }

    .location__body {
        display: flex;
        flex-direction: column;
        row-gap: 6px;
    }

    .location__label {
        padding-top: 0;
        font-size: 18px;
        line-height: 24px;
        letter-spacing: -0.9px;
    }

    .location__value {
        font-size: 20px;
        line-height: 30px;
        letter-spacing: -0.4px;
    }

    .location__note {
        margin-top: 6px;
        font-size: 16px;
        line-height: 22.4px;
    }

    .location__tel {
        font-size: 34px;
    }

    /* bus: 번호 배지 + 정류장 */
    .location__bus {
        margin-top: 14px;
    }

    .location__bus-badge {
        font-size: 17px;
    }

    .location__bus-stop {
        font-size: 18px;
    }

    /* 줄바꿈: 모바일 전용 br 노출 */
    .location .br-mo {
        display: inline;
    }
    /* [오시는 길 영역] location 모바일 스타일 끝 */

    /* [이혼전문센터 인트로 영역] divorce-intro 모바일 스타일 시작 (Figma 390 기준) */
    .divorce-intro {
        padding: 50px 0;
    }

    .divorce-intro__inner {
        padding-inline: 20px;
    }

    /* hero : PC 는 텍스트+우측버튼, 모바일은 세로 스택(텍스트 → 풀폭 버튼) */
    .divorce-intro__hero {
        height: 480px;
        border-radius: 30px;
    }

    .divorce-intro__hero::after {
        height: 200px;
    }

    .divorce-intro__hero-body {
        left: 26px;
        right: 26px;
        top: auto;
        bottom: 104px;
    }

    .divorce-intro__eyebrow {
        font-size: 30px;
        line-height: 30px;
        letter-spacing: -0.6px;
    }

    .divorce-intro__lead {
        margin-top: 14px;
        font-size: 16px;
        line-height: 23px;
        letter-spacing: -0.32px;
    }

    /* CTA : 히어로 하단 풀폭 pill */
    .divorce-intro__cta {
        left: 20px;
        right: 20px;
        top: auto;
        bottom: 24px;
        width: auto;
        height: 58px;
        column-gap: 7px;
        border-radius: 60px;
    }

    .divorce-intro__cta-text {
        font-size: 16px;
    }

    /* head : 중앙 정렬 + 장식 라인 숨김 */
    .divorce-intro__head {
        margin-top: 40px;
        padding-left: 0;
        text-align: center;
    }

    .divorce-intro__tag {
        justify-content: center;
        font-size: 18px;
    }

    .divorce-intro__tag-line {
        display: none;
    }

    .divorce-intro__title {
        margin-top: 18px;
        font-size: 22px;
        line-height: 34px;
        letter-spacing: -0.44px;
        text-align: center;
    }

    /* marquee : 모바일에서도 좌우 무한 슬라이드 유지 (모바일은 3줄) */
    .divorce-intro__marquee {
        margin-top: 40px;
        row-gap: 12px;
    }

    /* 3번째 행 : 모바일에서만 노출 */
    .divorce-intro__row--3 {
        display: flex;
    }

    .divorce-intro__chip {
        height: auto;
        padding: 13px 20px 13px 12px;
        border-radius: 42px;
    }

    .divorce-intro__chip-icon {
        width: 34px;
        height: 34px;
    }

    .divorce-intro__chip-icon svg,
    .divorce-intro__chip-icon img {
        width: 19px;
        height: 19px;
    }

    .divorce-intro__chip-text {
        font-size: 16px;
        line-height: 20px;
    }

    /* 줄바꿈: 모바일 전용 br 노출 */
    .divorce-intro .br-mo {
        display: inline;
    }
    /* [이혼전문센터 인트로 영역] divorce-intro 모바일 스타일 끝 */

    /* [왜 화신인가 영역] why-hwashin 모바일 스타일 시작 (Figma 390 기준) */
    .why-hwashin {
        padding: 48px 0 60px;
    }

    /* PC 2단(인트로 | 카드) → 1단 세로 스택 (헤더 → 인증서 → 카드) */
    .why-hwashin__inner {
        flex-direction: column;
        align-items: stretch;
        max-width: 100%;
        padding-inline: 20px;
    }

    .why-hwashin__intro {
        width: 100%;
    }

    /* 헤더: 라벨 + 타이틀 가운데 정렬 */
    .why-hwashin__head {
        text-align: center;
    }

    .why-hwashin__tag {
        justify-content: center;
        font-size: 18px;
        line-height: 24px;
    }

    /* 모바일에서는 장식 라인 미노출 */
    .why-hwashin__tag-line {
        display: none;
    }

    .why-hwashin__title {
        margin-top: 12px;
        font-size: 26px;
        line-height: 40px;
        letter-spacing: -0.52px;
    }

    /* 인증서: 가운데 배치 (Figma 268 x 379) */
    .why-hwashin__cert {
        width: 268px;
        max-width: 100%;
        height: 379px;
        margin: 40px auto 0;
    }

    /* 카드열: 가로폭 100% 세로 스택 */
    .why-hwashin__cards {
        flex: none;
        width: 100%;
        row-gap: 14px;
        margin-top: 40px;
    }

    .why-hwashin__card {
        column-gap: 12px;
        min-height: auto;
        padding: 16px 17px;
        border-radius: 8px;
    }

    .why-hwashin__card-num {
        padding-top: 2px;
        font-size: 16px;
    }

    .why-hwashin__card-title {
        font-size: 20px;
        line-height: 28px;
    }

    .why-hwashin__card-desc {
        margin-top: 12px;
        font-size: 16px;
        line-height: 24px;
    }

    /* 줄바꿈: 모바일 전용 br 노출 / PC 전용 br 숨김 */
    .why-hwashin .br-mo {
        display: inline;
    }

    .why-hwashin .br-pc {
        display: none;
    }
    /* [왜 화신인가 영역] why-hwashin 모바일 스타일 끝 */

    /* [서비스 카드 슬라이더 영역] service-slider 모바일 스타일 시작 (Figma 388 카드 기준) */
    .service-slider {
        padding: 64px 0 160px;
    }

    .service-slider__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 헤드라인 : 가운데 정렬 + 축소 (Figma 26px / -0.52) */
    .service-slider__title {
        font-size: 26px;
        line-height: 40px;
        letter-spacing: -0.52px;
        text-align: center;
    }

    /* viewport : 좌측은 inner 여백(20px)에서 클립하고 우측만 화면 끝까지 확장한다.
       → 활성 카드 왼쪽으로는 이전 카드가 전혀 보이지 않고, 우측에만 다음 카드가 살짝 노출된다. */
    .service-slider__viewport {
        margin-top: 36px;
        margin-right: -20px;
    }

    .service-slider__list {
        column-gap: 18px;
    }

    /* 카드 : 1장 노출 + 우측 다음 카드 살짝 노출 (Figma 326.9 / 388 ≈ 84%) */
    .service-slider__slide {
        flex: 0 0 84vw;
    }

    .service-card {
        height: auto;
        aspect-ratio: 327 / 485;
        border-radius: 15px;
    }

    /* card 내부 : 여백 · 타이포 축소 (Figma 326.9 카드 기준) */
    .service-card__body {
        padding: 28px 25px;
    }

    .service-card__blur {
        height: 157px;
    }

    .service-card__subtitle {
        font-size: 15px;
        line-height: 23px;
        letter-spacing: -0.15px;
    }

    .service-card__title {
        margin-top: 8px;
        font-size: 30px;
        line-height: 30px;
        letter-spacing: -1.5px;
    }

    .service-card__desc {
        font-size: 16px;
        line-height: 25px;
        letter-spacing: -0.16px;
    }

    /* CTA : 아이콘 39.2 / 텍스트 12.6 (Figma) */
    .service-card__link {
        column-gap: 11px;
        margin-top: 16px;
    }

    .service-card__link-icon {
        width: 40px;
        height: 40px;
    }

    .service-card__link-icon svg {
        width: 17px;
        height: 17px;
    }

    .service-card__link-text {
        font-size: 13px;
        line-height: 14px;
    }

    /* 컨트롤(이전/다음 버튼) 숨김 : 모바일은 스와이프(드래그)로만 이동 */
    .service-slider__controls {
        display: none;
    }

    /* 줄바꿈 : 카드 타이틀/설명의 <br> 은 Figma 모바일과 PC 가 동일하여 공통 유지
       (별도 .br-mo 분리 불필요 — 분리 시 PC 2줄 레이아웃이 깨짐) */

    /* 헤드라인 : Figma 모바일 3줄 (어느 단계든 지금이 / 가장 빠릅니다 망설일수록 / 조력의 폭이 좁아집니다) */
    .service-slider .br-mo {
        display: inline;
    }

    .service-slider .br-pc {
        display: none;
    }
    /* [서비스 카드 슬라이더 영역] service-slider 모바일 스타일 끝 */

    /* [전화 상담 유도 배너 영역] cta-call 모바일 스타일 시작 (Figma 390 기준)
       적층 구조는 ≤1024 블록에서 정의됨. 여기서는 Figma 모바일 사이즈/간격만 미세조정 */

    /* 고정(fixed) 해제 → 일반 문서 흐름에 배치하고, 위 섹션에 레드 밴드만큼 겹쳐 올린다.
       -100px = 이 브레이크포인트의 베이지존(::before top:100px) 위치 → 전화번호 존이 원래 섹션 경계에서 시작.
       position:relative + z-index 로 겹친 레드 밴드가 위 섹션 위에 그려지게 한다. */
    .cta-call {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        width: 100%;
        z-index: 1;
        margin-top: -100px;
    }

    /* 레드 밴드 높이만 Figma 모바일(390) 비율로 조정 (mask/구조는 ≤1024 상속) */
    .cta-call::after {
        width: 380px;
        height: 116px;
    }

    /* 베이지 하단 존 시작점을 레드 밴드(116px)에 맞춰 내림 (레드 밴드 옆은 투명 유지) */
    .cta-call::before {
        top: 90px;
    }

    /* 안내 문구 : 20px / 좌측 정렬 (흰색은 변형 클래스에서 적용) */
    .cta-call__text {
        height: 116px;
        padding: 15px 30px 0;
        font-size: 20px;
        line-height: 30px;
        letter-spacing: -0.4px;
    }

    /* 전화번호 : 42px 중앙 */
    .cta-call__tel {
        margin-top: 18px;
        font-size: 42px;
        line-height: 60px;
        letter-spacing: -0.84px;
    }

    /* 전화번호 색상 : PC 는 컬러 패널 위라 흰색이지만, 모바일은 하단 베이지/다크 존으로
       이동하므로 존 배경에 맞춰 재지정 (변형별 대응) */
    .cta-call__tel {
        margin-top: 0px;
        color: #fff;                 /* 기본(::before 다크 존) */
    }

    .cta-call--wine .cta-call__tel {
        margin-top: 0px;
        color: #961B1E;              /* 베이지 존 위 : 딥 버건디 */
    }

    .cta-call--forest .cta-call__tel {
        color: #e6c88f;              /* 딥 틸 존 위 : 베이지 골드 */
    }

    /* 무료 문구 : 24px 중앙 */
    .cta-call__action {
        margin-top: 10px;
        padding-bottom: 38px;
    }

    .cta-call__action-text {
        font-size: 24px;
    }

    /* 줄바꿈 : 모바일 전용 br 노출 (안내 문구 2줄) */
    .cta-call .br-mo {
        display: inline;
    }
    /* [전화 상담 유도 배너 영역] cta-call 모바일 스타일 끝 */

    /* [이혼 카테고리 인트로 영역] divorce-topic 모바일 스타일 시작 (Figma 390 기준) */
    .divorce-topic {
        padding: 50px 0 0;
        border-bottom-width: 6px;
    }

    .divorce-topic__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 히어로 배너 : PC 와이드 배너 → 세로형 카드(Figma 350x512, radius 30) */
    .divorce-topic__visual {
        aspect-ratio: 350 / 512;
        border-radius: 30px;
    }

    .divorce-topic__image {
        height: 100%;
    }

    /* [이혼 및 가사 topic] 모바일 전용 세로형 이미지 교체 시작 (이혼전문센터 제외) */
    .sub-main--divorce .divorce-topic__image {
        content: url("../images/mobile/divorce-topic-01.webp");
    }

    .sub-main--divorce .topic--adultery .divorce-topic__image {
        content: url("../images/mobile/divorce-topic-02.webp");
    }

    .sub-main--divorce .topic--property .divorce-topic__image {
        content: url("../images/mobile/divorce-topic-03.webp");
    }

    .sub-main--divorce .topic--custody .divorce-topic__image {
        content: url("../images/mobile/divorce-topic-04.webp");
    }

    .sub-main--divorce .topic--inheritance .divorce-topic__image {
        content: url("../images/mobile/divorce-topic-05.webp");
    }
    /* [이혼 및 가사 topic] 모바일 전용 세로형 이미지 교체 끝 */

    /* [형사 topic] 모바일 전용 세로형 이미지 교체 시작 */
    .sub-main--criminal .divorce-topic__image {
        content: url("../images/mobile/criminal-topic-01.webp");
    }

    .sub-main--criminal .topic--dui .divorce-topic__image {
        content: url("../images/mobile/criminal-topic-02.webp");
    }

    .sub-main--criminal .topic--sexcrime .divorce-topic__image {
        content: url("../images/mobile/criminal-topic-03.webp");
    }

    .sub-main--criminal .topic--fraud .divorce-topic__image {
        content: url("../images/mobile/criminal-topic-04.webp");
    }
    /* [형사 topic] 모바일 전용 세로형 이미지 교체 끝 */

    /* 하단 blur 페이드 : 카드가 세로형이므로 오버레이 텍스트 영역까지 확장 */
    .divorce-topic__visual::after {
        height: 55%;
    }

    /* 카드 오버레이 : 카테고리명 + 리드 문구를 카드 좌하단에 노출(Figma) */
    .divorce-topic__overlay {
        display: flex;
        flex-direction: column;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1;
        padding: 0 26px 28px;
        text-align: left;
    }

    .divorce-topic__cat {
        font-family: 'pretendard';
        font-weight: 600;
        font-size: 30px;
        line-height: 1;
        letter-spacing: -0.6px;
        color: #fff;
    }

    .divorce-topic__lead {
        margin-top: 18px;
        font-family: 'pretendard';
        font-weight: 500;
        font-size: 18px;
        line-height: 30px;
        letter-spacing: -0.36px;
        color: #fff;
    }

    /* 탭 : 5개 항목이 화면 폭을 초과 → 가로 스크롤(슬라이드)로 전환 */
    .divorce-tab {
        margin-top: 24px;
    }

    .divorce-tab__list {
        justify-content: flex-start;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;              /* Firefox 스크롤바 숨김 */
    }

    .divorce-tab__list::-webkit-scrollbar {
        display: none;                      /* Chrome/Safari 스크롤바 숨김 */
    }

    .divorce-tab__item {
        flex: 0 0 auto;
        width: auto;
        padding: 0 16px 12px;
    }

    /* 탭 폭이 화면보다 좁으면 가운데 정렬, 넘치면 auto 여백이 0으로 접혀
       좌측부터 스크롤 (선택 탭이 왼쪽으로 쏠려 보이던 문제 해결) */
    .divorce-tab__item:first-child {
        margin-left: auto;
    }

    .divorce-tab__item:last-child {
        margin-right: auto;
    }

    /* 텍스트 : PC 고정높이 해제, 중앙 정렬 유지 */
    .divorce-topic__text {
        height: auto;
        padding: 32px 0 44px;
    }

    /* 타이틀 : 리드 문구가 카드 오버레이로 이동 → 탭 하단 타이틀은 숨김
       (h2 는 PC/접근성·SEO 용으로 DOM 유지) */
    .divorce-topic__title {
        display: none;
    }

    /* 서브 문구 : Figma 18px / 30 / -0.36 */
    .divorce-topic__desc {
        margin-top: 16px;
        font-size: 18px;
        line-height: 30px;
        letter-spacing: -0.36px;
    }

    /* 줄바꿈 : 모바일 전용 br 노출 / PC 전용 br 숨김 */
    .divorce-topic .br-mo {
        display: inline;
    }

    .divorce-topic .br-pc {
        display: none;
    }
    /* [이혼 카테고리 인트로 영역] divorce-topic 모바일 스타일 끝 */

    /* [이혼의 종류 영역] divorce-type 모바일 스타일 시작 (Figma 768 기준) */
    .divorce-type {
        padding-top: 50px;
    }

    .divorce-type__inner {
        padding-inline: 20px;
    }

    /* sec-head 축소 (라벨 16 / 타이틀 22·lh30) */
    .divorce-type .sec-head__label {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -0.32px;
    }

    .divorce-type .sec-head__title {
        margin-top: 10px;
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    .divorce-type__table-wrap {
        margin-top: 24px;
    }

    /* 표 → 세로 카드형 재구성 : 가로 4열 테이블을 행 단위 카드로 분해 (슬라이드 아님) */
    .divorce-type__table,
    .divorce-type__table tbody,
    .divorce-type__table tr,
    .divorce-type__table th,
    .divorce-type__table td {
        display: block;
    }

    .divorce-type__table thead {
        display: none;
    }

    /* 각 행(카드) : 좌(구분) / 우(항목 스택) 2단 그리드 · 상하 풀폭 브라운 구분선 */
    .divorce-type__table tbody tr {
        display: grid;
        grid-template-columns: 18% 1fr;
        border-top: 1px solid #917657;
    }

    .divorce-type__table tbody tr:last-child {
        border-bottom: 1px solid #917657;
    }

    /* 좌측 구분 셀(협의/조정/재판상) : 베이지 배경 · 세로 전체 병합 · 중앙정렬 */
    .divorce-type__table tbody th {
        grid-column: 1;
        grid-row: 1 / span 3;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        background-color: #f9f8f7;
        text-align: center;
        font-size: 16px;
        line-height: 23px;
        letter-spacing: -0.32px;
    }

    /* 우측 항목 셀 : [항목 라벨 | 값] 가로 배치 */
    .divorce-type__table tbody td {
        grid-column: 2;
        display: flex;
        align-items: center;
        min-height: 70px;
        padding: 14px 0;
        font-size: 15px;
        line-height: 19px;
        letter-spacing: -0.3px;
    }

    /* 항목 라벨(방법/소요기간/적합한 상황) : 브라운 · 좌측 서브컬럼 중앙정렬 */
    .divorce-type__table tbody td::before {
        content: attr(data-label);
        flex: 0 0 76px;
        padding-right: 12px;
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
        letter-spacing: -0.28px;
        text-align: center;
        color: #917657;
    }

    /* 항목 간 얇은 구분선 : 우측 콘텐츠 영역(td)에만 · 마지막 항목(적합한 상황) 제외 */
    .divorce-type__table tbody tr td {
        border-bottom: 1px solid #e5e3e0;
    }

    .divorce-type__table tbody tr:last-child td {
        border-bottom: 1px solid #e5e3e0;
    }

    .divorce-type__table tbody tr td:last-child {
        border-bottom: 0;
    }

    /* 모바일 전용 줄바꿈 노출 */
    .divorce-type .br-mo {
        display: inline;
    }
    /* [이혼의 종류 영역] divorce-type 모바일 스타일 끝 */

    /* [친권·양육권 비교표 영역] divorce-type(3열 변형) 모바일 스타일 시작 (Figma 768 기준) */
    /* 카드 레이아웃(좌 구분셀 베이지 세로병합 / 우 [정의·이혼 후 귀속] 항목 스택 · 항목라벨 브라운 · 슬라이드 아님)은
       base .divorce-type__table 모바일 규칙을 그대로 상속. 이 표는 항목 td가 3개가 아닌 2개(정의·이혼 후 귀속)뿐이므로
       좌측 구분셀(친권/양육권)의 세로 병합 스팬만 3→2행으로 재지정하여 베이지 셀이 콘텐츠 높이에 정확히 맞도록 교정 */
    .divorce-type__table:has(.col-belong) tbody th {
        grid-row: 1 / span 2;
    }
    /* [친권·양육권 비교표 영역] divorce-type(3열 변형) 모바일 스타일 끝 */

    /* [혈중알코올농도별 처벌 기준표 영역] divorce-type--dui 모바일 스타일 시작 (Figma 768 기준) */
    /* base .divorce-type__table 카드 레이아웃(좌 구분셀 세로병합 / 우 [항목라벨|값] 스택 · 슬라이드 아님)을 상속하고
       음주운전 테마(페일틸 박스 #f4f9fa · 서브라벨 #596c6f · 쿨톤 구분선 #dbe6e7 · 강조 딥틸 #226d77) 델타만 오버라이드 */

    /* 타이틀 : 모바일에서는 PC용 <br> 줄바꿈 해제(피그마 1줄) */
    .divorce-type--dui .sec-head__title br {
        display: none;
    }

    /* thead : base 는 전체 숨김이나, 이 표는 '혈중알코올농도' 컬럼 라벨만 표 상단에 단독 노출(피그마)
       → 첫 컬럼만 블록 라벨로 복원하고 나머지(형사처벌·면허처분) 컬럼 라벨은 각 셀 data-label 로 대체 */
    .divorce-type--dui .divorce-type__table thead {
        display: block;
    }

    .divorce-type--dui .divorce-type__table thead th {
        display: none;
    }

    .divorce-type--dui .divorce-type__table thead th:first-child {
        display: block;
        padding: 0 0 8px;
        border-bottom: 0;
        font-size: 18px;
        line-height: 34px;
        color: #596c6f;
    }

    /* 각 행(카드) : 항목 td가 2개(형사처벌·면허처분)이므로 좌측 혈중농도 셀은 2행 병합 · 구분선 쿨톤 */
    .divorce-type--dui .divorce-type__table tbody tr {
        grid-template-columns: 24% 1fr;
        border-top-color: #dbe6e7;
    }

    .divorce-type--dui .divorce-type__table tbody tr:last-child {
        border-bottom-color: #dbe6e7;
    }

    .divorce-type--dui .divorce-type__table tbody th {
        grid-row: 1 / span 2;
        padding-left: 0;
        background-color: #f4f9fa;
        background-image: none;
        font-weight: 600;
        font-size: 15px;
        line-height: 20px;
        letter-spacing: -0.45px;
    }

    /* 우측 항목 셀 : 다크 본문 15px · 항목 간 얇은 쿨톤 구분선 */
    .divorce-type--dui .divorce-type__table tbody td {
        padding-left: 0;
        min-height: 77px;
        border-bottom-color: #dbe6e7;
        font-weight: 500;
        font-size: 15px;
        line-height: 21px;
        letter-spacing: -0.3px;
    }

    /* 항목 라벨(형사 처벌 / 면허 처분) : 딥틸그레이 · 좁은 서브컬럼 중앙정렬(2줄 자동 줄바꿈) */
    .divorce-type--dui .divorce-type__table tbody td::before {
        flex: 0 0 46px;
        padding-right: 8px;
        font-size: 14px;
        line-height: 20px;
        letter-spacing: -0.28px;
        color: #596c6f;
    }

    /* 강조 행(0.2% 이상) : 형사처벌·면허처분 값은 딥틸 볼드(PC 규칙 상속) · 라벨은 그레이 유지 */
    .divorce-type--dui .divorce-type__table .is-highlight td::before {
        color: #596c6f;
    }
    /* [혈중알코올농도별 처벌 기준표 영역] divorce-type--dui 모바일 스타일 끝 */

    /* [대응 방향/사례 흐름 영역] dui-response·dui-case 모바일 스타일 시작 (Figma 768 기준) */
    /* PC 2열 카드 → 세로 1열 스택 · PC 3열 사례 흐름 → 세로 1열 스택(슬라이드 아님) · 화살표는 오른쪽→아래 방향 전환 */

    /* 섹션 여백 축소 + 좌우 20px 인셋(피그마 콘텐츠 폭 350 within 390) */
    .dui-response {
        padding-top: 80px;
    }

    .dui-response__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* sec-head 축소 (라벨 16 / 타이틀 22·lh30, 좌측 정렬 유지) */
    .dui-response .sec-head__label {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -0.32px;
    }

    .dui-response .sec-head__title {
        margin-top: 10px;
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* list : 2열 그리드 → 세로 1열 스택 (카드 간 25px) */
    .dui-response__list {
        grid-template-columns: 1fr;
        row-gap: 25px;
        margin-top: 24px;
    }

    /* card : 상단 딥틸 accent 라인 유지 · 고정 min-height 해제 · 패딩 축소(피그마 28/20) */
    .dui-response__card {
        min-height: 0;
        padding: 28px 20px;
    }

    /* 사례 흐름 : 3열 그리드 → 세로 1열 스택 · 카드 라운드 8→10px(피그마) */
    .dui-case {
        margin-top: 24px;
    }

    .dui-case__flow {
        grid-template-columns: 1fr;
        row-gap: 10px;
    }

    .dui-case__item {
        min-height: 143px;
        border-radius: 10px;
    }

    .dui-case__item--result {
        min-height: 139px;
    }

    /* label : 19→20px (피그마) */
    .dui-case__label {
        font-size: 20px;
        line-height: 29px;
        letter-spacing: -0.4px;
    }

    /* desc : 14→16px·lh25 (피그마) */
    .dui-case__desc {
        font-size: 16px;
        line-height: 25px;
        letter-spacing: -0.32px;
    }

    /* 결과 카드 desc : 18→16px·lh30 화이트 볼드(피그마) */
    .dui-case__item--result .dui-case__desc {
        font-size: 16px;
        line-height: 30px;
        letter-spacing: -0.32px;
    }

    /* arrow : 카드 사이 오른쪽 방향 원형(37) → 세로 경계 아래 방향 원형(31)으로 전환 */
    .dui-case__arrow {
        left: 50%;
        width: 31px;
        height: 31px;
        transform: translate(-50%, -50%);
    }

    /* 1·2번 카드 경계(상황 143 + 간격 절반 5) */
    .dui-case__arrow--first {
        top: 148px;
    }

    /* 2·3번 카드 경계(상황 143 + 간격 10 + 대응 143 + 간격 절반 5) */
    .dui-case__arrow--second {
        top: 301px;
    }

    /* 셰브론 : 오른쪽(rotate45) → 아래(rotate135) */
    .dui-case__arrow::after {
        transform: translate(-50%, -65%) rotate(135deg);
    }
    /* [대응 방향/사례 흐름 영역] dui-response·dui-case 모바일 스타일 끝 */

    /* [재판상 이혼 사유 영역] divorce-reason 모바일 스타일 시작 (Figma 768 기준) */
    .divorce-reason {
        padding-top: 80px;
    }

    .divorce-topic + .divorce-reason {
        padding-top: 50px;
    }

    .divorce-reason__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* sec-head 축소 (라벨 16 / 타이틀 22·lh30, 좌측 정렬 유지) */
    .divorce-reason .sec-head__label {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -0.32px;
    }

    .divorce-reason .sec-head__title {
        margin-top: 10px;
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* list : 3열 그리드 → 세로 1열 스택 (슬라이드 아님) */
    .divorce-reason__list {
        display: flex;
        flex-direction: column;
        row-gap: 24px;
        margin-top: 28px;
    }

    /* card : 풀폭 · 상단 accent 라인 유지 · 세로 여백 확장 · 고정 높이 해제 */
    .divorce-reason__card {
        min-height: 0;
        padding: 36px 20px;
    }

    .divorce-reason__card-desc {
        margin-top: 12px;
    }

    /* 줄바꿈 : 모바일 전용 br 노출 / PC 전용 br 숨김 (모바일은 자연 흐름 + 문단 br만 유지) */
    .divorce-reason .br-mo {
        display: inline;
    }

    .divorce-reason .br-pc {
        display: none;
    }
    /* [재판상 이혼 사유 영역] divorce-reason 모바일 스타일 끝 */

    /* [위자료 산정 기준 영역] alimony-standard 모바일 스타일 시작 (Figma 768 기준) */
    .alimony-standard {
        padding-top: 80px;
    }

    .alimony-standard__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* sec-head 축소 (라벨 16 / 타이틀 22·lh30, 좌측 정렬 유지) */
    .alimony-standard .sec-head__label {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -0.32px;
    }

    .alimony-standard .sec-head__title {
        margin-top: 10px;
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* list : 그리드 → 세로 1열 스택 (슬라이드 아님) */
    .alimony-standard__list {
        display: flex;
        flex-direction: column;
        row-gap: 32px; /* 상단 걸침 넘버 뱃지 공간 확보 */
        margin-top: 44px;
    }

    /* item : 풀폭 · 세로 여백 확장(고정 높이 완화) */
    .alimony-standard__item {
        min-height: 0;
        padding: 26px 20px;
    }

    /* num : 뱃지 확대 (37px 원형 · 15px) · 상단 좌측 걸침 */
    .alimony-standard__num {
        top: -18px;
        left: 20px;
        width: 37px;
        height: 37px;
        font-size: 15px;
        letter-spacing: -0.3px;
    }

    /* label : 18px / lh29 (중앙 정렬 유지) */
    .alimony-standard__label {
        font-size: 17px;
        line-height: 27px;
        letter-spacing: -0.36px;
    }
    
    .property-ratio .alimony-standard__label {
        font-size: 17px;
        line-height: 27px;
        letter-spacing: -0.36px;
    }
    /* [위자료 산정 기준 영역] alimony-standard 모바일 스타일 끝 */

    /* [자주 묻는 질문 영역] divorce-faq 모바일 스타일 시작 (Figma 768 기준) */
    .divorce-faq {
        padding: 80px 0 160px 0;
    }
    
    .divorce-faq.criminal-faq {
        padding: 80px 0 180px 0;
    }
    
    .divorce-faq.consult-faq {
        padding: 80px 0 0 0;
    }

    /* inner : PC 2단(헤더+아코디언) → 세로 1열 스택 (아코디언이라 슬라이드 아님) */
    .divorce-faq__inner {
        flex-direction: column;
        align-items: stretch;
        max-width: 100%;
        padding-inline: 20px;
    }

    .divorce-faq__head {
        flex: 0 0 auto;
    }

    /* list : 790px 고정 해제 → 풀폭, 헤더 아래로 이동 */
    .divorce-faq__list {
        flex: 1 1 auto;
        width: 100%;
        margin-top: 32px;
    }

    /* sec-head 축소 (라벨 16 / 타이틀 22·lh30, 좌측 정렬 유지) */
    .divorce-faq .sec-head__label {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -0.32px;
    }

    .divorce-faq .sec-head__title {
        margin-top: 10px;
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* trigger : 좌우 여백 축소(11 → 8.5) · 세로 패딩 축소 */
    .divorce-faq__trigger {
        align-items: flex-start;
        column-gap: 12px;
        padding: 22px 8.5px;
    }

    /* q-text : 20 → 18 / lh28 */
    .divorce-faq__q-text {
        font-size: 18px;
        line-height: 28px;
        letter-spacing: -0.36px;
    }

    /* icon : 19 → 16 (Figma 15.75) */
    .divorce-faq__icon {
        width: 16px;
        height: 16px;
        margin-top: 6px;
    }

    .divorce-faq__icon::before {
        width: 16px;
        height: 2px;
    }

    .divorce-faq__icon::after {
        width: 2px;
        height: 16px;
    }

    /* panel / answer : 좌우 여백 축소 · 16 → 14 / lh24 */
    .divorce-faq__panel {
        padding: 0 8.5px;
    }

    .divorce-faq__answer {
        padding: 0 50px 24px 0;
        font-size: 14px;
        line-height: 24px;
        letter-spacing: -0.08px;
    }

    /* 활성(열림) : 하단 여백 축소 */
    .divorce-faq__item.is-active .divorce-faq__trigger {
        padding-bottom: 16px;
    }
    /* [자주 묻는 질문 영역] divorce-faq 모바일 스타일 끝 */

    /* [상담 FAQ 영역] consult-faq 모바일 스타일 시작 (Figma 768/390 기준) */
    /* inner : 풀폭 단일 컬럼 · 좌우 여백 20 */
    .consult-faq__inner {
        padding-inline: 20px;
    }

    /* head : 헤더(라벨+타이틀+설명) → 아코디언 간격 (Figma 약 60) */
    .consult-faq__head {
        margin-bottom: 60px;
    }

    /* 라벨 : noto-serif 16 / lh22 (골드 유지) */
    .consult-faq .sec-head__label {
        font-size: 16px;
        line-height: 22px;
        letter-spacing: 0;
    }

    /* 타이틀 : Pretendard 34 / lh45 / 2줄(br-mo) */
    .consult-faq .sec-head__title {
        margin-top: 26px;
        font-size: 34px;
        line-height: 45px;
        letter-spacing: -1.36px;
    }

    /* 설명 : Pretendard 16 / lh26.5 / #0f0f0f (PC 골드·21 → 모바일 다크·16) */
    .consult-faq__desc {
        margin-top: 26px;
        font-weight: 400;
        font-size: 16px;
        line-height: 26.5px;
        letter-spacing: -0.16px;
        color: #0f0f0f;
    }

    /* list : 헤더 하단 간격은 head margin 으로 처리 → 기본 margin-top 제거 */
    .consult-faq__list {
        margin-top: 0;
    }

    /* trigger : 좌우 8.5 / 상하 25 (Figma inset 8.5) */
    .consult-faq .divorce-faq__trigger {
        align-items: flex-start;
        column-gap: 12px;
        padding: 25px 8.5px;
    }

    /* q-text : 22 → 18 / lh27 / ls-0.5 */
    .consult-faq .divorce-faq__q-text {
        font-size: 18px;
        line-height: 27px;
        letter-spacing: -0.5px;
    }

    /* icon : 17 → 16 (Figma 15.75) */
    .consult-faq .divorce-faq__icon {
        width: 16px;
        height: 16px;
        margin-top: 6px;
    }

    .consult-faq .divorce-faq__icon::before {
        width: 16px;
    }

    .consult-faq .divorce-faq__icon::after {
        height: 16px;
    }

    /* panel / answer : 좌우 8.5 · 15 → 14 / lh23 */
    .consult-faq .divorce-faq__panel {
        padding: 0 8.5px;
    }

    .consult-faq .divorce-faq__answer {
        padding-bottom: 25px;
        font-size: 14px;
        line-height: 23px;
        letter-spacing: -0.06px;
    }

    /* 활성(열림) : 하단 여백 축소 */
    .consult-faq .divorce-faq__item.is-active .divorce-faq__trigger {
        padding-bottom: 16px;
    }

    /* 줄바꿈 : 모바일 전용 br 노출 (타이틀·설명 2줄) */
    .consult-faq .br-mo {
        display: inline;
    }

    /* [전문센터 배너] consult-centers 모바일 스타일 시작 (Figma 768 기준) */
    /* PC 가로 3분할(패널·이미지·패널) → 세로 스택 : 이미지 상단 → 이혼 → 형사 */
    .consult-centers {
        margin-top: 56px;
        margin-inline: -20px;
    }

    .consult-centers__row {
        flex-direction: column;
        height: auto;
    }

    /* 이미지 : DOM상 두 패널 사이 → order로 최상단 배치 (Figma 상단 이미지 176) */
    .consult-centers__picture,
    .consult-centers__picture img {
        order: -1;
        width: 100%;
        height: 176px;
    }

    /* 패널 : 100% 폭 세로 스택 · 높이 159 · 좌측 20 패딩 */
    .consult-centers__panel,
    .consult-centers__panel--divorce,
    .consult-centers__panel--criminal {
        flex: none;
        width: 100%;
        min-height: 159px;
        padding: 27px 20px;
    }

    /* 타이틀 : 21 → 20 */
    .consult-centers__title {
        margin-bottom: 11px;
        font-size: 20px;
    }

    /* 설명 : 12 → 14 · 행간 23.8 (이혼 3줄 / 형사 2줄) */
    .consult-centers__desc {
        font-size: 14px;
        line-height: 23.8px;
    }

    /* 화살표 버튼 : 우측 20 · 패널 상단 89(하단부 배치) · 아이콘 25 */
    .consult-centers__panel--divorce .consult-centers__btn,
    .consult-centers__panel--criminal .consult-centers__btn {
        left: auto;
        right: 20px;
        top: 89px;
    }

    .consult-centers__btn img {
        width: 25px;
        height: 25px;
    }
    /* [전문센터 배너] consult-centers 모바일 스타일 끝 */
    /* [상담 FAQ 영역] consult-faq 모바일 스타일 끝 */

    /* [함께 짚어야 할 것 슬라이더 영역] related-topic 모바일 스타일 시작 (Figma 390 기준) */
    /* PC 2장/뷰 가로 카드 → 1장/뷰 세로형(포트레이트) 카드 슬라이더로 전환
       (슬라이드·자동롤링·dot·스와이프 동작은 JS가 카드 폭을 자동 계산하므로 그대로 유지) */
    .related-topic {
        margin-top: -50px;
        padding: 80px 0;
    }

    .related-topic__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    .related-topic__title {
        font-size: 24px;
        line-height: 34px;
        letter-spacing: -0.48px;
    }

    .related-topic__slider {
        margin-top: 24px;
    }

    /* track : 1장/뷰 (카드 사이 간격만 유지, 옆 카드 미리보기 없음) */
    .related-topic__track {
        column-gap: 14px;
    }

    .related-topic__slide {
        flex: 0 0 100%;
    }

    /* card : 가로형(180) → 세로형(350 x 306 비율) 풀폭 카드 */
    .topic-card {
        height: auto;
        aspect-ratio: 350 / 306;
        padding: 0 23px 28px;
        border-radius: 20px;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
    }

    /* 그라디언트 : 좌→우(PC) → 하→상(모바일) 로 전환, 하단 텍스트 가독성 확보 */
    .topic-card__thumb::after {
        background: linear-gradient(
            to top,
            rgba(25, 14, 1, 0.9) 0%,
            rgba(25, 14, 1, 0.65) 29%,
            rgba(25, 14, 1, 0) 62%
        );
    }

    .topic-card__title {
        font-size: 26px;
        line-height: 42px;
        letter-spacing: -1.3px;
    }

    .topic-card__desc {
        margin-top: 10px;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: -0.16px;
    }

    /* arrow : 47 → 27 축소, 우측 하단 유지 */
    .topic-card__arrow {
        right: 23px;
        bottom: 23px;
        width: 27px;
        height: 27px;
    }

    .topic-card__arrow img {
        width: 12px;
        height: 12px;
    }

    /* 줄바꿈: 모바일 전용 br 노출 (PC 줄바꿈과 분리) */
    .related-topic .br-mo {
        display: inline;
    }
    /* [함께 짚어야 할 것 슬라이더 영역] related-topic 모바일 스타일 끝 */

    /* [상간소송 진행 방식 영역] lawsuit-process 모바일 스타일 시작 (Figma 390 기준) */
    .lawsuit-process {
        padding-top: 50px;
    }

    .lawsuit-process__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* sec-head 축소 (라벨 16 / 타이틀 22·lh30, 좌측 정렬 유지) */
    .lawsuit-process .sec-head__label {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -0.32px;
    }

    .lawsuit-process .sec-head__title {
        margin-top: 10px;
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* step-label : 소송 단계 (골드) 17px·lh30, 상단 여백 축소 */
    .lawsuit-process__step-label {
        margin-top: 28px;
        font-size: 17px;
        line-height: 30px;
        letter-spacing: -0.34px;
    }

    /* item : 3열 축소 [넘버 38] [단계명 62] [설명 1fr] · 행 구분선 (하단) */
    .lawsuit-process__item {
        grid-template-columns: 38px 62px 1fr;
        min-height: 0;
    }

    /* 넘버칸 : 폭 축소 · 14px · 세로 중앙(좌측 11px) · 라이트 하이라인 */
    .lawsuit-process__num {
        display: flex;
        align-items: center;
        padding: 0 0 0 11px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        font-size: 14px;
        line-height: 20px;
        letter-spacing: -0.29px;
    }

    /* 단계명칸 : 폭 축소 · 15px · 상하좌우 중앙 정렬 · 구분선 */
    .lawsuit-process__step {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 4px;
        border-bottom: 1px solid #e5e3e0;
        font-size: 15px;
        line-height: 20px;
        letter-spacing: -0.3px;
        text-align: center;
        word-break: keep-all;
    }

    /* 설명칸 : 15px/lh21 · 좌측 간격 17 · 세로 여백 축소 · 구분선 */
    .lawsuit-process__desc {
        padding: 16px 0 16px 17px;
        border-bottom: 1px solid #e5e3e0;
        font-size: 15px;
        line-height: 21px;
        letter-spacing: -0.3px;
        word-break: keep-all;
    }

    /* 줄바꿈 : 모바일 전용 br 노출 (PC 줄바꿈과 분리) */
    .lawsuit-process .br-mo {
        display: inline;
    }
    /* [상간소송 진행 방식 영역] lawsuit-process 모바일 스타일 끝 */

    /* [지금 당장 해야할 것 영역] action-now 모바일 스타일 시작 (Figma 390 기준) */
    /* inner : 풀폭 + 좌우 여백 20 (Figma 콘텐츠 350 / 좌우 20) */
    .action-now__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 타이틀 : 골드-브라운 소제목 17px */
    .action-now__title {
        font-size: 17px;
        line-height: 30px;
        letter-spacing: -0.34px;
    }

    /* row : 라벨박스 63 + 설명 1fr · 높이는 내용에 맞춤(라벨박스 stretch) */
    .action-now__row {
        grid-template-columns: 63px 1fr;
        align-items: stretch;
        min-height: 0;
    }

    /* term : 라이트 박스 · 2줄 중앙 정렬(상하좌우) · 16px */
    .action-now__term {
        justify-content: center;
        padding-left: 0;
        font-size: 16px;
        line-height: 23px;
        letter-spacing: -0.32px;
        text-align: center;
    }

    /* desc : 15px/lh21 · 라벨박스와 15 간격 · 상하 여백 · 한글 단어 유지 */
    .action-now__desc {
        padding: 18px 0 18px 15px;
        font-size: 15px;
        line-height: 21px;
        letter-spacing: -0.3px;
        word-break: keep-all;
    }

    /* 줄바꿈 : 모바일 전용 br 노출 (라벨 "가압류 / 신청" 2줄) */
    .action-now .br-mo {
        display: inline;
    }
    /* [지금 당장 해야할 것 영역] action-now 모바일 스타일 끝 */

    /* [상속의 핵심 영역] inherit-core 모바일 스타일 시작 (Figma 768 기준) */
    /* 비교표는 .divorce-type__table 클래스를 공유하므로 표→세로 카드형 변환 규칙(thead 숨김 / 좌 구분셀 베이지 세로병합 / 우 [내용·기간] 스택 · 항목라벨 브라운 · 슬라이드 아님)을 그대로 상속. 아래는 이 표(td 2개)·헤더·카드 델타만 정의 */
    .inherit-core {
        padding-top: 50px;
    }

    .inherit-core__inner {
        padding-inline: 20px;
    }

    /* sec-head 축소 (라벨 16 / 타이틀 22·lh30, 좌측 정렬 유지) */
    .inherit-core .sec-head__label {
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -0.32px;
    }

    .inherit-core .sec-head__title {
        margin-top: 10px;
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    .inherit-core__table-wrap {
        margin-top: 20px;
    }

    /* 좌측 구분 셀(단순승인/상속포기/한정승인) : 이 표는 항목 td 가 3개가 아닌 2개(내용·기간)뿐이므로 세로 병합 스팬을 3→2행으로 재지정 (베이지 셀이 콘텐츠 높이에 정확히 맞도록) */
    .inherit-core__table tbody th {
        grid-row: 1 / span 2;
    }

    /* guide : 3열 균등 → 1열 세로 스택 (카드 간격 20px) */
    .inherit-core__guide {
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 20px;
        margin-top: 30px;
    }

    /* card : 풀폭 · 패딩 축소 (상단 44 / 좌우 15 / 하단 30) */
    .inherit-core__card {
        min-height: 0;
        padding: 40px 15px 30px;
    }

    /* card-note : PC 는 11px 인라인 축소 표기였으나 모바일에서는 본문과 동일 크기로 노출 (Figma 16px) */
    .inherit-core__card-note {
        font-size: inherit;
        letter-spacing: -0.32px;
        color: #231d16;
    }

    /* 줄바꿈 : 모바일 전용 br 노출 / PC 전용 br 숨김 */
    .inherit-core .br-mo {
        display: inline;
    }

    .inherit-core .br-pc {
        display: none;
    }
    /* [상속의 핵심 영역] inherit-core 모바일 스타일 끝 */

    /* [단계별 대응 안내 영역] stage-guide 모바일 스타일 시작 (Figma 390 기준) */
    .stage-guide {
        padding: 57px 0 40px;
    }

    /* inner : 1200 고정 → 100% + 좌우 20 패딩 (골드 라인이 화면폭 20 인셋으로 정렬) */
    .stage-guide__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* head : 중앙 정렬 · 좌측 장식 라인 제거 */
    .stage-guide__head {
        text-align: center;
    }

    .stage-guide__tag {
        justify-content: center;
        column-gap: 0;
        font-size: 18px;
        line-height: 24px;
        letter-spacing: -0.36px;
    }

    .stage-guide__tag-line {
        display: none;
    }

    .stage-guide__title {
        margin-top: 26px;
        font-size: 26px;
        line-height: 40px;
        letter-spacing: -0.52px;
        text-align: center;
    }

    /* list : [단계명 83] [설명 1fr] · 상단 골드 라인 유지 */
    .stage-guide__list {
        margin-top: 40px;
    }

    .stage-guide__item {
        grid-template-columns: 83px 1fr;
        column-gap: 0;
        min-height: 0;
        padding: 20px 0;
    }

    /* 단계명 : 좌측 20 인셋 · 설명(긴 셀) 기준 세로 가운데 정렬 */
    .stage-guide__label {
        align-self: center;
        padding-left: 20px;
        font-size: 18px;
        line-height: 23px;
        letter-spacing: -0.36px;
    }

    .stage-guide__desc {
        font-size: 16px;
        line-height: 25px;
        letter-spacing: -0.32px;
    }

    /* 줄바꿈: 모바일 전용 br 노출 */
    .stage-guide .br-mo {
        display: inline;
    }
    /* [단계별 대응 안내 영역] stage-guide 모바일 스타일 끝 */

    /* [고소대리 소개 영역] criminal-intro 모바일 스타일 시작 (Figma 390 기준) */
    .criminal-intro {
        padding-top: 50px;
    }

    /* inner : 1200 고정 → 100% + 좌우 20 패딩 (라인이 화면폭 20 인셋으로 정렬) */
    .criminal-intro__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 서브헤더 : 라벨 16 / 타이틀 22 (2줄) */
    .criminal-intro .sec-head__label {
        font-size: 16px;
        line-height: 20px;
    }

    .criminal-intro .sec-head__title {
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* list : 3열 그리드 → 1열 수직 스택 (카드 간 20 간격) */
    .criminal-intro__list {
        grid-template-columns: 1fr;
        row-gap: 20px;
        margin-top: 32px;
    }

    /* card : 풀폭 · 고정 최소높이 해제 · 상하 여백만 확보 (title 20 / desc 16 은 피그마 모바일과 동일하여 유지) */
    .criminal-intro__card {
        min-height: 0;
        padding: 28px 15px 30px;
    }

    /* 줄바꿈: 모바일 전용 br 노출 */
    .criminal-intro .br-mo {
        display: inline;
    }
    /* [고소대리 소개 영역] criminal-intro 모바일 스타일 끝 */

    /* [고소대리 단계 영역] criminal-step 모바일 스타일 시작 (Figma 390 기준) */
    .criminal-step {
        padding-top: 40px;
    }

    .criminal-step__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 라벨 : 진행 절차 17 */
    .criminal-step .sec-head__label {
        font-size: 17px;
        line-height: 24px;
    }

    .criminal-step__table-wrap {
        margin-top: 8px;
    }

    /* 열 폭 축소 : 넘버 38 / 단계명 62 (좌측 블록 100) · 설명 1fr (좌측 117 인셋 정렬) */
    .criminal-step__table .col-num  { width: 38px; }
    .criminal-step__table .col-name { width: 62px; }

    /* 행 높이는 설명 셀 내용에 맞춰 자동 (약 88) */
    .criminal-step__row {
        height: auto;
    }

    /* 넘버칸 : 좌측 11 인셋 · 14px · 세로 가운데 */
    .criminal-step__num {
        padding-left: 11px;
        font-size: 14px;
        line-height: 20px;
        vertical-align: middle;
    }

    /* 단계명칸 : 62 칸 중앙 정렬 · 15px · 2줄 대응 */
    /* .criminal-step__table th 공통규칙(text-align:left)보다 우선하도록 선택자 강화 */
    .criminal-step__table .criminal-step__name {
        padding-left: 0;
        text-align: center;
        font-size: 15px;
        line-height: 20px;
        vertical-align: middle;
    }

    /* 줄바꿈: 단계명 모바일 전용 br 노출 (증거/정리, 고소장/작성, 수사/대응) */
    .criminal-step .br-mo {
        display: inline;
    }

    /* 설명칸 : 좌측 17 인셋 · 15px · 상하 14 패딩으로 행 높이 확보 */
    .criminal-step__desc {
        padding: 14px 0 14px 17px;
        font-size: 15px;
        line-height: 21px;
        letter-spacing: -0.3px;
        vertical-align: middle;
    }
    /* [고소대리 단계 영역] criminal-step 모바일 스타일 끝 */

    /* [왜 초기 대응이 중요한가 영역] criminal-response 모바일 스타일 시작 (Figma 768 기준) */
    .criminal-response {
        padding-top: 50px;
    }

    /* inner : 1200 고정 → 100% + 좌우 20 패딩 */
    .criminal-response__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 서브헤더 : 라벨 16 / 타이틀 22 (2줄) */
    .criminal-response .sec-head__label {
        font-size: 16px;
        line-height: 20px;
    }

    .criminal-response .sec-head__title {
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* list : 3열 그리드 → 1열 수직 스택 (카드 간 19 간격) */
    .criminal-response__list {
        grid-template-columns: 1fr;
        row-gap: 19px;
        margin-top: 32px;
    }

    /* card : 풀폭 · 최소높이 해제 · 상하 여백만 확보 (title 20 / desc 16 은 피그마 모바일과 동일하여 유지) */
    .criminal-response__card {
        min-height: 0;
        padding: 27px 20px 30px;
    }
    /* [왜 초기 대응이 중요한가 영역] criminal-response 모바일 스타일 끝 */

    /* [수사 단계별 대응 전략 영역] criminal-stage 모바일 스타일 시작 (Figma 768 기준) */
    .criminal-stage {
        padding-top: 40px;
    }

    .criminal-stage__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 소제목 : 15 → 18 (피그마 모바일) */
    .criminal-stage__title {
        font-size: 18px;
        line-height: 34px;
    }

    .criminal-stage__table-wrap {
        margin-top: 8px;
    }

    /* 단계명 열 : 123 → 70 축소 (피그마 모바일 라벨 컬럼) */
    .criminal-stage__table .col-stage { width: 70px; }

    /* 단계명칸 : 70 칸 중앙정렬 · 16px · 2줄(경찰/수사) · 행 높이 내용 자동 */
    /* 공통규칙(th text-align:left)보다 우선하도록 선택자 강화 */
    .criminal-stage__table .criminal-stage__step {
        height: auto;
        padding: 18px 0;
        text-align: center;
        font-size: 16px;
        line-height: 23px;
    }

    /* 설명칸 : 좌측 12 인셋 · 15px/lh21 · 상하 18 패딩으로 행 높이 확보 */
    .criminal-stage__desc {
        height: auto;
        padding: 18px 0 18px 12px;
        font-size: 15px;
        line-height: 21px;
        letter-spacing: -0.3px;
    }

    /* 줄바꿈 : 단계명 모바일 전용 br 노출 (경찰/수사 · 검찰/단계) */
    .criminal-stage .br-mo {
        display: inline;
    }
    /* [수사 단계별 대응 전략 영역] criminal-stage 모바일 스타일 끝 */

    /* [화신의 발빠른 대응사례 영역] criminal-case 모바일 스타일 시작 (Figma 768 기준) */
    /* inner : 좌우 20 패딩 */
    .criminal-case__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 상단 여백 축소 (120 → 48) */
    .criminal-case {
        padding-top: 80px;
    }

    /* 서브헤더 : 라벨 16 / 타이틀 22 1줄 (좌측 정렬 유지) */
    .criminal-case .sec-head__label {
        font-size: 16px;
        line-height: 20px;
    }

    .criminal-case .sec-head__title {
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* flow : 3열 그리드 → 세로 1열 스택. order 로 카드 사이에 화살표 삽입 */
    .criminal-case__flow {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        column-gap: 0;
        row-gap: 0;
        margin-top: 24px;
    }

    .criminal-case__card--situation { order: 1; }
    .criminal-case__arrow--first    { order: 2; }
    .criminal-case__card--action    { order: 3; }
    .criminal-case__arrow--second   { order: 4; }
    .criminal-case__card--result    { order: 5; }

    /* card : 풀와이드 · 라운드 10 · 세로 흐름 (figma 143/143/116) */
    .criminal-case__card {
        min-height: 0;
        padding: 24px 20px;
        border-radius: 10px;
    }

    /* head : 19 → 20 / lh29 (figma) */
    .criminal-case__card-head {
        font-size: 20px;
        line-height: 29px;
        letter-spacing: -0.4px;
    }

    /* desc : 14 → 16 / lh25 (figma) */
    .criminal-case__card-desc {
        margin-top: 14px;
        font-size: 16px;
        line-height: 25px;
        letter-spacing: -0.32px;
    }

    /* desc(결과 강조) : 22 → 20 / lh33 (figma) */
    .criminal-case__card-desc--strong {
        font-size: 20px;
        line-height: 33px;
        letter-spacing: -0.4px;
    }

    /* arrow : 절대배치 해제 → 카드 사이 정적 배치 · 원 31 · 경계선 위 겹침(-10) */
    .criminal-case__arrow {
        position: relative;
        top: auto;
        left: auto;
        align-self: center;
        width: 31px;
        height: 31px;
        margin: -10px 0;
        z-index: 2;
        transform: none;
    }

    /* 셰브론 : 우측(›) → 하단(⌄) 방향 전환 */
    .criminal-case__arrow::after {
        transform: translate(-50%, -65%) rotate(135deg);
    }

    /* 줄바꿈 : 모바일 개행(br-mo) 노출 / PC 개행(br-pc) 숨김 (화신의 대응 카드) */
    .criminal-case .br-mo {
        display: inline;
    }

    .criminal-case .br-pc {
        display: none;
    }
    /* [화신의 발빠른 대응사례 영역] criminal-case 모바일 스타일 끝 */

    /* [피해자/피의자 전략 비교 영역] fraud-strategy 모바일 스타일 시작 (Figma 390 기준) */
    /* 섹션 상단 여백 축소 (90 → 60) · inner 좌우 20 여백 */
    .fraud-strategy {
        padding-top: 50px;
    }

    .fraud-strategy__inner {
        max-width: 100%;
        padding-inline: 20px;
    }

    /* 서브헤더 : 라벨 16 / 타이틀 22·30 (좌측 정렬 유지) */
    .fraud-strategy .sec-head__label {
        font-size: 16px;
    }

    .fraud-strategy .sec-head__title {
        font-size: 22px;
        line-height: 30px;
        letter-spacing: -0.44px;
    }

    /* groups : 세로 스택 유지 · 그룹 간격 40 유지 · 상단 여백 축소 (40 → 32) */
    .fraud-strategy__groups {
        row-gap: 40px;
        margin-top: 32px;
    }

    /* group : pill 태그를 중앙 정렬 (inline-flex → 중앙 배치) */
    .fraud-strategy__group {
        text-align: center;
    }

    /* tag : 중앙 배치 · 하단 간격 27 · 폰트 16 */
    .fraud-strategy__tag {
        margin-bottom: 27px;
        font-size: 16px;
    }

    /* cards : 2열 → 1열 세로 스택 (풀폭 카드, 간격 20) */
    .fraud-strategy__cards {
        grid-template-columns: 1fr;
        row-gap: 20px;
    }

    /* card : 풀폭 단일 카드 · min-height 해제 · 패딩 재조정 */
    .fraud-strategy__card {
        min-height: 0;
        padding: 28px 25px;
    }

    /* 줄바꿈 : 모바일 전용 개행(br-mo) 노출 */
    .fraud-strategy .br-mo {
        display: inline;
    }
    /* [피해자/피의자 전략 비교 영역] fraud-strategy 모바일 스타일 끝 */

    /* [상담 히어로 영역] consult-hero 모바일 스타일 시작 (Figma 390 기준) */
    /* 히어로 전체 높이 축소 : PC 720 → 모바일 438 (Figma 아트보드 높이) */
    .consult-hero,
    .consult-hero__inner {
        min-height: 438px;
    }

    /* 비주얼(법봉·저울) : Figma 532px 폭으로 좌우 블리드(overflow:hidden 로 클립) */
    .consult-hero__visual {
        top: 0;
        width: 136%;
        max-width: 532px;
    }

    /* 텍스트 : 하단 앵커링 — 이미지 하단 어두운 영역 위에 중앙 배치 */
    .consult-hero__text {
        top: auto;
        bottom: 44px;
        padding-inline: 24px;
    }

    /* 타이틀 : 40/60 → 32/43 (Figma) */
    .consult-hero__title {
        font-size: 32px;
        line-height: 43px;
        letter-spacing: -1.6px;
    }

    /* 설명 : 25/44 → 16/26.5 (Figma), 베이지(#e0d5c3) 유지 */
    .consult-hero__desc {
        margin-top: 16px;
        font-size: 16px;
        line-height: 26.5px;
        letter-spacing: -0.16px;
    }

    /* 줄바꿈 : 모바일 전용 개행(br-mo) 노출 — 문장 단위 2줄 */
    .consult-hero .br-mo {
        display: inline;
    }
    /* [상담 히어로 영역] consult-hero 모바일 스타일 끝 */

    /* [상담 신청 영역] consult-apply 모바일 스타일 시작 (Figma 390 기준)
       스택 구조/제목 노출/항목 순서는 태블릿(1024) 블록에서 이미 적용 → 여기선 치수만 조정 */
    /* 폼 패널 : 좌우 20 패딩 (Figma 입력필드 폭 350 = 390-40) */
    .consult-apply__form-panel {
        padding: 48px 20px 56px;
    }

    .consult-apply__eyebrow {
        font-size: 15px;
    }

    .consult-apply__title {
        margin-top: 6px;
        font-size: 26px;
        line-height: 1.35;
        letter-spacing: -1.3px;
    }

    .consult-form {
        margin-top: 32px;
    }

    .consult-form__field {
        margin-top: 20px;
    }

    /* 거주지역·상담분야 : PC 2단 → 모바일 세로 스택 (Figma 풀폭) */
    .consult-form__row {
        flex-direction: column;
        row-gap: 20px;
        margin-top: 20px;
    }

    /* 입력필드 공통 : h44 · radius8 · 폰트16 (Figma h40 / r6 / 16px) */
    .consult-form__input,
    .consult-form .consult-select__toggle {
        height: 44px;
        padding: 0 14px;
        border-radius: 8px;
        font-size: 16px;
    }

    .consult-form .consult-select__value,
    .consult-form .consult-select__option {
        font-size: 16px;
    }

    .consult-form__textarea {
        height: 118px;
        padding: 12px 14px;
    }

    /* 개인정보 동의 : 중앙 정렬 · 2줄 (Figma). 필수 체크박스는 기능 유지 위해 노출 */
    .consult-form__agree {
        justify-content: center;
        margin-top: 28px;
    }

    .consult-form__agree-label {
        font-size: 14px;
        line-height: 1.5;
        text-align: center;
    }

    /* 제출 버튼 : 풀폭 알약 + '동의하고' 접두 노출 (Figma 텍스트) */
    .consult-form__submit {
        width: 100%;
        justify-content: center;
        column-gap: 14px;
        margin-top: 26px;
        padding: 22px 28px;
    }

    .consult-form__submit-text {
        font-size: 17px;
    }

    .consult-form__submit-pre {
        display: inline;
        vertical-align: baseline;
    }

    /* 안내 정보 : 좌우 30 패딩 (Figma 제목/아이콘 left 30) */
    .consult-apply__info {
        gap: 40px;
        padding: 40px 30px 52px;
    }

    .consult-apply__info-title {
        font-size: 26px;
        letter-spacing: -0.52px;
    }

    /* 아이콘 18 / 라벨 18 / 값 20 / 대표번호 34 / 주소 20 / 안내문 16 (Figma) */
    .consult-info__icon {
        width: 18px;
        height: 18px;
        -webkit-mask-size: 16px auto;
        mask-size: 16px auto;
    }

    .consult-info__label {
        column-gap: 8px;
        font-size: 18px;
        letter-spacing: -0.9px;
    }

    .consult-info__value {
        margin-top: 16px;
        padding-left: 28px;
        font-size: 20px;
    }

    .consult-info__value--addr {
        margin-top: 14px;
        font-size: 20px;
        line-height: 1.5;
    }

    .consult-info__value--tel,
    .consult-info__tel {
        font-size: 34px;
    }

    .consult-info__note {
        margin-top: 12px;
        padding-left: 28px;
        font-size: 16px;
        line-height: 22.4px;
    }

    /* 모바일 전용 개행(br-mo) 노출 — 동의 문구 문장 단위 2줄 */
    .consult-apply .br-mo {
        display: inline;
    }
    /* [상담 신청 영역] consult-apply 모바일 스타일 끝 */
}