.container {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 4px;

  &.grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

.item {
  &.grid {
    width: 162px;
    flex-direction: column;
    gap: 8px;
    height: 76px;
  }
}

@media (max-width: 380px) {
  .item {
    &.grid {
      width: 142px;
    }
  }
}

@media (max-width: 340px) {
  .item {
    &.grid {
      width: 102px;
    }
  }
}
