snow-monkey-drawer-custom.scss

:root {
  --color-bg: #000;
  --color-white: #fff;
  // アイコン関連
  --icon-size: 44px;
  --icon-inner-size: 24px;
  --icon-line-width: 1px;
  --icon-hamburger-margin: 7px;
}

// -- drawer
.c-drawer {
  background-color: var(--color-bg);
  width: 100vw;
  max-width: 100vw;
  .c-drawer__inner > ul.c-drawer__menu:first-child {
    position: relative;
    padding-top: var(--icon-size);
    &:before,
    &:after {
      content: "";
      display: inline-block;
      width: var(--icon-inner-size);
      height: var(--icon-line-width);
      background-color: var(--color-white);
      position: absolute;
      top: calc(var(--icon-size) / 2);
      left: calc(var(--icon-size) / 4);
    }
    &:before {
      transform: rotate(45deg);
    }
    &:after {
      transform: rotate(-45deg);
    }
  }
  &-close-zone {
    z-index: 100001;
    width: var(--icon-size);
    height: var(--icon-size);
    right: auto;
    bottom: auto;
  }
}
// -- hamburger btn
.c-hamburger-btn {
  background-color: var(--color-bg);
  padding: calc((var(--icon-size) - (var(--icon-line-width) * 3 + var(--icon-hamburger-margin) * 2)) / 2)
           calc((var(--icon-size) - var(--icon-inner-size)) / 2);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100001;
  &__label {
    display: none;
  }
  &__bar {
    height: var(--icon-line-width);
    background-color: var(--color-white);
    &:nth-of-type(2) {
      top: calc(var(--icon-line-width) + var(--icon-hamburger-margin));
    }
    &:nth-of-type(3) {
      top: calc(var(--icon-line-width) * 2 + var(--icon-hamburger-margin) * 2);
    }
  }
  &__bars {
    height: calc(var(--icon-line-width) * 3 + var(--icon-hamburger-margin) * 2);
    width: var(--icon-inner-size);
    margin: 0;
  }
}

※ドロワーのサブメニューがある時に未対応

> ul.c-drawer__menu:first-child として対応済み

アップデートに対応