/* common */
#c1_wrap .c_inner { width: 100%; max-width: 1400px; margin:0 auto; position: relative; padding:0 50px; border:0px solid #ddd; border-width: 0 1px;}
#c1_wrap .c_tit h2 {position: relative;}
#c1_wrap .c_tit h2::before {content: ''; display: block; width: 5px; height:80%;  position: absolute; left: -50px; top:12%; background: #072d60;}
#c1_wrap .c_tit p {margin-top: 25px;}
/* font size */
#c1_wrap .fs_60 {font-size: 60px; font-weight: 800; color:#000; line-height: 1.2; font-family: 'Montserrat', sans-serif; }
#c1_wrap .fs_18 {font-size: 18px; font-weight: 400; color:#555; line-height: 1.83; letter-spacing: -.36px;}

/* c_btn */
#c1_wrap .c_btn a { position: relative; display: inline-flex; font-size: 16px; color: #000; font-weight: 500; padding-right: 33px; z-index: 1; transition: all .3s; white-space: nowrap; align-items: center; height: 45px; font-family: 'Montserrat', sans-serif; }
#c1_wrap .c_btn .arrow { position: relative; top:0; display:block; background:url('../img/c_btn_arrow.png') no-repeat center #f7f7f7; font-size: 0; width: 23px;
height: 25px; margin-left: 13px; transition: all .3s; }
#c1_wrap .c_btn a::after { content: ""; position: absolute; right: 0; top: 0; width: 45px; height: 45px; border: 1px solid #000; z-index: -1; transition: all .3s; }
#c1_wrap .c_btn a:hover .arrow { transform: translateX(10px);}


/* c1 */
#c1_wrap {overflow: hidden ;background: #f7f7f7; position: relative;z-index: 1;}
#c1_wrap::after {content: ''; display: block; width: 50%; height: 100%; position: absolute; z-index: -1; background: #fff; right: 0; top:0; }
#c1_wrap .c_inner {padding:110px 50px 120px; }
#c1_wrap .flex_wrap {display: flex; }
#c1_wrap .txt_area {flex-shrink: 0; margin-right: 78px; }
#c1_wrap .txt_area  {padding-top: 25px; position:relative; z-index: 1; }
#c1_wrap .txt_area .c_btn {margin-top: 85px; margin-left: 174px;}
#c1_wrap .slide_area { width:100%; position:relative; z-index: 2; }


/* slider */
#c1_wrap .slider .slick-track,
#c1_wrap .slider .slick-list { overflow: visible; }

#c1_wrap .slider { width:100%; position: relative;}
#c1_wrap .slider .slick-slide { margin-right:22px; transition: opacity .3s; opacity: 0; pointer-events: none;}
#c1_wrap .slider .slick-current,
#c1_wrap .slider .slick-current ~ .slick-slide { opacity:1; pointer-events: auto;}

#c1_wrap .slider .slick-slide a { display: block; position: relative; z-index: 1;}
/* #c1_wrap .slider .slick-slide a::before {content: ''; display: block; width: 100%; height: 100%; position: absolute;  z-index: 1; opacity: .5;
  background-image: linear-gradient(to bottom, #000, #fff); mix-blend-mode: multiply; } */

#c1_wrap .slider .slick-slide .img {width: 100%; overflow: hidden; }
#c1_wrap .slider .slick-slide .txt { display: flex; flex-direction: column; justify-content: flex-end; position: absolute; left: 0; top:0; flex-direction: column;
width: 100%; height: 100%; transition:all .3s; z-index: 1; padding: 40px 40px 35px 40px; opacity:0; background-color: rgba(0,11,25,.8); text-align: left; }
#c1_wrap .slider .slick-slide .txt h3 { font-weight: 700; color: #fff;  font-size:24px; width: 100%; margin-bottom: 20px; padding-bottom: 20px;
border-bottom: 1px solid rgba(255,255,255,.2); width: 100%; text-overflow: ellipsis; overflow: hidden; transition: color .3s ease; white-space: nowrap; }
#c1_wrap .slider .slick-slide .txt ul li {font-size: 16px; font-weight: 400; color:rgba(255, 255, 255, 0.7); letter-spacing: -.32px; width: 100%; text-overflow: ellipsis; overflow: hidden; transition: color .3s ease; white-space: nowrap; width: 100%; text-overflow: ellipsis; overflow: hidden; transition: color .3s ease; white-space: nowrap;}
#c1_wrap .slider .slick-slide .txt ul li i {color:#fff; margin-right: 12px; font-size: 110%; position: relative; top:1px; }
#c1_wrap .slider .slick-slide .txt ul li + li {margin-top: 10px; }
#c1_wrap .slider .slick-slide .arrow {position: absolute; top:40px; right: 40px; }

#c1_wrap .slider .slick-slide a:hover .txt {opacity: 1;}



