media query mixin scss/sass to avoid duplication

gistfile1.txt

// variables.scss file
$breakpoints:(
  sm: 640px,
  md: 1200px,
  lg: 1400px,
  xl: 1900px
);


// mixins.scss file
@mixin min-width($breakpoint){
  @media only screen and (min-width:#{map-get($breakpoints, $breakpoint)}) {
    @content;
  }
}


// module.scss file
.innerWrap {
  display: flex;
  align-items: center;
  &:first-child {
    margin-right: 20px;
    @include min-width(sm){
      margin-right: 0;
    }
  }
  @include min-width(sm){
    flex: 1;
  }
}