/* common */
#c4_wrap { overflow: hidden; }
#c4_wrap .c_tit { line-height: 1; text-align: center; }
#c4_wrap .c_tit h1 { font-family: 'Poppins', sans-serif; font-size: 45px; font-weight: 600; color: #fff; text-transform: uppercase; }
#c4_wrap .c_tit h1::before { content:""; display: block; width:30px; height: 3px; background-color: #fff; margin:0 0 30px; }

#c4_wrap .c_btn { position:relative; display: block; margin:50px 0 0; width: 236px; height: 52px; line-height: 50px; text-align: center; border-top: 1px solid #fff; border-bottom: 1px solid #fff; border-left:1px solid transparent; border-right: 1px solid transparent; transition: .3s; font-size: 14px; color: #fff; text-transform: uppercase; font-family: 'Poppins', sans-serif; z-index: 1; }
#c4_wrap .c_btn img { margin-left: 13px; position:relative; top:-1px; }
#c4_wrap .c_btn::before { content:""; position:absolute; left:0; width:100%; top:0; height: 100%; background-image: linear-gradient(to left, #072c7d, #46c7ff); opacity: 0; transition: .3s; z-index: -1; }
#c4_wrap .c_btn:hover { border-color: transparent; }
#c4_wrap .c_btn:hover::before { width: 100%; opacity: 1; }


/* c4 */
#c4_wrap { position:relative; z-index: 1; height: 495px; }

#c4_wrap .left { position:absolute; left:0; width:calc(50% - 205px); top:0; height: 100%; background:url('../img/c4_bg1.jpg') no-repeat center / cover; }
#c4_wrap .left .l_con { position:absolute; right:0; width:445px; top:0; height: 100%; padding:98px 0; text-align: left; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; }

#c4_wrap .right { position:absolute; right:0; width:calc(50% + 205px); top:0; height: 100%; background:url('../img/c4_bg2.jpg') no-repeat center / cover; }
#c4_wrap .right .r_con { position:absolute; left:0; width:885px; top:0; height: 100%; padding:55px 0 0 80px; text-align: left; }

.c4_list { display: flex; flex-wrap: wrap; }
.c4_list li { padding:30px 40px; width: 50%; display: flex; align-items: center; }
.c4_list li:first-child { border-right: 1px solid rgba(255,255,255,0.3); }
.c4_list li:last-child { padding:60px 60px 0 40px; margin-top: 30px; width:100%; border-top: 1px solid rgba(255,255,255,0.3); }
.c4_list .icon { width: 85px; height: 85px; background:rgba(255,255,255,0.2); border-radius: 50%; line-height: 100px; text-align: center; }
.c4_list .icon i { font-size:30px; color:#fff; transition: all .4s; }
.c4_list .txt { width:calc(100% - 85px); padding-left: 30px; }
.c4_list .txt h2 { font-size: 24px; font-weight: 600; color: #fff; font-family: 'Poppins', sans-serif; }
.c4_list .txt p { margin:5px 0 0; font-size: 16px; font-weight: 300; color: rgba(255, 255, 255, 0.8); line-height: 2; }

.c4_list li:hover .icon i { transform: rotateY(180deg); }