.clearfloat:after {
  content: '';
  height: 0;
  line-height: 0;
  display: block;
  visibility: hidden;
  clear: both;
}

.hcdivision {
  height: 1px;
  background-color: #eee;
}

/* 帮助中心  -s */
.hcwra,
.hcwra *,
.hcserwra,
.hcserwra * {
  text-align: left;
  font-size: 0;
  box-sizing: border-box;
}

.hcwra span,
.hcwra p,
.hcwra i,
.hcwra textarea,
.hcwra input,
.hcserwra span,
.hcserwra p {
  font-size: 14px;
}

.hcwra {
  background-color: #fff;
  position: absolute;
  width: 360px;
  bottom: 20px;
  right: 20px;
  overflow: hidden;
  display: none;
  box-shadow: 0 2px 24px 0 rgba(191, 191, 191, 0.5);
}

.hctopwra {
  height: 72px;
  background-color: #0088dd;
  padding: 0 16px;
  cursor: move;
  line-height: 72px;
}

.hctopwra > * {
  display: inline-block;
}

.hcbackicon {
  width: 20px;
  height: 20px;
  cursor: pointer;
  margin-right: 10px;
  vertical-align: middle;
  display: none;
}

.hctoprightwra {
  float: right;
}

.hctopicon {
  display: inline-block;
  background-image: url(/uploads/image/images/icons1.png);
  width: 16px;
  height: 16px;
  cursor: pointer;
  margin-left: 20px;
  vertical-align: middle;
}

.hctopiconmax {
  background-position: -4px -4px;
}

.hctopiconmax:hover {
  background-position: -28px -4px;
}

.hctopiconvertical {
  background-position: -100px -4px;
}

.hctopiconvertical:hover {
  background-position: -124px -4px;
}

.hcminiconvertical {
  background-position: -148px -4px;
}

.hcminiconvertical:hover {
  background-position: -4px -28px;
}

.hcminiconfrommax {
  background-position: -52px -4px;
}

.hcminiconfrommax:hover {
  background-position: -76px -4px;
}

.hctopiconclose {
  background-position: -28px -28px;
}

.hctopiconclose:hover {
  background-position: -52px -28px;
}

.hctopspan {
  color: #fff;
  font-size: 16px !important;
  vertical-align: middle;
}

.hcmainwra {
  position: relative;
  height: 528px;
  overflow-x: hidden;
}

.hcmainpage {
  overflow: auto;
  position: relative;
  width: 100%;
  background-color: #fff;
  padding: 16px 16px 0;
}

.hcmainpro {
  display: none;
}

.hcmainbase {
  z-index: 1;
}

.hcsearch {
  height: 40px;
  line-height: 40px;
  padding: 0 32px 0 12px;
  border: 1px solid #ccc;
  position: relative;
  border-radius: 2px;
}

.hcsearch > input {
  vertical-align: middle;
  width: 100%;
  border: none;
  height: 38px;
  line-height: 38px;
}

/*::-webkit-input-placeholder {
  color: #ccc;
}
::-moz-placeholder {
  color: #ccc;
}
:-ms-input-placeholder {
  color: #ccc;
}*/

.hcsearch .clearinput {
  width: 14px;
  height: 14px;
  padding: 11px 6px;
  right: 43px;
  top: 2px;
  cursor: pointer;
  position: absolute;
}

.hcsearch .clearinput b {
  width: 14px;
  height: 14px;
  float: left;
  cursor: pointer;
  line-height: 20px;
  text-indent: -2000px;
  overflow: hidden;
  background: url(/uploads/image/images/icons1.png);
  background-position: -113px -50px;
  border-radius: 20px;
  -webkit-transition: background-color 0.2s ease;
  transition: background-color 0.2s ease;
}

.hcsearchicon {
  width: 19px;
  height: 19px;
  background-image: url(/uploads/image/images/icons1.png);
  position: absolute;
  right: 8px;
  top: 9px;
  background-position: -78px -46px;
  cursor: pointer;
}

.hcsearchhotwra {
  padding: 10px 0 0;
  color: #999;
}

.hcsearchkeywra {
  font-size: 0;
}

.hcsearchkeywra > span {
  cursor: pointer;
  line-height: 22px;
  margin-right: 10px;
  word-break: break-all;
}

.hcsearchkeywra > span:hover {
  color: #0088dd;
}

.hctitlewra > span {
  font-size: 16px;
}

