Two-level menu with two columns?

Question

css

There is a menu-list of two columns. Two columns are displayed using the column-count attribute.
When you hover over an element from the list, the second level of the menu pops up on the right.
Therefore, if we hover over an element from the first column, then the second level overlaps the elements of the second column.
How can I make the second level appear on the left when hovering over the elements from the first column, and appear on the right when hovering over the elements of the second column?