.container { width:100%; max-width:600px; margin:40px auto 0; padding:0 1rem; background:#C4CF55; min-height:100vh; box-sizing:border-box; }
.list-write { width:100%; font-size:1.5rem; margin-bottom:1rem; text-align:center; }


.search-form-board { display:flex; gap:0.5rem; margin-bottom:1rem; }
.search-input      { flex:1; padding:0.5rem; font-size:1rem; border:1px solid #ccc; border-radius:4px; box-sizing:border-box; }
.search-button     { padding:0.5rem 1rem; font-size:1rem; background:#28a745; color:#fff; border:none; border-radius:4px; cursor:pointer; }

/* 카테고리 선택 폼 */
.category-form     { display:flex; gap:0.5rem; margin-bottom:1rem; }   /* //%%% gap, margin-bottom 을 검색폼과 동일하게 */  
.category-form select { flex:1; padding:0.5rem; font-size:1rem; border:1px solid #ccc; border-radius:4px; box-sizing:border-box; }  /* //%%% flex:1 으로 입력창과 동일 비율 */  
.category-form button { padding:0.5rem 1rem; font-size:1rem; background:#28a745; color:#fff; border:none; border-radius:4px; cursor:pointer; }  /* //%%% 버튼 패딩 및 스타일 검색버튼과 동일 */  
.category-form label  { display:none; }


.select-all        { display:flex; align-items:center; margin-bottom:1rem; }
.post-list         { list-style:none; padding:0; margin:0; }
.post-item         { display:grid; grid-template-columns:80px 1fr; gap:0.75rem; padding:0.75rem; border-bottom:1px solid #ddd; align-items:center; }
.thumb              { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:4px; }
.post-summary      { display:flex; flex-direction:column; justify-content:center; }

.post-title        { font-size:1rem; font-weight:bold; margin:0 0 0.5rem; }
.post-title a      { color:#111; text-decoration:none; }

.post-meta         { display:flex; flex-wrap:wrap; align-items:center; gap:0.5rem; font-size:0.85rem; color:#555; }
.info              { color:#666; }
.vote-btn          { background:none; border:none; cursor:pointer; font-size:0.9rem; color:#444; }
.icons             { margin-left:auto; font-size:0.9rem; color:#999; text-decoration:none; }

.write-btn         { display:block; width:100%; max-width:400px; margin:1rem auto 0; padding:0.75rem; font-size:1rem; background:#007bff; color:#fff; text-align:center; border-radius:4px; text-decoration:none; }

.pagination        { margin:1rem 0; text-align:center; }
.pagination a,
.pagination span  { display:inline-block; margin:0 0.25rem; padding:0.4rem 0.7rem; border:1px solid #ccc; border-radius:3px; text-decoration:none; color:#333; }
.pagination .active { background:#007bff; color:#fff; border-color:#007bff; }

/* 태블릿 이상 (≥600px) */
@media(min-width:600px) {
  .search-form-board    { gap:1rem; }
  .search-button        { flex:0 0 120px; }
  .post-item            { grid-template-columns:100px 1fr; padding:1rem 1.5rem; }
  .thumb                 { aspect-ratio:4/3; }
  .post-title           { font-size:1.1rem; }
  .post-meta            { font-size:0.9rem; }
}

/* 데스크탑 이상 (≥1024px) */
@media(min-width:1024px) {
  .container            { max-width:1000px; margin:80px auto 0; }
  .list-write           { font-size:1.75rem; margin-bottom:1.5rem; }
  .post-item            { grid-template-columns:120px 1fr; padding:1.5rem 2rem; }
  .thumb                 { aspect-ratio:4/3; }
  .post-title           { font-size:1.2rem; }
  .post-meta            { font-size:0.95rem; }
  .vote-btn             { margin-left:auto; }
}