/*产业实践*/
.cysj-header {
  width: 100%;
  padding-bottom: 20.8%;
  position: relative;
  background: url(../images/cysjBG.png) no-repeat;
  background-size: 100%;
}

.cysj-wrap {
  padding-top: 4%;
  background-size: 100%;
}

.cysj-wrap .desc {
  font-size: 18px;
  color: #333333;
  text-indent: 4ch;
}

.cysj-wrap .rhombus {
  width: 15px;
  height: 15px;
  display: inline-block;
  background: #ef8b23;
  transform: rotate(45deg);
  margin-right: 10px;
}

.cysj-wrap .zrzy-title1 {
  display: flex;
  align-items: center;
  height: 38px;
  color: #333333;
  font-weight: bold;
  font-size: 20px;
  margin: 20px 0;
}

.cysj-wrap .sjythfw {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0 3%;
  /* position: relative; */
  height: 50.125rem;
  background: url('../images/cysj2_0/sjythfw.gif') no-repeat center;
  background-size: 100% 110%;
}

.cysj-wrap .sjythfw .item {
  width: 11.5%;
  height: auto;
  /* position: absolute; */
  top: 30%;
  transition: transform 1s ease-in-out;
  cursor: pointer;
}

.cysj-wrap .sjythfw .item img {
  width: 100%;
  height: 100%;
}

.cysj-wrap .sjythfw .item:hover {
  transform: scale(1.15);
}

.cysj-wrap .sjythfw .item1 {
  left: 8.1%;
}

.cysj-wrap .sjythfw .item2 {
  left: 18.5%;
}

.cysj-wrap .sjythfw .item3 {
  left: 29%;
}

.cysj-wrap .sjythfw .item4 {
  left: 40%;
}

.cysj-wrap .sjythfw .item5 {
  right: 39.8%;
}

.cysj-wrap .sjythfw .item6 {
  right: 29%;
}

.cysj-wrap .sjythfw .item7 {
  right: 18.5%;
}

.cysj-wrap .sjythfw .item8 {
  right: 8.1%;
}

.cysj-wrap .zrzy-wrap .custom-img {
  width: 100%;
}

.cysj-wrap .zrzy-wrap .xgcp-row {
  width: 100%;
  height: 50%;
  display: grid;
  grid-template-rows: repeat(2, calc(16em - 10px));
  grid-template-columns: calc(35% - 10px) calc(65% - 10px);
  grid-gap: 20px;
}

.cysj-wrap .zrzy-wrap .xgcp-row .xgcp-col {
  overflow: hidden;
  border-radius: 10px;
}

.cysj-wrap .zrzy-wrap .xgcp-row .xgcp-col:nth-child(2) {
  display: grid;
  grid-template-columns: repeat(4, calc(25% - 15px));
  grid-template-rows: calc(100% - 20px);
  grid-gap: 20px;
}

.cysj-wrap .item-img img {
  width: 100%;
  height: 100%;
  transition: transform 1s ease-in-out;
}

.cysj-wrap .item-img img:hover {
  /* transform: scale(1.3); */
}

.cysj-wrap .zrzy-wrap .xgcp-row .xgcp-col:nth-child(2) img {
  height: calc(100% - 45px);
}

.cysj-wrap .zrzy-wrap .xgcp-row .xgcp-col:nth-child(2)>div {
  border-radius: 10px;
  position: relative;
}

.cysj-wrap .zrzy-wrap .xgcp-row .xgcp-col:nth-child(4) {
  display: grid;
  grid-template-columns: calc(26% - 10px) repeat(2, calc(37% - 10px));
  grid-template-rows: 100%;
  grid-gap: 20px;
}

.cysj-wrap .item-img {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}

.cysj-wrap .item-img .item-img-desc {
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(26, 122, 191, 0.5);
  color: white;
  font-size: 18px;
  height: 45px;
  line-height: 45px;
  font-weight: bold;
}

.cysj-wrap .item-img .item-img-desc2 {
  width: 100%;
  text-align: center;
  color: #197ac0;
  font-size: 18px;
  height: 45px;
  line-height: 45px;
  font-weight: bold;
}

.cysj-wrap .zrzy-wrap .xgcp-row .arrow::after {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  right: -15px;
  bottom: 13px;
  display: inline-block;
  border-style: solid;
  border-width: 7px 9px 7px 0;
  border-color: transparent #1979bf transparent #1979bf;
  transform: rotate(180deg);
}

.cysj-wrap .gtkjghjd-row {
  margin-top: 20px;
  display: grid;
  grid-template-columns: repeat(2, calc(50% - 10px));
  grid-template-rows: 100%;
  grid-gap: 20px;
}

