이미지 바뀌는 소스인데 탭메뉴에 적응했더니 잘 안되는데 소스좀 봐주세요

<script>
    var index = 0;   //이미지에 접근하는 인덱스
    window.onload = function(){
        slideShow();
    }
    
    function slideShow() {
    var i;
    var x = document.getElementsByClassName("slide1");
    for (i = 0; i < x.length; i++) {
       x[i].style.display = "none";   //처음에 전부 display를 none으로 한다.
    }
    index++;
    if (index > x.length) {
        index = 1;  //인덱스가 초과되면 1로 변경
    }   
    x[index-1].style.display = "block";  //해당 인덱스는 block으로
    setTimeout(slideShow, 4000);   //함수를 4초마다 호출
}
</script>

<input checked="checked" id="tab1" name="tabs" type="radio" /><!--디폴트 메뉴-->
<label for="tab1">탭메뉴1</label>
<input id="tab2" name="tabs" type="radio" />
<label for="tab2">탭메뉴2</label>


<section id="content1">
    <div class="cgp-panel cgp-1box">
        <div class="cgp-pcontents">
            <div class="cgp-2box float-left">
                <div id="splash-m1" class="splash">
                    <ul class="slides">
                        <img class="slide1" src="/outpage/test1.png" >
                        <img class="slide1" src="/outpage/test2.png" >
                        <img class="slide1" src="/outpage/test3.png" >
                        <img class="slide1" src="/outpage/test4.png" >
                    </ul>
                </div>
            </div>
            <div class="cgp-2box float-right">
                <img src="/img/12345.png" width="404" height="768" alt="그림 설명" />

            </div>
        </div>
    </div>
</section>

<section id="content2">
    <div class="cgp-panel cgp-1box">
        <div class="cgp-pcontents">
            <div class="cgp-2box float-left">
                <div id="splash-m1" class="splash">
                    <ul class="slides">
                        <img class="slide2" src="/outpage/test11.png" >
                        <img class="slide2" src="/outpage/test22.png" >
                        <img class="slide2" src="/outpage/test33.png" >
                    </ul>
                </div>
            </div>
            <div class="cgp-2box float-right">
                <img src="/img/network-1.png" width="404" height="768" alt="그림 설명" />

            </div>
        </div>
    </div>
</section>

var x = document.getElementsByClassName("slide1");
이부분을 바꾸면 한줄 더 추가해서 slide1 에서 slide2로 바꿔서 추가했는데 

이미지가 안바뀌는데 어디를 바꿔주거나 더 추가해줘야 할까요?