.page-section .page-heading{margin-inline:var(--content-spacing)}@media (min-width:768px){.page-section .page-heading{margin-inline:0}}.filter-wrapper{background-color:#f5f5f5;padding:24px;display:flex;flex-direction:column;gap:24px}.filter{display:flex;flex-direction:column;gap:8px}@media (min-width:768px){.filter{display:grid;grid-template-columns:70px 1fr}}.filter .filter-label{display:flex;align-items:center;outline:none;border:none;justify-content:space-between;background-color:transparent;cursor:pointer;color:var(--text-color)}@media (min-width:768px){.filter .filter-label{gap:16px;pointer-events:none}.filter .filter-label>i{display:none}}.filter .filter-label>p{display:flex;align-items:center;gap:4px;font-size:14px}.filter .filter-label>i{transition:transform 0.3s ease}.filter .filter-label.is-open>i{transform:rotate(180deg)}.filter .filter-label .filter-label-value{font-size:14px;font-weight:700}@media (min-width:768px){.filter .filter-label .filter-label-value{display:none}}.filter .filter-label.is-open .filter-label-value{display:none}.filter .filter-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;max-height:0;opacity:0;overflow:hidden;transition:max-height 0.3s ease,opacity 0.3s ease}@media (min-width:768px){.filter .filter-list{display:flex;flex-wrap:wrap;max-height:none !important;opacity:1 !important;overflow:visible}}.filter .filter-list.is-open{max-height:1000px;opacity:1}.filter .filter-list>a{display:inline-block;padding:11px 20px;border:1px solid #ccc;background-color:#fff;border-radius:9999px;text-decoration:none;line-height:1;color:#333;font-size:14px;transition:all 0.3s ease;grid-column:auto/span 1;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filter .filter-list>a.active{background-color:var(--main-color);color:#fff;border-color:var(--main-color);pointer-events:none}.filter .filter-list>a:hover:not(.active){background-color:#f0f0f0}.blog-contents{}.blog-count{padding-block-end:16px;text-align:left;padding-inline:var(--content-spacing)}@media (min-width:768px){.blog-count{padding-inline:0}}.blog-count p{font-size:14px}.blog-list{display:flex;flex-direction:column;gap:10px;background:#ededee}@media (min-width:768px){.blog-list{gap:20px;background:none}}@media (min-width:900px){.blog-list{gap:30px}}.blog-item{background-color:#fff;border-bottom:1px solid #e2e2e2;border-top:1px solid #e2e2e2;position:relative;display:flex;flex-direction:column}@media (min-width:768px){.blog-item{border:1px solid #e2e2e2;flex-direction:row;flex-flow:row-reverse}}.blog-item .item-link{width:100%;height:100%;position:absolute;left:0;top:0}.blog-item .item-link:hover{background:rgba(255,255,255,0.3)}.blog-item .head{margin-block:20px 10px;display:flex;align-items:center;gap:5px 0.5em;flex-wrap:wrap}@media (min-width:768px){.blog-item .head{gap:10px 0.5em}}.blog-item .head .time{display:block;color:#949494;font-size:16px;font-weight:bold}@media (min-width:768px){.blog-item .head .time{width:100%}}.blog-item .head.new::after{content:'NEW';display:flex;justify-content:center;align-items:center;width:62px;font-size:var(--text-xs);line-height:var(--line-height-md);background-color:#ec6d12;color:var(--text-contrast-color);font-family:'Averia Libre',sans-serif;font-weight:700}.blog-item .head .blog-type{font-size:12px;border:1px solid #999;border-radius:10px;font-weight:bold;display:inline-block;padding-inline:10px;line-height:18px;vertical-align:top}.blog-item .title{margin-block:10px;color:var(--sub-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;word-break:break-all}.blog-item .title .title-text{font-size:20px}.blog-item .content{padding-bottom:30px;flex-grow:1;padding-inline:var(--content-spacing)}@media (min-width:768px){.blog-item .content{padding-inline:20px;width:calc(100% - 240px)}}.blog-item .content .description{margin-top:15px}.blog-item .content .description p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;word-break:break-all}.blog-item .images{width:100%;height:240px}@media (min-width:768px){.blog-item .images{width:240px}}.blog-item .images .image{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}@media (min-width:768px){.blog-item .images .image{-o-object-fit:cover;object-fit:cover}}.pagination{padding-top:20px;padding-inline:var(--content-spacing)}@media (min-width:768px){.pagination{padding-top:40px}}
