style.css 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232
  1. * {
  2. margin : 0;
  3. padding : 0;
  4. list-style: none;
  5. border : none;
  6. font-style: normal;
  7. }
  8. html {
  9. width : 100%;
  10. min-width : 1220px;
  11. font-family: "Source Han Sans SC", "HanHei SC", "PingFang SC", "Helvetica Neue", Helvetica, "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  12. }
  13. img {
  14. display: block;
  15. }
  16. a {
  17. text-decoration: none;
  18. color : #333;
  19. }
  20. @font-face {
  21. font-family: 'iconfont';
  22. src : url('../../iconfont/iconfont.eot');
  23. src : url('../../iconfont/iconfont.eot?#iefix') format('embedded-opentype'),
  24. url('../../iconfont/iconfont.woff') format('woff'),
  25. url('../../iconfont/iconfont.ttf') format('truetype'),
  26. url('../../iconfont/iconfont.svg#iconfont') format('svg');
  27. }
  28. .iconfont {
  29. font-family : "iconfont" !important;
  30. font-size : 14px;
  31. font-style : normal;
  32. -webkit-font-smoothing : antialiased;
  33. -webkit-text-stroke-width: 0.2px;
  34. -moz-osx-font-smoothing : grayscale;
  35. }
  36. .banner img {
  37. width: 100%;
  38. }
  39. .intro {
  40. margin-top: 40px;
  41. }
  42. .title {
  43. width : 100%;
  44. max-width : 1460px;
  45. margin : 0 auto;
  46. text-align: center;
  47. }
  48. .title h1 {
  49. display : inline-block;
  50. margin : 0 10px;
  51. font-size : 44px;
  52. font-weight : 400;
  53. letter-spacing: 5px;
  54. }
  55. .title em {
  56. display : inline-block;
  57. width : 42px;
  58. height : 4px;
  59. background: #000;
  60. position : relative;
  61. top : -10px;
  62. }
  63. .intro .content {
  64. max-width: 1440px;
  65. margin : 40px auto 0;
  66. }
  67. .intro .content p {
  68. text-indent : 33px;
  69. line-height : 35px;
  70. letter-spacing: 4px;
  71. color : #333;
  72. }
  73. .culture {
  74. margin-top: 40px;
  75. }
  76. .culture .content {
  77. background-image : url('../images/banner1.png');
  78. background-repeat: no-repeat;
  79. background-size : 100% 100%;
  80. margin-top : 40px;
  81. padding : 70px 0 40px;
  82. ;
  83. }
  84. .culture .content .main {
  85. max-width: 1460px;
  86. margin : 0 auto;
  87. }
  88. .culture .content .main .slogan ul {
  89. display : -webkit-flex;
  90. display : flex;
  91. flex-direction : row;
  92. flex-wrap : wrap;
  93. justify-content: space-between;
  94. }
  95. .culture .content .main .slogan li {
  96. width : 270px;
  97. height : 270px;
  98. text-align : center;
  99. background : #fff;
  100. border-radius: 50%;
  101. border : 8px solid #267dba;
  102. }
  103. .culture .content .main .slogan li h6 {
  104. font-size : 36px;
  105. color : #267dba;
  106. margin-top : 60px;
  107. font-weight: 400;
  108. }
  109. .culture .content .main .slogan li em {
  110. display : block;
  111. width : 53px;
  112. height : 2px;
  113. margin : 20px auto 0;
  114. background: #7b7b7b;
  115. }
  116. .culture .content .main .slogan li p {
  117. width : 180px;
  118. margin : 20px auto 0;
  119. letter-spacing: 2px;
  120. }
  121. .slogan-text {
  122. width : 100%;
  123. padding : 30px;
  124. background: #fff;
  125. margin-top: 40px;
  126. box-sizing: border-box;
  127. }
  128. .slogan-text h6 {
  129. font-size : 36px;
  130. font-weight : 400;
  131. color : #267dba;
  132. margin-bottom: 20px;
  133. }
  134. .slogan-text p {
  135. margin-bottom : 20px;
  136. letter-spacing: 2px;
  137. color : #333;
  138. line-height : 30px;
  139. }
  140. .product {
  141. margin-top: 40px;
  142. }
  143. .product .content {
  144. max-width: 1220px;
  145. margin : 40px auto 0;
  146. }
  147. .product .content li {
  148. margin-bottom: 80px;
  149. }
  150. .product .content li::after {
  151. content: '';
  152. display: block;
  153. clear : both;
  154. }
  155. .product .content li div {
  156. float: left;
  157. width: 50%;
  158. }
  159. .product .content li div h6 {
  160. font-size : 36px;
  161. font-weight : 400;
  162. color : #267dba;
  163. margin-bottom: 15px;
  164. line-height : 40px;
  165. }
  166. .product .content li div p {
  167. margin-bottom : 15px;
  168. color : #333;
  169. line-height : 30px;
  170. letter-spacing: 2px;
  171. }
  172. .product .content .list0 .list-text {
  173. padding-left: 30px;
  174. box-sizing : border-box;
  175. }
  176. .case ul {
  177. max-width : 1220px;
  178. display : -webkit-flex;
  179. display : flex;
  180. flex-direction : row;
  181. flex-wrap : wrap;
  182. justify-content: space-between;
  183. background: #fff;
  184. margin: 0 auto;
  185. }
  186. .case ul li {
  187. width : 30%;
  188. margin-bottom: 30px;
  189. }
  190. .case ul li p{
  191. margin-top: 20px;
  192. text-align: center;
  193. font-weight:600;
  194. }
  195. .case ul li img {
  196. width: 100%;
  197. }