﻿* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: 'Segoe UI', Roboto, system-ui, -apple-system, sans-serif;
    }
    :root {
      --primary-dark: #0a2a44;
      --primary-light: #1e4a6e;
      --primary-accent: #2f6b92;
      --gold-accent: #b89b5b;
      --primary-soft: #e6edf5;
      --bg-body: #f4f7fc;
      --card-shadow: 0 4px 14px rgba(0, 0, 0, 0.04);
      --border-light: #e2e9f2;
      --blue-line: #2f6b92;
    }
    body {
      background-color: var(--bg-body);
      color: #1a2a3a;
      line-height: 1.5;
    }
    .container {
      max-width: 1280px;
      margin: 0 auto;
      padding: 0 16px;
    }
    .top_nav{
      width:100%; 
            position: sticky; 
            top: 0; 
            z-index: 999; 
            display:flex; 
            justify-content:center; 
            flex-wrap:wrap; 
            padding: 10px 0; 
            box-shadow: 0 2px 6px rgba(0,0,0,0.1);
            
            /* 馃憞 鍏抽敭淇敼锛氳儗鏅崲鎴愬浘鐗囧钩閾� 馃憞 */
            background-color: #1e4a6e; /* 鍏滃簳棰滆壊锛岄槻姝㈠浘鐗囨湭鍔犺浇鏃堕湶鐧� */
            background-image: url('images/top-bg.jpg'); /* 鏇挎崲鎴愪綘閭ｅ紶钃濊壊鍥剧墖鐨勮矾寰勬垨URL */
            background-repeat: repeat-x; /* 姘村钩骞抽摵锛岃瀹冧粠宸﹀埌鍙抽摵婊� */
            background-position: top center; /* 椤堕儴瀵归綈 */
            background-size: auto 100%; /* 璁╁浘鐗囬珮搴︽拺婊″鑸潯锛屽搴﹁嚜鍔ㄥ钩閾� */
            /* 馃憜 淇敼缁撴潫 馃憜 */
    }
