/**
    -----------------
    2017-11-22 정현승
    -----------------
    << TIP >>
    - 대메뉴바의 높이를 조정하려면 .ps-mega-lg-item 의 line-height 값을 조정할 것
    - 대메뉴에 마우스를 올렸을 때 화면에 표시되는 중메뉴 컨테이너가 대메뉴바와 분리되게 하려면 @mega-position: static; 으로 변경할 것
 */
 @mega-position: relative;
 @mega-zIndex: 1;
 @mega-cursor: pointer;

 @mega-lg-justify-contents: center;
 @mega-lg-font-color: @primary-3;
 @mega-lg-container-bg: @primary-6;
 @mega-lg-inner-bg: transparent;
 @mega-lg-font-color-hover: @white;
 @mega-lg-bg-hover: @primary-7;
 @mega-lg-font-size: @font-size-base;

 @mega-md-justify-contents: center;
 @mega-md-font-color: @primary-5;
 @mega-md-container-bg: @white;
 @mega-md-inner-bg: transparent;
 @mega-md-font-color-hover: @primary-6;
 @mega-md-bg-hover: @primary-1;
 @mega-md-font-size: @font-size-lg;

 @mega-sm-font-color: @primary-5;
 @mega-sm-inner-bg: transparent;
 @mega-sm-font-color-hover: @primary-9;
 @mega-sm-bg-hover: @primary-2;
 @mega-sm-font-size: @font-size-base;

 .ps-mega-menu {
    // z-index: 30101;
    position: relative;
    > ul {
        margin: 0;
        list-style: none;
        white-space: nowrap;
        > li {
             display: inline-block;
             margin: 0;

            > a {
                 display: inline-block;
                 padding: 0 15px;
                 color: inherit;
                 font-size: 15px;
                 text-align: center;
                 text-transform: uppercase;
                 // line-height: 40px;
                 text-decoration: none;
             }

             >.ps-mega-submenu {
                 list-style: none;
                 display: none;
                 z-index: 1050;
                 min-width: 100px;
                 padding: 0;
                 margin: 0;
                 background-color: #FFF;
                 position: absolute;
                 top: 100%;
                 overflow: visible;
                 box-shadow: rgba(0,0,0,.5) 0 3px 4px -1px, rgba(0,0,0,.0980392) 0 4px 5px 0, rgba(0,0,0,.0823529) 0 1px 10px 0;

                 >.ps-mega-submenu-container {
                    > ul {
                         list-style: none;
                         // overflow-y: auto;
                         max-width: 677px;
                         min-height: 300px;
                         height: 100%;
                         width: 180px;
                         padding: 5px 0;
                         border-right: solid 1px #333;

                        > li {
                             margin: 0;
                             width: auto;
                             float: none;
                             display: block;

                            > a {
                                 display: block;
                                 width: auto;

                                > i {
                                     display: block;
                                     float: right;
                                 }
                             }

                            > .ps-mega-submenu-sub-container {
                                 position: absolute;
                                 width: 366px;
                                 left: 180px;
                                 top: 0;
                                 right: 0;
                                 bottom: 42px;
                                 background-color: #FFF;
                                 display: none;
                                 box-shadow: rgba(0,0,0,.5) 0 3px 4px -1px, rgba(0,0,0,.0980392) 0 4px 5px 0, rgba(0,0,0,.0823529) 0 1px 10px 0;

                                 >.sub-menu-title {
                                     color: #333;
                                     font-size: 16px;
                                     font-weight: bold;
                                 }

                                > ul {
                                     list-style: none;
                                     padding: 0;
                                     margin: 0;
                                     position: absolute;
                                     left: 0;
                                     width: 100%;
                                     top: 40px;
                                     bottom: 0;
                                     overflow-y: auto;

                                    > li {
                                         float: left;
                                         width: 165px;
                                     }
                                 }
                             }
                         }
                     }
                 }
             }

            > .ps-mega-full-menu {
                 list-style: none;
                 display: none;
                 z-index: 1050;
                 min-width: 165px;
                 padding: 0;
                 margin: 0;
                 background-color: #FFF;
                 position: absolute;
                 top: 100%;
                 overflow: visible;
                 box-shadow: rgba(0,0,0,.5) 0 3px 4px -1px, rgba(0,0,0,.0980392) 0 4px 5px 0, rgba(0,0,0,.0823529) 0 1px 10px 0;

                > .ps-mega-submenu-container {
                    > ul {
                         list-style: none;
                         padding: 0;
                         // max-width: 677px;
                         max-height: 654px;
                         width: 720px;
                         overflow-y: auto;
                         display: flex;
                         flex-wrap: wrap;

                        > li {
                             margin: 0 0 15px;
                             width: 180px;
                             // float: left;
                             // display: block;
                             flex: auto;

                            > a {
                                 display: none;
                             }
                            > a.sub-menu-title {
                                 display: block;
                                 color: #333;
                                 font-size: 16px;
                                 font-weight: bold;
                                 padding: 10px 15px;
                                 text-transform: uppercase;
                                 line-height: 20px;
                             }

                            > .ps-mega-submenu-sub-container {
                                 display: block;

                                 >.sub-menu-title {
                                     margin: 0;
                                     color: #333;
                                     font-size: 16px;
                                     font-weight: bold;
                                     padding: 10px 15px;
                                     text-transform: uppercase;
                                     line-height: 20px;
                                 }

                                > ul {
                                     list-style: none;
                                     padding: 0;
                                     margin: 0;

                                    > li {
                                         display: list-item;
                                         text-align: -webkit-match-parent;
                                     }
                                 }
                             }
                         }
                     }
                 }
             }
         }
     }
 }
