.checkbox-primary {
  display: inline-block;
  vertical-align: top;
  min-width: 14px;
  min-height: 14px;
  font-size: 10px;
  line-height: 1;

  .checkbox-origin {
    display: none;

    &:checked + .checkbox-label {
      position: relative;

      &::before {
        background-image: url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22%22%3E%20%3Cpath%20id%3D%22ic_check_box_24px%22%20d%3D%22M15.444%2C3H4.556A1.555%2C1.555%2C0%2C0%2C0%2C3%2C4.556V15.444A1.555%2C1.555%2C0%2C0%2C0%2C4.556%2C17H15.444A1.555%2C1.555%2C0%2C0%2C0%2C17%2C15.444V4.556A1.555%2C1.555%2C0%2C0%2C0%2C15.444%2C3Zm-7%2C11.667L4.556%2C10.778V7.667l3.889%2C4.021%2C7-7.132V7.667Z%22%20transform%3D%22translate%28-3%20-3%29%22%20fill%3D%22rgb%2850%2C50%2C58%29%22%2F%3E%20%3C%2Fsvg%3E);
      }
    }
  }

  .checkbox-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: top;
    min-width: 24px;
    min-height: 24px;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;

    &::before {
      content: "";
      display: inline-block;
      width: 14px;
      height: 14px;
      margin-right: 5px;
      background: url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22%22%3E%20%3Cg%20id%3D%22ic_check_box_24px%22%20transform%3D%22translate%28-3%20-3%29%22%20fill%3D%22none%22%3E%20%3Cpath%20d%3D%22M15.444%2C3H4.556A1.555%2C1.555%2C0%2C0%2C0%2C3%2C4.556V15.444A1.555%2C1.555%2C0%2C0%2C0%2C4.556%2C17H15.444A1.555%2C1.555%2C0%2C0%2C0%2C17%2C15.444V4.556A1.555%2C1.555%2C0%2C0%2C0%2C15.444%2C3Z%22%20stroke%3D%22none%22%2F%3E%20%3Cpath%20d%3D%22M%204.555560111999512%204%20C%204.24921989440918%204%204%204.24921989440918%204%204.555560111999512%20L%204%2015.44443988800049%20C%204%2015.75078010559082%204.24921989440918%2016%204.555560111999512%2016%20L%2015.44443988800049%2016%20C%2015.75078010559082%2016%2016%2015.75078010559082%2016%2015.44443988800049%20L%2016%204.555560111999512%20C%2016%204.24921989440918%2015.75078010559082%204%2015.44443988800049%204%20L%204.555560111999512%204%20M%204.555560111999512%203%20L%2015.44443988800049%203%20C%2016.30777931213379%203%2017%203.700000762939453%2017%204.555560111999512%20L%2017%2015.44443988800049%20C%2017%2016.29999923706055%2016.30777931213379%2017%2015.44443988800049%2017%20L%204.555560111999512%2017%20C%203.692220687866211%2017%203%2016.29999923706055%203%2015.44443988800049%20L%203%204.555560111999512%20C%203%203.700000762939453%203.692220687866211%203%204.555560111999512%203%20Z%22%20stroke%3D%22none%22%20fill%3D%22rgb%2850%2C50%2C58%29%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E) no-repeat center / 14px;
    }
  }
}