.duga-item-list {
  display: grid;
  grid-template-columns: repeat(auto-fill,minmax(260px,1fr));
  gap: 20px;
}
.duga-card {
  border: 1px solid #ddd;
  padding: 12px;
  border-radius: 10px;
  background: #fff;
}
.duga-title {
  font-size: 14px;
  line-height: 1.4;
}
.duga-buy {
  display: inline-block;
  margin-top: 8px;
  font-weight: bold;
}

.notice-lang-menu {
  display: flex;
  gap: 8px;
  margin-bottom: 6px;
}

.notice-lang-menu button {
  font-size: 12px;
  padding: 2px 6px;
  cursor: pointer;
}

.duga-pagination {
  margin-top: 24px;
  text-align: center;
}
.duga-pagination a,
.duga-pagination span {
  display: inline-block;
  margin: 0 6px;
  padding: 6px 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.duga-pagination .current {
  background: #000;
  color: #fff;
  font-weight: bold;
}





/* ===== ページネーション：コンパクト版 ===== */
.duga-pagination{
  margin-top: 14px;              /* 24px → 14px */
  display: flex;
  flex-wrap: wrap;
  gap: 6px;                      /* 8px → 6px */
  justify-content: center;
  align-items: center;
}

.duga-page-btn,
.duga-page-num{
  min-width: 30px;               /* 38px → 30px */
  height: 28px;                  /* 34px → 28px */
  padding: 0 8px;                /* 0 10px → 0 8px */
  border-radius: 6px;            /* 8px → 6px */
  font-size: 13px;               /* 14px → 13px */
  border: 1px solid #d0d0d0;
  background: #fff;
  text-decoration: none !important;
  line-height: 1;
}

.duga-page-num.is-current{
  background: #000;
  color: #006ecf;
  border-color: #000;
  font-weight: 900;
}

.duga-page-btn.is-disabled{
  opacity: .35;
  pointer-events: none;
}

.duga-ellipsis{
  padding: 0 4px;
  opacity: .65;
  font-size: 12px;
}

/* 前・次ボタンの文字を少しだけ詰める */
.duga-page-btn{
  padding: 0 7px;
}

/* ページネーションの下線を完全に除去 */
.duga-pagination a,
.duga-pagination a:visited,
.duga-pagination a:hover,
.duga-pagination a:active,
.duga-pagination a:focus {
  text-decoration: none !important;
}
.duga-page-btn,
.duga-page-num {
  text-decoration: none !important;
}
/* ===== リスト上部（右上）ページネーション ===== */
.duga-pagination-top{
  margin: 6px 0 10px;
}

.duga-pagination-top-inner{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

.duga-page-position{
  font-size: 12px;
  opacity: .7;
  margin-right: 6px;
}

/* 上部はさらにコンパクトでもOK */
.duga-pagination-top .duga-page-btn{
  min-width: 0;
  height: 26px;
  padding: 0 7px;
  font-size: 12px;
  border-radius: 6px;
}
/* ===== ページネーション：余白を完全に正規化 ===== */
.duga-pagination a,
.duga-pagination span {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}
/* ボタン本体（完全に均等） */
.duga-page-btn,
.duga-page-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 28px;
  height: 26px;

  padding: 0 6px !important;   /* ← 左右完全対称 */
  margin: 0 !important;

  font-size: 12px;
  border-radius: 6px;
  border: 1px solid #d0d0d0;
  background: #fff;
  text-decoration: none !important;
}
/* コンテナ側でのみ間隔を制御 */
.duga-pagination,
.duga-pagination-top-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;        /* ← ここが唯一の“間隔” */
}
/* 上部ページネーションは右寄せに固定（強制） */
.duga-pagination-top-inner{
  justify-content: flex-end !important;
  width: 100% !important;
}

/* 上部の親も横幅いっぱいに */
.duga-pagination-top{
  width: 100% !important;
}
.duga-pagination-top{
  margin: 0 0 8px !important;   /* 上の余白を小さく */
}

