/* 공통 */
#c3_wrap .c_inner {width:1280px; margin: 0 auto;}
#c3_wrap .m_title h2 {font-size:18px; font-weight: 500; color:#076ab6; margin-bottom: 10px;font-family: 'Montserrat'; letter-spacing: .2px;}
#c3_wrap .m_title h1 {font-size:48px; font-weight: 400; color:#231815; font-family: 'S-CoreDream-4Regular';}
#c3_wrap .m_p {font-size:15px; font-weight: 300; color:#231815; line-height: 25px; }

/*Content CSS*/
#c3_wrap {padding:100px 0; text-align: center; background: url('../img/dot_ptn.png') 50% 50% repeat;}
#c3_wrap .m_title h2 {margin-bottom:0;}
#c3_wrap .m_title h1 {font-size:44px;}
#c3_wrap ul {margin-top:40px; display: flex; justify-content: space-between; }
#c3_wrap ul li a {display: flex; width:280px; height:280px; justify-content: center; align-items: center; position: relative; flex-direction: column; background: #fff;
 box-shadow: 2px 2px 6px 0 rgba(149, 149, 149, 0.16); transition: all .3s ease;}
#c3_wrap ul li a h2 {font-size:22px; font-weight: 400; color:#231815; font-family: 'S-CoreDream-4Regular'; margin:30px 0 20px; transition: all .3s ease;}
#c3_wrap ul li:nth-child(n+3) h2 {font-weight: 500; font-family: 'Montserrat'; }
#c3_wrap ul li a p {font-size:12px; font-weight: 500; color:#076ab6; letter-spacing: -.24px; font-family: 'Montserrat';  transition: all .3s ease;}
#c3_wrap ul li a p span {    display: inline-block; width: 20px; height: 1px; position: relative; background: #076ab6; margin-left: 10px; transition: all .3s ease; left: 0;}
#c3_wrap ul li a p span::after {    content: ''; position: absolute; display: block;width: 7px; height: 1px;background: #076ab6; right: 0; transform: rotate(35deg); top: -3px; transition: all .3s ease;}
#c3_wrap ul li a h3 {font-size:20px; font-weight: 500; color:#231815; font-family: 'Montserrat'; transition: all .3s ease;}
#c3_wrap ul li a h4 {font-size:15px; font-weight: 500; color:#231815; font-family: 'Montserrat'; transition: all .3s ease;}
#c3_wrap ul li a::after {content: ''; display: block; position: absolute; width:calc(100% - 10px); height:calc(100% - 10px); left:5px; top:5px; border:1px solid #f9f9f9;
transition: all .3s ease;}

/* 아이콘 백그라운드  */
#c3_wrap ul li a > div {transition: all .3s ease;}
#c3_wrap ul li:nth-child(1) a > div {width:94px; height:88px; background: url('../img/c3_icon1.png') 50% 50% no-repeat; }
#c3_wrap ul li:nth-child(2) a > div {width:101px; height:92px; background: url('../img/c3_icon2.png') 50% 50% no-repeat; }
#c3_wrap ul li:nth-child(3) a > div {width:58px; height:88px; background: url('../img/c3_icon3.png') 50% 50% no-repeat; }
#c3_wrap ul li:nth-child(4) a > div {width:108px; height:80px; background: url('../img/c3_icon4.png') 50% 50% no-repeat; }
#c3_wrap ul li:nth-child(1) a:hover > div {background-image: url('../img/c3_icon1_hv.png');}
#c3_wrap ul li:nth-child(2) a:hover > div {background-image: url('../img/c3_icon2_hv.png');}
#c3_wrap ul li:nth-child(3) a:hover > div {background-image: url('../img/c3_icon3_hv.png');}
#c3_wrap ul li:nth-child(4) a:hover > div {background-image: url('../img/c3_icon4_hv.png');}

/* hover 애니메이션 */
#c3_wrap ul li a:hover {background-color: #076ab6; }
#c3_wrap ul li a:hover h2 {color:#fff;}
#c3_wrap ul li a:hover p, #c3_wrap ul li a:hover h3, #c3_wrap ul li a:hover h4 {color:#d9f3ff;}
#c3_wrap ul li a:hover p span, #c3_wrap ul li a:hover p span::after {background-color: #d9f3ff; }
#c3_wrap ul li a:hover::after {border-color:#d9f3ff; }






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

}

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

}

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

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

}