@charset "utf-8";


/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
.MAIN_05_KNB {width: 100%; 
  float: left; 
  position: relative;
  padding-bottom: clamp(30px, 11.719vw, 150px);
  overflow: hidden
}
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	
.MAIN_05_KNB {width: 100%; 
  float: left; 
  position: relative;
  padding-bottom: clamp(30px, 11.719vw, 150px);
  overflow: hidden; padding: 20px
}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/


.MAIN_05_KNB .contents-container {
  padding: 0;
}


.MAIN_05_KNB .contents-inner {
  width: 100%;  padding: 0px; position: relative
}



/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	.MAIN_05_KNB .partner_div{ width: 100%;  float: left;  display: flex; flex-direction: row; grid-gap:clamp(20px, 4.688vw, 60px);}

	.MAIN_05_KNB .partner_div .fl{ width: 20%; height: 400px; padding: 50px 50px 0px 0px; float: left;  position: relative}
	.MAIN_05_KNB .partner_div .fr{  width:calc(80% - clamp(20px, 4.688vw, 60px)) ;  float: right;   background-color: #f0f2f6; border-radius: 40px 0px 0px 40px; padding: 0; position: relative}
	
	.MAIN_05_KNB .partner_div .fl .partner_div_bg { width:250%;  height:  400px; background-color: #f0f2f6; position: absolute; right: 0px; top: 0px;  gap:60px;border-radius: 0px 40px 40px 0px;}

.MAIN_05_KNB .partner_div .fr .partner_div_bg{  width: 150%;   height: 100%; background-color: #f0f2f6; border-radius: 40px 0px 0px 40px;position:absolute; left: 0px; top: 0px}



}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
	.MAIN_05_KNB .partner_div .fl{ width:30%; height: 400px; padding: 50px 50px 0px 0px; float: left;  position: relative}
	.MAIN_05_KNB .partner_div .fr{  width:calc(70% - clamp(20px, 4.688vw, 60px)) ;  float: right;   background-color: #f0f2f6; border-radius: 40px 0px 0px 40px; padding: 0; position: relative}
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	.MAIN_05_KNB .partner_div{ width: 100%;  float: left;  display: flex; flex-direction: column; grid-gap:clamp(20px, 4.688vw, 60px);}

	.MAIN_05_KNB .partner_div .fl{ width: 100%; height: auto;background-color: #f0f2f6; padding:20px; border-radius: 30px; float: left;  position: relative; }
	.MAIN_05_KNB .partner_div .fr{ width: 100%;   float: right;   background-color: #f0f2f6; border-radius: 30px 0px 30px 30px; padding: 0; position: relative}
	
	.MAIN_05_KNB .partner_div .fl .partner_div_bg { display: none}

.MAIN_05_KNB .partner_div .fr .partner_div_bg{  width: 100%;   height: 100%; background-color: #f0f2f6; border-radius: 30px 0px 0px 40px;position:absolute; left: 0px; top: 0px}



}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/




/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.MAIN_05_KNB .partner_div .fr .Corner_box {position: absolute; left:calc(100% - 180px); top:0px;
  width: auto;
  height: 100px; 
  background: #fff;	
  position: relative
}

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.MAIN_05_KNB .partner_div .fr .Corner_box {position: absolute; left:calc(100% - 120px); top:0px;
  width: auto;
  height:60px; 
  background: #fff;	
  position: relative
}

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
.MAIN_05_KNB .partner_div .fr .Corner_box .Corner1 {position: absolute; left: -50px; top:0px;
  width: 50px;
  height: 50px;
}
.MAIN_05_KNB .partner_div .fr .Corner_box .Corner1 .white-cutout {
  width: 100%;
  height: 100%;
  background: #fff;

  /* 왼쪽 아래에 꽉 찬 1/4 원을 투명하게 */
  -webkit-mask-image: radial-gradient(circle at bottom left, transparent 49px, black 50px);
  mask-image: radial-gradient(circle at bottom left, transparent 49px, black 50px);
}
	
	
.MAIN_05_KNB .partner_div .fr  .Corner_box .Corner2 {position: absolute; left:0px; top:50px;
  width: 50px;
  height: 50px;
}
.MAIN_05_KNB .partner_div .fr .Corner_box .Corner2 .white-cutout {
  width: 100%;
  height: 100%;
  background: #f0f2f6;


  /* 왼쪽 아래에 꽉 찬 1/4 원을 투명하게 */
  -webkit-mask-image: radial-gradient(circle at top right, transparent 49px, black 50px);
  mask-image: radial-gradient(circle at top right, transparent 49px, black 50px);
}
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	
	
.MAIN_05_KNB .partner_div .fr .Corner_box .Corner1 {position: absolute; left: -30px; top:0px;
  width: 30px;
  height: 30px;
}
.MAIN_05_KNB .partner_div .fr .Corner_box .Corner1 .white-cutout {
  width: 100%;
  height: 100%;
  background: #fff;

  /* 왼쪽 아래에 꽉 찬 1/4 원을 투명하게 */
  -webkit-mask-image: radial-gradient(circle at bottom left, transparent 29px, black 30px);
  mask-image: radial-gradient(circle at bottom left, transparent 29px, black 30px);
}
	
	
.MAIN_05_KNB .partner_div .fr  .Corner_box .Corner2 {position: absolute; left:0px; top:30px;
  width: 30px;
  height: 30px;
}
.MAIN_05_KNB .partner_div .fr .Corner_box .Corner2 .white-cutout {
  width: 100%;
  height: 100%;
  background: #f0f2f6;


  /* 왼쪽 아래에 꽉 찬 1/4 원을 투명하게 */
  -webkit-mask-image: radial-gradient(circle at top right, transparent 29px, black 30px);
  mask-image: radial-gradient(circle at top right, transparent 29px, black 30px);
}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/


