/*Content CSS*/
#main_vis {position: relative; z-index: 5; width: 100%; height:100vh; min-height:937px; display: flex; align-items: center; justify-content: center; max-height: 1080px;
padding-bottom:50px; }
#main_vis_slider {width:100%; position: absolute; top: 0; right: 0; }
#main_vis_slider .main_slide {height: 100%; height:100vh; min-height:937px; 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?v=241010');}
#main_vis_slider .main_slide.img02 { background-image:url('../img/main2.jpg?v=241010'); background-position: 70% 50%;}
#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'); background-position: 70% 50%;}
#main_vis_slider .main_slide.img06 { background-image:url('../img/main6.jpg?v=241010');}


/*main_typo*/
.main_typo_wrap {text-align: left; position: relative; z-index: 2; max-width:1600px; padding:0 50px; width: 100%;}
.main_typo_wrap.product {text-align: center; }

.main_typo {position: relative; z-index: 1; display: inline-flex; flex-direction: column; padding-bottom:80px;}
.main_typo h2 {font-size:80px; font-weight:300; color:#fff; line-height: 1.2; }
.main_typo_wrap.product .main_typo h2 {font-weight: 700;}
.main_typo h3 {font-size: 40px; font-weight: 300; color:#fff; line-height: 1.2;}
.main_typo h3 span {display: inline-block; margin-right: 12px; position: relative; top:8px;}
.main_typo p {display: flex; align-items: center; font-size:23px; font-weight:400; color:rgba(255,255,255,1); line-height:1.5; margin-bottom: 15px;}
.main_typo p span {display: block; flex-shrink: 0; margin-right: 27px; }
.main_typo p::after {content: ''; display: block; width: 100%; height:1px; background-color: rgba(255,255,255,1); }
.main_typo i {display: flex; margin-top: 30px; justify-content: center;}

/* #main_vis .arrows {display: flex; align-items: center; margin-left: 17px; }
#main_vis .slick-arrow { cursor: pointer; opacity: 1; border:0; font-size: 0; width:10px; height: 16px; display: block;}
#main_vis .slick-arrow.slick-prev { background:url('../img/prev.png?v=241010') no-repeat center; }
#main_vis .slick-arrow.slick-next { background:url('../img/next.png?v=241010') no-repeat center; margin-left: 14px;}
#main_vis .slick-arrow:focus {outline: none; border: none;} */
#main_vis .slick-arrow { cursor: pointer; position:absolute; z-index: 10; opacity: 1; border:0; font-size: 0; width:27px; height: 51px; top: 50%;  transform: translateY(-50%);}
#main_vis .slick-arrow.slick-prev { background:url('../img/prev.png?v=241014') no-repeat center; left: 70px;}
#main_vis .slick-arrow.slick-next { background:url('../img/next.png?v=241014') no-repeat center; right: 150px;}
#main_vis .slick-arrow:focus {outline: none; border: none;}

/* contr */
#main_vis .contr_wrap { max-width:1600px; padding:0 50px; width: 100%; position: absolute; bottom: 0; left: 50%;  transform: translateX(-50%); }
#main_vis .contr { width: 100%; display: flex; align-items: flex-end;}
/* paging number */
#main_vis .num_wr {display: flex; align-items:flex-end; position: relative; line-height: 1; }
#main_vis .num_wr span { font-size: 17px; font-weight:500; color:rgba(255, 255, 255, 1); display: block; font-family: "Poppins", sans-serif; }
#main_vis .num_wr i.slash { margin: 0 7px; position: relative; top:-0; font-style: normal; font-size: 17px; font-weight:500; color:rgba(255, 255, 255, 1); font-family: "Poppins", sans-serif; }
#main_vis .num_wr span.pagingInfo {color:#fff; font-size: 50px; font-weight: 700; line-height: .75; width: 65px; text-align: right;}
#main_vis .num_wr span::before {content: '0';}

/* dots */
#main_vis .slick-dots {position: absolute; left: 50%;  transform: translateX(-50%); bottom: 55px; z-index: 3; display: flex; justify-content: center;}
#main_vis .slick-dots li { margin-right:15px;  cursor: pointer;}
#main_vis .slick-dots li:last-child {margin-right: 0; }
#main_vis .slick-dots button { display: flex; align-items: center; justify-content: center; font-size: 0; width: 30px; height:30px; border:1px solid transparent; border-radius: 50%;  }
#main_vis .slick-dots button::after { content: '';display: block; width: 8px; height: 8px; border-radius: 50%; background-color: #fff; }
#main_vis .slick-dots li.slick-active button {border:1px solid rgba(255, 255, 255, 1);}

/* q_box_wrap */
#q_box_wrap {width:100%; max-width: 1500px;   display: flex; align-items: flex-end; margin-top: 55px;}
#q_box_wrap a {text-align: left; display: block; flex:1;padding:35px 40px 40px; line-height: 1; border:1px solid rgba(255,255,255,.3);position: relative; z-index: 1;
margin-right: -1px; border-bottom: 0;}
#q_box_wrap a::before {content: ''; display: block; width: 100%; height: 100%; left: 0; bottom:0; z-index: -1;  background:#ff7b11; transform-origin: bottom;
transition: all .3s; opacity:0;  position: absolute; }
/* #q_box_wrap a::after {content: ''; display: block; position: absolute; z-index: -2; width: 1px; height: 100%; background: #ddd; right: 0; top:0; opacity: 1;
transition:opacity .3s;} */
#q_box_wrap a:last-child::after {display: none;}
#q_box_wrap .title {position: relative; margin-bottom:55px; }
#q_box_wrap .title h3 {font-size: 15px; font-weight: 400; color:rgba(255, 255, 255, 0.8);  margin-bottom: 15px; transition: all .3s; position: relative; font-family: "Poppins", sans-serif; }
#q_box_wrap .title h2 {font-size: 25px; font-weight:800; color:#fff; transition: color .3s; }
#q_box_wrap .icon {display: block; position: absolute; right: 0; top:0;  transition: all .3s; }
#q_box_wrap span {font-size: 15px; font-weight: 400; color: rgba(255, 255, 255, 0.7); font-family: "Poppins", sans-serif;  }
#q_box_wrap span i {margin-left: 6px; width:13px; height: 12px; background:url("../img/q_box_arrow.png") 50%/contain no-repeat; transition: background-image .3s;
display: inline-block; position: relative; top:1px;}

