How can I make the last line of the layout of a flexible box with the "space around" not centered?

Question

I use flex box to position several identical divs and I set justify-content: space-around. This is great for all lines except the last. I would like for any elements in the last line to be even with the leftmost divs in the previous lines.

It looks like this:

and

And here is what I would like:

and

How can i achieve this?

I currently have this CSS:

#container {
  display: flex;
  flex-flow: row wrap;
  max-width: 400px;
  border: 1px solid red;
  justify-content: space-around
}

#container > div {
  border: 1px solid black;
  width: 110px;
}

With this HTML structure:

<div id="container">
  <div>Content</div>
  <div>Content</div>
  ...
  ...
</div>

Here's the script: https://jsfiddle.net/chrisshroba/q2mm9ccj/