/* 新しい色は増やさず、既存パレットの役割色を使用する。 */
.r75-guide-region {
  position: relative;
  z-index: 20;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.r75-guide-region .wrap { padding-block: 12px; }
.r75-guide {
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-s);
  background: var(--card);
  color: var(--ink);
}
.r75-guide summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  padding: 10px 16px;
  color: var(--sea);
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}
.r75-guide summary::-webkit-details-marker { display: none; }
.r75-guide summary::after { content: '+'; font-size: 22px; line-height: 1; }
.r75-guide[open] summary::after { content: '−'; }
.r75-guide-content { padding: 0 16px 16px; }
.r75-guide-question { margin: 0 0 10px; font-size: 15px; font-weight: 700; }
.r75-guide-options { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.r75-guide-options[hidden], .r75-guide-result[hidden] { display: none; }
.r75-guide-options button, .r75-guide-close, .r75-guide-next {
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-s);
  background: var(--card);
  color: var(--sea);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  cursor: pointer;
}
.r75-guide-options button[aria-pressed='true'] {
  background: var(--sea);
  border-color: var(--sea);
  color: var(--on-sea);
}
.r75-guide-options button:hover, .r75-guide-close:hover { border-color: var(--sea); }
.r75-guide summary:focus-visible, .r75-guide button:focus-visible, .r75-guide a:focus-visible {
  outline: 3px solid var(--sea);
  outline-offset: 3px;
}
.r75-guide-result {
  margin-top: 14px;
  padding: 12px 14px;
  background: var(--paper);
  border-left: 3px solid var(--sea);
}
.r75-guide-result h2 { margin: 0 0 4px; color: var(--ink); font-size: 18px; line-height: 1.35; }
.r75-guide-result p { margin: 0 0 8px; color: var(--ink); font-size: 14px; line-height: 1.55; }
.r75-guide-next { display: inline-flex; align-items: center; text-decoration: none; border-color: var(--sea); }
.r75-guide-next:hover { background: var(--sea-tint); }
.r75-guide-bottom { display: flex; justify-content: flex-end; margin-top: 10px; }
.r75-guide-close { border-color: transparent; min-height: 44px; }
.r75-guide-nojs p { margin: 0 0 8px; }
.r75-guide-nojs a { display: inline-flex; min-height: 44px; align-items: center; margin-right: 14px; color: var(--sea); }
@media (max-width: 600px) {
  .r75-guide-region .wrap { padding-block: 8px; }
  .r75-guide summary { padding-inline: 12px; }
  .r75-guide-content { padding: 0 12px 12px; }
  .r75-guide-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .r75-guide-result { padding: 10px 12px; }
  .r75-guide-result h2 { font-size: 16px; }
}
@media print { .r75-guide-region { display: none !important; } }

/* トップだけ、案内と実物写真を同じ判断面に置く。 */
.assortment-copy .r75-guide-region { margin-top: 18px; background: transparent; border: 0; }
.assortment-copy .r75-guide-region .wrap { width: 100%; max-width: none; padding: 0; }
.assortment-copy .r75-guide-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.r75-guide-contact { display: inline-flex; align-items: center; min-height: 44px; margin-inline-start: 10px; color: var(--sea); font-weight: 700; }
.r75-guide-contact:focus-visible { outline: 3px solid var(--sea); outline-offset: 3px; }
.r75-guide-source { display: inline-flex; align-items: center; min-height: 44px; margin-inline-start: 10px; color: var(--sea); font-weight: 700; }
.r75-guide-source[hidden] { display: none; }

/* 会社案内の実写真と場面選択を、最初の視界で一緒に見せる。 */
.r75-firstlook { margin: 0 0 18px; }
.r75-firstlook img { display: block; width: 100%; height: 155px; object-fit: cover; object-position: 50% 52%; }
.r75-firstlook figcaption { margin-top: 5px; color: var(--ink-2); font-size: 12px; }
@media (max-width: 760px) {
  .hero.assortment .assortment-copy { padding-top: 14px; }
  .hero.assortment .assortment-copy h1 { font-size: clamp(27px, 7vw, 34px); }
  .r75-firstlook { margin-bottom: 10px; }
  .r75-firstlook img { height: clamp(105px, 32vw, 145px); }
  .assortment-copy .r75-guide-region { margin-top: 10px; }
}

/* 場面の選択で、既存の画像要素を切り替える。 */
.r75-firstlook .r75-scene { display: flex; align-items: center; justify-content: center; height: 155px; background: var(--card); }
.r75-firstlook .r75-scene[hidden] { display: none; }
.r75-firstlook .r75-scene img { width: auto; max-width: 100%; height: 100%; object-fit: contain; }
.r75-firstlook .r75-scene[data-guide-scene="soup"] img { width: 100%; object-fit: cover; object-position: 50% 60%; }
.r75-firstlook .r75-scene-pair img { width: 50%; }
@media (max-width: 760px) { .r75-firstlook .r75-scene { height: clamp(105px, 32vw, 145px); } }

.r75-gift-path[hidden], .r75-gift-path [hidden], .r75-firstlook [data-guide-scene-source][hidden] { display: none; }
.r75-gift-choices { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.r75-gift-choices button, .r75-gift-path a { min-height: 44px; padding: 9px 12px; border: 1px solid var(--line-strong); background: var(--card); color: var(--sea); font: inherit; font-weight: 700; }
.r75-gift-choices button[aria-pressed='true'] { background: var(--sea); color: var(--on-sea); border-color: var(--sea); }
.r75-gift-path a { display: inline-flex; align-items: center; }
.r75-gift-path button:focus-visible, .r75-gift-path a:focus-visible { outline: 3px solid var(--sea); outline-offset: 3px; }
.r75-firstlook figcaption a { color: var(--sea); }