/* hover */
#q_box_wrap a:hover .title h2,
#q_box_wrap a:hover .title h3 {color:#fff;}
/* #q_box_wrap a:hover .title h3 {padding-top: 22px;} */
#q_box_wrap a:hover::before {opacity: 1; transform: scaleY(1.13); }
#q_box_wrap a:hover::after {opacity: 0; }


/* scroll_down */
#scroll_down a { position:absolute; bottom:50px; z-index: 2; right: 80px; animation:ani 1.4s infinite ease; cursor: pointer; }
@keyframes ani {
    0%{bottom:50px;}
    50%{bottom: 65px;}
    100% {bottom:50px;}
}


@media screen and (max-width:1800px) {
    #scroll_down a { right: 30px;}
}

@media screen and (max-width:1600px) {
    #scroll_down {display: none;}

    #main_vis .slick-arrow.slick-prev {left: 30px;}
    #main_vis .slick-arrow.slick-next {right: 30px;}
}

@media screen and (max-width:1400px) {
    #q_box_wrap a {  padding: 35px 20px 40px;}
    #q_box_wrap .icon {max-width: 40px;}
}

@media screen and (max-width: 1024px) {
    .main_typo_wrap {padding:0 30px; text-align: center;}
    #main_vis, #main_vis_slider .main_slide {min-height: 700px; height: 700px; }

    .main_typo {  padding-bottom: 130px;}
    .main_typo h2 {font-size:60px;  }
    .main_typo h3 {font-size:30px;  line-height: 1.4;}
    .main_typo h3 span {    top: 10px; width: 110px;}
    .main_typo p { font-size: 20px; display: block; }
    .main_typo p span {margin: 0;}
    .main_typo p::after {display: none; }
    .main_typo i {margin-top: 10px;}


    #main_vis .contr_wrap {padding: 0 30px; }
    #main_vis .contr {justify-content: center;}
    #main_vis .num_wr {justify-content: center;}
    #main_vis .num_wr span,
    #main_vis .num_wr i.slash {font-size: 18px;}
    #main_vis .num_wr span.pagingInfo {font-size: 40px; width: 50px;}



    #q_box_wrap {flex-wrap: wrap; margin-top: 30px; }
    #q_box_wrap a {flex:inherit; width: 50%; padding: 20px; }
    #q_box_wrap .title {margin: 0; }
    #q_box_wrap .title h2 {font-size: 20px; }
    #q_box_wrap .title h3 {font-size: 13px; margin-bottom: 10px;}
    #q_box_wrap .icon {bottom: 50%;  transform: translateY(50%); display: flex; align-items: center; justify-content: center;}
    #q_box_wrap span {display: none; }

    #main_vis .slick-arrow {width: 25px; height: 35px; background-size: contain !important;}
    #main_vis .slick-arrow.slick-prev {left: 20px;}
    #main_vis .slick-arrow.slick-next {right: 20px;}


}


@media screen and (max-width: 640px) {
    #main_vis {padding-bottom: 30px;}
    #main_vis, #main_vis_slider .main_slide {min-height: 600px; height: 600px; }

    .main_typo_wrap {padding:0 20px; }
    .main_typo {  padding-bottom: 80px;}
    .main_typo h2 {font-size:40px;  }
    .main_typo h3 {font-size: 20px; }
    .main_typo h3 span {          top: 8px; width: 80px; margin-right: 5px;}
    .main_typo p {font-size: 16px; margin-bottom: 10px; }

    #main_vis .contr_wrap {padding: 0 20px;}
    #main_vis .num_wr span,
    #main_vis .num_wr i.slash {font-size: 16px;}
    #main_vis .num_wr span.pagingInfo {font-size: 30px; width: 35px;}


    #q_box_wrap { margin-top: 20px; }
    #q_box_wrap a {padding: 10px; }
    #q_box_wrap .title {margin: 0; }
    #q_box_wrap .title h2 {font-size: 15px; }
    #q_box_wrap .title h3 {font-size: 11px; margin-bottom:7px; letter-spacing: -.4px;}
    #q_box_wrap .icon {max-width: 30px;}

    #main_vis .slick-arrow {width: 25px; height: 30px;  }
    #main_vis .slick-arrow.slick-prev {left: 10px;}
    #main_vis .slick-arrow.slick-next {right: 10px;}

}
@media screen and (max-width: 480px) {
    .main_typo h2 {font-size:35px; }
    .main_typo p { font-size: 15px;}
    .main_typo p br {display: none;}
}