JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <base href="https://loratokareva.github.io/luzhok">
    <title>Сайт Лужок на bootstrap</title>
    <link rel="stylesheet" href="/common/bootstrap/css/bootstrap.min.css">

    <link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet">

    <link rel="stylesheet" href="/common/jquery/css/jquery-ui.css">
    <script src="/common/jquery/js/jquery-1.12.4.js"></script>
    <script src="/common/jquery/js/jquery-ui.js"></script>

    <script src="/common/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="/common/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <!--<script src="http://localhost:63342/job-grandtitul/debugging/apps/bootstrap/js/bootstrap-collapse.js" type="text/javascript"></script>-->


</head>


<body>


<!--    vacancies   -->
<style>

    .vacancy__more {
        height: auto!important;
        padding: 0 0 40px!important;
        border: none;
    }
    .vacancy__list,
    .vacancy__list-caption {
        font: 100 16px "Roboto", Verdana;
    }

    .vacancy__list {
        list-style-type: disc;
        color: #767a8b;
        margin-left: 30px;
    }
    .vacancy__list-caption {
        color: #040404;
        margin: 30px 0 20px ;
    }
    .vacancy__name {
        color: #df2626;
        font: 500 16px "Roboto", Verdana;
        text-transform: uppercase;
    }
    .vacancy__data,
    .vacancy__pay-title,
    .vacancy__pay-body     {
        font: 100 16px "Roboto", Verdana;
    }

    .vacancy__data {
        color: #707486;
    }
    .vacancy__pay-title {
        color: #000;
    }

    .vacancy__pay-body {
        color: #707486;
    }
    .vacancy__pay {
        margin: 0 0 0 auto;
        width: max-content;
    }
    .panel_vacancy {
        box-shadow:  none;
        position: relative;
        margin-bottom: 0;
        border: none;
    }
    .panel_vacancy:not(:last-child):after {
       ...

CSS

.vacancy__more {
        height: auto!important;
        padding: 0 0 40px!important;
        border: none;
    }
    .vacancy__list,
    .vacancy__list-caption {
        font: 100 16px "Roboto", Verdana;
    }

    .vacancy__list {
        list-style-type: disc;
        color: #767a8b;
        margin-left: 30px;
    }
    .vacancy__list-caption {
        color: #040404;
        margin: 30px 0 20px ;
    }
    .vacancy__name {
        color: #df2626;
        font: 500 16px "Roboto", Verdana;
        text-transform: uppercase;
    }
    .vacancy__data,
    .vacancy__pay-title,
    .vacancy__pay-body     {
        font: 100 16px "Roboto", Verdana;
    }

    .vacancy__data {
        color: #707486;
    }
    .vacancy__pay-title {
        color: #000;
    }

    .vacancy__pay-body {
        color: #707486;
    }
    .vacancy__pay {
        margin: 0 0 0 auto;
        width: max-content;
    }
    .panel_vacancy {
        box-shadow:  none;
        position: relative;
        margin-bottom: 0;
        border: none;
    }
    .panel_vacancy:not(:last-child):after {
        content: '';
        position: absolute;
        width: 94%;
        height: 1px;
        left:0;
        right:0;
        bottom: 0;
        margin: 0 auto;
        background-color: #555555;
        z-index: 1;
    }

    .panel-collapse_vacancy.in:after {
        content: '';
        position: absolute;
        width: 100%;
        height: 1px;
        left:0;
        right:0;
        bottom: 0;
        margin: 0 auto;
        background-color: #eeeff4;

        z-index: 2;
    }


    .panel-heading_vacancy {
        background-color: #eeeff4;
        border-bottom: none;
        padding: 25px 35px;
    }

    a[data-parent*="#accordion-vacancy"] {
        display: block;
    }

    .panel-collapse_vacancy {
        width: 94%;
        margin: auto;
    }