@charset "utf-8";

/* MAIN_03_SCF */

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	.MAIN_03_SCF { width: 100%;float: left; 
position: relative;
overflow: hidden;     min-height: clamp(400px, 72.344vw, 926px);  background: url("/_img/img/SCF/main03_bg.jpg")no-repeat center center; background-size: cover; padding: 100px 0px 100px

}
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	.MAIN_03_SCF { width: 100%;float: left; 
position: relative;
overflow: hidden;     min-height:auto;  background: url("/_img/img/SCF/main03_bg.jpg")no-repeat center center; background-size: cover; padding: 50px 0px 100px

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


.MAIN_03_SCF .contents-inner {
width: 100%;  position: relative;  
}




/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.MAIN_03_SCF .content-title-box { width: 100%;float: left; display: flex;
justify-content:center;  align-items:flex-start; flex-direction:column; box-sizing: border-box; 

}
.MAIN_03_SCF .content-title-box .title{width: 100%; float: left; 
color: var(--white); text-align: center;  font-size:calc(var(--tit-mds-size) * 1.85) ; letter-spacing: -1px; line-height: 100%; font-weight: 700; margin-bottom: clamp(20px, 2.344vw, 30px)
}	
.MAIN_03_SCF .content-title-box .stitle{width: 100%; float: left; 
color: var(--white); text-align: center;  font-size:calc(var(--tx-sm-size) * 0.85); letter-spacing: -1px; line-height: 130%; font-weight:300; margin-bottom: clamp(30px, 4.688vw, 60px)
}		
	
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
.MAIN_03_SCF .content-title-box {
width: 100%; display: flex;
justify-content:flex-start;  align-items:flex-start; flex-direction:column; box-sizing: border-box; margin-top: 0px;
}
.MAIN_03_SCF .content-title-box .title{width: 100%;
color: var(--white); text-align:left;  font-size:calc(var(--tit-mds-size) * 1.85) ; letter-spacing: -1px; line-height: 100%; font-weight: 700; margin-bottom: clamp(20px, 2.344vw, 30px)
}	
.MAIN_03_SCF .content-title-box .stitle{width: 100%;
color: var(--white); text-align:left;  font-size:calc(var(--tx-sm-size) * 0.85); letter-spacing: -1px; line-height: 130%; font-weight:400; margin-bottom: clamp(30px, 4.688vw, 60px)
}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/






/* 구분 start -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.MAIN_03_SCF .wg_boxin {width: 100%;float: left;  display: grid; grid-template-columns: repeat(4, 1fr); gap:clamp(20px, 3.125vw, 40px);}

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {

	
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	.MAIN_03_SCF .wg_boxin {width: 100%; float: left; display: grid; grid-template-columns: repeat(2, 1fr)!important; gap:clamp(20px, 3.125vw, 40px); }	
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.MAIN_03_SCF .wg_boxinin { width: 100%;  height: 100%; position:relative; padding:  clamp(30px, 3.125vw, 40px)   clamp(15px, 1.563vw, 20px); background-color:rgba(255,255,255,0.8); border-radius:10px  30px 10px 30px;  display: flex;
justify-content:center;  align-items:center; flex-direction:column; box-sizing: border-box; transition: all 0.5s;-moz-transition: all 0.5s; -webkit-transition: all 0.5s;-o-transition: all 0.5s;   backdrop-filter: blur(10px); 
 }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	.MAIN_03_SCF .wg_boxinin { width: 100%;  height: 100%; position:relative; padding: 20px; background-color:rgba(255,255,255,0.8); border-radius:10px  30px 10px 30px;  display: flex;
justify-content:center;  align-items:center; flex-direction:column; box-sizing: border-box; transition: all 0.5s;-moz-transition: all 0.5s; -webkit-transition: all 0.5s;-o-transition: all 0.5s;   backdrop-filter: blur(10px); 
 }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/






/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
	.MAIN_03_SCF .wg_boxinin  .wg_img1 { width: clamp(80px, 7.813vw, 100px); height: clamp(80px, 7.813vw, 100px) }
.MAIN_03_SCF .wg_boxinin  .wg_img1 img { width:100%;  transition: 0.3s ease; /* 부드럽게 */ }
.MAIN_03_SCF .wg_boxinin:hover  .wg_img1 img { width:100%;  transition: 0.3s ease; /* 부드럽게 */ filter: brightness(3.2); }
.MAIN_03_SCF .wg_boxinin  .wg_tx1 { width: 100%; font-size: calc(var(--tx-sm-size) * 1.1); color: #333; ; letter-spacing: -1px; line-height: 130%; font-weight:500; margin-top: clamp(10px, 1.563vw, 20px); text-align: center}

.MAIN_03_SCF .wg_boxinin:hover { height: 120%; position:relative; padding:clamp(30px, 3.125vw, 40px)   clamp(15px, 1.563vw, 20px); background-color:var( --primary-opacity50); border-radius:10px  30px 10px 30px;  display: flex;
justify-content:center;  align-items:center; flex-direction:column; box-sizing: border-box;  margin-top: -20px}

.MAIN_03_SCF .wg_boxinin:hover:before { width:40px; height: 40px; background-color:#333; border-radius: 100%;  position: absolute; right:clamp(15px, 1.563vw, 20px); top:clamp(15px, 1.563vw, 20px); content: "\eb6d";  color:var(--primary);   font-family: unicons-line; font-size: 30px;   display: flex; justify-content:center;  align-items: center; flex-direction:column; box-sizing: border-box; padding-bottom: 5px}

.MAIN_03_SCF .wg_boxinin:hover .wg_tx1 {  color: #fff;  }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	
	.MAIN_03_SCF .wg_boxinin  .wg_img1 { width: clamp(80px, 7.813vw, 100px); height: clamp(80px, 7.813vw, 100px) }
.MAIN_03_SCF .wg_boxinin  .wg_img1 img { width:100%;  transition: 0.3s ease; /* 부드럽게 */ }

.MAIN_03_SCF .wg_boxinin  .wg_tx1 { width: 100%; font-size: calc(var(--tx-sm-size) * 1.1); color: #333; ; letter-spacing: -1px; line-height: 130%; font-weight:500; margin-top: clamp(10px, 1.563vw, 20px); text-align: center}


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