@charset "shift_jis";
/* CSS Document */ :root {
  --bg: #f6f7f9;
  --surface: #ffffff;
  --text: #0f172a;
  --muted: #64748b;
  --line: rgba(15, 23, 42, .12);
  --shadow: 0 12px 30px rgba(2, 8, 23, .10);
  --shadow2: 0 10px 18px rgba(2, 8, 23, .08);
  --radius: 16px;
  --radius2: 22px;
  --primary: #0aa04f;
  --primary2: #067a3a;
  --focus: rgba(10, 160, 79, .25);
  --boba: #2563eb;
  --hinba: #ef4444;
  --warn: #f59e0b;
  --mark: rgba(245, 158, 11, .24);
  --danger: #ef4444;
}
* {
  box-sizing: border-box;
}
html, body {
  height: 100%;
}
body {
  margin: 0;
  /*background: radial-gradient(1200px 500px at 20% 0%, rgba(10, 160, 79, .12), transparent 60%), radial-gradient(900px 420px at 100% 0%, rgba(14, 165, 233, .10), transparent 55%), var(--bg);*/
  background-color: white;
  color: var(--text);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  line-height: 1.5;
  /*padding-top: 74px;*/
  padding-top: 65px;
}
@media (max-width: 507px) {
  body {
    /*padding-top: 120px;*/
    padding-top: 84px;
  }
}



a {
  color: inherit;
  text-decoration: none;
}
button {
  font: inherit;
  color: inherit;
}
mark {
  background: linear-gradient(180deg, transparent 55%, var(--mark) 55%);
  padding: 0 2px;
  border-radius: 6px;
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
  border-radius: 10px;
}

.spbr {
	display: none;
}

@media (max-width: 399px) {
  .spbr {
    display: block;
  }
}

.container {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
}
/* Skip link */
.skipLink {
  position: absolute;
  left: 12px;
  top: 10px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, .95);
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 12px;
  box-shadow: 0 10px 18px rgba(2, 8, 23, .12);
  transform: translateY(-140%);
  transition: transform .18s ease;
  z-index: 999;
}
.skipLink:focus {
  transform: translateY(0);
}
/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}
/* ------------------------------
      Header
    ------------------------------ */
.siteHeader {
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 30;
  /*background: rgba(246, 247, 249, .78);*/
  background-color: white;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(15, 23, 42, .10);
}
.siteHeader__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  /*padding: 14px 0;*/
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 194px;
}
@media (max-width: 400px) {
  .brand {
    min-width: 0;
  }
  .navbar-brand {
    padding: 20.5px 5px;
  }
}
.logoMark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(145deg, var(--primary), var(--primary2));
  box-shadow: 0 10px 18px rgba(10, 160, 79, .18);
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
  letter-spacing: .02em;
  user-select: none;
}
.brandTitle {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}
.brandTitle strong {
  font-size: 14px;
}
.brandTitle span {
  font-size: 12px;
  color: var(--muted);
}
.headActions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.pillLink {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .75);
  border: 1px solid rgba(15, 23, 42, .10);
  box-shadow: 0 8px 16px rgba(2, 8, 23, .06);
  font-size: 13px;
  transition: transform .12s ease, box-shadow .12s ease;
  white-space: nowrap;
}
.pillLink:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 24px rgba(2, 8, 23, .10);
  background-color: #009b42;
  color: #fff;
  text-decoration: none;
}
.pillLink .dot {
  width: 8px;
  height: 8px;
  border-radius: 99px;
  /*background: var(--primary);
  box-shadow: 0 0 0 6px rgba(10, 160, 79, .12);*/
}

.fa-camera {
  content: "\f030";
  display: inline-block;
  font: normal normal normal 14px / 1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

.fa-trophy {
  content: "\f091";
  display: inline-block;
  font: normal normal normal 14px / 1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

/* ------------------------------
      Hero
    ------------------------------ */
.hero {
  padding: 18px 0 10px;
}
.heroCard {
  background: linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(255, 255, 255, .78));
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: var(--radius2);
  box-shadow: var(--shadow2);
  overflow: hidden;
}
.heroCard__inner {
  padding: 18px;
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 16px;
  align-items: center;
}
@media (max-width: 900px) {
  .heroCard__inner {
    grid-template-columns: 1fr;
  }
}
.heroTitle {
  font-size: 20px;
  margin: 0 0 6px;
  letter-spacing: .02em;
}
.heroSub {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
}
.heroMeta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .70);
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}
.tag b {
  color: var(--text);
  font-weight: 800;
}
/* ------------------------------
      Farm navigation
    ------------------------------ */
