/* .header-content {
  background-image: url("../img/bg_header_content.png");
  width: 100%;
  height: 200px;
  background: red;;
} */
@import "./base.css";
@import "./wo.css";

.header-content {
  background: url("../img/bg_header_content.png");
  background-repeat: no-repeat;
  height: 970px;
  max-width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50%;
  /* height: 970px; */
  /* border: 1px solid; */
  position: relative;
  /* background-size: 100% 100%; */
}

.header_title{
  position: absolute;
  width: 632px;
  height: 52px;
  left: 0px;
  top: -104px;
}

.header-content .logo {
  width: 42px;
  height: 42px;

  margin-right: 58px;
}

.header {
  padding: 33px 0;
  /* position: absolute; */
  position: relative;
}


.header a {
  font-size: 18px;
  color: white;
  margin: 0px 25px;
}

.inject {
  position: absolute;
  right: 0px;
  padding: 4px 15px;
  ;
  background: white;
  /* font-weight: bold; */
  color: rgba(235, 169, 115, 1);
  border-radius: 16px;
}


.header-title-content {
  top: 450px;
  left: 0;
  right: 0;
  position: relative;
}

.header-title {
  width: 485px;
  height: 81px;
  font-size: 22px;
  letter-spacing: 2px;
  /* font-weight: bold; */
  color: rgba(255, 255, 255, 1);
  line-height: 30px;
  /* word-spacing: 211px; */

}

.header-btn {
  display: inline-block;
  position: relative;
  height: 84px;
  width: 207px;
  text-align: center;
  line-height: 65px;
  margin-top: 97px;
  margin-left: -10px;
}

.header-btn img {
  position: absolute;
  left: -10px;
}

.header-btn a {
  display: inline-block;
  position: relative;
  z-index: 2;
  font-size: 26px;
  color: white;
  margin-left: -15px;
  /* border: 1px solid; */
  height: 70px;
  width: 207px;
}

/* .content-btn{
  position: absolute;
} */
/* 涨粉 */
.addfen-explain {
  position: relative;
  min-height: 369px;
  margin-top: 97px;
  /* border: 1px solid; */
}

.addfen-explain>img:first-child {
  position: absolute;
  /* border: 1px solid; */
  height: 100%;
  z-index: -1;
}

.explain-title {
  font-size: 36px;
  /* text-align: center;
  position: relative;
  top: 46px; */
  /* border: 1px solid; */
  text-align: center;
  padding-top: 40px;
  position: relative;

}

/* .explain-title * {
  border: 1px solid;
} */

.explain-title>img {
  height: 18px;
  width: 30px;
  margin: 0 22px;
}

.explain-title span {
  position: relative;
  /* background: red; */
  text-align: center;

}

.explain-small-title {
  font-size: 14px;
  display: inline;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 77px;
}

.bg_title_arrow {
  position: absolute;
  width: 123px;
  height: 123px;
  /* border: 1px solid; */
  left: -10px;
  right: 0;
  margin: 0 auto;
  top: -38px;
}


.addfen-heder {
  /* justify-content: center; */
  justify-content: space-between;
  /* border: 1px solid; */
  min-width: 900px;
  max-width: 900px;
  margin: 0px auto;
  position: relative;
  /* margin: 97px auto 28px auto; */
}

.addfen-heder>div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;

}

.addfen-centent {
  margin: 90px auto 28px auto;
  position: relative;
}

.addfen-heder::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: rgba(255, 139, 54, 1);
  left: 0px;
  bottom: -25px;
}

.addfen-solid {
  position: relative;
  min-width: 200px;
  text-align: center;
}

.addfen-solid>::after {
  content: "";
  position: absolute;
  width: 1px;
  background: rgba(255, 139, 54, 1);
  height: 100%;
  top: 0px;
  right: -50px;
}

.addfen-solid>::before {
  content: "";
  position: absolute;
  width: 1px;
  background: rgba(255, 139, 54, 1);
  height: 100%;
  top: 0px;
  left: -50px;
}

.addfen-solid>p:last-child {
  /* border: 1px solid; */
  margin-left: -40px;
}

.addfen-foot {
  margin-top: 56px;
}

/* .addfen-foot>div{
  margin: 0 70px;
} */

.addfen-foot div:nth-child(2) {
  margin: 0 120px;
}



/* 为什么选择我们 */
.whywe-explain {
  margin-top: 156px;
}

.whywe-content {
  position: relative;
  /* border: 1px solid; */
  height: 295px;
  margin-top: 117px;

}