.duga-pagination-top-inner{
  padding-right: 0 !important;  /* もし右に余白が付いてる場合の保険 */
}
/* 下部（フル） */
.duga-pagination{
  display: flex !important;
  justify-content: center !important; /* 下は中央にしたい場合 */
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

/* Astra等の a/span 余白を無効化 */
.duga-pagination a,
.duga-pagination span{
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

/* ボタン（枠なし） */
.duga-page-btn,
.duga-page-num{
  display: inline-block !important;
  padding: 2px 6px !important;   /* ← コンパクト */
  border: 0 !important;          /* ← 枠なし */
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 13px !important;
}

/* 現在ページだけ強調（黒背景 or 太字の好みで） */
.duga-page-num.is-current{
  font-weight: 900 !important;
}

/* 「…」 */
.duga-page-ellipsis{
  opacity: .6;
}
/* 下部（フル） */
.duga-pagination{
  display: flex !important;
  justify-content: center !important; /* 下は中央にしたい場合 */
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

/* Astra等の a/span 余白を無効化 */
.duga-pagination a,
.duga-pagination span{
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

/* ボタン（枠なし） */
.duga-page-btn,
.duga-page-num{
  display: inline-block !important;
  padding: 2px 2px !important;   /* ← コンパクト */
  border: 0 !important;          /* ← 枠なし */
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 13px !important;
}

/* 現在ページだけ強調（黒背景 or 太字の好みで） */
.duga-page-num.is-current{
  font-weight: 900 !important;
}

/* 「…」 */
.duga-page-ellipsis{
  opacity: .6;
}
/* 上部（右上） */
.duga-pagination-top,
.duga-pagination-top-inner{
  width: 100% !important;
}

.duga-pagination-top-inner{
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 8px !important;
}
/* 上段（右上）ページ位置 + 前/次 を同じ高さに揃える */
.duga-pagination-top-inner{
  display: flex;
  align-items: center;      /* 縦ズレ解消 */
  justify-content: flex-end;
  gap: 8px;                 /* ボタン間隔 */
}

/* 「6 / 304」表示をボタンと同じ見た目・サイズ感へ */
.duga-page-position{
  display: inline-flex;
  align-items: center;
  height: 28px;             /* 前/次と高さ合わせ */
  font-size: 13px;          /* 小さすぎ対策 */
  line-height: 1;           /* baselineズレ対策 */
  opacity: .85;
  margin: 0;                /* 余計なズレ防止 */
  padding: 0 6px;
  white-space: nowrap;
}

/* 前/次ボタンも高さ・行高を統一 */
.duga-pagination-top-inner .duga-page-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  line-height: 1;
  padding: 0 10px;
  margin: 0;
  text-decoration: none;    /* 下線もついでに消す */
}
.duga-pagination-top-inner a.duga-page-btn{
  line-height: 1 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
/* 右上「前/次」の変な背景（テーマのボタン装飾）を消す */
.duga-pagination-top-inner a.duga-page-btn{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  outline: none !important;
}

/* hover/focusでも背景が出ないように */
.duga-pagination-top-inner a.duga-page-btn:hover,
.duga-pagination-top-inner a.duga-page-btn:focus,
.duga-pagination-top-inner a.duga-page-btn:focus-visible{
  background: transparent !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

/* ついでに “リンクの見た目” を少しだけ分かりやすく（任意） */
.duga-pagination-top-inner a.duga-page-btn{
  opacity: .9;
}
.duga-pagination-top-inner a.duga-page-btn:hover{
  opacity: 1;
}
/* 右上（ページ位置 + 前/次）を縦中央揃え */
.duga-pagination-top-inner{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
/* 右上の各要素を同じ“行”として揃える */
.duga-pagination-top-inner .duga-page-position,
.duga-pagination-top-inner a.duga-page-btn{
  display: inline-flex;
  align-items: center;
  height: 16px;        /* 好きな高さでOK（24pxでも可） */
  line-height: 1;      /* 変な行高の影響を切る */
  padding: 0 2px;      /* 省スペース */
  margin: 0;
  vertical-align: middle;
}

/* 見た目：リンクの下線や背景を出さない（必要なら） */
.duga-pagination-top-inner a.duga-page-btn{
  text-decoration: none;
  background: transparent;
  border: 0;
  box-shadow: none;
}

/* otakara 指定のリストだけを強調 */
.duga-item-list.is-otakara .duga-card {
  border: 2px solid #e6007a;
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
  position: relative;
  overflow: hidden;
}

/* カード上部に「今日のお宝🎀」バッジを追加（疑似要素で差し込み） */
.duga-item-list.is-otakara .duga-card::before {
  content: "お宝作品💯";
  position: absolute;

  /* ← ここがポイント */
  top: -10px;          /* マイナスで枠にかぶせる */
  left: 14px;

  padding: 4px 9px;
  font-size: 12px;
  font-weight: 700;

  border-radius: 999px;

  /* 少し透過したピンク */
  background: rgba(255, 227, 241, 0.92);
  color: #b1005b;

  box-shadow: 0 3px 8px rgba(0,0,0,0.15);
  z-index: 3;
}


/* バッジが被る場合に備えて、タイトルに少し余白 */
.duga-item-list.is-otakara .duga-title {
  margin-top: 0;
}
/* 目立ち枠のカードだけ調整 */
.duga-item-list.is-otakara .duga-card {
  padding-top: 22px; /* ←バッジ分のスペース */
}

/* タイトルの上余白は不要なら0に */
.duga-item-list.is-otakara .duga-title {
  margin-top: 0;
}
/* お宝カード：上部の余白を最小限に（詰める） */
.duga-item-list.is-otakara .duga-card {
  padding-top: 18px;      /* 22px→少し詰める */
  position: relative;
}

/* バッジ：枠線に半分かぶせつつ、見た目を整える */
.duga-item-list.is-otakara .duga-card::before {
  content: "お宝作品💯";
  position: absolute;

  top: -12px;             /* ← かぶり量（-10〜-14で調整） */
  left: 16px;

  padding: 5px 10px;      /* 少しだけ存在感UP */
  font-size: 12px;
  line-height: 1;
  font-weight: 700;

  border-radius: 999px;

  background: rgba(255, 227, 241, 0.92);
  color: #b1005b;

  box-shadow: 0 4px 12px rgba(0,0,0,0.14);
  z-index: 3;
}

/* タイトル：自然に（バッジ分の余白はカードpaddingで吸収済み） */
.duga-item-list.is-otakara .duga-title {
  margin-top: 0;
}
.duga-item-list.is-otakara .duga-card::before {
  outline: 1px solid #fff;
}
/* バッジが切り取られる原因（overflow:hidden）を解除 */
.duga-item-list.is-otakara,
.duga-item-list.is-otakara .duga-card {
  overflow: visible !important;
}
.duga-item-list.is-otakara .duga-card {
  position: relative;
}

/* バッジ（疑似要素） */
.duga-item-list.is-otakara .duga-card::before {
  content: "お宝作品💯";
  position: absolute;
  top: -14px;          /* ここを -10〜-18 で調整 */
  left: 16px;

  padding: 6px 10px;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;

  border-radius: 999px;

  background: rgba(255, 227, 241, 0.95);
  color: #b1005b;

  /* 枠線の上に乗ってる感 */
  border: 1px solid #fff;

  box-shadow: 0 6px 14px rgba(0,0,0,0.18);
  z-index: 50;         /* 前面に */
}
.duga-item-list.is-otakara .duga-card {
  padding-top: 16px;   /* ここで詰める */
}

.duga-card img {
    display: block;
    margin-bottom: 12px;
}