Blame view

css/portfollo.css 9.89 KB
f2386841   Andy   产品页 add css3
1
2
3
  /*breadcrumb*/
  .breadcrumb{
      width: 100%;
d66b241f   liuqimichale   banner和百度地图
4
      height: 540px;
ac8b53a3   liuqimichale   关于我们 banner
5
      background:url('../images/breadcrumb-bg.jpg');
f2386841   Andy   产品页 add css3
6
7
      background-size:100% 100%;
      background-repeat:no-repeat;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
8
  
f2386841   Andy   产品页 add css3
9
10
  }
  .breadcrumb-text{
c03ce36e   liuqimichale   关于我们 banner
11
12
      max-width: 832px;
      padding: 0 20px;
2656ab95   liuqimichale   关于我们 banner
13
      margin: 200px auto;
f2386841   Andy   产品页 add css3
14
      text-align: center;
f2386841   Andy   产品页 add css3
15
      color: #fff;
6e350ac4   liuqimichale   产品 banner
16
      font-size: 44px;
2656ab95   liuqimichale   关于我们 banner
17
      background-color: #3F9FFE;
f2386841   Andy   产品页 add css3
18
19
  }
  #portfolio-soft-top{
763188c7   liuqimichale   产品 硬件平台
20
      padding-bottom: 0;
f2386841   Andy   产品页 add css3
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
      background: #fff;
  }
  /*软件sta-----*/
  .portfolio-soft-wrap li{
      color:rgba(6,14,19,.8);
      font-size: 20px;
      cursor: pointer;
      position: relative;
  }
  .portfolio-soft-wrap li:nth-of-type(1){
      padding-top: 60px;
      background: url("../images/portfolio-soft-wrap-1.png") no-repeat center 0;
  
  }
  .portfolio-soft-wrap li:nth-of-type(2){
      padding-top: 60px;
      background: url("../images/portfolio-soft-wrap-2.png") no-repeat center 0;
  
  }
  .portfolio-soft-wrap li:nth-of-type(3){
      padding-top: 60px;
      background: url("../images/portfolio-soft-wrap-3.png") no-repeat center 0;
  
  }
  .portfolio-soft-wrap li:nth-of-type(1).active{
      color: #3F9FFE;
      padding-bottom: 10px;
      /*border-bottom: 3px solid rgba(63,159,254,1);*/
      background: url("../images/portfolio-soft-wrap-1-active.png") no-repeat center 0;
  }
  .portfolio-soft-wrap li:nth-of-type(2).active{
      color: #3F9FFE;
      padding-bottom: 10px;
      /*border-bottom: 3px solid rgba(63,159,254,1);*/
      background: url("../images/portfolio-soft-wrap-2-active.png") no-repeat center 0;
  }
  .portfolio-soft-wrap li:nth-of-type(3).active{
      color: #3F9FFE;
      padding-bottom: 10px;
      /*border-bottom: 3px solid rgba(63,159,254,1);*/
      background: url("../images/portfolio-soft-wrap-3-active.png") no-repeat center 0;
  }
  
  .portfolio-section-wrap{
      min-height: 596px;
  }
  .portfolio-section-wrap>li{
  }
  .portfolio-section-wrap>li li{
763188c7   liuqimichale   产品 硬件平台
70
      height: 500px;
f2386841   Andy   产品页 add css3
71
72
  }
  .ortfolio-soft-bottom-1>li:nth-of-type(1){
18baebbd   liuqimichale   产品介绍 sass
73
74
      padding-left: 100px;
  }
4c61ea2c   liuqimichale   产品介绍 Swiper
75
76
77
78
79
80
  .ortfolio-soft-bottom-2>li:nth-of-type(1){
      padding-left: 100px;
  }
  .ortfolio-soft-bottom-3>li:nth-of-type(1){
      padding-left: 100px;
  }
18baebbd   liuqimichale   产品介绍 sass
81
82
83
  .ortfolio-soft-bottom-1>li:nth-of-type(1) .swiper-slide{
      height: 500px;
  }
