<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">.cs {
  width: 100%;
  height: 100vh;
  background-color: aqua;
}

.content {
  width: 100%;
  display: flex;
  justify-content: center;
  position: relative;
}

.content2 {
  width: 83.34%
    /* 8.33 */
}

.top {
  position: absolute;
  width: 100%;
  height: 100px;
  top: 0;
  left: 0;
  transform: translateY(-200%);
  pointer-events: none;
}

.top2 {
  position: absolute;
  width: 100%;
  height: 100px;
  top: 0;
  left: 0;
  transform: translateY(-100%);
  pointer-events: none;
}

@font-face {
  font-family: 'Montserrat';
  src: url(../font/Montserrat-Medium-7.otf);
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'MontserratRegular';
  src: url(../font/Montserrat-Regular-8.otf);
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

:root {
  --14: 14px;
  --16: 16px;
  --18: 18px;
  --20: 20px;
  --24: 24px;
  --30: 30px;
  --36: 36px;
  --48: 48px;
  --50: 50px;
  --64: 54px;
  --68: 68px;
  --90: 4.6875vw;
  --128: 6.6666666667vw;
  --200: 10.4166666667vw;
  --l30: 30px;
  --l35: 35px;
  --l60: 50px;
  --l70: 70px;
  --b: #333333;
  --g: #16817D;
  --y: #C78F42;
}

.detCon {
  margin-top: 100px;
}

.navBox {
  margin: 0;
  height: 100px;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  transition: all .5s;
  color: var(--black);
}


.head-left a {
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all .5s;
}



.navBox2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0;
  height: 100%;
  z-index: 100;
}

.head-navBox {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.head-navBox2 {
  height: 100%;
}



.head-navUl {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
  transition: all .5s;
  opacity: 1;
  margin-right: 3.125vw;
}

.head-navLi {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 400;
  padding: 0 1.1875vw;
  color: #ffffff;
  text-align: center;
}

.head-navLi .head-a:hover #text {
  opacity: 0;
}

.head-navLi .head-a:hover #text2 {
  opacity: 1;
}

.head-navA {
  cursor: pointer;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.head-a {
  font-weight: 400;
  font-size: var(--16);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.head-a::after {
  content: '';
  width: 100%;
  position: absolute;
  bottom: 0;
  height: 1px;
  background-color: #ffffff;
  left: 0;
  transform: translateX(-100%);
  transition: none;
}

#text {
  transition: all .5s;
}

#text2 {
  position: absolute;
  /* font-weight: 700; */
  transition: all .5s;
  opacity: 0;
}

.head-liAct #text {
  opacity: 0;
}

.head-liAct #text2 {
  opacity: 1;
}

.head-a:hover::after {
  left: 0;
  width: 100%;
}


.head-navLi:last-child {
  padding-right: 0;
}

.head-logo {
  width: 274px;
  filter: brightness(0) invert(1);
  transition: all .5s;
}

.head-butBox {
  display: flex;
  justify-content: center;
  align-items: center;
}

.head-lag {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  position: relative;
}

.head-lag img {
  width: 24px;
}

.head-lagBox {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: var(--g);
  transform: translateY(110%);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 12px 0;
  opacity: 0;
  visibility: hidden;
  transition: all .5s;
}


.head-lagBox a {
  font-weight: 600;
  font-size: var(--18);
  color: #ffffff !important;
  text-align: center;
  margin-bottom: 5px;
}

.head-lagBox a:last-child {
  margin-bottom: 0;
}

.head-lagBox a:hover {
  color: var(--y) !important;
}

.head-lag:hover .head-lagBox {
  opacity: 1;
  visibility: visible;
}

.head-search {
  line-height: 0;
  padding-right: 0.78125vw;
  margin-right: 0.78125vw;
  position: relative;
  cursor: pointer;
}

.head-search::after {
  content: '';
  width: 1px;
  height: 100%;
  background-color: #fff;
  position: absolute;
  right: 0;
  top: 0;
}

.head-search img {
  filter: brightness(0) invert(1);
}

.head-lag img {
  filter: brightness(0) invert(1);
}

.head-lag p {
  font-weight: 600;
  font-size: var(--18);
  color: #ffffff;
  padding-left: 0.2604166667vw;
  padding-right: 0.0520833333vw;
}

.head-listBut {
  width: 80%;
  height: 30px;
  display: none;
  justify-content: space-between;
  align-items: self-end;
  flex-direction: column;
  cursor: pointer;
}

.head-listBut div {
  transition: all .5s;
  width: 100%;
  height: 1px;
  position: relative;
}

.head-listBut div:nth-child(1) {
  animation: long 2s linear infinite;
  -webkit-animation: long 2s linear infinite;
}

.head-listBut div:nth-child(2) {
  width: 50%;
}

.head-listBut div:nth-child(2)::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: var(--b);
  opacity: 0;
  z-index: 1;
  transition: all .5s;
}

.head-listBut div:nth-child(2)::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: var(--b);
  opacity: 0;
  z-index: 1;
  transition: all .5s;
}

.head-listBut div:nth-child(3) {
  animation: long 3s linear infinite;
  -webkit-animation: long 3s linear infinite;
}

@keyframes long {
  0% {
    width: 0;
  }

  25% {
    width: 25%;
  }

  50% {
    width: 100%;
  }

  75% {
    width: 25%;
  }

  100% {
    width: 0;
  }
}

.head-listAct div:nth-child(3),
.head-listAct div:nth-child(1) {
  opacity: 0;
}

.head-listAct div:nth-child(2) {
  width: 100%;
  transform: translateX(-25%) rotate(180deg);
  background: transparent !important;
}

.head-listAct div:nth-child(2)::after {
  opacity: 1;
  transform: rotate(-45deg);
}

.head-listAct div:nth-child(2)::before {
  opacity: 1;
  transform: rotate(45deg);
}

.head-listBox {
  overflow: hidden;
  width: 100%;
  min-height: 0;
  height: 0;
  background-color: #ffffff;
  position: absolute;
  top: 100%;
  left: 0;
  transition: all .5s;
  overflow-y: scroll;
}

.navBox:has(.head-listAct) .head-listBox {
  min-height: 100vh;
}

.navBox:has(.head-listAct) {
  background-color: #fff;
}

.head-listAct div {
  background-color: #333;
}

.head-act #text2 {
  color: var(--g);
}

.head-list {
  margin-top: 20px;
  color: #333;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.head-listLi {
  font-size: 16px;
  font-weight: 700;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 0px;
}



.iconfont {
  transition: all .5s;
}

.head-right {
  transition: all .5s;
  cursor: pointer;
  width: 20%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.head-right img {
  transition: all .5s;
}

.head-listLi a {
  width: 100%;
}

.head-listLi a:hover {
  color: var(--b1);
}

.head-listLi2 {
  width: 100%;
  padding: 0 10%;
  overflow: hidden;
  position: relative;
  transition: all .5s;
  /* opacity: 0; */
}

.head-listLi2::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 80%;
  height: 1px;
  background-color: #e5e5e5;
}

:where(.head-act, .head-act2) {
  background-color: #fff;
  box-shadow: 0px 4px 10px 0px rgba(102, 102, 102, 0.15);
}

.head-act2 {
  height: 80px;
}

.head-act2 .head-logo {
  filter: none;
  width: 220px;
}

.head-act .head-lag p,
.head-act .head-a {
  color: var(--b);
}

.head-lag img {
  transition: all .5s;
}

/* .head-lag:hover img {
  transform: rotate(180deg);
} */

.head-act .head-search::after {
  background-color: var(--b);
}

.head-act .head-logo {
  filter: none;
}

.head-act .head-search img {
  filter: none;
}

.head-act .head-lag img {
  filter: none;
}


.head-act .head-listBut div {
  background-color: var(--b);
}

.head-sonList {
  display: none;
}

.head-sonList ul {
  padding-bottom: 18px;
}

.head-listIocn img {
  transition: all .5s;
}

.head-sonList li {
  font-size: 14px;
  color: var(--b);
  padding: 5px 0;
}

.head-lagBox2 {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--b);
  font-weight: 600;
  font-size: 18px;
  margin-top: 80px;
}

.head-lagBox2 a {
  position: relative;
  padding: 0 10px;
}

.head-lagBox2 a::after {
  height: 80%;
  width: 2px;
  background-color: var(--g);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  content: '';
}

.head-lagBoxAct {
  color: var(--y) !important;
}

.head-lagBox2 a:last-child::after {
  display: none;
}

.head-language2 {
  width: 100%;
  text-align: center;
  margin-top: 100px;
}

.head-language2 {
  color: #666666;
}

.head-language2 span {
  color: #666666;
  margin: 0 10px;
}

.head-languageAct {
  color: #1E5DD1 !important;
}

/* æœç´¢ */

.head-searc {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background-color: rgba(22, 129, 125, 0.95);
  z-index: 10000;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: all .5s;
}

.head-searcAct {
  opacity: 1;
  visibility: visible;
}

.head-listFrom {
  width: 50%;
  padding-left: 30px;
  margin: 0 auto;
  border-bottom: 2px solid #D8D8D8;
}

.head-searcTit {
  margin-bottom: 30px;
}

.head-searcTit h2 {
  font-size: var(--50);
  font-weight: 700;
  color: #ffffff;
}

.head-listInp {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: transparent;
  outline: 0;
  border: 0;
  height: 40px;
  font-size: var(--18);
  color: #ffffff;
}

.head-listInp::placeholder {
  color: #ffffff;
}

.head-listFrom2 {
  display: flex;
  justify-content: center;
  align-items: center;
}

.head-btn {
  width: 70px;
  height: 70px;
  background-color: transparent;
  cursor: pointer;
}

.btn-icon1 {
  font-size: 30px !important;
  color: #ffffff !important;
}

.head-searchBox a {
  display: flex;
  justify-content: center;
  align-items: center;
}

.head-searchBox p {
  color: #ffffff;
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
  letter-spacing: 0.1em;
}

.head-close {
  width: 1.5625vw;
  height: 1.5625vw;
  position: absolute;
  left: 86vw;
  top: 4vw;
  cursor: pointer;
  fill: #ffffff;
}

.head-close:hover {
  transform: rotate(180deg);
  transition: all .5s;
}

/* æœç´¢---ç»“æŸ */


.head-seBox {
  width: 100%;
  max-height: 0;
  overflow: hidden;
  position: absolute;
  left: 0;
  bottom: 0;
  transform: translateY(100%);
  opacity: 0;
  visibility: hidden;
  transition: all .7s;
  box-shadow: inset 0px 0px 6px 0px #000000;
}

.head-navLi:hover .head-seBox {
  opacity: 1;
  visibility: visible;
  max-height: 700px;
  transition: all 1s;
}

.head-seBox2 {
  height: 310px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #fff;
  box-shadow: 0px 0px 6px 0px #00000011 inset;
}

.head-seLeft {
  background-color: var(--g);
  width: 42.1875vw;
  height: 100%;
  position: relative;
  padding-right: 5.2083333333vw;
  padding-top: 49.8px;
  padding-left: 40px;
}

.head-bg {
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.3;
}

.head-seTit {
  margin-bottom: 20px;
}

.head-seTit h2 {
  font-size: var(--36);
  font-weight: 700;
  color: #fff;
  text-align: right;
}

.head-seText {
  font-size: var(--16);
  color: #ffffff;
  line-height: 1.5em;
  letter-spacing: 0.02em;
  text-align: right;
  font-weight: 400;
  white-space: wrap;
}

.head-serig {
  width: calc(100% - 42.1875vw);
  display: flex;
  justify-content: space-between;
  padding-right: 8.33%;
  padding-left: 1.8541666667vw;
}

.head-sedot {
  width: 6px;
  height: 6px;
  background-color: var(--g);
  margin-right: 8px;
  border-radius: 50%;
  opacity: 0;
  transition: all .5s;
}

.head-seNav {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  width: 50%;
}

.head-seNav2 {
  font-size: var(--16);
  color: var(--b);
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-bottom: 10px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
}

.head-seNav2 a {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.head-seNav2 a:hover {
  color: var(--g);
}

.head-seNav2 a:hover .head-sedot {
  opacity: 1;
}

.head-seimg {
  position: relative;
  width: 402px;
  height: 222px;
  overflow: hidden;
  line-height: 0;
  -webkit-box-reflect: below 0px linear-gradient(to top, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 20%);
  -moz-box-reflect: below 0px linear-gradient(to top, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0) 20%);
}

.head-seimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all .7s;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.head-seimg .head-seimgAct {
  visibility: visible;
  opacity: 1;
  position: relative;
}


.head-seimg:hover img {
  transform: scale(1.1);
}

/* è½®æ’­å›¾ */
.banner-box {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: relative;
}

.banner-box2 {
  height: 100%;
}

.banner-swiper {
  height: 100%;
  position: relative;
  overflow: hidden;
}

.banner-slide1 {
  overflow: hidden;
}

.banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1 !important;
  z-index: -1;
  transform: scale(1.1);
}

