<div class="table-rwd table-rwd-2cols">
     <div class="table-rwd-cell table-rwd-cell-header">
         <h3>Title1 健フサツ区図イメソフ</h3>
     </div>
     <div class="table-rwd-cell table-rwd-cell-body">
         <p class="mb-0 text-s8">Content1 健フサツ区図イメソフ塾遣ユウ的軍んぶド氏稿みひス須口79切島あ集公真は用今ヤワ般据へドぼ聴59領ニクロ棄6急ゃょみ投雑にがぽ向連午達めをた。</p>
     </div>
   <div class="table-rwd-cell table-rwd-cell-header">
         <h3>Title2 健フサツ区図イメソフ</h3>
     </div>
     <div class="table-rwd-cell table-rwd-cell-body">
         <p class="mb-0 text-s8">Content2 健フサツ区図イメソフ塾遣ユウ的軍んぶド氏稿みひス須口79切島あ集公真は用今ヤワ般据へドぼ聴59領ニクロ棄6急ゃょみ投雑にがぽ向連午達めをた。</p>
     </div>
</div>

.table-rwd{
  display: flex;
  flex-wrap: wrap;
  
  .table-rwd-cell{
      box-sizing: border-box;
      border: solid 1px gray;
      padding: 0.8em 1.2em;
  }
}

.table-rwd-2cols{
  .table-rwd-cell{
    width: 50%;
  }  
}

@media all and  (max-width: 768px) { 
    .table-rwd {
        display: block;
        .table-rwd-cell {
            width: 100%;
        }
        .table-rwd-cell-header {
            background-color: rgba(0, 100, 120, 0.3);
            cursor: pointer;
            position: relative;
          
            &.active{
                &:after{
                    transform: rotate(180deg)
                }
            }
          
            &:before, &:after{
                content: '';
                position: absolute;
                display: block;
                width: 12px;
                height: 2px;
                background-color: rgba(0,0,0,0.9);
                right: 10px;
                top: 50%;
                transition: 0.2s;
                transform: rotate(0deg)
            }
            &:after{
                transform: rotate(90deg)                      
            }
        }
        .table-rwd-cell-body{
            display: none;
        }
    }
}
View Compiled
$(function() {
    $('.table-rwd-cell-header').click(function() {
        $(this).nextAll('.table-rwd-cell-body').first().slideToggle();
        $(this).toggleClass('active');
    });
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js