4c61ea2c   liuqimichale   产品介绍 Swiper
84
  .portfolio-rnt-wrap{
18baebbd   liuqimichale   产品介绍 sass
85
86
87
88
89
      height: 500px;
      float: left;
      background: url("../images/portfolio-rnt.png") no-repeat -35px 0;
      overflow: hidden;
  }
4c61ea2c   liuqimichale   产品介绍 Swiper
90
  .portfolio-pc-wrap{
4c61ea2c   liuqimichale   产品介绍 Swiper
91
92
93
94
95
96
97
      height: 500px;
      float: left;
      background: url("../images/portfolio-pc.png") no-repeat center center;
      background-size: 100% 70%;
      overflow: hidden;
  }
   .portfolio-analysis-wrap{
4c61ea2c   liuqimichale   产品介绍 Swiper
98
99
100
101
102
103
       height: 500px;
       float: left;
       background: url("../images/portfolio-pc.png") no-repeat center center;
       background-size: 100% 70%;
       overflow: hidden;
   }
18baebbd   liuqimichale   产品介绍 sass
104
105
106
  #portfolio-rnt{
      width: 300px;
      height: 500px;
fc9a2e1f   liuqimichale   关于我们 banner
107
      margin-left: 200px;
18baebbd   liuqimichale   产品介绍 sass
108
109
      margin-top: 23px;
  }
4c61ea2c   liuqimichale   产品介绍 Swiper
110
111
112
  #portfolio-pc{
      width: 473px;
      height: 300px;
fc9a2e1f   liuqimichale   关于我们 banner
113
      margin-left: 48px;
4c61ea2c   liuqimichale   产品介绍 Swiper
114
115
116
117
118
      margin-top: 93px;
  }
  #portfolio-analysis{
      width: 473px;
      height: 300px;
fc9a2e1f   liuqimichale   关于我们 banner
119
      margin-left: 49px;
4c61ea2c   liuqimichale   产品介绍 Swiper
120
121
      margin-top: 93px;
  }
18baebbd   liuqimichale   产品介绍 sass
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
  #portfolio-rnt .portfolio-rnt1{
      width:100%;
      height: 500px;
      background: url("../images/portfolio-rnt1.png") no-repeat ;
  }
  #portfolio-rnt .portfolio-rnt2{
      width:100%;
      height: 500px;
      background: url("../images/portfolio-rnt2.png") no-repeat ;
  }
  #portfolio-rnt .portfolio-rnt3{
      width:100%;
      height: 500px;
      background: url("../images/portfolio-rnt3.png") no-repeat ;
  }
  #portfolio-rnt .portfolio-rnt4{
      width:100%;
      height: 500px;
      background: url("../images/portfolio-rnt4.png") no-repeat ;
f2386841   Andy   产品页 add css3
141
  }
4c61ea2c   liuqimichale   产品介绍 Swiper
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
  
  #portfolio-pc .portfolio-pc1{
      width:100%;
      height: 300px;
      background: url("../images/portfolio-pc1.png") no-repeat ;
      background-size: 100% 100%;
  }
  
  #portfolio-pc .portfolio-pc2{
      width:100%;
      height: 300px;
      background: url("../images/portfolio-pc2.png") no-repeat ;
      background-size: 100% 100%;
  }
  
  #portfolio-pc .portfolio-pc3{
      width:100%;
      height: 300px;
      background: url("../images/portfolio-pc3.png") no-repeat ;
      background-size: 100% 100%;
  }
  
  #portfolio-pc .portfolio-pc4{
      width:100%;
      height: 300px;
      background: url("../images/portfolio-pc4.png") no-repeat ;
      background-size: 100% 100%;
  }
  #portfolio-analysis .portfolio-analysis1{
      width:100%;
      height: 300px;
      background: url("../images/portfolio-analysis1.png") no-repeat ;
      background-size: 100% 100%;
  }
  #portfolio-analysis .portfolio-analysis2{
      width:100%;
      height: 300px;
      background: url("../images/portfolio-analysis2.png") no-repeat ;
      background-size: 100% 100%;
  }
  #portfolio-analysis .portfolio-analysis3{
      width:100%;
      height: 300px;
      background: url("../images/portfolio-analysis3.png") no-repeat ;
      background-size: 100% 100%;
  }
  #portfolio-analysis .portfolio-analysis4{
      width:100%;
      height: 300px;
      background: url("../images/portfolio-analysis4.png") no-repeat ;
      background-size: 100% 100%;
  }
