Bordas e sombreamentos no submenu

Olá, boa tarde.

Cá estou de novo com uma duvida sobre meu menu. Estou fazendo um menu pro meu site, e estou com um novo problema.

Eu preciso que o menu tenha essa borda aqui no sub-menu

/applications/core/interface/imageproxy/imageproxy.php?img=https://static.wixstatic.com/media/92a8cb_b2d9916cc5a341a7a651770e35a0508c.jpg/v1/fill/w_660,h_372,al_c,q_80,usm_0.66_1.00_0.01/92a8cb_b2d9916cc5a341a7a651770e35a0508c.jpg&key=079d7fe10915bbb5f4be84300b461fef281230477697f5c22913114dfd739afc" alt="92a8cb_b2d9916cc5a341a7a651770e35a0508c." />

PORÉM, a borda que eu coloquei, está com uma falha, veja:

/applications/core/interface/imageproxy/imageproxy.php?img=https://static.wixstatic.com/media/92a8cb_8cb4c6ed4c12418bb3e228af25d17e19.jpg/v1/fill/w_660,h_373,al_c,q_80,usm_0.66_1.00_0.01/92a8cb_8cb4c6ed4c12418bb3e228af25d17e19.jpg&key=61056517b8e15a20d4b4cd07343e934ae84d13023354f6d1766e1ad61aa79498" alt="92a8cb_8cb4c6ed4c12418bb3e228af25d17e19." />

percebe que a box shadow está distante do começo do lado esquerdo do submenu?

Então, o que eu posso fazer?

Segue o codigo css

ul {list-style:none;width:350px;float: left; }

ul li {
position:relative; }

ul li a {

display:block;
list-style: none;
background: transparent;
color: #072D18;
font-family: Calibri, serif;
text-decoration: none;
padding: 40px;
border-style: solid;
border-bottom-width: 1px;
border-top-width: 1px;
border-right-width: 0;

border-left-width: 0;}

ul li:nth-child(1) {

border-top: 1px solid #072D18;
}

ul li:nth-child(3) {

border-bottom: 1px solid #072D18;
}

ul li a:hover {

background: #a3a3a3;
transition-duration: 0.5s;
}

ul li ul {
display:none;
position: absolute; }

ul li:hover ul {

display:block;
position:absolute;
left: 308px;
top: -1px;
min-width: 100%;
box-shadow: 0 1px 2px #333 ;
-webkit-box-shadow: 0 1px 2px #333;
-moz-box-shadow: 0 1px 2px #333;
}