@charset "utf-8";
/*정확한 위치는 main_block*/
.MainSection_003 {  width: 100%; float: left; 
  position: relative;
  z-index: 9;     background-color: #eee; height:clamp(300px, 58.594vw, 750px);overflow: hidden
}

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

.contents-bg{  width: 100%; height:clamp(300px, 58.594vw, 750px);  float: left;  overflow: hidden; position: absolute; left: 0px; top: 0px; z-index:-1}
.contents-bg img{ width: 100%;  height: 100%;  object-fit: cover; /* 비율 유지하면서 꽉 채우고 넘치면 잘림 */ }

.wave-top-section .wave-bg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height:clamp(50px, 23.438vw, 300px);
  z-index: 10;
	
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_레이어_1' data-name='레이어_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 1920 300'%3E%3C!-- Generator: Adobe Illustrator 29.2.1, SVG Export Plug-In . SVG Version: 2.1.0 Build 116) --%3E%3Cdefs%3E%3Cstyle%3E .st0 %7B fill: %23eeeeee; %7D %3C/style%3E%3C/defs%3E%3Cpath class='st0' d='M-9.8,49.8S131.2-18.2,284.2,83.8s227-6,452-11,336,186,587,149,46-146,615-109l-5-122H-9.8v59Z'/%3E%3C/svg%3E");
background-repeat: no-repeat no-repeat;
background-position: top center;
background-size: 100%; z-index: 9999999999999!important;
}	
	
.contents-bg_Gr	{  width: 100%; float: left; display: grid; grid-template-columns: repeat(4, 1fr); height:clamp(300px, 58.594vw, 750px); }
.contents-bg_Gr>div{ width: 100%; float: left; border-right: 1px solid rgba(238,238,238,0.3);  height:clamp(300px, 58.594vw, 750px); ;display: flex;  justify-content: center;  align-items: center; flex-direction: column;}	
.contents-bg_Gr>a{ width: 100%; float: left; border-right: 1px solid rgba(238,238,238,0.3);  height:clamp(300px, 58.594vw, 750px); ;display: flex;  justify-content: center;  align-items: center; flex-direction: column;}	
		



.Gr_list{ width: 100%; height:clamp(300px, 58.594vw, 750px);  float: left ;box-sizing: border-box; background-color:rgba(0,0,0,0.5);  ;display: flex;  justify-content: center;  align-items: center; flex-direction: column; padding-top:clamp(30px, 11.719vw, 150px)}
.Gr_list:hover{ width: 100%; float: left; display: flex; justify-content:center;  align-items: center; flex-direction:column; box-sizing: border-box;  background-color:rgba(238,238,238,0.0); }	

.Gr_list .Gr_list_tt{ width: 100%; float: left; font-size: clamp(18px, 2.891vw, 37px); color: rgba(238,238,238,1.0); font-weight: 600; line-height: 100%; margin-bottom:10px; text-align: center}	
.Gr_list .Gr_list_tx{ width: 100%; float: left; font-size: clamp(10px, 1.250vw, 16px); min-height: 30px; color: rgba(238,238,238,0.5); font-weight: 500; line-height: 120%; margin-bottom:clamp(5px, 1.563vw, 20px); text-align: center; text-transform:uppercase; }
	




.Gr_list  .line{ float: left; width:100%; height:0px;  position: relative;  transition: all 0.5s;-moz-transition: all 0.5s; -webkit-transition: all 0.5s;-o-transition: all 0.5s; display: flex;  justify-content: center;  align-items: center;   margin-bottom: 30px}	
.Gr_list:hover .line{height: clamp(30px, 8.594vw, 110px)}

.Gr_list  .line:before{ content: "";  background-color:rgba(238,238,238,0.3);   font-family: unicons-line;width: 1px; height:100%; transition: all 0.5s;-moz-transition: all 0.5s; -webkit-transition: all 0.5s;-o-transition: all 0.5s; }	
	


.Gr_list .Gr_list_more{ width:clamp(40px, 5.469vw, 70px); aspect-ratio:1 / 1;  float: left; border-radius: 100%; border: 1px dashed rgba(238,238,238,0.3); position: relative; cursor:pointer}	
.Gr_list .Gr_list_more:before{position: absolute; left: 0px; top:0px;  width:clamp(40px, 5.469vw, 70px); aspect-ratio:1 / 1; content: "\eb9f";  color:rgba(238,238,238,0.3);   font-family: unicons-line; font-size:clamp(20px, 2.344vw, 30px); display: flex;  justify-content: center;  align-items: center; margin-top: -3px}
	


.contents-bg_Gr>a:hover  .Gr_list .Gr_list_more{ border: 1px solid var(--primary); position: relative; cursor:pointer; 	-webkit-transform: scale(1.1);
	transform: scale(1.1); background-color:var( --primary-opacity50);;  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px); /* Safari 지원 */ }
.contents-bg_Gr>a:hover  .Gr_list .Gr_list_more:before{color:rgba(238,238,238,1.0); }	
	
.wave-top-section {
  position: relative;
}