ラジオボタンのカスタマイズ

<div class="mb-3">
	<label for="userSex" class="form-label">성별</label>
	<div class="form_toggle row-vh d-flex flex-row justify-content-between" >
		<div class="form_radio_btn radio_male">
			<input id="radio-1" type="radio" name="userSex" value="male" checked>
			<label for="radio-1">남자</label>
		</div>
									 
		<div class="form_radio_btn">
			<input id="radio-2" type="radio" name="userSex" value="female">
			<label for="radio-2">여자</label>
		</div>
	</div>
</div>

.form_radio_btn {
			width: 47%;
			height : 45px;
    		border: 1px solid #EAE7E7;
    		border-radius: 10px;
		}
		.form_radio_btn input[type=radio] {
			display: none;
		}
		.form_radio_btn label {
			display: block;
    		border-radius: 10px;
   			margin: 0 auto;
    		text-align: center;
    		height: -webkit-fill-available;
    		line-height: 45px;
		}
		 
		/* Checked */
		.form_radio_btn input[type=radio]:checked + label {
			background: #184DA0;
			color: #fff;
		}
		 
		/* Hover */
		.form_radio_btn label:hover {
			color: #666;
		}
		 
		/* Disabled */
		.form_radio_btn input[type=radio] + label {
			background: #F9FAFC;
			color: #666;
		}