質問編集履歴

1

他のファイル情報を追記致しました。

2017/02/07 12:38

投稿

kinu221
kinu221

スコア26

test CHANGED
File without changes
test CHANGED
@@ -88,6 +88,582 @@
88
88
 
89
89
 
90
90
 
91
+ CSS
92
+
93
+ body {
94
+
95
+ margin: 0;
96
+
97
+ }
98
+
99
+
100
+
101
+ a {
102
+
103
+ text-decoration: none;
104
+
105
+ }
106
+
107
+
108
+
109
+ .top-wrapper {
110
+
111
+ padding: 180px 0 100px 0;
112
+
113
+ background-image: url(https://prog-8.com/images/html/advanced/top.png);
114
+
115
+ background-size: cover;
116
+
117
+ color: white;
118
+
119
+ text-align: center;
120
+
121
+ }
122
+
123
+
124
+
125
+ .container {
126
+
127
+ width: 1170px;
128
+
129
+ padding: 0 15px;
130
+
131
+ margin: 0 auto;
132
+
133
+ }
134
+
135
+
136
+
137
+ .top-wrapper h1 {
138
+
139
+ opacity: 0.7;
140
+
141
+ font-size: 45px;
142
+
143
+ letter-spacing: 5px;
144
+
145
+ }
146
+
147
+
148
+
149
+ .top-wrapper p {
150
+
151
+ opacity: 0.7;
152
+
153
+ font-size: 14px;
154
+
155
+ margin-bottom: 35px;
156
+
157
+ }
158
+
159
+
160
+
161
+ .signup {
162
+
163
+ background-color: #239b76;
164
+
165
+ }
166
+
167
+
168
+
169
+ .facebook {
170
+
171
+ background-color: #3b5998;
172
+
173
+ margin-right: 10px;
174
+
175
+ }
176
+
177
+
178
+
179
+ .twitter {
180
+
181
+ background-color: #55acee;
182
+
183
+ }
184
+
185
+
186
+
187
+ .btn {
188
+
189
+ padding: 8px 24px;
190
+
191
+ color: white;
192
+
193
+ display: inline-block;
194
+
195
+ opacity: 0.8;
196
+
197
+ border-radius: 4px;
198
+
199
+ cursor: pointer;
200
+
201
+ }
202
+
203
+
204
+
205
+ .btn:hover {
206
+
207
+ opacity: 1;
208
+
209
+ }
210
+
211
+
212
+
213
+ .fa {
214
+
215
+ margin-right: 5px;
216
+
217
+ }
218
+
219
+
220
+
221
+ header {
222
+
223
+ height: 65px;
224
+
225
+ width: 100%;
226
+
227
+ background-color: rgba(34,49,52,0.9);
228
+
229
+ position :fixed;
230
+
231
+ top: 0;
232
+
233
+ z-index: 10;
234
+
235
+ }
236
+
237
+
238
+
239
+ .logo {
240
+
241
+ width: 124px;
242
+
243
+ margin-top: 20px;
244
+
245
+ }
246
+
247
+
248
+
249
+ .header-left {
250
+
251
+ float: left;
252
+
253
+ }
254
+
255
+
256
+
257
+ .header-right {
258
+
259
+ float: right;
260
+
261
+ background-color: rgba(255,255,255,0.3);
262
+
263
+ transition: all 0.5s;
264
+
265
+ }
266
+
267
+
268
+
269
+ .header-right:hover {
270
+
271
+ background-color: rgba(255,255,255,0.5);
272
+
273
+ }
274
+
275
+
276
+
277
+ .header-right .login {
278
+
279
+ line-height: 65px;
280
+
281
+ padding: 0 25px;
282
+
283
+ color: white;
284
+
285
+ cursor: pointer;
286
+
287
+ display: block;
288
+
289
+ }
290
+
291
+
292
+
293
+ /*モーダル*/
294
+
295
+ .login-modal-wrapper, .signup-modal-wrapper {
296
+
297
+ display: none;
298
+
299
+ position: fixed;
300
+
301
+ top: 0;
302
+
303
+ right: 0;
304
+
305
+ bottom: 0;
306
+
307
+ left: 0;
308
+
309
+ background-color: rgba(0, 0, 0, 0.6);
310
+
311
+ z-index: 100;
312
+
313
+ }
314
+
315
+
316
+
317
+ .modal {
318
+
319
+ position: absolute;
320
+
321
+ top: 20%;
322
+
323
+ left: 34%;
324
+
325
+ background-color: #e6ecf0;
326
+
327
+ padding: 20px 0 40px;
328
+
329
+ border-radius: 10px;
330
+
331
+ width: 450px;
332
+
333
+ height: auto;
334
+
335
+ text-align: center;
336
+
337
+ }
338
+
339
+
340
+
341
+ .fa-times {
342
+
343
+ position: absolute;
344
+
345
+ top: 12px;
346
+
347
+ right: 12px;
348
+
349
+ color: rgba(128, 128, 128, 0.46);
350
+
351
+ cursor: pointer;
352
+
353
+ }
354
+
355
+
356
+
357
+ #signup-form, #login-form {
358
+
359
+ width: 100%;
360
+
361
+ }
362
+
363
+
364
+
365
+ #signup-form h2, #login-form h2 {
366
+
367
+ color: #5f5d60;
368
+
369
+ letter-spacing: 1px;
370
+
371
+ margin-bottom: 40px;
372
+
373
+ }
374
+
375
+
376
+
377
+ #signup-form input, #login-form input {
378
+
379
+ width: 320px;
380
+
381
+ margin-bottom: 20px;
382
+
383
+ font-size: 12px;
384
+
385
+ padding: 12px 12px;
386
+
387
+ border: 1px solid #d0d5d8;
388
+
389
+ border-radius: 5px;
390
+
391
+ }
392
+
393
+
394
+
395
+ #submit-btn {
396
+
397
+ display: inline-block;
398
+
399
+ padding: 14px 140px;
400
+
401
+ background-color: #5dca88;
402
+
403
+ border: none;
404
+
405
+ border-radius: 3px;
406
+
407
+ color: white;
408
+
409
+ margin: 10px auto;
410
+
411
+ cursor: pointer;
412
+
413
+ }
414
+
415
+
416
+
417
+ .lesson-wrapper {
418
+
419
+ height: 500px;
420
+
421
+ padding-bottom: 80px;
422
+
423
+ background-color: #f7f7f7;
424
+
425
+ text-align: center;
426
+
427
+ }
428
+
429
+
430
+
431
+ .heading {
432
+
433
+ padding-top: 60px;
434
+
435
+ padding-bottom: 30px;
436
+
437
+ color: #5f5d60;
438
+
439
+ }
440
+
441
+
442
+
443
+ .heading h2 {
444
+
445
+ font-weight: normal;
446
+
447
+ }
448
+
449
+
450
+
451
+ .lesson {
452
+
453
+ float: left;
454
+
455
+ width: 25%;
456
+
457
+ }
458
+
459
+
460
+
461
+ .lesson-icon {
462
+
463
+ position: relative;
464
+
465
+ width: 70%;
466
+
467
+ margin: 0 auto;
468
+
469
+ }
470
+
471
+
472
+
473
+ .lesson-icon p {
474
+
475
+ position: absolute;
476
+
477
+ top: 75px;
478
+
479
+ width: 100%;
480
+
481
+ color: white;
482
+
483
+ }
484
+
485
+
486
+
487
+ .text-contents {
488
+
489
+ margin: 3% auto;
490
+
491
+ width: 80%;
492
+
493
+ font-size: 12px;
494
+
495
+ color: #b3aeb5;
496
+
497
+ display: none;
498
+
499
+ }
500
+
501
+
502
+
503
+ .text-active {
504
+
505
+ display: block;
506
+
507
+ }
508
+
509
+
510
+
511
+ /*faq wrapper*/
512
+
513
+ .faq-wrapper {
514
+
515
+ background-color: #e6ecf0;
516
+
517
+ text-align: center;
518
+
519
+ padding-bottom: 80px;
520
+
521
+ color: #5f5d60;
522
+
523
+ }
524
+
525
+
526
+
527
+ #faq-list {
528
+
529
+ width: 500px;
530
+
531
+ margin: 0 auto;
532
+
533
+ padding: 0;
534
+
535
+ list-style: none;
536
+
537
+ }
538
+
539
+
540
+
541
+ .faq-list-item {
542
+
543
+ margin:10px;
544
+
545
+ border-bottom:1px solid #ccc;
546
+
547
+ position:relative;
548
+
549
+ cursor:pointer;
550
+
551
+ text-align: left;
552
+
553
+ }
554
+
555
+
556
+
557
+ .faq-list-item h3 {
558
+
559
+ font-size: 14px;
560
+
561
+ }
562
+
563
+
564
+
565
+ .faq-list-item span {
566
+
567
+ position:absolute;
568
+
569
+ top:0;
570
+
571
+ right:5px;
572
+
573
+ color:#ccc;
574
+
575
+ font-size:13px;
576
+
577
+ }
578
+
579
+
580
+
581
+ .answer {
582
+
583
+ font-size: 12px;
584
+
585
+ padding: 5px 0px;
586
+
587
+ margin-bottom: 15px;
588
+
589
+ display: none;
590
+
591
+ }
592
+
593
+
594
+
595
+
596
+
597
+ .message-wrapper {
598
+
599
+ border-bottom: 1px solid #eee;
600
+
601
+ padding-bottom: 80px;
602
+
603
+ text-align: center;
604
+
605
+ }
606
+
607
+
608
+
609
+ .message-wrapper .heading h3 {
610
+
611
+ font-weight: normal;
612
+
613
+ }
614
+
615
+
616
+
617
+ .message {
618
+
619
+ padding: 15px 40px;
620
+
621
+ background-color: #5dca88;
622
+
623
+ cursor: pointer;
624
+
625
+ box-shadow: 0px 7px #1a7940;
626
+
627
+ }
628
+
629
+
630
+
631
+ .message:active {
632
+
633
+ position: relative;
634
+
635
+ top: 7px;
636
+
637
+ box-shadow: none;
638
+
639
+ }
640
+
641
+
642
+
643
+ footer img {
644
+
645
+ width: 125px;
646
+
647
+ }
648
+
649
+
650
+
651
+ footer p {
652
+
653
+ color: #b3aeb5;
654
+
655
+ font-size: 12px;
656
+
657
+ }
658
+
659
+
660
+
661
+ footer {
662
+
663
+ padding-top: 30px;
664
+
665
+ }
666
+
91
667
  ```
92
668
 
93
669