about-mobile.css 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201
  1. .wrap {
  2. padding-top: 2.75rem;
  3. }
  4. .wrap .tab {
  5. height: 2.5rem;
  6. border-bottom: 0.0625rem solid rgba(151, 151, 151, 0.2);
  7. position: relative;
  8. overflow-x: auto;
  9. overflow-y: hidden;
  10. }
  11. .wrap .tab::-webkit-scrollbar {
  12. height: 0;
  13. }
  14. .wrap .tab .tab-content {
  15. height: 2.5rem;
  16. display: flex;
  17. align-items: center;
  18. justify-content: center;
  19. }
  20. .tab .tab-item {
  21. height: 2.5rem;
  22. /* width: 5.625rem; */
  23. white-space: nowrap;
  24. padding: 0 0.625rem;
  25. font-size: 0.875rem;
  26. font-weight: 400;
  27. color: #222222;
  28. text-align: center;
  29. line-height: 2.5rem;
  30. }
  31. .tab .current-tab {
  32. position: absolute;
  33. bottom: 0;
  34. width: 3rem;
  35. height: 0.125rem;
  36. background-color: #1d52a2;
  37. transition: all 0.25s;
  38. }
  39. .wrap .item {
  40. padding: 0.9375rem;
  41. }
  42. .item .title {
  43. font-size: 1.25rem;
  44. font-weight: 500;
  45. color: #222222;
  46. text-align: center;
  47. }
  48. .item .content {
  49. font-size: 0.8125rem;
  50. font-weight: 500;
  51. color: #222222;
  52. width: 100%;
  53. margin: 1.25rem auto 0;
  54. }
  55. .wrap .mission {
  56. min-height: 15rem;
  57. width: 100%;
  58. background-repeat: no-repeat;
  59. background-size: auto 100%;
  60. }
  61. .wrap .strength {
  62. background: #f4f4f4;
  63. padding-bottom: 1.875rem;
  64. }
  65. .strength .box {
  66. width: 100%;
  67. margin: 1.25rem auto 0;
  68. display: flex;
  69. align-items: center;
  70. flex-wrap: wrap;
  71. }
  72. .strength .box .box-item {
  73. width: 100%;
  74. min-height: 7.5rem;
  75. background: #fff;
  76. margin-bottom: 1.25rem;
  77. padding: 1.25rem 0;
  78. }
  79. .strength .box .box-item .item-title {
  80. border-left: 0.25rem solid #1d52a2;
  81. font-size: 0.875rem;
  82. font-weight: 500;
  83. color: #222222;
  84. padding: 0 1.875rem;
  85. }
  86. .strength .box .box-item .item-content {
  87. padding: 0 1.875rem;
  88. font-size: 0.75rem;
  89. font-weight: 400;
  90. color: #444444;
  91. margin-top: 0.625rem;
  92. }
  93. .wrap .contact {
  94. width: 100%;
  95. margin: 1.25rem auto 0;
  96. padding: 1.25rem 0.9375rem 0.9375rem;
  97. background: #f4f4f4;
  98. }
  99. .contact .contact-img {
  100. width: 100%;
  101. margin-top: 1.25rem;
  102. }
  103. .contact .contact-list {
  104. width: 100%;
  105. }
  106. .contact .contact-list .company {
  107. width: 100%;
  108. padding-bottom: 1.25rem;
  109. margin-top: 1.25rem;
  110. }
  111. .contact .contact-list > :not(:last-child) {
  112. border-bottom: 0.0625rem solid rgba(151, 151, 151, 0.1);
  113. }
  114. .company .name {
  115. font-weight: 500;
  116. font-size: 1rem;
  117. color: #222222;
  118. }
  119. .company .phone {
  120. font-weight: 400;
  121. font-size: 0.75rem;
  122. color: #222222;
  123. margin-top: 0.9375rem;
  124. }
  125. .company .address {
  126. font-weight: 400;
  127. font-size: 0.75rem;
  128. color: #222222;
  129. margin-top: 0.9375rem;
  130. }
  131. .company .info {
  132. color: #555555;
  133. }
  134. .wrap .online {
  135. width: 100%;
  136. margin: 1.25rem auto 0;
  137. padding: 0.9375rem;
  138. }
  139. .online .title {
  140. width: 100%;
  141. font-size: 1.125rem;
  142. font-weight: 600;
  143. color: #222222;
  144. text-align: center;
  145. }
  146. .online .tips {
  147. width: 100%;
  148. font-size: 0.75rem;
  149. font-weight: 400;
  150. color: #666666;
  151. text-align: center;
  152. margin-top: 0.9375rem;
  153. }
  154. .online .card {
  155. height: 35.625rem;
  156. background: #f4f4f4;
  157. margin: 3.125rem 0;
  158. padding: 1.25rem 0.9375rem;
  159. }
  160. .online .card input {
  161. width: 100%;
  162. height: 2.375rem;
  163. background: #ffffff;
  164. font-size: 0.8125rem;
  165. color: #222222;
  166. padding: 0 0.625rem;
  167. }
  168. .online .card textarea {
  169. width: 100%;
  170. height: 10rem;
  171. background: #ffffff;
  172. font-size: 0.8125rem;
  173. color: #222222;
  174. padding: 0.625rem;
  175. resize: none;
  176. }
  177. .online .card .item-title {
  178. font-size: 0.8125rem;
  179. font-weight: 400;
  180. color: #222222;
  181. margin: 0.9375rem 0;
  182. }
  183. .online .card .required::after {
  184. content: "*";
  185. color: #e02020;
  186. }
  187. .online .card .confirm {
  188. width: 8.5625rem;
  189. height: 2.625rem;
  190. line-height: 2.625rem;
  191. font-size: 0.875rem;
  192. margin: 1.25rem auto 0;
  193. }
  194. /* .wrap .future {
  195. }
  196. .wrap .about {
  197. } */