.hctitlewra {
  margin: 16px 0 8px 0;
  position: relative;
}

.hcintwra > span {
  color: #555;
  line-height: 20px;
}

.hcguidejumpwra {
  margin: 6px 0 18px 0;
}

.hcguidejumpwra > * {
  display: inline-block;
  cursor: pointer;
}

.hcguidejumpwra > span {
  color: #0088dd;
  vertical-align: middle;
}

.hcguidejumpicon {
  width: 16px;
  height: 20px;
  background-image: url(/uploads/image/images/icons1.png);
  background-position: -64px -46px;
  vertical-align: middle;
}

.hcproref {
  position: absolute;
  right: 0;
  top: 0;
  color: #0088dd;
  cursor: pointer;
}

.hcproref:hover {
  text-decoration: underline;
}

.hchotproul > li > span {
  color: #555;
  cursor: pointer;
  transition: all 0.3s;
  line-height: 18px;
  display: block;
}

.hchotproul > li {
  margin-bottom: 10px;
}

.hchotproul > li span:hover {
  color: #0088dd;
}

.hcvideowra {
  width: 300px;
}

.hcvideoul > li {
  margin-bottom: 13px;
}

.hcvideoul > li > p {
  margin-bottom: 10px;
}

.hcprotit {
  font-size: 20px !important;
  color: #222;
  line-height: 28px;
  margin-bottom: 15px;
}

.hcproul {
  overflow: auto;
  overflow-x: hidden;
}

.hcproul > li {
  margin-bottom: 15px;
}

.hcprolitit {
  color: #0088dd;
  font-size: 16px !important;
  margin-bottom: 10px;
}

.hcprolicontent {
  color: #555;
  line-height: 20px;
}

.hcprolicontent a,
.hcprolicontent a:link {
  font-size: 14px;
  color: #0088dd;
}

.hcprolicontent a:hover {
  text-decoration: underline;
}

.hcprobottomwra {
  border-top: 1px solid #eee;
  height: 50px;
  line-height: 50px;
  padding: 0 16px;
  cursor: pointer;
  background-color: #fff;
  margin: 0 -16px;
}

.hcprobottomwra > span {
  color: #0088dd;
  margin-right: 5px;
}

.hcprobottomwra > * {
  display: inline-block;
  vertical-align: middle;
}

.hcmainsearch {
  display: none;
}

.hcsearchtit {
  font-size: 16px !important;
  color: #222;
  margin: 15px 0;
}

.hcsearchmemberul > li {
  width: 274px;
  display: inline-block;
  background-color: #fafafa;
  padding: 8px;
  margin-bottom: 15px;
  margin-right: 15px;
  cursor: pointer;
}

.hcsearchmemberul > li > * {
  display: inline-block;
  vertical-align: middle;
}

.hcsearchmemberul > li > img {
  width: 64px;
  height: 64px;
  margin-right: 15px;
  border-radius: 32px;
}

.hcsearchmemberul > li > div > * {
  color: #555;
}

.hcsearchmemberul p {
  width: 178px;
  overflow: hidden;
}

.hcsearchmemberul li:hover {
  background-color: #e6f9ff;
}

.hcsearchgoodsul > li {
  width: 274px;
  display: inline-block;
  background-color: #fafafa;
  padding: 8px;
  margin-bottom: 15px;
  margin-right: 15px;
  cursor: pointer;
}

.hcsearchgoodsul > li > * {
  display: inline-block;
  vertical-align: middle;
}

.hcsearchgoodsul > li > img {
  width: 64px;
  height: 64px;
  margin-right: 15px;
}

.hcsearchgoodsul > li > div > * {
  color: #555;
}

.hcsearchgoodsul li:hover {
  background-color: #e6f9ff;
}

.hcgoodstit {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  width: 178px;
  font-weight: bold;
  color: #222 !important;
}

.hcgoodscode {
  margin: 5px 0;
  width: 178px;
  overflow: hidden;
}

.hcsupplycode {
  margin: 5px 0 1px;
}

.hcsearchquickul {
  overflow: hidden;
  margin-bottom: 12px;
}

.hcsearchquickul > li {
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 10px;
}

.hcsearchquickli {
  cursor: pointer;
  color: #555;
}

.hcsearchquickli a {
  font-size: 14px;
  color: #555;
}

.hcsearchquickli a:hover {
  color: #0088dd;
  text-decoration: none;
}

