if one child than width 100% otherwise 50% using flex sass css

Question

I have an article page, so the design is like 2 group article images with 50% width, but when the only one child, then it should apply 100% width.

need help to get 50% when two child comes and 100% when one child come

i used flex on parent

design image:

.blog-body {
  padding-top: rem(50);
  ul{
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;

    list-style: none;
    li{
      position: relative;
      width: 50%;
      padding: 0 rem(15);
      margin-bottom: rem(68);
      .img-wrap{
        img{
          width: 100%;
          height: 100%;
        }
      }
      
    }
  }
 

 <section class="blog-group-sec">
        <div class="blog-contain">
            <div class="blog-wrap">
              
                <div class="blog-body">
                    <ul class="items">
                        <li class="item">
                            <div class="img-wrap">
                                <img src="https://via.placeholder.com/150

C/O https://placeholder.com/" alt="">
                            </div>
                        </li>
                          <li class="item">
                            <div class="img-wrap">
                                <img src="https://via.placeholder.com/150

C/O https://placeholder.com/" alt="">
                            </div>
                        </li>
                          <li class="item">
                            <div class="img-wrap">
                                <img src="https://via.placeholder.com/150

C/O https://placeholder.com/" alt="">
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </section>