@font-face {
    font-family: 'Pretendard-Bold';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

.main-slider.slick-initialized {  opacity: 1;  visibility: visible; min-height:710px;}
.slick-slide {  position: relative;  height: 710px;}
.slick-slide::before {  background-color: #000;  opacity: 0.3;  z-index: 1;}
.slick-slide iframe {  position: relative;  pointer-events: none; width:100%}

.slick-slide video {  display: block;  position: absolute;  top: 50%;  left: 40%;  min-width: 90%;
  min-height: 100%;  width: 90%;  height: auto;  transform: translate(-50%, -50%);}
.slick-slide .slide-media {  -webkit-animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1); animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1);}

.sliderContainer { margin-top:90px;  position: relative; }
.slider {  width: 100%; padding-left:210px ;  margin: 0;}
.slick-slide { min-height: 710px; position:relative; overflow:hidden; background-repeat:no-repeat; background-position: center;
  color: white;  padding:  0 ;  font-size: 30px;  text-align: center;}
.slick-slide .txtBox {text-align:left; position:absolute; bottom:70px; left:70px; position:absolute; color: #fff; overflow:hidden;}
.slick-slide div.txtBox .caption span{ display:block; padding: 0px 0 0 0; font-weight:500;    margin: 0; font-size: 20px;  }
.slick-slide div.txtBox .caption2 span{ display:block; padding: 10px 0 0 0;     font-size: 45px; line-height: 62px; letter-spacing:-1px;  font-family: 'Pretendard-Bold';  }
.slick-slide div.txtBox .caption3 span{  display:block; padding: 20px 0 0px 0;  font-size: 18px; }

.slick-slider .slick-track{background-color:#eee;}	

.progressBarContainer {  position: absolute;  top:40% ; transform:translate(0%,-50%);  width:175px;  left:35px;}
.progressBarContainer div { font-size:13px; font-family: 'Pretendard-Bold';
  display: block;  width:100% ;  padding: 0;  cursor: pointer;  /*float: left;*/  color: #555;}
.progressBarContainer > div {margin:12px 0;}
.progressBarContainer > div  h3 {  margin:8px 0;   display:inline-block;}
.progressBarContainer div:last-child {  margin-right: 0;}
.progressBarContainer div span.progressBar {  display: inline-block;   width: 99px;  height: 2px;  margin:.25em 10px;  
background-color: rgba(0, 0, 0, 0.1);}
.progressBarContainer div span.progressBar .inProgress {  background-color: rgba(0, 0, 0, 1);  width: 0%;  height: 2px;}

/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1500px) {
}
@media (max-width: 1400px) {
}
@media (max-width: 1023px) {
.main-slider.slick-initialized {  min-height:auto;}	
.slider {   padding-left:0px ;   }
.slick-slide { min-height: 550px ; height:550px; background-size:cover}
/*.slick-slide .slide-media {display:none;}
.slick-slide.slide1 {background-image:url(../img/slide1_m.jpg) !important; }*/
.slick-slide.slide2 {background-image:url(../img/slide2_m.jpg) !important; }
.slick-slide.slide3 {background-image:url(../img/slide3_m.jpg) !important; }
.slick-slide.slide4 {background-image:url(../img/slide4_m.jpg) !important; }
.sliderContainer { margin-top:65px;  }	
.slick-slide .txtBox {text-align:center; position:absolute; bottom:auto; top:35%; left:0px; padding:0 15px; position:absolute; color: #fff; overflow:hidden;}
.slick-slide div.txtBox .caption span{ display:block; padding: 0px 0 0 0; font-weight:500;  margin: 0; font-size: 15px;  }
.slick-slide div.txtBox .caption2 span{ display:block; padding: 10px 0 0 0;  font-weight:500;    font-size: 28px; line-height:36px;    }
.slick-slide div.txtBox .caption3 span{  display:block; padding: 15px 0 0px 0;  font-size: 15px; }



.progressBarContainer { top:auto ; bottom:20px; transform:translate(-50%,0%);  width:auto;  left:50%; text-align:center;}
.progressBarContainer div { font-size:13px; width:35px ; float: left;  color:#fff;}
.progressBarContainer div span.progressBar { display: inline-block;   width: 100%; margin:.25em 0px;
background-color: rgba(255,255, 255, 0.3);}
.progressBarContainer > div {margin:12px 5px;}
.progressBarContainer div {  display:inline-block; text-align:center;  padding: 0;   color: #fff;}
.progressBarContainer > div  h3 {width:100%;  margin:8px 0;   display:inline-block;}
.progressBarContainer div span.progressBar .inProgress {  background-color: rgba(255, 255,255, 1);  width: 0%;  height: 2px;}

}
@media (max-width: 768px) {	
	.slick-slide video{left:50%; min-width:100%; width:auto; height:80%; min-height:80%;}
	
}
@media (max-width: 640px) {
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {
}