css 부분 문의 드립니다. 마우스 오버시 채택완료

/* 메인 상품 목록 스킨 10 */ .smt_20 {position:relative;overflow-y:hidden} .smt_20 .sct_ul {position:absolute;top:0;left:0;margin:0;padding:0;list-style:none} .smt_20 .sct_ul_first {display:block;top:0} .sct_10 .sct_li {position:relative;float:left;margin:-1px 0 0 -1px;padding:10px;border:1px solid #ccc;}  .sct_10 .sct_last {margin:-1px 0 0 !important}  .sct_10 .sct_clear {clear:both}  .sct_10 .sct_a {display:inline-block;position:relative;text-decoration:none}  .sct_10 .sct_a:focus, .sct_10 .sct_a:hover {text-decoration:none}  .sct_10 .sct_img {margin:0 0 10px;}  .sct_10 .sct_txt {margin:0 0 5px;text-align:center;}  .sct_10 .sct_icon {margin:0 0 10px;text-align:center;}  .sct_10 .sct_id {display:block;margin:0 0 5px;text-align:center;}  .sct_10 .sct_basic {margin:0 0 10px;text-align:center;}  .sct_10 .sct_cost {margin:0 0 10px;font-weight:bold;text-align:center;}  .sct_10 .sct_cost strike {margin:0 0 5px;padding:0 0 10px;color:#999;font-weight:normal}  .sct_10 .sct_sns {text-align:center;}  .scr_10 .sct_li {position:relative;float:left;margin:0 25px 15px 0} .scr_10 .sct_last {margin:0 0 15px !important} .scr_10 .sct_clear {clear:both} .scr_10 .sct_a {display:inline-block;position:relative;text-decoration:none} .scr_10 .sct_a:focus, .sct_10 .sct_a:hover {text-decoration:none} .scr_10 .sct_img {margin:0 0 10px} .scr_10 .sct_txt {margin:0 0 5px} .scr_10 .sct_icon {margin:0 0 10px} .scr_10 .sct_id {display:block;margin:0 0 5px} .scr_10 .sct_basic {margin:0 0 10px} .scr_10 .sct_cost {display:block;margin:0 0 10px;font-weight:bold} .scr_10 .sct_cost strike {display:block;margin:0 0 5px;color:#999;font-weight:normal} .scr_10 .sct_sns {}

위 style 을 복사 해서 넣었는데...

마우스 오버시 강조기능을 넣고 싶은데.. 부탁드립니다.

마우스가 올라갔을때 테두리가 빨간색으로 바뀌는것을 어디를 수정하면될까요? ㅠㅠ

하나하나 하면서 배워가긴 하는데 너무 힘들군요.ㅠㅠ

또한가지는 아래사진과같이

맨우측 상품의 좌측선만 두껍습니다. 선이 겹치지않고 떨어져있어서 선이 2개로 보이는듯한데.

어디를 수정하면 한줄로 보일까요?