/* ---------------------------
   Amazon風マルチドロップダウン補正CSS
   オリジナルamazonmenu.cssを変更せずに枠内表示
   --------------------------- */

/* メニュー全体を囲む親コンテナ */


/* 親要素の overflow を hidden から visible に変更 */
#amazon-menu-wrapper,
#amazon-menu li div {
    overflow: visible !important;
}

/* z-index を上げて重なり順を確保 */
#amazon-menu li div {
    z-index: 2000 !important;
}



#amazon-menu-wrapper {
    max-width: 800px;        /* 枠の幅に合わせる */
    overflow-x: auto;        /* 横にはみ出したらスクロール */
    box-sizing: border-box;
}

/* 親<li>の位置基準 */
#amazon-menu li {
    position: relative;
}

/* 子メニューの幅を親に合わせる */
#amazon-menu li div {
    max-width: 100% !important;   /* 親幅を超えない */
    overflow-x: auto !important;  /* はみ出した場合スクロール */
    box-sizing: border-box;
    z-index: 1000;
}

/* 多段メニュー（<ul>）の幅も親に合わせる */
#amazon-menu li div ul {
    width: 100% !important;
    max-width: 100% !important;
    white-space: nowrap;          /* 折り返しを防止 */
    box-sizing: border-box;
}

/* レスポンシブ：スマホでは縦に展開 */
@media screen and (max-width: 600px) {
    #amazon-menu li div {
        position: static !important;  /* 横表示ではなく縦に */
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* 必要ならスクロールバーをスタイル調整 */
#amazon-menu-wrapper::-webkit-scrollbar {
    height: 6px;
}
#amazon-menu-wrapper::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 3px;
}
#amazon-menu-wrapper::-webkit-scrollbar-track {
    background: #f9f9f9;
}
