/*新闻资讯页面*/ .mar_T52 { margin-top: 52px; } .mar_T90 { margin-top: 90px; } .mar_B25 { margin-bottom: 25px; } @media screen and (max-width: 750px){ .mar_T52 { margin-top: 52px; } .mar_T90 { margin-top: 30px; } .mar_B25 { margin-bottom: 25px; } } .new_list { width: 1248px; } .new_list li { width:368px; float: left; margin-right: 48px; border-bottom:2px solid #f2f2f2; padding: 20px 0; position: relative; height: 180px; } .new_list1 { font-size: 22px; line-height: 32px; height: 64px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .new_list1 b { color: #0093dd; margin-right: 10px; font-weight: normal; } .new_list2 { color: #444; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-height: 22px; overflow: hidden; margin: 30px 0 15px; } .new_list3 { display: block; vertical-align: middle; line-height: 24px; color: #c6c6c6; } .new_list3 img { vertical-align: middle; height: 20px; margin-right: 8px; position: relative; top: -2px; } .new_list4 { position: absolute; top: 20px; left: 0; width: 368px; height: 158px; display: block; transition: all 1s ease 0s; overflow: hidden; opacity: 0; } .new_list4 img { display: block; width: 100%; height: 100%; transition: all .4s ease 0s; } .new_list5 { width: 0%; height: 2px; position: absolute; bottom: -2px; left: 0; display: block; background: #0093dd; transition: all 2s ease 0s; } .new_list li:hover .new_list4 { opacity: 1; } .new_list li:hover .new_list4 img { transform: scale(1.05); } .new_list li:hover .new_list5 { width: 100%; } @media screen and (max-width: 750px){ .new_list { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto; } .new_list li { width:100%; height: auto; float: left; margin-right: 0; border-bottom:2px solid #f2f2f2; padding: 15px 0 10px; position: relative; } .new_list1 { font-size: 16px; line-height: 24px; height: 48px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .new_list1 b { color: #0093dd; margin-right: 10px; font-weight: normal; } .new_list2 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 22px; overflow: hidden; margin: 5px 0 10px; font-size: 14px; color: #666; } .new_list3 { display: block; vertical-align: middle; line-height: 24px; color: #c6c6c6; } .new_list3 img { vertical-align: middle; height: 20px; margin-right: 8px; position: relative; top: -2px; } .new_list4 { position: absolute; top: 20px; left: 0; width: 368px; height: 180px; display: block; transition: all 1s ease 0s; overflow: hidden; opacity: 0; display: none; } .new_list4 img { display: block; width: 100%; height: 100%; transition: all .4s ease 0s; } .new_list5 { width: 0%; height: 2px; position: absolute; bottom: -2px; left: 0; display: block; background: #0093dd; transition: all 2s ease 0s; } .new_list li:hover .new_list4 { opacity: 1; } .new_list li:hover .new_list4 img { transform: scale(1.05); } .new_list li:hover .new_list5 { width: 100%; } } /*案例列表*/ .case_list { width: 1230px; } .case_list li { float: left; margin-right: 30px; width: 380px; margin-top: 30px; } .case_listA { width: 378px; height: 228px; overflow: hidden; position: relative; } .case_listA_img1 { display: block; width: 100%; height: 100%; transition: all .4s ease 0s; } .case_listA_text { position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.5); width: 100%; height: 100%; transition: all .2s ease 0s; opacity: 0; } .case_listA_text { color: #FFFFFF; text-align: center; display: block; transition: all .4s ease 0s; } .case_listA_text span { display: block; width: 0px; height: 1px; background: #FFFFFF; margin: 0 auto; transition: all .4s ease 0s; } .case_listA_text b { height: 36px; line-height: 36px; font-weight: normal; transition: all .4s ease 0s; opacity: 0; } .case_listA_text1 { margin-top: 106.5px; } .case_listB { padding: 0 15px; border: 1px solid #ebebeb; border-top: none; } .case_listB1 { display: block; font-size: 18px; /* height: 36px; line-height: 36px; */ overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不显示的地方用省略号...代替*/ text-overflow:ellipsis;/* 支持 IE */ padding-top: 10px; padding-bottom: 5px; } .case_listB2 { display: block; /* height: 30px; line-height: 30px; */ color: #777; overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不显示的地方用省略号...代替*/ text-overflow:ellipsis;/* 支持 IE */ border-bottom: 1px solid #ebebeb; padding-bottom: 10px; margin-left: -3px; } .case_listB2 span { margin: 0 3px; } .case_listB3 { display: block; /* height: 30px; line-height: 30px; */ background: url("../images/case_listC.png") 90% center no-repeat; background-size: 24px 8px; padding: 15px 0; color: #666666; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } .case_list li:hover .case_listA_text span { width: 15px; } .case_list li:hover .case_listA_img1 { transform: scale(1.05); } .case_list li:hover .case_listA_text b { opacity: 1; } .case_list li:hover .case_listA_text { opacity: 1; } .case_list li:hover { box-shadow: 0 0px 10px rgba(0,0,0,0.2); } .case_list li:hover .case_listB3 { background: url("../images/case_listC.png") 100% center no-repeat; background-size: 24px 8px; -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: #0093dd; } @media screen and (max-width: 750px){ .case_list { /* width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px);*/ width:100%; margin: 0 auto; } .case_list li { float: left; margin-right: 0px; width: 48%; margin-top: 15px; } .case_list li:nth-child(2n) { float: right; } .case_listA { width: 100%; height: 122px!important; overflow: hidden; position: relative; } .case_listA_img1 { display: block; width: 100%; height: 100%; transition: all .4s ease 0s; } .case_listA_text { position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.5); width: 100%; height: 100%; transition: all .2s ease 0s; opacity: 0; } .case_listA_text { color: #FFFFFF; text-align: center; display: block; transition: all .4s ease 0s; } .case_listA_text span { display: block; width: 0px; height: 1px; background: #FFFFFF; margin: 0 auto; transition: all .4s ease 0s; } .case_listA_text b { height: 36px; line-height: 36px; font-weight: normal; transition: all .4s ease 0s; opacity: 0; } .case_listA_text1 { margin-top: 106.5px; } .case_listB { padding: 0 10px; border: 1px solid #ebebeb; border-top: none; } .case_listB1 { display: block; font-size: 14px; height: 32px; /* height: 20px; line-height: 20px; */ overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不显示的地方用省略号...代替*/ text-overflow:ellipsis;/* 支持 IE */ padding-top: 10px; } .case_listB2 { display: block; /* height: 20px; line-height: 20px; */ color: #777; overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不显示的地方用省略号...代替*/ text-overflow:ellipsis;/* 支持 IE */ border-bottom: 1px solid #ebebeb; padding-bottom: 5px; margin-left: -3px; } .case_listB2 span { margin: 0 3px; } .case_listB3 { display: block; /* height: 20px; line-height: 20px; */ background: url("../images/case_listC.png") 96% center no-repeat; background-size: 15px auto; padding: 5px 0; color: #666666; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } .case_list li:hover .case_listA_text span { width: 15px; } .case_list li:hover .case_listA_img1 { transform: scale(1.05); } .case_list li:hover .case_listA_text b { opacity: 1; } .case_list li:hover .case_listA_text { opacity: 1; } .case_list li:hover { box-shadow: 0 0px 10px rgba(0,0,0,0.2); } .case_list li:hover .case_listB3 { background: url("../images/case_listC.png") 100% center no-repeat; background-size: 24px 8px; -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: #0093dd; } } @media screen and (max-width: 412px){ .case_listA { height: 121px!important; } } @media screen and (max-width: 375px){ .case_listA { height: 110px!important; } } @media screen and (max-width: 360px){ .case_listA { height: 105px!important; } } /*案例详情的样式*/ .anli_box { position: relative; height:718px; } .anli_pc { width:900px; height: 718px; width:829px; height:465px; background: url("../images/anli_pc.png") no-repeat; background-size: 100% 100%; margin: 0 auto; padding: 38px 35px 215px 36px; } .anli_pc img { display: block; width: 100%; } .show_box { width: 100%; height: 100%; overflow: hidden; overflow-y: auto ; position: relative; } .anli_app { width: 170px; height:303px; position: absolute; bottom: 0; right: 70px; padding: 50px 12px 67px 12px; background: url("../images/anli_app.png") no-repeat; background-size: 100% 100%; } .show_box img { position: absolute; top: 0; left: 0; width: 100%; animation: show_box 5s infinite linear; animation-direction:alternate; } @keyframes show_box { from {top: 0;} to { top: 0;} } .anli_name { font-size: 30px; height: 50px; line-height: 50px; text-align: center; margin-bottom: 10px; margin-top: 60px; } .anli_jieshao { font-size: 16px; color: #999999; width: 900px; margin: 0 auto 30px auto; line-height: 20px; } @media screen and (max-width: 750px){ .anli_name { font-size: 16px; height: 24px; line-height: 24px; text-align: center; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin:20px auto 0px auto; } .anli_jieshao { color: #999999; width: 900px; line-height: 20px; font-size: 12px; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto 15px auto; } } @media screen and (max-width: 750px){ /*手机端的案例图*/ .app_anli { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto; } .app_anli .app_anli1 { height: 24px; border-left: 3px solid #0093dd; font-size: 16px; text-indent: 10px; } .app_anli2 { margin: 10px auto 20px; width: 100%; height: 400px; overflow-y: auto; } .app_anli2 img { width: 100%; display: block; } } .anli_btn { width: 600px; margin: 20px auto 50px auto; overflow: hidden; } .anli_btn a { height: 40px; width: 180px; background: #0093dd; border-radius: 40px; float: left; display: block; vertical-align: middle; text-align: center; font-size: 16px; color: #FFFFFF; line-height: 40px; margin: 0 60px ; } .anli_btn a:hover { background: #076a9c; } .anli_btn a img { vertical-align: middle; height: 30px; margin-right: 8px; position: relative; top: -2px; } @media screen and (max-width: 750px){ .anli_btn { width: 100%; margin: 10px auto 30px auto; overflow: hidden; } .anli_btn a { height: 30px; width: 40%; background: #0093dd; border-radius: 30px; float: left; display: block; vertical-align: middle; text-align: center; font-size: 14px; color: #FFFFFF; line-height: 33px; margin: 0 5% ; } .anli_btn a:hover { background: #076a9c; } .anli_btn a img { vertical-align: middle; height: 20px; margin-right: 5px; } } /*首页的样式*/ /*这是大banner图的轮播样式*/ .banner_box{height: 100vh;width: 100%;z-index: 100;position: relative} .fullSlide{width:100%;position:relative;height:100%;} .fullSlide .bd{margin:0 auto;position:relative;z-index:0;overflow:hidden;} .fullSlide .bd ul{width:100% !important;} .fullSlide .bd li{width:100% !important;height:100%;overflow:hidden;text-align:center;background-size: 100% 100%;background-position: bottom;position: relative} /*.fullSlide .bd li a{display:block;height:100vh;}*/ .fullSlide .bd li{display:block;height:100vh;} .fullSlide .hd{width:360px;margin:0 auto;position:absolute;z-index:1;bottom:18px;right:0px;height:12px;line-height:30px;} /*.fullSlide .hd ul{text-align:center;}*/ .fullSlide .hd ul li{cursor:pointer;display:inline-block;*display:inline;zoom:1;width:50px;height:2px;margin-right: 10px;overflow:hidden;background:rgba(255,255,255,0.5);filter:alpha(opacity=50);opacity:0.5;line-height:999px;border-radius: 6px;} .fullSlide .hd ul .on{background:#fff;} .fullSlide .prev,.fullSlide .next{display:block;position:absolute;z-index:1;top:50%;margin-top:-30px;left:15%;z-index:1;width:40px;height:60px;/*background:url(../images/slider-arrow.png) -126px -137px #000 no-repeat;*/cursor:pointer;filter:alpha(opacity=50);opacity:0.5;display:none;} .fullSlide .next{left:auto;right:15%;background-position:-6px -137px;} .banner_text1 { position: relative; text-align: center; color: #ffffff; font-size:54px; display: block; width: 70%; margin: 5% auto 0; top: 40%; letter-spacing: 6px; font-weight: bold; font-family: 'microsoft yahei', arial; } .banner_line { display: block; margin: 0 auto; position: relative; width: 500px; height:2px; top: 44%; background: #FFFFFF; } .banner_text2 { position: relative; text-align: center; color: #ffffff; font-size:32px; display: block; width: 80%; margin: 0 auto; top: 48%; letter-spacing: 6px; } .banner_href { height: 40px!important; width: 200px; line-height: 40px; border-radius: 5px; background: #0093dd; color: #ffffff; margin: 0 auto; top: 54%; clear: both; font-size:20px; position: relative; display: block; visibility: hidden; display: none; } .toL { -webkit-animation: toL 1s ease-in both; } @-webkit-keyframes toL { 0% {opacity: 0.4;-webkit-transform: translate(300px, 0)} 100% {opacity: 1;-webkit-transform: translate(0px, 0);} } .toR { -webkit-animation: toR .8s ease-in both; } @-webkit-keyframes toR { 0% {opacity: 0.4;-webkit-transform: translate(-300px, 0)} 100% {opacity: 1;-webkit-transform: translate(0px, 0);} } .toT1 { -webkit-animation: toT 1.2s ease-in both; } .toT2 { -webkit-animation: toT 1.6s ease-in both; } @-webkit-keyframes toT { 0% {opacity: 0;-webkit-transform: translate(0px, 200px)} 70% {opacity: 0.4;-webkit-transform: translate(0px, -6px)} 100% {opacity: 1;-webkit-transform: translate(0px, 0);} } .lr { -webkit-animation: lr 1.1s ease-in both; } @-webkit-keyframes lr { 0% {opacity: 0.4;-webkit-transform: translate(200px, 200px)} 100% {opacity: 1;-webkit-transform: translate(0px, 0);} } .suofang { -webkit-animation: suofang 1.5s 1.8s ease-in infinite; } @-webkit-keyframes suofang { 0% {opacity: 0.8;-webkit-transform: scale(1);visibility: visible} 50% {opacity: 1;-webkit-transform:scale(0.9);} 100% {opacity: 0.8;-webkit-transform: scale(1);} } .banner_line { -webkit-animation: banner_line 3s ease-in both; } @-webkit-keyframes banner_line { 0% {width: 0;opacity: 0} 100% {width: 500px;opacity: 0.8} } .welcome { position: absolute; width: 230px; height: 64px; line-height: 64px; background: #eb2401; text-align: center; font-size: 24px; color: #f4f5f9; bottom: 0; left: 0; z-index: 6; letter-spacing: 2px; } .w-320 { width:-webkit-calc(100% - 320px); width:-moz-calc(100% - 320px); width:calc(100% - 320px); margin: 0 auto; min-width: 1200px; } /*@media screen and (max-width: 1366px){*/ /*.w-320*/ /*{*/ /*margin: 0 auto;*/ /*min-width: 1200px;*/ /*}*/ /*}*/ @media screen and (max-width: 750px){ body { font-size: 12px; } .w-320 { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto; min-width: auto; } .index-E .w-320 { width: 100%; } } .index-A { overflow: hidden; margin-top: 40px; padding-right:290px; padding-right:41.9%; min-height:286px; background: url("../images/index-A.png") no-repeat right top; background-size: 255px 286px; } .index-A1 { font-size: 16px; color: #999999; line-height: 20px; margin: 48px auto 11px auto; } .index-A2 { font-size: 36px; color: #1a1a1a; font-weight: bold; line-height: 46px; } .color_0093dd { color: #0093dd; } .color_db2001 { color: #db2001; } .index-A3 { font-size: 16px; color: #333; margin-top: 28px; line-height: 30px; } .index-A3 span { font-weight: bold; } @media screen and (max-width: 750px){ .index-A { overflow: hidden; margin-top: 30px; padding-right:90px; min-height:auto; background: url("../images/index-A.png") no-repeat right top; background-size: 80px auto; } .index-A1 { font-size: 20px; color: #999999; line-height: 20px; font-weight: bold; margin: 0px auto 15px auto; } .index-A2 { font-size: 16px; color: #1a1a1a; font-weight: bold; line-height: 22px; } .index-A3 { font-size: 12px; color: #333; margin-top: 20px; line-height: 20px; width:-webkit-calc(100% + 90px); width:-moz-calc(100% + 90px); width:calc(100% + 90px); text-align: justify; } .index-A3 span { font-weight: bold; } } .index-B { width:-webkit-calc(100% + 50px); width:-moz-calc(100% + 50px); width:calc(100% + 50px); margin-top: 54px; } .index-B li { width:-webkit-calc(20% - 50px); width:-moz-calc(20% - 50px); width:calc(20% - 50px); float: left; margin-right: 50px; height: 375px; border-bottom: 2px solid #dfdfdf; position: relative; cursor: pointer; } .index-B1 { height: 72px; line-height: 72px; } .index-B1 .index-B1L { width:52px; height: 52px; float: left; position: relative; } .index-B1 .index-B1L img { width: 100%; height: 100%; margin-top: 6px; transition: all .6s ease 0s; } @media screen and (max-width: 750px){ .index-B { width: 100%; margin-top: 15px; } .index-B li { width: 20%; float: left; margin-right: 0px; height: auto; border-bottom: 1px solid #dfdfdf; position: relative; cursor: pointer; } .index-B1 { line-height: normal; width: 100%; height: auto; } .index-B1 .index-B1L { width:32px; height: 32px; float: none; margin: 0 auto; position: relative; } .index-B1 .index-B1L img { width: 100%; height: 100%; margin-top: 0px; transition: all .6s ease 0s; } } .index-B1 .index-B1L .index-B1L-2 { position: absolute; top: 0; left: 0; opacity: 0; } .index-B1 .index-B1R { width:-webkit-calc(100% - 60px); width:-moz-calc(100% - 60px); width:calc(100% - 60px); float: right; text-align: right; font-size: 80px; color: #e0e0e0; font-weight: bold; font-family: Arial, Helvetica; transition: all .6s ease 0s; } @media screen and (max-width: 1800px){ .index-B1 .index-B1R { font-size: 70px; } } @media screen and (max-width: 1600px){ .index-B1 .index-B1R { font-size: 60px; } } .index-B2 { font-size: 24px; font-weight: bold; line-height: 36px; margin: 21px auto 8px auto; transition: all .6s ease 0s; } @media screen and (max-width: 750px){ .index-B2 { font-size: 12px; font-weight: bold; line-height: 32px; text-align: center; margin: 0px auto 0px auto; transition: all .6s ease 0s; } } .index-B3 { font-size: 20px; font-weight: bold; line-height: 32px; color: #d9d9d9; margin-bottom: 3px; transition: all .6s ease 0s; } @media screen and (max-width: 1800px){ .index-B3 { font-size: 18px; } } @media screen and (max-width: 1600px){ .index-B3 { font-size: 16px; } } .index-B4 { display: block; line-height: 34px; background: url("../images/index-B4-bj.png") 2px center no-repeat; background-size: 5px 1px ; padding-left: 15px; } .index-B4:hover { color: #f52901; } .index-B5 { width: 0%; height: 2px; background: #f52901; position: absolute; bottom: -2px; left: 0; transition: all 1s ease 0s; } .index-B li:hover .index-B2 { color: #00a6ec; } .index-B li:hover .index-B3 { color: #adadad; } .index-B li:hover .index-B5 { width: 100%; } .index-B li:hover .index-B1R { color: #b2b2b2; } .index-B li:hover .index-B1 .index-B1L .index-B1L-1 { opacity: 0; } .index-B li:hover .index-B1 .index-B1L .index-B1L-2 { opacity: 1; } /*解决方案*/ .index-C { width: auto; height: 610px; background: url("../images/index-C.jpg") no-repeat center; background-size: auto 610px; margin: 100px auto 0 auto; } .index-CL { width: 50%; float: left; padding: 94px 0 100px 0px; /*background: url("../images/index-CL.jpg") right bottom;*/ background-size:960px 610px; height: 416px; } .index-CL1 { font-size:36px; color: #ffffff; height: 48px; line-height: 48px; } .index-CL2 { width: 80%; color: #FFFFFF; text-align: justify; line-height: 24px; margin-top: 8px; } .index-CL-list { width: 648px; margin-left: -45px; } .index-CL-list li { width:150px; height: 92px; float: left; margin-left: 12px; margin-top: 55px; } .index-CL-list li a { display: block; width: 100%; height: 100%; } .index-CL-list li a img { height: 57px; width: 57px; display: block; margin: 0 auto; } .index-CL-list li a:hover { -webkit-animation: updown .4s ease-in both; color: #00a6ec!important; } .index-CL-list li a:hover p { color: #00a6ec!important; } @media screen and (max-width: 750px){ .index-C { width: auto; height: auto; background: transparent; background-size: auto 610px; margin: 20px auto 0 auto; } .index-CL { min-width: 10px; float: left; padding: 15px ; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); background: url("../images/index-CL.jpg") right top; background-size:960px 610px; height: auto; } .index-CL1 { font-size:18px; color: #ffffff; height: 30px; line-height: 30px; } .index-CL2 { width: 100%; color: #FFFFFF; text-align: justify; line-height: 20px; margin-top: 5px; font-size: 12px; } .index-CL-list { width:-webkit-calc(100% + 30px); width:-moz-calc(100% + 30px); width:calc(100% + 30px); margin-left: -15px; } .index-CL-list li { width:25%; height: auto; float: left; margin-left: 0; margin-top: 20px; } .index-CL-list li a { display: block; width: 100%; height: 100%; } .index-CL-list li a img { height: 32px; width: 32px; display: block; margin: 0 auto; } .index-CL-list li a:hover { -webkit-animation: updown .4s ease-in both; color: #00a6ec!important; } .index-CL-list li a:hover p { color: #00a6ec!important; } } .index-CL-list li a p { text-align: center; line-height: 21px; margin-top: 14px; color: #FFFFFF; } @media screen and (max-width: 750px){ .index-CL-list li a p { text-align: center; line-height: 21px; margin-top:5px; color: #FFFFFF; font-size: 12px; } } .index-CR { /*min-width: 600px;*/ width:-webkit-calc(50% - 40px); width:-moz-calc(50% - 40px); width:calc(50% - 40px); float: left; padding: 94px 0px 100px 40px ; height: 416px; } @media screen and (max-width: 1700px){ .index-CR { float: right; width:-webkit-calc(50% - 40px); width:-moz-calc(50% - 40px); width:calc(50% - 40px); padding: 94px 0px 100px 40px ; } } @media screen and (max-width: 1600px){ .index-CR { width:-webkit-calc(50% - 30px); width:-moz-calc(50% - 30px); width:calc(50% - 30px); padding: 94px 0px 100px 30px ; } } @media screen and (max-width: 1600px){ .index-CR { width:-webkit-calc(50% - 20px); width:-moz-calc(50% - 20px); width:calc(50% - 20px); padding: 94px 0px 100px 0px ; } } .index-CR-list { width: 760px; } .index-CR-list li { width: 290px; float: left; margin-left: 90px; margin-bottom: 85px; } @media screen and (max-width: 1700px){ .index-CR-list li { margin-left: 60px; } } @media screen and (max-width: 1600px){ .index-CR-list li { margin-left: 50px; -moz-margin-left: 50px; /* 火狐等使用Mozilla浏览器引擎的浏览器 */ -webkit-margin-left: 50px; /* Safari, 谷歌浏览器等使用Webkit引擎的浏览器 */ -o-margin-left: 50px; /* Opera浏览器(早期) */ -ms-margin-left: 50px; /* Internet Explorer (不一定) */ } } @media screen and (max-width: 1600px){ .index-CR-list li { margin-left: 20px; } } @media screen and (max-width: 1366px){ .index-CR-list li { margin-left: 10px; } } .index-CR-list li .index-CR-list1 { font-size: 18px; font-weight: bold; line-height: 30px; } .index-CR-list li .index-CR-list2 { width: 60px; height: 2px; background: #00bbf6; margin-top: 24px; margin-bottom: 22px; } .index-CR-list li .index-CR-list3 { line-height: 30px; width: 270px; } @media screen and (max-width: 750px){ .index-CR { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); min-width: 10px; float: right; padding: 15px ; background: url("../images/index-CR.jpg") right bottom; background-size: auto 100% ; height: auto; margin-top: 15px; } .index-CR-list { width: 100%; } .index-CR-list li { width: 100%; float: left; margin-left: 0px; margin-bottom: 10px; } .index-CR-list li .index-CR-list1 { font-size: 16px; font-weight: normal; line-height: 30px; } .index-CR-list li .index-CR-list2 { width: 60px; height: 2px; background: #00bbf6; margin-top: 5px; margin-bottom: 5px; } .index-CR-list li .index-CR-list3 { line-height: 22px; width: 100%; font-size: 12px; } } /*案例展示*/ .index-D { margin-top: 95px; } .index-D-type { overflow: hidden; background: url("../images/index-D-line.png") left center no-repeat; background-size:1px 16px ; width: 600px; margin: 32px auto 0 auto; } .index-D-type a { display: block; float: left; width: 120px; height: 36px; line-height: 36px; text-align: center; background: url("../images/index-D-line.png") right center no-repeat; background-size:1px 16px ; color: #666666; font-size: 16px; margin-left: -1px; } .index-D-typeSelect { background: url("../images/index-D-line333.png") right center no-repeat #333333!important; color: #FFFFFF!important; } .index-D-type a:hover { color: #FFFFFF!important; background: url("../images/index-D-line333.png") right center no-repeat #333333!important; } .index-D-list { width:-webkit-calc(100% + 55px); width:-moz-calc(100% + 55px); width:calc(100% + 55px); margin-top: 3px; } .index-D-list li { width: 480px; float: left; margin-right: 55px; margin-top: 37px; transition: all .5s ease 0s; } .index-D-list li:hover .index-D-list1 { transform: scale(1.1); } .index-D-list li:hover .index-D-list2 { color: #0093dd; } .index-D-list li .index-D-list1 { width:366px; height: 232px; overflow: hidden; padding:13px 56px 57px 58px; background: url("../images/index-D-diannao.png") no-repeat; background-size: 100% 100%; transition: all .5s ease 0s; } .index-D-list li .index-D-list1 img { display: block; width: 100%; max-height: 100%; } .index-D-list2 { display: block; height: 22px; line-height: 22px; font-size: 18px; overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不显示的地方用省略号...代替*/ text-overflow:ellipsis;/* 支持 IE */ text-align: center; } @media screen and (max-width: 1890px){ .index-D-list li { margin-right: 40px; } } @media screen and (max-width: 1860px){ .index-D-list li { margin-right: 35px; } } @media screen and (max-width: 1820px){ .index-D-list li { margin-right: 25px; } } @media screen and (max-width: 1800px){ .index-D-list { width: 1365px; margin: 0 0 0 -82.5px; } .index-D-list li { width: 400px; float: left; margin-right: 55px; margin-top: 37px; transition: all .5s ease 0s; } /*.index-D-list li:hover*/ /*{*/ /*transform: scale(1.1);*/ /*}*/ .index-D-list li:hover .index-D-list2 { color: #0093dd; } .index-D-list li .index-D-list1 { width:320px; height: 190px; overflow: hidden; padding:13px 56px 57px 58px; background: url("../images/index-D-diannao.png") no-repeat; background-size: 100% 100%; } } @media screen and (max-width: 750px){ .index-D { margin-top: 15px; } .index-D-type { overflow: hidden; /*background: url("../images/index-D-line.png") left center no-repeat;*/ background: none; /*background-size:1px 16px ;*/ width: 100%; margin: 10px auto 0 auto; } .index-D-type a { display: block; float: left; width: 20%; height: 30px; line-height: 30px; text-align: center; background: none; background-size:1px 16px ; color: #666666; font-size: 12px; margin-left: -1px; letter-spacing: -1px; } .index-D-typeSelect { background: #333333!important; color: #FFFFFF!important; } .index-D-type a:hover { color: #FFFFFF!important; background: url("../images/index-D-line333.png") right center no-repeat #333333!important; } .index-D-list { width:-webkit-calc(100% + 15px); width:-moz-calc(100% + 15px); width:calc(100% + 15px); margin: 3px auto; } .index-D-list li { width:-webkit-calc(50% - 15px); width:-moz-calc(50% - 15px); width:calc(50% - 15px); float: left; margin-right: 15px; margin-top: 10px; transition: all .5s ease 0s; overflow: hidden; } /*.index-D-list li:hover*/ /*{*/ /*transform: scale(1.1);*/ /*}*/ .index-D-list li:hover .index-D-list2 { color: #0093dd; } .index-D-list li .index-D-list1 { width:100%; height: auto; overflow: hidden; padding:0; background: none; background-size: 100% 100%; } .index-D-list li .index-D-list1 img { display: block; width: 100%; } .index-D-list2 { display: block; height: 26px; line-height: 26px; font-size: 12px; overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不显示的地方用省略号...代替*/ text-overflow:ellipsis;/* 支持 IE */ border-bottom: 1px dotted #cacaca; } } /*首页新闻资讯*/ .index-E { margin-top: 98px; /*padding: 94px 0 50px 0;*/ padding: 50px 0 30px 0; background: url("../images/index-E.jpg") no-repeat top left; background-size: 1920px 100%; clear: both; } .index-E-list { width:-webkit-calc(100% + 40px); width:-moz-calc(100% + 40px); width:calc(100% + 40px); margin-top: 33px; } .index-E-list li { width:-webkit-calc(50% - 120px); width:-moz-calc(50% - 120px); width:calc(50% - 120px); float: left; margin-right: 40px; padding: 0 40px; background: #FFFFFF; position: relative; } .index-E-listL { width: 112px; float: left; margin-top: 30px; transition: all 5s ease 0s; } .index-E-listL .index-E-listL1 { font-size: 50px; color: #999999; line-height: 50px; font-size: 50px; } .index-E-listL .index-E-listL2 { color: #999999; line-height: 24px; } .index-E-img { width:0px ; height: 140px; overflow: hidden; float: left; transition: all 1s ease 0s; position: absolute; top: 0; left: 0px; } .index-E-list li:hover .index-E-listL { opacity: 0; } .index-E-list li:hover .index-E-img { width:286px ; } .index-E-img img { display: block; width: 286px; height: 140px; } .index-E-list li:hover { background: #0093dd; } .index-E-list li:hover .index-E-listR { width:-webkit-calc(100% - 285px); width:-moz-calc(100% - 285); width:calc(100% - 285px); } .index-E-listR { width:-webkit-calc(100% - 112px); width:-moz-calc(100% - 112px); width:calc(100% - 112px); float: right; transition: all 1s ease 0s; } .index-E-listR a { display: block; padding-right: 25px; height: 140px; line-height: 140px; font-size: 18px; background: url("../images/index-E-jiantou0.png") right center no-repeat; background-size:22px 18px ; overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不显示的地方用省略号...代替*/ text-overflow:ellipsis;/* 支持 IE */ } .index-E-list li:hover .index-E-listR a { color: #FFFFFF!important; background: url("../images/index-E-jiantou1.png") right center no-repeat!important; background-size:22px 18px !important; } .index-E-border { border-top: 1px solid #e6e6e6; } .index-E-borderN { border-top: none; } @media screen and (max-width: 750px){ .index-E { margin-top: 15px; padding: 15px 15px 25px 15px; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); background: url("../images/index-E.jpg") no-repeat top left; background-size: auto 100%; clear: both; } .index-E-list { width: 100%; margin-top: 15px; } .index-E-list li { float: left; margin-right: 0px; padding: 10px 15px; margin-bottom: 1px; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); background: #FFFFFF; position: relative; } .index-E-listL { width: 50px; float: left; margin-top: 0px; transition: all 5s ease 0s; } .index-E-listL .index-E-listL1 { color: #999999; line-height: 30px; font-size: 22px; display: block; text-align: center; } .index-E-listL .index-E-listL2 { color: #999999; line-height: 20px; text-align: center; } .index-E-img { width:0px ; height: 140px; overflow: hidden; float: left; transition: all 1s ease 0s; position: absolute; top: 0; left: 0px; } .index-E-list li:hover .index-E-listL { opacity:1; } .index-E-list li:hover .index-E-listL * { color: #FFFFFF!important; } .index-E-list li:hover .index-E-img { width:286px ; } .index-E-img img { display: none; width: 286px; height: 140px; } .index-E-list li:hover { background: #0093dd; } .index-E-list li:hover .index-E-listR { width:-webkit-calc(100% - 65px); width:-moz-calc(100% - 65px); width:calc(100% - 65px); } .index-E-listR { width:-webkit-calc(100% - 65px); width:-moz-calc(100% - 65px); width:calc(100% - 65px); float: right; transition: all 1s ease 0s; } .index-E-listR a { display: block; padding-right: 25px; height: 50px; line-height: 50px; font-size: 14px; background: url("../images/index-E-jiantou0.png") right center no-repeat; background-size:11px 9px ; overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不显示的地方用省略号...代替*/ text-overflow:ellipsis;/* 支持 IE */ } .index-E-list li:hover .index-E-listR a { color: #FFFFFF!important; background: url("../images/index-E-jiantou1.png") right center no-repeat!important; background-size:11px 9px !important; } .index-E-border { border-top: none; } .index-E-borderN { border-top: none; } } /*合作*/ .index-F { clear: both; width: 1920px; margin-left: -360px; background: url("../images/index_logobj.jpg") bottom no-repeat; background-size: 1920px 309px ; padding-top: 84px; overflow: hidden; } .index-Flist { border-top: 1px dashed #e6e6e6; border-left: 1px dashed #e6e6e6; margin: 33px auto 230px auto; width: 1195px; } .index-Flist li { height: 148px; width: 238px; float: left; /*border-right: 1px dashed #e6e6e6;*/ border-right: 1px dashed #ccc; border-bottom: 1px dashed #ccc; transition: all .5s ease 0s; } .index-Flist li a { display: block; width: 100%; height: 100%; } .index-Flist li img { width: 220px; height:auto; display: block; margin: 44px auto; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } .index-Flist li:hover { background: #f5f5f5; } .index-Flist li:hover img { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: none; -webkit-animation: back-y-spin .5s ease-in both; } @media screen and (max-width: 750px){ .index-F { clear: both; margin-left:0; background: url("../images/index_logobj.jpg") bottom no-repeat; background-size: 100% auto ; padding-top: 15px; overflow: hidden; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); padding: 15px; } .index-Flist { border-top: 1px dashed #e6e6e6; border-left: 1px dashed #e6e6e6; margin: 15px auto 15px auto; width: 100%; box-sizing: border-box; } .index-Flist li { height: auto; width: 50%; float: left; box-sizing: border-box; border-right: 1px dashed #e6e6e6; border-bottom: 1px dashed #e6e6e6; transition: all .5s ease 0s; } .index-Flist li a { display: block; width: 100%; height: 100%; min-height:52px; } .index-Flist li img { width: 80%; height: auto; display: block; margin: 15px auto; -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); -o-filter: grayscale(0); filter: grayscale(0); } .index-Flist li:hover { background: #f5f5f5; } .index-Flist li:hover img { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); filter: none; -webkit-animation: back-y-spin .5s ease-in both; } } @-webkit-keyframes back-y-spin { 0% { -webkit-transform: rotateY(0deg); } 50% { -webkit-transform: rotateY(90deg); } 51% { -webkit-transform: rotateY(180deg); } 51% { -webkit-transform: rotateY(270deg); } 100% { -webkit-transform: rotateY(360deg); } } /*留言*/ .index-G { width:1920px; height: 480px; padding: 100px 0; background: url("../images/index-G.jpg") no-repeat; background-size: 100% 100%; margin-left: -360px; } .index-GL { width:260px; height: 420px; padding: 60px 40px 0 40px; background: url("../images/index-GL.png") no-repeat; background-size: 100% 100%; float: left; } .index-G-title1 { font-size: 30px; line-height: 36px; color: #FFFFFF; text-transform:uppercase } .index-G-title2 { margin-top: 8px; font-size: 16px; line-height: 28px; color: #FFFFFF; } .index-GL-input { margin-top: 29px; position: relative; } .index-GL-input .index-GL-input1 { height: 26px; line-height: 26px; display: block; width: 100%; border: none; outline: none; font-size: 14px; border-bottom: 1px solid #ffffff; color: #FFFFFF; } .index-GL-input1::-webkit-input-placeholder { /* placeholder颜色 */ color: #FFFFFF; } .index-GL-submit { display: block; width: 128px; height: 36px; border: 1px solid #FFFFFF; color: #FFFFFF; outline: none; font-size: 16px; margin: 30px auto 0; margin: 30px auto 0; transition: all .5s ease 0s; cursor: pointer; } .index-GL-submit:hover { background: #FFFFFF; color: #db2001; } .index-GL-yz { width: 110px; height: 30px; position: absolute; bottom: 0; right: 0; background: #000000; overflow: hidden; } .yz_img { width:80px; height: 30px; overflow: hidden; float: left; } .yz_img img { display: block; width: 100%; height: 100%; } .yz_btn { border: none; outline: none; height: 30px; width: 30px; float: right; background: url("../images/index-Gqh.png") no-repeat; background-size: 100% 100%; cursor: pointer; transition: all 1s ease 0s; display: block; } .qiehuan { -moz-transform:rotate(360deg); -webkit-transform:rotate(360deg); transform:rotate(360deg); filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2); } @media screen and (max-width: 750px){ .index-G { width:100%; height: auto; padding: 15px; background: url("../images/index-G.jpg") no-repeat top right; background-size: auto 500px; margin-left: 0px; /*overflow: hidden;*/ width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); position: relative; display: none; } .index-GL { height: auto; width: 100px; padding: 15px 15px 25px 15px; background: url("../images/index-GL.png") no-repeat; background-size: 100% 100%; float: left; position: absolute; top: 350px; width:-webkit-calc(100% - 60px); width:-moz-calc(100% - 60px); width:calc(100% - 60px); } .index-G-title1 { font-size: 20px; line-height: 30px; color: #FFFFFF; text-transform:uppercase } .index-G-title2 { margin-top: 0px; font-size: 12px; line-height: 20px; color: #FFFFFF; } .index-GL-input { margin-top: 15px; position: relative; } .index-GL-input .index-GL-input1 { height: 26px; line-height: 26px; display: block; width: 100%; border: none; outline: none; font-size: 14px; border-bottom: 1px solid #ffffff; color: #FFFFFF; } .index-GL-input1::-webkit-input-placeholder { /* placeholder颜色 */ color: #FFFFFF; } .index-GL-submit { display: block; width: 128px; height: 36px; border: 1px solid #FFFFFF; color: #FFFFFF; outline: none; font-size: 16px; margin: 30px auto 0; margin: 30px auto 0; transition: all .5s ease 0s; cursor: pointer; } .index-GL-submit:hover { background: #FFFFFF; color: #db2001; } .index-GL-yz { width: 110px; height: 30px; position: absolute; bottom: 0; right: 0; background: #000000; overflow: hidden; } .yz_img { width:80px; height: 30px; overflow: hidden; float: left; } .yz_img img { display: block; width: 100%; height: 100%; } .yz_btn { border: none; outline: none; height: 30px; width: 30px; float: right; background: url("../images/index-Gqh.png") no-repeat; background-size: 100% 100%; cursor: pointer; transition: all 1s ease 0s; } .qiehuan { -moz-transform:rotate(360deg); -webkit-transform:rotate(360deg); transform:rotate(360deg); filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2); } } .index-GR { width:600px; height: 420px; padding: 60px 80px 0 80px; background: #FFFFFF; float: left; } .index-GR .index-G-title1 { text-align: center; color: #0093dd; } .index-GR .index-G-title2 { text-align: center; color: #333333; } .index-GR .index-G-title3 { font-size: 12px; color: #666666; text-align: center; line-height: 24px; margin-top: 30px; } .index-GR-ul { width: 704px; margin-left: -52px; } .index-GR-ul li { width: 176px; float: left; } .index-GR-ul li:hover { -webkit-animation: updown .3s ease-in both; } .index-GR-ul li img { width: 32px; height: 32px; margin: 55px auto 13px; display: block; } .index-GR-ul li p { line-height: 28px; text-align: center; } .index-GR-bottom { width: 86px; margin: 0 auto; background: #FFFFFF; padding: 0 15px; position: relative; } .index-GR-bottom .index-GR-bottom1 { width: 43px; float: left; position: relative; cursor: pointer; } .index-GR-bottom .index-GR-bottom1:hover { -webkit-animation: updown .3s ease-in both; } .index-GR-bottom .index-GR-bottom1 img { display: block; width: 22px; height: 22px; margin: 0 auto; } .xianA { margin-top: 55px; width: 100%; height: 11px; border-bottom: 1px solid #b3b3b3; } .weixin { width: 150px; /*height: 150px;*/ padding: 3px; overflow: hidden; background: #FFFFFF; border: 1px solid #eaeaea; position: absolute; bottom: -160px; left: 0; opacity: 0; transition: all .4s ease 0s; } .weixin img { display: block; width: 100%!important; height: 100%!important; } .index-GR-bottom1:hover .weixin { opacity: 1; } @media screen and (max-width: 750px){ .index-GR-bottom1:hover .weixin { opacity: 0; } .index-GR { width:100%; height: auto; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); padding: 15px; background: rgba(255,255,255,0.9); float: left; } .index-GR .index-G-title1 { text-align: center; color: #0093dd; } .index-GR .index-G-title2 { text-align: center; color: #333333; } .index-GR .index-G-title3 { font-size: 12px; color: #666666; text-align: center; line-height: 22px; margin-top: 5px; } .index-GR-ul { width: 100%; margin-left: -0px; } .index-GR-ul li { width: 50%; float: left; } .index-GR-ul li img { width: 28px; height: 28px; margin: 25px auto 8px; display: block; } .index-GR-ul li p { line-height: normal; text-align: center; } .index-GR-bottom { width: 86px; margin: 0 auto; background: transparent; padding: 0 15px; position: relative; } .index-GR-bottom .index-GR-bottom1 { width: 43px; float: left; } .index-GR-bottom .index-GR-bottom1 img { display: block; width: 22px; height: 22px; margin: 0 auto; } .xianA { padding-top: 10px; margin-top: 15px; width: 100%; height: 22px; border-top: 1px solid #b3b3b3; border-bottom: none; } } /*手机端的banner*/ .index_banner { width: 100%; position: relative; z-index: 0; } .flexslider{position:relative;height: 100%;width: 100%;overflow:hidden;z-index: 66;} .slides{position:relative;z-index:1;height: 100%;width: 100%} .slides li{height:100%;width: 100%;position: relative;background-size: 100% 100%} .slides li a{display: block;width: 100%;height: 100%} .slides li a img{display: block;width: 100%;height: 100%} .flex-control-nav{position:absolute;bottom:10px;z-index:2;width:100%;text-align:center;} .flex-control-nav li{display:inline-block; width: 20px; height: 2px; margin: 0 5px;*display:inline;zoom:1;} .flex-control-nav a{border-radius: 10px;cursor:pointer;display:inline-block;zoom:1;width:100%;height:100%;margin-right: 6px;overflow:hidden;background:rgba(255,255,255,0.8);line-height:999px;}/*background:url(../images/dot.png) right 0 no-repeat;*/ .flex-control-nav .flex-active{background: #f74a5f} .flex-direction-nav{position:absolute;z-index:3;width:100%;top:167px;} .flex-direction-nav li a{display:block;width:74px;height:116px;overflow:hidden;cursor:pointer;position:absolute;} .updown { -webkit-animation: updown 1s ease-in both; } @-webkit-keyframes updown { 0% {top: 0;position: relative} 100% {top: -5px;position: relative} } /*内页的banner*/ .Nbanner { position: relative; height: 400px; } .Nbanner_img { width: 1920px; height: 400px; margin-left: -360px; position: absolute; top: 0; } .Nbanner_img img { display: block; width: 100%; height: 100%; } .Nbanner_text1 { position: relative; font-size: 34px; font-family: STHeiti; text-align: center; color: #FFFFFF; line-height: 52px; padding-top: 180px; } .Nbanner_text2 { position: relative; font-size: 16px; text-align: center; color: #FFFFFF; line-height: 36px; } @media screen and (max-width: 750px){ .Nbanner { position: relative; height: 150px; width: 100%; } .Nbanner_img { width: 707px; height: 150px; position: absolute; margin-left: -30%; top: 0; } .Nbanner_img img { display: block; width: 100%; height: 100%; } .Nbanner_text1 { position: relative; font-size: 20px; font-family: STHeiti; text-align: center; color: #FFFFFF; line-height: 26px; padding-top:49px; } .Nbanner_text2 { position: relative; font-size: 12px; text-align: center; color: #FFFFFF; line-height: 26px; } } /*案例的列表*/ .anli_type { width: 1000px; margin: 0 auto; overflow: hidden; text-align: center; } .anli_type a { display: inline-block; width:200px; height: 82px; text-align: center; line-height: 82px; font-size: 24px; } .anli_type a:hover { background: url("../images/anli_type.png") no-repeat; background-size: 100% 100%; color: #FFFFFF; } .anli_typeSelect { background: url("../images/anli_type.png") no-repeat; background-size: 100% 100%; color: #FFFFFF; } @media screen and (max-width: 750px){ .anli_type { margin: 0 auto; overflow: hidden; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); text-align: center; } .anli_type a { display: inline-block; width:20%; height: 40px; text-align: center; line-height: 40px; font-size: 12px; } .anli_type a:hover { background: #dd0000; background-size: 150% 150%; color: #FFFFFF; } .anli_typeSelect { background: #dd0000; background-size: 150% 100%; color: #FFFFFF; } } .anli_lei { width: 1115px; margin: 32px 0 42px 85px; } .anli_lei a { font-size: 16px; color: #666666; line-height: 28px; display: inline-block; padding: 0 13px; position: relative; } .anli_lei a span { display: block; width: 0%; height: 1px; position: absolute; bottom: 0; left: 0; background: #0093dd; transition: all .5s ease 0s; } .anli_lei a:hover { color: #0093dd!important; } .anli_lei a:hover span { width: 100%; } .anli_leiSelect { color: #0093dd!important; } .anli_leiSelect span { width: 100%!important; } @media screen and (max-width: 750px){ .anli_lei { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 10px auto 0px auto; } .anli_lei a { font-size: 12px; color: #666666; line-height: 28px; display: inline-block; padding: 0 10px; position: relative; } .anli_lei a span { display: block; width: 0%; height: 1px; position: absolute; bottom: 0; left: 0; background: #0093dd; transition: all .5s ease 0s; } .anli_lei a:hover { color: #0093dd!important; } .anli_lei a:hover span { width: 100%; } .anli_leiSelect { color: #0093dd!important; } .anli_leiSelect span { width: 100%!important; } } /*分页*/ .mar_T75 { margin-top: 75px; } .mar_B105 { margin-bottom: 105px; } @media screen and (max-width: 750px){ .mar_T75 { margin-top: 30px; } .mar_B105 { margin-bottom: 30px!important; min-height: 500px; margin-top: 10px; } .yunpir{ min-height: 536px; } } .fenye { text-align: center; padding: 6px 0; margin-top: 20px; clear: both; } .fenye a { padding: 6px 15px; border: 1px solid #ccc; font-size: 12px; border-radius: 3px; margin: 0 3px 6px 3px; display: inline-block; } .fenye a:hover, .fenye a.fenye_over { background: #0092db; border: 1px solid #0092db; color: #fff; } @media screen and (max-width: 750px){ .fenye { text-align: center; padding:6px 0 3px 0; clear: both; min-height: auto; } .fenye a { padding:5px 8px 3px 8px; border: 1px solid #ccc; font-size: 12px; border-radius: 3px; margin: 0 3px 6px 3px; } .fenye a:hover, .fenye a.fenye_over { background: #0092db; border: 1px solid #0092db; color: #fff; } } /*解决方案*/ .fangan_A { margin: 5px auto 115px auto; } .fangan_A li { width:240px; float: left; padding: 0 30px; height: 216px; margin-top: 55px; } .fangan_A1 { width: 174px; height:120px; margin: 0 auto; } .fangan_A1 img { display: block; width: 100%; height: 100%; } .fangan_A2 { display: block; width: 100%; font-size: 18px; line-height: 30px; height: 30px; text-align: center; margin: 20px auto 10px auto; } .fangan_A3 { display: block; width: 100%; font-size: 14px; line-height: 18px; text-align: center; color: #999999; height: 36px; overflow: hidden; transition: all .1s ease 0s; } .fangan_A4 { display: block; height: 0px; width: 120px; line-height: 30px; font-size: 14px; background: #0093dd; color: #FFFFFF; text-align: center; margin: 0 auto; transition: all .5s ease 0s; } .fangan_A li:hover .fangan_A3 { height: 0; opacity: 0; } .fangan_A li:hover .fangan_A4 { height: 30px; } .fangan_A li:hover .fangan_A1 { -webkit-animation: updown .5s ease-in both; } @media screen and (max-width: 750px){ .fangan_A { margin: 5px auto 115px auto; margin: 0 auto ; width: 100%; } .fangan_A li { width:25%; float: left; padding: 0 0; height: auto; margin-top: 10px; } .fangan_A1 { width: 65%; height:auto; margin: 0 auto; } .fangan_A1 img { display: block; width: 100%; height: 100%; } .fangan_A2 { display: block; width: 100%; font-size: 13px; line-height: 24px; height: 24px; text-align: center; margin: 5px auto 10px auto; } .fangan_A3 { display: block; width: 100%; font-size: 14px; line-height: 18px; text-align: center; color: #999999; height: 36px; overflow: hidden; transition: all .1s ease 0s; display: none; } .fangan_A4 { display: block; height: 0px; width: 120px; line-height: 30px; font-size: 14px; background: #0093dd; color: #FFFFFF; text-align: center; margin: 0 auto; transition: all .5s ease 0s; opacity: 0; } .fangan_A li:hover .fangan_A3 { height: 0; opacity: 0; } .fangan_A li:hover .fangan_A4 { height: 0px; } } .fangan_B { width: 1920px; height:399px; padding: 93px 0 88px 0; background: url("../images/fangan_B.jpg") no-repeat; background-size: 100% 100%; margin-left: -360px; } .fangan_BR { width:399px; height: 399px; float: right; position: relative; background: url("../images/fangan_BR4.png") center no-repeat; background-size: 364px 364px; } .fangan_BR .fangan_BR1 { position: absolute; width:399px; height: 399px; top: 0; left: 0; animation: fangan_BR1 20s infinite linear; -moz-transform-origin: center center; -webkit-transform-origin:center center; -o-transform-origin:center center; } .fangan_BR .fangan_BR2 { position: absolute; width:365px; height: 365px; top: 17px; left: 17px; animation: fangan_BR2 2s infinite linear; animation-direction:alternate; } .fangan_BR .fangan_BR3 { position: absolute; width:281px; height: 281px; top: 55px; left: 60px; animation: fangan_BR1 10s infinite linear; -moz-transform-origin: center center; -webkit-transform-origin:center center; -o-transform-origin:center center; } @keyframes fangan_BR1 { from {transform: rotate(0);} to {transform: rotate(360deg);} } @keyframes fangan_BR2 { from {opacity: 0.2} to {opacity: 1} } .fangan_BL { color: #FFFFFF; width:750px; float: left; } .fangan_BL .fangan_BL1 { font-size: 36px; height: 48px; line-height: 48px; margin: 25px auto 13px auto; } .fangan_BL .fangan_BL2 { font-size: 14px; height: 20px; line-height: 20px; } .fangan_BL3 { margin-top: 40px; } .fangan_BL3 li { width: 250px; line-height: 24px; float: left; margin-top: 32px; } .fangan_BL3 li span { margin-right: 7px; } @media screen and (max-width: 750px){ .fangan_B { width: 100%; height:auto; padding: 15px 0 15px 0; background: url("../images/fangan_B.jpg") bottom right no-repeat; background-size: auto 100%; margin-left: -0px; margin-top:18px; } .fangan_BR { width:260px; height: 260px; float: none; position: relative; background: url("../images/fangan_BR4.png") center no-repeat; background-size: 260px 260px; margin: 15px auto; } .fangan_BR .fangan_BR1 { position: absolute; width:260px; height: 260px; top: 0; left: 0; animation: fangan_BR1 20s infinite linear; -moz-transform-origin: center center; -webkit-transform-origin:center center; -o-transform-origin:center center; } .fangan_BR .fangan_BR2 { position: absolute; width:240px; height: 240px; top: 10px; left: 10px; animation: fangan_BR2 2s infinite linear; animation-direction:alternate; } .fangan_BR .fangan_BR3 { position: absolute; width:180px; height: 180px; top: 40px; left: 40px; animation: fangan_BR1 10s infinite linear; -moz-transform-origin: center center; -webkit-transform-origin:center center; -o-transform-origin:center center; } @keyframes fangan_BR1 { from {transform: rotate(0);} to {transform: rotate(360deg);} } @keyframes fangan_BR2 { from {opacity: 0.2} to {opacity: 1} } .fangan_BL { color: #FFFFFF; float: none; margin: 0 auto; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); } .fangan_BL .fangan_BL1 { font-size: 20px; height: 30px; line-height: 30px; margin: 15px auto 0px auto; } .fangan_BL .fangan_BL2 { font-size: 14px; height: 20px; line-height: 20px; } .fangan_BL3 { margin-top: 0px; } .fangan_BL3 li { width: 50%; line-height: 24px; float: left; margin-top: 15px; } .fangan_BL3 li span { margin-right: 7px; } } .fangan_C { margin: 85px auto 100px auto ; } .fangan_C .fangan_CL { width: 500px; float: left; } .fangan_CL .fangan_CL1 { width: 600px; font-size: 36px; line-height: 54px; } .fangan_CL .fangan_CL2 { color: #999999; line-height: 28px; } .fangan_CL3 { width: 520px; margin-top: 24px; } .fangan_CL3 li { width: 260px; float: left; margin-top: 44px; } .fangan_CL3 li span { display: block; height: 40px; width: 36px; line-height: 36px; float: left; border-bottom: 2px solid #e74848; color: #0093dd; font-size: 18px; } .fangan_CL3 li b { display: block; float: right; width:-webkit-calc(100% - 40px); width:-moz-calc(100% - 40px); width:calc(100% - 40px); font-weight: normal; font-size: 18px; line-height: 40px; } .fangan_CR { margin-top: 12px; width:687px; height:402px; float: right; } .fangan_CR img { display: block; width: 100%; height: 100%; } @media screen and (max-width: 750px){ .fangan_C { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 30px auto; } .fangan_C .fangan_CL { width: 100%; float: left; } .fangan_CL .fangan_CL1 { width: 100%; font-size: 20px; line-height: 30px; } .fangan_CL .fangan_CL2 { color: #999999; line-height: 20px; font-size: 14px; } .fangan_CL3 { width: 100%; margin-top: 0px; } .fangan_CL3 li { width: 50%; float: left; margin-top: 15px; } .fangan_CL3 li span { display: block; height: 30px; width: 30px; line-height: 30px; float: left; border-bottom: 2px solid #e74848; color: #0093dd; font-size: 16px; } .fangan_CL3 li b { display: block; float: right; width:-webkit-calc(100% - 35px); width:-moz-calc(100% - 35px); width:calc(100% - 35px); font-weight: normal; font-size: 13px; line-height: 32px; } .fangan_CR { margin-top: 15px; width:100%; height:auto; float: right; } .fangan_CR img { display: block; width: 100%; height: 100%; } } .mar_T0 { margin-top: 0!important; } /*海创*/ .Nindex-A { margin-top: 80px; margin-bottom: 90px; min-height: 320px; background: url("../images/Nindex-A.png") bottom right no-repeat; background-size: 489px 324px; } .haichuangA { width: 1920px; height:378px; padding: 84px 0 108px 0; background: url("../images/haichuangA.jpg") no-repeat; background-size: 100% 100% ; margin-left: -360px; margin-bottom: 80px; } .haichuangA .index_title .index_title1 { color: #FFFFFF; } .haichuangA .index_title .index_title2 { color: #FFFFFF; margin-top: 11px; } .haichuangA1 { width: 860px; margin-left: 206px; margin-top: 65px; margin-bottom: 78px; } .haichuangA1 li { width: 100px; height: 100px; float: left; margin-right: 72px; position: relative; } .haichuangA1 li .haichuangA1_1 { position: absolute; top: 0; left: 0; border: 1px solid #FFFFFF; width: 98px; height: 98px; border-radius: 50px; animation: xuanzhuan 10s infinite linear; -moz-transform-origin: center center; -webkit-transform-origin:center center; -o-transform-origin:center center; } .haichuangA1 li .haichuangA1_2 { position: absolute; top: 3px; left: -3px; border: 1px solid #FFFFFF; width: 99px; height: 99px; border-radius: 50px; animation: xuanzhuan 15s infinite linear; -moz-transform-origin:53px 53px; -webkit-transform-origin:53px 53px; -o-transform-origin:53px 53px; } .haichuangA1 li .haichuangA1_3 { width: 100px; height: 100px; line-height: 100px; color: #FFFFFF; font-size: 24px; text-align: center; } .haichuangA2 { font-size: 36px; line-height: 48px; color: #0093dd; text-align: center; } @media screen and (max-width: 750px){ .haichuangA { height: auto; padding: 15px ; background: url("../images/haichuangA.jpg") no-repeat center bottom; background-size: auto 100% ; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 30px auto 30px auto; } .haichuangA .index_title .index_title1 { color: #FFFFFF; } .haichuangA .index_title .index_title2 { color: #FFFFFF; margin-top: 0px; } .haichuangA1 { width: 100%; margin-left: 0; margin-top: 15px; margin-bottom: 15px; } .haichuangA1 li { width: 20%; height: auto; float: left; margin-right: 0px; position: relative; } .haichuangA1 li .haichuangA1_1 { position: absolute; top: 0; left: 0; border: 1px solid #FFFFFF; width: 60px; height: 60px; border-radius: 50px; animation: xuanzhuan 10s infinite linear; -moz-transform-origin: center center; -webkit-transform-origin:center center; -o-transform-origin:center center; } .haichuangA1 li .haichuangA1_2 { position: absolute; top: 3px; left: -3px; border: 1px solid #FFFFFF; width: 60px; height: 60px; border-radius: 50px; animation: xuanzhuan 15s infinite linear; -moz-transform-origin:32px 32px; -webkit-transform-origin:32px 32px; -o-transform-origin:32px 32px; } .haichuangA1 li .haichuangA1_3 { width: 60px; height: 60px; line-height: 67px; color: #FFFFFF; font-size: 18px; text-align: center; } .haichuangA2 { font-size: 18px; line-height: 30px; color: #0093dd; text-align: center; } } @keyframes xuanzhuan { from {transform: rotate(0);} to {transform: rotate(360deg);} } .haichuangB { width:1116px; margin: 50px auto 80px auto; } .haichuangB li { margin-bottom: 1px; } .haichuangBL { width: 180px; float: left; height: 110px; background: #cccccc; position: relative; transition: all .5s ease 0s; } .haichuangBL img { width:54px; height: 54px; margin: 28px auto; display: block; } .haichuangBL .haichuangBL1 { } .haichuangBL .haichuangBL2 { display: none; } .haichuangBL3 { position: absolute; width: 0px; background: #0093dd; top: 32px; right: -38px; height: 1px; overflow: hidden; transition: all .5s ease 0s; } .haichuangBR { width:-webkit-calc(100% - 220px); width:-moz-calc(100% - 220px); width:calc(100% - 220px); float: right; transition: all .5s ease 0s; } .haichuangBR .haichuangBR1 { font-size: 18px; color: #1c1c1c; font-weight: bold; line-height: 34px; margin-top: 16px; } .haichuangBR .haichuangBR2 { font-size: 16px; line-height: 24px; margin-top: 4px; } .haichuangB li:hover .haichuangBL { background: #0093dd; padding-right: 28px; } .haichuangB li:hover .haichuangBL1 { display: none; } .haichuangB li:hover .haichuangBL2 { display: block; } .haichuangB li:hover .haichuangBL3 { width: 38px; } .haichuangB li:hover .haichuangBR { width:-webkit-calc(100% - 270px); width:-moz-calc(100% - 270px); width:calc(100% - 270px); } @media screen and (max-width: 750px){ .haichuangB { margin: 15px auto 38px auto; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); } .haichuangB li { margin-bottom: 1px; } .haichuangBL { width: 70px; float: left; height: 130px; background: #0093dd; position: relative; transition: all .5s ease 0s; } .haichuangBL img { width:40px; height: 40px; margin: 45px auto; display: block; } .haichuangBL .haichuangBL1 { display: none; } .haichuangBL .haichuangBL2 { display: block; } .haichuangBL3 { position: absolute; width: 0px; background: #0093dd; top: 32px; right: -38px; height: 1px; overflow: hidden; transition: all .5s ease 0s; } .haichuangBR { width:-webkit-calc(100% - 85px); width:-moz-calc(100% - 85px); width:calc(100% - 85px); float: right; transition: all .5s ease 0s; } .haichuangBR .haichuangBR1 { font-size: 16px; color: #0093dd; font-weight: bold; line-height: 20px; margin-top: 0px; } .haichuangBR .haichuangBR2 { font-size: 14px; line-height: 20px; margin-top: 10px; } .haichuangB li:hover .haichuangBL { background: #0093dd; padding-right: 0px; } .haichuangB li:hover .haichuangBL1 { display: none; } .haichuangB li:hover .haichuangBL2 { display: block; } .haichuangB li:hover .haichuangBL3 { width: 0px; } .haichuangB li:hover .haichuangBR { width:-webkit-calc(100% - 85px); width:-moz-calc(100% - 85px); width:calc(100% - 85px); } } .haichuangC { width: 1920px; height:710px; padding-top: 92px; background: url("../images/haichuangC.jpg") no-repeat; background-size: 100% 100%; margin-left: -360px; margin-bottom: 80px; } .haichuangC .index_title * { color: #FFFFFF; } .haichuangC .index-Flist { margin: 55px auto 0 auto; } .haichuangC .index-Flist li { /*background:rgba(182,182,182,0.6);*/ background:rgba(255,255,255,0.9); } .haichuangC .index-Flist li:hover { background: #FFFFFF; } @media screen and (max-width: 750px){ .haichuangC { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto 30px auto; height:auto; padding: 15px; background: url("../images/haichuangC.jpg") no-repeat; background-size: auto 100%; } .haichuangC .index_title * { color: #FFFFFF; } .haichuangC .index-Flist { margin: 15px auto 15px auto; background: #FFFFFF; } .haichuangC .index-Flist li { /* background:rgba(182,182,182,0.2); */ background: #fff; } .haichuangC .index-Flist li:last-child{display: none;} .haichuangC .index-Flist li:hover { background: #FFFFFF; } } .haichuangD { width: 1215px; margin-top: 27px; margin-bottom: 80px; } .haichuangD li { box-sizing: border-box; border: 1px solid #e6e6e6; border-radius: 6px; box-shadow:0px 1px 12px rgba(0,0,0,0.07); width: 390px; height: 220px; padding: 30px 13px 27px 13px; float: left; margin-right: 15px; margin-top: 15px; } .haichuangD1 { width: 100%; height: 38px; } .haichuangD1 img { height: 38px; } .haichuangD2 { font-size: 26px; line-height: 56px; margin-top: 11px; margin-bottom: 12px; border-bottom: 1px solid #f1f1f1; } .haichuangD3 { line-height: 22px; color: #999999; } @media screen and (max-width: 750px){ .haichuangD { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0px auto 30px auto; } .haichuangD li { box-sizing: border-box; border: 1px solid #e6e6e6; border-radius: 6px; box-shadow:0px 1px 12px rgba(0,0,0,0.07); width: 100%; height: auto; padding: 15px 13px 15px 13px; float: left; margin-right: 0px; margin-top: 15px; } .haichuangD1 { width: 100%; height: 28px; } .haichuangD1 img { height: 28px; } .haichuangD2 { font-size: 20px; line-height: 40px; margin-top: 5px; margin-bottom: 12px; border-bottom: 1px solid #f1f1f1; } .haichuangD3 { line-height: 22px; color: #999999; } } .haichuangE { width: 1220px; margin: 32px auto 45px auto; } .haichuangE li { border: 1px solid #dadada; box-sizing: border-box; padding: 10px; float: left; margin-right: 20px; width: 285px; height: 170px; } .haichuangE_box { width: 100%; height: 100%; background: #cccccc; overflow: hidden; transition: all .5s ease 0s; } .haichuangE_box img { display: block; width: 32px; height: 32px; margin: 27px auto 20px; } .haichuangE_box .haichuangE2 { display: none; } .haichuangE3 { line-height: 22px; text-align: center; } .haichuangE li:hover .haichuangE_box { background: #0093dd; color: #FFFFFF; } .haichuangE li:hover .haichuangE_box .haichuangE1 { display: none; } .haichuangE li:hover .haichuangE_box .haichuangE2 { display: block; } @media screen and (max-width: 750px){ .haichuangE { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto 30px auto; } .haichuangE li { border: 1px solid #dadada; box-sizing: border-box; padding:10px 0px; float: left; margin-right: 0px; width: 48%; height: auto; margin-top: 15px; } .haichuangE li:nth-child(2n) { float: right; } .haichuangE_box { width: 100%; height: 100%; background: #fff; overflow: hidden; transition: all .5s ease 0s; } .haichuangE_box img { display: block; width: 32px; height: 32px; margin: 0px auto 10px; } .haichuangE_box .haichuangE2 { display: none; } .haichuangE3 { line-height: 22px; text-align: center; } .haichuangE li:hover .haichuangE_box { background: #0093dd; color: #FFFFFF; } .haichuangE li:hover .haichuangE_box .haichuangE1 { display: none; } .haichuangE li:hover .haichuangE_box .haichuangE2 { display: block; } } .haichuangF { width: 1920px; height:303px; padding: 88px 0 70px 0; background:url("../images/haichuangF.jpg") no-repeat; background-size: 100% 100%; margin-left: -360px; } .haichuangF_box { padding: 25px 20px; background: #FFFFFF; box-sizing: border-box; } .haichuangF_box * { width: 100%; } @media screen and (max-width: 750px){ .haichuangF { width: 100%; height:auto; padding: 40px 0 30px 0; background:url("../images/haichuangF.jpg") no-repeat center top; background-size: 300% 100%; margin-left: -0px; min-height: 100px; } .haichuangF_box { padding: 15px; background: #FFFFFF; box-sizing: border-box; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto; } .haichuangF_box * { width: 100%; } } /*系统开发的样式*/ .xitongA { margin: 70px auto 40px auto; } .xitongAL { width: 603px; height:434px; float: left; } .xitongAL img { display: block; width: 100%; height: 100%; } .xitongAR { width: 570px; float: right; } .xitongAR1 { font-size: 36px; line-height: 45px; vertical-align: middle; text-align: center; } .xitongAR1 img { height: 36px; vertical-align: middle; position: relative; top: -2px; margin-right: 4px; } .xitongAR2 { margin-top: 4px; } .xitongAR2 li { margin-right:24px; width: 261px; float: left; text-align: center; } .xitongAR2 li .xitongAR21 { display: block; margin:52px auto 17px auto; width:64px; height: 64px; } .xitongAR2 li .xitongAR22 { line-height: 24px; font-size: 20px; } @media screen and (max-width: 750px){ .xitongA { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 30px auto; } .xitongAL { width: 100%; height:auto; float: none; display: none; } .xitongAL img { display: block; width: 100%; height: 100%; } .xitongAR { width: 100%; float: none; } .xitongAR1 { font-size: 18px; line-height: 36px; vertical-align: middle; text-align: center; } .xitongAR1 img { height: 18px; vertical-align: middle; position: relative; top: -2px; } .xitongAR2 { margin-top: 4px; } .xitongAR2 li { margin-right:0px; width: 50%; float: left; text-align: center; } .xitongAR2 li .xitongAR21 { display: block; margin:25px auto 15px auto; width:50px; height: 50px; } .xitongAR2 li .xitongAR22 { line-height: 24px; font-size: 13px; } } .xitongC { width: 1920px; height: 600px; padding-top: 80px; background: url("../images/xitongC.jpg") bottom left repeat-y fixed; background-size: 100% auto; margin-left: -360px; } .xitongC .index_title * { color: #FFFFFF; } .xitongC-box { } .xitongC-box li { width:176px; background: url("../images/xitongC-box1.png") left 10px no-repeat; background-size: 100% auto; min-height: 255px; margin-left: 20px; float: left; } .xitongC-box2 { background: url("../images/xitongC-box2.png") left 10px no-repeat!important; background-size: 100% auto; } .xitongC-box li .xitongC1 { font-size: 30px; font-weight: bold; color: #0093dd; text-align: center; line-height: 42px; } .xitongC-box li .xitongC2 { font-size: 16px; color: #FFFFFF; padding-left: 24px; line-height: 24px; margin: 32px auto 16px auto; } .xitongC-box li .xitongC3 { color: #FFFFFF; padding-left: 24px; line-height: 24px; } .xitongC-T1 { margin-top: 172px; } .xitongC-T2 { margin-top: 139px; } .xitongC-T3 { margin-top: 106px; } .xitongC-T4 { margin-top: 72px; } .xitongC-T5 { margin-top: 40px; } .xitongC-T6 { margin-top: 0px; } @media screen and (max-width: 750px){ .xitongC { height: auto; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); padding-top: 15px; background: url("../images/xitongC.jpg") bottom left repeat-y fixed; background-size: 100% auto; margin: 0 auto; padding: 15px; } .xitongC .index_title * { color: #FFFFFF; } .xitongC-box { margin-bottom: 15px; } .xitongC-box li { width:100%; /*background: url("../images/xitongC-box1.png") left 10px no-repeat;*/ background: none!important; background-size: 100% auto; background-size: 106% auto; min-height: 180px; margin-left: 0; float: left; } .xitongC-box li:nth-child(2n) { float: right; } .xitongC-box2 { /*background: url("../images/xitongC-box1.png") left 10px no-repeat!important;*/ background: none!important; background-size: 100% auto; } .xitongC-box li .xitongC1 { font-size: 24px; font-weight: bold; color: #eaeaea; text-align: center; line-height: 24px; width: 30px; float: left; } .xitongC-box li .xitongC2 { font-size: 16px; padding-left: 40px; line-height: 24px; margin: 0px auto 0px auto; text-align: left; color: #0093dd; font-weight: bold; } .xitongC-box li .xitongC3 { color: #FFFFFF; padding-left:40px; line-height: 24px; text-align: left; font-size: 12px; } .xitongC-T1 { margin-top: 15px; } .xitongC-T2 { margin-top: 10px; } .xitongC-T3 { margin-top: 10px; } .xitongC-T4 { margin-top: 10px; } .xitongC-T5 { margin-top: 10px; } .xitongC-T6 { margin-top: 10px; } } @media screen and (max-width: 720px){ .xitongC-box li { height: auto; min-height: auto; } } .xitongD { width: 1920px; height:622px; background: url("../images/xitongD.jpg") no-repeat; background-size: 100% 100%; margin-left: -360px; margin-bottom: 88px; } .xitongDR { width:633px; height: 291px; margin-top: 180px; float: right; } .xitongDR img { display: block; width: 100%; height: 100%; } .xitongDL { width: 500px; float: left; margin-left: 40px; } .xitongDL1 { font-size: 36px; color: #282828; line-height: 54px; margin-top: 120px; } .xitongDL2 { color: #999999; line-height: 30px; margin-bottom: 50px; } .xitongDL3 { font-size: 16px; line-height: 40px; } @media screen and (max-width: 750px){ .xitongD { height:auto; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto 30px auto; background: #f3f3f3; background-size: auto 100%; padding: 15px; } .xitongDR { width:50%; height: auto; margin-top: 0; float: right; position: absolute; bottom: 0; right: 0; } .xitongDR img { display: block; width: 100%; height: 100%; } .xitongDL { width: 100%; float: left; margin-left: 0px; } .xitongDL1 { font-size: 20px; color: #282828; line-height: 30px; margin-top: 10px; } .xitongDL2 { color: #999999; margin-bottom: 15px; font-size: 14px; height: auto; line-height: 20px; } .xitongDL3 { font-size: 12px; line-height: 24px; } } .xitongB { width: 1920px; background: #f8f8f8; margin-left: -360px; padding: 60px 0 80px 0; } @media screen and (max-width: 750px){ .xitongB { background: #f8f8f8; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto; padding: 15px; } } .xxA { width:1856px ; margin-top: 47px; } .xxA li { width: 272px; float: left; background: #eaeaea; height: 106px; margin-bottom: 10px; margin-right: 656px; /*transition: all 1s ease 1s;*/ } .xxAL { width:-webkit-calc(100% - 135px); width:-moz-calc(100% - 135px); width:calc(100% - 135px); float: left; margin-left: 25px; } .xxAL p { margin-top: 33px; line-height: 24px; font-size: 16px; } .xxAR { width:106px; float: right; } .xxAR img { display: block; width: 56px; height: 56px; margin: 25px auto; } .xxAR .xxAR2 { display: none; } .xitongB_show { position: absolute; width:336px; height: 84px; padding: 127px 150px 128px 154px; background: url("../images/xitongB_show.jpg") no-repeat; background-size: 100% 100%; top: 0; left: 280px; color: #feffff; font-size: 16px; line-height:28px ; overflow-y: auto; text-align: justify; } .xxASelect { background: #0c80d3!important; color: #FFFFFF; } .xxASelect .xxAR .xxAR2 { display: block; } .xxASelect .xxAR .xxAR1 { display: none; } .xxA li:hover { background: #0c80d3!important; color: #FFFFFF; } .xxA li:hover .xxAR .xxAR2 { display: block; } .xxA li:hover .xxAR .xxAR1 { display: none; } @media screen and (max-width: 750px){ .xxA { width:100% ; margin-top: 15px; } .xxA li { width: 48%; float: left; background: #eaeaea; height: 90px; margin-bottom: 10px; margin-right: 0; cursor: pointer; transition: all .5s ease 0s; } .xxA li:nth-of-type(3) .xxAL p { margin-top: 9px; } .xxA li:nth-of-type(4) .xxAL p { margin-top: 9px; } .xxA li:nth-child(2n) { float: right; } .xxAL { width:-webkit-calc(100% - 80px); width:-moz-calc(100% - 80px); width:calc(100% - 80px); float: left; margin-left: 10px; } .xxAL p { margin-top: 21px; line-height: 24px; font-size: 14px; } .xxAR { width:60px; float: right; } .xxAR img { display: block; width: 40px; height: 40px; margin: 25px auto; } .xxAR .xxAR2 { display: none; } .xxA li:first-child .xxAL p { line-height: 90px!important; } .xxA li:last-child .xxAL p { line-height: 90px!important; } .xitongB_show { position: relative; width:100%; height: auto; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); padding: 15px; background: #0092db; background-size: 100% 100%; top: 0; left: 0px; color: #feffff; font-size: 13px; line-height:22px ; overflow-y: auto; text-align: justify; margin-bottom: 15px; } .xxASelect { background: #0c80d3!important; color: #FFFFFF; } .xxASelect .xxAR .xxAR2 { display: block; } .xxASelect .xxAR .xxAR1 { display: none; } .xxA li:hover { background: #0c80d3!important; color: #FFFFFF; } .xxA li:hover .xxAR .xxAR2 { display: block; } .xxA li:hover .xxAR .xxAR1 { display: none; } } .upload_box { color: #666666; } .upload_box img { max-width: 100%; display: block; margin: 0 auto; } @media screen and (max-width: 750px){ .upload_box { color: #666666; /* width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px);*/ width:100%; margin: 0 auto ; } .upload_box img { max-width: 100%; width:100% !important; height:auto !important; display: block; margin: 0 auto; } } /*新闻资讯的详情*/ .deta_biaoti { font-size: 24px; text-align: center; line-height: 30px; margin-top: 50px; } .deta_shijian { color: #999999; line-height: 20px; margin-top: 8px; text-align: center; } .deta_box { margin: 25px auto 15px auto; padding: 15px 0; min-height:300px; border-bottom: 1px dashed #ddd; border-top: 1px dashed #ddd; } @media screen and (max-width: 750px){ .deta_biaoti { font-size: 18px; text-align: center; line-height: 24px; margin-top: 30px; } .deta_shijian { color: #999999; line-height: 20px; margin-top: 5px; text-align: center; } .deta_box { margin: 15px auto 15px auto; padding: 15px 0; border-bottom: 1px dashed #ddd; border-top: 1px dashed #ddd; } } .page { } .page * { line-height: 24px; font-size: 16px; color: #666666; } .page .pageA { display: block; width: 65px; float: left; } .page .pageB { width:-webkit-calc(100% - 65px); width:-moz-calc(100% - 65px); width:calc(100% - 65px); float: right; } .page .pageB:hover { color: #f74a5f; } .page .clearfloat { margin-bottom: 5px; } @media screen and (max-width: 750px){ .page { width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); margin: 0 auto; } .page * { line-height: 20px; font-size: 14px; color: #666666; } .page .pageA { display: block; width: 65px; float: left; } .page .pageB { width:-webkit-calc(100% - 65px); width:-moz-calc(100% - 65px); width:calc(100% - 65px); float: right; } .page .pageB:hover { color: #f74a5f; } .page .clearfloat { margin-bottom: 5px; } } .anli_search { width: 500px; background: rgba(0,0,0,0.2); border: 1px solid #FFFFFF; position: relative; height: 42px; border-radius: 42px; margin: 15px auto; } .anli_search1 { display: block; height: 42px; line-height: 42px; width: 410px; float: left; border: none; outline: none; text-indent: 20px; font-size: 15px; color: #FFFFFF; } .anli_search1::-webkit-input-placeholder { /* placeholder颜色 */ color: #fff; } .anli_search2 { display: block; height: 42px; line-height: 42px; float: right; width: 70px; border: none; outline: none; background: url("../images/anli_search2.png") center no-repeat; background-size: 26px auto; cursor: pointer; } @media screen and (max-width: 750px){ .anli_search { width: 80%; background: rgba(0,0,0,0.2); border: 1px solid #FFFFFF; position: relative; height: 36px; border-radius: 36px; margin: 10px auto; } .anli_search1 { display: block; height: 36px; line-height: 36px; width: 80%; float: left; border: none; outline: none; text-indent: 15px; font-size: 14px; color: #FFFFFF; position: relative; top: 1px; } .anli_search1::-webkit-input-placeholder { /* placeholder颜色 */ color: #fff; } .anli_search2 { display: block; height: 36px; line-height: 36px; float: left; width: 20%; border: none; outline: none; background: url("../images/anli_search2.png") center no-repeat; background-size: 22px auto; cursor: pointer; } } .index-E-btn { margin-top: 50px; margin-bottom:50px; } .index-E-btn a { display: block; width: 180px; height: 40px; font-size: 16px; text-align: center; line-height: 40px; border: 1px solid #999; margin: 0 auto; } .index-E-btn a:hover { background: #0093dd; color: #FFFFFF; border: 1px solid #0093dd; } .none { display: none; } @media screen and (max-width: 750px){ .index-E-btn { margin-top: 30px; } .index-E-btn a { display: block; width: 130px; height: 30px; font-size: 14px; text-align: center; line-height: 32px; border: 1px solid #999; margin: 0 auto; } .index-E-btn a:hover { background: rgba(255,255,255,0.8); } .min_hA { min-height: 400px; } } /*左侧的悬*/ .xuanfuL { position: fixed; top: 50%; left: 10px; margin-top: -82px; z-index: 80; } .xuanfuL .xuanfuLA { /*margin-bottom: 20px;*/ } .xuanfuLA_line { height: 20px; width: 10px; /*border-left: 1px solid rgba(217,217,217,0.5);*/ margin: -2px 0 -2px 0; background: url("../images/xuanfuLA_line.png") no-repeat center; background-size: 1px 100%; opacity: 0.6; } .xuanfuL .xuanfuLA a { display: block; vertical-align: middle; font-size: 12px; height: 14px; line-height: 14px; color: #d9d9d9; background: url("../images/xfL2.png") no-repeat center left; background-size: 11px 11px; transition: all .5s ease 0s; overflow: hidden; width: 32px; } .xuanfuL .xuanfuLA a span { display: none; margin-left: 15px; } .active a { background: url("../images/xfL1.png") no-repeat center left!important; background-size: 11px 11px!important; color: #0093dd!important; width: 100px!important; } .active a span { display: block!important; } .xx_ts { width: 100%; margin: 100px auto; } .xx_ts img { display: block; margin: 0 auto; } .xx_ts p { text-align: center; color: #666666; font-size: 16px; height: 40px; line-height: 40px; } @media screen and (max-width: 750px){ .xx_ts { width: 100%; margin: 135px auto; } .xx_ts img { display: block; margin: 0 auto; width: 40%; } .xx_ts p { text-align: center; color: #666666; font-size: 16px; height: 40px; line-height: 40px; } } .BMapLabel { border:none!important; } .minH500 { min-height: 400px; margin-top: 50px; } /*证书样式*/ .zhshu_1{ width: 1240px; height: auto; overflow: hidden; margin-top: 34px; margin-bottom:60px; } .zhshu_1 li{ width: 220px; height: 356px; float: left; margin-right: 24px; margin-bottom: 6px; } .zhshu_1 li b{ width: 205px; height: 280px; padding:10px; border: 1px solid #dddada; display: block; overflow:hidden; } .zhshu_1 li b:hover { border: 1px solid #0093dd; } .zhshu_1 li :hover p{ color: #0093dd; } .zhshu_1 li b img{ width: 205px; height: 280px; transition: all 2s ease 0s; } .zhshu_1 li b img:hover{transform: scale(1.05);} .zhshu_1 li span{ margin-top: 12px; display: block; text-align: center; } .zhshu_1 li span p{ font-size: 12px; color: #333; } .zhshu_1 li span em{ font-style: normal; width: 200%; -webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; height:20px; line-height: 20px; margin-top: -6px; margin-left: -100%; font-size: 22px; text-align: center; display: block; color:#999; } /*新增证书样式开始*/ .rebox { cursor: pointer; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index:99999999 !important; -webkit-filter: none !important; background: rgb(0, 0, 0); /* IE Fallback (Solid Colour) */ background: rgba(0, 0, 0, 0.7); } .rebox *{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0; } .rebox-contents { position: absolute; top: 5%; left: 5%; text-align: center; width: 90%; height: 90%; } .rebox-contents .rebox-content { border: 5px solid #fff; box-shadow: 0 0 20px #000; border-radius: 1px; max-width: 100%; max-height: 100%; } .rebox-loading { width: 31px; height: 31px; margin: -16px 0 0 -16px; position: absolute; top: 48%; left: 50%; } .rebox-caption { display: none; position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; z-index: 1000; background: #000; background: rgba(0,0,0,0.7); } .rebox-caption p { margin: 0 auto; max-width: 70%; display: inline-block; *display: inline; *zoom: 1; padding: 10px; color: #fff; font-size: 12px; line-height: 18px; } .rebox-button { position: absolute; z-index: 9999; min-width: 50px; height: 50px; line-height: 50px; background: rgb(255, 255, 255); opacity:0.8; text-decoration: none; font-size: 24px; color: #000; text-align: center; vertical-align: middle; -webkit-border-radius: 32px; -moz-border-radius: 32px; -ms-border-radius: 32px; border-radius: 32px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .rebox-button:hover, .rebox-button:focus { opacity: 1; -webkit-transform: scale(1.4); -moz-transform: scale(1.4); -ms-transform: scale(1.4); transform: scale(1.4); } .rebox-close { right: 10px; top: 10px; } .rebox-next { right: 10px; top: 48%; } .rebox-prev { left: 10px; top: 48%; } .rebox-loading { left: 50%; top: 48%; -webkit-animation-name: spin; -webkit-animation-duration: 2000ms; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: spin; -moz-animation-duration: 2000ms; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: linear; -ms-animation-name: spin; -ms-animation-duration: 2000ms; -ms-animation-iteration-count: infinite; -ms-animation-timing-function: linear; animation-name: spin; animation-duration: 2000ms; animation-iteration-count: infinite; animation-timing-function: linear; } @-ms-keyframes spin { from { -ms-transform: rotate(0deg); } to { -ms-transform: rotate(360deg); }} @-moz-keyframes spin { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(360deg); }} @-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); }} @keyframes spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); }} /*新增证书样式结束*/ @media screen and (max-width: 750px){ .rebox-button { position: absolute; z-index: 9999; min-width: 40px; height: 40px; line-height: 40px; background: rgb(0, 0, 0); opacity:0.8; text-decoration: none; font-size: 24px; color: #fff; text-align: center; vertical-align: middle; -webkit-border-radius: 32px; -moz-border-radius: 32px; -ms-border-radius: 32px; border-radius: 32px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } .zhshu_1{ margin: 15px auto 20px auto; width:-webkit-calc(100% - 30px); width:-moz-calc(100% - 30px); width:calc(100% - 30px); } .zhshu_1 li{ width: 48%; height: auto; margin-right: 0; margin-bottom: 14px; } .zhshu_1 li:nth-child(2n){ float: right; } .zhshu_1 li b{ width: 94%; padding:4px; height: 192px; } .zhshu_1 li b img{ width: 100%; height: 192px; } .zhshu_1 li span p{ width: 200%; -webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; height:20px; line-height: 20px; margin-top: -6px; margin-left: -100%; font-size: 18px; text-align: center; } .zhshu_1 li span em{ width: 200%; -webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; height:20px; line-height: 20px; margin-top: -6px; margin-left: -100%; font-size: 16px; text-align: center; display: block; } } .fanzhuan{ width:134px; height:98px; overflow:hidden; position:fixed; top:138px; right:100px; z-index:9999; background:url(../images/reda.png) center center no-repeat;} .fanzhuan a{ display:100%; height:98px; display:block; overflow:hidden;} .fanzhuan-1{ width:100%; height:auto; overflow:hidden; text-align:center; padding-top:40px;} .fanzhuan img{width: 124px; height:48px; } .fanzhuan .fanzhuan-1{ -webkit-animation:transform-5 2s linear 4s infinite; } .fanzhuan-gb{ width:21px; height:21px; overflow:hidden; position:fixed; top:118px; right:100px; z-index:99999;} .fanzhuan-gb img{ width:21px; height:21px; cursor:pointer; } /*@-webkit-keyframes transform-5 { from{-webkit-transform:perspective(400px) rotateY(180deg);transform:perspective(400px) rotateY(180deg);} to{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);} }*/ @keyframes transform-5 { 0%{-webkit-transform:perspective(400px) rotateY(180deg);transform:perspective(400px) rotateY(360deg);} 60%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);} 100%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);} }