ビデオライブラリ再構築
Showing
1 changed file
with
96 additions
and
3 deletions
... | @@ -3582,7 +3582,7 @@ body.itemid-132 table { | ... | @@ -3582,7 +3582,7 @@ body.itemid-132 table { |
3582 | /* ------------------------------------------------------------------------- | 3582 | /* ------------------------------------------------------------------------- |
3583 | ビデオライブラリページ | 3583 | ビデオライブラリページ |
3584 | ------------------------------------------------------------------------- */ | 3584 | ------------------------------------------------------------------------- */ |
3585 | #content .blog.videos-custom h3 { | 3585 | /* #content .blog.videos-custom h3 { |
3586 | margin-bottom: 0px; | 3586 | margin-bottom: 0px; |
3587 | margin-top: 10px; | 3587 | margin-top: 10px; |
3588 | } | 3588 | } |
... | @@ -3627,10 +3627,10 @@ body.itemid-132 table { | ... | @@ -3627,10 +3627,10 @@ body.itemid-132 table { |
3627 | background: none; | 3627 | background: none; |
3628 | margin-top: 15px; | 3628 | margin-top: 15px; |
3629 | margin-bottom: 5px; | 3629 | margin-bottom: 5px; |
3630 | } | 3630 | } */ |
3631 | 3631 | ||
3632 | /* ビデオライブラリページ レスポンシブ*/ | 3632 | /* ビデオライブラリページ レスポンシブ*/ |
3633 | @media (max-width: 900px) { | 3633 | /* @media (max-width: 900px) { |
3634 | .blog.videos-custom-item-wrapper:before { | 3634 | .blog.videos-custom-item-wrapper:before { |
3635 | width: calc(50% - 8px); | 3635 | width: calc(50% - 8px); |
3636 | } | 3636 | } |
... | @@ -3670,6 +3670,99 @@ body.itemid-132 table { | ... | @@ -3670,6 +3670,99 @@ body.itemid-132 table { |
3670 | .blog.videos-custom .videos-custom-item-wrapper > li > p { | 3670 | .blog.videos-custom .videos-custom-item-wrapper > li > p { |
3671 | margin-bottom: 0; | 3671 | margin-bottom: 0; |
3672 | } | 3672 | } |
3673 | } */ | ||
3674 | |||
3675 | /* ------------------------------------------------------------------------- | ||
3676 | ビデオライブラリページ(再構築) | ||
3677 | ------------------------------------------------------------------------- */ | ||
3678 | /* #content .videos-custom h3 { | ||
3679 | margin-bottom: 0px; | ||
3680 | margin-top: 10px; | ||
3681 | } */ | ||
3682 | |||
3683 | .videos-custom ul { | ||
3684 | display: flex; | ||
3685 | flex-wrap: wrap; | ||
3686 | justify-content: space-between; | ||
3687 | margin: 0 0 16px; | ||
3688 | |||
3689 | } | ||
3690 | |||
3691 | .videos-custom ul:before { | ||
3692 | content: ""; | ||
3693 | display: block; | ||
3694 | min-width: 190px; | ||
3695 | width: calc(33% - 8px); | ||
3696 | height: 0px; | ||
3697 | order: 1; | ||
3698 | } | ||
3699 | |||
3700 | .videos-custom ul:after { | ||
3701 | content: ""; | ||
3702 | display: block; | ||
3703 | min-width: 190px; | ||
3704 | width: calc(33% - 8px); | ||
3705 | height: 0px; | ||
3706 | } | ||
3707 | |||
3708 | .videos-custom ul > li { | ||
3709 | list-style: none; | ||
3710 | min-width: 190px; | ||
3711 | width: calc(33% - 8px); | ||
3712 | margin-bottom: 16px; | ||
3713 | font-size: 1rem; | ||
3714 | text-align: justify; | ||
3715 | } | ||
3716 | |||
3717 | .videos-custom ul > li > h5 { | ||
3718 | padding-left: 0; | ||
3719 | font-size: 1.125rem; | ||
3720 | background: none; | ||
3721 | margin-top: 15px; | ||
3722 | margin-bottom: 5px; | ||
3723 | } | ||
3724 | |||
3725 | /* ビデオライブラリページ レスポンシブ*/ | ||
3726 | @media (max-width: 900px) { | ||
3727 | .videos-custom ul:before { | ||
3728 | width: calc(50% - 8px); | ||
3729 | } | ||
3730 | .videos-custom ul:after { | ||
3731 | width: calc(50% - 8px); | ||
3732 | } | ||
3733 | .videos-custom ul > li { | ||
3734 | width: calc(50% - 8px); | ||
3735 | } | ||
3736 | } | ||
3737 | |||
3738 | @media (max-width: 550px) { | ||
3739 | /* #content .videos-custom h3 { | ||
3740 | margin-bottom: 10px; | ||
3741 | margin-top: 0px; | ||
3742 | margin-bottom: 0px; | ||
3743 | margin-top: 10px; | ||
3744 | } */ | ||
3745 | |||
3746 | .videos-custom ul { | ||
3747 | display: block; | ||
3748 | } | ||
3749 | |||
3750 | .videos-custom ul > li { | ||
3751 | height: auto; | ||
3752 | width: 100%; | ||
3753 | padding-bottom: 2px; | ||
3754 | border-bottom: #003894 2px solid; | ||
3755 | margin-bottom: 10px; | ||
3756 | font-size: 0.875rem; | ||
3757 | } | ||
3758 | |||
3759 | .videos-custom ul > li > h5 { | ||
3760 | font-size: 1rem; | ||
3761 | } | ||
3762 | |||
3763 | .videos-custom ul > li > p { | ||
3764 | margin-bottom: 0; | ||
3765 | } | ||
3673 | } | 3766 | } |
3674 | 3767 | ||
3675 | /* ------------------------------------------------------------------------- | 3768 | /* ------------------------------------------------------------------------- | ... | ... |
-
Please register or sign in to post a comment