
.header {
}
.header .logo {
  position: fixed;
  top: 30px;
  left: 30px;
  width: 220px;
  z-index: 1;
  mix-blend-mode: multiply;
}
.main .bars {
  position: fixed;
  height: 30px;
  width: 50px;
  top: 40px;
  right: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 9999999999;
  cursor: pointer;
  mix-blend-mode: difference;
}
.main .bars::before {
  position: absolute;
  content: "";
  height: 2px;
  width: 90%;
  background: #fff;
  transition: 0.1s linear;
}
.main .bars.active::before {
  transform: rotate(45deg);
  width: 50%;
  top: 5%;
  background: #fff;
}
.main .bars::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 90%;
  background: #fff;
  top: 35%;
  transition: 0.1s linear;
}
.main .bars.active::after {
  transform: rotate(-45deg);
  width: 50%;
  top: 5%;
  background: #fff;
}
.menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999999999;
  overflow: hidden;
  display: none;
}
.menu .navBefore {
  position: absolute;
  margin-left: 100%;
  width: 100%;
  height: 100%;
  background: #e8374a;
}
.menu .nav {
    position: relative;
    margin-left: 100%;
    width: 100%;
    height: 100%;
    background: #201b57;
    z-index: 1;
    padding: 80px;
}
.menu .nav .movie_blk {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    filter: alpha(opacity=30);
    -moz-opacity:0.3;
    opacity:0.3;
    -ms-filter: "alpha(opacity=30)";
    -moz-opacity:0.3;
    -khtml-opacity: 0.3;
    zoom:1;
}
.menu .nav .movie_blk video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}
.menu .nav .nav_main {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}
.menu .nav .nav_main .cell {
    width: 31%;
    margin-bottom: 60px;
    padding: 0 0 0 20px;
    border-left: 1px solid rgba(255, 255, 255, .2);
}
.menu .nav .nav_main .cell ul {
    opacity: 0;
}
.menu .nav .nav_main .cell ul li {
    list-style: none;
}
.menu .nav .nav_main .cell ul li:first-child a {
    font-size: 100%;
    opacity: 1;
}
.menu .nav .nav_main .cell ul li a {
    text-decoration: none;
    color: #fff;
    font-size: 90%;
    opacity: 0.5;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -ms-transition: 0.3s;
    transition: 0.3s;
}
.menu .nav .nav_main .cell ul li a:hover {
    opacity: 1;
}
.menu .nav .nav_sub {
    width: 100%;
    position: absolute;
    left: 30px;
    bottom: 30px;
}
.menu .nav .nav_sub ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
}
.menu .nav .nav_sub ul li {
    margin-right: 20px;
}
.menu .nav .nav_sub ul li a {
    font-size: 80%;
    text-decoration: none;
    color: #fff;
}
















