@charset "UTF-8";
/* scss/_style_3col.scss */
/* ============================================ */
.grid {
  display: grid;
  grid-gap: var(--gap-xs, 1px);
  grid-auto-flow: var(--flow-xs, row);
  grid-auto-columns: var(--auto-cols-xs, auto);
  grid-auto-rows: var(--auto-rows-xs, auto);
  grid-template-columns: var(--template-cols-xs, repeat(var(--cols-xs, 1), var(--cols-size-xs, 1fr)));
  grid-template-rows: var(--template-rows-xs, none);
  justify-content: var(--jc-xs, space-evenly);
  justify-items: var(--ji-xs, stretch);
  align-content: var(--ac-xs, center);
  align-items: var(--ai-xs, stretch);
}
.cols-all1 {
  --cols-xs: 1;
  --cols-sm: 1;
  --cols-md: 1;
  --cols-lg: 1;
  --cols-xl: 1;
}
.cols-all2 {
  --cols-xs: 2;
  --cols-sm: 2;
  --cols-md: 2;
  --cols-lg: 2;
  --cols-xl: 2;
}
.cols-all3 {
  --cols-xs: 3;
  --cols-sm: 3;
  --cols-md: 3;
  --cols-lg: 3;
  --cols-xl: 3;
}
.cols-all4 {
  --cols-xs: 4;
  --cols-sm: 4;
  --cols-md: 4;
  --cols-lg: 4;
  --cols-xl: 4;
}
.cols-all5 {
  --cols-xs: 5;
  --cols-sm: 5;
  --cols-md: 5;
  --cols-lg: 5;
  --cols-xl: 5;
}
.cols-xs1_all2 {
  --cols-xs: 1;
  --cols-sm: 2;
  --cols-md: 2;
  --cols-lg: 2;
  --cols-xl: 2;
}
.cols-xs1_all3 {
  --cols-xs: 1;
  --cols-sm: 3;
  --cols-md: 3;
  --cols-lg: 3;
  --cols-xl: 3;
}
.cols-xs1_all4 {
  --cols-xs: 1;
  --cols-sm: 4;
  --cols-md: 4;
  --cols-lg: 4;
  --cols-xl: 4;
}
.cols-xs1_all5 {
  --cols-xs: 1;
  --cols-sm: 5;
  --cols-md: 5;
  --cols-lg: 5;
  --cols-xl: 5;
}
.cols-xs2_all1 {
  --cols-xs: 2;
  --cols-sm: 1;
  --cols-md: 1;
  --cols-lg: 1;
  --cols-xl: 1;
}
.cols-xs3_all1 {
  --cols-xs: 3;
  --cols-sm: 1;
  --cols-md: 1;
  --cols-lg: 1;
  --cols-xl: 1;
}
.cols-xs4_all1 {
  --cols-xs: 4;
  --cols-sm: 1;
  --cols-md: 1;
  --cols-lg: 1;
  --cols-xl: 1;
}
.cols-xs5_all1 {
  --cols-xs: 5;
  --cols-sm: 1;
  --cols-md: 1;
  --cols-lg: 1;
  --cols-xl: 1;
}

@media (min-width: 544px) {
  .grid {
    grid-gap: var(--gap-sm, 1px);
    grid-auto-flow: var(--flow-sm, row);
    grid-auto-columns: var(--auto-cols-sm, auto);
    grid-auto-rows: var(--auto-rows-sm, auto);
    grid-template-columns: var(--template-cols-sm, repeat(var(--cols-sm, 2), var(--cols-size-sm, 1fr)));
    grid-template-rows: var(--template-rows-sm, none);
    justify-content: var(--jc-sm, space-evenly);
    justify-items: var(--ji-sm, stretch);
    align-content: var(--ac-sm, center);
    align-items: var(--ai-sm, stretch);
  }
}
@media (min-width: 768px) {
  .grid {
    grid-gap: var(--gap-md, 1px);
    grid-auto-flow: var(--flow-md, row);
    grid-auto-columns: var(--auto-cols-md, auto);
    grid-auto-rows: var(--auto-rows-md, auto);
    grid-template-columns: var(--template-cols-md, repeat(var(--cols-md, 2), var(--cols-size-md, 1fr)));
    grid-template-rows: var(--template-rows-md, none);
    justify-content: var(--jc-md, space-evenly);
    justify-items: var(--ji-md, stretch);
    align-content: var(--ac-md, center);
    align-items: var(--ai-md, stretch);
  }
}
@media (min-width: 992px) {
  .grid {
    grid-gap: var(--gap-lg, 1px);
    grid-auto-flow: var(--flow-lg, row);
    grid-auto-columns: var(--auto-cols-lg, auto);
    grid-auto-rows: var(--auto-rows-lg, auto);
    grid-template-columns: var(--template-cols-lg, repeat(var(--cols-lg, 4), var(--cols-size-lg, 1fr)));
    grid-template-rows: var(--template-rows-lg, none);
    justify-content: var(--jc-lg, space-evenly);
    justify-items: var(--ji-lg, stretch);
    align-content: var(--ac-lg, center);
    align-items: var(--ai-lg, stretch);
  }
}
@media (min-width: 1200px) {
  .grid {
    grid-gap: var(--gap-xl, 1px);
    grid-auto-flow: var(--flow-xl, row);
    grid-auto-columns: var(--auto-cols-xl, auto);
    grid-auto-rows: var(--auto-rows-xl, auto);
    grid-template-columns: var(--template-cols-xl, repeat(var(--cols-xl, 4), var(--cols-size-xl, 1fr)));
    grid-template-rows: var(--template-rows-xl, none);
    justify-content: var(--jc-xl, space-evenly);
    justify-items: var(--ji-xl, stretch);
    align-content: var(--ac-xl, center);
    align-items: var(--ai-xl, stretch);
  }
}
.grid.is-inline {
  display: inline-grid;
}
.grid > * {
  min-width: 0px;
  max-width: 100%;
  min-height: 0px;
  grid-column: var(--col-xs, auto);
  grid-row: var(--row-xs, auto);
  justify-self: var(--js-xs, auto);
  align-self: var(--as-xs, auto);
}
@media (min-width: 544px) {
  .grid > * {
    grid-column: var(--col-sm, auto);
    grid-row: var(--row-sm, auto);
    justify-self: var(--js-sm, auto);
    align-self: var(--as-sm, auto);
  }
}
@media (min-width: 768px) {
  .grid > * {
    grid-column: var(--col-md, auto);
    grid-row: var(--row-md, auto);
    justify-self: var(--js-md, auto);
    align-self: var(--as-md, auto);
  }
}
@media (min-width: 992px) {
  .grid > * {
    grid-column: var(--col-lg, auto);
    grid-row: var(--row-lg, auto);
    justify-self: var(--js-lg, auto);
    align-self: var(--as-lg, auto);
  }
}
@media (min-width: 1200px) {
  .grid > * {
    grid-column: var(--col-xl, auto);
    grid-row: var(--row-xl, auto);
    justify-self: var(--js-xl, auto);
    align-self: var(--as-xl, auto);
  }
}