隧芒官网
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

339 lines
5.8 KiB

  1. body{
  2. background-color: #000A20 ;
  3. }
  4. /* 去掉全屏时显示的自带控制条 */
  5. /* video::-webkit-media-controls{
  6. display:none !important;
  7. } */
  8. .headBox{
  9. position:fixed;
  10. top: 0;
  11. left: 0;
  12. width: 100%;
  13. height: 80px;
  14. background-color: #000A20 ;
  15. overflow: hidden;
  16. z-index: 100000;
  17. padding-bottom: 10px;
  18. }
  19. .logo{
  20. float: left;
  21. margin-left: 60px;
  22. margin-top: 20px;
  23. width: 180px;
  24. height: 50px;
  25. background-color: transparent;
  26. }
  27. .mainBox{
  28. float: right;
  29. margin-right: 58px;
  30. margin-top: 35px;
  31. height: 20px;
  32. line-height: 17px;
  33. color: #fff;
  34. font-size: 18px;
  35. overflow: hidden;
  36. text-align: center;
  37. display: flex;
  38. flex-wrap:wrap;
  39. justify-content:space-between;
  40. width: 36%;
  41. }
  42. .mainBox div{
  43. cursor: pointer;
  44. }
  45. .space{
  46. margin: 0 60px;
  47. }
  48. /* .mainBox div{
  49. float: left;
  50. width: 72px;
  51. height: 17px;
  52. } */
  53. .hieBox{
  54. top: 0;
  55. left: 0;
  56. position: absolute;
  57. width: 100%;
  58. height: 100%;
  59. background-color: rgba(0, 0, 0, 0.3)
  60. }
  61. .videoBox{
  62. overflow: hidden;
  63. position: relative;
  64. }
  65. .titleBox{
  66. position: absolute;
  67. width: 100%;
  68. font-size: 80px;
  69. font-family: OPPOSans;
  70. font-weight: 400;
  71. color: #FFFFFF;
  72. top: 30%;
  73. left: 0;
  74. text-align: center;
  75. }
  76. .consult{
  77. position: absolute;
  78. left: 50%;
  79. top: 50%;
  80. transform: translate(-50%, -50%);
  81. width: 200px;
  82. height: 60px;
  83. line-height: 60px;
  84. background: #3ADDEF;
  85. text-align: center;
  86. color: #02172D;
  87. font-size: 20px;
  88. font-family: OPPOSans;
  89. font-weight: 500;
  90. border-radius: 6px;
  91. }
  92. .consult:hover {
  93. color: #fff;
  94. }
  95. .video1{
  96. width: 100%;
  97. height: 1080px;
  98. background: #000A20;;
  99. }
  100. .video2{
  101. width: 100%;
  102. height: 1080px;
  103. background: #000A20;;
  104. }
  105. .itemBox{
  106. width: 100%;
  107. height: 800px;
  108. background: #13161D;
  109. position: relative;
  110. overflow: hidden;
  111. margin-top: 20px;
  112. }
  113. .coverF{
  114. height: 60px;;
  115. }
  116. .textBox{
  117. position: absolute;
  118. top: 20%;
  119. left: 20%;
  120. width: 27%;
  121. }
  122. .title{
  123. /* width: 357px; */
  124. /* height: 69px; */
  125. font-size: 56px;
  126. font-family: OPPOSans;
  127. font-weight: 800;
  128. color: #3ADDEF;
  129. }
  130. .cover{
  131. margin: 20px 0;
  132. font-size: 56px;
  133. font-family: OPPOSans;
  134. font-weight: 800;
  135. color: #3ADDEF;
  136. text-align: center;
  137. }
  138. .fushou{
  139. margin-top: 38px;
  140. font-size: 26px;
  141. font-family: OPPOSans;
  142. font-weight: 500;
  143. color: #FFFFFF;
  144. }
  145. .miaosu{
  146. margin-top: 65px;
  147. font-size: 18px;
  148. font-family: Microsoft YaHei;
  149. font-weight: 400;
  150. color: #FFFFFF;
  151. line-height: 38px;
  152. }
  153. .item1{
  154. position: absolute;
  155. width: 30%;
  156. height: 337px;
  157. background: #13161D;
  158. opacity: 0.8;
  159. border-radius: 10px;
  160. top: 20%;
  161. right: 15%;
  162. }
  163. .suxian1{
  164. width: 8px;
  165. height: 522px;
  166. position: absolute;
  167. top: 86px;
  168. left: 20%;
  169. }
  170. .suxian2{
  171. width: 8px;
  172. height: 522px;
  173. position: absolute;
  174. top: 86px;
  175. right: 20%;
  176. }
  177. .suxian3{
  178. position: absolute;
  179. width: 66%;
  180. height: 8px;
  181. left: 16%;
  182. top: 559px
  183. }
  184. .name{
  185. margin-top: 126px;
  186. text-align: center;
  187. font-size: 72px;
  188. font-family: OPPOSans;
  189. font-weight: 800;
  190. color: #3ADDEF;
  191. }
  192. .dazao{
  193. margin-top: 34px;
  194. text-align: center;
  195. font-size: 22px;
  196. font-family: OPPOSans;
  197. font-weight: 400;
  198. color: #3ADDEF;
  199. }
  200. .dataText{
  201. margin: 56px auto;
  202. width: 54%;
  203. height: 176px;
  204. font-size: 18px;
  205. font-family: Microsoft YaHei;
  206. font-weight: 400;
  207. color: #FFFFFF;
  208. }
  209. .jieshao{
  210. width: 200px;
  211. height: 60px;
  212. background: #3ADDEF;
  213. margin: 146px auto;
  214. font-size: 20px;
  215. font-family: OPPOSans;
  216. font-weight: 500;
  217. color: #02172D;
  218. text-align: center;
  219. line-height: 60px;
  220. }
  221. .teamworkName{
  222. margin-top: 110px;
  223. text-align: center;
  224. font-size: 72px;
  225. font-family: OPPOSans;
  226. font-weight: 800;
  227. color: #000000;
  228. }
  229. .teamworkText{
  230. margin-top: 44px;
  231. text-align: center;
  232. font-size: 30px;
  233. font-family: Microsoft YaHei;
  234. font-weight: bold;
  235. color: #FFFFFF;
  236. }
  237. .teamworkP{
  238. margin-top: 10px;
  239. text-align: center;
  240. font-size: 18px;
  241. font-family: Microsoft YaHei;
  242. font-weight: bold;
  243. color: rgba(255, 255, 255, 0.5);
  244. }
  245. .teamworkBox{
  246. /* margin-top: 70px;
  247. margin-left: 359px; */
  248. margin: 5% auto;
  249. width: 1200px;
  250. display: flex;
  251. flex-wrap:wrap;
  252. justify-content:space-between;
  253. }
  254. .itemImg{
  255. width: 18%;
  256. height: 108px;
  257. background-color: #fff;
  258. margin-bottom: 20px;
  259. }
  260. .teamworkBoxtop{
  261. width: 100%;
  262. height: 730px;
  263. background: #13161D;
  264. position: relative;
  265. overflow: hidden;
  266. }
  267. .consultBox{
  268. /* height: 376px; */
  269. background: #1C1F26;
  270. overflow: hidden;
  271. }
  272. .wayBox{
  273. float: left;
  274. /* margin-left: 18%; */
  275. margin-top: 77px;
  276. }
  277. .zhixuantext{
  278. font-size: 16px;
  279. color: rgba(255, 255, 255, 0.5);
  280. margin-bottom: 10px;
  281. }
  282. .ph{
  283. font-size: 26px;
  284. font-family: OPPOSans;
  285. font-weight: 500;
  286. color: #FFFFFF;
  287. margin-bottom: 64px
  288. }
  289. .stieText{
  290. font-size: 16px;
  291. color: rgba(255, 255, 255, 0.5);
  292. margin-bottom: 10px;
  293. }
  294. .stie{
  295. font-size: 18px;
  296. font-family: OPPOSans;
  297. font-weight: 500;
  298. color: #FFFFFF;
  299. }
  300. .rqCodeBox{
  301. margin-top: 84px;
  302. width: 62%;
  303. float: left;
  304. margin-left:7%;
  305. display: flex;
  306. flex-wrap:wrap;
  307. justify-content:space-between;
  308. }
  309. .rq{
  310. width: 10rem;
  311. height: 10rem;
  312. background-color: #FFFFFF;
  313. }
  314. .rqBox p{
  315. text-align: center;
  316. margin-top: 20px;
  317. font-size: 16px;
  318. font-family: Microsoft YaHei;
  319. font-weight: 400;
  320. color: #FFFFFF;
  321. }
  322. .tail{
  323. height: 60px;
  324. line-height: 60px;
  325. text-align: center;
  326. background: #040405;
  327. font-size: 14px;
  328. font-family: Microsoft YaHei;
  329. font-weight: 400;
  330. color: #FFFFFF;
  331. }