/* controller */
#c1_wrap .controller { position: absolute; left: -86px; top: 50%;  transform: translateY(-50%); display: flex; flex-direction: column; align-items: center; z-index: 3;}
/* arrow */
#c1_wrap .arrows {display: flex; flex-direction: column; align-items: center; margin-bottom: 40px; }
#c1_wrap .slick-arrow { cursor: pointer; transition: all 0.3s; font-size: 0; width: 20px; height: 11px; }
#c1_wrap .slick-arrow.slick-prev { background:url('../img/prev.png') no-repeat center center; }
#c1_wrap .slick-arrow.slick-next { background:url('../img/next.png') no-repeat center center; margin-top: 33px; }
#c1_wrap .slick-arrow:focus {outline: none; }
/* dots */
#c1_wrap .slick-dots {display: flex; flex-direction: column; }
#c1_wrap .slick-dots li + li {margin-top: 28px; }
#c1_wrap .slick-dots button {font-size: 0; width: 14px; height: 14px; background: #ddd; transition: background-color .3s; }
#c1_wrap .slick-dots .slick-active button {background-color: #072d60; }







@media screen and (max-width: 1599px) {
    #c1_wrap .controller {left: 50px; flex-direction: row; top:auto; transform: none; bottom: 80px;}
    #c1_wrap .arrows {flex-direction: row; margin: 0 20px 0 0;}
    #c1_wrap .slick-arrow {transform: rotate(-90deg);}
    #c1_wrap .slick-arrow.slick-next {margin: 0 0 0 20px;}
    #c1_wrap .slick-dots {flex-direction: row; }
    #c1_wrap .slick-dots li + li {margin: 0 0 0 20px; }

}

@media screen and (max-width: 1400px) {
    /* common */
    #c1_wrap .c_inner {border-width: 0;}


}

@media screen and (max-width: 1024px) {
    /* common */
    #c1_wrap {padding:70px 0; text-align: center;}
    #c1_wrap .c_inner {padding:0 30px;}
    #c1_wrap .c_tit h2::before {position: static; width: 50px; height: 5px; margin: 0 auto 25px;}
    #c1_wrap .c_tit p {margin-top: 15px ;}
    /* font size */
    #c1_wrap .fs_60 {font-size: 40px; }
    #c1_wrap .fs_18 {font-size: 16px;}



    /* c1 */
    #c1_wrap::after {display: none;}
    #c1_wrap .flex_wrap { flex-wrap: wrap;}
    #c1_wrap .txt_area { padding-top: 0; width: 100%; margin:0;}
    #c1_wrap .txt_area br {display: none; }
    #c1_wrap .txt_area .c_btn {margin:20px 0 0;}
    #c1_wrap .slide_area { width: 100%; margin:40px 0 0; }
    #c1_wrap .controller {position: static; justify-content: center; margin-top: 40px;}

    /* 2분할 */
    #c1_wrap .slider { width: 100%; }
    #c1_wrap .slider .slick-track,
    #c1_wrap .slider .slick-list { overflow: hidden; }
    #c1_wrap .slider {width: calc(100% + 20px); position: relative; left: -10px; }
    #c1_wrap .slider .slick-slide { margin:0 10px; opacity: 1; pointer-events: auto;}
    #c1_wrap .slider .slick-slide .img img {width: 100%;}
    #c1_wrap .slider .slick-slide .txt {padding: 30px; opacity: 1; background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(0,11,25,.5) 100%)}
    #c1_wrap .slider .slick-slide .txt h3 {font-size: 20px;}
    #c1_wrap .slider .slick-slide .txt ul li {font-size: 15px;}
    #c1_wrap .slider .slick-slide .arrow {top: 30px; right: 30px; display: none;}

}

@media screen and (max-width:640px) {
    /* common */
    #c1_wrap {padding:50px 0;}
    #c1_wrap .c_inner {padding:0 20px;}
    #c1_wrap .c_tit h2::before {height: 4px; margin: 0 auto 20px;}
    /* font size */
    #c1_wrap .fs_60 {font-size: 30px; }
    #c1_wrap .fs_18 {font-size: 14px;}
    /* c_btn */
    #c1_wrap .c_btn a {font-size: 14px; height: 35px; padding-right: 25px;}
    #c1_wrap .c_btn a::after {width: 35px; height: 35px;}
    #c1_wrap .c_btn .arrow {height: 19px; width: 19px; background-size: contain; margin-left: 7px;}
    #c1_wrap .c_btn a:hover .arrow { transform: translateX(5px);}

    /* c1 */
    #c1_wrap .slide_area {margin:30px 0 0; }
    #c1_wrap .controller {margin-top: 30px;}
    #c1_wrap .txt_area .c_btn {margin: 15px 0 0;}
    #c1_wrap .slick-dots button { width: 12px; height: 12px;}
    #c1_wrap .slick-dots li + li {margin: 0 0 0 15px}

    #c1_wrap .slider .slick-slide .txt {padding: 20px;}
    #c1_wrap .slider .slick-slide .txt h3 {font-size: 18px; margin-bottom: 15px; padding-bottom: 15px;}
    #c1_wrap .slider .slick-slide .txt ul li {font-size: 14px;}
    #c1_wrap .slider .slick-slide .arrow {top: 20px; right: 20px; }

}

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

    /* 2분할 */
    #c1_wrap .slider {width:100%; left: -0; }
    #c1_wrap .slider .slick-slide { margin:0; }


}
