.fa-case{width:100%;height:auto;background-image:url(../img/bg_4.26a89113.jpg);background-repeat:no-repeat;background-size:cover;text-align:center;padding:1vw 0}.fa-case .content{width:1324px;margin:0 auto;position:relative}.fa-case .title{height:33px;margin-top:60px;margin-bottom:20px;background-size:contain;line-height:1;font-size:40px;color:#000;font-weight:300}.fa-case .sub_title{height:16px;font-size:16px;font-weight:400;color:#888}.fa-case .item-content{width:1230px;height:460px;overflow:hidden}.fa-case .item-content,.fa-case .templates{position:relative;margin:0 auto;text-align:center}.fa-case .templates{width:1200px;height:450px}.fa-case .templates .clearfix{position:absolute;width:300%;height:100%;transform:translateX(0);padding-top:44px;transition:transform .3s ease}.fa-case .templates .clearfix li{float:left;width:275px;margin-right:35px;display:inline-block}.fa-case .templates .template_code{width:275px;height:400px;display:inline-block;float:left;position:relative}.fa-case .content .item_btn{position:absolute;top:0;z-index:2;height:450px;line-height:450px;padding-top:30px}.fa-case .content .btn_left{left:0}.fa-case .content .btn_right{right:0}.fa-case .content .item_btn .iconfont{position:relative;display:inline-block;width:30px;height:60px;border:1px solid #3f87f9;cursor:pointer;transition:none;box-shadow:0 4px 25px 0 rgba(68,93,127,.15);opacity:.7;border-radius:4px;transition:all .3s}.fa-case .content .item_btn .iconfont:before{content:"";position:absolute;top:22px;left:10px;width:8px;height:16px;background:url(../img/icon_index.cf28033a.png) -168px -583px no-repeat}.fa-case .content .item_btn:hover .iconfont{position:relative;width:30px;height:60px;background:#3f87f9;opacity:.9}.fa-case .content .item_btn:hover .iconfont:before{content:"";position:absolute;top:22px;left:10px;width:8px;height:16px;background:url(../img/icon_index.cf28033a.png) -168px -609px no-repeat}.fa-case .content .btn_right .iconfont:before{content:"";position:absolute;top:22px;left:10px;width:8px;height:16px;background:url(../img/icon_index.cf28033a.png) -182px -583px no-repeat}.fa-case .content .btn_right:hover .iconfont:before{content:"";position:absolute;top:22px;left:10px;width:8px;height:16px;background:url(../img/icon_index.cf28033a.png) -182px -609px no-repeat}.fa-case .pc_li{transition:transform .3s ease}.fa-case .templates .name{position:absolute;font-size:20px;color:#333;top:274px;width:100%;text-align:center}.fa-case .templates .info{position:absolute;width:100%;text-align:center;top:291px}.fa-case .templates .pre_img{position:absolute;top:0;left:0;width:275px;height:400px;box-shadow:0 4px 12px 5px rgba(217,223,231,.4)}.fa-case .templates .template_code{position:absolute;top:0;left:0;z-index:1;opacity:0;transition:all .3s}.fa-case .templates .template_code .code_img{transition:box-shadow .3s ease}.fa-case .templates .template_code .code_tips{position:absolute;font-size:16px;color:#333;width:100%;left:0;bottom:31px}.fa-case .link{margin-top:40px;position:relative;overflow:hidden}.fa-case .link:after{content:"";width:100%;padding-top:100%;top:50%;left:50%;position:absolute;transform:translate(-50%,-50%);border-radius:50%;-webkit-animation:ripple 1.3s infinite;animation:ripple 1.3s infinite}.fa-case .link:hover:after{display:none}.fa-case .intro_button{display:inline-block;width:140px;height:40px;margin-top:50px;margin-bottom:70px;background-image:linear-gradient(90deg,#2576fb,#59a3ff);background-color:#2576fb;border-radius:20px;transition:box-shadow .3s ease;box-shadow:0 16px 21px 3px rgba(42,122,251,.15)}.fa-case .intro_button:hover{box-shadow:0 8px 9px 0 rgba(42,122,251,.25);transition:box-shadow .3s ease}.fa-case .intro_button a{width:140px;height:40px;line-height:40px;font-size:14px;font-weight:400;color:#fff;text-decoration:none}@media(max-width:768px){.fa-case{background-image:none;background-color:#fff;overflow:hidden}.fa-case .title{height:.96rem;line-height:1;font-size:40px;color:#000;font-weight:300}.fa-case .sub_title{height:.6rem;font-size:.6rem;font-family:PingFang SC;color:#888}.fa-case .content{width:auto}.fa-case .templates-mobi{width:auto;padding:0 .7rem;position:relative;height:9.587217rem;margin:0 auto;text-align:center}

    ;.fa-case .templates-mobi .clearfix{position:absolute;width:25.565912rem;height:100%;transform:translateX(0);padding-top:.937417rem;transition:transform .3s ease}.fa-case .templates-mobi .clearfix li,.fa-case .templates-mobi .template_code{float:left;width:5.858855rem;display:inline-block}.fa-case .templates-mobi .template_code{height:8.521971rem;position:relative}.fa-case .templates-mobi .name{position:absolute;font-size:.426099rem;color:#333;top:5.83755rem;width:5.858855rem;text-align:center}.fa-case .templates-mobi .info{position:absolute;width:100%;text-align:center;top:6.199734rem}.fa-case .templates-mobi .template_code{transition:transform .3s ease,box-shadow .3s ease}.fa-case .pc_li:hover{transform:translate3d(0,-.213049rem,0);transition:transform .3s ease}.fa-case .templates-mobi .template_code:hover{opacity:1}.fa-case .templates-mobi .pre_img,.fa-case .templates-mobi .template_code:hover .code_img{width:5.858855rem;height:8.521971rem;box-shadow:0 .08522rem .426099rem .106525rem rgba(217,223,231,.4)}.fa-case .templates-mobi .pre_img{position:absolute;top:0;left:0}.fa-case .templates-mobi .template_code{position:absolute;top:0;left:0;z-index:1;opacity:0;transition:all .3s}.fa-case .templates-mobi .template_code .code_img{width:5.858855rem;height:8.521971rem;transition:box-shadow .3s ease}.fa-case .templates-mobi .template_code .code_tips{position:absolute;font-size:.340879rem;color:#333;width:100%;left:0;bottom:.660453rem}.fa-case-tips{margin-top:1.04rem;font-size:.51rem;font-weight:400;color:#999}.fa-case .intro_button{width:4.52rem;height:1.28rem;background-image:linear-gradient(90deg,#2576fb,#59a3ff);background-color:#2576fb;border-radius:1rem;margin-top:1.07rem;margin-bottom:1.7rem}.fa-case .intro_button a{line-height:1.28rem;font-size:.6rem;font-weight:400}}@media(min-width:769px) and (max-width:1385px){.fa-case .content{width:15.918069rem}.fa-case .title{height:.96rem;line-height:1;font-size:40px;color:#000;font-weight:300}.fa-case .sub_title{height:.187271rem;font-size:.187271rem}.fa-case .item-content{width:14.396489rem;height:5.384053rem}.fa-case .templates{width:14.045355rem;height:5.267008rem}.fa-case .templates .clearfix{position:absolute;width:300%;height:100%;transform:translateX(0);padding-top:.514996rem;transition:transform .3s ease}.fa-case .templates .clearfix li{width:3.218727rem;margin-right:.4rem}.fa-case .templates .template_code{width:3.218727rem;height:4.681785rem}.fa-case .content .item_btn{height:5.267008rem;line-height:5.267008rem;padding-top:.351134rem}.fa-case .pc_li{transition:transform .3s ease}.fa-case .templates .name{position:absolute;font-size:.234089rem;color:#333;top:3.207023rem;width:100%;text-align:center}.fa-case .templates .info{position:absolute;width:100%;text-align:center;top:3.405999rem}.fa-case .templates .template_code{transition:transform .3s ease,box-shadow .3s ease}.fa-case .pc_li:hover{transform:translate3d(0,-.117045rem,0);transition:transform .3s ease}.fa-case .templates .template_code:hover{opacity:1}.fa-case .templates .template_code:hover .code_img{box-shadow:0 .046818rem .18rem .058522rem rgba(217,223,231,.4)}.fa-case .templates .code_img,.fa-case .templates .pre_img{position:absolute;top:0;left:0;width:3.218727rem;height:4.681785rem;box-shadow:0 .046818rem .18rem .058522rem rgba(217,223,231,.4)}.fa-case .templates .template_code{position:absolute;top:0;left:0;z-index:1;opacity:0;transition:all .3s}.fa-case .templates .template_code .code_img{transition:box-shadow .3s ease}.fa-case .templates .template_code .code_tips{position:absolute;z-index:2;font-size:.187271rem;color:#333;width:100%;left:0;bottom:.362838rem}.fa-case .link{margin-top:.468179rem;position:relative;overflow:hidden}.fa-case .link:after{content:"";width:100%;padding-top:100%;top:50%;left:50%;position:absolute;transform:translate(-50%,-50%);border-radius:50%;-webkit-animation:ripple 1.3s infinite;animation:ripple 1.3s infinite}.fa-case .link:hover:after{display:none}.fa-case .intro_button{display:inline-block;margin-top:.585223rem;margin-bottom:.819312rem;transition:box-shadow .3s ease}}