.components-skills{color:#333;max-width:1204px;padding:80px 0}.components-skills.odd:nth-child(odd){background:#fff}.components-skills .skills-content{margin:0 auto auto;max-width:1100px}.components-skills h2,.components-skills h3,.components-skills p{margin:0;padding:0}.components-skills ul{display:flex;flex-wrap:wrap;margin:0}.components-skills li{display:flex;line-height:1;margin-top:60px}.components-skills .time{width:140px}.components-skills .time img{border-radius:4px;display:block;height:100px;-o-object-fit:cover;object-fit:cover;width:140px}.components-skills .skill-con{flex:1;margin-left:24px;overflow:hidden;position:relative}.components-skills .skill-con .title,.components-skills .skill-con h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.components-skills .skill-con h3{font-size:20px;font-weight:600;max-width:410px;padding-top:2px}.components-skills .skill-con h3 a:hover{color:#3e72f6}.components-skills .skill-con .desc{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#555;display:-webkit-box;font-size:15px;font-weight:400;line-height:1.4;margin-top:16px;max-width:450px;overflow:hidden;text-overflow:ellipsis}.components-skills .skill-con .time{bottom:0;color:#555;font-size:13px;font-weight:400;left:0;position:absolute}.components-skills .btn{background:hsla(0,0%,100%,0);border:1px solid #bbb;border-radius:4px;color:#777;display:block;height:36px;line-height:34px;margin:50px auto auto;text-align:center;transition:all .3s;width:120px}.components-skills .btn:hover{border-color:#3e72f6;color:#3e72f6}.preview-full-bg{background-color:#00000080;height:100%;left:0;position:fixed;top:0;width:100%;z-index:99}.preview-full-bg .dialog-preview{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.preview-full-bg .dialog-preview .content-box{background:#fff;border:8px solid #f1f1f1;border-radius:40px;height:688px;overflow:hidden;width:340px}.preview-full-bg .dialog-preview .content-box .lh-top{left:80px;position:absolute;top:8px;width:180px;z-index:9}.preview-full-bg .dialog-preview .content-box .iphone-header{height:40px;left:8px;overflow:hidden;position:absolute;top:8px;width:324px}.preview-full-bg .dialog-preview .content-box .mini-header{width:324px}.preview-full-bg .dialog-preview .content-box iframe{border-radius:32px;height:672px;overflow-x:hidden;width:324px}.preview-full-bg .dialog-preview .content-box iframe::-webkit-scrollbar-track-piece{background:#fafafa}.preview-full-bg .dialog-preview .content-box iframe::-webkit-scrollbar{height:6px;width:6px}.preview-full-bg .dialog-preview .content-box iframe::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:20px}.preview-full-bg .dialog-preview .btn-edit{border-color:#fff;color:#3e72f6;font-size:14px;font-weight:400;height:36px;line-height:36px;margin-top:20px;padding:0;width:170px}.preview-full-bg .dialog-preview .btn-edit:hover{border-color:#3e72f6}.preview-full-bg .dialog-preview .btn-close{font-weight:400;height:36px;line-height:36px;margin-left:0;margin-top:20px;padding:0;width:170px}.preview-full-bg .dialog-preview .btn-detail{color:#3575bd;display:block;font-size:14px;font-weight:500;margin:20px auto auto;text-align:center;width:70px}.preview-full-bg .dialog-preview .code-box{left:380px;position:absolute;top:0;width:170px}.preview-full-bg .dialog-preview .code-box .code{background:#fff;border-radius:4px;padding:16px 0 0}.preview-full-bg .dialog-preview .code-box .el-image{display:block;margin:0 auto auto;width:146px}.preview-full-bg .dialog-preview .code-box p{color:#666;font-size:12px;font-weight:400;line-height:17px;margin-top:10px;padding:10px 16px 0;text-align:left}.preview-full-bg .dialog-preview .code-box2{background:#fff;border-radius:4px;padding:20px;width:200px}.preview-full-bg .dialog-preview .code-box2 .code{padding-top:0}.preview-full-bg .dialog-preview .code-box2 .code .shadows{box-shadow:0 1px 5px #00130b33}.preview-full-bg .dialog-preview .code-box2 h3{color:#333;font-size:16px;font-weight:500;line-height:17px;text-align:center}.preview-full-bg .dialog-preview .code-box2 p{color:#666;font-size:14px;font-weight:400;line-height:18px;padding:0;text-align:justify}.preview-full-bg .dialog-preview .code-box2 .el-button{width:160px}.preview-full-bg .dialog-preview .code-box2 .btn-edit{border:1px solid #3e72f6;border-radius:4px;color:#3e72f6;cursor:pointer;font-size:14px;font-weight:400;height:36px;line-height:34px;margin-top:16px;padding:0;text-align:center;transition:all .3s;width:160px}.preview-full-bg .dialog-preview .code-box2 .btn-edit:hover{background-color:#3e72f6;border-color:#3e72f6;color:#fff}.preview-full-bg .dialog-preview .code-box2 .btn-close{margin-top:16px}.fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}:root{--el-text-color-regular:"#333333";--el-color-primary-light-3:#3362d8;--el-color-primary-dark-2:#3362d8;--el-color-primary:#3e72f6}.page-index .banner{background-color:#ecf2fe;height:320px}.page-index .banner .container{background-image:url(https://oss.hlcode.cn/smartcode/index/banner.png);background-position:50%;background-repeat:no-repeat;background-size:1920px 320px;height:320px;padding-top:115px}.page-index .banner .container h1,.page-index .banner .container h2{color:#243046;font-weight:500;line-height:1}.page-index .banner .container h2{margin-top:24px}.page-index .bg-gray{background-color:#f5f6f8}.page-index .main{margin:0 auto auto;max-width:1204px;padding:70px 0}.page-index .main .img-list{display:flex;flex-wrap:wrap;justify-content:space-between;margin-top:40px}.page-index .main .img-list img{border-radius:6px;cursor:pointer;height:auto;max-width:100%}.page-index .main .step-box{align-items:center;display:flex;justify-content:space-between;margin-top:20px}.page-index .main .step-box .step{text-align:center}.page-index .main .step-box .step img{border-radius:6px;height:180px;width:240px}.page-index .main .step-box .step p{font-size:16px;font-weight:500;line-height:24px;margin-top:15px}.page-index .main .step-box .to img{display:block;height:15px;margin-top:-25px;width:124px}.page-index .main .step-box .to-down{text-align:center;width:240px}.page-index .main .step-box .to-down img{height:64px;width:15px}.page-index .main .tab{margin-top:30px}.page-index .main .tab .tab-con{display:flex;flex-wrap:wrap;margin:40px auto auto}.page-index .main .tab .tab-con .list{background:#fff;border-radius:6px;box-shadow:0 3px 10px #172f431f;margin-bottom:24px;padding:16px;position:relative}.page-index .main .tab .tab-con .list:nth-child(4n){margin-right:0}.page-index .main .tab .tab-con .list:hover .mask{display:block}.page-index .main .tab .tab-con .list .mask{background:rgba(0,0,0,.6);border-radius:6px;bottom:0;display:none;left:0;position:absolute;right:0;top:0}.page-index .main .tab .tab-con .list .mask .btn{background:#3e72f6;border-radius:50px;color:#fff;cursor:pointer;font-size:16px;left:50%;line-height:1;padding:10px 20px;position:absolute;top:50%;transform:translate(-50%,-50%);transition:transform .3s}.page-index .main .tab .tab-con .list .mask .btn:hover{transform:translate(-50%,-50%) scale(1.09)}.page-index .main .tab .tab-con .list img{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.page-index .partner{background:#2d3957}.page-index .partner .main{max-width:1070px;width:100%}.page-index .partner h3{color:#fff;text-align:center}.page-index .partner img{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transform:translate(-50%,-50%) scale(.5);transform-origin:50% 50%}.page-index .comment{background:#f2f2f3}.page-index .comment h3{color:#333;text-align:center}.page-index .comment .comment-box{background:#fff;border-radius:4px;padding:20px;position:relative}.page-index .comment .comment-box img{display:block;height:auto;width:100%}@media (max-width:430px){.to-down{left:580px;position:relative}}@media (max-width:414px){.to-down{left:598px;position:relative}}@media (max-width:390px){.to-down{left:620px;position:relative}}