@charset "utf-8"; /*全局样式*/ body{padding: 0;margin: 0;font-family: 'Microsoft YaHei';font-size: 14px;color: #333;} div,img,ul,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,p{padding: 0;margin: 0;border: 0;} ul{list-style: none;} a{text-decoration: none;color: #333;transition: 0.3s;-webkit-transition: 0.3s;} i,em{font-style: normal;} img{display: inline-block;max-width: 100%;height: auto;} /*去掉 input 默认边框*/ input{padding: 0;border: 0;font-family: 'Microsoft YaHei';font-size: 14px;color: #333;} input[type="submit"]{background-color: transparent;cursor: pointer;} /*去掉 textarea 默认边框*/ textarea{padding: 0;border: 0;font-family: 'Microsoft YaHei';font-size: 14px;color: #333;} /*去掉 button 默认边框*/ button{border: 0;padding: 0;background-color: transparent;font-family: 'Microsoft YaHei';font-size: 14px;color: #333;cursor: pointer;} /*清除浮动*/ .clearfix:after{content: '';display: table;clear: both;} .clearfix{*zoom: 1;/*IE6识别*/} /*解决chrome浏览器 input,textarea 获得焦点时会有一个边框的问题*/ input,textarea{outline: none;} /*清除ios端 input,textarea 默认内阴影 默认圆角,radio和checkbox需要还原值为normal*/ input,textarea{appearance: none;-webkit-appearance: none;border-radius: 0;} /*自定义 input,textarea 的placeholder文字样式*/ input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color: #ccc;} /*常用盒模型*/ /**{box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}*/ /*滚动条*/ body *::-webkit-scrollbar{width: 2px;height: 2px;background: #eee;border-radius: 2px;} body *::-webkit-scrollbar-thumb{background: #009adc;border-radius: 2px;} /*常用宽度*/ .w1400{position: relative;width: 96%;margin: 0 auto;height: 100%;max-width: 1400px;} .w1300{position: relative;width: 96%;margin: 0 auto;height: 100%;max-width: 1300px;} .w1280{position: relative;width: 96%;margin: 0 auto;height: 100%;max-width: 1280px;} .w1200{position: relative;width: 96%;margin: 0 auto;height: 100%;max-width: 1200px;} .w1140{position: relative;width: 96%;margin: 0 auto;height: 100%;max-width: 1140px;} .w1100{position: relative;width: 96%;margin: 0 auto;height: 100%;max-width: 1100px;} .w1000{position: relative;width: 96%;margin: 0 auto;height: 100%;max-width: 1000px;} /*常用过渡*/ .tran300{-webkit-transition: 0.3s;-moz-transition: 0.3s;-ms-transition: 0.3s;transition: 0.3s;} .tran500{-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5s;} /*常用浮动*/ .fl{float: left;} .fr{float: right;} /*底部按钮通用样式*/ .btns-area{font-size: 0;text-align: center;} .btns-area .btn{display: inline-block;padding: 0 2em;margin: 0 10px;background-color: #fff;border: 1px solid #ddd;border-radius: 4px;font-size: 16px;line-height: 34px;color: #333;cursor: pointer;} .btns-area .btn img{display: inline-block;vertical-align: middle;margin: -3px 6px 0 0;} .btns-area .btn:hover{opacity: .9;} /*百度分享*/ .share-wrap .bdsharebuttonbox{font-size: 0;} .share-wrap .bdsharebuttonbox a{float: none;display: inline-block;width: 28px;height: 28px;margin: 0 2px;overflow: hidden;background-position: center;background-size: 100% 100%;background-repeat: no-repeat;} .share-wrap .bdsharebuttonbox .bds_weixin{background-image: url(../images/icon_weixin_32.png);} .share-wrap .bdsharebuttonbox .bds_tsina{background-image: url(../images/icon_weibo_32.png);} .share-wrap .bdsharebuttonbox .bds_sqq{background-image: url(../images/icon_qq_32.png);} .bdshare_popup_box{display: none!important;} /*自定义select*/ .custom-select{position: relative;width: 200px;background-color: #fff;} .custom-select .name{position: relative;height: 36px;padding-left: 1.5em;border: 1px solid #999;color: #333;line-height: 34px;cursor: pointer;} .custom-select .name:after{content: "";position: absolute;right: 10px;top: 50%;width: 12px;height: 12px;border-right: 1px solid #999;border-bottom: 1px solid #999;transform: rotate(45deg) translate(-100%,-20%);} .custom-select .list{display: none;position: absolute;left: 0;width: 100%;background-color: #fff;box-shadow: 0 5px 10px rgba(0,0,0,.2);} .custom-select .list li a{display: block;padding: 10px 0 10px 10px;border-top: 1px solid #eee;font-size: 12px;line-height: 16px;} .custom-select .list li a:hover{background-color: #019add;color: #fff;} body{line-height: normal;} /*成功案例*/ .success-case-box{padding-bottom: 40px;} .success-case-box *{box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;} /*banner1*/ .success-case-box .banner1{position: relative;padding-top: 90%;background-position: center top;background-size: 100% auto;background-repeat: no-repeat;color: #fff;} .success-case-box .banner1 .title{position: absolute;left: 0;top: 60px;width: 100%;text-align: center;font-weight: bold;} .success-case-box .banner1 .title .tit1{font-size: 32px;} .success-case-box .banner1 .title .tit2{margin-top: 10px;font-size: 56px;} .success-case-box .banner1 .info{position: absolute;left: 0;bottom: 0;width: 100%;padding: 10% 50px 5%;background-image: linear-gradient(180deg,transparent,#4a8ed8 25%);} .success-case-box .banner1 .info .tit{padding-bottom: 36px;border-bottom: 1px solid rgba(255,255,255,.3);font-size: 22px;line-height: 30px;font-weight: bold;} .success-case-box .banner1 .info .tit span{margin-left: 8px;font-size: 14px;font-weight: normal;text-transform: uppercase;font-style: italic;} .success-case-box .banner1 .info .tit span:before{content: "/";margin-right: 8px;} .success-case-box .banner1 .info .txt{margin-top: 30px;font-size: 16px;line-height: 32px;text-align: justify;} /*banner2*/ .success-case-box .banner2{position: relative;padding-top: 71%;background-position: center top;background-size: cover;background-repeat: no-repeat;color: #fff;} .success-case-box .banner2 .title{position: absolute;left: 50%;top: 50%;padding: 15px 0 20px;border-top: 1px solid #fff;border-bottom: 1px solid #fff;text-align: center;font-weight: bold;transform: translate(-50%,-50%);white-space: nowrap;} .success-case-box .banner2 .title .tit1{font-size: 46px;line-height: 60px;} .success-case-box .banner2 .title .tit2{margin-top: 10px;font-size: 32px;line-height: 40px;} /*banner3*/ .success-case-box .banner3{position: relative;padding-top: 52%;background-position: center top;background-size: cover;background-repeat: no-repeat;color: #fff;} .success-case-box .banner3 .title{position: absolute;left: 0;top: 50%;padding: 15px 0 20px;font-weight: bold;transform: translate(0,-50%);white-space: nowrap;} .success-case-box .banner3 .title .tit1{display: inline-block;padding: 0 64px;border-bottom: 1px solid rgba(255,255,255,.25);font-size: 32px;line-height: 60px;} .success-case-box .banner3 .title .tit2{padding: 0 180px 0 64px;border-bottom: 1px solid rgba(255,255,255,.25);font-size: 46px;line-height: 72px;} /*banner4*/ .success-case-box .banner4{position: relative;padding-top: 45%;background-position: center top;background-size: cover;background-repeat: no-repeat;} .success-case-box .banner4 .title{position: absolute;left: 30px;right: 30px;top: 50%;padding: 20px 0;border-top: 3px solid #333;border-bottom: 3px solid #333;text-align: center;font-weight: bold;white-space: nowrap;transform: translateY(-50%);} .success-case-box .banner4 .title .tit1{font-size: 42px;line-height: 1;} .success-case-box .banner4 .title .tit2{margin-top: 20px;font-size: 42px;line-height: 1;} .success-case-box .banner4 .title.white{border-color: #fff;color: #fff;} /*banner5*/ .success-case-box .banner5{position: relative;padding-top: 50%;background-position: center top;background-size: cover;background-repeat: no-repeat;} .success-case-box .banner5 .title{position: absolute;left: 30px;right: 30px;top: 50%;padding: 20px 0;border-top: 3px solid #fff;border-bottom: 3px solid #fff;text-align: center;font-weight: bold;white-space: nowrap;color: #fff;transform: translateY(-50%);} .success-case-box .banner5 .title .tit1{font-size: 42px;line-height: 1;} .success-case-box .banner5 .title .tit2{margin-top: 20px;font-size: 42px;line-height: 1;} /*主要内容*/ .success-case-box .main-content{min-height: 500px;padding: 60px 50px 20px;background-color: #fff;} /*标题*/ .success-case-box .main-content .common-title{padding-left: 24px;margin-bottom: 30px;background-image: linear-gradient(90deg,#4a8ed8,transparent);font-size: 22px;line-height: 55px;font-weight: bold;color: #fff;} .success-case-box .main-content .common-title span{margin-left: 8px;font-size: 14px;font-weight: normal;text-transform: uppercase;font-style: italic;} .success-case-box .main-content .common-title span:before{content: "/";margin-right: 8px;} /*布局*/ .success-case-box .main-content > .item{margin-bottom: 20px;} .success-case-box .main-content > .item:last-child{margin-bottom: 0;} .success-case-box .main-content > .item > .content{padding: 30px 0;border-top: 1px solid #e9e9e9;font-size: 16px;line-height: 32px;} .success-case-box .main-content > .item > .content .blue{color: #009ADC;} .success-case-box .main-content > .item > .content .red{color: #D30012;} .success-case-box .main-content > .item > .content .border-blue{padding: .5em 1em;margin: 20px 0;border: 1px solid #009ADC;color: #009ADC;} .success-case-box .main-content > .item > .content .bg-blue{padding: 1em .5em;margin: 20px 0;background-color: #009ADC;color: #fff;} /*通用边距*/ .success-case-box .mt30{margin-top: 30px;} .success-case-box .mt50{margin-top: 50px;} .success-case-box .mb20{margin-bottom: 20px;} .success-case-box .mb30{margin-bottom: 30px;} .success-case-box .mb50{margin-bottom: 50px;} /*文字列表左侧带小圆点*/ .text-dot-list{} .text-dot-list li{position: relative;padding-left: 34px;margin-bottom: 36px;text-align: justify;} .text-dot-list li:before{content: "";position: absolute;left: 0;top: 11px;width: 10px;height: 10px;background-color: #000;border-radius: 50%;} .text-dot-list.style2 li{padding-left: 20px;margin-bottom: 10px;} .text-dot-list.style2 li:before{background-color: #009ADC;} .text-dot-list.style3 li{padding-left: 0;margin-bottom: 10px;} .text-dot-list.style3 li:before{display: none;} /*左文右图内容*/ .info-pic-wrap{overflow: hidden;} .info-pic-wrap > .con-l{float: left;width: 35%;} .info-pic-wrap > .con-l p{margin-bottom: 60px;} .info-pic-wrap > .con-r{margin-left: 40%;} .info-pic-wrap > .con-r img{width: 100%;} /*样式2*/ .info-pic-wrap.style2 > .con-l{width: 37%;} .info-pic-wrap.style2 > .con-l p{margin-bottom: 40px;} .info-pic-wrap.style2 > .con-r{margin-left: 42%;} /*图片横向列表*/ .pic-list{overflow: hidden;margin: 10px 0;} .pic-list li{float: left;width: 32.6%;margin-left: 1.1%;} .pic-list li:first-child{margin-left: 0;} .pic-list li img{width: 100%;} /*样式2*/ .pic-list.style2 li{border: 1px solid #dbdbdb;} /*样式3*/ .pic-list.style3{margin: 30px 0;} .pic-list.style3 li{width: 50%;padding: 0 30px;margin-left: 0;text-align: center;} .pic-list.style3 li .pic-wrap{display: inline-block;} /*带名称图片*/ .pic-wrap{text-align: center;} .pic-wrap img{display: block;width: 100%;} /*左文右图列表*/ .info-pic-list{} .info-pic-list > li{overflow: hidden;margin-bottom: 50px;} .info-pic-list > li .info{float: left;width: 42%;} .info-pic-list > li .tit{font-size: 25px;color: #4a8dd7;} .info-pic-list > li .txt{margin-top: 28px;} .info-pic-list > li .pic{float: right;width: 54%;} /*左右信息文字*/ .flex-info-box{display: flex;justify-content: space-between;flex-wrap: wrap;border-top: 1px solid #009ADC;border-bottom: 1px solid #009ADC;} .flex-info-box .cont{width: 49%;box-sizing: border-box;padding: 10px;border-left: 1px solid #009ADC;border-right: 1px solid #009ADC;} /*右侧悬浮栏*/ .fixed-win{z-index: 10;position: absolute;left: 50%;top: 660px;width: 50px;margin-left: 570px;transition: 0.2s;} .fixed-win *{box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;} .fixed-win .links{overflow: hidden;text-align: center;} .fixed-win .links a{display: block;padding: 15px 0;margin-bottom: 3px;background-color: #ddd;font-size: 14px;color: #fff;} .fixed-win .links a img{display: block;width: 16px;height: 16px;margin: 0 auto;} .fixed-win .links a span{display: inline-block;width: 2em;margin-top: 3px;} .fixed-win .links a:hover{background-color: #4a8dd7;} .fixed-win .share-wrap{text-align: center;} .fixed-win .share-wrap .bdsharebuttonbox a{width: 50px;height: 50px;margin: 0 0 1px;background-color: #fff;background-size: 28px 28px;} /*弹窗-技术支持*/ .popup-tech{display: none;z-index: 10;position: fixed;left: 50%;top: 50%;transform: translate(-50%,-50%);box-shadow: 0 0 20px rgba(0,0,0,.3);} .popup-tech *{box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;} .popup-tech .close-btn{position: absolute;right: 10px;top: 10px;width: 24px;height: 24px;background-color: #0083bb;border-radius: 50%;font-size: 14px;text-align: center;line-height: 24px;color: #fff;cursor: pointer;} .popup-tech .title{padding: 0 50px 0 20px;background-color: #009adc;line-height: 44px;color: #fff;} .popup-tech .content{padding: 20px;background-color: #fff;} .popup-tech .content .row{margin-bottom: 10px;} .popup-tech .content .row input{width: 100%;height: 40px;padding: 0 1em;border: 1px solid #ccc;border-radius: 20px;font-size: 12px;} .popup-tech .content .row textarea{width: 100%;height: 100px;padding: .5em 1em;border: 1px solid #ccc;border-radius: 10px;font-size: 12px;resize: none;} .popup-tech .content .row input:focus{border-color: #009adc;} .popup-tech .content .row textarea:focus{border-color: #009adc;} .popup-tech .content .row input::-webkit-input-placeholder{color: #999;} .popup-tech .content .row textarea::-webkit-input-placeholder{color: #999;} .popup-tech .btns-area .btn{width: 100%;padding: 0;margin: 0;background-color: #d9f0fa;border: 0;border-radius: 20px;font-size: 12px;line-height: 40px;color: #009adc;} /*小屏PC:>=1025px && <=1200px*/ @media screen and (max-width: 1200px){ /*右侧悬浮栏*/ .fixed-win{left: auto;right: 0;margin-left: 0;} } /*pad横屏:>=769px && <=1024px*/ @media screen and (max-width: 1024px){ } /*phone:<=768px*/ @media screen and (max-width: 768px){ /*右侧悬浮栏*/ .fixed-win{top: 218px;width: 24px;} .fixed-win .links a{padding: 10px 0;margin-bottom: 1px;font-size: 12px;} .fixed-win .links a img{width: 14px;height: 14px;} .fixed-win .links a span{margin-top: 0;line-height: 16px;transform: scale(.8);} .fixed-win .share-wrap .bdsharebuttonbox a{width: 24px;height: 24px;background-size: 16px 16px;} /*弹窗-技术支持*/ .popup-tech .title{padding: 8px 40px 8px 10px;font-size: 12px;line-height: 24px;white-space: nowrap;} .popup-tech .content{padding: 20px 10px;} .popup-tech .content .row{margin-bottom: 5px;} .popup-tech .content .row input{height: 30px;border-radius: 15px;} .popup-tech .content .row textarea{} .popup-tech .btns-area .btn{line-height: 30px;} /*成功案例*/ .success-case-box{padding-bottom: 20px;} /*banner1*/ .success-case-box .banner1 .title{top: 20px;} .success-case-box .banner1 .title .tit1{font-size: 16px;} .success-case-box .banner1 .title .tit2{margin-top: 5px;font-size: 24px;} .success-case-box .banner1 .info{padding: 10% 10px 5%;} .success-case-box .banner1 .info .tit{padding-bottom: 5px;font-size: 16px;} .success-case-box .banner1 .info .txt{padding: 0 10px;margin-top: 5px;font-size: 12px;line-height: 20px;} /*banner2*/ .success-case-box .banner2 .title{padding: 10px;} .success-case-box .banner2 .title .tit1{font-size: 22px;line-height: 30px;} .success-case-box .banner2 .title .tit2{margin-top: 5px;font-size: 16px;line-height: 20px;} /*banner3*/ .success-case-box .banner3 .title .tit1{padding: 0 10px;border-bottom: 0;font-size: 16px;line-height: 20px;} .success-case-box .banner3 .title .tit2{padding: 0 30px 0 10px;margin-top: 5px;border-bottom: 0;font-size: 22px;line-height: 30px;} /*banner4*/ .success-case-box .banner4 .title{left: 10px;right: 10px;padding: 10px;border-width: 2px;} .success-case-box .banner4 .title .tit1{font-size: 13px;line-height: 20px;} .success-case-box .banner4 .title .tit2{margin-top: 5px;font-size: 13px;line-height: 20px;} /*banner5*/ .success-case-box .banner5 .title{left: 10px;right: 10px;padding: 10px;border-width: 2px;white-space: normal;} .success-case-box .banner5 .title .tit1{font-size: 13px;line-height: 20px;} .success-case-box .banner5 .title .tit2{margin-top: 5px;font-size: 13px;line-height: 20px;} /*主要内容*/ .success-case-box .main-content{padding: 20px 10px;} /*标题*/ .success-case-box .main-content .common-title{padding-left: .8em;margin-bottom: 10px;background-image: linear-gradient(90deg,#4a8ed8 60%,transparent);font-size: 15px;line-height: 40px;} .success-case-box .main-content .common-title span{display: inline-block;margin-left: 5px;font-size: 12px;transform: scale(.8);transform-origin: left;} .success-case-box .main-content .common-title span:before{margin-right: 5px;} /*布局*/ .success-case-box .main-content > .item{margin-bottom: 10px;} .success-case-box .main-content > .item > .content{padding: 10px;font-size: 14px;line-height: 24px;} /*通用边距*/ .success-case-box .mt30{margin-top: 10px;} .success-case-box .mt50{margin-top: 10px;} .success-case-box .mb30{margin-bottom: 10px;} .success-case-box .mb50{margin-bottom: 10px;} /*文字列表左侧带小圆点*/ .text-dot-list li{padding-left: 15px;margin-bottom: 15px;} .text-dot-list li:before{top: 9px;width: 6px;height: 6px;} /*左文右图内容*/ .info-pic-wrap > .con-l{float: none;width: 100%;} .info-pic-wrap > .con-l p{margin-bottom: 15px;} .info-pic-wrap > .con-r{margin-left: 0;} /*样式2*/ .info-pic-wrap.style2 > .con-l{width: 100%;} .info-pic-wrap.style2 > .con-l p{margin-bottom: 15px;} .info-pic-wrap.style2 > .con-r{margin-left: 0;} /*图片横向列表*/ .pic-list li{float: none;width: 100%;margin-left: 0%;} .pic-list li:first-child{margin-left: 0;} /*样式3*/ .pic-list.style3{margin: 10px 0;} .pic-list.style3 li{width: 100%;padding: 0 10px;margin-bottom: 20px;} /*左文右图列表*/ .info-pic-list > li{margin-bottom: 10px;} .info-pic-list > li .info{float: none;width: 100%;} .info-pic-list > li .tit{font-size: 16px;} .info-pic-list > li .txt{margin-top: 10px;} .info-pic-list > li .pic{float: none;width: 100%;} /*左右信息文字*/ .flex-info-box .cont{width: 100%;} }