富茂链客Pcg官网
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

index.css 27 KiB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521
  1. .concentrationBox {
  2. width: 100%;
  3. margin-top: 80px;
  4. background: linear-gradient(0deg, #071688, #163FC4);
  5. cursor: pointer;
  6. }
  7. h3 {
  8. text-align: center;
  9. height: 228px;
  10. line-height: 228px;
  11. font-size: 54px;
  12. font-family: OPPOSans;
  13. font-weight: bold;
  14. color: #202530;
  15. }
  16. .modeBox {
  17. width: 96%;
  18. margin: 0 auto;
  19. }
  20. .privateBox {
  21. overflow: hidden;
  22. }
  23. .private {
  24. width: 49%;
  25. height: 310px;
  26. margin-right: 1%;
  27. /* background: #0E1542; */
  28. background-image: url('https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/shouye/home_jjfa_img_1.png');
  29. background-repeat: no-repeat;
  30. background-size: 100% 100%;
  31. float: left;
  32. position: relative;
  33. }
  34. .private:hover .goIntegration {
  35. display: block;
  36. margin-top: 88px;
  37. margin-left: 30px;
  38. width: 168px;
  39. height: 50px;
  40. line-height: 50px;
  41. text-align: center;
  42. background: #FFFFFF;
  43. box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.53);
  44. border-radius: 6px;
  45. font-size: 20px;
  46. font-family: OPPOSans;
  47. font-weight: 500;
  48. color: #08188A;
  49. }
  50. .private:hover .privateHie {
  51. display: none;
  52. }
  53. .privateHie {
  54. position: absolute;
  55. width: 100%;
  56. height: 100%;
  57. background-color: rgba(0, 0, 0, 0.3);
  58. top: 0;
  59. left: 0;
  60. display: block;
  61. }
  62. .privateText {
  63. width: 312px;
  64. height: 69px;
  65. font-size: 24px;
  66. font-family: Microsoft YaHei;
  67. font-weight: bold;
  68. color: #FFFFFF;
  69. line-height: 45px;
  70. text-shadow: 0px 2px 0px rgba(0, 0, 0, 0.53);
  71. margin-top: 63px;
  72. margin-left: 30px;
  73. }
  74. .goPrivate {
  75. display: block;
  76. margin-top: 88px;
  77. margin-left: 30px;
  78. width: 168px;
  79. height: 50px;
  80. line-height: 50px;
  81. text-align: center;
  82. background: #FFFFFF;
  83. box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.53);
  84. border-radius: 6px;
  85. font-size: 20px;
  86. font-family: OPPOSans;
  87. font-weight: 500;
  88. color: #08188A;
  89. }
  90. .goDigitization {
  91. display: block;
  92. margin-top: 88px;
  93. margin-left: 30px;
  94. width: 168px;
  95. height: 50px;
  96. line-height: 50px;
  97. text-align: center;
  98. /* box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.53); */
  99. border-radius: 6px;
  100. border: 2px solid #FFFFFF;
  101. font-size: 20px;
  102. font-family: OPPOSans;
  103. font-weight: 500;
  104. color: #ffffff;
  105. border: 2px solid #FFFFFF;
  106. }
  107. .digitization {
  108. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/shouye/home_jjfa_img4_1.png");
  109. background-repeat: no-repeat;
  110. width: 49%;
  111. height: 310px;
  112. float: right;
  113. position: relative;
  114. background-size: 100% 100%;
  115. }
  116. .digitization:hover .goIntegration {
  117. display: block;
  118. margin-top: 88px;
  119. margin-left: 30px;
  120. width: 168px;
  121. height: 50px;
  122. line-height: 50px;
  123. text-align: center;
  124. background: #FFFFFF;
  125. box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.53);
  126. border-radius: 6px;
  127. font-size: 20px;
  128. font-family: OPPOSans;
  129. font-weight: 500;
  130. color: #08188A;
  131. }
  132. .digitization:hover .digitizationHie {
  133. display: none;
  134. }
  135. .digitizationHie {
  136. position: absolute;
  137. width: 100%;
  138. height: 100%;
  139. background-color: rgba(0, 0, 0, 0.3);
  140. top: 0;
  141. left: 0;
  142. display: block;
  143. }
  144. .integrationBox {
  145. margin-top: 30px;
  146. margin-bottom: 102px;
  147. display: flex;
  148. justify-content: space-between;
  149. }
  150. .integrationItem {
  151. position: relative;
  152. width: 32%;
  153. height: 310px;
  154. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/shouye/home_jjfa_img3.png");
  155. background-repeat: no-repeat;
  156. background-size: 100% 100%;
  157. }
  158. .integrationItemHie {
  159. position: absolute;
  160. width: 100%;
  161. height: 100%;
  162. background-color: rgba(0, 0, 0, 0.3);
  163. top: 0;
  164. left: 0;
  165. display: block;
  166. }
  167. .integrationItem:hover .goIntegration {
  168. display: block;
  169. margin-top: 88px;
  170. margin-left: 30px;
  171. width: 168px;
  172. height: 50px;
  173. line-height: 50px;
  174. text-align: center;
  175. background: #FFFFFF;
  176. box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.53);
  177. border-radius: 6px;
  178. font-size: 20px;
  179. font-family: OPPOSans;
  180. font-weight: 500;
  181. color: #08188A;
  182. }
  183. .integrationItem:hover .integrationItemHie {
  184. display: none;
  185. }
  186. .integrationItem2 {
  187. position: relative;
  188. width: 32%;
  189. height: 310px;
  190. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/shouye/home_jjfa_img2_1.png");
  191. background-repeat: no-repeat;
  192. background-size: 100% 100%;
  193. }
  194. .integrationItem2Hie {
  195. position: absolute;
  196. width: 100%;
  197. height: 100%;
  198. background-color: rgba(0, 0, 0, 0.3);
  199. top: 0;
  200. left: 0;
  201. display: block;
  202. }
  203. .integrationItem2:hover .goIntegration {
  204. display: block;
  205. margin-top: 88px;
  206. margin-left: 30px;
  207. width: 168px;
  208. height: 50px;
  209. line-height: 50px;
  210. text-align: center;
  211. background: #FFFFFF;
  212. box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.53);
  213. border-radius: 6px;
  214. font-size: 20px;
  215. font-family: OPPOSans;
  216. font-weight: 500;
  217. color: #08188A;
  218. }
  219. .integrationItem2:hover .integrationItem2Hie {
  220. display: none;
  221. }
  222. .integrationItem3 {
  223. position: relative;
  224. width: 32%;
  225. height: 310px;
  226. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/shouye/home_jjfa_img5_1.png");
  227. background-repeat: no-repeat;
  228. background-size: 100% 100%;
  229. }
  230. .integrationItem3Hie {
  231. position: absolute;
  232. width: 100%;
  233. height: 100%;
  234. background-color: rgba(0, 0, 0, 0.3);
  235. top: 0;
  236. left: 0;
  237. display: block;
  238. }
  239. .integrationItem3:hover .goIntegration {
  240. display: block;
  241. margin-top: 88px;
  242. margin-left: 30px;
  243. width: 168px;
  244. height: 50px;
  245. line-height: 50px;
  246. text-align: center;
  247. background: #FFFFFF;
  248. box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.53);
  249. border-radius: 6px;
  250. font-size: 20px;
  251. font-family: OPPOSans;
  252. font-weight: 500;
  253. color: #08188A;
  254. }
  255. .integrationItem3:hover .integrationItem3Hie {
  256. display: none;
  257. }
  258. .integrationText {
  259. /* width: 287px; */
  260. height: 69px;
  261. font-size: 24px;
  262. font-family: OPPOSans;
  263. font-weight: bold;
  264. color: #FFFFFF;
  265. line-height: 38px;
  266. margin-top: 50px;
  267. margin-left: 30px;
  268. }
  269. .integrationText2 {
  270. /* width: 215px; */
  271. height: 69px;
  272. font-size: 24px;
  273. font-family: OPPOSans;
  274. font-weight: bold;
  275. color: #FFFFFF;
  276. line-height: 38px;
  277. margin-top: 50px;
  278. margin-left: 30px;
  279. }
  280. .integrationText3 {
  281. /* width: 180px; */
  282. height: 69px;
  283. font-size: 24px;
  284. font-family: OPPOSans;
  285. font-weight: bold;
  286. color: #FFFFFF;
  287. line-height: 38px;
  288. margin-top: 50px;
  289. margin-left: 30px;
  290. }
  291. .goIntegration {
  292. display: block;
  293. margin-top: 88px;
  294. margin-left: 30px;
  295. width: 168px;
  296. height: 50px;
  297. line-height: 50px;
  298. text-align: center;
  299. /* box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.53); */
  300. border-radius: 6px;
  301. border: 2px solid #FFFFFF;
  302. font-size: 20px;
  303. font-family: OPPOSans;
  304. font-weight: 500;
  305. color: #ffffff;
  306. border: 2px solid #FFFFFF;
  307. }
  308. .serveBox {
  309. overflow: hidden;
  310. background: #F8FAFF;
  311. }
  312. .title {
  313. text-align: center;
  314. padding-top: 94px;
  315. padding-bottom: 80px;
  316. font-size: 54px;
  317. font-family: OPPOSans;
  318. font-weight: bold;
  319. color: #202530;
  320. }
  321. .textBox {
  322. width: 1200px;
  323. margin: 0 auto;
  324. }
  325. .itemBox4 {
  326. border-bottom: #E3E4FF 1px dotted;
  327. display: flex;
  328. justify-content: center;
  329. }
  330. .itemImgBox1 {
  331. width: 25%;
  332. cursor: pointer;
  333. }
  334. .itemImgBox1 .img {
  335. width: 40px;
  336. height: 40px;
  337. /* background: cadetblue; */
  338. display: block;
  339. margin: 0 auto
  340. }
  341. .itemImgBox2 {
  342. width: 25%;
  343. cursor: pointer;
  344. }
  345. .itemImgBox2 .img {
  346. width: 40px;
  347. height: 40px;
  348. /* background: cadetblue; */
  349. display: block;
  350. margin: 0 auto
  351. }
  352. .itemImgBox3 {
  353. width: 25%;
  354. cursor: pointer;
  355. }
  356. .itemImgBox3 .img {
  357. width: 40px;
  358. height: 40px;
  359. /* background: cadetblue; */
  360. display: block;
  361. margin: 0 auto
  362. }
  363. .itemImgBox4 {
  364. width: 25%;
  365. cursor: pointer;
  366. }
  367. .itemImgBox4 .img {
  368. width: 40px;
  369. height: 40px;
  370. /* background: cadetblue; */
  371. display: block;
  372. margin: 0 auto
  373. }
  374. .imgText {
  375. font-size: 24px;
  376. font-family: OPPOSans;
  377. font-weight: 400;
  378. color: #202530;
  379. text-align: center;
  380. margin-top: 17px;
  381. }
  382. .activity1 {
  383. width: 68px;
  384. height: 8px;
  385. background: #0067ED;
  386. border-radius: 4px;
  387. /* text-align: center; */
  388. margin: 10px auto;
  389. }
  390. .activity2 {
  391. width: 68px;
  392. height: 8px;
  393. background: #0067ED;
  394. border-radius: 4px;
  395. /* text-align: center; */
  396. margin: 10px auto;
  397. display: none;
  398. }
  399. .activity3 {
  400. width: 68px;
  401. height: 8px;
  402. background: #0067ED;
  403. border-radius: 4px;
  404. /* text-align: center; */
  405. margin: 10px auto;
  406. display: none;
  407. }
  408. .activity4 {
  409. width: 68px;
  410. height: 8px;
  411. background: #0067ED;
  412. border-radius: 4px;
  413. /* text-align: center; */
  414. margin: 10px auto;
  415. display: none;
  416. }
  417. .explainBox1 {
  418. overflow: hidden;
  419. margin-top: 150px;
  420. position: relative;
  421. }
  422. .explainBox2 {
  423. overflow: hidden;
  424. margin-top: 150px;
  425. position: relative;
  426. display: none
  427. }
  428. .explainBox3 {
  429. overflow: hidden;
  430. margin-top: 150px;
  431. position: relative;
  432. display: none
  433. }
  434. .explainBox4 {
  435. overflow: hidden;
  436. margin-top: 150px;
  437. position: relative;
  438. display: none
  439. }
  440. .explainImg {
  441. position: absolute;
  442. left: 0;
  443. top: 0;
  444. }
  445. .explainTextBox {
  446. float: left;
  447. width: 510px;
  448. margin-left: 16px;
  449. margin-top: 4px;
  450. }
  451. .explainH3 {
  452. font-size: 36px;
  453. font-family: OPPOSans;
  454. font-weight: 500;
  455. color: #131D2E;
  456. line-height: 54px;
  457. }
  458. .explainP {
  459. width: 510px;
  460. height: 78px;
  461. font-size: 18px;
  462. font-family: Microsoft YaHei;
  463. font-weight: 400;
  464. color: #737780;
  465. line-height: 30px;
  466. margin-top: 35px;
  467. }
  468. .explainText {
  469. margin-top: 10px;
  470. font-size: 36px;
  471. font-family: OPPOSans;
  472. font-weight: 500;
  473. color: #131D2E;
  474. line-height: 54px;
  475. }
  476. .explainImgBox {
  477. float: right;
  478. width: 599px;
  479. height: 400px;
  480. }
  481. .partner {
  482. font-size: 54px;
  483. font-family: OPPOSans;
  484. font-weight: bold;
  485. color: #202530;
  486. text-align: center;
  487. margin-top: 80px;
  488. margin-bottom: 60px;
  489. }
  490. .partnerLogo {
  491. height: 79px;
  492. /* background-color: chartreuse; */
  493. display: block;
  494. margin: 0 auto;
  495. }
  496. .partnerLogoBox {
  497. width: 100%;
  498. height: 79px;
  499. margin-bottom: 74px;
  500. background-color: #ffffff;
  501. overflow: hidden;
  502. }
  503. .caseBox {
  504. overflow: hidden;
  505. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/all/home_jxal_bnt.png");
  506. background-repeat: no-repeat;
  507. }
  508. .caseText {
  509. padding-top: 74px;
  510. padding-bottom: 84px;
  511. text-align: center;
  512. font-size: 54px;
  513. font-family: OPPOSans;
  514. font-weight: bold;
  515. color: #202530;
  516. }
  517. .caseLogoBox {
  518. width: 1500px;
  519. margin: 0 auto;
  520. display: flex;
  521. justify-content: space-between;
  522. margin-bottom: 104px;
  523. }
  524. .caseLogo1 {
  525. width: 443px;
  526. height: 415px;
  527. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/shouye/home_jxal_jmh.png");
  528. background-repeat: no-repeat;
  529. border-radius: 10px;
  530. position: relative;
  531. }
  532. .jinbaoBoxA1 {
  533. position: absolute;
  534. left: 30px;
  535. top: 240px;
  536. overflow: hidden;
  537. margin: 0 auto;
  538. }
  539. .jinbaoBoxA2 {
  540. position: absolute;
  541. left: 30px;
  542. top: 240px;
  543. overflow: hidden;
  544. display: none;
  545. }
  546. .jinbaoBoxA3 {
  547. position: absolute;
  548. left: 30px;
  549. top: 240px;
  550. overflow: hidden;
  551. display: none;
  552. }
  553. .jinbaoBoxA4 {
  554. position: absolute;
  555. left: 30px;
  556. top: 240px;
  557. overflow: hidden;
  558. display: none;
  559. }
  560. .jinbaoBoxA5 {
  561. position: absolute;
  562. left: 30px;
  563. top: 240px;
  564. overflow: hidden;
  565. display: none;
  566. }
  567. .jinbaoF {
  568. float: left;
  569. width: 210px;
  570. }
  571. .jinbaoText {
  572. font-size: 24px;
  573. font-family: OPPOSans;
  574. font-weight: bold;
  575. color: #FFFFFF;
  576. margin-bottom: 16px;
  577. }
  578. .jinbaop {
  579. font-size: 14px;
  580. font-family: Microsoft YaHei;
  581. font-weight: 400;
  582. color: #FDFEFF;
  583. overflow: hidden;
  584. text-overflow: ellipsis;
  585. height: 96px;
  586. display: -webkit-box;
  587. -webkit-box-orient: vertical;
  588. -webkit-line-clamp: 5;
  589. }
  590. .jinbaoR {
  591. float: right;
  592. margin-left: 46px;
  593. width: 130px;
  594. }
  595. .rqCode {
  596. width: 130px;
  597. height: 130px;
  598. margin-bottom: 10px;
  599. background-color: #ffffff;
  600. border-radius: 50%;
  601. }
  602. .rqText {
  603. font-size: 14px;
  604. font-family: Microsoft YaHei;
  605. font-weight: 400;
  606. color: #A5A9B4;
  607. }
  608. .caseLogo2 {
  609. width: 222px;
  610. height: 415px;
  611. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/all/home_jxal_hlc.png");
  612. background-repeat: no-repeat;
  613. border-radius: 10px;
  614. position: relative;
  615. /* width: 222px;
  616. height: 415px;
  617. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/shouye/home_jxal_hlc1.png");
  618. background-repeat: no-repeat;
  619. border-radius: 10px;
  620. position: relative; */
  621. }
  622. .logoBox1 {
  623. width: 100%;
  624. position: absolute;
  625. display: none;
  626. /* left: 40px; */
  627. top: 330px;
  628. }
  629. .logoBox2 {
  630. width: 100%;
  631. position: absolute;
  632. /* left: 40px; */
  633. top: 330px;
  634. }
  635. .logoBox3 {
  636. width: 100%;
  637. position: absolute;
  638. /* left: 40px; */
  639. top: 330px;
  640. }
  641. .logoBox4 {
  642. width: 100%;
  643. position: absolute;
  644. /* left: 40px; */
  645. top: 330px;
  646. }
  647. .logoBox5 {
  648. width: 100%;
  649. position: absolute;
  650. /* left: 40px; */
  651. top: 330px;
  652. }
  653. .LOGO {
  654. text-align: center;
  655. font-size: 30px;
  656. font-family: OPPOSans;
  657. font-weight: 800;
  658. color: #FDFEFF;
  659. margin-bottom: 10px;
  660. }
  661. .name {
  662. font-size: 16px;
  663. font-family: Microsoft YaHei;
  664. font-weight: 400;
  665. color: #FDFEFF;
  666. text-align: center;
  667. margin-top: 40px;
  668. }
  669. .caseLogo3 {
  670. width: 222px;
  671. height: 415px;
  672. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/all/home_jxal_hzdz.png");
  673. background-repeat: no-repeat;
  674. border-radius: 10px;
  675. position: relative;
  676. }
  677. .caseLogo4 {
  678. width: 222px;
  679. height: 415px;
  680. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/all/home_jxal_wxgc.png");
  681. background-repeat: no-repeat;
  682. border-radius: 10px;
  683. position: relative;
  684. }
  685. .caseLogo5 {
  686. width: 222px;
  687. height: 415px;
  688. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/jinpeng-1.png");
  689. background-repeat: no-repeat;
  690. border-radius: 10px;
  691. position: relative;
  692. }
  693. .aboutUt {
  694. background-color: #Fff;
  695. overflow: hidden;
  696. position: relative;
  697. }
  698. .aboutTextBoxw {
  699. margin-top: 142px;
  700. margin-left: 10%;
  701. background-image: url("https://formall.oss-accelerate.aliyuncs.com/home/pc/fmPcImg/shouye/home_gywm_qq.png");
  702. background-repeat: no-repeat;
  703. }
  704. .aboutTextBox {
  705. margin-top: 172px;
  706. margin-left: 10%;
  707. overflow: hidden;
  708. }
  709. .bgImg {
  710. position: absolute;
  711. top: 13%;
  712. left: 38%;
  713. }
  714. .aboutTitle {
  715. width: 340px;
  716. font-size: 56px;
  717. font-family: OPPOSans;
  718. font-weight: 500;
  719. color: #131D2E;
  720. padding-top: 30px;
  721. }
  722. .xian {
  723. width: 340px;
  724. height: 4px;
  725. background: #E3E8EF;
  726. position: relative;
  727. margin-bottom: 54px;
  728. margin-top: 35px;
  729. }
  730. .zixian {
  731. position: absolute;
  732. top: 0;
  733. right: 0;
  734. width: 147px;
  735. height: 4px;
  736. background: #0067ED;
  737. }
  738. .aboutText1 {
  739. margin-top: 54px;
  740. font-size: 18px;
  741. font-family: Microsoft YaHei;
  742. font-weight: 400;
  743. color: #666F80;
  744. width: 464px;
  745. line-height: 36px;
  746. margin-bottom: 20px;
  747. }
  748. .aboutText2 {
  749. margin-top: 54px;
  750. font-size: 18px;
  751. font-family: Microsoft YaHei;
  752. font-weight: 400;
  753. color: #666F80;
  754. width: 464px;
  755. line-height: 36px;
  756. margin-bottom: 218px;
  757. }
  758. .select {
  759. background: #F8FAFF;
  760. overflow: hidden;
  761. }
  762. .companyLogoBox {
  763. overflow: hidden;
  764. position: relative;
  765. width: 1200px;
  766. height: 1000px;
  767. margin: 120px auto 0 auto;
  768. }
  769. .companyLogo1 {
  770. width: 142px;
  771. height: 142px;
  772. background: #FFFFFF;
  773. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  774. border-radius: 8px;
  775. position: absolute;
  776. top: 21%;
  777. left: 0%;
  778. }
  779. .companyLogo1 img {
  780. width: 100%;
  781. height: 100%;
  782. position: absolute;
  783. top: 50%;
  784. left: 50%;
  785. transform: translate(-50%, -50%);
  786. }
  787. .companyLogo8 {
  788. width: 142px;
  789. height: 142px;
  790. background: #FFFFFF;
  791. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  792. border-radius: 8px;
  793. position: absolute;
  794. top: 39%;
  795. left: 0%;
  796. }
  797. .companyLogo8 img {
  798. width: 90%;
  799. height: 85%;
  800. position: absolute;
  801. top: 50%;
  802. left: 50%;
  803. transform: translate(-50%, -50%);
  804. }
  805. .companyLogo15 {
  806. width: 142px;
  807. height: 142px;
  808. background: #FFFFFF;
  809. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  810. border-radius: 8px;
  811. position: absolute;
  812. top: 57%;
  813. left: 0%;
  814. }
  815. .companyLogo15 img {
  816. width: 90%;
  817. height: 90%;
  818. position: absolute;
  819. top: 50%;
  820. left: 50%;
  821. transform: translate(-50%, -50%);
  822. }
  823. .companyLogo22 {
  824. width: 142px;
  825. height: 142px;
  826. background: #FFFFFF;
  827. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  828. border-radius: 8px;
  829. position: absolute;
  830. top: 66%;
  831. left: 0%;
  832. }
  833. .companyLogo22 img {
  834. width: 100%;
  835. height: 100%;
  836. position: absolute;
  837. top: 50%;
  838. left: 50%;
  839. transform: translate(-50%, -50%);
  840. }
  841. .companyLogo2 {
  842. width: 142px;
  843. height: 142px;
  844. background: #FFFFFF;
  845. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  846. border-radius: 8px;
  847. position: absolute;
  848. top: 14%;
  849. left: 14%;
  850. text-align: center;
  851. }
  852. .companyLogo2 img {
  853. width: 90%;
  854. height: 57%;
  855. /* margin: auto 0; */
  856. display: block;
  857. position: absolute;
  858. top: 50%;
  859. left: 50%;
  860. transform: translate(-50%, -50%);
  861. }
  862. .companyLogo9 {
  863. width: 142px;
  864. height: 142px;
  865. background: #FFFFFF;
  866. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  867. border-radius: 8px;
  868. position: absolute;
  869. top: 32%;
  870. left: 14%;
  871. }
  872. .companyLogo9 img {
  873. width: 90%;
  874. height: 90%;
  875. position: absolute;
  876. top: 50%;
  877. left: 50%;
  878. transform: translate(-50%, -50%);
  879. }
  880. .companyLogo16 {
  881. width: 142px;
  882. height: 142px;
  883. background: #FFFFFF;
  884. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  885. border-radius: 8px;
  886. position: absolute;
  887. top: 50%;
  888. left: 14%;
  889. }
  890. .companyLogo16 img {
  891. width: 90%;
  892. height: 80%;
  893. position: absolute;
  894. top: 50%;
  895. left: 50%;
  896. transform: translate(-50%, -50%);
  897. }
  898. .companyLogo23 {
  899. width: 142px;
  900. height: 142px;
  901. background: #FFFFFF;
  902. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  903. border-radius: 8px;
  904. position: absolute;
  905. top: 68%;
  906. left: 14%;
  907. }
  908. .companyLogo23 img {
  909. width: 90%;
  910. height: 70%;
  911. position: absolute;
  912. top: 50%;
  913. left: 50%;
  914. transform: translate(-50%, -50%);
  915. }
  916. .companyLogo3 {
  917. width: 142px;
  918. height: 142px;
  919. background: #FFFFFF;
  920. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  921. border-radius: 8px;
  922. position: absolute;
  923. top: 7%;
  924. left: 29%;
  925. }
  926. .companyLogo3 img {
  927. width: 100%;
  928. height: 100%;
  929. position: absolute;
  930. top: 50%;
  931. left: 50%;
  932. transform: translate(-50%, -50%);
  933. }
  934. .companyLogo10 {
  935. width: 142px;
  936. height: 142px;
  937. background: #FFFFFF;
  938. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  939. border-radius: 8px;
  940. position: absolute;
  941. top: 25%;
  942. left: 29%;
  943. }
  944. .companyLogo10 img {
  945. width: 100%;
  946. height: 100%;
  947. position: absolute;
  948. top: 50%;
  949. left: 50%;
  950. transform: translate(-50%, -50%);
  951. }
  952. .companyLogo17 {
  953. width: 142px;
  954. height: 142px;
  955. background: #FFFFFF;
  956. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  957. border-radius: 8px;
  958. position: absolute;
  959. top: 43%;
  960. left: 29%;
  961. }
  962. .companyLogo17 img {
  963. width: 100%;
  964. height: 100%;
  965. position: absolute;
  966. top: 50%;
  967. left: 50%;
  968. transform: translate(-50%, -50%);
  969. }
  970. .companyLogo24 {
  971. width: 142px;
  972. height: 142px;
  973. background: #FFFFFF;
  974. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  975. border-radius: 8px;
  976. position: absolute;
  977. top: 61%;
  978. left: 29%;
  979. }
  980. .companyLogo24 img {
  981. width: 93%;
  982. height: 28%;
  983. position: absolute;
  984. top: 50%;
  985. left: 50%;
  986. transform: translate(-50%, -50%);
  987. }
  988. .companyLogo4 {
  989. width: 142px;
  990. height: 142px;
  991. background: #FFFFFF;
  992. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  993. border-radius: 8px;
  994. position: absolute;
  995. top: 0%;
  996. left: 44%;
  997. }
  998. .companyLogo4 img {
  999. width: 100%;
  1000. height: 40%;
  1001. position: absolute;
  1002. top: 50%;
  1003. left: 50%;
  1004. transform: translate(-50%, -50%);
  1005. }
  1006. .companyLogo11 {
  1007. width: 142px;
  1008. height: 142px;
  1009. background: #FFFFFF;
  1010. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1011. border-radius: 8px;
  1012. position: absolute;
  1013. top: 18%;
  1014. left: 44%;
  1015. }
  1016. .companyLogo11 img {
  1017. width: 90%;
  1018. height: 90%;
  1019. position: absolute;
  1020. top: 50%;
  1021. left: 50%;
  1022. transform: translate(-50%, -50%);
  1023. }
  1024. .companyLogo18 {
  1025. width: 142px;
  1026. height: 142px;
  1027. background: #FFFFFF;
  1028. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1029. border-radius: 8px;
  1030. position: absolute;
  1031. top: 36%;
  1032. left: 44%;
  1033. }
  1034. .companyLogo18 img {
  1035. width: 100%;
  1036. height: 100%;
  1037. position: absolute;
  1038. top: 50%;
  1039. left: 50%;
  1040. transform: translate(-50%, -50%);
  1041. }
  1042. .companyLogo25 {
  1043. width: 142px;
  1044. height: 142px;
  1045. background: #FFFFFF;
  1046. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1047. border-radius: 8px;
  1048. position: absolute;
  1049. top: 54%;
  1050. left: 44%;
  1051. }
  1052. .companyLogo25 img {
  1053. width: 100%;
  1054. height: 100%;
  1055. position: absolute;
  1056. top: 50%;
  1057. left: 50%;
  1058. transform: translate(-50%, -50%);
  1059. }
  1060. .companyLogo26 {
  1061. width: 142px;
  1062. height: 142px;
  1063. background: #FFFFFF;
  1064. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1065. border-radius: 8px;
  1066. position: absolute;
  1067. top: 72%;
  1068. left: 44%;
  1069. }
  1070. .companyLogo26 img {
  1071. width: 90%;
  1072. height: 51%;
  1073. position: absolute;
  1074. top: 50%;
  1075. left: 50%;
  1076. transform: translate(-50%, -50%);
  1077. }
  1078. .companyLogo5 {
  1079. width: 142px;
  1080. height: 142px;
  1081. background: #FFFFFF;
  1082. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1083. border-radius: 8px;
  1084. position: absolute;
  1085. top: 8%;
  1086. left: 59%;
  1087. }
  1088. .companyLogo5 img {
  1089. width: 100%;
  1090. height: 55%;
  1091. position: absolute;
  1092. top: 50%;
  1093. left: 50%;
  1094. transform: translate(-50%, -50%);
  1095. }
  1096. .companyLogo12 {
  1097. width: 142px;
  1098. height: 142px;
  1099. background: #FFFFFF;
  1100. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1101. border-radius: 8px;
  1102. position: absolute;
  1103. top: 26%;
  1104. left: 59%;
  1105. }
  1106. .companyLogo12 img {
  1107. width: 90%;
  1108. height: 50%;
  1109. position: absolute;
  1110. top: 50%;
  1111. left: 50%;
  1112. transform: translate(-50%, -50%);
  1113. }
  1114. .companyLogo19 {
  1115. width: 142px;
  1116. height: 142px;
  1117. background: #FFFFFF;
  1118. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1119. border-radius: 8px;
  1120. position: absolute;
  1121. top: 44%;
  1122. left: 59%;
  1123. }
  1124. .companyLogo19 img {
  1125. width: 100%;
  1126. height: 100%;
  1127. position: absolute;
  1128. top: 50%;
  1129. left: 50%;
  1130. transform: translate(-50%, -50%);
  1131. }
  1132. .companyLogo27 {
  1133. width: 142px;
  1134. height: 142px;
  1135. background: #FFFFFF;
  1136. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1137. border-radius: 8px;
  1138. position: absolute;
  1139. top: 62%;
  1140. left: 59%;
  1141. }
  1142. .companyLogo27 img {
  1143. width: 90%;
  1144. height: 90%;
  1145. position: absolute;
  1146. top: 50%;
  1147. left: 50%;
  1148. transform: translate(-50%, -50%);
  1149. }
  1150. .companyLogo6 {
  1151. width: 142px;
  1152. height: 142px;
  1153. background: #FFFFFF;
  1154. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1155. border-radius: 8px;
  1156. position: absolute;
  1157. top: 2%;
  1158. left: 74%;
  1159. }
  1160. .companyLogo6 img {
  1161. width: 100%;
  1162. height: 100%;
  1163. position: absolute;
  1164. top: 50%;
  1165. left: 50%;
  1166. transform: translate(-50%, -50%);
  1167. }
  1168. .companyLogo13 {
  1169. width: 142px;
  1170. height: 142px;
  1171. background: #FFFFFF;
  1172. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1173. border-radius: 8px;
  1174. position: absolute;
  1175. top: 20%;
  1176. left: 74%;
  1177. }
  1178. .companyLogo13 img {
  1179. width: 100%;
  1180. height: 100%;
  1181. position: absolute;
  1182. top: 50%;
  1183. left: 50%;
  1184. transform: translate(-50%, -50%);
  1185. }
  1186. .companyLogo20 {
  1187. width: 142px;
  1188. height: 142px;
  1189. background: #FFFFFF;
  1190. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1191. border-radius: 8px;
  1192. position: absolute;
  1193. top: 38%;
  1194. left: 74%;
  1195. }
  1196. .companyLogo20 img {
  1197. width: 100%;
  1198. height: 100%;
  1199. position: absolute;
  1200. top: 50%;
  1201. left: 50%;
  1202. transform: translate(-50%, -50%);
  1203. }
  1204. .companyLogo28 {
  1205. width: 142px;
  1206. height: 142px;
  1207. background: #FFFFFF;
  1208. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1209. border-radius: 8px;
  1210. position: absolute;
  1211. top: 56%;
  1212. left: 74%;
  1213. }
  1214. .companyLogo28 img {
  1215. width: 90%;
  1216. height: 80%;
  1217. position: absolute;
  1218. top: 50%;
  1219. left: 50%;
  1220. transform: translate(-50%, -50%);
  1221. }
  1222. .companyLogo7 {
  1223. width: 142px;
  1224. height: 142px;
  1225. background: #FFFFFF;
  1226. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1227. border-radius: 8px;
  1228. position: absolute;
  1229. top: 19%;
  1230. right: 0;
  1231. }
  1232. .companyLogo7 img {
  1233. width: 100%;
  1234. height: 80%;
  1235. position: absolute;
  1236. top: 50%;
  1237. left: 50%;
  1238. transform: translate(-50%, -50%);
  1239. }
  1240. .companyLogo14 {
  1241. width: 142px;
  1242. height: 142px;
  1243. background: #FFFFFF;
  1244. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1245. border-radius: 8px;
  1246. position: absolute;
  1247. top: 37%;
  1248. right: 0;
  1249. }
  1250. .companyLogo14 img {
  1251. width: 90%;
  1252. height: 40%;
  1253. position: absolute;
  1254. top: 50%;
  1255. left: 50%;
  1256. transform: translate(-50%, -50%);
  1257. }
  1258. .companyLogo21 {
  1259. width: 142px;
  1260. height: 142px;
  1261. background: #FFFFFF;
  1262. box-shadow: 0px 5px 15px 0px rgba(159, 169, 193, 0.16);
  1263. border-radius: 8px;
  1264. position: absolute;
  1265. top: 55%;
  1266. right: 0;
  1267. }
  1268. .companyLogo21 img {
  1269. width: 90%;
  1270. height: 80%;
  1271. position: absolute;
  1272. top: 50%;
  1273. left: 50%;
  1274. transform: translate(-50%, -50%);
  1275. }
  1276. .selectTitle {
  1277. width: 100%;
  1278. font-size: 54px;
  1279. font-family: OPPOSans;
  1280. font-weight: bold;
  1281. color: #202530;
  1282. margin: 86px 0 0 0;
  1283. text-align: center;
  1284. }
  1285. .selectImg {
  1286. width: 100%;
  1287. height: 100%;
  1288. margin: 0 auto;
  1289. display: block;
  1290. }
  1291. /**/
  1292. .headerBox {
  1293. width: 100%;
  1294. height: 80px;
  1295. background: #FFFFFF;
  1296. overflow: hidden;
  1297. position: fixed;
  1298. top: 0;
  1299. left: 0;
  1300. z-index: 10000;
  1301. }
  1302. .imgBox {
  1303. float: left;
  1304. margin-left: 40px;
  1305. margin-top: 17px;
  1306. width: 158px;
  1307. height: 45px;
  1308. }
  1309. .contenBox {
  1310. float: left;
  1311. margin-left: 10%;
  1312. margin-top: 32px;
  1313. overflow: hidden;
  1314. }
  1315. .item {
  1316. font-size: 16px;
  1317. font-family: Microsoft YaHei;
  1318. font-weight: 400;
  1319. color: #333333;
  1320. /* line-height: 16px; */
  1321. float: left;
  1322. cursor: pointer;
  1323. margin-right: 80px;
  1324. padding: 4px 0;
  1325. }
  1326. .goBox {
  1327. overflow: hidden;
  1328. float: right;
  1329. margin-top: 22px;
  1330. margin-right: 2%;
  1331. }
  1332. .zx {
  1333. width: 108px;
  1334. height: 36px;
  1335. background: #FF4800;
  1336. border-radius: 6px;
  1337. float: left;
  1338. margin-right: 14px;
  1339. font-size: 16px;
  1340. font-family: Microsoft YaHei;
  1341. font-weight: 400;
  1342. color: #FFFFFF;
  1343. line-height: 36px;
  1344. text-align: center;
  1345. cursor: pointer;
  1346. }
  1347. .goA {
  1348. width: 78px;
  1349. height: 36px;
  1350. background: #0067ED;
  1351. border-radius: 6px;
  1352. float: left;
  1353. font-size: 16px;
  1354. font-family: Microsoft YaHei;
  1355. font-weight: 400;
  1356. color: #FFFFFF;
  1357. line-height: 36px;
  1358. text-align: center;
  1359. }