body {
  background: #fff;
}

.banner {
  height: 100vh;
  overflow: hidden;
}

.banner img {
  width: 100%;
}

.mouse {
  position: absolute;
  z-index: 15;
  right: 1vw;
  bottom: 0;
}

/* 第1部分 */

.part1 {
  position: relative;
  background: url(../images/part1_bg.jpg) no-repeat center bottom/cover;
}

.part1-main {
  width: 94vw;
  margin: 0 auto;
}

.part1-line {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 5vw 0;
}

.part1-left img {
  width: 26vw;
}

.part1-right {
  padding-left: 1vw;
}

.part1-right img {
  width: 27.6vw;
}

.part1-ul {
  overflow: hidden;
}

.part1-ul ul {
  display: flex;
}

.part1-ul li {
  width: 20%;
  padding: 0 0.3vw;
}

.part1-ul li a {
  display: block;
  position: relative;
  overflow: hidden;
  color: #fff;
  background: #707070;
}

.part1-li-img img {
  width: 100%;
  opacity: 0.5;
}

.part1-li-layer {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  padding: 6vw 0 0;
  text-align: center;
  transition: 0.6s;
}

.part1-li-ch {
  width: 100%;
  padding: 2.4vw 0 0;
  font-size: 1.5vw;
  line-height: 1.6vw;
}

.part1-li-en {
  padding: 0 0 1vw;
  width: 100%;
  font-size: 0.8vw;
  line-height: 1vw;
  text-transform: uppercase;
}

.part1-li-more {
  width: 6vw;
  margin: 0 auto;
  font-size: 0.8vw;
  line-height: 1.6vw;
  text-align: center;
  border: 1px solid #fff;
}

.part1-ul li a:hover .part1-li-img img {
  opacity: 1;
}

.part1-ul li a:hover .part1-li-layer {
  transform: translate3d(0, 6vw, 0);
}

.part1-icon {
  padding: 2vw 0;
  text-align: right;
}

.part1-icon img {
  width: 10.2vw;
}

/* 第2部分 */

.part2 {
  display: flex;
  justify-content: space-between;
  padding: 5vw 0 1.2vw;
  background: #fff url(../images/part2_bg.jpg) no-repeat center bottom / 100%;
}

.part2-slide {
  width: 17.5vw;
}

.part2-slide img {
  width: 100%;
}

.part2-box {
  width: 78vw;
}

.part2-top {
  position: relative;
  z-index: 1;
}

.part2-name {
  width: 8vw;
  padding: 1.2vw 0 1.8vw;
  text-align: right;
}

.part2-name .ch {
  font-size: 1.2vw;
  line-height: 1.4vw;
  color: #be2828;
}

.part2-name .en {
  font-size: 0.9vw;
  line-height: 1vw;
  color: #727171;
}

.part2-title {
  position: absolute;
  z-index: 1;
  left: 10vw;
  top: 0;
}

.part2-ul {
  position: relative;
  z-index: 10;
  height: 11vw;
  overflow: hidden;
}

.part2-ul ul {
  position: absolute;
  display: flex;
}

.part2-ul ul li {
  width: 16vw;
  padding: 0 0.6vw;
}

.part2-ul ul a {
  display: block;
  padding: 2px;
  background: #fff;
}

.part2-ul ul a i {
  display: block;
}

.part2-ul ul i img {
  width: 100%;
}

.part2-ul ul a p {
  padding: 0 5px;
  font-size: 0.8vw;
  line-height: 2vw;
  color: #000;
  text-align: center;
}

/* 第3部分 */

.part3 {
  position: relative;
  z-index: 1;
  height: 51vw;
  background: url(../images/part3_bg.jpg) no-repeat center 0 / cover;
}

.part3-main {
  position: relative;
  z-index: 10;
  width: 56vw;
  margin: 0 auto;
}

.part3-title {
  padding: 5vw 0 0;
  text-align: center;
}

.part3-title img {
  width: 16.6vw;
}

.part3-p {
  height: 7.2vw;
  margin: 2vw 0;
  font-size: 1.2vw;
  line-height: 2.4vw;
  color: #000;
  text-align: center;
}

.part3-more a {
  display: block;
  width: 6vw;
  margin: 2vw auto;
  font-size: 0.8vw;
  line-height: 1.6vw;
  text-align: center;
  color: #000;
  border: 1px solid #000;
}
.part3-more a:hover {
  color: #fff;
  background: #000;
}

.part3-ul {
  display: flex;
  justify-content: center;
}

.part3-li {
  margin: 0 1vw;
}

.part3-li-box {
  width: 13vw;
  height: 13vw;
  padding: 3vw 0 0;
  text-align: center;
  background: url(../images/part3_li_circle.png) no-repeat center center/100%;
}

.part3-li-name {
  text-align: center;
}

.part3-li-name p {
  font-weight: bold;
  font-size: 1.8vw;
  line-height: 2vw;
  color: #0e3677;
  text-shadow: #fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0;
}

.part3-li-p {
  margin: 0.6vw 0 0;
  font-size: 1.2vw;
  line-height: 1.5vw;
  color: #fff;
}

.part3-icon {
  position: absolute;
  z-index: 1;
  left: 5vw;
  top: 4.5vw;
}

.part3-icon img {
  width: 29.2vw;
}

.part3-ad1 {
  position: absolute;
  z-index: 2;
  right: 5vw;
  top: 4.2vw;
}

.part3-ad1 img {
  width: 31.4vw;
}

.part3-ad2 {
  position: absolute;
  z-index: 2;
  right: 16vw;
  top: 7.2vw;
}

.part3-ad2 img {
  width: 20vw;
}

.part3-ad3 {
  position: absolute;
  z-index: 1;
  right: 11.8vw;
  bottom: 3vw;
}

