@charset "utf-8";
html{color:#000;background:#FFF; }
body { color:#333;font:14px/1.231 "Microsoft YaHei";} /*网站字体颜色*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;} 
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}
input,select{vertical-align:middle;}
select,input,button,textarea,button{font:99% "Microsoft YaHei";}
table{font-size:inherit;font:100%; border-collapse:collapse;}
pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}
i,em{ font-style:normal;}
/*title*/
h1 { font-size:32px;}
h2 { font-size:26px;}
h3 { font-size:20px;}
h4 { font-size:14px;}
h5 { font-size:12px;}
h6 { font-size:10px;}

.mt10{ margin-top:10px;}

a { color:#333; text-decoration:none;}  /*for ie f6n.net*/
a:focus{outline:0;} /*for ff f6n.net*/
a:hover { text-decoration:none;}
.vam { vertical-align:middle;}
.clear{clear:both; height:0; line-height:0; font-size:0;}
p{ word-spacing:-1.5px;}
.tr { text-align:right;}
.tl { text-align:left;}
.center { text-align:center;}
.fl { float:left;}
.fr { float:right;}
.pa{ position:absolute;}
.pr{ position:relative}

/*common*/
.mb10 { margin-bottom:10px;}
.ml10 { margin-left:10px;}
.bg { background:#FFF;}

.xiaoguo7 h2{animation-name:bounce; animation-duration:1s;}
.xiaoguo7 .ss{animation-name:slideInLeft; animation-duration:1s;}
.xiaoguo7 .pt_com{animation-name:slideInRight; animation-duration:1s;}
/**/
/**/

.banner a{ display:block; background:url(../images/banner.jpg) no-repeat center top; height:560px; overflow:hidden;}

.banner{height: 560px;}
.ibanner{width:100%;height:560px;position:relative;overflow:hidden;z-index:0;}
.ibanner .bd{position:relative;width:100%;height:560px;overflow:hidden;z-index:0;}
.ibanner .bd li{width:100%;height:560px;}
.ibanner .bd a{display:block;height:560px;background-position:center;background-repeat:no-repeat;z-index:0;}
.ibanner .btn{position:absolute;width:79px;height:79px;top:50%;margin-top:-40px;background:url(../images/banner_btn.png);z-index:3;cursor:pointer;z-index:1;}
.ibanner .btn.prev{left:-130px;background-position:0 0;-webkit-transition: left .3s;transition: left .3s;}
.ibanner .btn.next{right:-130px;background-position:-80px 0;-webkit-transition: right .3s;transition: right .3s;}
.ibanner:hover .prev{left:30px;}
.ibanner:hover .next{right:30px;}
.ibanner .btn.prev:hover{background-position:0 -80px;}
.ibanner .btn.next:hover{background-position:-80px -80px;}
.ibanner .pageState { bottom: 67px; color: #fff;font-size: 25px; left: 50%;margin-left: 559px;position: absolute;}
/**/
.brand{ background:#FFF ; padding-bottom:60px;}
.brand .videos{float:left; width:608px;position:relative; }
.brand .videos .more{ position:absolute; width:204px; height:50px; line-height:50px; font-weight:bold; text-align:center; color:#333333; font-size:14px;background:url(../images/sp_03.png);}

.brand .br_tit{float:right;width:588px; text-align:center;border-right:2px solid #eeeeee; }
.brand .br_tit .ywbt{font-size:98px;color:#f2f2f2; text-transform:uppercase; font-weight:bold;}
.brand .br_tit h2{ margin-top:-45px;}
.brand .br_tit h2 a{ font-size:28px; color:#333333; line-height:45px;}
.brand .br_tit h2 span{ font-size:22px;  display:block; font-weight:normal;}
.brand .br_tit .short{margin-top:15px; font-size:14px;color:#666666;padding:0 42px;line-height:30px; text-align:left;}
.brand .br_tit .short span{ display:block;padding-left:29px;}

.brand .brand_b{height:178px; margin-top:60px;}
.brand .brand_b dl{ float:left;width:190px; margin-right:10px; overflow:hidden; text-align:center;}
.brand .brand_b dl img{width:100%;}
.brand .brand_b dl a{color:#333333; font-size:14px; line-height:36px;}
.brand .brand_b dl.cur img{border:2px solid #fece00;width:186px;}
.brand .brand_b dl:last-child{margin-right:0px;}
/*产品*/
.pro {background:url(../images/pro_bg.jpg); padding:75px 0 40px;}
.pro h2{ color:#333333; font-size:40px;text-align:center;height:100px; line-height:52px; overflow:hidden; }
.pro h2 span{ color:#333; font-size:26px; border-top:1px solid #333; border-bottom:1px solid #333; height:50px; line-height:50px; font-weight:normal;display: inline-block;margin-left:15px; }

.pnav{float:left; width:260px; background:#FFF; }
.pnav .tit { background:url(../images/nav_top.jpg) no-repeat; height:100px;margin-bottom:5px; }
.pnav .tit a{padding-top:20px; line-height:45px; display:block; text-align:center; font-size:26px; color:#333333; font-weight:bold;}
.pnav .tit em{ font-family:Myriad Pro; text-transform:uppercase; font-size:16px; color:#333333; font-weight:normal; line-height:22px; display:block;}
.pnav h3 a{ height:50px; line-height:50px; border-left:4px solid #fece00; color:#FFF; font-size:16px; padding-left:46px; background:#333;display:block;}
.pnav h3 a:hover{color:#fece00;}
.pnav ul{padding:11px 0 8px;}
.pnav li { height:43px; line-height:28px;font-size:16px;display:block;}
.pnav li a{ color:#666; display:block; padding-left:58px;}
.pnav li a:hover{color:#FECE00;}
.pro .bot{background:url(../images/nav_bot.jpg) no-repeat; height:70px;}
.pro .bot p{ color:#fece00; font-size:18px; line-height:22px;padding-left:18px; font-weight:bold;}
.pro .bot p span{width:60px; text-align:center;color:#fece00;font-size:14px;float:left;margin-right:10px; display:block; height:28px;}
.pro .bot .bot1{padding-top:10px;font-weight:normal; height:29px; line-height:29px;font-size:20px;}

.plist{float:right; width:920px;}
.plist dl{background:#FFF; height:252px;margin-bottom:20px; overflow:hidden;}
.plist dl dt{width:440px; height:220px;padding:15px 0; float:left;text-align: center;}
.plist dl dt img{width:252px; height:252px; transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; -o-transition: .3s;}
.plist dl dt a:hover img{transform: scale(1.05); -webkit-transform: scale(1.05);}
.plist dl dd{width:360px; float:right;padding:15px 60px 0 0;}
.plist dl dd b{ height:60px; line-height:60px; overflow:hidden; font-size:20px;}
.plist dl dd .desc{ line-height:25px; font-size:14px; height:130px; overflow:hidden;}
.plist dl dd .desc p{padding-left:15px; background:url(../images/py.jpg) no-repeat left center;line-height:25px;height:25px;color:#666666;}
.plist dl dd .desc p.cur{ background:url(../images/py_cur.jpg) no-repeat left center;color:#FF0000;}
.plist dl dd .more{width:107px; height:33px; text-align:center; line-height:33px; color:#333333; background:url(../images/pro_bt1.jpg); display:block;}
.plist dl dd .more:hover{ background:url(../images/pro_bt2.jpg);}
.plist dl.pl2 dt{float:right;} 
.plist dl.pl2 dd{float:left; padding-right:0; padding-left:80px;}

/*合作客户*/
.partner {margin-bottom:66px;}
.partner h2{ text-align:center; height:120px; margin-top:15px;}
.partner h2 img{ display:block;margin:0 auto;}
.partner .pt_com{width:100%; height:87px; position:relative;}
.partner .pt_com li{ float:left; width:173px;height:87px; padding:0 13px; }
.partner .pt_com li img{width:171px; height:85px;border:1px solid #dddddd; border-radius: 8px; }
.partner .pt_com li a:hover img{ border-color:#fece00;}
.partner .pt_com .prev,.partner .pt_com .next{width:40px;height:40px;display:block;position:absolute;top:20px; background:url(../images/common/icon1.png) no-repeat;}
.partner .pt_com .prev{left:-40px; background-position:0 0;}
.partner .pt_com .next{right:-40px;background-position:-40px 0;}
.partner .pt_com .prev:hover{background-position:0 -40px;}
.partner .pt_com .next:hover{background-position:-40px -40px;}
/**/
.adv {background:#FFF; padding:75px 0 70px;}
.adv h2{ color:#333333; font-size:40px;text-align:center;height:94px; line-height:52px; overflow:hidden; }
.adv h2 span{ color:#333; font-size:26px; border-top:1px solid #333; border-bottom:1px solid #333; height:50px; line-height:50px; font-weight:normal;display: inline-block;margin-left:15px; }
.adv .adv_com{ height:444px; overflow:hidden; position:relative;margin-bottom:50px;}
.adv .adv_com .tit{ position:absolute; top:0px; left:532px;width:136px;}
.adv .adv_com .tit .cgt{width:136px; height:85px; text-align:center; background:url(../images/advbg.jpg) no-repeat; font-weight:bold; font-size:20px; line-height:28px;padding-top:30px;margin-top: -2px;color:#646363;}
.adv .adv_com .tit .cgt strong{color:#333333;display:block;}
.adv .adv_com .tit .cgt.on{background:url(../images/advbg_cur.jpg) no-repeat;}
.adv .adv_com .tit .zx { display:block; width:140px; height:60px; text-align:center;}

.adv .vs { padding-top: 24px; height:420px;}
.adv .vs_lg{ position:absolute;left:419px; bottom:18px;z-index:2;}
.adv .vs_zx{ position:absolute;right:50%;margin-right: -71px; bottom:0;z-index:2;width:140px; height:40px; line-height:40px; text-align:center; background:url(../images/btn_h.png);}

.adv .vs dl{ width:440px;height:390px;padding:30px; background:#fece00; float:left;}
.adv .vs dl dt{width:440px;height:248px; overflow:hidden;}
.adv .vs dl b{margin-top:18px; height:40px; line-height:40px; border-bottom:1px solid #d5af0a; font-size:18px; display:block;}
.adv .vs dl p{ font-size:14px;margin-top:10px; line-height:22px;}
.adv .vs dl.ct{ background:#333; float:right;color:#FFF;}
.adv .vs dl.ct b{border-color:#5c5c5c;}

.adv .zz{ text-align:center; position:relative;height:80px;}
.adv .zz a{width:200px; height:80px; line-height:80px; font-size:16px; text-align:center; background:url(../images/btn2.jpg) no-repeat;margin-right:49px; position:relative; z-index:1;float:left; font-weight:bold;border-radius: 100%;}
.adv .zz a:hover,.adv .zz a.cur{background:url(../images/btn2_cur.jpg) no-repeat;box-shadow: 0 0 35px #c0c0c0;}
.adv .zz a.lat{margin-right:0;}
.adv .zz i{ width:100%; border-top:1px solid #eeeeee; position:absolute; top:40px; left:0;z-index:0;}

.adv .honer{ position:relative; height:335px; margin-top:49px;}
.adv .honer .hc{width:1200px; overflow:hidden;}
.adv .honer li{ float:left;width:260px; height:335px; margin-right:55px}
.adv .honer li img{max-width: 230px;height: auto;width:100%;display: block;border: 15px solid #e8e8e8;}
.adv .honer .prevn{ position:absolute;top:122px; left:-70px;z-index:1;}
.adv .honer .nextn{ position:absolute;top:122px; right:-70px;z-index:1;}
/**/
.bz {background:url(../images/bz_bg.jpg); padding:75px 0 0; height:685px;}
.bz h2{ color:#FFF; font-size:40px;text-align:center;height:100px; line-height:52px; overflow:hidden; }
.bz h2 span{ color:#FFF; font-size:26px; border-top:1px solid #FFF; border-bottom:1px solid #FFF; height:50px; line-height:50px; font-weight:normal;display: inline-block;margin-left:15px; }
.bz_com li{width:78px; height:500px; float:left; overflow:hidden;margin-right:2px;}
.bz_com li .nl{width:640px;}
.bz_com i{ display:inline-block; float:left;float:left; width:30px; background:#FFF; height:500px; padding:0 24px;  font-size:18px; text-align:center; margin-right:2px; cursor:pointer; background:#FFF url(../images/jia.jpg) no-repeat center 390px;  line-height:25px;}
.bz_com i em{ display:block; color:#fece00; border-bottom:1px solid #fece00;padding-top:90px; font-weight:bold; font-size:32px;padding-bottom:16px;width:30px;margin-bottom:40px;}
.bz_com p{ display:block;width:560px; height:500px; float:left; overflow:hidden; position:relative;}
.bz_com p span{ position:absolute;bottom:0; left:0; display:none; background:url(../images/pj_bg.png) repeat-x bottom center; line-height:26px;font-size:14px; font-weight:bold; color:#FFF; padding:70px 28px 20px; }
.bz_com .bz8 {margin-right:0;}
/**/
.fw.content{ background:url(../images/fw_bg.jpg) no-repeat center top;margin-top:80px; height:692px; position:relative;}
.fw li{ position:absolute; top:200px; width:328px;text-align:right;}
.fw li b{padding-right:56px; font-size:20px; background:url(../images/fw1.jpg) no-repeat right top; display:block; height:36px; line-height:36px;}
.fw li p{padding-right:56px;line-height:24px; font-size:14px;color:#666666;}
.fw li.fw_01{left:0;}
.fw li.fw_02{right:0;text-align:left;} 
.fw li.fw_02 b{padding-left:56px;background:url(../images/fw2.jpg) no-repeat left top; }
.fw li.fw_02 p{padding-left:56px;padding-right: 8px;}

.fw li.fw_03{left:0;top:376px;} 
.fw li.fw_03 b{padding-left:56px;background:url(../images/fw3.jpg) no-repeat right top; }

.fw li.fw_04{top:376px; right:0;text-align:left;} 
.fw li.fw_04 b{padding-left:56px;background:url(../images/fw4.jpg) no-repeat left top; }
.fw li.fw_04 p{padding-left:56px;padding-right: 8px;}

.fw li.fw_05{left:0;top:538px;} 
.fw li.fw_05 b{padding-left:56px;background:url(../images/fw5.jpg) no-repeat right top; }

.fw li.fw_06{top:538px; right:0;text-align:left;} 
.fw li.fw_06 b{padding-left:56px;background:url(../images/fw6.jpg) no-repeat left top; }
.fw li.fw_06 p{padding-left:56px;padding-right: 8px;}
.fw li.fw_btn{top:210px;left:50%;margin-left:-70px;}
.fw li.fw_btn a{ display:block;border:1px solid #FFF; border-radius: 18px;width:140px; height:40px; line-height:40px; text-align:center;color:#FFF;font-size:18px;}
/**/
.lc{ height:310px; }
.lc h2{ text-align:center; color:#fece00; font-size:30px; font-weight:normal;margin:40px 0;}
.lc h2 em{color:#4a4742; display:inline-block;padding:0 5px;}
.lc ul{ display:block;padding:0 40px;}
.lc li{float:left; width:120px; padding-right:80px; background:url(../images/jiat.jpg) no-repeat 156px 55px;}
.lc li span{display:block; line-height:66px; text-align:center; font-size:16px;}
.lc li img{ display:block; -webkit-transition:all .8s ease-in-out;-moz-transition:all .8s ease-in-out;transition:all .8s ease-in-out}
.lc li:hover img{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}
.lc li:hover span{ font-weight:bold; color:#000}
.lc li.lat{padding-right:0; background:none;}
.lc li i{width:80px; height:80px;padding:20px; background:url(../images/lc_bg.jpg); display:block;}
.lc li.cur i{ background:url(../images/lc_bg_cur.jpg);}
/**/
.pj {background:url(../images/pro_bg.jpg) repeat-y center top; padding:75px 0 0; height:685px;}
.pj h2{  font-size:40px;text-align:center;height:100px; line-height:52px; overflow:hidden; }
.pj h2 span{  font-size:26px; border-top:1px solid #333; border-bottom:1px solid #333; height:50px; line-height:50px; font-weight:normal;display: inline-block;margin-left:15px; }
.pj .pjl{width:260px;}
.pj .pjl h3{ height:66px; line-height:66px; border-bottom:1px solid #dedede;}
.pj .pjl h3 a{ display:block; background:#FFF url(../images/pjico.jpg) no-repeat 25px center; padding-left:55px; font-size:16px; font-weight:normal;}
.pj .pjl h3 a:hover,.pj .pjl h3.cur a{ background:#fece00 url(../images/pjico_cur.jpg) no-repeat 25px center;}
.pj .pjl h3.more a{background:#333333 url(../images/pjico_more.jpg) no-repeat 25px center;color:#FFF;}
.pj .pjr{width:930px;}
.pj .pjr li{float:left; width:300px; height:172px; position:relative;margin-left:10px;margin-bottom:10px; overflow:hidden;}
.pj .pjr li img{width:300px;height:172px;}
.pj .pjr li span{ position:absolute;bottom:0; left:0; display:block; background:url(../images/pj_bg.png) no-repeat bottom center; line-height:22px;font-size:14px; font-weight:bold; color:#FFF; padding:7px 10% 10px;width:80%;}
/**/

.new{ height:600px;overflow:hidden;}
.new h2{ margin-top:45px; height:55px; overflow:hidden; background:url(../images/dy_bg1.gif) repeat-x center bottom;margin-bottom:20px; text-align:center; }
.new h2 i{background:url(../images/dy_bg2.jpg) repeat-x center bottom;color:#333; display:inline-block; height:55px; margin:0 auto;}
.new .new_l{float:left;width:700px;}
.newt{ height:60px; overflow:hidden; background:url(../images/newbg.jpg) no-repeat right center; }
.newt li{ font:24px "Microsoft YaHei"; line-height:58px; font-weight:bold; float:left; margin-right:40px;}
.newt li a{ color:#333;font-size:20px;font-weight:normal; display:block; height:58px;border-bottom:2px solid #FFF; background:#FFF; }
.newt li a:hover,.newt .cur a{ border-bottom:2px solid #fece00;font-weight:bold;}
.new2 dl{width:100%; height:196px; padding-top:30px;margin-bottom:45px; }
.new2 dt{ width:280px;height:196px; float:left; overflow:hidden;}
.new2 dt img{ display:block; float:right; width:278px; height:194px; border:1px solid #dfdfdf;}
.new2 dd{ width:380px; float:right;padding-right:16px;}
.new2 dd h3 a{display:block; font:16px "Microsoft YaHei"; font-weight:bold; line-height:30px; color:#282828; height:30px; overflow:hidden; color:#282828;}
.new2 dd h3 a:hover{ color:#996d48;}
.new2 dd p{ font:14px "Microsoft YaHei"; line-height:28px; color:#666; height:84px; margin-top:12px; overflow:hidden;}
.new2 dd .mo{width:106px; height:33px; line-height:33px; text-align:center; font-size:14px;color:#ffffff; display:block; background:url(../images/pro_bt2.jpg);margin-top:20px;}
.new2 ul li{ height:37px; line-height:37px;float:left;width:50%;}
.new2 ul li i{ display:block;width:14px;background:url(../images/dy_bg2.jpg) repeat-x center; float:left;height:37px;}
.new2 ul li a{ display:block;float:left;width:320px;padding-left:9px;color:#666666; overflow: hidden; text-overflow:ellipsis;white-space:nowrap; border-right:1px dashed #ebebeb;}
.new2 ul li.nones i{margin-left:64px;}
.new2 ul li.nones a{ border:0;width:230px;}


.new .new_r{float:right;width:422px;}
.new .new_r h3{height:60px; overflow:hidden; }
.new .new_r h3 a{color:#666;font-size:20px; line-height:60px; font-weight:normal;}
.new .new_r h3 i{font-size:16px;padding-left:10px;}
.new .new_r h3 em{width:26px; height:60px; float:right; display:block; background:url(../images/newbg.jpg) no-repeat right center;}
.new .new_r dl{padding-bottom:18px; margin-bottom:20px; border-bottom:1px dashed #ebebeb;}
.new .new_r dt a{ display:block; height:33px; line-height:33px; padding-left:46px; background:url(../images/wen.jpg) no-repeat left center; color:#666666; font-size:16px; font-weight:bold;overflow: hidden; text-overflow:ellipsis;white-space:nowrap;}
.new .new_r dd{padding-left:46px; line-height:30px;font-size:14px; color:#666666;}
.new .new_r dl.cur dt a{ background-image:url(../images/wen_cur.jpg);}
/**/

.about{ padding-top:64px; overflow:hidden; background:url(../images/about_bg.jpg) no-repeat center top;}
.about h2{ height:80px; font-size:32px; line-height:80px; font-weight:bold; text-align:center; margin-bottom:24px; }
.about h2 a{ color:#282828;}
.about h3{ width:1000px; height:360px; margin:35px auto 0; overflow:hidden;}
.about h3 img{ display:block;width:1000px; height:360px;}
.about dl{ text-align:left;}
.about dt{ display:block;height:120px; overflow:hidden;margin-top:-50px; position:relative;z-index:2;}
.about ul{ height:100px; margin:0 auto ; text-align:center;}
.about li{display:inline-block;*display:inline;zoom:1; width:100px; height:100px; margin-right:30px; font:16px "Microsoft YaHei"; font-weight:bold; text-align:center; background:url(../images/yuan.png) no-repeat center top; }
.about li a{ display:block; width:100px; padding-top:16px;color:#777777;}
.about li em{ display:block; padding:12px 0 0;}
.about li.cur{ background:url(../images/yuan_cur.png) no-repeat center top;}
.about li.cur em{color:#333;}
.about dd{ width:770px; font:14px "Microsoft YaHei"; line-height:33px; color:#333; overflow:hidden; margin:0 auto;}
.about li i{ width:30px;height:30px;display:block;margin:0 auto; background:url(../images/ab_ico1.jpg) no-repeat center bottom;}
.about li.cur i{background-image:url(../images/ab_ico10.jpg);}
.about li i.ico2{background-image:url(../images/ab_ico2.jpg);}
.about li i.ico3{background-image:url(../images/ab_ico3.jpg);}
.about li i.ico4{background-image:url(../images/ab_ico4.jpg);}
.about li.cur i.ico2{background-image:url(../images/ab_ico20.jpg);}
.about li.cur i.ico3{background-image:url(../images/ab_ico30.jpg);}
.about li.cur i.ico4{background-image:url(../images/ab_ico40.jpg);}


.link{ background:url(../images/link_bg.jpg) no-repeat left 10px;border-top:1px solid #eeeeee;padding:20px 0 0 80px;  height:52px; margin-bottom:35px; font:14px "Microsoft YaHei"; line-height:52px; height:52px; color:#555; font-weight:bold;overflow:hidden; }
.link p a{ display:inline-block; color:#555; padding: 0 20px; font-weight:normal;}
.link p a:hover{ color:#000;}

 /* 2. 图片放大模态框（默认隐藏） */
        .img-modal {
            position: fixed; /* 固定在屏幕上 */
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.8); /* 半透明黑色背景 */
            display: none; /* 默认隐藏 */
            justify-content: center; /* 水平居中 */
            align-items: center; /* 垂直居中 */
            z-index: 9999; /* 确保在最上层，不被其他元素遮挡 */
        }
        /* 放大后的图片样式 */
        .modal-img {
            max-width: 80%; /* 最大宽度不超过屏幕80% */
            max-height: 80%; /* 最大高度不超过屏幕80% */
            height: auto;
            border: 4px solid #fff;
            border-radius: 4px;
        }
        /* 关闭按钮（右上角） */
        .close-btn {
            position: absolute;
            top: 20px;
            right: 30px;
            color: #fff;
            font-size: 36px;
            cursor: pointer;
            transition: color 0.3s;
        }
        .close-btn:hover {
            color: #ccc; /* hover时变浅 */
        }