index.css 23 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187
  1. .carousel {
  2. width: 100%;
  3. height: 549px;
  4. margin-top:-90px;
  5. }
  6. .carousel img {
  7. width: 100%;
  8. height: 100%;
  9. }
  10. .carousel .swiper {
  11. width: 100%;
  12. height: 100%;
  13. }
  14. .carousel .swiper-slide {
  15. text-align: center;
  16. font-size: 18px;
  17. background: #fff;
  18. /* Center slide text vertically */
  19. display: -webkit-box;
  20. display: -ms-flexbox;
  21. display: -webkit-flex;
  22. display: flex;
  23. -webkit-box-pack: center;
  24. -ms-flex-pack: center;
  25. -webkit-justify-content: center;
  26. justify-content: center;
  27. -webkit-box-align: center;
  28. -ms-flex-align: center;
  29. -webkit-align-items: center;
  30. align-items: center;
  31. }
  32. .carousel .swiper-slide a{
  33. width: 100%;
  34. }
  35. .carousel .swiper-slide img {
  36. display: block;
  37. width: 100%;
  38. height: 100%;
  39. object-fit: cover;
  40. }
  41. .carousel .swiper-carousel .swiper-carousel-pagination{
  42. width: 1200px;
  43. left:50%;
  44. transform: translateX(-50%);
  45. margin-left:-465px;
  46. bottom:60px;
  47. }
  48. .carousel .swiper-carousel .swiper-pagination-bullet {
  49. width: 16px;
  50. height: 6px;
  51. border-radius: 4px;
  52. }
  53. .carousel .swiper-carousel .swiper-pagination-bullet-active {
  54. width: 24px;
  55. height: 6px;
  56. border-radius: 4px;
  57. background: #019BFF;
  58. }
  59. .grow {
  60. width: 100%;
  61. }
  62. .grow .title {
  63. margin-top: 110px;
  64. position: relative;
  65. }
  66. .grow .title .circle-icon-l {
  67. position: absolute;
  68. top: -55px;
  69. left: 394px;
  70. width: 113px;
  71. height: 113px;
  72. }
  73. .grow .title .circle-icon-l img {
  74. width: 100%;
  75. height: 100%;
  76. }
  77. .grow .title .circle-icon-r {
  78. position: absolute;
  79. top: -18px;
  80. right: -65px;
  81. z-index: -1;
  82. width: 284px;
  83. height: 284px;
  84. }
  85. .grow .title .circle-icon-r img {
  86. width: 100%;
  87. height: 100%;
  88. }
  89. .grow .title .title-top {
  90. height: 35px;
  91. font-size: 36px;
  92. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  93. font-weight: bold;
  94. color: #222B33;
  95. line-height: 48px;
  96. text-align: center;
  97. }
  98. .grow .title .title-bom {
  99. height: 30px;
  100. font-size: 24px;
  101. margin-top: 10px;
  102. font-family: 'Futura LT Heavy Oblique';
  103. color: #ddd;
  104. line-height: 31px;
  105. text-align: center;
  106. letter-spacing: 1px;
  107. }
  108. .grow ul {
  109. list-style: none;
  110. display: flex;
  111. justify-content: space-between;
  112. width: 100%;
  113. flex-shrink: 0;
  114. }
  115. .grow ul li {
  116. width: 22%;
  117. height: 185px;
  118. margin-top:78px;
  119. background: #FFFFFF;
  120. box-shadow: 1px 1px 10px 2px rgba(0, 0, 0, 0.05);
  121. border-radius: 8px;
  122. display: flex;
  123. flex-direction: column;
  124. align-items: center;
  125. }
  126. .grow ul li .item-icon {
  127. margin-top: -46px;
  128. width: 93px;
  129. height: 93px;
  130. }
  131. .grow ul li .item-icon img {
  132. width: 100%;
  133. height: 100%;
  134. }
  135. .grow ul li .item-num {
  136. height: 41px;
  137. margin-top: 18px;
  138. font-size: 32px;
  139. font-family: FuturaLT-Heavy, FuturaLT;
  140. font-weight: 800;
  141. color: #2B3245;
  142. line-height: 42px;
  143. }
  144. .grow ul li .item-word {
  145. height: 18px;
  146. font-size: 18px;
  147. margin-top: 16px;
  148. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  149. font-weight: bold;
  150. color: #2B343B;
  151. line-height: 27px;
  152. }
  153. .grow ul li .item-des {
  154. height: 24px;
  155. font-size: 18px;
  156. margin-top: 12px;
  157. font-family: FuturaLT-Heavy, FuturaLT;
  158. color: #BFC4CE;
  159. line-height: 25px;
  160. }
  161. .ability {
  162. background: linear-gradient(180deg, #E4F1FD 0%, rgba(255, 255, 255, 0.25) 100%);
  163. padding-top: 74px;
  164. margin-top: 36px;
  165. }
  166. .ability .part_1 {
  167. display: flex;
  168. justify-content: space-between;
  169. position: relative;
  170. margin-top: 125px;
  171. }
  172. .ability .part_1 .part_1_left {
  173. position: relative;
  174. margin-right:20px;
  175. }
  176. .ability .part_1 .part_1_left .part_1_left_word{
  177. position: relative;
  178. }
  179. .ability .part_1 .part_1_left .left-circle-icon {
  180. position: absolute;
  181. width: 123px;
  182. height: 123px;
  183. left: 30px;
  184. top: -39px;
  185. }
  186. .ability .part_1 .part_1_left .left-title {
  187. max-width: 464px;
  188. height: 227px;
  189. position: relative;
  190. background: url("../image/15.png") no-repeat left top;
  191. background-size: 100% 100%;
  192. }
  193. .ability .part_1 .part_1_left .left-title .word {
  194. position: absolute;
  195. top: 40px;
  196. right: 0px;
  197. /*width: 218px;*/
  198. height: 48px;
  199. font-size: 36px;
  200. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  201. font-weight: bold;
  202. color: #044888;
  203. line-height: 48px;
  204. }
  205. .ability .part_1 .part_1_left .left-title .line {
  206. position: absolute;
  207. right: 0px;
  208. top: 89px;
  209. width: 80px;
  210. height: 7px;
  211. background: #2B94F6;
  212. }
  213. .ability .part_1 .part_1_left .left_pic {
  214. position: relative;
  215. margin-top: -30px;
  216. max-width: 540px;
  217. min-width: 400px;
  218. }
  219. .ability .part_1 .part_1_left .left_pic img {
  220. width: 100%;
  221. }
  222. .ability .part_1 .part_1_right {
  223. max-width: 600px;
  224. min-width: 480px;
  225. height: 656px;
  226. background: #FFFFFF;
  227. box-shadow: 2px 2px 10px 2px rgba(133, 141, 215, 0.11);
  228. border-radius: 12px;
  229. margin-top: 84px;
  230. }
  231. .ability .part_1 .part_1_right ul {
  232. display: flex;
  233. flex-wrap: wrap;
  234. padding: 0px 55px 55px 55px;
  235. justify-content: space-between;
  236. }
  237. .ability .part_1 .part_1_right ul li {
  238. max-width: 47%;
  239. margin-top: 55px;
  240. }
  241. .ability .part_1 .part_1_right ul li .item-title {
  242. display: flex;
  243. align-items: center;
  244. }
  245. .ability .part_1 .part_1_right ul li .item-title .icon {
  246. flex-shrink: 0;
  247. width: 60px;
  248. height: 60px;
  249. }
  250. .ability .part_1 .part_1_right ul li .item-title .icon img {
  251. width: 100%;
  252. height: 100%;
  253. }
  254. .ability .part_1 .part_1_right ul li .item-title .word {
  255. font-size: 21px;
  256. margin-left: 14px;
  257. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  258. font-weight: bold;
  259. color: #051442;
  260. line-height: 25px;
  261. -webkit-text-stroke: 0px #FFFFFF;
  262. text-stroke: 0px #FFFFFF;
  263. }
  264. .ability .part_1 .part_1_right ul li .item-des {
  265. font-size: 14px;
  266. font-family: SourceHanSansCN-Regular, SourceHanSansCN;
  267. font-weight: 400;
  268. color: #868993;
  269. line-height: 18px;
  270. margin-top: 12px;
  271. text-align: justify;
  272. text-align-last: left;
  273. text-justify: inter-ideograph;
  274. }
  275. .ability .part_2 {
  276. display: flex;
  277. justify-content: space-between;
  278. position: relative;
  279. margin-top: 115px;
  280. }
  281. .ability .part_2 .part_2_left {
  282. width: 600px;
  283. margin-top: 28px;
  284. position: relative;
  285. margin-right:20px;
  286. }
  287. .ability .part_2 .part_2_left .part_2_left_icon {
  288. position: absolute;
  289. left: 95px;
  290. top: -72px;
  291. width: 129px;
  292. height: 129px;
  293. }
  294. .ability .part_2 .part_2_left ul li {
  295. margin-left: 68px;
  296. background: #FFFFFF;
  297. box-shadow: 2px 2px 10px 2px rgba(133, 141, 215, 0.11);
  298. border-radius: 12px;
  299. display: flex;
  300. margin-top: 20px;
  301. align-items: center;
  302. padding: 20px 49px 20px 0px;
  303. }
  304. .ability .part_2 .part_2_left ul li .item-icon {
  305. width: 80px;
  306. height: 80px;
  307. margin-left: -40px;
  308. flex-shrink: 0;
  309. }
  310. .ability .part_2 .part_2_left ul li .item-icon img {
  311. width: 100%;
  312. height: 100%;
  313. }
  314. .ability .part_2 .part_2_left ul li .item-con {
  315. margin-left: 28px;
  316. }
  317. .ability .part_2 .part_2_left ul li .item-con .item-title {
  318. font-size: 22px;
  319. font-family: SourceHanSansCN-Medium, SourceHanSansCN;
  320. font-weight: 500;
  321. color: #051442;
  322. line-height: 48px;
  323. -webkit-text-stroke: 0px #FFFFFF;
  324. text-stroke: 0px #FFFFFF;
  325. }
  326. .ability .part_2 .part_2_left ul li .item-con .item-des {
  327. font-size: 16px;
  328. font-family: SourceHanSansCN-Regular, SourceHanSansCN;
  329. font-weight: 400;
  330. color: #868993;
  331. line-height: 22px;
  332. }
  333. .ability .part_2 .part_2_right {
  334. position: relative;
  335. }
  336. .ability .part_2 .part_2_right .right-circle-icon {
  337. position: absolute;
  338. width: 195px;
  339. height: 195px;
  340. left: 181px;
  341. top: -58px;
  342. }
  343. .ability .part_2 .part_2_right .right-title {
  344. width: 361px;
  345. height: 150px;
  346. position: relative;
  347. background: url("../image/17.png") no-repeat left top;
  348. background-size: 100% 100%;
  349. }
  350. .ability .part_2 .part_2_right .right-title .word {
  351. position: absolute;
  352. top: 40px;
  353. left: 0px;
  354. height: 48px;
  355. font-size: 36px;
  356. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  357. font-weight: bold;
  358. color: #044888;
  359. line-height: 48px;
  360. }
  361. .ability .part_2 .part_2_right .right-title .line {
  362. position: absolute;
  363. left: 0px;
  364. top: 89px;
  365. width: 80px;
  366. height: 7px;
  367. background: #2B94F6;
  368. }
  369. .ability .part_2 .part_2_right .right_pic {
  370. position: relative;
  371. max-width: 540px;
  372. }
  373. .ability .part_2 .part_2_right .right_pic img {
  374. width: 100%;
  375. }
  376. .ability .part_3 {
  377. display: flex;
  378. justify-content: space-between;
  379. position: relative;
  380. margin-top: 145px;
  381. }
  382. .ability .part_3 .part_3_left {
  383. position: relative;
  384. display: flex;
  385. margin-right:20px;
  386. flex-direction: column;
  387. }
  388. .ability .part_3 .part_3_left .left-circle-icon {
  389. position: absolute;
  390. width: 199px;
  391. height: 199px;
  392. left: 478px;
  393. top: -82px;
  394. }
  395. .ability .part_3 .part_3_left .left-title {
  396. position: relative;
  397. margin-left: 200px;
  398. width: 320px;
  399. height: 151px;
  400. background: url("../image/16.png") no-repeat left top;
  401. background-size: 100% 100%;
  402. }
  403. .ability .part_3 .part_3_left .left-title .word {
  404. position: absolute;
  405. top: 40px;
  406. right: 0px;
  407. font-size: 36px;
  408. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  409. font-weight: bold;
  410. color: #044888;
  411. line-height: 48px;
  412. }
  413. .ability .part_3 .part_3_left .left-title .line {
  414. position: absolute;
  415. right: 0px;
  416. top: 89px;
  417. width: 80px;
  418. height: 7px;
  419. background: #2B94F6;
  420. }
  421. .ability .part_3 .part_3_left .left_pic {
  422. position: relative;
  423. margin-top: -30px;
  424. max-width: 540px;
  425. }
  426. .ability .part_3 .part_3_left .left_pic img {
  427. width: 100%;
  428. }
  429. .ability .part_3 .part_3_right {
  430. width: 600px;
  431. background: #EEF6FD;
  432. box-shadow: 2px 2px 10px 2px rgba(133, 141, 215, 0.11);
  433. border-radius: 12px;
  434. margin-top: 84px;
  435. }
  436. .ability .part_3 .part_3_right ul {
  437. display: flex;
  438. flex-wrap: wrap;
  439. padding: 0px 55px 55px 55px;
  440. justify-content: space-between;
  441. }
  442. .ability .part_3 .part_3_right ul li {
  443. margin-top: 55px;
  444. display: flex;
  445. }
  446. .ability .part_3 .part_3_right ul li .item-icon {
  447. width: 80px;
  448. height: 80px;
  449. flex-shrink: 0;
  450. }
  451. .ability .part_3 .part_3_right ul li .item-icon img {
  452. width: 100%;
  453. height: 100%;
  454. }
  455. .ability .part_3 .part_3_right ul li .item-con {
  456. margin-left: 19px;
  457. }
  458. .ability .part_3 .part_3_right ul li .item-con .item-title {
  459. font-size: 22px;
  460. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  461. font-weight: bold;
  462. color: #051442;
  463. margin-top: -4px;
  464. -webkit-text-stroke: 0px #FFFFFF;
  465. text-stroke: 0px #FFFFFF;
  466. }
  467. .ability .part_3 .part_3_right ul li .item-con .item-des {
  468. font-size: 14px;
  469. font-family: SourceHanSansCN-Regular, SourceHanSansCN;
  470. font-weight: 400;
  471. color: #868993;
  472. line-height: 18px;
  473. text-align: justify;
  474. margin-top: 5px;
  475. text-align-last: left;
  476. text-justify: inter-ideograph;
  477. }
  478. .ability .part_4 {
  479. display: flex;
  480. justify-content: space-between;
  481. position: relative;
  482. margin-top: 145px;
  483. }
  484. .ability .part_4 .part_4_right {
  485. position: relative;
  486. }
  487. .ability .part_4 .part_4_right .left-circle-icon {
  488. position: absolute;
  489. width: 199px;
  490. height: 199px;
  491. left: 478px;
  492. top: -82px;
  493. }
  494. .ability .part_4 .part_4_right .left-title {
  495. position: relative;
  496. width: 447px;
  497. height: 151px;
  498. margin-left: 40px;
  499. background: url("../image/24.png") no-repeat left top;
  500. background-size: 100% 100%;
  501. }
  502. .ability .part_4 .part_4_right .left-title .word {
  503. position: absolute;
  504. top: 40px;
  505. left: 0px;
  506. font-size: 36px;
  507. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  508. font-weight: bold;
  509. color: #044888;
  510. line-height: 48px;
  511. }
  512. .ability .part_4 .part_4_right .left-title .line {
  513. position: absolute;
  514. left: 0px;
  515. top: 89px;
  516. width: 80px;
  517. height: 7px;
  518. background: #2B94F6;
  519. }
  520. .ability .part_4 .part_4_right .left_pic {
  521. position: relative;
  522. margin-top: -30px;
  523. max-width: 540px;
  524. }
  525. .ability .part_4 .part_4_right .left_pic img {
  526. width: 100%;
  527. }
  528. .ability .part_4 .part_4_left {
  529. width: 600px;
  530. background: #EEF6FD;
  531. box-shadow: 2px 2px 10px 2px rgba(133, 141, 215, 0.11);
  532. border-radius: 12px;
  533. margin-top: 84px;
  534. }
  535. .ability .part_4 .part_4_left .left-circle-icon {
  536. position: absolute;
  537. width: 195px;
  538. height: 195px;
  539. left: 402px;
  540. top: -27px;
  541. }
  542. .ability .part_4 .part_4_left ul {
  543. display: flex;
  544. flex-wrap: wrap;
  545. padding: 0px 55px 55px 55px;
  546. justify-content: space-between;
  547. }
  548. .ability .part_4 .part_4_left ul li {
  549. margin-top: 55px;
  550. display: flex;
  551. }
  552. .ability .part_4 .part_4_left ul li .item-icon {
  553. width: 80px;
  554. height: 80px;
  555. flex-shrink: 0;
  556. }
  557. .ability .part_4 .part_4_left ul li .item-icon img {
  558. width: 100%;
  559. height: 100%;
  560. }
  561. .ability .part_4 .part_4_left ul li .item-con {
  562. margin-left: 19px;
  563. }
  564. .ability .part_4 .part_4_left ul li .item-con .item-title {
  565. font-size: 22px;
  566. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  567. font-weight: bold;
  568. color: #051442;
  569. margin-top: -4px;
  570. -webkit-text-stroke: 0px #FFFFFF;
  571. text-stroke: 0px #FFFFFF;
  572. }
  573. .ability .part_4 .part_4_left ul li .item-con .item-des {
  574. font-size: 14px;
  575. font-family: SourceHanSansCN-Regular, SourceHanSansCN;
  576. font-weight: 400;
  577. color: #868993;
  578. line-height: 18px;
  579. text-align: justify;
  580. margin-top: 5px;
  581. text-align-last: left;
  582. text-justify: inter-ideograph;
  583. }
  584. .title-block {
  585. display: flex;
  586. justify-content: center;
  587. }
  588. .title-block .common-title {
  589. display: flex;
  590. flex-direction: column;
  591. justify-content: center;
  592. }
  593. .title-block .common-title .title {
  594. height: 100px;
  595. text-align: center;
  596. }
  597. .title-block .common-title .title.t_1 {
  598. height: 48px;
  599. background: url("../image/62.png") no-repeat center top;
  600. background-size: 332px 48px;
  601. }
  602. .title-block .common-title .title.t_2 {
  603. height: 48px;
  604. background: url("../image/11.png") no-repeat center top;
  605. background-size: 332px 48px;
  606. }
  607. .title-block .common-title .title.t_3 {
  608. height: 48px;
  609. background: url("../image/12.png") no-repeat center top;
  610. background-size: 392px 48px;
  611. }
  612. .title-block .common-title .title.t_4 {
  613. height: 48px;
  614. background: url("../image/13.png") no-repeat center top;
  615. background-size: 190px 48px;
  616. }
  617. .title-block .common-title .title.t_5 {
  618. height: 48px;
  619. background: url("../image/63.png") no-repeat center top;
  620. background-size: 242px 48px;
  621. }
  622. .title-block .common-title .title .title-word {
  623. padding-top: 5px;
  624. height: 35px;
  625. font-size: 36px;
  626. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  627. font-weight: bold;
  628. color: #222B33;
  629. line-height: 48px;
  630. }
  631. .title-block .common-title .title .title-line {
  632. margin: 20px auto 0px auto;
  633. width: 80px;
  634. height: 7px;
  635. background: #2B94F6;
  636. }
  637. .title-block .common-title .title-des {
  638. display: flex;
  639. align-items: center;
  640. height: 56px;
  641. position: relative;
  642. margin-top: 39px;
  643. }
  644. .title-block .common-title .title-des .left-icon {
  645. position: absolute;
  646. left: 0px;
  647. top: 0px;
  648. width: 16px;
  649. height: 15px;
  650. }
  651. .title-block .common-title .title-des .left-icon img {
  652. width: 100%;
  653. height: 100%;
  654. }
  655. .title-block .common-title .title-des .des-word {
  656. padding: 0px 20px;
  657. font-size: 18px;
  658. font-family: SourceHanSansCN-Regular, SourceHanSansCN;
  659. font-weight: 400;
  660. color: #1F2830;
  661. line-height: 28px;
  662. }
  663. .title-block .common-title .title-des .right-icon {
  664. position: absolute;
  665. right: 0px;
  666. bottom: 10px;
  667. width: 16px;
  668. height: 15px;
  669. }
  670. .title-block .common-title .title-des .right-icon img {
  671. width: 100%;
  672. height: 100%;
  673. }
  674. .advantage {
  675. margin-top: 154px;
  676. position: relative;
  677. }
  678. .advantage ul {
  679. display: flex;
  680. width: 100%;
  681. justify-content: space-between;
  682. flex-wrap: wrap;
  683. margin-top: 25px;
  684. }
  685. .advantage ul li {
  686. width: 48%;
  687. background: #FFFFFF;
  688. box-shadow: 2px 2px 10px 2px rgba(133, 181, 215, 0.11);
  689. border-radius: 8px;
  690. justify-content: center;
  691. align-items: center;
  692. display: flex;
  693. flex-direction: column;
  694. padding: 40px 33px;
  695. margin-bottom: 29px;
  696. }
  697. .advantage ul li .item-icon {
  698. width: 200px;
  699. height: 140px;
  700. }
  701. .advantage ul li .item-icon img {
  702. width: 100%;
  703. height: 100%;
  704. }
  705. .advantage ul li .item-title {
  706. margin-top: 15px;
  707. display: flex;
  708. align-items: center;
  709. }
  710. .advantage ul li .item-title .num-icon {
  711. width: 42px;
  712. height: 40px;
  713. }
  714. .advantage ul li .item-title .num-icon img {
  715. width: 100%;
  716. height: 100%;
  717. }
  718. .advantage ul li .item-title .item-con {
  719. display: flex;
  720. flex-direction: column;
  721. margin-left: 20px;
  722. }
  723. .advantage ul li .item-title .item-con .word {
  724. font-size: 24px;
  725. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  726. font-weight: bold;
  727. color: #051442;
  728. line-height: 26px;
  729. -webkit-text-stroke: 0px #FFFFFF;
  730. text-stroke: 0px #FFFFFF;
  731. }
  732. .advantage ul li .item-title .item-con .des {
  733. font-size: 11px;
  734. font-family: FuturaLT;
  735. color: #299FEC;
  736. line-height: 18px;
  737. -webkit-text-stroke: 0px #FFFFFF;
  738. text-stroke: 0px #FFFFFF;
  739. }
  740. .advantage ul li .item-des {
  741. margin-top: 25px;
  742. font-size: 16px;
  743. font-family: SourceHanSansCN-Normal, SourceHanSansCN;
  744. font-weight: 400;
  745. color: #7B7E89;
  746. line-height: 22px;
  747. }
  748. .advantage .circle-icon-r {
  749. position: absolute;
  750. bottom: -95px;
  751. right: 50%;
  752. margin-right: -695px;
  753. z-index: -1;
  754. width: 240px;
  755. height: 240px;
  756. }
  757. .advantage .circle-icon-r img {
  758. width: 100%;
  759. height: 100%;
  760. }
  761. .case {
  762. position: relative;
  763. margin-top: 154px;
  764. }
  765. .case .swiper-case {
  766. position: relative;
  767. }
  768. .case .swiper-case .swiper {
  769. width: 100%;
  770. height: 100%;
  771. margin-top: 58px;
  772. padding: 10px 5px 60px 5px;
  773. }
  774. .case .swiper-case .swiper-slide {
  775. background: #fff;
  776. /* Center slide text vertically */
  777. display: -webkit-box;
  778. display: -ms-flexbox;
  779. display: -webkit-flex;
  780. display: flex;
  781. -webkit-box-pack: center;
  782. -ms-flex-pack: center;
  783. -webkit-justify-content: center;
  784. justify-content: center;
  785. -webkit-box-align: center;
  786. -ms-flex-align: center;
  787. -webkit-align-items: center;
  788. align-items: center;
  789. }
  790. .case .swiper-case .swiper-slide .slide-item {
  791. background: #FFFFFF;
  792. overflow: hidden;
  793. box-shadow: 2px 2px 10px 2px rgba(133, 181, 215, 0.11);
  794. border-radius: 8px;
  795. padding-bottom: 20px;
  796. height: 100%;
  797. }
  798. .case .swiper-case .swiper-slide .slide-item .more{
  799. width: 376.66px;
  800. height: 439px;
  801. display: flex;
  802. align-items: center;
  803. justify-content: center;
  804. }
  805. .case .swiper-case .swiper-slide .slide-item .more a{
  806. color: #2B94F6;
  807. font-size:18px;
  808. }
  809. .case .swiper-case .swiper-slide .slide-item .item-icon {
  810. width: 334px;
  811. height: 252px;
  812. }
  813. .case .swiper-case .swiper-slide .slide-item .item-icon img {
  814. width: 100%;
  815. height: 100%;
  816. }
  817. .case .swiper-case .swiper-slide .slide-item .item-title {
  818. margin-top: 26px;
  819. font-size: 24px;
  820. font-family: SourceHanSansCN-Medium, SourceHanSansCN;
  821. font-weight: 500;
  822. color: #222B33;
  823. line-height: 26px;
  824. border-left: 10px #2B94F6 solid;
  825. padding: 0px 10px;
  826. }
  827. .case .swiper-case .swiper-slide .slide-item .item-title a{
  828. color: #222B33;
  829. }
  830. .case .swiper-case .swiper-slide .slide-item .item-des {
  831. margin-top: 15px;
  832. font-size: 16px;
  833. font-family: SourceHanSansCN-Normal, SourceHanSansCN;
  834. font-weight: 400;
  835. color: #7B7E89;
  836. line-height: 24px;
  837. padding: 0px 15px;
  838. height: 120px;
  839. overflow: hidden;
  840. text-overflow: ellipsis;
  841. display: -webkit-box;
  842. -webkit-line-clamp: 5;
  843. -webkit-box-orient: vertical;
  844. }
  845. .case .swiper-case .swiper-slide .slide-item .item-type {
  846. text-align: right;
  847. font-size: 16px;
  848. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  849. font-weight: bold;
  850. color: #2B94F6;
  851. margin: 0px 20px;
  852. background: url("../image/67.png") no-repeat right bottom;
  853. background-size: 97px 10px;
  854. }
  855. .case .swiper-case .swiper-button-next {
  856. width: 36px;
  857. height: 36px;
  858. right: -60px;
  859. border-radius: 100%;
  860. background: #a4dbff;
  861. }
  862. .case .swiper-case .swiper-button-prev {
  863. width: 36px;
  864. height: 36px;
  865. left: -50px;
  866. border-radius: 100%;
  867. background: #a4dbff;
  868. }
  869. .case .swiper-case .swiper-button-next:after, .case .swiper-case .swiper-button-prev:after {
  870. font-size: 16px !important;
  871. color: #ffffff;
  872. }
  873. .case .swiper-case .swiper-pagination-bullet {
  874. width: 28px;
  875. height: 6px;
  876. border-radius: 4px;
  877. }
  878. .case .swiper-case .swiper-pagination-bullet-active {
  879. background: #019BFF;
  880. }
  881. .case .swiper-case .swiper-slide img {
  882. display: block;
  883. width: 100%;
  884. height: 100%;
  885. object-fit: cover;
  886. }
  887. .case .circle-icon-l {
  888. position: absolute;
  889. bottom: -42px;
  890. left: 50%;
  891. margin-left: -697px;
  892. width: 240px;
  893. height: 240px;
  894. }
  895. .case .circle-icon-l img {
  896. width: 100%;
  897. height: 100%;
  898. }
  899. .customer {
  900. position: relative;
  901. margin-top: 154px;
  902. }
  903. .customer .circle-icon-r {
  904. position: absolute;
  905. top: 95px;
  906. right: 50%;
  907. margin-right: -576px;
  908. z-index: -1;
  909. width: 179px;
  910. height: 179px;
  911. }
  912. .customer .circle-icon-r img {
  913. width: 100%;
  914. height: 100%;
  915. }
  916. .customer ul {
  917. display: flex;
  918. width: 100%;
  919. flex-wrap: wrap;
  920. margin-top: 25px;
  921. }
  922. .customer ul li {
  923. width: 16.6%;
  924. height: auto;
  925. margin-bottom:10px;
  926. }
  927. .customer ul li img {
  928. width: 95%;
  929. height: 100%;
  930. object-fit: contain;
  931. }
  932. .partners {
  933. position: relative;
  934. margin-top: 154px;
  935. padding-bottom:80px;
  936. }
  937. .partners .circle-icon-l {
  938. position: absolute;
  939. top: 104px;
  940. left: 50%;
  941. margin-left: -665px;
  942. width: 179px;
  943. height: 179px;
  944. }
  945. .partners .circle-icon-l img {
  946. width: 100%;
  947. height: 100%;
  948. }
  949. .partners ul {
  950. display: flex;
  951. width: 100%;
  952. flex-wrap: wrap;
  953. margin-top: 40px;
  954. }
  955. .partners ul li {
  956. width: 20%;
  957. /*height: 41px;*/
  958. margin-bottom: 50px;
  959. display: flex;
  960. align-items: center;
  961. }
  962. .partners ul li img {
  963. width: 70%;
  964. height: auto;
  965. object-fit: cover;
  966. }
  967. .slide-des{
  968. position: absolute;
  969. width: 1200px;
  970. left:50%;
  971. padding-left:92px;
  972. padding-right:92px;
  973. transform: translateX(-50%);
  974. }
  975. .slide-des .des-title{
  976. max-width: 600px;
  977. font-size: 40px;
  978. font-family: SourceHanSansCN-Bold, SourceHanSansCN;
  979. font-weight: bold;
  980. color: #FFFFFF;
  981. text-align: left;
  982. line-height: 60px;
  983. text-shadow: 0px 2px 9px rgba(19, 20, 128, 0.23);
  984. }
  985. .slide-des .des-word{
  986. max-width: 700px;
  987. font-size: 20px;
  988. font-family: SourceHanSansCN-Regular, SourceHanSansCN;
  989. font-weight: 400;
  990. color: #FFFFFF;
  991. margin-top:24px;
  992. text-align: left;
  993. line-height: 32px;
  994. text-shadow: 0px 2px 9px rgba(19, 20, 128, 0.5);
  995. }
  996. .slide-des .des-word ul{
  997. margin-left:20px;
  998. }
  999. .slide-des .des-word ul li{
  1000. list-style-type: disc;
  1001. }
  1002. .slide-des.des_2 .des-title{
  1003. color: #0845A4;
  1004. }
  1005. .slide-des.des_2 .des-word{
  1006. color: #0845A4;
  1007. }
  1008. .slide-des .des-zx{
  1009. width: 160px;
  1010. height: 48px;
  1011. margin-top:60px;
  1012. }
  1013. .slide-des .des-zx img{
  1014. width: 100%;
  1015. height: 100%;
  1016. }
  1017. .hx-header-fix.no-bg{
  1018. background: none !important;
  1019. box-shadow: none;
  1020. }
  1021. .hx-header-fix .auto-container .hx-header .hx-menu ul li a.one{
  1022. color:#ffffff;
  1023. }
  1024. .hx-header-fix .auto-container .hx-header .hx-menu ul li a.two{
  1025. color:#8B8B8B;
  1026. }
  1027. .hx-header-fix .auto-container .hx-header .hx-menu ul li a.three{
  1028. color:#ffffff;
  1029. }