@charset "utf-8";

.page-flex {
  display: flex;
  margin: 0 3.8%;
  min-width: 1190px;
}

.left-side-nav {
  width: 184px;
  background: #fff;
  position: sticky;
  top: 116px;
  z-index: 3;
  border-radius: 16px;
  padding: 16px;
  box-sizing: border-box;
  bottom: 0;
  max-height: 660px;

}

.left-side-nav ul {
  border-bottom: 1px solid rgba(216, 216, 216, 0.5);
  padding-bottom: 6px
}

.left-side-nav ul.tools {
  padding-top: 40px;
  position: relative
}

.left-side-nav ul.other {
  padding-top: 10px;
  position: relative
}

.left-side-nav ul.tools::before {
  content: "小工具";
  position: absolute;
  left: 12px;
  top: 12px;
  color: #999999
}

.left-side-nav ul:last-child {
  border: none
}

.left-side-nav ul.others {
  padding-top: 40px;
  position: relative
}

.left-side-nav ul.others::before {
  content: "其它";
  position: absolute;
  left: 12px;
  top: 12px;
  color: #999999
}

.left-side-nav ul.others {
  padding-top: 40px;
  position: relative
}

.left-side-nav ul.others::before {
  content: "其它";
  position: absolute;
  left: 12px;
  top: 12px;
  color: #999999
}



.left-side-nav li {
  margin-bottom: 8px;
  position: relative;
  z-index: 10
}

.left-side-nav>ul>li>a {
  display: block;
  font-size: 14px;
  color: #1A1A1A;
  border-radius: 8px;
  padding: 7px 0 7px 10px;
  line-height: 24px;
  white-space: nowrap;
  position:initial !important;
}

.left-side-nav>ul>li>a i {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("//fastued3.jia.com/image/common/left-icon.png") no-repeat center 3.4%;
  background-size: 100%;
  vertical-align: middle;
  margin-right: 2px
}

.left-side-nav li a.company i {
  background-position: center 10.5%
}

.left-side-nav li a.qixuan i {
  background-position: center 18%
}

.left-side-nav li a.tg i {
  background-position: center 24.9%
}

.left-side-nav li a.tuku i {
  background-position: center 32.2%
}

.left-side-nav li a.baike i {
  background-position: center 39.5%
}

