.section-position {
  margin-top: 55px;
  color: black;
}

.section-position .container {
  text-align: left;
}

.section-position-title {
  border-bottom: 2px solid black;
  padding-bottom: 5px;
}

.position {
  padding: 20px 0;
}

.position:not(:first-child) {
  border-top: 2px solid #ccc;
}

.position-header {
  display: flex;
  justify-content: space-between;
}

.position-content {
  display: none;
  padding: 15px 0;
}

.arrow-view {
  width: 40px;
  height: 22px;
  overflow: hidden;
}

.arrow-bottom i {
  display: block;
  transform-origin: center center;
  transform: rotate(-90deg);
  position: relative;
  top: -9px;
}

.arrow-up i {
  display: block;
  transform-origin: center center;
  transform: rotate(90deg);
  position: relative;
  top: 10px;
}

.state-see-detail,
.state-less-detail {
  display: none;
  align-items: center;
  margin-right: -11px;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.position:not(.-show-content) .state-see-detail {
  display: flex;
}

.position.-show-content .state-less-detail {
  display: flex;
}

.position.-show-content .position-content {
  display: block;
	    font-family: var(--fontTextTitle);
}

.position-name {
  white-space: pre-wrap;
}

@media (max-width: 991px) {
  .arrow-up i {
    top: 12px;
  }

  .arrow-bottom i {
    top: -7px;
  }
}

@media (max-width: 767px) {
  .position-name {
    white-space: initial;
  }
}