/*Content CSS*/
#main_visual {width: 100%; height: 840px; position: relative;}
.main-carousel{height:840px; padding:0; display:block; position: absolute; top: 0; left: 0; z-index: 3}
.main-carousel .li{height:840px; background-size:cover; background-position:center; position:relative}
.main-carousel .jarallax { min-height: 840px;}
.main-carousel .img01 { background-image:url('../img/main1.jpg');}
.main-carousel .img02 { background-image:url('../img/main2.jpg');}
.main-carousel .img03 { background-image:url('../img/main3.jpg');}
.main-carousel .img04 { background-image:url('../img/main4.jpg');}
.main-carousel .li .copy_area_wrap {max-width:1240px; margin:auto; padding:0 20px}
.main-carousel .li .copy_area{position: absolute; top:50%; -ms-transform: translateY(-50%); transform: translateY(-50%);margin:0 auto; color:#fff; z-index:2}
.main-carousel .li .copy_area .hangul {letter-spacing:-2px}
.main-carousel .li .copy_area h2{font-size:60px;font-weight:bold; line-height:1.3; letter-spacing:1px; text-align:left}
.main-carousel .li .copy_area h2:after { content: " ";display: block; margin-top:30px; text-align:left; width:40px; height: 3px; background-color:#fff; clear: both;}
.main-carousel .li .copy_area h3{max-width:420px;font-size:16px;font-weight:100;text-align:left;margin:15px 0 40px 0; color:#e4e4e4;}
.main-carousel .li .copy_area h4{font-size:14px;font-weight:600;text-align:left; width:160px; border:1px solid rgba(255, 255, 255, .4)}
.main-carousel .li .copy_area h4:hover { background-color:#74314f; border:1px solid #74314f; color:#fff; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}
.main-carousel .li .copy_area h4 a{color:#fff;padding:10px 40px;display:block; text-align:center}
.main-carousel .li .copy_area_movie{ width:100%; position:relative}
.main-carousel .li .copy_area_movie h2{color:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:40px; line-height:2em; text-align:left; z-index:1;}
.main-carousel .li .copy_area_movie h2:after { content: " ";display: block; margin:50px 0 0; width:40px; height: 3px; background-color:#fff; clear: both;}
.main-carousel .li .copy_area_movie h3{color:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:42px; line-height:2em; text-align:left; margin:15px 0 40px 0; z-index:1;}

/*mark*/
#main_mark_wrap {width: 820px; height: 100%; position: absolute; top: 0; right: 120px; display: flex; flex-direction: row; justify-content: space-between; z-index: 9; }
#main_mark_wrap div {width: 1px; height: 100%; background: rgba(255,255,255,0.2);}

/*페이져*/
.main-carousel .owl-dots{width:1500px; position:absolute; top: 230px; left: 50%; transform: translateX(-50%); z-index: 9; counter-reset: dots; }
.main-carousel .owl-dot:before {counter-increment:dots; content: '0'counter(dots);}
.main-carousel .owl-dots .owl-dot{ margin-right:20px; transition: all 0.2s ease; background: transparent; font-size: 24px; font-weight: 400; color:#fff; font-family: 'NanumSquare',sans-serif; opacity: 0.5}
.main-carousel .owl-dots .owl-dot::after { display: inline-block; vertical-align: middle; width: 0; height: 1px; margin: 0 15px; content: ""; transition: all 0.2s ease; background: #fff;}
.main-carousel .owl-dots .owl-dot.active{ opacity: 1}
.main-carousel .owl-dots .owl-dot.active::after { width: 110px; content: ""; display: inline-block;}
.main-carousel .owl-dots .owl-dot:focus {outline: none; border: none;}

/*컨트롤러*/
.main-carousel .owl-nav{ width: 100%; display: flex; flex-direction: row; justify-content: space-between; position: absolute; top: 47%; z-index: 20; padding: 0 55px;}
.main-carousel .owl-nav button {width: 45px; height: 45px; line-height: 45px; text-align:center; cursor:pointer; transition: all 0.3s;}
.main-carousel .owl-nav .owl-prev{ background:url('../img/main_prev.png')no-repeat 50% 50%;}
.main-carousel .owl-nav .owl-next{background:url('../img/main_next.png')no-repeat 50% 50%;}

/*메인타이포*/
.main_typo_wrap {width: 1500px; position: absolute; top: 300px; left: 50%; transform: translateX(-50%); text-align: left; z-index: 2}
.main_typo_wrap h1 {font-size: 120px;  font-family: 'Oxanium', cursive; font-weight: 600; color: #fff; margin-bottom: 30px;}
.main_typo_wrap p {font-size: 24px; font-family: 'NanumSquare',sans-serif;  color: #fff; line-height: 36px; letter-spacing: 1.2px; font-weight: 300;}
.main_typo_wrap p b {font-weight: 900;}

/*progress*/
.slide-progress { width: 1500px; height: 170px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 9;}
.slide-progress .bar {position: relative; width: 1px; height: 100%; background: rgba(255,255,255,0.2)}
.slide-progress .bar div { position: absolute; top: 0; left: 0; height: 0; max-height: 170px; width: 1px; background: #fff;}
.slide-progress p {position: absolute;  top: 27px; left: -25px; width: 100px;  color: #fff; font-size: 12px; font-weight: 300; transform: rotate(-90deg);}

/*main_navi*/
#main_navi {width: 980px; position: absolute; bottom: 0; right: 0; background: #0932a9;z-index: 9; padding: 40px 50px;;}
#main_navi ul {display: flex; flex-direction: row; align-items: center;}
#main_navi ul li a {font-family: 'NanumSquare',sans-serif;  color: #fff; font-weight: 500; color:rgba(255,255,255,0.7); font-size: 17px; display: inline-block; transition: all 0.2s; line-height: 1;}
#main_navi ul li::after {display: inline-block; vertical-align: middle; content: ""; width: 1px; height:10px; background: rgba(255,255,255,0.2); margin: 0 30px;
position: relative; top:-2px;}
#main_navi ul li:last-child::after {display: none;}
#main_navi ul li a:hover {color:#fff;}


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

}

@media screen and (max-width: 960px) {
    .main-carousel .li .copy_area h2 {font-size: 36px;}
    .main-carousel .li .copy_area h3 {font-size: 15px;}
    .main-carousel .owl-nav { display:none}
}

@media screen and (max-width: 640px) {
    .main-carousel .li .copy_area { top:40%;max-width:320px}
    .main-carousel .li .copy_area h2 { font-size:40px; word-break:keep-all}
}
