/* =========================================================
 * 東京テアトル：必須表示（* → 「必須」バッジ）
 * 対象：HSFCの必須マーク要素（.hsfc-FieldLabel__RequiredIndicator の *）
 * 方針：
 *  - * を消して、赤い四角の「必須」バッジを表示
 *  - 余白はバッジ（::after）側の margin-left で調整（DOM構造依存が少なく安定）
 * ========================================================= */

/* 既存の「*」を見えなくする（display:noneだとレイアウト崩れするケースがあるため font-size:0 を優先） */
.hs-form-html .hsfc-FieldLabel__RequiredIndicator,
.hbspt-form .hsfc-FieldLabel__RequiredIndicator{
	font-size: 0 !important;
	vertical-align: middle;
}

/* 「必須」バッジを疑似要素で表示 */
.hs-form-html .hsfc-FieldLabel__RequiredIndicator::after,
.hbspt-form .hsfc-FieldLabel__RequiredIndicator::after{
	content: "必須";
	display: inline-block;
	margin-left: 16px !important; /* ← ラベルと必須の間隔（好みで 12〜24px で調整） */
	font-size: 14px;
	line-height: 1;
	padding: 5px 10px;
	background: #e60012; /* 赤：必要に応じて調整 */
	color: #fff;
	font-weight: 700;
	border-radius: 0; /* 四角 */
}