CSSでチェックボックスにスタイルを当てる

input.checkbox {
    display: none;
}

input.checkbox + label {
    background-color: #EEE;
    border: 1px solid #000;
    padding: 10px;
    display: inline-block;
    position: relative;
}
  
input.checkbox:checked + label {
    background-color: #EEE;
    border: 1px solid #000;
    color: #F00;
}
  
input.checkbox:checked:checked + label:after {
    content: '\2714';
    position: absolute;
    top: 0px;
    left: 3px;
}