How to hide col in mobile view

Here is my code in ionic v4

<ion-row class="b-1 mt-2">
    <ion-col size="1" class="center br-1" id="sno">
        <span class="left">S.No</span>
        <ion-icon class="float-right" name="arrow-dropdown"></ion-icon>
    </ion-col>
    <ion-col size="3" class="center br-1" id="name">
        <span>Name</span>
        <ion-icon name="arrow-dropdown" class="float-right"></ion-icon>
    </ion-col>
    <ion-col size="2" class="br-1" name="lastpurchasal">
        <span class="left">Last Purchasal</span>
        <ion-icon name="arrow-dropdown" class="float-right"></ion-icon>
    </ion-col>
    <ion-col size="2" class="br-1" id="phonenumber">
        <span>Phone Number</span>
        <ion-icon name="arrow-dropdown" class="float-right"></ion-icon>
    </ion-col>
    <ion-col size="2" class="center br-1" id="place">
        <span>Place</span>
        <ion-icon name="arrow-dropdown" class="float-right"></ion-icon>

    </ion-col>
    <ion-col size="2" class="center" id="amount">
        <span>Amount</span>
        <ion-icon name="arrow-dropdown" class="float-right"></ion-icon>
    </ion-col>
</ion-row>

How to hide col in mobile view here I want to hide the cols “s.no” and “last purchasal” col and the expected output in mobile view is in below image