

.gd-page {
  padding-top: 1.1rem;
  overflow: hidden;
  background: #ffffff;
}

.gd-page .main {
  width: 16rem;
  max-width: 16rem;
  margin: 0 auto;
}

.gd-empty-img,
.gd-page img[src=""] {
  opacity: 0;
}

.gd-banner {
  position: relative;
  height: 4rem;
  overflow: hidden;
  background: linear-gradient(90deg, #283126 0%, #52614f 50%, #202b24 100%);
}

.gd-banner-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.gd-banner-mask {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .24);
}

.gd-banner h1 {
  position: absolute;
  left: 0;
  top: 1.72rem;
  z-index: 2;
  width: 100%;
  font-family: Konexy Personal Use, Poppins, sans-serif;
  font-weight: 400;
  font-size: .46rem;
  line-height: .58rem;
  color: #ffffff;
  text-align: center;
  letter-spacing: 0;
}

.gd-page .breadWrap {
  min-height: .68rem;
  border-bottom: .01rem solid #eeeeee;
  background: #ffffff;
}

.gd-content {
  padding: .92rem 0 1rem;
  background: #ffffff;
}

.gd-layout {
  display: grid;
  grid-template-columns: 3rem 1fr;
  column-gap: .64rem;
  align-items: flex-start;
}

.gd-side {
  padding: .04rem 0 0 .48rem;
}

.gd-side-group+.gd-side-group {
  margin-top: .42rem;
}

.gd-side h3 {
  margin-bottom: .15rem;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 700;
  font-size: .2rem;
  line-height: .28rem;
  color: #183047;
}

.gd-side a {
  position: relative;
  min-height: .52rem;
  padding: 0 0 0 .3rem;
  display: flex;
  align-items: center;
  border-bottom: .01rem dashed #d9d9d9;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 700;
  font-size: .18rem;
  line-height: .26rem;
  color: #1f1f1f;
}

.gd-side a.active,
.gd-side a:hover {
  color: var(--red);
}

.gd-side a.active::after {
  content: "";
  position: absolute;
  right: .1rem;
  top: 50%;
  width: .08rem;
  height: .08rem;
  border-top: .02rem solid #1f1f1f;
  border-right: .02rem solid #1f1f1f;
  transform: translateY(-50%) rotate(45deg);
}

.gd-main {
  min-width: 0;
}

.gd-main h2 {
  margin-bottom: .36rem;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 700;
  font-size: .22rem;
  line-height: .3rem;
  color: #183047;
}

.gd-guide-item {
  border: .01rem solid #d8d8d8;
  border-radius: .06rem;
  background: #ffffff;
}

.gd-guide-item+.gd-guide-item {
  margin-top: .18rem;
}

.gd-guide-item button {
  position: relative;
  width: 100%;
  min-height: .6rem;
  padding: 0 .64rem 0 .38rem;
  display: block;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 700;
  font-size: .17rem;
  line-height: .24rem;
  color: #183047;
  text-align: left;
}

.gd-guide-item button::before,
.gd-guide-item button::after {
  content: "";
  position: absolute;
  right: .38rem;
  top: 50%;
  width: .22rem;
  height: .02rem;
  background: #333333;
  transform: translateY(-50%);
}

.gd-guide-item button::after {
  transform: translateY(-50%) rotate(90deg);
}

.gd-guide-item.active button::after {
  opacity: 0;
}

.gd-guide-body {
  position: relative;
  padding: .22rem .38rem 2rem;
}

.gd-guide-body p {
  max-width: 12.3rem;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 400;
  font-size: .18rem;
  line-height: .36rem;
  color: #333333;
}

.gd-guide-pic {
  width: 8.25rem;
  height: 7.92rem;
  margin: .38rem auto 0;
  /*background: linear-gradient(135deg, #ffffff 0%, #f6f6f6 52%, #ffffff 100%);*/
  position: relative;
}

/*.gd-guide-pic::before,*/
/*.gd-guide-pic::after {*/
/*  content: "";*/
/*  position: absolute;*/
/*  left: 50%;*/
/*  width: 5.2rem;*/
/*  height: 2.4rem;*/
/*  border: .03rem solid #d0d0d0;*/
/*  border-radius: .04rem;*/
/*  transform: translateX(-50%) skewY(-14deg);*/
/*}*/

.gd-guide-pic::before {
  top: .64rem;
}

.gd-guide-pic::after {
  bottom: 1rem;
}

.gd-guide-pic img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.gd-guide-actions {
  position: absolute;
  right: .38rem;
  bottom: .34rem;
  width: 2.38rem;
  text-align: center;
}

.gd-guide-actions h3 {
  margin-bottom: .18rem;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 700;
  font-size: .2rem;
  line-height: .28rem;
  color: #1f1f1f;
}

.gd-download {
  height: .62rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .1rem;
  border-radius: .05rem;
  background: var(--red);
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 700;
  font-size: .18rem;
  line-height: .62rem;
  color: #ffffff;
}

.gd-download img {
  position: relative;
  width: .32rem;
  height: .32rem;
}

.gd-main .pageWrap {
  display: none;
}

@media (max-width: 1200px) {
  .gd-page .main {
    width: 92%;
  }
}
