@charset "utf-8";

/*
* content-new.css
* 컨텐츠 작업페이지 신규
* author - khh
*/

:root{
	--color-point:#caaf7c;
	--color-point-txt:#af8a43;
	--color-orange:#ff7a0e;
	
	--font15:15rem;
	--font16:16rem;
	--font17:17rem;
	--font18:18rem;
	--font20:20rem;
	--font22:22rem;
	--font23:23rem;
	--font25:25rem;
	--font30:30rem;
	--font35:35rem;
	--font40:40rem;
	--font45:45rem;
	--font50:50rem;
	--font60:60rem;
	--font70:70rem;
	--font100:100rem;
	
	--page-top:110rem;
	--hig100:100vh;
	--r:10rem;
	
	--font-en:'Poppins', sans-serif;
	
	--trans-ani:0.3s ease 0s;
	
	@media (max-width:1024px){
		--font-base:clamp(14rem, 1.563vw, 16rem);
		--font15:clamp(14rem, 1.465vw, 15rem);
		--font16:clamp(14rem, 1.563vw, 15rem);
		--font17:clamp(15rem, 1.66vw, 17rem);
		--font18:clamp(16rem, 1.758vw, 18rem);
		--font20:clamp(18rem, 1.953vw, 20rem);
		--font22:clamp(18rem, 2.148vw, 22rem);
		--font23:clamp(18rem, 2.246vw, 23rem);
		--font25:clamp(20rem, 2.441vw, 25rem);
		--font30:clamp(22rem, 2.93vw, 30rem);
		--font35:clamp(22rem, 3.418vw, 35rem);
		--font40:clamp(25rem, 3.906vw, 40rem);
		--font45:clamp(28rem, 4.395vw, 45rem);
		--font50:clamp(32rem, 4.88vw, 50rem);
		--font60:clamp(35rem, 5.859vw, 60rem);
		--font70:clamp(45rem, 6.836vw, 70rem);
		--font100:clamp(60rem, 9.77vw, 100rem);
		
		--page-top:80rem;
		--hig100:calc(var(--vh, 1vh) * 100);
	}
	
	@media (max-width:480px){
		--page-top:60rem;
	}
}

/* 폰트설정 */
html,body{font-size:6.25%;}
body{font-size:var(--font-base, 16rem);}
@media (min-width:1921px){
	html{font-size:0.052vw /* 1px */;}
}
@media (max-width:1024px){
    html{font-size:0.098vw /* 1px */;}
}
@media (max-width:768px){
    html{font-size:0.130vw /* 1px */;}
}
@media (max-width:480px){
    html{font-size:0.271vw /* 1.3px */;}	
}

/* 공통 */
[data-subarea]{word-break:keep-all; letter-spacing:-0.5rem;}
[data-subarea] .inr-narrow{width:calc(var(--inr-narrow) * 1rem);}
em,i{font-style:normal;}
.button.lg{min-width:230rem; height:60rem; background-color:var(--color-point); border-color:var(--color-point); font-weight:600;}
.sub .content{padding-bottom:calc(var(--page-top) + 30rem);}
@media (max-width:480px){
	.button.lg{min-width:180rem; height:55rem;}
}

