/*서브만 사용하는 헤더*/
#header .header_inner #nav ul li a {color:#000;}
#header .btnAll span {background-color:#000;}
#header {background:#fff;}

#header.over .white-logo{display:none}
#header.over .color-logo{display:block;}
#header.over .btnAll span{background-color:#000;}


/*서브 비주얼*/
.white-logo{display:none;}

#wrap #sepration { clear:both; text-align:center; overflow:hidden;position:relative;padding:11rem 0 0 0;}
#wrap #sepration .section {width:1600px;margin:0 auto;}
#wrap #sepration .section h2{text-align:left;font-size:2.5rem;font-weight:700;color:#666;line-height:1.25;    transition: all 0.8s ease-in-out;;opacity: 0;transform: translateY(100%);}
#wrap #sepration .section h2 b{font-weight:700;color:#000;} 

#wrap #sepration.on .section h2{opacity: 1.0;transform: translateY(0px);}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}


/* 서브메뉴 */
.tab_view{display:none;}


.snbWrap #lnb>li>div>ul>li{height:auto;padding:0.25rem 0;font-size:0.9rem;}
/* LNB */
.lm_bg .snb {
}
/*.lm_bg .snb ul li:last-child{width: calc( (100% - 4.5rem + 0.4px) / 6);}*/
.lm_bg .snb .home{display:inline-block;width:4.5rem; height:4.5rem; background:#666 url('/images/default/content/home.png') no-repeat center center;}

.left_menu_mob {width:1600px;margin:0 auto;}
.left_menu_mob ul {display:flex;margin-top:3.5rem;gap:3.5rem;}
.left_menu_mob ul li a{font-size:1.15rem;font-weight:700;position:relative;padding-bottom:0.85rem;color:#BCBFC7;display:inline-block;}
.left_menu_mob ul li a:has(strong) {color:#1060A1;}
.left_menu_mob ul li a:before{content: attr(title);width:0;position:absolute;top:0;left:0;height:100%;color:#1060A1;white-space:nowrap;transition: all 0.2s ease-in-out;overflow:hidden;font-size:1.15rem;font-weight:700;}
.left_menu_mob ul li a:hover:before{width:100%;}
.left_menu_mob ul li a:has(strong):hover:before {display:none;}
.left_menu_mob ul li a:after{transition: all 0.4s ease-in-out;content:'';position:absolute;left:0;bottom:0;width:0;left:50%;height:2px;background:#1060A1}
.left_menu_mob ul li a:has(strong):after{width:100%;left:0;}
.left_menu_mob ul li a:hover:after
{width:100%;left:0;transition: all 0.4s ease-in-out;}

.left_menu_mob ul li a strong {font-weight:700;position:relative;}
.left_menu_mob ul li a strong:before{content:'';display:block;position:absolute;width:5px;height:5px;border-radius:50%;background:#1060A1;left:50%;top:-0.5rem;transform:translateX(-50%); opacity: 0;
  animation: dropDot 0.4s ease-out forwards;}


@keyframes dropDot {
  0% {
    top: -1.5rem;
    opacity: 0;
  }
  100% {
    top: -0.5rem;
    opacity: 1;
  }
}




/*서브 타이틀*/
#header{z-index:999;}
#container{z-index:0;position:relative;}
#container .page_main_title{text-align:center;margin-top:7.35rem;}
#container .page_main_title h3 {font-size:2.75rem;font-weight:700;color:#000;line-height:1;}
#container .page_main_title h3 em {color:#1060A1;}



/* 탭메뉴 */
.tab_menu{width:1300px; margin:0 auto; position:relative; z-index:0;margin-bottom:3.5rem;}
.tab_menu ul{text-align:center; overflow:hidden;}
.tab_menu ul li{float:left; width: 33.3333%;}
.tab_menu ul li a{display:inline-block; width:100%; border-bottom: 4px solid #E2E2E2; box-sizing:border-box; padding:1rem 0; text-align:center; font-size:1.1rem; color:#8f8f8f; font-weight:500;}
.tab_menu ul li.on a{border-color:#0043c7; color:#0043c7;}


/*서브 레이아웃 배경*/
.sub-img {height:24rem;clip-path: inset(0 50%);opacity: 0.5;    transition: all 0.9s ease;background-size: cover;
        background-position: center;}
.sub-img.on {clip-path: inset(0);opacity: 1;}

/*컨텐츠*/
#container .content_body{padding-bottom:5rem;}



/********************************************************
■ 레이아웃 변경
********************************************************/
@media (max-width:1600px){
	#wrap #sepration .section{width:100%;padding:0 2.5rem;}
	.left_menu_mob{width:100%;padding:0 2.5rem;}

}

@media (max-width:1660px){
	.section_lnb>.inr{width:100%;z-index:9;}
}


@media (max-width:1300px){
	/* 탭메뉴 */
	.tab_menu{width:100%;}
	.tab_menu ul li a{font-size:1rem;}
	

	/*비주얼*/
	#visual .bxslider li .ptext,
	#visual .bx-wrapper .bx-pager{width: 100%; padding: 0 1rem;}
	#visual .bx-wrapper .bx-pager{width: 100%; left:0; margin-left:0;}
	.sub-img {height:25rem;}
	#wrap #sepration{padding-top:7.5rem;}
	#wrap #sepration .section h2{font-size:2.2rem;}

	
	/*왼쪽메뉴*/
	.lm_bg .left_menu ul{width:100%;}
	.lm_bg .snb{width:100%;}
	.left_menu_mob ul{gap:2rem;}

	/*페이지 타이틀*/
	#container .page_main_title{width: 100%; padding: 0 1rem;margin-top:5rem;}
	#container .page_main_title h3{font-size:2.5rem;line-height:1.2;}

}




/********************************************************
■ 태블릿
********************************************************/
@media (max-width:1030px){
	/* 서브비주얼 */	

	#wrap #sepration .section{width:100%;padding:0 5vw;}
	.left_menu_mob{width:100%;padding:0 5vw;}
	.sub-img{height:20rem;}
	.sub-mob-bx {display:flex;flex-direction: column-reverse;margin-top:2.5rem;}

	/* 서브메뉴 */	
	.snbWrap{display:none;}
	.lm_bg .snb{width:100%;transform: translateY(0);height:0;z-index:1;}
	.lm_bg .snb .home{display:none;}
	.lm_bg{ border-top:none;z-index:10;margin-top:-1px;}
	.tab_view{display:block; cursor:pointer;background:#1060A1; background-size:12px auto; font-size:1.05rem; box-sizing:border-box; color:#fff; box-sizing:border-box; padding-left:5vw; font-weight:normal; position:relative; text-align: left;height:3rem;line-height:3rem;}
	
	.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%);}
	.lm_bg .left_menu ul:after{display:none;}
	.lm_bg .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;padding:1rem; }
	.lm_bg .left_menu ul li a {display:block; line-height: 1.0; height: auto;  font-weight:500; font-size:1rem; color:#888;text-transform:capitalize;}
	.lm_bg .left_menu ul li a:before{display:none;}
	.lm_bg .left_menu ul li strong{ font-weight:500;} 
	.lm_bg .left_menu ul li.on a:before{display:none;}
	.lm_bg .left_menu ul li.on a{background:none; color:#083C6B;}
	.lm_bg .left_menu ul li.on a:after{display:none;}
	.lm_bg .snb ul li.on{background:#fff;}
	.lm_bg .snb ul li:hover{background:#EAECF1;}
	.lm_bg .snb ul li:hover a{color:#083C6B;}
	.lm_bg .snb ul li a:after{display:none;}



	/* 탭메뉴 */	
	.tab_menu{margin:2rem 0;}
	.tab_menu ul{display:flex; align-items: center; flex-flow: row wrap; justify-content: space-evenly; }


	/*컨텐츠*/
	#container #section .right_content .content_body{padding-top:3rem;}
}


/********************************************************
■ 모바일
********************************************************/
@media (max-width:767px){
	/*탭메뉴*/
	.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;}


	/*컨텐츠*/
	#container #section .right_content .page_main_title h3{margin-bottom:2rem;font-size:1.4rem;}
}


@media (max-width:500px){
	#wrap #sepration {padding-top:7rem;}
	.sub-img{height:17rem;}
}

