<style>
p{
    position: absolute;
    top:50%;
    left:50%;
    border:1px solid red;
    width:300px;
    height:300px;
    transform: translate(-50%,-50%);
    padding:20px;
}

/* designScroll */
.designScroll{
    position: relative;
    overflow: hidden;
}
.designScroll *{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.designScroll .container{
    position: relative;
    height:100%;
}
.designScroll .container .contents{
    position: absolute;
    top:0;
    left:0;
    width:calc(100% + 14px);
    overflow-y: scroll;
    height: 100%;
}
.designScroll .container .scroll{
    position: absolute;
    top:0;
    right:0;
    width:6px;
    height:100%;
    background: #f9f9f9;
}
.designScroll .container .scroll .bar{
    position: absolute;
    top:0px;
    right:1px;
    background: gray;
    width:4px;
    height:40px;
    border-radius: 4px;
    cursor: pointer;
}
</style>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="//work6.kr/plugin/plugin_link/47"></script>
<script>
$(function(){
    $('.designScroll').designScroll();
});

</script>

<p class="designScroll">
    이용약관
        1. 동해물과 백두산이
        ......
</p>

설치방법

1. Line55 : 제이쿼리를 연결합니다.

2. Line56 : 플러그인 사용하기 후 도메인을 등록 합니다. 코드를 복사 그리고 붙여넣기 합니다.

3. Line13 ~ 52 : 스타일을 복사 그리고 붙여넣기 합니다. 웹 사이트에 맞게 수정 합니다.

4. Line59 : 스크립트를 복사 그리고 붙여넣기 합니다.