C端小程序
25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

362 lines
5.4 KiB

  1. .market {
  2. width: 100%;
  3. height: 100%;
  4. background: #F4F5F9;
  5. }
  6. .tabs {
  7. width: 100% !important;
  8. height: 96rpx;
  9. text-align: center;
  10. position: fixed;
  11. left: 0;
  12. right: 0;
  13. z-index: 100000;
  14. background: #fff;
  15. }
  16. .i-tab {
  17. width: 25% !important;
  18. display: inline-block;
  19. }
  20. .section {
  21. position: relative;
  22. width: 710rpx;
  23. height: 240rpx;
  24. margin: 0 auto 20rpx;
  25. padding: 20rpx 0;
  26. border-radius: 16rpx;
  27. background: #fff;
  28. /* background-color: rgba(0,0,0,0.3); */
  29. }
  30. .mms {
  31. position: relative;
  32. width: 670rpx;
  33. background: #fff;
  34. height: 238rpx;
  35. margin: 0 auto 30rpx;
  36. box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.10);
  37. }
  38. .cover-img {
  39. position: absolute;
  40. left: 0;
  41. top: 0;
  42. width: 100%;
  43. height: 100%;
  44. background-color: rgba(0, 0, 0, 0.3);
  45. z-index: 0;
  46. border-radius: 12px;
  47. border-radius: 20px solid red;
  48. /* object-fit:contain */
  49. }
  50. .gray-bg {
  51. width: 100%;
  52. height: 100%;
  53. position: absolute;
  54. left: 0;
  55. top: 0;
  56. z-index: 10;
  57. background-color: rgba(0, 0, 0, .7);
  58. /* background: rgba(0,0,0,.7); */
  59. border-radius: 12px;
  60. border-radius: 20px solid red;
  61. background-size: cover;
  62. }
  63. .yu {
  64. display: inline-block !important;
  65. font-size: 30rpx !important;
  66. }
  67. .expiretime {
  68. width: 250rpx;
  69. }
  70. .expiretime text {
  71. display: block;
  72. font-size: 30rpx;
  73. font-weight: 500;
  74. white-space: nowrap;
  75. text-align: right;
  76. text-overflow: ellipsis;
  77. overflow: hidden;
  78. margin-top: 35rpx;
  79. margin-right: 10rpx;
  80. color: rgba(255, 255, 255, 1);
  81. }
  82. .money {
  83. margin-left: 10rpx;
  84. font-size: 30rpx;
  85. font-weight: bold;
  86. }
  87. .liness {
  88. display: block;
  89. width: 100%;
  90. }
  91. .logo {
  92. width: 60rpx;
  93. height: 60rpx;
  94. border: 1px solid #f8f8f8;
  95. border-radius: 50rpx;
  96. display: block;
  97. margin-left: 20rpx;
  98. }
  99. .logo image {
  100. width: 60rpx;
  101. height: 60rpx;
  102. border-radius: 50%;
  103. }
  104. .info {
  105. width: 100%;
  106. }
  107. .info .title .yue {
  108. font-size: 60rpx;
  109. line-height: 60rpx;
  110. font-weight: bold;
  111. color: #fff;
  112. letter-spacing: 0;
  113. width: 400rpx;
  114. display: inline-block;
  115. white-space: nowrap;
  116. text-overflow: ellipsis;
  117. overflow: hidden;
  118. margin-bottom: 10rpx;
  119. margin-top: 23rpx;
  120. text-align: left;
  121. }
  122. .info>view view:nth-child(2) {
  123. display: inline-block;
  124. width: 220rpx;
  125. font-size: 26rpx;
  126. color: #fff;
  127. letter-spacing: 0;
  128. margin-top: 6rpx;
  129. white-space: nowrap;
  130. text-overflow: ellipsis;
  131. overflow: hidden;
  132. margin-right: 25rpx;
  133. }
  134. .btns {
  135. position: absolute;
  136. right: 25rpx;
  137. bottom: -12rpx;
  138. text-align: center;
  139. font-size: 28rpx;
  140. width: 250rpx !important;
  141. height: 61rpx;
  142. line-height: 61rpx;
  143. background: rgba(255, 255, 255, 1);
  144. border-radius: 30rpx;
  145. z-index: 100;
  146. color: #FD832D !important;
  147. }
  148. .active {
  149. color: #fff;
  150. opacity: 0.9;
  151. }
  152. .txt1 {
  153. font-size: 24rpx;
  154. color: #fff;
  155. letter-spacing: 0;
  156. }
  157. .nocoupon image {
  158. width: 300rpx;
  159. display: block;
  160. margin: 3% auto 0;
  161. }
  162. .txt001 {
  163. display: block;
  164. line-height: 48rpx;
  165. font-size: 34rpx;
  166. color: #333;
  167. letter-spacing: 0;
  168. text-align: center;
  169. }
  170. .txt002 {
  171. display: block;
  172. margin-top: 1%;
  173. font-size: 28rpx;
  174. color: #999;
  175. letter-spacing: 0;
  176. line-height: 40rpx;
  177. text-align: center;
  178. }
  179. .nocoupon button {
  180. background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%);
  181. color: #fff;
  182. font-style: 30rpx;
  183. width: 100%;
  184. border-radius: 60rpx;
  185. }
  186. .loading {
  187. text-align: center;
  188. height: 80rpx;
  189. line-height: 80rpx;
  190. font-size: 26rpx;
  191. color: #999;
  192. }
  193. .loading image {
  194. width: 60rpx;
  195. height: 60rpx;
  196. vertical-align: middle;
  197. margin-right: 10rpx;
  198. }
  199. /* .active {
  200. opacity: 0.6;
  201. } */
  202. .nav {
  203. position: absolute;
  204. bottom: 3.3%;
  205. left: 0;
  206. right: 0;
  207. margin: auto;
  208. width: 670rpx;
  209. border-radius: 60rpx;
  210. background: #02c0ff;
  211. font-size: 32px;
  212. color: #fff;
  213. text-align: center;
  214. line-height: 32px;
  215. }
  216. .title {
  217. width: 50%;
  218. }
  219. .title text {
  220. display: block;
  221. color: #fff;
  222. font-size: 24rpx;
  223. margin-left: 25rpx;
  224. text-align: left;
  225. }
  226. .txt2 {
  227. margin-top: 36rpx;
  228. }
  229. .imgicon {
  230. position: absolute;
  231. width: 140rpx;
  232. height: 100rpx;
  233. z-index: 100;
  234. right: 257rpx;
  235. top: 0;
  236. }
  237. .imgicon image {
  238. width: 100%;
  239. }
  240. .buyagain {
  241. width: 162rpx;
  242. height: 57rpx;
  243. background: rgba(255, 255, 255, 1);
  244. border-radius: 10rpx;
  245. font-size: 24rpx;
  246. color: rgba(51, 51, 51, 1);
  247. margin-right: 25rpx;
  248. margin-top: 11rpx;
  249. }
  250. .txtstatus {
  251. height: 80rpx;
  252. font-size: 24rpx;
  253. color: rgba(255, 53, 53, 1);
  254. margin-left: 30rpx;
  255. }
  256. .userule {
  257. text-align: center;
  258. font-size: 28rpx;
  259. font-family: PingFang-SC-Regular;
  260. font-weight: 400;
  261. color: #FD832D;
  262. margin-top: 30rpx;
  263. background: #fff;
  264. position: fixed;
  265. bottom: 0;
  266. left: 0;
  267. width: 100%;
  268. height: 80rpx;
  269. line-height: 80rpx;
  270. z-index: 100;
  271. }
  272. .yue text:nth-of-type(1) {
  273. margin-right: 6rpx;
  274. }
  275. .yue text:nth-of-type(2) {
  276. margin-left: 6rpx;
  277. }
  278. .cantransferred {
  279. position: absolute;
  280. right: 0;
  281. top: 0;
  282. width: 60rpx;
  283. height: 60rpx;
  284. z-index: 999;
  285. }
  286. button::after {
  287. border: none;
  288. }
  289. .goback {
  290. position: fixed;
  291. right: 50rpx;
  292. bottom: 60rpx;
  293. width: 100rpx !important;
  294. height: 100rpx;
  295. z-index: 100;
  296. background: rgba(255, 255, 255, 1);
  297. line-height: 95rpx;
  298. border: 1rpx solid rgba(227, 227, 227, 1);
  299. border-radius: 50%;
  300. }
  301. .goback image {
  302. position: absolute;
  303. width: 60rpx;
  304. left: 0;
  305. right: 0;
  306. top: 0;
  307. bottom: 0;
  308. margin: auto;
  309. }
  310. .detail_msg {
  311. position: absolute;
  312. left: 0;
  313. z-index: 100;
  314. height: 100%;
  315. background-color: rgba(0, 0, 0, 0.7);
  316. border-radius: 12rpx;
  317. }