f2386841   Andy   产品页 add css3
194
195
196
  .ortfolio-soft-bottom-1 li:nth-of-type(2){
      padding-left: 100px;
  }
4c61ea2c   liuqimichale   产品介绍 Swiper
197
198
199
200
  /*.ortfolio-soft-bottom-2 li:nth-of-type(1){*/
      /*background: url("../images/ortfolio-soft-pc1.gif") no-repeat center center;*/
      /*background-size: 100% 80%;*/
  /*}*/
f2386841   Andy   产品页 add css3
201
202
203
  .ortfolio-soft-bottom-2 li:nth-of-type(2){
      padding-left:100px;
  }
4c61ea2c   liuqimichale   产品介绍 Swiper
204
205
206
207
  /*.ortfolio-soft-bottom-3 li:nth-of-type(1){*/
      /*background: url("../images/ortfolio-soft-pc2.gif") no-repeat center center;*/
      /*background-size: 100% 80%;*/
  /*}*/
f2386841   Andy   产品页 add css3
208
209
210
211
  .ortfolio-soft-bottom-3 li:nth-of-type(2){
      padding-left:100px;
  }
  .ortfolio-soft-bottom-title{
763188c7   liuqimichale   产品 硬件平台
212
      font-size:26px;
f2386841   Andy   产品页 add css3
213
      font-weight:bold;
763188c7   liuqimichale   产品 硬件平台
214
215
      color:#333;
      margin: 155px 0 27px;
f2386841   Andy   产品页 add css3
216
217
218
      text-align: left;
  }
  .ortfolio-soft-bottom-des{
763188c7   liuqimichale   产品 硬件平台
219
220
      margin: 10px 0 20px;
      font-size: 18px;
763188c7   liuqimichale   产品 硬件平台
221
      color: #666;
f2386841   Andy   产品页 add css3
222
      position: relative;
763188c7   liuqimichale   产品 硬件平台
223
      text-align: left;
f2386841   Andy   产品页 add css3
224
225
226
227
  }
  .ortfolio-soft-bottom-des span{
      width:6px;
      height:6px;
763188c7   liuqimichale   产品 硬件平台
228
      margin-right: 10px;
f2386841   Andy   产品页 add css3
229
230
231
232
233
234
      display: inline-block;
      position: relative;
  }
  .ortfolio-soft-bottom-des span:before{
      position: absolute;
      content: '';
daadc05c   Andy   add service swiper效果
235
236
237
238
239
240
      top: 50%;
      margin-top: -8px;
      width: 10px;
      height: 10px;
      background: rgba(66,160,251,1);
      border-radius: 50%;
f2386841   Andy   产品页 add css3
241
  }
763188c7   liuqimichale   产品 硬件平台
242
  .padding20-0-70{
18baebbd   liuqimichale   产品介绍 sass
243
      padding: 70px 0 70px;
763188c7   liuqimichale   产品 硬件平台
244
  }