.farmNav {
  /*padding: 10px 0 4px;*/
}
.farmNavCard {
  background: rgba(255, 255, 255, .70);
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: var(--radius2);
  padding: 10px;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .04);
}
.farmNavTop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 2px 2px 10px;
}
.farmNavTop .label {
  font-weight: 900;
  letter-spacing: .02em;
  font-size: 13px;
}
.farmNavTop .sub {
  font-size: 12px;
  color: var(--muted);
}
.chipRow {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
@media (max-width: 760px) {
  .chipRow {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
    padding-bottom: 6px;
  }
  .chipRow::-webkit-scrollbar {
    height: 8px;
  }
  .chipRow::-webkit-scrollbar-thumb {
    background: rgba(15, 23, 42, .15);
    border-radius: 999px;
  }
}
.chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .92);
  font-size: 13px;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .05);
  white-space: nowrap;
  user-select: none;
}
.chip:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 24px rgba(2, 8, 23, .10);
}
.chip.is-active {
  background: linear-gradient(145deg, rgba(10, 160, 79, .16), rgba(10, 160, 79, .06));
  border-color: rgba(10, 160, 79, .35);
  font-weight: 850;
}
.chip.allBtn {
  border-color: rgba(15, 23, 42, .14);
  background: rgba(15, 23, 42, .03);
}
.farmMenuWrap {
  position: relative;
}
.farmMenu {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  width: min(360px, 94vw);
  max-height: min(60vh, 520px);
  overflow: auto;
  padding: 10px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .98);
  border: 1px solid rgba(15, 23, 42, .10);
  box-shadow: var(--shadow);
  list-style: none;
  margin: 0;
  display: none;
  z-index: 40;
}
.farmMenuWrap.is-open .farmMenu {
  display: block;
}
.farmMenu a {
  display: block;
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--text);
  font-size: 14px;
}
.farmMenu a:hover {
  background: rgba(10, 160, 79, .10);
}
/* ------------------------------
      Sticky filter bar
    ------------------------------ */
.filterBar {
  position: sticky;
  /*top: calc(var(--headerH, 0px) + 8px);*/
  top: calc(var(--headerH, 0px) + 0px);
  z-index: 70;
  padding: 10px 0 8px;
  /*background: rgba(246, 247, 249, .92);*/
  background: rgba(246, 247, 249, 100);
  /*backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);*/
  border-bottom: 1px solid rgba(15, 23, 42, .08);
  transition: transform .22s ease, opacity .22s ease, box-shadow .22s ease;
}
@media (max-width: 520px) {
  .filterBar {
    top: 68px;
  }
}
.filterRow {
  display: grid;
  grid-template-columns: 1fr 170px 160px;
  gap: 10px;
  align-items: center;
}
@media (max-width: 880px) {
  .filterRow {
    grid-template-columns: 1fr 1fr;
  }
  .filterRow .candidateWrap {
    /*grid-column: 1 / -1;*/
  }
}
@media (max-width: 700px) {
  .filterRow {
    grid-template-columns: 1fr;
  }
}
.searchBox {
  position: relative;
  width: 100%;
}
.searchBox input {
  width: 100%;
  padding: 12px 44px 12px 42px;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .92);
  font-size: 14px;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
}
.searchBox .icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  opacity: .55;
  pointer-events: none;
}
.clearBtn {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .85);
  padding: 8px 10px;
  border-radius: 12px;
  cursor: pointer;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .05);
  display: none;
}
.clearBtn.is-show {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.clearBtn span {
  width: 18px;
  height: 18px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(15, 23, 42, .14);
  background: rgba(15, 23, 42, .06);
  font-weight: 900;
  line-height: 1;
}
.select {
  width: 100%;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .92);
  background-repeat: no-repeat;
  background-position: right center;
  font-size: 14px;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
}
.candidateWrap {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}
@media (max-width: 700px) {
  .candidateWrap {
    justify-content: space-between;
  }
}
.candidateToggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
  cursor: pointer;
  user-select: none;
  font-weight: 850;
  font-size: 13px;
  white-space: nowrap;
}
.candidateToggle .star {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  border: 1px solid rgba(245, 158, 11, .30);
  background: rgba(245, 158, 11, .12);
  color: #a16207;
  font-weight: 900;
  font-size: smaller;
}
.candidateToggle[aria-pressed="true"] {
  border-color: rgba(245, 158, 11, .65);
  background: linear-gradient(145deg, rgba(245, 158, 11, .30), rgba(245, 158, 11, .14));
  box-shadow: 0 12px 18px rgba(245, 158, 11, .18);
}
.candidateCount {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}
.candidateCount b {
  color: var(--text);
}
.countBar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 0 2px;
  color: var(--muted);
  font-size: 13px;
}
.countBar strong {
  color: var(--text);
}
.countBar .hint {
  font-size: 12px;
  color: rgba(100, 116, 139, .95);
}
/* ------------------------------
      Pagination
    ------------------------------ */
nav[aria-label="y[WirQ[V"] {
  margin-top: 14px;
}
.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 10px 0 8px;
  flex-wrap: wrap;
}
.page-item {
  display: block;
}
.page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 10px 16px rgba(2, 8, 23, .05);
  font-weight: 650;
  font-size: 13px;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
  user-select: none;
}
.page-link:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 24px rgba(2, 8, 23, .10);
}
.page-item.active .page-link {
  background: linear-gradient(145deg, var(--primary), var(--primary2));
  border-color: rgba(10, 160, 79, .45);
  color: #fff;
  cursor: default;
}
.page-item.disabled .page-link {
  opacity: .45;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}
.page-ellipsis {
  padding: 10px 10px;
  color: var(--muted);
  font-weight: 800;
  user-select: none;
}
.pageCtaRow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.pageCta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(10, 160, 79, .35);
  background: linear-gradient(145deg, rgba(10, 160, 79, .18), rgba(10, 160, 79, .08));
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
  font-weight: 900;
  cursor: pointer;
  user-select: none;
}
.pageCta.secondary {
  border-color: rgba(15, 23, 42, .14);
  background: rgba(255, 255, 255, .92);
  font-weight: 850;
}
/* ------------------------------
      Horse grid + cards
    ------------------------------ */
