/*Content CSS*/
#main_vis {position: relative; z-index: 5; width: 100%; height:100vh; min-height:900px; max-height: 1080px; display: flex; align-items: center; justify-content: center;  padding:0 ;}
#main_vis::before{content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 365px; opacity: 0.3; mix-blend-mode: multiply; background-image: linear-gradient(to top, #000, #fff); z-index: 1;}
#main_vis_slider {width: 100%; height: 100%; min-height:900px; max-height: 1080px; position: absolute; top: 0; left: 0; }
#main_vis_slider .main_slide {height:100vh; min-height:900px; max-height: 1080px;  z-index: 1;  background-size:cover; background-position:center;  position:relative; background-repeat: no-repeat; display: flex; align-items: center; justify-content: center; outline: none; }
#main_vis_slider .main_slide.img01 { background-image:url('../img/main1.jpg');}
#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_typo*/
.main_typo_wrap {text-align: left; position: relative; z-index: 2; max-width:1600px; padding:0 50px; width: 100%; top: -10px;}
.main_typo {position: relative; z-index: 1; }
.main_typo h2 {font-size:87px; font-weight:700; color:#fff; line-height:1.2; }
.main_typo h2::before{content: ''; display: block; width: 50px; height: 5px; background-color: #fff; margin-bottom: 20px;}
.main_typo p {font-size:26px; color:#fff; line-height: 1;  margin:45px 0 40px;}

/*컨트롤러*/

#main_vis .arrows{position: absolute; top: 50%; transform: translateY(-50%); left: 80px;}
#main_vis .arrows button {cursor:pointer; display: block; text-decoration: none; font-size:12px; font-family: 'Montserrat'; font-weight: 300; color: #fff;}
#main_vis .arrows button + button{margin-top: 18px;}
#main_vis .arrows button::before{content: ''; display: inline-block; width: 12px; height: 9px; margin-right: 9px; background: 50% / cover no-repeat;}
#main_vis .arrows button.slick-prev::before { background-image:url('../img/prev.png'); }
#main_vis .arrows button.slick-next::before { background-image:url('../img/next.png');}


/* progress */
.progress_wr {width:1px;  height: 100%; background: rgba(255,255,255,.3); position: absolute; right: 109px;bottom:0;}
.progress_bar { width:1px; height:1px; opacity: 1; position:absolute; left:0; top:-0; z-index:10; transition-property: height; transition-duration: 5000ms;
transition-timing-function: ease; }
.progress_bar.progress_bar_active { width:100%; height:100%; opacity: 1; background: #fff; transition-property: height; transition-duration: 5000ms; transition-timing-function: ease; }
.progress_bar.progress_bar_remove {width:100%; height:0; opacity: 1; background: #fff; transition-property: height; transition-duration: .1s; transition-timing-function: ease;}

/* paging number */
#main_vis .num_wr {display: flex; align-items:baseline; justify-content: flex-end;}
#main_vis .num_wr span {font-size: 20px; font-weight: 300; color:rgba(255, 255, 255, 0.4); font-family: 'Poppins', sans-serif; display: block; }
#main_vis .num_wr span.slash {margin:0 10px; }
#main_vis .num_wr span.pagingInfo {color:#fff; font-size: 80px; font-weight: 600; line-height: 1;}

#main_vis .link_wrap{position: absolute; width: 100%; max-width: 1500px; bottom: -70px; z-index: 5;}
#main_vis .link_list {display: flex;}
#main_vis .link_list li{width: 25%; border: solid 1px rgba(255,255,255,.3); border-bottom: 0; transition: .3s;}
#main_vis .link_list li + li{border-left: 0;}
#main_vis .link_list li a{display: block; transition: .3s; text-align: right;}
#main_vis .link_list li a .text{padding: 48px 43px; text-align: left;}
#main_vis .link_list li a .text i{display: inline-block; line-height: 45px; min-height: 45px; margin-bottom: 17px; transition: .5s;}
#main_vis .link_list li a .text h6{font-size: 25px; font-weight: 800; line-height: 1; color: #fff; margin-bottom: 15px;}
#main_vis .link_list li a .text p{font-size: 16px; font-weight: 400; color: rgba(255, 255, 255, 0.7);  white-space: nowrap;}
#main_vis .link_list li a .plus{display: inline-flex; align-items: center; justify-content: center; width: 70px; height: 70px; background-color: rgba(255,255,255,.27);}
#main_vis .link_list li:hover{border-color: #862633;}
#main_vis .link_list li:hover a{background-color: #862633;}
#main_vis .link_list li:hover a .text i{transform: rotateY(180deg);}

/* scroll_down */
.scroll{position: absolute; bottom: 83px; right: 49px; animation:ani 1s infinite; z-index: 2;}
@keyframes ani{
            0%{bottom: 83px;}
            50%{bottom: 93px;}
            100% {bottom: 83px;}
         }
.scroll a{display: flex; flex-direction: column-reverse; align-items: center;}
.scroll a span{writing-mode: tb; color: #fff; transform: rotate(180deg); letter-spacing: 2px; margin-bottom: 15px; font-size: 12px;}
@media screen and (max-width:1700px) {
    .progress_wr {display: none;}
    .scroll{display: none;}
    #main_vis .arrows{left: initial; right: 50px;}
}