f2386841   Andy   产品页 add css3
245
  /*硬件sta-----*/
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
246
247
  .portfolio-hardware-top{
      background: #fff;
daadc05c   Andy   add service swiper效果
248
      padding-top: 36px !important;
763188c7   liuqimichale   产品 硬件平台
249
      padding-bottom: 0;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
250
251
252
253
254
255
  }
  
  .portfolio-hardware-wrap li{
      color:rgba(6,14,19,.8);
      font-size: 20px;
      cursor: pointer;
f2386841   Andy   产品页 add css3
256
      position: relative;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
257
258
259
260
261
262
263
264
  }
  .portfolio-hardware-wrap li:nth-of-type(1){
      padding-top: 60px;
      background: url("../images/portfolio-hardware-wrap-1.png") no-repeat center 0;
  
  }
  .portfolio-hardware-wrap li:nth-of-type(2){
      padding-top: 60px;
ff43139b   Andy   产品界面 硬件平台 部分完成
265
      background: url("../images/portfolio-hardware-wrap-2-active.png") no-repeat center 0;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
  
  }
  .portfolio-hardware-wrap li:nth-of-type(3){
      padding-top: 60px;
      background: url("../images/portfolio-hardware-wrap-3.png") no-repeat center 0;
  
  }
  .portfolio-hardware-wrap li:nth-of-type(4){
      padding-top: 60px;
      background: url("../images/portfolio-hardware-wrap-4.png") no-repeat center 0;
  
  }
  .portfolio-hardware-wrap li:nth-of-type(1).active{
      color: #3F9FFE;
      padding-bottom: 10px;
f2386841   Andy   产品页 add css3
281
      /*border-bottom: 3px solid rgba(63,159,254,1);*/
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
282
283
284
285
286
      background: url("../images/portfolio-hardware-wrap-1-active.png") no-repeat center 0;
  }
  .portfolio-hardware-wrap li:nth-of-type(2).active{
      color: #3F9FFE;
      padding-bottom: 10px;
f2386841   Andy   产品页 add css3
287
      /*border-bottom: 3px solid rgba(63,159,254,1);*/
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
288
289
290
291
292
293
      background: url("../images/portfolio-hardware-wrap-2.png") no-repeat center 0;
      /*background: url("../images/portfolio-hardware-wrap-2-active.png") no-repeat center 0;*/
  }
  .portfolio-hardware-wrap li:nth-of-type(3).active{
      color: #3F9FFE;
      padding-bottom: 10px;
f2386841   Andy   产品页 add css3
294
      /*border-bottom: 3px solid rgba(63,159,254,1);*/
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
295
296
297
298
299
      background: url("../images/portfolio-hardware-wrap-3-active.png") no-repeat center 0;
  }
  .portfolio-hardware-wrap li:nth-of-type(4).active{
      color: #3F9FFE;
      padding-bottom: 10px;
f2386841   Andy   产品页 add css3
300
      /*border-bottom: 3px solid rgba(63,159,254,1);*/
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
301
302
303
304
      background: url("../images/portfolio-hardware-wrap-4-active.png") no-repeat center 0;
  }
  
  .portfolio-section-wrap{
16521b31   liuqimichale   产品自适应
305
  
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
306
307
  }
  .portfolio-section-wrap>li{
16521b31   liuqimichale   产品自适应
308
  
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
309
310
  }
  .portfolio-section-wrap>li li{
16521b31   liuqimichale   产品自适应
311
  
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
312
313
314
315
  }
  .displaynone{
      display: none;
  }
