タイルの場合のスマホリストにつきまして

できるかできないかで言えば、答えは「できる」なんですが、やるとすると結構面倒臭い感じになるんじゃなかろうかと思います。

もし僕が同じことを思って実現するなら、レイアウトにflex使って更に中身になる各ブロックをこれもまたflexで組み立てます。画像や記事の抜粋とうの並びはorderで変えられるので、それらをメディアクエリで各端末に合うようにレイアウトでしょうか。

大まかに言うと、

#list {
  display: flex;
  flex-flow: row wrap;
  justify-content: sp-between;
}

.entry {
  flex: 1 30%;
  display: flex;
  flex-flow: row wrap;
  margin-right: 10px;
}

.entry:nth-child(3n) {
  margin-right: 0;
}

こんな感じで3列になるんじゃなかろうかと思います。.entryのflex: 1 30%の30%を変更すれば4列でも2列でも作れます。.entryの中に再度display:flexが入っているのは、.entryの中身をflex表示するためです。
後は高さをそろえたり、orderで場所変えたりです。

これを実現するにあたって、もしかすると元々のmobile.cssやresponsive.css等の設定が邪魔になる場合もあります。そういう場合は、一旦全解除しても良いのですが、それをすると他に不具合も出るので十分なテストが必要になるだろうと思います。

諸々の設定ができたら、今度はスマホ向けに設定するわけですけれども、スマホの場合、メディアクエリで

@media screen and (max-width: 50em){
  .entry {
    flex: 1 100%;
  }
  .entry, .entry:nth-child(3n){
    margin-right: 0; /*ここはデザインによりけり*/
  }
}

で、一応横100%表示できるので、後はデザインで色々します。サムネイルの位置やコンテンツの位置等はorderで変えられます。
@media screen and (max-width: 50em){} の50emは、16px表記で、800px相当です。ここは直接pxで設定しても良い部分ですが、何文字分と言う設定のほうが柔軟になるかとも思います。まぁお好きな感じで。

だいたいこれぐらいで骨組みはできましたが、一番面倒なのはこれら(.entry等)の中身の設定です。元々と同じように設定するとすれば、flexが邪魔になったり、またオリジナルのcssの設定が邪魔したりもあるでしょう。ここらをクリアしないといけないのでとても面倒な内容になるかと思います。

こういう場合は本来、それぞれのスタイルを用意しておいてjavascriptで、読み込むcssを変更するのが最も簡単なのですが、それでも別々に用意しないといけないばかりか、3列表示がSimplicityに組み込まれているので(ライブラリ(plugin)を読んでるだけかとは思うんですけども)、とてもとても面倒です。

phpで端末の画面幅が調べられたらcssを変更するのなんかは別にどうってことない話なんですけどね。
たぶん、わいひらさんも、それを実現するならメディアクエリ等でそれぞれの端末に合わせたスタイルをしてくださいと言うことを言うんじゃないかなぁと思います。

またflexはまだ完璧に固まった仕様ではないのでベンダープレフィックスが必要です。これがまた面倒臭いので、自動でプレフィックスを付けてくれる環境をまず構築するのが良いのではないかなぁと思います。
node.jsを導入したり、BracketsやATOMあたりのテキストエディターなら、プラグインであったようにも思います。

Hidekichiさんありがとうございます。
せっかく色々教えて頂いたのですが、理解力不足で正直分かりません…orz

ただ、スマホのリスト表示は3列表示などを希望している訳ではなく、PCの表示時だけタイル3列表示にしたいと思っています。

説明不足でしたら申し訳ないのですが、スマホの一覧リスト表示はカスタマイザーで「サムネイルカード（デフォルト）」を選んだ時ののままでいいのですが、

「タイル3列」や「タイル3列 画像縦横比保存（要再生成）」を選択すると、スマホの一覧リスト表示もスマホ横幅のアイキャッチ画像、その下にタイトル、時間など、という表示スタイルに変更になってしまうようですので

スマホの一覧リスト表示はデフォルトそのままで、PCの一覧リスト表示だけ「タイル3列」になってくれないかと思い質問させていただきました。

分かりにくくてすみません…

>>さんぼさん

モダンブラウザのweb開発環境で先ほどレスしたcssをブラウザ上だけでも適用してもらえれば理解してもらえると思うんですが、基本的にはデフォルトのサムネイルありのリストを3列表示にする方法です。つまり、3列にするのにあたってjavascript(jQuery)を利用しない方法です。これはカスタマイザーから3列設定にした場合、Simplicityに組み込まれたライブラリ(?)が3列にしているのですが、僕が書いたものは基本デフォルトのリスト表示を3列にします。

なので、メディアクエリで端末ごとのスタイルを作れば、最初の質問の通りに動作させることができます。
メディアクエリの部分は横幅800px(50em)までの端末の場合、横100%表示、つまりはデフォルトにさせるものです。

カスタマイザーで3列表記にした場合は、そのリストアイテムの位置を計算で出しているので、色々とレスポンシブにするのは難しいのですが、flex-boxを利用すれば、レスポンシブで表示することができます。

一番の問題点は、僕の方法の場合、display: flexが効いているので、元々のcssの設定では対応できないだろうという点です。つまり、新たにPC用、モバイル用とcssを作るぐらいの労力が必要ということです。
flex-boxは、orderというプロパティで、中身の表示順序を変えることができます。
これによって、PCとモバイルで表示順序を変えることができるわけです。サムネイルを抜粋の後に入れたりもできたりします。

>PCの表示時だけタイル3列表示にしたいと思っています。

これだったら、最初のレスの内容を適用すれば、リストの中身はごちゃっとしていると思いますけど、3列になるはずです。で、メディアクエリでスマホ(モバイル)の時にflexを打ち消すプロパティを書けば、いつもの表示になると思います。

わいひらさん、Hidekichiさんありがとうございます。

まさにド素人的に簡単に考えていましたが、相当大変な話なのですね…

しかしチャレンジしてみたい気分ではあるので、取り敢えずローカル環境を構築してそちらで試してみようかと考えています。

Hidekichiさん、いつも詳しい解説ありがとうございます！