@charset "utf-8";

/* 색 설정 */
:root {
    --main-color: #5f8c83;
    --deep-color: #11423f;
    --gold-color: #c9a96a;
    --gold-light: #e5c179;
    --green-txt: #68aea0;
    --black-color: #1a1d1b;
    --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;
    line-height: 140%;
}
body{ font-family: 'Pretendard', sans-serif; font-weight:400; font-size: 16px; letter-spacing:0; color:var(--black-color); }

/* 자간 규칙: 28px 이상 대형 타이틀만 -2%, 본문은 0 */
.sec1 h2, .sec1 .sys_tit p,
.sec_tit h3, .sec2 .quote_box h4,
.sec3 .step_card p, .sec5 .photo_card .name strong,
.sec8 .faq_tit h3, .sec9 .office_tab button{ letter-spacing:-0.02em; }
section{ display:block; }
a{ color:inherit; text-decoration: none; }
a:hover{ text-decoration: none; color: inherit;  }
button{ background:none; border:none; cursor:pointer; padding:0; }
img{ max-width:100%; }
.serif{ font-family:'Noto Serif KR', serif; }

.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/divorce//common/select-icon.png') no-repeat 98% 50% #fff;
}
select::-ms-expand{ display:none; }
p{ word-break: keep-all; }