.lazy-container {
  margin-top: 10px;
}
#Uma_list {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
}
@media (max-width: 1400px) {
  #Uma_list {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
@media (max-width: 1220px) {
  #Uma_list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (max-width: 980px) {
  #Uma_list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  #Uma_list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 420px) {
  #Uma_list {
    grid-template-columns: 1fr;
  }
}
#cardsMount {
  display: contents;
}
/*@media (max-width: 980px) {
  #Uma_list {
    grid-template-columns: repeat(2, 1fr);
  }
}*/
@media (max-width: 620px) {
  #Uma_list {
    grid-template-columns: 1fr;
  }
}
.cardWrap[data-hidden="1"] {
  display: none;
}
.item_box {
  background: rgba(255, 255, 255, .94);
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: var(--radius2);
  overflow: hidden;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  cursor: pointer;
  position: relative;
}
/* list reset */
ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
.meta {
  padding: 10px 10px 12px;
}
.meta ul {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.meta .name {
  font-weight: 950;
  letter-spacing: .02em;
  font-size: 13px;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 0;
}
.meta .sub {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.meta .pair {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 11px;
  line-height: 1.25;
  color: rgba(15, 23, 42, .82);
  min-width: 0;
}
.meta .pair .k {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  padding: 2px 6px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .70);
  font-weight: 900;
  color: rgba(15, 23, 42, .75);
  flex: 0 0 auto;
}
.meta .pair .v {
  font-weight: 850;
  letter-spacing: .01em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.item_box:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 36px rgba(2, 8, 23, .12);
  border-color: rgba(15, 23, 42, .16);
}
/* Image skeleton + CLS prevention */
.img {
  background: #e5e7eb;
  position: relative;
  overflow: hidden;
  aspect-ratio: 3 / 2; /* 3:2Ŏʐ^傫i؂Ȃj */
  display: grid;
  place-items: center; /* ^[{bNX�E */
}
.img::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(229, 231, 235, .0) 0%, rgba(229, 231, 235, .0) 35%, rgba(255, 255, 255, .6) 50%, rgba(229, 231, 235, .0) 65%, rgba(229, 231, 235, .0) 100%);
  transform: translateX(-60%);
  animation: none;
  opacity: 0;
}
.img.is-loading::before {
  opacity: .65;
  animation: shimmer 1.2s infinite linear;
}
@keyframes shimmer {
  0% {
    transform: translateX(-60%);
  }
  100% {
    transform: translateX(60%);
  }
}
.img.is-loaded::before {
  display: none;
}
.img.is-error {
  background: linear-gradient(145deg, rgba(239, 68, 68, .10), rgba(239, 68, 68, .03));
}
.imgFallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: rgba(239, 68, 68, .95);
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .02em;
  text-align: center;
  padding: 10px;
}
.img img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain; /* ؂h~ */
  background: transparent;
}
.detail {
  padding: 12px 12px 12px;
}
.horse {
  list-style: none;
  padding: 0;
  margin: 0 0 8px;
}
.horse li {
  font-weight: 900;
  letter-spacing: .02em;
  font-size: 15px;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.metaList {
  list-style: none;
  padding: 0;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  display: grid;
  gap: 7px;
}
.metaList li {
  margin: 0;
}
.kvLine {
  display: flex;
  gap: 6px;
  align-items: baseline;
  flex-wrap: wrap;
}
.kvLine .k {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .75);
  color: var(--text);
  font-weight: 850;
  font-size: 11px;
}
.kvLine .v {
  font-weight: 650;
  color: rgba(15, 23, 42, .86);
}
.boba-border {
  box-shadow: 0 3px 7px rgba(37, 99, 235, .12);
}
.hinba-border {
  box-shadow: 0 3px 7px rgba(239, 68, 68, .12);
}
.item_box.boba-border::after, .item_box.hinba-border::after {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 4px;
}
.item_box.boba-border::after {
  background: linear-gradient(90deg, rgba(37, 99, 235, .95), rgba(37, 99, 235, .28));
}
.item_box.hinba-border::after {
  background: linear-gradient(90deg, rgba(239, 68, 68, .95), rgba(239, 68, 68, .24));
}
.sexBadge {
  position: absolute;
  top: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(15, 23, 42, .10);
  backdrop-filter: blur(10px);
  font-weight: 900;
  font-size: 12px;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .08);
  user-select: none;
}
.sexBadge .dot {
  width: 9px;
  height: 9px;
  border-radius: 99px;
}
.item_box.boba-border .sexBadge .dot {
  background: var(--boba);
  box-shadow: 0 0 0 6px rgba(37, 99, 235, .14);
}
.item_box.hinba-border .sexBadge .dot {
  background: var(--hinba);
  box-shadow: 0 0 0 6px rgba(239, 68, 68, .14);
}
/* Candidate star button */
.starBtn {
  position: absolute;
  z-index: 8;
  top: 10px;
  right: 10px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: #ffffff;
  display: grid;
  place-items: center;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .08);
  cursor: pointer;
  user-select: none;
}
.starBtn .s {
  font-size: 13px;
  line-height: 1;
  color: rgba(15, 23, 42, .45);
  transform: translateX(-2.5px) translateY(-0.5px);
  display: block;
  margin: 0;
  padding: 0;
}
.starBtn[aria-pressed="true"] {
  border-color: rgba(245, 158, 11, .75);
  background: #fff7ed;
  box-shadow: 0 10px 16px rgba(245, 158, 11, .22);
}
.starBtn[aria-pressed="true"] .s {
  color: #f59e0b;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .20);
}
.badgeRight {
  position: absolute;
  top: 52px;
  right: 10px;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(15, 23, 42, .10);
  display: grid;
  place-items: center;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .08);
  pointer-events: none;
}
.badgeRight img {
  width: 18px;
  height: 18px;
}
.emptyState {
  grid-column: 1 / -1;
  background: rgba(255, 255, 255, .84);
  border: 1px dashed rgba(15, 23, 42, .18);
  border-radius: 18px;
  padding: 16px;
  color: var(--muted);
  text-align: center;
  display: none;
}
.emptyState strong {
  color: var(--text);
}
.capList {
  list-style: none;
  padding: 0;
  margin: 18px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.capList li {
  padding: 10px 12px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .70);
  border-radius: 14px;
}
.capList li span {
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background: rgba(245, 158, 11, .16);
  border: 1px solid rgba(245, 158, 11, .28);
  color: #a16207;
  font-weight: 900;
  text-align: center;
  margin-right: 8px;
}
/* ------------------------------
      Modal
    ------------------------------ */
