img {
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.common_bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}

.item_hover {
  overflow: hidden;
}

.item_hover:hover img {
  transform: scale(1.05);
}

.item_hover img {
  transition: 1s;
}

.about1 {
  position: relative;
}

.about1 .first {
  height: calc(100vh + 1000px);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.about1 .first .fix {
  position: sticky;
  top: 0;
  overflow: hidden;
  height: 100vh;
  width: 100%;
}

.about1 .first .fix .imgMove {
  width: 100%;
  height: 100%;
}

.about1 .first .fix .imgMove img {
  width: 100%;
  height: 100%;
}

.about1 .first .fix .text {
  position: absolute;
  bottom: 7.13542vw;
  padding: 0 10.41667vw;
  z-index: 2;
}

.about1 .first .fix .text .p1 {
  color: #fff;
  font-weight: bold;
  margin: 0 0 0.83333vw;
}

.about1 .first .fix .text .p2 {
  color: #fff;
  line-height: 200%;
}

.about1 .last {
  min-height: 100vh;
  display: flex;
  justify-content: space-between;
  padding: 0 6.25vw;
  padding-top: 100vh;
  padding-bottom: 10.41667vw;
}

.about1 .last .matter {
  display: flex;
  gap: 2.08333vw;
  height: 78.125vw;
}

.about1 .last .matter:last-child .flex:nth-child(2) {
  margin: 0;
}

.about1 .last .matter:last-child .flex:nth-child(2n-1) {
  margin: 5.20833vw 0 0 0;
}

.about1 .last .matter .flex:nth-child(2) {
  margin: 5.20833vw 0 0 0;
}

.about1 .last .matter .flex .img {
  width: 12.5vw;
  height: 10.41667vw;
  border-radius: 0.83333vw;
  overflow: hidden;
}

.about1 .last .matter .flex .img:not(:last-child) {
  margin: 0 0 11.25vw;
}

.about1 .last .matter .flex .img img {
  width: 100%;
  height: 100%;
}

.about1 .last .center {
  width: 26.71875vw;
  margin: 45vh auto 0;
  text-align: center;
}

.about1 .last .center .p1 {
  font-weight: bold;
  color: #036;
  margin: 0 0 1.66667vw;
}

.about1 .last .center .p2 {
  width: 22.91667vw;
  margin: auto;
  color: #0F172B;
  font-weight: 500;
}

.about1 .last .center .p3 {
  margin: 0.83333vw 0 0 0;
  color: #364153;
  line-height: 162.5%;
}

.main {
  overflow: hidden;
}

.about2 {
  border-radius: 0.83333vw;
  background: #F8FAFC;
  padding: 7.03125vw 0 7.65625vw;
  position: relative;
}

.about2:after {
  content: '';
  position: absolute;
  width: 10.10417vw;
  top: 0;
  left: 0;
  height: 100%;
  background: #F8FAFC;
  z-index: 5;
  pointer-events: none;
}

.about2 .wrap {
  width: 78.75vw;
  margin: auto;
}

.about2 .wrap .content {
  width: 89.375vw;
  position: relative;
}

.about2 .wrap .content:after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  background: #043592;
  width: 100%;
  height: 0.10417vw;
}

.about2 .wrap .content .yearSwiper {
  width: 100%;
  height: 52.08333vw;
  overflow: unset;
}

.about2 .wrap .content .yearSwiper .swiper-slide {
  padding: 0;
}

.about2 .wrap .content .yearSwiper .swiper-slide:nth-child(2n) .item .position {
  bottom: 0;
  top: unset;
}

.about2 .wrap .content .yearSwiper .swiper-slide .item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  position: relative;
}

.about2 .wrap .content .yearSwiper .swiper-slide .item.itemMove .img {
  transform: translate(7.8125vw, -31.25vw) scale(0.7);
}

.about2 .wrap .content .yearSwiper .swiper-slide .item .position {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  height: 22.29167vw;
  align-items: flex-end;
  gap: 1.77083vw;
}

.about2 .wrap .content .yearSwiper .swiper-slide .item .position .img {
  width: 17.60417vw;
  height: 100%;
  border-radius: 0.83333vw;
  overflow: hidden;
}

.about2 .wrap .content .yearSwiper .swiper-slide .item .position .img:hover img {
  transform: scale(1.05);
}

.about2 .wrap .content .yearSwiper .swiper-slide .item .position .img img {
  width: 100%;
  height: 100%;
  transition: 1s;
}

.about2 .wrap .content .yearSwiper .swiper-slide .item .position .text {
  white-space: nowrap;
  padding: 0 0 0.78125vw;
}

.about2 .wrap .content .yearSwiper .swiper-slide .item .position .text .p1 {
  font-weight: bold;
  color: #036;
  margin: 0 0 0.83333vw;
}

