Leave that in, you need it for a responsive site. That is not what is causing your problem, it is the way you are using flex.
You appear to have a number of media queries where you alter the
flex-basis property to varying percentage values at differing widths. It is this which controls the number of items that appear on a row.
On the smallest query:
max-width: 480px you set it to
100%, so yes, you should expect only one item per row at 100% width.
The other problem I have identified which will affect viewing on the smallest screens is that the items don't actually fit on the screen. It took a little while to spot the reason.
In the top section of each item you have two paragraphs with classes
venuenowrap. These both have the property
white-space: nowrap which is preventing the text from wrapping, keeping it on a single line which is too wide to fit on a mobile screen.
It makes no sense to me to prevent wrapping, particularly on a small screen.
flex-basis, the approach I prefer to use is to set it with a value in
em units. This negates the need for a number of queries to control item wrapping and lets them wrap naturally as available space permits similar to inline-blocks.