.modal {
  position: fixed;
  inset: 0;
  display: grid; /* display͌Œ肵AopacityŁE*/
  place-items: center;
  padding: 16px;
  z-index: 60;
  background: rgba(2, 8, 23, .55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility 0s linear .18s;
}
.modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .18s ease;
}
/* modal sizing */
.modal-dialog {
  width: min(980px, calc(100vw - 32px));
  max-height: min(86vh, 860px);
  transform: translateY(14px) scale(.985);
  opacity: 0;
  transition: transform .18s ease, opacity .18s ease;
  margin: 0;
}
.modal-content {
  background: rgba(255, 255, 255, .98);
  border-radius: 22px;
  border: 1px solid rgba(15, 23, 42, .12);
  box-shadow: var(--shadow);
  transition: transform .18s ease, opacity .18s ease;
  overflow: auto; /* ܂͎߂邪AȂꍇ͕یŃXN[ */
  max-height: 86vh;
  overscroll-behavior: contain;
}
.modalHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 16px 12px;
  border-bottom: 1px solid rgba(15, 23, 42, .10);
}
.modalHeader .titleWrap {
  min-width: 0;
}
.modalHeader h2 {
  margin: 0;
  font-size: 18px;
  letter-spacing: .02em;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.modalHeader p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.modalPills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(15, 23, 42, .10);
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
  font-weight: 900;
  font-size: 12px;
  color: rgba(15, 23, 42, .86);
  white-space: nowrap;
}
.pill .dot {
  width: 9px;
  height: 9px;
  border-radius: 99px;
}
.pill.is-boba .dot {
  background: var(--boba);
  box-shadow: 0 0 0 6px rgba(37, 99, 235, .14);
}
.pill.is-hinba .dot {
  background: var(--hinba);
  box-shadow: 0 0 0 6px rgba(239, 68, 68, .14);
}
.pill.is-cand {
  border-color: rgba(245, 158, 11, .45);
  background: linear-gradient(145deg, rgba(245, 158, 11, .18), rgba(245, 158, 11, .08));
  color: #a16207;
}
.closeBtn {
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .9);
  border-radius: 14px;
  padding: 10px 12px;
  cursor: pointer;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  user-select: none;
  white-space: nowrap;
  flex: 0 0 auto;
}
.closeBtn .x {
  width: 18px;
  height: 18px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(15, 23, 42, .14);
  background: rgba(15, 23, 42, .06);
  line-height: 1;
  font-weight: 900;
}
.modalBody {
  padding: 16px;
  display: grid;
  grid-template-columns: 1.15fr .85fr; /* ʐ^͉т̕܂₷ */
  gap: 14px;
  align-items: start;
}
@media (max-width: 860px) {
  .modalBody {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 920px) {
  .modalBody {
    grid-template-columns: 1fr;
  }
  .modalHeader h2, .modalHeader p {
    white-space: normal;
  }
}
.modalFigure {
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, .12);
  background: #e5e7eb;
  padding: 0;
  display: grid;
  place-items: center;
}
.modalFigure img {
  width: 100%;
  height: auto;
  /*max-height: var(--modalImgMax, 56vh);*/ /* JSŁu񂪌vɁE*/
  display: block;
  object-fit: contain;
  background: transparent;
}
.infoCard {
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .86);
  padding: 12px;
  box-shadow: 0 12px 24px rgba(2, 8, 23, .06);
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.kvdl {
  margin: 0;
  display: grid;
  gap: 10px;
}
.kvdlRow {
  display: grid;
  grid-template-columns: 84px 1fr;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(15, 23, 42, .02);
}
.kvdlRow dt {
  margin: 0;
  font-weight: 900;
  color: var(--muted);
  font-size: 12px;
}
.kvdlRow dd {
  margin: 0;
  font-weight: 900;
  color: rgba(15, 23, 42, .92);
  font-size: 13px;
  min-width: 0;
  word-break: break-word;
}
.noteBox {
  border-radius: 14px;
  border: 1px dashed rgba(15, 23, 42, .20);
  background: rgba(255, 255, 255, .70);
  padding: 10px 12px;
  color: var(--muted);
  font-size: 12px;
}
.modalActions {
  margin-top: auto;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(10, 160, 79, .35);
  background: linear-gradient(145deg, rgba(10, 160, 79, .22), rgba(10, 160, 79, .10));
  font-weight: 900;
  cursor: pointer;
  user-select: none;
}
.ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, .14);
  background: rgba(255, 255, 255, .9);
  font-weight: 900;
  cursor: pointer;
  user-select: none;
}
/* ------------------------------
      Modal animation
    ------------------------------ */