15cf61be   Andy   产品界面 add 硬件平台
316
317
318
319
320
321
322
  .ortfolio-hardware-bottom-title {
      font-size: 30px;
      font-weight: bold;
      color: rgba(0,0,0,.8);
      margin: 0px 0 27px;
      text-align: left;
  }
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
323
  .ortfolio-hardware-bottom-1>li:nth-of-type(1){
16521b31   liuqimichale   产品自适应
324
      /*width: 460px;*/
15cf61be   Andy   产品界面 add 硬件平台
325
      height: 200px;
b75babf1   liuqimichale   产品介绍
326
      margin: 190px auto 0 ;
85761138   liuqimichale   产品介绍
327
      padding-right: 100px;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
328
329
  }
  .ortfolio-hardware-bottom-1 li:nth-of-type(2){
15cf61be   Andy   产品界面 add 硬件平台
330
      /*padding-left: 100px;*/
16521b31   liuqimichale   产品自适应
331
332
      background: url("../images/produect_dev1.png") no-repeat center 0;
      /*width: 578px;*/
b75babf1   liuqimichale   产品介绍
333
      height: 500px;
85761138   liuqimichale   产品介绍
334
      background-size: 578px 500px;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
335
336
  }
  .ortfolio-hardware-bottom-2 li:nth-of-type(1){
b75babf1   liuqimichale   产品介绍
337
338
      margin-top: 190px;
      height: 200px;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
339
340
  }
  .ortfolio-hardware-bottom-2 li:nth-of-type(2){
16521b31   liuqimichale   产品自适应
341
342
      background: url("../images/produect_dev4.png") no-repeat center 0;
      /*width: 383px;*/
b75babf1   liuqimichale   产品介绍
343
      height: 500px;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
344
345
  }
  .ortfolio-hardware-bottom-3 li:nth-of-type(1){
36e8ecf7   liuqimichale   产品介绍
346
      margin-top: 130px;
b75babf1   liuqimichale   产品介绍
347
      height: 200px;
266aaa10   Andy   产品界面 硬件平台 部分完成
348
      /*padding-left: 50px;*/
16521b31   liuqimichale   产品自适应
349
350
      /*width: 460px;*/
      /*margin-left: 100px;*/
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
351
352
  }
  .ortfolio-hardware-bottom-3 li:nth-of-type(2){
b75babf1   liuqimichale   产品介绍
353
      background: url("../images/produect_dev3.png") no-repeat center center;
16521b31   liuqimichale   产品自适应
354
      /*width: 298px;*/
b75babf1   liuqimichale   产品介绍
355
      height: 500px;
16521b31   liuqimichale   产品自适应
356
      /*margin-left: 108px;*/
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
357
358
  
  }
15cf61be   Andy   产品界面 add 硬件平台
359
  .ortfolio-hardware-bottom-4 li:nth-of-type(1){
36e8ecf7   liuqimichale   产品介绍
360
      margin-top: 110px;
b75babf1   liuqimichale   产品介绍
361
      height: 200px;
15cf61be   Andy   产品界面 add 硬件平台
362
363
  }
  .ortfolio-hardware-bottom-4 li:nth-of-type(2){
b75babf1   liuqimichale   产品介绍
364
      background: url("../images/produect_dev2.png") no-repeat center center;
16521b31   liuqimichale   产品自适应
365
      /*width: 297px;*/
b75babf1   liuqimichale   产品介绍
366
      height: 500px;
16521b31   liuqimichale   产品自适应
367
      /*margin-left: 180px;*/
15cf61be   Andy   产品界面 add 硬件平台
368
  }
b75babf1   liuqimichale   产品介绍
369
370
371
  .ortfolio-hardware-bottom-1{
  
  }
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
372
  .ortfolio-hardware-bottom-title{
b75babf1   liuqimichale   产品介绍
373
      font-size:26px;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
374
375
      font-weight:bold;
      color:rgba(0,0,0,.8);
15cf61be   Andy   产品界面 add 硬件平台
376
      /*margin: 239px 0 27px;*/
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
377
378
379
380
381
382
383
384
385
386
387
388
389
      text-align: left;
  }
  .ortfolio-hardware-bottom-des{
      font-size: 16px;
      text-align: left;
      color:rgba(0,0,0,.6);
      padding-left: 20px;
      position: relative;
  }
  .ortfolio-hardware-bottom-des:before{
      position: absolute;
      content: '';
      left: 0;
15cf61be   Andy   产品界面 add 硬件平台
390
      top:10px;
8cf8c4c7   Andy   产品界面 add 硬件平台 以及icon
391
392
393
394
395
      margin-top: -3px;
      width:6px;
      height:6px;
      background:rgba(66,160,251,1);
      border-radius:50%;
16521b31   liuqimichale   产品自适应
396
  }