/* 投稿IDビューランキング v1.0.12 */
.pivr-ranking,
.pivr-ranking * { box-sizing:border-box; }
.pivr-ranking { width:100%; max-width:100%; min-width:0; overflow:hidden; }
.pivr-ranking .pivr-items { list-style:none !important; margin:0 !important; padding:0 !important; }
.pivr-ranking .pivr-item { position:relative; margin:0 !important; min-width:0; }
.pivr-ranking a { color:inherit !important; text-decoration:none !important; }
.pivr-ranking .pivr-picture { display:block !important; width:100% !important; height:100% !important; }
.pivr-ranking img {
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  box-shadow:none !important;
  object-fit:cover !important;
  image-rendering:auto !important;
}
.pivr-ranking .pivr-no-image { display:block; width:100%; height:100%; background:linear-gradient(135deg,#eee,#ddd); }
.pivr-ranking .pivr-rank {
  display:flex; align-items:center; justify-content:center;
  flex:0 0 auto;
  width:28px; height:28px; border-radius:50%;
  background:#252525; color:#fff; font-size:12px; font-weight:700; line-height:1;
  border:2px solid #fff; box-shadow:0 1px 3px rgba(0,0,0,.18);
}
.pivr-ranking .pivr-item:nth-child(1) .pivr-rank { background:#e4bd19; }
.pivr-ranking .pivr-item:nth-child(2) .pivr-rank { background:#aeb4bb; }
.pivr-ranking .pivr-item:nth-child(3) .pivr-rank { background:#d8732b; }
.pivr-ranking .pivr-category,
.pivr-ranking .pivr-views { display:block; font-size:12px; line-height:1.4; opacity:.72; }
.pivr-ranking .pivr-category { width:fit-content; padding:2px 6px; background:#f1f1f1; border-radius:2px; }
.pivr-empty { padding:12px; border:1px dashed #bbb; background:#fafafa; }

/* サイドバー：固定ランキングの1枚カードと同じ形で縦に10件並べる */
.pivr-layout-list .pivr-items {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
}
.pivr-layout-list .pivr-item {
  display:grid !important;
  grid-template-columns:28px minmax(0,1fr) !important;
  grid-template-rows:auto auto !important;
  column-gap:10px !important;
  row-gap:0 !important;
  align-items:start !important;
  width:100% !important;
  margin:0 !important;
  padding:0 10px 10px !important;
  overflow:hidden !important;
  border:1px solid rgba(0,0,0,.10) !important;
  border-radius:8px !important;
  background:#fff !important;
  box-shadow:0 1px 5px rgba(0,0,0,.05) !important;
}
.pivr-layout-list .pivr-thumb {
  position:static !important;
  grid-column:1 / -1 !important;
  grid-row:1 !important;
  display:block !important;
  width:calc(100% + 20px) !important;
  aspect-ratio:16/9 !important;
  min-width:0 !important;
  max-width:none !important;
  min-height:0 !important;
  margin:0 -10px 10px !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#eee;
}
.pivr-layout-list .pivr-rank {
  position:static !important;
  grid-column:1 !important;
  grid-row:2 !important;
  width:28px !important;
  height:28px !important;
  margin:2px 0 0 !important;
  font-size:12px !important;
}
.pivr-layout-list .pivr-body {
  grid-column:2 !important;
  grid-row:2 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:4px !important;
  visibility:visible !important;
  opacity:1 !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
}
.pivr-layout-list .pivr-title {
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  width:100% !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  color:#222 !important;
  font-size:13px !important;
  line-height:1.55 !important;
  font-weight:700 !important;
  white-space:normal !important;
  overflow:visible !important;
  overflow-wrap:anywhere !important;
  -webkit-box-orient:initial !important;
  -webkit-line-clamp:unset !important;
}
.pivr-layout-list .pivr-category,
.pivr-layout-list .pivr-views {
  display:block !important;
  visibility:visible !important;
  opacity:.72 !important;
  margin:0 !important;
  font-size:10px !important;
  line-height:1.35 !important;
}

/* 固定ランキングページ：PCは16:9の高解像度カード */
.pivr-layout-grid .pivr-items {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.pivr-layout-grid .pivr-item {
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:10px;
  row-gap:0;
  overflow:hidden;
  padding:0 14px 13px !important;
  border:1px solid rgba(0,0,0,.10);
  border-radius:8px;
  background:#fff;
  box-shadow:0 1px 5px rgba(0,0,0,.05);
}
.pivr-layout-grid .pivr-thumb {
  grid-column:1 / -1;
  grid-row:1;
  display:block !important;
  width:calc(100% + 28px) !important;
  aspect-ratio:16/9;
  overflow:hidden;
  margin:0 -14px 12px !important;
  padding:0 !important;
  background:#eee;
}
.pivr-layout-grid .pivr-rank {
  grid-column:1;
  grid-row:2;
  position:static !important;
  width:30px !important;
  height:30px !important;
  margin-top:2px;
  font-size:14px;
}
.pivr-layout-grid .pivr-body {
  grid-column:2;
  grid-row:2;
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
  padding:0;
}
.pivr-layout-grid .pivr-title {
  display:-webkit-box !important;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  color:#222 !important;
  font-size:14px !important;
  font-weight:700;
  line-height:1.55;
  overflow-wrap:anywhere;
}
.pivr-layout-grid .pivr-title:hover { color:#6495ed !important; }

@media (max-width:900px) {
  .pivr-layout-grid .pivr-items { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px) {
  .pivr-layout-grid .pivr-items { grid-template-columns:1fr; gap:12px; }
  .pivr-layout-grid .pivr-item {
    grid-template-columns:28px 120px minmax(0,1fr);
    grid-template-rows:auto;
    column-gap:10px;
    align-items:start;
    padding:10px !important;
  }
  .pivr-layout-grid .pivr-rank {
    grid-column:1;
    grid-row:1;
    width:28px !important;
    height:28px !important;
    margin-top:2px;
    font-size:12px !important;
  }
  .pivr-layout-grid .pivr-thumb {
    grid-column:2;
    grid-row:1;
    width:120px !important;
    height:68px !important;
    min-height:68px;
    aspect-ratio:auto;
    margin:0 !important;
    align-self:start;
    border-radius:4px;
  }
  .pivr-layout-grid .pivr-body {
    grid-column:3;
    grid-row:1;
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:0;
    padding:0;
  }
  .pivr-layout-grid .pivr-title {
    display:block !important;
    font-size:13px !important;
    line-height:1.55 !important;
    white-space:normal !important;
    overflow:visible !important;
    -webkit-box-orient:initial !important;
    -webkit-line-clamp:unset !important;
  }
}
