@charset "utf-8";

@import "../initial";

.sitemenu-wrap-v {
    padding: 10px 0;
    @include clearfix;

    .sitemenu-title {
        display: none;
    }

    .sitemenu-list {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .sitemenu-item.level-1 {
        font-size: 0.8125rem;
        position: relative;
        float: left;
        margin-right: 1%;
        margin-bottom: 12px;
        padding: 8px .8em;
        padding-bottom: 8px;
        color: #fff;
        border-radius: .2em;
        background: $theme-color-second;

        &:hover {
            background: darken($theme-color-second, 10%);
        }
    }

    .sitemenu-link.level-1 {
        margin-right: .25rem;
        color: #fff;
    }

    .sitemenu-dropdown-toggle {
        font-size: 0.75rem;
        padding: 1em 0.3125rem;
        cursor: pointer;
    }

    // sitemenu dropdown
    .sitemenu-list.dropdown-menu {
        min-width: 100%;
        margin-top: 4px;
        border: none;
        border-radius: 0.2em;
        background: darken($color: #B6B4C1, $amount: 40%);
        top: 2.5em;
    }

    .sitemenu-link.level-2 {
        color: #fff;
        font-size: 0.8125rem;
        padding: 4px 0.625rem;

        &:hover {
            background: lighten($theme-color-second, 5%);
        }
    }
}

.sitemenu-horizontal {
    @include clearfix;
  
    .sitemenu-title {
      color: #333333;
      font-family: $main-font;
    }
    .sitemenu-list.level-1 {
      border-top: 2px solid #7c7061;
      border-bottom: 1px solid #7c7061;
      margin: 0;
      display: flex;
      flex-wrap: wrap;
    }
    .sitemenu-item.level-1 {
      font-size: 0.9rem;
      color: #999999;
      margin: 0.8em 0;
    }
  
    .sitemenu-link.level-1 {
      margin-right: .25rem;
      color: #999999;
      padding: 0 1em;
      font-family: $main-font;
      &::before {
        content: "";
        background: url(/assets/icon-g.jpg) 0 4px no-repeat;
        padding: 0 0.5em;
      }
  
      &:hover {
        color: #BE440E;
        &::before {
            content: "";
            background: url(/assets/icon-r.jpg) 0 4px no-repeat;
            padding: 0 0.5em;
        }
      }
    }
  
    .sitemenu-dropdown-toggle {
      font-size: 0.75rem;
      padding: 0.125em .3125rem;
      cursor: pointer;
    }
  
    // sitemenu dropdown
    .sitemenu-list.dropdown-menu {
      min-width: 50%;
      margin-top: 0.25em;
      border: none;
      border-radius: .2em;
      top: auto;
      left: 0;
    }
  
    .sitemenu-link.level-2 {
      color: #333;
      font-size: 0.8125rem;
      padding: 0.25em 0.625rem;
  
      &:hover {
        text-decoration: underline;
        background-color: transparent;
      }
    }
  }