* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: "Hiragino Sans", "Yu Gothic", sans-serif; line-height: 1.6; max-width: 1200px; margin: 0 auto; padding: 0 16px; background: #f5f5f5; color: #333; }
header { padding: 24px 0; border-bottom: 2px solid #e0e0e0; margin-bottom: 24px; }
header h1 a { color: #333; text-decoration: none; }

/* Navigation */
.site-nav { margin-top: 12px; display: flex; gap: 16px; flex-wrap: wrap; }
.site-nav a { color: #555; text-decoration: none; font-size: 14px; padding: 4px 12px; border-radius: 4px; background: #e8e8e8; transition: background 0.2s; }
.site-nav a:hover { background: #d0d0d0; }

/* Product Grid */
.product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.product-card { background: #fff; border-radius: 8px; padding: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); display: flex; flex-direction: column; }
.product-card img { width: 100%; height: auto; border-radius: 4px; }
.product-card h3, .product-card h4 { font-size: 14px; margin: 8px 0 4px; }
.product-card h3 a, .product-card h4 a { color: #333; text-decoration: none; }
.price { color: #e53935; font-weight: bold; }

/* Product Detail */
.product-detail img { max-width: 400px; width: 100%; height: auto; }
.tags { margin: 8px 0; }
.tag { display: inline-block; background: #e0e0e0; padding: 2px 8px; border-radius: 4px; font-size: 12px; margin: 2px; }

/* CTA Buttons */
.affiliate-btn { display: inline-block; background: #e53935; color: #fff; padding: 12px 32px; border-radius: 4px; text-decoration: none; font-weight: bold; margin: 16px 0; transition: background 0.2s; }
.affiliate-btn:hover { background: #c62828; }
.affiliate-btn-lg { display: block; text-align: center; padding: 16px 40px; font-size: 18px; border-radius: 8px; }
.affiliate-btn-sm { display: inline-block; background: #e53935; color: #fff; padding: 6px 16px; border-radius: 4px; text-decoration: none; font-size: 13px; font-weight: bold; margin-top: 8px; transition: background 0.2s; }
.affiliate-btn-sm:hover { background: #c62828; }

/* Related Products */
.related { margin-top: 40px; padding-top: 24px; border-top: 1px solid #e0e0e0; }
.related h3 { margin-bottom: 16px; }

/* See All Link */
.see-all { display: inline-block; margin-top: 16px; color: #1976d2; text-decoration: none; font-weight: bold; }
.see-all:hover { text-decoration: underline; }

/* Ranking */
.ranking-list { background: #fff; border-radius: 8px; padding: 16px; }
.ranking-item { padding: 8px 0; border-bottom: 1px solid #eee; }
.rank { font-weight: bold; color: #e53935; margin-right: 8px; }

/* Pagination */
.pagination { display: flex; justify-content: center; align-items: center; gap: 16px; margin: 32px 0; }
.page-link { color: #1976d2; text-decoration: none; padding: 8px 16px; border: 1px solid #1976d2; border-radius: 4px; }
.page-link:hover { background: #1976d2; color: #fff; }
.page-info { color: #666; font-size: 14px; }

/* Sections */
section { margin-bottom: 40px; }
section h2 { margin-bottom: 16px; }

footer { margin-top: 48px; padding: 24px 0; border-top: 1px solid #e0e0e0; text-align: center; font-size: 12px; color: #999; }

/* Responsive */
@media (max-width: 600px) {
  .product-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .product-card { padding: 8px; }
  .product-detail img { max-width: 100%; }
  .site-nav { gap: 8px; }
  .affiliate-btn-lg { padding: 12px 20px; font-size: 16px; }
}