@charset "utf-8";

@font-face {
    font-family: 'SBAggroM';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroM.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'SBAggroB';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroB.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.MAIN_04_KNB {width: 100%; 
  float: left; 

  position: relative;
  padding-top: 0rem; height: auto; overflow: hidden
}

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
	.MAIN_04_KNB {width: 100%; 
  float: left; 

  position: relative;
  padding-top:5rem; height: auto;overflow-x: hidden
}
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
.MAIN_04_KNB {width: 100%; 
  float: left; 

  position: relative;
  padding-top:0rem; height: auto;overflow-x: hidden
}

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


.MAIN_04_KNB .contents-container {
  padding: 0;
}

.MAIN_04_KNB .contents-inner {
  width: 100%;  padding: 0px; ; position: relative; 
}


/****1******/

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.MAIN_04_KNB .loop-area {

  display: flex;
  align-items: center;
  width: 450vw;
  min-height: 24rem;; z-index: -9; position: relative; font-family: 'SBAggroB';

}
.MAIN_04_KNB .text-wrap {
  display: flex;
  white-space: nowrap;  position: relative; width: 100%;  z-index: 99 ;
}

.MAIN_04_KNB .text-wrap span.loop_tt {font-family: 'SBAggroB'; font-size: calc(var(--tit-md-size) * 5.2); letter-spacing: -1px;
  padding-right: 3rem; 
  color: #f0f2f6; 
}

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

  display: flex;
  align-items: center;
  width: 450vw;
  min-height:30rem;; z-index: -9; position: relative; font-family: 'SBAggroB'; position: absolute; top: 100px

}
	
	.MAIN_04_KNB .text-wrap span.loop_tt {font-family: 'SBAggroB'; font-size: calc(var(--tit-md-size) * 3); letter-spacing: -1px;
  padding-right: 3rem; 
  color: #f0f2f6; 
}

}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	.MAIN_04_KNB .loop-area {

  display: flex;
  align-items: center;
  width: 450vw;
  min-height:30rem;; z-index: -9; position: relative; font-family: 'SBAggroB'; padding-top: 10px

}
.MAIN_04_KNB .text-wrap {
  display: flex;
  white-space: nowrap;  position: relative; width: 100%;  z-index: 99 ;
}

.MAIN_04_KNB .text-wrap span.loop_tt {font-family: 'SBAggroB'; font-size: calc(var(--tit-md-size) * 2); letter-spacing: -1px;
  padding-right: 3rem; 
  color: #f0f2f6; 
}

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



@media (max-width: 992px) {
  .MAIN_04_KNB .loop-area {
    min-height: 4rem;
  }

  .MAIN_04_KNB .text-wrap span.loop_tt {
    padding-right: 1rem;
  }
}
.MAIN_04_KNB .area_left  .contents-container{  position: relative; }