.banner-con {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.banner-con2 {
  position: relative;
  opacity: 0;
  animation-delay: 2s !important;
}

.banner-bigImg1 {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.banner-bigImg2 {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
}

.first {
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.first .banner-con2 {
  animation-delay: 1s !important;
}

.banner-bigImg2 img {
  transform: scale(1.3);
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.banner-bigImgAct {
  animation: bannerImgAct 2s forwards;
}


.banner-bigImgAct3 {
  animation: bannerImgAct3 6s forwards;
}

.banner-titBox {
  width: 80%;
}

@keyframes bannerImgAct {
  100% {
    /* z-index: 10; */
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}



@keyframes bannerImgAct3 {
  0% {
    transform: scale(1.3);
  }

  100% {
    transform: none;
  }
}

.banner-tit {
  text-align: left;
}

.banner-tit1 {
  margin-bottom: 1.9791666667vw;
}

.banner-tit1 h2 {
  font-size: var(--64);
  color: #ffffff;
  font-weight: 700;
}

.banner-tit2 {
  animation-delay: 0.2s !important;
}

.banner-tit2 h2 {
  font-size: var(--36);
  color: #ffffff;
  font-weight: 700;
}

.banner-pageBox {
  position: absolute;
  top: 50%;
  right: 8.33%;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;

}

.banner-pageBox2 {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.banner-pageBox2,
.banner-pageBox .banner-pageAll {
  font-size: 16px;
  color: #ffffff;
  font-weight: 300;
  font-family: 'Montserrat';
}

.banner-pageBox .banner-page {
  font-size: 36px;
  color: #ffffff;
  font-weight: 700;
  line-height: 36px;
}


.banner-pageBut {
  line-height: 0;
  margin-left: 1.875vw;
}

.banner-next,
.banner-prev {
  width: 37px;
  cursor: pointer;
  position: relative;
}

.banner-prev img,
.banner-next img {
  width: 100%;
  object-fit: cover;
}

.banner-but1 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  filter: brightness(0) invert(1);
  transition: all .5s;
  z-index: 0;
}

.banner-nImg2 {
  -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  transition: all .5s;
}

.banner-pImg2 {
  -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  transition: all .5s;
}

.banner-next:hover .banner-but2,
.banner-prev:hover .banner-but2 {
  webkit-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
  clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
}


.banner-next {
  margin-bottom: 0.9375vw;
}

.banner-scrBox {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: 1.6979166667vw;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.banner-scrBox p {
  font-size: var(--18);
  color: #ffffff;
  margin-bottom: 0.8333333333vw;
}

.banner-scr {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.25vw;
  height: 1.9270833333vw;
  border-radius: 20px;
  border: 2px solid #ffffff;
}

.banner-scr div {
  height: 6px;
  width: 2px;
  background-color: #ffffff;
  border-radius: 3px;
  animation: bannerscr 4s linear infinite
}

@keyframes bannerscr {
  25% {
    transform: translate(0%, 0.3125vw);
  }

  75% {
    transform: translate(0%, -0.3125vw);
  }
}

.food-box {
  background-color: #272727;
  padding-top: 4.5833333333vw;
}

.food-top {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  position: relative;
  padding-bottom: 4.6354166667vw;
}

.food-top::after {
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #fff;
  opacity: 0.4;
  content: '';
  bottom: 0;
  left: 0;
}

.food-logo {
  width: 19.6875vw;
  margin-bottom: 2.3958333333vw;
}

.food-con1 {
  margin-bottom: 2.1354166667vw;
}

.food-con1 li {
  display: flex;
  align-items: center;
  color: #ffffff;
  font-weight: 300;
  font-size: var(--16);
  margin-bottom: 1.1458333333vw;
}

.food-con1 li:last-child {
  margin-bottom: 0;
}

.food-con1 p {
  position: relative;
  padding-right: 0.5208333333vw;
  margin-right: 1.25vw;
}

.food-con1 p::after {
  position: absolute;
  height: 70%;
  width: 2px;
  background-color: #C78F42;
  content: '';
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.food-con2 {
  display: flex;
  align-items: center;
}

.food-con2 li {
  margin-right: 0.6770833333vw;
}

.food-con2 li img {
  transition: all .5s;
}

.food-con2 li:hover img {
  transform: translateY(-5px);
}

.food-con1 a {
  transition: all .5s;
}

.food-con1 a:hover {
  color: var(--y);
}

.food-con2 a {
  width: 100%;
  height: 100%;
  display: block;
  line-height: 0;
}

.food-left {
  width: 30%;
}

.food-rig {
  width: 65%;
  display: flex;
  justify-content: space-between;
}

.food-rig li {
  flex: 1;
}

.food-nav {
  color: #ffffff;
  font-size: var(--16);
  font-weight: 700;
  position: relative;
  padding-bottom: 0.7291666667vw;
  margin-bottom: 0.8854166667vw;
}

.food-nav::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 24%;
  background-color: var(--y);
  height: 2px;
}

.food-nav2 {
  color: #ffffff;
  font-weight: 300;
  font-size: var(--14);
  opacity: 0.4;
  margin-bottom: 0.4166666667vw;
  transition: all .5s;
}

.food-nav2:hover {
  opacity: 1;
}

.food-bom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 300;
  color: #ffffff;
  opacity: 0.4;
  font-size: var(--16);
  padding: 1.6145833333vw 0;
}

.index-tit2,
.index-tit {
  position: relative;
}

.index-tit img {
  position: absolute;
  left: 0;
  top: 0;
  transform: translateX(-50%);
  width: 77px;
}

.index-tit2 img {
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-50%, -30%);
  width: 77px;
}

.index-tit h2 {
  font-weight: 700;
  color: var(--b);
  letter-spacing: 0.02em;
  font-size: var(--48);
  position: relative;
  z-index: 10;
}

.index-tit2 h2 {
  font-weight: 700;
  color: var(--b);
  letter-spacing: 0.02em;
  font-size: var(--36);
  position: relative;
  z-index: 10;
}

.index-butBox {
  font-size: var(--16);
  color: #000;
  letter-spacing: 0.02em;
  font-weight: 400;
  display: inline-block;
  position: relative;
  border-radius: 50px;
}

.index-butBox .index-butBox2,
.index-butBox a {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(22, 129, 125, 0.1);
  padding: 0.703125vw 1.875vw 0.703125vw 4.5vw;
  border-radius: 50px;
}

.index-butImg {
  aspect-ratio: 1;
  height: 100%;
  background-color: var(--g);
  position: absolute;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: all .5s;
}

.index-butImg::after {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--g);
  opacity: 0.2;
  transition: all 1s;
  content: '';
  position: absolute;
}

.index-butImg::before {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.7);
  background-color: var(--g);
  opacity: 0.1;
  transition: all 1s;
  content: '';
  position: absolute;
}

.index-butImg img {
  width: 23px;
  position: relative;
  z-index: 10;
  transition: all .5s;
}

.index-butBox:hover .index-butImg img {
  transform: rotate(45deg);
}

.index-butBox:hover .index-butImg::after {
  transform: translate(-50%, -50%) scale(1.4);
}

.index-butBox:hover .index-butImg::before {
  transform: translate(-50%, -50%) scale(1.7);
}

/* èµ°è¿›ç‘žæº */
.inry-box {
  position: relative;
  overflow: hidden;
}

.inry-eng {
  position: absolute;
  top: 10.78125vw;
  left: 50%;
  font-size: 5vw;
  white-space: nowrap;
  line-height: 4.1666666667vw;
  font-weight: 600;
  font-family: 'Montserrat';
  text-shadow: 0 0 2px #C78F42;
  color: #ffffff;
  opacity: 0.5;
}

.inry-bg {
  width: 28.3854166667vw;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.inry-ruiyuan {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 99;
  width: 46.71875vw;
  transform: translateY(100%);

}

.inry-box2 {
  position: relative;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}

.inry-left {
  padding-top: 6.5104166667vw;
  padding-bottom: 5.8854166667vw;
  padding-left: 8.33%;
  width: calc(100% - 42vw);
}

.inry-rig {
  padding-top: 7.5520833333vw;
  padding-left: 5.4166666667vw;
  background-color: var(--g);
  padding-right: 8.33%;
  width: 42vw;
}

.inry-text {
  font-size: var(--16);
  color: var(--b);
  font-weight: 400;
  line-height: 1.5em;
  text-align: justify;
  width: 83%;
  margin-top: 6.6666666667vw;
  margin-bottom: 7.96875vw;
}

.inry-text p:first-child {
  margin-bottom: 1.6666666667vw;
}

.inry-tit {
  font-size: var(--18);
  letter-spacing: 0.02em;
  font-weight: 700;
  color: #ffffff;
}

.inry-num {
  font-family: 'Montserrat';
  font-size: var(--90);
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
}

.inry-num2 {
  position: relative;
  color: transparent;
  font-family: 'Montserrat';
  font-size: var(--90);
}

.inry-numBox3 {
  display: inline-block;
}

.inry-numBox4 {
  position: relative;
  display: inline-block;
}

.inry-numBox4 span {
  font-size: var(--24);
  color: #ffffff;
  font-weight: 700;
  position: absolute;
  top: 0;
  right: 0;
  transform: translateX(100%);
}

.inry-numBox {
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: wrap;
}

.inry-numBox2 {
  width: 50%;
  margin-bottom: 2.5vw;
}

.inry-numBox2:nth-child(2) {
  display: flex;
  justify-content: flex-end;
}

/* äº§å“ä¸­å¿ƒ */
.inpro-box {
  padding-top: 8.4375vw;
  padding-bottom: 5.4166666667vw;
}

.inpro-titBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4.21875vw;
}

.inpro-conBox {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
}

.inpro-conBox2 {
  width: 23.6%;
  margin-bottom: 6.5104166667vw;
  position: relative;
}

.inpro-conBox2 a {
  width: 100%;
  height: 100%;
  display: block;
  line-height: 0;
}

.inpro-imgBox {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.inpro-conBox2 .inpro-img {
  width: 100%;
  object-fit: cover;
  transition: all .5s;
}

.inpro-conTit {
  position: absolute;
  bottom: 0;
  transform: translateY(100%);
  width: 100%;
  text-align: center;
  line-height: var(--20);
  height: 3.5416666667vw;
  display: flex;
  align-items: flex-end;
}

.inpro-conTit h3 {
  text-align: center;
  font-weight: 700;
  color: var(--b);
  letter-spacing: 0.02em;
  font-size: var(--20);
  width: 100%;
  transition: all .5s;
}

.inpro-conBox2:last-child {
  background-color: var(--g);
}

.inpro-more {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #16817DE5;
  opacity: 0;
  transition: all .5s;
}

.inpro-more2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  justify-content: center;
  align-items: center;
}



.inpro-moreBox {
  min-width: 53px;
  width: 53px;
  height: 53px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  cursor: pointer;
  margin-right: 0.9895833333vw;
  transition: all .5s;
}

.inpro-more2:hover .inpro-moreBox {
  transform: rotate(45deg);
}

.inpro-more2 p {
  font-size: var(--18);
  line-height: 1.5em;
  letter-spacing: 0.02em;
  color: #ffffff;
  white-space: nowrap;
}

.inpro-conimg {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 11.71875vw;
  pointer-events: none;
  transition: all .5s;
  transform: translateY(50%);
}

.inpro-conBox2:hover .inpro-more {
  opacity: 1;
}

.inpro-conBox2:hover .inpro-img {
  transform: scale(1.1);
}

.inpro-conBox2:hover .inpro-conTit h3 {
  color: var(--g);
}

.inpro-conBox2:hover .inpro-conimg {
  transform: translateY(0);
}

.inpro-conBox2:last-child .inpro-conimg {
  transform: none !important;
}

/* æ™ºæ…§å·¥ç¨‹ */
.ineng-box {
  width: 100%;
  overflow: hidden;
  position: relative;
  padding-top: 7.6041666667vw;
  padding-bottom: 9.40625vw;
}

.ineng-bg {
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--g);
  width: 49.375vw;
  height: 100%;
}

.ineng-box2 {
  position: relative;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.ineng-left {
  width: 42%;
  padding-left: 8.33%;
}

.ineng-rig {
  width: 55.3%;
}

.ineng-tit h2 {
  color: #ffffff;
}

.ineng-text {
  color: #ffffff;
  margin-top: 3.59375vw;
  margin-bottom: 6.1458333333vw;
  width: 100%;
}

.ineng-butBox {
  background-color: rgb(255, 255, 255, 0.2);
  color: #ffffff;
}

.ineng-butBox .index-butImg {
  background-color: var(--y);
}

.ineng-butBox .index-butImg::after,
.ineng-butBox .index-butImg::before {
  background-color: var(--y);
}

.ineng-imgBox {
  width: 100%;
  aspect-ratio: 3/2;
  position: relative;
  line-height: 0;
}

.ineng-imgBox::after {
  width: 100%;
  height: 100%;
  background-color: var(--y);
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(0, 0);
  z-index: -1;
  transition: all .5s;
}

.ineng-imgBox::before {
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.6;
  transition: all .5s;
}

.ineng-imgBox img {
  width: 100%;
  object-fit: cover;
}

.ineng-swiper {
  overflow: hidden;
  width: 100%;
}


.ineng-contit {
  margin-left: 9.0625vw;
  margin-top: 1.5625vw;
  padding-right: 60px;
  opacity: 0;
  transition: all .5s;
  pointer-events: none;
  min-height: 60px;
}



.ineng-contit p {
  font-size: var(--18);
  font-family: 'MontserratRegular';
  color: var(--g);
}

.ineng-contit h3 {
  font-size: var(--20);
  color: var(--b);
  letter-spacing: 0.02em;
  font-weight: 700;
}

.ineng-slide1 {
  padding-left: 1.5625vw;
  padding-top: 1.5625vw;
}


.ineng-swiper .swiper-slide-active .ineng-imgBox::after {
  transform: translate(-1.5625vw, -1.5625vw);
}

.ineng-swiper .swiper-slide-active .ineng-imgBox::before {
  opacity: 0;
}

.ineng-pageBox {
  position: absolute;
  bottom: -1.3020833333vw;
  right: 8.33%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99;
  background-color: #fff;
}

.ineng-pageBox .swiper-pagination2 {
  width: auto;
  font-size: 16px;
  color: var(--b);
  font-weight: 300;
  padding: 0 1.25vw;
}

.ineng-pageBox .swiper-pagination-current {
  font-family: 'Montserrat';
  font-size: 36px;
  color: var(--b);
  font-weight: 700;
}

.ineng-pageBox .swiper-pagination-total {
  font-family: 'Montserrat';
  font-size: 16px;
  color: var(--b);
  font-weight: 300;
}

.ineng-but {
  border: 1px solid #999999;
  margin: 0;
  cursor: pointer;
}

.ineng-but:hover img {
  filter: brightness(0) invert(1);
}


/* ç‘žæºä¼˜åŠ¿ */
.inadv-con {
  padding-top: 6.6666666667vw;
  padding-bottom: 6.40625vw;
}

.inadv-map2 {
  display: none;
}


.inadv-i {
  min-width: 12px;
  height: 12px;
  border-radius: 50%;
  margin-right: 0.5729166667vw;
  transform: translateY(100%);
  background-color: var(--g);
}

.inadv-advTIt {
  font-size: var(--20);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--b);
}

.inadv-adv {
  width: 60%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 1.9270833333vw;
  flex-wrap: wrap;
}


.inadv-adv2 {
  width: 42%;
  margin-right: 3.8020833333vw;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 1.0416666667vw;
}

.inadv-conBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.inadv-sign {
  width: 23.4%;
}

.inadv-sign2 {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  padding-bottom: 0.46875vw;
  margin-bottom: 2.5520833333vw;
}

.inadv-sign2:last-child {
  margin-bottom: 0;
}

.inadv-sign2::after {
  width: 100%;
  height: 1px;
  background-color: #E8E8E8;
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all .5s;
}

.inadv-sign2::before {
  width: 0%;
  height: 1px;
  background-color: var(--g);
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all .5s;
  z-index: 10;
  transition: all .5s;
}

.inadv-sign2:hover::before {
  width: 100%;
}

.inadv-signleft {
  display: flex;
  align-items: center;
}

.inadv-num {
  position: relative;
  display: inline-block;
  min-width: 104px;
  width: 104px;
  margin-right: 0.8854166667vw;
}

.inadv-icon {
  transition: all .5s;
}

.inadv-sign2:hover .inadv-icon {
  transform: rotateY(180deg);
}

.inadv-num p {
  font-size: 68px;
  font-family: 'Montserrat';
  color: var(--g);
  position: relative;
  display: inline-block;
  line-height: 60px;
}

.inadv-num span {
  font-size: var(--24);
  color: var(--g);
  position: absolute;
  transform: translateY(-50%);
}

.inadv-signTit {
  font-size: var(--16);
  color: var(--b);
  letter-spacing: 0.02em;
  font-weight: 500;
}

.inadv-icon {
  width: 1.8229166667vw;
  margin-right: 2.2395833333vw;
}

.inadv-map {
  width: 100%;
  object-fit: cover;
}

.inadv-mapBox {
  width: 60.8333333333vw;
  position: relative;
  line-height: 0;
}

.map-li {
  position: absolute;
  cursor: pointer;
  width: 0.5208333333vw;
  height: 0.5208333333vw;
}

.map-i {
  width: 0.3645833333vw;
  height: 0.3645833333vw;
  background-color: var(--g);
  border-radius: 50%;
  cursor: pointer;
  transition: all .5s;
}

.map-iconBox img {
  width: 18px;
  filter: brightness(0) invert(1);
  margin-right: 10px;
}

.map-iconBox img:last-child {
  margin-right: 0;
}

.map-iconBox {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.map-liCon {
  background-color: var(--g);
  border-radius: 5px;
  padding: 11px 17px 11px 18px;
  min-width: 162px;
  position: absolute;
  opacity: 0;
  visibility: hidden;
  transition: all .5s;
  transform: translateX(10%);
  left: 20px;
  top: -20px;
  z-index: 100;
}

.map-liCon2 {
  left: unset;
  right: 20px;
  transform: translateX(-10%);
}

.map-country {
  font-size: var(--14);
  line-height: 20px;
  color: #ffffff;
  letter-spacing: 0.02em;
  margin-bottom: 8px;
}

.map-mapIcon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -100%);
  opacity: 0;
  visibility: hidden;
  transition: all .5s;
}

.map-liAct .map-i {
  opacity: 0;
}

.map-liAct .map-mapIcon {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -70%);
}

.map-liAct .map-liCon {
  opacity: 1;
  visibility: visible;
  transform: none;
}

/* .map-li:hover .map-i {
  opacity: 0;
}

.map-li:hover .map-mapIcon {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -70%);
}

.map-li:hover .map-liCon {
  opacity: 1;
  visibility: visible;
  transform: none;
} */

/* é’å²›æ€»éƒ¨ */
.map-QD {
  top: 13.2291666667vw;
  left: 22.6041666667vw;
}

/* å°åº¦å°¼è¥¿äºš */
.map-ID {
  top: 19.6875vw;
  left: 21.5104166667vw;
}

/* å“ˆè¨å…‹æ–¯å¦ */
.map-KZ {
  top: 10.8333333333vw;
  left: 14.53125vw;
}