/* 공통 섹션 타이틀 */
.sec_tit{ margin-bottom:60px; }
.sec_tit .label{ display:block; font-weight:700; font-size:17.8px; color:var(--gold-color); margin-bottom:14px; }
.sec_tit h3{ font-weight:700; font-size:42px; color:#333; line-height:1.2; }
.sec_tit h3 strong{ color:var(--green-txt); }
.sec5 .sec_tit h3, .sec6 .sec_tit h3, .sec7 .sec_tit h3, .sec9 .sec_tit h3{ color:var(--black-color); }
.sec7 .sec_tit h3{ font-weight:600; } /* 시안: SemiBold */
.sec6 .sec_tit .label, .sec9 .sec_tit .label{ color:#e5cf87; } /* 시안 라벨 색상 */
.sec_tit .sub{ margin-top:20px; font-weight:400; font-size:20px; color:var(--black-color); }
.sec_tit.center{ text-align:center; }

.mo_br{ display:none; } /* 650 이하 전용 줄바꿈 */

/* fade-up 기본상태 (gsap) */
.fade-up{ opacity:0; transform:translateY(40px); }
body.no-gsap .fade-up{ opacity:1; transform:none; }

@media screen and (max-width: 1250px) {
    .inner{ width:100%; padding:0 20px; }
    .sec_tit h3{ font-size:38px; }
}
@media screen and (max-width: 960px) {
    .sec_tit h3{ font-size:32px; }
    .sec_tit .sub{ font-size:18px; }
    .sec_tit .label{ font-size:16px; }
}
@media screen and (max-width: 650px) {
    body{ font-size:15px; }
    .paging_box{ font-size:15px; }
    .sec_tit{ margin-bottom:40px; }
    .sec_tit h3{ font-size:24px; }
    .sec_tit .sub{ font-size:16px; }
    .sec_tit .label{ font-size:15px; }
    .mo_br{ display:block; }
}

/* ---------------- 헤더 ---------------- */
#header{ position:fixed; top:0; left:0; width:100%; z-index:100; background:rgba(255,255,255,0.9); border-bottom:1px solid rgba(255,255,255,0.4); box-shadow:0 1px 0 rgba(0,0,0,0.03); }
#header .header_in{ width:1200px; margin:0 auto; height:80px; display:flex; align-items:center; }
#header .logo a{ display:flex; align-items:center; gap:10px; }
#header .logo img{ height:40px; }
#header .logo span{ font-weight:600; font-size:14px; color:var(--deep-color); }
#header .gnb{ display:flex; align-items:center; gap:36px; margin-left:auto; }
#header .gnb a{font-weight:500; font-size:16px; transition:color .2s; }
#header .gnb a:hover{ color:var(--main-color); }
#header .btn_consult{color: #fff; margin-left:4px; display:flex; align-items:center; justify-content:center; width:173px; height:40px; background:var(--main-color); border-radius:4px; box-shadow:0 4px 4px rgba(0,0,0,0.1); font-weight:700; font-size:18px; transition:background .2s; }
#header .btn_consult:hover{ background:var(--deep-color); color:#fff; }
#header .btn_menu{ display:none; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:40px; height:40px; margin-left:auto; position:relative; z-index:3; }
#header .header_in{ position:relative; z-index:2; }
#header::before{ content:''; position:fixed; inset:0; background:rgba(0,0,0,0.35); opacity:0; visibility:hidden; transition:opacity .3s; z-index:0; }
#header.menu_open::before{ opacity:1; visibility:visible; }
#header .btn_menu span{ display:block; width:22px; height:2px; background:var(--black-color); border-radius:2px; transition:transform .3s, opacity .3s; }
#header.menu_open .btn_menu span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
#header.menu_open .btn_menu span:nth-child(2){ opacity:0; }
#header.menu_open .btn_menu span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media screen and (max-width: 1250px) {
    #header .header_in{ width:100%; padding:0 20px; }
    #header .gnb{ gap:16px; }
    #header .gnb a{ font-size:15px; }
    #header .btn_consult{ margin-left:2px; width:auto; padding:0 18px; font-size:16px; }
}
@media screen and (max-width: 960px) {
    /* 헤더: 햄버거 + 우측 드로어 메뉴 */
    #header .gnb{ position:fixed; top:0; right:0; width:280px; height:100vh; flex-direction:column; align-items:stretch; gap:0; margin:0; background:#fff; box-shadow:-10px 0 30px rgba(0,0,0,0.12); padding:88px 0 24px; transform:translateX(100%); visibility:hidden; transition:transform .35s ease, visibility .35s; z-index:1; }
    #header.menu_open .gnb{ transform:translateX(0); visibility:visible; }
    #header .gnb a{ padding:14px 26px; font-size:16px; border-bottom:1px solid #f5f5f5; }
    #header .gnb .btn_consult{ margin:24px 24px 0; width:calc(100% - 48px); border-bottom:none; padding:0; height:44px; font-size:16px; }
    #header .btn_menu{ display:flex; }
}
@media screen and (max-width: 650px) {
    #header .header_in{ height:64px; }
    #header .logo img{ height:32px; }
    #header .btn_consult{ width:auto; padding:0 16px; height:36px; margin-left:auto; font-size:16px; }
}

/* ---------------- sec1 메인 비주얼 ---------------- */
.sec1{ position:relative; height:100vh; min-height:700px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.sec1 .bg{ position:absolute; inset:0; pointer-events:none; }
.sec1 .bg .bg_img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.sec1 .bg .bg_overlay{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0.3; }
.sec1 .bg .bg_dim{ position:absolute; inset:0; background:rgba(0,0,0,0.4); }
.sec1 .sec1_txt{ position:relative; text-align:center; color:#fff; margin-top:-40px; }
.sec1 .sys_tit{ display:flex; align-items:center; justify-content:center; gap:30px; margin-bottom:40px; }
.sec1 .sys_tit .line{ width:364px; height:2px; }
.sec1 .sys_tit .line.left{ background:linear-gradient(to right, rgba(222,255,248,0), #defff8); }
.sec1 .sys_tit .line.right{ background:linear-gradient(to right, #defff8, rgba(222,255,248,0)); }
.sec1 .sys_tit p{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:32px; text-shadow:0 0 15px rgba(0,0,0,0.25); white-space:nowrap; }
.sec1 .sys_tit em{ font-style:normal; font-weight:500; font-size:24.7px; }
.sec1 .sys_tit img{ height:35px; }
.sec1 h2{ font-weight:500; font-size:62px; line-height:1.4; }
.sec1 h2 strong{ font-weight:700; color:#ffe392; }
.sec1 .eng{ margin-top:22px; font-family:'Noto Serif KR', serif; font-weight:400; font-size:24px; }
.sec1 .btn_box{ margin-top:40px; display:flex; justify-content:center; gap:30px; }
.sec1 .btn{ display:flex; align-items:center; justify-content:center; gap:8px; width:250px; height:64px; border-radius:5px; font-weight:700; font-size:20px; color:#fff; transition:transform .2s, background .2s; }
.sec1 .btn img{ width:20px; height:20px; }
.sec1 .btn.ghost{ background:rgba(255,255,255,0.2); border:1px solid rgba(249,249,249,0.2); }
.sec1 .btn.fill{ background:var(--main-color); border:1px solid rgba(249,249,249,0.3); box-shadow:2px 2px 4px rgba(0,0,0,0.25); }
.sec1 .btn:hover{ transform:translateY(-3px); }

/* 우측 퀵메뉴 (브라우저 우측 하단 고정) */
.quick_menu{ position:fixed; right:30px; bottom:30px; display:flex; flex-direction:column; gap:20px; z-index:94; }
.quick_menu a{ width:66px; height:66px; border-radius:50%; background:linear-gradient(135deg, #e4d0a9 0%, #be9c5a 100%); box-shadow:2px 2px 4px rgba(0,0,0,0.25); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; color:#fff; text-align:center; transition:filter .2s; }
.quick_menu a:hover{ filter:brightness(1.08); }
.quick_menu img{ width:26px; height:26px; object-fit:contain; }
.quick_menu span{ font-weight:400; font-size:12px; line-height:1.1; }
/* 사무소 선택 팝업 (퀵메뉴 연동) */
.pop_dim{ position:fixed; inset:0; background:rgba(255,255,255,0.8); z-index:93; opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s; }
.pop_dim.on{ opacity:1; visibility:visible; }
.office_popup{ position:fixed; right:106px; bottom:30px; width:307px; background:#fff; border-radius:10px; box-shadow:0 12px 30px rgba(0,0,0,0.25); overflow:hidden; z-index:95; opacity:0; visibility:hidden; transform:translateY(16px); transition:opacity .3s ease, transform .3s ease, visibility .3s; }
.office_popup.on{ opacity:1; visibility:visible; transform:none; }
.office_popup .pop_head{ position:relative; background:#5F8C83; color:#fff; padding:14px 16px 17px; }
.office_popup .pop_label{ display:block; font-style:normal; font-weight:500; font-size:16px; color:#e5cf87; line-height:1.2; margin-bottom:5px; }
.office_popup .pop_head p{ font-weight:500; font-size:20px; line-height:1.2; letter-spacing:-0.05em; white-space:nowrap; }
.office_popup .pop_close{ position:absolute; right:15px; top:15px; width:16px; height:16px; }
.office_popup .pop_close img{ display:block; width:100%; height:100%; }
.office_popup ul{ margin:0; padding:6px 10px; list-style:none; }
.office_popup li + li{ border-top:1px solid #ddd; }
.office_popup li a{ display:flex; align-items:center; gap:10px; padding:14px 4px; }
.office_popup li i{ width:40px; height:40px; flex-shrink:0; background:url('../../img/divorce//main/pop-circle.svg') no-repeat center / contain; display:flex; align-items:center; justify-content:center; font-style:normal; font-weight:600; font-size:12px; color:#fff; padding-bottom:3px; padding-right:3px; }
.office_popup li span{ font-weight:600; font-size:18px; color:#333; }
.office_popup li .arr{ margin-left:auto; width:17px; }
.office_popup li a:hover span{ color:var(--main-color); }

/* 퀵메뉴 반응형 사이즈 */
@media screen and (max-width: 1250px) {
    .quick_menu{ gap:16px; }
    .quick_menu a{ width:60px; height:60px; }
    .quick_menu img{ width:24px; height:24px; }
    .office_popup{ right:100px; }
}
@media screen and (max-width: 960px) {
    .quick_menu{ right:20px; bottom:20px; gap:12px; }
    .quick_menu a{ width:54px; height:54px; gap:2px; }
    .quick_menu img{ width:20px; height:20px; }
    .quick_menu span{ font-size:10px; }
    /* 팝업 반응형 1단계 */
    .office_popup{ right:84px; bottom:20px; width:280px; }
    .office_popup .pop_head{ padding:12px 14px 15px; }
    .office_popup .pop_head p{ font-size:18px; }
    .office_popup .pop_label{ font-size:15px; }
    .office_popup li i{ width:36px; height:36px; font-size:11px; }
    .office_popup li span{ font-size:16px; }
    .office_popup li a{ padding:12px 4px; }
}
@media screen and (max-width: 650px) {
    .quick_menu{ right:14px; bottom:14px; gap:10px; }
    .quick_menu a{ width:52px; height:52px; gap:1px; }
    .quick_menu img{ width:16px; height:16px; }
    .quick_menu span{ font-size:10px; transform:scale(0.9); }
    /* 팝업 반응형 2단계 */
    .office_popup{ right:72px; bottom:14px; width:252px; }
    .office_popup .pop_head{ padding:11px 13px 13px; }
    .office_popup .pop_head p{ font-size:15px; }
    .office_popup .pop_label{ font-size:15px; margin-bottom:3px; }
    .office_popup .pop_close{ right:12px; top:12px; width:14px; height:14px; }
    .office_popup li i{ width:34px; height:34px; font-size:11px; }
    .office_popup li span{ font-size:15px; }
    .office_popup li a{ padding:11px 4px; gap:8px; }
    .office_popup li .arr{ width:14px; }
}


.sec1 .scroll_down{ position:absolute; left:50%; transform:translateX(-50%); bottom:30px; display:flex; align-items:center; gap:10px; z-index:5; }
.sec1 .scroll_down img{ height:16px; animation:scrollMove 1.6s ease-in-out infinite; }
.sec1 .scroll_down span{ font-weight:500; font-size:16px; color:var(--main-color); text-transform:uppercase; }
@keyframes scrollMove{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(6px);} }

@media screen and (max-width: 1250px) {
    .sec1 h2{ font-size:52px; }
    .sec1 .sys_tit p{ font-size:28px; }
    .sec1 .sys_tit em{ font-size:22px; }
    .sec1 .eng{ font-size:22px; }
    .sec1 .sys_tit .line{ width:120px; }
}
@media screen and (max-width: 960px) {
    .sec1 h2{ font-size:42px; }
    .sec1 .sys_tit p{ font-size:24px; }
    .sec1 .sys_tit em{ font-size:19px; }
    .sec1 .sys_tit img{ height:28px; }
    .sec1 .eng{ font-size:20px; }
    .sec1 .btn_box{ gap:16px; }
    .sec1 .btn{ width:230px; height:56px; font-size:18px; }
    .sec1 .scroll_down span{ font-size:16px; }
}
@media screen and (max-width: 650px) {
    .sec1{ min-height:600px; }
    .sec1 .sec1_txt{ margin-top:0; }
    .sec1 h2{ font-size:28px; }
    .sec1 .sys_tit{ gap:14px; margin-bottom:24px; }
    .sec1 .sys_tit p{ font-size:20px; }
    .sec1 .sys_tit em{ font-size:16px; }
    .sec1 .sys_tit img{ height:22px; }
    .sec1 .sys_tit .line{ width:40px; }
    .sec1 .eng{ font-size:16px; }
    .sec1 .btn_box{ flex-direction:column; align-items:center; margin-top:40px; }
    .sec1 .btn{ width:calc(100% - 40px); height:54px; }
    .sec1 .scroll_down span{ font-size:15px; }
    /* .quick_menu{ display:none; } */
}

/* ---------------- sec2 Why Strategy ---------------- */
.sec2{ padding:100px 0 0; }
.sec2 .sec2_body{ position:relative; padding-bottom:42px; }
.sec2 .wave_bg{ position:absolute; left:0; top:42px; height:60%; width:100%; z-index:0; pointer-events:none; background:#f7feff; }
.sec2 .wave_bg img{ display:none; }
.sec2 .sec2_flex{ position:relative; z-index:1; display:flex; justify-content:space-between; align-items:flex-start; gap:40px; }
.sec2 .quote_box{ position:relative; width:514px; padding:121px 0 0; text-align:center; flex-shrink:0; }
.sec2 .quote_box .quote{ position:absolute; top:119px; width:32px; }
.sec2 .quote_box .quote.open{ left:38px; }
.sec2 .quote_box .quote.close{ right:38px; }
.sec2 .quote_box h4{ font-weight:700; font-size:38px; line-height:1.4; }
.sec2 .quote_box .sub{ margin-top:6px; font-weight:500; font-size:24px; line-height:1.485; white-space:nowrap; width:max-content; margin-left:50%; transform:translateX(-50%); }
/* 자간 0 기준으로는 한 줄 유지가 불가한 줄이라 -2% 예외 적용 (줄바꿈 금지 유지용) */
.sec2 .quote_box .desc{ margin-top:34px; font-weight:400; font-size:18px; line-height:1.5; white-space:nowrap; width:max-content; margin-left:50%; transform:translateX(-50%); letter-spacing:-0.02em; }
.sec2 .quote_box .desc.big{ letter-spacing:0; }
.sec2 .quote_box .desc.big{ margin-top:2px; font-weight:500; font-size:24px; line-height:1.5; }
.sec2 .quote_box .desc.big strong{ font-weight:600; color:var(--gold-light); }
.sec2 .card_list{ display:grid; grid-template-columns:repeat(2, 284px); gap:35px 22px; }
.sec2 .card_list li{ background:#fff; border-radius:4px; box-shadow:3px 10px 10px rgba(0,0,0,0.15); height:auto; padding:40px 20px; text-align:center; }
.sec2 .card_list li:nth-child(3), .sec2 .card_list li:nth-child(4){ margin-top:0; }
.sec2 .card_list strong{ display:block; font-weight:600; font-size:20px; color:var(--black-color); }
.sec2 .card_list .bar{ display:block; width:85px; height:1px; margin:18px auto; background:#ffe392; }
.sec2 .card_list p{ font-weight:400; font-size:16px; color:#555; line-height:1.5; }

@media screen and (max-width: 1250px) {
    .sec2{ padding:80px 0; }
    .sec2 .sec2_flex{ gap:30px; }
    .sec2 .quote_box{ width:100%; max-width:620px; padding-top:80px; flex:1; }
    .sec2 .quote_box .quote{ top:78px; }
    .sec2 .quote_box h4{ font-size:34px; }
    .sec2 .quote_box .sub, .sec2 .quote_box .desc.big{ font-size:22px; }
    .sec2 .quote_box .sub, .sec2 .quote_box .desc{ white-space:normal; width:auto; margin-left:0; transform:none; letter-spacing:0; }
    .sec2 .quote_box .desc.big br{ display:none; }
    .sec2 .wave_bg{ height:60%; top:auto; bottom:0; } /* JS(sec2BgResize)가 본문+카드 기준 중앙 50%로 보정 */
    .sec2 .card_list{ grid-template-columns:repeat(2, minmax(220px, 250px)); justify-content:center; }
    .sec2 .card_list li{ padding:20px; }
}
@media screen and (max-width: 960px) {
    .sec2{ padding:60px 0; }
    .sec2 .sec2_flex{ flex-direction:column; align-items:center; }
    .sec2 .quote_box{ flex:none; }
    .sec2 .quote_box h4{ font-size:30px; }
    .sec2 .quote_box .sub, .sec2 .quote_box .desc.big{ font-size:20px; }
}
@media screen and (max-width: 650px) {
    .sec2{ padding-top:40px; }
    .sec2 .quote_box{ padding-top:32px; }
    .sec2 .quote_box .quote{ top:30px; width:24px; }
    .sec2 .quote_box .quote.open{ left:10px; }
    .sec2 .quote_box .quote.close{ right:10px; }
    .sec2 .quote_box h4{ font-size:22px; }
    .sec2 .quote_box .sub, .sec2 .quote_box .desc.big{ font-size:17px; }
    .sec2 .quote_box .desc{ font-size:15px; }
    .sec2 .card_list{ grid-template-columns:minmax(220px, 100%); width:100%; gap:10px; }
    .sec2 .card_list li{ height:auto; width:100%; padding:20px; }
    .sec2 .card_list strong{ font-size:16px; }
    .sec2 .card_list p{ font-size:15px; }
}

/* ---------------- sec3 Strategy System ---------------- */
.sec3{ position:relative; padding:100px 0; overflow:hidden; }
.sec3 > .bg{ position:absolute; inset:0; height:1277px; overflow:hidden; pointer-events:none; }
.sec3 > .bg img{ position:absolute; left:0; top:-7.76%; width:100%; height:123.14%; object-fit:cover; opacity:0.5; }
.sec3 > .bg .bg_grad{ position:absolute; inset:0; background:linear-gradient(to bottom, rgba(248,255,253,0.6), #fff); }
.sec3 .inner{ position:relative; z-index:1; }
.sec3 .step_flex{ display:flex; gap:46px; align-items:flex-start; }
.sec3 .step_card{ position:relative; width:338px; height:298px; border-radius:10px; overflow:hidden; flex-shrink:0; }
.sec3 .step_card .card_img{ position:absolute; left:-84.28%; top:-2.84%; width:184.41%; height:129.07%; max-width:none; object-fit:cover; }
.sec3 .step_card .dim{ position:absolute; inset:0; background:rgba(95,140,131,0.2); }
.sec3 .step_card .watermark{ position:absolute; left:38px; top:116px; width:244px; height:293px; }
.sec3 .step_card p{ position:relative; padding:30px 0 0 31px; font-weight:700; font-size:28px; color:#2a4646; line-height:1.4; }
.sec3 .step_list{ flex:1; display:flex; gap:24px; margin:0; padding-top:120px; list-style:none; padding-left:0; }
.sec3 .step_list li{ flex:1; }
.sec3 .num_line{ display:flex; align-items:center; gap:12px; }
.sec3 .num_line i{ flex-shrink:0; width:36px; height:36px; border:1px solid var(--main-color); border-radius:50%; background:linear-gradient(160deg, #fffdf8 0%, #f6efe3 100%); display:flex; align-items:center; justify-content:center; font-style:normal; font-weight:700; font-size:14px; color:var(--main-color); }
.sec3 .num_line .step{ font-weight:500; font-size:20px; color:var(--black-color); white-space:nowrap; }
.sec3 .num_line .hline{ flex:none; width:48px; height:2px; background:linear-gradient(to right, var(--main-color), rgba(95,140,131,0)); }
.sec3 .step_list strong{ display:block; margin-top:17px; font-weight:600; font-size:20px; color:var(--black-color); }
.sec3 .step_list p{ margin-top:8px; font-weight:400; font-size:16px; color:#555; line-height:1.4; }

.sec3 .gold_banner{ margin:50px 0 86px; padding:20px 0; text-align:center; background:linear-gradient(to right, rgba(255,230,149,0.03), rgba(255,230,149,0.12) 50%, rgba(255,230,149,0.03)); }
.sec3 .gold_banner p{ font-weight:500; font-size:20px; color:var(--black-color); line-height:1.6; }

/* 단계 매트릭스 */
.sec3 .matrix{ margin-top:-10px; display:grid; grid-template-columns:197px repeat(4, 250px); row-gap:18px; column-gap:0; align-items:start;
    grid-template-areas:
        ".  h1  h2  h3  h4"
        "t1 a11 a21 a31 a41"
        "t2 a12 a22 a32 a42"
        "t3 a13 a23 a33 a43"; }
.sec3 .matrix .t1{ grid-area:t1; } .sec3 .matrix .t2{ grid-area:t2; } .sec3 .matrix .t3{ grid-area:t3; }
.sec3 .matrix .h1{ grid-area:h1; } .sec3 .matrix .h2{ grid-area:h2; } .sec3 .matrix .h3{ grid-area:h3; } .sec3 .matrix .h4{ grid-area:h4; }
.sec3 .matrix .a11{ grid-area:a11; } .sec3 .matrix .a12{ grid-area:a12; } .sec3 .matrix .a13{ grid-area:a13; }
.sec3 .matrix .a21{ grid-area:a21; } .sec3 .matrix .a22{ grid-area:a22; } .sec3 .matrix .a23{ grid-area:a23; }
.sec3 .matrix .a31{ grid-area:a31; } .sec3 .matrix .a32{ grid-area:a32; } .sec3 .matrix .a33{ grid-area:a33; }
.sec3 .matrix .a41{ grid-area:a41; } .sec3 .matrix .a42{ grid-area:a42; } .sec3 .matrix .a43{ grid-area:a43; }
.sec3 .col_head{ text-align:center; align-self:end; }
.sec3 .col_head strong{ display:block; font-weight:700; font-size:20px; margin-bottom:14px; }
.sec3 .col_head .bar{ display:block; height:5px; }
.sec3 .col_head .bar.c1{ background:#b2d3cc; }
.sec3 .col_head .bar.c2{ background:#90bab2; }
.sec3 .col_head .bar.c3{ background:#66948b; }
.sec3 .col_head .bar.c4{ background:linear-gradient(to right, #457a70, #11423f); }
.sec3 .matrix .row_tit{ width:179px; display:flex; align-items:center; justify-content:center; min-height:85px; align-self:stretch; border-left:3px solid var(--gold-color); border-radius:3px; background:linear-gradient(99deg, #fffdf8 0%, #f6efe3 100%); font-weight:600; font-size:20px; color:#808080; }
.sec3 .matrix .cell{ padding:5px 20px 0 27px; position:relative; font-weight:400; font-size:18px; color:#555; line-height:1.4; }
.sec3 .matrix .cell::before{ content:''; position:absolute; left:0; top:10px; width:15px; height:15px; background:url('../../img/divorce//main/ico-check.svg') no-repeat center / contain; }

@media screen and (max-width: 1250px) {
    .sec3{ padding:80px 0; }
    .sec3 .step_card p{ font-size:26px; }
    /* 카드+스텝 가로정렬 유지, 스텝만 2×2 (카드-스텝 동일 높이) */
    .sec3 .step_flex{ align-items:stretch; }
    .sec3 .step_card{ height:auto; min-height:298px; }
    .sec3 .step_list{ padding-top:0; flex-wrap:wrap; gap:30px 24px; align-content:center; }
    .sec3 .step_list li{ flex:0 1 calc(50% - 12px); }
    /* 매트릭스: 단계(이혼전/협의/소송/이후) 그룹 2×2 배열 */
    .sec3 .matrix{ grid-template-columns:1fr 1fr; column-gap:30px; row-gap:14px;
        grid-template-areas:
            "h1  h2"
            "a11 a21"
            "a12 a22"
            "a13 a23"
            "h3  h4"
            "a31 a41"
            "a32 a42"
            "a33 a43"; }
    .sec3 .matrix .row_tit{ display:none; }
    .sec3 .col_head{ text-align:left; align-self:end; margin-bottom:6px; }
    .sec3 .col_head strong{ margin-bottom:10px; }
    .sec3 .matrix .h3, .sec3 .matrix .h4{ margin-top:34px; }
}
@media screen and (max-width: 960px) {
    .sec3{ padding:60px 0; }
    .sec3 .step_card p{ font-size:23px; }
    .sec3 .gold_banner{ padding:20px 16px; }
    .sec3 .gold_banner p{ font-size:18px; }
    .sec3 .num_line .step{ font-size:18px; }
    .sec3 .col_head strong, .sec3 .matrix .row_tit{ font-size:18px; }
    .sec3 .matrix .cell{ font-size:16px; }
    /* 카드+스텝 세로정렬, 스텝도 세로 1열 */
    .sec3 .step_flex{ flex-direction:column; }
    .sec3 .step_card{ margin:0 auto; }
    .sec3 .step_list{ padding-top:30px; width:100%; }
    .sec3 .step_list li{ flex:1 1 100%; }
    /* 매트릭스: 단계 그룹 세로 1열 */
    .sec3 .matrix{ grid-template-columns:1fr;
        grid-template-areas:
            "h1" "a11" "a12" "a13"
            "h2" "a21" "a22" "a23"
            "h3" "a31" "a32" "a33"
            "h4" "a41" "a42" "a43"; }
    .sec3 .matrix .h2, .sec3 .matrix .h3, .sec3 .matrix .h4{ margin-top:34px; }
}
@media screen and (max-width: 650px) {
    .sec3{ padding:40px 0; }
    .sec3 .step_flex{ gap:20px; }
    .sec3 .step_card{ width:100%; max-width:338px; margin:0 auto; }
    .sec3 .step_card p{ font-size:24px; }
    .sec3 .step_list li{ flex:1 1 100%; }
    .sec3 .step_list strong{ font-size:16px; }
    .sec3 .step_list p{ font-size:15px; }
    .sec3 .num_line .step{ font-size:16px; }
    .sec3 .num_line i{ font-size:15px; }
    .sec3 .gold_banner{ margin:40px 0 60px; }
    .sec3 .gold_banner p{ font-size:16px; }
    .sec3 .matrix .row_tit{ font-size:16px; }
    .sec3 .matrix .cell{ font-size:15px; }
    .sec3 .matrix .cell br{ display:none; }
}

/* ---------------- sec4 Practice Areas ---------------- */
.sec4{ padding:100px 0 120px; }
.sec4 .tab_nav{ display:flex; gap:14px; flex-wrap:nowrap; overflow-x:auto; padding-bottom:30px; }
.sec4 .tab_nav button{ flex-shrink:0; padding:6px 12px; border-radius:5px; font-weight:500; font-size:18px; color:#999; transition:all .2s; }
.sec4 .tab_nav button.on{ background:#f0f6f3; color:#54ab99; }
.sec4 .tab_nav button:hover{ color:#54ab99; }
.sec4 .tab_nav{ border-bottom:1px solid #e1e1e1; margin-bottom:30px; }
.sec4 .tab_cont{ display:none; gap:23px; }
.sec4 .tab_cont.on{ display:flex; }
.sec4 .tab_cont .thumb{ width:486px; height:331px; border-radius:10px; overflow:hidden; flex-shrink:0; }
.sec4 .tab_cont .thumb img{ width:100%; height:100%; object-fit:cover; }
.sec4 .tab_cont .txt{ flex:1; padding-left:0; }
.sec4 .tab_cont .txt .tit{ display:flex; align-items:flex-start; gap:15px; }
.sec4 .tab_cont .txt .tit em{ font-family:'Noto Serif KR', serif; font-style:normal; font-weight:400; font-size:20px; color:#b9ccc6; }
.sec4 .tab_cont .txt .tit strong{ font-weight:600; font-size:24px; color:var(--black-color); line-height:1.2; }
.sec4 .tab_cont .issue_tit{ margin-top:22px; font-weight:500; font-size:18px; }
.sec4 .tab_cont .issue{ margin-top:8px; font-weight:300; font-size:16px; color:#555; line-height:1.6; }
.sec4 .tab_cont .divider{ margin:20px 0; height:1px; background:#d9d9d9; }
.sec4 .tab_cont .str_tit{ font-weight:500; font-size:18px; text-transform:uppercase; }
.sec4 .tab_cont .strategy{ margin-top:10px; font-weight:300; font-size:16px; color:#555; line-height:1.6; }
.sec4 .tab_paging{ margin-top:40px; display:flex; align-items:center; gap:16px; }
.sec4 .tab_paging button{ display:flex; align-items:center; }
.sec4 .tab_paging img{ height:9px; }
.sec4 .tab_paging .prev img{ transform:scaleX(-1); }
.sec4 .tab_paging .page{ font-weight:400; font-size:16px; color:#333; }
.sec4 .tab_paging .page em{ font-style:normal; }

@media screen and (max-width: 1250px) {
    .sec4{ padding:80px 0 100px; }
    .sec4 .tab_cont .txt .tit strong{ font-size:22px; }
    /* 사건유형: 960 초과까지 이미지+텍스트 가로 유지 */
    .sec4 .tab_cont .thumb{ width:42%; height:auto; aspect-ratio:486/331; }
}
@media screen and (max-width: 960px) {
    .sec4{ padding:60px 0 80px; }
    .sec4 .tab_nav button{ font-size:18px; }
    .sec4 .tab_cont .txt .tit em{ font-size:18px; }
    .sec4 .tab_cont .txt .tit strong{ font-size:20px; }
    /* 사건유형: 세로 배열 + 이미지 높이 축소 */
    .sec4 .tab_cont{ flex-direction:column; }
    .sec4 .tab_cont .thumb{ width:100%; aspect-ratio:auto; height:280px; }
}
@media screen and (max-width: 650px) {
    .sec4{ padding:40px 0 60px; }
    .sec4 .tab_nav{ margin-bottom:20px; padding-bottom:20px; }
    .sec4 .tab_nav button{ font-size:16px; }
    .sec4 .tab_cont .thumb{ height:200px; }
    .sec4 .tab_cont .txt .tit em{ font-size:16px; }
    .sec4 .tab_cont .txt .tit strong{ font-size:19px; }
    .sec4 .tab_cont .issue_tit, .sec4 .tab_cont .str_tit{ font-size:16px; }
    .sec4 .tab_cont .issue, .sec4 .tab_cont .strategy{ font-size:15px; }
    .sec4 .tab_paging .page{ font-size:15px; }
}

/* ---------------- sec5 Our Lawyers ---------------- */
.sec5{ padding:100px 0 120px; background:#f7f9f8; }
.sec5 .sec_tit{ margin-bottom:50px; }
.sec5 .sec_tit h3 strong{ color:var(--green-txt); }
.sec5 .lawyer_thumbs{ display:flex; justify-content:center; gap:30px; margin-bottom:60px; }
.sec5 .lawyer_thumbs button{ display:flex; flex-direction:column; align-items:center; gap:8px; }
.sec5 .lawyer_thumbs .pic{ width:70px; height:70px; border-radius:50%; overflow:hidden; background:#f1f2f4; box-shadow:2px 2px 4px rgba(0,0,0,0.12); transition:background .2s; }
.sec5 .lawyer_thumbs .pic img{ width:140%; height:132%; max-width:none; object-fit:cover; object-position:top; margin:-12% 0 0 -22.7%; }
.sec5 .lawyer_thumbs button.on .pic{ background:#f6efe3; }
.sec5 .lawyer_thumbs span:last-child{ font-weight:400; font-size:14px; color:#000; }
.sec5 .lawyer_profile{ display:flex; gap:50px; align-items:flex-start; }
.sec5 .photo_card{ position:relative; width:383px; height:436px; border-radius:8px; overflow:hidden; flex-shrink:0; background:linear-gradient(-31deg, #a0b3ae 9%, #3c6759 100%); }
.sec5 .photo_card .watermark{ position:absolute; left:24px; top:24px; width:273px; opacity:0.6; }
.sec5 .photo_card .photo{ position:absolute; right:-30px; bottom:0; height:95%; object-fit:contain; object-position:bottom; }
.sec5 .photo_card .name{ position:absolute; left:25px; top:24px; color:#fff; }
.sec5 .photo_card .name span{ display:block; font-weight:400; font-size:19.2px; }
.sec5 .photo_card .name strong{ display:block; font-weight:700; font-size:33.6px; }
.sec5 .profile_txt{ flex:1; padding-top:6px; }
.sec5 .quote_msg{ position:relative; padding-left:18px; border-left:3px solid; border-image:linear-gradient(to bottom, #c9a96a, #ffe695) 1; }
.sec5 .quote_msg p{ font-weight:300; font-size:15px; color:var(--black-color); line-height:1.5; }
.sec5 .quote_msg .from{ display:block; margin-top:14px; font-weight:500; font-size:14px; }
.sec5 .career{ margin-top:34px; padding-left:20px; list-style:disc; }
.sec5 .career li{ font-weight:400; font-size:18px; line-height:1.8; }
.sec5 .more{ display:inline-flex; align-items:center; gap:10px; margin-top:40px; font-weight:400; font-size:16px; color:#7f7f7f; transition:color .2s; }
.sec5 .more:hover{ color:var(--main-color); }
.sec5 .more img{ height:9px; }

@media screen and (max-width: 1250px) {
    .sec5{ padding:80px 0 100px; }
    .sec5 .photo_card .name strong{ font-size:30px; }
}
@media screen and (max-width: 960px) {
    .sec5{ padding:60px 0 80px; }
    .sec5 .photo_card .name strong{ font-size:27px; }
    .sec5 .career li{ font-size:18px; }
    /* 변호사: 프로필 이미지+약력 세로 배열 */
    .sec5 .lawyer_profile{ flex-direction:column; align-items:center; }
    .sec5 .profile_txt{ width:100%; }
}
@media screen and (max-width: 650px) {
    .sec5{ padding:40px 0 60px; }
    .sec5 .sec_tit{ margin-bottom:30px; }
    .sec5 .lawyer_thumbs{ flex-wrap:nowrap; justify-content:center; gap:10px; margin-bottom:30px; }
    .sec5 .lawyer_thumbs .pic{ width:52px; height:52px; }
    .sec5 .lawyer_thumbs span:last-child{ font-size:15px; }
    .sec5 .photo_card{ width:100%; max-width:383px; height:340px; }
    .sec5 .photo_card .name strong{ font-size:24px; }
    .sec5 .photo_card .name span{ font-size:16px; }
    .sec5 .career li{ font-size:16px; }
    .sec5 .quote_msg p, .sec5 .quote_msg .from, .sec5 .more{ font-size:15px; }
}

/* ---------------- sec6 성공사례 ---------------- */
.sec6{ padding:100px 0 120px; overflow:hidden; }
.sec6 .sec_tit{ margin-bottom:60px; }
.sec6 .case_slider{ overflow:visible; }
.sec6 .case_slider .swiper-slide{ width:387px; } /* slidesPerView:auto 일 때 slide 폭 필수 */
.sec6 .case_card{ width:100%; height:509px; border-radius:20px; background:rgba(245,245,245,0.9); backdrop-filter:blur(5px); padding:10px 16px 20px; display:flex; flex-direction:column; }
.sec6 .case_card > *{ flex-shrink:0; }
.sec6 .case_card .badge{ position:relative; display:inline-block; align-self:flex-start; font-style:normal; font-weight:600; font-size:24px; color:#222; line-height:1.8; z-index:1; }
.sec6 .case_card .badge::after{ content:''; position:absolute; left:-5px; bottom:8px; width:109px; height:16px; background:rgba(201,169,106,0.3); z-index:-1; }
.sec6 .case_card > strong{ margin-top:10px; font-weight:600; font-size:24px; color:#222; line-height:1.8; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.sec6 .case_card .doc{ margin:10px auto 0; width:158px; height:222px; border-radius:3px; background:url('../../img/divorce//main/case-doc.png') no-repeat center / cover; filter:drop-shadow(2px 2px 2px rgba(0,0,0,0.25)); }
.sec6 .case_card dl{ margin-top:auto; display:flex; flex-direction:column; }
.sec6 .case_card dl > div{ display:flex; align-items:center; justify-content:space-between; }
.sec6 .case_card dl > div:first-child{ padding-bottom:11px; border-bottom:1px solid #d9d9d9; }
.sec6 .case_card dl > div:last-child{ padding-top:15px; }
.sec6 .case_card dt{ display:flex; align-items:center; gap:9px; font-weight:600; font-size:18px; color:#222; line-height:1.4;  flex-shrink:0; }
.sec6 .case_card dt img{ width:18px; }
.sec6 .case_card dd{ font-weight:600; font-size:18px; color:#222; flex:1; min-width:0; margin-left:12px; text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sec6 .case_card .more_pill{ margin-top:16px; align-self:flex-start; display:flex; align-items:center; justify-content:center; width:110px; height:38px; border-radius:100px; background:var(--deep-color); font-weight:500; font-size:16px; color:#e8e2d2; transition:background .2s; }
.sec6 .case_card .more_pill:hover{ background:#0b2e2c; color:#fff; }
.sec6 .gold_banner{ margin-top:90px; position:relative; padding:26px 0 20px; text-align:center; background:linear-gradient(to right, rgba(255,230,149,0.03), rgba(255,230,149,0.12) 50%, rgba(255,230,149,0.03)); }
.sec6 .gold_banner .vline{ position:absolute; left:50%; top:-45px; width:2px; height:40px; background:linear-gradient(to bottom, rgba(255,209,60,0), #ffd13c); }
.sec6 .gold_banner p{ font-weight:600; font-size:24px; line-height:1.4; }

@media screen and (max-width: 1250px) {
    .sec6{ padding:80px 0 100px; }
    .sec6 .case_card .badge, .sec6 .case_card > strong{ font-size:22px; }
    .sec6 .gold_banner p{ font-size:22px; }
}
@media screen and (max-width: 960px) {
    .sec6{ padding:60px 0 80px; }
    .sec6 .case_card .badge, .sec6 .case_card > strong{ font-size:20px; }
    .sec6 .case_card dt, .sec6 .case_card dd{ font-size:18px; }
    .sec6 .gold_banner{ padding:24px 16px 20px; }
    .sec6 .gold_banner p{ font-size:20px; }
}
@media screen and (max-width: 650px) {
    .sec6{ padding:40px 0 60px; }
    .sec6 .case_slider .swiper-slide{ width:300px; }
    .sec6 .case_card{ height:auto; padding-bottom:24px; }
    .sec6 .case_card .badge, .sec6 .case_card > strong{ font-size:19px; }
    .sec6 .case_card > strong{ margin-top:4px; line-height:1.4; }
    .sec6 .case_card .badge::after{width: 90px;}
    .sec6 .case_card .doc{ margin-top:16px; }
    .sec6 .case_card dl{ margin-top:24px; }
    .sec6 .case_card dt, .sec6 .case_card dd{ font-size:16px; }
    .sec6 .case_card .more_pill{ font-size:15px; }
    .sec6 .gold_banner{ margin-top:60px; }
    .sec6 .gold_banner p{ font-size:16px; }
}

/* ---------------- sec7 고객후기 ---------------- */
.sec7{ padding:40px 0 130px; overflow:hidden; }
.sec7 .sec_tit{ margin-bottom:60px; }
.sec7 .review_slider{ overflow:visible; }
.sec7 .review_card{ position:relative; width:394px; border-radius:10px; padding:61px 20px 20px; }
.sec7 .review_card::before{ content:''; position:absolute; inset:0; border-radius:10px; background:url('../../img/divorce//main/review-bg.png') no-repeat center / cover; filter:blur(1.5px); }
.sec7 .review_card::after{ content:''; position:absolute; inset:0; border-radius:10px; background:linear-gradient(to bottom, rgba(251,251,251,0.85), rgba(251,251,251,0.95)); box-shadow:5px 11px 20px rgba(0,0,0,0.15); pointer-events:none; }
.sec7 .review_card .tag{ position:absolute; left:-16px; top:10px; z-index:2; display:inline-flex; align-items:center; justify-content:center; min-width:103px; height:40px; padding:0 16px; border-radius:5px; background:var(--main-color); font-style:normal; font-weight:500; font-size:18px; color:#fff; }
.sec7 .review_card p{ position:relative; z-index:1; font-weight:400; font-size:16px; color:#555; line-height:1.4; }

@media screen and (max-width: 1250px) {
    .sec7{ padding:30px 0 100px; }
}
@media screen and (max-width: 960px) {
    .sec7{ padding:20px 0 80px; }
    .sec7 .review_card .tag{ font-size:18px; }
}
@media screen and (max-width: 650px) {
    .sec7{ padding:14px 0 60px; }
    .sec7 .review_card{ width:320px; }
    .sec7 .review_card .tag{ font-size:16px; }
    .sec7 .review_card p{ font-size:15px; }
}

/* ---------------- sec8 FAQ ---------------- */
.sec8{ padding:60px 0 130px; }
.sec8 .faq_tit{ display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:40px; }
.sec8 .faq_tit h3{ font-weight:700; font-size:42px; color:#333; }
.sec8 .faq_tit p{ font-weight:400; font-size:20px; color:#555; }
.sec8 .faq_list{ border-top:3px solid #c2e0da; }
.sec8 .faq_list li{ border-bottom:1px solid #d9d9d9; }
.sec8 .faq_list .q{ width:100%; display:flex; align-items:center; gap:14px; padding:22px 4px; text-align:left; }
.sec8 .faq_list .q em{ font-family:'Noto Serif KR', serif; font-style:normal; font-weight:700; font-size:20px; color:var(--green-txt); }
.sec8 .faq_list .q span{ font-weight:600; font-size:20px; color:var(--black-color); }
.sec8 .faq_list .plus{ position:relative; margin-left:auto; width:20px; height:20px; flex-shrink:0; transition:transform .3s; }
.sec8 .faq_list .plus::before, .sec8 .faq_list .plus::after{ content:''; position:absolute; background:#d9d9d9; }
.sec8 .faq_list .plus::before{ left:0; top:9px; width:20px; height:2px; }
.sec8 .faq_list .plus::after{ left:9px; top:0; width:2px; height:20px; }
.sec8 .faq_list li.open .plus{ transform:rotate(45deg); }
.sec8 .faq_list .a{ display:none; padding:0 4px 24px 38px; }
.sec8 .faq_list .a p{ font-weight:400; font-size:17px; color:#555; line-height:1.6; }

@media screen and (max-width: 1250px) {
    .sec8{ padding:50px 0 100px; }
    .sec8 .faq_tit h3{ font-size:38px; }
}
@media screen and (max-width: 960px) {
    .sec8{ padding:40px 0 80px; }
    .sec8 .faq_tit h3{ font-size:32px; }
    .sec8 .faq_tit p{ font-size:18px; }
    .sec8 .faq_list .q span, .sec8 .faq_list .q em{ font-size:18px; }
}
@media screen and (max-width: 650px) {
    .sec8{ padding:30px 0 60px; }
    .sec8 .faq_tit{ flex-direction:column; align-items:flex-start; gap:8px; margin-bottom:24px; }
    .sec8 .faq_tit h3{ font-size:24px; }
    .sec8 .faq_tit p{ font-size:16px; }
    .sec8 .faq_list .q{ padding:16px 4px; gap:10px; }
    .sec8 .faq_list .q span, .sec8 .faq_list .q em{ font-size:16px; }
    .sec8 .faq_list .a{ padding-left:30px; }
    .sec8 .faq_list .a p{ font-size:15px; }
}

/* ---------------- sec9 상담 & 오시는 길 ---------------- */
.sec9{ padding:100px 0 120px; background:linear-gradient(117deg, #f4f9f8 0%, #f9f8f4 100%); }
.sec9 .loc_flex{ display:flex; gap:20px; justify-content:space-between; align-items:flex-start; }
.sec9 .loc_info{ width:590px; }
.sec9 .office_tab{ display:flex; gap:50px; margin-bottom:35px; }
.sec9 .office_tab button{ position:relative; padding-bottom:14px; font-weight:500; font-size:28px; color:#999; transition:color .2s; }
.sec9 .office_tab button.on{ font-weight:700; color:var(--black-color); }
.sec9 .office_tab button.on::after{ content:''; position:absolute; left:0; bottom:0; width:100%; height:5px; background:var(--black-color); }
.sec9 .office_body{ display:none !important; }
.sec9 .office_body.on{ display:block !important; }
.sec9 .map{ height:339px; border-radius:10px; overflow:hidden; }
.sec9 .map .root_daum_roughmap{ width:100% !important; }
.sec9 .map .wrap_map{ width:100% !important; height:339px !important; }
.sec9 .map iframe{ display:block; width:100% !important; height:339px !important; border:0; }
.sec9 .info_box{ margin-top:50px; }
.sec9 .info_box strong{ display:block; font-weight:600; font-size:20px; color:#555; padding-bottom:20px; border-bottom:2px solid #555; }
.sec9 .contact_row{ display:flex; gap:60px; padding:22px 0 36px; }
.sec9 .contact_row li{ display:flex; align-items:center; gap:16px; }
.sec9 .contact_row img{ width:28px; height:28px; object-fit:contain; }
.sec9 .contact_row span{ font-weight:400; font-size:20px; color:#555; }
.sec9 .consult_form{ position:relative; width:590px; background:#fff; border-radius:10px; box-shadow:8px 10px 24px rgba(0,0,0,0.15); padding:56px 30px 40px; }
.sec9 .consult_form .pager{ position:absolute; right:30px; top:20px; font-weight:500; font-size:18px; color:#999; }
.sec9 .consult_form .pager em{ font-style:normal; color:var(--black-color); }
.sec9 .field{ margin-bottom:24px; }
.sec9 .field > label{ display:block; font-weight:400; font-size:16px; color:#222; margin-bottom:10px; }
.sec9 .field > label i{ font-style:normal; color:#eb5757; }
.sec9 .field input[type="text"], .sec9 .field textarea{ width:100%; background:#fbfbfb; border:1px solid #e1e1e1; border-radius:2px; padding:12px 10px; font-weight:400; font-size:14px; color:#333; outline:none; }
.sec9 .field input[type="text"]::placeholder, .sec9 .field textarea::placeholder{ color:rgba(127,127,127,0.2); }
.sec9 .field input[type="text"]:focus, .sec9 .field textarea:focus{ border-color:var(--main-color); }
.sec9 .field textarea{ height:124px; resize:none; }
.sec9 .radio_row{ display:flex; gap:35px; }
.sec9 .radio_row .radio{ display:flex; align-items:center; gap:10px; font-weight:400; font-size:16px; color:#999; cursor:pointer; margin-bottom:0; }
.sec9 .radio_row .radio input{ display:none; }
.sec9 .radio_row .radio span{ width:18px; height:18px; background:url('../../img/divorce//main/radio-off.svg') no-repeat center / contain; flex-shrink:0; }
.sec9 .radio_row .radio input:checked + span{ background-image:url('../../img/divorce//main/radio-on.svg'); }
.sec9 .radio_row .radio:has(input:checked){ color:#000; }
.sec9 .btn_next{ display:block; width:285px; height:43px; margin:36px auto 0; border-radius:26px; background:var(--deep-color); font-weight:700; font-size:14px; color:#fff; transition:background .2s; }
.sec9 .btn_next:hover{ background:#0b2e2c; }

/* 상담폼 STEP 2 (자가 진단) */
.sec9 .form_step.step2{ display:none; }
.sec9 .consult_form.on_step2 .step1{ display:none; }
.sec9 .consult_form.on_step2 .step2{ display:block; }
.sec9 .diag_tit{ font-weight:500; font-size:18px; color:#222; margin-bottom:21px; }
.sec9 .diag_tit i{ font-style:normal; color:#eb5757; }
.sec9 .step2 .field{ margin-bottom:20px; }
.sec9 .step2 .field > label{ display:block; margin-bottom:12px; }
.sec9 .opt_row{ display:flex; flex-wrap:wrap; gap:8px 10px; max-width:410px; }
.sec9 .opt{ cursor:pointer; margin:0; }
.sec9 .opt input{ display:none; }
.sec9 .opt .text{ display:flex; align-items:center; justify-content:center; box-sizing:border-box; width:120px; height:35px; border:1px solid #e1e1e1; border-radius:3px; background:#fbfbfb; font-weight:500; font-size:16px; color:#999; text-align:center; transition:border-color .2s, color .2s; }
.sec9 .opt.on .text,
.sec9 .opt input:checked + .text{ border-color:#1f7a5c; color:#1f7a5c; }
.sec9 .check_list{ display:flex; flex-wrap:wrap; gap:17px 24px; }
.sec9 .chk{ display:inline-flex; flex-direction:row; align-items:center; gap:10px; font-weight:400; font-size:16px; color:#999; transition:color .2s; cursor:pointer; margin:0; }
.sec9 .chk input{ display:none; }
.sec9 .chk .mark{ display:block; width:18px; height:18px; background:url('../../img/divorce/main/radio-off.svg') no-repeat center / contain; flex-shrink:0; }
.sec9 .chk input:checked + .mark,
.sec9 .chk.on .mark{ background-image:url('../../img/divorce/main/radio-on.svg'); }
.sec9 .chk .text{ display:inline; width:auto; height:auto; border:none; background:none; padding:0; font-weight:400; font-size:16px; color:#999; text-align:left; line-height:1.2; }
.sec9 .chk input:checked ~ .text,
.sec9 .chk.on .text{ color:#000; }
.sec9 .agree{ display:flex; align-items:center; gap:10px; margin-top:31px; font-weight:400; font-size:12px; color:#7f7f7f; cursor:pointer; }
.sec9 .agree input{ display:none; }
.sec9 .agree span{ width:16px; height:16px; border:1px solid #c4c4c4; border-radius:2px; background:#fff; flex-shrink:0; }
.sec9 .agree input:checked + span{ border:none; background:url('../../img/divorce/main/check-agree.svg') no-repeat center / contain; }
.sec9 .btn_row{ display:flex; justify-content:center; align-items:center; gap:10px; margin-top:36px; }
.sec9 .btn_row .btn_next{ margin:0; }
.sec9 .btn_prev{ width:120px; height:43px; border-radius:26px; border:1px solid #c4c4c4; background:#fff; font-weight:500; font-size:14px; color:#777; transition:all .2s; }
.sec9 .btn_prev:hover{ border-color:var(--deep-color); color:var(--deep-color); }

@media screen and (max-width: 1250px) {
    .sec9{ padding:80px 0 100px; }
    .sec9 .office_tab button{ font-size:26px; }
    .sec9 .loc_flex{ flex-direction:column; gap:60px; }
    .sec9 .loc_info, .sec9 .consult_form{ width:100%; }
}
@media screen and (max-width: 960px) {
    .sec9{ padding:60px 0 80px; }
    .sec9 .office_tab button{ font-size:23px; }
    .sec9 .contact_row span{ font-size:18px; }
    .sec9 .diag_tit{ font-size:18px; }
}
@media screen and (max-width: 650px) {
    .sec9{ padding:40px 0 60px; }
    .sec9 .loc_flex{ gap:20px; }
    .sec9 .office_tab{ gap:30px; margin-bottom:24px; }
    .sec9 .office_tab button{ font-size:19px; }
    .sec9 .map{ height:240px; }
    .sec9 .info_box{ margin-top:36px; }
    .sec9 .contact_row{ flex-direction:column; align-items:flex-start; gap:14px; padding:18px 0 28px; }
    .sec9 .contact_row img{ width:20px; height:20px; }
    .sec9 .contact_row span{ font-size:15px; }
    .sec9 .consult_form{ padding:48px 16px 30px; }
    .sec9 .consult_form .pager{ font-size:15px; }
    .sec9 .diag_tit{ font-size:16px; }
    .sec9 .field label,
    .sec9 .field input[type="text"],
    .sec9 .field textarea,
    .sec9 .radio_row .radio,
    .sec9 .opt,
    .sec9 .chk,
    .sec9 .agree,
    .sec9 .btn_next,
    .sec9 .btn_prev{ font-size:15px; }
    .sec9 .opt{ width:calc(50% - 5px); }
    .sec9 .opt .text{ width:100%; font-size:15px; }
    .sec9 .chk .text{ font-size:15px; }
    .sec9 .btn_row{ gap:8px; }
    .sec9 .btn_prev{ width:100px; }
}

/* ---------------- 푸터 ---------------- */
#footer{ background:#222; padding:88px 0; }
#footer .footer_flex{ display:flex; gap:100px; }
#footer .f_logo{ width:310px; text-align:center; flex-shrink:0; }
#footer .f_logo img{ width:135px; }
#footer .f_logo p{ margin-top:50px; font-weight:400; font-size:14px; color:rgba(255,255,255,0.2); }
#footer .f_info{ flex:1; color:#fff; }
#footer .f_info .row{ display:flex; align-items:center; gap:26px; padding:14px 0; }
#footer .f_info .row.head{ padding-top:0; border-bottom:1px solid rgba(217,217,217,0.4); }
#footer .f_info .row.dark{ border-top:1px solid #353535; }
#footer .f_info .row.head strong{ font-weight: 400; font-size:18px; }
#footer .f_info .row.head span{ font-weight:400; font-size:15px; color:rgba(255,255,255,0.4); }
#footer .f_info .row.head b{ font-weight:400; font-size:18px; color:#fff; margin-left:8px; }
#footer .f_info .row dl{ display:flex; align-items:center; gap:26px; }
#footer .f_info .row dt{ font-weight:400; font-size:15px; color:rgba(255,255,255,0.4); min-width:82px; }
#footer .f_info .row dd{ font-weight:400; font-size:18px; }
#footer .f_info .row:not(.head){ flex-direction:column; align-items:flex-start; gap:8px; }

@media screen and (max-width: 1250px) {
    #footer{ padding:70px 0; }
    #footer .footer_flex{ flex-direction:column; gap:40px; }
    #footer .f_logo{ width:auto; }
}
@media screen and (max-width: 960px) {
    #footer{ padding:60px 0; }
}
@media screen and (max-width: 650px) {
    #footer{ padding:50px 0; }
    #footer .footer_flex{ gap:20px; }
    #footer .f_logo{ text-align:left; }
    #footer .f_logo img{ width:100px; }
    #footer .f_logo p{ margin-top:20px; font-size:15px; }
    #footer .f_info .row.head{ flex-direction:column; align-items:flex-start; gap:8px; }
    #footer .f_info .row.head b{ margin-left:6px; }
    #footer .f_info .row.head span,
    #footer .f_info .row.head strong,
    #footer .f_info .row.head b,
    #footer .f_info .row dt,
    #footer .f_info .row dd{ font-size:15px; }
}


/* theme quick_menu.php (.quick-menu-section) — 기본 위치/버튼 */
.quick-menu-section{ position: fixed; z-index: 98; right: 26px; bottom: 40px; }
.quick-menu-section .menu-list{ display: flex; flex-direction: column; gap: 20px; list-style: none; margin: 0; padding: 0; }
.quick-menu-section .item{ display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; width: 66px; height: 66px; border-radius: 50%; background-color: rgba(201,169,106,.9); box-shadow: 2px 2px 4px 0 rgba(0,0,0,.25); color: #fff; text-align: center; }
.quick-menu-section .item .icon{ width: 28px; height: 28px; object-fit: contain; }
.quick-menu-section .item .icon[src*="home"]{ width: 24px; height: 24px; }
.quick-menu-section .item .icon[src*="blog"]{ width: 28px; height: 25.8px; }
.quick-menu-section .item .text{ font-size: 12px; letter-spacing: -0.05em; line-height: 1.1; }
@media screen and (max-width: 950px) {
    .quick-menu-section{ right: 10px; bottom: 20px; }
    .quick-menu-section .menu-list{ gap: 10px; }
    .quick-menu-section .item{ width: 52px; height: 52px; }
    .quick-menu-section .item .icon{ width: 20px; height: 20px; }
    .quick-menu-section .item .icon[src*="home"]{ width: 18px; height: 18px; }
    .quick-menu-section .item .icon[src*="blog"]{ width: 20px; height: 18.5px; }
    .quick-menu-section .item .text{ font-size: 10px; }
}

/* .quick-menu-section 사무소 선택 팝업 */
.quick-popup-dim{ opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(255,255,255,.8); z-index: 97; }
.quick-popup-dim.active{ opacity: 1; visibility: visible; }
.quick-menu-section .menu-list > li{ position: relative; }
.quick-menu-section .office-popup{ opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; position: absolute; right: calc(100% + 24px); top: auto; bottom: -70px; width: 307px; border-radius: 10px; background-color: #fff; box-shadow: 4px 4px 15px 0 rgba(0,0,0,.15); }
.quick-menu-section .office-popup.active{ opacity: 1; visibility: visible; }
.quick-menu-section .office-popup .popup-header{ position: relative; height: 76px; padding: 14px 16px 0 16px; border-radius: 10px 10px 0 0; background-color: var(--main-color); color: #fff; text-align: left; }
.quick-menu-section .office-popup .popup-header .small{ font-size: 16px; font-weight: 500; line-height: 1.2; color: #e5cf87; letter-spacing: -0.05em; }
.quick-menu-section .office-popup .popup-header .title{ margin-top: 4px; font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.05em; word-break: keep-all; }
.quick-menu-section .office-popup .popup-header .close-btn{ position: absolute; right: 16px; top: 15px; padding: 0; background: transparent; border: none; cursor: pointer; }
.quick-menu-section .office-popup .popup-header .close-btn img{ display: block; width: 16px; height: 16px; }
.quick-menu-section .office-popup .office-list{ padding: 5px 10px; }
.quick-menu-section .office-popup .office-list > li + li{ border-top: 1px solid #eee; }
.quick-menu-section .office-popup .office-item{ display: flex; align-items: center; gap: 10px; padding: 9px 0; }
.quick-menu-section .office-popup .office-item .circle{ flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background-color: var(--gold-color); box-shadow: 1px 3px 4px 0 rgba(0,0,0,.2); color: #fff; font-size: 12px; font-weight: 600; letter-spacing: 0; }
.quick-menu-section .office-popup .office-item .name{ flex-grow: 1; font-size: 18px; font-weight: 600; color: #333; letter-spacing: 0; text-align: left; }
.quick-menu-section .office-popup .office-item .arrow{ flex-shrink: 0; width: 17px; height: 7.2px; }

@media screen and (max-width: 950px) {
    .quick-menu-section .office-popup{ right: calc(100% + 12px); width: 260px; }
    .quick-menu-section .office-popup .popup-header{ height: auto; padding: 12px 14px 14px 14px; }
    .quick-menu-section .office-popup .popup-header .small{ font-size: 13px; }
    .quick-menu-section .office-popup .popup-header .title{ font-size: 16px; padding-right: 15px; }
    .quick-menu-section .office-popup .popup-header .close-btn{ right: 14px; top: 13px; }
    .quick-menu-section .office-popup .office-item .circle{ width: 34px; height: 34px; font-size: 11px; }
    .quick-menu-section .office-popup .office-item .name{ font-size: 15px; }
}

@media screen and (max-width: 650px) {
    .quick-menu-section .office-popup{ width: min(260px, calc(100vw - 84px)); }
}
@media screen and (max-width: 400px) {
    .quick-menu-section .office-popup .popup-header{ padding: 10px 12px 12px 12px; }
    .quick-menu-section .office-popup .popup-header .small{ font-size: 11px; }
    .quick-menu-section .office-popup .popup-header .title{ font-size: 13px; padding-right: 14px; }
    .quick-menu-section .office-popup .popup-header .close-btn{ right: 10px; top: 10px; }
    .quick-menu-section .office-popup .popup-header .close-btn img{ width: 12px; height: 12px; }
    .quick-menu-section .office-popup .office-list{ padding: 3px 8px; }
    .quick-menu-section .office-popup .office-item{ gap: 8px; padding: 7px 0; }
    .quick-menu-section .office-popup .office-item .circle{ width: 28px; height: 28px; font-size: 10px; }
    .quick-menu-section .office-popup .office-item .name{ font-size: 13px; }
    .quick-menu-section .office-popup .office-item .arrow{ width: 14px; height: 5.9px; }
}



/* .quick-menu-section */
.quick-menu-section{ position: fixed; z-index: 98; right: 26px; bottom: 40px; }
.quick-menu-section .menu-list{ display: flex; flex-direction: column; gap: 20px; }
.quick-menu-section .item{ display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; width: 66px; height: 66px; border-radius: 50%; background-color: rgba(201,169,106,.9); box-shadow: 2px 2px 4px 0 rgba(0,0,0,.25); color: #fff; text-align: center; }
.quick-menu-section .item .icon{ width: 28px; height: 28px; object-fit: contain; }
.quick-menu-section .item .icon[src*="home"]{ width: 24px; height: 24px; }
.quick-menu-section .item .icon[src*="blog"]{ width: 28px; height: 25.8px; }
.quick-menu-section .item .text{ font-size: 12px; letter-spacing: -0.05em; line-height: 1.1; }

@media screen and (max-width: 950px) {
    .quick-menu-section{ right: 10px; bottom: 20px; }
    .quick-menu-section .menu-list{ gap: 10px; }
    .quick-menu-section .item{ width: 52px; height: 52px; }
    .quick-menu-section .item .icon{ width: 20px; height: 20px; }
    .quick-menu-section .item .icon[src*="home"]{ width: 18px; height: 18px; }
    .quick-menu-section .item .icon[src*="blog"]{ width: 20px; height: 18.5px; }
    .quick-menu-section .item .text{ font-size: 10px; }
}