レシポンシブ化する際の該当ＣＳＳコード（疑似要素）の役割が不明です。

現在このようなLPの模写コーディングをしております。
https://shptomoya.github.io/shiro/

こちらのLPのレスポンシブ化をしているのですがsectionタグの”work arrow_display”クラスに関して記述しているCSSコードの役割がわかりませんのでわかる方教えていただきたいです。
具体的には疑似要素　::before ::after　が絡んでいる部分すべてがわかりません。
プロパティの意味はわかるのですが何のためにこのような指定をするのかわからないです。

検証で実際のLPをみてみるとWorkの下にあるGiftやWeddingがあるスクロールバーの右下に　　＿＼　のような文字が出るのですが、おそらくこの部分に関する記述だということはわかりました。
検証でプロパティの削除や追加などいろいろしているのですがいまいちどんな役割があるのかわからないです。
別にここのコードはなくてもいいんじゃないかとすら思います。
スクロールに関する役割を持っているのだとは思いますが謎です。
ご教授いただければと思います。

こちらが疑問点を含むCSSコードです。

CSS
1  .work {
2    position: relative;
3    padding: 40px 0 24px;
4  }
5
6  .work_contents_wrapper {
7    overflow-x: auto;
8    overflow-y: visible;
9    -webkit-overflow-scrolling: touch;
10  }
11
12  .work_contents_wrapper::-webkit-scrollbar {
13    width: 4px;
14    height: 4px;
15    border-radius: 8px;
16  }
17
18  .work_contents_wrapper::-webkit-scrollbar-thumb {
19    background: rgba(0,0,0,.15);
20    border-radius: 8px;
21  }
22
23  .work_contents_wrapper::-webkit-scrollbar-track {
24    background: rgba(0,0,0,.1);
25    border-radius: 8px;
26  }
27
28  .work_contents {
29    display: inline-flex;
30    flex-direction: row;
31    flex-wrap: nowrap;
32    height: auto;
33  }
34
35  .work_content {
36    width: 80vw;
37    padding-bottom: 40px;
38  }
39
40  .work_content:not(:last-of-type) {
41    margin-right: 24px;
42  }
43  .work::before,
44  .work::after {
45    content: '';
46    position: absolute;
47    display: block;
48    width: 0;
49    height: 1px;
50    background: #333;
51  }
52
53  .work::before {
54    bottom: 26px;
55    left: 79%;
56    overflow: hidden;
57    transition: .3s ease-in-out;
58  }
59
60  .work::after {
61    bottom: 30px;
62    right: 5%;
63    transform: rotate(45deg);
64    transition: .9s ease-in-out;
65  }
66
67  .arrow_display.work::before {
68    width: 60px;
69  }
70
71  .arrow_display.work::after {
72    width: 10px;
73  }
74
75  .work_content:nth-of-type(2) {
76    margin-top: 0;
77  }
78
79  .work_content_image {
80    height: 200px;
81    margin-bottom: 0;
82    object-fit: cover;
83  }
84
85  .work_image_gift {
86    object-position: 0 75%;
87  }
88
89  .work_image_decoretion {
90    object-position: 0 65%;
91  }
92
93  .work_image_wedding {
94    object-position: 0 60%;
95  }

該当クラスのHTMLも念のため貼らせていただきます。

HTML
1<section class="work arrow_display" id="work">
2    <div class="u-content-wrapper">
3      <h2 class="u-heading"><a id="section-work">Work</a></h2>
4      <p id="work_desc" class="u-text">オーダーメイドでのブーケ・アレンジメントのデザインのほか、<br class="u-display_pc">
5        ウェディングやイベントの装花なども行なっています。<br class="u-display_pc">
6        一人一人にあったご提案をさせていただきます。</p>
7      <div class="work_contents_wrapper">
8        <div class="work_contents">
9          <div class="work_content">
10            <img class="work_content_image work_image_gift" src="./work_gift/work_gift.png" alt="白い花束の写真">
11            <h3 class="work_content_heading">Gift</h3>
12            <p class="work_content_text">花束をお送りしたいお相手、伝えたいお気持ちに合わせたプレゼント用花束のアレンジメントをさせていただきます。
13              花言葉などの豆知識もお伝えします。</p>
14
15          </div>
16          <div class="work_content">
17            <img class="work_content_image work_image_decoretion" src="./work_decoretion/work_decoretion.png" alt="マカロンの写真">
18            <h3 class="work_content_heading">Decoration</h3>
19            <p class="work_content_text">お写真を彩るお花を一輪から販売。
20              一定期間のご契約で定期的にご自宅へ配送させていただくことも可能です。</p>
21          </div>
22          <div class="work_content">
23            <img class="work_content_image work_image_wedding" src="./work_wedding/work_wedding.png" alt="白い花束の写真">
24            <h3 class="work_content_heading">Wedding</h3>
25            <p class="work_content_text">ウエディングドレスに合わせたブーケや式場の雰囲気に合う装花をご提案。
26              お打ち合わせの流れや回数、費用などにつきましてはお問い合わせください。</p>
27          </div>
28          <div class="work_content">
29            <img class="work_content_image work_image_for_yourself" src="./work_for_yourself/work_for_yourself.png" alt="部屋に白い花が飾られた写真">
30            <h3 class="work_content_heading">For yourself</h3>
31            <p class="work_content_text">お部屋の雰囲気やライフスタイルをお聞きしてご自宅用の花束をご提案し
32              、少しでも長く咲かせるコツもお教えします。花束に合った花瓶をご提案することも可能です。</p>
33          </div>
34        </div>
35      </div>
36    </div>
37  </section>