画像の上に文字を配置して可変に対応
親要素にはposition: relative;
位置を指定したい子要素にpotision: absolute;
レスポンシブ にしても位置がずれないようにするためには
top: ●vhのようにvh,vwを使用する
左右の位置は下記を指定
left: 50%;
transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
width: 100%;
translateが影響して文字が改行されてしまうのでwidth: 100%;を指定すると回避できた。