* {
            margin: 0; 
            padding: 0; 
            box-sizing: border-box;
            font-family: "微软雅黑", sans-serif;
        }
        a{text-decoration:none;color:#333;}
        a:hover{color:#f30;}
        /* 头部导航 */
        .header {
            width: 100%;
            border-bottom: 1px solid #eee;
        }
        .nav {
            width: 1200px;
            height: 60px;
            margin: 0 auto;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
        .nav .logo {
            font-size: 24px;
            color: #333;
            text-decoration: none;
            display: flex;
            align-items: center;
        }
        .nav .logo img {
            height: 60px;
            margin-right: 8px;
        }
        .nav .menu {
            display: flex;
            text-align: right;
        }
        .nav .menu a {
            color: #666;
            text-decoration: none;
            margin: 0 15px;
            font-size: 14px;
            transition: color 0.3s;
        }
        .nav .menu a:hover {
            color: #008cff;
        }

        /*  banner 介绍区 */
        .banner {
            width: 1200px;
            margin: 60px auto;
            text-align: center;
        }
        .banner h1 {
            font-size: 36px;
            color: #333;
            margin-bottom: 20px;
        }
        .banner p {
            font-size: 16px;
            color: #666;
            line-height: 1.8;
            margin-bottom: 40px;
        }
        .banner .btn-group {
            display: flex;
            justify-content: center;
            gap: 20px;
        }
        .banner .btn {
            display: inline-block;
            padding: 12px 30px;
            background: #008cff;
            color: #fff;
            text-decoration: none;
            border-radius: 4px;
            font-size: 16px;
            transition: opacity 0.3s;
        }
        .banner .btn-outline {
            background: transparent;
            color: #008cff;
            border: 1px solid #008cff;
        }
        .banner .btn:hover {
            opacity: 0.8;
        }
        .banner .info {
            font-size: 14px;
            color: #999;
            margin-top: 30px;
            line-height: 1.6;
        }

        /*小程序*/
        .btn-hollow {
            position: relative;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 8px 16px;
            border: 1px solid #4CAF50;
            border-radius: 4px;
            background-color: transparent;
            color: #4CAF50;
            text-decoration: none;
            cursor: pointer;
            transition: all 0.3s ease;
            font-size: 14px;
        }
        
        .btn-hollow:hover {
            background-color: #4CAF50;
            color: white;
        }
        
        .btn-hollow i.fa-brands.fa-weixin {
            margin-right: 5px;
        }
        
        .btn-hollow span {
            position: absolute;
            bottom: calc(100% + 10px);
            left: 50%;
            transform: translateX(-50%);
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
            z-index: 100;
            background-color: white;
            padding: 10px;
            border-radius: 8px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
            min-width: 180px;
            text-align: center;
        }
        
        .btn-hollow span::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            transform: translateX(-50%);
            border-width: 8px;
            border-style: solid;
            border-color: white transparent transparent transparent;
        }
        .btn-hollow:hover span {
            opacity: 1;
            visibility: visible;
        }
        .btn-hollow span img {
            max-width: 150px;
            height: auto;
            border-radius: 4px;
            margin-top: 5px;
        }
        .btn-hollow span em {
            display: block;
            font-style: normal;
            color: #333;
            margin-bottom: 5px;
            font-size: 12px;
        }
        /* 模板展示区 */
        .inBox.bg {
            background-color: #f8f8f8;
            padding: 60px 0;
            margin-top: 60px;
        }
        .container {
            width: 1200px;
            margin: 0 auto;
        }
        .head {
            margin-bottom: 30px;
        }
        .name {
            font-size: 24px;
            color: #333;
            margin-bottom: 10px;
        }
        .name a {
            color: #333;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
        }
        .name a:hover {
            color: #008cff;
        }
        .fa-angle-right {
            margin-left: 5px;
        }
        .theme-list {
            margin-bottom: 30px;
        }
        .row {
            display: flex;
            flex-wrap: wrap;
            margin: 0 -15px;
        }
        .col-md-3 {
            width: 25%;
            padding: 0 15px;
            margin-bottom: 30px;
        }
        .col-6 {
            width: 50%;
            padding: 0 15px;
            margin-bottom: 30px;
        }
        .item {
            background-color: #fff;
            border-radius: 4px;
            overflow: hidden;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            transition: all 0.3s;
        }
        .item:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        }
        .img {
            overflow: hidden;
        }
        .img.scale img {
            transition: transform 0.5s;
        }
        .img.scale:hover img {
            transform: scale(1.05);
        }
        .img img {
            width: 100%;
            height: auto;
            display: block;
        }
        .item .name {
            padding: 15px;
            text-align: center;
            font-size: 16px;
        }
        .item .name a {
            color: #333;
            text-decoration: none;
        }
        .item .name a:hover {
            color: #008cff;
        }
        .action {
            text-align: center;
        }
        .btn-more {
            display: inline-block;
            padding: 10px 30px;
            background-color: #008cff;
            color: #fff;
            text-decoration: none;
            border-radius: 4px;
            transition: all 0.3s;
        }
        .btn-more:hover {
            background-color: #0077cc;
        }

        /* 客户案例模块 */
        .customer-case {
            width: 1200px;
            margin: 60px auto;
        }
        .customer-case .head {
            text-align: center;
            margin-bottom: 40px;
        }
        .customer-case .head h2 {
            font-size: 28px;
            color: #333;
            margin-bottom: 10px;
        }
        .customer-case .head p {
            font-size: 16px;
            color: #666;
            max-width: 600px;
            margin: 0 auto;
        }
        .case-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
        }
        .case-card {
            background-color: #fff;
            border-radius: 6px;
            overflow: hidden;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
            transition: all 0.3s;
            position: relative;
        }
        .case-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
        }
        .case-card .case-img {
            height: 200px;
            overflow: hidden;
            position: relative;
        }
        .case-card .case-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s;
        }
        .case-card:hover .case-img img {
            transform: scale(1.05);
        }
        .case-card .case-content {
            padding: 20px;
        }
        .case-card .case-title {
            font-size: 18px;
            font-weight: bold;
            color: #333;
            margin-bottom: 10px;
        }
        .case-card .case-desc {
            font-size: 14px;
            color: #666;
            line-height: 1.6;
            margin-bottom: 15px;
        }
        .case-card .case-meta {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 12px;
            color: #999;
        }
        .case-card .case-tag {
            background-color: #f5f5f5;
            padding: 3px 8px;
            border-radius: 3px;
        }
        .case-card .case-link {
            color: #008cff;
            text-decoration: none;
            display: flex;
            align-items: center;
        }
        .case-card .case-link:hover {
            text-decoration: underline;
        }

