@import url("common.css");


/* ========== Visual ========== */
.mo_fixed {display:none;}
.visual{position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; background:var(--heroDark);}
.visual .visual_bg{position:absolute; inset:0;}
.visual .visual_bg.jarallax{z-index:0;}
.visual .visual_bg .jarallax-img,
.visual .visual_bg img{width:100%; height:100%; object-fit:cover; display:block;}
.visual .visual_bg picture{display:block; width:100%; height:100%;}
.visual .visual_dim{position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(10,14,20,0.62) 0%, rgba(10,14,20,0.74) 100%); pointer-events:none;}
.visual .visual_in{position:relative; z-index:2; padding:180px 0 25px; box-sizing:border-box; text-align:center;}
.visual .visual_txt h2{color:var(--white); font-size:3.5556rem; font-weight:700; line-height:106%; letter-spacing:-0.03em;}
.visual .visual_txt .desc{margin:16px 0 0; color:var(--white); font-size:1.3333rem; font-weight:500; line-height:140%;}
.visual .visual_txt .guide{margin:10px 0 0; color:rgba(255,255,255,0.78); font-size:1rem; line-height:150%;}
.visual .keywords{display:flex; align-items:center; justify-content:center; gap:7px; margin:18px 0 0;}
.visual .keywords li{color:rgba(255,255,255,0.85); font-size:0.7778rem; font-weight:500; position:relative;}
.visual .keywords li + li::before{content:'·'; margin-right:7px; color:rgba(255,255,255,0.4);}

.visual .choice_cards{    display: flex; gap: 18px; justify-content: center; flex-wrap: wrap; max-width: 740px; margin: 34px auto 0px;}
.visual .choice_card{position:relative; display:flex; flex-direction:column; align-items:flex-start; text-align:left; flex: 1 1 0%; min-width: 300px; max-width: 350px; border-radius: 24px; padding: 28px 30px; backdrop-filter: blur(24px) saturate(180%); transition: 0.25s; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.26); box-shadow: rgba(0, 0, 0, 0.22) 0px 8px 32px, rgba(255, 255, 255, 0.2) 0px 1px 0px inset;box-sizing:border-box; transition:background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;}
.visual .choice_card.is-on{background: rgba(255, 255, 255, 0.22); border-color:rgba(255, 255, 255, 0.5);; box-shadow:rgba(0, 0, 0, 0.3) 0px 14px 42px, rgba(255, 255, 255, 0.4) 0px 1px 0px inset; backdrop-filter: blur(24px) saturate(180%);}
.visual .choice_card:hover{background:rgba(255,255,255,0.18); border-color:rgba(255,255,255,0.5); box-shadow:0 18px 44px rgba(0,0,0,0.36);}
.visual .choice_card.is-on:hover{background:rgba(255,255,255,0.32); border-color:rgba(255,255,255,0.75); box-shadow:0 22px 50px rgba(0,0,0,0.42);}
.visual .choice_card .label{font-size:0.7222rem; font-weight:700; letter-spacing:0.02em; color:var(--mainSoft); display:block; line-height:normal;}
.visual .choice_card.offender .label{color:var(--accent);}
.visual .choice_card strong{margin:8px 0 0; color:var(--white); font-size:1.2222rem; font-weight:700; letter-spacing:-0.02em; line-height:120%;}
.visual .choice_card .sub{margin:8px 0 0; color:rgba(255,255,255,0.82); font-size:0.8333rem; font-weight:500; line-height:120%;}
.visual .choice_card .btn_select{    display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-top: 18px; padding: 7px 14px 7px 18px; border-radius: 980px; background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.45); transition:background 0.3s ease, border-color 0.3s ease;}
.visual .choice_card:hover .btn_select{background:rgba(255,255,255,0.35); border-color:rgba(255,255,255,0.7);}
.visual .choice_card .btn_select em {display:block; font-style:normal; color:var(--white); font-size:0.7778rem; font-weight:700;}
.visual .choice_card .btn_select i {width: 22px; height: 22px; border-radius: 50%; background: rgb(243, 152, 0); color: rgb(255, 255, 255); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; font-style:normal; line-height:1;     background: rgb(46, 167, 224);}
.visual .choice_card.offender .btn_select i{background:var(--accent);}

.visual .visual_links{display:flex; align-items:center; justify-content:center; gap:15px; margin:30px 0 0; flex-wrap:wrap;}
.visual .visual_links > span{color:rgba(255,255,255,0.82); font-size:0.8333rem; font-weight:500; line-height:normal;}
.visual .visual_links a{display:inline-flex; align-items:center; gap:6px; transition:transform 0.3s ease, opacity 0.3s ease;}
.visual .visual_links a em{font-style:normal; color:var(--white); font-size:0.7778rem; font-weight:700; line-height:normal;}
.visual .visual_links a img{width:15px; height:15px; display:block;}
.visual .visual_links a:hover{opacity:1; transform:translateY(-2px);}


/* ========== Notice bar ========== */
.notice_bar{background:var(--white); border-bottom:1px solid var(--border);}
.notice_bar .basic_in{display:flex; align-items:center; justify-content:space-between; gap:40px; width:90%; max-width:925px; min-height:72px; flex-wrap:nowrap; box-sizing:border-box; margin-left:auto; margin-right:auto;}
.notice_bar .notice_main{display:flex; align-items:center; gap:16px; flex-wrap:wrap; min-width:0; flex:1;}
.notice_bar .badge{display:inline-flex; align-items:center; justify-content:center; height:27px; padding:0 13px; border-radius:var(--borderR100); background:rgba(46,167,224,0.13); color:var(--mainSoft); font-size:0.7222rem; font-weight:700; line-height:100%; white-space:nowrap; box-sizing:border-box; transition:background 0.3s ease, color 0.3s ease;}
.notice_bar[data-audience="offender"] .badge{background:rgba(243,152,0,0.13); color:var(--accent);}
.notice_bar strong{color:var(--black); font-size:1.0556rem; font-weight:700; letter-spacing:-0.01em; line-height:145%;}
.notice_bar .sub{flex-shrink:0; color:var(--light); font-size:0.7222rem; font-weight:400; line-height:120%;}


