06d3021b by TaishiTokudome

ビデオライブラリページCSS修正

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