﻿@charset "utf-8";

*, *::before, *::after {
  box-sizing: border-box;
}
body {
  margin: 0;
  padding: 0;
}
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.dialog {
  inset: unset;
  max-width: unset;
  max-height: unset;
  overflow: unset;
  border: none;
  padding: 0;
  background: none;

  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100dvh;
}
.dialog:not([open]) {
  display: none !important;
}
.dialog::backdrop {
  background: rgba(0, 0, 0, 0.7);
}
.dialog_inner {
  max-width: 1200px;
  position: relative;
  width: 90%;
  padding-top: 50px;
}
.dialog_content {
  background: white;
}
.dialog_scroll {
  height: 100%;
  max-height: calc(90dvh - 50px);
  overflow-y: auto;
  padding: 20px;
}
.dialog_close {
  appearance: none;
  padding: 0;
  border: none;
  background: transparent;

  display: block;
  position: absolute;
  top: -7px;
  right: -7px;
  width: 44px;
  height: 44px;
  cursor: pointer;
}
.dialog_close::before,
.dialog_close::after {
  content: '';
  display: block;
  position: absolute;
  top: calc(50% - 1px);
  left: calc(50% - 15px);
  width: 30px;
  height: 2px;
  background: white;
}
.dialog_close::before {
  rotate: 45deg;
}
.dialog_close::after {
  rotate: -45deg;
}
