main.css 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256
  1. div,h1,h2,ul,li,input,textarea,p,img{
  2. margin: 0;
  3. padding: 0;
  4. }
  5. ul,li{
  6. list-style: none;
  7. }
  8. .iconfont, em, i {
  9. font-style: normal;
  10. }
  11. .iconfont {
  12. font-family: iconfont!important;
  13. -webkit-font-smoothing: antialiased;
  14. -webkit-text-stroke-width: 0;
  15. -moz-osx-font-smoothing: grayscale;
  16. vertical-align: top;
  17. }
  18. @font-face {
  19. font-family: 'iconfont'; /* project id 257074 */
  20. src: url('//at.alicdn.com/t/font_9lo2abhktc7bvs4i.eot');
  21. src: url('//at.alicdn.com/t/font_9lo2abhktc7bvs4i.eot?#iefix') format('embedded-opentype'),
  22. url('//at.alicdn.com/t/font_9lo2abhktc7bvs4i.woff') format('woff'),
  23. url('//at.alicdn.com/t/font_9lo2abhktc7bvs4i.ttf') format('truetype'),
  24. url('//at.alicdn.com/t/font_9lo2abhktc7bvs4i.svg#iconfont') format('svg');
  25. }
  26. body {
  27. padding: 0;
  28. margin: 0;
  29. background-color: #fff;
  30. font: 14px/1.4 'Microsoft YaHei', Helvetica, sans-serif;
  31. color: #555;
  32. }
  33. .blank0{
  34. clear: both;
  35. display: block;
  36. height: 0;
  37. overflow: hidden;
  38. }
  39. .nav{
  40. margin: 0 auto;
  41. width: 1050px;
  42. height: 60px;
  43. overflow: hidden;
  44. }
  45. .nav .nav-list{
  46. float: right;
  47. }
  48. .nav .nav-list li{
  49. float: left;
  50. height: 57px;
  51. line-height: 60px;
  52. margin-right: 20px;
  53. border-bottom: 3px solid #fff;
  54. -webkit-transition: all .5s ease-out;
  55. -moz-transition: all .5s ease-out;
  56. -o-transition: all .5s ease-out;
  57. transition: all .5s ease-out;
  58. }
  59. .nav .nav-list li:hover{
  60. border-bottom-color: #e11d86;
  61. }
  62. .nav .nav-list li.active{
  63. border-bottom-color: #e11d86;
  64. }
  65. .nav .nav-list li a{
  66. display: block;
  67. padding: 0 15px;
  68. font-size: 18px;
  69. color: #e11d86;
  70. height: 100%;
  71. text-decoration: none;
  72. }
  73. .con{
  74. width: 100%;
  75. height: 1000px;
  76. background: url("../images/index-bg.jpg") center center no-repeat;
  77. overflow: hidden;
  78. }
  79. .con .con-wrap{
  80. position: relative;
  81. width: 1050px;
  82. margin: 0 auto;
  83. overflow: visible;
  84. }
  85. .con .con-wrap .app-box{
  86. float: left;
  87. margin-top: 215px;
  88. }
  89. .con .app-box .mark-img{
  90. width: 500px;
  91. height: 100px;
  92. overflow: hidden;
  93. }
  94. .con .app-box .mark-img img{
  95. max-width: 500px;
  96. max-height: 100px;
  97. }
  98. .con .app-box h1{
  99. max-width: 500px;
  100. display: block;
  101. line-height: 146px;
  102. font-size: 48px;
  103. color: #fff;
  104. font-weight: normal;
  105. }
  106. .con .app-box .app-download{
  107. float: left;
  108. width: 217px;
  109. overflow: hidden;
  110. }
  111. .app-download .app {
  112. width: 217px;
  113. height: 60px;
  114. text-align: center;
  115. border-radius: 30px;
  116. }
  117. .app-download .app a{
  118. display: block;
  119. height: 60px;
  120. line-height: 60px;
  121. font-size: 24px;
  122. text-align: center;
  123. text-decoration: none;
  124. }
  125. .app-download .ios{
  126. background: #fff;
  127. }
  128. .app-download .ios a{
  129. color: #ff6f9b;
  130. }
  131. .app-download .ios .icon{
  132. font-size: 42px;
  133. color: #ff6f9b;
  134. }
  135. .app-download .android{
  136. margin-top: 30px;
  137. background: #4c4c4c;
  138. }
  139. .app-download .android a{
  140. color: #fff;
  141. }
  142. .app-download .android .icon{
  143. font-size: 42px;
  144. color: #fff;
  145. }
  146. .app-box .ewm{
  147. float: left;
  148. padding: 10px;
  149. margin-left: 80px;
  150. width: 156px;
  151. height: 156px;
  152. background: #fff;
  153. overflow: hidden;
  154. border: 1px solid #999;
  155. -webkit-box-sizing: border-box;
  156. -moz-box-sizing: border-box;
  157. box-sizing: border-box;
  158. }
  159. .app-box .ewm img{
  160. position: relative;
  161. width: 100%;
  162. height: 100%;
  163. }
  164. .copyright{
  165. position: absolute;
  166. left: 0;
  167. bottom: -70px;
  168. width: 100%;
  169. text-align: center;
  170. font-size: 13px;
  171. line-height: 14px;
  172. color: #fff;
  173. }
  174. .index-right{
  175. float: right;
  176. margin-top: 130px;
  177. margin-right: -30px;
  178. width: 536px;
  179. height: 730px;
  180. overflow: hidden;
  181. }
  182. .index-right img{
  183. max-width: 536px;
  184. max-height: 730px;
  185. }
  186. .txt-agreement {
  187. width: 620px;
  188. margin: 0 auto;
  189. padding: 10px;
  190. }
  191. .wrap{
  192. max-width: 620px;
  193. margin: 0 auto;
  194. visibility: visible;
  195. }
  196. .contact{
  197. margin-top: 50px;
  198. }
  199. .contact h2{
  200. line-height: 24px;
  201. font-size: 14px;
  202. color: #e11d86;
  203. font-weight: bold;
  204. }
  205. .contact .font{
  206. line-height: 18px;
  207. color: #000;
  208. text-align: left;
  209. font-size: 14px;
  210. }
  211. .contact .font a{
  212. text-decoration: underline;
  213. }
  214. .animated {
  215. -webkit-animation-duration: 1s;
  216. animation-duration: 1s;
  217. -webkit-animation-fill-mode: both;
  218. animation-fill-mode: both;
  219. }
  220. @-webkit-keyframes fadeInUp {
  221. from {
  222. opacity: 0;
  223. -webkit-transform: translate3d(0, 10%, 0);
  224. transform: translate3d(0, 20%, 0);
  225. }
  226. to {
  227. opacity: 1;
  228. -webkit-transform: none;
  229. transform: none;
  230. }
  231. }
  232. @keyframes fadeInUp {
  233. from {
  234. opacity: 0;
  235. -webkit-transform: translate3d(0, 12%, 0);
  236. transform: translate3d(0, 12%, 0);
  237. }
  238. to {
  239. opacity: 1;
  240. -webkit-transform: none;
  241. transform: none;
  242. }
  243. }
  244. .fadeInUp {
  245. -webkit-animation-name: fadeInUp;
  246. animation-name: fadeInUp;
  247. }