PCとスマホをワンソースで作成するときに、文章の改行位置を変えたがるデザイナーやクライアントから要望があった際に

要望を叶えられるよう共有CSSに用意しておいているのが以下です。
CSS

/* hidden
-------------------------------------------------- */
.hidden {
  display: none;
}
.hidden.pcBlock {
  display: inline;
}
@media screen and (max-width: 640px) {
  .hidden.pcBlock {
    display: none;
  }
  .hidden.spBlock {
    display: inline;
  }
}

HTML
スマホ（ウィンドウサイズ横幅640px以下）の場合のみ改行

1歩先の<br class="hidden spBlock"> ライフスタイルへ

PC（ウィンドウサイズ横幅641px以上）の場合のみ改行

1歩先の<br class="hidden pcBlock"> ライフスタイルへ