Unfortunately you can't have your cake and eat it too. You will have to make trade-offs because smaller screens introduce new constraints to your previous design solution.
Something will have to adjust: whether it's your content layout or your UI. Here are the pros and cons of each:
Pros: You can maintain your current content by collapsing extra details until the user wants to read it.
- Users lose the ability to compare across multiple columns (though I'm not sure how they're currently doing that either in your current example.)
- If you hide content, you're taking content that's visible and making it invisible. How will users discover this content?
Pros: Allows you to maintain a solution designed for a different set of constraints.
Cons: Assuming this is browser-based…
- You'll most likely introduce some sort of side-to-side scrolling UI that would allow users to pan across the columns. Unfortunately this isn't a natural method of scrolling within a browser, which means you have to create signifiers to inform the user of this new functionality.
- Given your small screen real estate and the fact you want to create a easy reading environment, this also means that any signifiers you put in place may create a subpar experience.
There's no quick answer here. You'll have to explore different design solutions and test them with users to make sure they are able to access and read the information they need to make an informed decision.
Your best option most likely means re-imagining the content layout, utilizing clear and succinct section labels to inform the user of the content available to them. Wikipedia's mobile view provides an interesting use case here: