/* 공통  */
#c2_wrap .c_inner {width: 1300px; margin:0 auto; position: relative;  }
#c2_wrap .c_title h1 {font-size:72px; font-weight: 700; color:#000; font-family: 'Raleway', sans-serif;}

/*Content CSS*/
#c2_wrap {background: #fff;   padding:100px 0 110px;position: relative;  text-align: center; z-index: 1; overflow: hidden; min-height: 693px; }
#c2_wrap .tab {display: none;}
#c2_wrap .tab.active {display: block;}

/* top */
#c2_wrap .top {display: flex; justify-content: space-between; }
#c2_wrap .top .btn_wr {display: flex; align-items: center;justify-content: flex-end;}
/* tab_btn */
#c2_wrap .top .tab_btn {display: flex ; }
#c2_wrap .top .tab_btn li::after {content: ''; display: inline-block; width: 1px ;height: 18px; background-color: #ddd; margin:0 27px; position: relative; top: 3px;}
#c2_wrap .top .tab_btn li:last-child::after {display: none;}
#c2_wrap .top .tab_btn li a {font-size:18px; font-weight: 500; transition: all .3s ease; color:#333; padding-bottom: 15px ; cursor: pointer;}
#c2_wrap .top .tab_btn li a:hover {color:#0371fb; }
#c2_wrap .top .tab_btn li a.active { color:#0371fb;}
/* 상단 더보기 버튼  */
#c2_wrap .top .btn_wr > a {display: flex; align-items: center;justify-content: center; transition: all .3s ease; width: 51px; height: 51px; background-color: #000;
margin-left:34px;  }
#c2_wrap .top .btn_wr > a img {transition: all .3s ease;}
#c2_wrap .top .btn_wr > a:hover {background-color: #0371fb;}
#c2_wrap .top .btn_wr > a:hover img {transform: rotate(90deg);}


/* slider */
.c2_slider_wrap { width: 100%; margin-top:40px; }
.c2_slider {width: calc(100% + 10px); position: relative; left: -10px;}
.c2_slider .slick-track {min-width: 100%; }
.c2_box {padding-left:10px; margin:0 30px 0 0;}
.c2_box a {background: #fff; text-align: left; outline: none; display: block; width: 100%; height:430px; border:1px solid #ddd; position: relative; }
.c2_box a::before {content:''; display: block; width: calc(100% + 2px); height: calc(100% + 2px); position: absolute; left: -1px; top:-1px; border:3px solid #0371fb;
opacity: 0; transition: opacity .3s ease; }

.c2_box a .img {height: 280px; width: 100%; overflow: hidden; position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; }
.c2_box a .img::before {content: 'NO IMAGE'; font-size:20px; font-weight: 500; color:#000;  font-family: 'Raleway', sans-serif; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); text-align: center; z-index: -1;}
.c2_box a > h2 {height: 35px; text-align: center; line-height: 33px; background: #000; transition: all .3s ease; font-size:12px; font-weight: 400;
color:#fff; position: absolute; top: 48px; left: -10px;display: inline-block; padding:0 15px; z-index: 2; }
.c2_box a .txt {width: 100%; height: calc(100% - 280px); text-align: center; transition: all .3s ease; display: flex; align-items: center; border-top: 1px solid #ddd;
justify-content: center; flex-direction: column; background-color: #fff; padding:0 40px; }
.c2_box a .txt span {display: inline-block; border-radius: 14px; padding:4px 25px 5px; background-color: #0371fb; transition: all .3s ease; font-size:13px; font-weight: 700;
color:#fff; margin-bottom: 12px;}
.c2_box a .txt h1 {font-size:19px; font-weight: 500; color:#000; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; width: 100%; transition: color .3s ease; }
/* hover */
.c2_box a:hover::before {opacity: 1; }
.c2_box a:hover > h2 {background-color: #0371fb; }
.c2_box a:hover .txt {background-color: #0371fb; border-color: #0371fb; }
.c2_box a:hover .txt span {color:#0371fb;background-color: #fff;}
.c2_box a:hover .txt h1 {color:#fff; }


/* c2_controller */
.c2_controller {display: flex; align-items: center; margin-top:50px;}
.c2_controller .progress_bar {width: 1180px; height: 2px; background: #f4f4f4; margin-right: 40px; position: relative;}
.c2_controller .progress_bar span { position:absolute; top:0; left:0; height:2px; background:#0371fb; transition:all .3s ease; display: block;}
.c2_controller .num {font-size:17px; font-weight: 400; color:#000; }
.c2_controller .num span {color:#000;  }
.c2_controller .num span::after {content: '/'; display: inline-block; margin:0 10px;}
.c2_controller .num b {font-weight: 400;}

/* arrow */
.c2_arrow {position: absolute; width: 100%; height: 0; top:42%; transform:translateY(-50%); display: flex; justify-content: space-between;}
.c2_arrow .slick-arrow {cursor: pointer; position: absolute; bottom:0; }
.c2_arrow .c2_prev {left:-100px; }
.c2_arrow .c2_next {right:-100px; }








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

}

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

}

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

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

}