.left-side-nav li a.fuwushequ i {
  background: url(//fastued3.jia.com/image/common/fuwushequ.png) no-repeat center 0;
  background-size: 100%;
}

.left-side-nav li a.more i {
  background: url(//fastued3.jia.com/image/common/left-more.png) no-repeat center 0;
  background-size: 100%;
}

.left-side-nav li a.more em {
  border-left: 1px solid #D8D8D8;
  border-bottom: 1px solid #D8D8D8;
  width: 5.5px;
  height: 5.5px;
  display: inline-block;
  transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-left: 4px;
}

.left-side-nav li a.zixun i {
  background-position: center 46.6%
}

.left-side-nav li a.quote i {
  background-position: center 54%
}

.left-side-nav li a.ai i {
  background-position: center 61%
}

.left-side-nav li a.fgcs i {
  background-position: center 68.5%
}

.left-side-nav li a.ybt i {
  background-position: center 75.5%
}

.left-side-nav li a.zscg i {
  background-position: center 82.5%
}

.left-side-nav li a.mfsj i {
  background-position: center 90%
}

.left-side-nav li a.download i {
  background-position: center 97%
}

.left-side-nav li a.hover {
  background: #F9F9F9
}

.left-side-nav li a.hover i {
  background: url("//fastued3.jia.com/image/common/left-hover-icon.png") no-repeat center 3.4%;
  background-size: 100%
}

.left-side-nav li a.company.hover i {
  background-position: center 10.5%
}

.left-side-nav li a.qixuan.hover i {
  background-position: center 18%
}

.left-side-nav li a.tg.hover i {
  background-position: center 24.9%
}

.left-side-nav li a.tuku.hover i {
  background-position: center 32.2%
}

.left-side-nav li a.baike.hover i {
  background-position: center 39.5%
}

.left-side-nav li a.zixun.hover i {
  background-position: center 46.6%
}

.left-side-nav li a.quote.hover i {
  background-position: center 54%
}

.left-side-nav li a.ai.hover i {
  background-position: center 61%
}

.left-side-nav li a.fgcs.hover i {
  background-position: center 68.5%
}

.left-side-nav li a.ybt.hover i {
  background-position: center 75.5%
}

.left-side-nav li a.zscg.hover i {
  background-position: center 82.5%
}

.left-side-nav li a.mfsj.hover i {
  background-position: center 90%
}

.left-side-nav li a.download.hover i {
  background-position: center 97%
}

.left-side-nav li a.fuwushequ.hover i {
  background: url(//fastued3.jia.com/image/common/fuwushequ.png) no-repeat center 50%;
  background-size: 100%;
}

.left-side-nav li a.more.hover i {
  background: url(//fastued3.jia.com/image/common/left-more.png) no-repeat center 100%;
  background-size: 100%;
}

.left-side-nav li a.active {
  background: rgba(215, 23, 47, 0.05);
  color: #EC2B3E
}

.left-side-nav li a.active i {
  background: url("//fastued3.jia.com/image/common/left-active-icon.png") no-repeat center 3.4%;
  background-size: 100%
}

.left-side-nav li a.company.active i {
  background-position: center 10.5%
}

.left-side-nav li a.qixuan.active i {
  background-position: center 18%
}

.left-side-nav li a.tg.active i {
  background-position: center 24.9%
}

.left-side-nav li a.tuku.active i {
  background-position: center 32.2%
}

.left-side-nav li a.baike.active i {
  background-position: center 39.2%
}

.left-side-nav li a.zixun.active i {
  background-position: center 46.6%
}

.left-side-nav li a.quote.active i {
  background-position: center 54%
}

.left-side-nav li a.ai.active i {
  background-position: center 61%
}

.left-side-nav li a.fgcs.active i {
  background-position: center 68.5%
}

.left-side-nav li a.ybt.active i {
  background-position: center 75.5%
}

.left-side-nav li a.zscg.active i {
  background-position: center 82.5%
}

.left-side-nav li a.mfsj.active i {
  background-position: center 90%
}

.left-side-nav li a.download.active i {
  background-position: center 97%
}

.left-side-nav li a.mine.active i {
  background-position: 0 105%;
}

.left-side-nav li a.fuwushequ.active i {
  background: url(//fastued3.jia.com/image/common/fuwushequ.png) no-repeat center 100%;
  background-size: 100%;
}

.left-side-nav li:last-child {
  margin-bottom: 0
}

.left-side-nav li.has-pop .code-wrap {
  position: absolute;
  top: -31px;
  left: 151px;
  width: 200px;
  padding-left: 32px;
  display: none;
}

.left-side-nav li.has-pop p {

  width: 200px;
  height: 258px;
  background: #FFFFFF;
  box-shadow: 0px 10px 50px 0px rgba(194, 194, 194, 0.2);
  border-radius: 16px;
  text-align: center;
  font-size: 16px;
  color: #666666;
  padding: 24px 0;
  box-sizing: border-box;
  /*//position: relative;
  // position: absolute;
  // left: 180px;
  // top: -31px;
  // display: none*/
}

.left-side-nav li.has-pop p strong {
  font-size: 20px;
  color: #1A1A1A;
  font-weight: 700
}

.left-side-nav li.has-pop p img {
  width: 130px;
  height: 130px;
  display: block;
  margin: 11px auto
}

.left-side-nav li.has-pop p::before {
  content: "";
  position: absolute;
  top: 40px;
  left: 11px;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-right: 11px solid #fff;
  display: inline-block;
  box-shadow: 0px 10px 50px 0px rgba(194, 194, 194, 0.2)
}

.left-side-nav li.has-pop.last .code-wrap {
  top: auto;
  bottom: -30px
}

.left-side-nav li.has-pop.last p::before {
  top: auto;
  bottom: 40px
}

.left-side-nav::-webkit-scrollbar {
  width: 4px;
  height: 1px
}

.left-side-nav::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: #F9F9F9
}

.left-side-nav::-webkit-scrollbar-track {
  border-radius: 10px;
  background: transparent
}


.right-content {
  flex: 1;
  /*position: relative;
  overflow: hidden;*/
  min-width: 0;
  z-index: 1
}

.friendly-link {
  padding: 16px 0 16px 16px;
  border-radius: 16px;
  background: #fff;
  margin-left: 16px;
  margin-top: 16px
}

.friendly-link .tit strong {
  color: #1A1A1A;
  font-weight: 700;
  font-size: 16px;
  height: 24px;
  line-height: 24px
}

.friendly-link .tit strong i {
  width: 24px;
  display: inline-block;
  height: 24px;
  background: url(//fastued3.jia.com/image/common/content-icon.png) no-repeat center 0;
  background-size: 100%;
  background-position: 0 97.25%;
  vertical-align: middle;
  margin-right: 10px
}

.friendly-link ul {
  padding-top: 6px
}

.friendly-link ul li {
  width: 12.5%;
  float: left;
  height: 26px;
  line-height: 26px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis
}

.pop-mask {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 99;
  display: none;
}

@media (min-width: 1024px) and (max-width: 1336px) {
  .left-side-nav {
    padding: 12px 16px;
  }

  .left-side-nav ul.tools {
    padding-top: 4px;

  }

  .left-side-nav ul {
    padding-bottom: 4px;
  }

  .left-side-nav {
    max-height: 600px;
  }

  .left-side-nav li {
    margin-bottom: 4px;
  }

  .left-side-nav>ul>li>a {
    padding: 6px 0 6px 10px;
  }

  .left-side-nav ul.tools::before {
    display: none;
  }
}

.left-side-nav>ul>li.has-menu .wrap {
  display: none;
  left: 151px;
  padding-left: 32px;
  width: 140px;
  top: -34px;
  position: absolute;
}

.left-side-nav>ul>li.has-more .wrap {
  display: none;
  left: 151px;
  padding-left: 32px;
  width: 182px;
  bottom: -34px;
  position: absolute;
}

.left-side-nav>ul>li.has-more.cur .wrap {
  display: block;
}

.left-side-nav>ul>li.has-more ul {

  padding: 16px;
  width: 100%;
  box-sizing: border-box;
  border-radius: 16px;
  box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 10%);
  background: #fff;
  z-index: 999999;
}

.left-side-nav>ul>li.has-more ul li:nth-child(2) {
  margin-top: 8px;
}

.left-side-nav>ul>li.has-more ul li img {
  width: 120px;
  height: 120px;
  display: block;
  border-radius: 8px;
  margin: 10px 0 0 0;
}

.left-side-nav>ul>li.has-more ul li>a {
  display: block;
  font-size: 14px;
  color: #1A1A1A;
  border-radius: 8px;
  padding: 16px;
  line-height: 24px;
  white-space: nowrap;
  background: #F9F9F9;
  border-radius: 8px;
}



.left-side-nav>ul>li.has-more ul li>a.fgcs i {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(//fastued3.jia.com/image/common/left-icon.png) no-repeat center 3.4%;
  background-size: 100%;
  vertical-align: middle;
  margin-right: 2px;
  background-position: center 68.5%;
}

.left-side-nav>ul>li.has-more ul li>a.zscg i {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(//fastued3.jia.com/image/common/left-icon.png) no-repeat center 3.4%;
  background-size: 100%;
  vertical-align: middle;
  margin-right: 2px;
  background-position: center 82.5%;
}

.left-side-nav>ul>li.has-more ul li.cur a.fgcs i {
  background: url("//fastued3.jia.com/image/common/left-hover-icon.png") no-repeat center 3.4%;
  background-size: 100%;
  background-position: center 68.5%;
}

.left-side-nav>ul>li.has-more ul li.cur a.zscg i {
  background: url("//fastued3.jia.com/image/common/left-hover-icon.png") no-repeat center 3.4%;
  background-size: 100%;
  background-position: center 82.5%;
}

.left-side-nav>ul>li.has-more ul li.cur a {
  background: rgba(215, 23, 47, 0.05);
  border-radius: 8px;
  color: #EC2B3E;
}



.left-side-nav>ul>li.has-more ul::before {
  content: "";
  position: absolute;
  bottom: 40px;
  left: 12px;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-right: 11px solid #fff;
  display: inline-block;
  box-shadow: 0px 10px 50px 0px rgb(194 194 194 / 20%);
}

.left-side-nav>ul>li.has-more ul li img {
  display: none;
}

.left-side-nav>ul>li.has-more ul li.cur img {
  display: block;
}

.left-side-nav>ul>li.has-menu ul {

  padding: 16px;
  width: 100%;
  box-sizing: border-box;
  border-radius: 16px;
  box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 10%);
  background: #fff;
  z-index: 999999;
}

.left-side-nav>ul>li.has-menu.cur .wrap {
  display: block;
}

.left-side-nav>ul>li.has-menu ul::before {
  content: "";
  position: absolute;
  top: 40px;
  left: 12px;
  width: 0;
  height: 0;
  border: 11px solid transparent;
  border-right: 11px solid #fff;
  display: inline-block;
  box-shadow: 0px 10px 50px 0px rgb(194 194 194 / 20%);
}

.left-side-nav>ul>li.has-menu ul li a {
  font-size: 14px;
  color: #1A1A1A;
  line-height: 24px;
  display: block;
  width: 100%;
  box-sizing: border-box;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
  text-align: center;
}

.left-side-nav>ul>li.has-menu .wrap li a i {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(//fastued3.jia.com/image/common/baike.png) no-repeat center 0;
  background-size: 100%;
  vertical-align: middle;
  margin-right: 8px;
}

.left-side-nav>ul>li.has-menu .wrap li a:hover i {
  background: url(//fastued3.jia.com/image/common/baike-hover.png) no-repeat center 0;
  background-size: 100%;
}

.left-side-nav>ul>li.has-menu .wrap li:nth-child(3) a i {
  background-position: 0 26%;
}

.left-side-nav>ul>li.has-menu .wrap li:nth-child(2) a i {
  background-position: 0 52%;
}

.left-side-nav>ul>li.has-menu .wrap li:nth-child(4) a i {
  background-position: 0 75%;
}

.left-side-nav>ul>li.has-menu .wrap li:nth-child(5) a i {
  background-position: 0 100%;
}

.left-side-nav>ul>li.has-menu ul li a:hover {
  color: #EC2B3E;
  background: rgba(215, 23, 47, 0.05);
  border-radius: 8px;

}

.left-side-nav>ul>li.has-menu>a em {
  border-left: 1px solid #D8D8D8;
  border-bottom: 1px solid #D8D8D8;
  width: 5.5px;
  height: 5.5px;
  display: inline-block;
  transform: rotate(225deg);
  -webkit-transform: rotate(225deg);
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-left: 4px;
  /* 这里的颜色将是箭头的颜色 */
}



.left-side-nav>ul>li>a.mine i {
  background: url("https://fastued3.jia.com/image/common/mine.png") no-repeat 0 5%;
  background-size: 100%;
}

.left-side-nav li a.mine.hover i {
  background-position: 0 105%;
}