/* visual */
.visual{ position: relative; z-index: 100; padding-bottom: 26.042%; }
.visual1{ background: url("/img/sub/company_bg.jpg") no-repeat center center / cover; }
.visual2{ background: url("/img/sub/business_bg.jpg") no-repeat center center / cover; }
.visual3{ background: url("/img/sub/success_bg.jpg") no-repeat center center / cover; }
.visual4{ background: url("/img/sub/counseling_bg.jpg") no-repeat center center / cover; }
.visual5{ background: url("/img/sub/media_bg.jpg") no-repeat center center / cover; }
.visual6{ background: url("/img/sub/cs_bg.jpg") no-repeat center center / cover; }

.visual .flex-box{ width: 100%; position: absolute; bottom: 12%; left: 50%; transform: translateX(-50%); z-index: 50; display: flex; justify-content: space-between; align-items: flex-end; }
.visual .flex-box *{ color: #fff; }
.visual .text-box span{ display: inline-block; font-family: var(--Lora); font-size: 2.2rem; font-weight: 500; animation: textClip 1s 0.5s both; }
.visual .text-box h2{ font-size: 7.6rem; font-weight: 600; letter-spacing: -0.02em; margin-top: 20px; animation: textBlur 1s 0.8s both; }

/* lnb */
#lnb{ margin-bottom: 1.5%; animation: textOpacity 1s 0.8s both; position: relative; }
#lnb .lnb{ display: flex; align-items: center; }
#lnb .lnb a{ display: inline-block; color: #fff; }
#lnb .lnb > li{ position: relative; padding: 0 30px; }
#lnb .lnb > li:first-of-type{ padding-left: 0 !important; }
#lnb .lnb > li:last-of-type{ padding-right: 0 !important; }
#lnb .lnb > li::after{ content: ""; width: 2px; height: 14px; background: rgba(255, 255, 255, 0.1); position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#lnb .lnb > li:last-of-type::after{ display: none; }
#lnb .lnb button{ min-width: 170px; font-family: var(--baseFont); font-size: 1.7rem; font-weight: 400; letter-spacing: -0.02em; text-align: left; padding: 14px 0; position: relative; }
#lnb .lnb button::after{ content: url("/img/sub/lnb_arrow.svg"); position: absolute; top: 44%; right: 0; transform: translateY(-50%); transition: all 0.5s; }
#lnb .lnb button.active::after{ top: 56%; transform: translateY(-50%) rotate(-180deg); }

#lnb .lnb .home a{ display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; background: var(--mainColor); border-radius: 50%; }

#lnb .lnb li.depth ul{ min-width: calc(100% - 60px); /* max-width: max-content; */ position: absolute; top: 100%; left: 30px; z-index: 100; background: var(--mainColor); padding: 12.5px 0; overflow: hidden; display: none; }
#lnb .lnb li:last-of-type ul{ min-width: calc(100% - 30px); }
#lnb .lnb li.depth ul li a{ font-size: 1.6rem; font-weight: 300; letter-spacing: -0.02em; padding: 7.5px 20px; }


/* 개인정보처리방침 비주얼 */
.visual.visual7{ padding: 0; padding-top: 150px; }
.visual.visual7 .flex-box{ position: static; transform: translateX(0); }
.visual.visual7 .flex-box *{ color: #111; }
#lnb .lnb.lnb7 > li::after{ background: rgba(0, 0, 0, 0.3); }
#lnb .lnb.lnb7 button{ color: #111; }
#lnb .lnb.lnb7 button::after{ filter: invert(1); display: none; }
#lnb .lnb.lnb7 button + ul{ opacity: 0; visibility: hidden; }

@keyframes textClip{
	0%{ transform: translateY(100%); clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); pointer-events: none; }
	100%{ transform: translateY(0); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); pointer-events: auto; }
}

@keyframes textOpacity{
	0%{ transform: translateY(100%); opacity: 0; pointer-events: none; }
	100%{ transform: translateY(0); opacity: 1; pointer-events: auto; }
}

@keyframes textBlur{
	0%{ filter: blur(15px); opacity: 0; }
	100%{ filter: blur(0px); opacity: 1; }
}

/* 간격 */
.pt150{ padding-top: 150px; }
.pb150{ padding-bottom: 150px; }
.pt60{ padding-top: 60px; }
.pb60{ padding-bottom: 60px; }


@media screen and (max-width: 1600px){
	/* visual */
	.visual .flex-box{ bottom: 8%; }
	.visual .text-box span{ font-size: 2rem; }  
	.visual .text-box h2{ font-size: 6rem; }

	/* 간격 */
	.pt150{ padding-top: 120px; }
	.pb150{ padding-bottom: 120px; }
}

@media screen and (max-width: 1250px){
	/* visual */
	.visual .text-box span{ font-size: 1.8rem; }  
	.visual .text-box h2{ font-size: 5rem; margin-top: 10px; }

	/* 개인정보처리방침 비주얼 */
	.visual.visual7{ padding-top: 120px; }

	/* lnb */
	#lnb .lnb > li{ position: relative; padding: 0 20px; }
	#lnb .lnb button{ min-width: 150px; font-size: 1.6rem; }

	#lnb .lnb .home a{ width: 35px; height: 35px; }
	#lnb .lnb .home a img{ transform: scale(0.9); }

	#lnb .lnb li.depth ul{ min-width: calc(100% - 40px); left: 20px; padding: 10px 0; }
	#lnb .lnb li:last-of-type ul{ min-width: calc(100% - 20px); }
	#lnb .lnb li.depth ul li a{ font-size: 1.5rem; }

	/* 간격 */
	.pt150{ padding-top: 80px; }
	.pb150{ padding-bottom: 80px; }
}

@media screen and (max-width: 1200px){
	/* visual */
	.visual{ padding-bottom: 300px; }
}

@media screen and (max-width: 900px){
	/* visual */
	.visual{ padding-bottom: 350px; }
	.visual .flex-box{ flex-direction: column; align-items: flex-start; }
	.visual .text-box{ margin-bottom: 20px; }
	.visual .text-box span{ font-size: 1.7rem; }  
	.visual .text-box h2{ font-size: 4rem; margin-top: 10px; }

	/* lnb */
	#lnb .lnb > li{ padding: 0 15px; } 
	#lnb .lnb li.depth ul{ width: calc(100% - 30px); padding: 5px 0; left: 15px; }
	#lnb .lnb li:last-of-type ul{ min-width: calc(100% - 15px); }
	#lnb .lnb li.depth ul li a{ padding: 7px 15px; }
}


/* common */
body.hidden{ overflow: hidden; }
.sub-content{ padding: 120px 0 200px; position: relative; }
.sub-content::after{ content: attr(data-tit); font-family: var(--Lora); font-size: 13rem; font-weight: 500; color: rgba(0, 0, 0, 0.03); font-style: italic; letter-spacing: 0; line-height: 1.3; text-align: right; position: absolute; bottom: -38px; right: 0; z-index: -1; }
.sub-content *{ letter-spacing: -0.02em; }

