/* html */

<div id="check_css3">

      <span><input type="checkbox" class="input_check"/><label></label></span>

</div>



 /* css checkbox 對勾框 可以多選*/


        #check_css3 {
            display: flex;
        }
          #check_css3 span:first-child {position: relative;margin-top:10px;}
           #check_css3 .input_check {position: absolute;width: 30px;
                height: 30px;
                opacity: 0;
                top: 10px;
                left:3px;
                z-index: 10;
                cursor: pointer;
        }
            #check_css3 .input_check + label {
                display: inline-block;
                margin-top:5px;
                width: 30px;
                height: 30px;
                border: 1px solid red;
                border-radius:50%;
            } 
            #check_css3 .input_check:checked + label::after {
                position: absolute;
                left: 0px;
                top:4px;
                width: 30px;
                height: 30px;
               /* border: 1px solid #ccc;*/
                border-radius:50%;
                content: "\2714";
                text-align:center;
                line-height: 30px;
                color: #39e60e;
                display: inline-block;
                -ms-transform: rotate(5deg);
                -moz-transform: rotate(5deg);
                -webkit-transform: rotate(5deg); 
                transform: rotate(5deg);
    }