/*******上云*****/
.grades {
  margin-top: 15px;
  background: url(../images/proUpCloud/probg.jpg) no-repeat bottom center;
  padding-bottom: 68px;
}
.grades dl {
  box-shadow: 0 0 12px #ddd;
  float: left;
  padding-bottom: 82px;
  position: relative;
  min-height: 667px;
  margin-top: 20px;
}
.grades dl dt {
  height: 80px;
  background: linear-gradient(to right, #2d81ff, #4dc4fb);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: normal;
}
.grades dl dt span {
  font-size: 20px;
  color: #fff;
  padding-left: 30px;
}
.grades dl dt .star {
  padding-right: 20px;
}
.grades dl dt .star i {
  background: url(../images/proUpCloud/star.png) no-repeat center center;
  width: 12px;
  height: 12px;
  display: inline-block;
  margin: 0 4px;
}
.grades dl dd {
  padding: 0 30px;
  float: left;
  width: 100%;
}
.grades dl dd.t1 {
  border-bottom: #eee solid 1px;
  height: 58px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.grades dl dd.t1 span {
  font-size: 14px;
  color: #4c525b;
}
.grades dl dd.t1 span em {
  color: #ff7e00;
}
.grades dl dd.t1 a {
  color: #2d81ff;
  font-size: 14px;
}
.grades dl dd.t1 a:hover {
  color: #428eff;
}
.grades dl dd.t2 {
  margin: 17px 0 3px;
  padding-left: 60px;
  line-height: 30px;
  background: url(../images/proUpCloud/pro-ico01.png) no-repeat 30px 5px;
}
.grades dl dd.t2 span {
  color: #333840;
}
.grades dl dd.t5 {
  margin: 17px 0 3px;
  padding-left: 60px;
  line-height: 30px;
  background: url(../images/proUpCloud/pro-ico03.png) no-repeat 30px 4px;
}
.grades dl dd.t5 span {
  color: #333840;
}
.grades dl dd.t6 {
  margin: 17px 0 3px;
  padding-left: 60px;
  line-height: 30px;
  background: url(../images/proUpCloud/pro-ico04.png) no-repeat 30px 4px;
}
.grades dl dd.t6 span {
  color: #333840;
}
.grades dl dd.t3 {
  float: left;
  font-size: 14px;
  color: #4c525b;
  line-height: 28px;
}
.grades dl dd.t3 a {
  color: #4c525b;
  padding-right: 16px;
  float: left;
  position: relative;
}
.grades dl dd.t3 a:before {
  position: absolute;
  height: 12px;
  width: 1px;
  content: '';
  background: #4c525b;
  top: 8px;
  right: 8px;
}
.grades dl dd.t3 a:last-child:before {
  display: none;
}
.grades dl dd.t3 a:hover {
  color: #2d81ff;
}
.grades dl dd.t4 {
  margin: 17px 0 3px;
  padding-left: 60px;
  line-height: 30px;
  background: url(../images/proUpCloud/pro-ico02.png) no-repeat 30px 4px;
}
.grades dl dd.t4 span {
  color: #333840;
}
.grades dl dd.bt {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 24px;
  text-align: center;
}
.grades dl dd.bt span {
  width: 100%;
  float: left;
  line-height: 43px;
  border-radius: 5px;
  border: #2d81ff solid 1px;
  color: #2d81ff;
  font-size: 20px;
}
.grades dl dd.bt a {
  width: 100%;
  float: left;
  line-height: 43px;
  border-radius: 5px;
  border: #2d81ff solid 1px;
  color: #fff;
  background: #2d81ff;
  font-size: 16px;
  display: none;
}
.grades dl dd.bt:hover span {
  display: none;
}
.grades dl dd.bt:hover a {
  display: block;
}
.grades .remark {
  margin-top: 25px;
  color: #4c525b;
  font-size: 14px;
  line-height: 26px;
}
.grades .remark a {
  color: #2d81ff;
}
.case {
  background: #2e2f39;
  padding-bottom: 80px;
}
.case .row {
  margin-top: 30px;
}
.case dl {
  margin-top: 20px;
  background: #fff;
  padding: 24px;
  border-radius: 3px;
}
.case dl dt {
  height: 51px;
  display: flex;
  align-items: center;
}
.case dl dt img {
  max-width: 100%;
}
.case dl dd.t1 {
  color: #333840;
  font-size: 18px;
  line-height: 45px;
  margin-top: 10px;
}
.case dl dd.t2 {
  color: #89919b;
  font-size: 14px;
  line-height: 28px;
}
.up-cloud-follow {
  min-height: 556px;
  background: url(../images/proUpCloud/upCloudBg.jpg) no-repeat top center;
}
.up-cloud-follow ul {
  margin-top: 30px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.up-cloud-follow ul li {
  width: 20%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 20px;
  position: relative;
}
.up-cloud-follow ul li em {
  width: 50px;
  height: 50px;
  border: #2d81ff dashed 1px;
  border-radius: 50%;
  display: inline-block;
  padding: 2px;
}
.up-cloud-follow ul li em i {
  width: 100%;
  height: 100%;
  background: #2d81ff;
  border-radius: 50%;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 22px;
}
.up-cloud-follow ul li span {
  color: #4c525b;
  font-size: 14px;
  margin-top: 20px;
}
.up-cloud-follow ul li:before {
  width: 70px;
  height: 11px;
  background: url(../images/proUpCloud/follow-bg.png) no-repeat;
  position: absolute;
  top: 16px;
  right: -31px;
  content: '';
}
.up-cloud-follow ul li:last-child:before {
  display: none;
}
.p-contact {
  display: flex;
  justify-content: center;
  margin-top: 10px;
  margin-bottom: 20px;
  align-items: center;
}
.p-contact .tel {
  margin: 20px 10px 0px;
  width: 340px;
  padding: 24px 40px;
  background: #fff;
  line-height: 28px;
}
.p-contact .tel span {
  color: #2d81ff;
  font-size: 16px;
}
.p-contact .tel p {
  color: #4c525b;
  font-size: 14px;
}
.partner {
  height: 494px;
  background: url(../images/proUpCloud/partner.jpg) no-repeat top center;
}
.partner-contact {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 15px;
}
.partner-contact .contact-div {
  width: 427px;
  margin: 0 20px;
  background: #fff;
  border-radius: 9px;
  padding: 25px 30px;
  margin-top: 20px;
}
.partner-contact .contact-div .tit {
  font-size: 20px;
  color: #2d81ff;
  height: 45px;
  line-height: 40px;
}
.partner-contact .contact-div .info {
  font-size: 14px;
  color: #4c525b;
  line-height: 24px;
}
.partner-contact .contact-div .contact-t {
  font-size: 16px;
  color: #4c525b;
  padding-left: 30px;
  margin-top: 20px;
  line-height: 30px;
  background: url(../images/proUpCloud/contactUs-ico.png) no-repeat left center;
}
.partner-contact .contact-div .contact-hp {
  color: #4c525b;
  line-height: 24px;
  margin-top: 12px;
}
@media (max-width: 1200px) {
  .grades {
    padding: 0 15px 40px;
    background: none;
  }
  .case {
    padding: 0 15px 40px;
  }
}
@media (max-width: 768px) {
  .grades dl {
    min-height: auto;
  }
  .up-cloud-follow {
    background: #f6f8fb;
  }
  .up-cloud-follow ul {
    flex-direction: column;
  }
  .up-cloud-follow ul li {
    width: 100%;
  }
  .up-cloud-follow ul li:before {
    display: none;
  }
  .partner {
    height: auto;
    background: #1f222c;
    padding-bottom: 20px;
  }
  .partner .partner-contact {
    flex-direction: column;
  }
  .partner .partner-contact .contact-div {
    width: 94%;
  }
  .p-contact {
    flex-direction: column;
  }
}
