.content {
  padding-top: 70px;
}
       /* body { font-family: Arial, sans-serif; margin: 20px; }*/
        .article-list { 
       		 width: 80%;
       		  margin: 20px auto; 
       		 display: flex;
       		 flex-direction: column; /* タイトル→本文の順で縦方向に配置 */
 			 flex: 1;                /* 画像の余白を除いた残り幅を使うイメージ */
        }
        .article-item {
            display: flex;
            align-items: center;
            padding: 10px;
            border-bottom: 1px solid #ddd;
            transition: background-color 0.3s;
        }
        .article-item:hover { background-color: #f4f4f4; }
        .article-item img {
            width: 150px;
            height: 100px;
            object-fit: cover; /* 必要に応じてトリミング */
            margin-right: 20px;
            border-radius: 10px; /* 角を少し丸くする（オプション） */
        }
        .article-text { flex: 1; }
        .article-title { 
        	font-size: 18px; 
      	  font-weight: bold;
      	  margin-bottom: 5px; 
      	   margin-right: 5px;  /* タイトルと本文の間隔を少しあける */
      	    }
        .article-body { color: #555; }