問題点：PSDのデザインは最大の画面サイズではありません。 したがって、PSDからバックグラウンド全体をカットすると、バックグラウンドは繰り返されますが、破損します。
ベストプラクティス：元の画像パターンのみをカットします（利点：小さな画像サイズの結果、ページの読み込み時間が短くなります）
①背景画像カッティングプロセス
STEP 1. PhotoshopでオリジナルのPSDを開く (例：元の背景画像のサイズ→ 1000 x 700 px)
背景画像のパターンコピーする手順
STEP 1. クリックPattern Overlay(2) > クリックPattern Overlay > (3) クリックcopy pattern (4)
STEP 2. コピーしたパターンにマウスを合わせて元のパターンサイズ（283 × 283 px）を確認し、サイズを覚えておいてください。
STEP 3. 背景レイヤーを新しいページに複製します。
STEP 4. 背景の矩形形状（1000 x 700 px → 283 x 283 px）のサイズを変更し、Radius（半径）を15px → 0）を削除します。 背景（bg-charm.png）イメージをトリムして保存します。
 元と背景画像：(1000 x 700px)  repeat外した背景画像：(283 x 283px)②PC / SP用のビューポート互換コーディング(CSS):
PCの場合:
CSS
.charm-bg {
background: url('img/charm/bg-charm.png') repeat top left;
}
SPの場合:
CSS
.charm-bg {
background: url('img/charm/bg-charm.png') repeat top left;
background-size: 50%;
}