スタイルガイド

mixins

elevation

.item {
  @include elevation(2);
  @include elevation-transition;

  &:hover,
  &:focus {
    @include elevation(4);
  }

  &:active {
    @include elevation(8);
  }
}

https://material.io/guidelines/material-design/elevation-shadows.html

floor

@include floor-decimal($number, $digits: 4);

1.234567 => 1.2345

font

@include fsize-h1;
@include fsize-h2;
@include fsize-h3;
@include fsize-h4;
@include fsize-h5;
@include fsize-h6;


@include fsize($size-pc: 14, $size-tab: false, $size-sp: false);

@include fsize-vmin($fsize: 14, $screen: 375);

grid

grid ($className:'.cols', $col:6, $allW:940, $g:30, $sp:false)

@include grid('.c-summary__item', 6, $screen-pc-max, 24);

mb

@include mb-small($multiplication:1);
@include mb-medium($multiplication:1);
@include mb-large($multiplication:1);

mediaqueries

@include media-min;
@include media-sp-min;
@include media-sp-max;
@include media-sp-only;

@include media-tab-min;
@include media-tab-max;
@include media-tab-only;

@include media-pc-min;
@include media-pc-max;
@include media-pc-only;

@include media-lg-min;
@include media-lg-max;
@include media-lg-only;

@include media-max;


@include media($query);