<section>
    <div class="box">
      <div class="flex pc-only">
        <p>PCサイズでのみ表示</p>
        <p>右側にはテキストを配置</p>
      </div><!-- /.flex -->
    </div><!-- / .box -->

    <div class="box">
      <div class="flex sp-only">
        <p>SPサイズでのみ表示</p>
        <p>右側にはテキストを配置</p>
      </div><!-- /.flex -->
    </div><!-- / .box -->
  </section>

.box{
  height: 50px;
}

.box:nth-of-type(1){
  background-color: #d4cc8f;
}
.box:nth-of-type(2){
  background-color: #caada7;
}

.flex{
  display: flex;
  gap: 20px;
}

.sp-only {
  display: none;
}

@media screen and (max-width: 768px) {
  .pc-only {
    display: none;
  }

  .sp-only {
    display: block;
  }
}