JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <div class="accordion">
    <div class="accordion-toggle">
      <div class="openclose">
        <p class="resp-p man">I am working fine :)</p>
        <img style="transform: rotate(-90deg); left: calc(50% - 15px); top: calc(100% + 30px);" src="http://simpleicon.com/wp-content/uploads/arrow-18.png">
        <img style="top: calc(50% - 15px); transform: rotate(180deg); left: 100%;" src="http://simpleicon.com/wp-content/uploads/arrow-18.png">
        <img style="left: -30px; top: calc(50% - 15px);" src="http://simpleicon.com/wp-content/uploads/arrow-18.png">
        <img style="transform: rotate(90deg); left: calc(50% - 15px); top: -60px;" src="http://simpleicon.com/wp-content/uploads/arrow-18.png">
      </div>
    </div>
    <div style="display: none;" class="accordion-content default">
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
</p>
    </div>
  </div>
</div>
<br>
<div style="text-align:center">Lots of ocntent between</div>
<br>
<div class="container">
  <div class="accordion">
    <div class="accordion-toggle">
      <div class="openclose">
        <p class="resp-p man">I dont work :(</p>
        <img style="transform: rotate(-90deg); left: calc(50% - 15px); top: calc(100% + 30px);" src="http://simpleicon.com/wp-content/uploads/arrow-18.png">
        <img style="top: calc(50% - 15px); transform: rotate(180deg); left: 100%;" src="http://simpleicon.com/wp-content/uploads/arrow-18.png">
        <img style="left: -30px; top: calc(50% - 15px);" src="http://simpleicon.com/wp-content/uploads/arrow-18.png">
        <img style="transform: rotate(90deg); left: calc(50% - 15px); top: -60px;" src="http://simpleicon.com/wp-content/uploads/arrow-18.png">
      </div>
    </div>
    <div style="display: none;" class="accordion-content default">
     ...

CSS

.accordion-toggle:hover{
  cursor:pointer;
}
img {
  width: 30px;
  position: absolute;
  transition: all 1s;
}

.openclose {
  text-align: center;
  position: relative;
  margin: 30px;
}

.moved {
  left: calc(50% - 15px) !important;
  top: 50% !important;
  transform: rotate(630deg) !important;
}
.container{
background: grey;
border-radius: 20px;
padding: 30px 0;
width: calc(100% - 30px);
margin: auto;
}
.accordion-content{
  padding:10px;
}

JavaScript

$('.accordion').find('.accordion-toggle').click(function() {

  //Expand or collapse this panel
  $(this).next().slideToggle('slow');

  //Hide the other panels
  $(".accordion-content").not($(this).next()).slideUp('fast');
   $('img').not($(this).find('img')).removeClass('moved');

    $(this).find('img').toggleClass('moved');

});