// ------------------------------
// 変形
// ------------------------------

// 拡大・縮小
@mixin scale($ratio){
  -webkit-transform: scale($ratio);
  -ms-transform: scale($ratio);
  transform: scale($ratio);
}
// 表示位置を移動
@mixin translate($x, $y){
  -webkit-transform: translate($x, $y);
  -ms-transform: translate($x, $y);
  transform: translate($x, $y);
}
// Z方向に表示位置を移動
@mixin translateZ($z){
  -webkit-transform: translateZ($z);
  -ms-transform: translateZ($z);
  transform: translateZ($z);
}
// X方向とY方向とZ方向の距離で3D移動
@mixin translate3d($x, $y, $z){
  -webkit-transform: translate3d($x, $y, $z);
  transform: translate3d($x, $y, $z);
}
// 傾斜変形
@mixin skew($x, $y){
  -webkit-transform: skew($x, $y);
  -ms-transform: skewX($x) skewY($y);
  transform: skew($x, $y);
}
// 3D変形の奥行きの深さ
@mixin perspective($perspective){
  -webkit-perspective: $perspective;
  -moz-perspective: $perspective;
  perspective: $perspective;
}
// 遠近投影の基点となる位置を指定
@mixin perspective-origin($perspective){
  -webkit-perspective-origin: $perspective;
  -moz-perspective-origin: $perspective;
  perspective-origin: $perspective;
}
// 要素を変形させる際の基準点を指定する
@mixin transform-origin($origin){
  -webkit-transform-origin: $origin;
  -moz-transform-origin: $origin;
  transform-origin: $origin;
}
