/*공통*/
.con1600 {width: 1600px; margin: 0 auto;}
.con1300 {width: 1300px; margin: 0 auto;}

.c_title h2 {font-size: 18px; font-family: 'Poppins',sans-serif; font-weight: 600; color:#bcc0cf; letter-spacing: 1.8px;}
.c_title h2 span {color:#3f5aab;}
.c_title h1 {font-size:38px; font-weight: 300; color:#222; line-height: 50px; letter-spacing: -1.9px; margin: 20px 0 30px 0;}
.c_title h1 span {font-weight: 700;}
.c_title p {font-size: 14px; font-weight: 300; color: rgba(34, 34, 34, 0.5); line-height: 26px; word-break: keep-all;}

.c_btn {width: 300px; margin-top: 55px;}
.c_btn a {width: 100%; height: 70px; line-height: 70px; border: 1px solid #dfe3ed; text-align: center; display: block; font-family: 'NanumGothic',sans-serif; font-size: 16px; color:#333; transition: all 0.3s;}
.c_btn a span {padding-left: 15px; transition: all 0.3s;}
.c_btn a:hover {border: 1px solid #3f5aab; color: #fff; background: #3f5aab;}
.c_btn a:hover span { padding-left: 20px; color:#fff;}

/*Content CSS*/
#c4_wrap {overflow: hidden; padding: 100px 0 120px 0; background: url('../img/c4_bg.png')no-repeat 50% 50%; background-size: cover;}
#c4_wrap .con1300 { max-width:1300px;}
#c4_wrap .top {width: 100%; border-bottom: 1px solid #dfe3ed; padding-bottom: 25px; position: relative; mar}
#c4_wrap .top .c_h1 {font-size:38px; font-weight: 300; color:#222; line-height: 50px; letter-spacing: -1.9px;}
#c4_wrap .top .c_h1 span {font-weight: 700;}

#c4_wrap .top .c4_btn {width: 100px; text-align: center; padding: 0; position: absolute; bottom: -1px; right: 0;}
#c4_wrap .top .c4_btn a { width: 100%; font-size: 16px; font-weight: 400; color:#3f5aab; display: block; padding-bottom: 20px;  border-bottom: 3px solid #3f5aab; }


/*슬릭슬라이더*/
#c4_article { position:relative;#}
#c4_title { width: 350px; position:absolute; top:0; left:0; z-index:5; padding-top: 38px;}
#c4_title h2 { font-weight:400; font-size:17px; font-family: 'NanumSquare',sans-serif; color: #3f5aab; margin-bottom: 24px;}
#c4_title h1 { font-weight:700; font-size:48px; font-family: 'NanumSquare',sans-serif; color:#434851; margin-bottom: 24px;}
#c4_title p { font-weight:300; font-size:16px; color:#a5abb5; line-height: 24px; word-break: keep-all;}
#c4_title .text { margin-top:40px; font-size:16px; font-weight:300;}

#c4_bg1 {width: 211px; height: 211px; position:absolute; top: -109px; left: 342px; z-index:1}
#c4_bg2 {width: 497px; height: 497px; position:absolute; bottom: -318px; left: -435px; z-index:1}

/*컨트롤러*/
#c4_arrow { font-size:0; width: 100%; display: flex; flex-direction: row; justify-content: space-between; position: absolute; top: 260px;}
#c4_arrow div {width:30px; height:57px; transition:all .3s ease;cursor: pointer; opacity: 0.5;  }
#c4_prev { background:url('../img/c4_prev.png') no-repeat 50% 50%; }
#c4_next { background:url('../img/c4_next.png') no-repeat 50% 50%;}
#c4_arrow div:hover {opacity: 1}

/*슬릭슬라이더_리스트*/
#c4_slider {z-index: 3; margin-top: 50px}
#c4_wrap .slick-list { overflow:hidden;}
.c4_box { margin-right: 35px; opacity:1; transition:all .3s ease; cursor: pointer; width: 410px;}
.c4_box a {display: block;}
#c4_slider .c4_box a:focus {outline: none!important;}
.c4_img {width: 100%; overflow: hidden;}
.c4_img img {transform: scale(1); transition: all 0.3s}

.c4_txt_box { margin-top: 18px; display: flex; flex-direction: row; align-items: center; width: 100%;}
.c4_num {width: 56px; height: 56px; background:#afb2bd; color:#fff; font-family: 'NanumSquare',sans-serif; font-weight: 700; line-height: 56px; text-align: center; font-size: 20px; transition: all 0.3s}
.c4_txt {width: calc(100% - 56px); padding-left: 20px;}
.c4_txt h1 {font-size: 17px; font-weight: 500;color:#434851;text-overflow: ellipsis; white-space: nowrap; overflow: hidden }
.c4_txt p {font-size: 12px; font-family: 'NanumGothic',sans-serif; color:#a5abb5; margin-top: 10px;}

.c4_box a:hover .c4_num {background: #3f5aab}
.c4_box a:hover .c4_img img {transform: scale(1.1);}

/*스크롤바*/
.gauge_bar { position:relative; margin:75px auto 0 auto; padding-right:121px; z-index: 2}
.gauge_bar .bg { position:relative; width:100%; height:3px; background:#dfe3ed;}
.gauge_bar .bg span { position:absolute; top:0; left:0; width:12.5%; height:3px; background:#3f5aab; transition:all .3s ease;}
.gauge_bar .num { position:absolute; bottom:-10px; right:0; font-size:22px; font-weight:400; color:#aaafb8;  font-family: 'NanumSquare',sans-serif; }
.gauge_bar .num span {font-weight:700; color:#3f5aab;}






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

}

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

}

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

}
