/* 서브 상단  */


.Sub_Top_area { overflow: hidden; position: relative; height: 100%; float: left; margin-top: var(--header-h); width: 100%; margin-bottom:clamp(10px, calc(2.632vw + -0.526px), 50px); }


/* 구분 -----------------------------------*/

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.subbgtopimg { width: 100%; float: left; height:var(--subtop-h);  overflow: hidden; position: relative!important; background-color: rgba(0,0,0,0.13);    border-radius: 0px 0px 100% 100% ;  }

.subbgtopimg .contents-container{  height:var(--subtop-h); display: flex;    align-items: center;}
	
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.subbgtopimg { width: 100%; float: left; height:calc(var(--subtop-h) * 0.5);  overflow: hidden; position: relative!important; background-color: rgba(0,0,0,0.13);  padding-top:30px ;   }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



.subbgtopimg .img_box { width: 100%; height:100%; position: absolute; top: 0px; left: 0px; z-index: 0}
.subbgtopimg .img_box img { object-fit: cover; width: 100%; height: 100%;  -webkit-animation: main_ani  2s forwards; /* Safari 4.0 - 8.0 */
  animation: main_ani 2s forwards; opacity: 0px;}


.subbgtopimg .img_box2 { width: 100%; height:100%; position: absolute; top: 0px; left: 0px; z-index: 0!important}
.subbgtopimg .img_box2 img { object-fit: cover; width: 100%; height: 100%; }	
	

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.subbgtopimg  .txbox { width: 100%!important;float: left;  z-index: 2;  margin-bottom: 100px}
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.subbgtopimg  .txbox { width: 100%!important;float: left;  z-index: 2;  margin-bottom:0px}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/




.subbgtopimg .txbox .tx1 { width: 100%; float: left; color: var(--subtop-tx2-color);  text-align: left;  }
.subbgtopimg .txbox .tx1 span{  color: var(--subtop-tx2-color); font-size: var(--subtop-tx2)!important; ; line-height: 130%!important ; font-family:var(--ff-ko10)!important;}
.subbgtopimg .txbox .tx1 span em{  font-weight: 700; color: #000 ;font-family:var(--ff-ko10)!important;}


.subbgtopimg .txbox .tx2 { width: 100%; float: left; color: var(--subtop-tx2-color); font-size: var(--subtop-tx2)!important; line-height: 120%; margin-bottom:20px}

.subbgtopimg .txbox .tx3 { width: 100%; float: left; color: var(--subtop-tx3-color); font-size: var(--subtop-tx3)!important;}
.subbgtopimg .txbox .tx3 em{  color: var(--subtop-tx3-color); font-size: var(--subtop-tx3)!important;}


/* 대타이틀  -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.subtop_tit_size {font-size: var(--subtop-tit-size)!important; line-height: 110%!important;  margin-bottom: 20px  }
.subtop_tit_size em{font-size:calc(var(--tit-lg-size) * 1); line-height: 110%!important;letter-spacing: -1px;  background: linear-gradient(45deg,var(--primary), var(--secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent; font-weight: 800  }

.page_title{ width: 100%; float: left;  font-size: var(--tit-lg-size)!important; line-height: 110%!important ;color: #000; margin: clamp(10px, 3.906vw, 50px) 0px; font-weight: 700}

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
.subtop_tit_size {font-size: var(--tit-mds-size); line-height: 110%!important; width: 100%; float: left}
.subtop_tit_size em{font-size:calc(var(--tit-md-size) * 1); line-height: 110%!important; color: var(--primary);letter-spacing: -1px; ; width: 100%; float: left }
.subtop_tit_size span{font-size:calc(var(--tx-sm-size) * 1); line-height: 110%!important; letter-spacing: -1px; font-weight: 500; color: #666}

.page_title{ width: 100%; float: left;  font-size: var(--tit-mds-size)!important; line-height: 110%!important ;color: #000; margin: clamp(10px, 3.906vw, 50px) 0px; font-weight: 700}

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/





@keyframes  main_ani {
  0% {
   -webkit-transform: scale(1.1);
	transform: scale(1.1);
  }
  100% {
   -webkit-transform: scale(1);
	transform: scale(1);
  }
}




	.dep3_tab_box .contents-container .dep3_tab{width: 100%; float: left;   }
.dep3_tab .dep3_btn { width: 100%; float: left;display: flex; flex-direction: row;  grid-gap: 20px;  margin-bottom: 50PX; display: grid;   grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); display: flex;  justify-content: center;  align-items: center; flex-wrap: wrap; z-index: 99; position:relative}
	
.dep3_tab .dep3_btn{ width: 100%; float: left;display: flex; flex-direction: row;  grid-gap: 20px;  margin-bottom: 50PX!important; display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: 10px ; }
	
 .dep3_tab .tabs .dep3_btn { font-weight: 800;font-size:calc(var(--tx-sm-size) * 1.1);  max-width:350px ; min-width: 180PX; float: left;  background: #F7F7F7; padding: 17PX 30PX; border-radius: 50PX; display: flex;  justify-content: center;  align-items: center; cursor: pointer
    
  } 
	
