.utopia-bto-search{
  --bto-ink: #152033;
  --bto-muted: #68758a;
  --bto-line: #d9e1eb;
  --bto-surface: #ffffff;
  --bto-page: #f4f7fb;
  --bto-blue: #165dff;
  --bto-blue-deep: #0e3fa9;
  --bto-cyan: #0bbfe9;
  --bto-danger: #a83737;
  --bto-focus: #ff9e2c;
  --bto-radius: 6px;
  --bto-shadow: 0 10px 28px rgba(18, 36, 67, .08);
  color: var(--bto-ink);
  font-family: "Noto Sans JP", "Yu Gothic", sans-serif;
}.utopia-bto-search *{ box-sizing: border-box; }.utopia-bto-search button, .utopia-bto-search input, .utopia-bto-search select{ font: inherit; }.utopia-bto-search button, .utopia-bto-search select, .utopia-bto-search input[type="checkbox"], .utopia-bto-search input[type="number"]{ accent-color: var(--bto-blue); }.utopia-bto-search button{ cursor: pointer; }.utopia-bto-search button:focus-visible, .utopia-bto-search a:focus-visible, .utopia-bto-search select:focus-visible, .utopia-bto-search input:focus-visible{ outline: 3px solid var(--bto-focus); outline-offset: 2px; }.utopia-bto-search .bto-search{ min-height: 100vh; background: var(--bto-page); }.utopia-bto-search .bto-search__header{ display: flex; justify-content: space-between; gap: 32px; align-items: end; padding: 42px max(24px, calc((100% - 1280px) / 2)); background: var(--bto-surface); border-bottom: 4px solid var(--bto-blue); }.utopia-bto-search .bto-search__header h1{ margin: 5px 0 10px; font-size: clamp(28px, 3vw, 42px); line-height: 1.2; letter-spacing: 0; }.utopia-bto-search .bto-search__header p{ margin: 0; color: var(--bto-muted); line-height: 1.8; }.utopia-bto-search .bto-search__eyebrow{ color: var(--bto-blue) !important; font-size: 12px; font-weight: 800; letter-spacing: .1em; }.utopia-bto-search .bto-search__notice{ flex: 0 0 auto; border: 1px solid var(--bto-line); padding: 8px 12px; color: var(--bto-muted) !important; font-size: 13px; }.utopia-bto-search .bto-search__layout{ max-width: 1280px; margin: 0 auto; padding: 26px 24px 64px; display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 24px; align-items: start; }.utopia-bto-search .bto-search__sidebar{ position: sticky; top: 18px; }.utopia-bto-search .bto-filter-panel{ background: var(--bto-surface); border: 1px solid var(--bto-line); border-top: 4px solid var(--bto-blue); box-shadow: var(--bto-shadow); }.utopia-bto-search .bto-filter-panel__heading{ min-height: 58px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--bto-line); }.utopia-bto-search .bto-filter-panel__heading h2{ margin: 0; font-size: 18px; }.utopia-bto-search .bto-link-button{ border: 0; background: transparent; color: var(--bto-blue-deep); text-decoration: underline; font-size: 13px; padding: 8px 0; }.utopia-bto-search .bto-filter-panel__body{ padding: 0 16px 12px; }.utopia-bto-search .bto-filter-group{ border: 0; border-bottom: 1px solid var(--bto-line); padding: 0 0 6px; margin: 0; min-inline-size: 0; }.utopia-bto-search .bto-filter-group:last-child{ border-bottom: 0; }.utopia-bto-search .bto-filter-group legend{ display: block; width: 100%; padding: 6px 0 5px; margin: 0; font-size: 14px; font-weight: 800; }.utopia-bto-search .bto-filter-options{ display: grid; gap: 6px; }.utopia-bto-search .bto-more-options{ margin-top: 6px; border: 0; background: transparent; color: var(--bto-blue-deep); padding: 4px 0; font-size: 13px; font-weight: 700; text-decoration: underline; }.utopia-bto-search .bto-check{ display: flex; align-items: center; gap: 8px; min-height: 28px; font-size: 14px; line-height: 1.45; }.utopia-bto-search .bto-check--vendor-break{ margin-block-start: 6px; }.utopia-bto-search .bto-check[hidden]{ display: none; }.utopia-bto-search .bto-check input{ inline-size: 18px; block-size: 18px; margin: 0; flex: 0 0 auto; }.utopia-bto-search .bto-select, .utopia-bto-search .bto-number{ width: 100%; min-height: 38px; border: 1px solid #b9c6d8; background: #fff; color: var(--bto-ink); padding: 7px 9px; border-radius: 3px; }.utopia-bto-search .bto-range{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.utopia-bto-search .bto-range label{ display: grid; gap: 5px; color: var(--bto-muted); font-size: 12px; }.utopia-bto-search .bto-filter-empty{ color: var(--bto-muted); font-size: 13px; margin: 12px 0; }.utopia-bto-search .bto-results-toolbar{ display: flex; align-items: end; justify-content: space-between; gap: 18px; padding: 4px 0 18px; border-bottom: 1px solid var(--bto-line); }.utopia-bto-search .bto-results-toolbar__label{ margin: 0 0 3px; color: var(--bto-muted); font-size: 13px; }.utopia-bto-search .bto-results-toolbar h2{ margin: 0; font-size: 24px; letter-spacing: 0; }.utopia-bto-search .bto-sort{ display: grid; gap: 5px; color: var(--bto-muted); font-size: 12px; }.utopia-bto-search .bto-sort select{ min-width: 156px; min-height: 38px; padding: 6px 8px; border: 1px solid #b9c6d8; background: #fff; color: var(--bto-ink); border-radius: 3px; }.utopia-bto-search .bto-active-conditions{ display: flex; flex-wrap: wrap; gap: 7px; padding: 14px 0 4px; }.utopia-bto-search .bto-active-conditions[hidden]{ display: none; }.utopia-bto-search .bto-active-condition{ display: inline-flex; align-items: center; gap: 7px; border: 1px solid #aebede; background: #fff; color: #27405f; padding: 5px 7px 5px 9px; font-size: 13px; }.utopia-bto-search .bto-active-condition button{ border: 0; background: transparent; color: #40516a; padding: 0 3px; line-height: 1; font-size: 17px; }.utopia-bto-search .bto-status{ min-height: 22px; margin: 12px 0; color: var(--bto-muted); font-size: 14px; }.utopia-bto-search .bto-status--error{ border-left: 4px solid var(--bto-danger); background: #fff3f2; color: #752624; padding: 12px; }.utopia-bto-search .bto-status button{ margin-left: 10px; border: 1px solid currentColor; background: #fff; color: inherit; padding: 5px 9px; }.utopia-bto-search .bto-product-list{ display: grid; gap: 12px; }.utopia-bto-search .bto-product{ display: grid; grid-template-columns: 176px minmax(0, 1fr); background: var(--bto-surface); border: 1px solid var(--bto-line); border-left: 4px solid #7c8fac; min-height: 204px; }.utopia-bto-search .bto-product:has(.bto-product__price--sale){ border-left-color: var(--bto-blue); }.utopia-bto-search .bto-product__image{ margin: 0; border-right: 1px solid var(--bto-line); background: #eaf0f7; min-height: 100%; overflow: hidden; }.utopia-bto-search .bto-product__image img{ display: block; inline-size: 100%; block-size: 100%; min-height: 204px; object-fit: contain; background: #fff; }.utopia-bto-search .bto-product__image--empty{ display: grid; place-items: center; padding: 18px; color: #67768c; font-size: 13px; text-align: center; background: #edf2f8; }.utopia-bto-search .bto-product__content{ min-width: 0; padding: 17px 18px 14px; }.utopia-bto-search .bto-product__topline{ display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }.utopia-bto-search .bto-product__manufacturer{ margin: 0; color: var(--bto-blue-deep); font-size: 13px; font-weight: 800; }.utopia-bto-search .bto-product__stock{ white-space: nowrap; font-size: 12px; font-weight: 800; }.utopia-bto-search .bto-product__stock--in{ color: #14734d; }.utopia-bto-search .bto-product__stock--out{ color: #8a5560; }.utopia-bto-search .bto-product h3{ margin: 4px 0 2px; font-size: 19px; line-height: 1.45; }.utopia-bto-search .bto-product__development-note{ margin: 0 0 10px; color: var(--bto-muted); font-size: 11px; }.utopia-bto-search .bto-product__middle{ display: flex; justify-content: space-between; gap: 16px; align-items: start; }.utopia-bto-search .bto-product__price{ display: grid; gap: 2px; flex: 0 0 auto; text-align: right; }.utopia-bto-search .bto-product__price strong{ color: var(--bto-blue-deep); font-size: 25px; line-height: 1.15; }.utopia-bto-search .bto-product__price s{ color: var(--bto-muted); font-size: 13px; }.utopia-bto-search .bto-product__price-label{ color: var(--bto-muted); font-size: 12px; }.utopia-bto-search .bto-product__main-specs{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 14px; margin: 0; flex: 1; }.utopia-bto-search .bto-product__main-specs div{ min-width: 0; }.utopia-bto-search .bto-product__main-specs dt{ color: var(--bto-muted); font-size: 11px; }.utopia-bto-search .bto-product__main-specs dd{ margin: 1px 0 0; font-size: 14px; font-weight: 700; overflow-wrap: anywhere; }.utopia-bto-search .bto-product__footer{ display: flex; gap: 9px 16px; flex-wrap: wrap; align-items: center; margin-top: 14px; color: #4d5b6e; font-size: 13px; }.utopia-bto-search .bto-product details{ margin-top: 12px; border-top: 1px solid var(--bto-line); padding-top: 9px; }.utopia-bto-search .bto-product summary{ color: var(--bto-blue-deep); font-size: 14px; font-weight: 700; cursor: pointer; }.utopia-bto-search .bto-product__details{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 18px; margin: 11px 0 0; padding: 0; }.utopia-bto-search .bto-product__details div{ border-bottom: 1px dotted #c8d2df; padding-bottom: 5px; }.utopia-bto-search .bto-product__details dt{ color: var(--bto-muted); font-size: 11px; }.utopia-bto-search .bto-product__details dd{ margin: 2px 0 0; font-size: 13px; overflow-wrap: anywhere; }.utopia-bto-search .bto-empty{ border: 1px dashed #aebede; background: #fff; padding: 32px 24px; text-align: center; }.utopia-bto-search .bto-empty h3{ margin: 0 0 8px; font-size: 20px; }.utopia-bto-search .bto-empty p{ margin: 0 0 16px; color: var(--bto-muted); }.utopia-bto-search .bto-primary-button, .utopia-bto-search .bto-secondary-button{ min-height: 42px; border-radius: 3px; padding: 8px 16px; font-weight: 800; }.utopia-bto-search .bto-primary-button{ border: 1px solid var(--bto-blue); background: var(--bto-blue); color: #fff; }.utopia-bto-search .bto-primary-button:hover{ background: var(--bto-blue-deep); }.utopia-bto-search .bto-secondary-button{ border: 1px solid #9eafc4; background: #fff; color: var(--bto-ink); }.utopia-bto-search .bto-pagination{ display: flex; justify-content: center; gap: 6px; padding-top: 24px; }.utopia-bto-search .bto-pagination button{ min-width: 38px; min-height: 38px; border: 1px solid #aab9cc; background: #fff; color: var(--bto-ink); }.utopia-bto-search .bto-pagination button[aria-current="page"]{ border-color: var(--bto-blue); background: var(--bto-blue); color: #fff; }.utopia-bto-search .bto-pagination button:disabled{ color: #9ba6b5; background: #edf1f5; cursor: default; }.utopia-bto-search .bto-loading{ display: grid; gap: 12px; }.utopia-bto-search .bto-loading__item{ height: 204px; border: 1px solid var(--bto-line); background: #edf2f7; }.utopia-bto-search .bto-search__mobile-filter{ display: none; }.utopia-bto-search .bto-filter-dialog{ border: 0; padding: 0; width: min(100%, 560px); max-width: none; max-height: min(86vh, 760px); margin: auto 0 0; background: #fff; color: var(--bto-ink); box-shadow: 0 -12px 38px rgba(8, 21, 45, .22); }.utopia-bto-search .bto-filter-dialog::backdrop{ background: rgba(12, 22, 39, .45); }.utopia-bto-search .bto-filter-dialog__header{ display: flex; justify-content: space-between; align-items: center; padding: 15px 18px; border-bottom: 1px solid var(--bto-line); }.utopia-bto-search .bto-filter-dialog__header h2{ margin: 0; font-size: 18px; }.utopia-bto-search .bto-dialog-close{ border: 0; background: transparent; color: var(--bto-blue-deep); text-decoration: underline; padding: 8px; }.utopia-bto-search .bto-filter-dialog__body{ padding: 0 18px 18px; overflow: auto; max-height: calc(86vh - 128px); }.utopia-bto-search .bto-filter-dialog__footer{ display: flex; justify-content: space-between; gap: 12px; padding: 12px 18px; border-top: 1px solid var(--bto-line); background: #fff; }

@media (min-width: 781px) {.utopia-bto-search .bto-search__sidebar{ max-height: calc(100dvh - 36px); }.utopia-bto-search .bto-filter-panel{ display: flex; flex-direction: column; max-height: calc(100dvh - 36px); }.utopia-bto-search .bto-filter-panel__body{ min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #b5c5dc transparent; }.utopia-bto-search .bto-filter-panel__body::-webkit-scrollbar{ width: 8px; }.utopia-bto-search .bto-filter-panel__body::-webkit-scrollbar-track{ background: transparent; }.utopia-bto-search .bto-filter-panel__body::-webkit-scrollbar-thumb{ border: 2px solid #fff; border-radius: 8px; background: #b5c5dc; }
}

@media (max-width: 780px) {.utopia-bto-search .bto-search__header{ padding: 25px 18px 20px; display: block; }.utopia-bto-search .bto-search__header h1{ font-size: 29px; }.utopia-bto-search .bto-search__notice{ display: inline-block; margin-top: 14px; }.utopia-bto-search .bto-search__mobile-filter{ display: block; position: sticky; top: 0; z-index: 3; width: 100%; min-height: 50px; border: 0; border-bottom: 1px solid #9fb3d3; background: #fff; color: var(--bto-blue-deep); font-weight: 800; }.utopia-bto-search .bto-search__layout{ display: block; padding: 15px 14px 46px; }.utopia-bto-search .bto-search__sidebar{ display: none; }.utopia-bto-search .bto-results-toolbar{ align-items: end; }.utopia-bto-search .bto-results-toolbar h2{ font-size: 21px; }.utopia-bto-search .bto-sort select{ min-width: 132px; }.utopia-bto-search .bto-product{ grid-template-columns: 110px minmax(0, 1fr); min-height: 0; }.utopia-bto-search .bto-product__image img{ min-height: 150px; }.utopia-bto-search .bto-product__image--empty{ min-height: 150px; padding: 10px; font-size: 12px; }.utopia-bto-search .bto-product__content{ padding: 12px 12px 11px; }.utopia-bto-search .bto-product h3{ font-size: 16px; margin-bottom: 10px; }.utopia-bto-search .bto-product__middle{ display: block; }.utopia-bto-search .bto-product__price{ text-align: left; margin: 7px 0; }.utopia-bto-search .bto-product__price strong{ font-size: 21px; }.utopia-bto-search .bto-product__main-specs{ gap: 5px 8px; }.utopia-bto-search .bto-product__main-specs dd{ font-size: 12px; }.utopia-bto-search .bto-product__footer{ margin-top: 10px; font-size: 12px; gap: 5px 10px; }.utopia-bto-search .bto-product__details{ grid-template-columns: 1fr; }.utopia-bto-search .bto-active-conditions{ padding-top: 10px; }.utopia-bto-search .bto-active-condition{ font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {.utopia-bto-search *, .utopia-bto-search *::before, .utopia-bto-search *::after{ scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
