html{margin:0;padding:0;border:0;} body,div,span,object,iframe,h1,h2,h3,h4,p,blockquote,pre,a,address,code,b,em,img, dl,dt,dd,ol,ul,li,fieldset,form,label,footer, header,hgroup,nav,section {margin:0;padding:0;border:0;} body{background:#fff;color:#666;position:relative;font:12px/1.5 Microsoft YaHei,arial,宋体,sans-serif;vertical-align:baseline;width:100%;overflow-x:hidden;} a{text-decoration:none;outline:none;} a:link{color:#666;} a:visited{color:#666;} a:hover,a:active,a:focus{color:#e87518;text-decoration:none;outline:none;} input{padding:0;margin:0;font-family:'Microsoft YaHei';} img{border:none;background:none;vertical-align:middle;} ul,ol,li{list-style-type:none;} select,input,img,select{vertical-align:middle;} table{border-collapse:collapse;border-spacing:0} table, th, td {vertical-align: middle} .clearfix:after{content: ".";display: block;height: 0;clear: both;overflow: hidden;visibility: hidden;} .clearfix{zoom:1} .clearboth{height:0px;line-height:0px;overflow:hidden;clear:both;font-size:0px;} h1,h2,h3,h4{font-size:12px;font-weight:bold;} hr {border: 0;border-top:1px solid #ccc;height:0;} /*头部样式*/ .sky{width:1920px;position:relative;left:50%;margin-left:-960px;height:35px;background:#dddddd;} .sky_con{width:1200px;margin:0 auto;} .huan{float:left;color:#666666;font:400 12px/35px "Microsoft Yahei";} .huan a{line-height:35px;color:#666666;font-size:12px;padding-right: 5px;} .k1x{float:right;line-height:35px;color:#000;font:400 16px/35px "Microsoft Yahei";margin-top: 40px;} .k1x a{color:#000;} .tou_con{width:1920px;position:relative;left:50%;margin-left:-960px;background:#fff} .tou{width:1200px;margin:0 auto;height:150px;overflow:hidden} .logo{float:left;line-height:150px;} .telx{float:right;font:400 20px/40px "Microsoft Yahei";color: #333333;} /* 导航样式 */ #menu{width:1920px;position:relative;left:50%;margin-left:-960px;background:url(../images/dao.png) repeat-x;} .xypg-left-title { line-height: 62px; text-align: center; color: #fff; font-size: 22px; background: #03479c; font-weight: bold; margin: 0; } .xy-menu { width: 1200px; margin:0 auto; } .xy-menu > li { float: left; width: 16.6%; position: relative; } .xy-menu>li.active>a,.xy-menu>li>a:hover { background:url(../images/dao1.png) repeat-x; color: #014785; font-weight: 600; } .xy-menu > li:after { position: absolute; left: 0; right: 0; height: 17px; content: ''; opacity: 0; } .xy-menu > li > a { display: block; text-align: center; font-size: 16px; color: #ffffff; line-height: 86px; } .xy-menu > li > a .creat { width: 0; height: 0; line-height: 0; font-size: 0; overflow: hidden; border-width: 3px; cursor: pointer; border-style: solid dashed dashed dashed; border-color: #fff transparent transparent transparent; border-bottom: none; display: inline-block; vertical-align: middle; margin-left: 5px; } .xy-menu .active a { color: #fff; } .xy-menu > li + li { background: url(../images/xy-navlibg.png) left center no-repeat; } .xy-menu .xy-sub-menu { display: none; position: absolute; width: 100%; border-top: 2px solid #ab001a; left: 0; top: 86px; -webkit-box-shadow: 0px 4px 6.86px 0.14px rgba(8, 1, 3, 0.52); box-shadow: 0px 4px 6.86px 0.14px rgba(8, 1, 3, 0.52); background: #fff; padding-bottom: 4px; z-index: 9999; } .xy-menu .xy-sub-menu > li { border-bottom: 1px solid #e5e5e5; } .xy-menu .xy-sub-menu > li > a { display: block; line-height: 45px; font-size: 14px; color: #666; position: relative; padding-left: 15%; -webkit-transition: all .5s ease; transition: all .5s ease; padding-right: 15%; } .xy-menu .xy-sub-menu > li > a:after { position: absolute; right: 12%; top: calc(50% - 3.5px); content: ''; width: 5px; height: 7px; background: url(../images/xy-sub-nav-jt.png) 0 -7px no-repeat; } .xy-menu .xy-sub-menu > li > a:hover { background: #ececec; color: #666; padding-left: 22%; } .xy-menu .xy-sub-menu > li > a:hover:after { background-position: 0 0; } .xy-menu > li:hover .x-sub-menu { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } .x-sub-menu { position: absolute; z-index: 99; width: 150%; left: -25%; top: 125px; background: #fff; border-radius: 5px; padding: 10px 0; opacity: 0; visibility: hidden; -webkit-transform: translateY(20px); transform: translateY(20px); -webkit-transition: all .5s ease; transition: all .5s ease; display: none; } .x-sub-menu > li > a { display: block; text-align: center; line-height: 2; font-size: 14px; color: #333; line-height: 1.5; padding: .5em; } .x-sub-menu > li > a:hover { background: #e9eaeb; } .x-sub-menu:after { content: ''; width: 0; height: 0; line-height: 0; font-size: 0; overflow: hidden; border-width: 10px; cursor: pointer; border-style: dashed dashed solid dashed; border-color: transparent transparent #fff transparent; border-top: none; position: absolute; top: -10px; left: 50%; margin-left: -10px; z-index: 99; } /*搜索和热门搜索*/ #formsearch{width:408px;float:left;margin-right:60px;margin-top:20px;background: url(../images/ss.jpg) no-repeat} #search-type{float: left;width:100px;height: 24px;border: 1px solid #c8c8c8;margin-right: 5px;} .hotSearch a{margin-right:6px;} #formsearch input{background:none;border:none;float:left;width:350px;outline: none;} #formsearch input#keyword{height:35px;line-height:35px;padding-left:4px;color:#fff;} #formsearch input#s_btn{width:44px;height:35px;line-height:35px;text-align:center;float: right;;color:#fff;border:none;cursor:pointer;} ::-webkit-input-placeholder{ color: #fff; } /*首页banner*/ div.wrapper { margin: 0 auto; position: relative;height:640px;width: 1920px;left:50%;margin-left:-960px;} .fn-clear { zoom: 1; } .box_skitter { position: relative; background: none; } .box_skitter ul { display: none; } .box_skitter .container_skitter { overflow: hidden; position: relative; } .box_skitter .image { overflow: hidden; } .box_skitter .image img { display: none; width:1920px;height:640px !important;z-index:9999;} .box_skitter .box_clone { position: absolute; top: 0; left: 0; width: 100px; overflow: hidden; display: none; z-index: 20; } .box_skitter .box_clone img { position: absolute; top: 0; left: 0; z-index: 20; } .box_skitter .prev_button { position: absolute; top: 50%; left: 300px; z-index: 99999; width: 57px; height: 62px; overflow: hidden; text-indent: -9999em; margin-top: -25px; background: url(../images/prev.png) no-repeat left top !important; } .box_skitter .next_button { position: absolute; top: 50%; right:300px; z-index: 99999; width: 57px; height: 62px; overflow: hidden; text-indent: -9999em; margin-top: -25px; background: url(../images/next.png) no-repeat left top !important; } .box_skitter .next_button:hover{background: url(../images/re.png) no-repeat left top !important;} .box_skitter .prev_button:hover{background: url(../images/le.png) no-repeat left top !important;} .box_skitter .label_skitter { z-index: 150; position: absolute; display: none; } .loading { position: absolute; top: 50%; right: 50%; z-index: 10000; margin: -16px -16px; color: #fff; text-indent: -9999em; overflow: hidden; background: url(../images/ajax-loader.gif) no-repeat left top; width: 31px; height: 31px; } #slideshow { width: 1920px; height: 640px; position: absolute;left:50%;margin-left:-960px;overflow-x:hidden;} #slideshow ul { display: none; } #slideshow ul img{width:1920px;height:640px;} .wzs{width:100%;position:absolute;text-align:center;top:200px;z-index:999;} .wznr{text-align:center;color:#fff;font-size:70px;font-weight:bold;} .wznr span{color:#fff;font-size:16px;font-weight:normal;display:block;text-transform:uppercase;} .wznr b{color:#fff;font-size:18px;font-weight:normal;display:block;text-transform:uppercase;margin-top:10px;} /*技术实力*/ .box1{width:1920px;position:relative;left:50%;margin-left:-960px;background:url(../images/box1.png) no-repeat center top;height:670px;} .box_con{width:1200px;margin:0 auto;padding-top:90px} .ct1{color:#03479c;font-size:42px;text-align:center;} .ct1 span{display:block;text-transform:uppercase;font-size:18px;font-weight:normal;color:#888888;font-family:"Arial";line-height: 30px;} .slx{width:1200px;margin:0 auto;height:340px;overflow: hidden;margin-top:60px;} .slx li{float:left;width:273px;height:340px;margin-bottom:14px;margin:0 13px;position:relative;} .slx li .tpx{width:273px;height:340px;margin:0 auto;position:relative;} .slx li .tp2x{position:absolute;top:56px;z-index:99999;text-align:center;width:100%;} .slx li .tp1x{position:relative;z-index:999;width:100%;text-align:center;} .tm{background:url(../images/tm.png) no-repeat center top;width:273px;height:340px;z-index:9999;position:absolute;right:0px;top:0px;} .slx li h3{color:#ffffff;font-size:32px;text-align:center;font-weight:bold;display:block;text-align:center;position:absolute;width:100%;top:38%;z-index:99999} .slx li h3 a{color:#ffffff;font-size:32px;text-align:center;} .slx li:hover h3 a{color:#ffffff;} .slx li span{width:223px;left:25px;color:#ffffff;font-size:14px;text-align:center;font-weight:normal;display:block;text-align:center;position:absolute;top:55%;z-index:99999} .x-message-wrap{ margin:1% 0; } /*高品质追求*/ .box2{width:1200px;margin:0 auto;margin-top:20px;} .tabz{position:relative;display:flex;justify-content:center;align-items:center;margin-top:50px;} .tabz li{float:left;width:140px;height:32px;display:block;line-height:32px;background:#eaeaea;text-align:center;color:#666666;font-size:14px;cursor: pointer;margin-left:10px;} .tabz li.cur{color:#fff;text-decoration:none;font-size:14px;background:#03479c;} .tabz li:hover, .tabz li.cur { background: #03479c; position: relative; color: #fff; cursor: pointer; } .tabz li:hover a, .tabz li.cur a { color: #fff; } .ttz{display: none;margin-top:30px;} .list1z{padding:8px 10px;} .list1z li{position:relative;vertical-align: middle;float:left;margin-right:26px;margin-bottom:26px} .list1z li a.img{display:block} .list1z li a.img img{width:376px;height:270px;} .list1z li:nth-child(3n){float:right;margin-right:0px;} .dac{background:#03479c;border-bottom-left-radius:5px;border-bottom-right-radius:5px;line-height:45px;height:45px;} .list1z li h3{color:#fff;font-size:16px;float:left;font-weight:normal;margin-left:5%;} .list1z li h3 a{color:#fff;font-size:16px;line-height:45px;} .list1z li:hover .dac{background:#b99562;} .mx{float:right;color:#fff;font-size:16px;margin-right:5%;} .mx a{color:#fff;font-size:16px;} /*sun_sj*/ .sun_sj{width:1920px;position:relative;left:50%;margin-left:-960px;background:url(../images/sj.png) no-repeat center top #f5f5f5;height:605px;overflow: hidden;margin-top:50px;} .sun_sj li{width: 20%; height: 115px; float: left; text-align: center; color: #fff; font-size: 14px; box-sizing: border-box;} .sun_sj li+li{border-left: 1px solid #336aaf;} .sz{ font:600 47px/40px "Microsoft Yahei"; color: #fff; margin-top: 15px; } .sz span{ font-size: 14px; font-weight: 400; padding-left: 5px; } .ab{width:1200px;margin:0 auto;background:url(../images/ab.png) no-repeat center top;height:327px;overflow: hidden;margin-top:40px;} .abtp{margin-top:30px;margin-left:30px;width:346px;height:234px;overflow: hidden;float:left;} .abnr{float:right;margin-right:30px;margin-top:30px;width:755px;color:#666666;font-size:14px;line-height:28px;} /*四大优势*/ .ys{width:1920px;position:relative;left:50%;margin-left:-960px;background:#f5f5f5;padding-bottom:60px} .ys_con{width:1200px;margin:0 auto;padding-top:20px;} .ystt{color:#03479c;font-weight:bold;font-size:42px;text-align:center;} .ystt span{display:block;color:#888888;text-transform:uppercase;font-size:18px;font-weight:normal;line-height:45px} .huolong{ margin:40px 0px; } .huolong li{ height: 600px; width: 300px; float: left; position: relative; } .huolong li .img-huo{ position: absolute; top: 0px; width: 300px; height: 300px; } .huolong li:nth-child(even) .img-huo{ position: absolute; top: 300px; width: 300px; height: 300px; } .huolong li .nei-huo{ position: absolute; top: 300px; width: 300px; height: 300px; background: #fff; -webkit-transition-property:color; transition-property:color; -webkit-transition-duration:3s; transition-duration:3s; } .huolong li:nth-child(even) .nei-huo{ position: absolute; top: 0px; width: 300px; height: 300px; } .nei-huo a{ padding-top:30px; text-align: center; color: #03479c; font-size: 24px; display: block;font-weight:bold; width: 100%; } .nei-huo p{ color: #666666; font-size: 14px; width: 248px; margin:0 auto; padding-top: 20px; line-height: 22px; } .nei-huo:hover a{color:#03479c;} /*传世佳作*/ .al{width:1920px;position:relative;left:50%;margin-left:-960px;background:url(../images/al.png) no-repeat center top;height:875px;overflow: hidden;} .al_con{width:1200px;margin:0 auto;padding-top: 100px} .ystt2{color:#fff;font-weight:bold;font-size:42px;text-align:center;} .ystt2 span{display:block;color:#fff;text-transform:uppercase;font-size:18px;font-weight:normal;} .aldt{float:left;width:376px;height:532px;overflow: hidden;margin-top:60px;} .cases{width:790px;float:right;margin-top:60px;} .product_list2 li{float:left;margin-right:38px;margin-bottom:38px;_display:inline;position:relative;width:376px;height:248px;} .product_list2 li a.img img{width:376px;height:248px;} .product_list2 li h3{text-align:center;position:absolute;bottom:0px;width:100%;background:url(../images/h3.png) no-repeat center top;height:40px;color:#fff;} .product_list2 li h3 a{font-weight:normal;line-height:40px;font-size:16px;color:#fff;} .product_list2 li a.img{display:block;} .product_list2 li a.img:hover{border-color:#b99562;} .product_list2 li:nth-child(2n){float:right;margin-right:0px;} /*成就品碑*/ .pin{width:1200px;margin:0 auto;} .chan{text-align:center;padding-top:30px;position:relative;margin-bottom:40px;} .l_btn,.r_btn{position:absolute;cursor:pointer;top:55%;} .l_btn{left:-50px;} .r_btn{right:-50px;} .twt{float: left;} .twt li a.img{display:block;} .twt li a.img img{display:block;width: 273px;height:150px;} .twt li{float: left;overflow: hidden; margin-left: 20px;} #m_demo{overflow:hidden;width:100%;margin:0 auto;padding-top:20px;} #m_indemo {float: left;width:800%} #m_demo1 {float: left;} #m_demo2 {float: left;} .huise{width:1920px;position:relative;left:50%;margin-left:-960px;background:#f5f5f5;padding-bottom:50px;padding-top:70px;} /*案例*/ .xypg-case-list { margin: 0 -1%; font-size: 0 } .xypg-case-list li { display: inline-block; vertical-align: bottom; width: 31.333%; margin: 0 1% 10px; -webkit-transition: all .5s ease; transition: all .5s ease } .xypg-case-list li .img { display: block } .xypg-case-list li .img img{ width: 294px; height: 235px; } .xypg-case-list li h3 a { display: block; text-align: center; font-size: 14px; color: #5a5a5a; line-height: 1.6; padding: .8em 0 } .xypg-case-list li:hover h3 a { color: #ab001a } .xypg-news-list li { border: 1px solid #e1e1e1; padding: 30px; background: #fff; margin-bottom: 35px; -webkit-transition: all .5s; transition: all .5s } .xypg-news-list li .tit { border-bottom: 1px solid #cbcbcb; margin-bottom: 15px; position: relative } .xypg-news-list li .tit h3 { padding-bottom: 15px; font-size: 18px; color: #565656; font-weight: 400; padding-right: 25%; margin: 0 } .xypg-news-list li .tit .date { position: absolute; right: 0; top: 0; font-size: 14px; color: #666 } .xypg-news-list li .info { font-size: 14px; line-height: 2; color: #999 } .xypg-news-list li .more { margin-top: 15px } .xypg-news-list li .more span { display: inline-block; width: 130px; line-height: 33px; text-align: center; color: #000; font-size: 14px; color: #666; border: 1px solid #e1e1e1; -webkit-transition: all .5s ease; transition: all .5s ease } .xypg-news-list li:hover { -webkit-box-shadow: 0 2px 13px 1px rgba(8,1,3,.18); box-shadow: 0 2px 13px 1px rgba(8,1,3,.18) } .xypg-news-list li:hover .tit h3 { color: #292e39 } .xypg-news-list li:hover .more span { color: #fff; background-color: #292e39 } #demo{overflow:hidden;width:100%;margin:0 auto;} #indemo {float: left;width:800%} #demo1 {float: left;} #demo2 {float: left;} .anls{width:1200px;margin:0 auto;padding-top:40px;border-top:1px solid #e5e5e5} .product_list3 li{float:left;margin-right:38px;margin-bottom:38px;_display:inline;position:relative;width:376px;height:248px;} .product_list3 li a.img img{width:376px;height:248px;} .product_list3 li h3{text-align:center;position:absolute;bottom:0px;width:100%;background:url(../images/h3.png) no-repeat center top;height:40px;color:#fff;} .product_list3 li h3 a{font-weight:normal;line-height:40px;font-size:16px;color:#fff;} .product_list3 li a.img{display:block;} .product_list3 li a.img:hover{border-color:#b99562;} /*服务更专业*/ .zy{width:1920px;position:relative;left:50%;margin-left:-960px;background:url(../images/yz.png) no-repeat center top;height:644px;overflow:hidden} .zy_con{width:1200px;margin:0 auto;padding-top:95px;} .twtx{margin-top: 65px;height: 200px;} .twtx li{float: left;width:142px;height:142px;border-radius:142px;border:2px solid #dddddd;} .twtx li a.img{display:block;width:60px;margin:0 auto;margin-top:35px;} .twtx li a.img img{display:block;text-align:center;} .twtx li{float: left;overflow: hidden;margin-right: 34px;} .twtx li h3{text-align:center;color:#333333;font-size:16px;font-weight:normal;display:block;margin-top:5px;} .twtx li h3 a{text-align:center;color:#333333;font-size:16px;font-weight:normal;} .twtx li:last-child{float:right;margin-right:0px;} .sdh{width:382px;height:60px;background:#03479c;line-height:60px;border-radius:50px;text-align:center;color:#fff;margin:0 auto;margin-top:80px;} /*掌握企业资讯*/ .xws{width:1200px;margin:0 auto;margin-top:80px;} /*新闻列表*/ .news_listx{margin-top:40px;} .news_listx li{position:relative;margin-right:10px;width:376px;margin-left:12px;float:left;} .news_listx li a.imgx img{width:376px;height:270px;} .news_listx li a.imgx{display:block;} .news_listx li a{line-height:27px;color:#333333;font-size:18px;margin-top:15px;display:block;} .news_listx li a:hover{text-decoration:none;color:#b99562;} .news_listx li span{color:#999;z-index:0;line-height:27px;position:absolute;right:0px;top:0px;} .news_listx li b{line-height:27px;color:#777777;font-size:14px;margin-top:20px;font-weight:normal;margin-top:10px;} .time{position:absolute;width:70px;height:70px;left:0px;top:15px;background:#2166c5;opacity: 0.9} .time1{color:#ffffff;font-size:40px;font-weight:bold;text-align:center;line-height:40px;margin-top:5px;} .time2{color:#ffffff;font-size:12px;font-weight:normal;text-align:center;} .search{text-align:left;height:24px;background-color:#f8f8f8;padding:5px 10px 5px 10px;} #search-type{float: left;width:100px;height: 24px;border: 1px solid #c8c8c8;margin-right: 5px;} .com-img{ display:inline; overflow:hidden;margin:0 auto;display: table;} .com-img img{ transition:all 0.5s ease-in 0s; -webkit-transition:all 0.5s ease-in 0s; -moz-transition:all 0.5s ease-in 0s; -o-transition:all 0.5s ease-in 0s;} .com-img:hover img{transform:scale(1.1); -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -o-transform:scale(1.1);-ms-transform:scale(1.1);} /*主体样式*/ #container{width:1200px;margin:0 auto;margin-top:20px;} .container{width:1200px;margin:0 auto;} .menu_cate{width:220px;float:left;} .cate_title{line-height:31px;padding-left:15px;font-weight:bold;font-family:"微软雅黑"; background:url(../images/nav.png) no-repeat 0% 100%;font-size:14px;color:#000;} .about{width:460px;float:left;margin-left:12px;padding-bottom:5px;} .about_title{line-height:31px;padding-left:15px;font-weight:bold;font-family:"微软雅黑"; background:url(../images/nav.png) no-repeat 0% 100%;font-size:14px;color:#000;} .about .content{padding:5px;padding-bottom:12px;text-indent:20px;} .navigation{float:right;width:100px;} .index-title{line-height:31px;padding-left:15px;font-weight:bold;font-family:"微软雅黑"; background:url(../images/nav.png) no-repeat 0% 100%;font-size:14px;color:#000;} .index-table td{border:solid #add9c0; border-width:0px 1px 1px 0px; padding:10px 5px;} .index-table{border:solid #add9c0; border-width:1px 0px 0px 1px;margin-top:10px;} /*----- Common css ------*/ .fl{float:left;} .fr{float:right;} .di{_display:inline;} .fwn{font-weight:normal;} .dib{*display:inline;_zoom:1;_display:inline;_font-size:0px;} /*首页新闻*/ .news_company{width:280px;float:right;} .news1_title{line-height:31px;padding-left:15px;font-weight:bold;font-family:"微软雅黑"; background:url(../images/nav.png) no-repeat 0% 100%;font-size:14px;color:#000;} .news_company .content{padding:5px;} /*首页左侧联系我们*/ .contact{width:218px;float:left;padding-bottom:5px;margin-top:10px;} .contact_title{line-height:31px;padding-left:15px;font-weight:bold;font-family:"微软雅黑"; background:url(../images/nav.png) no-repeat 0% 100%;font-size:14px;color:#000;} .contact .content{padding:5px;padding-left:8px;} /*工程案例*/ .case{width:460px;float:left;margin-left:12px;padding-bottom:5px;margin-top:10px;} .case_title{line-height:31px;padding-left:15px;font-weight:bold;font-family:"微软雅黑"; background:url(../images/nav.png) no-repeat 0% 100%;font-size:14px;color:#000;} .case .content{padding:5px;padding-bottom:12px;text-indent:20px;} .news2_company{margin-top:10px;} /*产品推荐*/ .recommend_product{margin-top:10px;width:692px;float:left;} .recommend_product .title{line-height:31px;padding-left:15px;font-weight:bold;font-family:"微软雅黑";background:url(../images/nav.png) no-repeat 0% 100%;font-size:14px;color:#000;} .recommend_product .content{padding-top:15px;padding-bottom:14px;} .roll_product li{padding-bottom:0px;} /*品牌列表*/ .brand-list{margin: 20px 0px;display: flex;display: -webkit-flex;flex-wrap: wrap;} .brand-list li{margin: 5px 8px;} .brand-list li:hover{box-shadow: 2px 1px 5px;} .brand-list li img {width: 150px;height: 120px;} /*前台多页签*/ .news{width:1000px;float:left;margin-top: 10px;} .tab{position:relative;} .tab li{float:left;width:100px;height:30px;display:block;line-height:30px;border:1px solid #ccc;margin-right:8px;text-align:center;color:#333;font-size:12px;cursor: pointer;} .tab li.cur{color:#fff;text-decoration:none;font-size:12px;background:#3a78c1;border-color: #3a78c1;} .tt{display: none;} .list1{padding:8px 10px;} .list1 li{line-height:27px;position:relative;vertical-align: middle;} .list1 li a{background:url(../images/list_dot1.gif) left center no-repeat;padding-left:12px;line-height:27px;color:#555555;} .list1 li a:hover{color:#b99562;text-decoration:none;} .list1 li span{position:absolute;right:0px;line-height:30px;top:0;color:#999;} /*友情链接*/ .f_link{width:1200px;margin:0 auto;margin-top:100px;line-height:30px;text-indent:20px;margin-bottom:50px;} /*页面底部*/ .dff{width:1920px;position:relative;left:50%;margin-left:-960px;background:url(../images/dff.png) repeat-x center top;height:351px;overflow: hidden; margin-top: 50px; } .df_con{width:1200px;margin:0 auto;padding-top:70px;} .dff1{width:500px;float:left;height: 250px;overflow: hidden;} .guanci{color:#ffffff;font-size:24px;font-weight:normal;} .zhu{display:block;color:#deecff;font-size:14px;margin-top:25px;line-height:30px} .zhu a{color:#deecff;font-size:14px;line-height:30px} .k1{color:#deecff;font-size:14px;line-height:30px} .k1 a{color:#deecff;font-size:14px;line-height:30px} .k1 a:hover{color:#b99562;} .zhu a:hover{color:#b99562;} /*热门搜索*/ .hotSearch{height:24px;line-height:24px;font-weight:normal;color:#deecff;font-size:14px;margin-top:20px;} .hotSearch a{margin-right:6px;color:#deecff;font-size:14px;} .hotSearch a:hover{color:#b99562;} .dff2{float:left;margin-left:50px;} .dff3{float:right;color:#fff;height: 250px;overflow: hidden;} .cop{color:#ddebfe;float:left;} .ban{color:#ddebfe;float:right;} .hotSearch1{height:24px;line-height:24px;font-weight:normal;color:#fff;font-size:14px;margin-top:20px;} .hotSearch1 a{margin-right:6px;color:#fff!important;font-size:14px;} .hotSearch1 a:hover{color:#fff;} .zhu a{color:#fff!important;} .k11{ font:400 14px/30px "Microsoft Yahei"; color:#fff; margin-top: 10px; } .k11 a{ color:#fff!important; } #footer{position:relative;width:1000px;margin:0 auto;text-align:center;margin-bottom:10px;padding-top:8px;border-top:2px solid #eee;margin-top:15px;} .nav_foot{text-align:center;line-height:24px;color:#666;} .copyright{text-align:center;line-height:24px;} /*------------内页-------------------*/ .left .box{margin-bottom:10px;} .left .box h3{line-height:40px;background:#03479c;font-size:18px;color:#fff;text-align:center;font-weight:normal;} .left .box .content{padding:5px 0px;} .prodescription{border:1px solid #e5e5e5;background:#f9f9f9;line-height:24px;padding:10px;margin-bottom:15px;text-indent:20px;} .n_banner{width:100%;} .n_banner img{max-width:100%; height:auto !important;width:auto !important;} .left{width:240px;float:left;} .sort_menu h3{background-color:#ececec;line-height:28px;font-weight:bold;} .sort_product{margin-top:10px;} .sort_product h3{background-color:#ececec;line-height:28px;font-weight:bold;} .n_contact{margin-top:10px;} .n_contact h3{background-color:#ececec;line-height:28px;font-weight:bold;} .n_contact .content{padding:5px;line-height:24px;} .right{width:920px;float:right;padding-bottom:10px;} .sitemp{line-height:40px;height:40px;overflow:hidden;padding-right:10px;background:#03479c;} .sitemp h2{width:340px;float:left;line-height:40px;text-align:center;text-align:left;text-indent:15px;font-size:18px;color:#fff;font-weight:normal;} .sitemp .site{width:380px;float:right;text-align:right;line-height:40px;color:#fff;font-size:14px;} .sitemp .site a{color:#fff;} .right .content{padding:10px;padding-top:15px;overflow:hidden;line-height: 24px;} /*产品列表页样式*/ .xypg-pro-description { border: 1px solid #e5e5e5; background: #f9f9f9; line-height: 24px; padding: 10px; margin-bottom: 15px; text-indent: 2em; } .xypg-product-list { margin: 0 -1%; font-size: 0; } .xypg-product-list li { display: inline-block; vertical-align: bottom; float: left; margin: 0 1% 20px 1%; } .xypg-product-list li .img { display: block; overflow: hidden; } .xypg-product-list li .img img { width: 294px; height:235px; -webkit-transition: all .7s ease; transition: all .7s ease; } .xypg-product-list li .img:hover img { -webkit-transform: scale(1.1); transform: scale(1.1); } .xypg-product-list li h3 { font-size: 16px; font-weight: normal; margin: 15px 0 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .xypg-product-list li h3 a { color: #333333; display: block; text-align: center; } .xypg-product-list li h3 a:hover { color: #ab001a; } .xypg-product-list .no-result { margin: 0 1%; font-size: 14px; } /* 内页新闻列表 */ .xypg-news-list{} .xypg-news-list li { border: 1px solid #e1e1e1; padding: 30px; background: #fff; margin-bottom: 35px; -webkit-transition: all .5s; transition: all .5s; } .xypg-news-list li .tit { border-bottom: 1px solid #cbcbcb; margin-bottom: 15px; position: relative; } .xypg-news-list li .tit h3 { padding-bottom: 15px; font-size: 18px; color: #565656; font-weight: normal; padding-right: 25%; margin: 0; } .xypg-news-list li .tit .date { position: absolute; right: 0; top: 0; font-size: 14px; color: #666666; } .xypg-news-list li .info { font-size: 14px; line-height: 2; color: #999999; } .xypg-news-list li .more { margin-top: 15px; } .xypg-news-list li .more span { display: inline-block; width: 130px; line-height: 33px; text-align: center; color: #000; font-size: 14px; color: #666666; border: 1px solid #e1e1e1; -webkit-transition: all .5s ease; transition: all .5s ease; } .xypg-news-list li:hover { -webkit-box-shadow: 0px 2px 13px 1px rgba(8, 1, 3, 0.18); box-shadow: 0px 2px 13px 1px rgba(8, 1, 3, 0.18); } .xypg-news-list li:hover .tit h3 { color: #03479c; } .xypg-news-list li:hover .more span { color: #fff; background-color: #03479c; } .xypg-detail-pn div span { position: absolute; right: 20px; top: 0; font-size: 13px; color: #666 } .relate-title { background: #eee; color: #fff; font-size: 14px; line-height: 2.5; margin-bottom: 15px } .relate-title span { background: #03479c; padding: 0 10px; display: inline-block } .relate-product-slick { padding: 0 30px; position: relative } .relate-product-slick .slick-track{ width: 100%!important; z-index: 1; } .owl-carousel .owl-stage-outer{ position: relative; overflow: hidden; } .relate-product-slick .owl-item { display: block; font-size: 0 } .relate-product-slick .owl-item .img { display: block } .relate-product-slick .owl-item p { margin-bottom: 0; padding: .5em 0; font-size: 12px; color: #333; text-align: center } .relate-product-slick .owl-item:hover p { color: #ab001a } .relate-product-slick .owl-nav button.owl-next,.relate-product-slick .owl-nav button.owl-prev { width: 25px; height: 35px; color: #fff; font-size: 20px; margin-top: -17.5px; line-height: 35px } .relate-product-slick .owl-nav button.owl-next span,.relate-product-slick .owl-nav button.owl-prev span { display: inline } .xypg-relate .relate-news { margin-top: 40px } .relate-news-list li { float: left; width: 48%; position: relative; line-height: 30px; font-size: 14px; color: #666 } .relate-news-list li:nth-child(2n) { float: right } .relate-news-list li a { display: block; padding-right: 30%; color: #666 } .relate-news-list li a:before { content: ""; display: inline-block; width: 14px; height: 14px; background: #d1d1d1 url(../images/xypg-left-jt.png) -1px -16px no-repeat; border-radius: 50%; vertical-align: middle; margin-right: 10px } .relate-news-list li span { position: absolute; right: 0; top: 0 } .relate-news-list li:hover a { color: #292e39 } .relate-news-list li:hover a:before { background-color: #03479c } .relate-news-list li:hover span { color: #03479c } /*内页详情页面公用样式*/ .xypg-detail-title { font-size: 20px; color: #363636; font-weight: bold; margin-bottom: 10px; line-height: 1.7; } .xypg-detail-info-bar { font-size: 14px; font-family: Arial; color: #9e9e9e; line-height: 35px; border-bottom: 1px dashed #cfcfcf; margin-bottom: 20px; } .xypg-detail-info-bar .detail-info-time { float: left; margin-right: 20px; } .xypg-detail-info-bar .detail-info-time i { margin-right: 4px; } .xypg-detail-info-bar .detail-info-numbers { float: left; } .xypg-detail-info-bar .detail-info-numbers i { font-size: 12px; margin-right: 4px; } .xypg-detail-info-bar .xypg-file-down { float: right; position: relative; } .xypg-detail-info-bar .xypg-file-down .file-down-title { cursor: pointer; } .xypg-detail-info-bar .xypg-file-down .file-down-title i { margin-right: 5px; } .xypg-detail-info-bar .xypg-file-down .file-down-title:hover { color: #ab001a; } .xypg-detail-info-bar .xypg-file-down .file-down-list { position: absolute; z-index: 9999; width: 250%; right: 0; background: #fff; display: none; } .xypg-detail-info-bar .xypg-file-down .file-down-list li { padding: 10px 0; border-top: 1px dashed #cfcfcf; } .xypg-detail-info-bar .xypg-file-down .file-down-list li .icon { float: left; font-size: 40px; line-height: 40px; margin-right: 5px; height: 40px; } .xypg-detail-info-bar .xypg-file-down .file-down-list li .list-con { overflow: hidden; line-height: 1; } .xypg-detail-info-bar .xypg-file-down .file-down-list li .list-con p { font-size: 12px; margin-bottom: 0; line-height: 20px; } .xypg-detail-info-bar .xypg-file-down .file-down-list li .list-con a { font-size: 12px; } .xypg-detail-info-bar .xypg-file-down .file-down-list li .list-con a:hover { color: #ab001a; } .xypg-detail-con-title { margin: 20px 0 10px 0; } .xypg-detail-con-title span { display: inline-block; font-size: 18px; color: #03479c; } .xypg-detail-tags { margin-top: 40px; } .xypg-detail-tags .tags-title { border-bottom: 1px solid #c3c3c3; position: relative; } .xypg-detail-tags .tags-title h3 { display: inline-block; padding: 0 30px; font-size: 16px; color: #03479c; line-height: 40px; border-bottom: 3px solid #03479c; margin-bottom: -1px; } .xypg-detail-tags .tags-title .baidu-share { position: absolute; right: 0; top: 8px; } .xypg-detail-tags .tags-content { padding-top: 10px; } .xypg-detail-tags .tags-content a { font-size: 13px; color: #666666; display: inline-block; } .xypg-detail-tags .tags-content a:hover { color: #ab001a; } .xypg-detail-url { margin-top: 30px; } .xypg-detail-article p { margin: 10px 0 20px 0; line-height: 24px; } .xypg-detail-pn { margin-top: 30px; } .xypg-detail-pn div { margin-bottom: 10px; background: #ededed; line-height: 35px; padding: 0 20px; position: relative; } .xypg-detail-pn div b { font-size: 16px; color: #333333; float: left; font-weight: normal; } .xypg-detail-pn div a { float: left; width: 75%; font-size: 14px; color: #565656; } .xypg-detail-pn div a:hover { color: #03479c; } /* 内页左侧导航栏样式 */ .xypg-left-nav > li { margin-bottom: 12px; position: relative; } .xypg-left-nav > li > a { display: block; text-indent: 27px; font-size: 14px; color: #666666; position: relative; line-height: 40px; border: 1px solid #e4e4e4; padding-right: 15%; } .xypg-left-nav > li .first-nav-btn { position: absolute; z-index: 99; width: 16px; height: 16px; border-radius: 50%; background: #d1d1d1 url(../images/xypg-left-jt.png) 0 -15px no-repeat; right: 10%; top: 13px; } .xypg-left-nav > li .first-nav-btn.clicked { background: #ab001a url(../images/xypg-left-jt.png) 0 1px no-repeat; } .xypg-left-nav > li:last-child { margin-bottom: 0; } .xypg-left-nav > li:hover > a, .xypg-left-nav > li.clicked > a { color: #fff; } .xypg-left-nav>li.clicked>a,.xypg-left-nav>li:hover>a { color: #fff; background: #03479c } .xypg-left-nav > li:hover .first-nav-btn, .xypg-left-nav > li.clicked .first-nav-btn { background-color: #03479c; } .xypg-left-nav .xypg-left-subnav { display: none; margin-top: 10px; } .xypg-left-nav .xypg-left-subnav > li > a { display: block; line-height: 35px; color: #666666; font-size: 14px; padding-left: 15%; padding-right: 5%; } .xypg-left-nav .xypg-left-subnav > li > a:before { content: ''; width: 0; height: 0; line-height: 0; font-size: 0; overflow: hidden; border-width: 5px; cursor: pointer; border-style: dashed dashed dashed solid; border-color: transparent transparent transparent #d4d4d4; border-right: none; vertical-align: 5px; margin-right: 10px; } .xypg-left-nav .xypg-left-subnav > li > a:hover { color: #ab001a; } .xypg-left-nav .xypg-left-subnav > li > a:hover:before { border-left-color: #ab001a; } .xypg-left-nav .xypg-left-subnav > li.clicked > a:before, .xypg-left-nav .xypg-left-subnav > li.hover > a:before { content: ''; width: 0; height: 0; line-height: 0; font-size: 0; overflow: hidden; border-width: 5px; cursor: pointer; border-style: solid dashed dashed dashed; border-color: #ab001a transparent transparent transparent; border-bottom: none; vertical-align: middle; margin-right: 5px; } .xypg-left-nav .xypg-left-threenav { display: none; } .xypg-left-nav .xypg-left-threenav > li > a { display: block; font-size: 14px; line-height: 24px; color: #999999; padding-left: calc(15% + 15px); padding-right: 5%; } .xypg-left-nav .xypg-left-threenav > li > a:before { content: ''; display: inline-block; vertical-align: middle; width: 8px; height: 2px; background: #d4d4d4; margin-right: 5px; } .xypg-left-nav .xypg-left-threenav > li > a:hover { color: #ab001a; } .xypg-left-nav .xypg-left-threenav > li.clicked > a { color: #ab001a; } /* 分页基本样式 */ .xypg-pagination { margin-top: 20px; text-align: center; font-size: 0; } .xypg-pagination .pagin-left, .xypg-pagination .pagin-mid, .xypg-pagination .pagin-right, .xypg-pagination .pagin-select { display: inline-block; vertical-align: middle; } .xypg-pagination a, .xypg-pagination #current { display: inline-block; font-size: 14px; color: #333333; font-family: "Microsoft YaHei",Arial; line-height: 26px; border: 1px solid #cbcbcb; margin: 0 5px; padding: 0 8px; } .xypg-pagination #current, .xypg-pagination a:hover { color: #fff; border-color: #03479c; background: #03479c; } .xypg-pagination .pagin-mid { font-size: 14px; } .xypg-pagination .pagin-mid .mob-pagin-mid { display: none; } .xypg-pagination .pagin-select { font-size: 14px; } .xypg-pagination .pagin-select select { height: 28px; padding: 0 8px; margin: -1px 5px 0 5px; } /*左侧工具条*/ #toolbar { position: fixed; z-index: 9999; right: 33px; bottom: 30%; } #toolbar li { margin-bottom: 3px; font-size: 0; width: 57px; height: 57px; right: 0; position: relative; } #toolbar li a { display: block; position: absolute; z-index: 9; right: 0; top: 0; width: 57px; height: 57px; overflow: hidden; background: #03479c; -webkit-transition: all .5s ease; transition: all .5s ease; white-space: nowrap; font-size: 0; } #toolbar li .iconfont { display: inline-block; vertical-align: middle; width: 57px; height: 57px; background-color: #d9d9d9; vertical-align: middle; text-align: center; line-height: 57px; color: #2b2b2b; font-size: 26px; } #toolbar li .wz { display: inline-block; line-height: 57px; font-size: 14px; color: #fff; vertical-align: middle; padding-left: 10px; } #toolbar li.ewm .ewm-box { position: absolute; z-index: 1; padding: 5px; background: #03479c; width: 110px; right: 120%; bottom: 0; opacity: 0; visibility: hidden; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: all .7s; transition: all .7s; } #toolbar li.ewm .ewm-box p { margin-bottom: 0; } #toolbar li.ewm .ewm-box img { max-width: 100%; } #toolbar li.ewm .ewm-box:after { content: ''; position: absolute; right: -5px; bottom: 20px; width: 0; height: 0; line-height: 0; font-size: 0; overflow: hidden; border-width: 5px; cursor: pointer; border-style: dashed dashed dashed solid; border-color: transparent transparent transparent #03479c; border-right: none; } #toolbar li.ewm:hover .icon { background-position: -57px -180px; } #toolbar li.ewm:hover .ewm-box { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } #toolbar li.backtop { cursor: pointer; } #toolbar li.backtop .iconfont { color: #fff; background-color: #03479c; } #toolbar li:hover a { width: 200px; } #toolbar li:hover .iconfont { background-color: #03479c; color: #fff; } /* 内页基本样式 */ .xypg-wrap { padding-top: 20px; padding-bottom: 40px; } .xypg-left-box { margin-bottom: 20px; } .xypg-left-con { border: 1px solid #ebebeb; padding: 15px; } .latest-news li a { display: block; font-size: 14px; line-height: 20px; color: #666666; } .latest-news li a:before { content: ''; display: inline-block; width: 14px; height: 14px; background: #d1d1d1 url(../images/xypg-left-jt.png) -1px -16px no-repeat; border-radius: 50%; vertical-align: middle; margin-right: 10px; } .latest-news li a:hover { color: #03479c; text-decoration: none; } .latest-news li a:hover:before { background-color: #03479c; } .hot-keys li { width: 47%; float: left; margin: 6px 0; } .hot-keys li a { display: block; text-align: center; font-size: 14px; color: #666666; line-height: 36px; background: #ededed; } .hot-keys li a:hover { color: #03479c; text-decoration: none; } .hot-keys li:nth-child(even) { float: right; } .contact-box .hot-line { background: url(../images/xypg-right-phone.png) left 5px no-repeat; padding-left: 70px; margin-bottom: 15px; } .contact-box .hot-line h4 { font-weight: normal; margin: 0; font-size: 14px; color: #666666; } .contact-box .hot-line p { font-size: 22px; font-family: Arial; font-weight: bold; color: #03479c; margin-bottom: 0; } .contact-box .gs-name { font-size: 15px; font-weight: bold; color: #333333; margin-bottom: 10px; } .contact-box .contact-info p { margin-bottom: 0; border-bottom: 1px dotted #b8b8b8; font-size: 14px; color: #333333; padding: 8px 0; } .contact-box .contact-info p:last-child { border-bottom: 0; } .xypg-right-mbx { border-bottom: 1px solid #ebebeb; font-size: 14px; color: #666666; line-height: 25px; padding: 17px 0 7px 0; } .xypg-right-mbx .cur-pos { display: inline-block; color: #333; } .xypg-right-mbx .cur-pos .iconfont { font-size: 25px; display: inline-block; height: 25px; color: #000; margin-right: 5px; } .xypg-right-mbx a { color: #666; } .xypg-right-mbx a:hover { color: #ab001a; text-decoration: underline; } .xypg-right-content { font-size: 14px; color: #333; line-height: 1.7; padding: 15px 0; } .xypg-right-content p img { max-width: 100%; } .navigation a { display: inline-block; font-size: 14px; color: #333333; font-family: "Microsoft YaHei",Arial; line-height: 26px; border: 1px solid #cbcbcb; margin: 0 5px; padding: 0 8px; } .navigation a.previous_page { float: left; } .navigation a.next_page { float: right; } .navigation a:hover { color: #fff; border-color: #ab001a; background: #ab001a; } .xypg-wrap .xymob-page-icon { position: fixed; right: 15px; bottom: 100px; z-index: 9999; } .xypg-wrap .xymob-page-icon li { width: 40px; height: 40px; line-height: 40px; text-align: center; margin-bottom: 1px; background: rgba(171, 0, 26, 0.7); cursor: pointer; } .xypg-wrap .xymob-page-icon li i { font-size: 20px; color: #fff; } .product-detail-tab { margin-top: 50px } .product-detail-tab .product-detail-tabli { border-top: 1px solid #ededed; border-bottom: 1px solid #ededed; height: 40px } .product-detail-tab .product-detail-tabli li { float: left; width: 20%; line-height: 40px; margin-top: -1px; text-align: center; font-size: 14px; color: #333; cursor: pointer } .product-detail-tab .product-detail-tabli li.on,.product-detail-tab .product-detail-tabli li:active,.product-detail-tab .product-detail-tabli li:visited { background: #03479c; color: #fff } .product-detail-tab .product-detail-tabcon { padding: 15px 0 } .product-detail-tab .product-detail-tabcon img,.product-detail-tab .product-detail-tabcon p img { max-width: 100%; height: auto!important; width: auto!important } /*内页切换*/ .page-product-detail-effect .big-img { float: left; width: 76.86567164%; height: 510px; border: 1px solid #efefef } .page-product-detail-effect .big-img a { display: block; text-align: center; width: 100%; height: 100%; font-size: 0 } .page-product-detail-effect .big-img a img { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: middle } .page-product-detail-effect .big-img a:after { content: ""; height: 100%; display: inline-block; vertical-align: middle; overflow:hidden; } .page-product-detail-effect .product-detail-slick { float: right; width: 20.89552239% } .page-product-detail-effect .product-detail-slick a { display: block; text-align: center; width: 100%; height: 100%; font-size: 0; border: 1px solid #efefef } .page-product-detail-effect .product-detail-slick a img { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: middle } .page-product-detail-effect .product-detail-slick a:after { content: ""; height: 100%; display: inline-block; vertical-align: middle } .page-product-detail-effect .product-detail-slick .slick-slide { outline: none; height: 140px; margin: 5px 0 } .page-product-detail-effect .product-detail-slick .slick-slide.active a { border-color: #ab001a } .page-product-detail-effect .product-detail-slick .slick-arrow { height: 30px; text-align: center; line-height: 30px; background: #838383; -webkit-transition: all .5s ease; transition: all .5s ease; cursor: pointer } .page-product-detail-effect .product-detail-slick .slick-arrow:hover { background: #292e39 } .page-product-detail-effect .product-detail-slick .slick-arrow .iconfont { color: #fff; font-size: 20px } .easyzoom{ position: relative; display: inline-block; } /*底部*/ .demo-layout { background: url(../images/layout_bg.jpg) top no-repeat; background-size: cover; padding: 2% 0; box-sizing:border-box; margin-top: 3%; } .container-fluid{ width: 1200px; margin:0 auto; } .di_left{ float: left; width:370px; } .di_middle{ float: left; width:480px; margin-left: 40px; } .demo-footer{ background: #03479c; padding: 10px 0; font-size: 12px; line-height: 1.8; } .demo-copyright{ text-align: center; } .demo-layout-desc { font-size: 12px; color: hsla(0,0%,100%,.5); line-height: 22px; } .demo-layout-logo { margin-bottom: 20px } .demo-layout-contact p { margin-bottom: 0; font-size: 14px; color: hsla(0,0%,100%,.7); line-height: 1.7 } .demo-layout-contact strong { display: block; font-size: 24px; color: hsla(0,0%,100%,.8) } .demo-layout-contact a { color: #fff } .demo-layout-menu dl { float: left; width: 20%; text-align: center } .demo-layout-menu dl dt { font-size: 14px; color: #fff; margin-bottom: 1.43em } .demo-layout-menu dl dd a { display: block; font-size: 14px; color: hsla(0,0%,100%,.4); line-height: 2 } .demo-layout-ewm { text-align: center } .demo-layout-ewm p { background: hsla(0,0%,100%,.1); font-size: 13px; font-weight: 100; padding: .8em 0; line-height: 1.7; color: hsla(0,0%,100%,.7); margin: 15px 0 0 } .demo-footer,.demo-footer a { color: hsla(0,0%,100%,.5) } .demo-footer a:hover { color: hsla(0,0%,100%,.8) } #toolbar { position: fixed; z-index: 9999; right: 17px; bottom: 10% } #toolbar li { margin-bottom: 3px; position: relative } #toolbar li,#toolbar li a { font-size: 0; width: 57px; height: 57px; right: 0 } #toolbar li a { display: block; position: absolute; z-index: 9; top: 0; overflow: hidden; background: #292e39; -webkit-transition: all .5s ease; transition: all .5s ease; white-space: nowrap } #toolbar li .iconfont { width: 57px; height: 57px; background-color: #d9d9d9; text-align: center; color: #2b2b2b; font-size: 26px } #toolbar li .iconfont,#toolbar li .wz { display: inline-block; vertical-align: middle; line-height: 57px } #toolbar li .wz { font-size: 14px; color: #fff; padding-left: 10px } #toolbar li.ewm .ewm-box { position: absolute; z-index: 1; padding: 5px; background: #292e39; width: 110px; right: 120%; bottom: 0; opacity: 0; visibility: hidden; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: all .7s; transition: all .7s } #toolbar li.ewm .ewm-box p { margin-bottom: 0 } #toolbar li.ewm .ewm-box img { max-width: 100% } #toolbar li.ewm .ewm-box:after { content: ""; position: absolute; right: -5px; bottom: 20px; width: 0; height: 0; line-height: 0; font-size: 0; overflow: hidden; border-width: 5px; cursor: pointer; border-style: dashed dashed dashed solid; border-color: transparent transparent transparent #292e39; border-right: none } #toolbar li.ewm:hover .icon { background-position: -57px -180px } #toolbar li.ewm:hover .ewm-box { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0) } #toolbar li.backtop { cursor: pointer } #toolbar li.backtop .iconfont { color: #fff; background-color: #292e39 } #toolbar li:hover a { width: 200px } #toolbar li:hover .iconfont { background-color: #292e39; color: #fff }