.hcsearchquickli a:visited {
  color: #555;
  text-decoration: none;
}

.hcsearchquickdivision {
  width: 1px;
  height: 12px;
  background-color: #ccc;
  margin: 0 15px;
}

.hcsearchproul > li {
  margin-bottom: 10px;
}

.hcsearchproul span:hover {
  color: #0088dd;
}

.hcsearchproul > li > span {
  color: #555;
  cursor: pointer;
  line-height: 18px;
  display: block;
}

.hcwramax .hcsearchgoodsul > li {
  width: 280px;
}

.hcwramax .hcsearchmemberul > li {
  width: 280px;
}

/* 帮助中心  -e */

/* 客服 -s */
.hcserwra {
  background-color: #fff;
  width: 256px;
  position: absolute;
  top: 50px;
  right: 20px;
  z-index: 888;
  display: none;
  border: 1px solid #eee;
  box-shadow: 0 2px 8px 0 rgba(191, 191, 191, 0.5);
}

.hcsertop {
  height: 145px;
  color: #fff;
  padding: 24px 16px;
  background-image: ;
}

.hcsertop > p {
  font-size: 16px !important;
}

.hcsertop li.hcseragentinfo {
  height: 36px;
  line-height: 36px;
  font-size: 14px;
  text-indent: 8px;
  overflow: hidden;
}

.hcsertop li.hcseragentinfo span {
  background-image: url(/uploads/image/images/icons1.png);
  font-size: 0;
  width: 12px;
  height: 12px;
  float: left;
}

.hcsertop li span.agentnamepic {
  margin-top: 13px;
  background-position: -94px -64px;
}

.hcsertop li span.agenttelpic {
  margin-top: 13px;
  background-position: -106px -64px;
}

.hcsertopul {
  text-align: center !important;
  margin-top: 20px;
}

.hcsertopul > li {
  text-align: center !important;
  /*display: inline-block;*/
  cursor: pointer;
  float: left;
}

.hcsertopul > li:hover .hcsericon {
  margin-top: -4px;
}

.hcsertopul > li:hover p {
  margin-top: 14px;
}

.hcsertopul > li > div {
  display: inline-block;
}

.hcsertopul > li > p {
  margin-top: 10px;
}

.hcsericon {
  width: 32px;
  height: 34px;
  background-image: url(/uploads/image/images/icons1.png);
}

.hcserwechaticon {
  background-position: 0px -46px;
}

.hcserqqicon {
  background-position: -32px -46px;
}

.hcserul p {
  font-size: 14px;
  color: #222;
}

.hcserul {
  margin-top: 15px;
}

.hcserul > li {
  margin-bottom: 15px;
  padding-left: 16px;
  cursor: pointer;
}

.hcserul > li > * {
  display: inline-block;
  vertical-align: top;
}

.hcserul > li:hover .hcserlitit {
  color: #0088dd;
}

.hcserul > li.hcserlionline:hover .hcsericonheadset {
  background-position: 3px -76px;
}

.hcserul > li.hcserliapp:hover .hcsericonvideo {
  background-position: -22px -76px;
}

.hcserul > li.btnshowfeedback:hover .hcsericonfeed {
  background-position: -48px -76px;
}

.hcserlicontent {
  width: 170px;
  margin-left: 20px;
}

.hcserliicon {
  width: 26px;
  height: 27px;
  background-image: url(/uploads/image/images/icons1.png);
}

.hcsericonheadset {
  background-position: -69px -20px;
}

.hcsericonvideo {
  background-position: -94px -20px;
}

.hcsericonfeed {
  background-position: -120px -20px;
}

.hcserliintro {
  font-size: 12px !important;
  color: #999 !important;
  margin-top: 3px;
  line-height: 20px;
}

.hcserlitit {
  /*font-weight: bold;*/
}

.hcserlitit span.tag-important {
  background: #ff5555;
  border-radius: 2px;
  font-family: pingfangsc-regular;
  font-size: 12px;
  color: #ffffff;
  line-height: 12px;
  font-weight: 400;
  padding: 1px 3px;
  margin-left: 2px;
}

.hcserhovwra {
  background-color: #fff;
  position: absolute;
  width: 230px;
  padding: 16px 16px;
  top: 135px;
  left: 15px;
  border: 1px solid #eee;
  text-align: center !important;
  display: none;
}

.hcserhovwra > img {
  width: 180px;
  height: 180px;
}

