@use '../global/common' as global;

/* ------------------------------
 ユニット配置
------------------------------ */
@each $unit in global.$unit-types {
  @each $alignment in global.$alignments {
    .column-#{$unit}-#{$alignment}, // 古い書き方でも動作するように
    .align-#{$alignment} {
      display: flex;

      @if $alignment == left {
        & {
          justify-content: flex-start;
        }
      }

      @if $alignment == right {
        & {
          justify-content: flex-end;
        }
      }

      @if $alignment == center {
        & {
          justify-content: center;
        }
      }
    }
  }
}
