How to move the button with an arrow (outgoing slider on css)?

Question

css

I make a slider like this
https://ruseller.com/lessons.php?rub=2&id=1082
and everything worked as it should.
But it was necessary to change the layout (position property). (Unfortunately, that's how it was supposed to be.)
As a result, the arrow button (div) doesn't move with the main div (which appears when hovering over this button).
How can I make both the div and the button next to it move as if it is attached to the edge of the div?
My code is
https://jsfiddle.net/vb88mfzy/1/------------------------------------
---
My code (the rules oblige to spread it here too)
html

<div id="GRAPH1_container"></div><div class="GRAPH1_graph_menu_slider">
<div class="graph_menu_slider">
<div class="arrow_menu_button_1"><div class="arrow_right_menu_button_1_in"></div></div>
<div class="graph_menu_slider_inner">
<div class="graph_menu_content ui_panel_1">
1111
</div>
</div>
</div>
</div></div></div>

css

.graph_menu_slider {
z-index:2;
position: absolute; /*Вот что пришлось изменить*/
top: 50%;
left: 0;


-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
}

.graph_menu_slider_inner {
position: absolute;  /*Вот что пришлось изменить*/
left: -424px;
 margin-top:-18vh; 

-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.graph_menu_slider:hover {
left: 0px;

}
.graph_menu_slider:hover .graph_menu_slider_inner {
left: 0px;
}


.graph_menu_content
{
width:400px;
height:20vh;
border: 2px solid #F0F0F0 !important;
}



/* Ниже оформление*/

.ui_panel_1
{
padding: 10px;
background: #222A37;
border: 1px solid #383838;
color:#CDCFD2;
font-family: Arial;
font-size: .875rem;
vertical-align: middle;
}


.arrow_right_menu_button_1_in {
background: #0C7ECB;
width:1.8rem;
height:1.9rem;
content:'';
clip-path: polygon(0 34%, 50% 80%, 100% 34%, 80% 34%, 50% 60%, 20% 34%);
transform:  rotate(-90deg);
}


.arrow_menu_button_1{
border: 0.0625rem solid #00AEFF; /* 1px */
background: #171B23;
cursor:pointer;
width:2.0rem;
padding: 0.4rem;
text-decoration: none;
transition-property: background;
transition-duration: 100ms;
transition-timing-function: ease;
transition-delay: 0s; 
vertical-align: middle;
}
.arrow_menu_button_1:hover {
border: 0.0625rem solid #00AEFF; /* 1px */
background: #0E1015;
}

Answer 1

https://jsfiddle.net/vb88mfzy/2/