Адаптация только CSS-правила

mixin-responsive-output.css

.class1 {
  padding: #333;
}
@media (min-width: 320px) {
  .class1 {
    padding: 10px;
  }
}
@media (min-width: 480px) {
  .class1 {
    padding: 15px;
  }
}
@media (min-width: 640px) {
  .class1 {
    padding: 15px;
  }
}
@media (min-width: 768px) {
  .class1 {
    padding: 20px;
  }
}

mixin-responsive.scss

// ----
// Sass (v3.4.21)
// Compass (v1.0.3)
// ----

@mixin responsive($properties,$defaultValue, $responsiveValues){
  &{
    @each $property in $properties{
      #{$property}:$defaultValue;
    }
  }
  @each $media, $value in $responsiveValues{
    @media #{$media}{
      &{
        @each $property in $properties{
          #{$property}:$value;
        }
      }
    }
  }
}

$w0:"(min-width:0px)";
$w320:"(min-width:320px)";
$w480:"(min-width:480px)";
$w640:"(min-width:640px)";
$w768:"(min-width:768px)";

.class1{
  @include responsive("padding",#333,($w320:10px, $w480:15px, $w640:15px, $w768:20px, ));
}