@charset "UTF-8";

/**
 * Nicole 比較・スペック表
 * Updated: 2026-08-06
 * Version: 1.0.1
 * Release: NCB-COMPARISON-TABLE-FIX-V1-20260806
 */

.nicole-comparison-table {
  --nct-title: var(--nicole-text-color);
  --nct-header-text: #fff;
  --nct-header-bg: var(--nicole-primary-color);
  --nct-label-text: var(--nicole-text-color);
  --nct-body-text: var(--nicole-text-color);
  --nct-border: var(--nicole-border-color);
  --nct-group-text: var(--nicole-text-color);
  --nct-group-bg: var(--nicole-background-subtle);
  --nct-highlight-text: var(--nicole-text-color);
  --nct-highlight-bg: var(--nicole-background-subtle);
  --nct-stripe-bg: var(--nicole-background-subtle);
  --nct-table-bg: var(--nicole-background-color);
  --nct-label-width: clamp(150px, 24vw, 270px);
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--nct-body-text);
  font-family: var(--nicole-font-body);
  font-weight: var(--nicole-body-weight);
  box-sizing: border-box;
  overflow: clip;
}

@supports (color: color-mix(in srgb, #000 50%, #fff)) {
  .nicole-comparison-table { --nct-highlight-bg: color-mix(in srgb, var(--nicole-accent-color) 18%, #fff); }
}

.nicole-comparison-table *,
.nicole-comparison-table *::before,
.nicole-comparison-table *::after { box-sizing: border-box; }

.nicole-comparison-table--width-content .nicole-comparison-table__inner {
  width: min(calc(100% - (2 * var(--nicole-content-padding))), var(--nicole-content-width));
  margin-inline: auto;
}

.nicole-comparison-table--width-full .nicole-comparison-table__inner {
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  margin-left: -50vw;
  padding-inline: var(--nicole-content-padding);
}

@supports (width: 100dvw) {
  .nicole-comparison-table--width-full .nicole-comparison-table__inner {
    width: 100dvw;
    max-width: 100dvw;
    margin-left: -50dvw;
  }
}

.nicole-comparison-table__description,
.nicole-comparison-table__note {
  margin: 0;
  color: var(--nct-body-text);
  font: inherit;
  line-height: 1.75;
  overflow-wrap: anywhere;
}

.nicole-comparison-table__description { margin-bottom: 16px; }
.nicole-comparison-table__note { margin-top: 12px; color: var(--nicole-text-light); font-size: .9375rem; }

.nicole-comparison-table__scroll-hint {
  display: none;
  margin: 0 0 8px;
  color: var(--nicole-text-light);
  font-size: .875rem;
}

.nicole-comparison-table__scroll {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  background: var(--nct-table-bg);
  scrollbar-width: auto;
}

.nicole-comparison-table--outer-border .nicole-comparison-table__scroll { border: 1px solid var(--nct-border); }
.nicole-comparison-table--rounded .nicole-comparison-table__scroll { border-radius: var(--nicole-border-radius, 8px); }

.nicole-comparison-table .nicole-comparison-table__table {
  width: 100%;
  min-width: 100%;
  margin: 0;
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
  color: var(--nct-body-text);
  background: var(--nct-table-bg);
  font-family: var(--nicole-font-body);
  font-size: 1rem;
  line-height: 1.55;
}

.nicole-comparison-table--type-comparison .nicole-comparison-table__table { min-width: max(100%, calc(var(--nct-label-width) + (var(--nct-target-count, 2) * 180px))); }

.nicole-comparison-table__title {
  margin: 0 0 14px;
  padding: 0;
  color: var(--nct-title);
  font-family: var(--nicole-font-heading);
  font-size: clamp(1.25rem, 2vw, 1.625rem);
  font-weight: var(--nicole-heading-weight);
  line-height: 1.35;
  text-align: left;
  overflow-wrap: anywhere;
}

.nicole-comparison-table .nicole-comparison-table__table th,
.nicole-comparison-table .nicole-comparison-table__table td {
  height: auto;
  border: 0;
  border-bottom: 1px solid var(--nct-border);
  background-clip: padding-box;
  color: var(--nct-body-text);
  font: inherit;
  vertical-align: middle;
  text-transform: none;
  letter-spacing: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}

.nicole-comparison-table--padding-compact .nicole-comparison-table__table th,
.nicole-comparison-table--padding-compact .nicole-comparison-table__table td { padding: 10px 12px; }
.nicole-comparison-table--padding-medium .nicole-comparison-table__table th,
.nicole-comparison-table--padding-medium .nicole-comparison-table__table td { padding: 16px 18px; }
.nicole-comparison-table--padding-spacious .nicole-comparison-table__table th,
.nicole-comparison-table--padding-spacious .nicole-comparison-table__table td { padding: 22px 24px; }

.nicole-comparison-table .nicole-comparison-table__table thead th {
  color: var(--nct-header-text);
  background: var(--nct-header-bg);
  font-family: var(--nicole-font-heading);
  font-weight: var(--nicole-heading-weight);
  text-align: center;
  vertical-align: top;
}

.nicole-comparison-table .nicole-comparison-table__table tbody th[scope="row"] {
  width: var(--nct-label-width);
  min-width: min(var(--nct-label-width), 42vw);
  color: var(--nct-label-text);
  background: var(--nct-table-bg);
  font-family: var(--nicole-font-body);
  font-weight: 700;
  text-align: left;
}

.nicole-comparison-table--label-narrow { --nct-label-width: clamp(120px, 18vw, 200px); }
.nicole-comparison-table--label-wide { --nct-label-width: clamp(180px, 32vw, 360px); }
.nicole-comparison-table--align-left .nicole-comparison-table__table td { text-align: left; }
.nicole-comparison-table--align-center .nicole-comparison-table__table td { text-align: center; }
.nicole-comparison-table--align-right .nicole-comparison-table__table td { text-align: right; }

.nicole-comparison-table__row-note,
.nicole-comparison-table__target-note {
  display: block;
  margin-top: 5px;
  font-family: var(--nicole-font-body);
  font-size: .875rem;
  font-weight: var(--nicole-body-weight);
  line-height: 1.45;
  opacity: .82;
}

.nicole-comparison-table__image { display: block; max-width: 220px; margin: 0 auto 10px; }
.nicole-comparison-table__image img { display: block; width: 100%; height: clamp(72px, 11vw, 130px); margin: 0; object-fit: contain; }
.nicole-comparison-table__target-name { display: block; overflow-wrap: anywhere; }
.nicole-comparison-table__recommended { display: table; margin: 0 auto 9px; padding: 4px 9px; border: 1px solid currentColor; font: 700 .75rem/1.2 var(--nicole-font-body); }

.nicole-comparison-table .nicole-comparison-table__group th {
  color: var(--nct-group-text);
  background: var(--nct-group-bg);
  font-family: var(--nicole-font-heading);
  font-weight: var(--nicole-heading-weight);
  text-align: left;
}

.nicole-comparison-table--design-bordered .nicole-comparison-table__table th,
.nicole-comparison-table--design-bordered .nicole-comparison-table__table td { border-right: 1px solid var(--nct-border); }
.nicole-comparison-table--design-bordered .nicole-comparison-table__table tr > :last-child { border-right: 0; }
.nicole-comparison-table--design-striped .nicole-comparison-table__data-row.is-striped-row > * { background: var(--nct-stripe-bg); }

.nicole-comparison-table .nicole-comparison-table__table .is-highlighted-column,
.nicole-comparison-table .nicole-comparison-table__table .is-highlighted-row > * {
  color: var(--nct-highlight-text);
  background: var(--nct-highlight-bg);
}
.nicole-comparison-table .nicole-comparison-table__table thead .is-highlighted-column { box-shadow: inset 0 4px 0 var(--nicole-accent-color); }

.nicole-comparison-table--sticky-header .nicole-comparison-table__table thead th { position: sticky; top: 0; z-index: 3; }
.nicole-comparison-table--sticky-column .nicole-comparison-table__corner { position: sticky; left: 0; z-index: 5; }
.nicole-comparison-table--sticky-column .nicole-comparison-table__table tbody th[scope="row"] { position: sticky; left: 0; z-index: 2; }

.nicole-comparison-table__empty { padding: 24px; border: 1px dashed var(--nicole-border-color); color: var(--nicole-text-light); background: var(--nicole-background-subtle); font-family: var(--nicole-font-body); text-align: center; }

@media (max-width: 767px) {
  .nicole-comparison-table__scroll-hint { display: block; }
  .nicole-comparison-table--type-comparison .nicole-comparison-table__table { min-width: max(620px, calc(var(--nct-label-width) + 180px)); }
  .nicole-comparison-table .nicole-comparison-table__table { font-size: .9375rem; }
  .nicole-comparison-table .nicole-comparison-table__table tbody th[scope="row"] { min-width: min(var(--nct-label-width), 38vw); max-width: 38vw; }
  .nicole-comparison-table--type-spec .nicole-comparison-table__table { table-layout: fixed; }
  .nicole-comparison-table--type-spec .nicole-comparison-table__table tbody th[scope="row"] { width: 38%; min-width: 0; }
}

.editor-styles-wrapper .nicole-comparison-table--width-full .nicole-comparison-table__inner,
.acf-block-preview .nicole-comparison-table--width-full .nicole-comparison-table__inner {
  left: auto;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  padding-inline: 0;
}