모바일크기에 따라 배너이미지가 자연스럽게 변경되야하는데 고정되어져 있습니다 ㅜㅜ

세로값을 지정을 안하면 배너 이미지가 사라지는데...해결 방법이 없을까요?

article{min-height:240px; background:#fff;padding-bottom:20px;}
.visual{width:100%; max-width:1200px;/*height:190px;*/text-align:center;margin:0}
@media all and (min-width:768px){
    .visual{height:345px; width:100%}
}
.visual .visual-slider{width:100%;overflow:hidden;/* margin-top:20px;*/}
@media all and (min-width:768px){
    .visual .visual-slider{height:345px}
}
.visual .visual-panel{width:100%;height:191px;margin:0 auto;position:relative;overflow:hidden}
@media all and (min-width:768px){
    .visual .visual-panel{width:100%;height:310px}
}
.visual .visual-panel img{width:100%;height:191px;}
@media all and (min-width:768px){
    .visual .visual-panel img{width:100%;height:310px}
}