余白要素のMAP値をメディアクエリで定義したい

Question

SCSS初心者です。

前提

 /global
  -mixin.scss
  -variables.scss

上記の階層のvariables.scssでmarginのMAP値を定義し、
mixinでメディアクエリのmixinを定義しています。

marginのMAP値をさらにメディアクエリで定義したいのですが、うまくいきません。

やりたいこと

marginのMAP値を使用した際に、勝手にスマホ版のmarginになってほしいです。
分かりにくくてすみません。

margin: map-get(g.$site_mp,40) map-get(g.$site_mp,20);

↓
PC
margin: 40px 20px;

スマホ
margin: 20px 10px;

になってほしいです。

.main{
margin: map-get(g.$site_mp,40) map-get(g.$site_mp,20);

@include g.mq(md){
margin: map-get(g.$site_mp,20) map-get(g.$site_mp,10);
}
}

のようにすれば当然きちんとなるのですが、いちいちこれをするのは面倒だなと思いました

実装したコード

site_mp: (
	0: 0,
	5: 5px,
	10: 10px,
	20: 20px,
	30: 30px,
	40: 40px,
	50: 50px,
	60: 60px,
	70: 70px,
	80: 80px,
	90: 90px,
	100:100px,
);

@include g.mq(md){
	$site_mp: (
		10: 5px,
		20: 10px,
		30: 10px,
		40: 20px,
		50: 20px,
		60: 20px,
				);
}

上記の定義ではコンパイルエラーは出ないのですが、メディアクエリは追加されていませんでした。
助言をいただけると幸いです。

Comments

[heyhey...]

すみませんよく見てみると
_variables.scssの冒頭で指定した

@use "." as g;
でエラーが出ていました。
同じ階層にあるmixinを読み込みたいのですが上記コードではNGでしょうか。

エラー内容

Compilation Error
Error: Module loop: this module is already being loaded.
┌──> c:\Users\●\●\●\●\sass\global\_variables.scss
1 │ @use "." as g;
│ ^^^^^^^^^^^^^ new load