/* CSS Document */
nav.nav-1 {
  background-color: #000 !important;
  padding: 0; }
  nav.nav-1 div.container-fluid {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between; }
    @media screen and (max-width: 767px) {
      nav.nav-1 div.container-fluid {
        flex-wrap: wrap; } }
    nav.nav-1 div.container-fluid a.navbar-brand {
      margin-left: 1%; }
      @media screen and (max-width: 575px) {
        nav.nav-1 div.container-fluid a.navbar-brand {
          margin-left: 2%; } }
      nav.nav-1 div.container-fluid a.navbar-brand img {
        width: 250px;
        padding: 2rem; }
        @media screen and (max-width: 767px) {
          nav.nav-1 div.container-fluid a.navbar-brand img {
            width: 200px; } }
        @media screen and (max-width: 575px) {
          nav.nav-1 div.container-fluid a.navbar-brand img {
            width: 180px; } }
      nav.nav-1 div.container-fluid a.navbar-brand + div {
        display: grid;
        grid-auto-flow: column;
        width: fit-content; }
        @media screen and (max-width: 991px) {
          nav.nav-1 div.container-fluid a.navbar-brand + div {
            width: 100%;
            display: flex;
            justify-content: end; } }
        nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists {
          margin: 0;
          display: flex;
          align-items: center;
          padding-right: 2rem; }
          @media screen and (max-width: 991px) {
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists {
              justify-content: start; } }
          @media screen and (max-width: 767px) {
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists {
              display: none; } }
          nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list {
            height: 100%;
            display: flex;
            align-items: center; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list a:not(.dropdown-list) {
              padding: 0 0.7em;
              border-right: 1px solid #fff;
              color: #fff;
              transition: .15s;
              line-height: 1.5; }
              @media screen and (max-width: 1399px) {
                nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list a:not(.dropdown-list) {
                  font-size: 16px;
                  font-size: 1.6rem; } }
              @media screen and (max-width: 1199px) {
                nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list a:not(.dropdown-list) {
                  font-size: 15px;
                  font-size: 1.5rem;
                  padding: 0 0.5em; } }
            @media screen and (max-width: 1199px) {
              nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(4) ul {
                padding: 0 10%; } }
            @media screen and (max-width: 991px) {
              nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(4) ul {
                padding: 0 8%; } }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:hover a {
              color: #0090d5 !important; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(3):hover .dropdown-lists, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(1):hover .dropdown-lists {
              display: flex; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(4):hover .dropdown-lists, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(2):hover .dropdown-lists {
              display: flex; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(5):hover .dropdown-lists, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(3):hover .dropdown-lists {
              display: flex; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(5) a {
              border: none; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(6):hover {
              background-color: inherit; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(8):hover, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(7):hover, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(6):hover {
              background-color: inherit; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(8) a, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(7) a, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(6) a {
              border: none;
              display: flex;
              align-items: center;
              justify-content: center;
              padding: 0.5em 1em; }
              @media screen and (max-width: 1399px) {
                nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(8) a, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(7) a, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(6) a {
                  padding: 0.5em; } }
              nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(8) a img, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(7) a img, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(6) a img {
                width: 25px; }
                @media screen and (max-width: 1199px) {
                  nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(8) a img, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(7) a img, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(6) a img {
                    width: 20px; } }
              nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(8) a:hover img, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(7) a:hover img, nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list:nth-child(6) a:hover img {
                opacity: 0.5; }
            nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list ul.dropdown-lists {
              display: none;
              width: 100%;
              position: absolute;
              top: 235px;
              left: 0;
              background-color: #000;
              justify-content: center; }
              @media screen and (max-width: 1199px) {
                nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list ul.dropdown-lists {
                  top: 225px; } }
              @media screen and (max-width: 991px) {
                nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list ul.dropdown-lists {
                  top: 200px; } }
              nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list ul.dropdown-lists li a figure {
                margin: 3rem 1rem; }
                nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list ul.dropdown-lists li a figure img {
                  width: 100%; }
                nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list ul.dropdown-lists li a figure figcaption {
                  text-align: center;
                  color: #fff;
                  margin-top: 1rem;
                  line-height: 1.1; }
                  @media screen and (max-width: 1399px) {
                    nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list ul.dropdown-lists li a figure figcaption {
                      font-size: 16px;
                      font-size: 1.6rem; } }
              nav.nav-1 div.container-fluid a.navbar-brand + div ul.gnavi-lists li.gnavi-list ul.dropdown-lists li a:hover img {
                opacity: 0.5; }

nav.nav-2 .menu {
  display: block;
  position: relative;
  cursor: pointer; }
  nav.nav-2 .menu .menu-title {
    display: block;
    padding: 12px 0 0;
    background: #0090d5;
    text-align: center;
    color: #ffffff;
    font-weight: bold;
    text-transform: uppercase;
    transition: 0.3s background-color;
    font-size: 20px;
    padding: 2rem; }
    nav.nav-2 .menu .menu-title::before {
      content: "";
      display: block;
      height: 0;
      border-top: 5px solid #0090d5;
      border-left: 75px solid transparent;
      border-right: 75px solid transparent;
      border-bottom: 0 solid #dddddd;
      position: absolute;
      top: 100%;
      left: 0;
      z-index: 101;
      transition: 0.2s 0.2s border-top ease-out, 0.3s border-top-color; }
    nav.nav-2 .menu .menu-title:hover {
      background: #0090d5; }
nav.nav-2 .menu-title:hover:before {
  border-top-color: #0090d5; }
nav.nav-2 .menu:hover > .menu-title:before {
  border-top-width: 0;
  transition: 0.2s border-top-width ease-in, 0.3s border-top-color; }
nav.nav-2 .menu-title:after {
  content: "";
  display: block;
  height: 0;
  border-left: 75px solid transparent;
  border-right: 75px solid transparent;
  border-bottom: 0 solid #ebebeb;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 101;
  transition: 0.2s border-bottom ease-in; }
nav.nav-2 .menu:hover > .menu-title:after {
  border-bottom-width: 5px;
  transition: 0.2s 0.2s border-bottom-width ease-out; }
nav.nav-2 .menu-title_2nd {
  background: #4e96b3; }
nav.nav-2 .menu-title_2nd:hover {
  background: #3e86a3; }
nav.nav-2 .menu-title_2nd:before {
  border-top-color: #4e96b3; }
nav.nav-2 .menu-title_2nd:hover:before {
  border-top-color: #3e86a3; }
nav.nav-2 .menu-title_3rd {
  background: #c97676; }
nav.nav-2 .menu-title_3rd:hover {
  background: #b96666; }
nav.nav-2 .menu-title_3rd:before {
  border-top-color: #c97676; }
nav.nav-2 .menu-title_3rd:hover:before {
  border-top-color: #b96666; }
nav.nav-2 .menu-title_4th {
  background: #dbab58; }
nav.nav-2 .menu-title_4th:hover {
  background: #cb9b48; }
nav.nav-2 .menu-title_4th:before {
  border-top-color: #dbab58; }
nav.nav-2 .menu-title_4th:hover:before {
  border-top-color: #cb9b48; }
nav.nav-2 .menu-dropdown {
  min-width: 100%;
  padding: 15px 0;
  position: absolute;
  background: #ebebeb;
  z-index: 100;
  transition: 0.5s padding, 0.5s background; }
nav.nav-2 .menu-dropdown:after {
  content: "";
  display: block;
  height: 0;
  border-top: 5px solid #ebebeb;
  border-left: 75px solid transparent;
  border-right: 75px solid transparent;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 101;
  transition: 0.5s border-top; }
nav.nav-2 .menu:not(:hover) > .menu-dropdown {
  padding: 4px 0;
  background: #dddddd;
  z-index: 99; }
nav.nav-2 .menu:not(:hover) > .menu-dropdown:after {
  border-top-color: #dddddd; }
nav.nav-2 .menu:not(:hover) > .menu-title:after {
  border-bottom-color: #dddddd; }
nav.nav-2 .menu-dropdown > * {
  overflow: hidden;
  height: 30px;
  padding: 5px 10px;
  background: rgba(0, 0, 0, 0);
  white-space: nowrap;
  transition: 0.5s height cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.5s padding cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.5s margin cubic-bezier(0.73, 0.32, 0.34, 1.5), 0.5s 0.2s color, 0.2s background-color; }
nav.nav-2 .menu-dropdown > *:hover {
  background: rgba(0, 0, 0, 0.1); }
nav.nav-2 .menu:not(:hover) > .menu-dropdown > * {
  visibility: hidden;
  height: 0;
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
  color: rgba(25, 25, 25, 0);
  transition: 0.5s 0.1s height, 0.5s 0.1s padding, 0.5s 0.1s margin, 0.3s color, 0.6s visibility;
  z-index: 99; }
nav.nav-2 .hList {
  display: flex;
  padding: 0; }
  nav.nav-2 .hList li {
    width: 25%; }
nav.nav-2 .hList > * + * {
  margin-left: 0; }

article ul.demo3 {
  margin-top: 10rem; }