.field {
  position: relative;
  display: flex;
  flex-direction: column;
  padding-bottom: 28px;
  margin-bottom: 8px;
  padding-bottom: 0;
  &&.m--100 {
    width: 100%;
    margin-right: 0;
  }


  &__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
  }


  &__label {
    display: none;
  }

  .input {
    @mixin input;
  }
  &__input{
    &.m--search {
      position: relative;
      &:before{
        content: '';
        width: 24px;
        height: 24px;
        top: 16px;
        left: 16px;
        position: absolute;
        background: svg-load('./assets/img/icon/search-icon.svg') no-repeat 100%;
      }
      .input{
        padding: 1rem 1.2rem 1rem 3rem;
        border: 1px solid var(--color-primary);
      }
    }
    &.m--hidden{
      display: none;
    }
  }
  &__checkbox {
    &-label{
      padding-left: 50px;
      display: flex;
      font-size: 1rem;
      color: var(--color-white-opacity);
      &:hover {
        cursor: url("./assets/img/icon/cursor.svg"), auto;
      }
      &:before{
        content: "";
        cursor: pointer;
        position: absolute;
        left: 0;
        text-indent: -9999px;
        width: 40px;
        height: 24px;
        background: var(--color-white-opacity);
        display: block;
        border-radius: 100px;
        transition: all .3s ease;
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }
      &:after{
        content: "";
        position: absolute;
        top: 3px;
        left: 3px;
        width: 18px;
        height: 18px;
        background: #fff;
        border-radius: 90px;
        transition: all .3s ease;
      }
    }
    &-input{
      display: none;
    }
    &-input:checked + &-label{
      &:before{
        background: var(--color-primary);
      }
      &:after{
        left: 37px;
        transform: translateX(-100%);
      }
    }
  }
  textarea{
    border-radius: 30px !important;
    resize: none;
    min-height: 80px;
    scrollbar-color: var(--color-black) var(--color-white-opacity);
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scroll-margin-right: 20px;
  }
  &__comment{
    font-size: 1rem;
    margin-bottom: 1rem;
  }
}