.btn{ width: 160px; height: 60px; display: flex; justify-content: center; align-items: center; border: 1px solid #fff; color: #fff; line-height: 1; position: relative; z-index: 5; overflow: hidden; transition: all 0.8s; }
.btn::before{ content: ""; width: 120%; padding-bottom: 120%; background: #fff; border-radius: 50%; position: absolute; top: 50%; left: 50%; z-index: -3; transform: translate(-50%, -50%) scale(0); transition: inherit; }
.btn:visited, .btn:link{ color: #fff; }

.btn.reverse{ border: 1px solid var(--mainColor); color: var(--mainColor); }
.btn.reverse::before{ background: var(--mainColor); }
.btn.reverse:visited, .btn.reverse:link{ color: var(--mainColor); }

.moreview{  font-family: var(--Lora); font-size: 1.8rem; font-weight: 500; }

@media (hover: hover){
	.btn:hover{ color: var(--mainColor); }
	.btn:hover::before{ transform: translate(-50%, -50%) scale(1); }

	.btn.reverse:hover{ color: #fff; }
}


/* 스크롤바 커스텀 */
.scroll-y{ overflow-y: scroll; }
.scroll-y::-webkit-scrollbar{ width: 20px; }
.scroll-y::-webkit-scrollbar-thumb{ height: 20px; background: var(--mainColor); background-clip: padding-box; border: calc((20px - 3px) / 2) solid transparent; border-radius: 100px; }
.scroll-y::-webkit-scrollbar-track{ background: #F5F5F5; background-clip: padding-box; border: 10px; border: calc((20px - 3px) / 2) solid transparent; border-radius: 100px; }


/* paging */
.paging a{ font-family: var(--Lora); }
:root{
	--noticeBg: rgba(104, 133, 121, 0.2);
	    --sborderR: 0;
}


/* page-title */
.page-title{ text-align: center; margin-bottom: 80px; }
.page-title h3{ font-size: 6rem; font-weight: 700; color: var(--mainColor); letter-spacing: -0.02em; }


/* arti-title */
.arti-title span{ display: inline-block; font-size: 2rem; font-weight: 600; color: #aaa; margin-bottom: 20px; }
.arti-title h4{ font-size: 4rem; font-weight: 600; color: #111; line-height: 1.5; }


/*sec-title*/
.sec-title h5{ font-size: 3rem; font-weight: 600; color: #111; }


/* tab-menu */
.tab-menu ul{ display: flex; justify-content: center; }
.tab-menu ul li{ font-size: 6rem; font-weight: 700; color: #EEE; padding: 0 60px; position: relative; }
.tab-menu ul li::after{ content: ""; width: 1px; height: 30px; background: #DDD; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
.tab-menu ul li:last-of-type::after{ display: none; }  
.tab-menu ul li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 10; }

.tab-menu ul li.on{ color: var(--mainColor); }


@media screen and (max-width: 1600px){
	/* common */
	.sub-content{ padding: 80px 0 150px; }
	.sub-content::after{ font-size: 11rem; }

	.btn{ width: 130px; height: 55px; }
	.moreview{ font-size: 1.7rem; }

	/* page-title */
	.page-title h3{ font-size: 5rem; }

	/* arti-title */
	.arti-title span{ font-size: 1.8rem; }
	.arti-title h4{ font-size: 3.5rem; }

	/*sec-title*/
	.sec-title h5{ font-size: 2.6rem; }

	/* tab-menu */
	.tab-menu ul li{ font-size: 5rem; }
}

@media screen and (max-width: 1250px){
	/* common */
	.sub-content{ padding: 60px 0 100px; }
	.sub-content::after{ font-size: 9rem; bottom: -26px; }

	.btn{ width: 120px; height: 45px; }
	.moreview{ font-size: 1.6rem; }

	/* page-title */
	.page-title{ margin-bottom: 40px; }
	.page-title h3{ font-size: 4rem; }

	/* arti-title */
	.arti-title span{ font-size: 1.7rem; margin-bottom: 10px; }
	.arti-title h4{ font-size: 2.8rem; }

	/*sec-title*/
	.sec-title h5{ font-size: 2.4rem; }

	/* tab-menu */
	.tab-menu ul li{ font-size: 4rem; padding: 0 20px; }
	.tab-menu ul li::after{ height: 20px; }
}

@media screen and (max-width: 900px){
	/* common */
	.sub-content::after{ font-size: 6rem; bottom: -15px; }

	.btn{ width: 100px; height: 40px; }
	.moreview{ font-size: 1.5rem; }

	/* page-title */
	.page-title h3{ font-size: 3.3rem; }

	/* arti-title */
	.arti-title span{ font-size: 1.6rem; }
	.arti-title h4{ font-size: 2.5rem; }

	/*sec-title*/
	.sec-title h5{ font-size: 2.2rem; }

	/* tab-menu */
	.tab-menu ul li{ font-size: 3.3rem; }
}


/* 로펌소개 - 태산회생센터 소개 */
#greeting.sub-content{ padding-bottom: 0; }
#greeting section{ overflow: hidden; }

#greeting .scroll-box{ height: 100vh; position: relative; }
#greeting .scroll{ width: 100%; height: calc(100% - 97px); position: absolute; top: 97px; left: 0; background: #fff; overflow: hidden; }
#greeting .scroll-box .flex-box{ display: flex; height: calc(100vh - 97px); }
#greeting .scroll .flex-box > div{ width: 50%; height: 100%; }

#greeting .scroll .text-box{ display: flex; align-items: center; padding-right: 180px; position: relative; }
#greeting .scroll .text-box::after{ content: attr(data-text); font-family: var(--Lora); font-size: 18rem; font-weight: 400; line-height: 1; font-style: italic; color: rgba(0, 0, 0, 0.02); position: absolute; top: 100%; right: -25px; z-index: -1; transform: translateY(0) scale(-1); writing-mode: vertical-rl; transition: all 1s; }
#greeting .scroll .text-box h4, #greeting .scroll .text-box p{ transform: translateX(-100px); opacity: 0; transition: all 1s; }
#greeting .scroll .text-box h4{ font-size: 5rem; font-weight: 700; color: #111; letter-spacing: -0.02em; line-height: 1.28; margin-bottom: 30px; }
#greeting .scroll .text-box p{ font-size: 2rem; font-weight: 300; letter-spacing: -0.02em; line-height: 1.7; }
#greeting .scroll .text-box p:not(:last-of-type){ margin-bottom: 20px; }
#greeting .scroll .text-box p.ceo{ margin-top: 40px; }
#greeting .scroll .text-box p.ceo strong{ display: block; font-size: 2.4rem; font-weight: 600; margin-top: 10px; }

#greeting .scroll .image-box{ position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#greeting .scroll .image-box::after{ content: ""; width: calc(100% + 2px); height: calc(100% + 2px); background: #fff; position: absolute; top: -1px; left: -1px; z-index: 20; opacity: 1; transform: scaleX(1); transform-origin: left; transition: all 1s; }
#greeting .scroll .image-box figure{ width: 100%; height: 100%; position: relative; }
#greeting .scroll .image-box figure img{ width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

#greeting .scroll.up, #greeting .scroll.down{ opacity: 0; }
 
#greeting .scroll.active{ z-index: 20; opacity: 1; }
#greeting .scroll.active .text-box::after{ top: 50%; transform: translateY(-50%) scale(-1); } 
#greeting .scroll.active .text-box h4, #greeting .scroll.active .text-box p{ opacity: 1; transform: translateX(0); }
#greeting .scroll.active .text-box p:nth-of-type(1){ transition-delay: 0.2s; }
#greeting .scroll.active .text-box p:nth-of-type(2){ transition-delay: 0.4s; }
#greeting .scroll.active .text-box p:nth-of-type(3){ transition-delay: 0.6s; }

#greeting .scroll.active .image-box::after{ opacity: 0; transform: scaleX(0); }

#greeting .scroll01.up{ z-index: 5; }
#greeting .scroll01.up, #greeting .scroll03.down{ opacity: 1; }
#greeting .scroll01.up .text-box, #greeting .scroll03.down .text-box{ transform: translateY(0); }
#greeting .scroll01.up .image-box::after, #greeting .scroll03.down .image-box::after{ opacity: 0; transform: scaleX(0); }


#greeting .rule{ padding: 150px 0 200px; position: relative; opacity: 1 !important; }
#greeting .rule .bg-box{ width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: -5; }
#greeting .rule .bg-box .img{ width: 1500px; height: 52.956%; background: url("/img/sub/company/greeting_bg.jpg") no-repeat center center / cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden; transition: all 1s; }
#greeting .rule .bg-box .img::after{ content: ""; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; transition: all 1s; }

#greeting .rule h3{ font-size: 6rem; font-weight: 600; letter-spacing: -0.02em; margin-bottom: 70px; color: #fff; }
#greeting .rule ul{ display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: -30px; }
#greeting .rule ul li{ width: calc((100% - 30px) / 2); padding: 60px; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.4); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); margin-bottom: 30px; overflow: hidden; position: relative; z-index: 10; opacity: 0; transform: translateY(100px); transition: all 1s; }
#greeting .rule ul li::before{ content: ""; width: 150%; padding-bottom: 150%; background: #fff; border-radius: 50%; position: absolute; top: 0; left: 0; z-index: -1; transform: translate(-100%, -100%); transition: all 0.8s; }
#greeting .rule ul li *{ color: #fff; transition: color 0.7s; }
#greeting .rule ul li span{ font-family: var(--Lora); font-size: 2.2rem; font-weight: 500; }
#greeting .rule ul li dl{ margin-top: 85px; }
#greeting .rule ul li dt{ font-size: 2.8rem; font-weight: 600; letter-spacing: -0.02em; }
#greeting .rule ul li dd{ font-size: 1.8rem; font-weight: 300; letter-spacing: -0.02em; color: #DDD; margin-top: 20px; line-height: 1.6666; }

#greeting .rule.aos-animate .bg-box .img{ width: 100%; height: 100%; }
#greeting .rule.aos-animate .bg-box .img::after{ opacity: 1; }

#greeting .rule.aos-animate ul li{ opacity: 1; transform: translateY(0); }
#greeting .rule.aos-animate ul li:nth-of-type(1){ transition-delay: 0.5s; }
#greeting .rule.aos-animate ul li:nth-of-type(2){ transition-delay: 0.7s; }
#greeting .rule.aos-animate ul li:nth-of-type(3){ transition-delay: 0.9s; }
#greeting .rule.aos-animate ul li:nth-of-type(4){ transition-delay: 1.1s; }

@media (hover: hover){
	#greeting .rule ul li:hover::before{ top: 50%; left: 50%; transform: translate(-50%, -50%); }
	#greeting .rule ul li:hover *{ color: var(--mainColor); }
	#greeting .rule ul li:hover dd{ color: #333; }
}

@media screen and (max-width: 1600px){
	#greeting .scroll .text-box{ padding-right: 130px; }
	#greeting .scroll .text-box::after{ font-size: 15rem; }
	#greeting .scroll .text-box h4{ font-size: 4rem; }
	#greeting .scroll .text-box p{ font-size: 1.9rem; }
	#greeting .scroll .text-box p.ceo strong{ font-size: 2.2rem; }

	#greeting .rule{ padding: 100px 0 150px; }
	#greeting .rule h3{ font-size: 5rem; }
	#greeting .rule ul li{ padding: 40px; }
	#greeting .rule ul li span{ font-size: 2rem; }
	#greeting .rule ul li dl{ margin-top: 55px; }
	#greeting .rule ul li dt{ font-size: 2.3rem; }
	#greeting .rule ul li dd{ font-size: 1.7rem; margin-top: 10px; }  
}

@media screen and (max-width: 1310px){
	#greeting .rule br{ display: none; }
}

@media screen and (max-width: 1250px){
	#greeting .scroll-box .flex-box{ height: calc(100vh - 77px); }
	#greeting .scroll .text-box{ padding-right: 100px; }
	#greeting .scroll .text-box::after{ font-size: 12rem; right: -16px; }
	#greeting .scroll .text-box h4{ font-size: 3rem; }
	#greeting .scroll .text-box p{ font-size: 1.8rem; }
	#greeting .scroll .text-box p.ceo strong{ font-size: 2rem; }

	#greeting .rule{ padding: 80px 0 100px; }
	#greeting .rule h3{ font-size: 4rem; margin-bottom: 40px; }
	#greeting .rule ul li{ padding: 30px; }
	#greeting .rule ul li span{ font-size: 1.8rem; }
	#greeting .rule ul li dl{ margin-top: 35px; }
	#greeting .rule ul li dt{ font-size: 2rem; }
	#greeting .rule ul li dd{ font-size: 1.6rem; }  
}

@media screen and (max-width: 1105px){
	#greeting .scroll-box{ height: auto; }
	#greeting .scroll{ height: auto; position: relative; top: 0; }
	#greeting .scroll-box .flex-box{ height: auto; }
	#greeting .scroll .text-box{ min-height: 500px; height: auto; padding: 100px 0; }
}

@media screen and (max-width: 1000px){
	#greeting .scroll-box .scroll{ padding-bottom: 100px; }
	#greeting .scroll-box .flex-box{ flex-direction: column-reverse; }
	#greeting .scroll .flex-box > div{ width: 100%; }
	
	#greeting .scroll .text-box{ min-height: auto; padding: 50px 0 0; }

	#greeting .scroll .image-box{ position: static; transform: translateY(0); }
	#greeting .scroll .image-box figure{ height: auto; padding-bottom: 97%; }
}

@media screen and (max-width: 900px){
	#greeting .scroll .text-box h4{ font-size: 2.5rem; }
	#greeting .scroll .text-box p{ font-size: 1.6rem; }
	#greeting .scroll .text-box p.ceo strong{ font-size: 1.8rem; }

	#greeting .rule h3{ font-size: 3.3rem; }
}

@media screen and (max-width: 800px){
	#greeting .rule ul li{ width: 100%; }
}


/* 로펌소개 - 구성원 소개 (리스트) */
#member.sub-content{ padding-bottom: 0; }
#member h5{ font-size: 2.8rem;  font-weight: 600; color: #111; margin-bottom: 30px; }
#member ul{ display: flex; flex-wrap: wrap; }
#member ul li{ width: calc((100% / 3)); position: relative; }
#member ul li figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 125%; margin-bottom: 0; }
#member ul li figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#member ul li .text{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 10; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; background: rgba(0, 0, 0, 0.4); padding: 20px; color: #fff; opacity: 0; transition: opacity 0.8s; }
#member ul li .text *{ filter: blur(10px); }
#member ul li .text h4{ font-size: 4rem; font-weight: 600; transition: all 0.8s; }
#member ul li .text p{ font-size: 2rem; font-weight: 400; margin-top: 20px; transition: all 0.8s; }
#member ul li .text .btn{ margin-top: 30px; }

#member ul li:hover .text{ opacity: 1; }
#member ul li:hover .text *{ filter: blur(0px); }

#member ul li.active .text{ opacity: 1; }
#member ul li.active .text *{ filter: blur(0px); }

#member .txt-slide{ display: flex; overflow: hidden; padding: 100px 0 105px; }
#member .txt-slide h3{ font-family: var(--Lora); font-size: 17rem; font-weight: 500; font-style: italic; line-height: 1; color: rgba(0, 0, 0, 0.03); white-space: nowrap; padding-right: 60px; }
#member .txt-slide h3.origin{ animation: 30s linear 0s infinite normal forwards running origin_left; }
#member .txt-slide h3.clone{ animation: 30s linear 0s infinite normal none running clone_left; }

@keyframes origin_left{
	0%{ transform: translateX(0); }
	50%{ transform: translateX(-100%); }
	50.01%{ transform: translateX(100%) }
	100%{ transform: translateX(0); }
}

@keyframes clone_left{
	0%{ transform: translateX(0); }
	100%{ transform: translateX(-200%) }
}

@media screen and (max-width: 1600px){
	#member ul li .text h4{ font-size: 3.5rem; }
	#member ul li .text p{ font-size: 1.8rem; } 

	#member .txt-slide h3{ font-size: 14rem; padding-right: 50px; }
}

@media screen and (max-width: 1250px){
	#member h5{ font-size: 2.4rem; margin-bottom: 15px; }
	#member ul li .text h4{ font-size: 3rem; }
	#member ul li .text p{ font-size: 1.7rem; margin-top: 5px; } 
	#member ul li .text .btn{ margin-top: 15px; }

	#member .txt-slide{ padding: 50px 0 55px; }
	#member .txt-slide h3{ font-size: 10rem; padding-right: 30px; }
}

@media screen and (max-width: 1150px){
	#member br{ display: none; }
}

@media screen and (max-width: 900px){
	#member h5{ font-size: 2.2rem; }
	#member ul li .text h4{ font-size: 2.4rem; }
	#member ul li .text p{ font-size: 1.6rem; }

	#member .txt-slide{ padding: 40px 0 45px; }
	#member .txt-slide h3{ font-size: 6rem; padding-right: 20px; }
}

@media screen and (max-width: 800px){
	#member ul li{ width: calc(100% / 2); }
}


/* 로펌소개 - 구성원 소개 (상세) */
#lawyer{ padding: 0; } 
#lawyer section{ position: relative; }
#lawyer .cover{ width: 100%; height: 100vh; background: #fff; display: flex; justify-content: center; align-items: center; text-align: center; position: absolute; top: 0; left: 0; z-index: 50; opacity: 1; }
#lawyer .cover h3{ font-size: 5rem; font-weight: 600; color: #EEE; padding: 0 20px; position: relative; }
#lawyer .cover h3 span{ transition: color 0.8s; }

#lawyer .cover.active{ position: fixed; animation: slideUp 1s forwards; }
#lawyer .cover.active span{ color: #000; }

@keyframes slideUp{
	0%{ transform: translateY(0); }
	100%{ transform: translateY(-100%); }
}

#lawyer .flex-box{ display: flex; } 
#lawyer .flex-box > div{ width: 50%; }

#lawyer .text-box{ display: flex; flex-direction: column; gap: 60px 0; padding: 120px 0 140px; padding-right: 100px; }
#lawyer .text-box h4{ font-size: 6rem; font-weight: 400; color: #111; }
#lawyer .text-box h4 strong{ font-weight: 600; }
#lawyer .text-box dl dt{ width: 100%; font-size: 2rem; font-weight: 600; color: #111; margin-bottom: 25px; }
#lawyer .text-box dl dt span{ border-bottom: 1px solid #000; }
#lawyer .text-box dl dd{ font-size: 1.8rem; font-weight: 300; color: #666; }
#lawyer .text-box dl dd:not(:last-of-type){ margin-bottom: 10px; }
#lawyer .text-box dl.half{ display: flex; flex-wrap: wrap; justify-content: space-between; }
#lawyer .text-box dl.half dd{ display: inline-block; width: calc((100% - 20px) / 2); }

#lawyer .text-box ul{ display: flex; flex-wrap: wrap; gap: 20px; }
#lawyer .text-box ul li{ width: calc((100% - 40px) / 3); }
#lawyer .text-box ul li figure{ border: 1px solid #EEE; width: 100%; position: relative; overflow: hidden; padding-bottom: 139%; }
#lawyer .text-box ul li figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

#lawyer .text-box .btn{ width: 240px; height: 60px; font-size: 1.8rem;; margin-top: 40px; }

#lawyer .figure-box figure{ width: calc(100% + ((100vw - 1617px) / 2)); height: calc(100vh - 97px); object-fit: cover; position: relative; position: sticky; top: 97px; left: 0; }
#lawyer .figure-box figure img{ width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }

@media screen and (max-width: 1640px){
	#lawyer .figure-box figure{ width: calc(100% + 20px); }
}

@media screen and (max-width: 1600px){
	#lawyer .cover h3{ font-size: 4rem; }

	#lawyer .text-box{ padding-top: 80px; }
	#lawyer .text-box h4{ font-size: 5rem; }
	#lawyer .text-box dl dt{ font-size: 1.9rem; }
	#lawyer .text-box dl dd{ font-size: 1.7rem; }
	#lawyer .text-box .btn{ width: 220px; height: 55px; font-size: 1.7rem; }
}

@media screen and (max-width: 1400px){
	#lawyer .text-box{ padding-right: 50px; }
}

@media screen and (max-width: 1250px){
	#lawyer .cover h3{ font-size: 3.5rem; }

	#lawyer .text-box{ gap: 40px 0; padding-top: 60px; padding-bottom: 100px; }
	#lawyer .text-box h4{ font-size: 4rem; }
	#lawyer .text-box dl dt{ font-size: 1.8rem; margin-bottom: 15px; }
	#lawyer .text-box dl dd{ font-size: 1.6rem; }
	#lawyer .text-box dl.half dd{ width: 100%; } 
	#lawyer .text-box .btn{ width: 195px; height: 50px; font-size: 1.6rem; margin-top: 20px; }
}

@media screen and (max-width: 1000px){
	#lawyer .flex-box{ flex-direction: column-reverse; }
	#lawyer .flex-box > div{ width: 100%; }

	#lawyer .text-box{ padding-top: 30px; padding-right: 0; }

	#lawyer .figure-box{ padding-top: 60px; }
	#lawyer .figure-box figure{ width: 100%; height: auto; padding-bottom: 98%; } 
}

@media screen and (max-width: 900px){
	#lawyer .cover h3{ font-size: 3rem; }

	#lawyer .text-box h4{ font-size: 3rem; }
	#lawyer .text-box .btn{ margin-top: 0; }
}

@media screen and (max-width: 600px){
	#lawyer .text-box ul li{ width: calc((100% - 20px) / 2); }
}


/* 로펌소개 - 오시는 길 */
#location .map{ max-width: 1920px; height: 500px; margin: 0 auto; }
#location .map .root_daum_roughmap_landing{ width: 100%; height: 100%; }
#location .root_daum_roughmap .map_border{ display: none; }

#location .location{ padding: 60px 50px; }
#location .location .flex-box{ display: flex; flex-wrap: wrap; gap: 50px 90px; }
#location .location .box{ position: relative; }
#location .location .box::after{ content: ""; width: 1px; height: 100%; border-right: 1px dashed #CCC; position: absolute; top: 50%; right: -40px; transform: translateY(-50%); }
#location .location .flex-box .box:last-of-type::after{ display: none; }
#location .location .icon{ height: 30px; margin-bottom: 30px; }
#location .location dl *{ font-size: 1.8rem; }
#location .location dl dt{ font-weight: 600; color: #333; margin-bottom: 10px; }
#location .location dl dd{ font-weight: 300; color: #666; }
#location .location dl dd:not(:last-of-type){ margin-bottom: 10px; }
#location .location dl dd.flex{ display: flex; gap: 10px; }
#location .location dl dd.center{ align-items: center; }
#location .location dl dd.wrap{ flex-wrap: wrap; }
#location .location dl dd .mark{ display: inline-block; padding: 9px 15px; font-size: 1.6rem; font-weight: 400; color: #fff; line-height: 1; border-radius: 30px; background: #87C700; }

#location .border{ border: 1px solid #EEE; }
#location .border .box{ width: calc((100% - 270px) / 4); }

#location .bg{ background: #F9F9F9; }
#location .bg .box{ width: calc((100% - 180px) / 3); }

@media screen and (max-width: 1600px){
	#location .location{ padding: 50px 40px; }
}

@media screen and (max-width: 1250px){
	#location .location{ padding: 40px 30px; }
	#location .location .flex-box{ gap: 60px; }
	#location .location .box::before{ content: ""; width: calc(100% + 29px); height: 1px; border-bottom: 1px dashed #CCC; position: absolute; bottom: -30px; }
	#location .location .box:nth-of-type(odd)::before{ left: 0; }
	#location .location .box:nth-of-type(even)::before{ right: 0; }
	#location .location .box:last-of-type::before{  display: none; }
	#location .location .box::after{ height: calc((100% + 29px)); top: -30px; right: -30px; transform: translateY(0); } 
	#location .location .box:first-of-type::after{  top: 0; }
	#location .location .icon{ margin-bottom: 20px; }
	#location .location dl *{ font-size: 1.7rem; }
	#location .location dl dd .mark{ font-size: 1.5rem; padding: 7px 12px; }

	#location .location .bus dl dd.flex{ gap: 5px; }

	#location .border .box{ width: calc((100% - 60px) / 2); }
	#location .border .box:nth-of-type(3)::before{ display: none; }
	#location .border .box:nth-of-type(even)::after{ display: none; }

	#location .bg .box{ width: calc((100% - 60px) / 2); }
	#location .bg .box:nth-of-type(even)::after{ display: none; }
}

@media screen and (max-width: 900px){
	#location .location dl *{ font-size: 1.6rem; }
	#location .location dl dd:not(:last-of-type){ margin-bottom: 5px; }
	#location .location dl dd .mark{ padding: 5px 10px; }
}

@media screen and (max-width: 800px){
	#location .location .box::before{ width: 100%; }
	#location .location .box::after{ display: none; }

	#location .border .box{ width: 100%; }
	#location .border .box:nth-of-type(3)::before{ display: block; }

	#location .bg .box{ width: 100%; }
}


/* 업무분야 */
#business.sub-content::after{ z-index: 0; }
#business .w1600{ position: relative; z-index: 10; }
#business .sec-title{ margin-bottom: 30px; }

#business .intro .arti-title{ margin-bottom: 100px; }
#business .intro .bg{ position: relative; padding-bottom: 28.4%; opacity: 1; }
#business .intro .bg figure{ width: calc(100% + ((100vw - 100% - 17px) / 2)); position: absolute; top: 0; left: 0; }
#business .intro .bg figure img{ width: 100%; }
#business .intro .bg figure::after{ content: ""; width: 100%; height: 100%; background: #fff; position: absolute; top: 0; left: 0; transform: scaleX(1); transform-origin: right; transition: transform 1.5s; }

#business .intro .bg.aos-animate figure::after{ transform: scaleX(0); }

#business .condition ul{ display: flex; flex-wrap: wrap; gap: 20px; }
#business .condition ul li{ padding:35px; border: 1px solid #EEE; }
#business .condition .icon{ height: 50px; margin-bottom: 50px; }
#business .condition dl dt{ font-size: 2rem; font-weight: 500; color: #333; margin-bottom: 10px; }
#business .condition dl dd{ font-size: 1.6rem; font-weight: 300; color: #666; line-height: 1.625; }

#business .advantage{ position: relative; }
#business .advantage .image{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; }
#business .advantage .image .sticky{ width: 100%; height: 100vh; position: sticky; top: 0; left: 0; overflow: hidden; }  
#business .advantage .image img{ width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: cover; }
#business .advantage *{ color: #fff !important; transition: color 0.8s; }
#business .advantage .flex-box{ display: flex; }
#business .advantage .title{ width: 400px; }
#business .advantage .sec-title{ position: sticky; top: 200px; left: 0; }
#business .advantage .list{ width: calc(100% - 400px); }
#business .advantage .list ul li{ width: 100%; display: flex; }
#business .advantage .list ul li:nth-of-type(even){ justify-content: flex-end; }
#business .advantage .list .box{ width: calc((100% - 85px) / 2);  padding: 60px; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.2); position: relative; overflow: hidden; }
#business .advantage .list ul li .box::before{ content: ""; width: 120%; padding-bottom: 120%; background: #fff; border-radius: 50%; position: absolute; z-index: -1; top: 0; left: 0; transform: translate(-100%, -100%) ; transform-origin: top left; transition: all 1s; }
#business .advantage .list ul li *{ transition: color 0.7s; }
#business .advantage .list .box span{ display: inline-block; font-family: var(--Lora); font-size: 2rem; font-weight: 500; margin-bottom: 95px; transition-delay: 0.3s; }
#business .advantage .list .box p{ font-size: 1.8rem; font-weight: 300; line-height: 1.6666; }

@media (hover: hover){
	#business .advantage .list .box:hover::before{ top: 50%; left: 50%; transform: translate(-50%, -50%); }
	#business .advantage .list .box:hover span{ color: var(--mainColor) !important; transition-delay: unset; }
	#business .advantage .list .box:hover p{ color: #333 !important; }
}

#business .step{ background: #fff; }
#business .step .sec-title{ margin-bottom: 60px; }
/* #business .step ul{ display: flex; flex-wrap: wrap; } */
#business .step ul{ display: flex; flex-wrap: wrap; justify-content: center; gap: 60px 0; }
#business .step ul li{ display: flex; flex-direction: column; align-items: center; position: relative; text-align: center; }
#business .step ul li .circle{ width: 100%; padding-bottom: 100%; background: linear-gradient(135deg, var(--mainColor), #688579); border-radius: 50%; position: relative; }
#business .step ul li .circle::before{ content: ""; width: calc(100% - 20px); height: calc((100% - 20px)); background: #fff; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#business .step ul li .circle::after{ content: ""; width: 120px; height: 10px; background: var(--mainColor); position: absolute; top: 50%; left: 0; z-index: -1; transform: translate(-100%, -50%); }
#business .step .text{ position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); padding: 20px; }
#business .step ul li:not(:last-of-type) .circle::after{ display: none; }
#business .step .text .num{ display: block; font-family: var(--Lora); font-size: 1.2rem; font-weight: 400; color: var(--mainColor); margin-bottom: 10px; }
#business .step .text p{ display: flex; flex-direction: column; justify-content: center; min-height: 3.9em; font-size: 2rem; font-weight: 500; color: #333; }
#business .step .text p span{ display: block; min-height: 2.6em; font-size: 1.4rem; font-weight: 300; color: #666; margin-top: 5px; }

#business .step .arrow{ width: 100%; padding-top: 100px; position: relative; }
#business .step .arrow::after{ content: url("/img/sub/business/step_arrow.svg"); position: absolute; top: 50px; left: 50%; transform: translate(-50%, -50%); }  
#business .step .arrow > span{ font-size: 1.6rem; font-weight: 500; color: #333; position: absolute; top: 50px; left: 0; right: 0; transform: translateY(-50%); padding-left: calc(50% + 20px); text-align: left; }
#business .step .arrow .box{ max-width: 160px; width: calc(100% - 10px); height: 70px; display: flex; justify-content: center; align-items: center; background: var(--mainColor); padding: 5px; margin: 0 auto; }
#business .step .arrow .box p{ font-size: 1.8rem; font-weight: 700; color: #fff; text-align: center; }
#business .step .arrow .box p span{ font-size: 1.6rem; font-weight: 300; }

#business .step .arrow.gray .box{ background: #333; }

@media screen and (max-width: 1640px){
	#business .intro .bg figure{ width: calc(100% + 20px); }
}

@media screen and (max-width: 1600px){
	#business .intro .arti-title{ margin-bottom: 80px; }

	#business .condition dl dt{ font-size: 1.8rem; }

	#business .advantage .list .box{ padding: 50px; }
	#business .advantage .list .box span{ font-size: 1.8rem; margin-bottom: 65px; }
	#business .advantage .list .box p{ font-size: 1.7rem; }

	#business .step .text p{ font-size: 1.8rem; }

	#business .step .arrow .box{ height: 65px; }
	#business .step .arrow .box p{ font-size: 1.7rem; }
}

@media screen and (max-width: 1500px){
	#business .advantage .title{ width: 300px; }
	#business .advantage .list{ width: calc(100% - 300px); }
	#business .advantage .list .box{ width: calc((100% - 40px) / 2); }  
}

@media screen and (max-width: 1250px){
	#business .intro .arti-title{ margin-bottom: 60px; }

	#business .condition ul li{ padding: 25px; }
	#business .condition .icon{ margin-bottom: 30px; }
	#business .condition dl dt{ font-size: 1.7rem; }

	#business .advantage .title{ width: 250px; }
	#business .advantage .list{ width: calc(100% - 250px); }
	#business .advantage .list .box{ padding: 40px; }
	#business .step .text .num{ margin-bottom: 5px; }
	#business .advantage .list .box span{ font-size: 1.7rem; margin-bottom: 45px; }
	#business .advantage .list .box p{ font-size: 1.6rem; }
	#business .step .arrow > span{ font-size: 1.5rem; padding-left: calc(50% + 15px); }
	#business .step .arrow .box p span{ font-size: 1.5rem; }
}

@media screen and (max-width: 1100px){
	#business .advantage .flex-box{ flex-direction: column; }
	#business .advantage .title{ width: 100%; }
	#business .advantage .list{ width: 100%; }
}

@media screen and (max-width: 900px){
	#business .intro .arti-title{ margin-bottom: 20px; }

	#business .condition .icon{ margin-bottom: 20px; }
	#business .condition dl dt{ margin-bottom: 5px; }

	#business .advantage .list ul li:not(:last-of-type){ margin-bottom: 20px; }
	#business .advantage .list .box{ width: 100%; }
	#business .advantage .list .box span{ margin-bottom: 25px; }
	#business .advantage .list .box{ padding: 30px; }

	/* #business .step ul{ gap: 50px 0; } */
	#business .step .arrow{ padding-top: 80px; }
	#business .step .arrow::after{ top: 45px; }
	#business .step .arrow > span{ top: 40px; }
	#business .step .arrow .box{ height: 60px; }
	#business .step .arrow .box p{ font-size: 1.6rem; }
}



/* 업무분야 - 개인회생 */
#business.rehabilitation .condition ul li{ width: calc((100% - 60px) / 4); }
#business.rehabilitation .step ul li{ width: calc((100% - 70px) / 9); }
#business.rehabilitation .step ul li:first-of-type .text .num{ margin-top: 1.2em; }
#business.rehabilitation .step ul li:last-of-type{ margin-left: 70px; }
#business.rehabilitation .step ul li:nth-of-type(5) .circle::after{ display: none; }

@media screen and (max-width: 1600px){
	#business.rehabilitation .step ul li{ width: calc((100% - 40px) / 9); }
	#business.rehabilitation .step ul li:last-of-type{ margin-left: 40px; }
}

@media screen and (max-width: 1500px){
	#business.rehabilitation .step ul li{ width: calc((100% - 30px) / 9); }
	#business.rehabilitation .step ul li:last-of-type{ margin-left: 30px; }
}

@media screen and (max-width: 1470px){
	#business.rehabilitation .condition br{ display: none; }
}

@media screen and (max-width: 1450px){
	#business.rehabilitation .step ul{ max-width: 1200px; margin: 0 auto; }
	#business.rehabilitation .step ul li{ width: calc((100% - 30px) / 5); }
	#business.rehabilitation .step ul li:first-of-type .text .num{ margin-top: 0; }
	#business .step .text p span{ min-height: auto; }

	#business.rehabilitation .step ul{ gap: 30px 0; }

	#business.rehabilitation .step ul li.reverse{ flex-direction: column-reverse; }
	#business.rehabilitation .step ul li.reverse .arrow{ padding-top: 0; padding-bottom: 100px; }
	#business .step ul li.reverse .arrow::after{ top: calc(100% - 50px); }
	#business .step ul li.reverse .arrow > span{ top: calc(100% - 50px); }
}

@media screen and (max-width: 1200px){
	#business.rehabilitation .condition ul li{ width: calc((100% - 20px) / 2); }
}

@media screen and (max-width: 950px){
	#business.rehabilitation .step ul{ max-width: 700px; }
	#business.rehabilitation .step ul li{ width: calc((100% - 30px) / 3); }
	#business.rehabilitation .step ul li.reverse{ flex-direction: column; }
	#business.rehabilitation .step ul li.reverse .arrow{ padding-top: 100px; padding-bottom: 0; }
	#business .step ul li.reverse .arrow::after{ top: 50px; }
	#business .step ul li.reverse .arrow > span{ top: 50px; }
}

@media screen and (max-width: 900px){
	#business.rehabilitation .step ul{ gap: 50px 0; }
	#business .step ul li.reverse .arrow{ padding-top: 70px; }
	#business .step ul li.reverse .arrow::after{ top: 45px; }
	#business .step ul li.reverse .arrow > span{ top: 40px; }
}

@media screen and (max-width: 600px){
	#business.rehabilitation .arti-title br{ display: none; }

	#business.rehabilitation .condition ul li{ width: 100%; }

	#business.rehabilitation .step ul{ /* max-width: 420px; */ gap: 0; }
	#business.rehabilitation .step ul li{ width: 100%; flex-direction: row; justify-content: space-between; align-items: center; }
	#business.rehabilitation .step ul li.reverse{ flex-direction: row; }
	#business.rehabilitation .step ul li:last-of-type{ margin-left: 0; }
	#business.rehabilitation .step ul li .circle{ width: calc(55% - 50px); padding-bottom: calc(55% - 50px); }
	#business.rehabilitation .step ul li .circle::after{ display: none; }
	#business.rehabilitation .step ul li .arrow{ width: calc(45% - 50px); padding-top: 0; }
	#business.rehabilitation .step ul li .arrow::after{ top: 50%; left: -45px; transform: translate(-50%, -50%) rotate(-90deg); }
	#business.rehabilitation .step ul li .arrow > span{ max-width: max-content; padding-left: 0; top: calc(50% - 15px); left: -50px; transform: translate(-50%, -100%); }
	#business.rehabilitation .step ul li.reverse .arrow{ padding-top: 0; }
	#business.rehabilitation .step ul li.arrow .box{ margin: 0 !important; }
}


/* 업무분야 - 개인파산 */
#business.bankruptcy .condition ul li{ width: calc((100% - 40px) / 3); }
#business.bankruptcy .step ul li{ width: calc((100% - 100px) / 7); }
#business.bankruptcy .step ul li:last-of-type{ margin-left: 100px; }
#business.bankruptcy .step ul li:last-of-type .text p{ color: var(--mainColor); }

@media screen and (max-width: 1300px){
	#business.bankruptcy .step ul li{ width: calc((100% - 60px) / 7); }
	#business.bankruptcy .step ul li:last-of-type{ margin-left: 60px; }
}

@media screen and (max-width: 1200px){
	#business.bankruptcy .condition ul li{ width: calc((100% - 20px) / 2); }
	#business.bankruptcy .step ul{ max-width: 900px; margin: 0 auto; }
	#business.bankruptcy .step ul li{ width: calc((100% - 30px) / 4); }
	#business.bankruptcy .step ul li:last-of-type{ margin-left: 30px; }
}

@media screen and (max-width: 1100px){
	#business.bankruptcy .condition br{ display: none; }
}

@media screen and (max-width: 760px){
	#business.bankruptcy .arti-title br{ display: none; }

	#business.bankruptcy .step ul{ max-width: 450px; gap: 0; }
	#business.bankruptcy .step ul li{ width: 90%; margin-bottom: -10px; }
	#business.bankruptcy .step ul li:last-of-type{ margin-top: 80px; margin-left: 0; margin-bottom: 0; }
	#business.bankruptcy .step ul li .circle{ padding-bottom: 140px; border-radius: 200px; }
	#business.bankruptcy .step ul li .circle::before{ border-radius: 200px; }
	#business.bankruptcy .step ul li .circle::after{ width: 10px; height: 120px; top: 0; left: 50%; transform: translate(-50%, -100%); }
	#business.bankruptcy .step ul li .circle br{ display: none; }
	#business.bankruptcy .step .text p{ min-height: 0; margin-top: 15px; }
}

@media screen and (max-width: 600px){
	#business.bankruptcy .condition ul li{ width: 100%; }
}


/* 성공사례 - 리스트 */
#sucess .board_box table thead th.small{ width: 125px; }
#sucess .board_box table thead th.middle{ width: 350px; }
#sucess .board_box table td{ padding: 40px 35px; }
#sucess .board_box table td .color{ display: block; font-size: 1.8rem; font-weight: 600; color: var(--mainColor); margin-bottom: 10px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#sucess .board_box table td h6{ font-size: 2.2rem; } 

#sucess .board_box .flex{ display: flex; justify-content: center; align-items: center; gap: 20px; }
#sucess .board_box table td figure{ width: 60px; height: 60px; border-radius: 50%; overflow: hidden; position: relative; }
#sucess .board_box table td figure img{ width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#sucess .board_box table td p{ display: flex; align-items: center; gap: 10px; font-size: 1.4rem; font-weight: 300; color: #333; }
#sucess .board_box table td p strong{ font-size: 1.8rem; font-weight: 600; color: #333; }

@media screen and (max-width: 1600px){
	#sucess .board_box table td{ padding: 30px 25px; }
	#sucess .board_box table td .color{ font-size: 1.7rem; }
	#sucess .board_box table td h6{ font-size: 2rem; } 
	#sucess .board_box table td p strong{ font-size: 1.7rem; }
}

@media screen and (max-width: 1250px){
	#sucess .board_box table thead th.middle{ width: 250px; }
	#sucess .board_box table td{ padding: 25px; }
	#sucess .board_box table td .color{ margin-bottom: 5px; }
	#sucess .board_box table td .color{ font-size: 1.6rem; }
	#sucess .board_box table td h6{ font-size: 1.9rem; } 
	
	#sucess .board_box .flex{ gap: 15px; }
	#sucess .board_box table td figure{ width: 50px; height: 50px; }
	#sucess .board_box table td p{ gap: 5px; }
	#sucess .board_box table td p strong{ font-size: 1.6rem; }
}

@media screen and (max-width: 900px){
	#sucess .board_box table thead{ display: none; }
	#sucess .board_box table tr{ display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--tableLine); padding: 20px; }
	#sucess .board_box table tr::after{ bottom: -1px; }
	#sucess .board_box table td{ width: 100%; border-bottom: none; padding: 0; text-align: left; }
	#sucess .board_box table td:nth-of-type(1){ display: inline-block; width: auto; position: absolute; top: 19px; left: 20px; padding: 5px 10px; border: 1px solid var(--mainColor); line-height: 1; }
	#sucess .board_box table td:nth-of-type(3){ margin-top: 10px; }

	#sucess .board_box table td .color{ padding-left: 90px; font-size: 1.5rem; margin-bottom: 15px; padding-top: 4px; }
	#sucess .board_box table td h6{  font-size: 1.8rem; overflow: hidden; } 

	/* 공지 */
	#sucess .board_box table .notice td:first-of-type::after{ border: none; }

	#sucess .board_box .flex{ justify-content: flex-start; }
	#sucess .board_box table td figure{ width: 40px; height: 40px; }
}


/* 성공사례 - 상세 */
#view.success .info{ padding: 60px 0 100px; }

#view .num-box{ display: flex; justify-content: space-between; background: #F9F9F9; padding: 50px; margin-top: 60px; }
#view .num-box dl{ display: flex; align-items: center; }
#view .num-box dl dd{  font-family: var(--Lora); }
#view .num-box dl dd span{ font-family: var(--baseFont); margin-left: 10px; }

#view .num-box .flex-box{ width: calc((100% - 400px)); display: flex; flex-wrap: wrap; gap: 50px; }
#view .num-box .flex-box dl{ width: calc((100% - 100px) / 3); position: relative; }
#view .num-box .flex-box dl::after{ content: ""; width: 1px; height: 16px; background: #DDD; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
#view .num-box .flex-box dl:nth-of-type(3n)::after, #view .num-box .flex-box dl:last-of-type::after{ display: none; }
#view .num-box .flex-box dl dt{ width: 100px; font-size: 1.8rem; font-weight: 500; color: #333; }
#view .num-box .flex-box dl dd{ width: calc(100% - 100px); font-family: var(--Lora); font-size: 2.8rem; font-weight: 400; color: var(--mainColor); padding-right: 20px; }
#view .num-box .flex-box dl dd span{ font-family: var(--baseFont); display: inline-block; font-size: 1.6rem; font-weight: 300; color: #666; }

#view .num-box .green-box{ width: 375px; background: var(--mainColor); padding: 50px; color: #fff; }
#view .num-box .green-box dl{ height: 100%; flex-direction: column; justify-content: space-between; }
#view .num-box .green-box dl dt{ width: 100%; font-size: 2rem; font-weight: 600; }
#view .num-box .green-box dl dd{ width: 100%; font-size: 4.6rem; font-weight: 500; text-align: right; }
#view .num-box .green-box dl dd span{ font-size: 1.8rem; font-weight: 300; }

#view  .info-box{ display: flex; gap: 20px; padding-bottom: 55px; }
#view  .info-box > div{ width: calc((100% - 20px) / 2); }

#view  .info-box .lawyer{  --circle: 195px; --gap: 60px; display: flex; align-items: center; gap: var(--gap); padding: 60px; background: url("/img/sub/success/symbol.svg") no-repeat top left / auto; border: 1px solid #000; }
#view  .info-box .lawyer figure{ width: var(--circle); height: var(--circle); position: relative; border-radius: 50%; overflow: hidden; }
#view  .info-box .lawyer figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#view  .info-box .lawyer .text{ width: calc(100% - var(--circle) - var(--gap)); }
#view  .info-box .lawyer .text p{ font-size: 2rem; font-weight: 400; color: #333; margin-bottom: 60px; position: relative; }
#view  .info-box .lawyer .text p::after{ content: ""; width: 100%; height: 1px; border-bottom: 1px dashed #DDD; position: absolute; bottom: -30px; left: 0; }
#view  .info-box .lawyer .text span{ display: inline-block; width: 100%; text-align: right; font-size: 1.6rem; font-weight: 300; color: #666; }
#view  .info-box .lawyer .text strong{ font-size: 3.2rem; font-weight: 600; color: #111; margin-left: 30px; }

#view  .info-box .reserve{ display: flex; gap: 20px; }
#view  .info-box .reserve .box{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: calc((100% - 20px) / 2); padding: 25px; border: 1px solid #DDD; text-align: center; position: relative; }
#view  .info-box .reserve .icon{ display: flex; justify-content: center; align-items: center; width: 100px; height: 100px; background: #F5F5F5; border-radius: 50%; margin: 0 auto; transition: background 0.5s; }
#view  .info-box .reserve .icon img{ filter: invert(0); transition: filter 0.5s; }
#view  .info-box .reserve dl{ margin-top: 30px; }
#view  .info-box .reserve dt{ font-size: 2rem; font-weight: 500; color: #222; margin-bottom: 10px; transition: color 0.5s; }
#view  .info-box .reserve dd{ font-size: 1.6rem; font-weight: 300; color: #666; }
#view  .info-box .reserve .box a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; }

#view  .info-box .reserve .box:hover .icon{ background: var(--mainColor); }
#view  .info-box .reserve .box:hover .icon img{ filter: invert(1); }
#view  .info-box .reserve .box:hover dt{ color: var(--mainColor); }

@media screen and (max-width: 1600px){
	#view .num-box .flex-box{ gap: 35px; }
	#view .num-box .flex-box dl{ width: calc((100% - 70px) / 3); }
	#view .num-box .flex-box dl dt{ font-size: 1.7rem; }
	#view .num-box .flex-box dl dd{ font-size: 2.6rem; }

	#view .num-box .green-box dl dt{ font-size: 1.8rem; }
	#view .num-box .green-box dl dd{ font-size: 4rem; }

	#view .info-box .lawyer{ --circle: 180px; }
	#view .info-box .lawyer .text p{ font-size: 1.8rem; }
	#view .info-box .lawyer .text strong{ font-size: 2.8rem; }  
	#view .info-box .reserve dt{ font-size: 1.8rem; }
}

@media screen and (max-width: 1500px){
	#view .num-box{ flex-direction: column; gap: 35px; }
	#view .num-box .flex-box{ width: 100%; }

	#view .num-box .green-box{ width: 100%; padding: 15px 30px; }
	#view .num-box .green-box dl{ height: auto; flex-direction: row; justify-content: flex-start; gap: 100px; }

	#view .info-box .lawyer{ --gap: 40px; padding: 40px; }
}

@media screen and (max-width: 1320px){
	#view .info-box .lawyer{ --circle: 150px; }
}

@media screen and (max-width: 1250px){
	#view .num-box{ padding: 40px; margin-top: 40px; }
	#view .num-box .flex-box{ gap: 20px; }
	#view .num-box .flex-box dl dt{ width: 80px; font-size: 1.6rem; }
	#view .num-box .flex-box dl dd{ width: calc(100% - 80px); font-size: 2.4rem; }

	#view .num-box .green-box{ padding: 10px 20px; }
	#view .num-box .green-box dl{ gap: 60px; }
	#view .num-box .green-box dl dt{ font-size: 1.7rem; }
	#view .num-box .green-box dl dd{ font-size: 3.5rem; }

	#view.success .info{ padding: 40px 0 80px; }

	#view .info-box{ padding-bottom: 40px; }
	#view .info-box .lawyer{ --circle: 130px; padding: 30px; }
	#view .info-box .lawyer .text p{ font-size: 1.7rem; margin-bottom: 40px; }
	#view .info-box .lawyer .text p::after{ bottom: -20px; }
	#view .info-box .lawyer .text strong{ font-size: 2.4rem; margin-left: 15px; }

	#view .info-box .reserve .icon{ width: 80px; height: 80px; }
	#view .info-box .reserve dl{ margin-top: 15px; }
	#view .info-box .reserve dt{ font-size: 1.7rem; }
}

@media screen and (max-width: 1150px){
	#view .info-box{ flex-direction: column; }
	#view .info-box > div{ width: 100%; }

	#view .info-box .reserve .box{ flex-direction: row; gap: 20px; }
	#view .info-box .reserve .icon{ margin: 0; }
	#view .info-box .reserve dl{ width: calc(100% - 100px); margin-top: 0; text-align: left; }
}

@media screen and (max-width: 950px){
	#view .num-box .flex-box dl{ width: calc((100% - 20px) / 2); }
	#view .num-box .flex-box dl:nth-of-type(3n)::after{ display: block; }
	#view .num-box .flex-box dl:nth-of-type(2n)::after{ display: none; }
}

@media screen and (max-width: 900px){
	#view .num-box{ padding: 30px; margin-top: 20px; } 
	#view .num-box .flex-box dl dt{  font-size: 1.5rem; }
	#view .num-box .flex-box dl dd{  font-size: 2.2rem; }

	#view .num-box .green-box dl{ gap: 30px; }
	#view .num-box .green-box dl dt{ font-size: 1.6rem; }
	#view .num-box .green-box dl dd{ font-size: 3rem; }

	#view.success .info{ padding: 60px 0 60px; }

	#view .info-box{ padding-bottom: 0; }
	#view .info-box .lawyer .text strong{ font-size: 2.2rem; } 
}

@media screen and (max-width: 700px){
	#view .num-box .flex-box dl{ width: 100%; }
	#view .num-box .flex-box dl::after{ display: none !important; }

	#view .num-box .green-box dl dd{ padding-right: 0; }

	#view .info-box .reserve{ flex-direction: column; }
	#view .info-box .reserve .box{ width: 100%; }
}

@media screen and (max-width: 600px){
	#view .info-box .lawyer{ flex-direction: column; --gap: 20px; }
	#view .info-box .lawyer .text{ width: 100%; }
}


/* 법률상담 (공통) */
#counseling{ overflow: hidden; }
#counseling .arti-title{ margin-bottom: 80px; }
#counseling .flex-box{ display: flex; justify-content: space-between; }
#counseling .flex-box > div{ width: calc((100% - 100px) / 2); }

#counseling .flex-box .figure figure{ width: 100%; height: 100%; position: relative; overflow: hidden; padding-bottom: 86%; }
#counseling .flex-box .figure figure img{ width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

#counseling .form-box .input-box .check-list{ padding: 9px 0; }
#counseling .form-box .input-box .check-list ul{ display: flex; flex-wrap: wrap; gap: 20px 0; }
#counseling .form-box .input-box .check-list ul li{ width: 150px; }

#counseling .form-box .input-box .radio-list ul{ display: flex; flex-wrap: wrap; gap: 10px; }

@media screen and (max-width: 1600px){
	#counseling .arti-title{ margin-bottom: 60px; }
}

@media screen and (max-width: 1400px){
	#counseling .flex-box > div{ width: calc((100% - 60px) / 2); }
}

@media screen and (max-width: 1250px){
	#counseling .arti-title{ margin-bottom: 40px; }
}

@media screen and (max-width: 1000px){
	#counseling .flex-box{ flex-direction: column; }
	#counseling .flex-box > div{ width: 100%; }
	#counseling .form-box{ margin-top: 30px; }
}

@media screen and (max-width: 900px){
	#counseling .arti-title{ margin-bottom: 20px; }
}

@media screen and (max-width: 600px){
	#counseling .form-box .input-box .check-list ul li{ width: 145px; }
}


/* form 공통 */
.form-box .input-box{ padding: 40px 0; border-top: 2px solid #000; border-bottom: 2px solid #000; }
.form-box *{ font-size: 1.6rem; color: #333; }
.form-box .input-box .line{ display: flex; align-items: center; }
.form-box .input-box .line:not(:last-of-type){ margin-bottom: 20px; }
.form-box .input-box .tit{ width: 135px; font-weight: 500; color: #222; }
.form-box .input-box .input{ width: calc(100% - 135px); }
.form-box .input-box .input input[type="text"], .form-box .input-box .input input[type="tel"],  .form-box .input-box .input select, .form-box .input-box .input textarea{ width: 100%; height: 60px; border: 1px solid #EEE; outline: none; padding: 0 15px; appearance: none; -webkit-appearance: none; border-radius: 0; -webkit-border-raidus: 0; }
.form-box .input-box .input select{ background: url("/img/sub/select_icon.svg") no-repeat center right 25px / auto; color: #AAA; }
.form-box .input-box .input select.selected{ color: #333; }
.form-box .input-box .input textarea{ resize: none; height: 240px; padding: 15px; }
.form-box .input-box .input span{ font-weight: 400; }

.form-box .input-box .line.start{ align-items: flex-start; }
.form-box .input-box .line.start .tit{ padding-top: calc((60px -  1.3em) / 2); }

.form-box .input-box .input.price{ display: flex; justify-content: space-between; align-items: center; }
.form-box .input-box .input.price input{ width: calc(100% - 50px) !important; }

.form-box .input-box .flex{ display: flex; gap: 10px; }
.form-box .input-box .flex > *{ width: calc((100% - 10px) / 2) !important; }

.form-box .agree{ display: flex; flex-wrap: wrap; gap: 20px 0; align-items: center; margin-top: 20px; }
.form-box .agree .privacy{ padding: 0px 30px; }
.form-box .agree .privacy span{ font-size: 1.4rem; font-weight: 400; color: #AAA; border-bottom: 1px solid #AAA; }

.form-box .input-box .input.auto{ display: flex; justify-content: space-between; }
.form-box .input-box .input.auto img{ width: auto; height: 60px; }
.form-box .input-box .input.auto img + input{ width: calc(100% - 140px) !important; margin-left: 10px; }

/* 달력 input */
.form-box .input-box .input .inputDay{ position: relative; }
.form-box .input-box .input .inputDay::after{ content: "\e9a4"; font-family: "xeicon"; font-size: 2rem; font-weight: normal; font-style: normal; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); }

.form-box .submit{ margin-top: 60px; }
.form-box .submit button{ width: 100%; height: 80px; background: var(--mainColor); border: none; font-family: var(--baseFont); font-size: 2rem; font-weight: 600; color: #fff; }

/* checkbox 커스텀 */
.check-list input{ display: none; }
.check-list label{ display: inline-block; padding-top: calc((30px - 1.2em) / 2); padding-bottom: calc((30px - 1.3em) / 2); padding-left: 40px; position: relative; cursor: pointer; }
.check-list label::before{ content: ""; width: 30px; height: 30px; border: 1px solid #DDD; border-radius: 50%; position: absolute; top: 0; left: 0; box-sizing: border-box; }
.check-list label::after{ content: url("/img/sub/check_icon.svg"); position: absolute; top: 16px; left: 15px; transform: translate(-50%, -50%); }

.check-list input:checked + label::before{ border: 1px solid var(--mainColor); background: var(--mainColor); }
.check-list input:checked + label::after{ filter:opacity(0.5) drop-shadow(0 0 0 0); }


/* radio 커스텀 */
.radio-list input{ display: none; }
.radio-list label{ display: flex; justify-content: center; align-items: center; width: 180px; height: 60px; color: var(--mainColor) !important; border: 1px solid var(--mainColor); transition: all 0.5s; cursor: pointer; line-height: 1; }

.radio-list input:checked + label{ background: var(--mainColor); color: #fff !important; }


@media screen and (max-width: 1600px){
	.form-box .input-box{ padding: 30px 0; }
	.form-box .input-box .input input[type="text"], .form-box .input-box .input input[type="tel"], .form-box .input-box .input select{ height: 55px; }

	.form-box .input-box .line.start .tit{ padding-top: calc((55px -  1.3em) / 2); }

	.form-box .submit{ margin-top: 40px; }
	.form-box .submit button{ height: 70px; font-size: 1.8rem; }

	/* radio 커스텀 */
	.radio-list label{ width: 150px; height: 55px; }
}

@media screen and (max-width: 1300px){
	.form-box .input-box .tit{ width: 100px; }
	.form-box .input-box .input{ width: calc(100% - 100px); }
}

@media screen and (max-width: 1250px){
	.form-box .input-box{ padding: 20px 0; }
	.form-box .input-box .input input[type="text"], .form-box .input-box .input input[type="tel"], .form-box .input-box .input select{ height: 50px; }
	.form-box .input-box .input select{ background-position: center right 20px; }

	.form-box .input-box .line.start .tit{ padding-top: calc((50px -  1.3em) / 2); }

	.form-box .input-box .input.auto img{ height: 50px; }
	.form-box .input-box .input.auto img + input{ width: calc(100% - 130px) !important; }

	.form-box .agree{ margin-top: 10px; }

	.form-box .submit{ margin-top: 30px; }
	.form-box .submit button{ height: 60px; font-size: 1.7rem; }

	/* radio 커스텀 */
	.check-list label{ padding-top: calc((25px - 1.2em) / 2);  padding-bottom: calc((25px - 1.3em) / 2); padding-left: 35px; }
	.check-list label::before{ width: 25px; height: 25px; }
	.check-list label::after{ top: calc(27px / 2); left: calc(24px / 2); transform: translate(-50%, -50%) scale(0.8); }

	/* radio 커스텀 */
	.radio-list label{ width: 120px; height: 50px; }
}

@media screen and (max-width: 900px){
	.form-box .agree .privacy{ padding: 0px 20px; }
	.form-box .submit button{ height: 55px; } 
}

@media screen and (max-width: 600px){
	/* .form-box .input-box .line{ flex-direction: column; }
	.form-box .input-box .tit{ width: 100%; margin-bottom: 10px; }
	.form-box .input-box .input{ width: 100%; } */

	.form-box .input-box .line.start .tit{ padding-top: 0; }
}


/* 법률상담 - 신청자격 자가진단 (결과) */
#result .result-box{ padding: 120px 60px; background: url("/img/sub/counseling/result_bg.jpg") no-repeat bottom right / cover; text-align: center; }
#result .arti-title{ margin-bottom: 60px; }
#result .arti-title span{ font-weight: 500; color: #333; border-bottom: 1px solid #333; margin-bottom: 40px; }
#result .arti-title h4{ font-weight: 700; color: var(--mainColor); margin-bottom: 30px; }
#result .arti-title p{ font-size: 1.8rem; font-weight: 300; color: #333; line-height: 1.6666; }
#result .arti-title p:not(:first-of-type){ margin-top: 10px; }

#result .dl{ max-width: 800px; margin: 0 auto; background: #fff; padding: 60px 100px; }
#result .dl dl{ display: flex; align-items: center; text-align: left; }
#result .dl dl *{ font-size: 1.8rem;}
#result .dl dt{ width: 130px; font-weight: 500; color: #222; }
#result .dl dd{ width: calc(100% - 130px); font-weight: 300; color: #333; }
#result .dl dd strong{ display: inline-block; font-family: var(--Lora); font-size: 2.8rem; font-weight: 500; color: var(--mainColor); margin-left: 20px; margin-right: 10px; vertical-align: middle; margin-top: -0.1em; }

#result .btn{ width: 320px; height: 80px; font-size: 2rem; font-weight: 500; margin: 0 auto; }

@media screen and (max-width: 1600px){
	#result .result-box{ padding: 100px 40px; }

	#result .dl dd strong{ font-size: 2.6rem; }

	#result .btn{ width: 280px; height: 70px; font-size: 1.8rem; }
}

@media screen and (max-width: 1250px){
	#result .result-box{ padding: 80px 30px; }
	#result .arti-title{ margin-bottom: 40px; }
	#result .arti-title span{ margin-bottom: 20px; } 
	#result .arti-title h4{ margin-bottom: 10px; }
	#result .arti-title p{ font-size: 1.7rem;}

	#result .dl{ padding: 50px 60px; margin-top: 35px; }
	#result .dl dl *{ font-size: 1.7rem; }
	#result .dl dd strong{ font-size: 2.4rem; margin-left: 10px; margin-right: 5px; }

	#result .btn{ width: 230px; height: 60px; font-size: 1.7rem; }
}

@media screen and (max-width: 900px){
	#result .arti-title{ margin-bottom: 30px; }
	#result .arti-title p{ font-size: 1.6rem; }

	#result .dl{ padding: 40px 30px; margin-top: 25px; }
	#result .dl dl{ flex-direction: column; text-align: center; }
	#result .dl dl *{ font-size: 1.6rem; }
	#result .dl dt{ width: 100%; margin-bottom: 15px; } 
	#result .dl dd{ width: 100%; }
	#result .dl dd strong{ font-size: 2.2rem; }

	#result .btn{ width: 190px; height: 50px; }
}

@media screen and (max-width: 600px){
	#result .arti-title p br{ display: none; }
}


/* 언론/칼럼 */
#media .arti-title{ margin-bottom: 30px; }
#media .img_borad_list{ gap: 60px 20px; margin-top: 100px; }
#media .img_borad_list .item{ width: calc((100% - 60px) / 4); }
#media .img_borad_list .item figure{ padding-bottom: 83.5%; }
#media .img_borad_list .item .category{ font-size: 1.8rem; font-weight: 300; color: #fff; position: absolute; top: 30px; left: 30px; z-index: 5; border-bottom: 1px solid #fff; }

@media screen and (max-width: 1600px){
	#media .img_borad_list{ margin-top: 70px; }
}

@media screen and (max-width: 1250px){
	#media .arti-title{ margin-bottom: 15px; }
	#media .img_borad_list{ margin-top: 40px; }
	#media .img_borad_list .item{ width: calc((100% - 40px) / 3); }
	#media .img_borad_list .item .category{ font-size: 1.7rem; top: 20px; left: 20px; }
}

@media screen and (max-width: 900px){
	#media .img_borad_list{ gap: 40px 20px; margin-top: 20px; }
	#media .img_borad_list .item{ width: calc((100% - 20px) / 2); }
	#media .img_borad_list .item .category{ font-size: 1.6rem; top: 15px; left: 15px; }
}


/* 고객센터 - 준비서류 */
#document .board_ctn p.right{ font-size: 1.6rem; font-weight: 300; color: #666; text-align: right; margin-bottom: 20px; }
#document .board_box{ margin-top: 0; }
#document .board_box table tr::after{ display: none; }
#document .board_box table th{ font-weight: 400; }
#document .board_box table thead th:nth-of-type(1){ width: 320px; }
#document .board_box table thead th:nth-of-type(2){ width: 100%; }
#document .board_box table tbody th{ background: none; color: #333; }
#document .board_box table td{ font-size: 1.7rem; font-weight: 300; text-align: left; }
#document .board_box table td *{ font-size: 1.7rem; }
#document .board_box table td p:not(:last-of-type){ margin-bottom: 10px; }

@media screen and (max-width: 1250px){
	#document .board_ctn p.right{ margin-bottom: 10px; }
	#document .board_box table th{ padding: 20px; }
	#document .board_box table td{ padding: 20px; }

	#document .board_box table tbody th, #document .board_box table tbody td{ font-size: 1.6rem; }
	#document .board_box table tbody td *{ font-size: 1.6rem; }
}

@media screen and (max-width: 950px){
	#document .board_box thead{ display: none; }
	#document .board_box table tbody tr{ display: flex; flex-direction: column; }
	#document .board_box table tbody tr:not(:first-of-type){ border-top: 1px solid #000; }
	#document .board_box table tbody tr:not(:last-of-type){ margin-bottom: 30px; }
	#document .board_box table tbody th, #document .board_box table tbody td{ width: 100%; padding-left: calc(200px + 20px); text-align: left; position: relative; }
	#document .board_box table tbody th::before, #document .board_box table tbody td::before{ width: 200px; height: 100%; background: #f9f9f9; font-weight: 400; color: #111; position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; }
	#document .board_box table tbody th::before{ content: "발급처"; }
	#document .board_box table tbody td::before{ content: "발급서류"; }
}

@media screen and (max-width: 600px){
	#document .tab-menu ul li{ font-size: 2.5rem; }
	#document .board_box table tbody th, #document .board_box table tbody td{ padding-left: calc(120px + 20px); }
	#document .board_box table tbody th::before, #document .board_box table tbody td::before{ width: 120px; }
}


/* 팝업 (공통) */
#popup{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 9999; background: rgba(0, 0, 0, 0.8); display: none; }
#popup .blank{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
#popup .close{ position: absolute; top: 30px; right: 40px; }
#popup .close i{ font-size: 2.5rem; color: #111; }
#popup .inner{ max-width: 1000px; width: 100%; background: #fff; padding: 80px 100px; padding-right: 80px; position: absolute; top: 50%; left: 50%; z-index: 50; transform: translate(-50%, -50%); }
#popup .inner .title{ font-size: 2rem; font-weight: 600; color: #111; margin-bottom: 20px; }

@media screen and (max-width: 1600px){
	#popup .inner .title{ font-size: 1.9rem; }
}

@media screen and (max-width: 1250px){
	#popup .inner{ max-width: 90%; padding: 60px; }
	#popup .inner .title{ font-size: 1.8rem; margin-bottom: 10px; }
}

@media screen and (max-width: 900px){
	#popup .close{ top: 23px; right: 30px; } 
	#popup .inner { padding: 30px; }
}


/* 개인정보처리방침 (팝업) */
#popup.privacy .scroll-y{ height: 48vh; }
#popup.privacy br{ display: none; }
#popup.privacy .privacy{ padding-right: 10px; }
#popup.privacy .privacy .dlBox{ gap: 20px 0; }
#popup.privacy .privacy > .pBox{ margin: 0 0 20px; }

@media screen and (max-width: 900px){
	#popup.privacy .scroll-y{ height: 65vh; }
}