body {
  font-family: "Microsoft YaHei", Arial, Helvetica, sans-serif, "\5B8B\4F53";
  background: #f0f0f0;
}
.pcviewer {
  margin-top: 20px;
  width: 0;
  left: 50%;
  margin-left: -550px;
  position: relative;
}
.pcviewer-infoarea {
  width: 360;
  height: 500px;
}
.pcviewer-infoarea-titlearea {
  width: 360;
  height: 140px;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.1);
  background: white;
}
.pcviewer-infoarea-titlearea-info {
  height: 120px;
  width: 340;
  background: #f2f2f2;
  position: relative;
  top: 10px;
  left: 10px;
}
.pcviewer-infoarea-titlearea-info-thum {
  width: 100px;
  height: 100px;
  position: absolute;
  left: 10px;
  top: 10px;
}
.pcviewer-infoarea-titlearea-info-title {
  width: 210px;
  height: 25px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 25px;
  position: absolute;
  right: 10px;
  top: 10px;
  line-height: 19px;
  text-align: left;
  font-size: 14px;
  color: #4a4a4a;
  font-family: Microsoft YaHei;
}
.pcviewer-infoarea-titlearea-info-desc {
  width: 210px;
  overflow: hidden;
  position: absolute;
  right: 10px;
  top: 32px;
  line-height: 20px;
  text-align: justify;
  font-size: 12px;
  color: #959595;
  font-family: Microsoft YaHei;
  max-height: 80px;
  text-overflow: ellipsis;
}
.pcviewer-infoarea-qrcodearea {
  margin-top: 10px;
  width: 360;
  height: 150px;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.1);
  background: white;
  position: relative;
}
.pcviewer-infoarea-qrcodearea-img {
  width: 130px;
  height: 130px;
  position: absolute;
  top: 10px;
  left: 10px;
}
.pcviewer-infoarea-qrcodearea-warn {
  position: absolute;
  top: 38px;
  left: 160px;
  width: 163px;
  height: 76px;
  line-height: 25px;
  text-align: left;
  font-size: 12px;
  color: #959595;
  font-family: Microsoft YaHei;
}
.pcviewer-previewarea {
  width: 550px;
  height: 780px;
  position: absolute;
  top: 0;
  left: 370px;
  background: white;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.1);
}
.pcviewer-previewarea-iframe {
  position: absolute;
  width: 472px;
  height: 740px;
  left: 10px;
  top: 10px;
  border: 0;
  outline: 0;
}
.pcviewer-previewarea-upBtn {
  position: absolute;
  right: 5px;
  width: 45px;
  top: 50%;
  margin-top: -200px;
  height: 200px;
  cursor: pointer;
}
.pcviewer-previewarea-upBtn-triangle {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -8px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 16px solid #d8d8d8;
}
.pcviewer-previewarea-upBtn:hover .pcviewer-previewarea-upBtn-triangle {
  border-bottom: 16px solid #3abaaa;
}
.pcviewer-previewarea-downBtn {
  position: absolute;
  right: 5px;
  width: 45px;
  top: 50%;
  height: 200px;
  cursor: pointer;
}
.pcviewer-previewarea-downBtn-triangle {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -8px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 16px solid #d8d8d8;
}
.pcviewer-previewarea-downBtn:hover .pcviewer-previewarea-downBtn-triangle {
  border-top: 16px solid #3abaaa;
}