:root {
	
--maintop-h:clamp(600px, 67.188vw, 90vh);/* 라운드 디자인으로 인한 상단 이미지 영역의 하단 공백 사이즈*/	
--maintop-pb:260px;/* 라운드 디자인으로 인한 상단 이미지 영역의 하단 공백 사이즈*/
--maintop-mpb:clamp(-260px, 20.313vw, -30px);/* 라운드 디자인으로 인한 본문 영역 끌어올린 사이즈*/
--main-top-goarea-h:clamp(100px, 23.438vw, 300px);/* 컨텐츠 영역 높이 */

}





/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
.SCF_TOP{ width: 100%; float: left;      height: calc(100vh - var(--header-h));  max-height: 960px;  position: relative; margin-top:  var(--header-h); }
.SCF_TOP .main_text{width: 100%; height: var(--maintop-h)}
	.SCF_TOP .main_cont{ position: absolute;  bottom: clamp(20px, 6.250vw, 80px); left: 0px;  z-index: 99999 ; width: 100%}

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	
	
.SCF_TOP{ width: 100%; float: left;      height: auto;  position: relative; margin-top:  var(--header-h); }
.SCF_TOP .main_text{width: 100%; height: var(--maintop-h)}
	.SCF_TOP .main_cont{ width: 100%; float: left; margin-top: -200px}

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/





.SCF_TOP .main_cont .contents-container{ height: 100%;}

.SCF_TOP .main_cont  .main_1_iconbox{width:100%;  position: relative}


	/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.SCF_TOP .main_1_iconbox .main_cont_grid{width: 100%;   float: left; display: grid;grid-template-columns: auto clamp(320px, 33%, 520px); grid-gap: clamp(20px, 3.906vw, 50px); align-items: stretch; /* 기본값이라 안 써도 되지만 명시적으로 */ position: relative; z-index: 999 ;}


}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
	
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.SCF_TOP .main_1_iconbox .main_cont_grid{width: 100%; height: auto!important;  float: left;position: relative; z-index: 999;display: flex; flex-direction: column; grid-gap: 0px!important; margin-top: 0px ; align-items: stretch; grid-gap: 50px!important; /* 기본값이라 안 써도 되지만 명시적으로 */}

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/

/* 구분 -----------------------------------*/
.SCF_TOP .main_1_iconbox .main_cont_grid .fl{width: 100%;  height: auto;   float: left; position: relative; z-index: 999999999; }

.SCF_TOP .main_1_iconbox .main_cont_grid .fr{width: 100%;  height: auto; float: left; position: relative; }