/* table */
table.table{border-top:2rem solid #111;}
	/* table scroll mobile */
.sub .scrollTable{width:100%;}
.sub .mob_info{display:none; position:relative; width:100%; box-sizing:border-box; margin-top:10rem; padding:7rem 7rem 7rem 35rem; background:var(--color-white); border:1rem dashed #cfcfcf; font-size:14rem;}
.sub .mob_info:before{content:''; display:block; position:absolute; top:7rem; left:7rem; width:20rem; height:22rem; background:url(../images/board/img_drag.png) no-repeat 50% 0; background-size:100%;}
@media (max-width:768px){	
	.sub .scrollTable{overflow:auto;}
	.sub .scrollTable .table{width:768rem;}
	.sub .mob_info{display:block;}
}

/* hide show - motion */
/*
	--aniEase:(transition-timing-function)
	--aniSize:(모션기초세팅사이즈)
	--aniDelay:(transition-delay)
	--aniTime:(transition-duration)
*/
[data-motion] img{width:100%;}
[data-motion="hide_show"]{opacity:0; transition:opacity 0.7s var(--aniEase, ease) 0s;}
[data-motion="hide_show"].motion__in{opacity:1;}
[data-motion="hide_showDown"]{opacity:0; transform:translateY(var(--aniSize, -30rem)); transition:var(--aniTime, 1s) var(--aniEase, ease) 0s; transition-property:opacity, transform;}
[data-motion="hide_showDown"].motion__in{opacity:1; transform:translateY(0); transition-delay:var(--aniDelay, 0s);}
[data-motion="hide_showUp"]{opacity:0; transform:translateY(var(--aniSize, 30rem)); transition:var(--aniTime, 1s) var(--aniEase, ease) 0s; transition-property:opacity, transform;}
[data-motion="hide_showUp"].motion__in{opacity:1; transform:translateY(0rem); transition-delay:var(--aniDelay, 0s);}
[data-motion="hide_showLeft"]{opacity:0; transform:translateX(var(--aniSize, -30rem)); transition:var(--aniTime, 0.9s) var(--aniEase, ease) 0s; transition-property:opacity, transform;}
[data-motion="hide_showLeft"].motion__in{opacity:1; transform:translateX(0rem); transition-delay:var(--aniDelay, 0s);}
[data-motion="hide_showRight"]{opacity:0; transform:translateX(var(--aniSize, 30rem)); transition:var(--aniTime, 0.9s) var(--aniEase, ease) 0s; transition-property:opacity, transform;}
[data-motion="hide_showRight"].motion__in{opacity:1; transform:translateX(0); transition-delay:var(--aniDelay, 0s);}
[data-motion="slide_showX"]{clip-path:polygon(50% 0, 50% 0, 50% 100%, 50% 100%); transition:clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;}
[data-motion="slide_showX"].motion__in{clip-path:polygon(0% 0, 100% 0, 100% 100%, 0% 100%); transition-delay:var(--aniDelay, 0.2s);}
[data-motion="slide_show_down"]{clip-path:polygon(100% 0, 100% 0, 0 0, 0 0); transition:clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;}
[data-motion="slide_show_down"].motion__in{clip-path:polygon(100% 0, 100% 100%, 0 100%, 0 0); transition-delay:var(--aniDelay, 0.2s);}
[data-motion="slide_show_up"]{clip-path:polygon(100% 100%, 100% 100%, 0 100%, 0 100%); transition:clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;}
[data-motion="slide_show_up"].motion__in{clip-path:polygon(100% 0, 100% 100%, 0 100%, 0 0); transition-delay:var(--aniDelay, 0.2s);}
[data-motion="slide_show_right"]{clip-path:polygon(0 0, 0 0, 0 100%, 0 100%); transition:clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;}
[data-motion="slide_show_right"].motion__in{clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); transition-delay:var(--aniDelay, 0.2s);}
[data-motion="slide_show_left"]{clip-path:polygon(100% 0, 100% 0, 100% 100%, 100% 100%); transition:clip-path var(--aniTime, 1.5s) var(--aniEase, ease) 0s;}
[data-motion="slide_show_left"].motion__in{clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); transition-delay:var(--aniDelay, 0.2s);}
[data-motion="mark"] mark{background:linear-gradient(90deg, var(--color-point, #333), var(--color-point, #333)); background-repeat:no-repeat; background-position:0 100%; background-size:0 100%; transition:var(--aniTime, 0.9s) var(--aniEase, ease) 0s;}
[data-motion="mark"].motion__in mark{background-size:100% 100%;}
[data-motion="blur"]{filter:blur(var(--aniBlur, 10rem)); transition:filter var(--aniTime, 1.5s) var(--aniEase, ease) 0s;}
[data-motion="blur"].motion__in{filter:blur(0);}
	/* div[data-motion="hide_overUp"] span > i */
[data-motion="hide_overUp"] span{overflow:hidden; display:inline-block;}
[data-motion="hide_overUp"] span i{display:inline-block; transform:translateY(100%); transition:transform var(--aniTime, 0.9s) var(--aniEase, ease) 0s;}
[data-motion="hide_overUp"].motion__in span i{transform:translateY(0%); transition-delay:var(--aniDelay, 0s);}
	/* div[data-motion="hide_pectiveUp"] span or etc */
[data-motion="hide_pectiveUp"]{perspective:var(--aniPect, 1500rem);}
[data-motion="hide_pectiveUp"] > *{opacity:0; display:block; transform:translateY(var(--aniSize, 300rem)) rotateX(var(--aniDeg, 45deg)); transition:1s var(--aniEase, ease) 0s; transition-property:opacity, transform;}
[data-motion="hide_pectiveUp"].motion__in > *{opacity:1; transform:translateY(0) rotateX(0); transition-delay:var(--aniDelay, 0s); transition-duration:var(--aniTime, 0.7s);}
/* flow text */
/*
	--aniTime:(animation-duration)	
*/
.flow-text{overflow:hidden; display:flex; white-space:nowrap; transition:0.3s;}
.flow-wrap{padding-right:1.4881vw; line-height:1.1cap; animation:textLoop var(--aniTime, 20s) linear infinite;}
.flow-text.hover:hover .flow-wrap{animation-play-state:paused; cursor:pointer;}
@keyframes textLoop{
    0% {transform:translate3d(0, 0, 0);}
    100%{transform:translate3d(-100%, 0, 0);}
}

/* title */
.title-new-box{
	&{display:flex; flex-direction:column; align-items:center; gap:15rem; margin-bottom:60rem; padding-top:var(--page-top);}
	.title-h1{font-size:var(--font60); font-weight:600; line-height:1.2;}
	.title-h1.en{font-family:var(--font-en);}
	.title-desc{font-size:var(--font20); color:#444; letter-spacing:-0.5rem; text-align:center;}
}
.title-bracket{
	&{display:inline-flex; justify-content:center; align-items:center; position:relative; padding:0 40rem; font-size:var(--font35); color:#fff;}
	&:before,
	&:after{content:''; display:block; position:absolute; width:15rem; height:53rem; background:url(/images/content_new/bracket.svg) no-repeat 50% 50%; background-size:auto 100%; transition:1s ease;}
	&:before{left:50%;}
	&:after{right:50%; transform:rotate(180deg);}
	span{opacity:0; clip-path:inset(0 50% 0 50%); white-space:nowrap; transition:0.5s ease; transition-property:opacity, clip-path;}
	span br{display:none;}
	
	&.color{color:var(--color-point-txt);}
	&.color:before,
	&.color:after{background-image:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg data-name='Layer 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 43.75'%3E%3Cpath fill='%23caaf7c' d='M11.75,43.75C6.3,40.95,0,32.75,0,21.9S6.3,2.85,11.75,0l.25.4c-3.35,2.45-6.4,9.85-6.4,21.5s3.05,19.05,6.4,21.45l-.25.4Z'/%3E%3C/svg%3E");}
	
	&.motion__in{
		span{opacity:1; clip-path:inset(0 0 0 0); width:100%; transition-duration:0.5s, 1s;}
		&:before{left:0;}
		&:after{right:0;}
	}
}
.title-mid{margin-bottom:20rem; font-size:var(--font30); font-weight:700;}
.title-big{margin-bottom:20rem; font-size:var(--font50); font-weight:700; text-align:center; line-height:1.3;}
.title-big em{color:var(--color-point);}

/* flex */
[data-flex]{display:flex; align-items:flex-start;}

/* list */
.dot-list{
	&{display:flex; flex-direction:column; gap:10rem;}
	li{position:relative; padding-left:15rem; font-size:var(--font18);}
	li:before{content:''; display:block; position:absolute; left:0; top:12rem; width:3rem; height:3rem; background-color:rgba(34,34,34,0.6);}
}

/* line obj */
.sec-obj__line{
	&{display:flex; flex-direction:column; gap:15rem; padding:var(--page-top) 0;}
	i{display:block; width:100%; height:10rem; background-color:var(--color-point);}
	i:nth-of-type(2){height:5rem;}
	i:nth-of-type(3){height:3rem;}
	i:nth-of-type(4){height:1rem;}
	
	&.gray i{background-color:#d4cfc7;}
}

/* 회사소개 */
[data-subarea="about"] .sign{font-size:var(--font25); text-align:center;}
@media (max-width:1450px){
	[data-subarea="about"]{overflow:hidden;}
}
.about-box{
	&{--sizeHig:525rem; position:relative; height:var(--sizeHig); margin-bottom:var(--page-top);}
	p{font-size:var(--font20); line-height:1.6;}
	.about-img{position:absolute; top:0; height:100%;}
	.about-img img{object-fit:cover; width:100%; height:100%;}
	.box-wrap{display:grid; grid-template-columns:1fr 1fr; align-items:center; position:relative; z-index:10; height:100%;}
	.box02{padding-left:70rem;}
	
	&.reverse{
		.box01{order:2;}
		.box02{order:1; padding-right:70rem; padding-left:0; text-align:right;}
	}
	
	&[data-motion]{
		&{opacity:0; filter:blur(50rem); transform:translateY(50rem); transition:0.8s ease;}
		.about-img{clip-path:inset(0 0 0 0); transition:1s ease;}
		.box01{text-align:center;}
		.box01,
		.box02{opacity:0; transition:1s ease;}
		.box02{transform:translateX(30rem);}
		
		&.reverse .box02{transform:translateX(-30rem);}
	}
	.title-bracket{margin:0 auto;}
	
	&.motion__in{
		&{opacity:1; filter:blur(0); transform:translateY(0);}
		.about-img{clip-path:inset(0 50% 0 0); transition-delay:0.8s;}
		.box01,
		.box02{opacity:1;}
		.box01{transition-delay:1.2s;}
		.box02{transform:translateX(0); transition-delay:1.5s;}
		
		.title-bracket.motion__in:before,
		.title-bracket.motion__in:after{transition-delay:1.5s;}
		.title-bracket.motion__in span{transition-delay:1.5s;}
		
		&.reverse .about-img{clip-path:inset(0 0 0 50%);}
		&.reverse .box02{transform:translateX(0);}
	}
	
	@media (max-width:1300px){
		&{--sizeHig:clamp(350rem, 34.62vw, 450rem);}
		p br{display:none;}
		.box02{padding-left:30rem;}
		&.reverse .box02{padding-right:30rem; padding-left:0;}
	}
	
	@media (max-width:480px){
		&{--sizeHig:250rem; height:auto;}
		.box-wrap{grid-template-columns:1fr;}
		.about-img,
		.box01{height:var(--sizeHig);}
		.box01{display:flex; flex-direction:column; align-items:center; justify-content:center;}
		.box02,
		&.reverse .box02{padding:30rem 0 0 0; text-align:center;}
		&.reverse .box01{order:1;}
		&.reverse .box02{order:2;}
		
		&.motion__in{
			.about-img{clip-path:inset(0 0 0 0);}
			&.reverse .about-img{clip-path:inset(0 0 0 0);}		
			.box01{transition-delay:0.8s;}
			.box02{transform:translateX(0); transition-delay:0.8s;}							
		}
		.title-bracket.motion__in:before,
		.title-bracket.motion__in:after{transition-delay:1s;}
		.title-bracket.motion__in span{transition-delay:1s;}
	}
}

/* 변호사소개 */
[data-subarea="intro"]{
	.title-bracket{font-weight:normal;}
	.title-bracket strong{font-weight:600;}
	
	.intro-wrap{display:flex; align-items:flex-start; gap:30rem clamp(50rem, 5.21vw, 100rem); padding-top:40rem;}
	.intro-conts{
		&{flex:auto; display:grid; grid-template-columns:1fr 1fr; gap:60rem 30rem;}
		.top,
		.full{grid-column:1/3;}
		.top{display:flex; align-items:center; gap:10rem 30rem; padding-top:60rem;}
		.top em{font-size:var(--font23); font-weight:600;}
	}
	.intro-img{position:sticky; top:calc(var(--header-height) + 50rem);}

	@media (max-width:1400px){
		.intro-img{flex:0 1 40%;}
	}	
	@media (max-width:1024px){
		.intro-img{flex:0 1 50%;}
		.intro-conts{grid-template-columns:1fr;}
		.intro-conts .top,
		.intro-conts .full{grid-column:1/2;}
		.intro-conts .top{flex-wrap:wrap;}
		.intro-conts .top em{order:1; flex:0 1 100%;}
		.intro-conts .top .title-bracket{order:2;}
	}
	@media (max-width:768px){
		.intro-wrap{padding-top:0;}
		.intro-conts .top{padding-top:30rem;}
	}
	@media (max-width:480px){
		.intro-wrap{flex-direction:column;}
		.intro-img{position:static;}
		.intro-conts{gap:40rem;}
		.intro-conts .top{gap:20rem; padding-top:0;}
	}
}

/* 오시는 길 */
[data-subarea="location"]{
	.map-box{position:relative;}
	.map-script{
		&{overflow:hidden; height:630rem; border:3rem solid var(--color-point);}
		.root_daum_roughmap{width:100%; height:100%;}
		.wrap_map{height:100%;}
	}
	.map-address{
		&{position:absolute; bottom:30rem; left:30rem; z-index:10; min-width:630rem; padding:40rem; background-color:var(--color-point); box-shadow:0 20rem 30rem rgba(0,0,0,0.15); color:#fff;}
		h2{margin-bottom:10rem; font-size:var(--font30);}
		p{font-size:var(--font20);}
	}
	.map-info{
		&{display:flex; align-items:flex-start; gap:40rem 60rem; margin-top:50rem;}
		.title-mid{margin-bottom:10rem;}
		.box:nth-of-type(1){flex:0 1 60%;}
		.box ul{display:flex; gap:10rem 40rem; font-size:var(--font18);}
		.box li{display:flex; align-items:center; gap:10rem;}
		.box em{font-weight:normal;}
		.box span{font-weight:700;}
	}
	
	/* motion */
	.map-box[data-motion]{opacity:0; filter:blur(50rem); transform:translateY(50rem); transition:0.8s ease;}
	.map-box.motion__in{opacity:1; filter:blur(0); transform:translateY(0);}

	@media (max-width:1300px){
		.map-info{flex-direction:column; gap:30rem;}
	}
	@media (max-width:768px){
		.map-script{height:500rem;}
	}
	@media (max-width:480px){
		.map-script{height:300rem;}
		.map-address{position:static; min-width:inherit; padding:40rem 20rem;}
		.map-info .box ul{flex-wrap:wrap;}
	}
}

/* 업무분야 */
[data-subarea="biz"]{
	&{padding-bottom:0 !important;}
	.biz-wrap{
		&{padding-bottom:var(--page-top);}
		p{margin-top:90rem; font-size:var(--font23); text-align:center;}
		.biz02{background:url(../images/content_new/biz_img0202.jpg) no-repeat 100% 100%;}
		.biz02 p{margin-top:50rem;}
		.mid-line{padding-top:40rem;}
		.mid-line p{margin-top:50rem;}
	}
	.biz-box{
		&{--sizeHig:500rem; display:flex; justify-content:center; align-items:center; position:relative; height:var(--sizeHig); text-align:center;}
		.title-bracket{font-size:var(--font50);}
		.title-bracket:before,
		.title-bracket:after{width:25rem; height:88rem;}		
		.biz-img{width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1;}
		.biz-img img{width:100%; height:100%; object-fit:cover;}
	}
	.section-horizontal{
		.scene{background:url(../images/content_new/biz_bg01.jpg) no-repeat 50% 50%; background-size:cover;}
		.box{--sizeHig:610rem; display:flex; flex-direction:column; align-items:stretch; position:relative; width:500rem; height:var(--sizeHig); border-radius:calc(var(--r) * 2);}
		em{opacity:0.5; margin-bottom:10rem; font-family:var(--font-eng); font-size:var(--font20); font-weight:700; letter-spacing:0.5px;}
		h3{font-size:var(--font40); font-weight:700;}
		h3:after{content:''; display:block; margin-top:40rem; width:100%; height:1px; background-color:#b99e6b;}
		i{display:flex; justify-content:center; align-items:center; width:100rem; height:100rem; margin:40rem auto; background-color:#b99e6b; border-radius:100%;}
		i img{width:53rem;}
		p{font-size:var(--font20); font-weight:500;}
		
		[data-card="group"]{transform-style:preserve-3d; perspective:1000px;}
		.box [data-card]{width:100%; height:100%; padding:100rem 50rem 30rem; background-color:var(--color-point); border-radius:calc(var(--r) * 2); border:5rem solid var(--color-point); color:#fff; text-align:center; backface-visibility:hidden; transition:0.8s ease;}
		.box [data-card="front"]{transform:rotateY(0);}
		.box [data-card="back"]{position:absolute; background-color:#fff; color:#222; transform:rotateY(180deg);}
		
		.horizontal-scroll-section__content-section:nth-of-type(1){padding-left:50%;}
		.horizontal-scroll-section__content-wrapper .horizontal-scroll-section__content-section:last-child{padding-right:30%;}
		
		&.big .box{--sizeHig:680rem;}
	}
	
	/* motion */
	.biz-box[data-motion]{
		&{opacity:0; filter:blur(50rem); transform:translateY(50rem); transition:0.8s ease;}
		&.motion__in{opacity:1; filter:blur(0); transform:translateY(0);}
		&.motion__in .title-bracket:before,
		&.motion__in .title-bracket:after{transition-delay:0.8s;}
		&.motion__in .title-bracket span{transition-delay:0.8s;}
	}
	.section-horizontal [data-move]{
		.box{transition:0.3s ease;}
		h3:after{transition:0.8s ease;}
		
		@media (min-width:1025px){
			&.show__in{
				.box{box-shadow:0 40rem 50rem rgba(0,0,0,0.15); transition-duration:0.8s; transition-delay:0.7s;}
				h3:after{background-color:rgba(34,34,34,0.15);}
				.box [data-card="front"]{transform:rotateY(-180deg);}
				.box [data-card="back"]{transform:rotateY(0);}
			}
		}
	}

	@media (max-width:1200px){
		.section-horizontal .box{width:450rem;}
		.section-horizontal .horizontal-scroll-section__content-section:nth-of-type(1){padding-left:30%;}
	}
	@media (max-width:1024px){
		.biz-box{--sizeHig:400rem;}
		.biz-box .title-bracket{padding:0 30rem; font-size:var(--font40);}

		.biz-wrap p{margin-top:60rem;}
		.biz-wrap p br{display:none;}
		.biz-wrap .biz02{background-size:80%; background-position:150% 100%;}
		.biz-wrap .biz02 p{margin-top:30rem;}
		
		.section-horizontal .box{--sizeHig:100%; width:auto;}
		.section-horizontal.big .box{--sizeHig:100%;}
		.section-horizontal .box [data-card]{padding:50rem 30rem 50rem;}
		.section-horizontal .horizontal-scroll-section__content-section:nth-of-type(1){padding-left:0;}
		.section-horizontal .horizontal-scroll-section__content-wrapper .horizontal-scroll-section__content-section:last-child{padding-right:0;}
		.section-horizontal [data-move].motion__in{
			.box{box-shadow:0 40rem 50rem rgba(0,0,0,0.15); transition-duration:0.8s; transition-delay:0.7s;}
			h3:after{background-color:rgba(34,34,34,0.15);}
			.box [data-card="front"]{transform:rotateY(-180deg);}
			.box [data-card="back"]{transform:rotateY(0);}
		}
	}
	@media (max-width:768px){		
		.section-horizontal i{width:80rem; height:80rem; margin:30rem auto 20rem;}
		.section-horizontal i img{width:43rem !important;}
	}
	@media (max-width:480px){
		.biz-box{--sizeHig:300rem;}		
		.biz-box .title-bracket span{white-space:normal;}
		.biz-box .title-bracket span br{display:block;}
		.biz-box .title-bracket:before,
		.biz-box .title-bracket:after{width:15rem; height:53rem;}
		.biz-wrap .mid-line p{margin-top:30rem;}
		.section-horizontal h3:after{margin-top:30rem;}
		.section-horizontal i{width:70rem; height:70rem;}
		.section-horizontal i img{width:36rem !important;}
		.section-horizontal .box [data-card]{padding:50rem 20rem 40rem;}
	}
}

/* vertical-scroll */
.section-horizontal{overflow:hidden;}
.horizontal-scroll-section{
	&{opacity:0; position:relative; min-height:var(--hig100); transition:opacity 0.2s;}
	.scene{
		&{position:absolute; top:0; left:0; right:0; height:var(--hig100); min-height:900rem;}
		&.scene--active{position:fixed;}
		&.scene--ended{position:absolute; bottom:0; top:auto;}
	}
	
	&.horizontal-scroll-section--init{opacity:1;}
	.horizontal-scroll-section__content{display:flex; align-items:center;}
	.horizontal-scroll-section__content-section{padding:40rem 30rem 0;}
	.horizontal-scroll-section__content-wrapper{display:flex; align-items:center; position:relative; height:100%;}

	@media (max-width:1024px){
		&{height:auto !important; min-height:inherit;}
		.scene{position:static; height:auto; min-height:inherit; padding:var(--page-top) 20rem;}
		.horizontal-scroll-section__content-section{padding:0;}
		.horizontal-scroll-section__content-wrapper{display:grid; grid-template-columns:1fr 1fr; gap:40rem 30rem; align-items:stretch; transform:none !important;}
	}
	@media (max-width:480px){
		.horizontal-scroll-section__content-wrapper{grid-template-columns:1fr;}
	}
}

/* tab */
.tab-area{
	&{padding-top:55rem;}

	@media (max-width:768px){
		&{padding-top:35rem;}
	}
}	 	
.tab-area .tab{
	&{display:flex; justify-content:center; align-items:center; gap:0;}
	li{display:flex; justify-content:center; align-items:center; min-width:200rem; height:60rem;}
	li:first-child{padding-left:0;}
	li a{display:flex; justify-content:center; align-items:center; position:relative; width:100%; height:100%; padding:0 15rem; background-color:#ebebeb; color:#555; font-size:var(--font18); font-weight:600; text-align:center; transition:0.3s;}
	li.active a,
	li a.on{background-color:#191919; color:#fff;}
	li:first-child a{border-radius:var(--r) 0 0 var(--r);}
	li:last-child a{border-radius:0 var(--r) var(--r) 0;}

	@media (max-width:1024px){
		li{min-width:150rem;}
	}
	@media (max-width:480px){
		li{min-width:100rem; height:50rem;}
	}
}
.tab-param-conts{
	&{padding-top:80rem;}
	@media (max-width:480px){
		&{padding-top:50rem;}
	}
}

/* 개인회생 */
[data-subarea="rehab"]{
	&{padding-bottom:0 !important;}
	p{font-size:var(--font20);}
	.scroll-down{opacity:0.6; display:flex; justify-content:center; align-items:center; gap:10rem; position:absolute; bottom:50rem; left:50%; font-family:var(--font-en); font-weight:600; letter-spacing:1px; transform:translateX(-50%); animation:aniDown 5s linear infinite;}
	.scroll-down:after{content:''; display:block; width:16rem; height:10rem; background:url(../images/content_new/scroll_down.svg) no-repeat 50% 50%; background-size:auto 100%;}
	.title-big{font-size:var(--font60);}
	.title-big em{color:var(--color-orange);}
	
	.rehab-sec01{
		&{display:flex; justify-content:center; align-items:center; position:relative; height:var(--hig100); background:url(../images/content_new/rehab_img0101.jpg) no-repeat 50% 50%; background-size:cover; color:#fff;}
		.inr-narrow{display:flex; flex-direction:column; align-items:center; text-align:center;}
		em{display:block; margin-bottom:40rem; font-size:var(--font25); font-weight:700; letter-spacing:20rem; white-space:nowrap; color:var(--color-point); text-align:center;}
		h1{margin-bottom:50rem; font-size:var(--font100); line-height:1;}
		p{font-size:var(--font60); font-weight:300; line-height:1.2;}
		p strong{color:var(--color-point); font-weight:600;}
		p strong:nth-of-type(2){color:var(--color-orange);}
		.rehab-tel{position:relative; width:400rem; margin:50rem auto 0;}
		.rehab-tel a{display:flex; justify-content:center; align-items:center; height:80rem; background-color:rgba(34,34,34,0.15); border:4rem solid var(--color-orange); border-radius:50em; backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); font-size:var(--font40); font-weight:700; color:var(--color-orange); box-shadow:0 20rem 30rem rgba(0,0,0,0.3);}
		.rehab-tel i{display:flex; justify-content:center; align-items:center; position:absolute; top:-30rem; right:-180rem; z-index:5; width:230rem; height:70rem; background:url(../images/content_new/speech_img.svg) no-repeat 50% 50%; background-size:auto 100%; color:#fff; font-size:var(--font18); font-weight:500; animation:swing 10s linear 1s infinite;}
		
		/* motion */
		em[data-motion]{opacity:0; letter-spacing:80rem; transition:2s cubic-bezier(0.16, 0.37, 0.15, 1);}
		em[data-motion].motion__in{opacity:1; letter-spacing:20rem;}
	}
	
	.rehab-sec02{
		&{padding-bottom:calc(var(--page-top) / 2);}
		.sec-obj__line{padding-bottom:calc(var(--page-top) - 30rem);}
		p{font-size:var(--font23); text-align:center;}
	}
	
	.rehab-sec03{
		.tab{position:sticky; top:calc(var(--header-height) + 10rem); z-index:10;}
		.rehab-box{
			&{padding-bottom:var(--page-top);}
			.img{height:340rem;}
			.img img{object-fit:cover; width:100%; height:100%;}
			[data-flex]{gap:50rem; margin-top:60rem;}
			.title{flex:auto;}
			.title em{opacity:0.3; font-family:var(--font-en); font-weight:700; letter-spacing:0.5px;}
			.title h3{margin-top:10rem; font-size:var(--font40); line-height:1.2;}
			.conts{flex:0 0 65%;}
			.conts p{margin-top:40rem;}
			.conts p strong{font-size:var(--font23);}
			.conts p:first-child{margin-top:0;}
			.conts .button{margin:60rem 0 0 0 !important;}
		}
		.rehab-process{
			&{padding-bottom:var(--page-top);}
			.rehab-process-box{display:flex; align-items:flex-start; gap:80rem; padding-top:70rem;}
			.rehab-process-box .img{flex:0 0 480rem;}
			.rehab-process-box .conts{flex:auto; padding-top:50rem;}
			.rehab-process-box .conts em{opacity:0.3; font-family:var(--font-en); font-weight:700; letter-spacing:0.5px;}
			.rehab-process-box .conts h3{margin-top:10rem; font-size:var(--font40); line-height:1.2;}
			.rehab-process-box .conts p{margin-top:30rem;}
			
			.process{--sizeWid:160rem;}
			.process .list{--sizeGap:clamp(30rem, 3.54vw, 68rem); display:flex; justify-content:center; align-items:center; gap:var(--sizeGap);}
			.process .list li{position:relative;}
			.process .list li:before{content:''; opacity:0.4; display:block; position:absolute; left:calc(var(--sizeGap) * -1); top:50%; width:var(--sizeGap); height:4rem; background-color:#d4cfc7; transform:translateY(-50%);}
			.process .list li:first-child:before{display:none;}
			.process div{display:flex; flex-direction:column; justify-content:center; align-items:center; gap:7rem; position:relative; width:var(--sizeWid); border-radius:100%; background-color:#fff; border:4rem solid #d4cfc7; aspect-ratio:1/1; transition:0.5s ease;}
			.process div i{width:33rem; transition:0.5s ease;}
			.process div em{font-size:var(--font20); font-weight:600; color:#c4bcaf; text-align:center; transition:0.5s ease;}
			.process div:before{content:''; opacity:0.2; display:block; position:absolute; z-index:-1; width:100%; height:100%; border:3rem dashed #caaf7c; border-radius:100%; transform:scale(1); transition:0.5s ease;}
		}
		
		/* motion */
		.rehab-box .img[data-motion]{opacity:0; filter:blur(50rem); transform:scale(1.2) translateY(50rem); transition:0.8s ease;}
		.rehab-box .img.motion__in{opacity:1; filter:blur(0); transform:scale(1) translateY(0);}
		.process .list li.show div{background-color:var(--color-point); border-color:var(--color-point); box-shadow:0 30rem 30rem rgba(0,0,0,0.1);}
		.process .list li.show div em{color:#fff;}
		.process .list li.show div i{filter:brightness(2);}
		.process .list li.show div:before{transform:scale(1.3);}
	}

	@media (max-width:1700px){
		&{overflow:hidden;}	
	}
	@media (max-width:1300px){
		.rehab-sec03{
			.rehab-process .process{--sizeWid:130rem;}
			.rehab-process .process div em{font-size:var(--font18);}
		}
	}
	@media (max-width:1024px){
		.rehab-sec03{
			.rehab-box .img{height:280rem;}
			.rehab-process .process{--sizeWid:110rem;}
			.rehab-process .process .list{--sizeGap:30rem;}
			.rehab-process .process div em{font-size:var(--font16);}
			.rehab-process .process div i{width:28rem;}
			.rehab-process .rehab-process-box{gap:40rem;}
			.rehab-process .rehab-process-box .img{flex:0 0 40%;}
			.rehab-process .rehab-process-box .conts{padding-top:20rem;}
			.rehab-process .rehab-process-box .conts p br{display:none;}
		}
	}
	@media (max-width:768px){
		.rehab-sec01{
			.rehab-tel{width:250rem; padding-top:15rem;}
			.rehab-tel i{right:-50rem; top:-30rem; width:200rem; height:60rem;}
		}
		.rehab-sec03{
			.rehab-process .process .list{--sizeGap:15rem;}
			.rehab-process .rehab-process-box .conts{padding-top:10rem;}
			.rehab-process .rehab-process-box .conts p{margin-top:15rem;}
		}
	}
	@media (max-width:480px){
		.rehab-sec01{
			&{min-height:700rem;}
			.inr-narrow{margin-top:-30rem;}
			em{margin-bottom:30rem;}
			em[data-motion]{letter-spacing:50rem;}
			em[data-motion].motion__in{letter-spacing:15rem;}
			h1{margin-bottom:30rem; font-size:var(--font70);}
			p{font-size:var(--font45);}
			.rehab-tel a{height:55rem;}
			.rehab-tel i{right:-10rem; top:-25rem; width:170rem; height:50rem; font-size:var(--font16);} 
		}
		.rehab-sec02{
			p br{display:none;}
		}
		.rehab-sec03{
			.rehab-box .img{height:230rem;}
			.rehab-box [data-flex]{flex-direction:column; gap:35rem; margin-top:30rem;}
			.rehab-box .conts p{margin-top:20rem;}
			.rehab-box  .conts .button{margin-top:30rem !important;}
			.rehab-process .process{--sizeWid:100rem;}
			.rehab-process .process .list{flex-wrap:wrap;}
			.rehab-process .rehab-process-box{flex-direction:column; gap:30rem;}
			.rehab-process .rehab-process-box .conts{padding-top:0;}
		}
	}
}

/* 준비서류 */
.ready-document{
	h3{margin-top:30rem; margin-bottom:0; font-size:var(--font25);}
	.table .tit{background-color:#faf6ed;}
}

/* 게시판 수정 */
.sub .content .tab-list{margin-top:0 !important;}
.sub .content .tab-list li{display:flex; justify-content:center; align-items:center; min-width:200rem; height:60rem; border-left:1px solid #e7e7e7;}
.sub .content .tab-list li:first-child{border-radius:var(--r) 0 0 var(--r); border-left-width:0;}
.sub .content .tab-list li:last-child{border-radius:0 var(--r) var(--r) 0;}
.sub .content .tab-list li.active:hover{border-color:var(--black);}
@media (max-width:1024px){
	.sub .content .tab-list li{min-width:120rem;}
}
@media (max-width:480px){
	.sub .content .tab-list{flex-wrap:wrap; justify-content:flex-start;}
	.sub .content .tab-list li{flex:0 0 calc(100% / 3); min-width:90rem; height:40rem; border:1px solid #e7e7e7;}
	.sub .content .tab-list li:first-child{border-radius:0; border-left-width:1px;}
	.sub .content .tab-list li:last-child{border-radius:0;}	
}

/* layer pop */
	/* layer popup - 이미지만 노출하는 항목 ex)인증서  */
.area_popLayer.img .popBox{display:flex; flex-flow:column wrap; justify-content:center; align-items:center; width:617rem !important; height:839rem; padding:0px; background-color:transparent; box-shadow:none;}
.area_popLayer.img .popBox .scrollbar-inner{overflow:inherit; height:auto; padding:0px;}
.area_popLayer.img .popBox .btn_close{top:0; right:-70rem;}
.area_popLayer.img.patent img{width:auto; max-width:100%; max-height:100%;}
.box_view_img .img{display:block;}
.box_view_img .img img{width:100%;}
	/* layer popup - btn control */
[data-pop-layer="layer"]{position:fixed; top:0px; left:0px; z-index:1000; width:100%; height:100%; background:rgba(0,0,0,0.2);}
[data-pop-layer="layer"] .popBox{position:absolute; top:50%; left:50%; width:var(--popWid, 400rem); min-height:var(--popHig, 600rem); box-sizing:border-box; background:var(--color-white, #fff); box-shadow:3px 15px 30px rgba(0,0,0,0.15); line-height:1.4; transform:translate(-50%, -50%);}
[data-pop-layer="layer"] .popBox .popTitle{display:flex; align-items:center; min-height:var(--titleHig); box-sizing:border-box; padding:5rem 20rem; border-bottom:1rem solid #eee; font-size:25rem; font-weight:600;}
[data-pop-layer="layer"] .popBox .btn_close{position:absolute; top:0px; right:-70rem; width:70rem; height:68rem; line-height:68rem; background:var(--color-point, #111); box-shadow:3px 10px 15px rgba(0,0,0,0.15);}
[data-pop-layer="layer"] .popBox .btn_close span{display:inline-block; position:relative; width:18rem; height:18rem; margin:-4rem auto 0; vertical-align:middle; background:url(../images/module/btn_close.png) no-repeat 50% 0; background-size:18rem 18rem; text-indent:100%; overflow:hidden; white-space:nowrap;}
[data-pop-layer="layer"] .popBox .btn_close:focus{outline:none;}
[data-pop-layer="layer"] .popBox .popConts{overflow-y:auto; max-height:calc(var(--popHig) - var(--titleHig)); box-sizing:border-box; padding:20rem 20rem 40rem;}
	/* layer popup - size  */
[data-pop-layer="layer"] .popBox{--popWid:400rem; --popHig:600rem; --titleHig:67rem;}
	/* layer popup img only */
.area_popLayer--img .popBox{display:flex; flex-flow:column wrap; justify-content:center; align-items:center; width:617rem !important; height:839rem; padding:0px; background-color:transparent; box-shadow:none;}
.area_popLayer--img .popBox .scrollbar-inner{overflow:inherit; height:auto; padding:0;}
.area_popLayer--img .popBox .btn_close{top:0; right:-70rem;}
.area_popLayer--img.patent img{width:auto; max-width:100%; max-height:100%;}
.box_view_img .img{display:block;}
.box_view_img .img img{width:100%;}	
	/* layer popup - basic */
.layerPop{position:absolute; z-index:90; overflow:hidden; border:1rem solid #353535; border-radius:14rem; z-index:10;}
.layerPop a{display:block;}
.layerPop img{max-width:100%;}
.layerPop .btn{display:flex; justify-content:space-between; padding:13rem 10rem; background:#353535; text-align:left;}
.layerPop .btn button{display:inline-block; margin-left:15rem; background:none; color:#fff; font-size:13rem;}
.layerPop .btn button:last-child{float:right; margin:0 12rem 0 0;}

/* 개인정보처리방침 등 */
.area_guide{font-size:15rem; color:var(--color-gray6); font-weight:400;}
.area_guide h3,
.area_guide p,
.area_guide li{word-break:keep-all;}
.area_guide h3{margin-top:20rem; font-size:16rem; font-weight:700; color:var(--color-black, #111);}
.area_guide h3 + *,
.area_guide h3 + p + ul{margin-top:5rem; margin-left:13rem;}
.area_guide ul > li{margin-top:7rem;}
.area_guide ul > li:first-child{margin-top:0px;}
.area_guide ul > li > ul{margin-top:5rem; padding-left:15rem;}
.area_guide ul > li > ul > li{margin-top:4rem;}
.area_guide ul > li > ul > li:first-child{margin-top:0px;}
.area_guide ul > li strong{font-weight:600; color:var(--color-black, #111);}
.box_guide{margin-top:30rem;}
.box_guide > p{margin-bottom:10rem; padding:10rem; border:1rem solid #eee;}
html[lang="ja"] .area_guide p,
html[lang="ja"] .area_guide li{word-break:break-all;}
html[lang="zh"] .area_guide p,
html[lang="zh"] .area_guide li{word-break:break-all;}

@media (max-width:1024px){
	/* layer pop */
	[data-pop-layer="layer"] .popBox{--popHig:100% !important; top:0px !important; left:0px !important; width:100% !important; height:100%  !important; min-width:inherit; min-height:inherit; transform:translate(0,0);}
	[data-pop-layer="layer"] .popBox .popTitle{padding-right:80rem !important;}
	[data-pop-layer="layer"] .popBox .btn_close{right:0px; box-shadow:none;}
	.layerPop{top:100rem !important; left:50% !important; transform:translateX(-50%); width:80% !important;}
		/* layer popup img only */
	.area_popLayer--img .popBox{background:#fff;}
	.area_popLayer--img .popBox .scrollbar-inner{overflow-y:auto; height:100%;}
	.area_popLayer--img .popBox .btn_close{right:0px;} 	
}
@media (max-width:768px){ 	
	/* layer pop */
		/* layer popup img only */
	.box_view_img{display:flex; justify-content:center; align-items:center; height:100%;}
	.box_view_img .img{text-align:center;}
	.box_view_img .img img{width:80%;}
	.area_popLayer.img .popBox{width:100% !important;}
}
@media (max-width:600px){
	/* layer pop */
	.layerPop{width:90% !important;}
	[data-pop-layer="layer"] .popBox .popConts img,
	.layerPop img{max-width:100%; width:100%;}
}

@keyframes aniDown{
	0%, 35%{transform:translateX(-50%) translateY(0);}
	40%{transform:translateX(-50%) translateY(15rem);}
	45%{transform:translateX(-50%) translateY(0rem);}
	50%{transform:translateX(-50%) translateY(15rem);}
	55%, 100%{transform:translateX(-50%) translateY(0rem);}
}
@keyframes swing{
    20%{transform:rotate(15deg);}
    22%{transform:rotate(-10deg);}
    26%{transform:rotate(5deg);}
    28%{transform:rotate(-5deg);}
    to, 18%, 30%{transform:rotate(0deg);}
}