<section>
  <div class="accordion__box">
    <div class="headline js-accordion active">
      O компании
    </div>

    <div class="accordion-content">
      01 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic, voluptatibus.
    </div>
  </div>

  <div class="accordion__box">
    <div class="headline js-accordion">
      Портфель
    </div>

    <div class="accordion-content">
      02 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic, voluptatibus.
    </div>
  </div>

  <div class="accordion__box">
    <div class="headline js-accordion">
      Бизнесу
    </div>

    <div class="accordion-content">
      03 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic, voluptatibus.
    </div>
  </div>

  <div class="accordion__box">
    <div class="headline js-accordion">
      Покупателям
    </div>

    <div class="accordion-content">
      04 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic, voluptatibus.
    </div>
  </div>
</section>
.headline {
  font-weight: bold;
  cursor: pointer;

  &.active {
    color: darkred;
    & + .accordion-content {
      display: block;
    }
  }
}

.accordion-content {
  padding-top: 16px;
  
  &:not(.active) {
    display: none;
  }
}
.accordion__box:not(:last-of-type) {
  margin-bottom: 32px;
}
View Compiled 
let accordionEl = document.getElementsByClassName("js-accordion"),
  accordionCounter;

for (
  accordionCounter = 0;
  accordionCounter < accordionEl.length;
  accordionCounter++
) {
  accordionEl[accordionCounter].addEventListener("click", function () {
    this.classList.toggle("active");
  });
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.