=dotted-line($color: rgba(#000, 1.0), $stripe: null)
  $stripe-width: if(length($stripe) >= 1, nth($stripe, 1), 1px)
  $gatter-width: if(length($stripe) >= 2, nth($stripe, 2), 4px)
  $size: if(length($stripe) >= 3, nth($stripe, 3), 1px)
  +background-image(linear-gradient(left, color-stops($color, $color (strip_unit($stripe-width)/(strip_unit($stripe-width) + strip_unit($gatter-width)))*100%, transparent (strip_unit($stripe-width)/(strip_unit($stripe-width) + strip_unit($gatter-width)))*100%, transparent 100%)))
  +background-size(($stripe-width + $gatter-width) ($stripe-width + $gatter-width))
  +rem('height', $size)

// http://codepen.io/anon/pen/tGhLp を改造
=striped-line($stripe-color: #000000, $size: 20px)
  @if length($stripe-color) == 1
    +background-image(linear-gradient(-45deg, $stripe-color 25%, transparent 25%, transparent 50%, $stripe-color 50%, $stripe-color 75%, transparent 75%, transparent))
  @else
    $mix-stripe-color: darken(nth($stripe-color, 1), nth($stripe-color, 2))
    +background-image(linear-gradient(-45deg, $mix-stripe-color 25%, transparent 25%, transparent 50%, $mix-stripe-color 50%, $mix-stripe-color 75%, transparent 75%, transparent))
    background-color: $background-color
  +background-size($size $size)
  +rem('height', $size)