/*Content CSS*/
#main_vis {padding:0; display:block; position: relative; z-index: 2; background-color: #333; }
#main_vis_slider {width: 100%; height:100vh; min-height:937px; }
#main_vis_slider .main_slide {height: 100vh; min-height: 937px; position: relative; z-index: 1;   position:relative; background: url('../img/main1.jpg') 50% 50% no-repeat; background-size:cover; }
#main_vis_slider .main_slide.img02 { background-image:url('../img/main2.jpg');}
#main_vis_slider .main_slide.img03 { background-image:url('../img/main3.jpg');}
#main_vis_slider .main_slide.img04 { background-image:url('../img/main4.jpg');}
#main_vis_slider .main_slide.img05 { background-image:url('../img/main5.jpg');}

/*main_typo*/
.main_typo_wrap {width: 1300px; position: absolute; top: 320px; left: 50%; z-index: 2; transform: translateX(-50%); text-align: left;}
.main_typo {position: relative; }
.main_typo h2 {display: block; margin-bottom: 25px; font-size: 18px; font-weight: 500; color: #fff; letter-spacing: 14.4px;}
.main_typo h1 {display: block; font-size: 130px; font-weight:700; color:#fff; font-family: 'Nanum Myeongjo'; line-height: 130px; }
.main_typo p {font-size:24px; color:#fff; font-weight: 400;  position: absolute; left: 0; top: 270px; }

.main_typo .flex {display: flex; justify-content: space-between; align-items: flex-end; margin:40px 0 25px;}
.main_typo .flex .controller {display: flex; align-items: center; position: relative; top: -10px;}
#play_btn > a {cursor: pointer; width:20px; text-align: center; position: relative; top: -5px; }
#play_btn .stop {font-size: 20px; color: #fff;  display: block;}
#play_btn .play {font-size: 20px; color: #fff; display: none; }

/*컨트롤러*/
#main_vis_slider .slick-arrow {width: 30px; height: 57px; text-align:center; cursor:pointer;opacity: 0.5; transition: all 0.3s; position:absolute; z-index: 10;
top:50%; transform:translateY(-50%); border:0; font-size:0; }
#main_vis_slider .slick-arrow.slick-prev { background:url('../img/m_prev.png')no-repeat 50% 50%; left:45px;}
#main_vis_slider .slick-arrow.slick-next { background:url('../img/m_next.png')no-repeat 50% 50%;  right: 45px; }
#main_vis_slider .slick-arrow:focus {outline: none; border: none;}
#main_vis_slider .slick-arrow:hover {opacity: 1;}
/* dots */
#vis_dots .slick-dots { z-index: 2; display: flex ;justify-content: flex-end; align-items:center; z-index: 4; margin-right: 30px ;}
#vis_dots .slick-dots li {margin-right: 30px; }
#vis_dots .slick-dots li:last-child {margin-right: 0; }
#vis_dots .slick-dots button {border:0; background: transparent; transition: all .3s ease; font-size:18px; font-weight: 400; color: rgba(255, 255, 255, 0.25); outline: none; font-family: 'NanumSquare',sans-serif;}
#vis_dots .slick-dots button::before {content: '0'; }
#vis_dots .slick-dots li.slick-active button { color:#fff;  font-weight: 800}


/* progress bar */
#main_vis .slider-progress { width: 1300px; height: 2px; background: rgba(255,255,255,0.3);}
#main_vis .slider-progress .progress { width: 0%; height: 2px; background: #fff; transition: ease; }

/* scroll_down */
#scroll_down {z-index: 4;position: absolute; bottom: 80px; left:50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; justify-content: center;}
#scroll_down img {margin-bottom: 5px; animation: scroll_arrow 1.9s ease-in-out infinite;}
#scroll_down img:nth-child(2) {animation-delay: .3s}
#scroll_down p {font-size: 12px; font-weight: 500; color: #fff; letter-spacing: 1.2px; margin-top:10px; font-family: 'Montserrat'; }
#scroll_down img {margin-bottom: 5px; animation:scroll_arrow 1.9s ease-in-out infinite; }
#scroll_down img:nth-child(2) {animation-delay: .3s;}
@keyframes scroll_arrow {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}


@media screen and (max-width:1700px) {
    #main_vis_slider .slick-arrow  {display: none !important;}
}

@media screen and (max-width:1300px) {

}
@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 960px) {
}

@media screen and (max-width: 640px) {

}

@media screen and (max-width: 375px) {

}
