@charset "utf-8";
*{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;font-family:"PingFang SC","Microsoft YaHei","微软雅黑";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/index/arrow4.png);background-size: 100%;margin-right: 8px;vertical-align: -2px;}



.banner{height: 500px;background: url(../../images/vfx/index/banner.webp)center top no-repeat;background-size: cover;box-sizing: border-box;padding-top: 90px;}
.banner i{display: block;width: 75px;height: 20px;background: linear-gradient( 270deg, #96C3FF 0%, #5182FF 100%);border-radius: 10px 10px 10px 0px;text-align: center;font-weight: 400;font-size: 14px;color: #FFFFFF;line-height: 20px;box-sizing: border-box;padding-left: 0px;}
.banner i em{display: inline-block;width: 16px;height: 16px;background: url(../../images/vfx/index/b_hash.webp);background-size: 100%;margin-right: 4px;vertical-align: -3px;}
.banner span{display: block;font-weight: bold;font-size: 50px;color: #222222;line-height: 56px;margin: 18px 0;}
.banner span em{display: block;font-weight: bold;font-size: 50px;background: linear-gradient(0deg, #10AEFF 0%, #6467F0 100%);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.banner p{font-weight: 400;font-size: 20px;color: #333333;line-height: 28px;}
.banner .b_btn{display: flex;margin-top: 40px;}
.banner .b_btn a{display: block;width: 140px;height: 50px;background: linear-gradient( 90deg, #005EF4 0%, #4D9AFF 100%);border-radius: 100px;text-align: center;font-weight: 400;font-size: 18px;color: #FFFFFF;line-height: 50px;}
.banner .b_btn a:nth-child(2){margin-left: 13px;border: 1px solid #0077FF;background: none;color: #0077FF;box-sizing: border-box;}
.banner .b_btn a::after{display: inline-block;content: "";width: 20px;height: 20px;background: url(../../images/vfx/index/arrow1.webp);background-size: 100%;margin-left: 8px;vertical-align: -3px;}
.banner .b_btn a:nth-child(2)::after{background: url(../../images/vfx/index/arrow2.webp);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/index/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/index/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/index/fl1_ico2.png);background-size: 100%;}

.fl1 .t .info .i i:nth-child(3)::before{background: url(../../images/vfx/index/fl1_ico3.png);background-size: 100%;}

.fl1 .t .info .i i:nth-child(4)::before{background: url(../../images/vfx/index/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/index/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/index/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/index/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/index/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/index/fl3_2.png);background-size: 100%;}

.fl3 ul li:nth-child(3) .pic{background: url(../../images/vfx/index/fl3_3.png);background-size: 100%;}

.fl3 ul li:nth-child(4) .pic{background: url(../../images/vfx/index/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/index/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/index/arrow2.png);background-size: 100%;margin-left: 8px;vertical-align: -2px;}