該当ページは固定ページでなくカテゴリーページです。
なので「.page」は必要ありません。

カテゴリーページにカスタムCSSはないはずですが、どこか別のページに適用したのではないでしょうか…？

コード自体は合っているので、適切に設定すれば問題ないはずです。

スマホ表示は1列のままでよく、できればPCとタブレットのみ2列にしたい

については、

@media screen and (min-width: 480px){
  /*ここにコード*/
}

のようにメディアクエリで囲めばウィンドウ幅が480px以上の場合のみ適用できます。

はるさま

早速お返事をありがとうございます。

あれこれ触っているうちに頭の中が混乱してしまっていたようで、確かにご指摘の通り問題のページはカテゴリーページでした。

では、このカテゴリーページに適用させるにはどこにコードを入れればよいのでしょうか？初心者な質問ですみません。

HAREさん

はるさんは少し離れていらっしゃるようなので。

通常CSSは、子テーマのスタイルシート(style.css)が、追加CSSに記載します。

今までは別なところへ記載なさっていたのでしょうか。

前略、HARE さん

実際に試しておらず、適当に書いただけなので、間違っているかもしれません。

.archive.category.category-korea-travel.category-2 .new-entry-cards.widget-entry-cards.no-icon.cf.card-large-image.large-thumb {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

/*クリアフィックスのアイテムを消す*/
.archive.category.category-korea-travel.category-2 .new-entry-cards.widget-entry-cards.no-icon.cf.card-large-image.large-thumb::after {
   content: none;
}

.archive.category.category-korea-travel.category-2 .new-entry-cards.widget-entry-cards.no-icon.cf.card-large-image.large-thumb > a {
    width: 48%;
    max-width: none;
}


@media screen and (max-width:480px) {
  .archive.category.category-korea-travel.category-2 .new-entry-cards.widget-entry-cards.no-icon.cf.card-large-image.large-thumb > a {
    width: 95%;
  }
}

リフィトリーさま

先日に続き、今日も問題を解決してくださり、ありがとうございました！！！

いただいたコードを子テーマのstyle cssに貼りつけたところ、カテゴリーページ1つのみ新着記事が2列に並びました。スマホ表示は希望どおり1列のままになっています。

お時間がある時で構いませんので、後学のために「クリアフィックスのアイテムを消す」とは何への対処だったのかを教えていただけませんでしょうか。

@hare さん

クリアフィックスはCSSの float を解除するためのものです。

では、 floatって何ですか？となりますが、ごく簡単に説明すると、画像の横に文字を周りこませる用途などによく利用されているプロパティです。

便利なプロパティなのですが、子要素に float を指定すると、親要素の高さが維持されなくなり、サイトのレイアウトが崩れてしまうことが、これもまた、よくあります。

それを防ぐために、クリアフィックスというおまじないのようなもので、float を解除しているのです。

ところが、CSSの FlexBox では、このクリアフィックスの要素が flex アイテムとして、幅を持ってしまう場合があるため、消してしまおう、という訳です。

試しにコードの以下の部分をコメントアウトすると、最下段のエントリーカードの右側の空白だけ広くなってしまい、上の段とずれてしまうかと思います。

/*クリアフィックスのアイテムを消す*/
.archive.category.category-korea-travel.category-2 .new-entry-cards.widget-entry-cards.no-icon.cf.card-large-image.large-thumb::after {
   content: none;
}

リフィトリーさま

詳細に説明してくださり、ありがとうございました。

空白のずれまで考えてコードを教えてくださっていたんですね。

お気遣いに改めてお礼を申し上げます。

今回のことがきっかけで「文字で形を作っていく」ということに興味を持ちました。

今回はそのままベタ貼りさせていただきましたが、これから主なコードだけでもそれぞれが持つ意味や働きを少しずつ理解していこうと思います。