.nav-list{
  max-width:1648px;
  margin-left:auto;
  margin-right:auto;
  padding-top:39px;
}
.nav-list-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  overflow-x:auto;
  overflow-y:hidden;
  width:100%;
}
.nav-list-unit{
  width:186px;
  flex:none;
  margin-left:22px;
  position:relative;
  cursor:pointer;
}
.nav-list-unit:first-of-type{
  margin-left:0;
}
.nav-list-unit img{
  width:100%;
}
.nav-list-unit-img{
  position:relative;
  z-index:10;
}
.nav-list-unit-img-hover{
  opacity:0;
  position:absolute;
  z-index:99;
  transition:0.5s;
  left:0;
  top:0;
}
.nav-list-unit-active .nav-list-unit-img-hover{
  opacity:1;
}
@media (min-width:768px){
  .nav-list-unit-img-hover:hover{
    opacity:1;
  }
  @-moz-document url-prefix() {
    .nav-list-inner{
      scrollbar-width: auto;
      scrollbar-color: rgba(0, 0, 0,0.3) transparent;
    }
  }
  .nav-list-inner::-webkit-scrollbar{
    width:10px;
    height:10px;
  }
  .nav-list-inner::-webkit-scrollbar-button{
    display:none;
  }
  .nav-list-inner::-webkit-scrollbar-track{
    background: rgba(0, 0, 0,0.3);
    border-radius:1vw;
  }
  .nav-list-inner::-webkit-scrollbar-thumb{
    background: rgba(82, 137, 145,0.3);
    border-radius:1vw;
  }
  .nav-list-inner::-webkit-scrollbar-thumb:hover{
    background: rgba(82, 137, 145,0.5);
  }
  .nav-list-inner::-webkit-scrollbar-corner {
    background: rgba(0, 0, 0,0.3);
  }
}
@media (max-width:767px){
  .nav-list{
    padding-top:2.13vw;
  }
  .nav-list-unit{
    width:27.47vw;
    margin-left:2.53vw;
  }
}