The WP database for media items stores the full URL of the media file. If the media file was uploaded while the site was non-SSL, then a non-SSL URL is stored in the database.
When you upgrade to SSL, new media has the SSL address. So you need a way to go through the database and change all instances of http://www.example.com to https://www.example.com .
You can do this directly to the database, or use a search and replace plugin to do it for you. I use the Better Search and Replace plugin, which has always worked well for me. The plugin will do the necessary changes to the entire database, including the posts database where data (including the full media file URL) is stored.
Added
Evidently, as evidenced by the first comment, my answer doesn’t match the question. Not sure why that happened, but… [sigh]
I’d like to see the URL that is in the generated page. I’d also like to see the htaccess file to see if that is related to the issue. Although the question shows the URL that works, it doesn’t detail the URL that is in the generated document. Or the URL that caused the 404.
I’d also be interested in the two URL in the wp-options table. And any wp-settings.php that are overriding those two wp-options URL.
You might try looking at the Network tab of the generated page (in the browser’s developer tools) to see if you can determine the ‘piece’ of the generated page that is causing the 404. Perhaps that URL is not being built correctly.
More information, as mentioned above, would be helpful.