/* ========== Intro ========== */
.intro{padding:95px 0 83px; text-align:center; background:var(--white);}
.intro .eyebrow{color:var(--main); font-size:0.9444rem; font-weight:700; letter-spacing:0.02em;}
.intro h2{margin:13px 0 0; color:var(--black); font-size:2.6667rem; font-weight:700; line-height:112%; letter-spacing:-0.03em;}
.intro .desc{margin:21px auto 0; max-width:640px; color:var(--basic); font-size:1.1667rem; line-height:150%;}
.intro .btn_link{display:inline-flex; align-items:center; gap:8px; margin:36px 0 0; color:var(--main); font-size:0.9444rem; font-weight:700; transition:opacity 0.3s ease;}
.intro .btn_link i{font-style:normal; display:inline-block;}
.intro .btn_link:hover{opacity:1;}


/* ========== Secret ========== */
.secret{position:relative; display:flex; align-items:center; overflow:hidden; background:#000; text-align:center;}
.secret .secret_bg{position:absolute; inset:0; opacity:0.6;}
.secret .secret_bg img{width:100%; height:100%; object-fit:cover; display:block;}
.secret .secret_dim{position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.8) 100%);}
.secret .basic_in{position:relative; z-index:2; padding:84px 0;}
.secret .icon{display:block; margin:0 auto 17px; width:48px; height:48px; line-height:1;}
.secret .icon img{width:100%; height:100%; display:block;}
.secret h2{color:var(--white); font-size:2.2222rem; font-weight:700; line-height:115%; letter-spacing:-0.03em;}
.secret .desc{margin:15px 0 0; color:#a1a1a6; font-size:1.0556rem; line-height:150%;}
.secret .tags{display:flex; align-items:center; justify-content:center; gap:10px; margin:27px 0 0; flex-wrap:wrap;}
.secret .tags li{display:inline-flex; align-items:center; justify-content:center; padding:8px 16px; border:1px solid #424245; border-radius:var(--borderR100); color:#f5f5f7; font-size:0.7778rem; font-weight:500; box-sizing:border-box;}


/* ========== Rights ========== */
.rights{padding:98px 0; background:var(--grayBg); text-align:center;}
.rights .basic_in  {max-width:944px;}
.rights .eyebrow{color:var(--main); font-size:0.9444rem; font-weight:700; line-height:normal; display:block;}
.rights h2{margin:12px 0 0; color:var(--black); font-size:2.2222rem; font-weight:700; letter-spacing:-0.03em; line-height:120%;}
.rights .rights_list{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:44px 0 0; text-align:left;}
.rights .rights_list li{display: flex; gap: 18px; align-items: flex-start; background: rgb(255, 255, 255); border-radius: 18px; padding: 28px 30px;}
.rights .rights_list .num{flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:21px; background:var(--grayBg); color:var(--main); font-size:1rem; font-weight:700; transition:background 0.3s ease;}
.rights .rights_list li:hover .num{background:rgba(46,167,224,0.18);}
.rights .rights_list strong{display:block; color:var(--black); font-size:1.0556rem; font-weight:700; letter-spacing:-0.01em; line-height:120%;}
.rights .rights_list p{margin:8px 0 0; color:var(--basic); font-size:0.8333rem; line-height:normal;}


/* ========== Process ========== */
.process{position:relative; clip-path:inset(0); background:#1a1a1a;}
.process .process_bg{position:fixed; inset:0; width:100%; height:100%; pointer-events:none;}
.process .process_bg img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;}
.process .process_bg img:nth-child(1){z-index:1;}
.process .process_bg img:nth-child(2){z-index:2; opacity:0;}
/* .process .process_dim{position:absolute; inset:0; z-index:3; background:linear-gradient(100deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.55) 42%, rgba(15,12,8,0.5) 100%), linear-gradient(90deg, rgba(0,0,0,0.35), rgba(0,0,0,0.35));} */
.process .basic_in{position:relative; z-index:2; max-width:1144px; display:flex; justify-content:space-between; align-items:center; gap:40px; padding:100px 0; box-sizing:border-box;}
.process .process_tit .eyebrow{color:var(--main); font-size:0.7222rem; font-weight:800; letter-spacing:0.22em;}
.process .process_tit h2{margin:23px 0 0; color:var(--white); font-size:2.5556rem; font-weight:800; line-height:130%; letter-spacing:-0.03em;}
.process .process_cards{display:grid; grid-template-columns:1fr 1fr; gap:22px 20px; align-items:start; width:100%; max-width:646px; flex-shrink:0;}
.process .process_cards .card{background: rgb(255, 255, 255); border: 1px solid rgba(20, 40, 80, 0.07); border-radius: 22px; padding: 30px; box-shadow: rgba(20, 40, 80, 0.16) 0px 22px 48px; will-change:transform; cursor:default;}
.process .process_cards .card02{margin-top:104px;}
.process .process_cards .card03{margin-top:-104px;}
.process .process_cards .card04{margin-top:0;}
.process .process_cards .num{display:block; color:var(--main); font-size:1rem; font-weight:700; letter-spacing:-0.03em; line-height:100%;}
.process .process_cards .emoji{display:block; margin:22px 0 0; width:26px; height:26px; line-height:1;}
.process .process_cards .emoji img{width:100%; height:100%; display:block;}
.process .process_cards strong{display:block; margin:14px 0 0; color:var(--black); font-size:1.2222rem; font-weight:700; letter-spacing:-0.02em; line-height:120%;}
.process .process_cards p{margin:10px 0 0; color:var(--basic); font-size:15.5px; line-height:160%;}
.process .process_cards figure{margin:22px 0 0; border-radius: 14px; overflow: hidden; aspect-ratio: 16 / 10; background: rgb(238, 241, 244);}
.process .process_cards figure img{width:100%; height:100%; object-fit:cover; display:block; transform-origin:center center;}


/* ========== Lawyer ========== */
.lawyer{padding:200px 0 220px; background:var(--white);}
.lawyer .basic_in{max-width:1320px;}
.lawyer .lawyer_tit{text-align:center;}
.lawyer .lawyer_tit .eyebrow{color:var(--accentBlue); font-size:17px; font-weight:600; letter-spacing:0.34px; line-height:normal;}
.lawyer .lawyer_tit h2{margin:24px 0 0; color:var(--bk000); font-size:2.3333rem; font-weight:700; line-height:143%; letter-spacing:-0.03em;}
.lawyer .lawyer_list{display:flex; gap:16px; margin:70px 0 0; align-items:stretch; justify-content:center; height:400px;}
.lawyer .lawyer_card{position:relative; flex:0 0 310px; width:310px; height:400px; border-radius:20px; overflow:hidden; cursor:pointer; background:linear-gradient(125deg, #f2f2f2 26.83%, #c7edff 102.66%); box-sizing:border-box; transition:flex-basis 0.9s cubic-bezier(0.32, 0.72, 0, 1), width 0.9s cubic-bezier(0.32, 0.72, 0, 1), box-shadow 0.4s ease;}
.lawyer .lawyer_card:not(.on):hover{box-shadow:0 18px 40px rgba(20,40,80,0.14);}
.lawyer .lawyer_card.on{flex-basis:644px; width:644px; background:linear-gradient(146deg, #f2f2f2 26.83%, #c7edff 102.66%); cursor:default; box-shadow:0 12px 36px rgba(20,40,80,0.1);}
.lawyer .lawyer_card .lawyer_body{position:relative; z-index:3; display:flex; flex-direction:column; gap:0; height:100%; width:100%; padding:42px 24px 26px 35px; box-sizing:border-box; pointer-events:none;}
.lawyer .lawyer_card.on .lawyer_body{width:52%; max-width:340px; padding:41px 16px 26px 57px; pointer-events:auto;}
.lawyer .lawyer_card .lawyer_head{display:flex; flex-direction:column; gap:8px; flex-shrink:0;}
.lawyer .lawyer_card .role{color:var(--accentBlue); font-size:15px; font-weight:400; line-height:normal;}
.lawyer .lawyer_card .name{color:var(--bk000); font-size:28px; font-weight:700; letter-spacing:-0.52px; line-height:normal;}
.lawyer .lawyer_card .lawyer_foot{display:none; flex:1; flex-direction:column; min-height:0;}
.lawyer .lawyer_card.on .lawyer_foot{display:flex; animation:lawyerDetailIn 0.55s cubic-bezier(0.32, 0.72, 0, 1) 0.2s both;}
.lawyer .lawyer_card.on .lawyer_foot::before{content:""; flex:0 0 67px; height:67px; min-height:67px; max-height:67px;}
@keyframes lawyerDetailIn{
	from{opacity:0; transform:translateY(14px); filter:blur(6px);}
	to{opacity:1; transform:translateY(0); filter:blur(0);}
}
.lawyer .lawyer_card .detail{flex:1 1 auto; min-height:0; overflow:hidden;}
.lawyer .lawyer_card .detail .career_title{color:var(--bk000); font-size:19px; font-weight:700; letter-spacing:-0.38px; line-height:21px; margin:0 0 17px;}
.lawyer .lawyer_card .detail .career li{color:#636363; font-size:17px; line-height:27px;}
.lawyer .lawyer_card .mail{display:inline-flex; flex-shrink:0; align-self:flex-start; align-items:center; justify-content:center; width:36px; height:36px; margin-top:auto; border-radius:100px; background:rgba(255,255,255,0.7); border:1px solid var(--white); box-sizing:border-box; transition:background 0.3s ease, border-color 0.3s ease;}
.lawyer .lawyer_card .mail:hover{background:var(--white); border-color:rgba(46,167,224,0.35);}
.lawyer .lawyer_card .mail img{width:18px; height:18px; display:block;}
.lawyer .lawyer_card .photo{position:absolute; z-index:2; pointer-events:none; top:var(--pc-t, 0); left:var(--pc-l, auto); right:auto; bottom:auto; width:var(--pc-w, 290px); height:var(--pc-h, auto); max-width:none; display:block; transition:left 0.9s cubic-bezier(0.32, 0.72, 0, 1), top 0.9s cubic-bezier(0.32, 0.72, 0, 1);}
.lawyer .lawyer_card .photo img{width:100%; height:100%; object-fit:contain; object-position:top center; display:block; transition:transform 0.9s cubic-bezier(0.32, 0.72, 0, 1);}
.lawyer .lawyer_card:not(.on):hover .photo img{transform:scale(1.04);}
.lawyer .lawyer_card.on .photo{top:var(--pc-on-t, var(--pc-t)); left:var(--pc-on-l, var(--pc-l)); width:var(--pc-w); height:var(--pc-h);}
.lawyer .lawyer_card .deco{position:absolute; z-index:1; left:auto; right:var(--deco-r, -70px); top:var(--deco-t, 138px); width:var(--deco-w, 225px); height:var(--deco-h, 142px);  visibility:visible; pointer-events:none; transition:right 0.9s cubic-bezier(0.32, 0.72, 0, 1), top 0.9s cubic-bezier(0.32, 0.72, 0, 1);}
.lawyer .lawyer_card.on .deco{left:auto; right:var(--deco-on-r, -49px); top:var(--deco-on-t, var(--deco-t));  visibility:visible;}
.lawyer .lawyer_card .deco img{width:100%; height:100%; display:block; opacity:1;}
.lawyer .lawyer_card .overlay{position:absolute; left:0; right:0; bottom:0; z-index:3; height:90px; display:flex; align-items:flex-end; padding:0 0 26px 25px; box-sizing:border-box; background: linear-gradient(0deg, rgba(41, 41, 41, 0.90) -28.21%, rgba(45, 45, 45, 0.00) 96.56%); opacity:1; visibility:visible; transition:opacity 0.45s ease 0.15s, visibility 0.45s ease 0.15s;}
.lawyer .lawyer_card.on .overlay{opacity:0; visibility:hidden; pointer-events:none; transition:opacity 0.3s ease, visibility 0.3s ease;}
.lawyer .lawyer_card .overlay p{color:var(--white); font-size:19px; font-weight:700; letter-spacing:-0.38px; line-height:21px;}
.lawyer .lawyer_card .career_box{display:none;}
@keyframes lawyerCareerIn{
	from{opacity:0; transform:translateY(12px); filter:blur(5px);}
	to{opacity:1; transform:translateY(0); filter:blur(0);}
}

@media (prefers-reduced-motion: reduce){
	.lawyer .lawyer_card,
	.lawyer .lawyer_card .lawyer_body,
	.lawyer .lawyer_card .lawyer_foot,
	.lawyer .lawyer_card .detail,
	.lawyer .lawyer_card .mail,
	.lawyer .lawyer_card .photo,
	.lawyer .lawyer_card .photo img,
	.lawyer .lawyer_card .deco,
	.lawyer .lawyer_card .overlay{transition:none !important; animation:none !important;}
}

/* GSAP reveal helpers */
.gsap-fade{opacity:0; transform:translateY(40px);}
.gsap-fade.is-show{opacity:1; transform:none;}


/* ========== FAQ ========== */
.faq{padding:100px 0 120px; background:var(--grayBg); text-align:center;}
.faq h2{color:var(--black); font-size:2.22222222rem; font-weight:700; letter-spacing:-0.03em; line-height:normal;}
.faq .desc{margin:14px 0 0; color:var(--basic); font-size:1rem; line-height:160%;}
.faq .faq_list{margin:46px auto 0; max-width:764px; background:var(--white); border-radius:var(--borderR18); overflow:hidden; text-align:left;}
.faq .faq_list[data-audience="offender"]{display:none;}
body[data-audience="offender"] .faq .faq_list[data-audience="victim"]{display:none;}
body[data-audience="offender"] .faq .faq_list[data-audience="offender"]{display:block;}
.faq .faq_list > li{border-bottom:1px solid var(--border); transition:background 0.3s ease;}
.faq .faq_list > li:last-child{border-bottom:0;}
.faq .faq_list > li:hover{background:#fafbfd;}
.faq .faq_q{display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; padding:24px 26px; background:none; border:0; cursor:pointer; box-sizing:border-box; text-align:left;}
.faq .faq_q span{color:var(--black); font-size:1rem; font-weight:700; letter-spacing:-0.01em; line-height:130%; font-family:var(--kor);}
.faq .faq_q .ico{color:var(--light); font-size:1.1111rem; font-style:normal; line-height:100%; flex-shrink:0;}
.faq .faq_a{display:grid; grid-template-rows:0fr; padding:0 26px; box-sizing:border-box; opacity:0; transition:grid-template-rows 0.45s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.35s ease, padding 0.45s cubic-bezier(0.22, 1, 0.36, 1);}
.faq .faq_list > li.on .faq_a{grid-template-rows:1fr; opacity:1; padding:0 26px 24px;}
.faq .faq_a_inner{overflow:hidden; min-height:0;}
.faq .faq_a br {display:none;}
.faq .faq_a p{color:var(--basic); font-size:0.8889rem; line-height:160%;}
.faq .faq_a p b {margin: 0 0 10px; display:block; color:var(--main); font-size:0.8333rem; font-weight:700; line-height:120%;}


/* ========== Consult ========== */
.consult{padding:80px 0 140px; background:var(--white); text-align:center;}
.consult .consult_tit h2{color: #1D1D1F; font-size: 2.444444444444444rem; font-weight: 700; line-height: 118%; letter-spacing: -1.32px;}
.consult .consult_tit h2 .point{color:var(--main);}
.consult .consult_tit .desc{margin:20px 0 0; color: #6E6E73; font-size: 1.055555555555556rem; font-weight: 400; line-height: 150%;}
.consult .consult_form{margin:43px auto 0; max-width:720px; padding:44px; background:var(--grayBg); border-radius:24px; text-align:left; box-sizing:border-box;}
.consult .field{margin:0 0 30px;}
.consult .row.half{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.consult label{display:block; margin:0 0 10px; color:var(--black); font-size:0.7778rem; font-weight:700; line-height:120%;}
.consult label em{color:var(--main); font-style:normal;}
.consult label .hint{color:var(--light); font-size:0.6667rem; font-weight:400; margin-left:6px;}
.consult input[type="text"],
.consult textarea,
.consult select{width:100%; height:52px; padding:0 16px; border:0; border-radius:var(--borderR12); background:var(--white); color:var(--black); font-size:0.8333rem; font-family:var(--kor); box-sizing:border-box;}
.consult textarea{height:118px; padding:16px; resize:none; line-height:160%;}
.consult input::placeholder,
.consult textarea::placeholder{color:var(--light);}
.consult .phone_box{display:flex; align-items:center; gap:8px; height:52px; padding:0 16px; background:var(--white); border-radius:var(--borderR12); box-sizing:border-box;}
.consult .phone_box select{width:auto; height:100%; padding:0 18px 0 0; background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23c7c7cc' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E") no-repeat right center; color:var(--basic); font-weight:500; font-size:0.8333rem;}
.consult .phone_box .dash{color:#d2d2d7; font-size:0.8889rem;}
.consult .phone_box input{flex:1; height:100%; padding:0; border:0; border-radius:0; background:transparent;}
.consult .seg_group{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
.consult .seg{height:50px; border:0; border-radius:var(--borderR12); background:var(--white); color:var(--black); font-size:0.8333rem; font-weight:500; font-family:var(--kor); cursor:pointer; transition:background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;}
.consult .seg:hover:not(.on){box-shadow:0 6px 16px rgba(20,40,80,0.1);}
.consult .seg.on{background:var(--main); color:var(--white); font-weight:700;}
.consult .seg[data-value="가해"]:not(.on),
.consult .seg[data-value="쌍방"]:not(.on){color:var(--basic);}
.consult .chip_group{display:flex; flex-wrap:wrap; gap:9px;}
.consult .chip{height:36px; padding:0 18px; border:0; border-radius:var(--borderR100); background:var(--white); color:var(--black); font-size:0.7778rem; font-weight:500; font-family:var(--kor); cursor:pointer; transition:background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;}
.consult .chip:hover:not(.on){box-shadow:0 4px 12px rgba(20,40,80,0.1);}
.consult .chip.on{background:#eaf3ff; color:var(--main); font-weight:700;}
.consult .captcha_row{display:flex; align-items:center; gap:12px;}
.consult .captcha .code{display:inline-flex; align-items:center; justify-content:center; width:124px; height:50px; border-radius:10px; background:var(--black); color:var(--grayBg); font-size:1.1667rem; font-weight:700; font-style:italic; letter-spacing:4px; font-family:'Courier New', monospace; flex-shrink:0;}
.consult .captcha input{flex:1;}
.consult .btn_refresh{flex-shrink:0; border:0; background:none; color:var(--main); font-size:0.7222rem; font-weight:500; font-family:var(--kor); cursor:pointer; padding:0;}
.consult .agree_row{display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:24px 0 0; margin:0 0 28px; border-top:1px solid var(--borderMid);}
.consult .check{display:inline-flex; align-items:center; gap:11px; margin:0; cursor:pointer;}
.consult .check input{position:absolute; opacity:0; pointer-events:none;}
.consult .check .box{display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:11px; background:var(--main); color:var(--white); font-size:0.7222rem; font-weight:700; flex-shrink:0;}
.consult .check input:not(:checked) + .box{background:var(--borderMid); color:transparent;}
.consult .check .txt{color:var(--black); font-size:0.8333rem; font-weight:500;}
.consult .agree_row .more{color:var(--main); font-size:0.7778rem; font-weight:500;}
.consult .btn_submit{display:flex; align-items:center; justify-content:center; width:100%; height:56px; border:0; border-radius:var(--borderR100); background:var(--main); color:var(--white); font-size:1rem; font-weight:700; font-family:var(--kor); cursor:pointer; transition:background 0.3s ease, box-shadow 0.3s ease; box-shadow:0 10px 28px rgba(46,167,224,0.28);}
.consult .btn_submit:hover{opacity:1; background:var(--mainSoft); box-shadow:0 16px 36px rgba(46,167,224,0.4);}


/* ========== Sticky consult ========== */
.sticky_consult{position:fixed; left:0; right:0; bottom:0; z-index:9000; height:69px; background:rgba(255,255,255,0.82); backdrop-filter:blur(10px); border-top:1px solid rgba(0,0,0,0.08); min-width:320px;}
.sticky_consult .basic_in{height:100%;}
.sticky_consult .sticky_pc{display:flex; align-items:center; gap:14px; height:100%;}
.sticky_consult .time{color:var(--main); font-size:1.1111rem; font-weight:700; letter-spacing:-0.02em; flex-shrink:0;}
.sticky_consult .label{color:var(--black); font-size:0.8333rem; font-weight:700; white-space:nowrap; flex-shrink:0;}
.sticky_consult .sticky_form{min-width:0;}


/* ========== Float buttons ========== */
.float_btns{position:fixed; right:24px; bottom:100px; z-index:9100; display:flex; flex-direction:column; gap:12px;}
.float_btns a{display:flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:28px; box-sizing:border-box; transition:opacity 0.3s ease, transform 0.3s ease;}
.float_btns a:hover{opacity:0.85; transform:translateY(-2px);}
.float_btns a img{width:24px; height:24px; display:block; flex-shrink:0;}
.float_btns .float_phone{background:var(--accent); box-shadow:0 8px 11px rgba(243,152,0,0.4);}
.float_btns .float_top{background:rgba(20,22,26,0.62); border:1px solid rgba(255,255,255,0.14); backdrop-filter:blur(10px); box-shadow:0 8px 22px rgba(0,0,0,0.22);}


/* body pad for sticky bar */
body{padding-bottom:69px;}


/*******************************************************************************
	@media ~1500px  (html 18px)
*******************************************************************************/
@media all and (max-width:1500px) {

.visual .visual_txt h2{font-size:3.1111rem; line-height:107%;}
.lawyer .lawyer_tit h2{font-size:2rem; line-height:144%;}
.notice_bar .basic_in{gap:60px;}

}
/*******************************************************************************
	@media ~1300px  (html 18px)
*******************************************************************************/
@media all and (max-width:1300px) {

.process .basic_in{flex-direction:column; gap:50px; padding:90px 0;}
.process .process_cards .card02,
.process .process_cards .card03,
.process .process_cards .card04{margin-top:0;}
.lawyer .lawyer_list{justify-content:center; height:360px; gap:12px;}
.lawyer .lawyer_card{flex:1 1 0; min-width:0; max-width:280px; width:auto; height:360px;}
.lawyer .lawyer_card.on{flex:2.05 1 0; max-width:560px; width:auto;}
.lawyer .lawyer_card .photo{left:auto; right:0; top:auto; bottom:0; width:auto; height:82%; max-width:70%;}
.lawyer .lawyer_card.on .photo{left:auto; right:36px; top:auto; bottom:0; width:auto; height:82%; max-width:42%;}
.lawyer .lawyer_card .photo img{width:auto; height:100%; max-width:100%; object-fit:contain; object-position:bottom right;}
.lawyer .lawyer_card .deco{right:-40px; width:180px; height:114px;}
.lawyer .lawyer_card.on .deco{right:-30px;}
.sticky_consult .label{display:none;}
.notice_bar .basic_in{gap:20px;}

}
/*******************************************************************************
	@media ~980px  (html 16px)
*******************************************************************************/
@media all and (max-width:980px) {

.header .header_in .gnb{display:none;}
.header .header_in .top_util .btn_menu{display:flex;}

.visual .visual_in{padding:100px 0 60px;}
.visual .visual_txt h2{font-size:2.625rem; line-height:114%; letter-spacing:-0.02em;}
.visual .visual_txt .desc{font-size:1.125rem; line-height:156%;}
.visual .choice_cards{grid-template-columns:1fr; max-width:420px; gap:12px;}

.intro{padding:70px 0 60px;}
.intro h2{font-size:2.125rem; line-height:124%;}
.intro .desc{font-size:1.0625rem; line-height:159%;}

.secret .basic_in{padding:70px 0;}
.secret h2{font-size:1.875rem; line-height:127%;}
.secret .desc{font-size:1rem; line-height:150%; font-size:20px;}

.rights{padding:70px 0;}
.rights h2{font-size:1.875rem;}
.rights .rights_list{grid-template-columns:1fr;}

.process .basic_in{flex-direction:column; gap:40px; padding:70px 0;}
.process .process_bg{position:absolute;}
.process .process_tit h2{font-size:2.125rem; line-height:129%;}
.process .process_cards{grid-template-columns:1fr;}
.process .process_cards .card02,
.process .process_cards .card03,
.process .process_cards .card04{margin-top:0;}

.lawyer{padding:140px 0;}
.lawyer .lawyer_tit h2{font-size:1.7143rem; line-height:158%; letter-spacing:-0.03em;}
.lawyer .lawyer_tit h2 br{display:none;}
.lawyer .lawyer_tit h2 br.mo_fixed {display:block !important}
.lawyer .lawyer_list{display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; overflow:visible; gap:17px; margin-top:36px; height:auto; width:100%;}
.lawyer .lawyer_card,
.lawyer .lawyer_card.on{flex:0 0 auto; flex-basis:auto; width:100%; max-width:none; height:auto; min-height:187px; cursor:pointer; transition:none; box-shadow:none;}
.lawyer .lawyer_card:not(.on):hover{box-shadow:none;}
.lawyer .lawyer_card:not(.on){width:100%; max-width:none; height:187px; min-height:187px;}
.lawyer .lawyer_card.on{width:100%; max-width:none; min-height:0; padding-bottom:0; box-sizing:border-box; display:flex; flex-direction:column;}
.lawyer .lawyer_card .lawyer_body{width:100%; max-width:none; height:auto; min-height:187px; padding:35px 26px 0; gap:0; pointer-events:none;}
.lawyer .lawyer_card.on .lawyer_body{width:100%; max-width:none; min-height:243px; padding:35px 26px 0;}
.lawyer .lawyer_card .lawyer_head{gap:6px;}
.lawyer .lawyer_card .role{font-size:0.9375rem;}
.lawyer .lawyer_card .name{font-size:1.75rem; letter-spacing:-0.52px;}
.lawyer .lawyer_card .lawyer_foot{display:none;}
.lawyer .lawyer_card .detail{display:none !important;}
.lawyer .lawyer_card .photo{position:absolute; inset:auto; top:var(--mo-t, 25px); left:auto; right:var(--mo-r, 0); bottom:auto; width:var(--mo-w, 183px); height:var(--mo-h, 218px); max-width:none; overflow:hidden;}
.lawyer .lawyer_card.on .photo{top:auto; bottom:calc(100% - 243px); left:auto; right:var(--mo-r, 0); width:var(--mo-w, 183px); height:var(--mo-h, 218px); max-width:none; overflow:hidden;}
.lawyer .lawyer_card .photo img{width:100%; height:100%; max-width:none; object-fit:contain; object-position:bottom center; transform:none;}
.lawyer .lawyer_card:not(.on):hover .photo img{transform:none;}
.lawyer .lawyer_card .overlay{opacity:0; visibility:hidden; pointer-events:none;}
.lawyer .lawyer_card::before{content:attr(data-summary); position:absolute; left:26px; top:122px; z-index:4; color:var(--black); font-size:1.0625rem; font-weight:700; line-height:141%; letter-spacing:-0.34px; white-space:pre-line; max-width:216px;}
.lawyer .lawyer_card.on .lawyer_foot{display:block; position:absolute; left:26px; top:190px; z-index:5; margin:0; padding:0; width:auto; min-height:0; pointer-events:auto; animation:none;}
.lawyer .lawyer_card.on .lawyer_foot::before{display:none;}
.lawyer .lawyer_card.on .mail{display:inline-flex !important; margin:0; pointer-events:auto;}
.lawyer .lawyer_card.on .career_box{display:block; position:relative; left:auto; right:auto; bottom:auto; z-index:4; margin-top:auto; width:100%; background:var(--white); border:1px solid #e7e7e7; border-radius:0 0 20px 20px; padding:14px 20px; box-sizing:border-box; animation:lawyerCareerIn 0.55s cubic-bezier(0.32, 0.72, 0, 1) both;}
.lawyer .lawyer_card.on .career_box ul{color:#636363; font-size:0.9375rem; line-height:193%;}
.lawyer .lawyer_card .deco,
.lawyer .lawyer_card.on .deco{left:auto; right:var(--mo-deco-r, -70px); top:var(--mo-deco-t, 77px); width:var(--mo-deco-w, 197px); height:var(--mo-deco-h, 125px); opacity:1;}
.lawyer .lawyer_card:not(.on) .career_box{display:none;}
.lawyer .lawyer_card:not(.on) .lawyer_foot{display:none;}

.faq{padding:70px 0;}
.faq h2{font-size:40px;}
.faq .desc {font-size:18px;}

.consult{padding:60px 0 100px;}
.consult .consult_tit h2{font-size:2rem; line-height:125%;}
.consult .consult_form{padding:28px 20px;}
.consult .row.half{grid-template-columns:1fr;}

.sticky_consult .label{display:none;}

.footer .footer_top,
.footer .footer_mid{flex-direction:column;}
.footer .family_btn{width:170px;}

.float_btns{right:16px; bottom:100px;}

}
/*******************************************************************************
	@media ~680px  (html 14px / 390w mobile)
*******************************************************************************/
@media all and (max-width:680px) {

/* Visual */
.mo_fixed {display:block;}
.visual .visual_in{padding:100px 0 30px;}
.visual .visual_bg img{transform:none; object-position:65% center;}
.visual .visual_txt h2{font-size:40px; line-height:126%; letter-spacing:-0.03em;}
.visual .visual_txt .desc{margin:16px 0 0; font-size:20px; line-height:155%;}
.visual .visual_txt .guide{margin:14px 0 0; font-size:15px; line-height:180%;}
.visual .keywords li{font-size:14px;}
.visual .keywords{margin:20px 0 0; gap:8px;}
.visual .choice_cards{max-width:none; margin-top:28px;}
.visual .choice_card{min-height:auto; padding:21px 26px 23px;}
.visual .choice_card .label {font-size:13px;}
.visual .choice_card strong {font-size:22px;}
.visual .choice_card .sub {font-size:15px;}
.visual .choice_card .btn_select{margin-top:14px; padding:9px 15px 9px 19px;}
.visual .choice_card .btn_select em {font-size:14px;}
.visual .visual_links{display:grid; grid-template-columns:1fr 1fr; gap:10px 36px; margin:28px 0 0; max-width:260px; margin-left:auto; margin-right:auto;}
.visual .visual_links > span{grid-column:1 / -1; font-size:1.0714rem;}
.visual .visual_links a{justify-content:center;}
.visual .visual_links a em{font-size:1rem;}
.visual .visual_links a img {width:13px; height:13px;}

/* Notice */
.notice_bar .basic_in{flex-direction:column; align-items:flex-start; justify-content:flex-start; text-align:left; min-height:0; padding:22px 0; gap:10px;}
.notice_bar .notice_main{flex-direction:column; align-items:flex-start; gap:10px; justify-content:flex-start;}
.notice_bar strong{font-size:1.3571rem; line-height:145%; letter-spacing:-0.01em;}
.notice_bar .sub{font-size:0.9286rem; line-height:140%;}

/* Intro */
.intro{padding:61px 0 67px;}
.intro .eyebrow{font-size:1.2143rem;}
.intro h2{font-size:38px; line-height:129%; letter-spacing:-0.03em; margin:20px 0 0;}
.intro .desc{margin-top:20px; font-size: 20px; font-size:1.11rem;}
.intro .desc br {display:none;}
.intro .desc br.mo_fixed {display:block;;}

/* Secret */
.secret .basic_in{padding:84px 0 81px;}
.secret h2{font-size:38px; line-height:121%; letter-spacing:-0.03em;}
.secret .desc{}
.secret .tags{gap:8px;}
.secret .tags li{flex:1; max-width:calc(50% - 4px); padding:8px 10px; font-size:1rem;}

/* Rights */
.rights{padding:88px 0 ;}
.rights .eyebrow{font-size:1.2143rem;}
.rights h2{font-size:30px; letter-spacing:-0.03em; line-height:135%; margin:6px 0 0;}
.rights .rights_list{gap:12px; margin-top:36px;}
.rights .rights_list li{flex-direction:column; align-items:flex-start; gap:0; padding:22px;}
.rights .rights_list .num{margin:0 0 12px; width:32px; height:32px;}
.rights .rights_list strong{font-size:1.3571rem;}
.rights .rights_list p{margin:8px 0 0; font-size:1.0714rem; line-height:150%;}

/* Process */
.process .basic_in{padding:64px 0 63px; gap:30px;}
.process .process_tit {width:100%;}
.process .process_tit .eyebrow{font-size:0.9286rem;}
.process .process_tit h2{font-size:30px; line-height:130%; letter-spacing:-0.03em; margin:20px 0 0;}
.process .process_cards{gap:20px; max-width:none; width:100%;}
.process .process_cards .card{padding:30px 30px 25px; border-radius:22px; box-shadow:0 22px 24px rgba(20,40,80,0.16);}
.process .process_cards .num{font-size:18px; line-height:18px; letter-spacing:-0.54px;}
.process .process_cards .emoji{width:26px; height:26px; margin:22px 0 0;}
.process .process_cards strong{margin:14px 0 0; font-size:22px; line-height:26px; letter-spacing:-0.44px;}
.process .process_cards p{margin:13px 0 0; font-size:14.5px; line-height:23.2px;}
.process .process_cards figure{margin:14px 0 0; height:120px; aspect-ratio:auto; border-radius:14px;}
.process .process_cards figure img{width:100%; height:100%; object-fit:cover; display:block;}

/* Lawyer */
.lawyer{padding:90px 0 66px;}
.lawyer .lawyer_tit h2{font-size:1.7143rem; line-height:158%; letter-spacing:-0.03em;}
.lawyer .lawyer_card .role{font-size:1.0714rem;}
.lawyer .lawyer_card .name{font-size:2rem;}
.lawyer .lawyer_card::before{font-size:1.2143rem; letter-spacing:-0.34px; max-width:216px;}
.lawyer .lawyer_card.on .career_box ul {font-size:1.0714rem;}
.lawyer .lawyer_card.on .career_box ul li {line-height:29px; font-size:15px;}

/* FAQ */
.faq{padding:90px 0;}
.faq .faq_list{margin-top:36px; max-width:none; border-radius:18px;}
.faq .faq_q{padding:18px 26px;}
.faq .faq_a strong {font-size:1rem;}
.faq .faq_list > li.on .faq_a{padding:0 26px 20px;}
.faq .faq_q span {font-size:18px;}
.faq .faq_a p b {font-size:15px;}
.faq .faq_a p {font-size:15px;}

/* Consult */
.consult{padding:90px 0;}
/* .consult .consult_tit br {display:none;} */
.consult .consult_tit h2{font-size:38px; line-height:137%; letter-spacing:-0.03em;}
.consult .consult_tit .desc{font-size:19px;}
.consult .consult_form{margin-top:36px; max-width:none; border-radius:24px; padding:44px 16px 32px;}
.consult .field{margin-bottom:24px;}
.consult .row.half{grid-template-columns:1fr 1fr; gap:12px;}
.consult .row.half .field{margin-bottom:0;}
.consult .row.half + .field{margin-top:24px;}
.consult input[type="text"],
.consult textarea,
.consult select{font-size:1rem;}
.consult .phone_box input{font-size:1.0714rem;}
.consult .seg_group{gap:8px;}
.consult .seg{height:50px; font-size:1.0714rem;}
.consult .chip{height:36px; padding:0 16px; font-size:1rem;}
.consult .agree_row{flex-direction:column; align-items:flex-start; gap:8px; padding-top:20px; margin-bottom:20px;}
.consult .agree_row .more{font-size:0.8571rem; margin-left:33px;}
.consult .check .box{width:17px; height:17px; border-radius:11px; font-size:0.9286rem;}
.consult .check .txt{font-size:1rem;}
.consult .captcha_row{flex-wrap:wrap;}
.consult .captcha input{flex:1 1 120px;}
.consult .btn_refresh{width:100%; text-align:left; padding:4px 0 0;}
.consult_form .field_radio .opt span {font-size: 15px important;}
.consult_form .field_checkbox .opt span {font-size: 14px important;}
.consult_form .field_phone .select_num, .consult_form .field_tel .select_num {font-size: 14px !important;}
.consult input::placeholder,
.consult textarea::placeholder{font-size:14px !important;}


.intro .btn_link{display:none;}

/* Sticky — Figma 1:675 mobile */
.sticky_consult{height:69px; padding:0 24px; box-sizing:border-box;}
.sticky_consult .basic_in{padding:0; max-width:none; width:100%;}
.sticky_consult .sticky_pc{display:flex; width:100%; gap:0;}
.sticky_consult .time,
.sticky_consult .label{display:none;}
body{padding-bottom:69px;}

/* Float */
.float_btns{right:24px; bottom:90px; width:40px;}
.float_btns a{width:40px; height:40px; border-radius:28px;}
.float_btns a img{width:18px; height:18px;}

}
/*******************************************************************************
	@media ~400px
*******************************************************************************/
@media all and (max-width:400px) {

.lawyer .lawyer_card .photo{width:140px; height:167px; top:32px; right:0;}
.lawyer .lawyer_card.on .photo{width:140px; height:167px; top:auto; bottom:calc(100% - 243px); right:0;}
.lawyer .lawyer_card .deco,
.lawyer .lawyer_card.on .deco{width:150px; height:95px; right:-55px; top:70px;}
.lawyer .lawyer_card::before{max-width:52%;}

}