.cysj-wrap .gtkjstjd-row {
  margin-top: 20px;
  display: grid;
  grid-template-columns: repeat(2, calc(50% - 10px));
  grid-template-rows: repeat(2, auto);
  grid-gap: 20px;
}

.cysj-wrap .gtkjstjd-row .span-first-column {
  grid-column-start: 2;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 3;
}

.bdcdj-row,
.zsyt-row {
  margin-top: 20px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 20px;
}

.zrzy-title2 {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  padding-top: 1em;
  margin-bottom: 2em;
}

.zrzy-title2::before {
  content: "";
  display: block;
  width: 10em;
  height: 0.8em;
  background-image: url(../images/zszx_left.png);
  background-size: 100% 100%;
}

.zrzy-title2::after {
  content: "";
  display: block;
  width: 10em;
  height: 0.8em;
  background-image: url(../images/zszx_right.png);
  background-size: 100% 100%;
}

.zrzy-title2 span {
  font-size: 24px;
  font-weight: 600;
  color: #197ac0;
  text-align: center;
  white-space: nowrap;
  display: block;
}

.zhny-wrap .zhny-title1 {
  margin: 38px 0;
  text-align: center;
}

.zhny-wrap .zhny-title1 span {
  padding: 0.5em 1em;
  border-radius: 10px;
  font-size: 24px;
  font-weight: bold;
  color: white;
  filter: drop-shadow(0px 1px 4px rgba(56, 156, 225, 0.59));
  background-image: linear-gradient(180deg, #35a7fa 0%, #bbe1fc 100%);
}

.zhny-wrap .zhny-title2,
.zrzy-title3 {
  font-size: 22px;
  color: #ef8b24;
  font-weight: bold;
  display: flex;
  align-items: center;
}

.zhny-wrap .zhny-title2::before,
.zrzy-title3::before {
  content: "";
  display: inline-block;
  margin: 20px 0;
  width: 1.2em;
  height: 0.8em;
  background: url(../images/cysj2_0/title-icon1.png) no-repeat;
  background-size: 100% 100%;
  margin-right: 10px;
}

.zrzy-title3 {
  justify-content: center;
}

.zrzy-title3::after {
  content: "";
  display: inline-block;
  margin: 20px 0;
  width: 1.2em;
  height: 0.8em;
  background: url(../images/cysj2_0/title-icon1.png) no-repeat;
  background-size: 100% 100%;
  transform: rotate(180deg);
  margin-left: 10px;
}

.zhny-wrap .gjny-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 50px;
}

.zhny-wrap .gjny-row .item-img {
  height: auto;
}

.zhny-wrap .gjny-row .desc {
  font-size: 18px;
  line-height: 36px;
  color: #333333;
}

.zhny-wrap .cytd-row .cytd-wrap>div {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.zhny-wrap .cytd-row .cytd-left {
  width: 195px;
  height: 51px;
  line-height: 51px;
  text-align: center;
  font-weight: bold;
  font-size: 20px;
  color: white;
  background: url(../images/cysj2_0/arrow-bg.png) no-repeat;
  background-size: 100% 100%;
}

.zhny-wrap .cytd-row .cytd-right {
  width: calc(100% - 205px);
  border-radius: 6px;
  padding: 10px 20px;
  margin-left: 10px;
  background-image: linear-gradient(90deg, #e8f1f9 0%, #fff 100%);
}

.zhny-wrap .hxsb-row .hxsb-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 20px;
}

.zhny-wrap .hxsb-row .hxsb-grid .desc {
  height: 95px;
  line-height: 30px;
}

.zhny-wrap .hxsb-row .hxsb-grid img {
  width: 100%;
  height: calc(100% - 95px);
}

.zhny-wrap .cpld-row .cpld-title {
  font-size: 22px;
  color: #ffffff;
  font-weight: bold;
  display: inline-block;
  height: 44px;
  line-height: 44px;
  border-radius: 22px;
  padding: 0 75px 0 26px;
  position: relative;
  background-image: linear-gradient(-90deg, #74bcef 0%, #197ac0 100%);
}

.zhny-wrap .cpld-row .cpld-title::after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 65px;
  height: 55px;
  background: url(../images/cysj2_0/icon1.png) no-repeat;
  background-size: 100% 100%;
  right: -30px;
  top: calc(50% - 27.5px);
}

.zhny-wrap .cpld-row .cpld-cont {
  display: flex;
  align-items: center;
}

.zhny-wrap .cpld-row .cpld-cont .item-img {
  height: 125px;
}

.zhny-wrap .cpld-row .cpld-cont .cpld-cont-left {
  width: 85%;
}

.zhny-wrap .cpld-row .cpld-cont .arrow {
  line-height: 28px;
}

.zhny-wrap .cpld-row .cpld-cont .arrow::before {
  content: "";
  width: 0;
  height: 0;
  display: inline-block;
  border-style: solid;
  border-width: 7px 9px 7px 0;
  margin-right: 20px;
  border-color: transparent #ef8b24 transparent #ef8b24;
  transform: rotate(180deg);
}

.zhny-wrap .cpld-row .cpld-cont .cpld-cont-right {
  width: 15%;
}

.zhny-wrap .szls-row .szls-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 20px;
}

