body.is_modal {
  overflow: hidden;
}
.modal_window.is_hidden {
  display: none;
}
.modal_window {
  display: block;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  transform-origin: center;
  padding: 0;
  margin: auto;
  animation-name: fadeOut;
  animation-fill-mode: forwards;
  animation-duration: 200ms;
  animation-timing-function: ease-out;
  border: none;
  border-radius: 5px;
}
.modal_window[open] {
  animation-name: fadeIn;
  animation-fill-mode: forwards;
  animation-duration: 400ms;
  animation-timing-function: ease-out;

  ::backdrop {
    animation-name: fadeIn;
    animation-fill-mode: forwards;
    animation-duration: 200ms;
    animation-timing-function: ease-out;
  }
}
.modal_window .container_area {
  position: relative;
  background: #fff;
  text-align: left;
  line-height: 1.8;
  padding: 60px 30px 65px;
}
/* .modal_window .modal_close_button {
  position: absolute;
  width: 30px;
  height: 30px;
  right: 20px;
  top: 20px;
  background: none;
  cursor: pointer;
}
.modal_window .modal_close_button::before,
.modal_window .modal_close_button::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 30px;
  background: #525B5C;
  z-index: 999;
}
.modal_window .modal_close_button::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.modal_window .modal_close_button::after {
  transform: translate(-50%, -50%) rotate(-45deg);
} */
.modal_window::backdrop {
  background: rgba(0, 0, 0, 50%);
}



@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}