@keyframes modalFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes modalPop {
  from {
    transform: translateY(10px) scale(.985);
    opacity: .98;
  }
  to {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}
.modal.is-open {
  animation: modalFadeIn .18s ease-out both;
}
.modal.is-open .modal-dialog {
  animation: modalPop .22s cubic-bezier(.2, .8, .2, 1) both;
  will-change: transform, opacity;
}
/* Toast */
.toastWrap {
  position: fixed;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  z-index: 999;
  width: min(520px, calc(100% - 32px));
  pointer-events: none;
}
.toast {
  background: rgba(255, 255, 255, .94);
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 16px;
  box-shadow: 0 18px 40px rgba(2, 8, 23, .18);
  padding: 12px 14px;
  color: var(--text);
  font-weight: 850;
  display: none;
  pointer-events: none;
}
.toast.is-show {
  display: block;
}
.toast small {
  display: block;
  margin-top: 2px;
  font-weight: 650;
  color: var(--muted);
}
.footerMock {
  margin: 24px 0 40px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* ------------------------------
      Pagination (50 / page)
    ------------------------------ */
.pager--top {
  margin-top: 10px;
  margin-bottom: 8px;
}
.pager {
  margin-top: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}
.pagerBtn {
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .92);
  padding: 10px 12px;
  border-radius: 12px;
  cursor: pointer;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .05);
  font-weight: 850;
  font-size: 14px;
  user-select: none;
  white-space: nowrap;
}
.pagerBtn:disabled {
  opacity: .45;
  cursor: not-allowed;
  box-shadow: none;
}
.pagerNums {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 100%;
}
.pageNum {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .92);
  cursor: pointer;
  font-weight: 950;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .05);
  user-select: none;
}
.pageNum[aria-current="page"] {
  border-color: rgba(10, 160, 79, .35);
  background: linear-gradient(145deg, rgba(10, 160, 79, .18), rgba(10, 160, 79, .08));
}
.perfLine {
  margin-top: 10px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
  min-height: 1.2em;
}
/* ------------------------------
      Global search (BāFS^f[^)
    ------------------------------ */
.advRow {
  flex-wrap: wrap;
  align-items: stretch;
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

@media (max-width: 900px) {
  .advRow {
    grid-template-columns: 1fr;
  }
}

.advRow > * {
  flex: 1 1 240px;
  min-width: 220px;
}
.advRow .segGroup {
  flex: 1 1 83px;
  min-width: 220px;
}
@media (max-width: 520px) {
  .advRow > * {
    min-width: 0;
  }
  .advRow .segGroup {
    min-width: 0;
  }
}








.container,
.advRow,
.chipBlock {
  overflow: visible !important;
}

.drawer {
  position: relative;
}


.selectedValue {
  font-size: 13px;
  color: rgba(15, 23, 42, .72);
  padding: 4px 8px;
  border-radius: 999px;
  display: none;
}

.drawer.hasValue .selectedValue {
  display: inline-block;
}

.chipHeader{
  background: #f8fafc;
  border:1px solid #e2e6ea;
  border-radius:14px;
  padding:8px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  box-shadow:0 4px 10px rgba(0,0,0,0.04);
  transition:0.2s;
  font-weight: 600;
  width: 100%;
}

.chipBlock.is-selected .chipHeader {
  border-color: #22c55e;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(34,197,94,.12);
}

.chipHeader:focus {
  border-color: #22c55e;
  box-shadow: 0 0 0 3px rgba(34,197,94,.18);
}

.chipHeader:hover{
  border-color:#2f6f5f;
}

/* ^Cg͍ŁE*/
.chipHeader .title {
  font-weight: 600;
  white-space: nowrap;
}


/* IlobW */
.selectedValue{
  display:flex;
  align-items:center;
  gap:6px;
}

.valueText{
  color: rgba(15, 23, 42, .72);
  font-size:14px;
  flex: 1;
  font-weight: 700;
  min-width: 0;
}

.valueText.is-placeholder {
  color: #94a3b8;
  font-weight: 500;
}

.clearFilter{
  display:none;
  border:none;
  background: none;
  cursor:pointer;
  opacity:0.6;
  color: #999;
  padding: 0 4px;
}

.clearFilter:hover{
  opacity:1;
  color: #333;
}

.headerLeft {
  display: flex;
  align-items: center;
  gap: 4px;
}

.arrow {
  font-size: 14px;
  transition: transform .2s ease;
}

/* JĂ鎞 */
.chipBlock.is-open .arrow {
  transform: rotate(180deg);
}

/*  ] */
.drawer.open .arrow {
  transform: rotate(180deg);
}

/* h[{ */
.drawerContent {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 100%;
  background: white;
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.12);
  padding: 32px;
  z-index: 1000;

  /* Aj[Vp */
  opacity: 0;
  transform: translateY(-10px);
  pointer-events: none;
  transition: all .25s ease;
}

/* J */
.drawer.open .drawerContent {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}















