マーカーみたいな線をcssで書きたいです

Question

###前提・実現したいこと
cssで書いたマーカーのような線を自由に動かいしたいです。
現状は下の図のようになっているのですが

実際には、下の図のように先を少し下に下げたいです。

<h4>精度が高いシュミレーションが可能な理由</h4>

h4 {
    width: 520px;
    margin-left: 41px;
    padding-top: 50px;
    text-align: center;
    color: #fff;
    font-size: 2.1rem;
    background: linear-gradient(transparent 83%, #006837 75%);
    font-weight: 900;
}

Comments

[x_x]

「先を下げる」というのは斜めにするということでしょうか？ 画像を見てもわかりませんでした。

[ryuji000]

すみません｢先｣は誤字です

Answer 1

padding-bottom: .5rem; /* これを追加 */

Comments

[ryuji000]

いつも助けていただきありがとうございます。
aozukiさんの回答で行けました。
また何かありましたらよろしくお願いします。

Answer 2

padding-bottomを追記してみてはどうでしょうか？
（数値は調節してください）

h4 {
padding-bottom: 10px;
}

Comments

[ryuji000]

回答ありがとうございます。
これで行けました。
また何かありましたらよろしくお願いします。

Answer 3

いろいろと謎ですが、こんな感じになるかと思います。

h4 {
    transform: skewY(1deg);
    transform-origin: left top;
}

Comments

[ryuji000]

わかりづらい説明で大変申し訳ございませんでした。
aozukiさんの回答で行けました。
またの機会でよろしくお願いします。