@charset "UTF-8";

.badge { display:inline-block; height:31px; line-height:31px; padding:0px 8px; border:0px; border-radius:20px; background-color:var(--color-G2); font-size:12px; font-weight:800; color:var(--color-G8); }
.badge.disabled { background-color:var(--color-G5); color:var(--color-WH); font-weight:bold; }


/* style */

.badge.badge1 { background-color:var(--color-G8); color:var(--color-WH); }
.badge.badge1.disabled { background-color:var(--color-G2); color:var(--color-G6); font-weight:bold; }

.badge.badge2 { background-color:var(--color-WH); color:var(--color-G8); border:1px solid var(--color-G3) }
.badge.badge2.disabled { background-color:var(--color-G2); color:var(--color-G6); font-weight:bold; border:0px }

.badge.badge3 { background-color:var(--color-B2); color:var(--color-B7); }
.badge.badge3.disabled { background-color:var(--color-G2); color:var(--color-G6); font-weight:bold; }

.badge.badge4 { background-color:var(--color-A1); color:var(--color-A6); }
.badge.badge4.disabled { background-color:var(--color-G2); color:var(--color-G6); font-weight:bold; }

.badge.badge5 { background-color:#D3F6EA; color:#01B574; }
.badge.badge5.disabled { background-color:var(--color-G2); color:var(--color-G6); font-weight:bold; }

.badge.badge6 { background-color:var(--color-G3); color:var(--color-G6); }
.badge.badge6.disabled { background-color:var(--color-G2); color:var(--color-G6); font-weight:bold; }

.badge.badge7 { background-color:var(--color-G5); color:var(--color-WH); }
.badge.badge7.disabled { background-color:var(--color-G2); color:var(--color-G6); font-weight:bold; }



/* size */
.badge.tiny   { height:20px; line-height:20px; font-size:11px; padding:0px 8px;  }
.badge.small  { height:31px; line-height:31px; font-size:12px; padding:0px 8px;  }
.badge.medium { height:37px; line-height:37px; font-size:12px; padding:0px 12px; font-weight:800 }