:root {
    --bodybg: #f1f2f4;
    --primary: #132051;
    --h-primary: #a966f5;
    --glass: rgba(255, 255, 255, 0.08);
    --transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.1);
}

* {margin: 0; padding: 0; box-sizing: border-box; }
body {font-family: 'Plus Jakarta Sans', sans-serif; 
    color: #000; min-height: 100vh; overflow-x: hidden; line-height: 1.6;}
ol,ul,li{list-style:none; margin:0; padding:0} 
a{color: var(--primary);text-decoration: none; }
.pagebox {max-width: 1400px; margin: 0 auto; padding: 0 20px; }
.pagebox1 {max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.ellipsis {display: block;  text-overflow: ellipsis; white-space: nowrap;  overflow: hidden }
.twolipsis{  
    text-overflow: -o-ellipsis-lastline;   overflow: hidden;    
    text-overflow: ellipsis;   display: -webkit-box;   
     -webkit-line-clamp: 2;    -webkit-box-orient: vertical;   
}
.tc{text-align: center;}
.acea-row{display:flex;flex-wrap:wrap;}
.acea-row.row-top{align-items:flex-start;}
.acea-row.row-middle{align-items:center;}
.acea-row.row-bottom{align-items:flex-end;}
.acea-row.row-left{justify-content:flex-start;}
.acea-row.row-center{justify-content:center;}
.acea-row.row-right{justify-content:flex-end;}
.acea-row.row-between{justify-content:space-between;}
.acea-row.row-around{justify-content:space-around;}
.acea-row.row-column{flex-direction:column;}
.acea-row.row-column-between{flex-direction:column;justify-content:space-between;}
.acea-row.row-column-around{flex-direction:column;justify-content:space-around;}
.acea-row.row-center-wrapper{align-items:center;justify-content:center;}
.acea-row.row-between-wrapper{align-items:center;justify-content:space-between;}

.public-paging{font-size: 18px;text-align: center;}
.public-paging a {display: inline-block;text-align: center;margin-right:15px;
  width:40px; height:40px;line-height: 40px; border-radius:50%; background-color:#f8f8f8; 
}
.public-paging a.pcurr {color:#fff; background-color:var(--primary); }
.public-paging a:hover {color:#fff; background-color:var(--primary) }
.public-paging a.mfirpage,.public-paging a.mlaspage{display: none;font-size: 12px}
@media (max-width:768px) {
  .public-paging a {width:40px; height:40px;line-height: 40px;font-size: 16px;display: none}
  .public-paging a.pprev,.public-paging a.pnext,.public-paging a.mfirpage,.public-paging a.mlaspage
        {display: inline-block;}
}
.public-paging a:last-child{margin-right: 0;}

.mt50{margin-top: 50px}
header {position: sticky; top: 0; z-index: 100; background: rgba(241,242,244, 0.8); backdrop-filter: blur(5px); height: 80px}
    header .pagebox{height: 100%}
    .logo{margin:0 50px}
    .logo img{height: 60px;}

    .nav-link {font-weight: 500; font-size: 1.1rem; position: relative; transition: var(--transition); }
    .nav-link:hover,.navon {color: #6e46c8; }
    .nav-link::after {content: ''; position: absolute; bottom: -5px; left: 0; width: 0; height: 2px; background: var(--h-primary); transition: var(--transition); }
    .nav-link:hover::after,.navon::after {width: 100%; }

footer {padding: 40px 0 20px; background-color: #1e293b; margin-top: 50px;color: #fff; font-size: 14px}
    .foottop{padding-bottom: 40px;}
    .foottel{font-size: 30px;width: 70%}
    .foottel img{margin-right: 12px}
    .footobj{flex: 1}
    .footbom{border-top: 1px solid var(--glass);text-align: center;padding-top: 20px;color: #8e9bae}
    .footbom a{color: #8e9bae}

.indexone{padding: 50px 0; position: relative; overflow: hidden;}
    .indexone-title{
        font-size: 3rem; font-weight: 800; line-height: 1.2; margin-bottom: 20px; color: transparent; 
        background: linear-gradient(to right, #132051, #a966f5); -webkit-background-clip: text; background-clip: text;
    }
    .indexone-subtitle {font-size: 1rem; margin-bottom: 40px; font-weight: 300; color: #666}
    .indexone-ul li{
        width: 30%;margin-bottom: 20px;display: flex;align-items: center;padding:25px;
    }
    .indexone-ul li .imgsvg{width: 100px;height: 100px;margin-right: 15px;display: flex;align-items: center;justify-content: center;}
    .indexone-ul .one {font-size: 20px; color: var(--primary); line-height: 20px; transition: all .5s}
    .indexone-ul .two {font-size: 14px; color: #777; margin-top: 17px; }

    .svgdonghua{fill: none; stroke: #2c2c2c; stroke-width: 20; }
        @keyframes svgstroke {
            to {
                stroke-dashoffset: 0;
            }
        }
        .indexone-ul li:hover{cursor: pointer;}
        .indexone-ul li:hover .svgdonghua{
            stroke-dasharray: var(--l);  /*实线变虚线*/
            stroke-dashoffset: var(--l);  /*偏移量*/
            animation: svgstroke 2s forwards;
        }
        .indexone-ul li:hover .one{color: var(--h-primary);}
    
.indextwo a{width: 24%;max-height: 200px}
    .indextwo a img{width: 100%;height: 100%;object-fit: center;}

.indextree{padding: 50px 0;}
    .newslist li{width: 48%;padding-bottom: 20px;border-bottom: 1px dashed #ddd}
    .newslist a{display: block;transition: all 0.5s;background: #fff;position: relative;padding:0 15px;z-index: 1;}
    .newslist a::before {
      content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
      background: linear-gradient(to bottom, #eadcfa 0, #f8f2fe 10%, #fff 100%);
      opacity: 0; z-index: -1; transition: opacity 0.5s;
    }
    .newslist .title {font-size: 16px; color: var(--primary); display: flex; align-items: center; padding: 10px 0; font-weight: normal;}
    .newslist .title::before {
        content: ""; width: 8px; height: 8px; border-radius: 50%; 
        background-color: var(--primary); margin-right: 10px; flex-shrink: 0; 
    }
    .newslist a:hover::before {opacity: 1;}
    .newslist a:hover .title{color: var(--h-primary)}
    .newslist a:hover .title::before {
        background-color: var(--h-primary);
    }
    .newslist .desc {font-size: 14px; color: #333; line-height: 2; height: 56px;}
    .newslist .release-date {font-size: 12px; color: #999; margin-top: 15px;text-align: right;}

.indexfour{height: 150px;overflow: hidden;}
  .indexfour .pagebox{position: relative;height: 100%;}
  .indexfourbg{position: absolute;width: 100%;height: 100%;left: 0;bottom: 0;z-index: 0;}
  .indexfourbg img{width: 100%;height: 100%;object-fit:cover}
  .writing-container {
      width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 36px;
      color: #ffffff; overflow: hidden; font-family: "楷体", "STKaiti", serif;
  }
  .writing-text {position: relative; display: inline-block; }
  .writing-text span {display: inline-block; position: relative; }
  .writing-text span::after {content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; animation: writing 0.5s steps(1) forwards; }
  @keyframes writing {to {right: 100%; } }
  .cursorjs {position: absolute; right: -5px; top: 0; width: 2px; height: 40px; background-color: red; animation: blink 0.7s infinite; }
  @keyframes blink {0%, 100% { opacity: 1; } 50% { opacity: 0; } }

.ninfo-weizhi{padding:30px 0;color: #777;font-size: 12px}        
     .ninfo-weizhi a{color: #777;margin:0 8px}
     .ninfo-weizhi img{width: 12px;}
     .ninfo-title{font-size: 24px; line-height: 1.5; color: #000; text-align: center;font-weight: normal;}
     .ninfo-sub{margin-top: 8px;}
     .ninfo-sub > div {margin: 0 10px; font-size: 14px; line-height: 1; color: #999; }
     .share-box a {
        width: 30px; height: 30px;border-radius: 50%; border: 1px solid #dedede;margin:0 5px;
        background-repeat: no-repeat !important; background-position: center !important;
      }
      .share-box a:nth-of-type(1) {background-image: url(../images/icon/wb.png); }
      .share-box a:nth-of-type(2) {background-image: url(../images/icon/qq.png); }
      .share-box a:nth-of-type(3) {background-image: url(../images/icon/wx.png); }
      .share-box a:nth-of-type(4) {background-image: url(../images/icon/fx.png); }
      .share-box a:nth-of-type(1):hover {background-image: url(../images/icon/h-wb.png); }
      .share-box a:nth-of-type(2):hover {background-image: url(../images/icon/h-qq.png); }
      .share-box a:nth-of-type(3):hover {background-image: url(../images/icon/h-wx.png); }
      .share-box a:nth-of-type(4):hover {background-image: url(../images/icon/h-fx.png); }
      .share-box a:hover {background-color: #545454; border: 1px solid #dedede; }
      .ninfo-article {
        margin-top: 40px; padding-top: 52px; border-top: 1px solid #eee; 
        color: #000; line-height: 30px; font-size: 16px;
      }
      .ninfo-article img{max-width: 100%!important}
      .prenext{margin:50px 0}
      .prenext a{display: block;line-height: 30px;font-size: 14px}
      .ninfo-tj{margin-bottom: 15px}
      
.newsaboutjs{margin-bottom: 70px;padding:20px;background: #f5f5f5;border-radius: 15px;border-left: 5px solid var(--h-primary);}
    .newsaboutjs h2{margin-bottom: 10px;color: var(--primary);}

@media(max-width:768px){
    .pagebox{width:100%}
    .logo {margin: 0 30px; }
    .indexone-title{font-size: 1.5rem;text-align: center;}
    .indexone-subtitle{font-size: 0.8rem;text-align: center;}
    .indexone-ul li,.newslist li{width: 100%}
    .indextwo a{width: 50%}
    .writing-container {font-size: 1rem}
    .foottel {width: 100%; justify-content: center; margin-bottom: 20px; }
  }