How to link an image with a PDF?
You can create and use https://www.drupal.org/project/field_collection to have a new field containing an image field and a file field for your pdf.
You set the field in unlimited. 
Problem is that you might have to reupload every picture manually or write an update script that does the conversion for you.

Then for the colorbox popup with your button, have a look at https://www.drupal.org/project/entity_popup