.ban{ margin-top:80px; } .part-bg{ position: relative; width:100%; height:100px; background-color: #f7f7f7; } .cj_part { position: absolute; width: 1000px; left: 50%; margin-left: -500px; top: -70px; height: 120px; background: #fff; z-index: 98; -moz-box-shadow: 0 2px 3px #cfcfcf; -webkit-box-shadow: 0 2px 3px #cfcfcf; -ms-box-shadow: 0 2px 3px #cfcfcf; box-shadow: 0 2px 3px #cfcfcf; display: flex; } .cj_part .cj_part_li { float: left; width: 254px; position: relative; overflow: hidden; } .cj_part_li img{ width:50px; margin:35px 15px 35px 22px; vertical-align: middle; } .cj_part_li .info{ vertical-align: middle; } .cj_part_li .info h2 { margin-top: 40px; font-size: 18px; line-height: 18px; color: #333; font-weight: normal; } .cj_part_li .info p { margin-top: 8px; line-height: 14px; color: #999; } .cj_part_li .link { top: 120px; width: 250px; height: 100%; position: absolute; background: #ee8333; /*background: rgba(283,131,51,0.9);*/ transition: 0.4s; } .cj_part_li:hover .link{ top:0; } .cj_part_li .link p { margin: 39px 64px; font-size: 16px; width: 120px; height: 42px; line-height: 42px; text-align: center; color: #ffffff; border: 1px solid #ffffff; border-radius: 8px; } .carousel-indicators li{ margin-top:100px; } #step1{ height:590px; } .step1-title{ padding:65px 0 30px; text-align:center; } .step1-title h1{ font-size:36px; line-height:36px; color:#878787; } .step1-title h1 span{ color:#bf095f; /*color:#ee8333;*/ } .step1-title p{ margin-top:10px; font-size:16px; line-height:28px; color:#878787; } .zweb03{ padding-bottom:50px; } .zweb03 .line{ margin:0 auto; width:824px; height:290px; position:relative; background:url("../images/line.png") no-repeat center center; } .zweb03 .line .num{ top:131px; width:28px; height:28px; z-index:2; position:absolute; background:#bf095f; /*background-color:#ee8333;*/ border-radius:50%; } .zweb03 .line .num.n1{ left:-13px; } .zweb03 .line .num.n2{ left:253px; } .zweb03 .line .num.n3{ left:520px; } .zweb03 .line .num.n4{ right:-14px; } .zweb03 .line .num p{ text-align:center; font-size:18px; color:#ffffff; line-height:28px; } .zweb03 .line .num .box{ left:-41px; top:-130px; width:126px; height:290px; position:absolute; } .zweb03 .line .num.n1 .box h1, .zweb03 .line .num.n3 .box h1{ margin-left:-46px; margin-top:78px; font-size:18px; width:200px; line-height:22px; color:#545454; text-align:center; } .zweb03 .line .num.n1 .tag, .zweb03 .line .num.n3 .tag{ bottom:0; width:126px; height:139px; z-index:-1; position:absolute; background:url("../images/zweb03-tag1.png") no-repeat center; } .zweb03 .line .num.n1 .tag h2, .zweb03 .line .num.n3 .tag h2{ margin-top:56px; width:108px; font-size:24px; line-height:26px; color:#ffffff; text-align:center; } .zweb03 .line .num.n2 .box h1, .zweb03 .line .num.n4 .box h1{ margin-left:-46px; margin-top:170px; font-size:18px; width:200px; line-height:22px; color:#545454; text-align:center; } .zweb03 .line .num.n2 .tag, .zweb03 .line .num.n4 .tag{ top:0; width:126px; height:139px; z-index:-1; position:absolute; background:url("../images/zweb03-tag2.png") no-repeat center; } .zweb03 .line .num.n2 .tag h2, .zweb03 .line .num.n4 .tag h2{ margin-top:28px; width:108px; font-size:24px; line-height:26px; color:#ffffff; text-align:center; } .zweb03 .line:hover .num.n1{ animation:move1 2s linear infinite; } .zweb03 .line:hover .num.n2{ animation:move2 2s linear infinite; } .zweb03 .line:hover .num.n3{ animation:move3 2s linear infinite; } .zweb03 .line:hover .num.n4{ animation:move4 2s linear infinite; } @keyframes move1{ 0%{left:-13px;} 50%{left:13px;} 100%{left:-13px;} } @keyframes move2{ 0%{left:253px;} 50%{left:233px;} 100%{left:253px;} } @keyframes move3{ 0%{left:500px;} 50%{left:520px;} 100%{left:500px;} } @keyframes move4{ 0%{right:-14px;} 50%{right:6px;} 100%{right:-14px;} } #step2{ width:100%; height:647px; background: url("../images/bg5.jpg") no-repeat center/cover; } .part-title2{ padding-top:80px; padding-bottom:50px; } .part-title2 .num{ padding-bottom:3px; font-size:80px; color:#ec1c32; text-align:center; font-family:Agency FB,sans-serif; background:url("../images/bg1.jpg") no-repeat center bottom; } .part-title2 h1{ margin-top:8px; font-size:45px; line-height:45px; text-align:center; } .part-title2 h1.c2{ color:#ffffff; } .part-title2 p{ margin:0 auto; margin-top:8px; font-size:16px; line-height:24px; text-align:center; width:635px; color:#888888; } .part-title2 p.big{ width:1000px; } .teacher02{ width:1090px; padding-bottom:40px; margin: 0 auto; } .teacher02 .box{ float:left; margin:0 15px; width:187px; } .teacher02 .box img{ width:187px; height:187px; } .teacher02 .box p{ margin-top:5px; font-size:16px; line-height:25px; text-align:center; color:#ffffff; } #step2 .btn{ margin:0 auto; width:276px; height:60px; line-height:43px; color:#ffffff; font-size:24px; text-align:center; display:block; transition:0.5s; border:1px solid #ffffff; border-radius:28px; } #step2 .btn:hover{ transition:0.5s; color:#363636; background:#ffffff; } #steps{ padding-top: 60px; padding-bottom: 60px; box-sizing: border-box; } .step{ height:780px; } .stepsWords{ text-align: center; position: relative; margin:0 auto; width:210px; font-size:32px; } .stepsWords .steps-left{ position:absolute; top:10px; left:0; width:25px; height:25px; background: url("../images/sprite.png") no-repeat 0 0; } .stepsWords .steps-right{ position:absolute; top:10px; right:0; width:25px; height:25px; background: url("../images/sprite.png") no-repeat -25px 0; } .stepsShow { display: flex; justify-content: space-between; padding: 30px 0 0 0; } .stepsShow li { width: 384px; text-align: center; padding:30px 15px 15px 15px; } .stepsShow li:hover{ box-shadow: 0 1px 16px #cbcbcb, 0 0 1px #eee, 0 0 1px #eee; } .stepsShow li a{ display: inline-block; color:#000; } dl { display: block; } .detail .detailTitle { font-size: 20px; margin-top:20px; opacity: 0; } .detailicon img { position: relative; cursor: pointer; width:90px; } .detailDescription { width: 100%; font-size: 12px; line-height: 20px; color: #999; opacity: 0; margin-top: 20px; } /*第三部分营销方案制定*/ #step3 { position: relative; padding-bottom: 150px; background: url('../images/bg2.jpg') no-repeat center/cover; box-sizing: border-box; } .system-img{ width:880px; } .step1Content { max-width: 1200px; width: 80%; margin: 0 auto; padding-bottom: 90px; } .step1Content .wheel{ position:absolute; top:120px; opacity: 0.6; } .step1Content .wheel img{ animation: animate1 8s infinite linear; } @-webkit-keyframes animate1 { 0%{ transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); } 100%{ transform: rotate(-360deg); -ms-transform: rotate(-360deg); -webkit-transform: rotate(-360deg); } } .step1Content .wheel .img2{ position:absolute; left: -115px; top:73px; } .stepWords { font-size: 36px; color: #fff; } .step1Detail { margin-top:25px; font-size: 18px; color: #fff; width: 400px; } .step1Detail:hover{ color: #eea14a; } .step3_l{ display: block; position: relative; margin-top: 245px; margin-left: 65px; } .step3_r{ width: 800px; height: 595px; display: block; position: relative; margin-top: 100px; margin-left:20px; } .font-size{ font-size: 48px; color:#ee8333; } /*第4部分权限管理*/ #step4 { position: relative; box-sizing: border-box; } .step2Content { width: 30%; max-width: 1200px; } .step2Words { font-size: 36px; color: #000; } .step2Detail { margin-top:25px; font-size: 18px; color: #000; width: 400px; } .step2Detail:hover{ color:#eea14a; } .system-img2{ width:810px; margin-top:11.5%; } .step4_l{ display: block; position: relative; margin-top: 218px; z-index:1; background-color: #fff; border:2px solid #ee8333; margin-left:-70px; padding:24px; border-radius: 0 20px 20px 0; } .step4_r{ width: 800px; height: 595px; display: block; position: relative; margin-top: 60px; z-index:2; } .bgLine{ position: absolute; width: 760px; height: 75px; top: 344px; left:0; overflow: hidden; } .bgLine > div{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .bgLine > div img{ float: left; } .bgLine.bgLineRight{ left: auto; right:-4px; z-index: 0; } .bgLine.bgLineRight>div{ left: auto; right: 0; z-index: -1; } /*第五部分呼叫中心*/ #step5 { position: relative; padding-bottom: 150px; background: url('../images/bg3.jpg') no-repeat center/cover; box-sizing: border-box; } .content_width{ width: 1500px; } .chonggou_l{ width: 346px; height: 350px; display: block; position: relative; margin-top: 160px; } .chonggou_l>img{ position: absolute; top: 0; left: 0; width:370px; } .chonggou_l>.title{ position: relative; z-index: 2; font-size: 30px; text-align: center; font-weight: 900; color: #fff; border-bottom: 1px solid #578cea; width: 85%; margin: 30px auto 40px; padding-bottom: 17px; } .chonggou_l>.content>p{ padding-left: 25px; margin-bottom: 15px; text-align: left; color: #fff; font-size: 18px; line-height: 20px; width:324px; } .chonggou_l>.content>p:hover{ color:#eea14a; } .chonggou_r{ width: 800px; height: 595px; display: block; margin-left: 30px; background: url('../images/chonggou_r_bg_l.png') no-repeat left center; border: 1px solid #3e71cc; border-left-color: transparent; position: relative; margin-top: 90px; } .chonggou_r>img{ width: 100%; padding: 8px; height: 100%; position: absolute; box-sizing: border-box; -ms-box-sizing: border-box; left: 0; top:0; } /*第六部分财务管理*/ #step6 { position: relative; box-sizing: border-box; } .step6Words{ font-size: 36px; color: #000; text-align: center; margin-top:70px; } .step6box{ width: 100%; height: 55px; line-height: 55px; font-size: 24px; text-align: center; color: #ffffff; background: #ee8333; margin-top:30px; } .step6-aaa{ float:left; width:75%; height:510px; margin-top:20px; } .step6-img{ margin:0 auto; width:860px; } .step6-right{ float:right; width:23%; height:300px; background-color: #f5f5f5; border-radius:0 0 50% 50%; padding:24px; color:#75716d; font-size: 16px; text-align: center; } .step6-right:hover{ color:#eea14a; } /*第七部分数据库管理*/ #step7 { position: relative; padding-bottom: 150px; background: url('../images/bg4.jpg') no-repeat center/cover; box-sizing: border-box; height:800px; } .step7Words{ text-align: center; padding-top:50px; font-size: 36px; color: #fff; } .step7Detail{ line-height: 55px; font-size: 20px; text-align: center; color: #999; margin-top:10px; } .step7BgContainer{ width:1200px; background: url("../images/bg4-img.png") no-repeat; margin-left:78px; } .plate7 .content_width { width: 1000px; margin: 0 auto; } .plate7 .fazhan_l{ box-sizing: border-box; -ms-box-sizing: border-box; } .plate7 .fazhan { padding-top: 1px; background: url("http://www.tedu.cn/jtxmt/pz/c/img/fazhan_bg.jpg") no-repeat top center; padding-bottom: 64px; } .plate7 .fazhan .biaoti { margin-top: 50px; margin-bottom: 55px; } .plate7 .fazhan .button { margin-top: 30px; } .plate7 .fazhan_c { background: url("http://www.tedu.cn/jtxmt/pz/c/img/fazhan_c_bg_01.png") no-repeat center; height: 540px; padding: 1px 0 0 0; overflow: hidden; } .plate7 .jieduan_pag { text-align: center; margin-top: 20px; } .plate7 .jieduan_pag span { display: inline-block; background: #3e71cc; height: 5px; width: 5px; margin: 0 8px; border-radius: 5px; cursor: pointer; transition: all 0.5s; } .plate7 .jieduan_pag .swiper-active-switch { background: #fff; width: 30px; } .plate7 .fazhan_l { width: 420px; padding-left: 75px; float: left; } .plate7 .fazhan_l .fazhan_lt { overflow: hidden; } .plate7 .fazhan_l .jieduan_pag { width: 150px; text-align: center; float: right; margin-top: 4px; } .plate7 .fazhan_l .jieduan_pag span { display: inline-block; background: #1c3053; height: 10px; width: 10px; margin: 0 8px; border-radius: 5px; cursor: pointer; } .plate7 .fazhan_l .jieduan_pag .swiper-active-switch { background: #3e71cc; } .plate7 .fazhan_l .jieduan { margin-top: 10px; float: left; width: 150px; height: 35px; overflow: hidden; line-height: 1; position: relative; } .plate7 .fazhan_l .jieduan div { font-size: 30px; color: #fff; font-weight: 900; float: left; line-height: 1; position: absolute; left: -150%; top: 0; width: 100%; transition: all 0.5s; opacity: 0; } .plate7 .fazhan_l .jieduan .true { left: 0; opacity: 1; } .plate7 .fazhan_l .fazhan_lb { width: 320px; overflow: hidden; color: #fff; margin-top: 70px; } .plate7 .fazhan_l .fazhan_lb .swiper-slide div { text-align: center; margin-bottom: 50px; } .plate7 .fazhan_l .fazhan_lb .swiper-slide div p { text-align: center; font-size: 36px; color: #fff; } .plate7 .fazhan_l .fazhan_lb .swiper-slide div span { font-size: 24px; color: #8a8a8a; } .plate7 .fazhan_r { float: left; width: 565px; position: relative; padding-top: 60px; } .plate7 .fazhan_r .img { width: 100%; margin-bottom: 20px; position: relative; } .plate7 .fazhan_r .img img { width: 100%; height: auto; position: absolute; left: 120%; visibility: hidden; transition: all 0.8s; opacity: 0; } .plate7 .fazhan_r .img .true { left: 0; display: block; z-index: 2; visibility: visible; opacity: 1; } .plate7 .fazhan_r .img .zhanwei { position: static; visibility: hidden; } .plate7 .fazhan_r .text { width: 100%; padding-right: 55px; } .plate7 .fazhan_r .text p { font-size: 18px; color: #fff; margin-top:50px; } .swiper-wrapper { position:relative; width:100%; -webkit-transition-property:-webkit-transform, left, top; -webkit-transition-duration:0s; -webkit-transform:translate3d(0px,0,0); -webkit-transition-timing-function:ease; -moz-transition-property:-moz-transform, left, top; -moz-transition-duration:0s; -moz-transform:translate3d(0px,0,0); -moz-transition-timing-function:ease; -o-transition-property:-o-transform, left, top; -o-transition-duration:0s; -o-transform:translate3d(0px,0,0); -o-transition-timing-function:ease; -o-transform:translate(0px,0px); -ms-transition-property:-ms-transform, left, top; -ms-transition-duration:0s; -ms-transform:translate3d(0px,0,0); -ms-transition-timing-function:ease; transition-property:transform, left, top; transition-duration:0s; transform:translate3d(0px,0,0); transition-timing-function:ease; } .swiper-free-mode > .swiper-wrapper { -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -ms-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto; } .swiper-slide { float: left; } .swiper-slide img{ width:309px; } /*第八部分销售管理*/ #step8 { position: relative; box-sizing: border-box; } .step8Content{ text-align: center; font-size: 36px; margin-top:30px; } .step8Detail{ font-size: 20px; text-align: center; color: #999; margin-top:10px; font-family: 'Microsoft YaHei'; } .step8Content img{ width:1000px; margin-top:30px; } /*第九部分生成报价*/ #step9 { position: relative; padding-bottom: 150px; background: url('../images/bg1.jpg') no-repeat center/cover; box-sizing: border-box; height:900px; } .step9-img{ width:83%; height:634px; margin:0 auto; background: url("../images/bg4-img.png") no-repeat center/cover; } .step9-img img{ width:100%; margin-top:120px; } @media screen and (max-width: 1920px) and (min-width: 1681px) { } @media screen and (max-width: 1680px) and (min-width: 1441px) { .step9-img { width: 86%; } } @media screen and (min-width: 1367px) and (max-width: 1440px) { .step9-img { width: 98%; } } @media screen and (min-width: 1281px) and (max-width: 1366px) { .step9-img { width: 98%; } } @media screen and (min-width: 1025px) and (max-width: 1280px) { .step9-img { width: 100%; } } @media screen and (min-width: 0) and (max-width: 1024px) { .step9-img { width: 115%; } }