index.css 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080
  1. @charset "utf-8";
  2. .ico,
  3. .page-title-wrap .title::before,
  4. .page-title-wrap .title::after {
  5. display: inline-block;
  6. background-image: url(../img_mobile/sprite.png);
  7. background-size: 3.08rem 15.48rem;
  8. }
  9. .ico-title-cloud-l,
  10. .page-title-wrap .title::before,
  11. .page-title-wrap .title::after {
  12. width: 1.64rem;
  13. height: 0.38rem;
  14. background-position: 0rem 0rem;
  15. }
  16. .ico-btn-download {
  17. width: 1.8rem;
  18. height: 0.7rem;
  19. background-position: 0rem -0.4rem;
  20. }
  21. .ico-btn-download3 {
  22. width: 2.4rem;
  23. height: 0.74rem;
  24. background-position: 0rem -1.2rem;
  25. }
  26. .ico-btn-enter-site {
  27. width: 1.8rem;
  28. height: 0.7rem;
  29. background-position: 0rem -2rem;
  30. }
  31. .ico-btn-xfgg2 {
  32. width: 2.4rem;
  33. height: 0.74rem;
  34. background-position: 0rem -2.8rem;
  35. }
  36. .ico-btn-yyxf2 {
  37. width: 2.4rem;
  38. height: 0.74rem;
  39. background-position: 0rem -3.6rem;
  40. }
  41. .ico-title-bbld {
  42. width: 2.77rem;
  43. height: 0.71rem;
  44. background-position: 0rem -4.4rem;
  45. }
  46. .ico-title-bbmd {
  47. width: 2.77rem;
  48. height: 0.71rem;
  49. background-position: 0rem -5.2rem;
  50. }
  51. .ico-title-zjxf {
  52. width: 2.78rem;
  53. height: 0.71rem;
  54. background-position: 0rem -6rem;
  55. }
  56. .ico-btn-download2 {
  57. width: 3rem;
  58. height: 0.88rem;
  59. background-position: 0rem -6.8rem;
  60. }
  61. .ico-btn-xfgg {
  62. width: 3rem;
  63. height: 0.88rem;
  64. background-position: 0rem -7.7rem;
  65. }
  66. .ico-btn-yygdd {
  67. width: 3rem;
  68. height: 0.88rem;
  69. background-position: 0rem -8.6rem;
  70. }
  71. .ico-btn-yyxf {
  72. width: 3rem;
  73. height: 0.88rem;
  74. background-position: 0rem -9.5rem;
  75. }
  76. .ico-title-bzxf {
  77. width: 2.62rem;
  78. height: 1.18rem;
  79. background-position: 0rem -10.4rem;
  80. }
  81. .ico-title-num1 {
  82. width: 1.27rem;
  83. height: 1.27rem;
  84. background-position: 0rem -11.6rem;
  85. }
  86. .ico-title-num2 {
  87. width: 1.27rem;
  88. height: 1.27rem;
  89. background-position: 0rem -12.9rem;
  90. }
  91. .ico-title-num3 {
  92. width: 1.27rem;
  93. height: 1.27rem;
  94. background-position: 0rem -14.2rem;
  95. }
  96. .ico-award {
  97. display: inline-block;
  98. background-image: url(../img_mobile/award-m.png);
  99. background-size: 6.28rem 4.58rem;
  100. }
  101. .ico-award1 {
  102. width: 2rem;
  103. height: 2.25rem;
  104. background-position: 0rem 0rem;
  105. }
  106. .ico-award2 {
  107. width: 2rem;
  108. height: 2.25rem;
  109. background-position: -2.1rem 0rem;
  110. }
  111. .ico-award3 {
  112. width: 2rem;
  113. height: 2.25rem;
  114. background-position: -4.2rem 0rem;
  115. }
  116. .ico-award4 {
  117. width: 2rem;
  118. height: 2.25rem;
  119. background-position: 0rem -2.3rem;
  120. }
  121. .ico-award5 {
  122. width: 2rem;
  123. height: 2.25rem;
  124. background-position: -2.1rem -2.3rem;
  125. }
  126. .ico-award6 {
  127. width: 2rem;
  128. height: 2.25rem;
  129. background-position: -4.2rem -2.3rem;
  130. }
  131. .hid {
  132. display: none !important;
  133. }
  134. body,
  135. html {
  136. -webkit-user-select: none;
  137. -webkit-tap-highlight-color: transparent;
  138. -webkit-text-size-adjust: none;
  139. -ms-touch-action: none;
  140. -ms-touch-action: manipulation;
  141. touch-action: manipulation;
  142. }
  143. body {
  144. font-size: 0.24rem;
  145. }
  146. .header {
  147. display: -webkit-box;
  148. display: -webkit-flex;
  149. display: -ms-flexbox;
  150. display: flex;
  151. position: -webkit-sticky;
  152. position: sticky;
  153. top: 0;
  154. z-index: 100;
  155. -webkit-box-sizing: border-box;
  156. box-sizing: border-box;
  157. padding: 0 0.25rem 0 0.3rem;
  158. width: 100%;
  159. height: 1.1rem;
  160. background-color: #754d98;
  161. background-image: url("../img_mobile/header.jpg");
  162. /* background-image: url(data:image/jpeg;base64,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); */
  163. background-repeat: no-repeat;
  164. background-size: 100% 100%;
  165. -webkit-align-items: center;
  166. align-items: center;
  167. -webkit-box-align: center;
  168. -ms-flex-align: center;
  169. }
  170. .header .logo {
  171. display: block;
  172. overflow: hidden;
  173. width: 0.85rem;
  174. height: 0.85rem;
  175. text-indent: -999em;
  176. background-image: url("../img/wd_icon.png");
  177. background-size: 100% 100%;
  178. }
  179. .header .text {
  180. display: -webkit-box;
  181. display: -webkit-flex;
  182. display: -ms-flexbox;
  183. display: flex;
  184. padding-left: 0.18rem;
  185. min-width: 0;
  186. font-size: 0;
  187. -webkit-box-direction: normal;
  188. -webkit-box-flex: 1;
  189. -webkit-box-orient: vertical;
  190. -webkit-box-pack: center;
  191. -webkit-flex: 1;
  192. -ms-flex: 1;
  193. flex: 1;
  194. -webkit-flex-direction: column;
  195. -ms-flex-direction: column;
  196. flex-direction: column;
  197. -ms-flex-pack: center;
  198. -webkit-justify-content: center;
  199. justify-content: center;
  200. }
  201. .header .title {
  202. overflow: hidden;
  203. font-size: 0.3rem;
  204. white-space: nowrap;
  205. text-overflow: ellipsis;
  206. color: #fff;
  207. }
  208. .header .des {
  209. overflow: hidden;
  210. margin-top: 0.06rem;
  211. font-size: 0.22rem;
  212. white-space: nowrap;
  213. text-overflow: ellipsis;
  214. color: #fff8dc;
  215. }
  216. .header .btn {
  217. display: block;
  218. }
  219. .header .btn+.btn {
  220. margin-left: 0.18rem;
  221. }
  222. .main {
  223. position: relative;
  224. width: 100%;
  225. }
  226. .main .content {
  227. min-height: 100vh;
  228. }
  229. .main .content .page {
  230. -webkit-box-sizing: border-box;
  231. box-sizing: border-box;
  232. }
  233. .main .footer-wrap {
  234. overflow: auto;
  235. }
  236. .page1 {
  237. overflow: hidden;
  238. position: relative;
  239. height: 10.8rem;
  240. }
  241. .page1::after {
  242. display: block;
  243. position: absolute;
  244. bottom: -1px;
  245. left: 0;
  246. width: 100%;
  247. height: 3.65rem;
  248. background-repeat: no-repeat;
  249. background-size: 100% 100%;
  250. content: "";
  251. }
  252. .page1::after {
  253. background-image: url(../img/home_dec.png);
  254. }
  255. .page1::after {
  256. background-image: url(../img_mobile/home_dec.png);
  257. }
  258. .page1 .bg {
  259. width: 100%;
  260. -webkit-user-select: none;
  261. -moz-user-select: none;
  262. -ms-user-select: none;
  263. user-select: none;
  264. }
  265. .page1 .op-wrap {
  266. position: absolute;
  267. top: 8.28rem;
  268. left: 0;
  269. z-index: 1;
  270. width: 100%;
  271. font-size: 0;
  272. }
  273. .page1 .op-wrap .btn+.btn {
  274. margin-left: 0.16rem;
  275. }
  276. .page1 .op-wrap .new-server-wrap {
  277. display: block;
  278. margin: 0 auto;
  279. width: 3.96rem;
  280. height: 1.22rem;
  281. }
  282. .wx_code {
  283. width: 3rem;
  284. }
  285. .page1 .op-wrap .new-server-wrap img {
  286. width: 100%;
  287. height: 100%;
  288. }
  289. .page1 .op-wrap .sub-op-wrap {
  290. margin-top: 0.26rem;
  291. text-align: center;
  292. }
  293. .page1 .op-wrap .sub-op-wrap .btn+.btn {
  294. margin-left: 0.33rem;
  295. }
  296. .page-title-wrap {
  297. position: relative;
  298. font-size: 0;
  299. text-align: center;
  300. }
  301. .page-title-wrap .num {
  302. position: absolute;
  303. top: -0.7rem;
  304. left: 50%;
  305. -webkit-transform: translateX(-50%);
  306. transform: translateX(-50%);
  307. }
  308. .page-title-wrap .title {
  309. position: relative;
  310. }
  311. .page-title-wrap .title::before,
  312. .page-title-wrap .title::after {
  313. display: block;
  314. position: absolute;
  315. top: 0.24rem;
  316. content: "";
  317. }
  318. .page-title-wrap .title::before {
  319. left: -2rem;
  320. }
  321. .page-title-wrap .title::after {
  322. right: -2rem;
  323. -webkit-transform: rotateY(180deg);
  324. transform: rotateY(180deg);
  325. }
  326. .page2 {
  327. padding-top: 0.86rem;
  328. height: 13.1rem;
  329. background-repeat: no-repeat;
  330. background-size: 100% 100%;
  331. }
  332. .page2 {
  333. background-image: url(../img/bg1.jpg);
  334. }
  335. .page2 .award-wrap {
  336. position: relative;
  337. margin: 0 auto;
  338. margin-top: 0.1rem;
  339. -webkit-box-sizing: border-box;
  340. box-sizing: border-box;
  341. padding-top: 0.9rem;
  342. min-height: 7.31rem;
  343. font-size: 0;
  344. background-repeat: no-repeat;
  345. background-size: 7.5rem 7.31rem;
  346. }
  347. .page2 .award-wrap {
  348. background-image: url(../img_mobile/award_bg.png);
  349. }
  350. .page2 .award-wrap .new-server-wrap {
  351. font-size: 0;
  352. text-align: center;
  353. }
  354. .page2 .award-wrap .new-server-wrap .name {
  355. margin: 0.1rem auto 0.2rem;
  356. font-size: 0.32rem;
  357. font-weight: 700;
  358. color: #fff;
  359. }
  360. .page2 .award-wrap .new-server-wrap .name-tip {
  361. margin-top: 0.1rem;
  362. font-size: 0.3rem;
  363. font-weight: 600;
  364. color: #fff;
  365. }
  366. .page2 .award-wrap .new-server-wrap .time {
  367. margin-top: 0.04rem;
  368. font-size: 0.24rem;
  369. color: #fff;
  370. }
  371. .page2 .award-wrap .new-server-wrap .btn {
  372. margin-top: 0.3rem;
  373. }
  374. .page2 .award-wrap .award-list {
  375. margin-top: 1.08rem;
  376. text-align: center;
  377. }
  378. .page2 .award-wrap .award-list .item {
  379. margin: 0 0.12rem;
  380. }
  381. .page2 .award-wrap .award-list .item:nth-child(n+4) {
  382. margin-top: 0.1rem;
  383. }
  384. .page2 .award-wrap .award-list .item a {
  385. display: block;
  386. width: 100%;
  387. height: 100%;
  388. }
  389. .page3 {
  390. padding-top: 0.7rem;
  391. height: 13rem;
  392. background-repeat: no-repeat;
  393. background-size: 100% 100%;
  394. }
  395. .page3 {
  396. background-image: url(../img/bg2.jpg);
  397. }
  398. .page3 .act-list {
  399. margin-top: 0.24rem;
  400. font-size: 0;
  401. text-align: center;
  402. }
  403. .page3 .act-list .item {
  404. display: inline-block;
  405. width: 3.44rem;
  406. height: 5.32rem;
  407. vertical-align: top;
  408. }
  409. .page3 .act-list .item img {
  410. width: 100%;
  411. height: 100%;
  412. }
  413. .page4 {
  414. padding-top: 0.85rem;
  415. height: 7.8rem;
  416. background-repeat: no-repeat;
  417. background-size: 100% 100%;
  418. }
  419. .page4 {
  420. background-image: url(../img/bg3.jpg);
  421. }
  422. .page4 {
  423. background-image: url(../img/bg3.jpg);
  424. }
  425. .page4 .main-swiper-wrap {
  426. margin-top: 0.68rem;
  427. }
  428. .page4 .main-swiper-wrap .main-swiper-pagination {
  429. display: -webkit-box;
  430. display: -webkit-flex;
  431. display: -ms-flexbox;
  432. display: flex;
  433. position: static;
  434. margin-top: 0.16rem;
  435. -webkit-align-items: center;
  436. align-items: center;
  437. -webkit-box-align: center;
  438. -webkit-box-pack: center;
  439. -ms-flex-align: center;
  440. -ms-flex-pack: center;
  441. -webkit-justify-content: center;
  442. justify-content: center;
  443. }
  444. .page4 .main-swiper-wrap .main-swiper-pagination .swiper-pagination-bullet {
  445. border-radius: 50%;
  446. width: 0.16rem;
  447. height: 0.16rem;
  448. background-color: transparent;
  449. opacity: 1;
  450. -webkit-box-shadow: 0 0 0 1px #aa8f45 inset;
  451. box-shadow: 0 0 0 1px #aa8f45 inset;
  452. }
  453. .page4 .main-swiper-wrap .main-swiper-pagination .swiper-pagination-bullet+.swiper-pagination-bullet {
  454. margin-left: 0.12rem;
  455. }
  456. .page4 .main-swiper-wrap .main-swiper-pagination .swiper-pagination-bullet-active {
  457. width: 0.2rem;
  458. height: 0.2rem;
  459. background-color: #aa8f45;
  460. }
  461. .page4 .main-swiper {
  462. margin: 0 auto;
  463. width: 100%;
  464. height: 3.82rem;
  465. }
  466. .page4 .main-swiper .swiper-slide {
  467. width: 6.8rem;
  468. height: 3.82rem;
  469. }
  470. .page4 .main-swiper .swiper-slide img {
  471. width: 100%;
  472. height: 100%;
  473. }
  474. .header-elements {
  475. display: -webkit-box;
  476. display: -webkit-flex;
  477. display: -ms-flexbox;
  478. display: flex;
  479. position: -webkit-sticky;
  480. position: sticky;
  481. top: 1.1rem;
  482. z-index: 100;
  483. -webkit-box-sizing: border-box;
  484. box-sizing: border-box;
  485. width: 100%;
  486. height: 1.13rem;
  487. background: #14c5c3;
  488. }
  489. .header-elements.hid {
  490. display: none;
  491. }
  492. .header-elements ul {
  493. width: 7.05rem;
  494. margin: 0.18rem auto;
  495. }
  496. .header-elements ul .item {
  497. display: -webkit-box;
  498. display: -webkit-flex;
  499. display: -ms-flexbox;
  500. display: flex;
  501. font-size: 0.2rem;
  502. color: #fff;
  503. -webkit-box-pack: justify;
  504. -ms-flex-pack: justify;
  505. -webkit-justify-content: space-between;
  506. justify-content: space-between;
  507. }
  508. .header-elements ul .item+.item {
  509. margin-top: 0.1rem;
  510. }
  511. .header-elements ul .item span,
  512. .header-elements ul .item a {
  513. min-width: 0;
  514. }
  515. .header-elements ul .item span:nth-child(1),
  516. .header-elements ul .item a:nth-child(1) {
  517. -webkit-box-flex: 2;
  518. -webkit-flex: 2;
  519. -ms-flex: 2;
  520. flex: 2;
  521. }
  522. .header-elements ul .item #checkDetailBtn {
  523. text-decoration: underline;
  524. }
  525. .header-elements ul .item span:nth-child(2),
  526. .header-elements ul .item a:nth-child(2) {
  527. text-align: right;
  528. -webkit-box-flex: 1;
  529. -webkit-flex: 1;
  530. -ms-flex: 1;
  531. flex: 1;
  532. }
  533. .header-elements ul .item a:nth-child(2) {
  534. text-decoration: underline;
  535. }
  536. .header-elements ul .item a {
  537. color: #fff;
  538. }
  539. .header-elements ul .btn-check-detail.active i {
  540. -webkit-transform: rotateZ(180deg);
  541. transform: rotateZ(180deg);
  542. }
  543. .header-elements ul .btn-check-detail span {
  544. position: relative;
  545. }
  546. .header-elements ul .btn-check-detail i {
  547. display: block;
  548. position: absolute;
  549. top: 50%;
  550. right: -0.2rem;
  551. border-width: 0.08rem 0.07rem 0 0.07rem;
  552. border-style: solid;
  553. border-color: #fff transparent transparent transparent;
  554. width: 0;
  555. height: 0;
  556. }
  557. .detail-modal {
  558. position: absolute;
  559. top: 1.13rem;
  560. left: 0;
  561. -webkit-box-sizing: border-box;
  562. box-sizing: border-box;
  563. padding: 0.4rem 0.36rem;
  564. width: 100%;
  565. font-size: 0.24rem;
  566. line-height: 1.5;
  567. color: #fff;
  568. background-color: rgba(9, 65, 65, 0.8);
  569. display: none;
  570. }
  571. .detail-modal.active {
  572. display: block;
  573. }
  574. .footer {
  575. width: 100%;
  576. height: 2.8rem;
  577. padding: 0;
  578. color: #919395;
  579. background-color: #222222;
  580. overflow: hidden;
  581. text-align: center;
  582. position: relative;
  583. bottom: 0;
  584. }
  585. .footer p {
  586. line-height: 0.5rem;
  587. }
  588. .footer .main {
  589. margin-top: 0.3rem;
  590. }
  591. .footer .main .footerUl {
  592. text-align: center;
  593. }
  594. .footer .main .footerUl li {
  595. margin: 0 2px;
  596. display: inline-block;
  597. }
  598. .footer .main .footerUl li a {
  599. color: #919395;
  600. }
  601. .footer .main p a {
  602. color: #919395;
  603. border-bottom: 1px solid #919395;
  604. }
  605. footer .main .footerUl li a {
  606. color: #919395;
  607. }
  608. .footer .main p a {
  609. color: #919395;
  610. border-bottom: 1px solid #919395;
  611. }
  612. .footer .main .footerUl li a {
  613. color: #919395;
  614. }
  615. .footer .main p a {
  616. color: #919395;
  617. border-bottom: 1px solid #919395;
  618. }
  619. .tip-modal .btn-close {
  620. bottom: -0.6rem;
  621. }
  622. .tip-modal .modal-wrapper {
  623. -webkit-box-sizing: border-box;
  624. box-sizing: border-box;
  625. padding: 0.6rem 0.42rem;
  626. width: 5.86rem;
  627. height: 6.24rem;
  628. font-size: 0.18rem;
  629. background-repeat: no-repeat;
  630. background-size: 100% 100%;
  631. }
  632. .tip-modal .modal-wrapper {
  633. background-image: url(../img/modal_bg2.png);
  634. }
  635. .tip-modal .modal-wrapper {
  636. background-image: url(../img/modal_bg2.png);
  637. }
  638. .tip-modal .modal-body {
  639. -webkit-box-sizing: border-box;
  640. box-sizing: border-box;
  641. padding-top: 1.14rem;
  642. height: 100%;
  643. -webkit-user-select: none;
  644. -moz-user-select: none;
  645. -ms-user-select: none;
  646. user-select: none;
  647. }
  648. .tip-modal .modal-body .des {
  649. line-height: 2;
  650. text-align: center;
  651. color: #a54bae;
  652. }
  653. .tip-modal .modal-body .code-wrap {
  654. position: relative;
  655. margin: 0 auto;
  656. margin-top: 0.2rem;
  657. width: 1.94rem;
  658. height: 1.94rem;
  659. }
  660. .tip-modal .modal-body .code-wrap::before {
  661. display: block;
  662. position: absolute;
  663. top: 50%;
  664. left: 50%;
  665. margin-top: -0.25rem;
  666. margin-left: -0.25rem;
  667. width: 0.5rem;
  668. height: 0.5rem;
  669. background-image: url("../img/wd_icon.png");
  670. background-size: 100% 100%;
  671. content: "";
  672. }
  673. .tip-modal .modal-body .code {
  674. width: 100%;
  675. height: 100%;
  676. }
  677. .tip-modal .modal-body .code[src=""] {
  678. opacity: 0;
  679. }
  680. .download-modal .modal-wrapper,
  681. .ios-tips-modal .modal-wrapper {
  682. -webkit-box-sizing: border-box;
  683. box-sizing: border-box;
  684. width: 4.55rem;
  685. height: 1.86rem;
  686. background-repeat: no-repeat;
  687. background-size: 100% 100%;
  688. }
  689. .download-modal .modal-wrapper,
  690. .ios-tips-modal .modal-wrapper {
  691. background-image: url(../img/modal_bg1.png);
  692. }
  693. .download-modal .modal-wrapper,
  694. .ios-tips-modal .modal-wrapper {
  695. background-image: url(../img/modal_bg1.png);
  696. }
  697. .ios-tips-modal {
  698. line-height: 1.86rem;
  699. text-align: center;
  700. font-size: 0.3rem;
  701. }
  702. .download-modal .modal-body {
  703. display: -webkit-box;
  704. display: -webkit-flex;
  705. display: -ms-flexbox;
  706. display: flex;
  707. height: 100%;
  708. -webkit-align-items: center;
  709. align-items: center;
  710. -webkit-box-align: center;
  711. -webkit-box-pack: center;
  712. -ms-flex-align: center;
  713. -ms-flex-pack: center;
  714. -webkit-justify-content: center;
  715. justify-content: center;
  716. }
  717. .download-modal .code-wrap {
  718. position: relative;
  719. -webkit-box-sizing: border-box;
  720. box-sizing: border-box;
  721. border-radius: 0.1rem;
  722. padding: 0.02rem;
  723. width: 1.52rem;
  724. height: 1.52rem;
  725. background-color: #fff;
  726. -webkit-box-shadow: 0 0 0 0.02rem #d9b675;
  727. box-shadow: 0 0 0 0.02rem #d9b675;
  728. }
  729. .download-modal .code-wrap .des {
  730. position: absolute;
  731. top: 50%;
  732. left: -1.5em;
  733. width: 1em;
  734. font-size: 0.18rem;
  735. line-height: 1.2;
  736. color: #b59457;
  737. -webkit-transform: translateY(-50%);
  738. transform: translateY(-50%);
  739. }
  740. .download-modal .code-wrap .code {
  741. border-radius: 0.1rem;
  742. width: 100%;
  743. height: 100%;
  744. }
  745. .download-modal .op-wrap {
  746. width: 100%;
  747. }
  748. .download-modal .op-wrap .qq-icon,
  749. .download-modal .op-wrap .email-icon {
  750. width: 50%;
  751. float: left;
  752. cursor: pointer;
  753. }
  754. .download-modal .op-wrap .qq-icon img,
  755. .download-modal .op-wrap .email-icon img {
  756. width: 1rem;
  757. margin: 0 auto;
  758. display: block;
  759. }
  760. .download-modal .op-wrap .email-icon img {
  761. margin-top: 0.17rem;
  762. }
  763. .download-modal .op-wrap span,
  764. .download-modal .op-wrap .email-icon span {
  765. color: #a54bae;
  766. display: block;
  767. height: 0.3rem;
  768. text-align: center;
  769. }
  770. .download-modal .op-wrap .email-icon span {
  771. margin-top: 0.15rem;
  772. }
  773. .download-modal .op-wrap .btn {
  774. display: block;
  775. }
  776. .download-modal .op-wrap .btn+.btn {
  777. margin-top: 0.12rem;
  778. }
  779. .modal {
  780. display: -webkit-box;
  781. display: -webkit-flex;
  782. display: -ms-flexbox;
  783. display: flex;
  784. overflow: auto;
  785. position: fixed;
  786. top: 0;
  787. right: 0;
  788. bottom: 0;
  789. left: 0;
  790. z-index: 10000;
  791. -webkit-box-sizing: border-box;
  792. box-sizing: border-box;
  793. padding: 1rem 0;
  794. background-color: rgba(0, 0, 0, 0.8);
  795. opacity: 0;
  796. overscroll-behavior: contain;
  797. -ms-scroll-chaining: contain;
  798. }
  799. .modal.modal-hide {
  800. opacity: 0;
  801. -webkit-animation: fadeOut 0s linear forwards;
  802. animation: fadeOut 0s linear forwards;
  803. }
  804. .modal.modal-hide .modal-wrapper {
  805. opacity: 0;
  806. /* 此处可自定义动画 */
  807. -webkit-animation: fadeOut 0s linear forwards;
  808. animation: fadeOut 0s linear forwards;
  809. }
  810. .modal.modal-active {
  811. opacity: 1;
  812. -webkit-animation: fadeIn 0.3s linear forwards;
  813. animation: fadeIn 0.3s linear forwards;
  814. }
  815. .modal.modal-active .modal-wrapper {
  816. opacity: 1;
  817. /* 此处可自定义动画 */
  818. -webkit-animation: fadeIn 0.3s linear forwards;
  819. animation: fadeIn 0.3s linear forwards;
  820. }
  821. .modal-open {
  822. position: fixed;
  823. -webkit-box-sizing: border-box;
  824. box-sizing: border-box;
  825. width: 100%;
  826. }
  827. .modal-open-scroll-through {
  828. overflow: hidden;
  829. -webkit-box-sizing: border-box;
  830. box-sizing: border-box;
  831. width: 100%;
  832. }
  833. .btn-close {
  834. display: block;
  835. overflow: hidden;
  836. position: absolute;
  837. bottom: -1.18rem;
  838. left: 50%;
  839. -webkit-transform: translateX(-50%);
  840. transform: translateX(-50%);
  841. cursor: pointer;
  842. }
  843. .modal-wrapper {
  844. position: relative;
  845. z-index: 10001;
  846. margin: auto;
  847. width: 8rem;
  848. }
  849. .ico-btn-close {
  850. width: 0.6rem;
  851. height: 1.18rem;
  852. background-position: 0rem -4.3rem;
  853. font-size: 0;
  854. background-size: 6.58rem 5.48rem;
  855. background-image: url(../img/sprite.png);
  856. }
  857. .ico-btn-ios,
  858. .ico-btn-android {
  859. display: block;
  860. margin: 0.4rem auto;
  861. background-size: 6.58rem 5.48rem;
  862. background-image: url(../img/sprite.png);
  863. font-size: 0;
  864. cursor: pointer;
  865. }
  866. .ico-btn-android {
  867. width: 2.3rem;
  868. height: 0.7rem;
  869. background-position: -2.4rem -2.7rem;
  870. }
  871. .ico-btn-ios-active,
  872. .ico-btn-ios:hover {
  873. width: 2.3rem;
  874. height: 0.7rem;
  875. background-position: 0rem -3.5rem;
  876. }
  877. .i co-btn-ios {
  878. width: 2.3rem;
  879. height: 0.7rem;
  880. }
  881. .ico-btn-ios {
  882. width: 2.3rem;
  883. height: 0.7rem;
  884. background-position: -2.4rem -3.5rem;
  885. }
  886. .page2 .time {
  887. margin-top: 0.04rem;
  888. margin-bottom: 0.08rem;
  889. font-size: 0.16rem;
  890. color: #fff;
  891. }
  892. .page2 .time {
  893. margin-top: 0.04rem;
  894. margin-bottom: 0.08rem;
  895. font-size: 0.16rem;
  896. color: #fff;
  897. }
  898. .page2 .time {
  899. margin-top: 0.04rem;
  900. margin-bottom: 0.08rem;
  901. font-size: 0.16rem;
  902. color: #fff;
  903. }
  904. .page2 .time {
  905. margin-top: 0.04rem;
  906. margin-bottom: 0.08rem;
  907. font-size: 0.16rem;
  908. color: #fff;
  909. }
  910. .page2 .time {
  911. margin-top: 0.04rem;
  912. margin-bottom: 0.08rem;
  913. font-size: 0.16rem;
  914. color: #fff;
  915. }
  916. .page2 .time {
  917. margin-top: 0.04rem;
  918. margin-bottom: 0.08rem;
  919. font-size: 0.16rem;
  920. color: #fff;
  921. }