.segGroup {
  display: flex;
  gap: 8px;
  /*flex-wrap: wrap;*/
  align-items: center;
  justify-content: flex-start;
}
.segBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .92);
  /*box-shadow: 0 10px 16px rgba(2, 8, 23, .06);*/
  cursor: pointer;
  user-select: none;
  font-weight: 850;
  font-size: 13px;
  white-space: nowrap;
}
.segBtn[aria-pressed="true"] {
  border-color: rgba(10, 160, 79, .35);
  background: linear-gradient(145deg, rgba(10, 160, 79, .18), rgba(10, 160, 79, .08));
}
.miniHelp {
  color: var(--muted);
  font-size: 12px;
  margin-top: 8px;
}
.chipBlock {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  background: rgba(255,255,255,.82);
  border-radius: 16px;
  padding: 14px 16px;
  border: 1px solid rgba(15,23,42,.08);
  cursor: pointer;
  transition: box-shadow .25s ease, transform .2s ease;
  position: relative;
  color: rgba(15, 23, 42, .72);
}

.chipBlock:hover {
  box-shadow: 0 14px 26px rgba(2,8,23,.08);
}

.chipLabel {
  align-items: center;
  color: rgba(15, 23, 42, .72);
  letter-spacing: .02em;
  white-space: nowrap;
  font-weight: 800;
  font-size: 13px;
  display: flex;
  justify-content: space-between;
}

/* ACR */
.chipLabel::after {
  content: "";
  font-size: 11px;
  transition: transform .25s ease;
  opacity: .6;
  padding-left: 3px;
}

/* J] */
.chipBlock.is-open .chipLabel::after {
  transform: rotate(180deg);
}

/* Aj[V΁E*/
.chipBlock .segGroup {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transform: translateY(-4px);
  transition: 
    max-height .35s ease,
    opacity .25s ease,
    transform .25s ease;
  margin-top: 0;
}

/* J */
.chipBlock.is-open .segGroup {
  max-height: 500px; /* \傫 */
  opacity: 1;
  transform: translateY(0);
  margin-top: 12px;
}


.segBtn.is-chip {
  padding: 9px 11px;
  font-size: 12px;
  background: #f1f5f9;
  color: #334155;
  border: 1px solid #e2e8f0;
  transition: all .15s ease;
}

.segBtn.is-chip:hover {
  background: #e2e8f0;
}

/* I */
.segBtn.is-chip.is-active {
  background: #16a34a;
  color: #ffffff;
  border-color: #16a34a;
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(22,163,74,.3);
}

