css grid

.gchild1 {

    display: grid;

    // grid-template-areas: "grr grl";

    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

    // grid-template-rows: 1fr;

    // column-gap: 1%;

    .grr {

      background: $color2;

    }

    .grl {

      //   margin-right: 10px;

      background: $color2;

    }

  }

  .grr {

    // grid-area: grr;

    background: $color3;

    padding: 10px;

    margin-right: 5px;

  }

  .grl {

    // grid-area: grl;

    background: $color3;

    padding: 10px;

    margin-right: 5px;

  }

}

<div class="grow">

            <div class="grl">

                <div class="gchild1">

                    <div class="grl">

                        <h5>1._) What is Lorem Ipsum?</h5>

                        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has

                            been the

                            industry's standard

                            dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled

                            it to

                            make a type specimen

                            book. It has survived not only five centuries</p>

                    </div>

                    <div class="grr">

                        <h5>2._) What is Lorem Ipsum?</h5>

                        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has

                            been the

                            industry's standard

                            dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled

                            it to

                            make a type specimen

                            book. It has survived not only five centuries</p>

                    </div>

                </div>

            </div>

            <div class="grr">

                <ul class="card-box-list-grid">

                    <li>

                        <h6>Dummy Title </h6><span>Dummy test goes here....</span>

                    </li>

                    <li>

                        <h6>Dummy Title </h6><span>Dummy test goes here....</span>

                    </li>

                    <li>

                        <h6>Dummy Title </h6><span>Dummy test goes here....</span>

                    </li>

                    <li>

                        <h6>Dummy Title </h6><span>Dummy test goes here....</span>

                    </li>

                    <li>

                        <h6>Dummy Title </h6><span>Dummy test goes here....</span>

                    </li>

                    <li>

                        <h6>Dummy Title </h6><span>Dummy test goes here....</span>

                    </li>

                </ul>

            </div>

        </div>