projeck.css 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881
  1. button,
  2. input {
  3. outline: none;
  4. }
  5. .api_layout {
  6. width: 100%;
  7. position: relative;
  8. }
  9. .hide {
  10. display: none;
  11. }
  12. .show {
  13. display: block;
  14. }
  15. .age_list a {
  16. display: block;
  17. }
  18. .api_swiper_wrap {
  19. width: 100%;
  20. padding: 10px 15px 0 15px ;
  21. }
  22. .api_swiper_wrap .swiper-pagination-fraction {
  23. width: 15%;
  24. left: inherit;
  25. right: 10px;
  26. bottom: 6px;
  27. color: #fff;
  28. z-index: 1001;
  29. }
  30. .age_list img {
  31. width: 100%;
  32. height: 185px;
  33. display: block;
  34. object-fit: cover;
  35. }
  36. .api_duty {
  37. border-bottom: 1px solid #ebebeb;
  38. }
  39. .api_title {
  40. font-size: 18px;
  41. margin: 15px 0 0 0;
  42. padding: 0 20px 0 55px;
  43. position: relative;
  44. color: #121212;
  45. }
  46. .api_title .News_icon {
  47. width: 25px;
  48. height: 25px;
  49. position: absolute;
  50. top: 0;
  51. left: 20px;
  52. background: url("../image/newsIcon.png") no-repeat;
  53. background-size: cover;
  54. }
  55. .api_title img {
  56. height: 25px;
  57. position: absolute;
  58. top: 0;
  59. left: 20px;
  60. }
  61. .api_list {
  62. font-size: 15px;
  63. color: #6c6f74;
  64. padding: 0 20px;
  65. margin-bottom: 13px;
  66. }
  67. .api_list li {
  68. overflow: hidden;
  69. text-overflow: ellipsis;
  70. white-space: normal;
  71. }
  72. .api_more {
  73. font-size: 14px;
  74. color: #6c6f74;
  75. position: absolute;
  76. top: 3px;
  77. right: 20px;
  78. font-weight: normal;
  79. }
  80. .api_newsList {
  81. position: relative;
  82. margin-top: 3px;
  83. padding: 0 20px;
  84. font-size: 16px;
  85. }
  86. .api_newsList li {
  87. display: flex;
  88. justify-content: flex-start;
  89. display: -webkit-flex;
  90. -webkit-justify-content: flex-start;
  91. align-items: center;
  92. padding: 10px 0;
  93. position: relative;
  94. }
  95. .api_newsList li:after {
  96. content: '';
  97. display: table;
  98. position: absolute;
  99. bottom: 0;
  100. left: 0;
  101. width: 100%;
  102. height: 1px;
  103. background: #f5f7f8;
  104. }
  105. .api_newsList li p {
  106. color: #121212;
  107. font-size: 14px;
  108. }
  109. .api_newsList li img {
  110. width: 90px;
  111. height: 50px;
  112. margin-right: 11px;
  113. object-fit: cover;
  114. }
  115. .api_news_content {
  116. padding-right: 20px;
  117. overflow: hidden;
  118. text-overflow: ellipsis;
  119. white-space: nowrap;
  120. }
  121. .api_newsList_item {
  122. position: relative;
  123. height: 34px;
  124. line-height: 34px;
  125. border-bottom: 1px solid #ebebeb;
  126. font-size: 13px;
  127. }
  128. .api_news_more {
  129. position: absolute;
  130. top: 12px;
  131. right: 0;
  132. width: 10px;
  133. height: 10px;
  134. background: url("../image/more.png") no-repeat;
  135. background-size: cover;
  136. }
  137. .api_line {
  138. background: #ecf0f1;
  139. height: 2px;
  140. }
  141. .api_h2 {
  142. text-align: center;
  143. color: #9b9b9b;
  144. font-weight: normal;
  145. margin-top: 13px;
  146. font-size: 16px;
  147. }
  148. .api_office {
  149. border-bottom: 1px solid #ebebeb;
  150. }
  151. .api_office:last-child {
  152. padding-bottom: 30px;
  153. }
  154. .api_row {
  155. width: 100%;
  156. padding: 0 20px;
  157. display: flex;
  158. display: -webkit-flex;
  159. -webkit-justify-content: space-between;
  160. justify-content: space-between;
  161. flex-wrap: nowrap;
  162. -webkit-flex-wrap: nowrap;
  163. }
  164. .api_col {
  165. font-size: 12px;
  166. display: inline-block;
  167. height: 42px;
  168. line-height: 42px;
  169. text-align: center;
  170. color: #009fe8;
  171. border: 1px solid #009fe8;
  172. border-radius: 10px;
  173. width: 24%;
  174. }
  175. #api_grid img {
  176. width: 45px;
  177. height: 45px;
  178. position: relative;
  179. margin: auto;
  180. margin-bottom: 10px;
  181. }
  182. .api_page span {
  183. color: #fff !important;
  184. }
  185. .api_page_text {
  186. position: absolute;
  187. width: 100%;
  188. bottom: 6px;
  189. left: 0;
  190. z-index: 1000;
  191. }
  192. .api_banner_info {
  193. font-size: 14px;
  194. width: 75%;
  195. height: 24px;
  196. padding-left: 5px;
  197. line-height: 24px;
  198. color: #fff;
  199. overflow: hidden;
  200. text-overflow: ellipsis;
  201. white-space: nowrap;
  202. }
  203. .header-login {
  204. width: 100%;
  205. height: 50px !important;
  206. background-color: #009fe8;
  207. text-align: center;
  208. position: relative;
  209. }
  210. .backBtn {
  211. position: absolute;
  212. height: 30px;
  213. left: 0;
  214. margin-top: 10px;
  215. margin-left: 15px;
  216. z-index: 1000;
  217. }
  218. .api_text {
  219. height: 50px;
  220. line-height: 50px;
  221. margin: 0;
  222. font-size: 18px;
  223. color: #fff;
  224. width: 70%;
  225. margin: auto;
  226. }
  227. .api_title_text {
  228. height: 45px;
  229. line-height: 45px;
  230. width: 100%;
  231. box-sizing: border-box;
  232. color: #afb6c3;
  233. font-size: 13px;
  234. background: #f3f6fa;
  235. padding-left: 15px;
  236. }
  237. .api_mail_items {
  238. width: 100%;
  239. box-sizing: border-box;
  240. padding: 18px 24px 0 24px;
  241. display: flex;
  242. display: -webkit-flex;
  243. -webkit-justify-content: space-between;
  244. justify-content: space-between;
  245. flex-wrap: wrap;
  246. }
  247. .api_mail_items .api_mail_item {
  248. box-sizing: border-box;
  249. border: 1px solid #ebebeb;
  250. width: 145px;
  251. padding: 15px 3px 10px 18px;
  252. border-radius: 5px;
  253. margin-bottom: 25px;
  254. position: relative;
  255. }
  256. .api_mail_items .api_mail_item .api_mail_logo {
  257. width: 50px;
  258. height: 50px;
  259. margin-bottom: 6px;
  260. border-radius: 50%;
  261. }
  262. .api_mail_items .api_mail_item .api_more01 {
  263. position: absolute;
  264. top: 3px;
  265. right: 3px;
  266. width: 22px;
  267. height: 30px;
  268. }
  269. .api_mail_items .api_mail_item p {
  270. margin-bottom: 15px;
  271. font-size: 12px;
  272. }
  273. .api_mail_items .api_mail_item p span {
  274. font-size: 12px;
  275. color: #97a3b4;
  276. }
  277. .api_mail_items .api_mail_item .api_mail_details {
  278. font-size: 12px;
  279. color: #009fe8;
  280. }
  281. .api_personal_header {
  282. background: #009fe8;
  283. width: 100%;
  284. text-align: center;
  285. padding: 20px 0;
  286. border-top: 1px solid #37b0e9;
  287. }
  288. .api_personal_header .api_header_img {
  289. width: 100px;
  290. height: 100px;
  291. border-radius: 50%;
  292. margin: auto;
  293. background: url("") no-repeat;
  294. background-size: cover;
  295. }
  296. .api_personal_header p {
  297. margin-bottom: 13px;
  298. color: #fff;
  299. font-size: 18px;
  300. }
  301. .api_personal_header .api_personal_name {
  302. font-weight: bold;
  303. font-size: 20px;
  304. }
  305. .api_personal_header .api_dep {
  306. font-size: 14px;
  307. }
  308. .api_personal_header .api_personal_more {
  309. height: 31px;
  310. line-height: 31px;
  311. background: #ecf0f1;
  312. color: #2c3e50;
  313. font-size: 12px;
  314. border-radius: 25px;
  315. }
  316. .api_phoneBind {
  317. width: 100%;
  318. height: 38px;
  319. line-height: 38px;
  320. box-sizing: border-box;
  321. position: relative;
  322. color: #7f8c8d;
  323. padding-left: 37px;
  324. font-size: 12px;
  325. }
  326. .api_phoneBind img {
  327. width: 17px;
  328. height: 17px;
  329. position: absolute;
  330. top: 10px;
  331. left: 15px;
  332. }
  333. .api_function .ico {
  334. height: 35px;
  335. display: inline-block;
  336. }
  337. .api_function .api_icon1 {
  338. background: url("../image/news.png") no-repeat;
  339. background-size: cover;
  340. width: 39px;
  341. }
  342. .api_function .api_icon2 {
  343. background: url("../image/collection.png") no-repeat;
  344. background-size: cover;
  345. width: 35px;
  346. height: 35px;
  347. }
  348. .api_function .api_icon3 {
  349. background: url("../image/explain.png") no-repeat;
  350. background-size: cover;
  351. width: 30px;
  352. }
  353. .api_function_items .api_function_item {
  354. height: 40px;
  355. line-height: 40px;
  356. padding-left: 41px;
  357. color: #000;
  358. font-size: 15px;
  359. position: relative;
  360. border-bottom: 1px solid #ebebeb;
  361. }
  362. .api_function_items img {
  363. position: absolute;
  364. top: 21px;
  365. width: 18px;
  366. height: 18px;
  367. }
  368. .api_function_items .api_pass_img {
  369. left: 15px;
  370. }
  371. .api_function_items .api_more_img {
  372. right: 20px;
  373. }
  374. .api_forget_phone {
  375. padding: 15px 20px;
  376. }
  377. .api_forget_phone .api_phone {
  378. width: 100%;
  379. height: 49px;
  380. margin-bottom: 14px;
  381. box-sizing: border-box;
  382. display: flex;
  383. display: -webkit-flex;
  384. -webkit-justify-content: space-between;
  385. justify-content: space-between;
  386. flex-wrap: nowrap;
  387. }
  388. .api_forget_phone input::-webkit-input-placeholder {
  389. font-size: 14px;
  390. position: relative;
  391. }
  392. .api_forget_phone input {
  393. background-color: #fff;
  394. -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
  395. outline: none;
  396. box-shadow: none;
  397. border-radius: 0;
  398. padding-left: 22px;
  399. border: none;
  400. width: 100%;
  401. height: 100%;
  402. box-sizing: border-box;
  403. font-size: 14px;
  404. }
  405. .api_forget_phone .api_vali {
  406. width: 180px;
  407. }
  408. .api_forget_phone .api_btn_vali {
  409. display: inline-block;
  410. width: 107px;
  411. line-height: 49px;
  412. text-align: center;
  413. background: #009fe8;
  414. border: none;
  415. font-size: 14px;
  416. color: #fff;
  417. }
  418. .api_forget_phone .api_bnt {
  419. width: 100%;
  420. height: 49px;
  421. line-height: 49px;
  422. background: #009fe8;
  423. color: #fff;
  424. text-align: center;
  425. font-size: 14px;
  426. }
  427. .api_nav {
  428. width: 100%;
  429. height: 49px;
  430. background: #fff;
  431. box-sizing: border-box;
  432. display: block;
  433. }
  434. .header-nav {
  435. box-sizing: border-box;
  436. }
  437. .header-nav-items {
  438. list-style: none;
  439. padding: 0;
  440. margin: 0;
  441. height: 100%;
  442. width: 100%;
  443. transition: all 1s;
  444. box-sizing: border-box;
  445. overflow: hidden;
  446. position: relative;
  447. }
  448. .header-nav-items :after {
  449. content: "";
  450. position: absolute;
  451. bottom: 0;
  452. left: 0;
  453. width: 100%;
  454. height: 1px;
  455. background: #ebebeb;
  456. }
  457. .header-nav-items li {
  458. position: relative;
  459. font-size: 17px;
  460. line-height: 49px;
  461. padding: 0 16px;
  462. white-space: nowrap;
  463. text-align: center;
  464. }
  465. .header-nav-items .active::after {
  466. position: absolute;
  467. content: "";
  468. display: block;
  469. bottom: 0;
  470. left: 0;
  471. width: 100%;
  472. height: 2.5px;
  473. background: #009fe8;
  474. }
  475. .header_img {
  476. width: 50px;
  477. height: 50px;
  478. background: url("") no-repeat;
  479. background-size: cover;
  480. border-radius: 50%;
  481. }
  482. .api_lists {
  483. background-image: none;
  484. }
  485. .api_lists span {
  486. color: #bdc3c7;
  487. }
  488. .api_lists .api_bind_img {
  489. width: 17px;
  490. height: 17px;
  491. background: url("../image/bind.png") no-repeat;
  492. background-size: cover;
  493. position: absolute;
  494. top: 10px;
  495. right: 15px;
  496. }
  497. .api_bottom {
  498. padding: 15px 0;
  499. text-align: center;
  500. background: #f2f2f2;
  501. color: #bdc3c7;
  502. }
  503. .api_layout .aui-list .aui-list-item {
  504. height: 42px;
  505. min-height: 42px;
  506. }
  507. .api_layout .aui-list .aui-list-item-inner {
  508. height: 42px;
  509. line-height: 42px;
  510. min-height: 42px;
  511. font-size: 14px;
  512. }
  513. .api_layout .aui-list .aui-list-item-title {
  514. font-size: 14px;
  515. }
  516. .api_leader_wrap {
  517. padding: 15px;
  518. border-bottom: 1px solid #ebebeb;
  519. }
  520. .api_leader_wrap .api_title_or {
  521. color: #bdc3c7;
  522. font-size: 16px;
  523. }
  524. .api_leader_wrap .api_leader_content {
  525. width: 100%;
  526. border-radius: 10px;
  527. padding: 33px 30px 23px 30px;
  528. box-sizing: border-box;
  529. border: 1px solid #ebebeb;
  530. margin-top: 20px;
  531. color: #002257;
  532. }
  533. .api_leader_wrap .api_leader_content h1 {
  534. margin-bottom: 30px;
  535. font-size: 22px;
  536. }
  537. .api_leader_wrap .api_leader_content p {
  538. font-size: 14px;
  539. margin-bottom: 18px;
  540. }
  541. .api_leader_wrap .api_leader_content .api_leader_head {
  542. width: 50px;
  543. height: 50px;
  544. border-radius: 50%;
  545. object-fit: cover;
  546. margin: auto;
  547. margin-bottom: 5px;
  548. }
  549. .api_leader_wrap1 {
  550. padding: 20px 18px 10px 18px;
  551. }
  552. .api_leader_wrap1 h1 {
  553. color: #002257;
  554. font-size: 22px;
  555. margin-bottom: 20px;
  556. }
  557. .api_leader_wrap1 .api_leader_item1 li {
  558. margin-bottom: 20px;
  559. font-size: 15px;
  560. }
  561. .api_leader_wrap1 .api_leader_item1 li span {
  562. overflow: hidden;
  563. text-overflow: ellipsis;
  564. white-space: nowrap;
  565. color: #bdc3c7;
  566. }
  567. .api_leader_wrap1 .api_leader_item1 li p {
  568. color: #002257;
  569. }
  570. .api_news_item {
  571. padding: 10px;
  572. }
  573. .api_news_item li {
  574. padding: 15px 0 15px 10px;
  575. display: flex;
  576. justify-content: flex-start;
  577. flex-wrap: nowrap;
  578. display: -webkit-flex;
  579. -webkit-justify-content: flex-start;
  580. -webkit-flex-wrap: nowrap;
  581. align-items: center;
  582. -webkit-align-items: center;
  583. position: relative;
  584. -webkit-box-sizing: border-box;
  585. box-sizing: border-box;
  586. box-shadow: 0 2px 4px 0 #a6a6a6;
  587. border-radius: 5px;
  588. margin-bottom: 10px;
  589. }
  590. .api_news_item li .api_date {
  591. position: absolute;
  592. bottom: 15px;
  593. right: 20px;
  594. font-size: 11px;
  595. color: #bdc3c7;
  596. }
  597. .api_news_item li .api_news_num {
  598. position: absolute;
  599. color: #fff;
  600. background-color: #ff0037;
  601. width: 20px;
  602. height: 20px;
  603. line-height: 2.2;
  604. text-align: center;
  605. border-radius: 50%;
  606. font-size: 10px;
  607. top: 15px;
  608. right: 20px;
  609. overflow: hidden;
  610. text-overflow: ellipsis;
  611. white-space: nowrap;
  612. }
  613. .api_news_item li .api_ceil {
  614. width: 10px;
  615. height: 100%;
  616. background-color: #009fe8;
  617. position: absolute;
  618. top: 0;
  619. right: 0;
  620. border-top-right-radius: 5px;
  621. border-bottom-right-radius: 5px;
  622. }
  623. .api_news_item li:last-child {
  624. margin-bottom: 0;
  625. }
  626. .api_news_item .api_titles {
  627. width: 60%;
  628. padding-left: 10px;
  629. }
  630. .api_news_item .api_titles .api_news_title {
  631. font-size: 15px;
  632. margin-bottom: 8px;
  633. font-weight: bold;
  634. }
  635. .api_news_item .api_titles p {
  636. font-size: 14px;
  637. color: #bdc3c7;
  638. overflow: hidden;
  639. text-overflow: ellipsis;
  640. white-space: nowrap;
  641. }
  642. .api_news_item .api_titles .api_ico {
  643. display: inline-block;
  644. width: 15px;
  645. height: 15px;
  646. background: url("../image/icons.png") no-repeat;
  647. background-size: cover;
  648. position: relative;
  649. top: 2px;
  650. }
  651. .api_news_item .news_img {
  652. width: 45px;
  653. height: 45px;
  654. background: url("../image/news_img.png") no-repeat;
  655. background-size: cover;
  656. }
  657. @media screen and (max-width: 320px) {
  658. .api_mail_items .api_mail_item {
  659. width: 130px;
  660. }
  661. .api_forget_phone .api_vali {
  662. width: 160px;
  663. }
  664. .api_forget_phone .api_btn_vali {
  665. width: 100px;
  666. }
  667. .api_news_item .api_titles {
  668. width: 50%;
  669. }
  670. }
  671. @media screen and (min-width: 414px) {
  672. .api_mail_items .api_mail_item {
  673. width: 170px;
  674. }
  675. }
  676. @media screen and (min-width: 411px) {
  677. .api_mail_items .api_mail_item {
  678. width: 170px;
  679. }
  680. }
  681. @media (min-width: 380px) and (max-width: 400px) {
  682. .api_mail_items .api_mail_item {
  683. width: 160px;
  684. }
  685. }
  686. /*搜索条*/
  687. .aui-searchbar {
  688. display: -webkit-box;
  689. -webkit-box-pack: center;
  690. -webkit-box-align: center;
  691. height: 2.2rem;
  692. overflow: hidden;
  693. width: 100%;
  694. background-color: #ebeced;
  695. color: #9e9e9e;
  696. -webkit-backface-visibility: hidden;
  697. backface-visibility: hidden;
  698. }
  699. .aui-searchbar.focus {
  700. -webkit-box-pack: start;
  701. }
  702. .aui-searchbar-input {
  703. margin: 0 0.5rem;
  704. background-color: rgba(255, 255, 255, 0.3);
  705. border-radius: 50px;
  706. height: 31px;
  707. line-height: 31px;
  708. font-size: 0.7rem;
  709. position: relative;
  710. padding-left: 10px;
  711. display: -webkit-box;
  712. -webkit-box-flex: 1;
  713. }
  714. .aui-searchbar form {
  715. width: 95%;
  716. }
  717. .aui-searchbar-input input {
  718. color: #666666;
  719. width: 87%;
  720. padding: 0;
  721. margin: 0;
  722. height: 31px;
  723. line-height: 32px;
  724. border: 0;
  725. -webkit-appearance: none;
  726. font-size: 0.7rem;
  727. margin-left: 33px;
  728. color: #fff;
  729. }
  730. .aui-searchbar input::-webkit-input-placeholder {
  731. color: #ccc;
  732. }
  733. .aui-searchbar .aui-iconfont {
  734. line-height: 1.4rem;
  735. margin-right: 0.25rem;
  736. color: #9e9e9e !important;
  737. }
  738. .aui-searchbar .aui-searchbar-btn {
  739. font-size: 0.7rem;
  740. color: #666666;
  741. margin-right: -2.2rem;
  742. width: 2.2rem;
  743. height: 1.4rem;
  744. padding-right: 0;
  745. line-height: 1.4rem;
  746. text-align: center;
  747. -webkit-transition: all .3s;
  748. transition: all .3s;
  749. }
  750. .aui-searchbar-clear-btn {
  751. position: absolute;
  752. right: 5px;
  753. top: 3px;
  754. width: 1.1rem;
  755. height: 1.1rem;
  756. background: #eeeeee;
  757. border-radius: 50%;
  758. line-height: 0.6rem;
  759. text-align: center;
  760. display: none;
  761. }
  762. .aui-searchbar-clear-btn .aui-iconfont {
  763. font-size: 0.6rem;
  764. margin: 0 auto;
  765. position: relative;
  766. top: -2px;
  767. }
  768. .aui-searchbar .aui-searchbar-btn .aui-iconfont {
  769. color: #666666;
  770. }
  771. .aui-icon-search:before {
  772. content: "\e6e6";
  773. }
  774. .aui-iconfont {
  775. position: relative;
  776. font-family: "aui_iconfont" !important;
  777. font-size: 0.7rem;
  778. font-style: normal;
  779. -webkit-font-smoothing: antialiased;
  780. -moz-osx-font-smoothing: grayscale;
  781. }
  782. .duty {
  783. padding: 6px 22px 0 22px;
  784. }
  785. .duty .duty_title {
  786. font-size: 18px;
  787. color: #fff;
  788. padding-left: 34px;
  789. position: relative;
  790. margin-bottom: 6px;
  791. }
  792. .duty .duty_icon {
  793. background: url("../image/gonggao.png") no-repeat;
  794. display: block;
  795. width: 22px;
  796. height: 22px;
  797. background-size: cover;
  798. position: absolute;
  799. left: 0;
  800. top: 1px;
  801. }
  802. .duty .duty_content {
  803. font-size: 14px;
  804. color: #fff;
  805. }
  806. .item {
  807. margin-bottom: 20px;
  808. }
  809. .flex-space {
  810. display: -webkit-flex;
  811. display: flex;
  812. justify-content: space-between;
  813. -webkit-justify-content: space-between;
  814. flex-wrap: nowrap;
  815. -webkit-flex-wrap: nowrap;
  816. align-items: center;
  817. }
  818. .flex-start {
  819. display: -webkit-flex;
  820. display: flex;
  821. justify-content: flex-start;
  822. -webkit-justify-content: flex-start;
  823. flex-wrap: nowrap;
  824. -webkit-flex-wrap: nowrap;
  825. align-items: center;
  826. }
  827. .after-border:after {
  828. content: '';
  829. display: block;
  830. position: absolute;
  831. left: 0;
  832. bottom: 0;
  833. background: #ebeef3;
  834. right: 0;
  835. height: 1px;
  836. }
  837. .relative {
  838. position: relative;
  839. }
  840. .noText {
  841. width: 91px;
  842. height: 134px;
  843. position: absolute;
  844. top: 0;
  845. left: 0;
  846. right: 0;
  847. bottom: 0;
  848. margin: auto;
  849. }
  850. .noText img {
  851. width: 100%;
  852. }
  853. #tips {
  854. position: absolute;
  855. top: 0;
  856. left: 0;
  857. background: #fff;
  858. width: 100%;
  859. height: 100%;
  860. }
  861. #tips p {
  862. width: 200px;
  863. height: 150px;
  864. line-height: 30px;
  865. text-align: center;
  866. position: absolute;
  867. top: 0;
  868. left: 0;
  869. bottom: 0;
  870. right: 0;
  871. margin: auto;
  872. color: #ccc;
  873. }
  874. #tips i {
  875. width: 100px;
  876. height: 100px;
  877. display: block;
  878. background: url("../image/error.png") no-repeat;
  879. background-size: contain;
  880. margin: auto;
  881. }