:root {
  --notes-info: #27419C;
  --notes-warning: #D32F2F;
}

div.note.topic\/note {
  position: relative;
  min-height: 66px;
  border-radius: 0;
  padding: 20px 50px 16px 74px;
  background: white;
  line-height: 23px;
}

.note::after {
  content: '';
  position: absolute;
}

.note p {
  margin: 0;
}

.note.note.note_note {
  margin: 24px 0;
  font-size: 14px;
  border-color: #e6e6e6;
}

.note_note::after {
  top: 19px;
  left: 24px;
  width: 26px;
  height: 26px;
  background-image: url(../images/notes/notes-info-dull-color.svg);
}

.note.notice.note_notice {
  margin: 24px 0 35px;
  border-color: var(--notes-info);
}

.note_notice::after {
  top: 19px;
  left: 24px;
  width: 26px;
  height: 26px;
  background-image: url(../images/notes/notes-info.svg);
}

.note.warning.note_warning {
  margin: 24px 0 35px;
  border-color: var(--notes-warning);
}

.note_warning::after {
  top: 18px;
  left: 21px;
  width: 25px;
  height: 24px;
  background-image: url(../images/notes/notes-warning.svg);
}

*[class~="topic/note"]:not([class~="hazard-d/hazardstatement"]) {
  border: 1px solid;
  border-radius: 11px;
}

/*notes-content-two-lines*/
span.note__title {
  display: none;
}

/*notes-colors-colorful*/
*[class~="topic/note"]:not([class~="hazard-d/hazardstatement"]) {
  background-color: rgba(0, 120, 160, 0.09);
  border-color: var(--notes-info);
}
*[class~="topic/note"].note_danger,
*[class~="topic/note"].note_caution {
  background-color: rgba(255, 202, 45, 0.1);
  border-color: #606060;
}
*[class~="topic/note"].note_warning,
*[class~="topic/note"].note_attention,
*[class~="topic/note"].note_important {
  background-color: rgba(255, 202, 45, 0.1);
  border-color: #FFCA2D;
}
*[class~="topic/note"].note_notice {
  background-color: rgba(255, 226, 225, 0.32);
  border-color: #FF342D;
}