.p-history-block {
  display: flex;
  flex-flow: row wrap;
  gap: 16px 0;
  padding: 32px 0 0 16px;
}

.p-history-block:first-of-type {
  border-top: 1px solid #9ea6b2;
}

.p-history-block .p-history-year {
  flex: 0 0 186px;
  font-weight: bold;
}

.p-history-block .p-history-body {
  flex: 0 0 calc(100% - 186px);
}

.p-history-block .p-history-body__inner {
  display: flex;
  flex-flow: row wrap;
  gap: 16px 0;
  padding: 0 0 32px 0;
  width: 100%;
}

.p-history-block .p-history-body__inner+.p-history-body__inner {
  border-top: 1px solid #9ea6b2;
  padding-top: 32px;
}

.p-history-block .p-history-body__inner .p-history-month {
  flex: 0 0 196px;
  font-weight: bold;
  text-align: center;
}

.p-history-block .p-history-body__inner .p-history-content {
  flex: 0 0 calc(100% - 196px);
  display: flex;
  flex-flow: row wrap;
  gap: 32px;
}

.p-history-block .p-history-body__inner .p-history-content .p-history-text {
  flex: 0 0 100%;
  padding: 0;
}

.p-history-block .p-history-body__inner .p-history-content .p-history-text.-image {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap: 0 16px;
}

.p-history-block .p-history-body__inner .p-history-content .p-history-text.-image .p-history-text__image {
  flex: 0 0 300px;
}

.p-history-block .p-history-body__inner .p-history-content .p-history-text+.p-history-text {
  border-top: 1px solid #9ea6b2;
  padding-top: 32px;
}

.p-history-block .p-history-body__inner .p-history-content+.p-history-content {
  border-top: 1px solid #9ea6b2;
}

.p-history-block.-image {
  border-top: 1px solid #9ea6b2;
  display: grid;
  grid-template-columns: 186px 196px auto 300px;
  grid-template-rows: 1fr;
  grid-column-gap: 0;
  grid-row-gap: 16px;
  padding: 32px 16px;
}

.p-history-block.-image .p-history-year {
  font-weight: bold;
  grid-area: 1/1/2/2;
}

.p-history-block.-image .p-history-month {
  font-weight: bold;
  grid-area: 1/2/2/3;
  text-align: center;
}

.p-history-block.-image .p-history-content {
  grid-area: 1/3/2/4;
  margin-right: 0;
  padding-right: 16px;
}

.p-history-block.-image .p-history-image {
  grid-area: 1/4/2/5;
}

.p-history-block.-image .p-history-image figure figcaption {
  margin-top: 8px;
  font-weight: bold;
  text-align: center;
}

.p-history-block.-image .p-history-image figure img {
  margin: 0 auto;
}

.p-history-block+.p-history-block {
  border-top: 1px solid #9ea6b2;
}

.p-history-block:last-of-type {
  border-bottom: 1px solid #9ea6b2;
}

@media screen and (max-width: 767px) {
  .p-history-block {
    padding: 32px 0 16px 0;
  }

  .p-history-block .p-history-year {
    flex: 0 0 100%;
  }

  .p-history-block .p-history-body {
    flex: 0 0 100%;
  }

  .p-history-block .p-history-body__inner {
    flex: 0 0 100%;
    padding: 0 0 16px 0;
  }

  .p-history-block .p-history-body__inner+.p-history-body__inner {
    padding-top: 16px;
  }

  .p-history-block .p-history-body__inner .p-history-month {
    flex: 0 0 3em;
    text-align: left;
  }

  .p-history-block .p-history-body__inner .p-history-content {
    flex: 0 0 calc(100% - 3em);
  }

  .p-history-block .p-history-body__inner .p-history-content .p-history-text.-image .p-history-text__image {
    flex: 0 0 100%;
  }

  .p-history-block .p-history-body__inner .p-history-content .p-history-text.-image {
    gap: 16px 16px;
  }

  .p-history-block .p-history-body__inner .p-history-content .p-history-text.-image .p-history-text__image {
    flex: 0 0 100%;
  }

  .p-history-block .p-history-body__inner .p-history-content .p-history-text+.p-history-text {
    padding-top: 16px;
  }

  .p-history-block.-image .p-history-month {
    text-align: left;
  }

  .p-history-block.-image .p-history-content {
    padding-right: 0;
  }

  .p-history-block.-image {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto auto;
    grid-column-gap: 16px;
    padding: 32px 0;
  }

  .p-history-block.-image .p-history-year {
    grid-area: 1/1/2/3;
  }

  .p-history-block.-image .p-history-month {
    grid-area: 2/1/3/2;
  }

  .p-history-block.-image .p-history-content {
    grid-area: 2/2/3/3;
  }

  .p-history-block.-image .p-history-image {
    grid-area: 3/1/4/3;
  }
}

@media (min-width: 768px) and (max-width: 1136px) {
  .p-history-block .p-history-year {
    flex: 0 0 11em;
  }

  .p-history-block .p-history-body {
    flex: 0 0 calc(100% - 11em);
  }

  .p-history-block .p-history-body__inner .p-history-month {
    flex: 0 0 100px;
  }

  .p-history-block .p-history-body__inner .p-history-content {
    flex: 0 0 calc(100% - 100px);
  }

  .p-history-block.-image {
    grid-template-columns: 140px 100px auto 200px;
  }
}