.globalModeBar {
  margin-top: 10px;
  margin-bottom: 15px;
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 12px;
  border-radius: 16px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
}
.globalModeBar.is-show {
  display: flex;
}
.globalModeBar strong {
  letter-spacing: .02em;
}
.globalModeBar .sub {
  color: var(--muted);
  font-size: 12px;
}
.globalModeBar .right {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.miniBtn {
  border: 1px solid rgba(15, 23, 42, .12);
  background: rgba(255, 255, 255, .92);
  padding: 10px 12px;
  border-radius: 12px;
  cursor: pointer;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .05);
  font-weight: 850;
  font-size: 13px;
  user-select: none;
  white-space: nowrap;
}
.noteBox {
  margin-top: 10px;
  padding: 12px 12px;
  border-radius: 16px;
  border: 1px dashed rgba(15, 23, 42, .16);
  background: rgba(255, 255, 255, .72);
  color: var(--muted);
  font-size: 12px;
}
.globalResults {
  display: none;
  margin-top: 10px;
}
.globalResults.is-show {
  display: block;
}
.resultGrid {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
@media (max-width: 980px) {
  .resultGrid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 620px) {
  .resultGrid {
    grid-template-columns: 1fr;
  }
}
.resultCard {
  background: rgba(255, 255, 255, .94);
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: 18px;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .06);
  padding: 12px;
  display: flex;
  gap: 12px;
  align-items: center;
}
.thumb {
  width: 112px;
  min-width: 112px;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: #e5e7eb;
  overflow: hidden;
  aspect-ratio: 3 / 2;
  display: grid;
  place-items: center;
}
.thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.rBody {
  flex: 1;
  min-width: 0;
}
.rTitle {
  font-weight: 950;
  letter-spacing: .02em;
  margin: 0 0 6px;
  font-size: 15px;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rMeta {
  margin: 0;
  color: rgba(15, 23, 42, .78);
  font-size: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
}
.rMeta .pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .75);
  color: rgba(15, 23, 42, .86);
  font-weight: 800;
  white-space: nowrap;
}
.rActions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-end;
}
@media (max-width: 620px) {
  .rActions {
    flex-direction: row;
    align-items: center;
  }
  .thumb {
    width: 96px;
    min-width: 96px;
  }
}
.starMini {
  width: 36px;
  height: 36px;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, .10);
  background: rgba(255, 255, 255, .92);
  display: grid;
  place-items: center;
  box-shadow: 0 10px 16px rgba(2, 8, 23, .08);
  cursor: pointer;
  user-select: none;
}
.starMini[aria-pressed="true"] {
  border-color: rgba(245, 158, 11, .45);
  background: linear-gradient(145deg, rgba(245, 158, 11, .18), rgba(245, 158, 11, .08));
}
.starMini .s {
  font-size: 16px;
  line-height: 1;
  color: rgba(15, 23, 42, .45);
  transform: translateY(-1px);
}
.starMini[aria-pressed="true"] .s {
  color: #a16207;
}
.resultMoreWrap {
  margin-top: 35px;
  display: flex;
  justify-content: center;
}
/* Sex color (=blue / =red) */
.pill.sex-m {
  border-color: rgba(37, 99, 235, .20);
  background: rgba(37, 99, 235, .08);
  color: rgba(29, 78, 216, .95);
}
.pill.sex-f {
  border-color: rgba(239, 68, 68, .20);
  background: rgba(239, 68, 68, .08);
  color: rgba(185, 28, 28, .95);
}
.cardWrap {
  scroll-margin-top: calc(var(--headerH, 0px) + 120px);
}
/* [_\͏㕔Œo[\i[_ɐ̂hj */
body.modal-open .filterBar {
  display: none !important;
}
/* Ô߁F[_őOʁE*/
#exampleModal.modal {
  z-index: 120;
}
.starBtn svg {
  width: 10px;
  height: 10px;
}
/* y[WؑUI͕sviɕ\̂݁j */
.pager, .pageNav, .pagination, .pageBtns, .topPager, .bottomPager, [data-pager], #pagerTop, #pagerBottom {
  display: none !important;
}
.candidateToggle[aria-pressed="true"] .star {
  border-color: rgba(245, 158, 11, .75);
  background: rgba(245, 158, 11, .22);
  color: #f59e0b;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .18);
}
/* X}złŁEi1w㏑j */
@media (max-width: 620px) {
  #Uma_list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
/* X}zFXN[ŌŒo[BAXN[ŕ\ */
@media (max-width: 620px) {
  .filterBar {
    transition: transform .22s ease, opacity .22s ease;
    will-change: transform, opacity;
  }
  body.hideStickyControls .filterBar {
    transform: translateY(-120%);
    opacity: 0;
    pointer-events: none;
  }
}
/* X}zFXN[AŌŒo[o\iёցE͉Bj */
@media (max-width: 620px) {
  body.mobileSearchOnly #sortSelect {
    display: none !important;
  }
  body.mobileSearchOnly .candidateWrap {
    display: none !important;
  }
  body.mobileSearchOnly .filterRow {
    grid-template-columns: 1fr !important;
  }
  body.mobileSearchOnly .searchBox {
    width: 100% !important;
  }
}
/* ---- Mobile spacing tuning ---- */
@media (max-width: 620px) {
  .container {
    width: calc(100% - 16px) !important;
  } /* E8px */
  #Uma_list {
    gap: 10px !important;
  }
  .meta {
    padding: 9px 9px 10px !important;
  }
  .meta ul {
    gap: 4px !important;
  } /* ]l߁E*/
  .name {
    min-height: 0 !important;
  } /* n̋󔒂ȁE*/
}
/* [_FʂʼnYȂ悤ɕƗ]œK */
@media (max-width: 767px) {
  .filterBar {
	/*margin-top: 10px;*/
	position:static;
  }
}
@media (max-width: 620px) {
  .modal {
    padding: 12px;
  }
  .modal-dialog {
    width: calc(100vw - 24px);
  }
  .modalBody {
    grid-template-columns: 1fr;
  } /* X}z͏cς݂ŁE*/
}
/* X}zFŒo[͉ʍŏ㕔ɁiԂȂj */
@media (max-width: 620px) {
  .filterBar {
    top: 0 !important;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 0 8px !important;
	/*margin-top: 10px;*/
	position:static;
  }
}
/* --- Perceived performance polish: image skeleton + fade-in --- */
.thumb {
  position: relative;
  overflow: hidden;
}
.thumb.is-loading::before, .modalImgWrap.is-loading::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(148, 163, 184, .18) 0%, rgba(148, 163, 184, .34) 20%, rgba(148, 163, 184, .18) 40%, rgba(148, 163, 184, .18) 100%);
  background-size: 200% 100%;
  animation: shimmer 1.1s linear infinite;
}
@keyframes shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
.thumbImg, .modalImg {
  opacity: 0;
  transform: scale(1.01);
  transition: opacity .18s ease, transform .28s ease;
  will-change: opacity, transform;
}
.thumbImg.is-loaded, .modalImg.is-loaded {
  opacity: 1;
  transform: scale(1);
}
/* --- Empty state --- */
.emptyState {
  margin: 16px 0 6px;
  padding: 14px 14px;
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: 16px;
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 12px 24px rgba(2, 6, 23, .06);
}
.emptyState h3 {
  margin: 0 0 6px;
  font-size: 14px;
}
.emptyState p {
  margin: 0 0 10px;
  color: rgba(15, 23, 42, .72);
  font-size: 12px;
  line-height: 1.55;
}
.emptyActions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.emptyActions .ghost {
  padding: 8px 10px;
}
/* --- Search highlight --- */
mark {
  background: rgba(250, 204, 21, .38);
  color: inherit;
  padding: 0 .12em;
  border-radius: .28em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}





/* --- h[j[ --- */
.filterRow {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.drawerContent{
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-start;
}

.chipBlock.open .drawerContent{
  max-height: 1000px;
}


@media (min-width: 768px) {
  .filterRow {
    flex-direction: row;
  }

  .filterRow .chipBlock {
    flex: 1;
  }
	
  .filterRow{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }

  .chipBlock{
    width: 100%;
  }
}
@media (max-width: 767px) {
  .drawer {
    width: 100%;
  }
	
  .drawerContent{
    display: flex;
    flex-wrap: wrap; 
    justify-content: flex-start;
    align-items: flex-start; 
    gap: 8px;
  }
  .drawerContent .segGroup {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    gap: 8px;
  }

  .drawerContent .segBtn {
    white-space: nowrap;
    flex: 0 0 auto;
  }
  .chipBlock{
    overflow: visible;
  }	
	
}


/* --- gbv֖߁E^ --- */
#backToTop {
  position: fixed;
  right: 24px;
  bottom: 24px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: none;
  background-color: #000;
  box-shadow: 0 6px 16px rgba(0,0,0,0.4);
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, transform .3s ease;
  transform: translateY(10px);
  z-index: 999;
}

