index.wxss 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  1. page{
  2. overflow-x: hidden;
  3. }
  4. /**index.wxss**/
  5. .page-index{
  6. overflow-x: hidden;
  7. }
  8. .index-slider{
  9. position: relative;
  10. height: 530rpx;
  11. }
  12. .index-slider .swiper-box{
  13. position: relative;
  14. height: 530rpx;
  15. }
  16. .index-slider .swiper-box .swiper-item{
  17. height: 530rpx;
  18. }
  19. .index-slider .index-slider-doc{
  20. position: absolute;
  21. z-index:2;
  22. bottom: 30rpx;
  23. left: 50%;
  24. transform: translate(-50%,0);
  25. white-space: nowrap;
  26. }
  27. .index-slider .index-slider-doc .item-doc{
  28. display: inline-block;
  29. margin: 0 12rpx;
  30. width: 56rpx;
  31. height: 6rpx;
  32. /* background: red; */
  33. background: rgba(255,255,255,.2);
  34. }
  35. .index-slider .index-slider-doc .item-doc.active{
  36. background:#61CDB6;
  37. }
  38. .index-title{
  39. text-align: center;
  40. padding: 50rpx 0;
  41. }
  42. .index-title .title{
  43. font-size:36rpx;
  44. font-family:Noto Sans S Chinese;
  45. color:rgba(22,22,22,1);
  46. line-height:44rpx
  47. }
  48. .index-title .sub-title{
  49. font-size:22rpx;
  50. font-family:DengXian;
  51. color:rgba(22,22,22,1);
  52. line-height:44rpx
  53. }
  54. .exhibition-list{
  55. display: flex;
  56. padding:0 30rpx;
  57. }
  58. /* .exhibition-list>view{
  59. flex: 1;
  60. overflow: hidden;
  61. } */
  62. .exhibition-list .item-bg{
  63. position: relative;
  64. height: 220rpx;
  65. background: rgba(1,1,1,.5);
  66. margin: 0 15rpx;
  67. }
  68. .exhibition-list .item-bg .img-bg{
  69. position: absolute;
  70. display: block;
  71. width: 100%;
  72. height: 100%;
  73. z-index: 0;
  74. }
  75. .exhibition-list .item-bg .item-icon{
  76. position: relative;
  77. height: 63rpx;
  78. padding-top: 40rpx;
  79. margin-bottom: 20rpx;
  80. z-index: 2;
  81. }
  82. .exhibition-list .item-bg .item-icon>image{
  83. display: block;
  84. margin: 0 auto;
  85. }
  86. .exhibition-list .item-bg .icon-01{
  87. width: 64rpx;
  88. height: 63rpx;
  89. }
  90. .exhibition-list .item-bg .icon-02{
  91. width: 64rpx;
  92. height: 63rpx;
  93. }
  94. .exhibition-list .item-bg .item-content{
  95. position: relative;
  96. z-index: 2;
  97. }
  98. .exhibition-list .item-bg .name{
  99. color:rgba(255,255,255,1);
  100. line-height:44rpx;
  101. font-size:32rpx;
  102. color: #fff;
  103. text-align: center;
  104. }
  105. .exhibition-list .item-bg .text{
  106. font-size:20rpx;
  107. color:rgba(255,255,255,1);
  108. line-height:36rpx;
  109. text-align: center;
  110. }
  111. .exhibition-list .item{
  112. display: flex;
  113. margin: 0 15rpx;
  114. height:190rpx;
  115. background:rgba(28,183,150,1);
  116. align-items: center;
  117. padding: 0 0 0 20rpx;
  118. }
  119. .exhibition-list .item .icon-01{
  120. width: 49rpx;
  121. height: 77rpx;
  122. margin-top: -10rpx;
  123. }
  124. .exhibition-list .item .icon-02{
  125. width: 64rpx;
  126. height: 71rpx;
  127. }
  128. .exhibition-list .item .item-content{
  129. position: relative;
  130. z-index: 2;
  131. white-space: nowrap;
  132. padding-left: 15rpx;
  133. }
  134. .exhibition-list .item .name{
  135. color:rgba(255,255,255,1);
  136. line-height:44rpx;
  137. font-size:32rpx;
  138. color: #fff;
  139. }
  140. .exhibition-list .item .text{
  141. font-size:20rpx;
  142. color:rgba(255,255,255,1);
  143. line-height:36rpx;
  144. text-align: center;
  145. }
  146. .serve-list-box{
  147. display: flex;
  148. flex-wrap:wrap;
  149. margin-bottom: 20rpx;
  150. margin-right: -3rpx;
  151. }
  152. .serve-list{
  153. width: 50%;
  154. display: flex;
  155. align-items: center;
  156. padding:30rpx;
  157. border:1rpx solid rgba(204,209,219,1);
  158. box-sizing: border-box;
  159. margin-top: -1rpx;
  160. margin-left: -1rpx;
  161. }
  162. .serve-list .item-media{
  163. width: 68rpx;
  164. height: 68rpx;
  165. margin-right: 30rpx;
  166. }
  167. /* .serve-list .item-content{
  168. } */
  169. .serve-list .item-content .name{
  170. font-size:32rpx;
  171. color: #161616;
  172. margin-bottom: 10rpx;
  173. }
  174. .serve-list .item-content .text{
  175. color: #B3B3C1;
  176. font-size:20rpx;
  177. white-space: nowrap;
  178. }
  179. .footer-box{
  180. padding:40rpx 30rpx;
  181. text-align: center;
  182. }
  183. .footer-box .footer-logo{
  184. display: block;
  185. margin: 0 auto 40rpx auto;
  186. width: 189rpx;
  187. height: 140rpx;
  188. }
  189. .footer-box .link-a{
  190. display: inline-block;
  191. font-size: 28rpx;
  192. text-decoration: underline;
  193. color: #C2C2C2;
  194. }