@charset "UTF-8";
* {
  -webkit-user-select: none;
  /* Chrome/Safari/Edge */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* IE/Edge */
  user-select: none;
  /* Standard syntax */
}

html {
  font-size: 1rem;
  font-size: calc(100vw/19.2);
}

img {
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari */
  -khtml-user-select: none;
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Old versions of Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently supported by Chrome, Opera and Firefox */
}

a {
  text-decoration: none;
}

a:hover, a:active, a:visited {
  text-decoration: none;
}

#pageHeader {
  background-color: #ccc;
  display: flex;
  justify-content: center;
}

#pageHeader img {
  width: 100vw;
  height: 5rem;
}

#app {
  padding: .56rem 3.6rem;
}

@media (max-width: 768px) {
  #app {
    padding: 0;
  }
}

/* 标题样式 */
.boxTitle {
  position: relative;
}

.boxTitle .colorBox {
  position: absolute;
  background: #0036CC;
  width: 2.12rem;
  top: 42%;
  height: .28rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}

.boxTitle .fontTitle {
  text-align: center;
  position: relative;
  z-index: 10;
}

#join .joinBox {
  display: flex;
  align-items: center;
  justify-content: center;
}

#join .exhibitor {
  width: 5.7rem;
  height: 1.3rem;
  margin-right: .7rem;
  border-radius: .35rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

@media (max-width: 768px) {
  #join .exhibitor {
    margin-right: 0;
  }
}

#join .exhibitor p {
  font-size: .36rem;
  display: flex;
  justify-content: center;
}

#join .exhibitor span {
  font-size: .18rem;
  display: flex;
  justify-content: center;
}

#Flagship,
#layout,
#market,
#Segment {
  display: flex;
  flex-direction: column;
}

#Flagship .six h2 {
  font-size: .36rem;
  text-align: center;
  font-weight: 600;
  color: #0036CC;
}

#Flagship .six .girdBox {
  display: grid;
  grid-template-columns: repeat(3, 3.8rem);
  /* 3列布局 */
  gap: 0.22rem;
  /* 元素间隙 */
  justify-content: center;
  /* 水平居中 */
  /* 适配移动端 */
}

@media (max-width: 768px) {
  #Flagship .six .girdBox {
    grid-template-columns: repeat(2, 2.8rem);
  }
}

#Flagship .six .girdBox .sixBox {
  width: 3.8rem;
  height: 3.76rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background-color: #EFEFEF;
}

#Flagship .six .girdBox .sixBox p {
  font-size: .36rem;
}

#Flagship .six .girdBox .sixBox span {
  font-size: .16rem;
}

#Flagship .six .girdBox .sixBox img {
  width: 3.2rem;
  height: 2.4rem;
}

@media (max-width: 768px) {
  #Flagship .six .girdBox .sixBox {
    width: 2.8rem;
    height: 2.76rem;
  }
  #Flagship .six .girdBox .sixBox p {
    font-size: .24rem;
  }
  #Flagship .six .girdBox .sixBox span {
    font-size: .16rem;
  }
  #Flagship .six .girdBox .sixBox img {
    width: 2rem;
    height: 1.5rem;
  }
}

#Flagship .four h2 {
  font-size: .36rem;
  text-align: center;
  font-weight: 600;
  color: #0036CC;
}

#Flagship .four .girdBox {
  display: grid;
  grid-template-columns: repeat(4, 2.87rem);
  /* 4列布局 */
  gap: 0.16rem;
  /* 元素间隙 */
  justify-content: center;
  /* 水平居中 */
  /* 适配移动端 */
}

#Flagship .four .girdBox .fourBox {
  width: 2.87rem;
  height: 3.51rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background-color: #EFEFEF;
}

#Flagship .four .girdBox .fourBox p {
  font-size: .36rem;
}

#Flagship .four .girdBox .fourBox img {
  width: 2.36rem;
  height: 2.36rem;
}

@media (max-width: 768px) {
  #Flagship .four .girdBox {
    grid-template-columns: repeat(2, 2.87rem);
  }
}

#Flagship .cooperation {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  #Flagship .cooperation {
    flex-direction: column;
  }
}

#Flagship .cooperation .box {
  flex: 1;
}

#Flagship .cooperation .box h2 {
  font-size: .36rem;
  text-align: center;
  font-weight: 600;
  color: #0036CC;
}

#Flagship .cooperation .box .content {
  background-color: #EFEFEF;
  width: 5.91rem;
  height: 4.88rem;
  padding: 0.45rem 0;
}

@media (max-width: 768px) {
  #Flagship .cooperation .box .content {
    height: auto;
  }
}

#Flagship .cooperation .box .content .logo {
  width: 5.37rem;
  display: flex;
  margin: 0 auto 0.13rem;
}

#Flagship .cooperation .box .content .sy-box {
  width: 5.37rem;
  height: 3.02rem;
  margin: 0 auto;
}

#Flagship .cooperation .box .content #zfslider,
#Flagship .cooperation .box .content #zwslider {
  width: 5.37rem;
  height: 3.02rem;
  display: block;
}

#Flagship .cooperation .box .content #zfslider .sliderLi .img,
#Flagship .cooperation .box .content #zwslider .sliderLi .img {
  height: 3.02rem;
  width: 100%;
  object-fit: cover;
}

#Plan .list {
  display: grid;
  grid-template-columns: repeat(3, 3.68rem);
  /* 4列布局 */
  gap: 0.49rem;
  /* 元素间隙 */
  justify-content: center;
  /* 水平居中 */
}

@media (max-width: 768px) {
  #Plan .list {
    grid-template-columns: repeat(2, 1.54rem);
  }
  #Plan .list .productBox {
    width: 1.54rem;
    height: 2.41rem;
  }
  #Plan .list .productBox .img-container {
    width: 100%;
    /* 设置容器宽度 */
    height: .96rem;
    /* 设置容器高度，根据需要调整 */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    /* 防止图片溢出 */
  }
  #Plan .list .productBox .img-container .centered-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    /* 保持图片比例 */
  }
  #Plan .list .productBox .title,
  #Plan .list .productBox .more,
  #Plan .list .productBox .local {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 1.4rem;
  }
}

#Plan .list .productBox {
  display: flex;
  align-items: center;
  flex-direction: column;
  color: #444444;
  width: 3.68rem;
  height: 3.66rem;
  box-shadow: 4px 2px 8px rgba(0, 0, 0, 0.25);
}

#Plan .list .productBox .img-container {
  width: 100%;
  /* 设置容器宽度 */
  height: .96rem;
  /* 设置容器高度，根据需要调整 */
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  /* 防止图片溢出 */
}

#Plan .list .productBox .img-container .centered-img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  /* 保持图片比例 */
}

#Plan .list .productBox .title {
  font-size: .18rem;
  font-weight: 600;
  margin: .29rem .21rem;
}

#Plan .list .productBox .more, #Plan .list .productBox .local {
  width: 100%;
  font-size: .16rem;
  display: flex;
  align-items: center;
  margin-bottom: 0.1rem;
}

.search {
  display: flex;
  margin-bottom: .5rem;
  justify-content: space-evenly;
}

.search .fuzzy_search {
  width: 1.2rem;
  height: .3rem;
  background-color: #0036CC;
  color: #FFF;
  border-radius: .05rem;
  border: none;
}

.search input {
  width: 1.7rem;
  height: .36rem;
  border-radius: .05rem;
  margin-right: 0.1rem;
}

.search select {
  width: 1.7rem;
  height: .36rem;
  border-radius: .05rem;
  margin-right: 0.1rem;
}