How to change sass variables in Nuxt3?

[yokoyama-kenta]

I wanna change breakpoints in v-col.

I loaded scss in my nuxt.config.ts.

export default defineNuxtConfig({
  ...,
  css: ['@/assets/styles/index.scss'],

and wrote sass variables in index.scss.

@import 'vuetify/lib/styles/main.sass';

$grid-breakpoints: map-merge(
  $grid-breakpoints,
  (
    xs: 0,
    sm: 767px,
    md: 1200px,
    lg: 9999px,
    xl: 9999px,
  )
);

but, v-col's breakpoint like 'sm' is not changed.
how do I change? thank you.