/* 基础样式 */
body {
  margin: 0;
  background-color: #ffffff;
  max-width: 1920px;
  margin: 0 auto;
  padding-top: 90px;
  /*min-width: 1300px;*/
  /*padding-top: 30px;*/
  /*padding-top: 30px;*/
  /*min-width: 1300px;*/
}

* {
  font-style: normal;
  outline: none;
}

a {
  text-decoration: none;
}

h1,
h2,
h3 {
  margin: 0;
  font-size: 100%;
  font-weight: normal;
  /* display: block; */
  /* font-size: 1.5em; */
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
  /* font-weight: bold; */
}

p {
  margin: 0;
}

/* 超出隐藏 */
.of-ellipsis {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 多行文本超出隐藏 */
.of-ellipsis-2 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.of-ellipsis-3 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.of-ellipsis-4 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.of-ellipsis-5 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}

.of-ellipsis-6 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
}

.of-ellipsis-7 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 7;
  -webkit-box-orient: vertical;
}

.of-ellipsis-8 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 8;
  -webkit-box-orient: vertical;
}

.top-bar {
  z-index: 999;
  width: 100%;
  height: 90px;
  transition: background-color 300ms;
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
}

.max-box {
  width: 100%;
  min-width: 1440px;
  height: auto;
}

.center-box {
  width: 1440px;
  height: 100%;
  margin: 0 auto;
}

.top-bar .center-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.top-bar .center-box .left-img {
  width: 223px;
  display: block;
  height: 60px;
  /* background-image: url(../img/zu1.png); */
  background-repeat: no-repeat;
  background-position: center;
}
.top-bar .center-box .left-img img {
  width: 100%;
  height: 100%;
}

