Scss メディアクエリポイントの設定

$breakpoints: (
 'sm': 'screen and (max-width: 414px)',
 'md': 'screen and (max-width: 767px)',
 'lg': 'screen and (max-width: 999px)',
 'xl': 'screen and (max-width: 1199px)',
) !default;

//上で設定した変数をmq()で呼び出せるようにmixinを定義
@mixin mq($breakpoint: md) {
 @media #{map-get($breakpoints, $breakpoint)} {
   @content;
 }
}

//使うとき
    .txt{
        margin-left: 25.4%;
        
        @include mq(){ //引数を設定しない時は初期値のmd
            margin-left: 0%;
        }

        @include mq(lg){ //引数を設定する場合
            margin-left: 0%;
        }

    }