質問編集履歴

1

修正しました。

2021/08/20 01:25

投稿

free_teku
free_teku

スコア103

test CHANGED
File without changes
test CHANGED
@@ -294,6 +294,228 @@
294
294
 
295
295
  ```
296
296
 
297
+ ```CSS
298
+
299
+ .features .features-ttl {
300
+
301
+ font-size: 2.8rem;
302
+
303
+ line-height: 1.4;
304
+
305
+ color: #333;
306
+
307
+ font-weight: bold;
308
+
309
+ text-align: center;
310
+
311
+ }
312
+
313
+
314
+
315
+ @media print, screen and (max-width: 1024px) {
316
+
317
+ .features .features-ttl {
318
+
319
+ margin-bottom: 40px;
320
+
321
+ font-size: 2.25rem;
322
+
323
+ }
324
+
325
+ }
326
+
327
+
328
+
329
+ .features .features-list {
330
+
331
+ margin: 0 auto;
332
+
333
+ padding: 0;
334
+
335
+ }
336
+
337
+
338
+
339
+ .features .features-list .features-item {
340
+
341
+ display: -webkit-box;
342
+
343
+ display: -webkit-flex;
344
+
345
+ display: -ms-flexbox;
346
+
347
+ display: flex;
348
+
349
+ -webkit-box-pack: justify;
350
+
351
+ -webkit-justify-content: space-between;
352
+
353
+ -ms-flex-pack: justify;
354
+
355
+ justify-content: space-between;
356
+
357
+ -webkit-box-align: center;
358
+
359
+ -webkit-align-items: center;
360
+
361
+ -ms-flex-align: center;
362
+
363
+ align-items: center;
364
+
365
+ margin-top: 50px;
366
+
367
+ }
368
+
369
+
370
+
371
+ @media print, screen and (max-width: 1024px) {
372
+
373
+ .features .features-list .features-item {
374
+
375
+ -webkit-box-orient: vertical;
376
+
377
+ -webkit-box-direction: normal;
378
+
379
+ -webkit-flex-direction: column;
380
+
381
+ -ms-flex-direction: column;
382
+
383
+ flex-direction: column;
384
+
385
+ }
386
+
387
+ }
388
+
389
+
390
+
391
+ .features .features-list .features-item .feat-img {
392
+
393
+ display: block;
394
+
395
+ max-width: 380px;
396
+
397
+ }
398
+
399
+
400
+
401
+ .features .features-list .features-item .feat-img > img {
402
+
403
+ width: 100%;
404
+
405
+ }
406
+
407
+
408
+
409
+ @media print, screen and (max-width: 1024px) {
410
+
411
+ .features .features-list .features-item .feat-img {
412
+
413
+ margin-bottom: 30px;
414
+
415
+ }
416
+
417
+ }
418
+
419
+
420
+
421
+ .features .features-list .features-item .features-item:nth-child(even) {
422
+
423
+ display: -webkit-box;
424
+
425
+ display: -webkit-flex;
426
+
427
+ display: -ms-flexbox;
428
+
429
+ display: flex;
430
+
431
+ -webkit-box-orient: horizontal;
432
+
433
+ -webkit-box-direction: reverse;
434
+
435
+ -webkit-flex-direction: row-reverse;
436
+
437
+ -ms-flex-direction: row-reverse;
438
+
439
+ flex-direction: row-reverse;
440
+
441
+ }
442
+
443
+
444
+
445
+ .features .features-list .features-item .features-item:nth-child(even) .feat-img {
446
+
447
+ display: block;
448
+
449
+ width: 380px;
450
+
451
+ margin-right: 130px;
452
+
453
+ }
454
+
455
+
456
+
457
+ .features .features-list .features-txt {
458
+
459
+ width: 500px;
460
+
461
+ height: 350px;
462
+
463
+ }
464
+
465
+
466
+
467
+ .features .features-list .features-txt .feat-sub {
468
+
469
+ display: block;
470
+
471
+ font-size: 2.4rem;
472
+
473
+ line-height: 2;
474
+
475
+ font-weight: bold;
476
+
477
+ margin-bottom: 54px;
478
+
479
+ }
480
+
481
+
482
+
483
+ @media print, screen and (max-width: 1024px) {
484
+
485
+ .features .features-list .features-txt .feat-sub {
486
+
487
+ margin-bottom: 30px;
488
+
489
+ font-size: 2.0rem;
490
+
491
+ }
492
+
493
+ }
494
+
495
+
496
+
497
+ .features .features-list .features-txt .feat-desc {
498
+
499
+ line-height: 1.6;
500
+
501
+ }
502
+
503
+
504
+
505
+ @media print, screen and (max-width: 1024px) {
506
+
507
+ .features .features-list .features-txt .feat-desc {
508
+
509
+ font-size: 1.5rem;
510
+
511
+ }
512
+
513
+ }
514
+
515
+
516
+
517
+ ```
518
+
297
519
 
298
520
 
299
521
  ### 試したこと