Make Product Pictures Larger in Liquid

I am currently using the "Debut" theme in Shopify. I'm looking to alter the size of product pictures and make them larger. Currently the pictures are being sized at 276x345 and I'm looking to get them to around 367x550.

Currently the page is laid out to have three products displayed across the page on a full size browser (not mobile).

Collection.liquid currently has the following:

  {% case section.settings.grid %}
{% when 2 %}
  {%- assign max_height = 530 -%}
  {%- assign grid_item_width = 'large-up--one-half' -%}
{% when 3 %}
  {%- assign max_height = 345 -%}
  {%- assign grid_item_width = 'small--one-half large-up--two-third' -%}
{% when 4 %}
  {%- assign max_height = 250 -%}
  {%- assign grid_item_width = 'small--one-half medium-up--one-quarter' -%}
{% when 5 %}
  {%- assign max_height = 195 -%}
  {%- assign grid_item_width = 'small--one-half medium-up--one-fifth'     -%}
{% endcase %}

When inspecting in the browser, this is the CSS returned

  @media screen and (min-width: 750px) { 
    #ProductCardImage-collection-template-1487328739386 {
      max-width: 276.0px;
      max-height: 345px;
    }
    #ProductCardImageWrapper-collection-template-1487328739386 {
      max-width: 276.0px;
      max-height: 345px;
    }
   } 



    @media screen and (max-width: 749px) {
      #ProductCardImage-collection-template-1487328739386 {
        max-width: 600.0px;
        max-height: 750px;
      }
      #ProductCardImageWrapper-collection-template-1487328739386 {
        max-width: 600.0px;
      }
    }

What is causing this max 276px?

How can I alter the code to make the pictures load and display in the bigger size?

The max-width is calculated using this:

{% if image.aspect_ratio < 1.0 %}
    {% assign maximum_width = height | times: image.aspect_ratio %}
    {% if image.height <= height %}
      {% assign maximum_height = image.height %}
      {% assign maximum_width = image.width %}
    {% else %}
      {% assign maximum_height = height %}
    {% endif %}
{% elsif image.aspect_ratio < container_aspect_ratio %}
    {% assign maximum_height = height | divided_by: image.aspect_ratio %}
    {% if image.height <= height %}
      {% assign maximum_height = image.height %}
      {% assign maximum_width = image.width %}
    {% else %}
      {% assign maximum_height = height %}
      {% assign maximum_width = height | times: image.aspect_ratio %}
    {% endif %}
{% else %}
    {% assign maximum_height = height | divided_by: image.aspect_ratio %}
    {% if image.width <= width %}
      {% assign maximum_height = image.height %}
      {% assign maximum_width = image.width %}
    {% else %}
      {% assign maximum_width = width %}
      {% assign maximum_height = maximum_width | divided_by: image.aspect_ratio %}
    {% endif %}
{% endif %}

So depending on your different aspect ratio you get different calculated values for the max-width. You will need to update this logic or exclude it altogether from your code.