/*by styxkeji.cn*/ 
*{margin:0;padding:0;border:0;box-sizing:border-box;}
ul,li,dl,dt,dd{list-style:none;}
a,a:hover{text-decoration:none;}
.clear{clear:both}
html, body{margin:0;padding:0;}
#web_bg{display:none;}
#web_bg img{display:none;}
body{background: #ffffff;font-size:14px;color:#333;line-height:1.6;font-family:"Microsoft Yahei", Arial, sans-serif;margin:0;padding:0;}
.new-topbar{width:100%;margin:0;padding:0;background: #ffffff;color:#333;position: relative;overflow: hidden;box-shadow: 0 2px 12px rgba(0,0,0,0.1);border-bottom: 1px solid #f0f0f0;}
.new-topbar .container{width:960px;margin:0 auto;padding:0 20px;}
.new-topbar .header-content{display:flex;justify-content:space-between;align-items:center;height:70px;}
.new-topbar .logo a{color:#333;text-decoration:none;font-size:26px;font-weight:800;display:flex;align-items:center;gap:12px;transition: all 0.4s ease;text-transform: uppercase;letter-spacing: 1px;background: linear-gradient(135deg, #18a5ff, #66c7ff);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;}
.new-topbar .logo a:hover{transform: translateY(-3px) scale(1.05);}
.new-topbar .logo i{font-size:32px;color:#18a5ff;animation: pulse 2s ease-in-out infinite;}
@keyframes pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}
.new-topbar .nav-menu{display:flex;gap:20px;align-items:center;}
.new-topbar .btn{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:35px;font-size:15px;font-weight:600;text-decoration:none;transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);position: relative;overflow: hidden;border: 2px solid transparent;}
.new-topbar .btn::before{content: '';position: absolute;top: 0;left: -100%;width: 100%;height: 100%;background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);transition: left 0.6s ease;}
.new-topbar .btn:hover::before{left: 100%;}
.new-topbar .btn-primary{background: linear-gradient(135deg, #18a5ff, #66c7ff);color:#fff;box-shadow: 0 6px 16px rgba(24, 165, 255, 0.4), 0 2px 6px rgba(24, 165, 255, 0.2);border-color: rgba(24, 165, 255, 0.3);}
.new-topbar .btn-primary:hover{background: linear-gradient(135deg, #66c7ff, #18a5ff);transform: translateY(-3px) scale(1.05);box-shadow: 0 10px 24px rgba(24, 165, 255, 0.5), 0 4px 12px rgba(24, 165, 255, 0.3);}
.new-topbar .btn-secondary{background: #f5f5f5;color:#333;border-color: #e0e0e0;}
.new-topbar .btn-secondary:hover{background: #e8e8e8;transform: translateY(-3px) scale(1.05);box-shadow: 0 4px 12px rgba(0,0,0,0.15);}

.wrap{width:960px;margin:20px auto 0;}
.wrap .diybanner{width:100%;margin-bottom:15px;border-radius:10px;overflow:hidden;box-shadow: 0 4px 12px rgba(0,0,0,0.15);}
.wrap .content{background:#ffffff;padding:30px;border-radius:15px;box-shadow: 0 4px 20px rgba(0,0,0,0.08);border: 1px solid #f0f0f0;}
.wrap .content h2{text-align:center;padding:15px 0 25px;color:#18a5ff;font-size:24px;font-weight:600;background: linear-gradient(135deg, #18a5ff 0%, #66c7ff 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;}
.content .banner{width:100%;margin-bottom:15px;border-radius:10px;overflow:hidden;box-shadow: 0 4px 12px rgba(0,0,0,0.15);}
.content .plus_box{padding:25px;border:1px solid #e0e0e0;border-radius:12px;margin-bottom:20px;font-family:"Microsoft Yahei";font-size:14px; position:relative;background: #fafafa;transition: all 0.3s ease;}
.plus_box:hover{border: 1px solid #18a5ff;transform: translateY(-2px);box-shadow: 0 8px 24px rgba(24, 165, 255, 0.15);}
.plus_box:after{clear:both;content:"";display:block;}
.plus_box .plus_l{width:65%}
.plus_box .plus_l ul{margin-bottom:15px;}
.plus_box .plus_l ul li{color:#555;background: url(https://img.icons8.com/ios-glyphs/30/18a5ff/checkmark-circle.png) no-repeat left center;background-size: 18px 18px;display:block;padding-left:30px;height:40px;line-height:40px;border-bottom:1px solid #f0f0f0;position: relative;}
.plus_box .plus_l ul li:last-child{border-bottom:none;}
.plus_box .plus_l ul li a{background:#18a5ff;color:#fff;padding:6px 12px;border-radius:20px;font-size:13px;transition: all 0.3s ease;}
.plus_box .plus_l ul li a:hover{background:#66c7ff; text-decoration:none;box-shadow: 0 4px 12px rgba(24, 165, 255, 0.3);}
.plus_box .plus_l ul li span{background:url(../img/xing.png) no-repeat 0 -4px;width:88px;height:20px;display:block;position:absolute;top:10px;left:120px;}
.plus_box .plus_l ul li span.xing_a{background-position: 0 -25px;}
.plus_box .plus_l ul li span.xing_b{background-position: 0 -49px;}
.plus_box .plus_l ul li span.xing_c{background-position: 0 -72px;}
.plus_box .plus_l ul li span.xing_d{background-position: 0 -96px;}
.plus_box .plus_l ul li span.xing_e{background-position: 0 -4px;}
.plus_box .plus_r{width: 30%;height: auto;margin:0;padding:0;overflow:hidden;position:absolute;top:25px;right:25px;background:#fff;border-radius:10px;overflow:hidden;box-shadow: 0 4px 12px rgba(0,0,0,0.1);}
.plus_box .plus_r img{width:100%;height:auto;display:block;border-radius:0;}
.plus_box .plus_r:hover{border: none;transform: scale(1.02);box-shadow: 0 8px 24px rgba(0,0,0,0.15);}

.content .panel{margin-bottom:20px;background-color: #fff;border: 1px solid #e0e0e0;border-radius: 12px;-webkit-box-shadow: 0 4px 12px rgba(0,0,0,0.08);box-shadow: 0 4px 12px rgba(0,0,0,0.08);transition: all 0.3s ease;overflow: hidden;}
.panel:hover{border: 1px solid #18a5ff;transform: translateY(-2px);box-shadow: 0 8px 24px rgba(24, 165, 255, 0.15);}
.panel-heading{padding: 15px 20px;border-bottom: 1px solid #f0f0f0;border-top-left-radius: 12px;border-top-right-radius: 12px;color: #fff;background: linear-gradient(135deg, #18a5ff 0%, #66c7ff 100%);font-weight: 600;}
.panel-heading h3{margin-top: 0;margin-bottom: 0;font-size: 16px;color: inherit;font-family: inherit;font-weight: 600;line-height: 1.1;}  
.panel-heading h3 span{float:right;font-size:14px;color:#fff;opacity:0.9;}
.panel-body{padding:20px;display:block}
.panel-body .downfile{color:#fff;float:left;margin:0 15px 15px 0;}
.panel-body .downfile a{background: linear-gradient(135deg, #18a5ff 0%, #66c7ff 100%);color:#fff;font-size:16px;font-weight:500;display:block;padding:18px 25px;border-radius:10px;box-shadow: 0 4px 12px rgba(24, 165, 255, 0.2);transition: all 0.3s ease;position: relative;overflow: hidden;}
.panel-body .downfile a::before{content: '';position: absolute;top: 0;left: -100%;width: 100%;height: 100%;background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);transition: left 0.5s ease;}
.panel-body .downfile a:hover{transform: translateY(-2px);box-shadow: 0 8px 24px rgba(24, 165, 255, 0.3);}
.panel-body .downfile a:hover::before{left: 100%;}
.panel-body .help li{line-height:28px;font-size:14px;color:#555;padding:8px 0;border-bottom:1px dashed #f0f0f0;}
.panel-body .help li:last-child{border-bottom:none;}
.panel-body .help li em{font-style:normal;background: linear-gradient(135deg, #18a5ff 0%, #66c7ff 100%);padding:6px 12px;border-radius:20px;color: #fff;font-weight:500;}
.panel-body .shengming{display:block;line-height:28px;font-size:14px;color:#e74c3c;background: #fff5f5;padding:20px;border-radius:10px;border:1px solid #ffebee;word-wrap:break-word;word-break:break-all;}
.panel-body .hotlist{}
.panel-body .hotlist li{font-size:14px;line-height:25px;border-bottom:1px solid #eee;padding:5px 0;overflow:hidden;text-overflow: ellipsis;white-space:nowrap; position:relative}
.panel-body .hotlist li a{color:#666;}
.panel-body .hotlist li a:hover{color:#18a5ff;}
.panel-body .hotlist li span{background:url(../img/xing.png) no-repeat 0 -2px;width:88px;height:20px; position:absolute;right:88px;}
.panel-body .hotlist li span.xing_a{background-position: 0 -25px;}
.panel-body .hotlist li span.xing_b{background-position: 0 -49px;}
.panel-body .hotlist li span.xing_c{background-position: 0 -72px;}
.panel-body .hotlist li span.xing_d{background-position: 0 -96px;}
.panel-body .hotlist li span.xing_e{background-position: 0 -2px;}
.panel-body .hotlist li em{font-style:normal;font-size:12px;margin-left:10px;position:absolute;right:0;}
.wrap .footer{padding:30px 0 40px;text-align:center;background: #fafafa;border-top: 1px solid #f0f0f0;}
.wrap .footer p{text-align:center;padding-bottom:12px;font-size:14px;color:#666;}
.wrap .footer p a{color:#18a5ff;transition: all 0.3s ease;}
.wrap .footer p a:hover{color:#66c7ff;text-decoration: underline;}
@media screen and (max-width: 950px){
 .new-topbar .container{width:auto;padding:0 20px;}
 .wrap{width:auto;margin:15px 15px 0;}
 .wrap .diybanner{width:100%;overflow:hidden;}
 .content .banner{width:100%;overflow:hidden;}
 .panel-body .downfile{margin:0 10px 15px;}
 .wrap .footer{padding:20px 0 30px;}
 .plus_box .plus_l{width:100%;}
 .plus_box .plus_r{display:none;}
}
@media screen and (max-width: 600px){
 .new-topbar{background: #ffffff;border-bottom: 1px solid #f0f0f0;}
 .new-topbar .container{width:auto;padding:0 15px;}
 .new-topbar .header-content{height:auto;flex-direction:column;gap:15px;padding:15px 0;}
 .new-topbar .logo a{font-size:20px;}
 .new-topbar .logo i{font-size:24px;}
 .new-topbar .nav-menu{flex-wrap:wrap;justify-content:center;gap:10px;width:100%;}
 .new-topbar .btn{width:100%;justify-content:center;padding:10px 15px;font-size:13px;}
 .wrap{width:auto;margin:10px 10px 0;}
 .wrap .content{padding:15px;border-radius:8px;}
 .wrap .content h2{font-size:20px;padding:10px 0 20px;}
 .wrap .diybanner{width:100%;overflow:hidden;}
 .content .banner{width:100%;overflow:hidden;}
 .plus_box{padding:20px 15px;}
 .plus_box .plus_r,.panel-body .hotlist li em,.panel-body .hotlist li span{display:none}
 .panel-body{padding:15px;}
 .panel-body .downfile{margin:0 10px 15px;width:calc(50% - 20px);}
 .panel-body .downfile a{padding:15px 20px;font-size:14px;}
 .wrap .footer{padding:20px 0 30px;}
 .wrap .footer p{font-size:13px;}
}