/******2******/
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.MAIN_04_KNB .area_left{  position: relative; margin-top: -220px}
	.MAIN_04_KNB .area_left_bg {  width: 150%;  height: 400px; border-radius: 0px 200px 200px 0px; background: linear-gradient(to left,#3554b3,#3f65d9);
  display: flex; justify-content:flex-end;  align-items:center; flex-direction:row; box-sizing: border-box; ; position: absolute; right: 50%; top: 0px; z-index:1}
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
	.MAIN_04_KNB .area_left{  position: relative; margin-top: -50px}
	.MAIN_04_KNB .area_left_bg {  width: 150%;  height: 400px; border-radius: 0px 200px 200px 0px; background: linear-gradient(to left,#3554b3,#3f65d9);
  display: flex; justify-content:flex-end;  align-items:center; flex-direction:row; box-sizing: border-box; ; position: absolute; right:40%; top: 0px; z-index:1}
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.MAIN_04_KNB .area_left{  position: relative; margin-top: 0px}
	.MAIN_04_KNB .area_left_bg {  width: 90%;  height:220px; border-radius: 0px 100px 100px 0px; background: linear-gradient(to left,#3554b3,#3f65d9);
  display: flex; justify-content:flex-end;  align-items:center; flex-direction:row; box-sizing: border-box; ; position: absolute; right: 10%; top: 0px; z-index:1}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/






/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
.MAIN_04_KNB .area_left .tx_box{ width: 100%;  float: left; position: relative; z-index: 22; padding:clamp(30px, 7.813vw, 100px) 0px  }
.MAIN_04_KNB .area_left .tx_box  .left_tt01{ width: 100%; float: left;font-weight: 400; color: #fff;  font-size: calc(var(--tx-sm-size) * 0.9); letter-spacing: -1px ; margin-bottom: 2rem}

.MAIN_04_KNB .area_left .tx_box  .left_tt02{ width: 100%; float: left;font-weight: 400; color: #fff;  font-size: calc(var(--tit-md-size) * 1.65); letter-spacing: -1px ; margin-bottom: 10rem; position: relative}
.MAIN_04_KNB .area_left .tx_box  .left_tt02 em{  font-weight: 600; color: #fff;  font-size: calc(var(--tit-md-size) * 1.65); letter-spacing: -1px ; }
.MAIN_04_KNB .area_left .tx_box  .left_tt02:before{width:452px; height:131px;   position: absolute; left: 0px; top:-50px; content: "";  font-family: unicons-line; background: url( "../images/box02_img.png") no-repeat left top;  background-size:452px; }

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
.MAIN_04_KNB .area_left .tx_box{ width: 100%;  float: left;padding:clamp(30px, 7.813vw, 100px) 50px }
	
.MAIN_04_KNB .area_left .tx_box  .left_tt02{ width: 100%; float: left;font-weight: 400; color: #fff;  font-size: calc(var(--tit-md-size) * 1.3); letter-spacing: -1px ; margin-bottom: 6rem; position: relative}
.MAIN_04_KNB .area_left .tx_box  .left_tt02 em{  font-weight: 600; color: #fff;  font-size: calc(var(--tit-md-size) * 1.3)!important; letter-spacing: -1px ; }
	.MAIN_04_KNB .area_left .tx_box  .left_tt02:before{width:400px; height:131px;   position: absolute; left: 0px; top:-50px; content: "";  font-family: unicons-line; background: url( "../images/box02_img.png") no-repeat left top;  background-size:400px; }
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	
.MAIN_04_KNB .area_left .tx_box{ width: 100%;  float: left; position: relative; z-index: 22; padding:clamp(30px, 7.813vw, 100px) 30px  }
.MAIN_04_KNB .area_left .tx_box  .left_tt01{ width: 100%; float: left;font-weight: 400; color: #fff;  font-size: calc(var(--tx-sm-size) * 0.9); letter-spacing: -1px ; margin-bottom: 2rem}

.MAIN_04_KNB .area_left .tx_box  .left_tt02{ width: 100%; float: left;font-weight: 400; color: #fff;  font-size: calc(var(--tit-md-size) * 1); letter-spacing: -1px ; margin-bottom:4rem; position: relative}
.MAIN_04_KNB .area_left .tx_box  .left_tt02 em{  font-weight: 600; color: #fff;  font-size: calc(var(--tit-md-size) * 1); letter-spacing: -1px ; }

.MAIN_04_KNB .area_left .tx_box  .left_tt02:before{width:60%; height:80px;   position: absolute; left: 0px; top:-30px; content: "";  font-family: unicons-line; background: url( "../images/box02_img.png") no-repeat left top;  background-size:100%; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/




.MAIN_04_KNB .area_left .tx_box  .left_tx{  width: 100%; float: left;font-weight: 400; color: #fff;  font-size: calc(var(--tx-sm-size) * 1.1); letter-spacing: -1px ; line-height: 150%; z-index: 99999}