/**001***********/
:root {
    --webColor: #333;
}
:root {
    --webColor2:#3b45fd;
}
:root {
  --fff:#fff;
}
html,body{width:100%;height:100%;margin:0;padding: 0;cursor:default;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body *{max-height:99999999px;border-radius:0;margin:0;padding:0;list-style:none;font-style:normal;border:0; }
a{cursor:pointer;text-decoration:none;color:#333;outline:none;}
a:hover{color:var(--webColor); }
.cfx{zoom:1}
.cfx:after{display:block;visibility:hidden;clear:both;height:0;content:' '}
body{font-family:Arial,Helvetica,Verdana,"Helvetica Neue",Helvetica,"Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;font-size:12px;line-height:1;color:#333;background:#fff;}


/*****公共********/

.header{width:100%;  padding: 0;  position:relative; z-index: 9999; margin: 0 auto; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); background: #fff;}
.nav-container {padding:0 10px;}
.nav {max-width: 1200px;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;position: relative;}
.logo{color:var(--webColor);font-weight:bold;line-height: 80px; display: inline-block; text-align: center;}
.logo i{width:130px;display: inline-block; }
.logo i img{width:100%;vertical-align: middle;}
.logo h1,.logo h2,.logo strong{display:none;vertical-align: middle;line-height: 80px;font-size:1.5rem;color:var(--webColor); }
.nav-menu{display:flex;list-style:none;}
.nav-item{margin:0 20px;position: relative;}
.nav-link{color:var(--webColor);text-decoration:none;font-size:1.3rem; transition:color 0.3s; }
.nav-link:hover{color:var(--webColor2)}
.nav-item span{ display: none;position: absolute; z-index:5000;  top:98%;left: 50%;transform: translate(-50%, 0); width: auto;  background: var(--webColor); padding: 20px 10px 10px 10px;box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2); border-radius: 0 0 4px 4px;}
.nav-item:hover span{display: block;}
.nav-item span a{display: inline-block; width: 100%; height: 100%;white-space: nowrap; font-size: 14px; line-height:2;color:var(--fff);}
.nav-toggle{color:var(--webColor);font-size:28px;line-height:1}
.nav-toggle[type="checkbox"]{display:none}
.nav-toggle:not([type="checkbox"]){display:none;cursor:pointer}

.navr{display:flex;list-style:none}
.navrbtn a,.language{display:block; float: right;  padding: 15px 15px; border-radius:50px; position: relative; line-height: 1; background:rgba(255, 255, 255,.7); font-size: 12px; color: #587fcb; margin-left: 10px; font-size: 16px; z-index: 99999;box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);}
.navrbtn a:hover{opacity: .8;}
.language:hover span{display: block;}
.language span{position: absolute;z-index:99999; top:0 !important; left: 0 !important; background: #fff;border: 1px solid #eee; padding:5px;width:calc(100% - 10px); display: none;word-wrap: break-word; }
.language span a{width: auto !important; display: block; line-height:2 !important; text-align: center;font-size: 12px !important;  font-weight: normal; height: auto !important; color: #333;}
.language span a:hover{color: #D20029;}





.footer{width:100%; display: block;    position: relative; margin: 20px auto; background:#000; box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3); border-top: 1px solid #ccc;}
.footNav{width: 100%;max-width:1200px;display: block;margin: 0 auto; color: #fff;padding: 30px 0;}

.footlogo{width:calc( 40% - 40px); display: block; float: left; padding-right: 40px; line-height: 1.4; }
.footlogo h3{ line-height: 2; font-size: 22px;}
.footLinkBox{width: 60%;  float: left;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.footLink .footLinkTitle{ font-weight: bold;line-height: 2;font-size:18px;}
.footLink a{color: #fff; line-height: 2;}
.footLink a:hover{text-decoration: underline;}
.foot{width: 100%;max-width:1200px;display: block; margin: 0 auto; border-top: 1px solid #eee; color: #fff; text-align: center; padding: 30px 0;}
.foot a{color: #fff;}
.foot a:hover{text-decoration: underline;}


.webMap{width:100%; max-width: 1200px; display:block;margin: 0 auto; overflow: hidden; padding: 30px 0;}
.webMap li{ display: inline-block;}
.webMap li::after{content: "  >  "; color: #aaa;}
.webMap li:last-child::after,.webMap li:first-child::after{content:"";}

.wordKey{font-weight: bold; background-color: #dc1662db; color: #fff; padding:2px 5px; margin: 0 3px; border-radius: 4px;}
.wordKey:hover{ background-color: #8b2708;color: #fff;}

.tophr{width:100%; height: 100px; display: block; margin: 0 auto;}
/***index****/
.vbg{width: 100%;   display: block; margin: 0 auto;background-image: linear-gradient(to right, #3350ed, #cc5ce8);}
.vbg img{width: 100%;display: block; }



.topConBox{width: 100%;   display: block; margin: 0 auto; padding:0px; position: relative;background-image: linear-gradient(to right, #9dbbf8, #9dbbf8); }
.topConBoxZ{width: 100%; max-width: 1200px; display:block;margin: 0 auto; position: relative;}

.topimg{width:100%; display: block; margin: 0 auto; position: relative; text-align: center; padding: 80px 0;}
.topimg video{width:705px;}

.topconZ{width:100%;height:106%;display:block;position:absolute;z-index:1;top:-6%;left:0;animation:rotateAnimation 2s infinite linear;opacity:.3;border-radius:65% 76% 70% 76%;background:#00b9fb}
.topconZ2{width:100%;height:106%;display:block;position:absolute;z-index:1;top:-1%;left:0;animation:rotateAnimation 3s infinite linear;opacity:.3;border-radius:65% 76% 70% 76%;background:#00b9fb}




.toptextwra{width:100%;display: block;  text-align:center;position: relative; float: left; padding:80px 0 50px 0;  }
.toptextwra h2{font-size:52px; line-height: 1.6;padding-bottom:10px; color: #333; }
.toptextwra h2 i{display: inline-block;color: transparent;background-image: linear-gradient(to right, #3191ff, #cb00eb); -webkit-background-clip: text;background-clip: text; }
.toptextwra p{font-size: 20px; line-height: 1.6; color: #333;}
.toptextwra p img{width: 160px;}
.toptextwra a{ background-image: linear-gradient(to right, #fff, #fff); padding: 20px 30px; display:inline-block; margin-top: 20px; margin-right: 20px; border-radius:12px; color: var(--webColor2); cursor: pointer; position: relative; overflow: hidden; font-size: 22px; font-weight: bold; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);}
.toptextwra a i{ width: 5px; height: 5px; display: block; position: absolute; z-index: 1; background:rgba(255, 255, 255,.9);top: 50%;left: 50%;transform: translate(-50%, -50%); border-radius: 150%;  animation: pulse-and-fade 2s infinite;}
.toptextwra a:hover{ opacity: .8;}
.toptextwra p.etips{ font-size: 14px; color: var(--webColor);padding: 20px 0  10px 0;}
.toptextwra p.etips2{font-size: 14px; color: #999;}
.toptextwra p.etips2 i{color: #333; margin-right: 20px;}

.infopic{width:100%; max-height: 330px;  margin:0 auto;display: block; position: relative; padding: 0px 0; overflow: hidden; text-align: center;}
.infopic img{width: 100%; max-width:800px; margin:0 auto; padding: 0;}

.ppv{width:15%; top: 50%;left:11%;transform: translate(0, -50%);  display: block; position: absolute; z-index: 10;}
.ppv img.vb{width: 100%; display: block;}
.ppv img.vb2{width: 60%; display: block; position: absolute; top: 50%;left:50%;transform: translate(-50%, -50%); z-index: 501;}


.infoinpl{width:calc(100% - 80px); max-width: 1200px; padding:40px 40px 0px 40px; margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:40px;}
.infoinplx{ text-align: center;}
.infoinplx img{max-width: 100%;}
.infoinplx b{font-size: 24px;display: block;margin-bottom: 10px;}
.infoinplx p{ padding-bottom: 10px;}
.infoinplx a{padding: 15px 20px; background: var(--webColor); color: #fff; margin-top: 10px; display:inline-block; border-radius: 4px;font-size: 16px;}
.infoinplx a i{margin-right: 5px;}
.infoinplx a:hover{opacity: .8;}




.infoBox {width: 100%;  display: block; margin: 0 auto; padding:0; position: relative;}
.infos{width:100%; margin:0 auto; position: relative;  }

.lart{width:100%; display: block;   margin: 100px auto; position: relative; padding: 150px 0; background: #a5cad5; color: #333;}
.lart p{width:100%; max-width: 1200px;margin: 0 auto; display: block;  text-align: center;  text-align: center;}
.lart p b{font-size: 48px; display: block;line-height: 1.2; }
.lart p span{font-size: 16px; display: block; line-height:1.8; opacity: .8; padding-top: 10px;}

.lartArt{width:100%;max-width: 1200px; display: block;   margin: 0 auto; position: relative; padding: 40px 0;}
.lartArt i{width:50%;display: block;float: left; }
.lartArt i img{width: 100%; border-radius: 60px;}
.lartArt p{width:calc(50% - 80px); display: block;float: left; text-align: left;padding: 80px 40px 0 40px;}
.lartArt p b{font-size: 38px; display: block;line-height: 1.2; }
.lartArt p span{font-size: 20px; display: block; line-height:1.8; opacity: .8; padding-top: 10px;}
.rh p{text-align: left;}

.miframe{width: 60%; max-width: 1200px; height:420px;display: block; margin: 0 auto;padding:60px 60px;background: #d0e3ff;border-radius: 40px;}
.miframe iframe{width: 100%; height: 100%; display: block;}
.mqnum{width:calc(100% - 80px); max-width: 1200px; padding: 0 40px; margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:40px; color: var(--webColor); text-align: center;font-size:22px;}
.mqnum i{font-size:92px;font-weight: bold;}
.mqnum span{display: block;color: #333;}


.sh2{width: 100%;display: block; margin: 0 auto; font-size: 38px; text-align: center; padding:80px 0 50px 0;}

.lartList{width:100%;max-width: 1200px;  margin: 0 auto; position: relative;display:grid;grid-template-columns:repeat(2,1fr);gap:60px; padding: 40px 0 60px 0; }
.lartList p{ text-align: center; padding: 20px; box-shadow: 0px 0px 15px rgba(0,0,0,0.2); border-radius: 40px;}
.lartList p i{display: block; font-size:120px;}
.lartList p i img{width: 70%;}
.lartList p b{display: block; font-size: 34px; line-height: 2; padding-top: 10px;}
.lartList p span{color: #777; font-size: 14px; line-height: 1.6;}

/**分页**/
#pagination {width: 100%;text-align: center;display: block;}
#pagination .page-button{display: inline-block; padding: 10px 20px;border: 1px solid #ccc; background-color: #fefefe; margin:0 10px 60px 10px; cursor: pointer; border-radius: 4px; }
#pagination .page-button:hover{ background-color:#eee;}

/**新闻列表**/
.inewslist{width:calc(100% - 80px); max-width: 1200px; padding: 0 40px; margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
.inewslist li{background-color:#f9f9f9;padding:20px 20px 10px 20px;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,0.1)}
.inewslist li i{width: 100%; aspect-ratio: 16 / 9; display: block; border-radius: 8px; overflow: hidden; position: relative;}
.inewslist li i img{width: 100%;min-height: 100%;  position: absolute;z-index: 1; top: 50%;left: 50%;transform: translate(-50%, -50%);}
.inewslist li h3{padding: 10px 0 0 0;display: block; font-size:18px; line-height: 1.4;}
.inewslist li p{font-size: 14px;line-height: 1.4;}
.inewslist li span{ padding: 10px 0;display: block;}
.inewslist li span a{ background: #eee; padding:10px 5px; display: inline-block; margin: 0 5px 5px 0; border-radius: 4px;color: #666;}
.inewslist li span a:hover{ background-color: #ddd;}

.newsPage{width:100%;max-width:1200px;display: block; margin:0 auto;}
.newsPage h1{ display: block; text-align: center;padding: 20px 0; font-size: 42px;color: var(--webColor); line-height: 1.4;}
.tip{width:100%;display: block; text-align: center; border-bottom: 1px solid #eee;padding: 20px 0; color: #999; }
.tip i{ margin: 0 20px;}
.des{display: block; text-align: center; line-height: 1.4;padding:0; color: #999;}
.NewsPageConten{width:calc(100% - 40px); display: block;margin:0 auto; font-size: 16px; line-height: 1.6;padding: 20px 20px;}
.NewsPageConten h1,.NewsPageConten h2{ padding: 20px 0;color:#dc043a;}
.NewsPageConten h3,.NewsPageConten h4,.NewsPageConten h5{ padding: 20px 0;color:var(--webColor);}
.NewsPageConten img{max-width: 100% !important;}
.NewsPageConten a.pageTag{ background: #dc043a; color: #fff; border-radius: 4px; padding: 2px 5px;}
.NewsPageConten a.pageTag:hover{background: #8b2708;}
.contentKey{width:calc(100% - 40px);display: block; padding: 20px 20px;}
.contentKey a{background: #eee; padding:10px 10px; display: inline-block; margin: 0 5px 5px 0; border-radius: 4px; color: #666;}
.contentKey a:hover{ background-color: #ddd;}

/**faqlist**/
.qa-list{width:100%;max-width:1200px;display: block; margin:0 auto;  }
.qa-list h2{width:100%; display: block; padding: 10px 0 20px 0; text-align: center;color: var(--webColor);}
.qa-lists{width:calc(100% - 40px);max-width:1200px;display: block; margin:0 auto; padding: 20px 20px; border-top: 1px solid #fff; background-color: #f5f5f5;border-radius: 8px;}
.qa-lists p{font-size: 14px; padding-top: 10px; line-height: 1.4;}






.mxe{width: calc(100% - 40px); display: block; margin: 0 auto; position: relative; background: var(--webColor); color: #fff;text-align: center; padding:120px 20px;}
.mxe h2{width:100%; display: block;margin: 0 auto; padding: 0; text-align: center;color: #fff; font-size: 32px; line-height: 1.2;}
.mxe p{ line-height: 2; font-size: 18px; margin-top: 10px;}
.mxe a{width: 220px; display: block;margin: 0 auto; padding: 20px 20px; text-align: center; background: #fff; color: var(--webColor); margin-top: 20px; border-radius: 4px; font-size: 18px;}
.mxe a:hover{ background: #eee;}

.mxe2{width: calc(100% - 40px); display: block; margin: 0 auto; position: relative; background:url('/images/dc1.webp') center center no-repeat; background-size: cover; color:var(--webColor);text-align: center; padding:220px 20px;}
.mxe2 h2{width:100%; display: block;margin: 0 auto; padding: 0; text-align: center;color: var(--webColor); font-size: 62px; line-height: 1.2;}
.mxe2 p{ line-height: 2; font-size: 18px; margin-top: 10px;}
.mxe2 a{width: 220px; display: block;margin: 0 auto; padding: 20px 20px; text-align: center; background:var(--webColor); color: var(--fff); margin-top: 20px; border-radius: 4px; font-size: 18px;}
.mxe2 a:hover{ background:var(--webColor2);}

.tut{width: 100%; height: auto; display: block;margin: 0 auto; position: absolute; z-index: 1; top: -2px; left: 0;}
.tut img{ width: 100%; display: block; float: left;}

.swiper {
    width: 100%;
    position: relative;
    overflow: hidden;
    height: 680px;
    display: block;
  }
.swiper-slide img{width: 100%; min-height: 100%; position: absolute; z-index: 1;top:50%;left:50%; transform: translate(-50%, -50%);}
  .thumbnails {
   position: relative;

   width: 100%;
   
   display:grid;grid-template-columns:repeat(2,1fr);gap:0px;
  }
  .thumbnails .atv{background:var(--webColor);color: #fff;}
  .thumbnails .atv a{background:var(--webColor);color: #fff;}
  .thumbnail {
    cursor: pointer;
   display: block;
   color: #333;
   font-size: 16px;
   line-height: 1.4;
   padding:30px 30%;
   background:#f5f5f5;

  }
  .thumbnail b{font-size: 28px; line-height: 1.5;}
  .thumbnail a{color: #333;}

.translateSelectLanguage{display: none !important;}





@media (max-width:1100px) {
  .toptextwra h2{font-size:48px; }
.toptextwra p{font-size: 20px;}
.toptextwra a{font-size: 16px;}

  .swiper {height: 550px;}
  .thumbnails{ display:grid;grid-template-columns:repeat(2,1fr);gap:0px; width: 100%;}
  .thumbnail b{font-size: 22px; line-height: 1.2;}
}

@media (max-width:960px) {
    .inewslist{grid-template-columns:repeat(2,1fr);gap:10px}
    
    
    .swiper {height: 400px;}
    .toptextwra h2{font-size:38px; }
    .toptextwra p{font-size: 20px;}
    .toptextwra a{font-size: 14px;}

   

}
@media screen and (max-width: 860px) {
  .header{background: #fff; top: 0;}
  .nav-toggle{  left: inherit; background: var(--webColor); color: #fff; padding: 9px; border-radius: 4px;}
  .nav-toggle:not([type="checkbox"]){display:block}
  .nav-menu{display:none;width:calc(100% - 40px);position:absolute;z-index: 99999; top:100%;right: 0;background:#fff;flex-direction:column;padding:10px 20px; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3); border-radius: 0 0 8px 8px;}
  .nav-menu a{display:block;color: var(--webColor); font-weight: bold;}
  .nav-item{margin:1rem 0}
  .nav-item span{ display: block;position: relative; z-index:5000;  top:0;left:0;transform: translate(0, 0); width: auto;  background: #fff; padding: 10px 0 0 10px;box-shadow: 0 0 0 rgba(0, 0, 0, 0); border-radius: 0;}
  .nav-item span a{ color: var(--webColor);}
  .nav-toggle:checked ~ .nav-menu{display:flex}
  .navr{width:auto; padding: 0 0 0 0; position: absolute; top: 50%;right: 60px;transform: translate(0, -50%); }
  .navr .language{display:none;}
  .topConBox{height: 500px; overflow: hidden;}
  .toptextwra{width:calc(100% - 40px); padding: 0px 20px;}
  .toptextwra h2{font-size:28px; padding-top: 20px; }
  .toptextwra p{font-size: 18px;}
  .toptextwra a{font-size: 14px; z-index: 100;}

  .topimg video{width:100%}
  .infopic{width:100%;  margin:0 auto;display: block;position: relative; top: 0; right:0; z-index: 1;transform: rotate(15deg);}

  .lartList{width:calc(100% - 40px);max-width: 1200px;  margin: 0 auto; position: relative;display:grid;grid-template-columns:repeat(1,1fr);gap:40px; padding: 40px 20px 60px 20px;}
.lartList p{ text-align: center; padding: 20px;}
.lartList p i{display: block; font-size:100px;}
.lartList p b{display: block; font-size: 24px; line-height: 2; padding-top: 10px;}
.lartList p span{color: #777; font-size: 14px;}
.mqnum{width:calc(100% - 80px); max-width: 1200px; padding: 0 40px; margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:40px; color: var(--webColor); text-align: center;font-size:22px;}
.infoinpl{grid-template-columns:repeat(2,1fr);gap:40px;}
.lartArt i{width:100%;}
.lartArt p{width:calc(100% - 80px); }

}
@media screen and (max-width: 768px) {
    body,.header{min-width:340px;}
    
    
    .inewslist{grid-template-columns:repeat(2,1fr);gap:10px}



    .toptextwra h2{font-size:28px; }
    .toptextwra p{font-size: 16px;}
    .toptextwra a{font-size: 12px;}

    .footNav{display: none;}



   .thumbnail b{font-size: 20px; line-height: 1.2;}
   .swiper {
    width: 100%;
    position: relative;
    overflow: hidden;
    height: 400px;
    display: block;
  }

}
@media (max-width:640px) {

    .newsPage h1{ font-size: 22px;}
    .inewslist{grid-template-columns:repeat(1,1fr);gap:40px}
    .infos{grid-template-columns:repeat(1,1fr);gap:40px}
    
    .thumbnails{display:grid;grid-template-columns:repeat(1,1fr);gap:0px; width: 100%;}
    .thumbnail{padding:30px 10%;}
    .topCon2{height:400px}
}

@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
    transform-origin: center;
  }
  to {
    transform: rotate(359deg);
    transform-origin: center;
  }
}

  @keyframes rotate3d{
    0%{-webkit-transform:rotateY(0deg);
    transform:rotateY(0deg)}
    3%{-webkit-transform:rotateY(360deg);
      transform:rotateY(360deg)}
      7%{-webkit-transform:rotateY(0deg);
        transform:rotateY(0deg)}
        100%{-webkit-transform:rotateY(0deg);
          transform:rotateY(0deg)}
}

@keyframes pulse-and-fade {
  0% {
    transform: scale(1); /* 初始和结束状态都是原始大小 */
    opacity: .2; /* 初始和结束状态都是完全不透明 */
    transform-origin: center;
  }
  100% {
    transform: scale(18); /* 中间状态放大 */
    opacity: 0; /* 中间状态半透明 */
    transform-origin: center;
  }
}
@keyframes colorChange {
  0% {
    color:#5d5bd4;
  }
  50% {
    color: rgb(155, 0, 245);
  }
  100% {
    color:#5d5bd4;
  }
}



/**app***/
.apps_windows{width: 100%; display: block;margin: 0 auto; text-align: center; padding-top: 80px; padding-bottom: 80px;}
		.apps_windows h1{ font-size: 38px; font-weight: bold; padding: 20px 0;}
		.apps_windows p{ font-size: 14px; padding: 10px 0; color: #666; width: 90%;max-width: 900px; display: block;margin: 0 auto; line-height: 1.6;}
		.appdow{ width: auto; height: 40px; line-height: 40px; display: inline-block; background:var(--webColor2); font-size: 28px; color: #ffffff; padding: 15px 40px; border-radius: 8px; margin: 20px 0; }
		.appdow:hover{ color: #ffffff; background: #1c32ad;}
		.apps_info{width:90%; display: block; max-width: 900px; margin: 0 auto; padding: 60px 0;}
		.appsinfox{width:calc(100% - 15px);  margin: 0 auto;border-left: 5px solid var(--webColor); display: block; float: left; padding-left: 10px; margin-bottom: 30px;}
		.appsinfox h2{ font-size: 32px; font-weight: bold; line-height: 2;}
		.appsinfox p{ font-size: 14px; line-height: 1.4;}
		.apps_info h3{ font-size: 22px;font-weight: bold;display: block; float: left; padding: 10px 0;}
		.apps_dows{ width: 100%; display: block; float: left;vertical-align: middle;margin:5px 0;}
		.apps_dows i{width:12px; height: 12px; overflow: hidden; display: inline-block;  line-height:1px;  margin-right:5px; border-radius: 50px;background-color:var(--webColor);}
		.apps_dows h4{display: inline-block; line-height:30px;vertical-align: middle; font-size: 16px; color:var(--webColor) }
		.apps_dows a:hover h4{text-decoration-line: underline;}
        .app_img{width: 50%; max-width: 500px; border-radius: 10px; overflow: hidden; display: inline-block;}
        .app_img img{border-radius: 10px; overflow: hidden;}