Imagem beneficios / box-shadow não funciona

Benefícios

                    <div class="conteudo-beneficios">
                        <ul class="lista-beneficios">
                            <li class="itens">Atendimento aos Clientes</li>
                            <li class="itens">Espaço diferenciado</li>
                            <li class="itens">Localização</li>
                            <li class="itens">Profissionais Qualificados</li>
                            <li class="itens">Pontualidade</li>
                            <li class="itens">Limpeza</li>
                        </ul><img src="beneficios.jpg" class="imagem-beneficios">
                    </div>    


                    <div class="video">
                          <iframe width="560" height="315" src="https://www.youtube.com/embed/D_aih32YzGM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

                    </div>
                </section>





                .Beneficios { background: #FFFFFF;
padding: 20px;

}

ul{ display: inline-block; vertical-align: top; width: 20%; margin-right: 15%;}

.imagem-beneficios{ width: 60%; opacity: 1; transition: 400ms; box-shadow: 10px 10px 10px 0 #000000; }

.imagem-beneficios:hover{ opacity: 30%;

}