f68d82c9 by Yokihito Oki

ビデオライブラリ再構築

1 parent e13a9235
......@@ -3582,7 +3582,7 @@ body.itemid-132 table {
/* -------------------------------------------------------------------------
 ビデオライブラリページ
------------------------------------------------------------------------- */
#content .blog.videos-custom h3 {
/* #content .blog.videos-custom h3 {
margin-bottom: 0px;
margin-top: 10px;
}
......@@ -3627,10 +3627,10 @@ body.itemid-132 table {
background: none;
margin-top: 15px;
margin-bottom: 5px;
}
} */
/* ビデオライブラリページ レスポンシブ*/
@media (max-width: 900px) {
/* @media (max-width: 900px) {
.blog.videos-custom-item-wrapper:before {
width: calc(50% - 8px);
}
......@@ -3670,6 +3670,99 @@ body.itemid-132 table {
.blog.videos-custom .videos-custom-item-wrapper > li > p {
margin-bottom: 0;
}
} */
/* -------------------------------------------------------------------------
 ビデオライブラリページ(再構築)
------------------------------------------------------------------------- */
/* #content .videos-custom h3 {
margin-bottom: 0px;
margin-top: 10px;
} */
.videos-custom ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 0 16px;
}
.videos-custom ul:before {
content: "";
display: block;
min-width: 190px;
width: calc(33% - 8px);
height: 0px;
order: 1;
}
.videos-custom ul:after {
content: "";
display: block;
min-width: 190px;
width: calc(33% - 8px);
height: 0px;
}
.videos-custom ul > li {
list-style: none;
min-width: 190px;
width: calc(33% - 8px);
margin-bottom: 16px;
font-size: 1rem;
text-align: justify;
}
.videos-custom ul > li > h5 {
padding-left: 0;
font-size: 1.125rem;
background: none;
margin-top: 15px;
margin-bottom: 5px;
}
/* ビデオライブラリページ レスポンシブ*/
@media (max-width: 900px) {
.videos-custom ul:before {
width: calc(50% - 8px);
}
.videos-custom ul:after {
width: calc(50% - 8px);
}
.videos-custom ul > li {
width: calc(50% - 8px);
}
}
@media (max-width: 550px) {
/* #content .videos-custom h3 {
margin-bottom: 10px;
margin-top: 0px;
margin-bottom: 0px;
margin-top: 10px;
} */
.videos-custom ul {
display: block;
}
.videos-custom ul > li {
height: auto;
width: 100%;
padding-bottom: 2px;
border-bottom: #003894 2px solid;
margin-bottom: 10px;
font-size: 0.875rem;
}
.videos-custom ul > li > h5 {
font-size: 1rem;
}
.videos-custom ul > li > p {
margin-bottom: 0;
}
}
/* -------------------------------------------------------------------------
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!