.chk-type-1 {
    background-color: #FFF;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    border: 1px solid #DDDDDD;
    appearance: none;
    cursor: pointer;
}
.chk-type-1 ~ label{
    cursor: pointer;
}
.chk-type-1:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2.6' fill='%237966FF'/%3e%3c/svg%3e");
  }


.chk-type-2 {
    background-color: #FFF;
    width: 1em;
    height: 1em;
    border: 1px solid #DDDDDD;
    appearance: none;
    cursor: pointer;
}
.chk-type-2 ~ label{
    cursor: pointer;
}
.chk-type-2:checked[type=checkbox] {
    background-color: #7966FF;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}
.radio_type-1 {        
    -webkit-appearance: none;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    outline: none;
    border: 1px solid #DDDDDD;
    background-color: #FFFFFF;
}
.radio_type-1:before {
    content: '';
    display: block;
    width: 60%;
    height: 60%;
    margin: 20% auto;
    border-radius: 50%;
}
.radio_type-1:checked:before {
    background: #7966FF;
}
.chk_type-3 label {
    height: 70px;
    width: 100%;
}
.chk_type-3 label input {
    position: absolute;
    display: none;
}
.chk_type-3 label > div {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    border:1px solid #DDDDDD;
    border-radius: 10px;
    background:#ffffff;
    cursor: pointer;
}
.chk_type-3 input:checked + div {
    border: 1px solid #7966FF;
    background-color: #F3F4F6;
    color:#7966FF;
    font-weight: 700 !important;
}