@charset "utf-8";
*{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;font-family:"PingFang SC";color: #000000;}
body{background: #FFFFFF;}
a{text-decoration: none;cursor: pointer;}
ul,li{list-style:none; text-decoration:none}
i{font-style: normal;}
.fl{float: left;}
.fr{float: right;}
img{border: none;}
em,h1{font-style: normal;}
.w1180{width: 1180px;margin: 0 auto;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{*+height:1%;}

.title{padding: 100px 0 48px;text-align: center;}
.title span{display: block;font-weight: bold;font-size: 30px;color: #000000;}
.title p{font-weight: 400;font-size: 20px;color: #595959;padding-top: 16px;}

.btn_xcx{display: block;width: 167px;height: 48px;background: #0077FF;border-radius: 2px;text-align: center;margin: 48px auto 0;font-weight: 400;font-size: 16px;color: #FFFFFF;line-height: 48px;}
.btn_xcx::before{display: inline-block;content: "";width: 16px;height: 16px;background: url(../../images/vfx/xcx/arrow4.png);background-size: 100%;margin-right: 8px;vertical-align: -2px;}


.banner{height: 400px;background: url(../../images/vfx/xcx/banner.png)center top no-repeat;background-size: cover;box-sizing: border-box;padding-top: 90px;}
.banner i{display: block;width: 80px;height: 24px;background: #FFC552;border-radius: 2px;text-align: center;font-weight: 400;font-size: 16px;color: #000000;line-height: 24px;}
.banner i em{display: inline-block;width: 12px;height: 12px;background: url(../../images/vfx/xcx/b_hash.png);background-size: 100%;margin-right: 4px;vertical-align: 0px;}
.banner span{display: block;font-weight: bold;font-size: 38px;color: #FFFFFF;padding: 16px 0;}
.banner p{font-weight: 400;font-size: 20px;color: rgba(255,255,255,0.65);}
.banner .b_btn{display: flex;margin-top: 40px;}
.banner .b_btn a{display: block;width: 135px;height: 48px;background: #FFFFFF;border-radius: 4px;text-align: center;font-weight: 400;font-size: 16px;color: #0077FF;line-height: 48px;}
.banner .b_btn a:nth-child(2){margin-left: 13px;border: 1px solid #FFFFFF;background: none;color: #FFFFFF;box-sizing: border-box;}
.banner .b_btn a::before{display: inline-block;content: "";width: 16px;height: 16px;background: url(../../images/vfx/xcx/arrow1.png);background-size: 100%;margin-right: 8px;vertical-align: -2px;}
.banner .b_btn a:nth-child(2)::before{background: url(../../images/vfx/xcx/arrow4.png);background-size: 100%;}


.fl1{overflow: hidden;height: auto;padding-bottom: 100px;}
.fl1 .t{width: 1180px;height: 368px;background: #FFFFFF;box-shadow: 2px 6px 20px -3px rgba(0,0,0,0.05);border-radius: 16px;border: 2px solid rgba(255, 255, 255, 1);display: flex;align-items: center;}
.fl1 .t img{display: block;width: 360px;height: 270px;margin: 0 40px 0 48px;}
.fl1 .t .info{width: 684px;height: 272px;}
.fl1 .t .info span{display: block;font-weight: bold;font-size: 30px;color: #000000;margin-bottom: 8px;}
.fl1 .t .info span em{width: 56px;height: 20px;background: #E6F2FF;border-radius: 2px;text-align: center;font-weight: 400;font-size: 12px;color: #0077FF;line-height: 20px;margin-left: 8px;vertical-align: 5px;display: inline-block;}
.fl1 .t .info h4{display: block;font-weight: 400;font-size: 20px;color: #595959;margin-bottom: 20px;}
.fl1 .t .info p{font-weight: 400;font-size: 16px;color: #595959;margin-bottom: 8px;}
.fl1 .t .info p::before{display: inline-block;content: "";width: 14px;height: 14px;background: url(../../images/vfx/xcx/tick.png);background-size: 100%;margin-right: 8px;vertical-align: -2px;}
.fl1 .t .info .i{display: flex;align-items: center;margin-top: 20px;}
.fl1 .t .info .i i{display: block;font-weight: 400;font-size: 20px;color: #1F1F1F;margin-right: 24px;}
.fl1 .t .info .i i::last-child{margin-right: 0;}
.fl1 .t .info .i i::before{display: inline-block;content: "";width: 24px;height: 24px;background: url(../../images/vfx/xcx/fl1_ico1.png);background-size: 100%;margin-right: 8px;vertical-align: -4px;}
.fl1 .t .info .i i:nth-child(2)::before{background: url(../../images/vfx/xcx/fl1_ico2.png);background-size: 100%;}
.fl1 .t .info .i i:nth-child(3)::before{background: url(../../images/vfx/xcx/fl1_ico3.png);background-size: 100%;}
.fl1 .t .info .i i:nth-child(4)::before{background: url(../../images/vfx/xcx/fl1_ico4.png);background-size: 100%;}

 
.fl2{overflow: hidden;height: auto;padding-bottom: 52px;background: #F5F8FF;}
.fl2 .t{width: 1180px;height: 490px;background: #FFFFFF;box-shadow: 2px 6px 20px -3px rgba(0,0,0,0.05);border-radius: 16px;border: 2px solid rgba(255, 255, 255, 1);margin-bottom: 48px;display: flex;align-items: center;box-sizing: border-box;padding-left: 48px;}
.fl2 .t .info{width: 624px;height: 394px;}
.fl2 .t .info span{display: block;font-weight: bold;font-size: 30px;color: #000000;margin-bottom: 8px;}
.fl2 .t .info h4{display: block;font-weight: 400;font-size: 20px;color: #595959;margin-bottom: 20px;}
.fl2 .t .info .a{width: 624px;height: 224px;background: linear-gradient( 90deg, #F7FBFF 0%, rgba(247,251,255,0) 100%);border-radius: 8px;box-sizing: border-box;padding: 24px 0 0 24px;}
.fl2 .t .info .a h3{display: block;font-weight: bold;font-size: 20px;color: #1F1F1F;margin-bottom: 16px;}
.fl2 .t .info .a h3::before{display: inline-block;content: "";width: 40px;height: 40px;background: url(../../images/vfx/xcx/fl2_ico1.png);background-size: 100%;margin-right: 8px;vertical-align: -14px;}
.fl2 .t .info .a p{font-weight: 400;font-size: 16px;color: #595959;margin-bottom: 8px;}
.fl2 .t .info .a p::before{display: inline-block;content: "";width: 14px;height: 14px;background: url(../../images/vfx/xcx/tick.png);background-size: 100%;margin-right: 8px;vertical-align: -2px;}
.fl2 .t .info .b{display: flex;align-items: center;margin-top: 20px;}
.fl2 .t .info .b a{display: block;width: 135px;height: 48px;border-radius: 4px;border: 1px solid #0077FF;text-align: center;font-weight: 400;font-size: 16px;color: #0077FF;line-height: 48px;margin-right: 16px;box-sizing: border-box;}
.fl2 .t .info .b a::after{display: inline-block;content: "";width: 16px;height: 16px;background: url(../../images/vfx/xcx/arrow3.png);background-size: 100%;margin-left: 8px;vertical-align: -2px;}
.fl2 .t .info .b i{display: block;font-weight: 400;font-size: 14px;color: #595959;}
.fl2 .t img{display: block;width: 498px;height: 394px;}
.fl2 .t1 img{margin-left: -24px;}
.fl2 .t2 img{width: 468px;}
.fl2 .t3 img{width: 444px;}
.fl2 .t4 img{width: 444px;margin-right: 16px;}
.fl2 .t5 img{width: 444px;}


.fl3{overflow: hidden;height: auto;padding-bottom: 100px;}
.fl3 ul{display: flex;justify-content: space-between;flex-wrap: wrap;}
.fl3 ul li{width: 277px;height: 442px;background: linear-gradient( 180deg, rgba(255,255,255,0.72) 0%, #FFFFFF 5%, #FFFFFF 100%);box-shadow: 4px 12px 40px -6px rgba(0,0,0,0.05);border-radius: 16px;border: 1px solid #FFFFFF;}
.fl3 ul li .pic{width: 100%;height: 96px;background: url(../../images/vfx/xcx/fl3_1.png);background-size: 100%;font-weight: bold;font-size: 24px;color: #000000;box-sizing: border-box;padding: 24px 0 0 24px;}
.fl3 ul li:nth-child(2) .pic{background: url(../../images/vfx/xcx/fl3_2.png);background-size: 100%;}
.fl3 ul li:nth-child(3) .pic{background: url(../../images/vfx/xcx/fl3_3.png);background-size: 100%;}
.fl3 ul li:nth-child(4) .pic{background: url(../../images/vfx/xcx/fl3_4.png);background-size: 100%;}
.fl3 ul li .text{width: 277px;height: 362px;background: linear-gradient( 180deg, rgba(255,255,255,0.72) 0%, #FFFFFF 5%, #FFFFFF 100%);border-radius: 16px;
border: 1px solid #FFFFFF;margin-top: -16px;box-sizing: border-box;padding: 32px 0 0 16px;}
.fl3 ul li .text span{display: block;font-weight: 400;font-size: 20px;color: #1F1F1F;margin-bottom: 24px;}
.fl3 ul li .text p{font-weight: 400;font-size: 16px;color: #595959;margin-bottom: 16px;}
.fl3 ul li .text p::before{display: inline-block;content: "";width: 14px;height: 14px;background: url(../../images/vfx/xcx/tick.png);background-size: 100%;margin-right: 8px;vertical-align: -2px;}
.fl3 ul li .text b{display: block;font-weight: bold;font-size: 38px;color: #0077FF;margin-left: 44px;}
.fl3 ul li .text em{font-weight: bold;font-size: 20px;color: #0077FF;}
.fl3 ul li .text a{display: block;width: 245px;height: 48px;background: #0077FF;border-radius: 24px;text-align: center;font-weight: 400;font-size: 16px;color: #FFFFFF;line-height: 48px;margin-top: 24px;}
.fl3 ul li .text a::after{display: inline-block;content: "";width: 16px;height: 16px;background: url(../../images/vfx/xcx/arrow2.png);background-size: 100%;margin-left: 8px;vertical-align: -2px;}