index.wxss 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. @charset "UTF-8";
  2. /* 水平间距 */
  3. /* 水平间距 */
  4. .main.data-v-4dcceeb0 {
  5. display: flex;
  6. flex-direction: column;
  7. width: 100vw;
  8. height: 100vh;
  9. background-image: linear-gradient(to top, #f1f1f1, #007aff);
  10. }
  11. .main .one.data-v-4dcceeb0 {
  12. height: 45vw;
  13. }
  14. .main .one .one_1.data-v-4dcceeb0 {
  15. padding: 4vw;
  16. }
  17. .main .one .one_1 .top.data-v-4dcceeb0 {
  18. display: flex;
  19. align-items: center;
  20. font-size: var(--font18Size);
  21. }
  22. .main .one .one_1 .top .image.data-v-4dcceeb0 {
  23. width: 15vw;
  24. height: 15vw;
  25. border-radius: 15vw;
  26. margin: 0 2vw;
  27. }
  28. .main .one .one_1 .top .iconfont.data-v-4dcceeb0 {
  29. font-size: 40px;
  30. color: var(--f85Color);
  31. padding: 2vw;
  32. }
  33. .main .one .one_2.data-v-4dcceeb0 {
  34. padding: 5vw;
  35. }
  36. .main .one .one_2 .bottom.data-v-4dcceeb0 {
  37. display: flex;
  38. justify-content: space-around;
  39. }
  40. .main .one .one_2 .bottom .list.data-v-4dcceeb0 {
  41. display: flex;
  42. flex-direction: column;
  43. align-items: center;
  44. }
  45. .main .two.data-v-4dcceeb0 {
  46. display: flex;
  47. flex-direction: column;
  48. padding: 2vw;
  49. margin: 2vw;
  50. border-radius: 10px;
  51. background-color: var(--mainColor);
  52. }
  53. .main .two .two_1.data-v-4dcceeb0 {
  54. display: flex;
  55. justify-content: space-between;
  56. padding: 2vw;
  57. border-bottom: 1px solid var(--f9Color);
  58. }
  59. .main .two .two_1 .left.data-v-4dcceeb0 {
  60. font-weight: 600;
  61. font-size: var(--font14Size);
  62. }
  63. .main .two .two_1 .right.data-v-4dcceeb0 {
  64. display: flex;
  65. align-items: center;
  66. font-size: var(--font12Size);
  67. color: var(--f99Color);
  68. }
  69. .main .two .two_2.data-v-4dcceeb0 {
  70. display: flex;
  71. justify-content: space-between;
  72. padding: 3vw 4vw;
  73. }
  74. .main .two .two_2 .list.data-v-4dcceeb0 {
  75. display: flex;
  76. flex-direction: column;
  77. align-items: center;
  78. justify-content: center;
  79. text-align: center;
  80. }
  81. .main .two .two_2 .list .icon .iconfont.data-v-4dcceeb0 {
  82. font-size: 25px;
  83. }
  84. .main .two .two_2 .list .title.data-v-4dcceeb0 {
  85. display: inline-block;
  86. margin: 1vw 0 0 0;
  87. font-size: var(--font12Size);
  88. }
  89. .main .thr.data-v-4dcceeb0 {
  90. display: flex;
  91. flex-direction: column;
  92. padding: 2vw;
  93. margin: 0 2vw;
  94. border-radius: 10px;
  95. background-color: var(--mainColor);
  96. }
  97. .main .thr .list.data-v-4dcceeb0 {
  98. display: flex;
  99. justify-content: space-between;
  100. padding: 2vw;
  101. border-bottom: 1px solid var(--f9Color);
  102. }
  103. .main .thr .list .left.data-v-4dcceeb0 {
  104. display: flex;
  105. align-items: center;
  106. font-size: var(--font12Size);
  107. }
  108. .main .thr .list .left .icon.data-v-4dcceeb0 {
  109. padding: 0 1vw 0 0;
  110. }
  111. .main .thr .list .left .icon .iconfont.data-v-4dcceeb0 {
  112. color: var(--f3CColor);
  113. font-size: var(--font18Size);
  114. }
  115. .main .thr .list .left .title.data-v-4dcceeb0 {
  116. display: inline-block;
  117. font-size: var(--font12Size);
  118. }
  119. .main .thr .list .right.data-v-4dcceeb0 {
  120. display: flex;
  121. align-items: center;
  122. font-size: var(--font12Size);
  123. color: var(--f99Color);
  124. }