.top_nav a{
  text-decoration:none; color:#ffffff; padding: 8px 18px; font-size:0.95rem; font-weight:500; transition:0.2s; border-right:1px solid rgba(255,255,255,0.1);
}
    

    /* ===== 椤堕儴鏍� ===== */
    .top-bar {
      background-color: #ffffff;
      color: #1a2a3a;
      padding: 10px 0;
      font-size: 0.9rem;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 2px solid #e2e9f2;
    }

    .top-bar .logo-area {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .top-bar .logo-area .logo-img {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      object-fit: cover;
      border: 2px solid var(--gold-accent);
      background: #d4dfeb;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.6rem;
      color: var(--primary-dark);
      font-weight: 700;
    }
    .top-bar .logo-area .logo-img img {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      object-fit: cover;
      display: block;
    }
    .top-bar .logo-area .logo-text {
      font-weight: 600;
      font-size: 1rem;
      letter-spacing: 1px;
      color: #fff;
    }
    .top-bar .contact-info {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 24px;
      justify-content: flex-end;
    }
    .top-bar .contact-info span {
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .top-bar .contact-info i {
      color: var(--gold-accent);
      width: 18px;
    }

    /* =====銆愬凡淇敼銆戝鑸爮鍥哄畾鍚搁《 ===== */
    .nav-bar {
      /* 鍚搁《鍥哄畾鏍稿績 */
      position: sticky;
      top: 0;
      z-index: 999;
      background-color: rgba(30, 74, 110, 0.95); /* 甯︿竴鐐瑰崐閫忔槑鐨勬繁钃濊壊 */
      backdrop-filter: blur(4px); /* 姣涚幓鐠冭川鎰� */
      
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      border-bottom: 3px solid var(--gold-accent);
    }
    .nav-bar a {
      color: #f0f4fa;
      padding: 12px 16px;
      text-decoration: none;
      font-weight: 500;
      font-size: 0.95rem;
      border-right: 1px solid rgba(255, 255, 255, 0.08);
      transition: 0.2s;
      white-space: nowrap;
    }
    .nav-bar a:last-child { border-right: none; }
    .nav-bar a:hover {
      background-color: var(--primary-dark);
      color: #fff;
    }

    /* ===== Banner ===== */
    .banner-wrapper {
      margin: 0;
      border-radius: 0;
      overflow: hidden;
      line-height: 0;
      background: linear-gradient(135deg, #d4e0ec, #b8cade);
      min-height: 180px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--primary-dark);
      font-weight: 600;
      font-size: 1.2rem;
      border: none;
    }

    .banner-wrapper img {
      width: 100%;
      height: 180px;
      object-fit: cover;
      display: block;
    }
    .banner-wrapper .fallback {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      padding: 20px;
    }

    /* ===== 澶ф爣棰� ===== */
    .section-header {
      text-align: center;
      margin: 40px 0 24px;
    }
    .section-header .cn {
      font-size: 1.8rem;
      font-weight: 700;
      color: var(--primary-dark);
      margin-bottom: 2px;
    }
    .section-header .en {
      font-size: 0.85rem;
      letter-spacing: 3px;
      color: #b0b8c5;
      font-weight: 400;
      text-transform: uppercase;
      margin-bottom: 10px;
    }
    .section-header .line {
      width: 60px;
      height: 3px;
      background-color: var(--blue-line);
      margin: 0 auto;
      border-radius: 4px;
    }

    /* ===== 鍗＄墖 ===== */
    .card-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 20px;
      margin-bottom: 28px;
    }
    .card-item {
      background: #fff;
      border-radius: 20px;
      padding: 18px 16px;
      box-shadow: var(--card-shadow);
      border: 1px solid var(--border-light);
    }
    .card-item h3 {
      font-size: 1.15rem;
      color: var(--primary-dark);
      margin-bottom: 10px;
      border-bottom: 2px dotted #d9e2ec;
      padding-bottom: 6px;
    }
    .card-item ul {
      list-style: none;
      padding: 0;
    }
    .card-item ul li {
      padding: 5px 0;
      border-bottom: 1px solid #f0f3f8;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .card-item ul li i {
      color: var(--gold-accent);
      width: 18px;
    }

    /* ===== 鎷涚敓鏉′欢 ===== */
    .condition-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
      gap: 24px;
      margin-bottom: 28px;
    }
    .condition-card {
      background: #fff;
      border-radius: 20px;
      padding: 28px 20px 24px;
      text-align: center;
      box-shadow: var(--card-shadow);
      border: 1px solid var(--border-light);
      transition: 0.2s;
    }
    .condition-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 8px 24px rgba(10,42,68,0.08);
    }
    .condition-card .icon {
      font-size: 2.6rem;
      color: var(--primary-accent);
      margin-bottom: 12px;
    }
    .condition-card h4 {
      font-size: 1.15rem;
      color: var(--primary-dark);
      margin-bottom: 6px;
    }
    .condition-card p {
      font-size: 0.9rem;
      color: #3d5775;
    }

    /* ===== 鏁欏瀹夋帓 ===== */
    .step-horizontal {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      gap: 16px;
      margin-bottom: 28px;
    }
    .step-horizontal .step-card {
      background: #fff;
      border-radius: 16px;
      padding: 20px 14px;
      text-align: center;
      box-shadow: var(--card-shadow);
      border: 1px solid var(--border-light);
      transition: 0.2s;
    }
    .step-horizontal .step-card:hover {
      transform: translateY(-3px);
    }
    .step-horizontal .step-card .num {
      display: inline-block;
      background: var(--primary-dark);
      color: #fff;
      width: 36px;
      height: 36px;
      border-radius: 50%;
      line-height: 36px;
      font-weight: 700;
      font-size: 0.95rem;
      margin-bottom: 10px;
    }
    .step-horizontal .step-card h4 {
      font-size: 1rem;
      color: var(--primary-dark);
      margin-bottom: 4px;
    }
    .step-horizontal .step-card p {
      font-size: 0.85rem;
      color: #3d5775;
    }

    /* ===== 璇佷功棰佸彂 ===== */
    .cert-block {
      background: #fff;
      border-radius: 24px;
      padding: 32px 20px;
      box-shadow: var(--card-shadow);
      border: 1px solid var(--border-light);
      text-align: center;
      margin-bottom: 28px;
    }
    .cert-block .cert-name {
      background: var(--primary-dark);
      color: #fff;
      padding: 12px 28px;
      border-radius: 60px;
      display: inline-block;
      margin: 10px 0;
      font-weight: 600;
      font-size: 1.1rem;
    }
    .cert-block .cert-sub {
      font-size: 0.95rem;
      color: #3d5775;
    }
    .cert-block .cert-note {
      margin-top: 16px;
      background: var(--primary-soft);
      padding: 10px 20px;
      border-radius: 40px;
      display: inline-block;
      font-size: 0.9rem;
    }

    /* ===== 瀛︿範鏀惰幏 ===== */
    .shouhuo-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 20px;
      margin: 12px 0 24px;
    }
    .shouhuo-item {
      background: #fff;
      padding: 24px 16px;
      border-radius: 24px;
      text-align: center;
      box-shadow: var(--card-shadow);
      border: 1px solid var(--border-light);
      transition: 0.2s;
    }
    .shouhuo-item i {
      font-size: 2.4rem;
      color: var(--gold-accent);
      margin-bottom: 10px;
    }
    .shouhuo-item h4 {
      color: var(--primary-dark);
      font-size: 1.1rem;
      margin-bottom: 6px;
    }
    .shouhuo-item p {
      color: #3d5775;
      font-size: 0.9rem;
    }

    /* ===== 鎶ュ悕娴佺▼ ===== */
    .service-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
      gap: 18px;
      margin: 12px 0 24px;
    }
    .service-card {
      background: #fff;
      padding: 18px 14px;
      border-radius: 24px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.02);
      border: 1px solid var(--border-light);
      text-align: center;
    }
    .service-card i {
      font-size: 1.8rem;
      color: var(--primary-accent);
      margin-bottom: 8px;
      background: var(--primary-soft);
      padding: 10px;
      border-radius: 50%;
    }
    .service-card h4 {
      color: var(--primary-dark);
      font-size: 1rem;
    }
    .service-card p {
      font-size: 0.9rem;
      margin-top: 4px;
    }

    /* ===== 甯歌闂 ===== */
    .faq-wrapper {
      background: linear-gradient(145deg, #eaf0f8, #dce6f2);
      border-radius: 32px;
      padding: 28px 24px;
      margin: 12px 0 24px;
    }
    .faq-list {
      display: flex;
      flex-direction: column;
      gap: 14px;
      max-width: 700px;
      margin: 0 auto;
    }
    .faq-list .faq-item {
      background: #fff;
      padding: 16px 20px;
      border-radius: 60px;
      border-left: 8px solid var(--primary-light);
      box-shadow: 0 2px 8px rgba(0,0,0,0.04);
      font-weight: 500;
      font-size: 1rem;
      transition: 0.15s;
    }
    .faq-list .faq-item i {
      color: var(--gold-accent);
      margin-right: 12px;
    }
    .faq-list .faq-item:hover {
      transform: translateX(4px);
      box-shadow: 0 4px 14px rgba(10,42,68,0.08);
    }

    /* ===== 鏍″尯 ===== */
    .campus-gallery {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
      gap: 16px;
      margin: 12px 0 18px;
    }
    .campus-gallery .campus-img {
      width: 100%;
      aspect-ratio: 4 / 3;
      border-radius: 16px;
      overflow: hidden;
      border: 2px dashed var(--primary-accent);
      background: #d4e0ec;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.85rem;
      color: var(--primary-dark);
      font-weight: 500;
      flex-direction: column;
      gap: 4px;
    }
    .campus-gallery .campus-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .campus-gallery .campus-img .placeholder-text {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      color: var(--primary-accent);
    }
    .campus-gallery .campus-img .placeholder-text i {
      font-size: 2rem;
      opacity: 0.5;
    }
    .campus-tip {
      background: #eef4fa;
      padding: 8px 18px;
      border-radius: 40px;
      display: inline-block;
      margin-bottom: 12px;
      text-align: center;
      width: 100%;
    }

    /* ===== 搴曢儴 ===== */
.footer {
  background-color: #0a2a44;
  color: #d4dfeb;
  padding: 24px 0 16px;
  margin-top: 32px;
  border-top: 6px solid #013384;
}


    .footer .footer-flex {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: center;
      gap: 16px;
    }
    .footer .footer-left {
      display: flex;
      align-items: center;
      gap: 8px;
      font-weight: 600;
      font-size: 1.05rem;
    }
    .footer .footer-left i {
      color: var(--gold-accent);
    }
    .footer .footer-right {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 20px;
      font-size: 0.9rem;
    }
    .footer .footer-right i {
      margin-right: 6px;
      color: var(--gold-accent);
    }
    .footer .copy {
      font-size: 0.85rem;
      opacity: 0.8;
      margin-top: 14px;
      border-top: 1px solid rgba(255,255,255,0.08);
      padding-top: 14px;
      text-align: center;
      width: 100%;
    }

    /* ===== 鎵嬫満绔�傞厤锛堝彧鏀规墜鏈猴紝涓嶅姩鐢佃剳锛� ===== */
    @media (max-width: 768px) {
      .top-bar { flex-wrap: wrap; gap: 6px; }
      .top-bar .logo-area .logo-text { display: none; }
      .nav-bar a { padding: 10px 12px; font-size: 0.85rem; }
      .section-header .cn { font-size: 1.4rem; }
      .banner-wrapper { min-height: 120px; }
      .banner-wrapper img { height: 120px; }

      /* 1. 椤堕儴鎵嬫満鍙烽殣钘� */
      .top-phone {
        display: none !important;
      }

      /* 2. 璇佷功鎵嬫満绔笂涓嬫帓鍒� + 鏂囧瓧灞呬腑 */
      .zhengshu-wrapper {
        flex-direction: column !important;
        align-items: center !important;
        gap: 20px !important;
        padding: 20px !important;
      }
      .zhengshu-wrapper .certificates-wrapper {
        flex-direction: row !important;
        gap: 12px !important;
      }
      .zhengshu-wrapper .certificates-wrapper .cert-item {
        width: 140px !important;
      }
      .zhengshu-wrapper .zhengshu-text {
        border-left: none !important;
        padding-left: 0 !important;
        text-align: center !important;
        align-items: center !important;
      }
      .zhengshu-wrapper .zhengshu-text .text-line-1 {
        font-size: 1rem !important;
      }
      .zhengshu-wrapper .zhengshu-text .text-line-2 {
        font-size: 0.85rem !important;
      }
      .zhengshu-wrapper .zhengshu-text .text-line-3 {
        font-size: 0.7rem !important;
      }

      /* 3. 瀛︿範鏀惰幏瀹屾暣鏄剧ず锛堟墜鏈烘敼2鍒楋級 */
      .shouhuo-row {
        flex-wrap: wrap !important;
        gap: 16px !important;
        overflow-x: visible !important;
        justify-content: center !important;
      }
      .shouhuo-row .shouhuo-item {
        min-width: 0 !important;
        max-width: calc(50% - 16px) !important;
        flex: 0 0 calc(50% - 16px) !important;
        height: 170px !important;
      }
      .shouhuo-row .shouhuo-item .top-part {
        height: 80px !important;
      }
      .shouhuo-row .shouhuo-item .top-part i {
        font-size: 22px !important;
        margin-bottom: 6px !important;
      }
      .shouhuo-row .shouhuo-item .top-part h4 {
        font-size: 0.85rem !important;
      }
      .shouhuo-row .shouhuo-item > div:last-child {
        padding: 14px 8px !important;
      }
      .shouhuo-row .shouhuo-item p {
        font-size: 0.7rem !important;
        line-height: 1.4 !important;
      }

      /* 4. 鎶ュ悕娴佺▼鎵嬫満绔楠ょ珫鎺� */
      .step-item {
        flex-direction: column !important;
        width: 100% !important;
        margin-bottom: 25px !important;
      }
      .desktop-arrow {
        display: none !important;
      }
    }

    @media (max-width: 480px) {
      .container { padding: 0 12px; }
      .top-bar .logo-area .logo-img { width: 32px; height: 32px; }
      .program-grid { grid-template-columns: 1fr; }
      .service-grid { grid-template-columns: 1fr 1fr; }
      .banner-wrapper { min-height: 100px; }
      .banner-wrapper img { height: 100px; }
      .faq-list .faq-item { font-size: 0.9rem; padding: 12px 16px; }
      .condition-grid { grid-template-columns: 1fr; }
      .step-horizontal { grid-template-columns: 1fr 1fr; }
      .campus-gallery { grid-template-columns: 1fr 1fr; }
    }
    .text-gold { color: var(--gold-accent); }

    