C端小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

638 line
9.5 KiB

  1. @import "../../../app.wxss";
  2. page {
  3. background: #fff;
  4. }
  5. button::after{ border: none; }
  6. .coupons {
  7. width: 100%;
  8. position: relative;
  9. overflow: hidden;
  10. padding-bottom: 170rpx;
  11. }
  12. .banner {
  13. position: relative;
  14. width: 750rpx;
  15. height: 534.5rpx;
  16. }
  17. .banner image {
  18. width: 100%;
  19. height: 100%;
  20. }
  21. .coupons_info {
  22. width: 92%;
  23. padding: 0 4%;
  24. background: #fff;
  25. border-top-left-radius: 20rpx;
  26. border-top-right-radius: 20rpx;
  27. margin-top: -25rpx;
  28. }
  29. .fenxiang {
  30. position: absolute;
  31. right: 28rpx;
  32. top: 27rpx;
  33. width: 108rpx;
  34. }
  35. .fenxiang image {
  36. width: 108rpx;
  37. position: absolute;
  38. top: 0;
  39. right: 0;
  40. }
  41. .user-motto {
  42. width: 118rpx;
  43. border: 0;
  44. background: none;
  45. height: 60rpx;
  46. color: #fff;
  47. }
  48. .user-motto::after {
  49. border: none;
  50. }
  51. .title {
  52. display: block;
  53. font-size: 32rpx;
  54. color: #000;
  55. letter-spacing: 1.09rpx;
  56. line-height: 45rpx;
  57. width: 542rpx;
  58. overflow: hidden;
  59. white-space: nowrap;
  60. text-overflow: ellipsis;
  61. padding-top: 30rpx;
  62. }
  63. .subTitle {
  64. display: block;
  65. width: 588rpx;
  66. /* height: 37rpx; */
  67. font-size: 26rpx;
  68. color: #999;
  69. letter-spacing: 1.16rpx;
  70. overflow: hidden;
  71. white-space: nowrap;
  72. text-overflow: ellipsis;
  73. padding: 6rpx 0;
  74. }
  75. .rest {
  76. font-size: 24rpx;
  77. color: #919191;
  78. letter-spacing: 0;
  79. height: 70rpx;
  80. line-height: 70rpx;
  81. /* border-bottom: 1px solid #eee; */
  82. border-bottom: 1px solid #f9f9f9;
  83. }
  84. .restNum {
  85. font-size: 24rpx;
  86. color: #999;
  87. letter-spacing: 1.16rpx;
  88. text-align: right;
  89. }
  90. .time {
  91. font-size: 24rpx;
  92. color: #333;
  93. letter-spacing: 0;
  94. line-height: 33rpx;
  95. display: inline-block;
  96. }
  97. .txt01 {
  98. font-size: 24rpx;
  99. color: #919191;
  100. letter-spacing: 0;
  101. }
  102. .price {
  103. font-size: 24rpx;
  104. color: #999;
  105. letter-spacing: 0;
  106. }
  107. .salePriceStr {
  108. font-size: 24rpx;
  109. color: #999;
  110. letter-spacing: 0;
  111. }
  112. .salePriceStr .pri01 {
  113. font-size: 40rpx;
  114. color: #ff4949;
  115. letter-spacing: 0;
  116. }
  117. .use{
  118. color: #ff4949;
  119. }
  120. .salePriceStr .yuan {
  121. font-size: 24rpx;
  122. color: #ff4949;
  123. letter-spacing: 0;
  124. }
  125. .price text {
  126. font-size: 24rpx;
  127. color: #333;
  128. letter-spacing: 0;
  129. }
  130. .throgh {
  131. text-decoration: line-through;
  132. margin-left: 10rpx;
  133. color: #999!important;
  134. }
  135. .fl {
  136. float: left;
  137. color: red;
  138. }
  139. .fr {
  140. float: right;
  141. }
  142. .posi {
  143. position: relative;
  144. width: 92%;
  145. margin: 0 auto;
  146. }
  147. .posi>view:nth-child(2) {
  148. width: 100%;
  149. display: flex;
  150. justify-content: space-between;
  151. }
  152. .posi>view:nth-child(2) text:nth-child(1) {
  153. font-size: 30rpx;
  154. color: #a9a9a9;
  155. }
  156. .posi>view:nth-child(2) text:nth-child(2) {
  157. font-size: 30rpx;
  158. color: #a9a9a9;
  159. }
  160. .posi_logo {
  161. width: 100%;
  162. display: flex;
  163. padding: 20rpx 0;
  164. background: #fff;
  165. }
  166. .posi_logo view:nth-child(1) {
  167. width: 100rpx;
  168. border-radius: 16rpx;
  169. height: 100rpx;
  170. }
  171. .posi_logo view:nth-child(1) image {
  172. display: block;
  173. width: 100rpx;
  174. height: 100rpx;
  175. border-radius: 16rpx;
  176. border: 1px solid #e5e5e5;
  177. }
  178. .posi_logo view:nth-child(2) {
  179. display: flex;
  180. flex-direction: column;
  181. flex: 8;
  182. padding-left: 30rpx;
  183. }
  184. .posi_logo view:nth-child(2) text:nth-child(1) {
  185. font-size: 32rpx;
  186. color: #333;
  187. letter-spacing: 0;
  188. height:55rpx;
  189. line-height:64rpx;
  190. white-space: nowrap;
  191. text-overflow: ellipsis;
  192. overflow: hidden;
  193. }
  194. .posi_logo view:nth-child(2) text:nth-child(2) {
  195. font-size: 24rpx;
  196. color: #b8b8b8;
  197. padding-top: 3rpx;
  198. width: 450rpx;
  199. height:41rpx;
  200. line-height:40rpx;
  201. white-space: nowrap;
  202. text-overflow: ellipsis;
  203. overflow: hidden;
  204. }
  205. .notes view:nth-child(1) {
  206. height: 87rpx;
  207. line-height: 87rpx;
  208. background: #fff;
  209. border-top: 1px solid #f9f9f9;
  210. }
  211. .notes {
  212. width: 92%;
  213. margin: 0 auto;
  214. }
  215. .active {
  216. opacity: 0.6;
  217. }
  218. .notes view:nth-child(1) text {
  219. color: #333;
  220. letter-spacing: 0;
  221. font-size: 30rpx;
  222. height: 70rpx;
  223. line-height: 70rpx;
  224. }
  225. .notes view:nth-child(2) {
  226. background: #fff;
  227. display: flex;
  228. flex-direction: column;
  229. }
  230. .notes view:nth-child(2)>text {
  231. font-size: 24rpx;
  232. color: #919191;
  233. letter-spacing: 0;
  234. line-height: 42rpx;
  235. }
  236. .buy-view {
  237. background: #fff;
  238. height: 96rpx;
  239. bottom: 0;
  240. left: 0;
  241. right: 0;
  242. padding-bottom: 22rpx;
  243. padding-top: 22rpx;
  244. }
  245. .buy {
  246. position: relative;
  247. background: #00c0ff;
  248. height: 94rpx;
  249. width: 560rpx;
  250. margin: 0 auto 30rpx;
  251. color: #fff;
  252. font-size: 36rpx;
  253. line-height: 94rpx;
  254. border-radius: 61rpx;
  255. }
  256. .goback{
  257. position: relative;
  258. float: left;
  259. width:122rpx!important;
  260. height:95rpx;
  261. background:rgba(255,255,255,1);
  262. line-height: 95rpx;
  263. border:1rpx solid rgba(227,227,227,1);
  264. box-shadow:0px 8px 8px 1px rgba(189,189,189,0.32);
  265. border-radius:48rpx;
  266. margin-left: 25rpx;
  267. }
  268. .goback image{
  269. position: absolute;
  270. width: 60rpx;
  271. left: 0;
  272. right: 0;
  273. top: 0;
  274. bottom: 0;
  275. margin: auto;
  276. }
  277. .tel {
  278. right: 0;
  279. top: 0;
  280. bottom: 0;
  281. margin: auto;
  282. width: 50rpx;
  283. height: 50rpx;
  284. }
  285. .txt {
  286. margin-right: 30rpx;
  287. }
  288. .distance {
  289. border: none;
  290. border-radius: 16rpx;
  291. width: 600rpx;
  292. padding: 16rpx 6rpx 0 0;
  293. }
  294. .distance .txt01 {
  295. display: block;
  296. font-size: 26rpx;
  297. color: #ff4949;
  298. }
  299. .clock {
  300. width: 116rpx !important;
  301. vertical-align: middle;
  302. margin-right: 10rpx;
  303. margin-top: -4rpx;
  304. }
  305. .qiang {
  306. position: inline-block;
  307. width: 60rpx;
  308. height: 40rpx;
  309. line-height: 40rpx;
  310. color: #ff4949;
  311. text-align: center;
  312. font-size: 28rpx;
  313. margin-right: 10rpx;
  314. }
  315. .times {
  316. display: inline-block;
  317. color: #ff4949;
  318. font-weight: bold;
  319. font-size: 26rpx;
  320. text-align: center;
  321. }
  322. .times text {
  323. display: inline-block;
  324. margin: 6rpx;
  325. width: 46rpx;
  326. height: 56rpx;
  327. text-align: center;
  328. font-size: 28rpx;
  329. line-height: 60rpx;
  330. border-radius: 12rpx;
  331. color: #fff;
  332. font-weight: bold;
  333. background: #ff4949;
  334. }
  335. .b1 {
  336. position: fixed;
  337. top: 0px;
  338. bottom: 0px;
  339. left: 0px;
  340. right: 0px;
  341. background: rgba(0, 0, 0, 0.8);
  342. overflow: hidden;
  343. z-index: 10;
  344. }
  345. .con {
  346. position: absolute;
  347. top: 35rpx;
  348. right: 0;
  349. bottom: 0;
  350. left: 0;
  351. margin: auto;
  352. width: 587rpx;
  353. }
  354. .con .image {
  355. display: block;
  356. width: 100%;
  357. }
  358. .img {
  359. margin-top: -50rpx;
  360. }
  361. .question {
  362. display: block;
  363. width: 587rpx;
  364. background: #fff;
  365. border-bottom-left-radius: 22rpx;
  366. border-bottom-right-radius: 22rpx;
  367. overflow: hidden;
  368. }
  369. .ques {
  370. display: block;
  371. width: 511rpx;
  372. margin: 0 auto;
  373. height: 95rpx;
  374. line-height: 95rpx;
  375. font-size: 30rpx;
  376. color: #333;
  377. border-bottom: 1rpx solid #eee;
  378. }
  379. .titles {
  380. width: 511rpx;
  381. display: block;
  382. text-align: center;
  383. height: 50rpx;
  384. margin: 0 auto;
  385. padding-top: 10rpx;
  386. padding-bottom: 20rpx;
  387. font-size: 32rpx;
  388. font-weight: bold;
  389. line-height: 41rpx;
  390. border-bottom: 1rpx solid #eee;
  391. }
  392. .quessss >view:last-child {
  393. border-bottom: 0;
  394. }
  395. .close {
  396. position: relative;
  397. z-index: 10000;
  398. display: block;
  399. width: 70rpx;
  400. }
  401. .ques_gou {
  402. position: absolute;
  403. width: 20rpx;
  404. top: 160rpx;
  405. left: 23rpx;
  406. }
  407. .btnss {
  408. color: #f8755b;
  409. font-weight: bold;
  410. font-size: 30rpx !important;
  411. text-align: center !important;
  412. }
  413. .radios {
  414. display: block;
  415. font-size: 28rpx;
  416. height: 95rpx;
  417. line-height: 95rpx;
  418. color: #333;
  419. text-indent: 0.5em;
  420. }
  421. .elecard {
  422. display: inline-block;
  423. margin-left: 6rpx;
  424. color: #00c0ff;
  425. border: 1px solid #00c0ff;
  426. border-radius: 8rpx;
  427. font-style: normal;
  428. font-size: 30rpx;
  429. line-height: 40rpx;
  430. padding: 0 6rpx;
  431. }
  432. .applyshop {
  433. font-size: 30rpx;
  434. height: 70rpx;
  435. line-height: 70rpx;
  436. color: #333;
  437. text-indent:1em;
  438. }
  439. .btns{
  440. padding: 0 33rpx;
  441. position: fixed;
  442. left: 0;
  443. right: 0;
  444. bottom: 0;
  445. padding-bottom: 37rpx;
  446. padding-top:37rpx;
  447. z-index: 100;
  448. background: #fff;
  449. }
  450. .btns > button{
  451. width: 330rpx;
  452. height: 95rpx;
  453. border-radius:48rpx;
  454. text-align: center;
  455. }
  456. .btns .fl{
  457. color: #fff;
  458. background:rgba(255,169,2,1);
  459. box-shadow:0px 8px 8px 1px rgba(255,169,2,0.32);
  460. }
  461. .btns .fl text{
  462. display: block;
  463. font-size: 30rpx;
  464. line-height: 34rpx;
  465. }
  466. .btns .fl text:nth-of-type(1){
  467. margin-top: 12rpx;
  468. }
  469. .btns .fr{
  470. font-size: 30rpx;
  471. color: #fff;
  472. line-height: 95rpx;
  473. background:rgba(236,59,45,1);
  474. box-shadow:0px 8px 8px 1px rgba(246,93,51,0.32);
  475. }
  476. .support-tansfer{
  477. width: 60%;
  478. border-radius: 50rpx;
  479. margin-top: 30rpx;
  480. background: #02C0FF!important;
  481. }
  482. .shaddow{
  483. z-index: 100;
  484. position:fixed;
  485. width:100%;
  486. height:100%;
  487. top:0px;
  488. background:rgba(0,0,0,0.8);
  489. overflow:hidden;
  490. }
  491. .alert-box{
  492. position: fixed;
  493. top: 200rpx;
  494. left: 10%;
  495. width: 80%;
  496. height: auto;
  497. padding-bottom: 20rpx;
  498. background: #fff;
  499. z-index: 200;
  500. border-radius: 20rpx;
  501. }
  502. .user-img{
  503. position: absolute;
  504. top: -50rpx;
  505. left: 250rpx;
  506. /* margin-left: -50rpx; */
  507. width: 100rpx;
  508. height: 100rpx;
  509. z-index: 300;
  510. border-radius: 50rpx;
  511. background: #fff;
  512. overflow: hidden;
  513. }
  514. .user-img image{
  515. width: 100rpx;
  516. height: 100rpx;
  517. }
  518. .close{
  519. position: absolute;
  520. z-index: 300;
  521. right: 0;
  522. top: 0;
  523. width: 100rpx;
  524. height: 100rpx;
  525. overflow: hidden;
  526. }
  527. .close image{
  528. display: block;
  529. width: 26rpx;
  530. height: 26rpx;
  531. margin: 20rpx 0 0 52rpx;
  532. }
  533. .a-title{
  534. text-align: center;
  535. margin-top: 76rpx;
  536. font-size:36rpx;
  537. font-family:PingFang-SC-Medium;
  538. font-weight:500;
  539. color:rgba(51,51,51,1);
  540. line-height:44rpx;
  541. }
  542. .a-img{
  543. position: relative;
  544. width: 80%;
  545. border-radius: 20rpx;
  546. height: 294rpx;
  547. overflow: hidden;
  548. text-align: center;
  549. margin: 30rpx auto 0;
  550. }
  551. .a-received{
  552. position: absolute;
  553. width: 100%;
  554. height: 294rpx;
  555. top: 0;
  556. left: 0;
  557. text-align: center;
  558. line-height: 294rpx;
  559. z-index: 320;
  560. background:rgba(255,255,255,1);
  561. border:0px solid rgba(151,57,117,1);
  562. opacity:0.91;
  563. font-size:36rpx;
  564. color:rgba(255,51,50,1);
  565. font-family:PingFang-SC-Medium;
  566. }
  567. .a-img image{
  568. width: 100%;
  569. height: 100%;
  570. }
  571. .bottom{
  572. text-align: center;
  573. height: 70rpx;
  574. line-height: 70rpx;
  575. color: #999;
  576. font-size: 32rpx;
  577. }