/* å‰å°”å‰æ–¯æ–¯å¦ */
.map-KG {
  top: 12.1875vw;
  left: 15.3645833333vw;
}

/* å¡”å‰å…‹æ–¯å¦ */
.map-TJR {
  top: 12.8645833333vw;
  left: 15vw;
}

/* é¦™æ¸¯ */
.map-Hk {
  top: 15.625vw;
  left: 21.5625vw;
}

/* æ³°å›½ */
.map-THA {
  top: 16.9270833333vw;
  left: 19.4791666667vw;
}

/* è²å¾‹å®¾ */
.map-PHI {
  top: 17.65625vw;
  left: 23.125vw;
}

/* åŠ&nbsp;æ‹¿å¤§ */
.map-CA {
  top: 9.0104166667vw;
  left: 43.6979166667vw;
}

/* ç¾Žå›½ */
.map-USA {
  top: 12.65625vw;
  left: 44.84375vw;
}

/* å¢¨è¥¿å“¥ */
.map-Mexico {
  top: 15.6770833333vw;
  left: 45.2083333333vw;
}

/* å“¥ä¼¦æ¯”äºš */
.map-CO {
  top: 18.6458333333vw;
  left: 49.7395833333vw;
}

/* ç‰¹å¤š */
.map-TAT {
  top: 17.4479166667vw;
  left: 51.8229166667vw;
}

/* ç§˜é² */
.map-PE {
  top: 20.9895833333vw;
  left: 49.375vw;
}

/* å·´è¥¿ */
.map-Brazil {
  top: 21.1979166667vw;
  left: 53.4895833333vw;
}

/* é˜¿æ&nbsp;¹å»· */
.map-ARG {
  top: 25.46875vw;
  left: 51.40625vw;
}

/* ä¿„ç½—æ–¯ */
.map-RUS {
  top: 8.4895833333vw;
  left: 9.9479166667vw;
}

/* ä¹Œå…‹å…° */
.map-UA {
  top: 10.625vw;
  left: 8.3333333333vw;
}

/* ä¹Œå…¹åˆ«å…‹æ–¯å¦ */
.map-UZ {
  top: 12.34375vw;
  left: 13.5416666667vw;
}

/* åœŸåº“æ›¼æ–¯å¦ */
.map-TMM {
  top: 12.8125vw;
  left: 12.7604166667vw;
}

/* åŸƒåŠ */
.map-EG {
  top: 15.3645833333vw;
  left: 7.96875vw;
}

/* åˆ©æ¯”äºš */
.map-LBA {
  top: 15vw;
  left: 6.09375vw;
}

/* ä¸­éž */
.map-Ebony {
  top: 18.4375vw;
  left: 6.6145833333vw;
}

/* ä¹Œå¹²è¾¾ */
.map-UGA {
  top: 19.2708333333vw;
  left: 8.3333333333vw;
}

/* ç§‘å¨ç‰¹ */
.map-KWI {
  top: 13.8020833333vw;
  left: 10.3125vw;
}

/* æ²™ç‰¹é˜¿æ‹‰ä¼¯ */
.map-KSA {
  top: 15.3645833333vw;
  left: 10.15625vw;
}

/* è¿ªæ‹œ */
.map-DXB {
  top: 15.46875vw;
  left: 12.03125vw;
}

/* é˜¿æ›¼ */
.map-OM {
  top: 15.9895833333vw;
  left: 12.34375vw;
}

/* è‚¯å°¼äºš */
.map-KE {
  top: 19.4791666667vw;
  left: 9.3229166667vw;
}

/* ç§‘æ‘©ç½— */
.map-COM {
  top: 17.7083333333vw;
  left: 11.9270833333vw;
}

/* è£èª‰èµ„è´¨ */
.inhov-box {
  position: relative;
  padding-top: 6.5104166667vw;
  padding-bottom: 4.84375vw;
}

.inhov-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.inhov-titBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 3.90625vw;
  flex-wrap: wrap;
}

.inhov-navBox {
  display: flex;
  justify-content: center;
  align-items: center;
}

.inhov-nav {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-left: auto;
  width: 100%;
  order: 2;
  margin-top: 2.6041666667vw;
}

.inhov-nav2 {
  font-weight: 500;
  color: var(--b);
  font-size: var(--20);
  letter-spacing: 0.02em;
  cursor: pointer;
  position: relative;
  padding-bottom: 0.5208333333vw;
  transition: all .5s;
  margin-right: 3.125vw;
}

.inhov-nav2:last-child {
  margin-right: 0;
}

.inhov-nav2::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  content: '';
  height: 2px;
  background-color: var(--g);
  transition: all .5s;
}

.inhov-navAct {
  color: var(--g);
}

.inhov-navAct::after {
  width: 100%;
}

.inhov-nav2:hover {
  color: var(--g);
}

.inhov-nav2:hover::after {
  width: 100%;
}

.inhov-imgBox {
  aspect-ratio: 3/2;
  width: 100%;
}

.inhov-imgBox img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.inhov-swiper {
  position: relative;
  overflow: hidden;
}

.inhov-swiper .swiper-wrapper {
  padding-bottom: 4.4166666667vw;
}

.inhov-allBox {
  position: relative;
}

.inhov-allBox::after {
  position: absolute;
  /* bottom: calc(10.4166666667vw + 147px); */
  top: 16vw;
  left: 50%;
  transform: translate(-50%, 100%);
  width: 91.5104166667vw;
  content: '';
  z-index: 100;
  height: 1.3020833333vw;
  background-color: #ffffff;
  box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.25);
}

.inhov-conBox {
  opacity: 0;
  position: relative;
  transition: all .3s;
}

.inhov-swiperAct {
  opacity: 1 !important;
  transform: none !important;
  z-index: 10 !important;
  transition: all 1s;
}

.inhov-swiperAct2 {
  display: block !important;
}

.inhov-swiperP {
  position: absolute;
  width: 100%;
  top: 0;
}

.inhov-swBox {
  position: relative;
}



.inhov-pageBox {
  position: relative;
}

.inhov-slide1 {
  position: relative;
  line-height: 0;
}

.inhov-conTit {
  width: 100%;
  padding: 0 10px;
  padding-top: 40px;
}

.inhov-conTit p {
  font-size: var(--18);
  color: var(--b);
  line-height: 1.5em;
  letter-spacing: 0.02em;
  font-weight: 500;
  text-align: center;
}

.inhov-pageBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.inhov-but {
  background-color: transparent;
  border: 1px solid #16817D;
  margin: 0;
  overflow: hidden;
  position: relative;
}

.inhov-but img {
  position: relative;
  z-index: 100;
  transition: all .5s;
}

.inhov-but::after {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--g);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  content: '';
  border-radius: 50%;
  transition: all .5s;
}

.inhov-but:hover::after {
  transform: translate(-50%, -50%) scale(1.1);
}

.inhov-but:hover img {
  filter: brightness(0) invert(1);
}

.inhov-pageBut {
  display: flex;
  align-items: center;
}

.inhov-pageBox .swiper-pagination3 {
  width: 85%;
  position: relative;
  height: 1px;
  background-color: #E8E8E8;
}

.inhov-pageBox .swiper-pagination3 .swiper-pagination-progressbar-fill {
  height: 2px;
  background-color: var(--g);
}

.inhov-prev {
  margin-right: 1.5104166667vw;
}

.inhov-slideAll {
  overflow: visible !important;
}

/* æ–°é—»èµ„è®¯ */
.innew-box {
  padding-top: 6.6145833333vw;
  padding-bottom: 1.9270833333vw;
  overflow: hidden;
  position: relative;
}

.innew-box2 {
  position: unset !important;
}

.innew-titBox {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  padding-bottom: 1.7708333333vw;
}

.innew-titBox::before {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 300%;
  height: 1px;
  background-color: #E8E8E8;
  content: '';
}

.innew-swiper {
  padding: 0 calc(8.33% - 3.0208333333vw);
  display: none;
}

.innew-conBox2 {
  position: relative;
  padding: 0 3.0208333333vw;
  padding-top: 3.4375vw;
  padding-bottom: 9.4791666667vw;
}

.innew-conBox2::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%;
  background-color: #E8E8E8;
  content: '';
}

.innew-swiperBox {
  width: 100%;
  overflow: hidden;
  position: relative;
}

.innew-img {
  width: 100%;
  aspect-ratio: 4/3;
  line-height: 0;
  position: relative;
}

.innew-img2 {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.innew-img2&gt;img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all .5s;
}

.innew-dateBox {
  position: absolute;
  bottom: 0;
  left: 1.5625vw;
  transform: translateY(50%);
}

.innew-date {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 1.0416666667vw;
  line-height: 1.5625vw;
  color: #ffffff;
  font-family: 'MontserratRegular';
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.innew-dateBg {
  width: 5.9780729167vw;
}

.innew-textBox {
  margin-top: 3.1770833333vw;
  padding: 0 1.6666666667vw;
}

.innew-tit {
  margin-bottom: 1.40625vw;
}

.innew-tit p {
  font-size: var(--18);
  color: var(--b);
  font-weight: 500;
  line-height: 1.5em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
  white-space: normal;
  position: relative;
}

.innew-more {
  display: flex;
  align-items: center;
  font-size: var(--18);
  letter-spacing: 0.02em;
  color: #999999;
  transition: all .5s;
}

.innew-more:hover {
  color: var(--g);
}

.innew-more img {
  transition: all .5s;
}

.innew-more:hover img {
  transform: rotate(45deg);
}



.innew-swiper1 .swiper-slide-active {
  pointer-events: none;
}

.innew-swiper1 .swiper-slide-active .innew-swiper {
  pointer-events: all;
}

.innew-conBox2:hover .innew-img2&gt;img {
  transform: scale(1.1);
}

.swiper-pagination4 {
  display: none;
}

.swiper-pagination4 .swiper-pagination-bullet-active {
  background-color: var(--g);
}



.inform-box {
  background-color: #272727;
  position: relative;
  height: 11.1458333333vw;
}

.inform-form {
  position: absolute;
  background-color: var(--g);
  top: -4.4791666667vw;
  padding: 4.4791666667vw 7.0833333333vw;
  border-top-left-radius: 60px;
  border-bottom-right-radius: 60px;
  z-index: 10;
  overflow: hidden;
  left: 8.33%;
}

.inform-formbg {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 16.09375vw;
  z-index: -1;
}

.inform-formTit {
  margin-bottom: 1.71875vw;
}

.inform-formTit h2 {
  font-size: var(--30);
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 0.02em;
  line-height: 1.5em;
}

.inform-formUl {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}

.inform-formLi {
  width: 23%;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.inform-formBut {
  width: 20%;
  background-color: var(--y);
}

.inform-but {
  width: 100%;
  padding: 0.78125vw;
  background-color: var(--y);
  color: #ffffff;
  cursor: pointer;
  font-size: var(--18);
  font-weight: 700;
  transition: all .5s;
}


.inform-inp {
  font-size: var(--14);
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0.02em;
  padding: 0.78125vw 0.78125vw 0.78125vw 1.6145833333vw;
  width: 100%;
  line-height: 0;
}

.inform-inp::placeholder {
  color: #999999;
}

.ban-box {
  line-height: 0;
  position: relative;
}

.ban-box2 {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.ban-box2 img {
  transform: scale(1.1);
}

.ban-tit {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  filter: contrast(20);
  background: #000;
}

.ban-tit h2 {
  font-weight: 700;
  font-size: var(--64);
  color: #ffffff;
  line-height: var(--64);
  /* transition: .2s; */
}

.ban-tit h2 {
  color: white;
  text-transform: uppercase;
  line-height: 1;
  animation: letterspacing 1s forwards alternate ease-in-out;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  white-space: nowrap;
}

@keyframes letterspacing {
  0% {
    letter-spacing: -2.2rem;
    filter: blur(.3rem);
  }

  50% {
    filter: blur(.5rem);
  }

  100% {
    filter: blur(0rem);
  }
}


.ban-box img {
  width: 100%;
  object-fit: cover;
}

.contact-con {
  transform: translateY(-11.5104166667vw);
}

.contact-con2 {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  background-color: var(--g);
  padding: 4.375vw 6.9791666667vw 5.8854166667vw;
  border-top-left-radius: 3.125vw;
  border-bottom-right-radius: 3.125vw;
}

.contact-iconBox {
  min-width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 1.25vw;
}

.contact-iconBox img {
  width: 30px;
}

.contact-mes2 {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  position: relative;
  padding-bottom: 2.1875vw;
  margin-bottom: 2.6041666667vw;
}

.contact-mes2::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  content: '';
  background-color: #E8E8E8;
}

.contact-mes2:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}

.contact-mes2:last-child::after {
  display: none;
}

.contact-text {
  font-size: var(--20);
  color: #ffffff;
  font-weight: 500;
}

.contact-text p {
  font-size: var(--18);
  color: #ffffff;
  font-weight: 400;
  margin-bottom: 0.2604166667vw;
}

.contact-left {
  width: 40%;
}

.contact-leftTit {
  margin-bottom: 3.0208333333vw;
}

.contact-rigTit h2,
.contact-leftTit h2 {
  color: #ffffff;
}

.contact-rig {
  width: 52%;
}

.contact-rigTit {
  margin-bottom: 2.8125vw;
}


.mes-formUl {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.mes-formLi1 {
  width: 48%;
  margin-bottom: 1.40625vw;
}

.mes-inp {
  width: 100%;
  padding: 0.78125vw 1.5625vw;
  font-size: var(--18);
  font-weight: 400;
  letter-spacing: 0.02em;
}

.mes-formLi2 {
  width: 100%;
  height: 8.28125vw;
}

.mes-text {
  height: 100%;
  font-family: 'Noto Sans SC';
}

.mes-formLi2 {
  margin-bottom: 1.0729166667vw;
}

.mes-formLi3 {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 2.0416666667vw;
}

.mes-or,
.mes-tit {
  font-size: var(--14);
  color: #ffffff !important;
  margin-right: 5px;
}

.mes-yanzhengma {
  border-radius: 5px;
  width: 81px;
  height: 37px;
  padding-left: 0.5208333333vw;
  border: 1px solid #E4E4E4;
  margin-right: 1.25vw;
}

.mes-inp2 {
  line-height: 0;
}

.mes-inp2::placeholder {
  opacity: 0;
}

.mes-but {
  font-family: 'Noto Sans SC';
  min-width: 175px;
  height: 50px;
  font-weight: 500;
  background-color: var(--y);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ffffff;
  font-size: var(--18);
  letter-spacing: 0.02em;
  padding: 0 15px;
}

.mes-yanzimg {
  margin-right: 0.5729166667vw;
  line-height: 0;
}

.nav-box {
  background-color: var(--g);
  position: absolute;
  bottom: 0;
  left: 0;
  height: 88px;
  transform: translateY(50%);
  z-index: 10;
  width: calc(100% - 8.33%);
  border-top-right-radius: 50px;
  border-bottom-right-radius: 50px;
}

.nav-con {
  display: flex;
  align-items: center;
}

.nav-con2 {
  font-size: var(--16);
  line-height: 1.5em;
  color: #ffffff;
  opacity: 0.7;
  font-weight: 300;
  margin-right: 1.9895833333vw;
  min-width: 11%;
  text-align: center;
}

.nav-con2:hover {
  opacity: 1;
}

.nav-con2 a {
  width: 100%;
  display: block;
}

.nav-conAct {
  font-weight: 400;
  opacity: 1;
}


/* æ–°é—»ä¸­å¿ƒ */
.news-top {
  padding-top: 8.28125vw;
  padding-bottom: 6.6666666667vw;
  background-color: #F6F6F6;
}

.news-top2 {
  position: relative;
}

.news-pageBox {
  position: absolute;
  right: 0;
  bottom: 0;
  background-color: transparent !important;
}

.news-swiper {
  overflow: hidden;
}

.news-slide1 a {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.news-slide1:hover img {
  transform: scale(1.1);
}

.news-pageBox .swiper-pagination1 {
  width: auto;
  font-size: 16px;
  color: var(--b);
  font-weight: 300;
  padding: 0 1.25vw;
}

.news-date {
  font-family: 'MontserratRegular';
  font-size: var(--24);
  color: #666666;
  margin-bottom: 0.8854166667vw;
}

.news-swimgBox {
  width: 35.4166666667vw;
  aspect-ratio: 3/2;
  margin-right: 5.4166666667vw;
  overflow: hidden;
}

.news-swimg {
  width: 100%;
  aspect-ratio: 3/2;
  transition: all .5s;
}

.news-tit {
  margin-bottom: 3.0208333333vw;
}

.news-textBox {
  width: 41vw;
}

.news-tit h2 {
  font-size: var(--24);
  line-height: 1.5em;
  font-weight: 500;
  color: var(--b);
  letter-spacing: 0.02em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
  white-space: normal;
}


.news-but {
  border: 1px solid #999999;
  background-color: #F6F6F6;
  margin: 0;
}

.news-box {
  padding-top: 4.9479166667vw;
  padding-bottom: 9.4270833333vw;
}

.news-conBox {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  margin-bottom: 4.0625vw;
}

.news-conBox::after {
  width: 32%;
  content: '';
}

.news-conBox2 {
  width: 32%;
  background-color: #F6F6F6;
  margin-bottom: 1.9270833333vw;
  transition: all .5s;
}

.news-conText {
  padding: 1.8229166667vw 2.1354166667vw 1.7708333333vw 2.1354166667vw;
  transition: all .5s;
}

.news-slBox1 {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 3/2;
}

.news-conImg {
  width: 100%;
  aspect-ratio: 3/2;
  transition: all .4s;
}

.news-conDate {
  font-size: var(--16);
  color: #666666;
  font-family: 'MontserratRegular';
  margin-bottom: 0.5208333333vw;
}

.news-conTit h2 {
  font-size: var(--18);
  color: var(--b);
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
  white-space: normal;
}


.news-conBox2:hover img {
  transform: scale(1.1);
}

.news-conBox2:hover {
  background-color: var(--g);
}

.news-conBox2:hover .news-conDate {
  color: #ffffff;
}

.news-conBox2:hover h2 {
  color: #ffffff;
}

.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
}

.page-item {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid var(--g);
  color: var(--g);
  font-family: 'MontserratRegular';
  font-size: var(--18);
  margin: 0 0.5208333333vw;
  transition: all .5s;
}

.page-link {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.page-item img {
  transition: all .5s;
}

.page-item:hover {
  background-color: var(--g);
  color: #ffffff;
}

.page-item:hover img {
  filter: brightness(0) invert(1);
}

.active {
  background-color: var(--g);
  color: #ffffff;
}


/* æ–°é—»è¯¦æƒ… */
.newsdet-box {
  position: relative;
  background-color: #F6F6F6;
  padding-top: 3.8020833333vw;
  padding-bottom: 9.5833333333vw;
}

.newsdet-bg {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  width: 21.71875vw;
}

.newsdet-color {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 524px;
  transform: translateY(-100px);
  background-color: var(--g);
}

.newsdet-box2 {
  position: relative;
  z-index: 10;
}

.newsdet-nav {
  margin-bottom: 2.5520833333vw;
}

.newsdet-nav img {
  aspect-ratio: 1;
  line-height: 0;
  transform: translateY(20%);
  margin-right: 0.9895833333vw;
}

.newsdet-riUl {
  font-size: 0;
  height: 100%;
  display: inline;
}

.newsdet-riLi {
  display: inline;
  font-size: var(--14);
  color: #ffffff;
  font-weight: 400;
}


.newsdet-riLi span {
  margin: 0 2px;
}

.newsdet-riLi:last-child span {
  display: none;
}

.newsdet-riLi a:hover {
  color: var(--y) !important;
}

.newsdet-con {
  padding: 0 7.0833333333vw;
  padding-bottom: 4.6875vw;
  padding-top: 5.6770833333vw;
  box-shadow: 0px 3px 20px 4px #00000026;
  background-color: #fff;
}

.newsdet-tit {
  margin-bottom: 3.25vw;
}

.newsdet-tit h1 {
  font-size: var(--30);
  line-height: 1.2em;
  color: var(--b);
  letter-spacing: 0.02em;
  text-align: center;
  font-weight: 700;
}

.newsdet-messBox {
  display: flex;
  justify-content: center;
  align-items: center;
}

.newsdet-messBox2 {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: var(--16);
  color: var(--b);
  font-weight: 400;
  margin-right: 6.3020833333vw;
}

.newsdet-messBox2:last-child {
  margin-right: 0;
}

.newsdet-messBox2 span {
  font-family: 'MontserratRegular';
  transform: translateY(10%);
}

.newsdet-top {
  position: relative;
  padding-bottom: 1.28125vw;
  margin-bottom: 4.7916666667vw;
}

.newsdet-top::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  content: '';
  background-color: #E8E8E8;
}

.newsdet-text p:has(img) {
  display: flex;
  justify-content: center;
  align-items: center;
}

.newsdet-text {
  position: relative;
  padding-bottom: 6.3541666667vw;
}

.newsdet-text img {
  max-width: 100%;
  height: auto !important;
  object-fit: cover !important;
}

.newsdet-text::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  content: '';
  background-color: #E8E8E8;
}

.newsdet-butBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 2.96875vw;
}