.about2 .wrap .content .yearSwiper .swiper-slide .item .position .text .p2 {
  color: #0F172B;
  font-weight: bold;
}

.about2 .wrap .content .yearSwiper .swiper-slide .item .circle {
  width: 0.83333vw;
  height: 0.83333vw;
  border-radius: 50%;
  border: 0.10417vw solid #036;
  background: #FFF;
}

.about3 {
  padding: 2.60417vw 0 3.90625vw;
  background: #F8FAFC;
  overflow: hidden;
}

.about3 .title {
  text-align: center;
  color: #036;
  font-weight: bold;
  position: relative;
  padding: 0 0 0.83333vw;
  z-index: 1;
  margin: 0 0 6.51042vw;
}

.about3 .title:after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 2.5vw;
  height: 0.20833vw;
  background: #036;
  border-radius: 33554400px;
}

.about3 .headline {
  color: #033491;
  text-align: center;
  margin: 0 0 7.29167vw;
}

.about3 .headline .items {
  display: flex;
  justify-content: center;
}

.about3 .headline .items .item {
  display: none;
  overflow: hidden;
}

.about3 .headline .items .item.on {
  display: block;
}

.about3 .x-footer .slot {
  position: relative;
}

.about3 .x-footer .slot .slot-track {
  transform-origin: left bottom;
  width: 13.48958vw;
  will-change: transform;
  transition: transform 0.2s ease-out;
}

.about3 .x-footer .slot .slot-track:not(:first-child) {
  left: 0;
  position: absolute;
  top: 0;
}

.about3 .x-footer .slot .slot-track .slot-item .code {
  width: 100%;
  height: 16.35417vw;
}

.about3 .x-footer .slot .slot-track .slot-item .code img {
  width: 100%;
  height: 100%;
}

.about3 .content {
  display: flex;
  justify-content: center;
}

.about3 .content .slot {
  display: flex;
  align-items: flex-end;
  gap: 0.625vw;
}

.about3 .content .item {
  width: 13.48958vw;
  height: 16.35417vw;
}

.about3 .content .item .img {
  width: 100%;
  height: 100%;
}

.about3 .content .item .img img {
  width: 100%;
  height: 100%;
}

.about4 {
  padding: 3.90625vw 0 5.72917vw;
}

.about4 .content {
  width: 66.35417vw;
  height: 15.83333vw;
  border-radius: 0.83333vw;
  background: #F8FAFC;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  padding: 3.33333vw 4.84375vw 3.28125vw 3.95833vw;
  display: flex;
  justify-content: space-between;
  margin: auto;
  transition: .6s ease;
}

.about4 .content:hover {
  background: #E1EBF4;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.about4 .content:hover .download {
  background: #fff;
}

.about4 .content:hover .download svg {
  filter: unset;
}

.about4 .content:hover .download p {
  color: #0052A3;
}

.about4 .content .l {
  width: 29.58333vw;
}

.about4 .content .l .p1 {
  color: #033491;
  font-weight: bold;
  margin: 0 0 1.45833vw;
}

.about4 .content .l .p2 {
  color: #033491;
  line-height: 162.5%;
}

.about4 .content .download {
  width: 20.52083vw;
  height: 3.54167vw;
  border-radius: 0.83333vw;
  background: #033491;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625vw;
  margin: 2.55208vw 0 0 0;
  transition: .6s ease;
}

.about4 .content .download svg {
  width: 1.25vw;
  height: 1.25vw;
  filter: brightness(0) invert(1);
  transition: .6s ease;
}

.about4 .content .download p {
  color: #fff;
  font-weight: bold;
  transition: .6s ease;
}

.news3 {
  background: #FFF;
  box-shadow: 8px -11px 27.6px 0 rgba(5, 47, 129, 0.17);
  padding: 3.33333vw 16.25vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: .6s ease;
}

.news3:hover {
  background: #1A3FB8;
}

.news3:hover .title {
  color: #fff;
}

.news3:hover .display .list {
  border-color: #fff;
}

.news3:hover .display .list p {
  color: #fff;
}

.news3:hover .display .list .icon {
  filter: brightness(0) invert(1);
}

.news3 .title {
  color: #033491;
  font-weight: bold;
  transition: .6s ease;
}

.news3 .display {
  display: flex;
  gap: 3.125vw;
}

