.hy-main {
  display: flex;
  margin: var(--gutter-mobile) auto;
  max-width: $fullhd;
  padding: 0 var(--gutter-mobile) var(--gutter-mobile);

  @include breakpoint($medium) {
    padding: var(--gutter-mobile) 0;
  }

  &.with-sidebar {
    .layout-content {
      @include breakpoint($medium) {
        order: 2;
        padding: var(--gutter-mobile) var(--gutter-medium);
      }
    }
    .layout-sidebar-first {
      @include breakpoint($medium) {
        border-right: 2px dotted var(--grayscale-medium);
        max-width: 320px;
        order: 1;
        padding: var(--gutter-mobile);
        width: 100%;
      }
    }
  }
}