@font-face {
  font-family: "Mongolian BT";
  src: url(../fonts/LD-MONG150702-BT.ttf);
}
@font-face {
  font-family: "Mongolian BT";
  src: url(../fonts/LD-MONG150702-BT.eot);
}

:root {
  --mg-font1: "Roboto Condensed", sans-serif;
  --mg-font2: "Roboto", sans-serif;
  --mg-row-item: 4;

  /* --mg-bg-color: 32, 41, 57;
  --mg-bg-color-opacity: 0.8;
  --mg-hf-text-color: #fff; */

  /* --mg-c1: #0079f3;
  --mg-c1-hover: #0055ae;
  --mg-c1-alt: #1e3f6c;

  --mg-c2: #ffc500;
  --mg-c2-hover: #cfa000;

  --mg-c3: #f3f4f6;
  --mg-c3-hover: #a0a0a0;
  --mg-c3-alt: #dde2e9;

  --mg-c4: #000;
  --mg-c4-hover: #000;

  --mg-c5: #3c3c3c;
  --mg-c5-hover: #3c3c3c; */
}

body {
  font-family: var(--mg-font1);
  font-size: 1rem;
  font-weight: 400;
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
a {
  text-decoration: none;
}
.cover {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(var(--mg-bg-color), var(--mg-bg-color-opacity));
  z-index: 0;
}
header {
  background: rgba(var(--mg-bg-color), var(--mg-bg-color-opacity));
  backdrop-filter: blur(8px);
  font-weight: 700;
  font-size: 4rem;
  line-height: 1;
  text-align: center;
  /* padding: 48px; */
  height: 180px;
  text-transform: uppercase;
  z-index: 1;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  color: var(--mg-hf-text-color);
  border-bottom: 1px solid var(--mg-hf-border-color);
  display: flex;
  justify-content: center;
  align-items: center;
}
header a {
  color: var(--mg-hf-text-color);
}
header a:hover,
header a:visited {
  color: var(--mg-hf-text-color);
}
header img.logo {
  height: 120px;
  width: auto;
  margin-right: 30px;
}
footer {
  text-align: center;
  padding: 40px 30px;
  text-transform: uppercase;
  background: rgba(var(--mg-bg-color), var(--mg-bg-color-opacity));
  backdrop-filter: blur(8px);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  color: var(--mg-hf-text-color);
  font-size: 2rem;
  font-weight: 300;
  border-top: 1px solid var(--mg-hf-border-color);
}
main {
  position: absolute;
  z-index: 1;
  width: 100%;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  padding: 100px;
  gap: 150px;
  justify-content: space-between;
  align-items: center;
}
.mng_text {
  color: var(--mg-hf-text-color);
  width: fit-content;
}
.mng_text .text {
  font-family: "Mongolian BT", Serif;
  font-size: 11rem;
  -moz-writing-mode: vertical-lr;
  writing-mode: vertical-lr;
  -webkit-writing-mode: vertical-lr;
  -o-writing-mode: vertical-lr;
  -ms-writing-mode: tb-lr;
  writing-mode: tb-lr;
  -webkit-text-orientation: sideways-right;
  line-height: 0.8;
  height: 70%;
  text-align: center;
}
.mng_text .text a {
  color: var(--mg-hf-text-color);
}
.mng_text .text a:hover,
.mng_text .text a:visited {
  color: var(--mg-hf-text-color);
}
.links {
  background-color: rgba(var(--mg-bg-color), var(--mg-bg-color-opacity));
  backdrop-filter: blur(8px);
  color: #fff;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, max-content);
  gap: 32px;
  padding: 16px;
  border-radius: 32px;
}
.links a {
  padding: 50px;
  font-size: 36px;
  font-weight: 300;
  color: #fff;
  display: block;
  text-align: center;
  border-radius: 16px;
  max-width: 300px;
  line-height: 1;
  transition: all 300ms ease-in;
}
.links a:hover,
.links a.active {
  background-color: rgba(149, 185, 107, 1);
}
.links a i {
  font-size: 72px;
  display: block;
  margin-bottom: 30px;
}
.user_list_wrap {
  display: flex;
  gap: 32px;
  flex-direction: column;
}
.list_row {
  display: flex;
  gap: 32px;
  justify-content: center;
}
.list {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(var(--mg-row-item), 1fr);
  justify-items: center;
  /* width: fit-content; */
  /* justify-items: center; */
}
.list .item {
  background-color: #fff;
  border-radius: 8px;
  overflow: hidden;
  color: rgba(var(--mg-bg-color), 1);
  width: var(--mg-item-width);
  justify-self: center;
  font-size: var(--mg-font-size);
  /* font-size: 10px; */
  /* width: 154px; */
  /* --font-size: calc(var(--mg-item-width) * 0.0645); */
  /* font-size: var(--font-size); */
}
.list .item img {
  width: 100%;
  height: auto;
}
.list .item .content {
  padding: 10px;
}
.list .item .name {
  /* font-size: 12px; */
  font-size: calc(var(--mg-font-size) * 1.2);
  font-weight: 700;
  line-height: 1.16;
  margin-bottom: 6px;
  text-transform: uppercase;
}
.list .item .position {
  line-height: 1.17;
  margin-bottom: 6px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
}
.list .item .phone {
  font-weight: 700;
}
.list .item .phone i {
  margin-right: 3px;
}

.list_group {
  padding: 16px;
  background-color: rgba(var(--mg-bg-color), var(--mg-bg-color-opacity));
  backdrop-filter: blur(8px);
  border-radius: 32px;
  width: fit-content;
}
.group_title {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.17;
  text-align: center;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  margin-bottom: 24px;
  color: var(--mg-hf-text-color);
}
.group_title a {
  color: var(--mg-hf-text-color);
}
.group_title a:hover,
.group_title a:visited {
  color: var(--mg-hf-text-color);
}
.circle_links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, max-content);
  gap: 40px;
}
.circle_links a {
  background-color: var(--bg-color);
  backdrop-filter: blur(8px);
  color: var(--text-color);
  border-radius: 50%;
  display: flex;
  gap: 40px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 330px;
  height: 330px;
  font-size: 26px;
  text-transform: uppercase;
  font-weight: 700;
  transition: all 300ms ease-in;
}
.circle_links a i {
  font-size: 56px;
  line-height: 1;
}
.circle_links a svg {
  transform: scale(2);
}
.circle_links a.active,
.circle_links a:hover {
  background-color: var(--hover-bg-color);
  color: var(--hover-text-color);
}
/*  */
.mg-modal {
  /* width: 2100px;
  max-width: 2100px; */
  width: 1920px;
  max-width: 1920px;
}
.mg-modal.mg-sm {
  width: 900px;
  max-width: 900px;
}
.mg-modal .modal-title {
  text-transform: uppercase;
  font-size: 3rem;
  font-weight: 700;
  text-align: center;
  width: calc(100vw - 2rem);
}
.mg-modal.mg-sm .modal-title {
  font-size: 1.5rem;
}
/* .mg-modal.mg-large {
  width: 1450px;
  max-width: 1450px;
} */
.mg-modal .modal-content {
  background-color: rgba(var(--mg-bg-color), 1);
  color: var(--mg-hf-text-color);
  border-radius: 32px;
}
.mg-modal .modal-header {
  border-bottom-color: rgba(255, 255, 255, 0.5);
  padding: 32px;
  align-items: top;
}
.mg-modal .modal-footer {
  border-top-color: rgba(255, 255, 255, 0.5);
}
.mg-modal .btn-close {
  background: transparent
    url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ececec'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e")
    center/2em auto no-repeat;
  width: 3rem;
  height: 3rem;
}
.mg-modal .modal-body {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.3;
  padding: 32px;
}
.mg-modal .backurl a {
  display: block;
  width: 45px;
  height: 45px;
  background: rgba(149, 185, 107, 1);
  color: rgba(var(--mg-bg-color), 1);
  text-align: center;
  line-height: 45px;
  border-radius: 50%;
  font-size: 130%;
  padding-left: 10px;
}
.mg-modal .backurl a i {
  margin-right: 10px;
}
/*  */
.current_map {
  position: relative;
}
.current_map img {
  width: var(--map_width);
  height: auto;
  position: relative;
  z-index: 1;
}
.current_map a {
  position: absolute;
  top: var(--mg-to-top);
  left: var(--mg-to-left);
  z-index: 2;
  font-size: 2rem;
  color: var(--mg-text);
  text-align: center;
  display: flex;
  flex-direction: column;
  font-weight: 300;
  gap: 5px;
  transition: all 300ms ease-in;
}
.current_map a:hover {
  color: var(--mg-text-hover);
}
.current_map a i {
  font-size: 2.5rem;
}
/*  */
#full-loader {
  position: fixed;
  z-index: 9999999;
  display: flex;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.8);
  color: #fff;
  justify-content: center;
  align-items: center;
}
#full-loader:before {
  position: absolute;
  content: "";
  color: #ffffff;
  font-size: 100px;
  text-indent: -9999em;
  overflow: hidden;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  transform: translateZ(0);
  animation: mltShdSpin 1.7s infinite ease, round 1.7s infinite ease;
}

