@charset "utf-8";

/* 색 설정 */
:root {
    --main-color: #a78d58;
    --black-color : #222;
    --white-color : #fff
}

/* 스크롤 커스텀 */
html::-webkit-scrollbar {width: 8px;}
html::-webkit-scrollbar-thumb {background-color: var(--main-color); border-radius: 10px;}

/* 드래그 블록 커스텀 */
::selection { background-color:var(--main-color); color:#fff; }


/* default */
*{
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    color : inherit;
    box-sizing: border-box;
    letter-spacing: inherit;
    line-height: inherit;
}

body{ font-family: 'Pretendard', sans-serif; font-weight:400; font-size: 16px; letter-spacing: -0.04em; }
section{ display:block; }
a{ color:inherit; }
a:hover{ text-decoration: none; color: inherit;  }

.inner{ width:1200px; margin:0 auto;  }

.paging_box{ margin-top: 20px; padding:10px 0; display:flex; align-items: center; justify-content: center; }
.paging_box .pg_page{ background-color:#FFF; border:1px solid #e6e6e6; }
.paging_box .pg_current{ background-color: #0F1C2E; color:#fff; border:1px solid #0F1C2E; }

select{
    -webkit-appearance: none; -moz-appearance: none;  appearance: none;
    background: url('../img/common/select-icon.png') no-repeat 98% 50% #fff; 
}
select::-ms-expand{ display:none; }
p{ word-break: keep-all; }

/* default - 반응형 */
@media screen and (max-width: 1250px) {
    .inner{ width:100%; padding: 0 30px; }
}
@media screen and (max-width: 650px) {
    .inner{ padding: 0 20px; }
    .paging_box{ font-size: 13px; }
}


/* ================================================
   법무법인 화담 - 메인페이지
================================================ */
:root {
    --gold: #a78d58;
    --gold-light: #ceb582;
    --gold-deep: #685b42;
    --brown: #917962;
    --dark: #222;
    --beige: #eeeae7;
    --footer-bg: #1b1917;

    /* 타이포 계층 (브레이크포인트에서 변수만 재정의) */
    --fs-display: 60px;  /* 히어로 타이틀 */
    --fs-h2: 46px;       /* 섹션 타이틀 */
    --fs-h3: 30px;       /* 카드·서브 타이틀 */
    --fs-h4: 24px;       /* 소제목 */
    --fs-lg: 20px;       /* 본문 강조 */
    --fs-md: 18px;       /* 본문 */
    --fs-base: 16px;     /* 기본 */
    --fs-sm: 14px;       /* 라벨·캡션 (모바일 최소값) */
    --fs-xs: 12px;       /* 최소 문구 (모바일에서 14px로 승격) */
    --fs-quote: 140px;   /* 인사말 따옴표 장식 */
    --fs-stamp: 26px;    /* 승소 스탬프 */

    /* 간격·이미지 비율 스케일 */
    --sp-scale: 1;
    --img-scale: 1;
    --logo-scale: 1;   /* 헤더 로고 축소 비율 */
}

/* :root 타이포·스케일 - 반응형 (전역 공유) */
@media screen and (max-width: 1250px) {
    :root{
        --fs-display: 48px; --fs-h2: 38px; --fs-h3: 26px; --fs-h4: 22px;
        --fs-lg: 18px; --fs-md: 17px; --fs-base: 15px;
        --fs-quote: 110px; --fs-stamp: 24px;
        --sp-scale: 0.8; --img-scale: 0.85; --logo-scale: 0.92;
    }
}
@media screen and (max-width: 960px) {
    :root{
        --fs-display: 40px; --fs-h2: 32px; --fs-h3: 24px; --fs-h4: 20px;
        --fs-lg: 17px; --fs-md: 16px; --fs-base: 15px;
        --fs-quote: 90px; --fs-stamp: 22px;
        --sp-scale: 0.65; --img-scale: 0.7; --logo-scale: 0.85;
    }
}
@media screen and (max-width: 650px) {
    :root{
        --fs-display: 28px; --fs-h2: 22px; --fs-h3: 20px; --fs-h4: 18px;
        --fs-lg: 16px; --fs-md: 15px; --fs-base: 15px; --fs-sm: 15px; --fs-xs: 15px; /* 모바일 최소 15px */
        --fs-quote: 70px; --fs-stamp: 18px;
        --sp-scale: 0.5; --img-scale: 0.55; --logo-scale: 0.75;
    }
}

/* 공통 */
.gold_btn{
    display: flex; align-items: center; justify-content: center; gap: 10px;
    width: 444px; height: 70px; border: 0; border-radius: 10px; cursor: pointer;
    background: linear-gradient(90deg, var(--gold-light) 0%, var(--gold-deep) 100%);
    box-shadow: 4px 10px 8px 0 rgba(0,0,0,0.25);
    font-size: var(--fs-md); font-weight: 800; color: #fff; letter-spacing: -0.04em;
}
.gold_btn img{ width: 6px; }
.gold_btn.sm{ width: 196px; height: 44px; font-size: var(--fs-base); border-radius: 10px; }
.sec_tit_box h3{ display: flex; align-items: center; font-size: var(--fs-h2); font-weight: 800; color: var(--dark); letter-spacing: -0.04em; line-height: 1.17; }
.sec_tit_box h3 .bar{ display: inline-block; width: 6px; height: 0.87em; margin-right: 14px; background-color: var(--brown); }
.sec_tit_box h3 .light{ font-weight: 400; margin-right: 12px; } /* flex라 스팬 사이 공백이 사라져 여백으로 대체 */
.sec_tit_box > p{ margin-top: 8px; padding-left: 20px; font-size: var(--fs-lg); font-weight: 600; color: #555; line-height: 1.6; letter-spacing: -0.04em; }
.sec_tit_box > p b{ font-weight: 800; }
/* swiper.min.css의 .swiper-pagination-progressbar(absolute/파랑) 오버라이드를 위해 클래스 2개로 특이도 확보 */
.slide_progress,
.slide_progress.swiper-pagination-progressbar{ position: relative; width: 100%; height: 5px; border-radius: 5px; background-color: #dedfe0; overflow: hidden; }
.slide_progress.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background-color: var(--gold); border-radius: 5px; }

/* 공통 - 반응형 */
@media screen and (max-width: 650px) {
    .gold_btn{ height: 54px; }
}

/* 헤더 */
header{
    position: fixed; top: 0; left: 0; width: 100%; height: 80px; z-index: 100;
    background-color: rgba(255,255,255,0.1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(145,151,155,0.6);
    transition: background-color 0.3s;
}
header.on{ background-color: rgba(20,20,20,0.85); }
.header_inner{ display: flex; align-items: center; justify-content: space-between; width: 1200px; height: 100%; margin: 0 auto; }
.logo a{ display: flex; align-items: center; }
.logo .logo_symbol{ width: calc(26px * var(--logo-scale)); }
.logo .logo_text{ width: calc(103px * var(--logo-scale)); margin-left: calc(11px * var(--logo-scale)); }
.logo .logo_hanja{ width: calc(65px * var(--logo-scale)); margin-left: calc(9px * var(--logo-scale)); }
.gnb ul{ display: flex; align-items: center; }
.gnb li{ display: flex; align-items: center; }
.gnb li + li::before{ content: '/'; margin: 0 18px; font-size: var(--fs-sm); font-weight: 400; color: rgba(255,255,255,0.5); }
.gnb li a{ display: flex; align-items: center; font-size: var(--fs-base); font-weight: 700; color: #fff; letter-spacing: -0.02em; }
.gnb li a:hover{ color: var(--gold-light); }

/* 모바일 햄버거 + 드로어 메뉴 (650 이하에서 노출) */
.ham_btn{ display: none; flex-direction: column; justify-content: center; gap: 5px; width: 30px; height: 30px; padding: 0; border: 0; background: none; cursor: pointer; }
.ham_btn span{ display: block; width: 22px; height: 2px; margin: 0 auto; background-color: #fff; border-radius: 2px; transition: transform 0.3s, opacity 0.3s; }
body.mm_open .ham_btn span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
body.mm_open .ham_btn span:nth-child(2){ opacity: 0; }
body.mm_open .ham_btn span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }
.mobile_menu_dim{
    position: fixed; inset: 0; z-index: 98; background-color: rgba(0,0,0,0.55);
    opacity: 0; visibility: hidden; transition: opacity 0.35s, visibility 0.35s;
}
body.mm_open .mobile_menu_dim{ opacity: 1; visibility: visible; }
.mobile_menu{
    position: fixed; top: 0; right: 0; z-index: 99;
    display: flex; flex-direction: column; width: 264px; height: 100%; padding: 110px 30px 40px;
    background-color: var(--footer-bg); border-left: 1px solid rgba(206,181,130,0.35);
    transform: translateX(100%); transition: transform 0.35s;
}
body.mm_open .mobile_menu{ transform: translateX(0); }
.mobile_menu li + li{ border-top: 1px solid rgba(255,255,255,0.08); }
.mobile_menu li a{ display: block; padding: 16px 4px; font-size: var(--fs-md); font-weight: 700; color: #fff; letter-spacing: -0.02em; }
.mobile_menu li a:hover{ color: var(--gold-light); }
/* 드로어 안 플로팅 퀵메뉴 (기존 퀵메뉴와 동일한 화이트 버튼 톤) */
.mobile_menu .mm_quick{ display: flex; flex-direction: column; gap: 10px; margin-top: auto; }
.mobile_menu .mm_quick a{
    display: flex; align-items: center; gap: 12px; padding: 13px 18px;
    background-color: #fff; border-radius: 8px;
    font-size: var(--fs-sm); font-weight: 800; color: #35281a; letter-spacing: -0.04em;
}
.mobile_menu .mm_quick a img{ width: 20px; opacity: 0.8; }

/* 헤더 - 반응형 */
@media screen and (max-width: 1250px) {
    .header_inner{ width: 100%; padding: 0 30px; }
}
@media screen and (max-width: 720px) {
    .header_inner{ padding: 0 20px; }
    .gnb{ display: none; }
    .ham_btn{ display: flex; }
}

/* 퀵메뉴 */
.quick_menu{ position: fixed; bottom: 30px; right: 0; z-index: 90; width: 151px; }
.quick_menu .qm_list{ background-color: #fff; border-radius: 13px 0 0 0; overflow: hidden; max-height: 300px; transition: max-height 0.4s; }
.quick_menu.close .qm_list{ max-height: 0; }
.quick_menu .qm_list li{ position: relative; }
.quick_menu .qm_list li + li::before{ content: ''; position: absolute; top: 0; left: 13px; width: 126px; height: 1px; background-color: #e4e4e4; }
.quick_menu .qm_list a{ display: flex; align-items: center; height: 88px; padding-left: 27px; }
.quick_menu .qm_list img{ opacity: 0.8; }
.quick_menu .qm_list li:nth-child(1) img{ width: 27px; }
.quick_menu .qm_list li:nth-child(2) img{ width: 25px; }
.quick_menu .qm_list li:nth-child(3) img{ width: 28px; }
.quick_menu .qm_list span{ margin-left: 12px; font-size: var(--fs-base); font-weight: 800; color: #35281a; letter-spacing: -0.04em; }
.quick_menu .qm_toggle{ display: flex; align-items: center; justify-content: center; width: 100%; height: 40px; border: 0; background-color: var(--gold); border-radius: 0 0 0 13px; }
.quick_menu .qm_toggle img{ width: 20px; transition: transform 0.3s; }
.quick_menu.close .qm_toggle{ border-radius: 13px 0 0 13px; }
.quick_menu.close .qm_toggle img{ transform: rotate(180deg); }

/* 퀵메뉴 - 반응형 */
@media screen and (max-width: 650px) {
    .quick_menu{ display: none; }
}

/* 메인 히어로 */
.main_hero{
    position: relative; height: 100vh; min-height: 900px; background-color: var(--dark);
    background-image:
        linear-gradient(240deg, rgba(0,0,0,0.8) 34.5%, rgba(102,102,102,0.8) 74.4%),
        linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.4) 100%),
        url('../img/main/hero_bg.png');
    background-size: cover; background-position: center;
}
.hero_flex{ display: flex; align-items: center; justify-content: space-between; height: 100%; padding-top: 80px; }
.hero_txt .hero_sub{ display: flex; align-items: center; font-size: var(--fs-h3); font-weight: 300; color: #fff; letter-spacing: -0.02em; }
.hero_txt .hero_sub b{ font-weight: 600; }
.hero_txt .hero_sub .bar{ display: inline-block; width: 4px; height: 1.14em; margin-right: 13px; background-color: var(--gold); }
.hero_txt .hero_tit{
    margin-top: 17px; padding-left: 17px;
    font-size: var(--fs-display); font-weight: 500; line-height: 1.14; letter-spacing: -0.02em;
    background: linear-gradient(90deg, #fff 0%, var(--gold-light) 100%);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
.hero_txt .hero_tit b{ font-weight: 800; }

/* 메인 히어로 - 반응형 */
@media screen and (max-width: 1250px) {
    .main_hero{ height: auto; min-height: 0; }
    .hero_flex{ flex-direction: column; justify-content: center; height: auto; gap: calc(70px * var(--sp-scale)); padding: 160px 30px 90px; }
    .hero_txt{ display: flex; flex-direction: column; align-items: center; width: 100%; text-align: center; }
}
@media screen and (max-width: 650px) {
    .hero_flex{ padding: 130px 20px 70px; }
    .hero_txt{ justify-content: flex-start; width: 100%; text-align: left; }
    .hero_txt .hero_sub,
    .hero_txt .hero_tit{ width: 100%; }
    .hero_txt .hero_sub b{ display: block; } /* '가장 가까운 파트너' 줄바꿈 */
    .hero_txt .hero_sub .bar{ height: 2.2em; }
    .hero_txt .hero_tit{ padding-left: 0; }
}

/* 빠른 상담신청 카드 */
.consult_card{
    position: relative; width: 551px; padding:30px;
    background-color: var(--dark); border: 4px solid var(--gold-light); border-radius: 18px;
    box-shadow: 10px 14px 24px 0 rgba(0,0,0,0.3);
}
/* 카드 좌상단 라벨 : 피그마 기준 카드 외곽에서 (50.3, 41.7) → border 4px 제외 */
.consult_card .card_label{ position: absolute; top: calc(38px * var(--sp-scale)); left: calc(46px * var(--sp-scale)); font-size: var(--fs-sm); font-weight: 600; color: #fff; line-height: 1.2; letter-spacing: -0.04em; }
.card_symbol{ display: block; width: 26px; margin: 0 auto; }
.consult_card .card_symbol{ margin-top: calc(84px * var(--sp-scale)); }
.card_tit{ margin-top: 10px; font-size: var(--fs-h3); font-weight: 500; color: #fff; text-align: center; letter-spacing: -0.04em; line-height: 1.2; }
.card_tit b{ font-weight: 800; }
.consult_card .field_list{ display: flex; flex-wrap: wrap; gap: 8.6px 10.5px; margin-top: 22px; }
.consult_card .field_list li{ width: calc(50% - 5.3px); }
.consult_card .field_list label{
    display: flex; align-items: center; height: 54px; padding-left: 17px;
    background-color: var(--dark); border: 1px solid #fff; border-radius: 4px; cursor: pointer;
    font-size: var(--fs-md); font-weight: 500; color: #fff; letter-spacing: -0.04em;
    transition: border-color 0.3s, background-color 0.3s;
}
.consult_card .field_list input{ display: none; }
.consult_card .field_list .chk{
    width: 16px; height: 16px; margin-right: 10px; flex-shrink: 0;
    background: url('../img/main/icon_check.svg') no-repeat center / contain;
    transition: background-image 0.2s;
}
.consult_card .field_list input:checked ~ .chk{ background-image: url('../img/main/icon_check_on.svg'); }
.consult_card .field_list label:has(input:checked){ border-color: var(--gold-light); background-color: rgba(206,181,130,0.15); }
.consult_card .gold_btn{ width: 100%; margin-top: 47px; }

/* 상담 카드 단계형 위저드 */
.consult_card{ display: flex; flex-direction: column; min-height: calc(757px * var(--sp-scale)); }
.consult_card .consult_step{ display: none; }
/* transform 애니메이션은 absolute(.card_label) 기준을 바꾸므로 opacity 페이드만 사용 */
.consult_card .consult_step.active{ display: flex; flex-direction: column; flex: 1; animation: stepFade 0.4s ease-in-out; }
@keyframes stepFade{
    0%{ opacity: 0; }
    100%{ opacity: 1; }
}
/* 단계 전환 시 카드(섹션) 높이 고정 : JS(lockStepHeights)가 가장 큰 단계 높이를 --step-min-h로 지정 */
.consult_card .consult_step.active{ min-height: var(--step-min-h, 0px); }
.consult_card .field_list li.wide{ width: 100%; }
/* 질문 단계 옵션 : 그리드 1fr 행으로 모든 버튼 높이를 가장 큰 버튼에 맞춤 */
.consult_card .step_options{ display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 1fr; }
.consult_card .step_options li{ width: auto; display: flex; }
.consult_card .step_options li.wide{ grid-column: 1 / -1; }
.consult_card .step_options label{ width: 100%; height: auto; padding: 15px 8px 15px 17px; line-height: 1.2; }
.consult_card .step_nav{ display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 40px; }
.consult_card .step_nav button{
    display: flex; align-items: center; justify-content: center; gap: 8px;
    width: 97px; height: 37px; border: 0; border-radius: 4px; cursor: pointer;
    box-shadow: 4px 10px 8px 0 rgba(0,0,0,0.25);
    font-size: var(--fs-base); font-weight: 800; color: #fff; letter-spacing: -0.02em;
}
.consult_card .step_nav button img{ width: 6px; }
.consult_card .step_nav .step_prev_btn{ background-color: #7f7f7f; }
.consult_card .step_nav .step_prev_btn img{ transform: scaleX(-1); }
.consult_card .step_nav .step_next_btn{ background: linear-gradient(90deg, var(--gold-light) 0%, var(--gold-deep) 100%); }

/* 마지막 단계 (신청완료) */
.consult_card .final_tit{ margin-top: 24px; line-height: 1.24; }
.consult_card .final_tit b{ font-weight: 800; }
.consult_card .final_form{ margin-top: 30px; }
.consult_card .final_item + .final_item{ margin-top: 14px; }
.consult_card .final_item label{ display: block; font-size: var(--fs-sm); font-weight: 700; color: #fff; line-height: 1.57; letter-spacing: -0.02em; }
.consult_card .final_item label em{ font-style: normal; font-weight: 800; color: red; }
.consult_card .final_item input{
    width: 100%; height: 54px; padding: 0 16px;
    background-color: var(--dark); border: 1px solid #fff; border-radius: 4px;
    font-size: var(--fs-base); font-weight: 500; color: #fff; letter-spacing: -0.02em;
}
.consult_card .final_desc{ margin-top: calc(36px * var(--sp-scale)); font-size: var(--fs-lg); font-weight: 500; color: #fff; text-align: center; line-height: 1.32; letter-spacing: -0.04em; }
.consult_card .final_desc b{ font-weight: 800; }
.consult_card .final_privacy{
    display: flex; align-items: center; justify-content: center;
    margin-top: 20px; cursor: pointer;
}
.consult_card .final_privacy input{ display: none; }
.consult_card .final_privacy .chk{
    width: 15px; height: 15px; flex-shrink: 0;
    background: url('../img/main/check_privacy_off.svg') no-repeat center / contain;
}
.consult_card .final_privacy input:checked ~ .chk{ background-image: url('../img/main/check_privacy.svg'); }
.consult_card .final_privacy .txt{
    margin-left: 4px; font-size: var(--fs-xs); font-weight: 700; color: #fff;
    letter-spacing: -0.02em; text-decoration: underline; text-underline-offset: 2px;
}
.consult_card .consult_step .gold_btn{ margin-top: auto; }
.consult_card .consult_step[data-step="final"] .consult_done_btn{ margin-top: 20px; }
/* 시작하기 버튼 위 최소 여백 : min-height가 풀리는 반응형에서 auto 마진이 0이 되는 것 보완 */
.consult_card .consult_step[data-step="field"] .field_list{ margin-bottom: calc(47px * var(--sp-scale)); }

/* 빠른 상담신청 카드 - 반응형 */
@media screen and (max-width: 650px) {
    .consult_card{ width: 100%; min-height: 0; }
    .consult_card .field_list label{ height: auto; min-height: 48px; padding: 12px 8px 12px 12px; }
    .consult_card .step_options{ grid-template-columns: 1fr; }
}

/* 선택하는 이유 밴드 */
.reason_band{ position: relative; padding: 100px 0; background-color: var(--dark); overflow: hidden; }
.reason_band::before,
.reason_band::after{ content: ''; position: absolute; left: 0; width: 100%; height: 2px; background: linear-gradient(90deg, #ccb481 0%, #665a41 100%); z-index: 2; }
.reason_band::before{ top: 0; }
.reason_band::after{ bottom: 0; }
.reason_band .band_photo{
    position: absolute; top: 0; right: 0; width: calc(791px * var(--img-scale)); height: 100%;
    background: linear-gradient(270deg, rgba(34,34,34,0.6) 0%, var(--dark) 96%), url('../img/main/reason_band_photo.png') center / cover;
}
.reason_band .band_txt{ position: relative;  text-align: center; z-index: 1; }
.reason_band .band_txt h3{ font-size: var(--fs-h2); font-weight: 500; color: #fff; line-height: 1.4; letter-spacing: -0.04em; }
.reason_band .band_txt h3 b{ font-weight: 800; }
.reason_band .band_line{ display: block; width: 40px; margin: 20px auto 0; }
.reason_band .band_txt > p{ margin-top: 18px; font-size: var(--fs-lg); font-weight: 500; color: #fff; line-height: 1.4; letter-spacing: -0.04em; }
.reason_band .band_txt > p b{ font-weight: 800; }

/* 선택하는 이유 밴드 - 반응형 */
@media screen and (max-width: 1250px) {
    .reason_band{ padding: 80px 0; }
}
@media screen and (max-width: 960px) {
    .reason_band{ padding: 60px 0; }
}
@media screen and (max-width: 650px) {
    .reason_band{ padding: 30px 0; }
}

/* 인사말 + 이유 카드 */
.main_about{ position: relative; background-color: var(--beige); padding-bottom: calc(87px * var(--sp-scale)); overflow: hidden; }
.main_about::before{
    content: ''; position: absolute; inset: 0; z-index: 0;
    background: url('../img/main/beige_texture.png') center / cover; opacity: 0.06; pointer-events: none;
}
/* 대표 이미지 : 피그마 시안 1044.7x1567, 페이지 x745.76 / 섹션 상단 -90px (섹션 overflow hidden으로 클리핑) */
.main_about .about_photo{
    position: absolute; top: calc(-90px * var(--img-scale)); left: calc(50% - 214px * var(--img-scale)); z-index: 1;
    width: calc(1045px * var(--img-scale)); height: auto;
}
.main_about .inner{ position: relative; z-index: 2; }
.about_quote{ position: relative; padding-top: calc(163px * var(--sp-scale)); }
.about_quote .quote_mark{ display: block; height: 0.59em; font-family: 'ONE-Mobile-POP', 'Pretendard', sans-serif; font-size: var(--fs-quote); line-height: 1; color: var(--brown); letter-spacing: -0.04em; }
.about_quote h3{ font-size: var(--fs-h2); font-weight: 700; color: var(--dark); line-height: 1.17; letter-spacing: -0.04em; }
.about_quote h3 .light{ font-weight: 400; }
.about_quote h3 b{ font-weight: 800; color: var(--brown); }
.about_quote .quote_desc{ display: flex; margin-top: calc(36px * var(--sp-scale)); }
.about_quote .quote_desc .bar{ width: 4px; flex-shrink: 0; height: 87px; margin-top: 5px; background-color: var(--brown); }
.about_quote .quote_desc p{ margin-left: 29px; font-size: var(--fs-lg); font-weight: 600; color: var(--dark); line-height: 1.6; letter-spacing: -0.04em; }
.about_quote .quote_desc p b{ font-weight: 800; }

.reason_slider{ position: relative; margin-top: calc(99px * var(--sp-scale)); z-index: 2; }
.reason_slider .reasonSwiper .swiper-wrapper{ transition-timing-function: linear; } /* 무한 자동 슬라이드 등속 이동 */
/* 카드 높이 통일 : 슬라이드 height:auto -> flex stretch, rc_desc가 flex:1로 잔여 높이 흡수 */
.reason_slider .swiper-slide{ width: calc(500px * var(--img-scale)); height: auto; display: flex; flex-direction: column; }
.reason_card .rc_img{ height: calc(244px * var(--img-scale)); overflow: hidden; }
.reason_card .rc_img img{ width: 100%; height: 100%; object-fit: cover; }
.reason_card .rc_caption{ display: flex; flex-direction: column; flex: 1; padding: 20px 32px 24px; background: url('../img/main/caption_bg1.svg') center / cover; }
.reason_card .rc_tit{ display: flex; align-items: center; font-size: var(--fs-h4); font-weight: 800; color: #fff; line-height: 1.4; letter-spacing: -0.02em; }
.reason_card .rc_tit .bar{ display: inline-block; width: 4px; height: 1.25em; margin-right: 12px; background-color: #c9b17f; }
.reason_card .rc_desc{ flex: 1; margin-top: 4px; padding-left: 16px; font-size: var(--fs-base); font-weight: 500; color: #fff; line-height: 1.4; letter-spacing: -0.04em; }

/* 인사말 + 이유 카드 - 반응형 */
@media screen and (max-width: 1250px) {
    .main_about .about_photo{ opacity: 0.3; }
}
@media screen and (max-width: 650px) {
    .main_about .about_photo{ display: none; }
    .reason_card .rc_caption{ padding: 16px 16px; }
    .reason_card .rc_tit .bar{ width: 3px; }
    .reason_card .rc_desc{ padding-left: 0; }
    .reason_card .rc_desc br{ display: none; }
}

/* 상담신청 */
.main_consult{ position: relative; background-color: var(--dark); padding: calc(106px * var(--sp-scale)) 0 calc(83px * var(--sp-scale)); overflow: hidden; }
.main_consult .consult_bg{
    position: absolute; top: 0; left: 0; width: 1058px; height: 100%; z-index: 0;
    background: url('../img/main/dark_side_photo.png') left center / cover; opacity: 0.1;
}
.main_consult::before{
    content: ''; position: absolute; top: 0; left: 0; width: 1058px; height: 100%; z-index: 1;
    background: linear-gradient(to left, var(--dark) 0%, rgba(34,34,34,0) 71.7%);
}
.main_consult .inner{ position: relative; z-index: 2; }
.consult_tit{ font-size: var(--fs-h2); font-weight: 400; color: #fff; text-align: center; line-height: 1.2; letter-spacing: -0.04em; }
.consult_tit b{display: block; font-weight: 800; color: var(--gold); }

.consult_form_card{
    width: 690px; margin: calc(31px * var(--sp-scale)) auto 0; padding: calc(45px * var(--sp-scale)) calc(51px * var(--sp-scale)) calc(49px * var(--sp-scale));
    background-color: var(--dark); border: 4px solid var(--gold-light); border-radius: 18px;
    box-shadow: 7px 13px 16px 0 rgba(0,0,0,0.25);
}
.consult_form{ margin-top: 28px; }
.consult_form .form_row.half_row{ display: flex; gap: 11px; }
.consult_form .form_row.half_row .form_item{ flex: 1; }
.consult_form .form_item{margin-top: 12px;}
.consult_form .form_item label{ display: block; font-size: var(--fs-sm); font-weight: 700; color: #fff; line-height: 1.57; letter-spacing: -0.02em; }
.consult_form .form_item label em{ font-style: normal; font-weight: 800; color: red; }
.consult_form .form_item input,
.consult_form .form_item select,
.consult_form .form_item textarea{
    width: 100%; height: 40px; padding: 0 14px;
    background-color: var(--dark); border: 2px solid #363636; border-radius: 4px;
    font-size: var(--fs-sm); font-weight: 500; color: #fff; letter-spacing: -0.02em;
}
.consult_form .form_item input.lg{ height: 50px; }
/* 상담분야 커스텀 드롭다운 */
.consult_form .custom_select{ position: relative; }
.consult_form .custom_select select{ display: none; }
.consult_form .custom_select .cs_toggle{
    width: 100%; height: 40px; padding: 0 34px 0 14px; text-align: left;
    background: url('../img/main/select_arrow.svg') no-repeat right 16px center / 10px var(--dark);
    border: 2px solid #363636; border-radius: 4px; cursor: pointer;
    font-size: var(--fs-sm); font-weight: 500; color: #fff; letter-spacing: -0.02em;
    transition: border-color 0.3s;
}
.consult_form .custom_select.open .cs_toggle{ border-color: var(--gold-light); }
.consult_form .custom_select .cs_toggle:hover{ border-color: var(--gold-light); }
.consult_form .custom_select .cs_list{
    position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 20;
    max-height: 240px; overflow-y: auto;
    background-color: var(--dark); border: 2px solid #363636; border-radius: 4px;
    box-shadow: 4px 10px 16px 0 rgba(0,0,0,0.4);
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity 0.25s, transform 0.25s, visibility 0.25s;
}
.consult_form .custom_select.open .cs_list{ opacity: 1; visibility: visible; transform: translateY(0); }
.consult_form .custom_select .cs_list::-webkit-scrollbar{ width: 5px; }
.consult_form .custom_select .cs_list::-webkit-scrollbar-thumb{ background-color: var(--gold); border-radius: 5px; }
.consult_form .custom_select .cs_list li{
    padding: 10px 14px; cursor: pointer;
    font-size: var(--fs-sm); font-weight: 500; color: #fff; letter-spacing: -0.02em;
    transition: background-color 0.2s, color 0.2s;
}
.consult_form .custom_select .cs_list li:hover{ background-color: rgba(206,181,130,0.15); color: var(--gold-light); }
.consult_form .custom_select .cs_list li.selected{ color: var(--gold-light); font-weight: 700; }
.consult_form .form_item textarea{ height: 146px; padding: 12px 14px; resize: none; }
.consult_form .form_bottom{ display: flex; align-items: flex-end; justify-content: space-between; margin-top: 21px; }
.consult_form .privacy_check{ display: flex; align-items: center; margin-bottom: 6px; cursor: pointer; }
.consult_form .privacy_check input{ display: none; }
.consult_form .privacy_check .chk{
    width: 15px; height: 15px; flex-shrink: 0;
    background: url('../img/main/check_privacy_off.svg') no-repeat center / contain;
}
.consult_form .privacy_check input:checked ~ .chk{ background-image: url('../img/main/check_privacy.svg'); }
.consult_form .privacy_check .txt{ margin-left: 4px; font-size: var(--fs-xs); font-weight: 700; color: #fff; letter-spacing: -0.02em; text-decoration: underline; text-underline-offset: 2px; }

/* 상담신청 - 반응형 */
@media screen and (max-width: 960px) {
    .main_consult .consult_bg{ width: 100%; }
    .main_consult::before{ width: 100%; }
}
@media screen and (max-width: 750px) {
    .consult_form_card{ width: 100%; }
}
@media screen and (max-width: 650px) {
    .consult_form .form_row.half_row{ flex-direction: column; gap: 0; }
    .consult_form .form_bottom{ flex-direction: column; align-items: flex-start; gap: 16px; }
    .consult_form .form_bottom .gold_btn.sm{ width: 100%; }
}

/* 핵심 업무 분야 */
.main_work{ background-color: var(--beige); padding: calc(106px * var(--sp-scale)) 0 calc(108px * var(--sp-scale)); }
.work_slider{ position: relative; margin-top: calc(40px * var(--sp-scale)); }
.work_slider .swiper-container{ overflow: hidden; }
.work_card .wc_img{ height: calc(460px * var(--img-scale)); overflow: hidden; }
.work_card .wc_img img{ width: 100%; height: 100%; object-fit: cover; }
.work_card .wc_label{ display: flex; align-items: center; justify-content: center; height: 50px; background-color: var(--dark); font-size: var(--fs-lg); font-weight: 800; color: #fff; letter-spacing: -0.04em; }
.work_card .wc_desc{ margin-top: 15px; font-size: var(--fs-md); font-weight: 800; color: #555; text-align: center; line-height: 1.4; letter-spacing: -0.04em; }
.work_slider .work_prev,
.work_slider .work_next{ position: absolute; top: calc(230px * var(--img-scale) - 21px); z-index: 5; border: 0; background: none; padding: 0; }
.work_slider .work_prev{ left: -130px; }
.work_slider .work_next{ right: -130px; }
.work_slider .work_prev img,
.work_slider .work_next img{ width: 21px; }
.work_slider .work_prev img{ transform: scaleX(-1); } /* 원본 svg가 오른쪽 방향이라 좌우 반전 */
.work_progress{ margin-top: calc(56px * var(--sp-scale)); }

/* 핵심 업무 분야 - 반응형 */
/* 1460 : 업무분야 화살표가 inner 밖 ±130px에 있어 잘리는 지점 → 슬라이더 안쪽으로 이동 */
@media screen and (max-width: 1460px) {
    .work_slider .work_prev{ left: 10px; }
    .work_slider .work_next{ right: 10px; }
}

/* 대표 성공사례 */
.main_case{ position: relative; background-color: #f9fafb; padding: calc(158px * var(--sp-scale)) 0 calc(197px * var(--sp-scale)); overflow: hidden; }
.main_case::before{
    content: ''; position: absolute; inset: 0; z-index: 0;
    background: url('../img/main/success_texture.png') center / cover; opacity: 0.04; pointer-events: none;
}
.main_case .inner{ position: relative; z-index: 1; }
.case_slider{ position: relative; margin-top: 21px; z-index: 1; }
.case_slider .swiper-container{ width: 1200px; margin: 0 auto; overflow: visible; }
.case_slider .swiper-slide{ width: calc(361px * var(--img-scale)); height: auto; } /* height:auto -> flex stretch로 슬라이드 간 높이 통일 */
/* 카드 높이 통일 : 슬라이드(flex stretch) 높이를 a→body→info로 이어받고 desc가 flex:1로 잔여 높이 흡수 */
.case_card a{ display: flex; flex-direction: column; height: 100%; position: relative; }
.case_card .cc_badge{
    position: absolute; top: 0; left: 0; z-index: 2;
    display: flex; align-items: center; justify-content: center; width: 55px; height: 55px; background-color: var(--gold);
}
.case_card .cc_badge img{ width: 29px; }
.case_card .cc_body{
    display: flex; flex-direction: column; flex: 1;
    margin-top: 22px; padding: 27px;
    background-color: #fff; border-radius: 4px; box-shadow: 4px 9px 11px 0 rgba(0,0,0,0.15);
}
/* 문서 이미지 : background + padding으로 높이 제어 (182x258) */
.case_card .cc_img_box{
    position: relative; width: calc(182px * var(--img-scale)); margin: 6px auto 0; padding-top: calc(258px * var(--img-scale));
    background-repeat: no-repeat; background-position: center; background-size: cover; /* 이미지는 HTML inline style로 지정 (개발 연동용) */
    border: 1px solid #e4e4e4;
}
.case_card .cc_stamp{
    position: absolute; top: 50%; left: 50%; width: calc(306px * var(--img-scale));
    transform: translate(-50%, -50%) rotate(-30deg);
}
.case_card .cc_stamp img{ width: 100%; }
.case_card .cc_stamp p{
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: calc(100% - 44px); /* 리본 이미지 안쪽 폭 제한 */
    font-size: var(--fs-stamp); font-weight: 900; color: #fff; text-align: center; letter-spacing: -0.05em;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis; /* 한 줄 말줄임 */
}
.case_card .cc_info{ display: flex; flex-direction: column; flex: 1; margin-top: 18px; padding-top: 18px; border-top: 1px solid #d9d9d9; }
.case_card .cc_tit{
    font-size: var(--fs-lg); font-weight: 600; color: #000; line-height: 1.1; letter-spacing: -0.01em;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis; /* 한 줄 말줄임 */
}
.case_card .cc_desc{
    flex: 1; /* 잔여 높이 흡수 -> 카드 높이 통일 + View More 하단 고정 */
    margin-top: 5px; font-size: var(--fs-base); font-weight: 600; color: #7f7f7f; line-height: 1.375; letter-spacing: -0.01em;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; /* 세 줄 말줄임 */
}
.case_card .cc_more{ display: inline-block; margin-top: 10px; padding-bottom: 3px; border-bottom: 1px solid var(--gold); font-size: var(--fs-sm); font-weight: 600; color: var(--gold); letter-spacing: -0.01em; }
.case_progress{ margin-top: calc(48px * var(--sp-scale)); }

/* 대표 성공사례 - 반응형 */
@media screen and (max-width: 1250px) {
    .case_slider .swiper-container{ width: 100%; }
}
@media screen and (max-width: 650px) {
    .case_card .cc_badge{ width: 40px; height: 40px; }
    .case_card .cc_badge img{ width: 22px; }
    .case_card .cc_body{ padding: 14px; }
}

/* 오시는 길 */
.main_location{ position: relative; background-color: var(--dark); padding: calc(97px * var(--sp-scale)) 0 calc(118px * var(--sp-scale)); }
.main_location .loc_band{ position: absolute; bottom: 0; left: 0; width: 100%; height: calc(218px * var(--sp-scale)); background-color: var(--gold); }
.main_location .inner{ position: relative; z-index: 1; }
.loc_tit_box{ text-align: center; }
.loc_tit_box img{ width: 44px; }
.loc_tit_box h3{ margin-top: 19px; font-size: var(--fs-h2); font-weight: 500; color: #fff; line-height: 1.17; letter-spacing: -0.04em; }
.loc_tit_box h3 b{ font-weight: 800; }
.loc_content{ display: flex; gap: 24px; margin-top: calc(50px * var(--sp-scale)); }
/* 가로 정렬 시 flex stretch로 지도/정보 카드 높이 동기화 (min-height는 기준 높이) */
.loc_map{ width: 747px; height: auto; min-height: calc(500px * var(--img-scale)); border-radius: 12px; overflow: hidden; }
.loc_map img{ width: 100%; height: 100%; object-fit: cover; }
.loc_info{ flex: 1; padding: 25px 22px; background-color: #fff; border-radius: 10px; box-shadow: 8px 10px 4px 0 rgba(0,0,0,0.25); }
.loc_info .li_tit{ display: flex; align-items: center; font-size: var(--fs-h4); font-weight: 700; color: var(--dark); }
.loc_info .li_tit .bar{ display: inline-block; width: 6px; height: 1em; margin-right: 11px; background-color: var(--brown); }
.loc_info .li_row{ margin-top: 20px; }
.loc_info .li_row dt{
    display: flex; align-items: center; padding-bottom: 11px; border-bottom: 1px solid #ccc;
    font-size: var(--fs-base); font-weight: 500; color: var(--gold); letter-spacing: -0.04em;
}
.loc_info .li_row dt img{ width: 20px; margin-right: 10px; opacity: 0.5; }
.loc_info .li_row dd{ padding-top: 11px; font-size: var(--fs-md); font-weight: 500; color: var(--dark); line-height: 1.37; letter-spacing: -0.04em; }
.loc_info .li_row dd.tel{ font-size: var(--fs-lg); font-weight: 600; }
.loc_info .li_row .subway{ display: flex; align-items: center; margin-top: 8px; font-weight: 800; }
.loc_info .li_row .subway img{ width: 20px; margin-right: 10px; opacity: 0.5; }

/* 오시는 길 - 반응형 */
@media screen and (max-width: 1250px) {
    .loc_map{ flex: 1; width: auto; }
}
@media screen and (max-width: 960px) {
    .loc_content{ flex-direction: column; }
    .loc_map{ flex: none; width: 100%; height: calc(500px * var(--img-scale)); min-height: 0; }
}

/* 푸터 */
footer{ background-color: var(--footer-bg); padding: calc(59px * var(--sp-scale)) 0 calc(52px * var(--sp-scale)); }
.footer_logo{ display: flex; align-items: center; }
.footer_logo .logo_symbol{ width: calc(26px * var(--logo-scale)); }
.footer_logo .logo_text{ width: calc(103px * var(--logo-scale)); margin-left: calc(11px * var(--logo-scale)); }
.footer_logo .logo_hanja{ width: calc(65px * var(--logo-scale)); margin-left: calc(9px * var(--logo-scale)); }
.footer_body{ display: flex; justify-content: space-between; margin-top: 20px; padding-top: 21px; border-top: 1px solid rgba(217,217,217,0.4); }
.footer_info .fi_row{ display: flex; }
.footer_info .fi_row + .fi_row{ margin-top: 20px; }
.footer_info .fi_row dl:nth-child(1){ width: 338px; }
.footer_info .fi_row dl:nth-child(2){ width: 204px; }
.footer_info dt{ font-size: var(--fs-md); font-weight: 800; color: #fff; line-height: 1.55; letter-spacing: -0.04em; }
.footer_info dd{ font-size: var(--fs-base); font-weight: 500; color: #7a7a7a; line-height: 1.6; letter-spacing: -0.04em; }
.footer_side{ display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; }
.footer_side .privacy_btn{
    width: 175px; height: 32px; background: none; border: 1px solid #fff; border-radius: 100px;
    font-size: var(--fs-base); font-weight: 600; color: #fff; letter-spacing: -0.04em;
}
.footer_side .copyright{ font-size: var(--fs-sm); font-weight: 500; color: #fff; opacity: 0.2; letter-spacing: -0.05em; line-height: 1.4; }

/* 푸터 - 반응형 */
@media screen and (max-width: 960px) {
    .footer_body{ flex-direction: column; gap: 30px; }
    .footer_side{ flex-direction: row; align-items: center; justify-content: space-between; width: 100%; }
    .footer_info .fi_row{ gap: 40px; }
    .footer_info .fi_row dl{ flex: 1; }
    .footer_info .fi_row dl:nth-child(1),
    .footer_info .fi_row dl:nth-child(2){ width: auto; }
}
@media screen and (max-width: 650px) {
    .footer_body{ gap: 10px; }
    .footer_info .fi_row{ flex-direction: column; gap: 10px; }
    .footer_side{ flex-direction: column; align-items: flex-start; gap: 14px; }
}


/* ================================================
   서브 공통 + [02] 법무법인 화담 소개
================================================ */
:root{
    --fs-visual: 52px;   /* 서브 비주얼 타이틀 */
    --fs-num: 117px;     /* 강점 카드 숫자 워터마크 */
}
.gnb li.on a{ color: var(--gold-light); }

/* 서브 비주얼 */
.sub_visual{
    display: flex; align-items: center; justify-content: center;
    height: calc(480px * var(--img-scale)); padding-top: 80px;
    background:
        linear-gradient(90deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.8) 50%, rgba(0,0,0,0.5) 100%),
        url('../img/about/sub_hero.png') center 35% / cover;
    border-bottom: 2px solid transparent;
    border-image: linear-gradient(90deg, #ccb481 0%, #665a41 100%) 1;
}
.sub_visual .sv_txt{ text-align: center; }
.sub_visual .sv_eng{ font-family: 'Noto Serif KR', serif; font-weight: 500; font-size: var(--fs-lg); color: #fff; letter-spacing: 0.05em; }
.sub_visual .sv_line{ display: block; width: 80px; height: 2px; margin: 20px auto 0; background-color: var(--gold); }
.sub_visual h2{ margin-top: 18px; font-size: var(--fs-visual); font-weight: 800; color: #fff; letter-spacing: -0.02em; }

/* 대표변호사 소개 */
.about_ceo{ background-color: #f9fafb; padding: calc(67px * var(--sp-scale)) 0 calc(88px * var(--sp-scale)); }
.about_ceo .ac_tit_box{ display: flex; padding-bottom: calc(25px * var(--sp-scale)); border-bottom: 1px solid rgba(145,121,98,0.3); }
.about_ceo .ac_tit_box .bar{ width: 6px; flex-shrink: 0; height: 100px; background-color: var(--brown); }
.about_ceo .ac_tit_box h3{ margin-left: 25px; font-size: var(--fs-h2); font-weight: 700; color: var(--dark); line-height: 1.2; letter-spacing: -0.04em; }
.about_ceo .ac_content{ display: flex; gap: calc(56px * var(--sp-scale)); margin-top: calc(30px * var(--sp-scale)); }
.about_ceo .ac_photo{
    position: relative; width: 404px; flex-shrink: 0; aspect-ratio: 404 / 704;
    background: url('../img/about/ceo_photo.png') no-repeat center top / cover;
    border-radius: 4px; overflow: hidden;
}
.about_ceo .ap_top{
    position: absolute; top: 22px; left: 21px; width: 176px; padding-top: 11px;
    border-top: 2px solid var(--gold);
    font-size: var(--fs-md); font-weight: 600; color: #fff; letter-spacing: -0.02em;
}
.about_ceo .ap_bottom{
    position: absolute; right: 24px; bottom: 24px; width: 181px; padding-bottom: 14px;
    border-bottom: 2px solid var(--gold); color: #fff; white-space: nowrap;
}
.about_ceo .ap_bottom span{ font-size: var(--fs-lg); font-weight: 500; }
.about_ceo .ap_bottom b{ margin-left: 10px; font-size: var(--fs-h3); font-weight: 800; letter-spacing: -0.02em; }
.about_ceo .ac_record{
    flex: 1; padding: 22px 44px 28px 50px;
    background-color: #fff; border-radius: 4px; box-shadow: 2px 2px 4px 0 rgba(0,0,0,0.25);
}
.about_ceo .ar_head{ display: flex; align-items: flex-end; justify-content: space-between; padding-bottom: 11px; border-bottom: 1px solid #ddd; }
.about_ceo .ar_tit{ font-size: var(--fs-lg); font-weight: 700; color: var(--brown); letter-spacing: -0.04em; }
.about_ceo .ar_note{ font-size: var(--fs-base); font-weight: 600; color: #7f7f7f; letter-spacing: -0.04em; }
.about_ceo .ar_lists{ display: flex; gap: 24px; margin-top: 15px; }
.about_ceo .ar_lists ul{ flex: 1; list-style: disc; padding-left: 21px; }
.about_ceo .ar_lists li{ font-size: var(--fs-sm); font-weight: 500; color: var(--dark); line-height: 1.36; letter-spacing: -0.02em; }

/* MISSION & VISION */
.about_mission{ background-color: var(--dark); padding: calc(70px * var(--sp-scale)) 0; }
.about_mission .inner{ display: flex; align-items: center; justify-content: space-between; }
.about_mission .am_eng{ font-family: 'Noto Serif KR', serif; font-weight: 500; font-size: var(--fs-lg); color: var(--gold); letter-spacing: 0.05em; }
.about_mission .am_txt h3{ margin-top: 10px; font-size: var(--fs-h2); font-weight: 700; color: #fff; line-height: 1.4; letter-spacing: -0.02em; }
.about_mission .am_emblem{ position: relative; width: calc(240px * var(--img-scale)); aspect-ratio: 1; flex-shrink: 0; }
.about_mission .em_ring{ width: 100%; height: 100%; }
.about_mission .em_circle{ position: absolute; inset: 10.4%; width: 79.2%; height: 79.2%; }
.about_mission .em_logo{ position: absolute; left: 28.3%; top: 22.9%; width: 43.75%; height: 53.75%; }
.about_mission .el_symbol{ position: absolute; top: 0; left: 30.81%; width: 38.4%; height: 37.61%; }
.about_mission .el_hwadam{ position: absolute; top: 42.92%; left: 0; width: 100%; height: 38.79%; }
.about_mission .el_lawfirm{ position: absolute; top: 86.72%; left: 30.97%; width: 62.39%; height: 13.27%; }

/* 법무법인 화담의 강점 */
.about_strength{ position: relative; background-color: #f9fafb; padding: calc(101px * var(--sp-scale)) 0; overflow: hidden; }
.about_strength::before{
    content: ''; position: absolute; right: 0; bottom: 0;
    width: 76%; height: 75%;
    background: url('../img/about/about_texture.png') center / cover; pointer-events: none;
}
.about_strength .inner{ position: relative; z-index: 1; }
.strength_list{ margin-top: calc(44px * var(--sp-scale)); }
.strength_list li{ display: flex; gap: 21px; }
.strength_list li + li{ margin-top: 21px; }
.strength_list li.reverse{ flex-direction: row-reverse; }
.strength_list .st_img{ flex: 1; min-height: calc(240px * var(--img-scale)); background-position: center; background-size: cover; background-repeat: no-repeat; }
.strength_list .st_card{
    position: relative; display: flex; align-items: center; width: 49%;
    padding: calc(40px * var(--sp-scale)) 130px calc(40px * var(--sp-scale)) calc(61px * var(--sp-scale));
    background-color: #fff; border-radius: 0 10px 10px 0; box-shadow: 2px 2px 4px 0 rgba(0,0,0,0.25);
}
.strength_list .st_card::before{ content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: linear-gradient(180deg, #917962 0%, #2b241d 100%); }
.strength_list .st_num{
    position: absolute; top: 16px; right: 21px;
    font-family: 'Noto Serif KR', serif; font-weight: 400; font-size: var(--fs-num); line-height: 0.92;
    color: var(--gold); opacity: 0.1; letter-spacing: -0.04em;
}
.strength_list .st_txt{ position: relative; }
.strength_list .st_tit{ font-size: var(--fs-h4); font-weight: 800; color: var(--dark); line-height: 1.4; letter-spacing: -0.02em; }
.strength_list .st_desc{ margin-top: 4px; font-size: var(--fs-base); font-weight: 500; color: var(--dark); line-height: 1.4; letter-spacing: -0.04em; }

/* 상담예약 CTA */
.about_cta{
    position: relative; padding: calc(57px * var(--sp-scale)) 0;
    background:
        linear-gradient(0deg, rgba(0,0,0,0.5), rgba(0,0,0,0.5)),
        url('../img/about/cta_bg.png') center / cover;
}
.about_cta .inner{ display: flex; align-items: center; justify-content: space-between; }
.about_cta .ct_tit{
    font-size: var(--fs-h4); font-weight: 800; letter-spacing: -0.04em;
    background: linear-gradient(90deg, #fff4df 0%, var(--gold) 100%);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
.about_cta .ct_desc{ margin-top: 8px; font-size: var(--fs-base); font-weight: 500; color: #fff; letter-spacing: -0.04em; }
.about_cta .cta_right{ display: flex; align-items: center; gap: 30px; }
.about_cta .ct_tel{ font-size: var(--fs-base); font-weight: 600; color: #fff; text-align: right; line-height: 1.6; letter-spacing: -0.04em; }
.about_cta .ct_line{ display: block; width: 1px; height: 53px; background-color: rgba(255,255,255,0.6); }
.about_cta .cta_btn{
    display: flex; align-items: center; justify-content: center; width: 180px; height: 58px;
    background: linear-gradient(90deg, var(--gold-light) 0%, var(--gold-deep) 100%); border-radius: 5px;
    font-size: var(--fs-md); font-weight: 600; color: #fff; letter-spacing: -0.04em;
}

/* size - sub */
@media screen and (max-width: 1250px) {
    :root{ --fs-visual: 44px; --fs-num: 96px; }
    /* 사진+실적 세로 스택 : 실적 3열 공간 확보 */
    .about_ceo .ac_content{ flex-direction: column; }
    .about_ceo .ac_photo{ width: 340px; margin: 0 auto; }
    .about_ceo .ac_record{ padding: 20px 36px 26px 42px; }
}
@media screen and (max-width: 960px) {
    :root{ --fs-visual: 38px; --fs-num: 80px; }
    /* 강점 카드 세로 스택 : 이미지는 비율 박스로 전환 */
    .strength_list li,
    .strength_list li.reverse{ flex-direction: column; gap: 0; }
    .strength_list .st_img{ min-height: 0; aspect-ratio: 591 / 240; }
    .strength_list .st_card{ width: 100%; border-radius: 0 0 10px 10px; padding-right: 110px; }
    .strength_list .st_num{ top: 10px; }
}
@media screen and (max-width: 650px) {
    :root{ --fs-visual: 30px; --fs-num: 64px; }
    .about_ceo .ac_tit_box .bar{ height: auto; }
    .about_ceo .ac_tit_box h3{ margin-left: 14px; }
    /* 타이틀 3줄 고정 : '확신을 주는 전문성으로,' / '끝까지 함께 할 화담의' / '이대규 대표변호사를 소개합니다' */
    .about_ceo .ac_tit_box h3 span{ display: block; }
    .about_ceo .ac_tit_box h3 br{ display: none; }
    .about_ceo .ac_photo{ width: 100%; max-width: 340px; aspect-ratio: 404 / 500; } /* 모바일: 세로 비율 축소 */
    .about_ceo .ac_record{ padding: 18px 20px 22px; }
    .about_ceo .ar_head{ flex-direction: column; align-items: flex-start; gap: 4px; }
    .about_ceo .ar_lists{ flex-direction: column; gap: 8px; }
    .about_mission .inner{ flex-direction: column; align-items: flex-start; gap: 30px; }
    .about_mission .am_emblem{ align-self: center; width: calc(240px * 0.7); }
    .strength_list .st_card{ padding: 22px 84px 24px 22px; }
    .about_cta .inner{ flex-direction: column; align-items: flex-start; gap: 22px; }
    .about_cta .cta_right{ width: 100%; flex-direction: column; align-items: flex-start; gap: 14px; }
    .about_cta .ct_line{ display: none; }
    .about_cta .ct_tel{ text-align: left; }
    .about_cta .cta_btn{ width: 100%; height: 52px; }
    #privacyPopup .contentWrap .contentBox{ font-size: 15px; } /* customBoard.css(뒤 로드) 14px 오버라이드 - 모바일 최소 15px */
}


/* ================================================
   [03] 전문가 소개 + [04][05] 상세
================================================ */
:root{
    --fs-tit-sub: 38px;  /* 상세페이지 섹션 타이틀 */
}
.sub_visual.experts{
    background:
        linear-gradient(90deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.8) 50%, rgba(0,0,0,0.5) 100%),
        url('../img/experts/sub_hero.png') center 42% / cover;
}

/* 전문가 목록 */
.expert_list_sec{ background-color: #f9fafb; padding: calc(75px * var(--sp-scale)) 0 calc(120px * var(--sp-scale)); }
.expert_list{ margin-top: calc(50px * var(--sp-scale)); }
.expert_list li{ display: flex; gap: calc(80px * var(--sp-scale)); }
.expert_list li + li{ margin-top: calc(62px * var(--sp-scale)); padding-top: calc(61px * var(--sp-scale)); border-top: 1px solid rgba(145,121,98,0.3); }
.expert_list .ep_photo{
    position: relative; width: 350px; flex-shrink: 0; aspect-ratio: 350 / 450;
    background-color: #71747d; border-radius: 12px; overflow: hidden;
}
.expert_list .ep_symbol{ position: absolute; top: 30px; left: 50%; transform: translateX(-50%); width: 68.7%; }
/* 프로필 이미지 : background-image 방식 (뒤 심볼 워터마크는 img 유지) */
.expert_list .ep_img{
    position: absolute; inset: 0;
    background-repeat: no-repeat; background-size: cover; background-position: center top;
}
.expert_list .ep_img.full{ background-position: 55% 10%; }
.expert_list .ep_photo::after{
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 104px;
    background: linear-gradient(180deg, rgba(46,38,22,0) 0%, #2e2616 100%);
}
.expert_list .ep_info{ flex: 1; }
.expert_list .ep_role{ font-size: var(--fs-h4); font-weight: 600; color: var(--dark); line-height: 1.1; }
.expert_list .ep_name{ display: flex; align-items: flex-end; margin-top: 20px; }
.expert_list .ep_name .bar{ width: 5px; flex-shrink: 0; align-self: stretch; background-color: var(--gold); }
.expert_list .ep_name b{ margin-left: 12px; font-size: calc(var(--fs-display) * 0.7); font-weight: 800; color: var(--dark); line-height: 1.1; }
.expert_list .ep_name .eng{ margin-left: 12px; margin-bottom: 3px; font-size: var(--fs-lg); font-weight: 500; color: var(--dark); }
.expert_list .ep_desc{ max-width: 714px; margin-top: 26px; font-size: var(--fs-lg); font-weight: 500; color: var(--dark); line-height: 1.6; }
.expert_list .ep_mail{ display: flex; align-items: center; gap: 15px; margin-top: 24px; font-size: var(--fs-lg); font-weight: 500; color: #555; }
.expert_list .ep_mail img{ width: 20px; }
.expert_list .ep_more{
    display: inline-flex; align-items: center; justify-content: center;
    width: 120px; height: 40px; margin-top: calc(50px * var(--sp-scale));
    background-color: var(--gold); border-radius: 5px;
    font-size: var(--fs-base); font-weight: 700; color: #fff; letter-spacing: -0.04em;
    transition: background-color 0.3s;
}
.expert_list .ep_more:hover{ background-color: var(--gold-deep); }

/* 전문가 상세 */
.expert_detail{ background-color: #f9fafb; padding: calc(120px * var(--sp-scale)) 0 calc(120px * var(--sp-scale)); }
.expert_detail .ed_profile{ position: relative; }
.expert_detail .ed_card{
    position: relative; padding: calc(62px * var(--sp-scale)) calc(64px * var(--sp-scale));
    background: radial-gradient(120% 160% at 50% 50%, rgba(214,210,203,0) 0%, rgba(0,0,0,0.06) 100%), var(--beige);
}
.expert_detail .ed_role{ display: flex; align-items: baseline; gap: 14px; font-size: var(--fs-base); font-weight: 800; color: var(--dark); letter-spacing: -0.04em; }
.expert_detail .ed_role b{ font-size: calc(var(--fs-display) * 0.7); font-weight: 800; letter-spacing: -0.04em; line-height: 1.2; }
.expert_detail .ed_desc{ max-width: 760px; margin-top: 18px; font-size: var(--fs-lg); font-weight: 500; color: #72706f; line-height: 1.6; letter-spacing: -0.04em; }
.expert_detail .ed_mail{ display: flex; align-items: center; gap: 15px; margin-top: 22px; font-size: var(--fs-lg); font-weight: 500; color: #555; }
.expert_detail .ed_mail img{ width: 20px; }
.expert_detail .ed_photo{
    position: absolute; right: 71px; bottom: 0; z-index: 1;
    width: 351px; height: 400px; object-fit: cover; object-position: center top;
}
.expert_detail .ed_photo.full{ height: 400px; }

.expert_detail .ed_sec{ margin-top: calc(88px * var(--sp-scale)); }
.expert_detail .ed_sec h3{ font-size: var(--fs-tit-sub); font-weight: 700; color: var(--dark); letter-spacing: -0.09em; }

/* 학력·경력·자격 카드 */
.expert_detail .ed_cards3{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: calc(56px * var(--sp-scale)); }
.expert_detail .ed_cards3 > li{ padding: calc(40px * var(--sp-scale)) 30px calc(36px * var(--sp-scale)); background-color: #fff; border: 1px solid #cecdcc; border-radius: 10px; }
.expert_detail .ec_tit{ padding-bottom: 15px; border-bottom: 1px solid #cecdcc; font-size: var(--fs-lg); font-weight: 800; color: var(--gold); letter-spacing: -0.02em; }
.expert_detail .ec_list{ margin-top: 15px; }
.expert_detail .ec_list li{ font-size: var(--fs-md); font-weight: 500; color: #3b3737; line-height: 1.4; letter-spacing: -0.02em; }
.expert_detail .ec_list li + li{ margin-top: 10px; }

/* 주요 취급 분야 */
.expert_detail .ed_fields{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: calc(56px * var(--sp-scale)); }
.expert_detail .ed_fields > li{ padding: 30px; background-color: #fff; border-radius: 5px; box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.15); }
.expert_detail .ef_tit{ display: flex; align-items: center; font-size: var(--fs-lg); font-weight: 600; color: #1c2333; line-height: 1.5; }
.expert_detail .ef_tit .bar{ display: inline-block; width: 4px; height: 1.3em; margin-right: 14px; background-color: #b89a6a; }
.expert_detail .ef_desc{ margin-top: 10px; font-size: var(--fs-base); font-weight: 500; color: #5c6577; line-height: 1.5; }

/* 수상 및 인증 내역 */
.expert_detail .ed_awards{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); /* minmax(0,..) : nowrap 라벨이 칸을 늘리지 않도록 */ gap: 32px 18px; margin-top: calc(80px * var(--sp-scale)); }
.expert_detail .ed_awards > li{ position: relative; }
/* 카드 이미지 : background-image 방식 (임시 인증서 이미지, 관리자 업로드 시 교체) */
.expert_detail .ed_awards .aw_img{
    aspect-ratio: 210 / 297; background-color: #fff; /* A4 비율 */
    background-repeat: no-repeat; background-position: center; background-size: cover;
}
.expert_detail .ed_awards p{
    margin-top: 10px; font-size: var(--fs-lg); font-weight: 600; color: #1c2333; text-align: center; line-height: 1.5;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis; /* 한 줄 말줄임 */
}
.expert_detail .ed_awards .aw_edit{
    display: block; margin-top: 6px;
    font-size: var(--fs-sm); font-weight: 700; color: var(--gold); text-align: center; letter-spacing: -0.04em;
    transition: color 0.25s;
}
.expert_detail .ed_awards .aw_edit:hover{ color: var(--gold-deep); }

/* 게시판 write 공통 (전문가 등록 / 성공사례 등록) */
.expert_detail .ed_write_sec,
.cases_sec .ed_write_sec{ margin-top: 0; }
.expert_detail .ed_write_desc,
.cases_sec .ed_write_desc{
    margin-top: 14px; font-size: var(--fs-md); font-weight: 500; color: #72706f; line-height: 1.6; letter-spacing: -0.04em;
}
.expert_detail .ed_write_form,
.cases_sec .ed_write_form{ width: 100% !important; margin-top: calc(40px * var(--sp-scale)); }
.expert_detail .ed_write_box,
.cases_sec .ed_write_box{
    padding: calc(40px * var(--sp-scale)) calc(36px * var(--sp-scale));
    background-color: #fff; border: 1px solid #cecdcc; border-radius: 10px;
}
.expert_detail .ew_field + .ew_field,
.cases_sec .ew_field + .ew_field{ margin-top: 28px; }
.expert_detail .ew_label,
.cases_sec .ew_label{
    display: block; margin-bottom: 10px;
    font-size: var(--fs-base); font-weight: 700; color: var(--dark); letter-spacing: -0.04em;
}
.expert_detail .ew_input,
.cases_sec .ew_input{
    width: 100%; height: 52px; padding: 0 16px;
    background-color: #fff; border: 1px solid #cecdcc; border-radius: 5px;
    font-size: var(--fs-base); font-weight: 500; color: var(--dark); letter-spacing: -0.02em;
    transition: border-color 0.25s;
}
.expert_detail .ew_input:focus,
.cases_sec .ew_input:focus{ border-color: var(--gold); outline: none; }
.expert_detail .ew_input::placeholder,
.cases_sec .ew_input::placeholder{ color: #aaa; font-weight: 400; }
.expert_detail select.ew_input,
.cases_sec select.ew_input{
    background-image: url('../img/common/select-icon.png');
    background-repeat: no-repeat; background-position: right 16px center; background-size: 12px;
    padding-right: 40px; cursor: pointer;
}
.expert_detail .ew_textarea,
.cases_sec .ew_textarea{
    width: 100%; min-height: 140px; padding: 14px 16px; resize: vertical;
    background-color: #fff; border: 1px solid #cecdcc; border-radius: 5px;
    font-size: var(--fs-base); font-weight: 500; color: var(--dark); line-height: 1.6; letter-spacing: -0.02em;
    transition: border-color 0.25s;
}
.expert_detail .ew_textarea:focus,
.cases_sec .ew_textarea:focus{ border-color: var(--gold); outline: none; }
.expert_detail .ew_textarea::placeholder,
.cases_sec .ew_textarea::placeholder{ color: #aaa; font-weight: 400; }
.expert_detail .ew_guide,
.cases_sec .ew_guide{
    margin: -2px 0 12px; font-size: var(--fs-sm); font-weight: 500; color: #8a8683; line-height: 1.5;
}
.expert_detail .ew_file,
.cases_sec .ew_file{
    position: relative; display: flex; align-items: center; gap: 12px;
    width: 100%; min-height: 52px; padding: 8px 12px 8px 8px;
    background-color: #f9fafb; border: 1px dashed #cecdcc; border-radius: 5px; cursor: pointer;
    transition: border-color 0.25s, background-color 0.25s;
}
.expert_detail .ew_file_more,
.cases_sec .ew_file_more{ margin-top: 10px; }
.expert_detail .ew_file:hover,
.cases_sec .ew_file:hover{ border-color: var(--gold); background-color: rgba(167,141,88,0.06); }
.expert_detail .ew_file input[type="file"],
.cases_sec .ew_file input[type="file"]{
    position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer;
}
.expert_detail .ew_file_btn,
.cases_sec .ew_file_btn{
    flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
    height: 36px; padding: 0 16px;
    background-color: var(--dark); border-radius: 5px;
    font-size: var(--fs-sm); font-weight: 700; color: #fff; letter-spacing: -0.04em; white-space: nowrap;
}
.expert_detail .ew_file_name,
.cases_sec .ew_file_name{
    flex: 1; min-width: 0;
    font-size: var(--fs-base); font-weight: 500; color: #72706f;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.expert_detail .ew_del,
.cases_sec .ew_del{
    display: flex; align-items: center; gap: 8px; margin-top: 12px;
    font-size: var(--fs-sm); font-weight: 500; color: #72706f; cursor: pointer;
}
.expert_detail .ew_del input,
.cases_sec .ew_del input{ width: 16px; height: 16px; accent-color: var(--gold); cursor: pointer; }

.expert_detail .ed_write_preview,
.cases_sec .ed_write_preview{ display: none; margin-top: 32px; padding-top: 32px; border-top: 1px solid #e8e6e3; }
.expert_detail .ed_write_preview.is_show,
.cases_sec .ed_write_preview.is_show{ display: block; }
.expert_detail .preview_label,
.cases_sec .preview_label{
    margin-bottom: 16px; font-size: var(--fs-sm); font-weight: 700; color: var(--gold); letter-spacing: -0.04em;
}
.expert_detail .preview_card,
.cases_sec .preview_card{ width: 100%; max-width: 210px; }
.expert_detail .preview_img,
.cases_sec .preview_img{
    aspect-ratio: 210 / 297; background-color: #f3f2f0;
    background-repeat: no-repeat; background-position: center; background-size: cover;
    border: 1px solid #cecdcc; border-radius: 2px;
}
.expert_detail .preview_tit,
.cases_sec .preview_tit{
    margin-top: 10px; font-size: var(--fs-base); font-weight: 600; color: #1c2333; text-align: center; line-height: 1.5;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.expert_detail .preview_tit span,
.cases_sec .preview_tit span{ font-weight: 600; }

.expert_detail .ew_btns,
.cases_sec .ew_btns{
    display: flex; align-items: center; justify-content: flex-end; gap: 10px;
    margin-top: calc(40px * var(--sp-scale));
}
.expert_detail .ew_btn,
.cases_sec .ew_btn{
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 120px; height: 48px; padding: 0 24px; border-radius: 5px;
    font-size: var(--fs-base); font-weight: 700; letter-spacing: -0.04em; transition: background-color 0.3s, border-color 0.3s, color 0.3s;
}
.expert_detail .ew_btn.cancel,
.cases_sec .ew_btn.cancel{
    background-color: #fff; border: 1px solid #cecdcc; color: #555;
}
.expert_detail .ew_btn.cancel:hover,
.cases_sec .ew_btn.cancel:hover{ border-color: #999; color: var(--dark); }
.expert_detail .ew_btn.submit,
.cases_sec .ew_btn.submit{
    border: 0; background-color: var(--gold); color: #fff; cursor: pointer;
}
.expert_detail .ew_btn.submit:hover,
.cases_sec .ew_btn.submit:hover{ background-color: var(--gold-deep); }
.expert_detail .ew_btn.submit:disabled,
.cases_sec .ew_btn.submit:disabled{ opacity: 0.55; cursor: not-allowed; }

/* .cases_sec .ed_write_sec{ max-width: 860px; } */
.cases_sec .ed_write_sec h3{ font-size: var(--fs-tit-sub); font-weight: 700; color: var(--dark); letter-spacing: -0.09em; }
.cases_sec .preview_card_case{ max-width: 182px; }
.cases_sec .preview_card_case .preview_img{ aspect-ratio: 182 / 258; }

/* size - experts */
@media screen and (max-width: 1250px) {
    :root{ --fs-tit-sub: 34px; }
    .expert_list .ep_photo{ width: 320px; }
    .expert_detail .ed_photo{ right: 40px; width: 290px; height: 378px; }
    .expert_detail .ed_photo.full{ height: 330px; }
    .expert_detail .ed_awards{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media screen and (max-width: 960px) {
    :root{ --fs-tit-sub: 28px; }
    .expert_list li{ flex-direction: column; }
    .expert_list .ep_photo{ width: 100%; max-width: 350px; margin: 0 auto; }
    /* 상세 프로필 : 사진을 카드 위 일반 흐름으로 */
    .expert_detail .ed_profile{ display: flex; flex-direction: column-reverse; }
    .expert_detail .ed_photo{ position: static; align-self: center; width: 280px; height: 364px; }
    .expert_detail .ed_photo.full{ height: 320px; }
    .expert_detail .ed_desc{ max-width: none; }
    .expert_detail .ed_cards3{ grid-template-columns: 1fr; gap: 16px; }
    .expert_detail .ed_fields{ grid-template-columns: 1fr; gap: 16px; }
    .expert_detail .ed_awards{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 16px; }
    .expert_detail .ed_write_box,
    .cases_sec .ed_write_box{ padding: 28px 24px; }
}
@media screen and (max-width: 650px) {
    :root{ --fs-tit-sub: 22px; }
    .expert_list .ep_photo{ max-width: 100%; }
    .expert_list .ep_name b{ font-size: calc(var(--fs-display) * 0.9); }
    .expert_list .ep_more{ width: 100%; height: 46px; }
    .expert_detail .ed_photo{ width: 220px; height: 286px; }
    .expert_detail .ed_photo.full{ height: 260px; }
    .expert_detail .ed_card{ padding: 24px 20px; }
    .expert_detail .ed_awards p{ font-size: var(--fs-base); }
    .expert_detail .ed_write_box,
    .cases_sec .ed_write_box{ padding: 24px 18px; }
    .expert_detail .ew_input,
    .cases_sec .ew_input{ height: 48px; }
    .expert_detail .ew_btns,
    .cases_sec .ew_btns{ flex-direction: column-reverse; gap: 8px; }
    .expert_detail .ew_btn,
    .cases_sec .ew_btn{ width: 100%; min-width: 0; height: 46px; }
    .expert_detail .preview_card,
    .cases_sec .preview_card{ max-width: 160px; margin: 0 auto; }
}


/* ================================================
   [06]~[17] 업무분야 상세
================================================ */
.sub_visual.work{
    background:
        linear-gradient(90deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.8) 50%, rgba(0,0,0,0.5) 100%),
        url('../img/work/sub_hero.png') center 30% / cover;
}

/* 분야 탭 */
.work_tab{ background-color: #26221c; border-top: 1px solid rgba(255,241,213,0.3); }
.work_tab ul{ display: flex; align-items: center; justify-content: space-between; height: calc(80px * var(--sp-scale) + 16px); }
.work_tab li{ position: relative; display: flex; align-items: center; height: 100%; }
.work_tab li a{ padding: 0 8px; font-size: var(--fs-base); font-weight: 600; color: #fff; letter-spacing: -0.02em; white-space: nowrap; transition: color 0.3s; }
.work_tab li a:hover{ color: var(--gold-light); }
.work_tab li.on a{ color: #c1b08c; }
.work_tab li.on::after{
    content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0;
    width: 100%; min-width: 80px; height: 4px; background-color: #c1b08c;
}

/* 분야 인트로 */
.work_intro{ background-color: #f9fafb; padding: calc(100px * var(--sp-scale)) 0; }
.work_intro .inner{ display: flex; gap: calc(60px * var(--sp-scale)); }
.work_intro .wi_tit{ flex-shrink: 0; font-size: calc(var(--fs-tit-sub) + 2px); font-weight: 700; color: var(--dark); line-height: 1.4; letter-spacing: -0.04em; }
.work_intro .wi_tit b{ font-weight: 800; color: var(--gold); }
.work_intro .wi_txt{ max-width: 688px; margin-left: auto; }
.work_intro .wi_txt > p{ font-size: var(--fs-md); font-weight: 500; color: #555; line-height: 1.8; letter-spacing: -0.02em; }
.work_intro .wi_txt > p + p{ margin-top: 18px; }
.work_intro .wi_box{
    margin-top: 26px; padding: 24px 28px; background-color: #f5f6f9; border-radius: 5px;
    font-size: var(--fs-md); font-weight: 700; color: #1c2333; line-height: 1.6; letter-spacing: -0.02em;
}
.work_intro .wi_box b{ font-weight: 700; color: #b89a6a; } /* 시안 골드 강조 구간 */

/* 주요 업무 */
.work_main_sec{ background-color: #f5f5f5; padding: calc(100px * var(--sp-scale)) 0; }
.sec_center_tit{ font-size: var(--fs-tit-sub); font-weight: 700; color: var(--dark); text-align: center; letter-spacing: -0.02em; }
.work_cards{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: calc(47px * var(--sp-scale)); }
.work_cards > li{
    display: flex; gap: 20px; padding: calc(31px * var(--sp-scale)) 31px;
    background-color: #fff; border: 1px solid #e7e9ef; border-radius: 14px;
}
.work_cards .wk_tit{ display: flex; width: 130px; flex-shrink: 0; font-size: var(--fs-lg); font-weight: 600; color: #1c2333; line-height: 1.5; letter-spacing: -0.02em; }
.work_cards .wk_tit .bar{ display: inline-block; width: 4px; height: 1.3em; margin-right: 10px; flex-shrink: 0; background-color: #b89a6a; }
.work_cards .wk_items{ flex: 1; }
.work_cards .wk_items li{ word-break: keep-all; display: flex; gap: 10px; font-size: var(--fs-base); font-weight: 500; color: #5c6577; line-height: 1.5; letter-spacing: -0.01em; }
.work_cards .wk_items li + li{ margin-top: 10px; }
.work_cards .wk_items img{ width: 16px; margin-top: 4px; flex-shrink: 0; align-self: flex-start; }

/* 사건처리 절차 */
.work_process{ background-color: #f9fafb; padding: calc(95px * var(--sp-scale)) 0 calc(100px * var(--sp-scale)); }
.process_list{ position: relative; display: flex; justify-content: space-between; margin-top: calc(66px * var(--sp-scale)); }
.process_list::before{
    content: ''; position: absolute; top: 34px; left: 9%; right: 9%; height: 2px;
    background: linear-gradient(90deg, #b89a6a 0%, rgba(184,154,106,0.2) 100%);
}
.process_list li{ position: relative; z-index: 1; width: 18%; display: flex; flex-direction: column; align-items: center; text-align: center; }
.process_list .ps_num{
    display: flex; align-items: center; justify-content: center; width: 68px; height: 68px;
    background-color: #fff; border: 2px solid #b89a6a; border-radius: 50%;
    box-shadow: 0 10px 13px 0 rgba(20,28,48,0.1);
    font-size: 22px; font-weight: 800; color: #b89a6a;
}
.process_list .ps_tit{ margin-top: 20px; font-size: var(--fs-md); font-weight: 700; color: #1c2333; letter-spacing: -0.02em; }
.process_list .ps_desc{ margin-top: 8px; font-size: var(--fs-base); font-weight: 500; color: #555; line-height: 1.4; letter-spacing: -0.02em; }

/* 대표 사례 */
.work_case{ background-color: #f9fafb; padding: calc(30px * var(--sp-scale)) 0 calc(130px * var(--sp-scale)); }
.work_case .wc_head{ display: flex; align-items: flex-end; justify-content: space-between; }
.work_case .wc_head h3{ font-size: var(--fs-tit-sub); font-weight: 700; color: var(--dark); letter-spacing: -0.02em; }
.work_case .wc_all{ font-size: var(--fs-base); font-weight: 600; color: #555; transition: color 0.3s; }
.work_case .wc_all:hover{ color: var(--gold); }
.work_cases{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 58px; margin-top: calc(64px * var(--sp-scale)); }

/* size - work */
@media screen and (max-width: 1250px) {
    .work_intro .inner{ flex-direction: column; gap: 30px; }
    .work_intro .wi_txt{ max-width: none; margin-left: 0; }
    .work_cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (max-width: 960px) {
    .work_tab ul{ justify-content: flex-start; gap: 26px; overflow-x: auto; padding-top: 2px; -webkit-overflow-scrolling: touch; }
    .work_tab li{ flex-shrink: 0; }
    .work_cards{ grid-template-columns: 1fr; }
    .process_list{ flex-wrap: wrap; gap: 34px 0; justify-content: center; }
    .process_list::before{ display: none; }
    .process_list li{ width: 33%; }
}
@media screen and (max-width: 650px) {
    .work_cards > li{ flex-direction: column; gap: 12px; }
    .work_cards .wk_tit{ width: auto; }
    .process_list li{ width: 50%; }
    .work_case .wc_head{ flex-direction: column; align-items: flex-start; gap: 10px; }
}


/* ================================================
   [18] 성공사례 목록
================================================ */
.sub_visual.cases{
    background:
        linear-gradient(90deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.8) 50%, rgba(0,0,0,0.5) 100%),
        url('../img/cases/sub_hero.png') center 32% / cover;
}
.cases_sec{ background-color: #f9fafb; padding: calc(40px * var(--sp-scale)) 0 calc(103px * var(--sp-scale)); }
.cases_cate{ margin: 0 0 24px; }
.cases_cate ul{
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px 6px;
}
.cases_cate li a{
    display: inline-flex; align-items: center; justify-content: center;
    height: 36px; padding: 0 14px; border: 1px solid #ddd; border-radius: 4px;
    background-color: #fff; font-size: var(--fs-sm); font-weight: 600;
    color: #666; letter-spacing: -0.02em; transition: color 0.2s, border-color 0.2s, background-color 0.2s;
}
.cases_cate li a:hover{ border-color: var(--gold); color: var(--gold); }
.cases_cate li a#bo_cate_on{
    border-color: var(--gold); background-color: var(--gold); color: #fff;
}
.cases_grid{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px 58px; margin-top: 12px; }
.cases_chkall{ margin: 8px 0 4px; font-size: var(--fs-sm); color: #666; }
.cases_grid .case_card{ position: relative; }
.cases_grid .case_chk{
    position: absolute; top: 8px; right: 8px; z-index: 3;
    width: 18px; height: 18px; accent-color: var(--gold);
}
.cases_grid .case_edit{
    display: block; margin-top: 8px;
    font-size: var(--fs-sm); font-weight: 700; color: var(--gold); text-align: center; letter-spacing: -0.04em;
}
.cases_grid .case_edit:hover{ color: var(--gold-deep); }
.cases_empty{
    grid-column: 1 / -1; padding: 80px 20px;
    font-size: var(--fs-md); font-weight: 500; color: #888; text-align: center;
}
/* 페이징 : 기본 .paging_box 위에 시안 스타일 보강 */
.cases_sec .paging_box{
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: 4px; margin-top: calc(64px * var(--sp-scale)); padding: 0;
}
.cases_sec .paging_box .pg_wrap{
    float: none; clear: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px;
}
.cases_sec .pg_page,
.cases_sec .pg_current{
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: 4px; border: 1px solid #ddd;
    font-size: var(--fs-xs); color: #666; box-sizing: border-box;
}
.cases_sec .pg_current{ background-color: var(--gold); border-color: var(--gold); color: #fff; }

/* size - cases */
@media screen and (max-width: 960px) {
}
@media screen and (max-width: 650px) {
}


/* 성공사례 카드 그리드 반응형 통일 : 1250 이하 2열(절반씩), 480 이하 1열 */
@media screen and (max-width: 1250px) {
    .work_cases,
    .cases_grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 30px 24px;
    }
}
@media screen and (max-width: 480px) {
    .work_cases,
    .cases_grid{
        grid-template-columns: 1fr;
        gap: 24px;
    }
}


/* ================================================
   [19] 성공사례 상세
================================================ */
.case_view{ background-color: #f9fafb; padding: calc(40px * var(--sp-scale)) 0 calc(120px * var(--sp-scale)); }
.case_view .cv_back{ display: inline-flex; align-items: center; gap: 7px; font-size: var(--fs-sm); font-weight: 500; color: #7f7f7f; transition: color 0.3s; }
.case_view .cv_back:hover{ color: var(--gold); }
.case_view .cv_tit{ margin-top: 8px; font-size: calc(var(--fs-tit-sub) - 2px); font-weight: 800; color: var(--dark); line-height: 1.2; }
.case_view .cv_admin{ margin-top: 10px; }
.case_view .cv_admin a{ font-size: var(--fs-sm); font-weight: 700; color: var(--gold); }
.case_view .cv_admin a:hover{ color: var(--gold-deep); }
.case_view .cv_body{ margin-top: calc(30px * var(--sp-scale)); border-top: 1px solid #d9d9d9; }
.case_view .cv_sec{ margin-top: calc(48px * var(--sp-scale)); }
.case_view .cv_sec_tit{
    padding: 10px 20px; background-color: var(--dark);
    font-size: calc(var(--fs-lg) + 2px); font-weight: 800; color: #fff; line-height: 1.25; letter-spacing: -0.01em;
}
.case_view .cv_sec_txt{ margin-top: calc(17px * var(--sp-scale)); font-size: var(--fs-md); font-weight: 500; color: var(--dark); line-height: 1.55; letter-spacing: -0.01em; word-break: keep-all; }
.case_view .cv_img{
    display: block; margin-top: calc(38px * var(--sp-scale));
    width: auto; max-width: 100%; height: auto;
}
.case_view .cv_list_btn{
    display: flex; align-items: center; justify-content: center;
    width: 314px; height: 52px; margin: calc(103px * var(--sp-scale)) auto 0;
    background-color: var(--gold); border-radius: 4px;
    font-size: var(--fs-md); font-weight: 800; color: #fff; letter-spacing: -0.01em;
    transition: background-color 0.3s;
}
.case_view .cv_list_btn:hover{ background-color: var(--gold-deep); }

/* size - case view */
@media screen and (max-width: 960px) {
}
@media screen and (max-width: 650px) {
    .case_view .cv_list_btn{ width: 100%; }
}


/* ================================================
   [20] 상담신청
================================================ */
.sub_visual.contact{
    background:
        linear-gradient(90deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.72) 50%, rgba(0,0,0,0.45) 100%),
        url('../img/contact/sub_hero.png') center 40% / cover;
}

/* 상담 안내 */
.contact_intro{ background-color: #f9fafb; padding: calc(100px * var(--sp-scale)) 0 calc(100px * var(--sp-scale)); }
.contact_intro .ci_tit{ font-size: var(--fs-h2); font-weight: 700; color: #333; line-height: 1.2; letter-spacing: -0.02em; }

/* 절차 타임라인 */
.contact_steps{ position: relative; display: flex; margin-top: calc(70px * var(--sp-scale)); list-style: none; }
.contact_steps::before{ content: ''; position: absolute; top: 51px; left: 0; right: 0; height: 1px; background-color: #d9d9d9; }
.contact_steps li{ position: relative; flex: 1; text-align: center; }
.contact_steps .cs_num{ font-size: calc(var(--fs-h3) + 2px); font-weight: 800; color: var(--gold); letter-spacing: -0.04em; text-shadow: 0 0 4px rgba(167,141,88,0.2); }
.contact_steps li::after{
    content: ''; position: absolute; top: 48px; left: 50%; transform: translateX(-50%);
    width: 6px; height: 6px; border-radius: 50%; background-color: var(--gold);
}
.contact_steps .cs_desc{ margin-top: calc(28px * var(--sp-scale)); font-size: var(--fs-base); font-weight: 600; color: #7f7f7f; line-height: 1.4; letter-spacing: -0.04em; }

/* 접수 채널 카드 */
.contact_channels{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: calc(66px * var(--sp-scale)); }
.contact_channels li{
    background-color: #fff; border-radius: 5px; box-shadow: 4px 9px 10px 0 rgba(0,0,0,0.15);
    text-align: center; transition: transform 0.3s, box-shadow 0.3s;
}
.contact_channels li:hover{ transform: translateY(-4px); box-shadow: 6px 12px 14px 0 rgba(0,0,0,0.18); }
.contact_channels li a{ display: block; padding: calc(39px * var(--sp-scale)) 20px calc(34px * var(--sp-scale)); }
.contact_channels .ch_icon{
    display: block; width: 50px; height: 50px; margin: 0 auto;
    background-color: var(--gold); border-radius: 50%;
    background-repeat: no-repeat; background-position: center; background-size: 28px;
}
.contact_channels .ch_tit{ margin-top: 14px; font-size: var(--fs-lg); font-weight: 800; color: var(--dark); letter-spacing: -0.04em; }
.contact_channels .ch_desc{ margin-top: 7px; font-size: var(--fs-sm); font-weight: 500; color: #555; letter-spacing: -0.04em; }

/* 상담신청 폼 밴드 */
.contact_form_band{
    position: relative; padding: calc(114px * var(--sp-scale)) 0 calc(103px * var(--sp-scale));
    background:
        linear-gradient(0deg, rgba(34,34,34,0.9), rgba(34,34,34,0.9)),
        url('../img/contact/form_band_bg.png') center / cover;
}
.contact_form_band .inner{ position: relative; }

/* 상담신청 상세(view) */
.contact_view_band .consult_tit{ text-align: center; }
.contact_view_menu{ margin: 20px 0 0; }
.contact_view_menu .menuList{ justify-content: flex-end; }
.contact_view_menu .menuList .item{ color: #fff; }
.contact_view_menu .menuList .txt{ color: #fff; }
.consult_form_view .form_value{
    display: flex; align-items: center; min-height: 42px; margin-top: 6px; padding: 0 14px;
    background-color: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.35); border-radius: 4px;
    font-size: var(--fs-base); font-weight: 500; color: #fff; letter-spacing: -0.02em; word-break: keep-all;
}
.consult_form_view .form_value_area{
    align-items: flex-start; min-height: 146px; padding: 12px 14px; line-height: 1.55;
}
.consult_form_view .form_bottom{ justify-content: flex-end; }
.consult_form_view .consult_submit_btn{ display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }

/* 상담신청 목록 */
.contact_list_sec{ background-color: #f9fafb; padding: calc(60px * var(--sp-scale)) 0 calc(100px * var(--sp-scale)); }
.contact_list_sec .contact_board{ padding: 0; }
.contact_list_sec .basicList{ background-color: #fff; }
.contact_list_sec .contact_empty .item{ justify-content: center; padding: 60px 10px; color: #888; }
.contact_list_sec .paging_box{
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: 4px; margin-top: calc(40px * var(--sp-scale));
}
.contact_list_sec .paging_box .pg_wrap{
    float: none; clear: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px;
}
.contact_list_sec .pg_page,
.contact_list_sec .pg_current{
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: 4px; border: 1px solid #ddd;
    font-size: var(--fs-xs); color: #666; box-sizing: border-box;
}
.contact_list_sec .pg_current{ background-color: var(--gold); border-color: var(--gold); color: #fff; }

/* 빠른 상담신청 상세 */
.apply_view_box{
    background-color: #fff; border: 1px solid #e8e8e8; border-radius: 8px;
    padding: 28px 32px 32px;
}
.apply_view_dl .av_row{
    display: flex; align-items: flex-start; gap: 20px;
    padding: 14px 0; border-bottom: 1px solid #f0f0f0;
}
.apply_view_dl .av_row:last-child{ border-bottom: 0; }
.apply_view_dl .av_row.av_row_block{ flex-direction: column; gap: 10px; }
.apply_view_dl dt{
    flex: 0 0 96px; font-size: var(--fs-sm); font-weight: 700; color: #888; letter-spacing: -0.02em;
}
.apply_view_dl dd{
    flex: 1; font-size: var(--fs-sm); font-weight: 500; color: #222; line-height: 1.6; letter-spacing: -0.02em; word-break: break-word;
}
.apply_view_btns{ display: flex; justify-content: flex-end; margin-top: 28px; }
.apply_view_btns .gold_btn{ text-decoration: none; }

@media screen and (max-width: 650px) {
    .apply_view_box{ padding: 20px 16px 24px; }
    .apply_view_dl .av_row{ flex-direction: column; gap: 6px; }
    .apply_view_dl dt{ flex: none; }
}

/* size - contact */
@media screen and (max-width: 960px) {
    .contact_steps{padding: 0 20px;}
    .contact_steps{ flex-wrap: wrap; gap: 30px 0; }
    .contact_steps::before{ display: none; }
    .contact_steps li::after{ display: none; }
    .contact_steps li{ flex: 0 0 33.3%; }
    .contact_channels{ grid-template-columns: 1fr; gap: 16px; }
}
@media screen and (max-width: 650px) {
    .contact_steps li{ flex: 0 0 50%; }
}