.newsdet-butImg {
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #999999;
  border-radius: 50%;
}

.newsdet-but a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 50px;
  font-size: var(--16);
  letter-spacing: 0.02em;
  font-weight: 400;
}

.newsdet-prev {
  margin-right: 1.3020833333vw;
}

.newsdet-next {
  margin-left: 1.3020833333vw;
}

.newsdet-back {
  min-width: 140px;
  padding: 0 20px;
  background-color: rgba(199, 143, 66, 0.1);
  height: 50px;
  font-size: var(--16);
  letter-spacing: 0.02em;
  font-weight: 400;
  border-radius: 50px;
  transition: all .5s;
}

.newsdet-back:hover {
  background-color: var(--y);
}

.newsdet-back a {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ç‘žæºç®€ä»‹ */

.introduction-box {
  padding-top: 7.2395833333vw;
  padding-bottom: 150px;
  position: relative;
  overflow: hidden;
}

.introduction-box2 {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  position: relative;
}

.international {
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: var(--48);
  font-family: 'Montserrat';
  color: var(--y);
  opacity: 0.3;
  transform: rotate(-90deg);
  width: 0;
  white-space: nowrap;
}

.introduction-rig {
  line-height: 0;
}

.introduction-rig img {
  width: 30.78125vw;
  transform: translateY(2px);
  z-index: 0;
}

.introduction-text {
  font-size: var(--16);
  line-height: 1.5em;
  color: var(--b);
  text-align: justify;
}

.introduction-text p {
  margin-bottom: 1.4583333333vw;
}

.introduction-leftTit {
  margin-bottom: 2.4479166667vw;
}

.introduction-left {
  width: 50%;
}

.introduction-rig img {
  margin-right: 4.6354166667vw;
}

.introduction-numBox {
  position: absolute;
  left: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: var(--g);
  width: 60vw;
  padding: 1.40625vw 8.33%;
  z-index: 10;
  transform: translate(-16.66%, 1.8229166667vw);
}

.introduction-numBox3 {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  color: var(--24);
  color: #ffffff;
  font-weight: 700;
}

.introduction-num2 {
  position: relative;
  font-size: var(--68);
  color: #ffffff;
  font-family: 'Montserrat';
  font-weight: 400;
  color: transparent;
}

.introduction-num {
  font-size: var(--68);
  color: #ffffff;
  font-family: 'Montserrat';
  font-weight: 400;
  position: absolute;
  top: 0;
  left: 0;
}

.introduction-numTit {
  font-size: var(--16);
  color: #ffffff;
  font-weight: 500;
  letter-spacing: 0.02em;
}


/* å‘å±•åŽ†ç¨‹ */
.develop-box {
  overflow: hidden;
  position: relative;
  padding-top: 4.9479166667vw;
  padding-bottom: 6.0416666667vw;
}

.develop-swiper {
  overflow: hidden;
  padding-top: 3.125vw;
  margin-bottom: 3.0729166667vw;
}

.develop-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
}

.history {
  position: absolute;
  left: 32.7083333333vw;
  top: 53%;
  font-size: var(--200);
  font-weight: 700;
  color: var(--y);
  opacity: 0.08;
}

.develop-slide1 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  padding-left: 2.0833333333vw;
  padding-bottom: 3.125vw;
}

.develop-textBox {
  width: 50%;
  font-size: var(--16);
  color: #333333;
  text-align: justify;
}

.develop-years {
  font-size: var(--128);
  font-family: 'Montserrat';
  color: var(--g);
  position: relative;
  left: -11.6666666667vw;
  transform: translateX(-100%);
  opacity: 0;
  transition: all 1s;
}

.develop-textBox p {
  font-size: var(--18);
  letter-spacing: 0.02em;
  color: var(--b);
  line-height: var(--l30);
  font-weight: 400;
  transform: translateX(100%);
  opacity: 0;
  transition: all 1s;
}

.develop-imgBox {
  width: 36.7708333334vw;
  aspect-ratio: 3/2;
  position: relative;
  line-height: 0;
  transform: none;
  transition: all 1s;
  position: relative;
}

.develop-imgBox::after {
  width: 100%;
  height: 100%;
  background-color: var(--y);
  top: 0;
  left: 0;
  position: absolute;
  content: '';
  z-index: -1;
  transform: none;
  transition: all 1s;
}

.develop-imgBox img {
  width: 100%;
  height: 100%;
  aspect-ratio: 3/2;
}

.develop-slide1:hover .develop-imgBox {
  transform: perspective(2500px) rotateX(0) rotateY(-24deg) scale3d(1, 1, 1) !important;
}

.develop-slide1:hover .develop-imgBox::after {
  transform: translateX(2.0833333333vw) !important;
}

.develop-slide1 {
  opacity: 0 !important;
}

.develop-swiper .swiper-slide-active {
  opacity: 1 !important;
}

.develop-swiper .swiper-slide-active .develop-imgBox {
  transform: perspective(2500px) rotateX(0) rotateY(24deg) scale3d(1, 1, 1);
}

.develop-swiper .swiper-slide-active .develop-imgBox::after {
  transform: translateX(-2.0833333333vw);
}

.develop-swiper .swiper-slide-active .develop-years {
  transform: none;
  opacity: 1;
}

.develop-swiper .swiper-slide-active .develop-textBox p {
  transform: none;
  opacity: 1;
}


.develop-swiper2 {
  overflow: hidden;
  width: 85%;
}

.develop-slide2 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  cursor: pointer;
}

.develop-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #fff;
  border: 1px solid var(--g);
  margin-bottom: 1.3020833333vw;
  transition: all 1s;
}

.develop-date {
  background-color: transparent;
  padding: 0 0.6770833333vw;
  font-size: var(--24);
  color: var(--g);
  line-height: 36px;
  font-family: 'MontserratRegular';
  transition: all 1s;
}

.develop-slideAct .develop-dot {
  background-color: var(--g);
}

.develop-slideAct .develop-date {
  background-color: var(--g);
  font-size: var(--24);
  color: #fff;
}

.develop-navBox {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
}

.develop-navBox::after {
  width: 100%;
  height: 0;
  border-bottom: 1px dashed #16817D;
  content: '';
  position: absolute;
  top: 5px;
  left: 0;
}

.develop-butBox {
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 0;
}

.develop-but {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--g);
  z-index: 10;
  transform: translateY(-20px);
  cursor: pointer;
}

.develop-prev {
  margin-right: 20px;
}


.product-box {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  position: relative;
}

.product-left {
  width: 25.5208333333vw;
  padding-top: 8.8020833333vw;
  padding-left: 8.33%;
  padding-bottom: 30px;
  background-color: var(--g);
  position: relative;
  padding-right: 10px;
}

.product-bg {
  position: absolute;
  right: 0;
  pointer-events: none;
  bottom: 0;
  width: 23.6458333333vw;
  opacity: 0.3;
}

.product-tit2 {
  margin-bottom: 3.28125vw;
}

.product-tit2 h2 {
  color: #ffffff;
}

.product-nav {
  width: 14.8125vw;
  position: sticky;
  top: 150px;
  z-index: 100;
}

.product-dl {
  margin-bottom: 1.875vw;
}

.product-dlTlt {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  position: relative;
  padding: 0.3125vw 1.4583333333vw;
  transition: all .5s;
}

.product-dlTlt::after {
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #ffffff;
  opacity: 0.4;
  content: '';
  left: 0;
  bottom: 0;
}

.product-tlt h3 {
  font-size: var(--18);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #ffffff;
}

.product-dd {
  margin-top: 1.0416666667vw;
  padding-left: 2.6041666667vw;
  color: #ffffff;
  letter-spacing: 0.02em;
  font-size: var(--16);
  line-height: 20px;
  font-weight: 300;
  display: none;
}

.product-ddCon {
  margin-bottom: 1.0416666667vw;
  display: block;
  position: relative;
}

.product-ddCon::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #fff;
  content: '';
  opacity: 0;
}

.product-up {
  transition: all .5s;
}

.product-dlTltAct {
  background-color: var(--y);
  /* padding-left: 2.6041666667vw; */
}


.product-dlTltAct .product-up {
  transform: rotate(90deg);
}

.product-ddConAct p {
  text-decoration: underline;
}

.product-dlTltAct .product-dd {
  display: block;
}

.product-ddCon:hover p {
  text-decoration: underline;
}

.product-dlTlt:hover {
  background-color: var(--y);
}

.product-rig {
  width: calc(100% - 25.5208333333vw);
  padding-right: 8.33%;
  padding-left: 4.0625vw;
  padding-top: 9.0625vw;
  padding-bottom: 7.7604166667vw;
  position: relative;
}

.product-searcBox {
  margin-bottom: 30px;
}

.product-searctext {
  font-size: var(--30);
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--b);
}

.product-searctext2 {
  color: var(--b);
  font-size: var(--18);
  width: 100%;
  background-color: rgba(199, 143, 66, 0.4);
  padding: 10px;
}

.product-con {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
}

.product-con::after {
  width: 31.6%;
  content: '';
}

.product-con2 {
  width: 31.6%;
  position: relative;
  margin-bottom: 2.65625vw;
}

.product-con2::after {
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 0%;
  height: 6px;
  background-color: var(--g);
  content: '';
  transition: all .5s;
}

.product-imgBox {
  width: 100%;
  aspect-ratio: 3/2;
  margin-bottom: 1.6145833333vw;
  line-height: 0;
  overflow: hidden;
}

.product-img {
  width: 100%;
  aspect-ratio: 3/2;
  transition: all .5s;
}

.product-conTit {
  padding-bottom: 1.5625vw;
}

.product-conTit h4 {
  width: 100%;
  text-align: center;
  font-weight: 500;
  font-size: var(--18);
  letter-spacing: 0.02em;
  line-height: 1.2em;
  color: #333333;
}


.prodet-navBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.7708333333vw;
}

.prodet-back {
  background-color: rgba(255, 255, 255, 0.1);
}

.product-con2:hover .product-img {
  transform: scale(1.1);
}

.product-con2:hover::after {
  width: 100%;
}

.product-con2:hover .product-conTit h4 {
  color: var(--g);
}

.tactic-box {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  position: relative;
}

.tactic-left {
  padding-left: 8.33%;
  width: calc(100% - 35.0520833333vw);
  padding-bottom: 3.6458333333vw;
  padding-top: 5.7291666667vw;
}

