#search-result{margin-top: var(--ace-gutter);} #search-result .search-bar { width: 100%;} #search-result .search-form { display: flex;box-shadow: var(--ace-shadow-main);border-radius: 5px;overflow: hidden;border: 1px solid #e8e4f3;} #search-result .search-input { flex: 1;border: none;height: 56px;padding: 0 22px;font-size: 16px;background: #fff;color: #333;outline: none;} #search-result .search-input::placeholder { color: #999;} #search-result .search-input:focus { border-color: var(--ace-color-main);} #search-result .search-button { display: flex;align-items: center;justify-content: center;width: 120px;height: 56px;border-radius: 0 5px 5px 0;background: var(--ace-color-button);color: #fff;border: none;font-size: 18px;transition: background 0.2s ease;} #search-result .search-button .icon-search { font-size: 22px;margin-right: 5px;} #search-result .search-button:hover { background: var(--ace-color-button-hover);} #search-result .search-title{ font-size: 24px;color: var(--ace-color-main);margin: 15px 0;} #search-result .search-group { margin-bottom: var(--ace-gutter);} #search-result .search-group:last-child { margin-bottom: 0;} #search-result .search-group-title { font-size: 20px;color: var(--ace-color-main);margin-bottom: 15px;padding-bottom: 10px;border-bottom: 1px solid #eee;} #search-result .search-group-list { display: flex;flex-wrap: wrap;gap: 10px;} #search-result .search-group-item { display: inline-block;padding: 8px 16px;font-size: 15px;color: #333;background: #fff;border: 1px solid #ddd;border-radius: 20px;text-decoration: none;transition: all 0.2s ease;} #search-result .search-group-item:hover { color: #fff;background: var(--ace-color-button);border-color: var(--ace-color-button);} #search-result .search-empty { text-align: center;font-size: 16px;color: #999;padding: 40px 0;} @media (max-width: 575px) { #search-result .search-input { height: 48px;padding: 0 14px;font-size: 15px;} #search-result .search-button { height: 48px;} #search-result .search-group-title { font-size: 16px;} } .collection{padding-top: 15px;} @media (max-width: 767px) { .collection{padding-top: 5px;} } .collection{width:100%;display:grid;grid-template-columns:repeat(1, 1fr);gap:var(--ace-gutter);} @media (min-width:768px){ .collection{grid-template-columns:repeat(2, 1fr);} } @media (min-width:992px){ .collection{grid-template-columns:repeat(3, 1fr);} } .collection .article-item{width:100%;height:auto;overflow:hidden;border-radius:5px;border:1px solid #DDD;background:#fff;box-shadow:var(--shadow-main);} .collection .article-item img{width:100%;height:auto;overflow:hidden;transition:transform 1s ease;} .collection .article-item:hover img{transform:scale(1.1);} .collection .article-item .item-title{width:100%;height:auto;min-height:0;font-size:18px;font-weight:400;line-height:25px;overflow:hidden;padding:15px 15px 10px;} .collection .article-item .item-info{width:100%;height:20px;line-height:20px;padding-left: 15px;margin: 0 0 5px;color:#666;} .collection .article-item .item-info span{color: #999;margin-right: 5px;} .collection .article-item .item-info:last-child{ margin-bottom: 15px;}