﻿
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: "Microsoft YaHei", sans-serif;
        }
        html,body {width: 100%;overflow-x: hidden;}
        a {text-decoration: none;color: #333;transition: 0.3s;}
        a:hover {color: #0066cc;}
        ul,li {list-style: none;}
        img {max-width: 100%;border: none;display: block;}
        .container {width: 1200px;margin: 0 auto;padding: 0 15px;}

        .top-bar {height: 40px;line-height: 40px;background: #f5f7fa;font-size: 14px;color: #666;}
        .top-bar .container {display: flex;justify-content: space-between;}
        .top-contact span {margin-right: 20px;}

        .header {background: #fff;box-shadow: 0 2px 10px rgba(0,0,0,0.08);position: relative;z-index: 99;}
        .header-wrap {display: flex;justify-content: space-between;align-items: center;height: 90px;}
        .logo {font-size: 30px;font-weight: bold;color: #0066cc;}
        .nav ul {display: flex;}
        .nav ul li {padding: 0 20px;line-height: 90px;font-size: 16px;}
        .nav ul li.active a {color: #0066cc;}
        .menu-btn {display: none;font-size: 24px;cursor: pointer;}

        .banner {width: 100%;padding: 120px 0;background: linear-gradient(to right,#005bbb,#0088ff);color: #fff;text-align: center;}
        .banner h1 {font-size: 52px;margin-bottom: 25px;}
        .banner p {font-size: 22px;margin-bottom: 40px;opacity: 0.9;}
        .banner-btn {display: inline-block;width: 180px;height: 50px;line-height: 50px;background: #fff;color: #0066cc;border-radius: 50px;font-size: 18px;font-weight: bold;}

        .course {padding: 90px 0;background: #f8f9fa;}
        .section-title {text-align: center;margin-bottom: 60px;}
        .section-title h2 {font-size: 38px;color: #222;margin-bottom: 15px;}
        .section-title p {font-size: 18px;color: #666;max-width: 700px;margin: 0 auto;}
        .course-list {display: flex;flex-wrap: wrap;justify-content: space-between;}
        .course-item {width: 31.5%;background: #fff;border-radius: 10px;overflow: hidden;margin-bottom: 30px;box-shadow: 0 5px 15px rgba(0,0,0,0.06);transition: 0.3s;}
        .course-item:hover {transform: translateY(-8px);}
        .course-img {height: 220px;background: #eaf5ff;object-fit: cover;width: 100%;}
        .course-info {padding: 25px;}
        .course-info h3 {font-size: 22px;color: #333;margin-bottom: 12px;}
        .course-info p {font-size: 14px;color: #666;line-height: 1.7;margin-bottom: 20px;}
        .course-bottom {display: flex;justify-content: space-between;align-items: center;}
        .course-price {font-size: 24px;color: #ff5c00;font-weight: bold;}
        .course-buy {padding: 8px 20px;background: #0066cc;color: #fff;border-radius: 5px;font-size: 14px;}

        .advantage {padding: 90px 0;background: #fff;}
        .advantage-list {display: flex;flex-wrap: wrap;justify-content: space-between;text-align: center;}
        .advantage-item {width: 23%;padding: 10px;}
        .advantage-icon {width: 80px;height: 80px;margin: 0 auto 20px;}
        .advantage-item h3 {font-size: 22px;color: #333;margin-bottom: 15px;}
        .advantage-item p {font-size: 14px;color: #666;line-height: 1.8;}

        .certificate {padding: 90px 0;background: #f8f9fa;}
        .cert-box {display: flex;flex-wrap: wrap;justify-content: center;gap: 20px;margin-top: 40px;}
        .cert-item {width: 200px;height: 280px;background: #fff;box-shadow: 0 3px 10px rgba(0,0,0,0.08);}

        .school {padding: 90px 0;background: #fff;}
        .school-list {display: flex;flex-wrap: wrap;justify-content: space-between;}
        .school-item {width: 23.5%;height: 200px;background: #f1f7ff;margin-bottom: 20px;object-fit: cover;}

        .about {padding: 90px 0;background: #fff;}
        .about-content {display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
        .about-text {width: 48%;}
        .about-text h2 {font-size: 32px;color: #222;margin-bottom: 25px;}
        .about-text p {font-size: 16px;color: #555;line-height: 1.9;margin-bottom: 18px;}
        .about-img {width: 48%;height: 380px;background: #f1f7ff;object-fit: cover;}

        .consult {padding: 60px 0;background: linear-gradient(to right,#005bbb,#0088ff);color: #fff;text-align: center;}
        .consult h2 {font-size: 32px;margin-bottom: 30px;}
        .consult-btn {display: inline-block;padding: 15px 40px;background: #fff;color: #0066cc;border-radius: 50px;font-size: 18px;font-weight: bold;}

        /* 文章资讯板块 */
        .article {padding: 90px 0;background: #f8f9fa;}
        .article-list {display: flex;flex-wrap: wrap;justify-content: space-between;}
        .article-item {width: 23%;background: #fff;border-radius: 8px;padding: 20px;box-shadow: 0 3px 10px rgba(0,0,0,0.05);margin-bottom: 25px;}
        .article-item h3 {font-size: 16px;color: #333;margin-bottom: 10px;line-height: 1.5;}
        .article-item p {font-size: 13px;color: #666;line-height: 1.6;margin-bottom: 12px;}
        .article-meta {font-size: 12px;color: #999;}
        .article-more {text-align: center;margin-top: 30px;}
        .article-more a {padding: 10px 25px;background: #0066cc;color: #fff;border-radius: 5px;font-size: 14px;}

        .footer {background: #2a2a2a;color: #fff;padding: 70px 0 30px;}
        .footer-wrap {display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 50px;}
        .footer-col {width: 23%;margin-bottom: 30px;}
        .footer-col h3 {font-size: 18px;margin-bottom: 25px;padding-bottom: 15px;border-bottom: 1px solid #444;}
        .footer-col ul li {margin-bottom: 12px;}
        .footer-col ul li a {color: #ccc;font-size: 14px;}
        .footer-contact p {color: #ccc;font-size: 14px;margin-bottom: 12px;line-height: 1.7;}
        .copyright {text-align: center;padding-top: 30px;border-top: 1px solid #444;color: #888;font-size: 14px;}

        /* 自适应 */
        @media (max-width:1200px){.container{width: 100%;}}
        @media (max-width:992px){
            .course-item{width: 48%;}
            .advantage-item{width: 48%;margin-bottom: 40px;}
            .school-item{width: 48%;}
            .article-item{width: 48%;}
            .about-text,.about-img{width: 100%;margin-bottom: 30px;}
            .footer-col{width: 48%;}
        }
        @media (max-width:768px){
            .top-bar{display: none;}
            .nav{display: none;}
            .menu-btn{display: block;}
            .banner h1{font-size: 36px;}
            .section-title h2{font-size: 28px;}
            .course-item{width: 100%;}
            .advantage-item{width: 100%;}
            .school-item{width: 100%;}
            .article-item{width: 100%;}
            .footer-col{width: 100%;}
        }
        @media (max-width:480px){.banner h1{font-size: 28px;}.cert-item{width: 100%;}}
