그누보드 슬라이드 생성

안녕하세요 초보 사용자 입니다.

그누보드 베이직 테마에 슬라이드베너를 추가하기 위해 커뮤니티 테마에서 index.php와 css.php있는내용을 

베이직 테마 폴더에 적용하였습니다.

적용은

css.php에 

/*메인배너*/

#main_bn_box{border:1px solid #e8e8e8;margin-bottom:45px;width:900px;height:320px;overflow:hidden}

#main_bn {position:relative;overflow:auto;width:100% !important}

#main_bn .bn_ul{margin:0;padding:0}

#main_bn .bn_ul li{float:left;list-style:none}

#main_bn li .bn_wr{}

#main_bn .dots{position:absolute;bottom:10px;text-align:center;width:90%}

#main_bn .dots li{cursor:pointer;margin-right:10px;text-indent:-9999px;width:10px;height:10px;border-radius:50%; background:#2c68b0;overflow:hidden;display:inline-block;zoom:1; *display:inline /*IE7 HACK*/; _display:inline; /*IE6 HACK*/}

#main_bn .dots li.active{background:#fda100}

를 추가 하였고 index.php에

<!--메인배너 {-->

<div id="main_bn_box">

    <div id="main_bn">

        <ul class="bn_ul">

            <li class="bn_bg1">

                <div class="bn_wr"><a href="#none"><img src="<?php echo G5_THEME_IMG_URL ?>/main_banner.png" alt="메인베너" /></a></div>

            </li>

            <li class="bn_bg1">

                <div class="bn_wr"><a href="#none"><img src="<?php echo G5_THEME_IMG_URL ?>/main_banner.png" alt="메인베너" /></a></div>

            </li>

            <li class="bn_bg1">

                <div class="bn_wr"><a href="#none"><img src="<?php echo G5_THEME_IMG_URL ?>/main_banner.png" alt="메인베너" /></a></div>

            </li>

            <li class="bn_bg1">

                <div class="bn_wr"><a href="#none"><img src="<?php echo G5_THEME_IMG_URL ?>/main_banner.png" alt="메인베너" /></a></div>

            </li>

        </ul>

    </div>

</div>

<!--} 메인배너-->

를 추가하였습니다. img파일에 동일한 파일이름의 이미지가 있습니다. 

js폴더를 복사하여 베이직 테마에 옮겨 주었구요 그런데 결과가

이렇게 나옵니다. 

무엇을 더 손보면 슬라이드가 완벽하게 적용 될까요?

추가로 저 슬라이드 메인 베너 아래 또하나의 같은 슬라이드 베너를 만들려면 어떻게 해야하나요?

고수님들 제발 도와주세요 흑흑