/* カスタマイズ用CSS */
@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: 100%;
    }
    
    .ec-itemNav__nav li ul {
        left: 100%;
        width: 100%;
        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;
    }
    
    .ec-categoryNaviRole__title {
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom: 2px solid #000; /* ← 下線を追加 */
    padding-bottom: 5px; /* 下線との余白調整 */
    }


}


/*tuika*/
/* ロゴのスタイル */
.ec-headerNaviRole__logo img {
    max-width: 150px; /* ロゴの最大幅を設定 */
    height: auto;     /* 高さを自動調整 */
    margin: 0 auto;   /* ロゴを中央に配置 */
}

.ec-productRole__discount {
    margin-top: 10px;
    color: #ff0000; /* 赤色で強調 */
}

.ec-discount-rate {
    font-weight: bold;
    font-size: 16px;
    color: #ff0000; /* 赤色で強調 */
}