/**************************************************
* 버전관리
* version : v=1
* Last Update : 
**************************************************/


/********************************************************
■ 서브 비주얼
********************************************************/
#sepration{height:43.75rem; position:relative; margin:0 var(--side-padding);  z-index:0; }
#sepration .sep_img_wrap{position:absolute; right:0px; bottom:0px; width:100%; height:50%;  border-radius: clamp(0.4rem, 0.239rem + 0.429vw, 0.625rem); border-bottom-right-radius:clamp(3rem, 1.571rem + 3.81vw, 5rem); overflow: hidden; z-index:-1;}
#sepration .sep_img_wrap .sep_img{position:absolute; left:50%; top:50%; width:100%; height:43.75rem; background-position: 50% 50%; background-repeat:no-repeat; background-size:cover; transform: translate(-50%,-50%) scale(1.1); transition: transform 1s;}
#sepration .section{position:absolute; left:50%; top:15%; width:var(--content-width-sm); margin:0 auto; z-index:1; padding:0 var(--side-padding); text-align:center;  transform: translateX(-50%) }  
#sepration .section h2{position:relative; overflow:hidden; font-size:5rem; height: 5rem; margin-bottom: 1rem;}
#sepration .section h2 .wrap{position:absolute; left:50%; display:block; overflow:hidden; line-height:1;  transition: transform 1.2s; white-space: nowrap;}
#sepration .section h2 .ov{display:inline-block; line-height:1; transform: translateY(120%); transition: transform 1s;}
#sepration .section p{position:relative; font-size: clamp(1rem, 0.85rem + 0.75vw, 1.75rem); font-weight:600; height:2.4rem;}
#sepration .section p .wrap{position:absolute; left:50%;display:block; overflow:hidden;  }
#sepration .section p .ov{opacity:0; transform: translateY(120%); transition: opacity 1s, transform 1s; transition-delay: .4s; white-space: nowrap;}

#sepration.on .sep_img_wrap .sep_img{transform: translate(-50%,-50%) scale(1);}
#sepration.on .section h2 .ov{transform: translateY(0%);}
#sepration.on .section p .ov{opacity:1; transform: translateY(0%);}

@media (max-width:1420px){ 
	#sepration .section{width:100%;}
	 
}
@media (max-width:1028px){ 
	/* #sepration,
	#sepration .sep_img_wrap .sep_img{height:calc(60dvh - var(--head-height)); } */
	#sepration,
	#sepration .sep_img_wrap .sep_img{height: calc(clamp(18.75rem, 13.75rem + 25vw, 43.75rem) - var(--head-height));}
	#sepration .section h2{font-size:3rem; height: 3rem; margin-bottom: 0.5rem;}
}

/********************************************************
■ LNB
********************************************************/
.tab_view{display:none;}