.part3-ad3 img {
  width: 11.8vw;
}

.part3-left {
  position: absolute;
  z-index: 3;
  left: 0;
  bottom: 0;
}

.part3-left img {
  width: 27.6vw;
}

.part3-right {
  position: absolute;
  z-index: 4;
  right: 0;
  bottom: 0;
}

.part3-right img {
  width: 14.2vw;
}

.part3-ewm {
  position: absolute;
  z-index: 15;
  right: 3vw;
  bottom: 3vw;
}

.part3-ewm li {
  padding: 0 0 1vw;
  text-align: center;
}

.part3-ewm li img {
  width: 8.4vw;
}

.part3-ewm li p {
  font-size: 0.9vw;
  line-height: 1.6vw;
  color: #000;
}

/* 第4部分 */

.part4 {
  position: relative;
  background: url(../images/part4_bg.jpg) no-repeat center 0 / cover;
}

.part4-car {
  position: absolute;
  z-index: 5;
  left: 0;
  top: -5vw;
}

.part4-car img {
  width: 23.7vw;
}

.part4-main {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 64vw;
  margin: 0 auto;
  padding: 7.5vw 0;
}

.part4-logo img {
  width: 7.5vw;
}

.part4-box {
  width: 30vw;
}

.part4-name {
  color: #fff;
}

.part4-name .ch {
  font-size: 1.5vw;
  line-height: 1.6vw;
}

.part4-name .en {
  font-size: 0.8vw;
  line-height: 1vw;
}

.part4-p {
  height: 8vw;
  overflow: hidden;
  margin: 1.5vw 0;
  font-size: 0.9vw;
  line-height: 1.6vw;
  color: #fff;
}

.part4-icon {
  padding: 1vw 0 0;
}

.part4-icon img {
  width: 22.4vw;
}

.part4-nav {
  width: 20vw;
  padding: 0 0 0 2vw;
  border-left: 1px dashed rgba(255, 255, 255, 0.4);
}

.part4-nav ul {
  display: flex;
  flex-wrap: wrap;
}

.part4-nav ul li {
  width: 50%;
  padding: 0.4vw 1.2vw 1vw;
}

.part4-nav ul a {
  display: block;
  padding-left: 2vw;
  background: url(../images/arrow_ww.png) no-repeat 0 center/0.9vw;
  transition: 0.3s;
}

.part4-nav ul a span {
  display: block;
  font-size: 1vw;
  line-height: 1.2vw;
  color: #fff;
}

.part4-nav ul a:hover {
  opacity: 0.5;
}

.part4-quality {
  position: absolute;
  z-index: 1;
  left: 15vw;
  top: 21vw;
}

.part4-quality img {
  width: 12vw;
}

.part4-safety {
  position: absolute;
  z-index: 1;
  right: 2vw;
  top: 5.6vw;
}

.part4-safety img {
  width: 7.5vw;
}

.part4-healthy {
  position: absolute;
  z-index: 1;
  right: 2vw;
  top: 18vw;
}

.part4-healthy img {
  width: 13.6vw;
}

.part4-since {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
}

.part4-since img {
  width: 45vw;
}

/* 第5部分 */

.part5 {
  position: relative;
  background: url(../images/part5_bg.jpg) no-repeat center 0 / cover;
}

.part5-main {
  width: 74vw;
  margin: 0 auto;
}

.part5-top {
  width: 20vw;
  margin: 0 auto;
  padding: 3.6vw 0;
  background: url(../images/part5_ji.png) no-repeat right center/8.6vw;
}

.part5-name {
  padding: 0 0 1vw;
}

.part5-name img {
  width: 14.2vw;
}

.part5-detail {
  font-weight: bold;
  font-size: 1.2vw;
  line-height: 1.5vw;
  color: #000;
}

.part5-detail span {
  color: #be2828;
}

.part5-banner {
  background: url(../images/part5_xian.png) no-repeat 5vw 2vw/24vw;
}

.part5-banner .swiper-slide {
  background: url(../images/part5_line.png) no-repeat 4px 0;
}

.part5-li {
  padding: 8vw 1vw 0;
  background: url(../images/dian.png) no-repeat 0 8.6vw;
  transition: 1s 0.6s;
}

.part5-font {
  transition: 1s 0.6s;
}

.part5-name {
  font-size: 1.2vw;
  line-height: 1.6vw;
  color: #000;
  transition: 1s 0.6s;
}

.part5-p {
  height: 6vw;
  overflow: hidden;
  font-size: 0.8vw;
  line-height: 1.2vw;
  color: #999999;
  transition: 1s 0.6s;
}

.part5-li-img {
  position: relative;
  height: 18.8vw;
  overflow: hidden;
}

.part5-li-img i {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  transition: 1s 0.6s;
}

.part5-li-img span {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  opacity: 0;
  transform: translate3d(0, 100%, 0);
  transition: 1s 0.6s;
}

.part5-li-img img {
  width: 100%;
}

.part5-banner .swiper-slide-active {
  background-image: url(../images/part5_linea.png);
}

.part5-banner .swiper-slide-active .part5-li {
  background-position: 0 6.6vw;
}

.part5-banner .swiper-slide-active .part5-font {
  transform: translate3d(0, -2vw, 0);
}

.part5-banner .swiper-slide-active .part5-name {
  color: #d61318;
}

.part5-banner .swiper-slide-active .part5-p {
  color: #000;
}

.part5-banner .swiper-slide-active .part5-li-img i {
  opacity: 0;
  transform: translate3d(0, -100%, 0);
}

.part5-banner .swiper-slide-active .part5-li-img span {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.part5-info {
  position: absolute;
  right: 6vw;
  top: 10vw;
}
.part5-info img {
  width: 10vw;
}