/* ==========================================================
   会社のマイページ：同じサービスかどうかを会社が決める／掲載中の分類
   ========================================================== */

/* ---------- ホームの「この2つは、同じサービスですか？」 ---------- */
.vp .vp-ask {
  margin: 0 0 20px;
  padding: 14px 16px 12px;
  border: 1px solid var(--vp-warn-line);
  border-left: 4px solid #e0a03a;
  border-radius: 12px;
  background: var(--vp-warn);
}

.vp .vp-ask h3 { margin: 0 0 6px; font-size: 1.05rem; }
.vp .vp-ask-lead { margin: 0 0 10px; font-size: 0.9rem; line-height: 1.65; }

.vp .vp-ask-pair {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin: 0 0 10px;
}

.vp .vp-ask-card {
  flex: 1 1 280px;
  padding: 10px 12px;
  border: 1px solid var(--vp-line);
  border-radius: 10px;
  background: var(--vp-panel);
  font-size: 0.9rem;
}

.vp .vp-ask-cat {
  display: inline-block;
  margin-bottom: 4px;
  padding: 1px 9px;
  border-radius: 999px;
  background: var(--vp-accent-soft);
  color: var(--vp-accent-dark);
  font-size: 0.74rem;
  font-weight: 700;
}

.vp .vp-ask-prices { margin: 6px 0 8px; padding-left: 1.1em; font-size: 0.85rem; }
.vp .vp-ask-prices li { margin-bottom: 2px; }
.vp .vp-ask-link { font-size: 0.85rem; }

.vp .vp-ask-note { margin: 0 0 8px; font-size: 0.88rem; }
.vp .vp-ask-warn { color: #8a4b00; }

.vp .vp-ask-btns { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.vp .vp-ask-btns form { margin: 0; }
.vp .vp-ask-foot { margin: 10px 0 0; color: var(--vp-sub); font-size: 0.8rem; }

/* ---------- サービスの「掲載中の分類」 ---------- */
.vp .vp-group-panel { border-left: 4px solid var(--vp-accent); }

.vp .vp-cat-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 10px;
}

.vp .vp-cat-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 6px 4px 13px;
  border-radius: 999px;
  background: var(--vp-bg);
  border: 1px solid var(--vp-line);
  font-size: 0.87rem;
}

.vp .vp-cat-chip.is-current {
  background: var(--vp-accent-soft);
  border-color: var(--vp-accent);
  color: var(--vp-accent-dark);
  font-weight: 700;
}

.vp .vp-cat-chip a { text-decoration: none; }
.vp .vp-cat-chip form { margin: 0; display: inline-flex; }

.vp .vp-cat-x {
  border: 0;
  background: none;
  color: var(--vp-sub);
  cursor: pointer;
  font: inherit;
  line-height: 1;
  padding: 2px 5px;
  border-radius: 999px;
}

.vp .vp-cat-x:hover { background: #fff; color: var(--vp-danger); }

.vp .vp-group-note {
  margin: 0 0 6px;
  padding: 9px 12px;
  border-radius: 8px;
  background: var(--vp-accent-soft);
  font-size: 0.88rem;
  line-height: 1.65;
}