Переносится на новую строку [требует правки]

Скелет бы глянуть... Но если навскидку, то если вы пользуетесь для расстановки display:inline-block, то следует учесть что даже если блок-родитель 300px шириной и в нем находятся 3 блока по 100px, то последний блок будет переноситься. Все это происходит потому что inline-block добавляет небольшой отступ к себе, если между тегами в коде есть пробелы или знак переноса.
В таком случае есть несколько вариантов:
1. сократить ширину у блоков, например до 98px.
2. добавить отрицательный margin у них по горизонтали.
3. использовать float:left

{ 
    float:left; 
    width: calc(33.33% - 7px); // чтобы все элементы занимали ровно 1/3 родителя + отступы
    margin-left: 10px;
    box-sizing: border-box; // чтобы border не увиличивал размеры блока
}

У первого элемента надо убрать отступ в таком случае

:first-child {
   margin-left: 0;
}

Надо убрать лишние картинки привести html к виду:

<div class="images">
  <div class="image">
    <img src="#" alt="">
  </div>
  <div class="image">
    <img src="#" alt="">
  </div>
  <div class="image">
    <img src="#" alt="">
  </div>
</div>

добавьте с CSS запись:

@media (max-width: 360px)
{
    .images .image:nth-of-type(3n+1) {
        margin-right: 0!important;
    }
}

Для div.image применить стили, которые раньше были у тега li.

пояснения. Медиа запрос - чтобы только с мобильников это работало, чтобы ничего на пк не сыпалось. nth-of-type - обращается к каждому третьему div внутри родителя и убирает у него отступ справа.

Если вас ваш код устраивает, можно просто вбить костыль. Просто добавить div-обертку для картинок и прописать в css:

@media (max-width: 360px)
{
    div.div-обертка .site-header__menu:nth-of-type(5) li,
    div.div-обертка .site-header__menu:nth-of-type(11) li {
        margin-right: 0!important;
    }
}

Будет работать с вашим теперешним невалидным кодом.

Вот замени "margin-right: 10px", на "margin-right: 8px" вот тут:

#block-img-slide li {
width: 80px;
padding: 3px;
margin-top: 10px;
margin-right: 10px;
border: 1px solid #DBDBDB;
cursor: pointer;
} 

У тебя там они по ширине не влезают. Отступ margin-right то же учитывается.
* А вообще, не ленись и пропиши media

Есть несколько предположений:
1. Родитель элементов не имеет 100% ширину
2. Элемент не влазит, так как сумма width+margin-left+margin-right+padding-left+padding-right+border-left+border-right больше, чем свободного места. Если в этом дело, то тут может помочь свойство box-sizing: border-box;

Чтобы дать точнее ответ, выложите сайт на онлайн ресурс или код