.tactic-rig {
  width: 35.0520833333vw;
  padding-right: 8.33%;
  padding-left: 7.2395833333vw;
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.tactic-rig::after {
  width: 100%;
  height: 120%;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: '';
  background-color: var(--g);
  pointer-events: none;
  z-index: 10;
}

.tactic-sign {
  position: relative;
  z-index: 100;
  height: 100%;
  display: flex;
  justify-content: space-around;
  flex-direction: column;
}

.tactic-sign2 {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  padding-bottom: 10px;
}

.tactic-icon {
  transition: all .5s;
}

.tactic-sign2:hover .tactic-icon {
  transform: rotateY(180deg);
}

.tactic-sign2::after {
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #E8E8E8;
  content: '';
  opacity: 0.3;
}

.tactic-signleft {
  display: flex;
  justify-content: center;
  align-items: center;
}

.tactic-icon {
  width: 35px;
  margin-right: 1.40625vw;
}

.tactic-num p {
  color: #fff;
}

.tactic-num span {
  color: #fff;
}

.tactic-signTit {
  font-size: var(--18);
  color: #ffffff;
  letter-spacing: 0.02em;
  font-weight: 500;
}

.tactic-mapBox {
  transform-origin: left;
  transform: scale(0.9);
  margin-bottom: 2.0833333333vw;
}

.tactic-dot {
  min-width: 15px;
  height: 15px;
  margin-right: 0.78125vw;
  border-radius: 50%;
  background-color: var(--g);
  transform: translateY(55%);
}

.tactic-con {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}

.tactic-con2 {
  width: 50%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 10px;
}


.tactic-tit2 {
  margin-bottom: 2.5625vw;
}

.tactic-conTit {
  margin-right: 1vw;
  font-size: var(--20);
  color: var(--b);
  letter-spacing: 0.02em;
}

.partner-box {
  padding-top: 8.125vw;
  padding-bottom: 6.5625vw;
  background-color: #F6F6F6;
  position: relative;
  overflow: hidden;
}

.partner-bg {
  position: absolute;
  width: 100%;
  height: 350px;
  bottom: 0;
  left: 0;
  background-color: #fff;
}

.partner-titBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 2vw;
}


.partner-navBox {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}

.partner-navBox2 {
  margin-right: 4.2708333333vw;
  cursor: pointer;
  margin-bottom: 30px;
}

.partnernav {
  min-width: 20%;
}

.partner-navBox2:last-child {
  margin-right: 0;
}

.partner-navBox2 {
  position: relative;
}


.partner-navBox2 h3 {
  font-size: var(--20);
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--b);
  position: relative;
  display: inline-block;
}

.partner-navBox2 h3::after {
  position: absolute;
  bottom: -0.5208333333vw;
  left: 0;
  width: 0%;
  height: 2px;
  background-color: var(--g);
  content: '';
  transition: all 0.5s;
}

.partner-navBox2:hover h3 {
  color: var(--g);
}

.partner-navBox2:hover h3::after {
  width: 100%;
}

.partner-navBoxAct h3 {
  font-weight: 700;
  color: var(--g);
}

.partner-navBoxAct h3::after {
  width: 100%;
}

.partner-conTop {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 3.0208333333vw;
}

.partner-img {
  width: 18.3854166667vw;
  margin-right: 6.4166666667vw;
}

.partner-img img {
  width: 18.3854166667vw;
}

.partner-swiper1 .swiper-wrapper {
  align-items: stretch;
}


.partner-slide1 {
  position: relative;
  height: auto;
  background-color: #ffffff;
  box-shadow: 0px 3px 20px 4px #00000026;
  padding: 3.3854166667vw 4.4791666667vw 3.8020833333vw;
  transition: all .3s !important;
}

.partner-swiper1 .swiper-slide-active {
  transition: all 1s !important;
}

.partner-swbg {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
  pointer-events: none;
  width: 22.2395833333vw;
}

.partner-text {
  font-size: var(--16);
  line-height: 1.5em;
  font-weight: 300;
  text-align: justify;
}

.partner-conTitBox {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 2.2395833333vw;
}

.partner-line {
  width: 100%;
  height: 1px;
  background-color: #E8E8E8;
}

.partner-conTit {
  font-size: var(--24);
  color: var(--g);
  font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
  margin-right: 1.25vw;
}

.partner-con {
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: wrap;
  margin: 0 -0.5%;
}

.partner-con2 {
  width: 24%;
  margin: 0 0.5%;
  padding: 0.8333333333vw 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--g);
  color: #ffffff;
  font-size: var(--16);
  line-height: 1.5em;
  letter-spacing: 0.02em;
  border-radius: 5px;
  margin-bottom: 1.3541666667vw;
  text-align: center;
}

.honor-box {
  position: relative;
  background-image: url('../images/about/hovbg.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  padding-top: 6.25vw;
  padding-bottom: 4.7395833333vw;
}

.honor-con {
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  flex-wrap: wrap;
  margin: 0 -1%;
  margin-bottom: 1.40625vw;
}

.honor-con2 {
  width: 23%;
  margin: 0 1%;
  padding-bottom: 2.2916666667vw;
}

.honor-imgBox {
  width: 100%;
  line-height: 0;
  aspect-ratio: 3/2;
  margin-bottom: 1.3541666667vw;
  overflow: hidden;
}

.honor-img {
  width: 100%;
  aspect-ratio: 3/2;
  transition: all .5s;
}

.honor-con2:hover .honor-img {
  transform: scale(1.1);
}

.honor-con2:hover .honor-tit {
  color: var(--g);
}

.honor-tit {
  font-size: var(--18);
  line-height: 20px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-align: center;
  color: var(--b);
}

.honor-slide1 {
  pointer-events: none;
}

.honor-slide1 {
  transition: all .3s !important;
}

.honor-swiper1 .swiper-slide-active {
  pointer-events: all;
  transition: all 1s !important;
}

.mien-box {
  padding-top: 6.6145833333vw;
  padding-bottom: 3.5833333333vw;
  position: relative;
}

.mien-titBox {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 3.4895833333vw;
}

.mien-con {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 3.5416666667vw;
  flex-wrap: wrap;
}

.mien-con::after {
  width: 25vw;
  content: '';
}

.mien-conBox:nth-child(3n+1) {
  position: relative;
  top: -7.03125vw;
}

.mien-conBox:nth-child(3n) {
  position: relative;
  top: -7.03125vw;
}

.mien-conBox {
  position: relative;
  transition: all .5s;
  width: 25vw;
  margin-bottom: 3.9583333333vw;
}

.mien-conBox img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: 9;
  transition: all .5s;
}

.mien-conBox::after {
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(22, 129, 125, 0) 56.24%, #16817D 100%);
  content: '';
  left: 0;
  top: 0;
  position: absolute;
  z-index: 10;
}

.mien-conBox::before {
  width: 100%;
  height: 100%;
  background-color: var(--y);
  content: '';
  left: 0;
  top: 0;
  position: absolute;
  z-index: 0;
  transition: all .5s;
}

.mien-line {
  height: 100%;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
}

.mien-line i {
  display: block;
  height: 0%;
  background-color: hsla(0, 0%, 100%, .4);
  transition: all .9s;
  margin-left: 5px;
  width: 8px;
}

.mien-conBox:hover {
  transform: translate(-10px, -10px);
}

.mien-conBox:hover::before {
  transform: translate(20px, 20px);
}

.mien-conBox:hover .mien-line i {
  height: 100%;
}

.mien-conBox:hover .mien-line i:nth-child(2) {
  transition-delay: 0.1s;
}

.mien-conBox:hover .mien-line i:nth-child(3) {
  transition-delay: 0.2s;
}

.mien-conBox:hover .mien-line i:nth-child(4) {
  transition-delay: 0.3s;
}

.mien-conBox:hover .mien-line i:nth-child(5) {
  transition-delay: 0.4s;
}

.mien-tit {
  position: absolute;
  bottom: 1.3020833333vw;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 20;
  font-size: var(--18);
  color: #ffffff;
  letter-spacing: 0.02em;
}

.mien-more {
  font-size: var(--18);
  color: #000;
  letter-spacing: 0.02em;
  font-weight: 400;
  display: flex;
  justify-content: center;
  align-items: center;
}

.mien-more a {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.8333333333vw 1.71875vw;
  background-color: rgba(199, 143, 66, 0.2);
  border-radius: 50px;
  transition: all .5s;
}

.mien-more p {
  margin-right: 0.5208333333vw;
}


.mien-more a:hover {
  background-color: var(--y);
}







/* æ™ºæ…§å·¥ç¨‹ */
.eng-box {
  padding-top: 11.40625vw;
  overflow: hidden;
}


.eng-tit {
  position: relative;
  padding-bottom: 1.0416666667vw;
  margin-bottom: 1.5vw;
}

.eng-tit::after {
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #E8E8E8;
  content: '';
  bottom: 0;
  left: 0;
}

.eng-tit h2 {
  font-size: var(--36);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--g);
}

.eng-text p {
  font-size: var(--16);
  line-height: 1.5em;
  color: var(--b);
  font-weight: 400;
  text-align: justify;
}

.eng-con2 {
  position: relative;
  margin-bottom: 9.375vw;
}

.eng-pageBox2 {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding: 0 1.25vw;
}

.eng-page {
  font-size: var(--36);
  font-family: 'Montserrat';
  color: #333333;
  line-height: var(--36);
}

.eng-pageBox2 span,
.eng-pageAll {
  font-size: var(--16);
  font-family: 'MontserratRegular';
  color: #333333;
}

.eng-pageBox2 span {
  margin-right: 3px;
}

.eng-left {
  width: 62.0833333333vw;
  min-height: 29.125vw;
  background-color: #F6F6F6;
  padding-top: 4.7395833333vw;
  padding-left: 2.416667vw;
  padding-bottom: 4.1666666667vw;
  padding-right: 20.575vw;
}

.eng-rig {
  position: absolute;
  top: -3.3854166667vw;
  right: 0;
  width: 37.75vw;
  aspect-ratio: 3/2;
}

.eng-rig2 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  overflow: hidden;
  height: 100%;
}

.eng-rig::before {
  width: 100%;
  height: 100%;
  background-color: var(--y);
  position: absolute;
  top: 13px;
  left: 13px;
  content: '';
}

.eng-bg {
  pointer-events: none;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(22, 129, 125, 0) 56.24%, #16817D 100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  content: '';
}

.eng-swiper {
  overflow: hidden;
}

.eng-swTit {
  position: absolute;
  left: 4.21875vw;
  bottom: 2.0572916667vw;
  z-index: 100;
  width: 80%;
  font-size: var(--24);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #ffffff;
  line-height: var(--l35);
  z-index: 100;
  animation-delay: 1s !important;
  opacity: 0;
  transition: all .5s;
}




.eng-pageBox {
  position: absolute;
  top: 25vw;
  right: 0;
  display: flex;
  align-items: center;
  z-index: 99;
}

.eng-but {
  background-color: transparent;
  border: 1px solid #999999;
  margin: 0;
}

.eng-pageBox .eng-pagination {
  font-family: 'Montserrat';
  font-size: 16px;
  color: var(--b);
  font-weight: 300;
  margin: 0 1.25vw;
  width: auto;
}

.eng-pageBox .swiper-pagination-current {
  font-size: 36px;
  color: var(--b);
  font-weight: 700;
}

.eng-pageBox .swiper-pagination-total {
  font-size: 16px;
  color: var(--b);
  font-weight: 300;
}

.eng-con2:nth-child(2n) .eng-left {
  margin-left: auto;
  padding-left: 20.575vw;
  padding-right: 2.416667vw;
}

.eng-con2:nth-child(2n) .eng-rig {
  left: 0;
}

.eng-con2:nth-child(2n) .eng-rig::before {
  left: unset;
  right: 13px;
}

.eng-con2:nth-child(2n) .eng-pageBox {
  left: 0;
}


