.navigationBar { width: 100%; height: 102px; position: relative; } .navigationBarBack { width: 100%; position: absolute; height: 100%; top: 0; left: 0; background: #fff; color: #595959 !important; } .navigationTitle { max-width: 1300px; height: 102px; margin: auto; position: relative; display: flex; align-items: center; justify-content: space-between } .navigationTitle img { width: 130px; height: 58px; } .navigationUl { margin-left: 40px; } .navigationUl a { color: #5e95f8 !important; } .navigationUl li { margin: 0 10px; } .navigationUl, .navigationUl li{ display: inline-block; font-size: 16px; } .inBlock { display: inline-block; } .flexs { display: flex; align-items: center; } .fonsColorBai, .fonsColorBai a{ color: #595959; } .fonsColorHei, .fonsColorHei a{ color: #333; } .til { height: 102px; line-height: 102px; position: relative; overflow: hidden; cursor: pointer; } .headers { position: fixed; top: 0; left: 0; width: 100%; z-index: 9999999; } /* 产品介绍 */ .product { width: 100%; position: fixed; top: 100px; left: 0; background: #fff; height: 300px; border-top: 1px solid rgb(163, 163, 163); } .connont { width: 1300px; margin: auto; } .tils::before { content:""; height: 2px; width: 100%; bottom: 0; left: 0; background: #37B8FF; position: absolute; } /* 轮播图三个点样式 */ .slideBox{ width:100%; height: 630px; overflow:hidden; position:relative;} .slideBox .hd{ height:15px; overflow:hidden; position:absolute; left:120px; bottom:30px; z-index:1;} .slideBox .hd ul{ overflow:hidden; zoom:1; float:right; } .slideBox .hd ul li{ float:right; margin-right:2px; width:80px; height:3px; line-height:14px; text-align:center; background:rgb(77, 77, 77); cursor:pointer;border-radius: 3px;margin-left: 20px;} .slideBox .hd ul li.on div{ background:#fff; color:#fff;} .slideBox .bd{ position:relative; height:100%; z-index:0; } .slideBox .bd li{ zoom:1; vertical-align:middle; } .slideBox .bd img{ width:100%;height: 630px;display:block; } /* 导航下拉 */ .management { margin-top: 20px; width: 540px; font-size: 16px; } .management h3 { width: 100%; font-size: 16px; font-weight: normal; color: #333333; line-height: 40px; border-bottom: 1px solid rgb(180, 180, 180); margin-left: 20px; } .management ul { margin-top: 10px; width: 180px; } .management li{ margin-top: 10px; line-height: 40px; cursor:pointer; padding-left: 20px; } .management li:hover { background: #F0F4FF; border-radius: 10px; color: #3370FF; } .hide { display: none; } .show { display: block; } /* 系统管理 */ .managements { width: 100%; height: 1000px; max-width: 1920px; margin: auto; background: url(../image/gongshi.jpg) no-repeat center; background-size: 1920px 100%; } .manContent { width: 100%; text-align: center; font-size: 26px !important; color: #595959; } .manContent img { /* margin-top: 169px; margin-bottom: 27px; */ margin-top: 260px; margin-bottom: 55px; width: 206px; height: 206px; } .manContent p { font-size: 31px !important; color: #595959; font-weight: bold; word-spacing: 15px; letter-spacing:5px } .manContent span { color: #5e95f8; } /* 智能 */ .smart { width: 100%; max-width: 1920px; height: 833px; margin: auto; background: url(../image/zhineg.jpg) no-repeat center; background-size: 1920px 100%; } .smart h2 { text-align: center; font-size: 42px !important; color: #595959 !important; padding: 140px; padding-bottom: 65px; display: flex; justify-content: center; word-spacing: 15px; letter-spacing:5px } .smart h2 p { font-size: 57px; font-weight: bold; margin-right: 20px; } .smart h2 span { color: #5e95f8; } .connonst { width: 1530px; margin: auto; } .smartEngine { width: 1451px; margin: auto; display: flex; } .smartEngineLeft { display: inline-block; } .smartEngineLeftCon { display: flex; flex-wrap: wrap; width: 624px; height: 470px; justify-content: space-around; align-content: space-between; margin-right: 20px; } .selMou { width: 305px; height: 220px; border-radius: 10px; box-shadow: 0px 0px 5px 1px #cbcbcb; background: #f7fcfc; text-align: center; } .selMou p { font-weight: 400; color: #595959; letter-spacing:5px; font-size: 26px; margin-top: 14px; } .selMou img { width: 87px; height: 90px; margin-top: 15px; } .selMouR img{ width: 88px; height: 88px; margin-top: 10px; } .selMouR p { font-weight: 400; color: #595959; letter-spacing:5px; font-size: 26px; margin-top: 10px; } .selMouR { width: 194px; height: 207px; border-radius: 10px; box-shadow: 0px 0px 5px 1px #cbcbcb; background: #f7fcfc; text-align: center; } .smartEngineRight { display: inline-block; } .smartEngineRightCon { display: flex; flex-wrap: wrap; width: 798px; height: 470px; justify-content: space-around; align-content: space-between; } /* 填报 */ .fill { width: 100%; max-width: 1920px; height: 851px; margin: auto; background: url(../image/fill.jpg) no-repeat center; background-size: 1920px 100%; } .fill h2 { font-size: 40px; letter-spacing:5px; padding: 90px 0 39px 50px; } .fillCon { width: 100%; height: 615px; position: relative; transform: translate(0,260px); } .fillCons { animation: move 2s; animation-fill-mode: both; } @keyframes move { 0%{ transform: translate(0,260px); } 100%{ transform: translate(0,0); } } .fillConCen { display: inline-block; position: absolute; width: 357px; top: 0; /* left: 0; */ height: 538px; background: #fff; border-radius: 5px; box-shadow: 9px 9px 20px 9px #cbcbcb; } .fccCon { width: 250px; height: 363px; border-radius: 5px; margin: auto; margin-top: 125px; position: relative; text-align: center; } .fccCon img { width: 97px; height: 97px; position: absolute; top: -48.5px; left: 50%; margin-left: -48.5px; } .fccCon h3 { font-size: 30px; padding: 66px 0 14px 0; text-align: center; } .ios { width: 70px; height: 5px; margin: auto; } .fccConP p { width: 100%; font-size: 24px; color: #887979; line-height: 46px; } .fccConP { width: 100%; height: 242px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; } /* 便捷 */ .convenient { width: 100%; max-width: 1920px; height: 873px; margin: auto; background: url(../image/tabl.jpg) no-repeat center; background-size: 1920px 873px; } .cvit { text-align: center; color: #fff !important; } .cvit h2 { padding: 100px 0 15px 0; font-size: 40px; color: #fff; } .cvit span { font-size: 66px; } .cvit p { color: #fff; font-size: 20px; text-align: center; } .tablTab { display: flex; width: 100%; box-sizing: border-box; padding: 52px 90px 19px 90px; justify-content: space-between; } .tablTab li{ height: 59px; width: 138px; border-radius: 8px; /* background: #fff; */ display: flex; align-items: center; justify-content: center; font-size: 18px; color: #fff; cursor:pointer; } .on { background-color: #fff; color: #5e9ffc !important; } .tabFool { width: 1150px; height: 550px; /* background-color: #a1b9fe; */ margin: auto; border-radius: 10px; position: relative; position: relative; } .tabFool div { position: absolute; background-color: #fff; opacity: .5; width: 100%; height: 100%; left: 0%; top: 0; z-index: 1; border-radius: 10px; } .tabFool img { width: 1070px; height: 502px; position: absolute; bottom: 0; right: 10px; z-index: 2; } /* 客户 */ .kehu { width: 100%; max-width: 1920px; height: 979px; margin: auto; background: url(../image/rke.jpg) no-repeat center; background-size: 1920px 979px; } .kehu h2, .pricings h2 { font-size: 42px; color: #333; padding: 142px 80px 80px 80px; } .conImg { width: 100%; display: flex; justify-content: space-between; } .conImg img { width: 500px; } /* 产品定价 */ .pricings { width: 100%; max-width: 1920px; height: 941px; margin: auto; background: url(../image/dingj.jpg) no-repeat center; background-size: 1920px 941px; } .pri { display: flex; justify-content: space-between; width: 78rem; margin: auto; } .li { text-align: center; background: #fff; padding: .625rem; box-shadow: 0px 1px 20px 0px #c8c8c8; cursor: pointer; transition: all .25s ease-in; } .li_con { width: 15rem; height: 10.5rem; background: #f3f3f3; box-sizing: border-box; padding-top: 2.875rem; } .li_con div { width: 100%; text-align: center; font-size: 1.5rem; color: #565656; margin-bottom: 1.375rem; } .li_con div span{ font-size: 1.75rem; } .li li { width: 100%; height: 2rem; font-size: 0.9rem; line-height: 2rem; text-align: center; list-style-type:none; color: #b5b0b0; } .li li:nth-child(2n) { background: #f3f3f3; } .btn { width: 6rem; height: 1.6rem; margin: auto; background-image: url(../image/xg.png); background-size: 100% 100%; margin-bottom: 1.2rem; border: 0; background-repeat: no-repeat; } .li:hover { transform:translateY(-20px); } .li:hover .btn{ background: url(../image/xgs.png); background-size: 100% 100%; background-repeat:no-repeat; } .li:hover .li_con{ background: linear-gradient(to left,#4daefe,#01f1fe); } .li:hover .li_con div{ color: #fff; } .btn a { display: inline-block; width: 100%; height: 100%; } .al a{ color: #407be7 !important; } .al { position: relative; } .al::after { content: ''; width: 100%; height: .1875rem; background: #407be7; position: absolute; bottom: -1.25rem; left: 0; } /* 底部 */ .footer-frame { width: 100%; height: 1.5rem; } .footer { padding-top: 3rem; padding-bottom: 0.5rem; background-color: #20a0ff; margin-top: -2px; } .footer .footer-col { margin-bottom: 2.25rem; } .footer h4 { margin-bottom: 0.625rem; color: #fff; } .footer .list-unstyled, .footer p { color: #f3f7fd; } .footer .footer-col.middle .list-unstyled .fas { color: #fff; font-size: 0.5rem; line-height: 1.5rem; } .footer .footer-col.middle .list-unstyled .media-body { margin-left: 0.5rem; } .footer .footer-col.last .list-unstyled .fas { color: #fff; font-size: 0.875rem; line-height: 1.5rem; } .footer .footer-col.last .list-unstyled .media-body { margin-left: 0.625rem; } .footer .footer-col.last .list-unstyled .fas.fa-globe { margin-left: 1rem; margin-right: 0.625rem; } .navbar { padding: 0 !important; } .ulss { display: inline-block; } .alss { display: flex; justify-content: space-around; width: 1400px; margin: auto; } /* 尝试滚动 */ .jiesao { height: 200vh; width: 100%; } .managements { /* height: 72vh; */ height: 90vh; position: sticky; top: 100px; } body { overflow-x: hidden; } .znyq { height: 400vh; width: 100%; } .smart { height: 90vh; position: sticky; top: 100px; } .tb { height: 300vh; width: 100%; } .fill { height: 90vh; position: sticky; top: 100px; } .hanAll { background: url(../image/backk.jpg) no-repeat; background-size: 100%; } .abc .til { color: #fff !important; } .abc .til a{ color: #fff !important; } .aus a{ color: #595959 !important; } /* 咨询 */ .zhixun { display: block; position: fixed; bottom: 20rem; right: 0rem; padding: 1rem; background: #fff; box-shadow: 3px 3px 10px #ccc; z-index: 99999999; text-align: center; } .zhixun p { margin: 0.5rem 0; } .zhixun img { width: 8rem; }