.pageNav-bar { position: fixed; left: 0px; top: 80px; width: 100%; height: 0px; z-index: 10; } .pageNav-bar.on { position: fixed; } .pageNav { position: absolute; left: 0px; top: 0px; width: 100%; height: 54px; background: rgba(35, 43, 50, 0.8); } .pageNav ul { overflow: hidden; margin-left: -20px; } .pageNav li { float: left; position: relative; margin: 0px 0px 0px -1px; } .pageNav li::before { content: ""; height: 20px; width: 1px; background: rgb(200, 200, 200); position: absolute; left: 0px; top: 50%; margin-top: -10px; } .pageNav li a { display: block; padding: 0px 20px; line-height: 54px; } .pageNav li.on a { color: rgb(246, 150, 3); } .pageContainer { } .banner { background-size: auto; background-position: center center; } .banner .wrap { position: relative; min-height: 580px; } .banner .desc { position: absolute; left: 0px; top: 50%; transform: translateY(-50%); color: rgb(255, 254, 254); } .banner h2 { font-size: 36px; line-height: 1; margin-bottom: 20px; } .banner p { font-size: 16px; line-height: 33px; color: rgb(242, 242, 243); } .section-guanLi { text-align: center; padding: 100px 0px; } .section-guanLi h2 { font-size: 36px; line-height: 1; color: rgb(34, 34, 34); margin-bottom: 48px; } .section-guanLi ul { padding: 0px; margin: 0px -11px; text-align: left; } .section-guanLi li { float: left; width: 33.333%; padding: 22px 11px 0px; } .section-guanLi li a { display: block; background: url("ZhuZhaiXiaoQu/img/guanLi-bg.jpg") 0% 0% / cover; border-radius: 5px; padding: 50px 30px 0px; min-height: 170px; position: relative; } .section-guanLi li a em { text-indent: 0px; font-size: 68px; font-family: DIN; line-height: 1; position: absolute; right: 30px; top: 10px; color: rgb(220, 229, 241); } .section-guanLi li a h3 { font-size: 24px; line-height: 1; color: rgb(0, 0, 0); margin-bottom: 14px; } .section-guanLi li a p { font-size: 16px; line-height: 26px; color: rgb(102, 102, 102); } .section-guanLi .col2-1 li { width: 50%; } .section-fufei { background-size: auto; background-position: center center; } .section-fufei .wrap { position: relative; } .section-fufei h2 { position: absolute; left: 0px; top: 100px; width: 100%; line-height: 1; color: rgb(255, 255, 255); font-size: 36px; text-align: center; } .section-fufei p {position: absolute;left: 0px;top: 165px;width: 100%;line-height: 1;color: #fff;font-size: 16px;text-align: center;} .section-system { } .section-system .title { position: relative; background: rgb(246, 247, 251); font-size: 36px; line-height: 1; color: rgb(34, 34, 34); padding: 85px 0px 80px; text-align: center; } .section-system .title::before { content: ""; width: 94px; height: 37px; background: url("ZhuZhaiXiaoQu/img/system-arrow.png") no-repeat; position: absolute; left: 50%; margin-left: -47px; bottom: -37px; z-index: 2; } .section-system ul { } .section-system li { padding: 80px 0px; } .section-system li .pic { float: right; } .section-system li.even { background: rgb(246, 247, 251); } .section-system li.even .pic { float: left; } .section-system li .wrap { position: relative; max-width: 1200px; margin: 0px auto; } .section-system li .desc { position: absolute; left: 0px; top: 50%; transform: translateY(-50%); } .section-system li .desc img {width: 80px;height: 80px;border-radius: 10px;box-shadow: rgb(6 39 135 / 0.1) 0px 3px 17.1px 0.9px;} .section-system li .desc h3 { font-size: 30px; color: rgb(17, 17, 17); line-height: 40px; margin: 40px 0px 15px; } .section-system li .desc p { font-size: 20px; line-height: 30px; color: rgb(86, 90, 94); } .section-system li.even .desc { left: auto; right: 0px; } .section-changJing { padding: 100px 0px 90px; text-align: center; background: rgb(246, 247, 251); } .section-changJing .title { line-height: 1; color: rgb(34, 34, 34); font-size: 36px; margin-bottom: 50px; } .section-changJing .title p { font-size: 16px; margin-top: 30px; color: rgb(70, 70, 71); } .section-changJing ul { margin: 0px -20px; } .section-changJing li { float: left; text-align: center; padding: 0px 20px; width: 25%; } .section-changJing li a { display: block; position: relative; border-radius: 10px; overflow: hidden; } .section-changJing li img { } .section-changJing li a span { display: block; font-size: 24px; line-height: 1; position: absolute; top: 50%; margin-top: -16px; color: rgb(255, 255, 255); width: 100%; text-align: center; } .section-case .hd { background: url("ZhuZhaiXiaoQu/img/caseHd-bg.jpg") 50% 50% / cover no-repeat; padding: 90px 0px; } .section-case .hd a { display: block; font-size: 36px; line-height: 60px; color: rgb(255, 255, 255); text-align: center; } .section-case .hd a span { width: 250px; line-height: 50px; display: inline-block; text-align: center; color: rgb(255, 255, 255); font-size: 20px; background: rgb(0, 163, 255); margin-top: 30px; } .section-case { background: rgb(246, 247, 251); text-align: center; padding: 0px 0px 100px; } .section-case .section-caseFocus { padding: 0px 0px 72px; margin-bottom: 70px; text-align: left; } .section-case .title { font-size: 36px; line-height: 60px; color: rgb(1, 1, 1); margin-bottom: 26px; margin-top: 88px; } .section-case ul { } .section-case li { float: left; width: 33.3333%; padding: 30px 11px 0px; } .section-case li a { display: block; border-radius: 10px; overflow: hidden; border: 1px solid rgb(255, 255, 255); text-align: center; background: rgb(255, 255, 255); } .section-case li a img { } .section-case li a:hover { border-color: rgb(210, 210, 210); box-shadow: rgba(22, 54, 90, 0.11) 0px 18px 21px 0px; } .section-service { text-align: center; padding: 100px 0px; background: rgb(251, 251, 251); } .section-service .title { font-size: 36px; line-height: 1; color: rgb(34, 34, 34); margin-bottom: 30px; } .section-service .title p { font-size: 16px; color: rgb(71, 71, 71); padding: 30px 0px 0px; } .section-service ul { margin: 0px -11px; } .section-service li { float: left; width: 33.3333%; padding: 30px 11px 0px; } .section-service li a { display: block; border: 1px solid rgb(238, 238, 238); border-radius: 5px; min-height: 150px; position: relative; background: rgb(255, 255, 255); } .section-service li img { position: absolute; left: 45px; top: 50%; margin-top: -40px; } .section-service li span { display: block; padding: 63px 0px 0px 120px; font-size: 24px; line-height: 1; color: rgb(55, 58, 61); } .section-pro { padding: 100px 0px; text-align: center; } .section-pro .title { font-size: 36px; line-height: 1; color: rgb(1, 1, 1); margin-bottom: 75px; } .section-pro ul { margin: 0px -11px 60px; } .section-pro li { float: left; width: 33.3333%; padding: 0px 11px; } .section-pro li a { display: block; overflow: hidden; border-radius: 10px; } .section-pro li a .bd { border-width: 0px 1px 1px; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-right-color: rgb(238, 238, 238); border-bottom-color: rgb(238, 238, 238); border-left-color: rgb(238, 238, 238); border-image: initial; border-top-style: initial; border-top-color: initial; border-radius: 0px 0px 10px 10px; line-height: 1; padding: 20px 0px; } .section-pro li a img { } .section-pro li a h3 { font-size: 20px; color: rgb(86, 90, 94); margin-bottom: 15px; } .section-pro li a span { font-size: 18px; color: rgb(0, 163, 255); } .section-pro li a:hover { box-shadow: rgba(22, 54, 90, 0.11) 0px 10px 20px 0px; } .section-pro .more { } .section-pro .more a { display: inline-block; width: 180px; line-height: 46px; border: 1px solid rgb(125, 125, 125); border-radius: 5px; font-size: 20px; color: rgb(85, 85, 85); } @media (max-device-width: 1024px) { } @media (max-device-width: 770px) { }