html{scroll-behavior:smooth}
body.about-page-body{background:#f2f5f9}
.about-page-body .header,.about-page-body .footer{position:relative;z-index:20}

.about-main-wrap{padding:26px 0 70px}
.about-layout{display:flex;align-items:flex-start;gap:30px}
.about-side{width:350px;position:sticky;top:28px}
.about-side-card{padding:28px 22px 24px;background:#fff;border:1px solid #e7edf5;border-radius:28px;box-shadow:0 18px 40px rgba(15,23,42,.06)}
.about-side-head{padding:0 6px 18px}
.about-side-head p{font-size:22px;line-height:1.25;font-weight:800;color:#14233f;margin-bottom:8px}
.about-side-head span{display:block;font-size:12px;line-height:1.4;letter-spacing:.18em;color:#95a3b8;text-transform:uppercase}
.about-side-links{display:flex;flex-direction:column;gap:12px}
.about-side-links a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;padding:0 18px 0 22px;background:#f8fafc;border:1px solid #e7edf5;border-radius:18px;transition:all .28s ease}
.about-side-links a span{display:block;font-size:16px;line-height:1.5;font-weight:700;color:#14233f;transition:color .28s ease}
.about-side-links a i{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:10px;background:#eaf1fb;position:relative;flex-shrink:0;transition:all .28s ease}
.about-side-links a i:before,.about-side-links a i:after{content:"";position:absolute;background:#0a60c8;border-radius:2px;transition:all .28s ease}
.about-side-links a i:before{width:12px;height:2px}
.about-side-links a i:after{width:2px;height:12px}
.about-side-links a:hover,.about-side-links a.is-active{background:#fff;border-color:#d7e4f5;box-shadow:0 10px 24px rgba(10,96,200,.08);transform:translateY(-2px)}
.about-side-links a:hover span,.about-side-links a.is-active span{color:#0a60c8}
.about-side-links a:hover i,.about-side-links a.is-active i{background:#dfeaf9}
.about-side-links a.is-active i:after{height:0}

.about-content{flex:1;min-width:0}
.about-section,.about-service{background:#fff;border:1px solid #e7edf5;box-shadow:0 12px 30px rgba(15,23,42,.045);padding:34px 38px;margin-bottom:28px}
.about-section-head{position:relative;margin-bottom:26px;padding-bottom:18px;border-bottom:1px solid #eaf0f6}
.about-section-head:after{content:"";position:absolute;left:0;bottom:-1px;width:92px;height:3px;background:#2878ff}
.about-section-head span{position:absolute;left:0;top:-8px;font-size:56px;line-height:1;font-weight:800;color:#f1f5fa;letter-spacing:.03em;text-transform:uppercase;pointer-events:none;user-select:none}
.about-section-head h2{position:relative;z-index:2;font-size:30px;line-height:1.2;font-weight:800;color:#14233f}

.about-content-box{font-size:16px;line-height:2;color:#50607b}
.about-content-box p{font-size:16px!important;line-height:2!important;color:#50607b!important;margin-bottom:14px!important;text-align:justify}
.about-content-box img{max-width:100%;height:auto}
.about-content-box table{max-width:100%}

.about-culture-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.about-culture-list li{position:relative;padding:26px 26px 22px;background:linear-gradient(180deg,#f9fbfe 0%,#ffffff 100%);border:1px solid #e7edf5;overflow:hidden;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.about-culture-list li:hover{transform:translateY(-4px);box-shadow:0 16px 28px rgba(15,23,42,.08);border-color:#d8e4f5}
.about-culture-list em{display:block;font-size:44px;line-height:1;font-family:Impact,Arial,sans-serif;color:#1a68d8;font-style:normal;margin-bottom:12px}
.about-culture-list h3{font-size:22px;line-height:1.35;font-weight:700;color:#14233f;margin-bottom:10px}
.about-culture-list p{font-size:15px;line-height:1.9;color:#6b778c}

.about-honor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.about-honor-item{background:#fff;border:1px solid #e7edf5;padding:16px;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.about-honor-item:hover{transform:translateY(-4px);box-shadow:0 16px 28px rgba(15,23,42,.08);border-color:#d8e4f5}
.about-honor-pic{display:flex;align-items:center;justify-content:center;height:240px;background:linear-gradient(180deg,#f7f9fc 0%,#eef3f8 100%);border:1px dashed #cdd9e8;color:#8a98ad;font-size:18px;font-weight:600;letter-spacing:.04em;text-align:center}
.about-honor-name{display:block;margin-top:14px;font-size:15px;line-height:1.7;color:#60708a;text-align:center}
.about-honor-placeholder .about-honor-pic span{padding:0 16px}

.about-service{margin-bottom:0}
.about-service-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.about-service-list li{padding:28px 24px;background:linear-gradient(180deg,#f9fbfe 0%,#ffffff 100%);border:1px solid #e7edf5;text-align:center;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.about-service-list li:hover{transform:translateY(-4px);box-shadow:0 16px 28px rgba(15,23,42,.08);border-color:#d8e4f5}
.about-service-list img{display:inline-block;height:46px;width:auto}
.about-service-list h3{font-size:22px;line-height:1.3;font-weight:800;color:#14233f;margin:18px 0 12px}
.about-service-list p{font-size:15px;line-height:1.9;color:#6b778c}

@media screen and (max-width:1399px){
  .about-side{width:320px}
}

@media screen and (max-width:1199px){
  .about-layout{gap:22px}
  .about-side{width:290px}
  .about-section,.about-service{padding:30px}
  .about-section-head span{font-size:48px}
  .about-honor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media screen and (max-width:1023px){
  .about-main-wrap{padding-top:20px}
  .about-layout{display:block}
  .about-side{width:100%;position:static;margin-bottom:22px}
  .about-side-card{padding:24px 18px 18px}
  .about-side-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .about-culture-list,.about-service-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media screen and (max-width:767px){
  .about-main-wrap{padding:16px 0 42px}
  .about-side-card{padding:20px 14px 14px;border-radius:22px}
  .about-side-head{padding:0 4px 14px}
  .about-side-head p{font-size:20px}
  .about-side-links{grid-template-columns:1fr}
  .about-side-links a{min-height:62px;padding:0 14px 0 18px;border-radius:16px}
  .about-side-links a span{font-size:15px}
  .about-side-links a i{width:26px;height:26px;border-radius:9px}
  .about-section,.about-service{padding:22px 18px;margin-bottom:18px}
  .about-section-head{margin-bottom:18px;padding-bottom:16px}
  .about-section-head span{font-size:32px;top:-2px}
  .about-section-head h2{font-size:24px}
  .about-content-box,.about-content-box p{font-size:14px!important;line-height:1.9!important}
  .about-culture-list,.about-honor-grid,.about-service-list{grid-template-columns:1fr;gap:14px}
  .about-culture-list li,.about-service-list li{padding:22px 18px}
  .about-honor-pic{height:200px;font-size:16px}
}