.whywe-content>img {
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: -1;
}

.whywe-ice {
  height: 304px;
  width: 267px;
  position: relative;
  /* margin: 0px 10px;  */
}

.whywe-ice>img:first-child {
  position: absolute;
  z-index: -1;
  /* border: 1px solid; */
  left: 0px;
  top: 0px;
}

.whywe-ice {}

/* 各大渠道介绍 */
.router-explain {
  margin-top: 177px;
}

.router-content {
  margin-top: 80px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.router-content>div {}

.router-content>div img {
  height: 78px;
  width: 78px;

}

.router-card {
  box-sizing: border-box;
  max-width: 250px;
  /* height: 300px; */
  background: rgba(255, 255, 255, 1);
  border: 1px solid rgba(167, 153, 141, 0.2);
  margin-top: 36px;
  text-align: center;
  padding: 54px 49px 35px 49px;
  cursor: pointer
}

.router-card:hover {
  /* box-shadow:  0px 0px 5px 1px #B5B5B5; */


  /* -moz-box-shadow:0 0 10px #06c;
  -webkit-box-shadow:0 0 10px #06c; */
  /* box-shadow:0 0 10px #f1f1f1; */
  box-shadow: rgba(169,169,169, 0.2) 0px 0px 15px 5px;
  border: 1px solid rgba(167, 153, 141, 0);
}

.router-card :nth-child(2) {
  margin: 32px auto 22px auto;
}

/* 产品特点 */

.left,
.right {
  position: absolute;
  z-index: -1;

}

.left {
  width: 114px;
  height: 1383px;
  left: 0px;
  top: -200px;
}

.right {
  width: 122px;
  height: 1416px;
  right: 0px;
  top: 607px;
}

.trait-explain {
  margin-top: 183px;
}

.trait-content {
  margin-top: 107px;
  overflow: hidden;
  position: relative
}

.trait-item {
  justify-content: space-between;
  /* border: 1px solid; */
  width: 98%;
}

.trait-title {
  position: relative;
}

.hide-back {
  font-size: 52px;
  font-weight: bold;
  color: rgba(255, 223, 196, 1);
  position: absolute;
  top: -26px;
  z-index: -1;
  /* border: 1px solid; */
  width: 470px;
}

.trait-childt-itle {
  position: relative;
}

.trait-childt-itle::before {
  content: "";
  position: absolute;
  width: 5px;
  background: rgba(243, 145, 64, 1);
  height: 100%;
  top: 0px;
  left: -9px;
}

/* 操作说明 */
.handle-explain {
  width: 100%;
  /* height: 553px; */
  background: rgba(255, 242, 224, 1);
  margin-top: 177px;
  padding: 54px 0 87px 0;
}

/* 操作流程 */
.handle-item {
  width: 230px;


}

.handle-content {
  margin-top: 117px;
  /* justify-content: space-around; */
}

/* .handle-content *{
  border: 1px solid;
} */
.handle-item img {
  margin: 14px auto 18px auto;
}

.handle-box {
  width: 110px;
  justify-content: space-between;
  height: 100%;
  align-items: center;
}

.handle-circle {
  width: 9px;
  height: 9px;
}

/* 合作展示 */
.dot {
  /* border: 1px solid red; */
  /* margin: 29px 0px; */
  cursor: pointer
}

.dot:hover {
  -webkit-transform: rotateY(360deg);
  -moz-transform: rotateY(360deg);
  -o-transform: rotateY(360deg);
  -ms-transform: rotateY(360deg);
  transform: rotateY(360deg);
  background: #eee;
  transition: all .4s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: all .4s cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transition: all .4s cubic-bezier(0.4, 0, 0.2, 1);
  -o-transition: all .4s cubic-bezier(0.4, 0, 0.2, 1);
}

.dot img:hover {}



.dot img {
  width: 260px;
  height: 100px;
  -webkit-transition: all .4s cubic-bezier(0.4, 0, 0.2, 1);
  /* border: 1px solid red; */
}



.workt-explain {
  margin-top: 229px;

}

/* 关于我们 */
.about-explain {
  margin-top: 200px;
}

.about-content {
  position: relative;
}

.about-title {
  margin: 110px 0px 70px 0px;
}

.about-lf {
  width: 527px;
  height: 413px;
  border: 1px solid rgba(255, 255, 255, 1);
  display: inline-block;
}

.about-content img {
  width: 467px;
  height: 351px;
  position: absolute;
  left: 121px;
  top: 33px;
  z-index: 2;
}

.about-rf {
  /* padding: 108px 34px 91px 183px; */
  /* padding: 63px 10px 95px 290px; */
  padding: 80px 20px 95px 266px;
  width: 755px;
  height: 400px;
  border: 1px solid rgba(252, 172, 116, 1);
  position: absolute;
  top: 23px;
  right: 0px;
}

/* 我们的二维码 */
.fen-explain {
  margin-top: 200px;
}

.fen-qr {
  width: 681px;
  /* height: 256px; */
  border: 1px solid rgba(105, 214, 51, 1);
  position: relative;
  margin: 220px auto auto;
  padding: 20px 0 15px 0;
}

.logo_wx_content {
  /* border: 1px solid; */
  position: absolute;
  width: 100%;
  text-align: center;
  top: -48px;
}

.logo_wx {
  height: 99px;
  width: 99px;
  position: relative;
}

.qc {
  width: 190px;
  height: 200px;
  /* margin: 0px 60px; */
  margin-top: 35px;
}

/* 底部 */
.foot {
  background: url("../img/bg_buttom.png");
  background-repeat: no-repeat;
  /* height: 365px; */
  max-width: 100%;
  background-repeat: repeat;
  background-size: cover;
  background-position: 100%;
  position: relative;
  padding-bottom: 23px;
  margin-top: 176px;
}

.foot-content {
  padding-top: 109px;
}

.weare-msg {
  margin-top: 65px;
  /* border: 1px solid; */
  padding-left: 116px;
}

.foot-link {
  margin-top: 33px;
}

.foot-link a {
  margin-right: 30px;
}

.foot-call {
  margin-top: 29px;
}

.foot-call>span:last-child {
  /* background: red; */
  /* margin-left: 65px; */
}

.foot-call img {
  width: 20px;
  height: 20px;
  margin: 0 9px;
}




/* --- */
.root {
  height: .35rem;
  line-height: .35rem;
  border-top: .01rem solid #ccc;
  font-size: .12rem;
  overflow: hidden;

}

.mainleft {
  float: left;
  padding: 0 .1rem;
  border-right: .01rem solid #ccc;
}

.mainright {
  float: left;
  padding: 0 .1rem;

}

.scroll-box {
  /* border: 1px solid; */
  height: 100px;
  overflow: hidden;
  width: 289px;
}

.addfen-fen li {
  /* background: red; */
  height: 100px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* 侧边 */
.right-silde {
  border: 1px solid #FF9747;
  /* width: 98px;
  height: 293px; */
  position: fixed;
  right: 100px;
  top: 370px;
  border-radius: 3px;
  /* padding: 0px 17px; */
  width: 98px;
  background: white;
}

.right-menu {
  padding: 10px 0px;
  position: relative;
  border-bottom: 1px solid #FF993C;
}

.right-menu img {
  width: 60px;
  height: 50px;
}

.right-menu-wx {
  /* display: none; */
  position: absolute;
  /* border: 1px solid; */
  left: -270px;
  top: -1px;
  /* height: 100%; */
  white-space: nowrap;
  padding: 10px 10px 16px 0px;
  border-radius: 8px 0px 0px 8px;
  display: none;
}

.right-menu-phone {
  position: absolute;
  left: -198px;
  padding: 10px 10px 20px 0px;
  border-radius: 8px 0px 0px 8px;
  top: 0px;
  display: none;
}

.right-menu:hover,
.right-up:hover {
  background: #FF8A43;
  color: white;
}

.right-up:hover .right-ups {
  display: none;
}

.right-up:hover .right-acup {
  display: inline-block;
}

.right-acup {
  display: none;
}

.right-menu:hover .right-menu-wx,
.right-menu:hover .phone-active,
.right-menu:hover .wx_active,
.right-menu:hover .right-menu-phone {
  display: block;

}

.right-menu:hover .phone-ac,
.right-menu:hover .wx_ac {
  display: none;

}


.wx_active {
  display: none;
}



.right-menu-wx img {
  width: 120px;
  height: 120px;
  background: rgba(255, 255, 255, 1);
  border-radius: 10px;
  position: relative;
  margin-left: 10px;

}



.phone-active {
  display: none;
}


.menu-circle {
  display: inline-block;
  width: 12px;
  height: 12px;
  background: white;
  margin-left: 10px;
  margin-right: 5px;
}

.right-menu-box {
  color: #2F2F2F;
}

.right-up img {
  width: 41px;
  height: 47px;
}

.right-up {
  padding-bottom: 20px;
  padding-top: 20px;

}

.right-menutitle {
  padding-top: 10px;

}