html,body,#wrapper{height:100%;background:#b2c7d9}


.chatWrap{width:100%;margin:0px auto;height:100%;float:none;background:#b2c7d9;max-height:700px;}/* max-height 값으로 최대 높이 지정 */
@media (min-width: 768px){
	.chatWrap{width:360px;}
}

.chatWrap>.row{height:100%;}

/* 상단 헤더 */
.chatHeader {background:#a9bdce;padding:15px;position:absolute;left:0px;top:0px;z-index:9999;}
.chatHeader .chatThumb{border:1px solid #eee;width:50px;height:50px;border-radius:100px;overflow:hidden;display:inline-block;vertical-align:middle;}
.chatHeader .closeBtn{background:none;}
.chatHeader .userName{font-weight:bold;}

.chatBody{height:100%;position:absolute;top:0px;left:0px;box-sizing:border-box;padding:100px 0px 60px;} /* padding-bottom 으로 하단 영역 설정 */
.chatBody .chatScroll{/*border:1px solid green;*/overflow-y:auto;height:100%;}

.chatInput{overflow:hidden;position:relative;padding:10px 15px 0px;border-top:1px solid #99adbe;}
.chatInput .chatTextbox{width:100%;padding-right:85px;float:left;}
.chatInput .chatButton{position:absolute;right:15px;width:80px;}
.chatInput .chatButton .btn{width:100%;}


.chatScroll .chatBdu,.chatScroll .chatUser{clear:both;position:relative;overflow:hidden;padding:10px ;}
.chatScroll .chatBdu>*,.chatScroll .chatUser>*{display:inline-block;}
.chatScroll .chatTime{vertical-align:bottom;font-size:11px;}
.chatScroll .chatPhoto{border:1px solid #eee;width:40px;height:40px;border-radius:100px;overflow:hidden;display:inline-block;vertical-align:top;}
.chatScroll .chatComment{min-height:50px;box-sizing:border-box;max-width:195px;font-size:12px;}
.chatScroll .chatComment .userName{font-size:11px;margin:0px 5px 5px;}
.chatScroll .chatComment .box{box-sizing:border-box;padding:10px;border-radius:3px;margin:0px 5px;box-shadow:1px 1px 5px rgba(0,0,0,.1), 1px 1px 5px rgba(0,0,0,.1);margin-bottom:10px;}
.chatScroll .chatBdu .chatComment .box{background:#fff;}
.chatScroll .chatUser .chatComment .box{background:#ffeb33;text-align:left;}
.chatScroll .chatUser{text-align:right;}

/* 버튼 처리 */
.chatScroll .chatComment .buttonWrap{padding:5px;}
.chatScroll .chatComment .buttonWrap .btn{width:100%;border-radius:0px;background:#fff;border:1px solid #eee;font-size:12px;margin-top:-1px;}

/* 로딩 효과 */
.chatScroll .chatBdu .loadingMessage{text-align:center;overflow:hidden;position:relative;height:50px;height:20px;}
.chatScroll .chatBdu .loadingMessage img{width:50px;position:absolute;top:-10px;}

/* 스크롤 다운 버튼 */
.scrollDownBtn{position:absolute;right:10px;bottom:80px;z-index:9999;}
.scrollDownBtn .btn{border-radius:100px;display:none;}