.blog-archive-list {
display: flex;
flex-wrap: wrap;
margin: 0 -5px;
}
ol,
ul {
list-style: none;
}
.section-inner {
margin: 0 auto;
width: 1030px;
}
.section-title {
font-size: 36px;
letter-spacing: 0.5px;
margin: 40px 0 50px;
color: #323232;
font-weight: bold !important;
}
.blog-archive-list li {
border-radius: 4px;
box-shadow: 0 0 0.5rem rgb(0 0 0 / 10%);
margin-left: 5px;
margin-right: 5px;
margin-bottom: 2%;
width: calc(100% / 5 - 10px);
}
.blog-archive-list li a {
line-height: inherit !important;
}
.blog-archive-list li .blog-catch-img {
position: relative;
}
.blog-archive-list li .blog-catch-img img {
-o-object-fit: cover;
border-radius: 4px 4px 0 0;
height: 100px;
object-fit: cover;
width: 100%;
}
.blog-archive-list li .blog-catch-img .blog-archive-date {
background: #de1122;
border-radius: 0 4px 0 0;
bottom: 0;
color: #fff;
display: inline-block;
font-size: 10px;
font-weight: 700;
left: 0;
padding: 4px;
position: absolute;
}
.blog-pagination {
margin-top: 12px;
}
.blog-pagination .page-numbers {
align-items: center;
display: flex;
justify-content: center;
}
.blog-pagination ul {
margin: 0 -8px;
}
.blog-pagination ul li {
margin: 0 8px;
}
.blog-pagination li>.current {
background: #323232;
color: #fff;
}
.blog-pagination .page-numbers {
align-items: center;
display: flex;
justify-content: center;
}
.blog-pagination li>* {
border: 1px solid #323232;
color: #323232;
font-size: 14px;
font-weight: 700;
height: 34px;
width: 34px;
}
.blog-pagination li>.next,
.blog-pagination li>.prev {
border: none;
height: auto;
width: auto;
position: relative;
padding: 0;
margin: 0;
}
.blog-pagination-prev,
.blog-pagination-next {
border-bottom: 2px solid #323232;
border-right: 2px solid #323232;
height: 12px;
width: 12px;
}
.blog-pagination li>.prev:hover,
.blog-pagination li>.next:hover {
background-color: transparent !important;
}
.blog-pagination-next {
transform: rotate(-45deg);
}
.blog-pagination-prev {
transform: rotate(135deg);
}
.p-12 {
padding: 12px !important;
}
.blog-archive-list li .blog-archive-category {
color: #de1122;
font-size: 12px;
}
.blog-archive-list li .blog-archive-ttl {
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
color: #323232;
display: -webkit-box;
font-size: 12px;
font-weight: 700;
overflow: hidden;
}
.blog-archive-list li .blog-archive-shop {
color: #323232;
font-size: 10px;
}
.search-blog {
background: #f1f1f1;
position: relative;
border-radius: 10px;
display: flex;
}
.search-blog .search-blog-mlabel {
text-align: center;
padding-top: 10px;
font-size: 15px;
font-weight: 700;
}
.only-sp {
display: none !important;
}
.search-blog-form {
padding: 15px;
width: calc(100% - 85px);
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
display: flex;
}
.search-blog-form ul {
display: flex;
width: 100%;
}
.search-blog-form li {
text-align: left;
display: block;
margin-bottom: 0;
line-height: 40px;
}
.search-blog-btn {
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
background: #df1022;
width: 85px;
position: relative;
}
.search-blog-btn input[type='image'] {
width: 30px;
height: 30px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.search-blog li span {
font-size: 16px;
font-weight: 700;
color: #000;
width: 100px;
padding: 0 15px;
display: initial !important;
}
.search-blog-label {
border-right: 1px solid #d8d8d8;
width: 100%;
}
.search-blog-form input[type='text'] {
min-height: 25px;
border-radius: 5px;
border: 0;
width: 500px;
padding: 0 10px;
line-height: 40px;
}
.c-yellow {
color: #ff0;
}
.hot-keyword {
margin-bottom: 10px;
}
.hot-keyword h3 {
margin-bottom: 15px;
font-size: 16px;
font-weight: bold !important;
}
.keyword-list {
flex-wrap: wrap;
}
.keyword-list a {
color: #323232;
padding-right: 15px;
padding-bottom: 10px;
display: block;
font-size: 16px;
}