上記のCSSメディアクエリを含めるには、専用のCSSファイルに記述し、各HTMLページにimportする方法が推奨されます。

以下のCSSの内容を`devices.css`というファイルに入れてください。

```
    @media screen and (max-width: 600px) {
        body {
            font-size: 14px;
        }
        .container {
            display: flex;
            flex-wrap: wrap;
        }
        .item {
            width: 50%;
        }
    }
```

次に、HTMLファイルの`<head>`要素の中に、以下の行を追加する：

```
     <link rel="stylesheet" href="devices.css">
```

devices.css`の名前は他の名前に変更することができますが、それに応じて`link href`の部分も変更しなければなりません。
The recommended method to include the above CSS media queries is to put it into a dedicated CSS file and import it into each of your HTML page.

Put the below CSS content into a file called `devices.css`.

    @media screen and (max-width: 600px) {
        body {
            font-size: 14px;
        }
        .container {
            display: flex;
            flex-wrap: wrap;
        }
        .item {
            width: 50%;
        }
    }

Then, inside the `<head>` element of your HTML file, add the following line:

    <link rel="stylesheet" href="devices.css">

You can change the name of `devices.css` to other names, but you must change the `link href` part accordingly.