@charset "utf-8";
.clearfix {
  zoom: 1;
}
.clearfix:after {
  content: " ";
  display: block;
  font-size: 0;
  height: 0;
  clear: both;
  visibility: hidden;
}
.mzsm{padding:30px 0 0 0; font-size:12px; color:#999; display:nones;}

.marginauto {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
.linenowrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.flexAuto {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.flexCetween {
  display: flex;
  display: -webkit-flex;
  display: -moz-flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.flexAlign {
  display: flex;
  display: -webkit-flex;
  display: -moz-flex;
  align-items: center;
  -webkit-align-items: center;
}
.header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 99;
}
.header:hover .header-wrap,
.header.scroll .header-wrap {
  background: #fff;
}
.header:hover .logo a img.show,
.header.scroll .logo a img.show {
  opacity: 0;
}
.header:hover .logo a img.hide,
.header.scroll .logo a img.hide {
  opacity: 1;
}
.header:hover .logo a strong,
.header.scroll .logo a strong {
  color: #202020;
}
.header:hover .logo a strong:before,
.header.scroll .logo a strong:before {
  background: linear-gradient(180deg, rgba(230, 33, 41, 0) 0%, #E62129 49.58%, rgba(230, 33, 41, 0) 100%);
}
.header:hover .navs > li > a,
.header.scroll .navs > li > a {
  color: #202020;
}
.header-wrap {
  padding: 0 0.1rem 0 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 1rem;
  background: rgba(0, 0, 0, 0.3);
  transition: 0.4s;
}
.logo a {
  position: relative;
  display: flex;
  align-items: center;
  line-height: 1;
}
.logo a img {
  width: auto;
  height: 0.45rem;
  transition: 0.3s;
}
.logo a img.hide {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.logo a strong {
  position: relative;
  padding-left: 0.2rem;
  color: #FFFFFF;
  font-size: 0.14rem;
  transition: 0.3s;
}
.logo a strong:before {
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -0.18rem;
  content: "";
  width: 1px;
  height: 0.36rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.58%, rgba(255, 255, 255, 0) 100%);
  transition: 0.28s;
}
.navs {
  display: flex;
}
.navs > li {
  padding: 0 0.41rem;
  position: relative;
}
.navs > li:hover > a,
.navs > li.active > a {
  font-weight: bold;
}
.navs > li:hover > a:before,
.navs > li.active > a:before {
  opacity: 1;
  visibility: visible;
}
.navs > li:hover .navs-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: visible;
  clip-path: inset(0 0 0 0);
}
.navs > li > a {
  position: relative;
  display: inline-block;
  color: #FFFFFF;
  font-size: 0.16rem;
  line-height: 1rem;
}
.navs > li > a:before {
  position: absolute;
  left: 50%;
  margin-left: -0.075rem;
  bottom: 0;
  content: "";
  border-left: 0.075rem solid transparent;
  border-right: 0.075rem solid transparent;
  border-bottom: 0.06rem solid #E62129;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
}
.navs > li > a > i {
  font-style: normal;
  color: #202020;
  display: none;
  transition: 0.3s;
}
.navs > li:nth-child(n+5) .navs-menu {
  left: auto;
  transform: translateX(0);
  right: -1.5rem;
}
.navs-menu {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  z-index: 3;
  padding: 0.38rem;
  display: flex;
  align-items: flex-start;
  padding-right: 0.48rem;
  background: #fff;
  border-radius: 0 0 0.12rem 0.12rem;
  opacity: 0;
  visibility: hidden;
  clip-path: inset(0 0 100% 0);
  transition: 0.4s;
  pointer-events: none;
}
.navs-menu-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.4rem 0;
  width: 4.67rem;
}
.navs-menu-list li a {
  display: inline-block;
  position: relative;
  padding-left: 0.22rem;
  color: #202020;
  font-size: 14px;
  line-height: 1;
  font-weight: lighter;
}
.navs-menu-list li a:hover {
  color: #E62129;
}
.navs-menu-list li a:hover:before {
  background: #E62129;
}
.navs-menu-list li a:before {
  position: absolute; display: none;
  left: 0;
  top: 50%;
  margin-top: -1px;
  content: "";
  width: 2px;
  height: 2px;
  background: #666666;
  transition: 0.28s;
}
.navs-imgs {
  width: 2.8rem;
}
.navs-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 59.28%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.navs-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.banner {
  position: relative;
  overflow: hidden;
}
.banner .swiper-pagination {
  position: absolute;
  left: 0;
  bottom: 0.5rem;
  z-index: 10;
}
.banner .swiper-pagination .swiper-pagination-bullet {
  position: relative;
  margin: 0 5px;
  width: 0.26rem;
  height: 0.26rem;
  opacity: 1;
  background: transparent;
}
.banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:after {
  opacity: 1;
  visibility: visible;
}
.banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before {
  background: #E62129;
}
.banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active .path-loop {
  opacity: 1;
}
.banner .swiper-pagination .swiper-pagination-bullet:before {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -0.05rem;
  margin-top: -0.05rem;
  content: "";
  width: 0.1rem;
  height: 0.1rem;
  border-radius: 50%;
  background: #fff;
}
.banner .swiper-pagination .swiper-pagination-bullet:after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: "";
  box-sizing: border-box;
  border-radius: 50%;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
}
.banner-slide {
  overflow: hidden;
}
.banner-slide.swiper-slide-active .btext img {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0.5s;
}
.banner-slide a {
  display: block;
}
.banner-slide figure {
  position: relative;
  display: block;
  padding-bottom: 100vh;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.banner-slide figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.btext {
  position: absolute;
  left: 50%;
  margin-left: -800px;
  bottom: 1.5rem;
  z-index: 3;
}
.btext img {
  display: inline-block;
  width: auto;
  height: 1.79rem;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
  transform: translateY(-0.4rem);
}
.ui-loop {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.ui-loop svg {
  position: absolute;
  left: 0;
  top: 0;
}
.ui-loop svg .path-loop-bg,
.ui-loop svg .path-loop {
  fill: none;
  width: 100%;
  height: 100%;
  stroke: #E62129;
  stroke-miterlimit: 10;
  stroke-width: 3;
  opacity: 0;
  transition: opacity 0.3s;
}
.banner-mouse {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3.06rem;
  height: 1rem;
  background: #E62129;
}
.banner-mouse span {
  display: block;
  width: 0.2rem;
  height: 0.2rem;
  background: url(https://www.sunb168.com/static/images/mouse.png) center no-repeat;
  background-size: cover;
  animation: mouseDonw 1s infinite linear alternate;
}
@keyframes mouseDonw {
  0% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(10px);
    opacity: 0.1;
  }
}
.since {
  padding: 1.18rem 0 1rem;
  background-position: center top;
  background-size: 100% auto;
  background-repeat: no-repeat;
}
.since-top {
  text-align: center;
}
.since-top img {
  display: inline-block;
  width: auto;
  height: 5.2rem;
}
.since-imgs {
  position: relative;
  display: inline-block;
}
.since-imgs:hover img.hide {
  opacity: 1;
}
.since-imgs:hover img.show {
  opacity: 0;
}
.since-imgs img {
  transition: 0.5s;
}
.since-imgs img.hide {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  opacity: 0;
}
.since-word {
  margin-top: -1rem;
}
.since-word strong {
  display: block;
  color: #000;
  line-height: 1.2;
  font-size: 0.64rem;
  font-weight: bold;
  font-family: "ariblk";
}
.since-word strong b {
  color: rgba(0, 0, 0, 0.4);
}
.since-word strong span,
.since-word strong b {
  display: inline-block;
}
.since-video {
  position: relative;
  margin-top: 0.9rem;
}
.since-video figure {
  position: relative;
  display: block;
  padding-bottom: 56.125%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.since-video figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.since-video figure video {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
  display: none;
}
.since-video span {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  margin-left: -0.43rem;
  margin-top: -0.43rem;
  line-height: 1;
  color: #fff;
  font-size: 0.86rem;
  cursor: pointer;
}
.venue {
  position: relative;
  z-index: 3;
  padding: 2.7rem 0 0.58rem;
}
.venue-bg {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 3.9rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.venue-wrap {
  position: relative;
  padding: 0.5rem 1.62rem 0.6rem 1.7rem;
  background: #201455;
  box-sizing: border-box;
}
.venue-swiper {
  position: relative;
}
.venue-swiper .swiper-pagination {
  left: 0;
  bottom: 0;
  width: auto;
  color: #FFFFFF;
  font-size: 0.16rem;
  line-height: 1;
}
.venue-slide {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.venue-title small {
  display: block;
  margin-bottom: 0.14rem;
  color: #fff;
  font-size: 0.58rem;
  line-height: 1;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
}
.venue-title strong {
  display: block;
  color: #fff;
  font-size: 0.24rem;
  line-height: 1;
}
.venue-info {
  flex: 1;
  margin-left: 1rem;
  width: 0;
}
.venue-text {
  margin-top: 0.1rem;
}
.venue-text p {
  margin-bottom: 0.3rem;
  color: #FFFFFF;
  font-size: 0.14rem;
  line-height: 1.2;
}
.venue-text p:last-child {
  margin-bottom: 0;
}
.venue-btns {
  margin-top: 0.72rem;
  display: flex;
}
.venue-btns a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-right: 0.24rem;
  width: 1.36rem;
  height: 0.38rem;
  border-radius: 0.19rem;
  background: #fff;
  color: #201455;
  font-size: 0.16rem;
  font-weight: bold;
}
.venue-btns a:hover {
  background: #E62129;
  color: #fff !important;
}
.venue-btns a:last-child {
  color: #E62129;
}
.venue-prev {
  position: absolute;
  top: 50%;
  margin-top: -0.21rem;
  z-index: 3;
  text-align: center;
  width: 0.32rem;
  height: 0.42rem;
  line-height: 0.42rem;
  background: #201455;
  color: #fff;
  font-size: 0.18rem;
  cursor: pointer;
  transition: 0.35s;
}
.venue-prev:hover {
  background: #E62129;
}
.venue-prev.prev {
  left: -0.52rem;
}
.venue-prev.next {
  right: -0.52rem;
}
.management-box {
  padding: 1rem 0 0.8rem;
  background: #F7F7F7;
}
.common-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 0.48rem;
}
.common-top .common-titles {
  text-align: left;
}
.common-btns {
  margin-bottom: 0.46rem;
}
.common-btns a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.18rem;
  height: 0.4rem;
  color: #202020;
  font-size: 0.16rem;
  border: 1px solid #202020;
  transition: 0.3s;
}
.common-btns a:hover {
  background: #E62129;
  border-color: #E62129;
  color: #fff;
}
.common-titles small {
  display: inline-block;
  position: relative;
  margin-bottom: 0.24rem;
  color: #000;
  font-family: "ariblk";
  line-height: 0.9;
  font-size: 0.5rem;
}
.common-titles strong {
  display: block;
  margin-bottom: 0.2rem;
  line-height: 1;
  font-weight: normal;
}
.common-titles strong img {
  width: auto;
  height: 0.55rem;
}
.common-titles p {
  color: #333333;
  font-size: 0.16rem;
}
.common-names {
  position: absolute;
  left: 100%;
  bottom: 0;
  margin-left: 0.3rem;
  width: 0.5rem;
  height: 0.5rem;
  z-index: 3;
}
.common-names:hover:before {
  transform: scale(1.6);
  opacity: 0;
}
.common-names:hover:after {
  opacity: 1;
  transform: scale(1);
}
.common-names:before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  content: "";
  width: 100%;
  height: 100%;
  border: 1px solid #000;
  border-radius: 50%;
  box-sizing: border-box;
  transition: 0.6s;
}
.common-names:after {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -2;
  content: "";
  width: 100%;
  height: 100%;
  border: 1px solid #000;
  border-radius: 50%;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.1);
  opacity: 0;
  transform: scale(0);
  transition: 0.6s;
}
.common-names img {
  width: 100%;
  height: auto;
}
.management-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.28rem 0;
}
.management-list li {
  width: 33.33%;
}
.management-list li:hover figure img.show {
  opacity: 0;
}
.management-list li:hover figure img.hide {
  opacity: 1;
}
.management-list li:hover .management-info strong {
  color: #E62129;
}
.management-list li:hover .management-info span {
  color: #E62129;
  border-color: #E62129;
}
.management-list li figure {
  position: relative;
  display: block;
  padding-bottom: 75.42%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.management-list li figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.management-list li figure img {
  transition: 0.3s ease-in-out;
}
.management-list li figure img.hide {
  opacity: 0;
}
.management-info {
  padding: 0.16rem 0.34rem;
  position: relative;
  padding-right: 0.72rem;
  background: #fff;
}
.management-info strong {
  display: block;
  margin-bottom: 0.12rem;
  color: #202020;
  font-size: 0.22rem;
  font-weight: normal;
  line-height: 1;
  transition: 0.4s;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.management-info p {
  color: #666666;
  font-size: 0.14rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.management-info span {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0.36rem;
  top: 50%;
  margin-top: -0.18rem;
  width: 0.34rem;
  height: 0.34rem;
  border-radius: 50%;
  border: 1px dashed #666666;
  color: #666666;
  font-size: 0.12rem;
  transition: 0.4s;
}
.more-cases {
  width: 100%;
  height: 100%;
  background: #201455;
}
.more-cases a {
  display: flex;
  align-items: center;
  padding: 0 0.66rem;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
}
.case-numble {
  margin-bottom: 1.1rem;
}
.case-numble b {
  display: block;
  line-height: 1;
  color: #fff;
  font-size: 0.48rem;
}
.case-numble p {
  margin-top: 0.22rem;
  color: #fff;
  line-height: 1;
  font-size: 0.16rem;
}
.case-btns {
  display: flex;
  align-items: center;
}
.case-btns:hover b {
  transform: scale(1.1);
}
.case-btns:hover b:after {
  width: 0.5rem;
  transform: scale(1);
}
.case-btns span {
  display: block;
  color: #fff;
  font-size: 0.16rem;
  line-height: 1;
}
.case-btns b {
  display: inline-block;
  position: relative;
  margin-left: 0.63rem;
  width: 0.24rem;
  height: 0.24rem;
  border: 1px solid #fff;
  border-radius: 50%;
  transition: 0.3s;
}
.case-btns b:before {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -0.06rem;
  margin-top: -0.06rem;
  content: "";
  width: 0.12rem;
  height: 0.12rem;
  background: #fff;
  border-radius: 50%;
}
.case-btns b:after {
  position: absolute;
  right: 50%;
  top: 50%;
  margin-top: -1px;
  content: "";
  width: 0.4rem;
  height: 1px;
  background: #fff;
  transition: 0.4s;
}
.constructes {
  padding: 1rem 0 0.8rem;
}
.management-list1 {
  gap: 0.28rem 0;
}
.management-list1 li {
  margin-right: 1.25%;
  width: 32.5%;
}
.management-list1 li:nth-child(3n+3) {
  margin-right: 0;
}
.management-list1 li .management-info {
  box-shadow: 0px 4px 20px 0px rgba(101, 101, 101, 0.08);
}
.event {
  padding: 1rem 0 0.9rem;
  background-color: #FBFBFB;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.event-block {
  display: flex;
  justify-content: space-between;
}
.event-infos {
  width: 49.125%;
}
.event-infos:hover figure img.show {
  opacity: 0;
}
.event-infos:hover figure img.hide {
  opacity: 1;
}
.event-infos:hover .management-info strong {
  color: #E62129;
}
.event-infos figure {
  position: relative;
  display: block;
  padding-bottom: 63.61%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.event-infos figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.event-infos figure img {
  transition: 0.3s ease-in-out;
}
.event-infos figure img.hide {
  opacity: 0;
}
.event-infos .management-info {
  padding: 0.39rem 0.34rem 0;
  height: 1.4rem;
  box-sizing: border-box;
}
.event-infos .management-info strong {
  font-weight: bold;
}
.event-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.28rem;
  flex: 1;
  margin-left: 0.3rem;
  width: 0;
}
.event-list li:hover figure img.show {
  opacity: 0;
}
.event-list li:hover figure img.hide {
  opacity: 1;
}
.event-list li:hover strong {
  color: #E62129;
}
.event-list li figure {
  position: relative;
  display: block;
  padding-bottom: 62.433%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.event-list li figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.event-list li figure img {
  transition: 0.3s ease-in-out;
}
.event-list li figure img.hide {
  opacity: 0;
}
.event-list li strong {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0.7rem;
  background: #fff;
  color: #202020;
  font-size: 0.2rem;
  font-weight: normal;
  text-align: center;
  transition: 0.3s;
}
.advantages {
  padding: 0.64rem 0 0.72rem;
}
.advantages-list {
  display: flex;
  overflow: hidden;
}
.advantages-list li {
  margin-right: 0.1rem;
  flex: 1;
  position: relative;
  overflow: hidden;
  transition: 0.5s;
}
.advantages-list li figure {
  display: block;
  line-height: 1;
  height: 4.2rem;
}
.advantages-list li figure img {
  display: block;
  position: relative;
  left: 50%;
  width: auto;
  height: 100%;
  transform: translateX(-50%);
}
.advantages-list li.active {
  flex: 1.777;
}
.advantages-list li.active .advantages-default {
  opacity: 0;
  visibility: hidden;
}
.advantages-list li.active .advantage-pop {
  opacity: 1;
  visibility: visible;
}

.advantages-list li:hover {
  flex: 1.777;
}
.advantages-list li:hover .advantages-default {
  opacity: 0;
  visibility: hidden;
}
.advantages-list li:hover .advantage-pop {
  opacity: 1;
  visibility: visible;
}
.advantages-default {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  z-index: 3;
  width: 100%;
  height: 100%;
  background: url(https://www.sunb168.com/static/images/adbg.jpg) center no-repeat;
  background-size: cover;
  transition: 0.5s;
}
.advantage-wrs {
  box-sizing: border-box;
  padding: 0 0.4rem;
  width: 100%;
}
.advantage-wrs .icons {
  display: inline-block;
  width: auto;
  height: 0.36rem;
}
.advantage-wrs .arrow {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.34rem;
  height: 0.34rem;
  border: 1px dashed #202020;
  border-radius: 50%;
  color: #202020;
  font-size: 0.12rem;
}
.advantage-title {
  margin: 0.74rem 0 0.55rem;
}
.advantage-title strong {
  display: block;
  margin-bottom: 0.12rem;
  color: #202020;
  font-size: 0.26rem;
  line-height: 1;
  font-weight: normal;
}
.advantage-title small {
  display: block;
  color: #202020;
  font-size: 0.16rem;
  line-height: 1;
  font-weight: lighter;
}
.advantage-pop {
  position: absolute;
  left: 0;
  top: 0;
  box-sizing: border-box;
  padding: 0 0.4rem;
  width: 100%;
  height: 100%;
  z-index: 3;
  display: flex;
  justify-content: center;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
}
.advantage-pop .advantage-tops {
  width: 100%;
}
.advantage-pop .num {
  color: #fff;
  line-height: 1;
  font-size: 0.36rem;
  font-weight: 900;
  font-family: "Mont-HeavyDEMO";
}
.advantage-pop .icons {
  display: block;
  width: 0.36rem;
  height: auto;
}
.advantage-pop .advantage-title {
  margin-top: 0.28rem;
}
.advantage-pop .advantage-title strong,
.advantage-pop .advantage-title small {
  color: #fff;
}
.advantage-text {
  margin-bottom: 0.2rem;
  color: #FFFFFF;
  font-size: 0.16rem;
  height: 1.02rem;
}
.news-center {
  padding: 1rem 0 0.8rem;
  background: #F7F7F7;
}
.news-flex {
  display: flex;
  justify-content: space-between;
}
.news-infos {
  width: 42.5%;
}
.news-infos figure {
  position: relative;
  display: block;
  padding-bottom: 66.76%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.news-infos figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.news-infos figure img {
  transition: 0.68s;
}
.news-infos:hover figure img {
  transform: scale(1.06);
}
.news-infos:hover .news-down strong {
  color: #E62129;
}
.news-down {
  position: relative;
  padding: 0.38rem 0.24rem 0.24rem;
  background: #fff;
}
.news-down strong {
  display: block;
  margin-bottom: 0.26rem;
  color: #202020;
  font-size: 0.24rem;
  line-height: 1.1;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: 0.4s;
}
.news-down p {
  color: #8A8A8A;
  font-size: 0.16rem;
  line-height: 0.28rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.news-time {
  position: absolute;
  left: 0.24rem;
  top: -0.42rem;
  padding: 0.1rem 0;
  z-index: 3;
  width: 0.7rem;
  background: #E62129;
  text-align: center;
}
.news-time b {
  display: block;
  color: #fff;
  font-size: 0.24rem;
  font-family: "Roboto-Bold";
  font-weight: normal;
  line-height: 1;
}
.news-time time {
  display: block;
  margin-top: 0.1rem;
  line-height: 1;
  color: #FFFFFF;
  font-size: 14px;
  font-family: "Roboto-Regular";
}
.news-center-list {
  width: 54.375%;
  box-sizing: border-box;
  padding: 0 0.28rem;
  background: #fff;
}
.news-center-list li {
  margin-bottom: 0.18rem;
  border-bottom: 1px solid #EEEEEE;
}
.news-center-list li:last-child {
  margin-bottom: 0;
  border-bottom: none;
}
.news-center-list li a {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0.28rem 0;
}
.news-center-list li a:hover .news-center-in strong {
  color: #E62129;
}
.news-center-list li a:hover .news-center-imgs figure img {
  transform: scale(1.06);
}
.news-center-in {
  width: 55.28%;
}
.news-center-in strong {
  display: block;
  margin-bottom: 0.14rem;
  color: #202020;
  font-size: 0.2rem;
  font-weight: 700;
  line-height: 1;
  transition: 0.35s;
}
.news-center-in p {
  color: #999999;
  font-size: 0.16rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.news-center-in time {
  display: block;
  margin-top: 0.34rem;
  color: #999999;
  font-size: 0.16rem;
  line-height: 1;
}
.news-center-imgs {
  width: 2.1rem;
}
.news-center-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 66.6666%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.news-center-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.news-center-imgs figure img {
  transition: 0.58s;
}
.about-home {
  padding: 1.2rem 0 0.76rem;
  background-attachment: local;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.about-wraps {
  position: relative;
}
.about-wraps .common-top {
  position: absolute;
  left: 0;
  top: 0;
}
.into__row1 {
  padding-left: 50%;
}
.into__item a {
  display: flex;
  align-items: center;
  position: relative;
}
.into__item a:hover:before {
  opacity: 1;
  visibility: visible;
}
.into__item a:hover .into__imgs figure img {
  transform: scale(1.08);
}
.into__item a:before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  box-sizing: border-box;
  content: "";
  width: 100%;
  height: 100%;
  border: 0.04rem solid #E62129;
  transition: 0.4s;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.into__imgs {
  width: 50%;
}
.into__imgs figure {
  position: relative;
  display: block;
  padding-bottom: 77.57%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.into__imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.into__imgs figure img {
  transition: 0.7s;
}
.into__info {
  display: flex;
  justify-content: center;
  width: 50%;
}
.into__text {
  width: 2.1rem;
  text-align: center;
}
.into__text strong {
  display: block;
  position: relative;
  padding-bottom: 0.2rem;
  margin-bottom: 0.1rem;
  line-height: 1;
  color: #202020;
  font-size: 0.18rem;
}
.into__text strong:before {
  position: absolute;
  left: 50%;
  margin-left: -0.05rem;
  bottom: 0;
  content: "";
  width: 0.1rem;
  height: 1px;
  background: #202020;
}
.into__text p {
  color: #202020;
  font-size: 14px;
}
.into__row2 {
  display: flex;
}
.company-culture {
  width: 50%;
  background: #F7F7F7;
}
.company-culture a {
  padding: 0 0.36rem 0 0.38rem;
  box-sizing: border-box;
  height: 100%;
  align-items: center;
  background: #fff;
}
.company-culture a .into__imgs {
  width: 41.979%;
}
.company-culture a .into__imgs figure {
  border-radius: 0 0 0.2rem 0;
  overflow: hidden;
}
.company-culture a .into__info {
  width: 0;
  flex: 1;
}
.company-culture a .into__info .into__text {
  width: auto;
  text-align: left;
}
.company-culture a .into__info .into__text strong {
  color: #333333;
  text-align: center;
}
.company-culture a .into__info .into__text strong:before {
  background: #333333;
}
.company-culture a .into__info .into__text p {
  color: #333333;
  line-height: 2.4;
}
.company-image {
  width: 50%;
}
.company-image a {
  flex-direction: row-reverse;
}
.into__row3 {
  display: flex;
}
.into__gc {
  width: 4rem;
}
.into__gc .into__info {
  width: 3rem;
  max-width: 90%;
}
.into__gc .into__info .into__text {
  width: auto;
}
.into__gc a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
.into__list {
  flex: 1;
  background: #F7F7F7;
}
.into__list a {
  display: flex;
  justify-content: space-between;
  padding: 0.35rem;
}
.into__list a figure {
  display: block;
  width: 30.85%;
  line-height: 1;
  overflow: hidden;
}
.into__list a figure:hover img {
  transform: scale(1.08);
}
.into__list a figure img {
  display: block;
  width: 100%;
  height: auto;
  transition: 0.6s;
}
.consultate {
  padding: 0.18rem 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.consultate-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  padding: 0 1rem;
}
.consultate-lefts {
  display: flex;
  align-items: center;
}
.consultate-lefts strong {
  display: block;
  color: #fff;
  font-size: 0.32rem;
  font-weight: bold;
}
.line-tel {
  margin-left: 0.3rem;
  display: flex;
  align-items: center;
}
.line-tel span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  background: #E62129;
  color: #fff;
  font-size: 0.17rem;
}
.line-tel b {
  margin-left: 0.18rem;
  color: #fff;
  font-size: 0.22rem;
  font-family: "Mont-HeavyDEMO";
}
.line-tel a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-left: 0.32rem;
  width: 1.27rem;
  height: 0.46rem;
  border-radius: 0.23rem;
  background: #E62129;
  color: #fff;
  font-size: 0.16rem;
}
.consultate-fix {
  display: flex;
  justify-content: space-between;
  padding: 0.12rem;
  background: #FFFFFF;
  border-radius: 0.08rem;
}
.consultate-fix figure {
  display: block;
  line-height: 1;
  width: 0.8rem;
}
.consultate-fix figure img {
  display: block;
  width: 100%;
  height: auto;
}
.consultate-in {
  margin-left: 0.16rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.consultate-in strong {
  display: block;
  color: #202020;
  font-size: 0.14rem;
  line-height: 1.3;
  font-weight: normal;
}
.consultate-in p {
  margin-bottom: 0.05rem;
  color: #666666;
  font-size: 0.14rem;
  line-height: 1.2;
}
.partner-box {
  padding: 1rem 0 0.73rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.partner-flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: -1.2rem;
}
.partner-swiper {
  margin: 0;
  width: 46.5%;
}
.partner-slide:hover figure img {
  transform: scale(1.05);
}
.partner-slide figure {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0.84rem;
  background: #fff;
}
.partner-slide figure img {
  max-width: 80%;
  max-height: 80%;
  transition: 0.5s;
}
.parnter-btns {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.26rem;
  gap: 0.16rem;
}
.parnter-btns span {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 0.34rem;
  height: 0.34rem;
  border: 1px dashed #333333;
  border-radius: 50%;
  color: #333333;
  font-size: 0.12rem;
  transition: 0.4s;
  cursor: pointer;
}
.parnter-btns span:hover {
  border-color: #E62129;
  color: #E62129;
}
.parnter-imgs {
  width: 46.5%;
}
.parnter-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 72.58%;
  height: 0;
  overflow: hidden;
  line-height: 1;
  border-radius: 0.78rem 0 0 0;
}
.parnter-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.quotate {
  position: relative;
  z-index: 3;
  margin-bottom: -0.65rem;
  padding-top: 1rem;
}
.quotation-wrap {
  padding: 0.7rem 0.7rem 0.6rem;
  position: relative;
  z-index: 3;
  background: linear-gradient(90deg, #D10000 0%, #830000 100%);
  border-radius: 0.32rem 0 0.32rem 0;
}
.quotation-wrap:before {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: -1;
  content: "";
  width: 2.73rem;
  height: 100%;
  background: url(https://www.sunb168.com/static/images/logo2.png) right bottom no-repeat;
  background-size: auto 100%;
}
.quotate-tt {
  display: flex;
  align-items: flex-start;
}
.quotate-tt strong {
  display: inline-block;
  color: #fff;
  font-size: 0.32rem;
  line-height: 1.1;
}
.quotate-tt i {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-left: 0.05rem;
  top: -0.12rem;
  width: 0.26rem;
  height: 0.26rem;
  background: #fff;
  color: #E62129;
  font-size: 0.22rem;
  border-radius: 50%;
}
.quotate-form {
  margin-top: 0.58rem;
}
.quotate-form form {
  display: flex;
  align-items: center;
  gap: 0 0.2rem;
}
.quotate-form form .text {
  flex: 1;
  padding-left: 0.2rem;
  height: 0.44rem;
  background: #fff;
  border: none;
  color: #999999;
  font-size: 0.15rem;
  outline: none;
}
.quotate-form form .text:focus::-webkit-input-placeholder {
  opacity: 0;
}
.quotate-form form .sub {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 21.917%;
  height: 0.44rem;
  border: none;
  background: #E62129;
  color: #fff;
  font-size: 0.16rem;
  font-weight: 700;
  border-radius: 0.12rem 0 0.12rem 0;
  cursor: pointer;
  transition: 0.3s;
}
.quotate-form form .sub:hover {
  transform: translateY(-0.05rem);
}
.footer {
  padding: 1.12rem 0 0;
  background: rgba(0, 0, 0, 0.85);
}
.footer-wrap {
  margin: auto;
  width: 1400px;
}
.footer-tops {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding-bottom: 0.4rem;
}
.contact-tel {
  display: flex;
  align-items: flex-start;
}
.contact-tel b {
  display: inline-block;
  color: #fff;
  font-size: 0.26rem;
  font-weight: normal;
  line-height: 1;
}
.contact-ins {
  padding-top: 2px;
  margin-left: 0.16rem;
}
.contact-ins p {
  margin-bottom: 0.2rem;
  color: #fff;
  font-size: 0.16rem;
  line-height: 1.1;
}
.contact-ins span {
  display: block;
  line-height: 1;
  color: #fff;
  font-size: 0.3rem;
  font-weight: bold;
}
.contact-adress {
  margin-top: 0.7rem;
}
.contact-adress p {
  margin-bottom: 0.14rem;
  color: #fff;
  font-size: 0.14rem;
  line-height: 1.1;
}
.contact-adress p:last-child {
  margin-bottom: 0;
}
.footer-navs {
  display: flex;
  align-items: flex-start;
  gap: 0 0.88rem;
}
.footer-navs-item {
  display: block;
}
.footer-navs-item dt {
  display: block;
  margin-bottom: 0.4rem;
}
.footer-navs-item dt a {
  display: inline-block;
  line-height: 1;
  color: #FFFFFF;
  font-size: 0.18rem;
}
.footer-navs-item dt a:hover {
  color: #E62129;
}
.footer-navs-item dd {
  display: block;
}
.footer-navs-item dd p {
  margin-bottom: 0.14rem;
}
.footer-navs-item dd p:last-child {
  margin-bottom: 0;
}
.footer-navs-item dd p a {
  display: inline-block;
  color: #73747C;
  font-size: 0.14rem;
}
.footer-navs-item dd p a:hover {
  color: #fff;
}
.links {
  padding: 0.28rem 0;
  display: flex;
  align-items: flex-start;
  border-top: 1px solid rgba(176, 176, 176, 0.08);
}
.links span {
  display: inline-block;
  color: #8E8E8E;
  font-size: 0.14rem;
  line-height: 1.4;
}
.link-list {
  flex: 1;
  width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.06rem;
}
.link-list li a {
  display: inline-block;
  color: #8E8E8E;
  font-size: 0.14rem;
  line-height: 1.4;
}
.link-list li a:hover {
  color: #fff;
}
.footer-copy {
  padding: 0.28rem 0;
  border-top: 1px solid rgba(176, 176, 176, 0.08);
  display: flex;
  justify-content: space-between;
}
.footer-copy p {
  color: #8E8E8E;
  font-size: 0.14rem;
  line-height: 1.4;
}
.footer-copy p a {
  color: #8E8E8E;
}
.footer-copy p a:hover {
  color: #fff;
}
.flex-navs {
  position: fixed;
  right: 0.4rem;
  top: 50%;
  transform: translateX(1rem) translateY(-50%);
  opacity: 0;
  visibility: hidden;
  z-index: 29;
  width: 0.7rem;
  transition: 0.78s;
}
.flex-navs.show {
  opacity: 1;
  visibility: visible;
  transform: translateX(0) translateY(-50%);
}
.flex-navs-list {
  padding: 0.16rem 0.1rem;
  background: #fff;
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);
  border-radius: 0.35rem;
}
.flex-navs-list li {
  position: relative;
  padding: 0.04rem 0 0.12rem;
}
.flex-navs-list li:last-child {
  padding-bottom: 0;
}
.flex-navs-list li:last-child:before {
  display: none;
}
.flex-navs-list li:hover > a {
  background: #E62129;
  color: #fff;
}
.flex-navs-list li:hover .flex-pops {
  opacity: 1;
  visibility: visible;
  pointer-events: visible;
}
.flex-navs-list li:hover .flex-shabox {
  transform: translateX(0);
}
.flex-navs-list li:before {
  position: absolute;
  left: 50%;
  margin-left: -0.17rem;
  bottom: 0;
  content: "";
  width: 0.34rem;
  height: 1px;
  background: #E6E6E6;
}
.flex-navs-list li > a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 0.5rem;
  height: 0.5rem;
  color: #333333;
  font-size: 0.2rem;
  border-radius: 50%;
}
.flex-pops {
  position: absolute;
  right: 100%;
  top: 50%;
  transform: translateY(-50%);
  padding-right: 0.3rem;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: 0.4s;
}
.flex-shabox {
  background: #fff;
  border-radius: 0.12rem;
  box-shadow: 0px 0.04rem 0.2rem rgba(101, 101, 101, 0.08);
  transform: translateX(-0.3rem);
  transition: 0.4s;
}
.flex-world {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.46rem;
  height: 0.66rem;
  color: #000000;
  font-size: 0.14rem;
}
.flex-eq {
  display: flex;
  align-items: center;
  padding: 0.18rem 0.22rem;
}
.flex-eq figure {
  display: block;
  line-height: 1;
  width: 1.4rem;
}
.flex-eq figure img {
  width: 100%;
  height: auto;
}
.flex-infos {
  flex: 1;
  margin-left: 0.12rem;
  white-space: nowrap;
}
.flex-infos strong {
  display: block;
  margin-bottom: 0.12rem;
  color: #333333;
  font-size: 0.16rem;
  line-height: 1.1;
  font-weight: normal;
}
.flex-infos p {
  color: #666666;
  font-size: 0.14rem;
}
.flex-scroll {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.12rem;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
  height: 0.7rem;
  border-radius: 50%;
  cursor: pointer;
  background: #fff;
  transition: 0.35s;
}
.flex-scroll:hover {
  background: #E62129;
}
.flex-scroll:hover span {
  color: #fff;
}
.flex-scroll span {
  display: inline-block;
  color: #333333;
  font-size: 0.2rem;
  transition: 0.35s;
}
.pbanner {
  position: relative;
  overflow: hidden;
}
.pbanner figure {
  position: relative;
  display: block;
  padding-bottom: 36.979%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.pbanner figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.posite {
  position: relative;
  box-shadow: 0px 4px 0.2rem rgba(101, 101, 101, 0.08);
  background: #fff;
}
.posite-wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  height: 0.86rem;
}
.posite-wrap i {
  display: inline-block;
  margin-right: 0.2rem;
  line-height: 1;
  font-style: normal;
  color: #2C2C2C;
  font-size: 0.23rem;
}
.posite-wrap a,
.posite-wrap span,
.posite-wrap b {
  display: inline-block;
  font-weight: normal;
  color: #333333;
  font-size: 0.18rem;
}
.posite-wrap a:hover {
  color: #E62129;
}
.introduct-box {
  padding: 1rem 0;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
}
.culture-titles strong {
  display: block;
  line-height: 1.2;
  color: #202020;
  font-size: 0.4rem;
}
.culture-titles strong b {
  color: #E62129;
}
.culture-titles p {
  margin-top: 0.18rem;
  color: #888888;
  font-size: 0.18rem;
  line-height: 1.2;
}
.introduct-text {
  margin-top: 0.65rem;
  color: #202020;
  font-size: 0.18rem;
  line-height: 2.3;
}
.introduct-data {
  display: flex;
  margin: 0.85rem 0;
}
.introduct-data li {
  flex: 1;
  position: relative;
  text-align: center;
}
.introduct-data li:last-child:before {
  display: none;
}
.introduct-data li:before {
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -0.34rem;
  content: "";
  width: 1px;
  height: 0.68rem;
  background: #E4E4E4;
}
.introduct-data li strong {
  display: block;
  line-height: 1;
  color: #E62129;
  font-size: 0.44rem;
  font-weight: normal;
  font-family: "Roboto-Bold";
}
.introduct-data li strong b {
  font-weight: normal;
}
.introduct-data li p {
  margin-top: 0.15rem;
  color: #202020;
  font-size: 0.2rem;
  line-height: 1;
}
.introduct-imgs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.4rem;
}
.introduct-imgs li:hover figure img {
  transform: scale(1.06);
}
.introduct-imgs li figure {
  position: relative;
  display: block;
  padding-bottom: 45.64%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.introduct-imgs li figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.introduct-imgs li figure img {
  transition: 0.68s;
}
.history-box {
  position: relative;
  padding: 1rem 0 1.5rem;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
}
.history-wrap {
  position: relative;
}
.history-bgs {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 4;
  width: 100%;
  line-height: 1;
}
.history-bgs img {
  display: block;
  width: 100%;
  height: auto;
}
.history-slide {
  position: relative;
  display: flex;
  height: auto;
  box-sizing: border-box;
  width: 20%;
  min-height: 4.28rem;
  padding-top: 1.88rem;
  transition: 0.58s;
}
.history-slide.swiper-slide-active {
  padding-top: 1.88rem;
}
.history-slide.swiper-slide-active + div {
  padding-top: 1.48rem;
}
.history-slide.swiper-slide-active + div + div {
  padding-top: 0.88rem;
}
.history-slide.swiper-slide-active + div + div + div {
  padding-top: 0.48rem;
}
.history-slide.swiper-slide-active + div + div + div + div {
  padding-top: 0;
}
.history-line {
  position: relative;
  z-index: 2;
}
.history-line:before {
  position: absolute;
  left: 50%;
  top: 0.32rem;
  bottom: 0;
  z-index: -1;
  content: "";
  width: 1px;
  background: #D1D5D9;
}
.history-line span {
  display: block;
  width: 0.32rem;
  height: 0.32rem;
  background: url(../images/dist1.png) center no-repeat;
  background-size: cover;
}
.history-infos {
  margin-left: 0.24rem;
  flex: 1;
  width: 0;
}
.history-infos time {
  display: block;
  color: #E62129;
  font-size: 0.38rem;
  line-height: 1;
  font-family: "Roboto-Bold";
}
.hostory-text {
  margin-top: 0.26rem;
}
.hostory-text p {
  color: #202020;
  font-size: 0.24rem;
  line-height: 2;
}
.history-btns {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 0 0.5rem;
}
.history-btns span {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  box-shadow: 0px 0px 0.3rem rgba(186, 186, 186, 0.25);
  background: #fff;
  color: #999999;
  font-size: 0.12rem;
  cursor: pointer;
  transition: 0.4s;
}
.history-btns span:hover {
  background: #E62129;
  color: #fff;
}
.about-advantage {
  padding: 1rem 0 1.08rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.about-advantage-list {
  margin-top: 1rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.3rem 0.5rem;
}
.about-advantage-list li {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 3;
  padding: 0 0.05rem;
  padding-left: 0.4rem;
  height: 1.58rem;
  background: #fff;
  box-shadow: 0px 0px 0.15rem rgba(208, 208, 208, 0.25);
  transition: 0.4s;
}
.about-advantage-list li:before {
  content: "";
  width: 100%;
  height: 0;
  background: #E62129;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.4s;
  z-index: -1;
}
.about-advantage-list li:hover,
.about-advantage-list li.active {
  color: #E62129;
}
.about-advantage-list li:hover:before,
.about-advantage-list li.active:before {
  height: 100%;
  bottom: auto;
  top: 0;
}
.about-advantage-list li:hover b img.show {
  opacity: 0;
}
.about-advantage-list li:hover b img.hide {
  opacity: 1;
}
.about-advantage-list li:hover .about-advantage-text strong,
.about-advantage-list li:hover .about-advantage-text p {
  color: #fff;
}
.about-advantage-list li b {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 0.48rem;
  height: 0.48rem;
}
.about-advantage-list li b img {
  width: 100%;
  height: auto;
  transition: 0.35s;
}
.about-advantage-list li b img.hide {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
}
.about-advantage-text {
  flex: 1;
  margin-left: 0.22rem;
  width: 0;
}
.about-advantage-text strong {
  display: block;
  margin-bottom: 0.1rem;
  color: #202020;
  font-size: 0.22rem;
  line-height: 1.1;
  font-weight: normal;
  transition: 0.3s;
}
.about-advantage-text p {
  color: #666666;
  font-size: 0.16rem;
  transition: 0.3s;
}
.slogan-list {
  display: flex;
}
.slogan-list li {
  flex: 1;
  position: relative;
}
.slogan-list li:hover figure:before {
  opacity: 1;
  visibility: visible;
}
.slogan-list li:hover figure img {
  transform: scale(1.05);
}
.slogan-list li:hover .slogan-text b {
  opacity: 1;
  transform: scale(1);
  width: 0.8rem;
  height: 0.8rem;
  visibility: visible;
}
.slogan-list li figure {
  position: relative;
  display: block;
  padding-bottom: 137.5%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.slogan-list li figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slogan-list li figure:before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(149, 25, 33, 0.9);
  opacity: 0;
  visibility: hidden;
  transition: 0.4s;
}
.slogan-list li figure img {
  transition: 0.58s;
}
.slogan-text {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  text-align: center;
  z-index: 3;
}
.slogan-text b {
  display: block;
  margin: auto;
  text-align: center;
  margin-bottom: 0.5rem;
  color: #fff;
  font-size: 0.8rem;
  font-weight: normal;
  line-height: 1;
  width: 0;
  height: 0;
  transform: scale(0);
  transition: 0.4s;
  opacity: 0;
  visibility: hidden;
}
.slogan-text strong {
  display: block;
  margin-bottom: 0.45rem;
  color: #FFFFFF;
  font-size: 0.48rem;
  font-weight: normal;
  line-height: 1;
}
.slogan-text p {
  color: #FFFFFF;
  font-size: 0.24rem;
}
.honor-box {
  padding: 1rem 0 1.86rem;
  position: relative;
  z-index: 2;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
}
.honor-box:before {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -1;
  content: "";
  width: 100%;
  height: 1.25rem;
  background: linear-gradient(90deg, #B73030 0%, #771A19 100%);
}
.culture-word {
  margin-top: 0.9rem;
  margin-bottom: 0.9rem;
  color: #202020;
  font-size: 0.18rem;
}
.honor-siwper {
  position: relative;
  margin: 0;
  width: 11.88rem;
}
.honor-slide {
  box-sizing: border-box;
  padding: 0.2rem 0.2rem 0;
  width: 30%;
  background: #fff;
  box-shadow: 0px 0px 0.15rem rgba(208, 208, 208, 0.25);
}
.honor-slide:hover figure img {
  transform: scale(1.06);
}
.honor-slide:hover strong {
  color: #E62129;
}
.honor-slide figure {
  position: relative;
  display: block;
  padding-bottom: 72.635%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.honor-slide figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.honor-slide figure img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  transition: 0.5s;
}
.honor-slide strong {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 0.88rem;
  color: #000000;
  font-size: 0.16rem;
  transition: 0.4s;
}
.honor-btns {
  position: absolute;
  top: 50%;
  margin-top: -0.21rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.32rem;
  height: 0.42rem;
  z-index: 5;
  cursor: pointer;
  background: #D2D2D2;
  color: #fff;
  font-size: 0.16rem;
  transition: 0.4s;
}
.honor-btns:hover {
  background: #E62129;
}
.honor-btns.prev {
  margin-left: -30px;
  left: 33.33%;
}
.honor-btns.next {
  margin-right: -30px;
  right: 33.33%;
}
.honor-imgs {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 3;
  width: 35.52vw;
  max-width: 6.82rem;
  line-height: 0;
  pointer-events: none;
}
.honor-imgs img {
  width: 100%;
  height: auto;
}
.album {
  padding: 1rem 0 0.8rem;
}
.album-swiper {
  margin-top: 1.12rem;
}
.album-slide {
  width: 8rem;
}
.album-slide.swiper-slide-active figure:before {
  opacity: 0;
}
.album-slide.swiper-slide-active strong {
  opacity: 1;
  visibility: visible;
}
.album-slide figure {
  position: relative;
  display: block;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.album-slide figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.album-slide figure:before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  transition: 0.4s;
}
.album-slide strong {
  display: block;
  margin-top: 0.5rem;
  line-height: 1.1;
  color: #202020;
  font-size: 0.24rem;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: 0.35s;
}
.factory {
  padding: 1rem 0 0.8rem;
  background: #F7F7F7;
}
.factory-infos {
  position: relative;
}
.factory-infos:hover .factory-imgs figure img {
  transform: scale(1.04);
}
.factory-infos:hover .factory-text strong {
  color: #E62129;
}
.factory-imgs {
  position: relative;
  margin-top: 0.8rem;
  width: 69.625%;
}
.factory-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 55.65%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.factory-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.factory-imgs figure img {
  transition: 0.68s;
}
.factory-text {
  position: absolute;
  right: 0;
  top: 50%;
  padding: 0.6rem 0.4rem;
  transform: translateY(-50%);
  width: 39.3%;
  z-index: 3;
  box-sizing: border-box;
  background: #fff;
}
.factory-text small {
  display: block;
  margin-bottom: 0.06rem;
  color: #666666;
  font-size: 0.16rem;
  line-height: 3;
  font-family: "Roboto-Regular";
  text-transform: uppercase;
}
.factory-text strong {
  display: block;
  margin-bottom: 0.24rem;
  color: #202020;
  font-size: 0.38rem;
  line-height: 1.1;
  font-weight: normal;
  transition: 0.4s;
}
.factory-text p {
  color: #333333;
  font-size: 0.16rem;
  line-height: 3;
}
.join-box {
  position: relative;
  z-index: 3;
  padding-top: 1rem;
}
.join-box .culture-titles strong {
  color: #fff;
}
.join-box .culture-titles p {
  color: #fff;
}
.join-bgs {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 5rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.join-tops {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.join-btns {
  display: flex;
  align-items: center;
}
.join-btns span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.42rem;
  height: 0.42rem;
  background: #fff;
  border-radius: 50%;
  cursor: pointer;
  color: #999999;
  font-size: 0.14rem;
  transition: 0.35s;
}
.join-names {
  box-sizing: border-box;
  padding: 0 0.1rem;
  width: 2.08rem;
  text-align: center;
  color: #FFFFFF;
  font-size: 0.18rem;
  font-weight: normal;
}
.join-swiper {
  margin-top: 0.7rem;
  background: #fff;
  box-shadow: 0px 0px 0.15rem rgba(208, 208, 208, 0.25);
}
.join-slide {
  display: flex;
  align-items: center;
  padding: 0.36rem 0.28rem;
  box-sizing: border-box;
}
.join-imgs {
  width: 39.65%;
}
.join-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 53.181%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.join-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.join-imgs figure img {
  transition: 0.6s;
}
.join-fix {
  flex: 1;
  width: 0;
  margin-left: 0.6rem;
}
.join-fix .join-title {
  display: block;
  color: #202020;
  font-size: 0.28rem;
  font-weight: normal;
  line-height: 1;
}
.join-text {
  margin-top: 0.22rem;
  margin-bottom: 0.4rem;
  color: #666666;
  font-size: 0.16rem;
  line-height: 1.75;
}
.join-more a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.42rem;
  height: 0.42rem;
  border: 1px solid #E62129;
  border-radius: 0.12rem 0 0.12rem 0;
}
.join-more a:hover {
  background: #E62129;
}
.join-more a:hover span,
.join-more a:hover i {
  color: #fff;
}
.join-more a span {
  display: inline-block;
  color: #E62129;
  font-size: 0.16rem;
  transition: 0.3s;
}
.join-more a i {
  display: inline-block;
  margin-left: 0.02rem;
  color: #E62129;
  font-size: 0.12rem;
  font-style: normal;
  transform: scale(0.5);
  transition: 0.3s;
}
.news-boxs {
  padding: 0.52rem 0 0;
  background: #F7F7F7;
}
.news-list {
  padding-bottom: 1rem;
}
.news-list li {
  margin-bottom: 0.3rem;
}
.news-list li:last-child {
  margin-bottom: 0;
}
.news-list li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.3rem;
  background: #fff;
}
.news-list li a:hover .news-imgs figure img {
  transform: scale(1.06);
}
.news-list li a:hover .news-infixs strong {
  color: #E62129;
}
.news-list li a:hover .news-infixs span {
  background: #E62129;
  color: #fff;
}
.news-imgs {
  width: 4.4rem;
}
.news-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 66.81%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.news-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.news-imgs figure img {
  transition: 0.65s;
}
.news-infixs {
  flex: 1;
  margin-left: 0.5rem;
  width: 0;
}
.news-infixs time {
  display: flex;
  align-items: center;
  margin-bottom: 0.26rem;
  color: #444444;
  font-size: 0.16rem;
  line-height: 1;
}
.news-infixs time i {
  display: inline-block;
  margin-right: 0.12rem;
  font-style: normal;
  font-size: 0.18rem;
}
.news-infixs strong {
  display: block;
  margin-bottom: 0.2rem;
  color: #000000;
  font-size: 0.28rem;
  line-height: 1.2;
  font-weight: normal;
  transition: 0.38s;
}
.news-infixs p {
  color: #999999;
  font-size: 0.16rem;
  line-height: 1.75;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.news-infixs span {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.44rem;
  width: 1.42rem;
  height: 0.42rem;
  border: 1px solid #E62129;
  color: #E62129;
  font-size: 0.16rem;
  border-radius: 0.12rem 0 0.12rem 0;
  transition: 0.38s;
}
.page_list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.16rem;
}
.page_list li.first a {
  padding: 0 0.18rem;
  width: auto;
}
.page_list li:last-child {
  margin-right: 0;
}
.page_list li.active a,.page_list li:hover a {
  border-color: #202020;
  background: #202020;
  color: #fff;
}
.page_list li span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.44rem;
  line-height: 0.44rem;
  font-size: 0.16rem;
  background: #202020;
  color: #fff;
}
.page_list li a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  min-width: 0.24rem;padding:0 0.1rem;
  height: 0.42rem;
  border: 1px solid #E0E0E0;
  background: #fff;
  color: #999999;
  font-size: 0.16rem;
}
.quotate-bgs {
  background: #F7F7F7;
}
.news-view {
  padding: 0.3rem 0 0;
  background: #F7F7F7;
}
.news-view-flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.news-v-info {
  width: 68.75%;
}
.news-v {
  padding: 0 0.4rem;
  background: #fff;
}
.news-v-top {
  padding: 0.68rem 0 0.45rem;
  border-bottom: 1px solid #F0F0F0;
  text-align: center;
}
.news-v-top strong {
  display: block;
  margin-bottom: 0.24rem;
  color: #202020;
  font-size: 0.34rem;
  line-height: 1.2;
}
.news-v-top p {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 0.4rem;
}
.news-v-top p span {
  display: inline-block;
  position: relative;
  color: #999999;
  font-size: 0.16rem;
  line-height: 1.2;
}
.news-v-top p span:last-child:before {
  display: none;
}
.news-v-top p span:before {
  position: absolute;
  right: -0.2rem;
  top: 50%;
  margin-top: -0.09rem;
  content: "";
  width: 1px;
  height: 0.18rem;
  background: #D9D9D9;
}
.news-v-coentent {
  padding: 0.35rem 0 0.5rem;
  color: #333333;
  font-size: 0.16rem;
  line-height: 2;
}
.news-v-coentent img {
  width: auto;
  max-width: 100%;
  height: auto;
}
.news-v-coentent ul,
.news-v-coentent li {
  list-style: square;
}
.news-page {
  padding: 0.24rem 0 0.4rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #F0F0F0;
}
.page-prevs {
  max-width: 49%;
}
.page-prevs a {
  display: flex;
  align-items: center;
  color: #202020;
  font-size: 0.16rem;
  line-height: 2;
}
.page-prevs a:hover {
  color: #E62129;
}
.page-prevs a span {
  display: inline-block;
  margin-right: 0.24rem;
  color: #999999;
}
.news-hotline {
  margin-top: 0.3rem;
  display: flex;
  gap: 0.2rem;
}
.hotline-item {
  flex: 1;
}
.hotline-item a {
  display: flex;
  align-items: center;
  padding: 0.32rem 0.42rem;
  background: #fff;
}
.hotline-item a b {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.94rem;
  height: 0.94rem;
  background: #E62129;
  border-radius: 50%;
  color: #fff;
  font-size: 0.44rem;
  font-weight: normal;
}
.hotline-in {
  flex: 1;
  width: 0;
  margin-left: 0.36rem;
}
.hotline-in strong {
  display: block;
  margin-bottom: 0.16rem;
  color: #202020;
  font-size: 0.2rem;
  line-height: 1.1;
  font-weight: normal;
}
.hotline-in p {
  color: #666666;
  font-size: 0.16rem;
}
.news-v-right {
  width: 29.625%;
}
.recent-news {
  padding: 0.28rem 0.24rem;
  margin-bottom: 0.2rem;
  background: #fff;
}
.recent-news:last-child {
  margin-bottom: 0;
}
.recent-title {
  display: block;
  margin-bottom: 0.2rem;
  color: #202020;
  font-size: 0.18rem;
  line-height: 1.1;
}
.recent-list li {
  margin-bottom: 0.2rem;
}
.recent-list li a {
  display: flex;
  justify-content: space-between;
}
.recent-list li a:hover .recent-imgs figure img {
  transform: scale(1.06);
}
.recent-list li a:hover .recent-info strong {
  color: #E62129;
}
.recent-list li:last-child {
  margin-bottom: 0;
}
.recent-imgs {
  width: 31.92%;
}
.recent-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 74.26%;
  height: 0;
  overflow: hidden;
  line-height: 1;
  border-radius: 0.04rem;
}
.recent-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.recent-imgs figure img {
  transition: 0.5s;
}
.recent-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 0;
  margin-left: 0.16rem;
}
.recent-info strong {
  display: block;
  color: #202020;
  font-size: 0.16rem;
  line-height: 1.75;
  font-weight: normal;
  transition: 0.35s;
}
.recent-info time {
  display: block;
  color: #999999;
  font-size: 0.14rem;
  line-height: 2;
}
.writings-list li {
  margin-bottom: 0.12rem;
}
.writings-list li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding-left: 0.24rem;
}
.writings-list li a:hover:before {
  background: #E62129;
}
.writings-list li a:hover strong {
  color: #E62129;
}
.writings-list li a:before {
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -0.03rem;
  content: "";
  width: 0.06rem;
  height: 0.06rem;
  border-radius: 50%;
  background: #D6D6D6;
  transition: 0.3s;
}
.writings-list li a strong {
  position: relative;
  flex: 1;
  width: 0;
  color: #202020;
  font-size: 0.16rem;
  line-height: 1.2;
  font-weight: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: 0.3s;
}
.writings-list li a time {
  display: inline-block;
  color: #999999;
  font-size: 0.14rem;
  line-height: 2;
}
.contact-boxs {
  padding: 0.85rem 0 0.8rem;
  background: #F7F7F7;
}
.common-titles {
  text-align: center;
}
.common-titles strong {
  display: block;
  margin-bottom: 0.22rem;
  line-height: 1.1;
  color: #000000;
  font-size: 0.4rem;
  font-weight: normal;
}
.common-titles p {
  color: #666666;
  font-size: 0.18rem;
}
.contact-list {
  margin-top: 0.8rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.3rem 0.5rem;
}
.contact-list li {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 0.12rem;
  overflow: hidden;
}
.contact-list li:hover figure img {
  transform: scale(1.06);
}
.contact-list li:hover .contact-content .iconfont {
  background: #E62129;
}
.contact-list li figure {
  position: relative;
  display: block;
  padding-bottom: 59.23%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.contact-list li figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.contact-list li figure img {
  transition: 0.58s;
}
.contact-content {
  position: relative;
  padding: 0.52rem 0.26rem 0.42rem;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contact-content .iconfont {
  position: absolute;
  left: 0.26rem;
  top: -0.34rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.68rem;
  height: 0.68rem;
  border-radius: 50%;
  background: #201455;
  color: #fff;
  font-size: 0.42rem;
  font-weight: normal;
  transition: 0.4s;
}
.contact-infos {
  margin-bottom: 0.1rem;
}
.contact-infos strong {
  display: block;
  margin-bottom: 0.16rem;
  color: #202020;
  font-size: 0.2rem;
  line-height: 1.1;
  font-weight: normal;
}
.contact-infos p {
  margin-bottom: 0.1rem;
  color: #555555;
  font-size: 0.18rem;
  line-height: 1.3;
}
.contact-infos p.colors {
  color: #E62129;
  font-weight: bold;
}
.contact-infos p:last-child {
  margin-bottom: 0;
}
.time-line {
  color: #999999;
  font-size: 0.16rem;
}
.customize {
  padding: 1rem 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.customize-wrap {
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  padding: 0.64rem 0.5rem 0.62rem;
  background: #fff;
  border-radius: 0.08rem;
}
.customize-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 41.2%;
}
.customize-top strong {
  display: block;
  color: #202020;
  font-size: 0.32rem;
  line-height: 1.5;
  font-weight: normal;
}
.customize-info {
  margin-top: 0.3rem;
  color: #555555;
  font-size: 0.18rem;
  line-height: 1.777;
}
.customize-tel {
  color: #E62129;
  font-size: 0.4rem;
  line-height: 1;
  font-weight: bold;
}
.customize-form {
  flex: 1;
  margin-left: 0.6rem;
  width: 0;
}
.customize-form .customize-tt {
  display: block;
  margin-bottom: 0.2rem;
  color: #202020;
  font-size: 0.22rem;
  line-height: 2;
  font-weight: normal;
}
.customize-radio {
  display: flex;
  margin-bottom: 0.3rem;
  flex-wrap: wrap;
  gap: 0.1rem 0.5rem;
}
.customize-radio-item label {
  display: inline-flex;
  position: relative;
  align-items: center;
  color: #666666;
  font-size: 0.16rem;
  line-height: 1.2;
  cursor: pointer;
}
.customize-radio-item input[type="radio"]:checked + span {
  border-color: #E62129;
}
.customize-radio-item input[type="radio"]:checked + span:before {
  background: #E62129;
  transform: scale(0.76);
}
.customize-radio-item .radios {
  margin: 0;
  margin-right: 0.12rem;
  width: 0.22rem;
  height: 0.22rem;
  opacity: 0;
}
.customize-radio-item span {
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -0.11rem;
  width: 0.22rem;
  height: 0.22rem;
  box-sizing: border-box;
  border-radius: 50%;
  border: 1px solid #EAEAEA;
  transition: 0.3s;
}
.customize-radio-item span:before {
  position: absolute;
  left: 0;
  top: 0;
  content: "";
  width: 100%;
  height: 100%;
  background: #F7F8F9;
  border-radius: 50%;
  transition: 0.28s;
}
.customize-row {
  display: flex;
  gap: 0 0.56rem;
}
.customize-item {
  margin-bottom: 0.2rem;
  flex: 1;
}
.customize-item p {
  margin-bottom: 0.12rem;
  color: #666666;
  font-size: 0.16rem;
  line-height: 1.1;
}
.customize-item p i {
  color: #E62129;
  font-style: normal;
}
.customize-item .text {
  box-sizing: border-box;
  padding-left: 0.12rem;
  height: 0.5rem;
  line-height: 0.48rem;
  width: 100%;
  border: 1px solid #EAEAEA;
  color: #202020;
  font-size: 0.16rem;
  background: #F7F8F9;
  outline: none;
  transition: 0.3s;
}
.customize-item .text:focus {
  border-color: #E62129;
}
.customize-btn {
  padding-top: 0.12rem;
}
.customize-btn .sub {
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  outline: none;
  width: 1.44rem;
  height: 0.44rem;
  background: #E62129;
  border-radius: 0.12rem 0 0.12rem 0;
  color: #fff;
  font-size: 0.16rem;
  cursor: pointer;
  transition: 0.4s;
}
.customize-btn .sub:hover {
  background: #201455;
}
.scope {
  padding: 0.5rem 0 1rem;
}
.scope-list {
  display: flex;
  margin-top: 0.76rem;
  gap: 0 0.28rem;
}
.scope-list li {
  position: relative;
  overflow: hidden;
  flex: 1;
  transition: 0.5s;
}
.scope-list li.active {
  flex: 1.38;
}
.scope-list li.active .scope-infos b {
  opacity: 0;
  transform: scale(0);
}
.scope-list li:first-child .scope-hide {
  display: block;
}
.scope-list li figure {
  display: block;
  line-height: 1;
  height: 5.52rem;
}
.scope-list li figure:before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  content: "";
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 47.1%, rgba(0, 0, 0, 0.9) 100%);
}
.scope-list li figure img {
  display: block;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: 100%;
}
.scope-infos {
  position: absolute;
  left: 0.28rem;
  right: 0.4rem;
  bottom: 0.5rem;
  z-index: 5;
}
.scope-infos b {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.5rem;
  height: 0.5rem;
  transition: 0.4s;
}
.scope-infos b img {
  max-width: 100%;
  max-height: 100%;
}
.scope-infos strong {
  display: block;
  margin-top: 0.16rem;
  color: #fff;
  font-size: 0.2rem;
  line-height: 1;
}
.scope-hide {
  margin-top: 0.16rem;
  margin-bottom: -0.2rem;
  color: #fff;
  font-size: 0.16rem;
  line-height: 1.75;
  display: none;
}
.service-advantage {
  padding: 0.8rem 0;
  background: #F7F7F7;
}
.service-list {
  margin-top: 0.75rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.service-list li {
  display: flex;
}
.service-list li:nth-child(n+3) {
  flex-direction: row-reverse;
}
.service-list li:hover .service-imgs figure {
  opacity: 1;
  filter: grayscale(0);
}
.service-list li:hover .service-imgs figure img {
  transform: scale(1.06);
}
.service-list li:hover .service-infos {
  background: #E62129;
}
.service-list li:hover .service-infos b,
.service-list li:hover .service-infos strong,
.service-list li:hover .service-infos p {
  color: #fff;
}
.service-imgs {
  width: 50%;
}
.service-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 100%;
  height: 0;
  overflow: hidden;
  line-height: 1;
  filter: grayscale(100%);
  opacity: 0.9;
  transition: 0.4s;
}
.service-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.service-imgs figure img {
  transition: 0.58s;
}
.service-infos {
  flex: 1;
  width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 0.4rem;
  background: #FFFFFF;
  transition: 0.4s;
}
.service-infos b {
  display: block;
  margin-bottom: 0.1rem;
  line-height: 1;
  color: #D3D3D3;
  font-size: 0.48rem;
  font-family: "Roboto-Bold";
  font-weight: normal;
  transition: 0.3s;
}
.service-infos strong {
  display: block;
  margin-bottom: 0.42rem;
  color: #000000;
  font-size: 0.24rem;
  line-height: 1.2;
  font-weight: normal;
  transition: 0.3s;
}
.service-infos p {
  color: #666666;
  font-size: 0.18rem;
  line-height: 1.55;
  transition: 0.3s;
}
.guarantee {
  padding: 0.8rem 0;
}
.guarantee-list {
  margin-top: 0.75rem;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.4rem 0.3rem;
}
.guarantee-list li {
  background: #F7F7F7;
}
.guarantee-list li:hover figure img {
  transform: scale(1.06);
}
.guarantee-list li:hover .guarantee-info b {
  background: #E62129;
}
.guarantee-list li figure {
  position: relative;
  display: block;
  padding-bottom: 41.21%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.guarantee-list li figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.guarantee-list li figure img {
  transition: 0.5s;
}
.guarantee-info {
  padding: 0.44rem 0 0;
  position: relative;
  box-sizing: border-box;
  height: 0.98rem;
  color: #202020;
  font-size: 0.2rem;
  line-height: 1.1;
}
.guarantee-info b {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 50%;
  margin-left: -0.31rem;
  top: -0.31rem;
  width: 0.62rem;
  height: 0.62rem;
  background: #201455;
  border-radius: 50%;
  transition: 0.38s;
}
.guarantee-info b img {
  display: inline-block;
  width: 0.3rem;
  height: auto;
}
.guarantee-info strong {
  display: block;
  text-align: center;
  font-weight: normal;
}
.cases-box {
  padding: 0.8rem 0;
  background: #F7F7F7;
}
.cases-btn-fix {
  display: flex;
  justify-content: center;
  margin-top: 0.38rem;
  margin-bottom: 0.5rem;
}
.cases-btn {
  display: inline-flex;
  padding: 0.04rem;
  background: #fff;
  border-radius: 0.24rem;
}
.cases-btn li {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.28rem;
  height: 0.4rem;
  color: #202020;
  font-size: 0.16rem;
  cursor: pointer;
  transition: 0.38s;
  border-radius: 0.2rem;
}
.cases-btn li.a:hover,
.cases-btn li.active {
  background: #E62129;
  color: #fff;
}
.cases-item {
  display: none;
}
.cases-item .management-list {
  margin-bottom: 0.8rem;
}
.cases-item:first-child {
  display: block;
}
.service-advantage {
  padding: 0.8rem 0 1.48rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.service-advantage .common-titles strong,
.service-advantage .common-titles p {
  color: #fff;
}
.service-advantage-list {
  margin-top: 1.2rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.3rem;
}
.service-advantage-list li {
  position: relative;
  display: flex;
  justify-content: flex-start;
  justify-content: space-between;
  background: #fff;
  border-radius: 0.12rem;
}
.service-advantage-list li:hover .advantage-imgs figure img {
  transform: scale(1.06);
}
.service-advantage-list li b {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0.14rem;
  top: -0.23rem;
  width: 0.46rem;
  height: 0.46rem;
  background: linear-gradient(180deg, #E62129 0%, #E9121B 100%);
  color: #fff;
  font-size: 0.16rem;
  border-radius: 50%;
  box-shadow: 0px 4px 4px rgba(232, 24, 32, 0.25);
}
.advantage-infos {
  flex: 1;
  padding: 0.48rem 0.24rem 0.12rem;
  width: 0;
}
.advantage-infos small {
  display: block;
  margin-bottom: 0.04rem;
  line-height: 1;
  color: #D2D2D2;
  font-size: 0.16rem;
  text-transform: uppercase;
}
.advantage-infos strong {
  display: block;
  margin-bottom: 0.2rem;
  color: #E62129;
  font-size: 0.22rem;
  line-height: 1.1;
}
.advantage-infos p {
  color: #333333;
  font-size: 0.14rem;
  line-height: 0.2rem;
}
.advantage-imgs {
  width: 2rem;
}
.advantage-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 100%;
  height: 0;
  overflow: hidden;
  line-height: 1;
  border-radius: 0 0.12rem 0.12rem 0;
}
.advantage-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.advantage-imgs figure img {
  transition: 0.6s;
}
.ground-box {
  padding: 0.8rem 0;
  background: #F7F7F7;
}
.ground-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 0.75rem;
}
.ground-list li {
  position: relative;
  background: #fff;
}
.ground-list li:hover figure img {
  transform: scale(1.08);
}
.ground-list li:hover .ground-infos strong {
  color: #E62129;
}
.ground-list li figure {
  position: relative;
  display: block;
  padding-bottom: 45%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.ground-list li figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ground-list li figure img {
  transition: 0.5s;
}
.ground-infos {
  padding: 0.68rem 0.12rem 0.4rem;
  position: relative;
}
.ground-infos span {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 50%;
  margin-left: -0.49rem;
  top: -0.49rem;
  width: 0.98rem;
  height: 0.98rem;
  box-sizing: border-box;
  background: #E62129;
  border-radius: 50%;
  border: 0.04rem solid #fff;
}
.ground-infos b {
  display: block;
  position: absolute;
  right: 0.14rem;
  bottom: 0;
  line-height: 1;
  color: #F7F7F7;
  font-size: 0.74rem;
  font-family: "Roboto-Bold";
  font-weight: normal;
}
.ground-infos strong {
  display: block;
  text-align: center;
  margin-bottom: 0.16rem;
  line-height: 1;
  color: #000000;
  font-size: 0.24rem;
  font-weight: normal;
  transition: 0.4s;
}
.ground-infos small {
  display: block;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  color: #999999;
  font-size: 0.16rem;
}
.advatages-li {
  margin-top: 0.8rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.4rem;
}
.advatages-li li {
  display: flex;
  flex-direction: column;
}
.advatages-li li:hover figure img {
  transform: scale(1.08);
}
.advatages-li li:hover .adva-info {
  background: #E62129;
}
.advatages-li li:hover .adva-info strong,
.advatages-li li:hover .adva-info p {
  color: #fff;
}
.advatages-li li figure {
  position: relative;
  display: block;
  padding-bottom: 74.594%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.advatages-li li figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.advatages-li li figure img {
  transition: 0.68s;
}
.adva-info {
  padding: 0.3rem 0.28rem;
  flex: 1;
  background: #fff;
  box-shadow: 0px 4px 0.2rem rgba(101, 101, 101, 0.08);
  box-sizing: border-box;
  transition: 0.4s;
}
.adva-info strong {
  display: block;
  margin-bottom: 0.12rem;
  color: #202020;
  font-size: 0.2rem;
  line-height: 1.1;
}
.adva-info p {
  color: #333333;
  font-size: 0.16rem;
  line-height: 1.75;
}
.process-box {
  padding: 0.8rem 0 1.6rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.process-list {
  margin-top: 1rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.74rem 0.5rem;
}
.process-list li {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: #fff;
  border-radius: 0.12rem;
  box-shadow: 0px 4px 0.2rem rgba(101, 101, 101, 0.08);
  height: 1.24rem;
}
.process-list li:hover strong {
  color: #E62129;
}
.process-list li b {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0.06rem;
  top: -0.25rem;
  z-index: 2;
  width: 0.64rem;
  height: 0.4rem;
  background: #E62129;
  border-radius: 0.05rem;
  color: #fff;
  font-size: 0.28rem;
  font-weight: normal;
  font-family: "Roboto-Bold";
}
.process-list li b:before {
  position: absolute;
  left: 50%;
  margin-left: -0.08rem;
  bottom: -0.09rem;
  content: "";
  border-left: 0.08rem solid transparent;
  border-right: 0.08rem solid transparent;
  border-top: 0.14rem solid #E62129;
}
.process-list li strong {
  display: block;
  line-height: 1.1;
  color: #202020;
  font-size: 0.28rem;
  transition: 0.4s;
}
.process-list li small {
  display: block;
  margin-top: 0.1rem;
  color: #666666;
  font-size: 0.12rem;
  line-height: 1.2;
  text-transform: uppercase;
}
.cases-view {
  padding: 0.5rem 0.4rem 0.4rem;
  background: #fff;
}
.cases-title {
  display: block;
  text-align: center;
  color: #202020;
  font-size: 0.34rem;
  font-weight: normal;
  line-height: 1.2;
}
.cases-flex {
  margin-top: 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.cases-imgs {
  width: 51.96%;
}
.cases-imgs figure {
  position: relative;
  display: block;
  padding-bottom: 75.09%;
  height: 0;
  overflow: hidden;
  line-height: 1;
}
.cases-imgs figure img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cases-fixs {
  flex: 1;
  margin-left: 0.5rem;
  width: 0;
}
.cases-fixs strong {
  display: block;
  margin-bottom: 0.3rem;
  line-height: 1.1;
  color: #202020;
  font-size: 0.24rem;
  font-weight: normal;
}
.cases-tag {
  color: #333333;
  font-size: 0.18rem;
}
.cases-tag p {
  margin-bottom: 0.1rem;
}
.cases-tag p:last-child {
  margin-bottom: 0;
}
.cases-btns {
  margin-top: 0.42rem;
}
.cases-btns a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.42rem;
  height: 0.42rem;
  border: 1px solid #E62129;
  color: #E62129;
  font-size: 0.16rem;
  border-radius: 0.12rem 0 0.12rem 0;
}
.cases-btns a:hover {
  background: #E62129;
  color: #fff;
}
.cases-v {
  padding: 0.5rem 0.4rem 0;
  background: #fff;
  margin-top: 0.4rem;
}
.cases-v .case-v-tt {
  display: block;
  text-align: center;
  line-height: 1.1;
  color: #202020;
  font-size: 0.34rem;
  font-weight: normal;
}
.cases-v-in {
  margin-top: 0.4rem;
  padding-bottom: 0.4rem;
  color: #333333;
  font-size: 0.16rem;
}
.cases-v-in img {
  max-width: 100%;
  width: auto;
  height: auto;
}