services.css 26 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375
  1. /*
  2. @update :2018/06/14
  3. */
  4. .search .searchLeft{
  5. width: 670px;
  6. float: left;
  7. }
  8. .search{
  9. margin-top: 30px;
  10. }
  11. .search .search-inp{
  12. vertical-align: top;
  13. margin-top: -8px;
  14. }
  15. .search .searchLeft ul li {
  16. float: left;
  17. margin-left: 60px;
  18. }
  19. .search .searchLeft ul li img{
  20. margin-right: 16px;
  21. }
  22. .search .searchLeft ul li span{
  23. font-size: 18px;
  24. color: #7a7878
  25. }
  26. .search .searchLeft ul li:first-child{
  27. margin-left: 18px;
  28. }
  29. .search .search-inp{
  30. float: left;
  31. width:512px;
  32. }
  33. .search .search-inp div{
  34. width: 510px;
  35. }
  36. .search .search-inp input{
  37. width: 406px;
  38. }
  39. /* /服务项目 */
  40. .serviceItems {
  41. clear: both;
  42. overflow: hidden;
  43. }
  44. .serviceItems h3{
  45. width: 630px;
  46. height: 26px;
  47. margin: 0 auto;
  48. font-weight: normal;
  49. background: url(../../../img/newMenu/serves_4.png) no-repeat;
  50. background-size:100% 100%;
  51. margin-top: 72px;
  52. }
  53. .wrapper{
  54. padding-top: 8px;
  55. }
  56. .wrapper .wrapperLeft{
  57. float: left;
  58. width: 944px;
  59. }
  60. .wrapper .wrapperRight{
  61. float: right;
  62. width: 224px;
  63. }
  64. .title .seeMore {
  65. float:right;
  66. color: #7a7878;
  67. font-size: 14px;
  68. vertical-align: top;
  69. margin-top: 6px;
  70. }
  71. .title .seeMore:hover{
  72. color:#1797e9;
  73. }
  74. .title img{
  75. vertical-align: top;
  76. margin-top: 2px;
  77. }
  78. .title strong{
  79. font-size: 22px;
  80. color:#1f1f1f;
  81. margin: 0 4px 0 10px;
  82. font-weight: normal;
  83. }
  84. .title span{
  85. display: inline-block;
  86. font-size: 18px;
  87. color: #7a7878;
  88. margin: 0 4px
  89. }
  90. /* 补贴 */
  91. .subsidy{
  92. padding-bottom: 15px;
  93. overflow: hidden;
  94. padding-top: 18px;
  95. }
  96. .subsidy>img{
  97. float: left;
  98. width: 184px;
  99. height: 226px;
  100. }
  101. .subsidy .subsidyTxt{
  102. width: 759px;
  103. float: left;
  104. border: 1px solid #efefef;
  105. border-left: none;
  106. height: 226px;
  107. }
  108. .subsidy .subsidyTxt ul {
  109. }
  110. .subsidy .subsidyTxt ul li{
  111. display: inline-block;
  112. width: 250px;
  113. padding-top: 22px;
  114. padding-bottom: 15px;
  115. padding-left: 12px;
  116. transition: all .2s ease-in-out;
  117. }
  118. .subsidyTxt ul li:hover{
  119. box-shadow: 0 4px 12px #ccc;
  120. transition: all .2s ease-in;
  121. }
  122. .subsidyTxt ul li:hover div h4{
  123. color: #0a7dd4!important;
  124. }
  125. .subsidy .subsidyTxt ul li div{
  126. overflow: hidden;
  127. float: left;
  128. font-size: 14px;
  129. transition: all .2s ease-in-out;
  130. }
  131. .subsidyTxt ul li div:nth-child(1){
  132. width:72px;
  133. height: 72px;
  134. border-radius: 50%;
  135. margin-right: 7px;
  136. }
  137. .subsidy .subsidyTxt ul li div img{
  138. width:100%;
  139. }
  140. .subsidy .subsidyTxt ul li div h4{
  141. font-size: 14px;
  142. font-weight: normal;
  143. color: #393838;
  144. padding: 12px 0;
  145. }
  146. .subsidy .subsidyTxt ul li:hover div:nth-child(1){
  147. transform: rotateY(360deg);
  148. transition: all .2s ease-in
  149. }
  150. .subsidy .subsidyTxt ul li div p{
  151. color: #7a7878;
  152. }
  153. .advertisement img{
  154. width: 100%;
  155. padding-bottom: 50px;
  156. }
  157. .subsidy .subsidyList{
  158. float: left;
  159. width: 763px;
  160. float: left;
  161. background: #f8f8f8;
  162. height: 318px;
  163. }
  164. /* 知识产权 */
  165. .property>img{
  166. width: 180px;
  167. height: 318px;
  168. }
  169. .property .subsidyList{
  170. padding-left: 18px;
  171. padding-top: 15px;
  172. }
  173. .property .subsidyList>ul>li {
  174. text-align: center;
  175. float: left;
  176. width: 230px;
  177. height: 136px;
  178. background:#ffffff;
  179. margin-left: 19px;
  180. transition: all .2s ease-in-out;
  181. }
  182. .subsidyList>ul>li:hover{
  183. margin-top: -4px;
  184. box-shadow: 0 2px 10px #ccc;
  185. transition: all .2s ease-in
  186. }
  187. .property .subsidyList>ul li:first-child{
  188. margin-left: 0
  189. }
  190. .subsidyList a{
  191. color: #7a7878;
  192. }
  193. .subsidyList>ul li .listImg{
  194. width: 100%;
  195. height: 48px;
  196. background: url(../../../img/newMenu/serves_18.jpg) no-repeat;
  197. background-size:100% 100%;
  198. padding-top: 4px;
  199. }
  200. .subsidyList>ul li:nth-child(2) .listImg{
  201. background: url(../../../img/newMenu/serves_16.png) no-repeat;
  202. }
  203. .subsidyList>ul li:nth-child(3) .listImg{
  204. background: url(../../../img/newMenu/serves_17.jpg) no-repeat;
  205. }
  206. .subsidyList .listImg p{
  207. width: 150px;
  208. line-height: 40px;
  209. height: 40px;
  210. margin:0px auto;
  211. text-align: center;
  212. font-size: 18px;
  213. color: #1f1f1f;
  214. background: url(../../../img/newMenu/serves_21.png) no-repeat;
  215. background-size:100% 100%;
  216. }
  217. .property{
  218. padding-bottom:48px;
  219. }
  220. .property .subsidyList>ul li ol{
  221. padding-top: 20px;
  222. width: 196px;
  223. margin: 0 auto;
  224. overflow: hidden;
  225. }
  226. .property .subsidyList>ul li ol li{
  227. height: 46px;
  228. line-height: 46px;
  229. border: 1px solid #efefef;
  230. font-size: 14px;
  231. color: #7a7878;
  232. }
  233. .property .subsidyList>ul li ol li p{
  234. height: 100%;
  235. }
  236. .property .subsidyList>ul li ol li:hover{
  237. background: #f8f8f8
  238. }
  239. .property .subsidyList>ul li ol li:hover p{
  240. color: #000000;
  241. }
  242. .property .subsidyList>ul li ol li a{
  243. width: 100%;
  244. height: 100%;
  245. display: inline-block;
  246. }
  247. .property .subsidyList>ul li:nth-child(2) ol li{
  248. float: left;
  249. text-align: center;
  250. width: 50%
  251. }
  252. .property .subsidyList>ul li:nth-child(3) ol{
  253. padding-top: 10px;
  254. }
  255. .property .subsidyList>ul li:nth-child(3) ol li{
  256. padding: 0;
  257. float: left;
  258. text-align: center;
  259. width: 50%;
  260. height: 35px;
  261. line-height: 35px;
  262. }
  263. .property .subsidyList>ul li:nth-child(3) ol li:nth-child(1){
  264. border-bottom: 0;
  265. border-right: none;
  266. }
  267. .property .subsidyList>ul li:nth-child(3) ol li:nth-child(2){
  268. border-bottom: 0
  269. }
  270. .property .subsidyList>ul li:nth-child(3) ol li:nth-child(3){
  271. border-right: 0
  272. }
  273. /* 专利服务 */
  274. .servicePatent{
  275. clear: both;
  276. overflow: hidden;
  277. padding-top: 10px;
  278. }
  279. .servicePatent .patent{
  280. width: 600px;
  281. height:142px;
  282. background: #ffffff;
  283. float: left;
  284. transition: all .2s ease-out;
  285. }
  286. .servicePatent .patent:hover{
  287. box-shadow:0 2px 10px #ccc;
  288. transition: all .2s ease-in;
  289. }
  290. .servicePatent .patent .patentImg{
  291. width: 95px;
  292. height: 142px;
  293. background: url(../../../img/newMenu/serves_20.jpg) no-repeat;
  294. background-size:100% 100%;
  295. padding-top: 18px;
  296. float: left;
  297. }
  298. .servicePatent .patent .patentImg p{
  299. font-size: 18px;
  300. color: #1f1f1f;
  301. letter-spacing: 20px;
  302. width: 44px;
  303. height: 104px;
  304. margin: 0px auto;
  305. background: url(../../../img/newMenu/serves_23.png) no-repeat;
  306. background-size:100% 100%;
  307. padding-left: 11px;
  308. line-height: 18px;
  309. padding-top:15px;
  310. }
  311. .servicePatent .originality{
  312. float: left;
  313. width: 120px;
  314. height: 40px;
  315. background: url(../../../img/newMenu/serves_22.png) no-repeat;
  316. background-size:100% 100%;
  317. font-size: 16px;
  318. color: #ffffff;
  319. text-align: center;
  320. line-height: 36px;
  321. vertical-align: top;
  322. margin-top: 54px;
  323. margin-left: 10px;
  324. transition: all .2s ease-in-out;
  325. }
  326. .servicePatent .originality:hover{
  327. margin-top: 45px;
  328. transition: all .2s ease-in;
  329. }
  330. .patent .patentList{
  331. float: left;
  332. padding-left: 16px;
  333. padding-top:18px;
  334. }
  335. .patent .patentList ul{
  336. width: 470px;
  337. overflow: hidden;
  338. border-bottom: 1px solid #efefef;
  339. border-left: 1px solid #efefef;
  340. }
  341. .subsidyList a p{
  342. overflow: hidden;
  343. text-overflow: ellipsis;
  344. white-space: nowrap;
  345. -o-text-overflow: ellipsis;
  346. }
  347. .patent .patentList ul li a{
  348. width: 100%;
  349. height: 100%;
  350. display: inline-block;
  351. }
  352. .patent .patentList ul li {
  353. width: 93px;
  354. float: left;
  355. text-align: center;
  356. height: 55px;
  357. line-height: 55px;
  358. border-right: 1px solid #efefef;
  359. border-top: 1px solid #efefef;
  360. }
  361. .patent .patentList ul li:hover a p{
  362. color:#000000;
  363. }
  364. .patent .patentList ul li:hover{
  365. background: #f8f8f8;
  366. }
  367. /* 企业认证 */
  368. .advertisement{
  369. clear: both;
  370. }
  371. .certification{
  372. overflow: hidden;
  373. margin-top: 24px;
  374. padding-bottom: 50px;
  375. }
  376. .certification div{
  377. float: left;
  378. }
  379. .certification .certificationImg {
  380. width: 174px;
  381. height: 278px;
  382. }
  383. .certification .certificationImg img{
  384. width: 100%;
  385. height: 100%;
  386. }
  387. .certification .certificationList{
  388. width: 378px;
  389. height: 280px;
  390. }
  391. .certification .certificationList>div{
  392. width: 100%;
  393. background: #fbfbfb;
  394. line-height: 74px;
  395. height: 74px;
  396. text-align: center;
  397. font-size: 18px;
  398. color: #393838;
  399. border: 1px solid #efefef;
  400. border-left: none;
  401. }
  402. .certification .certificationRight {
  403. float: right;
  404. border-left: 1px solid #efefef;
  405. }
  406. .certification .certificationList>div img{
  407. margin-right: 10px;
  408. }
  409. .certification .certificationList ol li{
  410. width: 50%;
  411. float: left;
  412. height: 51px;
  413. line-height: 51px;
  414. text-align: center;
  415. font-size: 14px;
  416. color: #7a7878;
  417. border-right: 1px solid #efefef;
  418. border-bottom: 1px solid #efefef;
  419. overflow: hidden;
  420. white-space:nowrap;
  421. text-overflow:ellipsis;
  422. -o-text-overflow:ellipsis;
  423. }
  424. .certificationList ol li:hover{
  425. background: #f8f8f8;
  426. }
  427. .certificationList ol li a{
  428. width: 100%;
  429. height: 100%;
  430. display: inline-block;
  431. }
  432. .certificationList ol li:hover a{
  433. color: #000000!important;
  434. }
  435. .certification .certificationList ol li a{
  436. color:#7a7878;
  437. }
  438. .advertisement.bj{
  439. clear: both;
  440. padding-top: 20px;
  441. }
  442. .advertisement.bj img{
  443. padding-bottom: 0
  444. }
  445. /* 管理 */
  446. .administration{
  447. overflow: hidden;
  448. border: 1px solid #efefef;
  449. }
  450. .administration ul li {
  451. width:25%;
  452. height: 48px;
  453. line-height: 48px;
  454. float: left;
  455. text-align: center;
  456. border-top: 1px solid #efefef;
  457. border-left: 1px solid #efefef
  458. }
  459. .administration ul li a{
  460. width: 100%;
  461. height: 100%;
  462. display: inline-block;
  463. }
  464. .administration ul li:hover{
  465. background: #f8f8f8;
  466. }
  467. .administration ul li:hover a{
  468. color: #000000;
  469. }
  470. .administration ul li a{
  471. color:#7a7878
  472. }
  473. .administration ul li:nth-child(5),.administration ul li:nth-child(6),.administration ul li:nth-child(7),.administration ul li:nth-child(12),.administration ul li:nth-child(13),.administration ul li:nth-child(14){
  474. width: 33.33%;
  475. }
  476. /* 右侧 */
  477. .wrapperRight {
  478. float: right;
  479. width: 224px;
  480. }
  481. .wrapperRight .memo>div{
  482. width: 100%;
  483. height: 58px;
  484. line-height: 58px;
  485. text-align: center;
  486. font-size: 22px;
  487. color: #ffffff;
  488. background: url(../../../img/newMenu/serves_29.png) no-repeat;
  489. background-size:100% 100%;
  490. margin-bottom: 12px;
  491. }
  492. .wrapperRight .memo{
  493. border: 1px solid #efefef;
  494. padding-bottom: 38px;
  495. height: 382px;
  496. }
  497. .wrapperRight .memo h4{
  498. font-size: 18px;
  499. color: #393838;
  500. text-align: center;
  501. line-height: 30px;
  502. height: 30px;
  503. }
  504. .wrapperRight .memo h4 strong{
  505. font-size: 24px;
  506. color: #ff580e;
  507. vertical-align: top;
  508. margin-top: 6px;
  509. font-weight:550
  510. }
  511. .wrapperRight .memo ul{
  512. padding:20px 12px 0;
  513. }
  514. .wrapperRight .memo ul li{
  515. overflow: hidden;
  516. white-space:nowrap;
  517. text-overflow:ellipsis;
  518. -o-text-overflow:ellipsis;
  519. margin-top: 4px;
  520. transition: all .2s ease-in-out;
  521. }
  522. .wrapperRight .memo ul li a{
  523. color: #7a7878;
  524. font-size: 14px;
  525. }
  526. .wrapperRight .memo ul li a::before{
  527. content: '';
  528. border-radius: 50%;
  529. width: 4px;
  530. height: 4px;
  531. margin-right: 10px;
  532. vertical-align: middle;
  533. display: inline-block;
  534. background: #666666;
  535. }
  536. .wrapperRight .memo ul li a:hover{
  537. color: #0a7dd4;
  538. }
  539. /* 政策放榜 */
  540. .policy{
  541. border: 1px solid #efefef;
  542. padding-bottom: 20px;
  543. margin-top: 50px;
  544. height: 337px;
  545. }
  546. .policy>div{
  547. width: 100%;
  548. height: 100px;
  549. background: url(../../../img/newMenu/serves_30.png) no-repeat;
  550. background-size:100% 100%;
  551. }
  552. .policy ul li {
  553. overflow: hidden;
  554. white-space:nowrap;
  555. text-overflow:ellipsis;
  556. -o-text-overflow:ellipsis;
  557. }
  558. .policy ul{
  559. padding-left: 12px;
  560. padding-top: 15px;
  561. }
  562. .policy ul li{
  563. margin-top: 5px;
  564. transition: all .2s ease-in-out;
  565. }
  566. .policy ul li a{
  567. color: #7a7878;
  568. font-size: 14px;
  569. }
  570. .policy ul li:hover,.memo ul li:hover{
  571. margin-left: -4px;
  572. transition: all .2s ease-in;
  573. }
  574. .policy ul li:hover a{
  575. color: #0a7dd4;
  576. }
  577. /* 今日快讯 */
  578. .newFlash{
  579. padding-top: 30px;
  580. }
  581. .newFlash h4{
  582. font-weight: normal;
  583. font-size: 14px;
  584. color: #393838;
  585. margin-bottom: 10px;
  586. }
  587. .newFlash h4 img{
  588. display: inline-block;
  589. margin-right: 5px;
  590. vertical-align: top;
  591. }
  592. .newFlash>div{
  593. width: 100%;
  594. position: relative;
  595. height: 80px;
  596. }
  597. .newFlash>div img{
  598. width: 100%;
  599. height: 100%;
  600. position: absolute;
  601. top: 0;
  602. left: 0;
  603. z-index: 99;
  604. }
  605. .newFlash>div p{
  606. width: 100%;
  607. height: 0px;
  608. line-height: 0px;
  609. background: rgba(0, 0, 0, .3);
  610. position: absolute;
  611. color: #ffffff;
  612. bottom: 0;
  613. left: 0;
  614. z-index: 999;
  615. text-align: center;
  616. overflow: hidden;
  617. white-space:nowrap;
  618. text-overflow:ellipsis;
  619. -o-text-overflow:ellipsis;
  620. transition: all .5s;
  621. }
  622. .newFlash>div:hover p{
  623. height:24px;
  624. line-height:24px;
  625. transition: all .5s;
  626. }
  627. .newFlash ul{
  628. padding-top: 10px;
  629. height: 315px;
  630. }
  631. .newFlash ul li{
  632. border-bottom: 1px dashed #eeeeee;
  633. padding:6px 0;
  634. transition: all .2s ease-in;
  635. }
  636. .newFlash ul li a{
  637. color: #686868;
  638. height: 24px;
  639. line-height: 24px;
  640. }
  641. .newFlash ul li:hover{
  642. margin-left: -2px;
  643. transition: all .2s ease-in;
  644. }
  645. .newFlash ul li a:hover{
  646. color: #0a7dd4;
  647. }
  648. .newFlash ul li img{
  649. margin-right: 5px;
  650. display: inline-block;
  651. }
  652. /* 技淘百科 */
  653. .encyclopedias {
  654. width: 218px;
  655. height: 330px;
  656. margin-top: 60px;
  657. position: relative;
  658. background: url(../../../img/newMenu/service_jitao1.jpg) no-repeat;
  659. background-size:100% 100%;
  660. }
  661. .encyclopedias a{
  662. display: inline-block;
  663. width: 128px;
  664. height: 36px;
  665. position: absolute;
  666. left: 50%;
  667. bottom: 34px;
  668. margin-left: -64px;
  669. text-align: center;
  670. font-size: 14px;
  671. color: #ffffff;
  672. line-height: 36px;
  673. background: #80e561;
  674. border-radius: 20px;
  675. box-shadow: 0 2px 10px rgb(155, 152, 152);
  676. transition: all .2s ease-in-out;
  677. }
  678. .encyclopedias a img{
  679. margin-left: 10px;
  680. }
  681. .encyclopedias a:hover{
  682. background: #ff5910;
  683. transition: all .2s ease-in
  684. }
  685. .overBj{
  686. clear: both;
  687. margin-top: 18px;
  688. }
  689. .overBj img{
  690. width: 100%;
  691. }
  692. /* p品牌通 */
  693. .brand{
  694. height: 620px;
  695. width: 100%;
  696. background: url(../../../img/newMenu/service_101.jpg)no-repeat;
  697. background-size:100% 100%;
  698. padding-top: 44px;
  699. }
  700. .branTtitle{
  701. text-align: center;
  702. }
  703. .branTtitle h4{
  704. font-weight: normal;
  705. width: 630px;
  706. margin: 0 auto;
  707. height: 26px;
  708. font-size: 26px;
  709. color: #ef7b43;
  710. background: url(../../../img/newMenu/service_102.png) no-repeat;
  711. background-size:100% 100%;
  712. }
  713. .branTtitle p{
  714. font-size: 18px;
  715. color: #c98e62;
  716. margin-top: 12px;
  717. }
  718. .brand .brandList{
  719. display: flex;
  720. display: -webkit-flex;
  721. justify-content: space-between;
  722. align-items: flex-end;
  723. height: 434px;
  724. }
  725. .brand .brandList li{
  726. text-align: center;
  727. width: 214px;
  728. vertical-align: bottom;
  729. background: #ffffff;
  730. box-shadow: 0 5px 15px #c98e62;
  731. border-radius: 15px 15px 0 0 ;
  732. transition: all .2s ease-in-out;
  733. }
  734. .brandList li:hover{
  735. margin-bottom: 8px;
  736. transition: all .2s ease-in;
  737. }
  738. .brandList li:hover div span{
  739. box-shadow: 0 8px 15px #ec9c7c;
  740. }
  741. .brand .brandList li img{
  742. width: 100%;
  743. height: 142px;
  744. border-radius: 10px 10px 0 0 ;
  745. }
  746. .brand .brandList li:nth-child(1){
  747. height: 355px;
  748. }
  749. .brand .brandList li:nth-child(1) div{
  750. height: 160px;
  751. padding-top: 16px;
  752. }
  753. .brand .brandList li:nth-child(1) div span{
  754. margin-top: 10px;
  755. }
  756. .brand .brandList li:nth-child(2) div span{
  757. margin-top: 22px;
  758. }
  759. .brand .brandList li:nth-child(3) div span{
  760. margin-top: 38px;
  761. }
  762. .brand .brandList li:nth-child(4) div span{
  763. margin-top: 54px;
  764. }
  765. .brand .brandList li:nth-child(5) div span{
  766. margin-top:70px;
  767. }
  768. .brand .brandList li:nth-child(2){
  769. height: 375px;
  770. }
  771. .brand .brandList li:nth-child(2) div{
  772. height: 178px;
  773. padding-top: 24px;
  774. }
  775. .brand .brandList li:nth-child(3){
  776. height: 395px;
  777. }
  778. .brand .brandList li:nth-child(3) div{
  779. height: 198px;
  780. padding-top: 28px;
  781. }
  782. .brand .brandList li:nth-child(4){
  783. height: 415px;
  784. }
  785. .brand .brandList li:nth-child(4) div{
  786. height: 218px;
  787. padding-top: 32px;
  788. }
  789. .brand .brandList li:nth-child(5){
  790. height: 435px;
  791. }
  792. .brand .brandList li:nth-child(5) div{
  793. box-sizing: border-box;
  794. height:238px;
  795. padding-top:35px;
  796. }
  797. .brand .brandList li p{
  798. font-size: 16px;
  799. color: #7a7878;
  800. line-height: 32px;
  801. height: 32px;
  802. }
  803. .brand .brandList li div{
  804. padding-top: 30px;
  805. }
  806. .brand .brandList li div span{
  807. width: 148px;
  808. height: 46px;
  809. line-height: 46px;
  810. display: inline-block;
  811. background: linear-gradient(left, #ff580e ,#ff8041);
  812. background: -webkit-linear-gradient(left, #ff580e ,#ff8041); /* Safari 5.1 - 6.0 */
  813. background: -o-linear-gradient(left, #ff580e ,#ff8041); /* Opera 11.1 - 12.0 */
  814. background: -moz-linear-gradient(left, #ff580e ,#ff8041); /* Firefox 3.6 - 15 */
  815. background: linear-gradient(left, #ff580e ,#ff8041); /* 标准的语法 */
  816. font-size: 18px;
  817. color: #ffffff;
  818. border-radius: 10px;
  819. vertical-align: bottom;
  820. transition: all .2s ease-in-out;
  821. }
  822. /* 科技通 */
  823. .scienceTtitle{
  824. clear: both;
  825. text-align: center;
  826. padding-top: 56px;
  827. }
  828. .scienceTtitle h4{
  829. font-weight: normal;
  830. width: 630px;
  831. margin: 0 auto;
  832. height: 26px;
  833. font-size: 26px;
  834. color: #ff5d1d;
  835. background: url(../../../img/newMenu/service_108.png) no-repeat;
  836. background-size:100% 100%;
  837. }
  838. .scienceTtitle p{
  839. font-size: 18px;
  840. color: #7a7878;
  841. margin-top: 12px;
  842. }
  843. .scienceLeft>.imgt{
  844. float: left;
  845. width: 246px;
  846. height: 286px;
  847. position: relative;
  848. margin-top: 68px;
  849. z-index: 111;
  850. }
  851. .scienceLeft>.imgt img{
  852. width: 246px;
  853. height: 286px;
  854. position: absolute;
  855. top: 0;
  856. left: 0;
  857. z-index: 222;
  858. }
  859. .scienceLeft>.imgt span{
  860. width: 246px;
  861. height: 286px;
  862. display: inline-block;
  863. position: absolute;
  864. background: rgba(0, 0, 0, .5);
  865. top:0;
  866. left:0;
  867. z-index: 300;
  868. }
  869. .scienceLeft>.imgt>div{
  870. width: 210px;
  871. height: 70px;
  872. top: 87px;
  873. left: 20px;
  874. background: url(../../../img/newMenu/service_110.png)no-repeat;
  875. background-size:100% 100%;
  876. text-align: center;
  877. position: absolute;
  878. top: 90px;
  879. left: 50%;
  880. margin-left: -105px;
  881. z-index: 444;
  882. }
  883. .scienceLeft>.imgt a{
  884. color: #ffffff;
  885. width: 86px;
  886. height: 32px;
  887. line-height: 32px;
  888. text-align: center;
  889. box-shadow: 0 5px 10px #333;
  890. position: absolute;
  891. bottom: 50px;
  892. left: 50%;
  893. margin-left: -43px;
  894. background: #1d1d1d;
  895. z-index: 999;
  896. border-radius: 10px;
  897. transition: all .5s ease-in;
  898. }
  899. .imgt:hover a{
  900. transform: scale(1.2);
  901. box-shadow: 0px 0px 55px #e7e7e7;
  902. transition: all .5s ease-in;
  903. }
  904. .scienceLeft>.imgt>div p{
  905. font-size: 24px;
  906. color: #ffffff;
  907. }
  908. .scienceList{
  909. float: left;
  910. width: 660px;
  911. height: 284px;
  912. margin-top: 68px;
  913. }
  914. .scienceLeft ul{
  915. box-sizing:border-box;
  916. }
  917. .scienceLeft ul li {
  918. display: inline-block;
  919. vertical-align: top;
  920. margin-left: 10px;
  921. margin-bottom: 22px;
  922. transition: all .2s ease-in-out;
  923. }
  924. .scienceLeft ul li:hover img{
  925. box-shadow: 0 4px 10px #ccc;
  926. transition: all .2s ease-in;
  927. transform: scale(1.02);
  928. }
  929. .scienceRight{
  930. float: right;
  931. width: 290px;
  932. }
  933. .scienceRight h4{
  934. font-weight: normal;
  935. font-size: 18px;
  936. color: #444444;
  937. }
  938. .scienceRight h4 img{
  939. margin-right: 12px;
  940. }
  941. .scienceRight>div{
  942. width: 290px;
  943. height: 364px;
  944. background: url(../../../img/newMenu/service_109.png)no-repeat;
  945. background-size:100% 100%;
  946. padding-top: 56px;
  947. padding-left: 50px;
  948. }
  949. .scienceRight>div p{
  950. width: 190px;
  951. text-align: justify;
  952. line-height:26px;
  953. color: #444444;
  954. }
  955. .scienceRight div a{
  956. width: 94px;
  957. height: 34px;
  958. line-height: 34px;
  959. display: inline-block;
  960. text-align: center;
  961. border: 1px solid #ff580e;
  962. font-size: 14px;
  963. color: #ff580e;
  964. border-radius: 12px;
  965. float: right;
  966. margin-right: 50px;
  967. margin-top: 10px;
  968. transition: all .2s ease-in-out;
  969. }
  970. .scienceRight div a:hover{
  971. background: #ef7b43;
  972. color: #ffffff;
  973. transition: all .2s ease-in;
  974. }
  975. /* 科技项目 */
  976. .project{
  977. clear: both;
  978. overflow: hidden;
  979. margin-bottom: 40px;
  980. }
  981. .project .projectImg{
  982. float: left;
  983. width: 266px;
  984. height: 300px;
  985. }
  986. .project .projectImg img{
  987. width: 100%;
  988. height: 100%;
  989. }
  990. .project .projectMid{
  991. float: right;
  992. width: 920px;
  993. }
  994. .project .projectMid img{
  995. margin-bottom: 12px;
  996. }
  997. .projectMid >div>div{
  998. float: left;
  999. }
  1000. .projectMid .imgLeft {
  1001. width: 680px;
  1002. }
  1003. .projectMid .imgLeft ul li {
  1004. float: left;
  1005. width: 214px;
  1006. height: 57px;
  1007. background: #f8f8f8;
  1008. font-size: 14px;
  1009. line-height: 57px;
  1010. text-align: center;
  1011. margin-right: 2px;
  1012. margin-bottom: 2px;
  1013. overflow: hidden;
  1014. white-space: nowrap;
  1015. text-overflow: ellipsis;
  1016. -o-text-overflow: ellipsis;
  1017. padding: 0 5px;
  1018. }
  1019. .imgLeft ul li:hover{
  1020. background: #ffffff;
  1021. }
  1022. .imgLeft ul li:hover p{
  1023. color: #000000;
  1024. }
  1025. .imgLeft ul li P{
  1026. overflow: hidden;
  1027. white-space:nowrap;
  1028. text-overflow:ellipsis;
  1029. -o-text-overflow:ellipsis;
  1030. }
  1031. .imgLeft ul li a{
  1032. color: #393838;
  1033. }
  1034. .projectMid .imgRight{
  1035. width: 214px;
  1036. text-align: center;
  1037. margin-right: 16px;
  1038. }
  1039. .projectMid .imgRight ol li {
  1040. height: 57px;
  1041. font-size: 14px;
  1042. color: #393838;
  1043. line-height: 57px;
  1044. margin-bottom: 2px;
  1045. background: #f8f8f8;
  1046. overflow: hidden;
  1047. white-space:nowrap;
  1048. text-overflow:ellipsis;
  1049. -o-text-overflow:ellipsis;
  1050. }
  1051. .advertisementBj{
  1052. height: 92px;
  1053. width: 100%;
  1054. margin-bottom: 24px;
  1055. }
  1056. .advertisementBj img{
  1057. width: 100%;
  1058. height: 100%;
  1059. }
  1060. .projectRight{
  1061. width: 220px;
  1062. float: right!important;
  1063. margin-right: 20px;
  1064. text-align: center;
  1065. margin-top: -24px;
  1066. }
  1067. .projectRight li{
  1068. width: 100%;
  1069. height: 34px;
  1070. font-size:14px;
  1071. border: 1px solid #dcdcdc;
  1072. line-height: 34px;
  1073. border-radius:20px;
  1074. margin-bottom: 12px;
  1075. transition: all .2s ease-in-out;
  1076. }
  1077. .projectRight li:hover{
  1078. margin-left: -4px;
  1079. border-color: #ff5a0e;
  1080. transition: all .2s ease-in;
  1081. }
  1082. .projectRight li:hover p{
  1083. color: #ff5a0e;
  1084. }
  1085. .projectRight li p{
  1086. line-height: 30px;
  1087. color: #444444;
  1088. }
  1089. .projectRight li span{
  1090. color: #ff5a0e;
  1091. font-size: 18px;
  1092. display: inline-block;
  1093. margin-right: 10px;
  1094. }
  1095. /* 合作伙伴 */
  1096. .cooperation{
  1097. clear: both;
  1098. padding-top: 26px;
  1099. }
  1100. .cooperation .cooperationImg{
  1101. float: left;
  1102. width:270px;
  1103. height: 250px;
  1104. }
  1105. .cooperation .cooperationLogo{
  1106. width: 930px;
  1107. float: left;
  1108. height: 249px;
  1109. border-bottom: 1px solid #f3f3f3;
  1110. }
  1111. .cooperation .cooperationLogo ul{
  1112. box-sizing: border-box;
  1113. }
  1114. .cooperation .cooperationLogo ul li{
  1115. float: left;
  1116. width: 20%;
  1117. height: 82.5px;
  1118. border-right:1px solid #f3f3f3;
  1119. border-top: 1px solid #f3f3f3;
  1120. }
  1121. .cooperation .cooperationLogo ul li img{
  1122. width: 100%;
  1123. height: 100%;
  1124. }
  1125. .cooperationPeople{
  1126. clear: both;
  1127. padding-top:40px;
  1128. padding-bottom: 60px;
  1129. }
  1130. .cooperationPeople .listPre,.cooperationPeople .listNext{
  1131. width: 34px;
  1132. height: 34px;
  1133. display: inline-block;
  1134. vertical-align: top;
  1135. margin: 44px 5px 0;
  1136. cursor: pointer;
  1137. transition: all .3s ease-out;
  1138. }
  1139. .cooperationPeople>span:hover{
  1140. transform: scale(1.1);
  1141. transition: all .3s ease-in;
  1142. }
  1143. .cooperationPeople .listPre{
  1144. float: left;
  1145. }
  1146. .cooperationPeople .listNext{
  1147. float: right;
  1148. }
  1149. .cooperationPeople .customerList{
  1150. width: 1100px;
  1151. overflow: hidden;
  1152. }
  1153. .cooperationPeople .customerList ul {
  1154. overflow: hidden;
  1155. width: 999999px;
  1156. box-sizing: border-box;
  1157. }
  1158. .cooperationPeople .customerList ul li{
  1159. float: left;
  1160. width: 370px;
  1161. }
  1162. .customerList ul li img{
  1163. width: 96px;
  1164. height: 96px;
  1165. border-radius: 50%;
  1166. float: left;
  1167. margin-right: 15px;
  1168. margin-top: 3px;
  1169. }
  1170. .customerList ul li div{
  1171. width: 228px;
  1172. float: left;
  1173. }
  1174. .customerList ul li div h5{
  1175. font-size: 18px;
  1176. }
  1177. .customerList ul li div h5 span{
  1178. color: #ff580e;
  1179. font-size: 14px;
  1180. display: inline-block;
  1181. margin-left: 10px;
  1182. }
  1183. .customerList ul li div h5 span:first-child{
  1184. font-weight: normal;
  1185. font-size: 18px;
  1186. color: #323232;
  1187. margin-top: 16px;
  1188. }
  1189. .customerList ul li div p{
  1190. font-size: 12px;
  1191. color: #686868;
  1192. margin-top: 15px;
  1193. }
  1194. .customerList ul li:hover h5{
  1195. color: #0a7dd4
  1196. }
  1197. /* map */
  1198. .serviceMap {
  1199. float: left;
  1200. position: relative;
  1201. width: 520px;
  1202. height: 350px;
  1203. z-index: 99;
  1204. }
  1205. .serviceMap .BMap_Marker{
  1206. display: inline-block;
  1207. width: 150px!important;
  1208. }
  1209. .serviceMap .BMapLabel{
  1210. width: 200px;
  1211. height: 20px;
  1212. line-height: 20px
  1213. }
  1214. .serviceMap .bottom{
  1215. margin-top: 0;
  1216. border-bottom:none;
  1217. }
  1218. .serviceMap .center{
  1219. width: 252px!important;
  1220. }
  1221. .serviceMap>img{
  1222. position: absolute;
  1223. top: 0;
  1224. right: 50px;
  1225. z-index: 999;
  1226. }
  1227. .serviceMap #dituContent{
  1228. position: absolute;
  1229. top: 50px;
  1230. z-index: 888;
  1231. }
  1232. .serviceTxt{
  1233. float: left;
  1234. padding: 48px 24px 0;
  1235. width: 244px;
  1236. }
  1237. .serviceTxt h2{
  1238. text-align: center;
  1239. margin-bottom: 18px;
  1240. font-size: 24px;
  1241. color: #ff7e0b;
  1242. font-weight: 700
  1243. }
  1244. .serviceTxt .txtMid{
  1245. font-size: 14px;
  1246. color: #686868;
  1247. text-align: right;
  1248. margin-bottom: 18px;
  1249. }
  1250. .serviceTxt .txtOrange{
  1251. font-size: 18px;
  1252. color: #ff983c;
  1253. margin-bottom: 18px;
  1254. }
  1255. .serviceTxt .txtSmall{
  1256. font-size: 14px;
  1257. color: #f29848;
  1258. text-align: center;
  1259. margin-bottom: 18px;
  1260. }
  1261. .serviceTxt .txtF{
  1262. font-size: 16px;
  1263. color: #ff6600;
  1264. font-weight: 700;
  1265. }
  1266. .serviceCapacity {
  1267. clear: both;
  1268. overflow: hidden;
  1269. padding-top: 40px;
  1270. padding-bottom: 18px;
  1271. }
  1272. .serviceCapacity .serviceCrowd{
  1273. float: left;
  1274. width: 436px;
  1275. }
  1276. .serviceCapacity .serviceCrowd>img{
  1277. width: 100%;
  1278. margin-bottom: 16px;
  1279. }
  1280. .serviceCrowd ol{
  1281. clear: both;
  1282. overflow: hidden;
  1283. }
  1284. .serviceCrowd ol li{
  1285. float: left;
  1286. width: 216px;
  1287. }
  1288. .serviceCrowd .portrait{
  1289. float: left;
  1290. width: 120px;
  1291. height: 126px;
  1292. position: relative;
  1293. z-index: 88;
  1294. }
  1295. .serviceCrowd .portrait img{
  1296. width: 120px;
  1297. height: 126px;
  1298. position: absolute;
  1299. top: 0;
  1300. left: 0;
  1301. }
  1302. .serviceCrowd .portrait p{
  1303. position: absolute;
  1304. width: 100px;
  1305. height: 22px;
  1306. line-height: 22px;
  1307. font-size: 14px;
  1308. color: #ffffff;
  1309. text-align: center;
  1310. bottom: 0;
  1311. left: 50%;
  1312. margin-left: -50px;
  1313. background: #69c3f1;
  1314. }
  1315. .serviceCrowd ol li>p{
  1316. float: left;
  1317. width: 96px;
  1318. font-size: 14px;
  1319. color: #7a7878;
  1320. margin-top: 14px;
  1321. }
  1322. .process{
  1323. padding-top: 42px;
  1324. padding-bottom: 110px;
  1325. }
  1326. .process ul{
  1327. display: flex;
  1328. box-sizing: border-box;
  1329. }
  1330. .process ul li{
  1331. text-align: center;
  1332. width: 200px;
  1333. }
  1334. .process ul li span{
  1335. display: inline-block;
  1336. width: 100%;
  1337. height: 34px;
  1338. background: url(../../../img/newMenu/service_131.jpg) no-repeat;
  1339. background-size:100% 100%;
  1340. }