サムネイル画像は、通常巻末位置で表示さfれる範囲ではスマートフォン画面で見れば
自動でサイズ縮小するのですが、サイドバーに移動すると、menu枠内に収まることが
影響してCSS指定が遮断され不作動となります

やはり、スマートフォンの小画面なら画像は縮小しない、でも記事列は狭められるという
作用で読みにくくなりますね

そこでどうするか？ですが、段階の表示法という手段を用います

パソコン画面では、初期指定サイズ

スマートフォンでは、小さく指定したサイズで表示するということですね

レスポンシブで自動縮小させればいいじゃんとの意見もあるかと思いますが、
それでは画像が小さくなりすぎる...コメ粒ほどにです

ですので、固定数値でサイズを指定します

シリウスのスマートフォン指定サイズ、６４０のサイズになったら画像を小さくする方法を
とります

とりあえず通常サイズのＰCでは、150pxサイズ

やや画面が小さくなる899px（iPad）では、100pxサイズ
（ここは自己判断で取り入れてください）

次に640pxからのスマホサイズでは、画像サイズを80pxにしてみました

数値は、各デバイスで画像サイズを確認後調整してください

スタイルシート以下位置確認

ブログモード
==================================================
*/
.blog {
border-bottom-color: #e6e6e6;
border-bottom-style: solid;
border-bottom-width: 1px;
margin-bottom: 15px;
overflow: hidden;
padding: 10px;
}
.blog .thumb {
float: left;
margin-right: 15px;
}
.blog .thumb img { width: 150px;}

ここからを追加しました（iPad）

@media screen and (max-width: 899px) {
.blog .thumb img { width: 100px;}
}

ここはスマートフォン
@media screen and (max-width: 640px) {
.blog .thumb img { width: 80px;}
}

ここまで..指定終了

トップページ
サイドバーカスタマイズまとめ
トップページ

関連ページ

2カラムを3カラム？風にサイドバーをカスタマイズしてみました

シリウスレスポンシブサイトは、2カラムは備えございますが、3カラムがございませんね。で、試しにサイドバーをカスタマイズして3カラムにできるかに挑戦してみたのです

サイドバーのメニューリスト区切りラインカラー変更

シリウスレスポンシブ2カラムサイドバーのメニューリストはデフォルトカラーのラインで区切られておりますが、好みの色替えもできます

更新履歴をサイドバーに位置替え表示する方法

シリウスサイトのトップページに表示される更新履歴は、巻末に位置するためスクロールしても行きつかない事情もございますのでサイドバーに位置替えして認識しやすくする..という方法

サイドバーメニューをブログイメージにカスタマイズ

シリウスレスポンシブ2カラムサイトのサイドバーメニューをサムネイル込みでブログレイアウトにカスタマイズする方法

サイドバーに移動した更新履歴の記事フォントサイズおよびカラー変更

サイドバーに移動した更新履歴の記事、フォントサイズおよびカラー変更は、デフォルトのCSS項目を改行してもスマホでは反映しないという事情がありますが、対処法を追記しております