#backToTop.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

#backToTop:hover {
  background: #fff;
  color: #000;
}



/* --- BookGA --- */
.bookarea {
	font-family: "Roboto", UILanguageFont, Arial, sans-serif;
	margin-top: 30px;
	margin-bottom: 30px;
}

.bookarea_main {
	margin-bottom: 30px;
}

.bookarea_caption {
	line-height: 1.846;
}

.bookarea_caption ul,
.bookarea_caption ol {
	list-style: disc;
	margin-left: 32px;
    margin-bottom: 14px;
}

#tokusyuTop .label-default{
	background:#888;
	color:#fff;
}

#tokusyuTop h2,  #tokusyuTop h3 {
	color: #5A5A5A;
}
#tokusyuTop p,  #tokusyuTop li {
	color: #5A5A5A;
}

#tokusyuTop .h2 small {
	font-size: 12px;
}
#tokusyuTop .h3 {
	font-size: 20px;
	font-weight: bold;
	padding-bottom: 5px;
	word-break: keep-all;
}
#tokusyuTop .h3 small {
	font-size: 16px;
}
.icoY {
	transform: rotateY( 180deg );
}

.tokusyuwidth{
  padding-left: 10px;
  padding-right: 10px;
}

@media screen and (max-width: 768px) {
#tokusyuTop .h2 {
	font-size: 20px;
	font-weight: bold;
}
#tokusyuTop .h2 small {
	font-size: 12px;
}
#tokusyuTop .h3 {
	font-size: 20px;
	font-weight: bold;
}
#tokusyuTop .h3 small {
	font-size: 12px;
}
}


/* --- footerGA --- */
.copyright {
    background: #009b42;
    color: #fff;
    padding: 20px 0 10px;
    font-size: 12px;
}
	
.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/* ==============================
   Header hamburger (mobile)
   ============================== */
.navToggle{
  display:none;                 /* PC͔\ */
  width:44px;
  height:44px;
  border-radius:14px;
  border:1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.75);
  box-shadow: 0 8px 16px rgba(2,8,23,.06);
  cursor:pointer;

  /* O{cɕׁE*/
  flex-direction: column;
  align-items:center;
  justify-content:center;
  gap:4px;
}

.navToggle__bar{
  width:18px;
  height:2px;
  background: rgba(15,23,42,.75);
  border-radius:99px;
  display:block;
}

/* PC͏]ǂiEɃNoj */
.headNav{ display:block; }

@media (max-width: 768px){
  .navToggle{ display:flex; }   /* SP\ */

  .siteHeader__inner{ position: relative; }

  /* SPł̓Nhbv_E */
  .headNav{
    position:absolute;
    right:0;
    top:calc(100%);
    width:min(260px, 92vw);
    padding:10px;
    border-radius:16px;
    border:1px solid rgba(15,23,42,.10);
    background: rgba(255,255,255,.98);
    box-shadow: 0 12px 30px rgba(2,8,23,.10);
    display:none;
    z-index:120;
  }
  body.is-navopen .headNav{ display:block; }

  .headNav .headActions{
    width:100%;
    justify-content:stretch;
    gap:10px;
  }
  .headNav .pillLink{
    width:100%;
    justify-content:flex-start;
  }
}


/* ==============================
   Mobile off-canvas header menu
   ============================== */
@media (max-width: 768px){
  .headNav{
    position: fixed;
    inset: 0;
    width: 100vw;
    top: var(--headerH, 0px);
    bottom: 0;
    left: 0;
    right: 0;
    height: calc(100vh - var(--headerH, 0px));
    display: block;
    z-index: 9999;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    background: transparent !important; /* �����̔��w�i���[���������Ă��ׂ� */
    transition: opacity .22s ease, visibility 0s linear .22s;
  }

  .headNav::before{
    content:"";
    position:absolute;
    inset:0;
	top: 0;
    background: rgba(2, 8, 23, .55);
    opacity: 0;
    transition: opacity .22s ease;
  }

  .headNav .headActions{
    position:absolute;
    top:0;
    right:0;
    height:100%;
    width: min(360px, 86vw);
    padding: 18px 14px;
    background: rgba(255,255,255,.98);
    border-left: 1px solid rgba(15,23,42,.10);
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap: 12px;

    transform: translateX(100%);
    transition: transform .22s ease;
  }

  body.is-navopen .headNav{ pointer-events: auto; }
  body.is-navopen .headNav::before{ opacity: 1; }
  body.is-navopen .headNav .headActions{ transform: translateX(0); }

  .headNav .pillLink{
    width: 100%;
    justify-content: flex-start;
    padding: 14px 14px;
    border-radius: 14px;
    font-size: 14px;
  }

  body.nav-lock{
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
  }
	
  body.is-navopen .headNav{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .22s ease;
  }

  @media (prefers-reduced-motion: reduce){
    .headNav::before,
    .headNav .headActions{ transition: none !important; }
  }
}