.news3 .display .list {
  width: 15.625vw;
  height: 3.125vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.41667vw;
  gap: 0.83333vw;
  border: 1px solid #033491;
  transition: .6s ease;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.news3 .display .list:hover .color {
  transform: scale(30);
}

.news3 .display .list:hover p {
  color: #033491;
}

.news3 .display .list:hover .icon {
  filter: unset;
}

.news3 .display .list .color {
  width: 1.04167vw;
  height: 1.04167vw;
  background: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  border-radius: 50%;
  transform: scale(0);
  transition: transform .6s ease;
}

.news3 .display .list:first-child .icon {
  width: 1.04167vw;
  height: 1.04167vw;
}

.news3 .display .list .icon {
  width: 1.25vw;
  height: 1.25vw;
  transition: .6s ease;
}

.news3 .display .list .icon svg {
  width: 100%;
  height: 100%;
}

.news3 .display .list p {
  color: #036;
  font-weight: bold;
  transition: .6s ease;
}

@media screen and (max-width: 768px) {
  .about1 .first {
    display: none;
  }
  .about1 .last {
    height: auto;
    min-height: unset;
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .about1 .last .matter {
    display: none;
  }
  .about1 .last .center {
    width: 100%;
    margin: 60px auto 0;
  }
  .about1 .last .center .img {
    display: block !important;
    width: 100%;
    margin: 0 0 15px;
    border-radius: 15px;
    overflow: hidden;
  }
  .about1 .last .center .img img {
    width: 100%;
  }
  .about1 .last .center .p1 {
    margin: 0 0 15px;
  }
  .about1 .last .center .p2 {
    width: 100%;
    margin: 0 0 10px;
  }
  .about1 .last .center .grid {
    display: block !important;
    margin: 30px 0 0 0;
  }
  .about1 .last .center .grid .sj_swiper1 {
    width: 95vw;
  }
  .about1 .last .center .grid .img {
    width: 100%;
    height: 230px;
    border-radius: 15px;
  }
  .about1 .last .center .grid .img img {
    width: 100%;
    height: 100%;
  }
  .about2 {
    padding: 50px 5%;
  }
  .about2:after {
    display: none;
  }
  .about2 .wrap {
    width: 100%;
  }
  .about2 .wrap .content {
    width: 100%;
  }
  .about2 .wrap .content:after {
    display: none;
  }
  .about2 .wrap .content .yearSwiper {
    width: 95vw;
    height: auto;
    margin: 0;
  }
  .about2 .wrap .content .yearSwiper .swiper-slide .item {
    flex-direction: column;
    align-items: start;
    justify-content: start;
  }
  .about2 .wrap .content .yearSwiper .swiper-slide .item .circle {
    display: none;
  }
  .about2 .wrap .content .yearSwiper .swiper-slide .item .position {
    position: static;
    flex-direction: column;
    height: auto;
    align-items: start;
    gap: 0;
    width: 100%;
  }
  .about2 .wrap .content .yearSwiper .swiper-slide .item .position .img {
    width: 100%;
    height: 250px;
    transform: none !important;
    border-radius: 10px;
  }
  .about2 .wrap .content .yearSwiper .swiper-slide .item .position .text {
    margin: 20px 0 0 0;
    white-space: unset;
  }
  .about2 .wrap .content .yearSwiper .swiper-slide .item .position .text .p1 {
    margin: 0 0 10px;
  }
  .about2 .wrap .content .yearSwiper .swiper-slide .item .position .text .p2 {
    font-size: 14px;
  }
  .about3 {
    padding: 30px 5%;
  }
  .about3 .title {
    padding: 0 0 10px;
    margin: 0 0 40px;
  }
  .about3 .title:after {
    width: 50px;
    height: 2px;
  }
  .about3 .headline {
    margin: 0 0 20px;
    display: none;
  }
  .about3 .x-footer {
    display: none;
  }
  .about3 .sj_content {
    display: block !important;
  }
  .about3 .sj_content .sj_swiper2 {
    width: 95vw;
  }
  .about3 .sj_content .img {
    width: 100%;
    height: 200px;
  }
  .about3 .sj_content .img img {
    width: 100%;
    height: 100%;
  }
  .about3 .sj_content p {
    margin-top: 15px;
  }
  .about4 {
    padding: 30px 5%;
  }
  .about4 .content {
    width: 100%;
    height: auto;
    padding: 40px 5%;
    border-radius: 10px;
    flex-direction: column;
    align-items: start;
  }
  .about4 .content .l {
    width: 100%;
  }
  .about4 .content .l .p1 {
    margin: 0 0 10px;
  }
  .about4 .content .download {
    width: fit-content;
    padding: 0 20px;
    border-radius: 10px;
    height: 40px;
    gap: 10px;
    margin: 20px 0 0 0;
  }
  .about4 .content .download svg {
    width: 20px;
    height: 20px;
  }
  .news3 {
    padding: 30px 5%;
    height: auto;
    flex-direction: column;
    align-items: start;
  }
  .news3 .display {
    gap: 15px;
    margin: 20px 0 0 0;
  }
  .news3 .display .list {
    width: fit-content;
    height: 40px;
    padding: 0 15px;
    gap: 10px;
    border-radius: 8px;
  }
  .news3 .display .list .icon {
    width: 16px !important;
    height: 16px !important;
  }
  .news3 .display .list .icon svg {
    display: block;
  }
  .news3 .display .list .color {
    width: 20px;
    height: 20px;
  }
}
