/* #region 特效 */
 .banner_up {
   position: relative;
   /* z-index: 2; */
 }

 .banner .swiper-container {
   height: 100%;
 }

 .banner {
   height: 100vh;
 }

 .banner video {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .banner video::-webkit-media-controls-fullscreen-button {
   display: none;
 }

 /* .banner_up,

  .banner_slick,

  .slick-list,

  .slick-track,

  .banner {

    height: 100%;

  } */
 .banner_icon {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
   bottom: .9rem;
   z-index: 1;
   display: flex;
   flex-direction: column;
   align-items: center;
 }

 /* .banner_icon img {
   width: 2.1rem;
   /* animation: banner_icon 2.6s linear infinite; */
   animation: skyicon 5s linear infinite;
   position: relative;
   top: 1.1rem;
 } */

 /* .sticky1_icon img {

    animation: banner_icon 2.6s linear infinite;

  } */
 /* .sticky1_icon span{

    animation: banner_icon2 2.6s cubic-bezier(.77, 0, .175, 1) infinite;

  } */
 /* @keyframes banner_icon {
   0% {
     transform: translateY(-1rem);
   }

   50% {
     transform: translateY(0);
   }

   100% {
     transform: translateY(-1rem);
   }
 } */
/* 
 .banner_icon div {
   width: 2px;
   height: 4.8rem;
   background: #fff;
   position: relative;
   background: rgba(255, 255, 255, .4);
   transition: all 1s ease-out;
 }

 .banner_icon div::after {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: #fff;
   animation: banner_icon2 2.6s cubic-bezier(.77, 0, .175, 1) infinite;
 }

 @keyframes banner_icon2 {
   0% {
     transform-origin: 50% 100%;
     transform: scaleY(1);
   }

   50% {
     transform-origin: 50% 100%;
     transform: scaleY(0);
   }

   50.0001% {
     transform-origin: 50% 0;
     transform: scaleY(0);
   }

   to {
     transform-origin: 50% 0;
     transform: scaleY(1);
   }
 } */

 .banner_up .swiper-slide img {
   width: 100%;
   height: 100vh;
   object-fit: cover;
 }

 body {
   height: auto;
 }

 .banner_con {
   width: 100%;
   position: relative;
   height: 100vh;
 }

 html.act {
   height: 100vh;
   overflow-y: scroll;
 }

 html.act body {
   height: 100vh;
 }

 @keyframes off {
   0% {
     clip: rect(0, 326px, 326px, 0px);
   }

   100% {
     clip: rect(0, 326px, 326px, 326px);
   }
 }

 @keyframes on {
   0% {
     clip: rect(0, 0, 326px, 0);
   }

   100% {
     clip: rect(0, 326px, 326px, 0px);
   }
 }

 .sticky1_left .sticky1_h2 {
   font-size: 3rem;
   line-height: 4.32rem;
   min-height: 4.32rem;
   font-weight: bold;
   color: #000;
   margin-bottom: 1.5rem;
   background: linear-gradient(to right, #004BD6, #3ABCCF, #06F842);
   background-clip: border-box;
   -webkit-background-clip: text;
   color: transparent;


 }

 /* .sticky1_left .sticky1_h2::after {
   content: '';
   display: inline-block;
   width: 1rem;
   height: .2rem;
   background: #06F842;
   position: relative;
   left: .5rem;
   top: .2rem;
   animation: join1_i 2s 1s linear infinite;
 } */

 .sticky1_left {
   width: 50%;
 }

 .picture_top {
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   z-index: 10;
   transform-origin: right bottom;
   pointer-events: none;
   transition: transform 1.5s cubic-bezier(.18, .63, 0, 1);
 }

 .picture_top::after {
   content: '';
   position: absolute;
   bottom: -1px;
   left: 0;
   width: 100%;
   height: 3px;
   background: #fff;
 }

 .picture_top div {
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
 }

 .sticky1_left {
   transition: transform .8s cubic-bezier(.215, .61, .355, 1), opacity 1s ease-out;
   transition-delay: .6s;
 }

 .picture_top div {
   width: 100%;
   height: 100%;
 }

 html.off .picture_top {
   transform: scale(4);
   opacity: 0;
 }

 html.off .sticky1_left {
   transform: translateY(30px);
   opacity: 0;
 }

 .sticky1_left .sticky1_h3 {
   margin-bottom: 3.5rem;
   font-size: 1.6rem;
   color: #20a53a;
   font-weight: bold;
 }

 .sticky1_left .sticky1_p {
   margin-bottom: 2.5rem;
   font-size: 1.1rem;
   line-height: 1.8;
   color: #111;
   margin-top: 2rem;
   padding-right: 5%;
 }

 .sticky1 {
   position: absolute;
   width: 100%;
   /* height: 100vh; */
   height: 190vh;
   /* height: 100rem  ; */
   transform: 0;
   top: 0;
   left: 0;
   z-index: 10;
 }

 .sticky1_left {
   padding-top: 14rem;
   padding-bottom: 10rem;
   transition: .3s;
 }

 html.off .picture_top,
 html.off .sticky1 {
   z-index: 0;
 }

 .sticky2 {
   /* width: 100%; */
   padding-bottom: 10rem;
 }

 .sticky2 img {
   /* width: 35.3rem; */
   width: 40.5%;
   /* width: 100%; */
   /* height: 42.625rem; */
   object-fit: cover;
   /* transform: scale(1.3); */
   transition: all ease-in-out 1.2s;
   position: relative;
   margin-left: auto;
 }

 .sticky1_nr {
   position: relative;
   top: 0;
 }

 .sticky2 {
   position: relative;
   /* overflow: hidden; */
   z-index: 12;
 }

 .sticky2.animated img {
   transform: scale(1);
 }

 .sticky1_left {
   opacity: 0;
 }

 .picture_top {
   opacity: 0;
 }

 html.on1.off .sticky1_left {
   opacity: 0;
 }

 html.on1.off .picture_top {
   opacity: 0;
 }

 html.on1 .sticky1_left {
   opacity: 1;
 }

 html.on1 .picture_top {
   opacity: 1;
 }

 /* 2022.1.13 video end */
 .ys_modal_content {
   max-height: 700px;
 }

 .sticky1_left {
   opacity: 0;
 }

 .picture_top {
   opacity: 0;
 }

 html.on1.off .sticky1_left {
   opacity: 0;
 }

 html.on1.off .picture_top {
   opacity: 0;
 }

 html.on1 .sticky1_left {
   opacity: 1;
 }

 html.on1 .picture_top {
   opacity: 1;
 }

 html.off .picture_top {
   transform: translate3d(0px, 0px, 0px) scale(10, 10);
 }

 .picture_top {
   transform-origin: 70% 50%;
 }

 html.on1 .sticky1_left {
   transition: transform .6s cubic-bezier(0, 0, 0.2, 1), opacity .6s ease-out;
   transition-delay: .8s;
   text-align: left
 }

 html.on1.off .sticky1_left {
   transition: transform .4s cubic-bezier(0, 0, 0.2, 1), opacity .4s ease-out;
   transition-delay: 0s;
 }

 html.on1.off .picture_top {
   transition: transform .8s cubic-bezier(0, 0, 0.2, 1) 0.6s, opacity .6s ease-out 1s;
   opacity: 0;
   transform: translate3d(0px, 0px, 0px) scale(10, 10);
 }

 .sticky1_icon {
   width: 2.1rem;
   display: flex;
   flex-direction: column;
   align-items: center;
 }

 .sticky1_icon img {
   width: 100%;
   animation: skyicon 5s linear infinite;
   position: relative;
   top: 1.05rem;
 }

 .sticky1_icon span {
   width: 2px;
   height: 3rem;
   background: rgba(184, 184, 184, 1);


   position: relative;
   transition: all 1s ease-out;
   /* top: -6px; */
 }

 .sticky1_icon span::after {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;

   background: rgb(227, 227, 227);

   animation: banner_icon2 2.6s cubic-bezier(.77, 0, .175, 1) infinite;
   transition: all 1s ease-out;
 }



 @keyframes skyicon {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 @keyframes fadeInUp2 {
   0% {
     opacity: 0;
     -webkit-transform: translate3d(0, 5rem, 0);
     transform: translate3d(0, 5rem, 0);
   }

   to {
     opacity: 1;
     -webkit-transform: none;
     transform: none;
   }
 }

 .fadeInUp2 {
   -webkit-animation-name: fadeInUp2;
   animation-name: fadeInUp2;
 }

 .banner_con {
   height: auto;
 }

 .picture_top,
 .banner_up {
   height: 100vh;
 }

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

 .mysticky .width {
   height: 100%;
   text-align: center
 }

 /* #endregion */
 /* #region 特效2 */
 @-webkit-keyframes rotation {
   100% {
     transform: rotate(1turn);
   }
 }

 @keyframes rotation {
   100% {
     transform: rotate(1turn);
   }
 }

 @-webkit-keyframes snow {
   0% {
     transform: translateY(-12rem) rotate(45deg);
   }

   50%,
   100% {
     transform: translateY(12rem) rotate(45deg);
   }
 }

 @keyframes snow {
   0% {
     transform: translateY(-12rem) rotate(45deg);
   }

   50%,
   100% {
     transform: translateY(12rem) rotate(45deg);
   }
 }

 @-webkit-keyframes thunder {

   0%,
   25%,
   75%,
   100% {
     filter: drop-shadow(0px -1px 0px #cfb8e5) drop-shadow(0px 0px 0px #9a4ee7) drop-shadow(0px 0px 0px rgba(154, 78, 231, 0.3)) drop-shadow(-2px -2px 1px #3c3762) drop-shadow(4px 1px 1px #3c3762);
   }

   50% {
     filter: drop-shadow(0px -1px 0px #cfb8e5) drop-shadow(0px 0px 3px #9a4ee7) drop-shadow(0px 0px 30px rgba(154, 78, 231, 0.3)) drop-shadow(-2px -2px 1px #3c3762) drop-shadow(4px 1px 1px #3c3762);
   }
 }

 @keyframes thunder {

   0%,
   25%,
   75%,
   100% {
     filter: drop-shadow(0px -1px 0px #cfb8e5) drop-shadow(0px 0px 0px #9a4ee7) drop-shadow(0px 0px 0px rgba(154, 78, 231, 0.3)) drop-shadow(-2px -2px 1px #3c3762) drop-shadow(4px 1px 1px #3c3762);
   }

   50% {
     filter: drop-shadow(0px -1px 0px #cfb8e5) drop-shadow(0px 0px 3px #9a4ee7) drop-shadow(0px 0px 30px rgba(154, 78, 231, 0.3)) drop-shadow(-2px -2px 1px #3c3762) drop-shadow(4px 1px 1px #3c3762);
   }
 }

 @-webkit-keyframes floating {

   0%,
   100% {
     transform: translatey(0);
   }

   50% {
     transform: translatey(1rem);
   }
 }

 @keyframes floating {

   0%,
   100% {
     transform: translatey(0);
   }

   50% {
     transform: translatey(1rem);
   }
 }

 @-webkit-keyframes pulse {

   0%,
   100% {
     transform: scale(1);
   }

   50% {
     transform: scale(0.9);
   }
 }

 @keyframes pulse {

   0%,
   100% {
     transform: scale(1);
   }

   50% {
     transform: scale(0.9);
   }
 }

 @-webkit-keyframes neon {

   0%,
   40%,
   60%,
   100% {
     filter: brightness(1);
   }

   50% {
     filter: brightness(0.9);
   }
 }

 @keyframes neon {

   0%,
   40%,
   60%,
   100% {
     filter: brightness(1);
   }

   50% {
     filter: brightness(0.9);
   }
 }

 .weather {
   display: flex;
   align-items: center;
   justify-content: center;
   overflow: hidden;
 }

 .weather--sun {
   background: linear-gradient(45deg, #628aa4, #77a1b8);
 }

 .weather--thunder {
   background: linear-gradient(45deg, #172a44, #1f3654);
 }

 .weather--snow {
   background: linear-gradient(45deg, #5e6270, #82889c);
 }

 .weather--rainbow {
   background: linear-gradient(45deg, #1d5476, #296b8f);
 }

 .icon {
   position: relative;
   width: 18rem;
   height: 13rem;
   transform: scale(0.8);
 }

 .icon__rainbow {
   position: absolute;
   right: 0rem;
   top: -2rem;
   height: 14rem;
   width: 14rem;
   filter: drop-shadow(0px 0px 10px rgba(255, 255, 255, 0.2));
   -webkit-animation: pulse 4s infinite;
   animation: pulse 4s infinite;
 }

 .icon__rainbow-arc {
   position: absolute;
   inset: 0;
   border-radius: 50%;
   color: red;
   box-shadow: inset 2.5rem 2rem 0.3rem -3rem #000000bf, inset 0 0 0.3rem 0.25rem #ffffffb8, inset 0 0 0.2rem 0.4rem #000000a6, inset 0 0 0 0.6rem;
   -webkit-animation: neon 4s infinite;
   animation: neon 4s infinite;
 }

 .icon__rainbow-arc:nth-child(1) {
   color: #ff1f5d;
 }

 .icon__rainbow-arc:nth-child(2) {
   color: #eb8125;
   inset: 0.9rem;
   -webkit-animation-delay: 0.2s;
   animation-delay: 0.2s;
 }

 .icon__rainbow-arc:nth-child(3) {
   color: #fbff0e;
   inset: 1.8rem;
   -webkit-animation-delay: 0.4s;
   animation-delay: 0.4s;
 }

 .icon__rainbow-arc:nth-child(4) {
   color: #a8ef3c;
   inset: 2.7rem;
   -webkit-animation-delay: 0.6s;
   animation-delay: 0.6s;
 }

 .icon__rainbow-arc:nth-child(5) {
   color: #59d9ff;
   inset: 3.6rem;
   -webkit-animation-delay: 0.8s;
   animation-delay: 0.8s;
 }

 .icon__rainbow-arc:nth-child(6) {
   color: #6685f5;
   inset: 4.5rem;
   -webkit-animation-delay: 1s;
   animation-delay: 1s;
 }

 .icon__rainbow-arc:nth-child(7) {
   color: #6a38e1;
   inset: 5.4rem;
   -webkit-animation-delay: 1.2s;
   animation-delay: 1.2s;
 }

 .icon__snow {
   position: absolute;
   top: 12.8rem;
   left: 0;
   width: 100%;
   height: 10rem;
   overflow: hidden;
 }

 .icon__snow-flakes {
   position: absolute;
   top: 0;
   left: 13rem;
   height: 0.8rem;
   width: 0.8rem;
   background: #fff;
   -webkit-animation: snow 3s linear infinite;
   animation: snow 3s linear infinite;
   transform: translateY(-12rem) rotate(45deg);
   opacity: 0.5;
   color: #fff;
   box-shadow: 1rem 2rem, 1rem 7rem, 4rem 8rem, -5rem 8rem, -2rem 4rem, 0rem 11rem, 4rem 5rem, -2rem 8rem, 4rem 3rem 0 -0.1rem, 0rem 5rem 0 -0.1rem, -4rem 5rem 0 -0.1rem, -2rem 10rem 0 -0.1rem, -1rem 3rem 0 -0.2rem, 2rem 5rem 0 -0.2rem, -2rem 11rem 0 -0.2rem, 2rem 9rem 0 -0.2rem, -4rem 3rem 0 -0.2rem;
 }

 .icon__rain {
   position: absolute;
   top: 12.8rem;
   left: 0;
   width: 100%;
   height: 10rem;
   overflow: hidden;
 }

 .icon__rain-drops {
   position: absolute;
   top: 0;
   left: 13rem;
   height: 0.6rem;
   width: 0.6rem;
   background: #7a98e9;
   -webkit-animation: snow 3s linear infinite;
   animation: snow 3s linear infinite;
   -webkit-animation-delay: 1s;
   animation-delay: 1s;
   transform: translateY(-12rem) rotate(45deg);
   opacity: 1;
   color: #7a98e9;
   box-shadow: 1rem 2rem, 1rem 7rem, 4rem 8rem, -5rem 8rem, -2rem 4rem, 0rem 11rem, 4rem 5rem, -2rem 8rem, 4rem 3rem 0 -0.1rem, 0rem 5rem 0 -0.1rem, -4rem 5rem 0 -0.1rem, -2rem 10rem 0 -0.1rem, -1rem 3rem 0 -0.2rem, 2rem 5rem 0 -0.2rem, -2rem 11rem 0 -0.2rem, 2rem 9rem 0 -0.2rem, -4rem 3rem 0 -0.2rem;
   border-radius: 0 1rem 1rem;
 }

 .icon__sun {
   position: absolute;
   top: 1rem;
   right: 3.5rem;
   height: 5rem;
   width: 5rem;
   background: linear-gradient(45deg, #f09559 40%, #f0ca43);
   border-radius: 50%;
   filter: drop-shadow(0 0 .5rem rgba(239, 218, 144, 0.4)) drop-shadow(0 0 30px rgba(240, 202, 67, 0.4));
 }

 .icon__sun-lights {
   position: absolute;
   inset: 0;
   -webkit-animation: rotation 6s linear infinite;
   animation: rotation 6s linear infinite;
 }

 .icon__sun-light {
   position: absolute;
   top: -2.75rem;
   left: 50%;
   margin-left: -0.45rem;
   border-radius: 1rem;
   width: 0.9rem;
   height: 2.5rem;
   background: linear-gradient(45deg, #f0b343, #f0ca43);
   transform-origin: 50% 5.25rem;
 }

 .icon__sun-light:nth-child(2) {
   transform: rotate(45deg);
 }

 .icon__sun-light:nth-child(3) {
   transform: rotate(90deg);
 }

 .icon__sun-light:nth-child(4) {
   transform: rotate(135deg);
 }

 .icon__sun-light:nth-child(5) {
   transform: rotate(180deg);
 }

 .icon__sun-light:nth-child(6) {
   transform: rotate(225deg);
 }

 .icon__sun-light:nth-child(7) {
   transform: rotate(270deg);
 }

 .icon__sun-light:nth-child(8) {
   transform: rotate(315deg);
 }

 .icon__thunder {
   position: absolute;
   top: 10rem;
   left: 50%;
   margin-left: -2.4rem;
   width: 4.8rem;
   height: 8.6rem;
   filter: drop-shadow(0px -1px 0px #cfb8e5) drop-shadow(0px 0px 0px #9a4ee7) drop-shadow(-2px -2px 1px #3c3762) drop-shadow(4px 1px 1px #3c3762);
   -webkit-animation: thunder 3s infinite, floating 3s infinite;
   animation: thunder 3s infinite, floating 3s infinite;
 }

 .icon__thunder:before,
 .icon__thunder:after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   background: #645d95;
   height: 5rem;
   width: 3rem;
   border-radius: 0.4rem;
   box-shadow: inset -0.2rem -0.4rem 0.2rem #3c3762, inset -0.1rem -0.1rem 0.4rem #fff;
   -webkit-clip-path: polygon(100% 100%, 0% 100%, 100% 0);
   clip-path: polygon(100% 100%, 0% 100%, 100% 0);
 }

 .icon__thunder:after {
   top: auto;
   bottom: 0;
   left: auto;
   right: 0;
   -webkit-clip-path: polygon(0% 100%, 100% 0%, 45% 0%, 0% 26%);
   clip-path: polygon(0% 100%, 100% 0%, 45% 0%, 0% 26%);
   box-shadow: inset 0.2rem 0.3rem 0.2rem #3c3762, inset 0.1rem 0.2rem 0.4rem #fff;
 }

 .icon__cloud {
   position: absolute;
   left: 0;
   top: 1rem;
   width: 18rem;
   height: 12rem;
   background: rgba(255, 255, 255, 0.45);
   opacity: 1;
   -webkit-backdrop-filter: blur(.4rem);
   backdrop-filter: blur(.4rem);
   -webkit-clip-path: url(img/);
   clip-path: url(img/);
   box-shadow: inset 0rem -1.3rem 0.25rem -1rem #fff, inset 0rem 0rem 5rem 0rem #ffffff4d;
 }

 .weather--snow .icon__cloud {
   background: rgba(100, 130, 197, 0.45);
 }

 .weather--thunder .icon__cloud {
   background: rgba(116, 116, 116, 0.45);
 }

 .weather--rainbow .icon__cloud {
   background: #4a6676;
 }

 .icon__cloud-reflect {
   height: 12rem;
   width: 11.9rem;
   border-radius: 50%;
   box-shadow: inset 0rem -1.1rem 0.25rem -1rem #fff, inset 0.45rem 0rem 0.25rem -0.25rem #fff, inset -0.45rem 0.5rem 0.25rem -0.45em #fff, inset 0.25rem 0.25rem 0.5rem 0rem rgba(0, 0, 0, 0.3);
   -webkit-clip-path: polygon(0 0, 100% 0%, 100% 33%, 50% 30%, 50% 100%, 0% 100%);
   clip-path: polygon(0 0, 100% 0%, 100% 33%, 50% 30%, 50% 100%, 0% 100%);
 }

 .icon__cloud-reflect--2 {
   position: absolute;
   width: 8.7rem;
   height: 8.7rem;
   bottom: 0.1rem;
   right: 0.5rem;
   -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 50% 100%, 29% 0%);
   clip-path: polygon(0 0, 100% 0%, 100% 100%, 50% 100%, 29% 0%);
 }

 .icon__cloud-shadow {
   position: absolute;
   left: 30rem;
   top: -30rem;
   width: 18rem;
   height: 9rem;
   border-radius: 50%;
   box-shadow: -36rem 38rem 7rem #00000054;
   z-index: -1;
 }

 .icon__cloud-svg clipPath {
   transform: scale(0.65);
 }

 .ti-container,
 .ti-cursor {
   /* display: inline-block; */
   display: block;
   min-height: 4.32rem;
 }

 .ti-cursor {
   position: relative;

   background: linear-gradient(to right, #c30009, #c30009, #c30009);
   background-clip: border-box;
   -webkit-background-clip: text;
   color: transparent;
 }

 .ti-cursor:after {
   content: '|';
   /* bottom: .2rem;
   right: -1.5rem;
   position: absolute; */
   line-height: normal;
   font-size: 2.8rem;
   animation: blink 1s infinite;
   margin-left: .25rem;
   position: relative;
   top: -0.25rem;

   /* background: linear-gradient(to right, #004BD6, #3ABCCF, #06F842);
   background-clip: border-box;
   -webkit-background-clip: text;
   color: transparent; */
   color: #c30009;
 }


 @keyframes blink {
   0% {
     opacity: 1
   }

   50% {
     opacity: 0
   }

   100% {
     opacity: 1
   }
 }

 .sticky1_ul {
   display: flex;
   justify-content: space-between;
   color: #595959;
 }

 .sticky1_ul li {
   position: relative;
 }

 .sticky1_ul i {
   position: absolute;
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   transition: all .3s ease-in;
   opacity: 0;
 }

 .sticky1_ul i img {
   width: 5.5rem;
 }

 .sticky1_ul p {
   font-size: .8rem;
   position: relative;
 }

 .sticky1_ul div {
   transition: all .3s ease-in;
   font-weight: bold;
   position: relative;
   margin-top: .3rem;
 }


 .sticky1_ul .sticky1_t1 {
   font-size: 2.9rem;
 }

 .sticky1_ul .sticky1_t2 {
   font-size: 0.6rem;
 }

 .sticky1_ul .sticky1_t3 {
   font-size: 2.2rem;
 }

 .sticky1_ul li:hover i {
   opacity: 1;
 }

 .sticky1_ul li:hover div {
   background: linear-gradient(to right, #c90b12, #f8b62c);
   -webkit-background-clip: text;
   color: transparent;
 }

 .sticky1_iconp {
   width: 100%;
   height: 100vh;
   display: flex;
   align-items: end;
   justify-content: center;
   position: absolute;
   left: 0;
   top: 0;
   padding-bottom: .9rem;
   transition: transform .8s cubic-bezier(.215, .61, .355, 1), opacity 1s ease-out;
   transition-delay: .6s;

 }

 html.on1.off .sticky1_iconp {
   opacity: 0;
   z-index: -1;
 }

 html.on1 .sticky1_iconp {
   transition: transform .6s cubic-bezier(0, 0, 0.2, 1), opacity .6s ease-out;
   transition-delay: .8s;
 }

 html.on1.off .sticky1_iconp {
   transition: transform .4s cubic-bezier(0, 0, 0.2, 1), opacity .4s ease-out;
   transition-delay: 0s;
 }


 /* #endregion */
 /* #region  响应式*/
 @media screen and (max-width: 1699px) {
   .sticky1_left .sticky1_h2 {
     font-size: 3rem;
   }

   .sticky1_left .sticky1_h3 {
     font-size: 2rem;
   }


   .sticky1 {
     height: 105rem;
   }

   /* .ti-cursor:after {
     bottom: 0.5rem;
   } */

   .sticky1_ul .sticky1_t1 {
     font-size: 2.7rem;
   }

   .sticky1_ul .sticky1_t2 {
     font-size: .7rem;
   }

   .sticky1_ul .sticky1_t3 {
     font-size: 2.1rem;
   }
 }

 @media screen and (max-width: 1449px) {
   .sticky1_left {
     width: 55%;
   }

   .sticky1 {
     height: 108rem;
   }

   /* .ti-cursor:after {
     bottom: 0.4rem;
   } */
 }

 @media screen and (max-width: 1249px) {
   .sticky1_left .sticky1_h2 {
     font-size: 2.5rem;
   }

   .sticky1_left .sticky1_h3 {
     font-size: 1.8rem;
   }

   .sticky1 {
     height: 111rem;
   }

   .sticky1_left .sticky1_h3 {
     margin-bottom: 3rem;
   }

   .ti-cursor:after {
     /* bottom: 0.6rem;  */
     top: 0;
   }

   .sticky1_ul .sticky1_t1 {
     font-size: 2.4rem;
   }

   .sticky1_ul .sticky1_t2 {
     font-size: .8rem;
   }

   .sticky1_ul .sticky1_t3 {
     font-size: 1.8rem;
   }
 }

 @media screen and (min-width: 768px) and (max-width: 1024px) {
   .picture_top {
     display: none;
   }

   .sticky1 {
     position: relative;
   }

   .sticky1_left {
     padding-top: 7rem;
     padding-bottom: 2rem;
   }

   .sticky1 {
     height: auto;
   }

   .sticky2 {
     padding-top: 5rem;
     padding-bottom: 5rem;
   }

   .sticky2 img {
     padding: 2rem 0;
   }

   /* .sticky2 img {
     width: 28rem;
   } */

   .sticky1_left {
     opacity: 1 !important;
   }

   body {
     height: auto !important;
   }

   .sticky1_ul {
     flex-wrap: wrap;
   }

   .sticky1_ul li {
     width: 50%;
     margin-top: 1rem;
   }

   .sticky1_left .sticky1_p {
     margin-bottom: 1.5rem;
   }

   .sticky1_iconp {
     display: none;
   }

   /* .sticky1_iconp{
    height: auto;
    position: relative;
    opacity: 1 !important;
   } */

 }

 @media screen and (max-width: 767px) {
   .picture_top {
     display: none;
   }

   .sticky1 {
     position: relative;
   }

   .sticky1_left {
     padding-top: 7rem;
   }

   .sticky1 {
     height: auto;
   }

   .banner {
     height: 45rem;
   }

   .sticky1_left {
     width: 100%;
   }

   .sticky1_left {
     padding-top: 3.5rem;
     padding-bottom: 2rem;
   }

   .sticky1_left .sticky1_h2 {
     font-size: 2.1rem;
     margin-bottom: 1.2rem;
   }

   .sticky1_left .sticky1_h3 {
     margin-bottom: 2.5rem;
   }

   .sticky1_left .sticky1_h3 {
     font-size: 1.6rem;
   }

   .sticky1_icon {
     display: none;
   }

   .sticky2 {
     padding-bottom: 4rem;
   }

   .banner_con {
     height: auto;
   }

   /* .ti-cursor:after {
     bottom: 0.9rem;
   } */

   .sticky1_left {
     opacity: 1 !important;
   }

   body {
     height: auto !important;
   }

   .mysticky {
     margin-top: 1rem;
   }

   .sticky1_ul {
     flex-wrap: wrap;
   }

   .sticky1_ul li {
     width: 50%;
     margin-top: 1rem;
     margin-bottom: 1rem;
   }

   .sticky1_left .sticky1_p {
     margin-bottom: 1.5rem;
     padding-right: 0;
   }

   .sticky1_ul p {
     font-size: 1.2rem;
   }

   .sticky1_ul .sticky1_t1 {
     font-size: 2.8rem;
   }

   .sticky1_ul .sticky1_t2 {
     font-size: 1rem;
   }

   .sticky1_ul .sticky1_t3 {
     font-size: 2rem;
   }

   .ti-cursor:after {
     font-size: 2.4rem;
   }

   .sticky2 img {
     width: 100%;
   }

 }

 .banner .banner_text {
   opacity: 0;
   transition: ease-out .5s;
   text-align: center
 }



 html.off .banner .banner_text {
   opacity: 1;
 }

 .sticky2_con {
   position: relative;
 }


 .sticky2_bg {
   width: 100%;
   position: absolute;
   left: 0;
   /* top: 50%;
   transform: translateY(-50%); */
   bottom: 0;
 }

 .sticky2_bg img {
   width: 100%;
   transition: .1s;
   position: relative;
 }

 .sticky2_con .width {
   position: relative;
   z-index: 1;
 }

 html.off .picture_top {
   z-index: 0;
 }

 html.off .mysticky {
   /* z-index: -1; */
   z-index: 0;
 }

 html.on1.off .sticky2_bg {
   opacity: 0;
   /* transition: ease-out .8s; */
   transition: transform .4s cubic-bezier(0, 0, 0.2, 1), opacity .4s ease-out;
   transition-delay: 0s;
 }

 html.on1 .sticky2_bg {
   /* transition: ease-out .8s; */
   transition: transform .6s cubic-bezier(0, 0, 0.2, 1), opacity .6s ease-out;
   transition-delay: .8s; 
 }


 html.off .sticky2 {
   z-index: 0;
 }

 .banner_up2 {
   z-index: 20;
 }


 /* #endregion */