main.min.css 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756
  1. html,
  2. body,
  3. div,
  4. span,
  5. applet,
  6. object,
  7. iframe,
  8. h1,
  9. h2,
  10. h3,
  11. h4,
  12. h5,
  13. h6,
  14. p,
  15. blockquote,
  16. pre,
  17. a,
  18. abbr,
  19. acronym,
  20. address,
  21. big,
  22. cite,
  23. code,
  24. del,
  25. dfn,
  26. em,
  27. img,
  28. ins,
  29. kbd,
  30. q,
  31. s,
  32. samp,
  33. small,
  34. strike,
  35. strong,
  36. sub,
  37. sup,
  38. tt,
  39. var,
  40. b,
  41. u,
  42. i,
  43. center,
  44. dl,
  45. dt,
  46. dd,
  47. ol,
  48. ul,
  49. li,
  50. fieldset,
  51. form,
  52. label,
  53. legend,
  54. table,
  55. caption,
  56. tbody,
  57. tfoot,
  58. thead,
  59. tr,
  60. th,
  61. td,
  62. article,
  63. aside,
  64. canvas,
  65. details,
  66. embed,
  67. figure,
  68. figcaption,
  69. footer,
  70. header,
  71. hgroup,
  72. menu,
  73. nav,
  74. output,
  75. ruby,
  76. section,
  77. summary,
  78. time,
  79. mark,
  80. audio,
  81. video {
  82. margin: 0;
  83. padding: 0;
  84. border: 0;
  85. font-size: 100%;
  86. font: inherit;
  87. vertical-align: baseline
  88. }
  89. article,
  90. aside,
  91. details,
  92. figcaption,
  93. figure,
  94. footer,
  95. header,
  96. hgroup,
  97. menu,
  98. nav,
  99. section {
  100. display: block
  101. }
  102. ol,
  103. ul {
  104. list-style: none
  105. }
  106. blockquote,
  107. q {
  108. quotes: none
  109. }
  110. blockquote:before,
  111. blockquote:after,
  112. q:before,
  113. q:after {
  114. content: '';
  115. content: none
  116. }
  117. table {
  118. border-collapse: collapse;
  119. border-spacing: 0
  120. }
  121. input {
  122. -webkit-box-sizing: border-box;
  123. -moz-box-sizing: border-box;
  124. box-sizing: border-box
  125. }
  126. .loading {
  127. position: fixed;
  128. top: 0;
  129. left: 0;
  130. right: 0;
  131. bottom: 0;
  132. z-index: 9995
  133. }
  134. .loading .content {
  135. color: rgba(255, 255, 255, 0.6);
  136. margin-top: 4rem;
  137. text-align: center;
  138. font-size: 0.3rem
  139. }
  140. .lockScroll {
  141. overflow: hidden
  142. }
  143. .dialog-alert {
  144. top: 50%;
  145. transform: translateY(-50%);
  146. left: 1.2rem;
  147. right: 1.2rem;
  148. z-index: 9998;
  149. position: fixed;
  150. animation: frames-top-center-01 300ms;
  151. border-radius: 0.1rem;
  152. min-height: auto;
  153. height: auto;
  154. background: white;
  155. color: black
  156. }
  157. .dialog-alert h1 {
  158. font-size: 0.36rem;
  159. font-weight: bold;
  160. text-align: center;
  161. margin-top: 0.5rem
  162. }
  163. .dialog-alert .content {
  164. min-height: 0.8rem;
  165. margin: 0.2rem 0.6rem;
  166. display: flex;
  167. align-items: center;
  168. justify-content: center;
  169. font-size: 0.3rem
  170. }
  171. .dialog-alert .actions {
  172. height: 1rem;
  173. display: flex;
  174. justify-content: center
  175. }
  176. .dialog-alert .actions .btn {
  177. color: white;
  178. font-size: 0.36rem;
  179. background: linear-gradient(-90deg, #fa382f, #ff7453);
  180. height: 0.7rem;
  181. display: flex;
  182. align-items: center;
  183. justify-content: center;
  184. width: 2rem;
  185. border-radius: 0.4rem;
  186. padding: 0;
  187. margin: 0
  188. }
  189. @keyframes frames-top-center-01 {
  190. 0% {
  191. top: -10%
  192. }
  193. 100% {
  194. top: 50%
  195. }
  196. }
  197. @keyframes frames-top-center-02 {
  198. 0% {
  199. top: 0%
  200. }
  201. 92% {
  202. top: 50%
  203. }
  204. 100% {
  205. top: 40%
  206. }
  207. }
  208. @keyframes capauth-zoom-in {
  209. 0% {
  210. opacity: 0
  211. }
  212. 80% {
  213. opacity: 0
  214. }
  215. 100% {
  216. opacity: 1
  217. }
  218. }
  219. .overlay {
  220. position: fixed;
  221. top: 0;
  222. right: 0;
  223. bottom: 0;
  224. left: 0;
  225. z-index: 9990;
  226. background-color: rgba(0, 0, 0, 0.7);
  227. min-height: 6.5rem
  228. }
  229. .overlay-alert {
  230. z-index: 9995
  231. }
  232. .overlay-loading {
  233. z-index: 9995
  234. }
  235. #uniauthframe {
  236. width: 100%;
  237. height: 100%;
  238. position: fixed;
  239. top: 0px;
  240. left: 0px;
  241. margin: 0px;
  242. padding: 0px;
  243. border: 0px;
  244. animation: capauth-zoom-in 600ms;
  245. z-index: 9990
  246. }
  247. html,
  248. body {
  249. margin: 0;
  250. padding: 0
  251. }
  252. body {
  253. color: white;
  254. min-height: 12.5rem;
  255. font-family: PingFangSC-Regular, sans-serif, "SourceHanSansCN-Regular", "Microsoft YaHei", "微软雅黑", STXihei, SimHei, "华文细黑";
  256. background: url("../images/bg-15.png") no-repeat;
  257. background-size: 100% 100%
  258. }
  259. body .banner {
  260. height: 5.65rem;
  261. display: flex;
  262. align-items: flex-end;
  263. justify-content: center
  264. }
  265. body .banner .banner-text {
  266. width: 5.38rem;
  267. height: 5.11rem;
  268. background: url("../images/banner-text-15.png") no-repeat;
  269. background-size: 100%, 100%;
  270. margin: 0 auto
  271. }
  272. body .agr {
  273. margin: 0.22rem 0.3rem 0.1rem
  274. }
  275. body .agr .title {
  276. width: 2.7rem;
  277. height: 1.6rem;
  278. background: url("../images/tips-15.png") no-repeat;
  279. background-size: 100%, 100%;
  280. margin: 0 auto
  281. }
  282. body .agr .agr-9 {
  283. display: none
  284. }
  285. body .agr .agr-15 {
  286. display: block
  287. }
  288. body .agr h2 {
  289. color: #FFD52C;
  290. font-size: 0.26rem;
  291. font-weight: bold;
  292. margin-bottom: 0.15rem
  293. }
  294. body .agr ul {
  295. margin: 0 auto;
  296. text-align: justify;
  297. margin-bottom: 0.35rem
  298. }
  299. body .agr ul li {
  300. color: #fff;
  301. font-weight: 400;
  302. font-size: 0.24rem;
  303. margin-bottom: 0.15rem;
  304. line-height: 0.36rem
  305. }
  306. body .agr ul li a {
  307. color: #0AFFF7;
  308. text-decoration: none;
  309. border-bottom: 0.01rem solid #0AFFF7
  310. }
  311. .body-9 {
  312. background: url("../images/bg-9.png") no-repeat;
  313. background-size: 100% 100%
  314. }
  315. .body-9 .banner .banner-text {
  316. width: 4.9rem;
  317. height: 5.43rem;
  318. background: url("../images/banner-text-9.png") no-repeat;
  319. background-size: 100%, 100%
  320. }
  321. .body-9 .agr .agr-9 {
  322. display: block
  323. }
  324. .body-9 .agr .agr-15 {
  325. display: none
  326. }
  327. .slider {
  328. position: relative;
  329. height: 2.62rem;
  330. display: flex;
  331. align-items: center;
  332. z-index: 0;
  333. margin: 0.17rem 0.08rem
  334. }
  335. .slider .item-15 {
  336. width: 4.89rem;
  337. height: 2.62rem;
  338. background: url("../images/p-15-active.png") no-repeat;
  339. background-size: 100%, 100%;
  340. position: absolute;
  341. z-index: 1;
  342. animation: item15-in 1s
  343. }
  344. .slider .item-15-inactive {
  345. width: 3.02rem;
  346. height: 1.51rem;
  347. background: url("../images/p-15-inactive.png") no-repeat;
  348. background-size: 100%, 100%;
  349. position: absolute;
  350. z-index: 0;
  351. animation: item15-out 1s
  352. }
  353. .slider .item-9 {
  354. width: 4.89rem;
  355. height: 2.62rem;
  356. background: url("../images/p-9-active.png") no-repeat;
  357. background-size: 100%, 100%;
  358. position: absolute;
  359. right: 0;
  360. z-index: 1;
  361. animation: item9-in 1s
  362. }
  363. .slider .item-9-inactive {
  364. width: 3.02rem;
  365. height: 1.51rem;
  366. background: url("../images/p-9-inactive.png") no-repeat;
  367. background-size: 100%, 100%;
  368. position: absolute;
  369. right: 0;
  370. z-index: 0;
  371. animation: item9-out 1s
  372. }
  373. @keyframes item9-in {
  374. from {
  375. width: 3.02rem;
  376. height: 1.51rem;
  377. top: 0.32rem
  378. }
  379. to {
  380. width: 4.89rem;
  381. height: 2.62rem;
  382. top: 0rem
  383. }
  384. }
  385. @keyframes item9-out {
  386. from {
  387. width: 4.89rem;
  388. height: 2.62rem
  389. }
  390. to {
  391. width: 3.02rem;
  392. height: 1.51rem
  393. }
  394. }
  395. @keyframes item15-in {
  396. from {
  397. width: 3.02rem;
  398. height: 1.51rem;
  399. top: 0.32rem
  400. }
  401. to {
  402. width: 4.89rem;
  403. height: 2.62rem;
  404. top: 0rem
  405. }
  406. }
  407. @keyframes item15-out {
  408. from {
  409. width: 4.89rem;
  410. height: 2.62rem
  411. }
  412. to {
  413. width: 3.02rem;
  414. height: 1.51rem
  415. }
  416. }
  417. .order {
  418. display: flex;
  419. justify-content: center;
  420. margin-top: 0.4rem
  421. }
  422. .order .btn {
  423. width: 6.91rem;
  424. height: 0.96rem
  425. }
  426. .order .btn-order {
  427. background: url("../images/btn-order.png") no-repeat;
  428. background-size: 100%, 100%
  429. }
  430. .section-announcement {
  431. position: fixed;
  432. top: 0;
  433. left: 50%;
  434. transform: translateX(-50%);
  435. width: 5.86rem;
  436. height: 0.97rem;
  437. font-size: 0.2rem;
  438. display: flex;
  439. justify-content: center;
  440. background: url(../images/bg-announcement.png) no-repeat;
  441. background-size: 100% 100%
  442. }
  443. .section-announcement .horn {
  444. height: 0.65rem;
  445. display: flex;
  446. align-items: center;
  447. justify-content: center
  448. }
  449. .section-announcement .horn img {
  450. width: 0.37rem;
  451. height: 0.32rem;
  452. margin-right: 0.05rem;
  453. background: url(../images/horn.png) no-repeat;
  454. background-size: 100% 100%
  455. }
  456. .section-announcement .content {
  457. height: 0.7rem;
  458. line-height: 0.7rem
  459. }
  460. input::-webkit-input-placeholder {
  461. color: #9E9E9E;
  462. font-size: 0.28rem
  463. }
  464. input::-moz-placeholder {
  465. color: #9E9E9E;
  466. font-size: 0.28rem
  467. }
  468. input:-moz-placeholder {
  469. color: #9E9E9E;
  470. font-size: 0.28rem
  471. }
  472. input:-ms-input-placeholder {
  473. color: #9E9E9E;
  474. font-size: 0.28rem
  475. }
  476. .sms-form {
  477. display: flex;
  478. align-items: center;
  479. justify-content: center
  480. }
  481. .cancel-form {
  482. height: 4.18rem;
  483. margin: 0.25rem 0.05rem;
  484. padding-top: 0.2rem;
  485. background: url(../images/bg-cancel-dialog.png);
  486. background-size: 100% 100%
  487. }
  488. .draw-form {
  489. height: 5.8rem;
  490. margin: 0.45rem 0.15rem 0 0.17rem;
  491. background: url(../images/bg-draw-dialog.png);
  492. background-size: 100% 100%;
  493. padding-top: 1.3rem
  494. }
  495. .form-group {
  496. width: 6rem
  497. }
  498. .form-group .input-row {
  499. display: flex;
  500. align-content: space-between;
  501. justify-content: center;
  502. margin-bottom: 0.4rem
  503. }
  504. .form-group .input-row .smscode {
  505. width: 100%;
  506. margin-right: 0.4rem
  507. }
  508. .form-group .input-row .sendcode {
  509. font-size: 0.32rem;
  510. height: .86rem;
  511. padding: 0 0.2rem;
  512. word-break: keep-all;
  513. white-space: nowrap;
  514. border-radius: 0.1rem;
  515. background: #A300C6;
  516. display: flex;
  517. align-items: center;
  518. justify-content: center;
  519. min-width: 1.6rem
  520. }
  521. .form-group .input-row:last-child {
  522. margin-bottom: 0rem
  523. }
  524. .form-group input {
  525. color: #222222;
  526. font-size: 0.36rem;
  527. width: 100%;
  528. height: 0.88rem;
  529. outline: none;
  530. -webkit-appearance: none;
  531. min-width: 2.4rem;
  532. margin-bottom: 0.01rem;
  533. border: 0.01rem solid #ccc;
  534. border-radius: 0.1rem;
  535. padding-left: 0.3rem
  536. }
  537. .form-group .actions {
  538. margin-top: 0.4rem
  539. }
  540. .btn {
  541. color: white;
  542. font-size: 0.36rem;
  543. height: 1rem;
  544. background: url(../images/btn-order.png) no-repeat;
  545. background-size: 100% 100%;
  546. margin: 0 auto;
  547. display: flex;
  548. align-items: center;
  549. justify-content: center
  550. }
  551. .btn-draw {
  552. background: url(../images/btn-draw.png);
  553. background-size: 100% 100%
  554. }
  555. .btn-cancel {
  556. background: url(../images/btn-cancel.png);
  557. background-size: 100% 100%
  558. }
  559. .dialog-confirm {
  560. position: fixed;
  561. top: 40%;
  562. left: 0.62rem;
  563. right: 0.62rem;
  564. height: 3.6rem;
  565. border-radius: 0.2rem;
  566. z-index: 9992;
  567. background: #ffffff;
  568. animation: frames-top-center-01 300ms
  569. }
  570. .dialog-confirm .content {
  571. color: #000;
  572. font-size: 0.32rem;
  573. height: 1.8rem;
  574. text-align: center;
  575. line-height: 0.5rem;
  576. margin: 0.6rem 0.42rem 0
  577. }
  578. .dialog-confirm .actions {
  579. font-size: 0.3rem;
  580. display: flex;
  581. align-items: center;
  582. justify-content: space-between;
  583. margin: 0 0.6rem
  584. }
  585. .dialog-confirm .actions .btn {
  586. color: #a300c6;
  587. font-size: 0.3rem;
  588. width: 2.2rem;
  589. height: 0.8rem;
  590. display: flex;
  591. align-items: center;
  592. justify-content: center;
  593. border-radius: 0.1rem;
  594. background: #ded5e0
  595. }
  596. .dialog-confirm .actions .okay {
  597. color: white;
  598. float: left;
  599. background: #a300c6
  600. }
  601. .dialog-alert {
  602. top: 40%;
  603. animation: frames-top-center-01 400ms
  604. }
  605. .dialog-alert .actions .btn {
  606. background: linear-gradient(-90deg, #a300c6, #a300c6)
  607. }
  608. .dialog-message {
  609. top: 40%;
  610. left: .82rem;
  611. right: .82rem;
  612. z-index: 9998;
  613. position: fixed;
  614. height: auto;
  615. min-height: auto;
  616. background: url(../images/bg-dialog.png) no-repeat;
  617. background-size: 100% 100%
  618. }
  619. .dialog-message h1 {
  620. font-size: 0.36rem;
  621. font-weight: bold;
  622. text-align: center;
  623. margin-top: 0.5rem
  624. }
  625. .dialog-message .content {
  626. color: white;
  627. font-size: 0.36rem;
  628. min-height: 1.17rem;
  629. margin: 0.4rem 0.8rem 0.2rem;
  630. display: flex;
  631. align-items: center;
  632. justify-content: center
  633. }
  634. .dialog-message .actions {
  635. height: 1.32rem;
  636. display: flex;
  637. justify-content: center
  638. }
  639. .dialog-message .actions .btn {
  640. color: white;
  641. font-size: 0.36rem;
  642. width: 3.3rem;
  643. height: 0.82rem;
  644. display: flex;
  645. align-items: center;
  646. justify-content: center;
  647. background: url("../images/btn-ok.png") no-repeat;
  648. background-size: 100% 100%
  649. }
  650. #uniauthframe {
  651. width: 100%;
  652. height: 100%;
  653. position: fixed;
  654. top: 0px;
  655. left: 0px;
  656. margin: 0px;
  657. padding: 0px;
  658. border: 0px;
  659. animation: capauth-zoom-in 600ms
  660. }
  661. .ordertrack {
  662. color: #b10fff;
  663. font-size: 0.3rem;
  664. margin: 0.3rem;
  665. display: flex;
  666. align-items: center;
  667. justify-content: center
  668. }
  669. .ordertrack .btn-ordertrack {
  670. border-bottom: 0.01rem solid #a60dff
  671. }