/*Content CSS*/
#main_vis {position: relative;}
#main_vis .main_slider { position:relative; }
.main-carousel {padding:0; display:block; position: relative;}
.main-carousel .li { height: calc(100vh - 200px); background-size:cover; background-position:center; position:relative; min-height: 737px;}
.main-carousel .img01 { background-image:url('../img/main2.jpg');}
.main-carousel .img02 { background-image:url('../img/main3.jpg');}
/* .main-carousel .img03 { background-image:url('../img/main1.jpg');} */
.main-carousel .li .cover {position:absolute;top:0;left:0;width:100%;height:100%;background:url('../img/main_ptn.png') repeat center; z-index:1; }


/*메인타이포*/
.main_typo_wrap { max-width: 1300px; width:100%; position: absolute; left: 50%; top:50%; transform: translate(-50%,-50%); z-index: 2; }
.main_typo { position:relative; z-index: 1; text-align: center; line-height: 1; }
.main_typo h1 { font-size:73px; font-weight: 700; color:#fff; word-break: keep-all; }
.main_typo h1 span { font-weight: 300; }
.main_typo p { font-size:24px; font-weight: 300; color: #fff; word-break: keep-all; margin-top: 45px; }


/*컨트롤러*/
#m_nav {position:absolute; top:50%; z-index: 3; display: flex; left:0; width: 100%; border:0px solid red; padding:0 110px; margin-top:-45px; justify-content: space-between; height: 0; }
#m_nav button {text-align:center; cursor:pointer;transition: all 0.2s; display: block; text-decoration: none; opacity: 1; color:#fff; border:0; box-shadow: none; font-size:0; width: 30px; height: 57px; }
#m_nav .owl-prev {background: url('../img/m_prev.png') 50% 50% no-repeat;}
#m_nav .owl-next {background: url('../img/m_next.png') 50% 50% no-repeat;}
#m_nav button:hover {opacity: 1;}
#m_nav button:focus {outline: none; border: none;}


.owl-dots { justify-content: center; align-items: center;  position:absolute; left:0; width:100%; bottom:50px; display: none; }
.owl-dots .owl-dot { font-size: 0; outline: none; width:15px; height: 15px; border:1px solid rgba(255,255,255,0.5); border-radius: 50%; background:none; margin:0 8px; transition: all .3s; }
.owl-dots .owl-dot.active { background:#ddd; border-color:rgba(221,221,221,0.1); width:30px; border-radius: 20px;  }



#scroll_down { position:absolute; left:50%; transform: translateX(-50%); bottom:70px; z-index: 2;  animation:ani 1.4s infinite ease; cursor: pointer; }
@keyframes ani {
    0%{bottom:70px;}
    50%{bottom: 60px;}
    100% {bottom:70px;}
}



/* main nav */
#main_nav { position:relative; z-index: 2; background-color: #f7f7f7; }
#main_nav .c_inner { max-width: 1300px; width:100%; margin:0 auto; display: flex; }
#main_nav .c_tit { position:relative; width: 475px; height: 320px; padding:70px 65px; background-color: #219914; z-index: 1; line-height: 1; margin-top: -120px; }
#main_nav .c_tit:after { content:""; position:absolute; left:0; width:100%; top:0; height: 100%; background:url('../img/main_nav_bg.png') no-repeat center / cover; opacity: 0.7; mix-blend-mode: multiply; z-index: -1; }
#main_nav .c_tit h1 { font-size: 55px; font-weight: bold; color: #fff; word-break: keep-all; }
#main_nav .c_tit h2 { margin-bottom: 23px; font-size: 18.5px; color: #fff; text-transform: uppercase; letter-spacing: 3.7px; word-break: keep-all; }
#main_nav .c_tit p { margin-top: 25px; font-size: 18.5px; line-height: 1.65; color: #fff; word-break: keep-all; }

#main_nav .nav_list { width:calc(100% - 475px); padding:40px 0; display: flex; }
#main_nav .nav_list li { flex: 1; display: flex; justify-content: center; align-items: center; border-right: 1px solid #ddd; }
#main_nav .nav_list li:last-child { border-right: 0; }
#main_nav .nav_list li a { line-height: 1; text-align: center; }
#main_nav .nav_list b { display: block; margin:16px 0 13px; font-size: 14px; font-weight: normal; color: #219914; word-break: keep-all; }
#main_nav .nav_list h3 { font-size: 20px; font-weight: 500; color: #000; word-break: keep-all; }

#main_nav .nav_list li i img { transition: all .5s; }


/* hover */
@media screen and (min-width:1024px) {
    #main_nav .nav_list li:hover i img { transform: rotateY(180deg);}
}



/* 반응형 */
@media screen and (max-width:1500px) {

    /* main_vis */
    #m_nav { padding: 0 20px; top:53%; }
    #m_nav button { transform: scale(0.8); }

    .main_typo h1 { font-size: 60px; }
    .main_typo p { font-size: 20px; margin-top: 40px; }

    #scroll_down { display: none; }

    /* main_nav */
    #main_nav .c_tit { width: 400px; padding:70px 40px; }
    #main_nav .c_tit br { display: none; }
    #main_nav .nav_list { width: calc(100% - 400px); }

}

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

    /* main_vis */
    .main-carousel .li { height: 500px; min-height: auto; }

    #m_nav { display: none; }
    .main_typo_wrap { padding:0 60px; top:52%; }
    .main_typo h1 { font-size: 50px; line-height: 1.3; }
    .main_typo p { font-size: 20px; line-height: 1.5; }

    .owl-dots { display: flex; }

    /* main_nav */
    #main_nav .c_tit { width: 350px; height: auto; margin: 0; }
    #main_nav .c_tit h1 { font-size: 40px; }
    #main_nav .c_tit h2 { margin-bottom: 17px; }

    #main_nav .nav_list { width: calc(100% - 350px); padding:30px; flex-wrap: wrap; }
    #main_nav .nav_list li { flex:none; width: 50%; padding:0 0 25px; }
    #main_nav .nav_list li:nth-child(even) { border-right: 0; }
    #main_nav .nav_list li:nth-child(n+3) { padding:25px 0 0; border-top: 1px solid #ddd; }


}

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

    /* main_vis */
    .main_typo_wrap { padding:0 30px; }
    .main_typo h1 { font-size: 38px;  line-height: 1.5; }
    .main_typo p { margin-top: 25px; font-size: 18px; line-height: 1.7; }

    .owl-dots { bottom: 30px; }

    /* main_nav */
    #main_nav .c_inner { flex-wrap: wrap; }

    #main_nav .c_tit { width: 100%; padding:30px; text-align: center; }
    #main_nav .c_tit h1 { font-size: 33px; }
    #main_nav .c_tit h2 { margin-bottom: 15px; font-size: 14px; }
    #main_nav .c_tit p { margin-top: 15px; font-size: 16px; }


    #main_nav .nav_list { width: 100%; padding:30px 20px; }
    #main_nav .nav_list li i img { width: 33px; }
    #main_nav .nav_list h3 { font-size: 18px; }
    #main_nav .nav_list b { margin: 14px 0 10px; font-size: 13px; }

}