.sub-tab-menu {
  width:100%; position: absolute;bottom:0; left:0; background:rgba(98,134,254,0.4); height:46px;
  > ul {
    width:1200px; margin:0 auto;
    > li {
      float:left; position: relative;
      > a {
        color:#fff; font-size:1.4rem; font-weight:400; display: block;padding: 15px 50px 15px 25px; width:240px;border-right:1px solid rgba(255,255,255,0.2); transition:background .3s ease; text-align:left; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; font-weight:500;
        &:hover {
          background:rgba(98,134,254,0.4);
        }
      }
      &:first-child > a {
        padding:23px 25px; border-left:1px solid rgba(255,255,255,0.1); position: relative; top:-2px; width:auto;
        img {
          position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); width:23px; height:20px;
        }
      }
      &:hover > ul.depth03 {
        opacity:1; z-index:1;
      }
      > ul.depth03 {
        position: absolute;top:100%; left:0;background:rgba(0,0,0,0.7); width:100%; opacity:0; z-index:-2; transition: opacity .3s ease, z-inedx .3s ease;
        > li {
          border-bottom: 1px solid rgba(255,255,255,0.2);          
          > a {
            color:#fff; display: block;padding:15px 25px; transition: background .3s ease;
            &:hover {
              background:rgba(98,134,254,0.4);
            }
          }
        }
      }
      
      img.arrow {
        position:absolute; right:10px; top:50%; transform: translateY(-50%);
      }
    }
  }
}

@media(max-width:1200px) {
  .sub-tab-menu {
    > ul {
      width:100%;
    }
  }
}

@media(max-width:768px) {
    .sub-tab-menu {
      > ul {
        > li {
          width:50%;
          &:first-child {
            display:none;            
          }
          > a {
            width:auto
          }
        }
      }
    }
  
}

@media(max-width:500px) {
  .sub-tab-menu {
    > ul {
      > li {
        > a {
          font-size:1.3rem; padding: 15px 40px 15px 20px;
        }
        > ul.depth03 {
          > li {
            > a {
              padding:10px 20px
            }
          }
        }
      }
    }
  }    
}
