.blog-archive-list {
display: flex;
flex-wrap: wrap;
margin: 0 -5px;
}
ol,
ul {
list-style: none;
}
.section-inner {
margin: 0 auto;
width: 90vw;
}
.breadcrumbs {
margin: 0 auto 24px;
padding: 13px 0 26px;
font-size: 14px;
background-image: url(//jewel-cafe.my/wp-content/themes/new_jewel5745747/rn/img/bg_breadcrumbs.png);
background-repeat: repeat-x;
background-position: left bottom;
background-size: auto 13px;
width: 90vw;
}
.breadcrumbs .wrap {
padding: 0;
}
.section-title {
margin: 12px 0 20px;
color: #323232;
font-size: 20px;
font-weight: bold !important;
letter-spacing: 1px;
}
.blog-archive-list li {
width: calc(100% / 2 - 10px);
margin-bottom: 4%;
margin-right: 5px;
margin-left: 5px;
-webkit-box-shadow: 0 0 0.5rem rgb(0 0 0 / 10%);
box-shadow: 0 0 0.5rem rgb(0 0 0 / 10%);
border-radius: 4px;
}
.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 1vw;
}
.blog-pagination li>.current {
background: #323232;
color: #fff;
}
.blog-pagination li>* {
border: 1px solid #323232;
color: #323232;
font-size: 12px;
font-weight: 700;
height: 7vw;
width: 7vw;
}
.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: 2vw;
width: 2vw;
margin-right: 1vw;
}
.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;
margin-top: 4px;
}
section.shop {
position: relative;
left: 50%;
width: 100vw;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.search-blog {
background: #f1f1f1;
position: relative;
border-radius: 10px;
}
.search-blog .search-blog-mlabel {
text-align: center;
padding-top: 10px;
font-size: 15px;
font-weight: 700;
}
.only-pc {
display: none !important;
}
.search-blog-form {
padding-bottom: 5px;
width: calc(100% - 70px);
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
display: flex;
}
.search-blog-form ul {
width: 100%;
}
.search-blog-form li {
line-height: 30px;
text-align: center;
display: flex;
margin-bottom: 8px;
}
.search-blog-btn {
background: #df1022;
border-radius: 5px;
padding: 10px;
position: absolute;
right: 15px;
top: 43%;
display: flex;
}
.search-blog-btn input[type='image'] {
width: 24px;
}
.search-blog li span {
font-size: 13px;
font-weight: 700;
color: #000;
line-height: 1.8;
}
.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: 100%;
padding: 0 10px;
}
.c-yellow {
color: #ff0;
}
.search-blog-m-btn input[type='image'] {
width: 24px;
}
.hot-keyword {
margin-bottom: 10px;
}
.hot-keyword h3 {
margin-bottom: 15px;
font-size: 14px;
font-weight: bold !important;
}
.keyword-list {
flex-wrap: wrap;
}
.keyword-list a {
color: #323232;
padding-right: 15px;
padding-bottom: 10px;
display: block;
font-size: 14px;
}