: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) {

.YJM_TOP{ width: 100%; float: left;      height: calc(100vh - var(--header-h));  max-height: 960px;  position: relative; margin-top:  var(--header-h); }
.YJM_TOP .main_text{width: 100%; height: var(--maintop-h)}

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


.YJM_TOP{ width: 100%; float: left;      height:550px;    position: relative; margin-top:  var(--header-h); }
.YJM_TOP .main_text{width: 100%; height:auto}

}
/**** 모바일2 ****/
@media only all and (max-width:460px) {
	.YJM_TOP{ width: 100%; float: left;      height:500px;    position: relative; margin-top:  var(--header-h); }
.YJM_TOP .main_text{width: 100%; height:auto}
}
/* 구분 //end -----------------------------------*/





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

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


/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.YJM_TOP .main_1_iconbox .main_cont_grid{width: 100%;   float: left; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 0px; 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) {.YJM_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 -----------------------------------*/

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