@charset "Shift_JIS";

/* ==========================================================================
  [cmp-label] プランに付随するラベル
  --------------------------------------------------------------------------
  【運用ルール】
  - Modifier（--xxx）では、色・背景色・枠線・太字の変更のみを許容する。
   ========================================================================== */
.cmp-label {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 18px;
  padding: 0 3px;
  font-size: 10px;
  font-weight: normal;
  border: 1px solid;
  border-radius: 2px;
}

.cmp-label--paymentEmphasisBlue {
  font-weight: bold;
  color: #fff;
  background-color: #399aca;
  border: 1px solid #399aca;
}

/* 数字表示・文字サイズ混在のためalign-itemsとpaddingの上書きを許容 */
.cmp-label--remainingStock {
  align-items: baseline;
  padding-top: 2px;
  color: #fc0d1c;
  background-color: #fff;
  border: 1px solid #fc0d1c;
}

.cmp-label--instantBooking {
  color: #e78a13;
  border: 1px solid #e78a13;
}

/* 数字表示・文字サイズ混在のためalign-itemsとpaddingの上書きを許容 */
.cmp-label--point {
  align-items: baseline;
  padding-top: 2px;
  color: #918b8a;
  border: 1px solid #918b8a;
}

/* 数字表記：通常テキストより文字サイズ強調 */
.cmp-label em {
  font-size: 12px;
}