IGrouping Model not binding

Question

I have the following classes as my viewmodel. Due to requirements, I have to use IGrouping instead of a normal IList or IEnumerable. I have to group ExtraCostOption according to the Types.

I have attached image of my view that will explain the requirement.

My problem is that the FirstCostOption do not get populated at all but all the other values are populated. Could anyone point me to a direction?

public class ExtraCostOption
{        
  public string Name { get; set; }
  public string Description { get; set; }
  public bool IsSelected { get; set; }
  public OptionCategory Category { get; set; }
  public string SourceId {get;set;}
}
public class Product
{
  public string Id {get;set;}
  public string Cost {get;set;}
  public List<IGrouping<string, ExtraCostOption>> FirstCostOption { get; set; }
}

My razor code is :

        <div class="sm card content">
        @if (Model.FirstCostOption .Any())
        {
            foreach (var optGroup in Model.FirstCostOption)
            {
                <h5>@optGroup.Key</h5>
                for (int i = 0; i < optGroup.ToList().Count; i++)
                {
                    <div class="card">
                        @Html.HiddenFor(m => optGroup.ToList()[i].SourceId)
                        <label class="control checkbox">
                            @Html.CheckBoxFor(m => optGroup.ToList()[i].IsSelected)
                            <span class="control-indicator"></span>
                            <span>
                                @optGroup.ToList()[i].Name
                            </span>
                        </label>
                    </div>  
                }
            }
        }
    </div>

My controller code looks like this:

    [ValidateAntiForgeryToken]
    [System.Web.Mvc.HttpPost]
    public async Task<ActionResult> Process([FromBody]Product viewModel)