/* LNB */
.snb {display: flex; max-width:1420px; height:4.5rem; margin:0 auto; position:relative;}
.snb:after {content:""; display:block; width:100vw; height:153.3%; position:absolute; left:0px; bottom:0; background:#001219; z-index:-1;}
.snb ul{display:flex;}
.snb ul li{text-align:center; margin:0 1.85rem; overflow:hidden; padding: 0 10px;}
.snb ul li a{position:relative; display: flex; align-items: center; justify-content: center; width:100%;height:100%;position:relative; color:rgba(255,255,255,0.6); transition: all 0.3s; padding: 0 5px;}

.snb ul li.on a{color:var(--main); }
.snb ul li.on a:after {content:""; display:block; width: 100%; height:2px;  position:absolute; bottom:0; left:0; transition: all 0.3s; background:#fff; -webkit-box-shadow:0px 0px 10px 5px rgba(0,152,245,1); -moz-box-shadow: 0px 0px 10px 5px rgba(0,152,245,1); box-shadow: 0px 0px 10px 5px rgba(0,152,245,1);}
.snb ul li.on a:before {content:""; display:block; width: 1rem; height:2px;  position:absolute; top:0; left:50%;  transform:translateX(-50%); transition: all 0.3s; background:#fff; -webkit-box-shadow:0px 0px 10px 5px rgba(0,152,245,1); -moz-box-shadow: 0px 0px 10px 5px rgba(0,152,245,1); box-shadow: 0px 0px 10px 5px rgba(0,152,245,1);}



@media (max-width:1420px){
	.snb{width:100%;}
}
@media (max-width:1030px){
	/* 서브메뉴 */	
	.snb{width:100%;transform: translateY(0); height:0; z-index: 100;}
	.snb ul {border-top:none;}
	.snb ul li.on{background:#fff;}
	.snb ul li:hover{background:rgba(243,238,236,1);}
	.snb ul li:hover a{color:var(--main);}
	.snb ul li a strong:after{display:none;}
}


/* 탭메뉴 */
.tab_menu{width:1420px; margin:0 auto; position:relative; z-index:0;margin-bottom:2.3rem;}
.tab_menu ul{display:flex; gap: 1rem 2rem; justify-content: center; align-items: center;text-align:center; overflow:hidden;}
.tab_menu ul li a{display:flex;  justify-content: center; align-items: center; color:#fff; background:#f0f2f3; color:#353535; border-radius:2rem; padding: 0 3.15rem;  width:auto; height:3.25rem; transition: all 0.3s; font-size:1.2rem}
.tab_menu ul li.on a, .tab_menu ul li:hover a {background:#12364c; color:#fff;}

@media (max-width:1420px){
	.tab_menu{width:100%;}
	.tab_menu ul li a{font-size:1rem;}
}

@media (max-width:1030px){
	/* 서브메뉴 */	
	.tab_view{display:block; cursor:pointer; background:#001219; background-size:12px auto; font-size:1.05rem; box-sizing:border-box; color:#fff; box-sizing:border-box; padding-left:1rem; font-weight:normal; position:relative; text-align: left; height:4rem; line-height:4rem;}
	
	.tab_view i{position:absolute; top:50%; right:1rem; margin-top:-9px; display:block; }
	.tab_view.on{cursor:pointer; }
	.tab_view.on i{transform:rotateX(180deg);}
	.left_menu {position:relative;box-sizing:border-box; height:0; width:100%;}
	.left_menu ul{display:none; z-index:100;position:absolute;width:100%;left:0;  margin:0 auto; line-height:0; background:#fff; box-shadow:3px 2px 15px 1px rgb(0 0 0 / 15%);}
	.left_menu ul:after{display:none;}
	.left_menu ul li {width:100% !important; border-top:1px solid #EAECF1; height:3rem; line-height:3rem; margin-left:0; vertical-align:middle; box-sizing:border-box; text-align:left;}
	.left_menu ul li a {display:block; padding: 1rem; line-height: 1.0; height: auto;  font-weight:500; font-size:1rem; color:#888;text-transform:capitalize;}
	.left_menu ul li:not(:first-child) a{border-left:none;}
	.left_menu ul li a:before{display:none;}
	.left_menu ul li strong{ font-weight:500;} 
	.left_menu ul li.on a:before{display:none;}
	.left_menu ul li.on a{background:none; color:var(--main);}
	.left_menu ul li.on a:after{display:none;}

	.left_menu_mob{display:none;}

	/* 탭메뉴 */	
	.tab_menu{margin:2rem 0;}
}

@media (max-width:767px){
	/*탭메뉴*/
	.lm_bg {margin-top: -3.6rem;}
	.tab_view {height: 3.6rem;  line-height: 3.6rem;}
	.tab_menu ul li a{display:block; text-transform:capitalize; display: -webkit-box; display: -ms-flexbox;	display: -webkit-flex; display: flex;	-webkit-box-pack: center;	-ms-flex-pack: center;	-webkit-justify-content: center;	justify-content: center;	-webkit-box-align: center;	-ms-flex-align: center;	-webkit-align-items: center; align-items: center; height:50px; line-height:1.1;}
}
@media (max-width:390px){
	/*탭메뉴*/
	.tab_menu ul li a {padding:0 2rem;}
	.tab_menu ul{display:block; text-transform:capitalize; display: -webkit-box; display: -ms-flexbox;	display: -webkit-flex; display: flex;	-webkit-box-pack: center;	-ms-flex-pack: center;	-webkit-justify-content: center;	justify-content: center;	-webkit-box-align: center;	-ms-flex-align: center;	-webkit-align-items: center; align-items: center; height:50px; line-height:1.1;}
}




/********************************************************
■ 컨텐츠
********************************************************/
#content_body {position:relative; padding-top:clamp(4rem, 2.393rem + 4.286vw, 6.25rem); padding-bottom:clamp(6rem, 3.586rem + 6.438vw, 9.38rem);}

/*페이지 제목*/
.page_main_title{display:flex; align-items: center; flex-wrap:wrap; gap:1rem 4rem; justify-content: space-between; max-width:var(--content-width-sm); margin:0 auto clamp(4rem, 3.987rem + 0.063vw, 4.063rem); padding:0 var(--side-padding);}
.page_main_title h3{font-size: clamp(1.802rem, 1.412rem + 1.948vw, 3.75rem); font-weight: 600; color:var(--Gray-Color-800); line-height: 1;}

.breadcrumb ol{display:flex; color:#ccc; font-size:var(--font-size-16); font-weight:600;}
.breadcrumb ol li:not(:last-child){position:relative; padding-right:1rem; margin-right:0.75rem; }
.breadcrumb ol li:not(:last-child):after{content:""; position:absolute; right:0px; top:0.7em; width:0.188rem; height:0.188rem; border-radius:50%; background:#ccc; }
.breadcrumb ol li .icon_home{background:#ccc;}
.breadcrumb ol li a{display:flex; gap:0.3rem; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s;}
.breadcrumb ol li a:is(:hover, :focus){color:var(--Brand-Color-main); text-decoration:underline; text-underline-position: under; }
.breadcrumb ol li:last-child{color:var(--Gray-Color-800);}

@media (max-width:768px){ 
	.page_main_title{flex-direction: column; align-items: flex-start;}

	.breadcrumb ol li.home{padding-right: 1.4rem;}
	.breadcrumb ol li.home:before{content:""; position:absolute; right:0.4rem; top:0.7em; width:0.188rem; height:0.188rem; border-radius:50%; background:#ccc;}
	.breadcrumb ol li:not(.home):not(:last-child){ position: absolute !important; width: 1px !important;   height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;}
}