/*Content CSS*/
#main_vis{position: relative; overflow: hidden; width: 100%; height: 100vh; min-height: 800px; max-height: 1080px; z-index: 2; padding-bottom: 90px;}
#main_vis br.mob{display: none;}
/* font-style */
#main_vis .fs_80{font-size: 80px; letter-spacing: -1.6px; color: #fff; line-height: 1.38; }
#main_vis .fs_80 span{font-size: 0.625em; letter-spacing: -1px; font-weight: 200;}
#main_vis .fs_80 span b{font-weight: 300;}
/* main_inner */
#main_vis .main_inner{width: 100%; height: 100%; padding: 0 50px; margin: 0 auto; max-width: 1900px;}

/* main_slider */
#main_vis .main_slider{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
#main_vis .main_slider .slide{height: 100vh; min-height: 800px; max-height: 1080px; background: 50% / cover no-repeat; position: relative;}
#main_vis .main_slider .slide::before{content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0,0,0,.4);}
#main_vis .main_slider .slide1{background-image: url('../img/main1.jpg');}
#main_vis .main_slider .slide2{background-image: url('../img/main2.jpg');}
#main_vis .main_slider .slide3{background-image: url('../img/main3.jpg');}

/* flex_wrap */
#main_vis .flex_wrap{display: flex; justify-content: space-between; align-items: flex-end;}
#main_vis .flex_wrap .left{flex-grow: 1;}
#main_vis .flex_wrap .left .bot{display: flex; align-items: center; margin-top: 50px;}

/* arrows */
#main_vis .arrows{display: flex; align-items: center; margin-right: 29px;}
#main_vis .arrows button + button{margin-left: 8px;}
#main_vis .arrows button{font-size: 0; display: flex; align-items: center; justify-content: center; width: 43px; height: 43px; border-radius: 50%; background-color: rgba(255,255,255,.15); transition: .3s;}
#main_vis .arrows button::before{content: ''; display: block; width: 15px; height: 13px; 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 */
#main_vis .progress_wr {flex-grow: 1; height: 3px; background-color: rgba(255,255,255,.3); position: relative;}
#main_vis .progress_bar { width:1px; height:3px; opacity: 1; position:absolute; left:0; top:-0; z-index:10; transition-property: width; transition-duration: 5000ms;
transition-timing-function: ease; }
#main_vis .progress_bar.progress_bar_active { width:100%; height:100%; opacity: 1; background: #fff; transition-property: width; transition-duration: 5000ms; transition-timing-function: ease; }
#main_vis .progress_bar.progress_bar_remove {width:0; height:100%; opacity: 1; background: #fff; transition-property: width; transition-duration: .1s; transition-timing-function: ease;}

/* scroll_down */
#main_vis .scroll_down{display: none; flex-shrink: 0; margin-left: 74px; position: relative; top: -20px;}
#main_vis .scroll_down a{animation:ani 1.4s infinite ease; position: relative; display: flex; align-items: center; justify-content: center; width: 148px; height: 148px; border-radius: 50%; border: solid 1px #fff; transition: .3s;}

@keyframes ani {
    0%{bottom:0;}
    50%{bottom: -15px;}
    100% {bottom:0;}
}

@media screen and (min-width: 1901px) {
    /* main_inner */
    #main_vis .main_inner{padding: 0 110px;}
}

@media screen and (min-width: 1025px) {
    #main_vis .scroll_down{display: block;}
    #main_vis .scroll_down a:hover{background-color: #04056b; border-color: #04056b;}
    #main_vis .arrows button:hover{background-color: #04056b;}
}

@media screen and (max-width: 1600px) {
    #main_vis{padding-bottom: 50px;}
    /* font-style */
    #main_vis .fs_80{font-size: 75px;}

    /* scroll_down */
    #main_vis .scroll_down{margin-left: 50px;}
    #main_vis .scroll_down a{width: 120px; height: 120px;}
    #main_vis .scroll_down a img{width: 28px;}

}

@media screen and (max-width: 1400px) {
    #main_vis, #main_vis .main_slider .slide{min-height: 600px;}
    /* font-style */
    #main_vis .fs_80{font-size: 65px;}

    /* scroll_down */
    #main_vis .scroll_down a{width: 100px; height: 100px;}
    #main_vis .scroll_down a img{width: 25px;}
}
@media screen and (max-width: 1280px) {

}
@media screen and (max-width: 1024px) {
    #main_vis{min-height: 0; max-height: 100%; height: 600px; padding: 60px 0 0;}
    #main_vis .main_slider .slide{min-height: 0; max-height: 100%; height: 600px;}

    /* font-style */
    #main_vis .fs_80{font-size: 55px;}

    /* main_inner */
    #main_vis .main_inner{padding: 0 30px;}

    /* flex_wrap */
    #main_vis .flex_wrap{align-items: center; position: relative; text-align: center; top: -50px;}
    #main_vis .flex_wrap .left .bot{position: absolute; bottom: -20px; width: calc(100% - 60px);}

    #main_vis br.mob{display: block;}

}

@media screen and (max-width: 640px) {
    #main_vis, #main_vis .main_slider .slide{height: 500px; }

    /* font-style */
    #main_vis .fs_80{font-size: 40px; line-height: 1.3;}
    #main_vis .fs_80 span{font-size: .5em; line-height: 1.5; letter-spacing: -1.6px; display: inline-block; margin-bottom: 10px;}

    /* main_inner */
    #main_vis .main_inner{padding: 0 20px;}

    /* flex_wrap */
    #main_vis .flex_wrap .left .bot{width: calc(100% - 40px);}

    /* arrows */
    #main_vis .arrows{margin-right: 15px;}
    #main_vis .arrows button{width: 30px; height: 30px;}
    #main_vis .arrows button::before{width: 13px; height: 11px;}

}

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


}