@charset "UTF-8";
body {
  background-color: #fff;
  color: #000;
  font-family: 微软雅黑;
  font-size: 14px; }
  body a:link {
    text-decoration: none; }

.leftTab {
  margin-top: 26px; }
  .leftTab .slide-navigation {
    float: left;
    padding: 0 4px; }
    .leftTab .slide-navigation .artist {
      font-size: 24px; }
    .leftTab .slide-navigation .service {
      color: #db2033; }
  .leftTab .artistHome {
    margin-top: -11px; }
  .leftTab .pluginBody {
    text-align: center;
    line-height: 50px;
    border-bottom-color: white;
    font-family: "Microsoft YaHei";
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    background-color: white; }
    .leftTab .pluginBody a {
      display: inline-block;
      width: 195px;
      color: black; }
    .leftTab .pluginBody .onclickMenu {
      color: #FFF;
      background-color: #db2033; }
    .leftTab .pluginBody .slidemenu {
      margin: 1px 0; }
      .leftTab .pluginBody .slidemenu a:hover {
        color: #FFF;
        background-color: #db2033; }

.rightContent {
  line-height: 2.5em;
  padding: 0;
  margin-top: 30px; }
  .rightContent .reback {
    background-color: #db2033;
    color: white;
    margin-top: -6px; }

.noData {
  text-align: center; }

.userSearch {
  height: 80px; }
  .userSearch .text {
    text-align: right; }
    .userSearch .text .artistText {
      font-size: 22px; }
  .userSearch .searchButton {
    margin-top: -1px;
    width: 50px;
    height: 36px;
    background-color: #db2033;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../search.html);
    margin-left: -30px; }

.userPageInfo {
  border: 1px solid #e6e6e6;
  position: relative;
  padding-top: 4px;
  background: #ffffff; }
  .userPageInfo .userInfo .userContainer .userInfoPage .image {
    height: 170px;
    width: 170px; }
  .userPageInfo .alphabetArea {
    border-bottom: 1px solid #e6e6e6;
    overflow: hidden; }
    .userPageInfo .alphabetArea .arrow {
      display: none; }
      .userPageInfo .alphabetArea .arrow .leftArrow {
        background-image: url(../left.html); }
      .userPageInfo .alphabetArea .arrow .rightArrow {
        background-image: url(../right.html);
        margin-left: -1px; }
    .userPageInfo .alphabetArea .alphabetList {
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      padding-left: 32px;
      vertical-align: middle;
      padding-bottom: 5px; }
      .userPageInfo .alphabetArea .alphabetList .alphabetItem {
        display: inline-block;
        min-width: 1.75rem;
        text-align: center;
        cursor: pointer;
        padding: 0px 8px; }
      .userPageInfo .alphabetArea .alphabetList .onclickStyle {
        color: #FFF;
        background-color: #db2033;
        border-radius: 2px; }
      .userPageInfo .alphabetArea .alphabetList .alphabetItem:hover {
        color: #FFF;
        background-color: #db2033;
        border-radius: 2px; }
  .userPageInfo .userInfo {
    margin: 0 20px; }
    .userPageInfo .userInfo .userContainer .userInfoPage {
      padding: 23px 23px;
      /* border-bottom: 1px dashed #ccc; */ }
      .userPageInfo .userInfo .userContainer .userInfoPage .image {
        text-align: center; }
        .userPageInfo .userInfo .userContainer .userInfoPage .image img {
          height: 189px;
          width: 155px; }
      .userPageInfo .userInfo .userContainer .userInfoPage .listInfo {
        padding-left: 0px;
        padding-right: 0px;
        line-height: 2em; }
        .userPageInfo .userInfo .userContainer .userInfoPage .listInfo .userInfoMargin .UserName {
          font-size: 20px;
          color: #333333; }
        .userPageInfo .userInfo .userContainer .userInfoPage .listInfo .userInfoMargin .penNameInit {
          float: left;
          display: inline-block;
          width: 30%; }
        .userPageInfo .userInfo .userContainer .userInfoPage .listInfo .userInfoMargin .penName {
          display: inline-block;
          word-wrap: break-word;
          white-space: normal; }
        .userPageInfo .userInfo .userContainer .userInfoPage .listInfo .styleUser {
          white-space: nowrap;
          color: #555555; }

@media (min-width: 768px) {
  .userInfo {
    margin: 0 20px; }
    .userInfo .userContainer .userInfoPage {
      padding: 23px 30px; }
    .userInfo .userContainer .artistRow {
      border-bottom: 1px dashed #ccc; } }

@media (max-width: 767px) {
  .leftTab {
    margin-top: 0; }
    .leftTab .pluginBody a {
      width: 100%; }
    .leftTab .phone-hidden {
      display: none; }
  .rightContent {
    margin-top: 20px; }
    .rightContent .text {
      text-align: right;
      float: left;
      padding-left: 7px;
      padding-right: 2px; }
      .rightContent .text .artistText {
        font-size: 17px; }
    .rightContent .userSearch {
      height: 50px; }
    .rightContent .inputWidth {
      padding: 0 5px; }
    .rightContent .reback {
      padding: 7px 10px;
      margin-top: -4px; }
  .userPageInfo .alphabetArea {
    overflow: hidden;
    height: 58px; }
    .userPageInfo .alphabetArea .row, .userPageInfo .alphabetArea .col-xs-1, .userPageInfo .alphabetArea .col-xs-10 {
      margin: 0px;
      padding: 0px;
      height: 100%;
      overflow: hidden;
      position: relative; }
    .userPageInfo .alphabetArea .arrow {
      display: block;
      margin-top: 18px;
      padding-left: 9px; }
      .userPageInfo .alphabetArea .arrow span {
        width: 27px;
        height: 30px;
        display: inline-block;
        background-repeat: no-repeat; }
    .userPageInfo .alphabetArea .alphabetList {
      height: 100%;
      padding-top: 10px;
      padding-left: 0px;
      position: relative; }
  .userPageInfo .userInfo {
    margin: 0 20px; }
    .userPageInfo .userInfo .userContainer .userInfoPage {
      margin-left: 0px;
      border-bottom: 1px dashed #ccc; }
      .userPageInfo .userInfo .userContainer .userInfoPage .image img {
        height: 141px;
        width: 116px; } }

@media (min-width: 400PX) and (max-width: 768PX) {
  .userPageInfo .userInfo .userContainer .userInfoPage .image {
    height: 180px;
    width: 180px;
    margin-left: 10px; }
  .userPageInfo .userInfo .userContainer .userInfoPage .listInfo {
    padding-left: 35px; } }

@media (min-width: 320PX) and (max-width: 400PX) {
  .userPageInfo .userInfo .userContainer .userInfoPage .image {
    height: 137px;
    width: 137px; }
  .userPageInfo .userInfo .userContainer .userInfoPage .listInfo {
    padding-left: 20px; } }

@media (min-width: 375PX) {
  .rightContent .text {
    padding-left: 24px; } }