.hcserhovwra > * {
  display: inline-block;
}

.hcserhovwra > p {
  margin-top: 10px;
  font-size: 14px !important;
  color: #555;
}

.hcserhovbadge {
  position: absolute;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #fff;
  top: -16px;
  left: 45px;
}

.hcsermyshopappwra {
  background-color: #fff;
  position: absolute;
  width: 350px;
  height: 252px;
  left: -368px;
  top: 85px;
  border-radius: 5px;
  padding: 20px 24px;
  box-shadow: 0 2px 8px 0 rgba(191, 191, 191, 0.5);
  display: none;
}

.hcsermyshopappwra img {
  width: 132px;
  height: 132px;
}

.hcserapptit {
  color: #555;
  font-weight: bold;
}

.hcserappintro {
  font-size: 12px !important;
  color: #999;
  margin: 2px 0 13px 0;
}

.hcserappwra > li {
  display: inline-block;
}

.hcserappwra > li > p {
  text-align: center;
  margin-top: 5px;
}

.hcserappbadge {
  position: absolute;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-left: 8px solid #fff;
  border-right: 8px solid transparent;
  border-bottom: 8px solid transparent;
  right: -16px;
  top: 12px;
}
/* 客服 -e */

/* 在线客服 -s */
.hconlinewra * {
  box-sizing: border-box;
  font-size: 0;
  text-align: left;
}

.hconlinewra {
  position: fixed;
  background-color: #f5fafd;
  width: 656px;
  height: 600px;
  right: 40px;
  bottom: 40px;
  z-index: 999;
  border-radius: 5px;
  overflow: hidden;
  display: none;
  box-shadow: 0px -1px 0px #ededed;
  border-bottom: 1px solid #dcdcdc;
}

#hconlineiframeloading {
  height: 544px;
  background:  no-repeat;
  background-position: bottom;
  padding-top: 176px;
  box-sizing: border-box;
}

#hconlineiframeloading p {
  font-size: 14px;
  color: #555;
  line-height: 20px;
  text-align: center;
}

.hconlinetop {
  cursor: move;
  background-color: #08d;
  height: 56px;
  color: #fff;
  padding: 0 24px;
  font-size: 16px;
  line-height: 56px;
  position: relative;
}

.hconlinetop > span {
  font-size: 16px;
}

.hconlineiframe {
  width: 100%;
  height: 544px;
}

.hconlineminicon {
  width: 24px;
  height: 24px;
  background-image: url(/uploads/image/images/icons1.png);
  position: absolute;
  right: 24px;
  top: 16px;
  cursor: pointer;
  background-position: -25px 0;
}

.hconlinecloseicon {
  width: 24px;
  height: 24px;
  background-image: url(/uploads/image/images/icons1.png);
  position: absolute;
  right: 24px;
  top: 16px;
  cursor: pointer;
  background-position: 0 0;
  display: none;
}
/* 在线客服 -e */

.hconlinedialog {
  width: 228px;
  height: 93px;
  right: 9px;
  top: 52px;
  background: #ffffff;
  border: none;
  box-shadow: 0 2px 8px 0 rgba(191, 191, 191, 0.5);
  padding: 16px;
  display: none;
  position: absolute;
}

.hconlinedialog.on {
  display: block;
}

.hconlinedialog:before {
  width: 0px;
  height: 0px;
  border-width: 10px;
  border-style: solid;
  border-color: transparent transparent #fff transparent;
  position: absolute;
  content: ' ';
  right: 12px;
  top: -20px;
}

.hconlinedialog .canceldialog {
  background: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 2px;
  box-sizing: border-box;
  width: 48px;
  height: 24px;
  float: right;
  cursor: pointer;
  color: #555;
  margin-right: 8px;
  line-height: 24px;
  font-size: 12px;
  text-align: center;
}

.hconlinedialog .closehconline {
  background: #0088dd;
  border-radius: 2px;
  box-sizing: border-box;
  width: 72px;
  height: 24px;
  float: right;
  cursor: pointer;
  color: #fff;
  line-height: 24px;
  font-size: 12px;
  text-align: center;
}

.hconlinetips {
  position: fixed;
  width: 40px;
  height: 86px;
  box-sizing: border-box;
  padding: 36px 10px 14px 10px;
  right: 12px;
  top: 600px;
  background: #f5562b;
  box-shadow: 0 2px 24px 0 rgba(191, 191, 191, 0.5);
  border-radius: 20px;
  font-size: 14px;
  color: #ffffff;
  cursor: pointer;
  z-index: 999;
  text-align: center;
  /*display: none;*/
}

