/* カスタマイズ用CSS */

/* ヘッダー背景色変更CSS */
.ec-headerRole {
  background: #000000;
  }
  
  /* サイト全体の背景色変更 */
.ec-layoutRole {
  background: #FFFFFF;
}

@media only screen and (min-width: 768px) {
    /*カテゴリ縦も並べる*/
    .ec-itemNav__nav {
        display: flex;
        flex-direction: column;
    }
    
    /*文字を左寄せ*/
    .ec-itemNav__nav li a {
        text-align: left;
    }
    
    /*カテゴリの位置と横幅調整*/
    .ec-itemNav__nav li ul li ul,
    .ec-itemNav__nav li ul li:hover ul li {
        width: 80%;
    }
    
    .ec-itemNav__nav li ul {
        left: 80%;
        width: 80%;
        top: 0;
    }
    
    /*背景色、文字サイズ調整*/
    .ec-itemNav__nav > li:hover > a {
        background-color: #eee;
    }
    
    .ec-itemNav__nav li a,
    .ec-itemNav__nav li ul li a {
        font-size: 14px;
        padding: 12px;
    }
}