画像に文字を乗せるには、画像のクラスのpositionを”relative”にする。
文字のクラスのpositionを"absolute"にし、位置を指定する。
.visual {
position: relative;
}
.visual p {
position: absolute;
width: 50%;
transform: translate(-50%,-50%); /*縦と横の文字のズレを修正
top: 45%; /*画像のtopからの位置
left: 50%; /*画像の左からの位置（右からにするには-50％とする）
/文字の装飾を指定する/
}