@keyframes mltShdSpin {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
      0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
      0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,
      -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,
      -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,
      -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,
      -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,
      -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,
      -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
      0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}

@keyframes round {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.edtext {
  font-size: 24px;
}
.edtext h1,
.edtext h2,
.edtext h3,
.edtext h4,
.edtext h5,
.edtext h6 {
  font-weight: 700;
}
.edtext img {
  max-width: 100%;
  height: auto;
}
.edtext .table th,
.edtext .table td {
  color: var(--mg-hf-text-color) !important;
}
.edtext .content-iframe {
  --bs-aspect-ratio: 50%;
  margin-bottom: 15px;
}
.emp_detail_row {
  background-color: rgba(255, 255, 255, 0.05);
  padding: 32px;
  border-radius: 16px;
}
.emp_detail_row + .emp_detail_row {
  margin-top: 32px;
}
.emp_detail_row .name {
  font-size: 40px;
  font-weight: 700;
  line-height: 46.88px;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  margin-bottom: 16px;
}

.emp_detail_row .position {
  margin-bottom: 16px;
}
.emp_detail_row .infos {
  list-style: none;
  display: flex;
  gap: 64px;
  align-items: center;
  margin-bottom: 0;
  padding: 0;
}
.emp_detail_row .infos li {
  display: flex;
  gap: 12px;
  align-items: center;
}
.emp_detail_row .infos li i {
  font-size: 28px;
}
.emp_audio {
  width: 100%;
}
/*  */
.content_list {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.content_list .item {
  padding: 24px 48px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.05);
  font-size: 42px;
  line-height: 60px;
  text-align: left;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  min-height: 168px;
  border-radius: 16px;
  gap: 32px;
}
.content_list .item a {
  background: rgba(149, 185, 107, 1);
  color: rgba(var(--mg-bg-color), 1);
  padding: 16px 48px 16px 32px;
  border-radius: 8px;
  font-size: 32px;
  line-height: 60px;
  display: flex;
  gap: 16px;
  align-items: center;
  transition: all 300ms ease-in;
}
.content_list .item a:hover {
  gap: 32px;
  padding-right: 32px;
}
.a4-ratio {
  --bs-aspect-ratio: calc(1.41 / 1 * 100%);
}
/*  */
.org_list {
  display: grid;
  gap: 32px;
  grid-template-columns: repeat(var(--mg-item-count), 1fr);
}
.org_list .item {
  overflow: hidden;
  border-radius: 16px;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  transition: all 300ms ease-in;
}
.org_list .item h3 {
  padding: 30px 20px;
  text-align: center;
  font-size: 2.2rem;
  font-weight: 400;
  color: rgba(var(--mg-bg-color), 1);
  margin-bottom: 0;
  border-top: 2px solid rgba(var(--mg-bg-color), 0.4);
}
.org_list .item:hover {
  transform: scale(1.02);
}
