.header .off { display: none; }

.header--off .header-right .nav .nav-item { color: #fff; }

.header--off .off { display: block; }

.header--off .on { display: none; }

.header:hover .off { display: none; }
.header:hover .on { display: block; }
.header:hover .header-right .nav .nav-item { color: #474747; }

.index-banner { height: 900px; top: 0; width: 100%; overflow: hidden; }

.index-banner .banner { height: 100%; }

.index-banner .banner .banner-content { position: absolute; line-height: 1.6; }

.index-banner .banner .banner-content .animated:nth-child(1) { animation-delay: 0.3s; }

.index-banner .banner .banner-content .animated:nth-child(2) { animation-delay: 0.6s; }

.index-banner .banner .banner-content .animated:nth-child(3) { animation-delay: 0.8s; }

.index-banner .banner .banner-content .animated:nth-child(4) { animation-delay: 1s; }

.index-banner .banner .swiper-slide .banner-content { left: 15%; top: 30%; color: #fff; }

.index-banner .banner .swiper-slide .banner-content > :nth-child(1) { font-size: 24px; }

.index-banner .banner .swiper-slide .banner-content > :nth-child(2) { font-size: 40px; font-weight: bold; }

.index-banner .banner .swiper-slide .banner-content > :nth-child(3) { font-size: 18px; }

.index-banner .banner .swiper-slide .banner-content > :nth-child(4) { display: block; margin-top: 150px; text-decoration: underline; }

.index-banner .banner .swiper-slide-active .banner-content { display: block; }

.title { text-align: center; margin-bottom: 50px; }

.title .title__zh { font-size: 30px; font-weight: bold; }

.title .title__sub { margin: 20px 0 0; color: #212121; line-height: 1.8; }

.title .title__sub::after { content: ""; display: block; height: 4px; background-color: #212121; width: 50px; margin: 30px auto; }

.title .title__small { margin: 10px 0; }

.news { display: flex; margin-top: -50px; position: relative; z-index: 2; background-color: #fff; }

.news .news-left { height: 100%; line-height: 50px; text-align: center; padding: 0 30px; color: #fff; background-color: #da0c11; }

.news .news-swiper { flex: 1; height: 50px; }

.news .news-swiper .swiper-slide { line-height: 50px; height: 50px; padding: 0 110px 0 20px; position: relative; }

.news .news-swiper .news-time { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); color: #878787; }

.about { padding: 80px 0; }

.about .about-list { display: flex; justify-content: space-around; flex-wrap: wrap; }

.about .about-list .about-item { text-align: center; border-right: 1px solid #eee; width: 25%; }

.about .about-list .about-item:last-child { border-right: none; }

.about .about-list .about-item .about-item__title { font-size: 18px; font-weight: bold; margin: 15px 0 4px; }

.about .about-list .about-item .about-item__title .about-item__title--light { color: #da0c11; }

.about .about-list .about-item .about-item__title--en { font-size: 12px; }

.idea { padding: 60px 0; background: url(../images/laboratory05.jpg); }

.idea .idea-content { display: flex; }

.idea .idea-content .idea-left { width: 40%; }

.idea .idea-content .idea-left .idea-title { font-size: 26px; font-weight: bold; margin-bottom: 30px; }

.idea .idea-content .idea-left .idea-desc { line-height: 1.8; }

.idea .idea-content .idea-left .idea-desc .idea-desc--light { color: #da0c11; font-size: 20px; font-weight: bold; }

.idea .idea-content .idea-left .idea-title--underline { color: #da0c11; padding: 10px 0; border-bottom: 1px solid #da0c11; margin: 80px 0; font-size: 16px; display: inline-block; }

.idea .idea-content .idea-swiper { padding-bottom: 80px; width: 60%; }

.idea .idea-content .idea-swiper .v-flex::after { padding-bottom: 145%; }

.idea .idea-content .idea-swiper .swiper-slide { background-size: cover; background-repeat: no-repeat; display: flex; align-items: flex-end; }

.idea .idea-content .idea-swiper .swiper-slide .idea-content { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 16px 20px; }

.idea .idea-content .idea-swiper .swiper-slide:first-child .idea-content { color: #fff; }

.idea .idea-content .idea-swiper .swiper-slide .idea-content .idea-content__title { font-family: "Arial"; font-size: 30px; }

.idea .idea-content .idea-swiper .swiper-slide .idea-content .idea-content__title--zh { font-size: 22px; }

.idea .idea-content .idea-swiper .swiper-slide .idea-content .idea-content__icon { display: none; width: 36px; height: 36px; border-radius: 50%; border: 1px solid #fff; }

.idea .idea-content .idea-swiper .idea-swiper-button { border-radius: 50%; background-color: #fff; width: 36px; height: 36px; position: absolute; margin: 0 auto; z-index: 2; bottom: 10px; left: 40%; cursor: pointer; width: 50px; height: 50px; margin-left: 20px; background-repeat: no-repeat; background-position: center; background-size: auto 20px; border-radius: 50%; box-shadow: 0 0 20px 0px #eee; }

.idea .idea-content .idea-swiper .idea-swiper-button.idea-swiper-button--prev { left: 33%; background-image: url(../images/left.png); }

.idea .idea-content .idea-swiper .idea-swiper-button.idea-swiper-button--prev:hover { background-color: #da0c11; background-image: url(../images/left-line.png); }

.idea .idea-content .idea-swiper .idea-swiper-button.idea-swiper-button--next { background-image: url(../images/right.png); }

.idea .idea-content .idea-swiper .idea-swiper-button.idea-swiper-button--next:hover { background-color: #da0c11; background-image: url(../images/right-line.png); }

.cases-swiper .pagination { position: absolute; bottom: 50px; left: 0; z-index: 2; width: 100%; }

.cases-swiper .pagination .pagination-button { background-color: #fff; }

.cases-swiper .pagination .pagination-button:hover { background-color: #da0c11; }

.cases { background: url(../images/laboratory12.jpg) no-repeat; background-size: cover; }

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

.cases .cases-content .cases-image { width: 60%; }

.cases .cases-content .cases-right { width: 40%; text-align: right; }

.cases .cases-content .cases-right .cases-title { font-size: 26px; font-weight: bold; margin-bottom: 30px; }

.cases .cases-content .cases-right .cases-desc { line-height: 1.8; }

.cases .cases-content .cases-right .cases-desc .cases-desc--light { color: #da0c11; font-size: 20px; font-weight: bold; }

.cases .cases-content .cases-right .cases-title--underline { color: #da0c11; padding: 10px 0; border-bottom: 1px solid #da0c11; margin: 80px 0; font-size: 16px; display: inline-block; }

.cases .cases-content .cases-right .cases-bottom { display: flex; justify-content: flex-end; margin-top: 80px; }

.product { padding: 80px 0; }

.product .product-list .product-item { width: 23%; margin-left: 2.6%; margin-bottom: 2.6%; float: left; background-color: #eeeeee; border-radius: 10px; }

.product .product-list .product-item.v-flex::after { padding-bottom: 67.5%; }

.product .product-list .product-item:nth-child(1) { margin-left: 0; }

.product .product-list .product-item:nth-child(1)::after, .product .product-list .product-item:nth-child(2)::after { padding-bottom: 143.75%; }

.product .product-list .product-item .product-item__cover { position: absolute; height: 100%; width: 100%; object-fit: contain; transition: all 0.5s; }

.product .product-list .product-item .product-item__title { position: absolute; bottom: 0; left: 0; width: 100%; height: 50px; line-height: 50px; background-color: rgba(255, 255, 255, 0.8); text-align: center; }

.product .product-list .product-item:hover .product-item__cover { transform: scale(1.2); }

@media (max-width: 768px) { .index-banner { padding-top: 50px; height: 600px; }
  .index-banner .banner .swiper-slide { background-position: center !important; }
  .index-banner .banner .swiper-slide .banner-content { right: 0; left: auto; top: 50px; padding: 0 20px; text-align: center; }
  .index-banner .banner .swiper-slide .banner-content > :nth-child(1) { font-size: 18px; }
  .index-banner .banner .swiper-slide .banner-content > :nth-child(2) { font-size: 30px; }
  .index-banner .banner .swiper-slide .banner-content > :nth-child(3) { font-size: 12px; }
  .index-banner .banner .swiper-slide .banner-content > :nth-child(4) { color: #8a8484; }
  .news { padding: 0; }
  .news .news-left { display: none; }
  .news .news-swiper { background-color: #f8f8f8; }
  .news .news-swiper .swiper-slide span { color: #da0c11; font-weight: bold; margin-right: 6px; }
  .news .news-swiper .swiper-slide .news-time { color: #878787; }
  .about { padding: 30px 0; }
  .about .about-list .about-item { width: 50%; border: none; padding: 16px; }
  .about .about-list .about-item:nth-child(1), .about .about-list .about-item:nth-child(2) { border-bottom: 1px solid #eee; }
  .about .about-list .about-item:nth-child(2n) { border-left: 1px solid #eee; }
  .about .about-list .about-item .about-item__icon { height: 60px; }
  .about .about-list .about-item .about-item__title { font-size: 14px; }
  .about .about-list .about-item .about-item__title--en { font-size: 10px; }
  .idea { padding: 30px 0; }
  .idea .idea-content { display: block; }
  .idea .idea-content .idea-left { width: 100%; text-align: center; }
  .idea .idea-content .idea-left .idea-title { font-size: 18px; margin-bottom: 10px; }
  .idea .idea-content .idea-left .idea-desc { line-height: 1.6; }
  .idea .idea-content .idea-left .idea-desc .idea-desc--light { font-size: 14px; }
  .idea .idea-content .idea-left .idea-title--underline { display: none; }
  .idea .idea-content .idea-left .idea-more { margin: 20px auto; }
  .idea .idea-content .idea-swiper { width: 100%; padding: 0; padding-bottom: 80px; }
  .idea .idea-content .idea-swiper .idea-swiper-button { width: 40px; height: 40px; }
  .idea .idea-content .idea-swiper .idea-swiper-button.idea-swiper-button--next { left: 50%; }
  .idea .idea-content .idea-swiper .swiper-slide .idea-content .idea-content__title { font-size: 16px; }
  .idea .idea-content .idea-swiper .swiper-slide .idea-content .idea-content__title--zh { font-size: 14px; }
  .idea .idea-content .idea-swiper .swiper-slide .idea-content .idea-content__icon { width: 26px; height: 26px; }
  .cases { padding-bottom: 80px; }
  .cases .cases-content { flex-direction: column; padding: 20px 10px; }
  .cases .cases-content .cases-image { width: 100%; order: 2; }
  .cases .cases-content .cases-right { width: 100%; text-align: center; }
  .cases .cases-content .cases-right .cases-title { font-size: 18px; margin-bottom: 15px; }
  .cases .cases-content .cases-right .cases-desc { line-height: 1.6; }
  .cases .cases-content .cases-right .cases-desc .cases-desc--light { font-size: 14px; }
  .cases .cases-content .cases-right .cases-bottom { margin-top: 20px; justify-content: center; }
  .cases-swiper .pagination { bottom: 15px; }
  .product { padding: 30px 0; }
  .product .product-list .product-item { width: 48%; margin-left: 0; margin-bottom: 4%; }
  .product .product-list .product-item:nth-child(2n) { margin-left: 4%; }
  .product .product-list .product-item .product-item__title { height: 36px; line-height: 36px; } }