.top-bar .center-box .right-links {
  width: auto;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.top-bar .center-box .right-links .link {
  margin-left: 60px;
  font-size: 18px;
  transition: color 300ms;
  color: #333;
  border-bottom: solid 2px transparent;
}

.top-bar .center-box .right-links .link.act {
  transition: color 300ms;
  color: #bb222c;
  line-height: 90px;
  border-bottom: solid 2px;
}

.top-bar.switch-color {
  backdrop-filter: blur(5px);
  background-color: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}

.top-bar.switch-color .right-links .link {
  color: #333;
}

.top-bar.switch-color .right-links .link.act {
  color: #bb222c;
}

.top-bar.switch-color .center-box .left-img img {
  width: 100%;
  height: 100%;
}

.top_tel {
  width: auto;
  height: 50px;
  background-image: url(../img/top-tel.png);
  background-repeat: no-repeat;
  background-position: left;
  padding-left: 60px;
}

.top_tel p {
  color: #757575;
  line-height: 22px;
}

.top_tel h4 {
  font-weight: bold;
  color: #bb222c;
  font-size: 24px;
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
}

.footer {
  height: 508px;
  position: relative;
  background-color: #222;
}

.footer .center-box {
  padding-top: 82px;
}

.footer .top-box {
  width: 100%;
  height: 300px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.footer .top-box .left-box {
  width: 360px;
  height: 100%;
}

.footer .top-box .left-box .call-me {
  font-size: 20px;
  color: #ffffff;
  margin-bottom: 20px;
}

.footer .top-box .left-box .phone-num {
  font-size: 30px;
  font-weight: bold;
  color: #dc000e;
  margin-bottom: 20px;
}

.footer .top-box .left-box .img-text {
  width: 100%;
  font-size: 14px;
  color: #ffffff;
  margin-bottom: 20px;
}

.footer .top-box .left-box .img-text img {
  margin-right: 10px;
}

.footer .top-box .left-box .link {
  margin-top: 40px;
  display: block;
  width: 223px;
  height: 53px;
  background-color: #bb222c;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

.footer .top-box .right-box {
  width: auto;
  height: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}

.footer .top-box .right-box ul {
  padding: 0;
  margin: 0;
  list-style: none;
  margin-right: 128px;
}

.footer .top-box .right-box ul li:first-child {
  color: #ffffff;
  font-size: 16px;
  margin-bottom: 26px;
}

.footer .top-box .right-box ul li a {
  line-height: 28px;
  color: #ffffff;
  opacity: 0.6;
  text-decoration: none;
}

.footer .top-box .right-box .qr-code {
  width: 111px;
  height: 140px;
}

.footer .top-box .right-box .qr-code img {
  width: 100%;
  height: 111px;
}

.footer .top-box .right-box .qr-code .text {
  width: 100%;
  height: 29px;
  text-align: center;
  font-size: 12px;
  color: #ffffff;
  opacity: 0.6;
  line-height: 29px;
}

.footer .bottom-info {
  position: absolute;
  bottom: 0;
  z-index: 50;
  left: 0;
  width: 100%;

  height: 72px;
  border-top: solid 1px #49525d;
}

.footer .bottom-info .center-box {
  padding-top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.footer .bottom-info .text {
  width: auto;
  font-size: 14px;
  color: #ffffff;
  opacity: 0.6;
}

.footer .bottom-info .text * {
  color: #ffffff;
}

.additional-features {
  position: fixed;
  right: 0px;
  bottom: 360px;
  z-index: 200;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

.additional-features li {
  position: relative;
  padding-top: 1px;
  border-bottom: 1px solid #e6e6e6;
  border-left: 1px solid #eeeeee;
  border-right: 1px solid #eeeeee;
  width: 72px;
  height: 70px;
  line-height: 1;
  cursor: pointer;
  background-color: rgba(255, 255, 255, 1);
  transition: all 0.2s linear;
  box-sizing: border-box;
  list-style: none;
}

.additional-icon {
  margin: 0 auto 1px;
  width: 36px;
  height: 36px;
  margin-top: 3px;
}

.additional-features li .additional-icon.icon2 {
  background: url(../img/right_pic2.png) center center no-repeat;
}

.additional-features li p {
  font-size: 12px;
  color: #666666;
  text-align: center;
}
.additional-features li.rx {
  border-radius: 6px 6px 0 0;
}

.additional-features li.rx .revi-hotline-wrapper {
  display: none;
  position: absolute;
  left: -222px;
  bottom: -5px;
  width: 235px;
  height: 80px;
}

.additional-features li.rx .revi-hotline {
  position: absolute;
  left: 0;
  width: 221px;
  height: 80px;
  background-color: #fff;
  border: 1px solid #ddd;
  cursor: text;
  border-radius: 2px;
  box-shadow: -2px 3px 25px rgba(0, 0, 0, 0.1);
  padding-left: 12px;
}

.additional-features li.rx .revi-hotline h3 {
  margin: 16px 0 8px;
  font-family: "Arial", "Microsoft Yahei", "Helvetica Neue", Helvetica, Arial, PingFang SC, "Hiragino Sans GB",
    "WenQuanYi Micro Hei", sans-serif;
  font-size: 28px;
  color: #bb222c;
  font-weight: normal;
}

.additional-features li.rx .revi-hotline h4 {
  font-weight: normal;
  font-size: 13px;
  margin: 0;
}

.additional-features li.active {
  background-color: #bb222c;
  border-color: #bb222c;
}

.additional-features li.active .additional-icon.icon2 {
  background-image: url(../img/right_pic2_on.png);
}

.additional-features li.active p {
  color: #fff;
}

.additional-features li.rx.active .revi-hotline-wrapper {
  display: block;
}

.additional-features li .additional-icon.icon3 {
  background: url(../img/right_pic3.png) center center no-repeat;
}

.additional-features li.xz .xz-ewm {
  display: none;
  position: absolute;
  top: -19px;
  left: -114px;
  width: 100px;
  height: 100px;
}

.additional-features li.xz a {
  position: absolute;
  left: 0;
  width: 100px;
  height: 100px;
}
.additional-features li.xz a img {
  width: 100%;
  height: 100%;
}

.additional-features li.active .additional-icon.icon3 {
  background-image: url(../img/right_pic3_on.png);
}

.additional-features li.xz.active .xz-ewm {
  display: block;
}

.db {
  position: fixed;
  cursor: pointer;
  right: 0px;
  bottom: 290px;
  padding-top: 6px;
  width: 72px;
  height: 70px;
  border-radius: 0 0 6px 6px;
  background-color: rgba(255, 255, 255, 1);
  z-index: 1;
  box-sizing: border-box;
  border-left: 1px solid #eeeeee;
  border-right: 1px solid #eeeeee;
  border-bottom: 1px solid #dddddd;
}

.db .additional-icon.icon5 {
  background: url(../img/right_pic5.png) center center no-repeat;
}
.db p {
  font-size: 12px;
  color: #666666;
  text-align: center;
}

.db:hover {
  background-color: #bb222c;
  border-color: #bb222c;
}
.db:hover .additional-icon.icon5 {
  background-image: url(../img/right_pic5_on.png);
}
.db:hover p {
  color: #fff;
}
