@charset "UTF-8";
/* CSS Document */

.topic-rate {
  margin: 5px 5px 0;
  float: right;
  font-size: 0;
}

.topic-rate .wrap,
.topic-rate .gage {
  display: inline-block;
}

.topic-rate .wrap {
  position: relative;
}

.topic-rate .wrap-plus p,
.topic-rate .wrap-minus p {
  width: 60px;
  font-size: 14px;
  line-height: 17px;
  position: absolute;
  left: 50%;
  margin-left: -30px;
  top: -10px;
  text-align: center;
  font-weight: bold;
}

.topic-rate .wrap-plus p {
  color: #FF3344;
}

.topic-rate .wrap-minus p {
  color: #A1A1A1;
}

.topic-rate .wrap .icon-plus {
  padding: 10px;
}

.topic-rate .wrap .icon-minus {
  padding: 10px;
}

.topic-rate .wrap .icon-rate:hover {
  opacity: .7;
  cursor: pointer;
}

.topic-rate .icon-rate .icon-loading {
  display: none;
  margin: 5px;
}

.topic-rate .icon-rate.loading .icon-loading {
  display: block;
}

.topic-rate .icon-rate.loading .btn-rate {
  display: none;
}

.topic-rate .gage {
  width: 144px;
  height: 16px;
  position: relative;
}

.topic-rate .gage .plus,
.topic-rate .gage .minus {
  height: 16px;
}

.topic-rate .gage .plus {
  float: left;
  background: #FFB3BB;
  background-image: -webkit-gradient( linear, left top, left bottom, from(#FFB3BB), to(#FF8791));
  background-image: linear-gradient(-180deg, #FFB3BB 0%, #FF8791 100%);
}

.topic-rate .gage .minus {
  float: right;
  background: #E0E0E0;
  background-image: -webkit-gradient( linear, left top, left bottom, from(#E0E0E0), to(#CCCCCC));
  background-image: linear-gradient(-180deg, #E0E0E0 0%, #CCCCCC 100%);
}

.topic-rate .gage .plus:before,
.topic-rate .gage .minus:after {
  position: absolute;
  content: "";
  width: 2px;
  height: 16px;
}

.topic-rate .gage .plus:before {
  border-radius: 2px 0 0 2px;
  left: -2px;
  background: #FFB3BB;
  background-image: -webkit-gradient( linear, left top, left bottom, from(#FFB3BB), to(#FF8791));
  background-image: linear-gradient(-180deg, #FFB3BB 0%, #FF8791 100%);
}

.topic-rate .gage .minus:after {
  border-radius: 0 2px 2px 0;
  right: -2px;
  background: #E0E0E0;
  background-image: -webkit-gradient( linear, left top, left bottom, from(#E0E0E0), to(#CCCCCC));
  background-image: linear-gradient(-180deg, #E0E0E0 0%, #CCCCCC 100%);
}

.topic-rate .num-plus {
  color: #FF8E9A;
}

.topic-rate .num-minus {
  color: #BFBFBF;
}

.topic-comments {
  padding: 0;
  background: #FFF;
}

.pm-guide img {
  display: block;
  margin: 0 auto;
}

.disabled {
  opacity: .5;
}

.flc:after {
  content: "";
  clear: both;
  display: block;
}

#topics_mid li {
  padding: 15px 0 4px;
}

/*res*/
span.res-anchor,
a.res-anchor {
  color: #808080;
  cursor: pointer;
  text-decoration:none;
}
.comment_lv1 span.res-anchor,
.comment_lv1 a.res-anchor {
  color: #FF8C98;
}
.res-wrap {
  position: absolute;
  width: 440px;
  background: #F0F8FF;
  border: 1px solid #DDE;
  border-radius: 4px;
  z-index: 10;
}

.res-wrap .head {
  font-size: 12px;
  color: #807D7D;
  line-height: 18px;
  margin-bottom: 4px;
}

.res-wrap:before {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 20px;
  margin-left: -9px;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 9px 9px 0 9px;
  border-color: #F0F8FF transparent transparent transparent;
  z-index: 12;
}

.res-wrap:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 20px;
  margin-left: -10px;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 10px 10px 0 10px;
  border-color: #DDE transparent transparent transparent;
  z-index: 11;
}

.res-wrap .res-scroll {
  overflow: scroll;
  overflow-x: hidden;
  max-height: 200px;
  margin: 10px 20px;
}

.res-wrap .close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
}

.res-wrap .url_box_title {
  width: auto;
}

.comment_head_text a {
  color: #807d7d;
  text-decoration: none;
  vertical-align:middle;
}

#topics_comment ul li:nth-child(2) {
  margin-bottom: 0;
}
#topics_comment ul li.caution {
  color: #999;
  margin-bottom:20px;
}