/**001***********/
:root {
    --webColor: #4c56db;
}
:root {
    --webColor2:#7884ef;
}
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,"PingFang SC","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; margin: 0 auto; background:#fff; box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);z-index:600; }
.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:40px;display: inline-block; }
.logo i img{width:100%;vertical-align: middle;}
.logo h1,.logo h2{display:inline-block;vertical-align: middle;line-height: 80px;font-size:1.5rem;color:var(--webColor); }
.nav-menu{display:flex;list-style:none}
.nav-item{margin-left:2rem;}
.nav-link{color:var(--webColor);text-decoration:none;font-size:1.2rem;font-weight: bold; transition:color 0.3s;}
.nav-link:hover{color:#00a8ff}
.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: 4px; position: relative; line-height: 1; background: var(--webColor); font-size: 12px; color: #fff; margin-left: 10px; font-size: 16px; z-index: 99999;}
.navrbtn a:hover{background: var(--webColor2);}
.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: 0 auto; background:#292929; box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);}
.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 #444; 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;}

/***index****/

.topConBox{width: 100%; display: block; margin: 0 auto; overflow: hidden; background:#fff; padding: 60px 0;background: linear-gradient(to right, #ffffff, #f2f2f2);position: relative;border-bottom: 2px solid #eee;}
.topCon{width: 100%;max-width:1200px; margin: 0 auto; position: relative;}
.topPic{float: left; width:50%;position: relative;}
.topPic img.gt{width: 140%;z-index: 10; position: relative; margin-left: -40%;}
.toptextwra{float:right;width:calc(50% - 40px); padding-left: 40px; color: #333; line-height: 1.4; font-size: 18px; margin-top:80px; position: absolute; top: 0; right: 0; z-index: 500;  }
.toptextwra h2{font-size: 46px; font-weight: bold; display: inline-block; 
    color: transparent; 
    background-image: linear-gradient(to right, #4c56db, #cb00eb); 
    -webkit-background-clip: text;
    background-clip: text; }
.toptextwra a{ background: var(--webColor); padding: 15px 30px; display:inline-block; margin-top: 20px; border-radius:40px; color:#fff; font-weight: bold; font-size: 20px; }
.toptextwra a:hover{ opacity: .8;}
.infoBox {width: 100%; background:url("../images/t2.avif") center top;background-size: cover;  display: block; margin: 0 auto; padding:120px 0 80px 0; position: relative;}
.infos{width:100%;max-width:1200px; min-height: 500px; margin:0 auto; position: relative; padding-bottom: 30px; }

.sh2{width: 100%;display: block; margin: 0 auto; font-size: 38px; text-align: center; padding:40px 0 50px 0;}



/**分页**/
#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: 1680px; 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;}
.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;}



.topconZ{width:300px; height:300px; display: block; position: absolute; z-index: 1; top:20%; left:0%;animation: pulse-and-fade 3s infinite; opacity: .6; }
.topconZ img{width: 100%; opacity: .3;}
.topconZ2{width:200px; height:200px; display: block; position: absolute; z-index: 1; top:20%; left:0%;animation: pulse-and-fade 2s infinite; opacity: .4; }
.topconZ2 img{width: 100%; opacity: .3;}
.topconZ3{width:250px; height:250px; display: block; position: absolute; z-index: 1; top:20%; left:0%;animation: pulse-and-fade 5s infinite; opacity: .4; }
.topconZ3 img{width: 100%; opacity: .3;}

.mxe{width: 100%; display: block; margin: 0 auto; position: relative; background: var(--webColor); color: #fff;text-align: center; padding:120px 0;}
.mxe h2{width:100%; display: block;margin: 0 auto; padding: 0; text-align: center;color: #fff; font-size: 32px;}
.mxe p{ line-height: 2; font-size: 18px; margin-top: 10px;}
.mxe a{width: 200px; display: block;margin: 0 auto; padding: 20px 0; text-align: center; background: #fff; color: var(--webColor); margin-top: 20px; border-radius: 4px; font-size: 18px;}
.mxe a:hover{ background: #eee;}

.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;
  }
.swiper-slide img{width: 50%;display: block;float: right;}
  .thumbnails {
   position: absolute;
   top:40px;
   left: 0;
   z-index: 1000;
   width: 40%;
   display: block;
  }
  .thumbnails .atv{background:var(--webColor);border-radius: 10px;color: #fff;}
  .thumbnail {
    cursor: pointer;
   display: block;
   color: #333;
   font-size: 16px;
   line-height: 1.4;
   padding:20px;
   background:rgba(255, 255, 255, 0.7);border-radius: 10px;
   box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
   margin-bottom: 20px;
  }
  .thumbnail b{font-size: 32px; line-height: 1.5;}

.translateSelectLanguage{display: none !important;}





@media (max-width:1100px) {
  .toptextwra h2{font-size:34px;  }
}

@media (max-width:960px) {
    .inewslist{grid-template-columns:repeat(2,1fr);gap:40px}
    .topPic{margin-top:30px;}
    .toptextwra h2{font-size:32px;  }
    .toptextwra a{font-size:14px;  }
    .thumbnails {
        position: absolute;
        top:20px;
        right: 0;
        z-index: 1000;
        width: 40%;
        display: block;
       }
       .thumbnail {
        cursor: pointer;
       display: block;
       color: #333;
       font-size: 14px;
       line-height: 1.4;
       padding:10px;
      }
       .thumbnail b{font-size: 24px; line-height: 1.4;}

}
@media screen and (max-width: 860px) {
  .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:65px;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-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;}
}
@media screen and (max-width: 768px) {
    body,.header{min-width:340px;}
    

    .inewslist{grid-template-columns:repeat(2,1fr);gap:40px}

    .topPic{width:100%;}
    .topPic img{width: 100%;}
    .toptextwra{width:calc(100% - 40px); padding-left:20px;margin-top:40px; text-align: center;}

    .footNav{display: none;}
    .topPic{margin-top:100px;}
    .swiper-slide img{width: 100%;display: block;float: left;}
    .thumbnails {
        position: relative;
        top:0;
        right:initial;
        z-index: 1000;
        width: 100%;
        display: block;
        padding-bottom: 50px;
       }
       .thumbnail {
        cursor: pointer;
       display: block;
       color: #333;
       font-size: 14px;
       line-height: 1.4;
       padding:20px 40px;

      }
       .thumbnail b{font-size: 24px; line-height: 1.4;}
       .topPic img.gt{width: 100%;z-index: 10; position: relative; margin-left: 0; margin-top: 30%;}



}
@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}
    .topPic{margin-top:100px;}
    .infoBox {padding:60px 0 0px 0;}
    .toptextwra{margin-top:0px; }
    .toptextwra h2{font-size: 36px;}
    .topConBox{padding-top:40px;  }
    .topPic img.gt{width: 100%;z-index: 10; position: relative; margin-left: 0; margin-top: 35%;}

}

@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
    transform-origin: center;
  }
  to {
    transform: rotate(359deg);
    transform-origin: center;
  }
}

@keyframes pulse-and-fade {
  0% {
    transform: scale(1); /* 初始和结束状态都是原始大小 */
    opacity: .5; /* 初始和结束状态都是完全不透明 */
    transform-origin: center;
  }
  100% {
    transform: scale(10); /* 中间状态放大 */
    opacity: 0; /* 中间状态半透明 */
    transform-origin: center;
  }
}
