html{overflow-x:hidden;}
*{margin:0;padding:0;list-style-type:none;border:0;}
table{empty-cells:show;border-collapse:collapse;border-spacing:0;}
abbr,acronym{border:0;font-variant:normal}
address,caption,cite,code,dfn,th,var,optgroup,i,b,em,small,ins,tt,big{font-size:24px;font-style:normal;text-decoration:none;font-weight:normal;}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit}
input,button,textarea,select{*font-size:100%}
a{text-decoration:none;color:#454545;cursor:pointer;outline:none;blr:expression(this.onFocus=this.blur());-webkit-tap-highlight-color:rgba(0,0,0,0);}
img{display:block;}
.clear{display:block;overflow:hidden;clear:both;height:0;line-height:0;font-size:0;width:100%;}
body{font:24px/1.8 "Hiragino Sans GB","微软雅黑","Lucida Grande","Lucida Sans Unicode","Helvetica","Arial","Verdana","sans-serif";color:#333;background:#fff;position:relative;width:640px;margin:0 auto;}
div{ margin: auto; text-align: center;}
.le{ float: left;}
.ri{ float: right;}

/*左侧滑动*/
.slideout-menu{position: fixed;left: 0;top: 0;bottom: 0;right: 0;z-index: 0;width: 256px;overflow-y: auto;-webkit-overflow-scrolling: touch;display: none;}
.slideout-panel{position:relative;z-index: 1;}
.slideout-open,
.slideout-open body,
.slideout-open .slideout-panel{overflow: hidden;}
.slideout-open .slideout-menu{display: block;}
.menu-btn {width: 86px;height: 88px;background: url(images/nav_bg.png)}

/*header*/
.header{ width: 100%; height: 88px; background: #1a1d26;}
.nav{ width: 86px; height: 88px; background: url(images/nav_bg.png);}
.logo{ width: 247px; height: 58px; margin:15px 0 0 101px;}
.kefu{ width: 86px; height: 88px;}

/*service*/
.service{ width: 100%; height: 1050px; clear: both; overflow: hidden; background: #f3f3f3;}
.service h1{ font-size: 42px; color: #2b2b2b; line-height: 42px; padding-top: 60px;}
.service h6{ font-size: 18px; color: #c3c4c5; font-weight: 100; line-height: 51px;}
.ser-links{width: 100%; height:auto; margin:35px auto 0;}
.ser-links li{width: 288px; height:373px; float: left; display:block; border:1px solid #d3d3d4;border-radius:10px; margin:0 0 20px 20px;}
.ser-links li:hover{width: 288px; height:373px; background:#ededed;}
.ser-links li .pic1{ padding: 51px 0 0 78px;}
.ser-links li .pic2{ padding: 51px 0 0 58px;}
.ser-links li .pic3{ padding: 44px 0 0 68px;}
.ser-links li .pic4{ padding: 45px 0 0 85px;}
.ser-links li .tips{width: 100%; display:block;color: #a1a1a1; font-size:28px; color:#192d46; line-height:100px; font-weight: bold;}
.ser-links li:hover .tips{}
.ser-links li .tips ul li{ width:240px; height:23px; line-height:23px; background:url(images/sign_ico.png) no-repeat left; text-align:left; font-size:24px; color:#6a727f; text-indent:23px; border:0px; font-weight: 100;}
.ser-links li:hover .tips ul li{}

/*about*/
.about{ width: 100%; height: 811px; background:url(images/about_bg.jpg);}
.about h1{ font-size: 42px; color: #fff; line-height: 42px; padding-top: 60px;}
.about h6{ font-size: 18px; color: #868482; font-weight: 100; line-height: 51px;}
.about li{ height: 305px; float: left;}
.about li img{ padding-left: 36px;}
.about li p{ color: #fff; padding-top: 15px; line-height: 35px;}
.about ul{ margin-top: 20px;}
.about .li1{ width: 265px; height: 305px; margin-left: 36px;}
.about .li2{ width: 303px; height: 305px;}
.about .li3{ width: 265px; height: 305px; margin-left: 36px;}
.about .li4{ width: 303px; height: 305px;}

/*contact*/
.contact{ width: 100%; height: 700px; background: #eee;}
.contact h1{ font-size: 42px; color: #2b2b2b; line-height: 42px; padding-top: 60px;}
.contact h6{ font-size: 18px; color: #bfc2c5; font-weight: 100; line-height: 51px;}
.contact .text{ width: 600px; height: 442px; background: url(images/con_text_bg.png); margin-left: 20px; margin-top: 40px;}
.contact .text h3{ width: 100%; height: auto; text-align: left; line-height: 110px; font-size: 32px; text-indent: 57px; padding-top: 17px;}
.contact .text p{ height: auto; padding-left: 119px; text-align: left; line-height: 61px;}

.contact2{ width: 100%; height: 540px;}
.contact2 .text{ width: 600px; height: 442px; background: url(images/con_text_bg.png); margin-left: 20px; margin-top: 60px;}
.contact2 .text h3{ width: 100%; height: auto; text-align: left; line-height: 110px; font-size: 32px; text-indent: 57px; padding-top: 17px;}
.contact2 .text p{ height: auto; padding-left: 119px; text-align: left; line-height: 61px;}

.footer{ width: 100%; height: auto; background: #1a1d26; border-top: 14px solid #ffc600; color: #a8a8aa; padding: 58px 0; font-size: 24px;}
.fot_01{ height: auto; overflow: hidden; margin-left: 50px;}
.fot_01 div{ padding: 0 10px;}
.fot_02{ width: 100%;}


/*关于我们页面*/
.ab_banner{ width: 100%; height: 519px;}
.ab_main{ width: 100%; height: 800px; background: #eee;}
.ab_main h1{ font-size: 42px; color: #2b2b2b; line-height: 42px; padding-top: 60px;}
.ab_main h6{ font-size: 18px; color: #bfc2c5; font-weight: 100; line-height: 51px;}
.ab_main .text{ width: 600px; height: auto; font-size: 24px; color: #1a1d26; padding: 20px 0 30px 0; border-bottom: 1px dashed #c9c9c9; text-align: left;}
.ab_main .text2{ width: 600px; height: auto; font-size: 24px; color: #686a6d; padding: 30px 0 0 0; text-align: left;}
.ab_main2{ width: 100%; height: auto;}
.ab_main2 h1{ font-size: 42px; color: #2b2b2b; line-height: 42px; padding-top: 60px;}
.ab_main2 h6{ font-size: 18px; color: #bfc2c5; font-weight: 100; line-height: 51px;}
.ab_main2 .pic{ margin-left: 20px; padding: 30px 0 50px 0;}

/*应用程序开发页面*/
.ser1_banner{ width: 100%; height: 400px;}
.ser1_main{ width: 100%; height: 630px; background: #f3f3f3; clear: both; overflow: hidden;}
.ser1_main h1{ font-size: 42px; color: #2b2b2b; line-height: 42px; padding-top: 60px;}
.ser1_main h6{ font-size: 18px; color: #bfc2c5; font-weight: 100; line-height: 51px;}
.ser1_main ul{margin-left: 20px; padding: 30px 0 0;}
.ser1_main li{ width: 145px; height: auto; float: left; margin: 0 26px 20px 26px;}
.ser1_main li p{ width: 145px; height: auto; float: left;}
.ser1_main2{ width: 100%; height: auto; clear: both; overflow: hidden; padding-bottom: 10px;}
.ser1_main2 h1{ font-size: 42px; color: #2b2b2b; line-height: 42px; padding-top: 60px;}
.ser1_main2 h6{ font-size: 18px; color: #bfc2c5; font-weight: 100; line-height: 51px;}
.ser1_main2 li{ width: 290px; height: auto; float: left; margin-left: 20px; text-align: left; padding-top: 30px;}
.ser1_main2 li h3{ font-size: 28px; color: #454545; padding: 20px 0 0 0;}
.ser1_main2 li p{ color: #666666; line-height: 29px; padding: 10px 0 40px 0;}

/*电商配套服务页面*/
.ser2_main{ width: 100%; height: auto; background: #cfecff;}
.ser2_main h1{ font-size: 68px; color: #1a1d26; line-height: 68px; padding-top: 60px;}
.ser2_main .h2{ font-size: 28px; color: #1a1d26; font-weight: 100; line-height: 46px; background: #ffc600; width: 385px; height: 46px; margin-top: 30px;}
.ser2_main img{ margin-left: 66px; margin-top: 30px;}
.ser2_main p{ width: 540px; height: auto; line-height: 35px; text-align: left; color: #666; margin-left: 50px; margin-top: 30px;}
.ser2_main2 { width: 100%; height: 722px; background: url(images/ser2_bg2.jpg);}
.ser2_main2 h1{ font-size: 42px; color: #fff; line-height: 42px; padding-top: 60px;}
.ser2_main2 h6{ font-size: 18px; color: #8c8e93; font-weight: 100; line-height: 51px;}
.ser2_main2 img{ margin-left: 77px; margin-top: 30px;}
.ser2_main3 { width: 100%; height: 1376px; background:#f3f3f3;}
.ser2_main3 h1{ font-size: 42px; color: #1a1d26; line-height: 42px; padding-top: 60px;}
.ser2_main3 h6{ font-size: 18px; color: #bfc2c5; font-weight: 100; line-height: 51px;}
.ser2_main3 ul{ margin-top: 30px;}
.ser2_main3 li{ width: 600px; height: 363px; background: #fff; border-radius: 10px; margin: 0 0 20px 20px;}
.ser2_main3 li img{ padding: 42px 0 0 236px;}
.ser2_main3 li h3{ font-size: 36px; color: #1A1D26; padding: 10px 0 5px 0;}
.ser2_main3 li p{ color: #666; line-height: 36px;}

/*企业网站建设页面*/
.ser3_main{ width: 100%; height: 508px; background: url(images/ser3_bg.jpg);}
.ser3_main h1{ font-size: 64px; color: #fff; line-height: 68px; padding-top: 160px;}
.ser3_main p{ color: #fff; line-height: 35px; padding-top: 20px;}
.ser3_main2{ width: 100%; height: 975px; background: #f3f3f3;}
.ser3_main2 h1{ font-size: 42px; color: #2b2b2b; line-height: 42px; padding-top: 60px;}
.ser3_main2 h6{ font-size: 18px; color: #bfc2c5; font-weight: 100; line-height: 51px;}
.ser3_main2 ul{ margin: 20px 0 0 0;}
.ser3_main2 li{ width: 600px; height: 130px; margin: 0 0 20px 20px;}
.ser3_main2 li .textleft{ width: 178px; height: 130px; border-radius: 10px 0 0 10px; float: left;}
.ser3_main2 li .textleft h3{ width:95px; height: auto; line-height: 130px; color: #fff; float: left; text-align: left; padding-left: 20px;}
.ser3_main2 li .textleft span{ width: 50px; height: auto; line-height: 130px; color: #fff; float: left; text-align: left; font-size: 22px;}
.ser3_main2 li .li1{ background: #f4540f;}
.ser3_main2 li .li2{ background: #ffc600;}
.ser3_main2 li .li3{ background: #3bd39c;}
.ser3_main2 li .li4{ background: #3bb9d3;}
.ser3_main2 li .li5{ background: #3399ff;}
.ser3_main2 li .textright{ width: 422px; height: 130px; border-radius: 0 10px 10px 0; background: #e1e1e1; float: right;}
.ser3_main2 li .textright p{ color: #8c8c8c; padding: 12px 0 0 20px; text-align: left; line-height: 35px;}
.ser3_main3{ width: 100%; height: 746px; background: url(images/ser3_bg2.jpg);}
.ser3_main3 h1{ font-size: 42px; color: #fff; line-height: 42px; padding-top: 60px;}
.ser3_main3 h6{ font-size: 18px; color: #7c7e81; font-weight: 100; line-height: 51px;}
.ser3_main3 li{ width: 150px; height: auto; margin-left: 48px; float: left; margin-top: 25px;}
.ser3_main3 li h3{ color: #fff; font-size: 28px; padding-top: 10px;}
.ser3_main3 li p{ color: #fff; line-height: 21px; padding-bottom: 10px;}
.ser3_main4{ width: 100%; height: 780px; background: #f5f5f5; overflow: hidden;}
.ser3_main4 h1{ font-size: 42px; color: #2b2b2b; line-height: 42px; padding-top: 60px;}
.ser3_main4 h6{ font-size: 18px; color: #c5c7cb; font-weight: 100; line-height: 51px; padding-bottom: 30px;}
.ser3_main4 li{ width: 290px; height: 162px; float: left; margin-left: 20px; margin-bottom: 20px;}
.ser3_main4 li img{ width:290px; height:162px; float:left;}
.ser3_main4 li p{ width:290px; height:46px; float:left; color:#fff; font-size:24px; line-height:46px; margin-top:-46px; background:url(images/ser3_zz.png);}

/*品牌视觉设计页面*/

.ser4_main2{ width: 100%; height: 1250px; background: #ececec; overflow: hidden; clear: both;}
.ser4_main2 ul{ padding-top: 60px; margin-left: 20px;}
.ser4_main2 li{ width: 600px; height: auto; margin-bottom: 20px;}
.ser4_main2 li .li1{ width: 600px; height: 77px; background: #f4540f; border-radius: 10px 10px 0 0; text-align: left; color: #fff; line-height: 77px; text-indent: 20px; font-size: 28px;}
.ser4_main2 li .li2{ width: 600px; height: 77px; background: #ffc600; border-radius: 10px 10px 0 0; text-align: left; color: #fff; line-height: 77px; text-indent: 20px; font-size: 28px;}
.ser4_main2 li .li3{ width: 600px; height: 77px; background: #3bd39c; border-radius: 10px 10px 0 0; text-align: left; color: #fff; line-height: 77px; text-indent: 20px; font-size: 28px;}
.ser4_main2 li .li4{ width: 600px; height: 77px; background: #3bb9d3; border-radius: 10px 10px 0 0; text-align: left; color: #fff; line-height: 77px; text-indent: 20px; font-size: 28px;}
.ser4_main2 li .li5{ width: 600px; height: 77px; background: #3399ff; border-radius: 10px 10px 0 0; text-align: left; color: #fff; line-height: 77px; text-indent: 20px; font-size: 28px;}
.ser4_main2 li .li6{ width: 600px; height: 77px; background: #662fe2; border-radius: 10px 10px 0 0; text-align: left; color: #fff; line-height: 77px; text-indent: 20px; font-size: 28px;}
.ser4_main2 .text{ width: 600px; height: 95px; background: #fff; border-radius: 0 0 10px 10px;}
.ser4_main2 .text p{ color: #ababab; padding: 10px 20px 0 20px; text-align: left; line-height: 35px;}

.cd-top{display: inline-block;height: 40px;width: 40px;position: fixed;bottom: 40px;right: 10px;overflow: hidden;text-indent: 100%;white-space: nowrap;background: rgba(44, 44, 44, 0.8) url(images/cd-top-arrow.svg) no-repeat center 50%;visibility: hidden;opacity: 0;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.cd-top.cd-is-visible{/* the button becomes visible*/visibility: visible;opacity: 1;}
.cd-top.cd-fade-out{/* 如果用户继续向下滚动,这个按钮的透明度会变得更低*/opacity: 1;}
.no-touch .cd-top:hover{background-color: #e86256;opacity: 1;}