.hconlinetips .helpicon {
  background: url(/uploads/image/images/icons1.png) no-repeat;
  background-position: -144px 0;
  width: 24px;
  height: 24px;
  top: 10px;
  left: 8px;
  position: absolute;
}

.hconlinetips .msgnum {
  position: absolute;
  background: #ff5555;
  color: #fff;
  right: 0;
  top: -9px;
  font-size: 12px;
  height: 18px;
  min-width: 18px;
  border-radius: 50px;
  line-height: 18px;
  padding: 0 3px;
}

/* 兼容移动端 */
@media screen and (max-width: 768px) {
  .hconlinewra {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0 !important;
    border-radius: 0;
  }

  .hconlinetop {
    height: 44px;
    line-height: 44px;
    padding: 0 12px;
    background-color: #ff6727;
  }

  .hconlinetop > span {
    font-size: 14px;
  }

  .hconlineiframe {
    height: 100%;
  }

  .hconlineminicon {
    right: 42px;
    top: 10px;
  }

  .hconlinecloseicon {
    right: 12px;
    top: 10px;
  }

  .hconlinetips {
    display: none;
    width: 40px;
    height: 86px;
    padding: 36px 10px 14px 10px;
    right: 12px;
    top: 600px;
    border-radius: 20px;
    font-size: 14px;
    color: #ffffff;
    cursor: pointer;
    z-index: 999;
    text-align: center;
    display: none;
  }

  .hconlinetips .helpicon {
    background: url(/uploads/image/images/icons1.png) no-repeat;
    background-position: -144px 0;
    width: 24px;
    height: 24px;
    top: 10px;
    left: 8px;
    position: absolute;
  }

  .hconlinetips .msgnum {
    position: absolute;
    background: #ff6727;
    color: #fff;
    right: 0;
    top: -9px;
    font-size: 12px;
    height: 18px;
    min-width: 18px;
    border-radius: 50px;
    line-height: 18px;
    padding: 0 3px;
  }
}

.service-phone {
  width: 502px;
  height: 280px;
  background:  no-repeat;
  background-size: 100% 100%;
  border-radius: 8px;
  position: fixed;
  right: 60px;
  top: 610px;
  padding: 50px 80px;
  z-index: 999;
  display: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}
.service-phone-form {
  /* display: none; */
}
.service-phone-form .service-phone-form-title {
  font-size: 24px;
  line-height: 32px;
  /* identical to box height, or 133% */
  /* text-align: center; */
  /* txt/black 100% */
  color: #111a2e;
}

.service-phone-form-text {
  font-size: 24px;
  line-height: 28px;
  font-family: 'pingfang sc';
  /* txt/black 100% */
  font-weight: bold;
  margin-top: 5px;
  color: #111a2e;
}

.service-phone-form-input input {
  /* //清除input默认样式 */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* //清除input默认样式 */
  width: 100%;
  height: 48px;
  background: #ffffff;
  border: 1px solid #e2e3e5;
  box-sizing: border-box;
  border-radius: 4px;
  padding: 0 16px;
  font-size: 16px;
  line-height: 22px;
  /* txt/black 100% */
  color: #111a2e;
  margin-top: 16px;
}

/* placeholder */
::-webkit-input-placeholder {
  /* //清除input默认样式 */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* //清除input默认样式 */
  font-size: 16px;
  line-height: 22px;
  /* txt/black 100% */
  color: #9ca0a8;
}

/* 输入框光标在输入框里面 边框变色 */
.service-phone-form-input input:focus,
.service-phone-form-input input:focus-visible {
  border: 1px solid #ff6727;
  outline: none;
}

.service-phone-form-input-btn {
  margin-top: 12px;
  padding: 8px 20px;
  background: #ff6727;
  border-radius: 2px;
  font-size: 16px;
  line-height: 24px;
  display: inline-block;
  cursor: pointer;
  color: #fff;
}

.service-phone-success {
  display: none;
  /* display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; */
  margin-top: 40px;
  height: 100%;
}
.service-phone-success-img {
  width: 48px;
  margin: 0 auto;
}

.service-phone-success-img img {
  width: 100%;
}

.service-phone-success-title {
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  text-align: center;
  color: #303849;
  margin-top: 15px;
}