.services{max-width:1480px;margin:40px auto;padding:0 20px;}
.services-wrap{display:flex;flex-wrap:wrap;margin:1px 0 0 1px;}
.services-item{width:25%;margin:-1px 0 0 -1px;border:1px solid #eaeaea;position:relative;padding:30px 40px;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
.services-item:nth-child(1){border-top-left-radius:16px;}
.services-item:nth-child(4){border-top-right-radius:16px;}
.services-item:nth-child(5){border-bottom-left-radius:16px;}
.services-item:last-child{border-bottom-right-radius:16px;}
.services-biz .services-item:nth-child(1){border-bottom-left-radius:16px;}
.services-item .body{padding-bottom:36%;}
.services-item .title{font-size:22px;line-height:30px;}
.services-item .title span{color:#f30;margin:0 5px;}
.services-item .desc{line-height:26px;margin-top:20px;color:#666;}
.services-item .price{position:absolute;bottom:30px;left:40px;color:#999;}
.services-item .price span{color:#333;font-size:36px;display:inline-block;margin-right:10px;}
.services-biz .price span{color:#f30;}
.services-item:hover{background:#296bef;border-color:#296bef;}
.services-item:hover .title{color:#fff;}
.services-item:hover .title span{color:#fff;}
.services-item:hover .desc{color:#fff;}
.services-item:hover .price{color:#fff;}
.services-item:hover .price span{color:#fff;}
.services.red .services-item:hover{background:#FA563A;border-color:#FA563A;}

.contact-box{display:flex;margin:40px 0 0 -2%;flex-wrap:wrap;}
.contact-item{width:23%;margin:0 0 2% 2%;box-shadow:0 1px 10px rgba(51,51,51,0.05);border:1px solid #F0F5FC;background:#fff;display:block;padding:60px 0;border-radius:10px;position:relative;overflow:hidden;text-align:center;}
.contact-item .tiptext{position:absolute;bottom:-50px;left:0;right:0;text-align:center;line-height:50px;height:50px;transition:all 0.3s ease;font-size:16px;background:rgba(83,115,252,0.05);}
.contact-item:hover{box-shadow:0 0 10px rgba(83,115,252,0.13);}
.contact-item:hover .tiptext{bottom:0px;}
.contact-item a{text-align:center;color:#333;font-size:16px;transition:all .3s ease 0s;line-height:30px;display:block;}
.contact-item:hover a{transform:translate3d(0,-10px,0);}
.contact-item a span{display:block;width:80px;line-height:80px;border-radius:50%;text-align:center;background:#f3f3f3;font-size:36px;margin-bottom:10px;margin:0 auto 10px auto;}
.contact-item a span.blue{background:#E7F7FE;color:#2469F6;}
.contact-item a span.red{background:#FFF1F8;color:#ED4014;}
.contact-item a span.green{background:#E6F8E6;color:#19BE6B;}
.contact-item a span.yellow{background:#FFF3EA;color:#F37B1D;}
.contact-item a em{color:#999;}

.news-list{max-width:100%;margin:40px auto;padding:0 0px;min-height:300px;}
.news-list-item{display:flex;align-items:center;border-bottom:1px solid #f3f3f3;padding:30px 200px 40px 200px;background-color:transparent;}
.news-list-item .left{min-width:60px;text-align:right;font-size:16px;color:#929292;padding-right:60px;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;font-family:verdana;}
.news-list-item .left span{font-size:60px;display:block;color:#aaa;line-height:normal;font-family:Politica;}
.news-list-item .center{flex:1;overflow:hidden;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}
.news-list-item .center .title{font-size:20px;font-weight:bold;line-height:50px;}
.news-list-item .center .desc{font-size:15px;color:#6a6a6a;line-height:25px;height:50px;}
.news-list-item .right{min-width:60px;padding-left:20px;transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;opacity:0;padding-top:30px}
.news-list-item .right i{font-size:30px;}
.news-list-item:hover{background:#00C0FF;pacity:1;}
.news-list-item:hover .left{transform:translateX(-50px);color:#fff;}
.news-list-item:hover .left span{color:#fff;}
.news-list-item:hover .center{transform:translateX(-50px);}
.news-list-item:hover .center .title{color:#fff;}
.news-list-item:hover .center .desc{color:#fff;}
.news-list-item:hover .right{transform:translateX(10px);opacity:1;}
.news-list-item:hover .right i{color:#fff;}

.pay-way{display:flex;margin:40px 0 0 -2%;flex-wrap:wrap;}
.pay-way-item{width:31.33%;margin:0 0 2% 2%;box-shadow:rgba(60,72,88,0.3) 0px 0px 3px 0px;background:#fff;border-radius:10px;transition:all 0.5s ease;position:relative;}
.pay-way-item:hover{box-shadow:0 30px 60px 0 rgba(0,0,0,.12);transform:translateY(-10px);}
.pay-way-header{padding:30px 40px;/*overflow:hidden;*/position:relative;}
.pay-way-header .name{font-size:24px;line-height:60px;}
.pay-way-header .desc{font-size:16px;color:#666;line-height:30px;height:50px;}
.pay-way-image{padding:40px 30px 30px 30px;text-align:center;}
.pay-way-image img{width:100%;border-radius:16px;border:1px solid #eaeaea;}
.pay-way-item.alipay{background:#00A0E8;}
.pay-way-item.alipay .name{color:#fff;}
.pay-way-item.alipay .desc{color:#fff;}
.pay-way-item.weixin{background:#22AB39;}
.pay-way-item.weixin .name{color:#fff;}
.pay-way-item.weixin .desc{color:#fff;}
.pay-way-blank{padding:30px 40px;line-height:30px;border-top:1px solid #F2F2F4;border-bottom:1px solid #F2F2F4;margin:30px 0;}
.pay-way-blank span{display:block;min-width:80px;color:#333;font-weight:bold;}
.pay-way-item .tips{position:absolute;top:135px;left:0;right:-6px;text-align:center;background:rgba(255,255,255,0.95);color:#333;padding:15px 20px;border-right:6px solid #22AB39;border-top:1px solid #f9f9f9;border-bottom:1px solid #f9f9f9;}
.pay-way-item .tips span{color:#f30;margin:0 5px;}
.pay-way-remark{padding:0 30px;padding-bottom:30px;}
.pay-way-remark strong{color:#f30;}

.page_warp{background:#fff;padding:30px 0;}
.page_body{max-width:1480px;margin:0 auto;padding:0 20px;}
.page_body .title{text-align:center;}
.page_body .title h1{font-size:24px;color:#0c0c0c;margin:10px 0 30px 0;}
.page_body .info{background:#fff;border:1px solid #e0eaff;box-shadow:0 3px 16px rgba(0,116,255,.05);text-align:center;padding:15px 0;margin-bottom:30px;}
.page_body .info span{color:#999;}
.page_body h2{font-size:24px;color:#0c0c0c;margin:30px 0;position:relative;margin-bottom:15px;}
.page_body h3{margin:30px 24px 20px 24px;border-bottom:1px solid #f3f3f3;padding-bottom:15px;font-weight:500;}
.page_body h3:hover{border-bottom-color:#eee;font-weight:bold;}
.page_body p{font-size:16px;line-height:2;margin-bottom:20px;color:#666;}
.page_body p img{max-width:100%;}

	
	.subject{text-align:center;}
.subject h2{font-size:24px;color:#0c0c0c;margin:30px 0;position:relative;padding-bottom:18px;margin-bottom:24px;}
.subject h2:after{content:'';display:inline-block;position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:6px;width:40px;background:#ffa601;border-radius:3px}
.subject h4{font-size:30px;line-height:45px;font-weight:bold;letter-spacing:0.5px;color:#161c2d;}
.subject p{font-size:16px;line-height:26px;font-weight:400;color:#8492a6;padding:0 10px;}
.subject .ui-scroll{margin:15px 0;}
.subject .ui-scroll li b{font-weight:normal;display:inline-block;margin-right:15px;}
.subject .ui-scroll li span{color:#f30;display:inline-block;margin-left:10px;}

table{clear:both;width:100%;border-collapse:collapse;border-spacing:0;border-left:1px solid #eaeaea;border-top:1px solid #eaeaea}
table td,table th{padding:.65em;border-right:1px solid #eaeaea;border-bottom:1px solid #eaeaea}
table span{padding:.35em}

		table thead th:nth-child(1) { width: 10%; }
		table thead th:nth-child(2) { width: 20%; }
		table thead th:nth-child(3),
		table thead th:nth-child(4),
		table thead th:nth-child(5) { width: 23.33%; }
		
        /* 页脚样式 */
        .footer {
            background-color: #f8f8f8;
            border-top: 1px solid #e7e7e7;
            padding: 30px 0;
            margin-top: 60px;
        }
        .copyright {
            width: 1200px;
            margin: 0 auto;
            text-align: center;
            font-size: 14px;
            color: #666;
            line-height: 1.8;
        }
        .copyright p {
            margin-bottom: 10px;
        }
        .copyright a {
            color: #666;
            text-decoration: underline;
        }
        .copyright a:hover {
            color: #008cff;
        }


        /* 响应式适配 */
        @media (max-width: 1200px) {
            .nav, .banner, .container, .customer-case, .copyright {
                width: 90%;
            }
            .col-md-3 {
                width: 50%;
            }
            .case-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        @media (max-width: 768px) {
            .col-md-3, .col-6 {
                width: 100%;
            }
            .case-grid {
                grid-template-columns: 1fr;
            }
            .nav {
                flex-direction: column;
                height: auto;
                padding: 15px 0;
            }
            .nav .menu {
                margin: 15px 0;
            }
            .banner h1 {
                font-size: 28px;
            }
            .customer-case .head h2 {
                font-size: 24px;
            }
        }