.slsw-wrap .xgcp-row1 {
  display: grid;
  grid-template-columns: calc(40% - 15px) calc(20% - 10px) calc(40% - 15px);
  grid-template-rows: repeat(2, 1fr);
  gap: 20px;
}

.slsw-wrap .xgcp-row1>div:nth-child(2) {
  display: grid;
  grid-template-rows: calc(40% - 10px) calc(60% - 10px);
  gap: 20px;
}

.slsw-wrap .xgcp-row1 .img-flex {
  display: flex;
}

.slsw-wrap .xgcp-row1 .img-flex .item-img {
  border-radius: 0;
}

.slsw-wrap .xgcp-row1 .img-flex>div:nth-child(1) {
  margin-right: 2px;
}

.slsw-wrap .xgcp-row1 .img-flex>div:nth-child(2) {
  margin-left: 2px;
}

.slsw-wrap .xgcp-row1>div:nth-child(4) {
  grid-column-start: 1;
  grid-column-end: 3;
}

.slsw-wrap .xgcp-row2 .xgcp2-top {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 20px;
}

.slsw-wrap .xgcp-row2 .xgcp2-bot {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 20px;
}

.nync-wrap .xgcp-row {
  display: grid;
  grid-template-columns: calc(35% - 15px) calc(30% - 10px) calc(35% - 15px);
  grid-template-rows: repeat(3, 1fr);
  gap: 20px;
}

.nync-wrap .xgcp-row .xgcp-item1 {
  grid-row-start: 4;
  grid-row-end: 1;
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  row-gap: 20px;
}

.nync-wrap .xgcp-row .xgcp-item1>div:nth-child(1) {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 5px;
}

.nync-wrap .xgcp-row .xgcp-item2 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 5px;
}

.nync-wrap .xgcp-row .xgcp-item2>div:nth-child(3) {
  grid-column-start: 5;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 3;
}

.nync-wrap .xgcp-row .xgcp-item3 {
  display: grid;
  grid-template-columns: 0.6fr 0.4fr;
  column-gap: 5px;
}

.nync-wrap .xgcp-row .xgcp-item4 {
  display: grid;
  grid-template-columns: 0.4fr 0.6fr;
  grid-template-rows: repeat(2, 1fr);
  gap: 5px;
}

.nync-wrap .xgcp-row .xgcp-item4>div:nth-child(3) {
  grid-column-start: 2;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 3;
}

.yjgl-wrap .yjgl-item1 {
  padding: 20px;
  background: url(../images/cysj2_0/yjgl-itembg.png) no-repeat;
  background-size: 100% 100%;
  display: flex;
  align-items: center;
}

.yjgl-wrap .yjgl-item1 .item-img {
  width: 30%;
}

.yjgl-wrap .yjgl-item1>div:nth-child(2) {
  width: 70%;
  padding-left: 20px;
}

.yjgl-wrap .yjgl-item1 .zrzy-title1 {
  margin: 0 0 20px 0;
}

.yjgl-wrap .yjgl-item2 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 20px;
}

.yjgl-wrap .yjgl-item2 .item-img {
  height: 25vh;
}

.yjgl-wrap .yjgl-item2 .item-img img {
  height: auto;
}

.yjgl-wrap .yjgl-item3 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: 20px;
}

.yjgl-wrap .yjgl-item3 .item-img-desc {
  background-color: #197ac0;
}

.yjgl-wrap .yjgl-item3>div:nth-child(1) {
  grid-column-start: 1;
  grid-column-end: 5;
}

.yjgl-wrap .yjgl-item3>div:nth-child(1) .item-img-desc {
  top: 0;
  left: calc(50% - 200px);
  width: 400px;
  bottom: auto;
}

.yjgl-wrap .yjgl-item3>div:nth-child(2) {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  row-gap: 20px;
}

.yjgl-wrap .yjgl-item3 .item-img-desc {
  height: auto;
  line-height: 22px;
  padding: 10px 0;
}

.sthj-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 20px;
}

.sthj-wrap .sthj-item1 {
  display: grid;
  grid-template-columns: 0.35fr 0.35fr 0.3fr;
  grid-template-rows: repeat(2, auto);
  gap: 5px;
}

