* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

body {
  position: relative; }

a {
  color: #fff;
  text-decoration: none; }

nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%; }

.menu-web {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100px;
  background-color: #061e40; }
  .menu-web .logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 70px;
    margin: 0 20px; }
    .menu-web .logo img {
      display: block;
      max-width: 100%;
      height: auto; }

.menu-link {
  position: relative;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .menu-link li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    .menu-link li a {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      width: 100px;
      padding: 10px 0;
      border-right: 1px solid #143175; }
      .menu-link li a:hover {
        color: #fff;
        -webkit-transition: right .5s;
        -o-transition: right .5s;
        transition: right .5s;
        background-color: #CF223E;
        border-bottom: 2px solid #ffc849; }
  .menu-link li.logo a {
    padding: 0;
    border-right: none; }
  .menu-link li.logo a:hover {
    background-color: #061e40;
    border-bottom: none; }

.login a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 5px 20px;
  margin-right: 20px; }
  .login a:hover {
    color: #fff;
    background-color: #CF223E;
    border-bottom: 2px solid #ffc849; }

.login span {
  margin-right: 15px; }

.login i.bi.bi-person-circle::before {
  font-size: 30px; }

.menu_mobile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 60px;
  background-color: #061e40;
  display: none;
  z-index: 999; }
  .menu_mobile .logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 50px;
    margin: 0 20px; }
    .menu_mobile .logo img {
      display: block;
      max-width: 100%;
      height: auto; }

.burger_menu ul {
  position: absolute;
  background-color: #000; }

.burger_menu i {
  padding: 20px;
  font-size: 30px;
  color: #fff; }

.menu_mobile_link {
  display: block;
  position: fixed;
  width: 250px;
  height: 100vh;
  top: 0px;
  right: 0;
  color: #000;
  background-color: #023e71;
  -ms-transform: translateX(110%);
  transform: translateX(110%);
  -webkit-transform: translateX(110%);
  -webkit-transition: .3s all ease-in-out;
  -o-transition: .3s all ease-in-out;
  transition: .3s all ease-in-out;
  -webkit-box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.5);
  box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.5); }

.menu_mobile_link.active {
  -ms-transform: translateX(0%);
  transform: translateX(0%);
  -webkit-transform: translateX(0%); }

.menu_mobile_link a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 20px 0;
  padding-left: 30px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
  .menu_mobile_link a:hover {
    background-color: #CF223E; }
  .menu_mobile_link a.close {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 30px 0; }
  .menu_mobile_link a i.bi.bi-x-lg {
    font-size: 30px;
    position: absolute;
    right: 20px; }
  .menu_mobile_link a i.bi.bi-person-circle::before {
    font-size: 20px;
    margin-right: 10px; }

img {
  width: 100%;
  max-width: 100%; }

.banner-pc {
  display: block; }

.banner-mobile {
  display: none; }

header .banner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 200px;
  background-color: #333; }

header h1 {
  color: #fff;
  text-align: center; }

header p {
  color: #c5c5c5;
  text-align: center; }

header .banner-registration {
  background: url("../img/banner-01.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

header .banner-data {
  background: url("../img/banner-01.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

header .banner-contest {
  background: url("../img/banner-01.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

header .banner-contact {
  background: url("../img/banner-01.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

header .banner-history {
  background: url("../img/banner-01.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

header .banner-ranking {
  background: url("../img/banner-01.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

header .banner-pricing {
  background: url("../img/banner-pricing.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

@media screen and (max-width: 768px) {
  .menu_mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .menu-web {
    display: none; }
  .banner-pc {
    display: none; }
  .banner-mobile {
    display: block; }
  header .banner {
    width: 100%;
    height: 160px;
    background-color: #333; } }