投稿者:: @aoinyan

↑

@media screen and (max-width: 480px) {
.c-postTitle
   font-size: 8px;
}
}

見た感じ以下の赤文字の括弧がないのではないでしょうか。

@media screen and (max-width: 480px) {
  .c-postTitle  {
    font-size: 8px;
  }
}

※現在リンク先のテーマがCocoon以外のものになっておりますので、詳しいことは分かりかねます。

投稿者:: @aoinyan

↑

最後なんですが、タイトルの背景画像の大きさは、1920×1280なんですが、上を少し切り取っても、パソコン表示の下が画像ギリギリまで表示されません。画像を画面いっぱいに表示させるには、どこを調整するばよいでしょうか？

冒頭の質問と内容が違うようです。
フォーラムの案内にありますように、できれば一つのトピックに一つの質問でお願い致します。
これに関しては恐れ入りますが、新しくトピックを立てて頂いてよろしいでしょうか。

1つのトピックにつき1つの質問を書き込んでください

これに関しても現在使用しているテーマ（SWELL）に関しての質問であれば、テーマのフォーラムに質問することをお勧めいたします。その方が確かかと思います。

該当のページですが、SWELLを使われており。

以前の投稿もですが、こちらのフォーラムはCocoonに関しての質問です。

あくまで善意で回答しているだけです。
SWELLについては、SWELL公式フォーラムに質問願います。
また、ご自身でカスタマイズできない場合、有償にて依頼願います。

@yhira 　　

ご教授ありがとうございます。
｛　をつけ忘れているだけでした。修正してみます。
他のトピックはSWELLのフォーラムに質問してみます。

@chu-ya
ここのフォーラムの方が詳しく教えてくれるので、ついつい使用してしまいます。
すみません、SWELLで質問してみます。

お二方、ありがとうございました。

@aoinyan さん

●注意

カスタマイズする以前に、CSSの知識が足りないです。
CSSを理解した上でカスタマイズするか、既存のSWELLの設定で、済ませるべきだと、私は思います。
SWELLフォーラム見ましたが、誰も回答しないと思います。

質問する前に、CSSをチェックに掛け、エラーは取りましょう。

https://jigsaw.w3.org/css-validator/

●原因

以前のCSSですが、コメントを//とし間違えており、それで一部反映されておらず。

タイトル位置の変更で、c-postTitleを移動させている。
本来、親のl-topTitleArea__bodyを移動させるべき。
孫のc-postTitle__ttlの幅を変えても、親自体の幅は変わらないので、折り返され。

●ご参考

私は、SWELLを持ってはいません。
aoinyanさんページを、Chromeデベロッパーで調べた範囲でコードを書いてみました。

:root {
  --color_border--table: #999999;
  --color_border: #999999;
}


/* 見出し */

.post_content h2 {
  font-size: 1.4em;
}


/* タイトルエリアの要素中央→下配置 */

.l-topTitleArea {
  align-items: flex-end;
  min-height: 780px;
}


/* タイトル下から50px移動 */

.l-topTitleArea__body {
  bottom: 50px;
}

@media (width >=600px) {
  .c-pageTitle,
  .c-postTitle__ttl {
    font-size: 60px;
  }
}

@media (width < 600px) {
  .c-pageTitle,
  .c-postTitle__ttl {
    font-size: 30px;
  }
}

もう少しスッキリさせるなら、以下のようにfont-sizeにclampを用い、フォントサイズを可変とする。

:root {
  --color_border--table: #999999;
  --color_border: #999999;
}


/* 見出し */

.post_content h2 {
  font-size: 1.4em;
}


/* タイトルエリアの要素中央→下配置 */

.l-topTitleArea {
  align-items: flex-end;
  min-height: 780px;
}


/* タイトル下から50px移動 */

.l-topTitleArea__body {
  bottom: 50px;
}

.c-pageTitle,
.c-postTitle__ttl {
  font-size: clamp(30px,5vw,60px);
}

ご教授いただき、ありがとうございます！！
すごく助かりました！！🙏
これでできなかったら、業者に頼もうかと思っていました。

おっしゃる通り、CSSの基本ができていないのと、CSSをチェックするものがあることも知りませんでした。ネットで検索したものを参考に追加していたのですが、基本から勉強し直そうと思います。
親と子についてわかっていないとダメだなと思いつつも、やはり表面的な処理しかできていませんでした。

載せていただいたCSSを追加し、微調整が終わりました。
ＣＳＳチェックもしてみましたが、見方もわからないので確認してみます。

●カテゴリーページ（むすびができること）だけ、他のページとタイトルの位置が少しずれるようだったので、「position: relative;」で微調整しました。

●タイトル位置に「right」を追加して、左にもう少し移動させました。

●タイトルエリアで、ＰＣとタブレットでもウィンドウいっぱいに表示されるように微調整しました。

CSSにエラーがあります。

投稿者:: @aoinyan

↑

●カテゴリーページ（むすびができること）だけ、他のページとタイトルの位置が少しずれるようだったので、「position: relative;」で微調整しました。

●タイトル位置に「right」を追加して、左にもう少し移動させました。

SWELLは、l-topTitleArea__bodyにmax-width+paddingで左右位置を調整している。
この為、positionを使うべきではない、paddingで調整する。

メディアクエリは一纏めにする。
画面幅600px未満か否かで切り替わる為、600px未満のみだけ定義すればいい。

本件はSWELLなので、私は、これ以上回答しません。

:root {
  --color_border--table: #999999;
  --color_border: #999999;
}


/* 見出し */

.post_content h2 {
  font-size: 1.4em;
}


/* タイトルエリアの要素中央→下配置 */

.l-topTitleArea {
  align-items: flex-end;
  min-height: 810px;
}


/* タイトル下から50px移動 */

.l-topTitleArea__body {
  bottom: 50px;
  max-width: unset;
}


/* タイトル */

.c-pageTitle,
.c-postTitle__ttl {
  font-size: 60px;
}


/* サブタイトル(カテゴリー) */

.c-pageTitle__subTitle {
  display: none;
}

@media (width < 600px) {
  .l-topTitleArea {
    min-height: 782px;
  }
  .l-topTitleArea__body {
    bottom: 30px;
  }
  .c-pageTitle,
  .c-postTitle__ttl {
    font-size: 30px;
  }
}

すみません、再びチェックと、メディアクエリもひとまとめの仕方を教えていただき、本当にありがとうございます🙏

カテゴリーページもpositionを使わずに、paddingで調整してみます。

ありがとうございました🙏