.sthj-wrap .sthj-item1>div:nth-child(4) {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 5px;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 2;
  grid-row-end: 2;
}

.sthj-wrap .sthj-item2 {
  display: grid;
  grid-template-columns: repeat(3, auto);
  grid-template-rows: repeat(2, auto);
  gap: 5px;
}

.sthj-wrap .item-img .sthj-item-desc {
  width: auto;
  padding: 0 10px;
  height: 100%;
  line-height: normal;
  writing-mode: vertical-rl;
}

.sthj-wrap .sthj-item2>div:nth-child(3) {
  grid-column-start: 4;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 3;
}

.sthj-wrap .sthj-item3 {
  display: grid;
  grid-template-columns: repeat(3, auto);
  grid-template-rows: repeat(2, auto);
  gap: 5px;
}

.sthj-wrap .sthj-item4 {
  display: grid;
  grid-template-columns: repeat(4, auto);
  grid-template-rows: repeat(2, auto);
  gap: 5px;
}

.sthj-wrap .sthj-item3>div:nth-child(1) {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 2;
}

.szjj-wrap .szjj-item1 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 20px;
}

.szjj-wrap .szjj-item2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: 20px;
}

.szjj-wrap .szjj-item2 .item-img-desc {
  width: 50px;
  padding: 0 10px;
  height: 100%;
  line-height: normal;
  display: flex;
  align-items: center;
  justify-content: center;
}

.szjj-wrap .szjj-item2 .item-img-desc>p {
  writing-mode: vertical-rl;
}

.szjj-wrap .szjj-item3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: 20px;
}

.szjj-wrap .szjj-item4 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.szzx-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.szzx-wrap .szzx-item1 {
  padding: 20px 0;
  border-radius: 10px;
  background-image: linear-gradient(90deg, rgba(127, 202, 255, 0.3) 0%, rgba(233, 246, 255, 0) 100%);
}

.szzx-wrap .szzx-item-title {
  display: inline-block;
  font-size: 22px;
  padding: 5px 20px;
  text-align: center;
  color: white;
  border-top-right-radius: 50px;
  border-bottom-right-radius: 50px;
  background-image: linear-gradient(90deg, #74bcef 0%, #197ac0 100%);
}

.szzx-wrap .szzx-item-title2 {
  color: #197ac0;
  display: flex;
  font-weight: bold;
  font-size: 18px;
  align-items: center;
}

.szzx-wrap .szzx-item-title2::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #197ac0;
  margin-right: 10px;
}

.szzx-wrap .szzx-item-cont {
  padding: 20px;
}

.szzx-wrap .szzx-item-cont p {
  line-height: 30px;
  color: #333333;
}

.szzx-wrap .szzx-item2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto);
  gap: 10px;
}

.szzx-wrap .szzx-mask {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 9;
  position: absolute;
  background: rgba(25, 122, 192, 0.3);
}

.szzx-wrap .hexagon {
  top: 2rem;
  left: calc(50% - 2rem);
  color: #197ac0;
  font-size: 26px;
  font-weight: bold;
  position: absolute;
}

.hexagon {
  font-size: 16px;
  position: relative;
  display: inline-block;
  margin: 0 0.5rem;
  width: 4rem;
  height: calc(4rem * 1.732);
  /*这里要写成1.732，是经过计算的，这样的才是正六边形*/
  background-color: #fff;
  border-radius: 0.75rem / 0.25rem;
  /* #f006，其中#f00表示红色，最后的6表示透明度opacity：0.4，透明度也是十六进制的 */
}

.hexagon .hexagon-txt {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9;
  position: absolute;
}

.hexagon:before,
.hexagon:after {
  content: '';
  position: absolute;
  width: inherit;
  height: inherit;
  background-color: inherit;
  left: 0;
  transform: rotate(-60deg);
  border-radius: 0.75rem / 0.25rem;
}

.hexagon:after {
  transform: rotate(60deg);
}

.rounded,
.rounded:before,
.rounded:after {
  border-radius: 0.75rem / 0.25rem;
}

.gdly-wrap {
  margin-bottom: 6.25rem;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(3, auto);
  gap: 10px;
}

.gdly-wrap .item-img .item-img-desc {
  text-align: left;
  padding-left: 10px;
  background: transparent;
  background-image: linear-gradient(90deg, rgba(23, 121, 191, 0.9) 0%, rgba(25, 122, 192, 0.1) 100%);
}

.desc2 {
  font-size: 18px;
  line-height: 34px;
  color: #333333;
}

.mt20 {
  margin-top: 20px;
}

.mb20 {
  margin-bottom: 20px;
}

.color1 {
  color: #ef8b24
}

.color2 {
  color: #197ac0;
}