
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.MAIN_sw_KNB { width: 100%; float: left;
  overflow: hidden;
  position: relative;
  padding-top:clamp(0px, 7.813vw, 100px)!important;
  padding-bottom:  clamp(50px, 7.813vw, 100px)!important;

}
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.MAIN_sw_KNB { width: 100%; float: left;
  overflow: hidden;
  position: relative;
  padding-top:clamp(0px, 7.813vw, 100px)!important;
  padding-bottom:  clamp(50px, 7.813vw, 100px)!important; min-height: 500px;

}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/


.MAIN_sw_KNB .contents-inner {
  width: 100%; float: left;
}

.MAIN_sw_KNB .title-area {
  margin-bottom:4rem;padding: 0px clamp(20px, 6.250vw, 80px);
  width: 100%;  display: flex;
  justify-content:flex-start;  align-items:flex-start; flex-direction:row; box-sizing: border-box; gap:50px ; position: relative

}

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
	.MAIN_sw_KNB .title-area .title_box{ width:360px; float: left; position: relative}
	.MAIN_sw_KNB .title-area .title_box .title{ width: auto; float: left;  color: #2a2a2a; font-weight: 700;   font-size: calc(var(--tit-md-size) * 1.2) ; letter-spacing: -1px; margin-bottom: 1rem}
.MAIN_sw_KNB .title-area .title_box .title em{color: #253e90; font-weight: 800; font-size:calc(var(--tit-md-size) * 1.05);}
.MAIN_sw_KNB .title-area .title_box .stitle{ width: auto; float: left;  color: #0e0e0e; font-weight:500;   font-size: calc(var(--tx-sm-size) * 0.9); letter-spacing: -1px; line-height: 150%}

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	.MAIN_sw_KNB .title-area .title_box{ width:100%; float: left; position: relative}
	.MAIN_sw_KNB .title-area .title_box .title{ width: auto; float: left;  color: #2a2a2a; font-weight: 700;   font-size: calc(var(--tit-md-size) * 1)!important ; letter-spacing: -1px; margin-bottom: 30px}
.MAIN_sw_KNB .title-area .title_box .title em{color: #253e90; font-weight: 800; font-size:calc(var(--tit-md-size) * 1.05);}
.MAIN_sw_KNB .title-area .title_box .stitle{ width: auto; float: left;  color: #0e0e0e; font-weight:500;   font-size: calc(var(--tx-sm-size) * 0.9); letter-spacing: -1px; line-height: 150%}

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.MAIN_sw_KNB .title-area .more_go{ width: calc(100% - 500px);  float: left;  height: 1px; background-color: #dadaed; position: relative; margin-top:2rem}
.MAIN_sw_KNB .title-area .more_go:before{ width:65px; height: 65px; background-color:var(--primary);; border-radius: 100%; position: absolute; right:-75px; top:-35px; content: "\ebb5";  color: #fff; font-family: unicons-line; font-size: 35px;
 display: flex; justify-content:center;  align-items: center; flex-direction:column; box-sizing: border-box; padding-bottom: 5px}
.MAIN_sw_KNB .title-area .more_go:after{width: 10px; height: 10px;  border-radius: 100%; position: absolute; left: -20px; top:-5px; background-color:var(--primary);; content: "";  transition: all 0.5s;
-moz-transition: all 0.5s; /* Firefox 4 */
-webkit-transition: all 0.5s; /* Safari and Chrome */
-o-transition: all 0.5s; /* Opera */  
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: .3s ease-in-out;
transition: .3s ease-in-out;}	


}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	
.MAIN_sw_KNB .title-area .more_go{ width: 100%;  float: left;  height: 1px; background-color: #dadaed; position: relative; margin-top:3rem; position: absolute; right: 0px; top:10px; padding: 0px 30px}
.MAIN_sw_KNB .title-area .more_go:before{ width:40px; height: 40px; background-color: var(--primary);; border-radius: 100%; position: absolute; right:0px; top:-20px; content: "\ebb5";  color: #fff; font-family: unicons-line; font-size: 35px;
 display: flex; justify-content:center;  align-items: center; flex-direction:column; box-sizing: border-box; padding-bottom: 5px}
.MAIN_sw_KNB .title-area .more_go:after{width: 10px; height: 10px;  border-radius: 100%; position: absolute; left: 0px; top:-5px; background-color: var(--primary);; content: "";  transition: all 0.5s;
-moz-transition: all 0.5s; /* Firefox 4 */
-webkit-transition: all 0.5s; /* Safari and Chrome */
-o-transition: all 0.5s; /* Opera */  
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: .3s ease-in-out;
transition: .3s ease-in-out;}	


}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



.MAIN_sw_KNB .slide-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.MAIN_sw_KNB .swiper {
  overflow: visible;
  margin: 0;
  width: 100vw;
}

.MAIN_sw_KNB .swiper-wrapper {
  align-items: center;
  min-height: clamp(200px, 30.469vw, 390px);
}

.MAIN_sw_KNB .swiper-slide {
  transform: translateX(-3rem);
  padding: 3rem;
  width: 33rem;
  border-radius: 3.5rem;
  background: #f0f2f6; 
  position: relative!important
}
.MAIN_sw_KNB .swiper-slide a{position: absolute; right:-10px!important; bottom:-10px!important;}

.MAIN_sw_KNB .swiper-slide a .more_go2 { width:70px; height: 70px; background-color: #2a2a2a; border-radius: 100%;  
 display: flex; justify-content:center;  align-items: center; flex-direction:column; box-sizing: border-box; padding-bottom: 5px; border: 14px solid #fff; z-index: 9999; position: relative}

.MAIN_sw_KNB .swiper-slide a .more_go2:before {  content: "\ebb5";  color: #567cfc; font-family: unicons-line; font-size: 25px;}

.MAIN_sw_KNB .swiper-slide-active  a .more_go2 { width:70px; height: 70px; background-color: var(--primary);; border-radius: 100%;  
 display: flex; justify-content:center;  align-items: center; flex-direction:column; box-sizing: border-box; padding-bottom: 5px; border: 14px solid #fff; z-index: 9999; position: relative}

.MAIN_sw_KNB .swiper-slide-active  a .more_go2:before {  content: "\ebb5";  color: #fff; font-family: unicons-line; font-size: 25px;}




.MAIN_sw_KNB .swiper-slide a .more_go2 .Corner1 {position: absolute; left: -50px; bottom:-15px;
  width: 49px;
  height: 49px;
}
.MAIN_sw_KNB .swiper-slide a .more_go2 .Corner1 .white-cutout {
  width: 100%;
  height: 100%;
  background: #fff;

  /* 왼쪽 아래에 꽉 찬 1/4 원을 투명하게 */
  -webkit-mask-image: radial-gradient(circle at top left, transparent 37px, black 38px);
  mask-image: radial-gradient(circle at top left, transparent 37px, black 38px);
}


	
.MAIN_sw_KNB .swiper-slide a .more_go2 .Corner2 {position: absolute; right:-15px; top:-50px;
  width: 49px;
  height: 49px;
}
.MAIN_sw_KNB .swiper-slide a .more_go2 .Corner2 .white-cutout {
  width: 100%;
  height: 100%;
  background: #fff;


  /* 왼쪽 아래에 꽉 찬 1/4 원을 투명하게 */
  -webkit-mask-image: radial-gradient(circle at top left, transparent 37px, black 38px);
  mask-image: radial-gradient(circle at top left, transparent 37px, black 38px);
}


.MAIN_sw_KNB .swiper-slide:hover {
  border-color: var(--primary);
}

.MAIN_sw_KNB .swiper-slide-next {
  transform: translateX(3rem);
}

.MAIN_sw_KNB .swiper-slide-next~.swiper-slide {
  transform: translateX(3rem);
}
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.MAIN_sw_KNB .swiper-slide-active {
  transform: translate3d(0px, 0px, 0px) scale(1.234);
  border-color: var(--primary);
}

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.MAIN_sw_KNB .swiper-slide-active {
  transform: translate3d(0px, 0px, 0px) scale(1);
  border-color: var(--primary);
}

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



.MAIN_sw_KNB .badge.badge-round {
  padding: 0.4rem 1.6rem;
  max-width: 100%;
  font-weight: var(--fw-bold);
  transition: background 0.3s;
}

.MAIN_sw_KNB .swiper-slide-active .badge {
  background: var(--primary);
}

.MAIN_sw_KNB .swiper-slide .sw_tt {
 
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  text-overflow: ellipsis;
  margin: 1.8rem 0;
  color: #253e90; font-weight: 700; font-size:calc(var(--tit-md-size) * 0.9);	
}

.MAIN_sw_KNB .swiper-slide .sw_img {
 width: 100px!important; margin-top: 20px
}
.MAIN_sw_KNB .swiper-slide .sw_img .wg_img1{
 width: 100%!important
}
	.MAIN_sw_KNB .swiper-slide .sw_img .wg_img1 img{
 width: 100%!important
}

/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {.MAIN_sw_KNB .swiper-slide .sw_tx {

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  text-overflow: ellipsis;
  height: 6rem;  
  transition: height 0.3s;
  color: #0e0e0e; font-weight:500!important;   font-size: calc(var(--tx-sm-size) * 0.7); letter-spacing: -0.5px; line-height: 180%; color: #333
}

.MAIN_sw_KNB .swiper-slide-active .sw_tx {
  height: 7.53rem;
}
.MAIN_sw_KNB .swiper-slide .sw_img {
 width: 100px!important
}
.MAIN_sw_KNB .swiper-slide-active .sw_img .wg_img1{
 width: 100%!important
}
	.MAIN_sw_KNB .swiper-slide-active .sw_img .wg_img1 img{
 width: 100%!important
}
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {.MAIN_sw_KNB .swiper-slide .sw_tx {

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  text-overflow: ellipsis;
  height: 3rem!important;  
  transition: height 0.3s;
  color: #0e0e0e; font-weight:500;   font-size: calc(var(--tx-sm-size) * 0.7); letter-spacing: -1px; line-height: 130%
}

.MAIN_sw_KNB .swiper-slide-active .sw_tx {
  height: 4.53rem!important;font-size: calc(var(--tx-sm-size) * 0.8)!important;font-weight:400; 
}
.MAIN_sw_KNB .swiper-slide-active .sw_img {
 width: 80px!important; margin-top: 10px
}
.MAIN_sw_KNB .swiper-slide-active .sw_img .wg_img1{
 width: 100%!important
}
	.MAIN_sw_KNB .swiper-slide-active .sw_img .wg_img1 img{
 width: 100%!important
}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



.MAIN_sw_KNB .swiper-slide a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 1.4rem;
  font-weight: var(--fw-medium);
}

.MAIN_sw_KNB .swiper-slide i {
  display: flex;
  align-items: center;
}

.MAIN_sw_KNB .swiper-slide .ico-arrow::after {
  content: "";
  width: 1.2rem;
  height: 1.2rem;

}

.MAIN_sw_KNB .slide-control {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  position: relative;
  margin-top: 4rem;
  width: 100%;
}

.MAIN_sw_KNB .swiper-pagination-progressbar {
  position: static;
  background: var(--white);
}

.MAIN_sw_KNB .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--primary);
}

.MAIN_sw_KNB .btn-wrap {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.MAIN_sw_KNB .btn-wrap [class*="btn-"] {
  display: flex;
  align-items: center;
  width: 1.6rem;
  height: 1.6rem;
  background: transparent;
  border: none;
  color: var(--text-color1);
}

.MAIN_sw_KNB .btn-wrap [class*="btn-"] img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.MAIN_sw_KNB .btn-wrap .btn-pause,
.MAIN_sw_KNB .btn-wrap .btn-play {
  display: none;
  font-size: 2rem;
}

.MAIN_sw_KNB .btn-wrap .btn-pause.active,
.MAIN_sw_KNB .btn-wrap .btn-play.active {
  display: flex;
}

@media (max-width: 1200px) {
  .MAIN_sw_KNB .swiper {
    width: calc(100% + 8rem);
  }
}

@media (max-width: 992px) {
  .MAIN_sw_KNB {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }

  .MAIN_sw_KNB .title-area {
    margin-bottom: 5.4rem;
  }

  .MAIN_sw_KNB .swiper {
    width: 100%;
  }

  .MAIN_sw_KNB .swiper-wrapper {
    min-height: 200px;
  }

  .MAIN_sw_KNB .swiper-slide {
    transform: translateX(-2rem);
    padding: 2.6rem 2rem;
    width: 27rem;
  }

  .MAIN_sw_KNB .swiper-slide:not(.swiper-slide-active):hover {
    border-color: transparent;
  }

  .MAIN_sw_KNB .swiper-slide-active {
    transform: scale(1.148);
  }

  .MAIN_sw_KNB .swiper-slide-next {
    transform: translateX(2rem);
  }

  .MAIN_sw_KNB .swiper-slide-next~.swiper-slide {
    transform: translateX(2rem);
  }

  .MAIN_sw_KNB .swiper-slide .badge {
    padding: 0.4rem 1.6rem;
  }

  .MAIN_sw_KNB .swiper-slide .sw_tt {
    margin: 1.4rem 0 1.2rem;
  }

  .MAIN_sw_KNB .swiper-slide-active .sw_tx {
    height: 9.9rem;
  }

  .MAIN_sw_KNB .btn-wrap {
    gap: 0.6rem;
  }

  .MAIN_sw_KNB .slide-control {
    margin-top: 4.6rem;
  }

  .MAIN_sw_KNB .btn-wrap .btn-pause,
  .MAIN_sw_KNB .btn-wrap .btn-play {
    font-size: 1.8rem;
  }
}