.insou-bigImg1 {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.insou-bigImg2 {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
}

.insou-bigImg2 img {
  /* transform: scale(1.3); */
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.insou-bigImgAct {
  animation: bigImgAct 1.2s forwards;
}


.insou-bigImgAct3 {
  animation: bigImgAct3 1.2s forwards;
}

@keyframes bigImgAct {
  100% {
    /* z-index: 10; */
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}



@keyframes bigImgAct3 {
  0% {
    transform: scale(1.3);
  }

  100% {
    transform: none;
  }
}




.insou-slBox1 {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.insou-slBox1::before {
  content: "";
  display: block;
  padding-top: 66.66%;
}

.insou-slBox2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.insou-slBox2 img {
  width: 100%;
  height: 100%;
  transition: all .5s;
}












.prodet-box {
  position: relative;
  background-color: #ffffff;
  padding-top: 3.8020833333vw;
}

.prodet-color {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(45.78125vw + 100px);
  transform: translateY(-100px);
  background-color: var(--g);
}

.prodet-box2 {
  position: relative;
  z-index: 10;
}

.prodet-nav {
  margin-bottom: 0;
}

.prodet-back {
  font-size: var(--18);
  letter-spacing: 0.02em;
  color: #fff;
  font-weight: 400;
  border-radius: 50px;
}

.prodet-back a {
  display: block;
  padding: 16px 33px;
}

.prodet-con {
  background-color: #fff;
  box-shadow: 0px 3px 20px 4px #00000026;
  padding: 6.7708333333vw 6.7708333333vw 7.65625vw;
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
}

.prodet-left {
  width: 35.4166666667vw;
  position: relative;
  z-index: 100;
}

.prodet-rig {
  width: calc(100% - 35.4166666667vw);
  padding-left: 2.9791666667vw;
  padding-top: 2.4479166667vw;
}

.prodet-swiper {
  overflow: hidden;
  line-height: 0;
}

.prodet-swiper1 {
  margin-bottom: 1.1979166667vw;
}

.prodet-slide1 {
  border: 1px solid transparent;
}

.prodet-slide1 img {
  width: 100%;
  aspect-ratio: 3/2;
}

.prodet-imgNav {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}

.prodet-swiper2 {
  width: 100%;
  margin: 0 1.3541666667vw;
}

.prodet-swBut {
  width: 26px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #F3F3F3;
  cursor: pointer;
  transition: all .5s;
}

.prodet-swBut:hover {
  background-color: var(--g);
}

.prodet-swBut:hover img {
  filter: brightness(0) invert(1);
}

.prodet-swiper2 .swiper-slide-thumb-active {
  border: 1px solid var(--g);
}

.prodet-contit {
  position: relative;
  padding-bottom: 1.71875vw;
  margin-bottom: 2.4479166667vw;
}

.prodet-contit::after {
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: var(--g);
  content: '';
  left: 0;
  bottom: 0;
}

.prodet-contit h1 {
  font-size: var(--36);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--b);
}

.prodet-attrTit {
  font-size: var(--20);
  color: var(--b);
  letter-spacing: 0.02em;
  font-weight: 700;
  white-space: nowrap;
  margin-right: 10px;
}

.prodet-attribute2 {
  margin-bottom: 1.1458333333vw;
  display: flex;
  align-items: flex-start;
}


.prodet-attribute2:last-child {
  margin-bottom: 0;
}

.prodet-attribute2 p {
  font-size: var(--18);
  color: var(--b);
  letter-spacing: 0.02em;
  font-weight: 500;
}

.prodet-shareBox {
  display: flex;
  justify-content: center;
  align-items: center;
}

.prodet-shareBox a {
  display: block;
  line-height: 0;
  margin-right: 13px;
}

.prodet-shareBox a:last-child {
  margin-right: 0;
}

.prodet-butBox {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.prodet-offer {
  font-size: var(--16);
  color: #000;
  letter-spacing: 0.02em;
  font-weight: 400;
}

.prodet-offer a {
  padding: 0.703125vw 2.71875vw;
  background-color: rgba(199, 143, 66);
  border-radius: 50px;
  transition: all .5s;
  display: block;
}

.prodet-offer:hover a {
  background-color: var(--y);
}

.prodet-butBox2 {
  margin-right: 1.6145833333vw;
}

.prodet-attribute {
  margin-bottom: 4.0625vw;
}

.prodet-box3 {
  padding: 0 6.7708333333vw;
  padding-bottom: 12.6041666667vw;
}


.magnifier {
  width: 200px;
  height: 200px;
  background: rgba(254, 238, 167, .4);
  /* åŠé€æ˜Žæ•ˆæžœ */
  position: absolute;
  left: 0;
  top: 0;
  display: none;
  z-index: 100;
}

.prodet-glass {
  width: 400px;
  height: 400px;
  position: absolute;
  left: 110%;
  top: 0;
  z-index: 100;
  overflow: hidden;
  display: none;
}

.prodet-glassImg {
  width: 70.8333333333vw;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
}

.peculiarity-box {
  padding-top: 7.2916666667vw;
  padding-bottom: 5.9375vw;
}

.peculiarity-tit {
  position: relative;
  margin-bottom: 3.4895833333vw;
  padding-bottom: 1.5625vw;
}

.peculiarity-tit::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #E8E8E8;
  content: '';
}

.peculiarity-tit h2 {
  font-size: var(--36);
  font-weight: 700;
  color: var(--g);
  letter-spacing: 0.02em;
}

.peculiarity-conBox2 {
  display: flex;
  justify-content: flex-start;
  font-size: var(--18);
  line-height: var(--l30);
  color: #333;
  font-weight: 400;
  margin-bottom: 0.8333333333vw;
}

.peculiarity-conBox2:last-child {
  margin-bottom: 0;
}

.peculiarity-dot {
  min-width: 12px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transform: translateY(99%);
  background-color: var(--g);
  margin-right: 0.9375vw;
}

.parameter-box {
  padding-bottom: 9.9479166667vw;
}

.parameter-tabBox {
  overflow-x: scroll;
}

.parameter-tabBox table {
  border-collapse: collapse;
}



.parameter-tabBox table tbody tr:first-child {
  background-color: var(--g) !important;
  color: #ffffff !important;
}

.parameter-tabBox table tbody tr:nth-child(2n - 1) {
  background-color: #E8E8E8;
}

.parameter-tabBox table tbody tr td:first-child {
  padding-left: 4ch;
}

.parameter-tabBox table tbody tr {
  color: #333333;
}

.parameter-tabBox::-webkit-scrollbar {
  display: none;
}

.parameter-tit {
  margin-bottom: 3.90625vw;
}


.parameter-tabBox table {
  min-width: 100%;
}

.consult-con {
  background-color: var(--g);
  border-top-left-radius: 60px;
  border-bottom-right-radius: 60px;
  position: relative;
  padding: 4.6875vw 5.5729166667vw 5.7291666667vw;
}

.consult-bg {
  position: absolute;
  top: 0;
  right: 0;
  width: 15.2604166667vw;
  z-index: -1;
}

.consult-tit {
  margin-bottom: 0.6770833333vw;
}

.consult-tit h2 {
  font-size: var(--36);
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.consult-text {
  font-size: var(--20);
  color: #ffffff;
  font-weight: 500;
  margin-bottom: 2.0833333333vw;
}

.consult-formUl {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
}

.consult-formLi4 {
  width: 100%;
}

.consult-formLi {
  margin-bottom: 1.1979166667vw;
}

.consult-formLi1 {
  width: 23.4%;
}

.consult-formLi2 {
  width: 100%;
  height: 159px;
  margin-bottom: 2.0833333333vw;
}

.consult-inp {
  width: 100%;
  font-size: var(--18);
  font-weight: 400;
  color: var(--b);
  padding: 0.8333333333vw 1.5625vw;
}

.consult-text {
  height: 100%;
  font-weight: 400;
  font-family: 'Noto Sans SC';
}

.consult-pro {
  width: 100%;
  background-color: var(--y) !important;
  color: #ffffff;
}

input:disabled {
  color: #fff;
  opacity: 1;
  -webkit-text-fill-color: #fff;
}

.consult-yanzhengma {
  border-radius: 5px;
  width: 108px;
  height: 37px;
  padding-left: 10px;
  border: 1px solid #E4E4E4;
  margin-right: 1.25vw;
}

.consult-but {
  min-width: 266px;
  height: 50px;
  background-color: var(--y);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ffffff;
  font-size: var(--18);
  letter-spacing: 0.02em;
}


@media only screen and (max-width: 1600px) {
  :root {
    --16: 14px;
    --18: 16px;
    --20: 16px;
    --24: 22px;
    --30: 26px;
    --36: 30px;
    --48: 38px;
    --50: 40px;
    --64: 54px;
    --68: 50px;
    --l35: 30px;
    --l60: 40px;
  }


  .inadv-sign2 {
    margin-bottom: 1.552083vw;
  }

  .index-tit img {
    width: 70px;
  }

  .top2,
  .top,
  .navBox {
    height: 85px;
  }

  .head-act2 {
    height: 70px;
  }


  .detCon {
    margin-top: 85px;
  }

  .inadv-num span {
    transform: translateY(-30%);
  }

  .inadv-num p {
    font-size: 50px;
    line-height: 56px;
  }

  .tactic-icon {
    width: 30px;
  }

  .peculiarity-dot {
    min-width: 12px;
    width: 12px;
    height: 12px;
  }

  .product-up {
    width: 20px;
  }

  .eng-pageBox .swiper-pagination-current,
  .ineng-pageBox .swiper-pagination-current {
    font-size: 30px;
  }

  .inpro-moreBox {
    min-width: 48px;
    width: 48px;
    height: 48px;
  }

  .inform-form,
  .consult-con,
  .contact-con2 {
    border-top-left-radius: 50px;
    border-bottom-right-radius: 50px;
  }

  .index-tit2 img {
    width: 60px;
    transform: translate(-50%, -20%);
  }

  .head-logo {
    width: 230px;
  }

  .head-act2 .head-logo {
    filter: none;
    width: 200px;
  }

  .food-rig {
    width: 69%;
  }

  .mes-formLi3 {
    margin-bottom: 20px;
  }

  .contact-iconBox {
    min-width: 45px;
    height: 45px;
  }

  .contact-iconBox img {
    width: 25px;
  }

  .partner-navBox2 h3 {
    font-size: 20px;
  }

  .tactic-conTit {
    font-size: 18px;
  }
}

@media only screen and (max-width: 1400px) {

  :root {
    --16: 14px;
    --18: 14px;
    --24: 18px;
    --30: 24px;
    --36: 26px;
    --48: 30px;
    --50: 35px;
    --64: 42px;
    --l30: 26px;
    --l35: 28px;
    --l60: 40px;
  }

  .banner-pageBox .banner-page {
    font-size: 32px;
    line-height: 32px;
  }

  .inadv-adv {
    width: 80%;
  }

  .inadv-signTit {
    font-size: 12px;
  }

  .head-navLi {
    padding: 0 0.6vw;
  }

  .head-navUl {
    margin-right: 1vw;
  }

  .eng-left {
    padding-left: 2.416667vw;
    padding-right: 15.575vw;
  }

  .eng-con2:nth-child(2n) .eng-left {
    margin-left: auto;
    padding-left: 15.575vw;
    padding-right: 2.416667vw;
  }

  .mes-formLi2 {
    margin-bottom: 2vw;
  }

  .inpro-moreBox {
    min-width: 42px;
    width: 42px;
    height: 42px;
  }

  .ineng-left {
    padding-left: 7.33%;
  }

  .inpro-moreBox img {
    width: 20px;
  }

  .index-tit img {
    width: 58px;
  }

  .inry-left {
    padding-left: 7.33%;
  }

  .banner-pageBox {
    right: 7.33%;
  }

  .partner-navBox2 h3 {
    font-size: 16px;
  }

  .tactic-left {
    padding-left: 7.33%;
  }

  .innew-tit p {
    font-size: 18px;
  }

  .innew-swiper {
    padding: 0 calc(7.33% - 3.0208333333vw);
  }

  .inadv-num {
    min-width: 60px;
    width: 60px;
  }

  .inform-form {
    left: 7.33%;
  }

  .tactic-rig {
    padding-right: 7.33%;
  }

  .inadv-num p {
    font-size: 40px;
    line-height: 44px;
  }

  .international {
    font-size: 36px;
  }


  .content2 {
    width: 89.34%
      /*7.33*/
    ;
  }

  .introduction-numBox {
    padding: 1.40625vw 7.33%;
  }

  .product-left {
    padding-left: 7.33%;
  }

  .product-rig {
    padding-right: 7.33%;
  }

  .product-con2 {
    width: 47.6%;
  }

  .product-nav {
    width: 16.8125vw;
  }

  .nav-box {
    width: calc(100% - 7.33%);
    height: 77px;
  }

  .product-ddCon {
    font-size: 14px;
  }

  .head-seLeft {
    width: 36.1875vw;
  }

  .head-serig {
    width: calc(100% - 36.1875vw);
    padding-right: 7.33%;
  }

  .newsdet-butImg,
  .page-item {
    width: 40px;
    height: 40px;
  }

  .index-butImg img {
    width: 20px;
  }

  .index-butBox {
    font-size: 14px;
  }

  .head-logo {
    width: 200px;
  }

  .head-act2 .head-logo {
    filter: none;
    width: 200px;
  }

  .food-nav2 {
    margin-bottom: 1vw;
  }

  .mes-but {
    min-width: 160px;
    height: 46px;
  }

  .inform-form,
  .consult-con,
  .contact-con2 {
    border-top-left-radius: 40px;
    border-bottom-right-radius: 40px;
  }


  .head-lag img {
    width: 20px;
  }

  .index-tit2 img {
    width: 54px;
  }

  .head-search img {
    width: 20px;
    aspect-ratio: 1;
  }

  .head-seBox2 {
    height: 23vw;
  }

  .banner-next,
  .banner-prev {
    width: 35px;
  }


  .prodet-rig {
    padding-left: 1.979167vw;
  }
}

@media only screen and (max-width: 1300px) {
  .head-seLeft {
    padding-top: 40px;
  }

  .introduction-numBox {
    position: absolute;
    left: 50%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: var(--g);
    width: 116.66%;
    padding: 1.40625vw 30px;
    z-index: 10;
    transform: translateX(-50%);
  }
}

@media only screen and (max-width: 1199px) {
  :root {
    --64: 40px;
  }


  .banner-pageBox .banner-page {
    font-size: 30px;
    line-height: 30px;
  }

  .nav-box {
    width: 100%;
    border-radius: 0;
  }

  .nav-con {
    overflow-x: scroll;
    overflow-y: hidden;
  }

  .nav-con::-webkit-scrollbar {
    display: none;
  }

  .nav-con2 {
    min-width: auto;
    white-space: nowrap;
  }

  .inadv-adv {
    width: 100%;
  }

  .head-listBut {
    display: flex;
    position: relative;
    z-index: 100;
  }

  .head-listBut div {
    background-color: #fff;
  }

  .navBox2 {
    padding-left: 7.33%;
    width: 100%;
  }

  .head-listButB {
    width: 85px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .head-act .head-listButB {
    background-color: var(--y);
  }

  .head-search::after {
    display: none;
  }

  .head-butBox,
  .head-navUl {
    display: none;
  }

  .inpro-conBox2 {
    width: 31.6%;
  }

  .inpro-conBox2:last-child {
    width: 65.8%;
  }


  .inry-numBox2:nth-child(2) {
    display: flex;
    justify-content: flex-start;
  }

  .tactic-tit2 {
    margin-bottom: 40px;
  }

  .partner-navBox {
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    justify-content: flex-start;
    padding-bottom: 36px;
  }

  .partner-navBox2 h3 {
    white-space: nowrap;
  }

  .partner-navBox::-webkit-scrollbar {
    display: none;
  }

  .partner-titBox {
    align-items: flex-start;
    flex-direction: column;
  }

  .honor-titBox {
    justify-content: space-between;
    flex-direction: row;
  }

  .honor-titBox .partner-navBox {
    width: auto;
  }

  .inry-numBox {
    margin-top: 30px;
  }

  .partner-con2 {
    width: 24%;
  }

  .tactic-conTit {
    margin-right: 1.604167vw;
  }

  .eng-left {
    padding-right: 15.575vw;
  }

  .eng-con2:nth-child(2n) .eng-left {
    padding-left: 15.575vw;
  }

  .introduction-box {
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  .tactic-icon {
    margin-right: 14px;
  }

  .inadv-num {
    margin-right: 8px;
  }

  .tactic-mapBox {
    margin: 20px 0;
  }
}

@media only screen and (max-width: 980px) {
  :root {
    --18: 14px;
    --30: 24px;
    --36: 24px;
    --50: 32px;
    --64: 36px;
    --l30: 26px;
    --l60: 30px;
    --l35: 28px;
  }

  .introduction-left {
    width: 100%;
  }

  .contact-left {
    width: 100%;
  }

  .mes-formLi2 {
    height: 100px;
  }

  .head-listButB {
    width: 70px;
  }

  .mes-formLi1 {
    width: 49%;
  }


  .tactic-rig::after {
    display: none;
  }

  .tactic-sign {
    padding: 20px;
    position: relative;
  }

  .tactic-sign::after {
    width: 100%;
    height: 110%;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--g);
    content: '';
    position: absolute;
    left: 0;
  }

  .tactic-sign2 {
    padding-top: 25px;
    padding-bottom: 10px;
    position: relative;
    z-index: 10;
  }

  .honornav {
    margin-right: 15px;
  }

  .introduction-numTit {
    text-align: center;
  }


  .inpro-more2 .inpro-moreBox {
    margin-right: 10px;
  }

  .food-top {
    flex-direction: column;
  }

  .inform-inp {
    padding: 12px 8px 12px 16px;
  }

  .inform-formTit {
    margin-bottom: 17px;
  }

  .innew-box {
    padding-top: 60px;
    padding-bottom: 20px;
  }

  .inhov-nav2 {
    padding-bottom: 5px;
  }

  .inhov-nav2 {
    margin-right: 19px;
  }

  .swiper-pagination4 {
    display: block;
    z-index: 200;
    position: absolute;
    pointer-events: all;
    top: unset;
    bottom: 60px !important;
    text-align: center;
  }

  .innew-conBox2 {
    padding: 0 30px;
    padding-top: 30px;
    padding-bottom: 100px;
  }

  .innew-textBox {
    margin-top: 30px;
    padding: 0 16px;
  }

  .innew-tit p {
    line-height: 30px;
  }

  .innew-more img {
    width: 20px;
  }

  .innew-tit {
    margin-bottom: 14px;
  }

  .inadv-con {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .innew-titBox {
    padding-bottom: 16px;
  }

  .innew-conBox2:last-child::after {
    display: block;
  }

  .inadv-i {
    min-width: 10px;
    height: 10px;
    transform: translateY(100%);
    margin-right: 5px;
  }

  .inadv-conBox {
    flex-direction: column;
  }

  .inadv-mapBox {
    width: 100%;
  }

  .inadv-sign {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
  }

  .inadv-adv {
    margin-top: 18px;
  }

  .inadv-icon {
    width: 20px;
    margin-right: 23px;
  }

  .inadv-sign2 {
    width: 48%;
    margin-bottom: 15px;
  }

  .ineng-box {
    padding-top: 0;
    padding-bottom: 100px;
  }

  .ineng-slide1 .ineng-contit {
    opacity: 0;
  }

  .ineng-contit {
    margin-left: 80px;
    margin-top: 15px;
  }

  .eng-pageBox .eng-pagination {
    margin: 0 12px;
  }

  .ineng-box2 {
    flex-direction: column;
  }

  .ineng-bg {
    display: none;
  }

  .ineng-rig {
    width: 100%;
    padding-left: 7.33%;
    position: relative;
  }

  .ineng-rig::after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 20%;
    background-color: var(--g);
    content: '';
    z-index: -1;
  }

  .ineng-left {
    width: 100%;
    padding-right: 7.33%;
    background-color: var(--g);
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .inpro-titBox {
    margin-bottom: 40px;
  }

  .inry-left {
    padding-top: 65px;
    padding-bottom: 60px;
  }

  .inpro-conTit {
    height: 35px;
  }

  .inpro-moreBox {
    min-width: 38px;
    width: 38px;
    height: 38px;
  }

  .inpro-conimg {
    width: 112px;
  }

  .inpro-conBox2 {
    margin-bottom: 65px;
  }

  .inpro-box {
    padding-top: 80px;
    padding-bottom: 55px;
  }

  .inry-rig {
    padding-top: 75px;
    padding-left: 55px;
  }

  .inry-text {
    margin-top: 40px;
    margin-bottom: 70px;
  }

  .inry-text p:first-child {
    margin-bottom: 16px;
  }

  .inry-ruiyuan {
    width: 467px;
  }

  .inry-numBox2 {
    margin-bottom: 25px;
  }

  .banner-prev {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-140%, -40%);
  }

  .banner-next {
    margin-bottom: 0;
    top: 50%;
    right: 0;
    transform: translate(140%, -40%);
    position: absolute;
  }

  .mien-more a {
    padding: 10px 20px;
  }

  .banner-scrBox {
    display: none;
  }

  .banner-pageBox {
    top: unset;
    right: 10%;
    bottom: 50px;
  }

  .mien-con {
    flex-wrap: wrap;
  }


  .honor-con2 {
    width: 31%;
    padding-bottom: 20px;
  }

  .innew-dateBg {
    width: 86px;
  }

  .innew-date {
    width: 100%;
    font-size: 14px;
    line-height: 20px;
    color: #ffffff;
    font-family: 'MontserratRegular';
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  .innew-dateBox {
    left: 15px;
    bottom: 20px;
  }

  .mien-box {
    padding-top: 60px;
    padding-bottom: 40px;
  }

  .mien-tit {
    bottom: 10px;
  }

  .mien-con {
    margin-bottom: 34px;
  }

  .mien-conBox {
    pointer-events: none;
  }

  .mien-conBox {
    margin-bottom: 30px;
  }

  .mien-titBox {
    margin-bottom: 30px;
  }

  .honor-tit {
    font-size: 16px;
  }

  .honor-swiper1 #value {
    margin-bottom: 2px;
  }

  .honor-box {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .honor-imgBox {
    margin-bottom: 13px;
  }

  .partner-box {
    padding-top: 80px;
    padding-bottom: 60px;
  }

  .partner-slide1 {
    padding: 32px 43px 36px;
  }

  .partner-conTitBox {
    margin-bottom: 20px;
  }

  .partner-con2 {
    width: 32%;
  }

  .partner-swbg {
    width: 220px;
  }

  .partner-img img {
    width: 180px;
  }

  .partner-con2 {
    padding: 8px 0;
    margin-bottom: 13px;
  }

  .partner-conTop {
    margin-bottom: 30px;
  }

  .partner-titBox {
    margin-bottom: 0px;
  }

  .tactic-icon {
    width: 25px;
  }

  .tactic-left {
    width: 100%;
    padding: 60px 7.33% 100px;
  }


  .tactic-box {
    flex-direction: column;
  }

  .tactic-conTit {
    margin-right: 0;
  }

  .tactic-con {
    justify-content: space-between;
  }

  .tactic-rig::after {
    /* height: 100%; */
  }

  .tactic-rig {
    width: 100%;
  }

  .tactic-sign {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .tactic-sign2 {
    width: 40%;
  }

  .inadv-map2 {
    display: block;
  }

  .inadv-map1,
  .map-ul {
    display: none;
  }

  .tactic-mapBox {
    transform: none;
    width: 100%;
  }

  .introduction-numBox {
    padding: 14px 7.33%;
  }

  .international {
    font-size: 24px;
    top: 0;
    left: 0;
    width: auto;
    display: inline-block;
    transform: none;
    text-align: right;
  }

  .introduction-text p {
    margin-bottom: 14px;
  }

  .introduction-leftTit {
    margin-bottom: 24px;
  }

  .develop-but {
    width: 40px;
    height: 40px;
    transform: translateY(-15px);
  }

  .introduction-box {
    padding-top: 100px;
    padding-bottom: 0px;
  }

  .develop-box {
    padding-top: 50px;
    padding-bottom: 60px;
  }

  .introduction-rig {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .introduction-rig img {
    width: 80%;
  }

  .consult-bg {
    width: 150px;
  }

  .introduction-box2 {
    flex-direction: column;
  }

  .prodet-glass {
    display: none !important;
  }

  .newsdet-nav img {
    width: 16px;
  }

  .eng-pageBox2 {
    padding: 0 12px;
  }

  .newsdet-riLi {
    font-size: 12px;
  }

  .prodet-navBox {
    margin-bottom: 17px;
  }

  .prodet-back a {
    display: block;
    padding: 7px 27px;
  }

  .prodet-box3 {
    padding: 0 65px;
    padding-bottom: 120px;
  }

  .consult-tit {
    margin-bottom: 6px;
  }

  .consult-text {
    margin-bottom: 20px;
  }

  .consult-yanzhengma {
    margin-right: 12px;
  }

  .consult-formLi {
    margin-bottom: 12px;
  }

  .consult-but {
    min-width: 166px;
    height: 40px;
  }

  .consult-inp {
    padding: 15px;
  }

  .consult-formLi1 {
    width: 49%;
  }

  .product-ddCon {
    margin-bottom: 10px;
  }


  .product-nav {
    width: 21.8125vw;
  }

  .product-left {
    width: 32.520833vw;
    padding-top: 90px;
  }

  .product-rig {
    width: calc(100% - 32.520833vw);
    padding-left: 40px;
    padding-top: 50px;
    padding-bottom: 70px;
  }

  .product-imgBox {
    margin-bottom: 15px;
  }

  .product-con2 {
    margin-bottom: 25px;
  }

  .product-dlTlt {
    padding: 5px 14px;
    position: relative;
  }

  .product-dlTltAct {
    padding-left: 25px;
  }

  .product-dl {
    margin-bottom: 18px;
  }

  .newsdet-butImg,
  .page-item {
    width: 35px;
    height: 35px
  }

  .mien-conBox:nth-child(3n+1) {
    position: relative;
    top: -30px;
  }

  .mien-conBox:nth-child(3n) {
    position: relative;
    top: -30px;
  }

  .product-dd {
    margin-top: 10px;
    padding-left: 25px;
  }

  .banner-pageBut {
    margin-left: 4px;
  }

  .product-tit2 {
    margin-bottom: 30px;
  }

  .product-nav {
    top: 100px;
  }

  .eng-box {
    padding-top: 80px;
  }


  .eng-pageBox {
    position: absolute;
    bottom: -30px;
    right: 0;
    top: unset;
    transform: translateY(100%);
  }

  .eng-rig {
    position: relative;
    top: 0;
    width: 100%;
  }

  .eng-swTit {
    left: 40px;
    bottom: 20px;
  }

  .eng-left {
    width: 100%;
    min-height: 33.125vw;
    background-color: #F6F6F6;
    padding-top: 45px;
    padding-left: 50px;
    padding-bottom: 60px;
    padding-right: 50px;
    min-height: auto;
  }

  .eng-tit {
    padding-bottom: 10px;
    margin-bottom: 25px;
  }

  .eng-con2 {
    display: flex;
    flex-direction: column;
    margin-bottom: 120px;
  }

  .eng-con2:nth-child(2n) .eng-pageBox {
    left: unset;
  }

  .eng-con2:nth-child(2n) .eng-left {
    padding-left: 50px;
    padding-right: 50px;
  }

  .top2,
  .top,
  .navBox {
    height: 70px;
  }

  .news-tit h2 {
    width: 100%;
  }

  .detCon {
    margin-top: 70px;
  }

  .newsdet-tit {
    margin-bottom: 12px;
  }

  .newsdet-messBox2 {
    margin-right: 60px;
  }

  .newsdet-top {
    padding-bottom: 30px;
    margin-bottom: 46px;
  }

  .newsdet-text {
    padding-bottom: 60px;
  }

  .newsdet-box {
    padding-top: 36px;
    padding-bottom: 90px;
  }

  .newsdet-butBox {
    margin-top: 28px;
  }

  .newsdet-back {
    min-width: 130px;
    height: 40px;
  }

  .newsdet-next {
    margin-left: 12px;
  }

  .newsdet-prev {
    margin-right: 12px;
  }

  .newsdet-con {
    padding: 0 68px;
    padding-bottom: 45px;
    padding-top: 54px;
  }

  .newsdet-nav {
    margin-bottom: 25px;
  }

  .newsdet-text:has(img) p {
    font-size: 14px !important;
    line-height: 22px !important;
  }

  .index-butBox .index-butBox2,
  .index-butBox a {
    padding: 10px 20px 10px 50px;
  }

  .eng-pageBox .swiper-pagination-current,
  .ineng-pageBox .swiper-pagination-current {
    font-size: 26px;
  }

  .news-pageBox .swiper-pagination1 {
    padding: 0 12px;
  }

  .news-swimg {
    margin-right: 50px;
  }

  .inhov-conTit {
    padding-top: 30px;
  }

  .inhov-conTit p {
    font-size: 16px;
  }

  .news-box {
    padding-top: 50px;
    padding-bottom: 90px;
  }

  .news-conBox2 {
    width: 48%;
    margin-bottom: 20px;
  }

  .news-conTit h2 {
    font-size: 16px;
  }

  .news-conText {
    padding: 18px 20px 18px 20px;
  }

  .news-tit {
    margin-bottom: 30px;
  }

  .news-top {
    padding-top: 80px;
    padding-bottom: 60px;
    background-color: #F6F6F6;
  }

  .eng-pageBox .swiper-pagination-total,
  .ineng-pageBox .swiper-pagination-total {
    font-size: 14px;
  }

  .ineng-pageBox .swiper-pagination2 {
    padding: 0 12px;
  }

  .news-date {
    margin-bottom: 8px;
  }

  .head-logo {
    width: 180px;
  }

  .food-con1 p {
    padding-right: 10px;
    margin-right: 12px;
  }

  .food-con1 {
    margin-bottom: 16px;
  }

  .contact-con2 {
    flex-direction: column;
  }

  .contact-rig {
    width: 100%;
  }

  .develop-date {
    line-height: 26px;
  }

  .contact-leftTit {
    margin-bottom: 30px;
  }

  .develop-date {
    padding: 0 6px;
  }

  .contact-iconBox {
    margin-right: 12px;
  }

  .contact-text p {
    margin-bottom: 3px;
  }

  .contact-rigTit {
    margin-bottom: 30px;
  }

  .mes-formLi1 {
    margin-bottom: 15px;
  }

  .mes-yanzhengma {
    margin-right: 12px;
  }

  .mes-yanzimg {
    margin-right: 5px;
  }

  .contact-mes2 {
    padding-bottom: 20px;
    margin-bottom: 25px;
  }

  .mes-inp {
    width: 100%;
    padding: 15px;
  }


  .contact-con {
    transform: translateY(-100px);
  }

  .contact-con2 {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    background-color: var(--g);
    padding: 40px 70px 60px;
  }

  .contact-rig {
    margin-top: 68px;
  }


  .food-con1 li {
    margin-bottom: 12px;
  }

  .food-top {
    padding-bottom: 40px;
  }

  .food-con2 li {
    margin-right: 8px;
  }

  .food-box {
    padding-top: 45px;
  }

  .food-nav {
    padding-bottom: 7px;
    margin-bottom: 8px;
  }

  .food-nav2 {
    margin-bottom: 10px;
  }

  .food-bom {
    padding: 16px 0;
  }

  .food-logo {
    width: 189px;
    margin-bottom: 25px;
  }

  .food-left {
    margin-bottom: 40px;
  }

  .food-left,
  .food-rig {
    width: 100%;
  }

  .prodet-con {
    flex-direction: column;
  }

  .tactic-dot {
    min-width: 10px;
    height: 10px;
    margin-right: 5px;
    transform: translateY(100%);
  }

  .prodet-rig {
    width: 100%;
    padding-left: 0;
    padding-top: 25px;
    position: relative;
    z-index: 1;
  }

  .prodet-attribute {
    margin-bottom: 40px;
  }

  .peculiarity-box {
    padding-top: 70px;
    padding-bottom: 60px;
  }



  .inform-form {
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    margin: 0 auto;
    z-index: 10;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    padding: 45px 55px 55px;
  }

  .inform-box {
    position: relative;
    top: -1px;
    background-color: #fff;
  }

  .inform-box::after {
    position: absolute;
    bottom: -1px;
    right: 0;
    height: 51%;
    width: 100%;
    background-color: #272727;
    content: '';
  }

  .inform-box {
    height: auto;
  }

  .inform-formUl {
    flex-wrap: wrap;
  }

  .inform-formLi {
    width: 100%;
    margin-bottom: 20px;
  }

  .consult-con {
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    padding: 45px 55px 55px;
  }

  .parameter-box {
    padding-bottom: 95px;
  }

  .prodet-butBox2 {
    margin-right: 15px;
  }

  .peculiarity-conBox2 {
    margin-bottom: 8px;
  }

  .peculiarity-tit {
    margin-bottom: 33px;
    padding-bottom: 15px;
  }

  .prodet-offer a {
    padding: 10px 34px;
  }

  .prodet-attribute2 {
    margin-bottom: 20px;
  }

  .prodet-contit {
    padding-bottom: 17px;
    margin-bottom: 24px;
  }

  .prodet-con {
    padding: 65px 65px 75px;
  }

  .prodet-swiper1 {
    margin-bottom: 10px;
  }

  .inform-but {
    padding: 8px;
  }

  .inform-formbg {
    width: 160px;
  }

  .inform-formBut {
    width: auto;
  }

  .inhov-box {
    padding-top: 60px;
    padding-bottom: 45px;
  }

  .inhov-titBox {
    margin-bottom: 40px;
  }

  .inhov-swiper .swiper-wrapper {
    padding-bottom: 30px;
  }

  .inhov-prev {
    margin-right: 15px;
  }

  .inhov-allBox::after {
    top: 27vw;
    height: 16px;
  }

  .innew-tit p {
    font-size: 18px;
    line-height: 26px;
  }

  .product-conTit {
    padding-bottom: 15px;
  }

  .peculiarity-dot {
    transform: translateY(90%);
    min-width: 10px;
    width: 10px;
    height: 10px;
    margin-right: 10px;
  }

  .head-close {
    width: 20px;
    height: 20px;
    left: 86vw;
    top: 8vw;
  }

  .btn-icon1 {
    font-size: 25px !important;
    color: #ffffff !important;
  }

  .head-search {
    padding-right: 8px;
    margin-right: 8px;
  }

  .prodet-left {
    width: 100%;
  }

  .introduction-numBox {
    bottom: 0;
  }
}

@media only screen and (max-width: 768px) {
  :root {
    --20: 14px;
    --24: 16px;
    --30: 20px;
    --48: 28px;
    --64: 30px;
    --68: 40px;
  }

  .banner-pageBox .banner-page {
    font-size: 28px;
    line-height: 28px;
  }


  .partner-con2 {
    width: 49%;
  }

  .inry-numBox2 {
    width: 100%;
  }

  .inry-numBox {
    margin-top: 0px;
  }

  .mien-conBox:nth-child(3n+1) {
    position: relative;
    top: 0px;
  }

  .mien-conBox:nth-child(3n) {
    position: relative;
    top: 0px;
  }

  .mien-conBox {
    width: 47%;
  }

  .inhov-titBox {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .inform-form {
    padding: 34px 28px 36px;
  }

  .innew-titBox {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .inhov-nav {
    margin: 0;
    order: 2;
    justify-content: flex-start;
    width: 100%;
  }

  .inhov-navBox {
    width: 100%;
    justify-content: space-between;
  }

  .inhov-tit {
    margin-bottom: 30px;
  }

  .inadv-adv {
    flex-wrap: wrap;
  }

  .inhov-nav {
    overflow-x: scroll;
  }

  .inhov-nav::-webkit-scrollbar {
    display: none;
  }

  .inadv-adv2 {
    width: 100%;
    margin-right: 0;
    justify-content: flex-start;
    margin-bottom: 10px;
  }


  .ineng-pageBox {
    transform: translateY(150%);
  }

  .inry-box2 {
    flex-direction: column;
  }

  .inry-ruiyuan {
    width: 68vw;
  }

  .inpro-conBox2 {
    width: 47.6%;
  }

  .inpro-conBox2:last-child {
    width: 47.6%;
  }


  .inry-left {
    width: 100%;
    padding: 0 7.33%;
    padding-top: 65px;
    padding-bottom: 60px;
  }

  .inry-text {
    width: 100%;
  }

  .banner-next,
  .banner-prev {
    width: 30px;
  }

  .banner-box {
    height: 500px;
  }

  .honor-con2 {
    width: 48%;
  }

  .partner-conTop {
    flex-direction: column;
    align-items: flex-start;
  }

  .tactic-con {
    flex-wrap: wrap;
  }

  .tactic-con2 {
    width: 100%;
    justify-content: flex-start;
    margin-bottom: 10px;
  }



  .introduction-rig img {
    margin-right: 0;
  }

  .introduction-rig {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .food-left {
    margin-bottom: 0;
  }


  .introduction-left {
    width: 100%;
  }

  .prodet-con {
    padding: 65px 30px 75px;
  }

  .prodet-box3 {
    padding: 0 30px;
    padding-bottom: 120px;
  }

  .product-left {
    width: 100%;
    padding-right: 7.33%;
    padding-top: 35px;
  }


  .product-dlTltAct {
    padding-left: 14px;
  }

  .product-dlTlt {
    min-width: 150px;
  }

  .product-dlTlt::after {
    height: 100%;
    width: 1px;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 0;
    content: '';
  }

  .product-tlt {
    margin-right: 30px;
  }

  .product-rig {
    width: 100%;
    padding-left: 7.33%;
  }

  .product-tlt h3 {
    white-space: nowrap;
  }

  .product-conTit h4 {
    font-size: 16px;
  }

  .product-dd {
    padding-left: 20px;
  }

  .product-ddCon {
    width: 100%;
  }

  .product-nav {
    width: 100%;
  }

  .product-box {
    flex-direction: column;
  }


  .inpro-conimg {
    width: 170px;
  }

  .nav-con2 {
    margin-right: 30px;
  }

  .inhov-pageBox .swiper-pagination3 {
    width: 77%;
  }



  .newsdet-messBox {
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .newsdet-messBox2 span {
    transform: translateY(8%);
  }

  .newsdet-messBox2 {
    margin-right: 0px;
  }

  .food-rig {
    display: none;
  }

  .contact-con2 {
    padding: 37px 40px 60px;
  }

  .ban-box img {
    height: 300px;
  }

  .inry-eng {
    top: 16.78125vw;
  }

  .honor-slide1,
  .partner-slide1 {
    position: absolute;
    opacity: 0 !important;
    transform: translateY(50px) !important;
  }

  .honor-swiper1 .swiper-slide-active,
  .partner-swiper1 .swiper-slide-active {
    position: relative;
    opacity: 1 !important;
    transform: none !important;
  }

  .develop-slide1 {
    flex-direction: column;
    position: relative;
    padding: 0;
  }

  .develop-textBox {
    width: 100%;
  }

  .develop-slide1:hover .develop-imgBox {
    transform: translateY(40px) !important;
  }

  .develop-swiper .swiper-slide-active .develop-imgBox {
    transform: translateY(40px) !important;
  }

  .develop-but {
    width: 35px;
    height: 35px;
    transform: none;
  }

  .develop-swiper {
    overflow: hidden;
    margin-bottom: 30px;
  }

  .develop-years {
    left: 0;
    margin-bottom: 20px;
  }

  .develop-swiper2 {
    width: 100%;
  }

  .develop-butBox {
    margin-left: auto;
    margin-top: 20px;
  }

  .develop-navBox {
    flex-direction: column;
  }

  .develop-imgBox {
    width: 100%;
  }

  .develop-slide1 {
    position: absolute !important;
  }

  .develop-swiper .swiper-slide-active {
    position: relative !important;
  }
}

@media only screen and (max-width: 540px) {
  :root {
    --24: 16px;
    --36: 26px;
    --48: 26px;
    --50: 26px;
    --64: 24px;
    --68: 30px;
    --128: 60px;
    --200: 18.416667vw;
    --l35: 24px;
    --l60: 30px;
  }


  .inhov-allBox::after {
    top: 50vw;
  }

  .innew-box {
    padding-bottom: 80px;
  }

  .introduction-rig {
    padding-bottom: 150px;
  }

  .introduction-numBox {
    flex-direction: column;
  }

  .introduction-numBox2 {
    width: 100%;
    margin-bottom: 20px;
  }

  .banner-tit2 h2 {
    font-size: 18px;
  }

  .banner-titBox {
    width: 100%;
  }

  .tactic-conTit {
    font-size: 16px;
  }

  .inpro-conBox2:last-child .inpro-conimg {
    width: 110px;
  }

  .banner-tit2 {
    width: 100%;
  }

  .prodet-attribute2 {
    flex-direction: column;
  }

  .prodet-shareBox {
    margin: 0;
    margin-top: 20px;
  }

  .prodet-butBox2 {
    padding: 8px 11px 8px 20px !important;
    margin-bottom: 20px;
  }

  .prodet-butBox2 .index-butImg {
    height: 80%;
  }

  .prodet-butBox {
    flex-direction: column;
  }

  .partner-swiper1 .swiper-wrapper {
    align-items: normal;
  }


  .inry-bg {
    width: 200px;
    bottom: 439px;
    left: unset;
    right: 10px;
    transform: none;
  }

  .ban-tit h2 {
    position: unset;
    transform: none;
    animation: slowAm1 1.5s forwards;
  }

  .ban-tit {
    filter: none;
    background: transparent;
  }

  .prodet-box {
    overflow: hidden;
  }

  .consult-inp {
    padding: 12px 15px;
  }

  .peculiarity-dot {
    margin-right: 5px;
  }

  .mien-tit {
    font-size: 16px;
  }

  .mien-conBox {
    width: 100%;
  }

  .prodet-con {
    padding: 48px 30px 75px;
  }

  .prodet-offer a {
    padding: 8px 28px;
  }

  .swiper-pagination4 {
    bottom: 0px !important;
  }

  .inhov-prev {
    margin-right: 5px;
  }

  .inhov-pageBox .swiper-pagination3 {
    width: 68%;
  }

  .food-con1 p::after {
    top: 55%;
  }

  .eng-box {
    padding-bottom: 50px;
  }

  .partner-text {
    font-weight: 400;
  }

  .index-butBox .index-butBox2,
  .index-butBox a {
    padding: 8px 11px 8px 45px;
  }

  .innew-textBox {
    padding: 0;
    margin-top: 25px;
  }

  .innew-tit p {
    font-size: 16px;
    line-height: 24px;
  }

  .inpro-conTit h3 {
    font-size: 20px;
  }


  .inform-formTit h2 {
    font-size: 24px;
    line-height: 1.2em;
  }

  .innew-conBox {
    flex-direction: column;
  }


  .swiper-pagination4 {
    display: none;
  }

  .inhov-nav2 {
    margin-right: 20px;
  }

  .nav-con2 {
    font-weight: 500;
  }

  .prodet-se .prodet-attrTit {
    transform: translateY(5px);
  }

  .parameter-tabBox table tbody tr td {
    font-size: 14px !important;
  }



  .innew-conBox2 {
    width: 100%;
    padding: 4%;
    padding-top: 30px;
    padding-bottom: 30px;
  }

  .innew-conBox2::after {
    display: none;
  }

  .innew-conBox2::after {
    display: none;
  }

  .innew-conBox2:last-child::after {
    display: none;
  }

  .inadv-signTit {
    margin-bottom: 5px;
  }

  .content2 {
    width: 92%
      /*4*/
    ;
  }

  .ineng-left {
    padding-right: 4%;
  }

  .inadv-sign2 {
    width: 100%;
    padding-left: 20px;
  }

  .ineng-rig {
    padding: 0 4.33%;
  }

  .inpro-conBox2:last-child {
    width: 100%;
    height: 100px;
    margin-top: 30px;
  }

  .inpro-box {
    padding-bottom: 0;
  }

  .inpro-conBox2 {
    width: 100%;
  }

  .inadv-adv {
    margin-top: 40px;
  }

  .inadv-map {
    margin: 20px 0;
  }

  .inry-text {
    margin-bottom: 40px;
  }

  .ineng-left {
    padding-bottom: 35px;
  }

  .inry-num2,
  .inry-num {
    font-size: 50px;
  }

  .honor-titBox {
    justify-content: space-between;
    flex-direction: column;
  }

  .honor-titBox .partner-navBox {
    width: 100%;
  }

  .banner-img {
    object-position: 80%;
  }



  .inry-eng {
    font-size: 10vw;
    top: 120px;
    left: 10%;
    transform: none !important;
  }

  .inry-rig {
    width: 100%;
    padding: 0 4%;
    padding-top: 40px;
    padding-bottom: 44vw;
  }

  .inry-numBox2 {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .inry-numBox2:nth-child(2) {
    justify-content: center;
  }

  .inry-numBox3 {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  .inry-numBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
  }

  .inry-ruiyuan {
    width: 100%;
  }

  .inhov-swBox {
    width: 100%;
  }

  .inhov-swiper {
    width: 90%;
    margin: 0 auto;
  }

  .inry-left {
    padding: 0 4%;
    padding-top: 65px;
    padding-bottom: 60px;
  }

  .banner-pageBox {
    right: 15%;
  }

  .head-listFrom {
    width: 76%;
    padding-left: 0;
  }

  .banner-pageBox .banner-page {
    font-size: 28px;
    line-height: 28px;
  }

  .btn-icon1 {
    font-size: 20px !important;
    color: #ffffff !important;
  }

  .head-btn {
    width: 50px;
    height: 50px;
  }

  .banner-next,
  .banner-prev {
    width: 25px;
  }

  .mien-con {
    margin-bottom: 0px;
  }


  .honor-con2 {
    width: 100%;
  }

  .partner-con2 {
    width: 100%;
  }

  .partner-slide1 {
    padding: 32px 20px 36px;
  }

  .tactic-left {
    padding: 60px 7.33% 60px;
  }

  .tactic-sign2 {
    width: 100%;
  }



  .introduction-leftTit {
    margin-bottom: 50px;
  }

  .international {
    font-size: 25px;
    top: 40px;
    opacity: 0.2;
  }

  .partner-navBox2 {
    margin-bottom: 10px;
  }

  .index-tit img,
  .index-tit2 img {
    transform: translate(-18%, -20%);
    width: 50px;
  }

  .consult-formLi1 {
    width: 100%;
  }

  .consult-con {
    padding: 45px 20px 55px;
  }

  .prodet-back {
    margin-left: auto;
  }

  .prodet-navBox {
    flex-direction: column;
    align-items: flex-start;
  }

  .prodet-box3 {
    padding: 0;
    padding-bottom: 120px;
  }

  .prodet-shareBox {
    flex-wrap: wrap;
    justify-content: flex-start;
  }


  .prodet-shareBox a {
    margin-bottom: 10px;
  }

  .product-con2 {
    width: 100%;
  }

  .navBox2 {
    width: 100%;
    padding-left: 4%;
  }

  .head-listButB {
    width: 60px;
  }

  .page-item {
    margin: 0 5px;
  }

  .eng-con2:nth-child(2n) .eng-left {
    padding-left: 25px;
    padding-right: 25px;
  }

  .inhov-butBox {
    margin: 20px 0;
    margin-left: auto;
  }

  .eng-left {
    padding-left: 25px;
    padding-right: 25px;
  }

  .ineng-contit {
    margin-left: 30px;
  }

  .eng-swTit {
    width: 100%;
    padding-right: 30px;
    left: 25px;
  }

  .inpro-titBox {
    flex-direction: column;
    align-items: flex-start;
  }

  .inpro-titBox .index-butBox {
    margin-left: auto;
  }

  .inpro-tit {
    margin-bottom: 20px;
  }

  .inry-tit {
    text-align: center;
  }

  .eng-rig::before {
    top: 8px;
    left: 8px;
  }

  .eng-con2:nth-child(2n) .eng-rig::before {
    right: 8px;
  }

  .newsdet-butImg,
  .page-item {
    width: 30px;
    height: 30px
  }

  .newsdet-top {
    padding-bottom: 20px;
    margin-bottom: 30px;
  }

  .newsdet-but p {
    display: none;
  }

  .newsdet-con {
    padding-left: 30px;
    padding-right: 30px;
  }

  .newsdet-tit {
    margin-bottom: 15px;
  }

  .newsdet-messBox2 {
    margin-bottom: 5px;
  }

  .mes-formLi1 {
    width: 100%;
  }

  .inadv-sign2 {
    margin-bottom: 20px;
  }

  .news-tit h2 {
    font-size: 20px;
    width: 100%;
  }

  .eng-pageBox .swiper-pagination-current,
  .ineng-pageBox .swiper-pagination-current {
    font-size: 24px;
  }

  .news-conBox2 {
    width: 100%;
  }

  .inpro-moreBox {
    min-width: 35px;
    width: 35px;
    height: 35px;
  }

  .inpro-moreBox img {
    width: 16px;
  }

  .news-swimgBox {
    margin-right: 0;
    margin-bottom: 20px;
    width: 100%;
  }

  .news-textBox {
    width: 100%;
  }

  .news-slide1 a {
    flex-direction: column;
  }

  .mes-yanzhengma {
    width: 140px;
    padding-left: 15px;
    margin-right: 10px;
  }

  .mes-formLi3 .mes-or {
    display: none;
  }

  .mes-formLi4 {
    width: 100%;
  }

  .mes-formButBox {
    width: 100%;
  }

  .consult-but,
  .mes-but {
    min-width: auto;
    width: 100%;
    height: 38px;
  }

  .mes-tit {
    display: none;
  }

  .mes-yanzhengma::placeholder {
    opacity: 1;
  }

  .innewnav {
    white-space: nowrap;
  }

  .contact-iconBox {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }

  .contact-iconBox img {
    width: 20px;
  }

  .top2,
  .top,
  .navBox {
    height: 60px;
  }

  .detCon {
    margin-top: 60px;
  }

  .head-logo {
    width: 150px;
  }

  .food-bom {
    padding: 10px 0;
    flex-direction: column;
    align-items: flex-start;
  }

  .inry-eng {
    opacity: 0.5;
  }

  .food-bom p {
    margin-bottom: 5px;
  }

  .con {
    margin-top: 60px;
  }

  .innew-box .inhov-butBox {
    position: absolute;
    right: 4%;
    bottom: 16px;
  }
}


.setSlow1 {
  animation: slowAm1 1.5s forwards;
}

.setSlow2 {
  animation: slowAm2 1s forwards;
}

.setSlow3 {
  animation: slowAm3 1s forwards;
}

.setSlow3_ {
  animation: slowAm3_ 1s forwards;
}

.setSlow4 {
  animation: slowAm4 2s forwards;
}

.setSlow5 {
  animation: slowAm5 1s forwards;
}

.setSlow6 {
  animation: slowAm6 5.5s ease-in-out forwards;
}

.setSlow7 {
  animation: slowAm7 1.5s forwards;
}

@keyframes slowAm1 {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }

  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

@keyframes slowAm7 {
  0% {
    opacity: 1;
    transform: translateY(30px);
  }

  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

@keyframes slowAm2 {
  0% {
    opacity: 0;
    transform: translateX(-50px);
  }

  100% {
    opacity: 1;
    transform: translateX(0px);
  }
}

@keyframes slowAm3 {
  0% {
    opacity: 0;
    transform: translateX(50px);
  }

  100% {
    opacity: 1;
    transform: translateX(0px);
  }
}

@keyframes slowAm3_ {
  0% {
    opacity: 1;
    transform: translateX(0px);
  }

  100% {
    opacity: 0;
    transform: translateX(-50px);
  }
}

@keyframes slowAm4 {
  0% {
    opacity: 1;
    filter: blur(10px);
  }

  100% {
    opacity: 1;
    filter: none;
  }
}

@keyframes slowAm5 {
  0% {
    opacity: 0;
    transform: scale(0);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes slowAm6 {
  0% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}


.index-but {
  position: relative;
}

.index-but img {
  position: relative;
  z-index: 100;
  transition: all .5s;
}

.index-but::after {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--g);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  content: '';
  border-radius: 50%;
  transition: all .5s;
}

.index-but:hover::after {
  transform: translate(-50%, -50%) scale(1.1);
}

.index-but:hover img {
  filter: brightness(0) invert(1);
}


.index-more {
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.light {
  pointer-events: none;
  z-index: 10;
  position: absolute;
  left: -100%;
  top: 0;
  width: 100%;
  height: 100%;
  transform: skewx(-25deg);
  background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
}


.index-more:hover .light {
  transition: all .5s;
  left: 100%;
}</pre></body></html>