/* 공통 */
#c3_wrap .c_inner {width: 1300px; margin:0 auto; position: relative; }
/* white btn */
#c3_wrap .c_btn a {display: flex; width: 213px; height: 55px; justify-content: space-between; align-items: center; padding:0 22px; border-top: 1px solid #fff;
 border-bottom: 1px solid #fff;  font-size:16px; font-weight: 500; color:#fff; position: relative; z-index: 1; overflow: hidden; transition: all .5s ease; margin:0 auto; }
#c3_wrap .c_btn a span {display: block; width:22px; height: 14px; position: relative; top:0; background: url('../img/btn_arrow_w.png') 50% 50% no-repeat;
transition: all .5s ease; }
#c3_wrap .c_btn a::before {content: ''; position: absolute ;left: 0; top: 0; width: 0; height: 100%; z-index: -1; background: #0046a5; transition: all .5s ease;}
#c3_wrap .c_btn a:hover {border-color: #0046a5; }
#c3_wrap .c_btn a:hover::before {width: 100%;}


/*Content CSS*/
#c3_wrap {width: 100%; background: #fff;  height:100vh; min-height:940px; position: relative; z-index: 2; display: flex; align-items: center; padding-top: 90px;text-align: center;}
#c3_wrap .top {width: 100%; height: 300px; background: url('../img/c3_top_bg.jpg') 50% 50% no-repeat; background-size:cover;  display: flex; flex-direction: column;
align-items: center; justify-content: center; }
#c3_wrap .top h2 {font-size: 26px; color:#fff; }
#c3_wrap .top .c_btn {margin:50px auto 0; }
#c3_wrap .list {width: 100%; display: flex; margin-top: 75px;}
#c3_wrap .list li {border-right: 1px solid #dce9f4;  width: 50%; }
#c3_wrap .list li a {display: flex; width: 100%; align-items: center; padding:0 0 0 65px; }
#c3_wrap .list li:first-child {border-left:1px solid #dce9f4; }
#c3_wrap .list li .cir {width: 147px; height: 147px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #fff; border:1px solid #e5ecf2;
position: relative; }
#c3_wrap .list li .cir img {transition: transform 500ms;}
#c3_wrap .list li .cir::before {content: ''; display: block; width: 100%; height: 100%; border-radius: 50%; left: 0; top: 0; border:3px solid #0046a5; opacity: 0;
transition:  opacity .3s ease; position: absolute; left: 0; top: 0; }
#c3_wrap .list li a h2 {font-size: 22px; font-weight: 700; color:#0e1e8e; margin:0 45px; }
#c3_wrap .list li a span {position: relative; left: 0; transition: all .3s ease;}
/* hover */
#c3_wrap .list li a:hover .cir::before {opacity: 1; }
#c3_wrap .list li a:hover .cir img {transform: rotateY(180deg);}
#c3_wrap .list li a:hover span {left: 15px;}





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

}

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

}

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

}