/* 공통 */
#c4_wrap .c_inner {width: 100%; margin:0 auto; position: relative;}
#c4_wrap .c_title {text-align: center;}
#c4_wrap .c_title h2 {font-size:14px; font-weight: 400; color:#0867ae; letter-spacing:2px; font-family: 'Montserrat'; margin-bottom: 15px; text-transform: uppercase;}
#c4_wrap .c_title h1 {font-size: 34px; font-weight: 800; color:#333; font-family: 'NanumSquare',sans-serif; }

/*Content CSS*/
#c4_wrap {background: #0768af; position: relative;text-align: center; padding-top: 60px; margin-top: 30px;}
.c4_title {padding: 0 20px;}
.c4_title h1 {font-size: 18px; font-weight: 300; color:#fff ;line-height: 40px; font-family: 'NanumSquare',sans-serif; word-break: keep-all;}
.c4_title h1 b {font-weight: 700; }
.c4_title h1 span {color:#61bd50;}
.c4_title > img {position: absolute; top:-30px;}
.c4_title > img.apos1 {left:90px;}
.c4_title > img.apos2 {right:90px;}

#c4_wrap .c_inner {z-index: 1; }
#c4_wrap .c_inner > img {position: absolute; z-index: -1;}


/* c2_list */
#c4_list {display: flex; width: 100%; flex-wrap: wrap; margin-top: 30px;}
#c4_list > li {width: 50%;}
#c4_list > li a {display: flex; width:100%; flex-direction: column; align-items: center; padding:  40px 20px; transition: all .3s ease; border-right:1px solid rgba(255,255,255,.2); border-top:1px solid rgba(255,255,255,.2);  }
#c4_list > li:nth-child(2n) a {border-right: 0;}
#c4_list .c4_icon {height: 67px; line-height: 67px;}
#c4_list .c4_icon img {transition: transform 500ms;}
#c4_list h2 {font-size:11px; font-weight: 500; color:rgba(255,255,255,.45);  font-family: 'Montserrat'; margin:25px 0 10px; text-transform: uppercase;}
#c4_list h1 {font-size:18px; font-weight: 700; color:#fff; margin-bottom: 20px; font-family: 'NanumSquare',sans-serif; }
#c4_list span {display: block; padding:12px 0; width: 122px; border-top:1px solid #fff; border-bottom:1px solid #fff; color:#fff; text-align: center; font-size:14px;
font-weight: 300; color:rgba(255,255,255,.68); transition: all .4s ease; font-family: 'Montserrat'; position: relative; z-index: 1; }
#c4_list span::after {position: absolute; content: ""; width: 0; height: 100%; top: 0; right: 0; z-index: -1; background: #fff; transition: all 0.3s ease;}

/* hover */
#c4_list > li a:active {background: rgba(255,255,255,.05); }
#c4_list > li a:active .c4_icon img {transform: rotateY(180deg);}
#c4_list > li a:active  span {color:#0867ae; }
#c4_list > li a:active  span::after {left: 0; width: 100%;}





@keyframes pulse-border {

}

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

}

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

}

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

}

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

}