@import url('https://fonts.googleapis.com/css2?family=Hachi+Maru+Pop&display=swap');
/*
Theme Name: Shirouto Select
Theme URI: https://douga-kinko.com
Description: 素人動画金庫 - 無料素人動画まとめサイト専用テーマ
Version: 1.0
Author: Shirouto Select
*/

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Hiragino Kaku Gothic ProN','Meiryo',sans-serif;font-size:14px;background:#f5f5f5;color:#333}
a{color:#333;text-decoration:none}
a:hover{color:#e05a00}
img{max-width:100%;height:auto}

/* ヘッダー */
#site-header{background:#fff;border-bottom:2px solid #e05a00;padding:0 20px}
.header-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:16px;height:60px}
.site-title{font-size:22px;font-weight:700;color:#e05a00;white-space:nowrap}
.site-title a{color:#e05a00}
.header-search{flex:1;display:flex;align-items:center;background:#f5f5f5;border:1px solid #ddd;border-radius:4px;padding:6px 12px;gap:8px}
.header-search input{border:none;background:transparent;font-size:13px;width:100%;outline:none}
.header-search button{background:#e05a00;color:#fff;border:none;padding:5px 14px;border-radius:3px;cursor:pointer;font-size:12px;white-space:nowrap}
.header-sort{display:flex;gap:6px}
.sort-btn{font-size:12px;padding:5px 12px;border:1px solid #ddd;border-radius:3px;background:#fff;cursor:pointer;white-space:nowrap;color:#666}
.sort-btn.active{background:#e05a00;color:#fff;border-color:#e05a00}

/* レイアウト */
#wrapper{max-width:1280px;margin:16px auto;padding:0 16px;display:flex;gap:20px}
#sidebar{width:200px;min-width:200px;flex-shrink:0}
#main{flex:1;min-width:0}

/* サイドバー */
.sidebar-box{background:#fff;border:1px solid #e0e0e0;border-radius:6px;margin-bottom:14px;overflow:hidden}
.sidebar-box-title{font-size:13px;font-weight:700;padding:10px 14px;background:#f8f8f8;border-bottom:1px solid #e0e0e0;color:#333}

/* ランキングタブ */
.rank-tabs{display:flex;border-bottom:1px solid #e0e0e0}
.rank-tab{flex:1;font-size:11px;padding:7px 2px;text-align:center;cursor:pointer;background:#fafafa;border:none;color:#888;border-right:1px solid #e0e0e0}
.rank-tab:last-child{border-right:none}
.rank-tab.active{background:#e05a00;color:#fff;font-weight:700}
.rank-list{padding:8px 0}
.rank-item{display:flex;align-items:flex-start;gap:8px;padding:6px 12px;border-bottom:1px solid #f0f0f0;cursor:pointer}
.rank-item:last-child{border-bottom:none}
.rank-num{font-size:14px;font-weight:700;min-width:18px;color:#ccc;line-height:1.3}
.rank-num.top3{color:#e05a00}
.rank-thumb{width:48px;min-width:48px;aspect-ratio:3/4;background:#111;border-radius:3px;overflow:hidden}
.rank-thumb img{width:100%;height:100%;object-fit:cover}
.rank-title{font-size:11px;color:#555;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ジャンル */
.genre-list{padding:6px 0}
.genre-item{display:flex;align-items:center;justify-content:space-between;padding:7px 14px;font-size:13px;color:#555;cursor:pointer;border-bottom:1px solid #f5f5f5;border-left:3px solid transparent}
.genre-item:hover{background:#fdf5f0;color:#e05a00}
.genre-item.active{border-left:3px solid #e05a00;color:#e05a00;background:#fdf5f0;font-weight:700}
.genre-count{font-size:10px;background:#f0f0f0;color:#999;padding:1px 6px;border-radius:10px}
.genre-item.active .genre-count{background:#fce0d0;color:#e05a00}

/* メインエリア */
.result-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.result-count{font-size:12px;color:#999}

/* カードグリッド */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:900px){.card-grid{grid-template-columns:repeat(2,1fr)}}

.card{background:#fff;border:1px solid #e0e0e0;border-radius:6px;overflow:hidden;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.card:hover{border-color:#e05a00;box-shadow:0 2px 8px rgba(224,90,0,.12)}
.card-thumb{width:100%;aspect-ratio:2/3;background:#111;position:relative;overflow:hidden}
.card-thumb img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .3s}
.card:hover .card-thumb img{transform:scale(1.04)}
.thumb-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#f0f0f0;color:#bbb;font-size:12px}
.new-badge{position:absolute;top:6px;left:6px;background:#e05a00;color:#fff;font-size:9px;padding:2px 7px;border-radius:3px;font-weight:700}
.card-body{padding:10px 12px}
.card-title{font-size:13px;font-weight:700;color:#222;line-height:1.5;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-desc{font-size:12px;color:#777;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ページネーション */
.pagination{display:flex;gap:6px;justify-content:center;padding:24px 0 8px;flex-wrap:wrap}
.page-btn{font-size:14px;border:1px solid #ddd;border-radius:4px;background:#fff;color:#666;cursor:pointer;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;padding:0}
.page-btn a{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:44px;min-height:44px;padding:10px 16px;color:#666;text-decoration:none}
.page-btn.active{background:#e05a00;color:#fff;border-color:#e05a00}
.page-btn.active a{color:#fff}
.page-btn:hover:not(.active){background:#f5f5f5}

/* フッター */
#site-footer{background:#333;color:#aaa;text-align:center;padding:20px;font-size:12px;margin-top:30px}
#site-footer a{color:#aaa}

/* ウィジェット */
.widget{background:#fff;border:1px solid #e0e0e0;border-radius:6px;margin-bottom:14px;overflow:hidden}
.widget-title{font-size:13px;font-weight:700;padding:10px 14px;background:#f8f8f8;border-bottom:1px solid #e0e0e0}

/* single page */
.single-wrap{max-width:860px;margin:20px auto;padding:0 16px}
.single-title{font-size:18px;font-weight:bold;margin-bottom:14px;line-height:1.5}
.single-imgs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
.single-imgs a{display:block}
.single-imgs img{width:100%;height:auto;border-radius:4px;display:block}
.single-actress{font-size:13px;color:#666;margin-bottom:12px}
.single-btn-wrap{text-align:center;margin:24px 0}
.fanza-btn{display:inline-block;background:#e05a00;color:#fff;padding:14px 36px;border-radius:8px;font-weight:bold;font-size:17px;text-decoration:none}
.fanza-btn:hover{background:#c04a00;color:#fff}

/* 殿堂入りタブ */
.hof-tab{display:block;background:#f5a623;color:#fff;font-size:13px;font-weight:700;text-align:center;padding:10px 14px;border-radius:6px;margin-bottom:14px;text-decoration:none;letter-spacing:.05em}
.hof-tab:hover{background:#e09400;color:#fff}

/* === スマホ対応 (768px以下) === */
@media (max-width: 768px) {
  #wrapper { flex-direction: column; padding: 0 8px; gap: 12px; }
  #sidebar { display: none; }
  #main { min-width: 0; width: 100%; }
  .card-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .single-wrap { padding: 0 4px; }
  .single-title { font-size: 15px; margin-bottom: 10px; }
  .single-imgs { display: block; }
  .single-imgs a { display: block; margin-bottom: 8px; }
  .single-imgs img { width: 100%; height: auto; }
  .single-movie iframe { height: 200px; }
  .header-inner { flex-wrap: wrap; height: auto; padding: 8px 0; gap: 8px; }
  .site-title { font-size: 18px; }
  .header-search { width: 100%; order: 3; }
  .header-sort { gap: 4px; }
  .sort-btn { font-size: 11px; padding: 4px 8px; }
}


/* 関連がある作品 */
.related-posts {
  margin: 40px 0 20px;
  padding-top: 20px;
  border-top: 2px solid #eee;
}
.related-title {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 16px;
  color: #333;
}
.related-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}
.related-item {
  display: block;
  text-decoration: none;
  color: #333;
  font-size: 12px;
}
.related-item img {
  width: 100%;
  aspect-ratio: 2/3;
  object-fit: contain;
  background: #111;
  border-radius: 4px;
  display: block;
  margin-bottom: 6px;
}
.related-item span {
  display: block;
  line-height: 1.4;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.related-item:hover {
  color: #e05a00;
}
@media (max-width: 768px) {
  .related-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* 見どころシーン */
.scene-title {
  font-size: 18px;
  font-weight: bold;
  margin: 24px 0 12px;
  padding: 8px 12px;
  background: #f5f5f5;
  border-left: 4px solid #e05a00;
  color: #333;
}

/* ジャンル・プレイ内容タグ */
.genre-tags-section {
  margin: 24px 0;
  padding: 16px;
  background: #fafafa;
  border-radius: 8px;
  border: 1px solid #eee;
}
.genre-group {
  margin-bottom: 12px;
}
.genre-group:last-child {
  margin-bottom: 0;
}
.genre-label {
  display: block;
  font-size: 12px;
  font-weight: bold;
  color: #666;
  margin-bottom: 8px;
}
.genre-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.genre-tag {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 12px;
  text-decoration: none;
  transition: opacity 0.2s;
}
.genre-tag:hover {
  opacity: 0.8;
}
.theme-tag {
  background: #e8f4fd;
  color: #2980b9;
  border: 1px solid #aed6f1;
}
.play-tag {
  background: #fdecea;
  color: #c0392b;
  border: 1px solid #f1948a;
}

@media (max-width: 768px) {
  .genre-tags-section {
    padding: 12px;
  }
}

/* ===== ヘッダーリデザイン ===== */
.site-header {
  background: #fff0f6;
  padding: 18px 0 0;
}
.site-header .header-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
  text-align: center;
  display: block;
  height: auto;
  flex: none;
  gap: 0;
}
.site-title-link {
  text-decoration: none;
  display: inline-block;
  margin-bottom: 8px;
}
.site-title-main {
  font-family: 'Hachi Maru Pop', cursive;
  font-size: 36px;
  font-weight: 400;
  color: #c94f7c;
  text-shadow: 2px 2px 0px #f7c0d8;
  letter-spacing: 0.1em;
}
.site-title-accent {
  font-family: 'Hachi Maru Pop', cursive;
  font-size: 36px;
  font-weight: 400;
  color: #c94f7c;
  text-shadow: 2px 2px 0px #f7c0d8;
  letter-spacing: 0.1em;
}
.header-line {
  height: 3px;
  background: #f7c0d8;
  width: 100%;
}
@media (max-width: 768px) {
  .site-title-main,
  .site-title-accent {
    font-size: 28px;
  }
}

/* ===== ランキング画像拡大・タイトル非表示 ===== */
.rank-thumb {
  width: 80px;
  min-width: 80px;
  aspect-ratio: 3/4;
}
.rank-title {
  display: none;
}
.rank-item {
  align-items: center;
}

/* ===== レビュー ===== */
.review-box {
  background: #fff9fb;
  border-left: 4px solid #ff6eb4;
  border-radius: 0 8px 8px 0;
  padding: 20px 24px;
  margin: 20px 0 28px;
}
.review-label {
  font-size: 20px;
  font-weight: 700;
  color: #ff6eb4;
  display: block;
  margin: 0 0 12px;
  letter-spacing: 0.06em;
  font-family: 'Zen Kaku Gothic New', sans-serif;
}
.review-text {
  font-size: 16px;
  line-height: 2;
  color: #333;
  margin: 0;
}
.card-review {
  font-size: 11px;
  color: #888;
  line-height: 1.5;
  margin-top: 4px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.header-subtitle {
  font-size: 11px;
  color: #e897bc;
  letter-spacing: 0.2em;
  margin-top: 4px;
  margin-bottom: 10px;
}
