index.css 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292
  1. .content {
  2. position: relative;
  3. }
  4. .base_img {
  5. width: 100%;
  6. height: 14.53rem;
  7. position: absolute;
  8. top: 0;
  9. left: 0;
  10. right: 0;
  11. z-index: -1;
  12. }
  13. .top{
  14. width: 100%;
  15. height: 0.24rem;
  16. line-height: .24rem;
  17. background:rgba(188,244,85, .4);
  18. color: #1E6461;
  19. font-size: .12rem;
  20. }
  21. .top img {
  22. width: .12rem;
  23. height: .12rem;
  24. vertical-align: middle;
  25. margin-left: .15rem;
  26. margin-right: .07rem;
  27. }
  28. .title {
  29. font-size: .31rem;
  30. color: #fff;
  31. text-align: center;
  32. margin-top: .1rem;
  33. }
  34. .book_plan {
  35. font-size: .19rem;
  36. text-align: center;
  37. position: relative;
  38. width: 100%;
  39. height: .4rem;
  40. line-height: .4rem;
  41. margin-top: .05rem;
  42. color: #fff;
  43. }
  44. .book_plan .line {
  45. width: 2.98rem;
  46. height: .4rem;
  47. position: absolute;
  48. top: 0;
  49. left: 50%;
  50. transform: translate(-50%, 0);
  51. }
  52. .book_plan .money {
  53. color: #0D798E;
  54. }
  55. .book_plan .day_num {
  56. color: #FFDD59;
  57. }
  58. .sign {
  59. text-align: center;
  60. font-size: .19rem;
  61. font-weight:600;
  62. font-style:italic;
  63. color: #484848;
  64. margin-top: 3.2rem;
  65. }
  66. .sign .rmb {
  67. color: #FB3030;
  68. }
  69. .sign .original {
  70. text-decoration: line-through;
  71. }
  72. .limit {
  73. text-align: center;
  74. font-size: .19rem;
  75. font-weight:600;
  76. font-style:italic;
  77. color: #484848;
  78. }
  79. .btn {
  80. font-size: .2rem;
  81. width: 1.9rem;
  82. margin: .09rem auto;
  83. height: .43rem;
  84. line-height: .43rem;
  85. background: linear-gradient(0deg,rgba(9,150,95,1) 0%,rgba(75,182,103,1) 100%);
  86. border-radius: .22rem;
  87. font-weight:600;
  88. color: #FFF;
  89. text-align: center;
  90. }
  91. .bottom_btn {
  92. display: flex;
  93. justify-content: space-around;
  94. min-height: .5rem;
  95. position: fixed;
  96. bottom: 0;
  97. left: 0;
  98. right: 0;
  99. background:#2DBBB7;
  100. color: #1E6461;
  101. font-size: .12rem;
  102. }
  103. .bottom_btn .left {
  104. text-align: center;
  105. }
  106. .bottom_btn .left div {
  107. margin-top: .05rem;
  108. }
  109. .bottom_btn .left .red {
  110. color: #FB3030;
  111. }
  112. .bottom_btn .btn_now {
  113. width: 1rem;
  114. height: .35rem;
  115. line-height: .35rem;
  116. color: #fff;
  117. text-align: center;
  118. background: linear-gradient(0deg,rgba(9,150,95,1) 0%,rgba(75,182,103,1) 100%);
  119. border-radius: .22rem;
  120. font-weight:600;
  121. margin-top: .05rem;
  122. }
  123. /*二维码弹框*/
  124. #success_code .mask_pop {
  125. position: fixed;
  126. top: 0;
  127. left: 0;
  128. right: 0;
  129. bottom: 0;
  130. background: #000;
  131. opacity: 0.5;
  132. filter: alpha(opacity=50);
  133. }
  134. #success_code .mask_warp{
  135. width: 2.74rem;
  136. height: 3.27rem;
  137. background: #fff;
  138. position: fixed;
  139. top: 50%;
  140. left: 50%;
  141. border-radius: 0.24rem;
  142. transform: translate(-50%,-50%);
  143. }
  144. #success_code .green {
  145. position: fixed;
  146. top: -0.62rem;
  147. left: -0.085rem;
  148. right: 0;
  149. width: 2.91rem;
  150. height: 1.84rem;
  151. }
  152. #success_code .top {
  153. position: relative;
  154. z-index: 10;
  155. color: #fff;
  156. margin-top: 0.4rem;
  157. text-align: center;
  158. background: transparent;
  159. }
  160. #success_code .top .apply {
  161. font-size: .26rem;
  162. }
  163. #success_code .top .today {
  164. font-size: .15rem;
  165. }
  166. #success_code .down {
  167. margin-top: 0.2rem;
  168. }
  169. #success_code .down .txt {
  170. text-align: center;
  171. font-size: .12rem;
  172. color: #005360;
  173. }
  174. #success_code .code {
  175. margin-top: 0.65rem;
  176. width: 100%;
  177. height: 1.06rem;
  178. text-align: center;
  179. }
  180. #success_code .code .qrcode {
  181. width: 1.06rem;
  182. height: 1.06rem;
  183. }
  184. #success_code .wrong {
  185. position: absolute;
  186. width: .32rem;
  187. height: .32rem;
  188. bottom: -0.44rem;
  189. left: 50%;
  190. transform: translate(-50%, 0%);
  191. }
  192. /*成功弹窗*/
  193. #success_normal .mask_pop {
  194. position: fixed;
  195. top: 0;
  196. left: 0;
  197. right: 0;
  198. bottom: 0;
  199. background: #000;
  200. opacity: 0.5;
  201. filter: alpha(opacity=50);
  202. }
  203. #success_normal .mask_warp{
  204. width: 2.74rem;
  205. height: 2.88rem;
  206. background: #fff;
  207. position: fixed;
  208. top: 50%;
  209. left: 50%;
  210. border-radius: 0.24rem;
  211. transform: translate(-50%,-50%);
  212. }
  213. #success_normal .green {
  214. position: fixed;
  215. top: -0.62rem;
  216. left: -0.085rem;
  217. right: 0;
  218. /*width: 2.91rem;*/
  219. height: 1.84rem;
  220. }
  221. #success_normal .top {
  222. position: relative;
  223. z-index: 10;
  224. color: #fff;
  225. margin-top: 0.6rem;
  226. text-align: center;
  227. background: transparent;
  228. }
  229. #success_normal .top .apply {
  230. font-size: .26rem;
  231. }
  232. #success_normal .top .today {
  233. font-size: .15rem;
  234. }
  235. #success_normal .down {
  236. margin-top: 0.5rem;
  237. }
  238. #success_normal .down .txt {
  239. text-align: center;
  240. font-size: .13rem;
  241. color: #005360;
  242. }
  243. #success_normal .btn {
  244. font-size: .2rem;
  245. width: 1.9rem;
  246. margin: .30rem auto;
  247. height: .43rem;
  248. line-height: .43rem;
  249. background: linear-gradient(0deg,rgba(9,150,95,1) 0%,rgba(75,182,103,1) 100%);
  250. border-radius: .22rem;
  251. font-weight:600;
  252. color: #FFF;
  253. text-align: center;
  254. }
  255. #success_normal .wrong {
  256. position: absolute;
  257. width: .32rem;
  258. height: .32rem;
  259. bottom: -0.44rem;
  260. left: 50%;
  261. transform: translate(-50%, 0%);
  262. }