/*澶撮儴鏍峰紡*/ .wd1200 { width: 1200px; margin: 0 auto; } .top { width: 1200px; margin: 0 auto } #header { position: relative; background: #1b1b1b; width: 1920px; left: 50%; margin-left: -960px; z-index: 9999; line-height: 52px; font-size: 12px; color: #bcbcbc; } #header a { font-size: 12px; color: #bcbcbc; } .top_cc { position: relative; height: 138px; } .logo { float: left; line-height: 138px; } #menu { position: relative; float: right; } /*瀵艰埅鏍忔牱寮?/ .nav { height: 90px; } .nav li { height: 138px; text-align: center; width: 103px; float: left; position: relative; z-index: 999; } .nav li>a { display: block; color: #666666; height: 125px; font-size: 16px; box-sizing: border-box; line-height: 138px; } .nav li a:hover { color: #0071bc; text-decoration: none; } .nav li::after { content: ''; display: block; margin: 0 auto; margin-top: 7px; width: 30%; height: 2px; background: transparent; transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; } .nav li:hover::after { width: 60%; background: #c7c1bd; } .nav .sec { opacity: 0; background: #fff; color: #1f1f1f; overflow: hidden; z-index: 9999; position: absolute; top: 138px; left: 0px; transition: all 0.3s ease-out 0s; transform: translate3d(0px, 10px, 0px); -moz-transform: translate3d(0px, 10px, 0px); -webkit-transform: translate3d(0px, 10px, 0px); visibility: hidden; border-top: 3px solid #0071bc } .nav .sec a { background: #fff; display: block; color: #76838f; height: 54px; line-height: 54px; width: 201px; background: url(../images/jian.png)no-repeat 90%; border-bottom: 1px solid #eeeeee; text-indent: 0; transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; -o-transition: .5s; } .nav .sec a:hover { background: url(../images/jian.png)no-repeat 90% #0071bc; text-decoration: none; color: #fff; text-indent: 10px; transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; -o-transition: .5s; } .nav li .sec.active { opacity: 1; visibility: visible; transform: translate3d(0px, 0px, 0px); -moz-transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); } /*鎼滅储鍜岀儹闂ㄦ悳绱?/ .search { position: relative; } .hotSearch { float: left; font-weight: normal; font-size: 12px; color: #bcbcbc; margin-right: 20px; } .hotSearch a { margin-right: 6px; } #formsearch { width: 251px; float: right; height: 32px; background: url(../images/ssbg.png) no-repeat center; margin-top: 10px } #formsearch input { height: 32px; background: none; border: none; line-height: 32px; border: none; outline: none; float: left; } #formsearch input#keyword { height: 32px; line-height: 32px; padding-left: 10px; color: #bcbcbc; width: 200px; } #formsearch input#s_btn { width: 40px; height: 32px; line-height: 32px; text-align: center; color: #fff; border: none; cursor: pointer; } #search-type { float: left; width: 100px; height: 24px; border: 1px solid #c8c8c8; margin-right: 5px; } /*涓讳綋鏍峰紡*/ #container { width: 1200px; margin: 0 auto; margin-top: 10px; } .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; } /*鍝佺墝鍒楄〃*/ .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; } /* 棣栭〉鍐呭 */ .c1_index { position: relative; padding: 70px 0; width: 1920px; left: 50%; margin-left: -960px; } .ads_list { position: relative; display: flex; justify-content: space-between; flex-wrap: wrap; background: url(../images/xing.png) no-repeat center center; } .ads_list li { position: relative; width: 540px; } .ads_list li:nth-child(2n) { position: relative; width: 550px; } .ads_list li:nth-child(n+3) { margin-top: 100px; } .ads_list li a { display: flex; justify-content: space-between; align-items: center; } .ads_list li h3 { font-size: 30px; color: #666666; font-weight: normal; width: calc(100% - 230px); text-align: center; } .ads_list li:nth-child(2n) a { flex-direction: row-reverse; } .ads_list li:hover h3 { color: #0071bc; } /* c2_index */ .c2_index { position: relative; width: 1920px; left: 50%; margin-left: -960px; background: url(../images/c2_bg.jpg) no-repeat center; padding: 55px 0; } .ttt2 { position: relative; text-align: center; } .ttt2 h3 { font-size: 48px; color: #171717; line-height: 70px; } .ttt2 h3 span { font-weight: normal; font-size: 30px; font-family: "Arial"; color: #555555; text-transform: uppercase; margin-left: 5px; display: inline-block; vertical-align: middle; } .c2_contt { position: relative; margin-top: 120px; } .l_btn, .r_btn { position: absolute; top: 40%; cursor: pointer; width: 62px; height: 104px; } .l_btn { left: -130px; background: url(../images/prev2.png) no-repeat center; transform: rotate(180deg); } .r_btn { right: -130px; background: url(../images/prev2.png) no-repeat center; } .l_btn:hover { background: url(../images/prev2_h.png) no-repeat center; transform: rotate(0deg); } .r_btn:hover { background: url(../images/prev2_h.png) no-repeat center; transform: rotate(180deg); } .case_list2 { position: relative; } .case_list2 li { position: relative; text-align: center; float: left; margin: 0 35px; } .case_list2 li a { display: block; } .case_list2 li .ooimg { position: relative; } .case_list2 li .ooimg img { width: 350px; height: 509px; } .case_list2 li .ooimg .fu { content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: url(../images/san.png) no-repeat center; } .case_list2 li h3 { font-size: 30px; color: #272727; font-weight: normal; padding: 20px 0; } .case_list2 li:hover .ooimg .fu { background: url(../images/san_h.png) no-repeat center; } .case_list2 li:hover h3 { color: #079fff; } /* */ .box3 { margin-top: 39px; } .box3_fl { position: relative; float: left; width: 490px; margin-top: 118px; margin-left: -70px; } .ysli li { height: 78px; margin-bottom: 110px; } .ysli li img { float: right; width: 75px; height: 75px; } .ysli li h3 { float: left; width: 390px; text-align: right; font-size: 24px; color: #000000; font-weight: 500; } .ysli li h3 span { display: block; font-weight: normal; font-size: 16px; color: #666666; line-height: 22px; margin-top: 5px; } .ystu { float: left; margin-top: 41px; margin-left: 40px; } .ys_fr { position: relative; float: right; width: 500px; margin-right: -70px; margin-top: 118px; } .ysli1 li { height: 78px; margin-bottom: 110px; } .ysli1 li img { float: left; width: 75px; height: 75px; } .ysli1 li h3 { float: right; width: 400px; text-align: left; font-size: 24px; color: #000000; font-weight: 500; } .ysli1 li h3 span { display: block; font-weight: normal; font-size: 18px; color: #666666; line-height: 22px; margin-top: 5px; } /* c4_index */ .c4_index { position: relative; width: 1920px; left: 50%; margin-left: -960px; height: 589px; background: url(../images/c4_bg.jpg) no-repeat center; padding-top: 135px; } .c4left { position: relative; float: left; width: 260px; } .c4left span { display: block; color: #fff; font-size: 14px; } .c4left h3 { font-size: 24px; color: #fff; font-weight: bold; padding-bottom: 30px; background: url(../images/line033.png) no-repeat left bottom; } .c4left dd { margin-top: 35px; color: #fff; font-size: 14px; line-height: 1.7; height: 80px; overflow: hidden; } .c4left .c4_tel { margin-top: 80px; position: relative; width: 240px; line-height: 60px; background: url(../images/c4_tel.png) no-repeat 20px center #0071bc; color: #fff; font-size: 20px; padding-left: 60px; } .c4right { position: relative; float: right; } .c4_list { margin-top: 40px; position: relative; width: 850px; margin-right: 25px; } .c4_list li { position: relative; width: 160px; float: left; text-align: center; margin-bottom: 35px; } .c4_list li a { display: block; } .c4_list li .bgimg { width: 100px; height: 100px; background: #60676f; border-radius: 50%; line-height: 100px; margin: auto; } .c4_list li .bgimg img { max-width: 100%; } .c4_list li h3 { font-size: 16px; color: #fff; font-weight: normal; padding: 10px 0; } .c4_list li:nth-child(2), .c4_list li:nth-child(3) { margin-left: 100px; } .c4_list li:nth-child(4) { margin-left: 380px; } .c4_list li:nth-child(5) { margin-left: 100px; } .c4_list li:hover .bgimg { background: #0071bc; } /* c5_index */ .c5_index { position: relative; padding: 80px 0; } .ttt5 { position: relative; text-align: center; } .ttt5 h3 { font-size: 30px; color: #151515; font-weight: normal; line-height: 70px; } .ttt5 h3 span { font-weight: normal; font-size: 24px; font-family: "Arial"; color: rgba(78, 78, 78, 0.63); text-transform: uppercase; margin-left: 8px; display: inline-block; vertical-align: middle; } .c5_contt { position: relative; margin-top: 80px; display: flex; justify-content: space-between; } .c5_list { position: relative; width: 227px; } .c5_list li { position: relative; text-align: center; margin-bottom: 20px; } .c5_list li a { display: block; z-index: 9999; position: relative; } .c5_list li a img { width: 227px; height: 141px; } .c5_list li h3 { background: #000000; line-height: 25px; font-size: 18px; color: #f3f3f3; } .c5_list li:hover h3 { background: #0071bc; } .c5_list li:hover::before { filter: invert(66%) sepia(75%) saturate(5105%) hue-rotate(180deg) brightness(100%) contrast(106%); } .c5_ccimg { position: relative; text-align: center; margin: auto; padding-left: 30px; } .c5_ccimg img { width: 515px; height: 745px; } .c5_list11 { margin-top: 55px; } .c5_list11 li:nth-child(1)::before { position: absolute; right: -213px; top: 50%; content: ""; width: 213px; height: 84px; background: url(../images/u1.png) no-repeat center; z-index: 99; } .c5_list11 li:nth-child(2)::before { position: absolute; right: -214px; top: 50%; content: ""; width: 214px; height: 89px; background: url(../images/u2.png) no-repeat center; z-index: 99; } .c5_list11 li:nth-child(3)::before { position: absolute; right: -214px; top: 50%; content: ""; width: 214px; height: 19px; background: url(../images/u3.png) no-repeat center; z-index: 99; } .c5_list11 li:nth-child(4)::before { position: absolute; right: -215px; top: 0%; content: ""; width: 215px; height: 84px; background: url(../images/u4.png) no-repeat center; z-index: 99; } .c5_list22 { width: 230px; } .c5_list22 li:nth-child(1)::before { position: absolute; left: -185px; top: 42%; content: ""; width: 185px; height: 109px; background: url(../images/u5.png) no-repeat center; z-index: 99; } .c5_list22 li:nth-child(2)::before { position: absolute; left: -200px; top: 40%; content: ""; width: 205px; height: 87px; background: url(../images/u6.png) no-repeat center; z-index: 99; } .c5_list22 li:nth-child(3)::before { position: absolute; left: -200px; top: 35%; content: ""; width: 204px; height: 19px; background: url(../images/u7.png) no-repeat center; z-index: 99; } .c5_list22 li:nth-child(4)::before { position: absolute; left: -200px; top: 0%; content: ""; width: 205px; height: 84px; background: url(../images/u8.png) no-repeat center; z-index: 99; } /* c6_index */ .c6_index { position: relative; width: 1920px; left: 50%; margin-left: -960px; background: url(../images/c6_bg.jpg) no-repeat center; height: 500px; padding-top: 10px; } .c6_list { position: relative; margin-top: 50px; /*margin-left: 65px;*/ display: flex; justify-content: center; } .c6_list li { position: relative; width: 270px; padding-left: 38px; padding-top: 28px; } .c6_list li>b { position: absolute; left: 0px; top: 0px; font-weight: normal; font-size: 21px; color: #323232; padding-top: 5px; } .c6_list li>b::before { position: absolute; left: 0px; top: 0px; width: 20px; height: 1px; background: #323232; content: ""; } .c6_list li a { display: block; text-align: center; } .c6_list li .ssimg { width: 118px; height: 118px; background: url(../images/yuan.png) no-repeat center; line-height: 118px; margin: auto; } .c6_list li .ssimg img { max-width: 100%; } .c6_list li .cc_bom { position: relative; padding: 20px 0; } .c6_list li .cc_bom h3 { font-size: 14px; color: #666666; font-weight: normal; } .c6_list li .cc_bom span { display: block; font-size: 12px; color: #666666; font-weight: normal; } .c6_list li .cc_bom dd { font-size: 12px; color: #666666; font-weight: normal; margin-top: 20px; line-height: 1.7; } .c6_list li:hover>b { color: #0071bc; } .c6_list li:hover>b::before { background: #0071bc; } .c6_list li:hover .cc_bom h3, .c6_list li:hover .cc_bom span, .c6_list li:hover .cc_bom dd { color: #0071bc; } .c6_list li:hover .ssimg { background: url(../images/yuan_h.png) no-repeat center; } .c6_list li:hover .ssimg img { filter: invert(38%) sepia(78%) saturate(5455%) hue-rotate(187deg) brightness(87%) contrast(102%); } /* c7_index */ .c7_index { position: relative; padding-top: 100px; } .c7left { position: relative; float: left; width: 260px; } .c7left span { display: block; color: #3b434e; font-size: 14px; } .c7left h3 { font-size: 24px; color: #3b434e; font-weight: bold; padding-bottom: 30px; background: url(../images/line044.jpg) no-repeat left bottom; } .c7left dd { margin-top: 20px; color: #323232; font-size: 14px; line-height: 2.5; height: 140px; overflow: hidden; } .c7left .c7_tel { margin-top: 30px; position: relative; width: 240px; line-height: 60px; background: url(../images/c7more_bg.jpg) no-repeat; color: #fff; font-size: 20px; padding-left: 35px; } .c7left .c7_tel a { font-size: 14px; color: #fff; } .c7_right { position: relative; width: 870px; float: right; } .sort_news { position: relative; text-align: right; } .sort_news li { display: inline-block; } .sort_news li a { font-size: 14px; color: #999999; padding: 0 10px; border-radius: 5px; text-align: center; line-height: 35px; display: block; } .sort_news li a:hover { background: #0071bc; color: #fff; } .c7_right .news_wap { margin-top: 60px; position: relative; } .news_video { position: relative; float: left; width: 300px; height: 210px; } .news_video img { width: 300px; height: 210px; } .news_list11 { position: relative; float: left; margin-left: 20px; width: 260px; } .news_list11 li a { display: block; font-size: 16px; color: #0071bc; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .news_list11 li span { display: block; font-size: 12px; margin: 5px 0; color: #999999; } .news_list11 li dd { display: block; font-size: 12px; color: #666666; width: 230px; line-height: 1.7; } .news_listbb { position: relative; float: right; width: 260px; height: 210px; } .news_listbb li { position: relative; line-height: 40px; padding-left: 15px; background: url(../images/jiaonn.png) no-repeat left center; } .news_listbb li a { display: block; font-size: 14px; color: #666666; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .news_listbb li:hover a { color: #079fff; } #ydemo { overflow: hidden; margin: 0 auto; position: relative; height: 210px; } #yindemo { height: 100%; } #ydemo1 {} #ydemo2 {} .c7_bottom { position: relative; display: flex; justify-content: center; align-items: center; } .c7_bottom .sim { margin: 0 100px; } .cent_ss { width: 480px; text-align: center; } .cent_ss h3 { background: url(../images/sss.png) no-repeat center; font-size: 36px; color: #323232; font-weight: normal; } .cent_ss p { font-size: 18px; color: #323232; font-weight: normal; text-transform: uppercase; } /* 搴曢儴淇℃伅 */ .foot_wap { position: relative; padding: 50px 0 15px; background: #f8f8f8; } .foot_aa { position: relative; width: 300px; float: left; } .foot_aa h2 { font-size: 18px; color: #5a5a5a; margin-bottom: 10px; } .foot_aa .f_contact { font-size: 12px; color: #5a5a5a; line-height: 2.5; } .x-layout-menu { position: relative; width: 630px; float: left; } .x-layout-menu dl { float: left; width: 20%; text-align: left; } .x-layout-menu dl dt { font-size: 16px; color: #323232; margin-bottom: 1.03em; font-weight: normal; margin-left: 10px; } .x-layout-menu dl dd a { display: block; font-size: 14px; color: #5a5a5a; line-height: 2; font-weight: normal; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .foot_cc { position: relative; width: 220px; text-align: center; margin-right: 45px; line-height: 3; font-size: 14px; color: #5a5a5a; } /*鍙嬫儏閾炬帴*/ .f_link { margin-top: 50px; font-size: 14px; color: #b7b7b7; } .f_link a { color: #b7b7b7; font-size: 14px; } /*椤甸潰搴曢儴*/ #footer { position: relative; padding: 10px 0; background: #1b1b1b; color: rgba(255, 255, 255, .64); font-size: 12px; } #footer a { color: rgba(255, 255, 255, .64); font-size: 12px; } #footer a:hover { color: #e87518; text-decoration: none; } .nav_foot { text-align: center; line-height: 24px; color: #666; } .copyright { line-height: 24px; float: left; } .foot_ban { float: right; line-height: 24px; } /*------------鍐呴〉-------------------*/ .left { width: 224px; float: left; } .left .box { margin-bottom: 10px; } .left .box h3 { line-height: 60px; padding-left: 34px; background: #0071bc; font-size: 18px; color: #fff; font-weight: 400; position: relative } .left .box h3::after { content: ""; position: absolute; width: 5px; height: 20px; top: 20px; left: 15px; background: #fff } .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: 1920px; margin: 0 auto; margin-left: -960px; position: relative; left: 50%; } .n_banner img { width: 1920px; margin: 0 auto; margin-left: -960px; position: relative; left: 50%; } .left { width: 225px; float: left; } .sort_menu h3 { background-color: #ececec; line-height: 28px; padding-left: 15px; font-weight: bold; } .sort_product { margin-top: 10px; } .sort_product h3 { background-color: #ececec; line-height: 28px; padding-left: 15px; font-weight: bold; } .n_contact { margin-top: 10px; } .n_contact h3 { background-color: #ececec; line-height: 28px; padding-left: 15px; font-weight: bold; } .n_contact .content { padding: 5px; line-height: 24px; } .right { width: 919px; float: right; padding-bottom: 10px; } .sitemp { border-bottom: 1px solid #eee; } .sitemp h2 { width: 340px; float: left; line-height: 40px; text-align: left; font-size: 16px; color: #333; } .sitemp .site { width: 380px; float: right; text-align: right; line-height: 40px; } .right .content { padding: 10px; padding-top: 15px; overflow: hidden; line-height: 24px; } .sort_album { margin-top: 15px; } .con { width: 1200px; margin: 0 auto; position: relative } /* 鍐呴〉鏂伴椈鍒楄〃 */ .news_listss li { width: 883px; margin-left: 24px; height: 156px; background-color: #f5f5f5; margin-bottom: 25px; } .news_listss li img { float: left; width: 217px; height: 157px; } .news_listss li h3 { padding-top: 18px; position: relative; font-weight: normal; float: right; width: 598px; padding-right: 33px; } .news_listss li h3 a { font-size: 17px; color: #333333; } .news_listss li h3 span { position: absolute; right: 44px; top: 19px; font-size: 14px; color: #c5c5c5; } .news_listss li h3 b { display: block; font-weight: normal; margin-top: 12px; font-size: 15px; color: #333333; line-height: 26px; } .news_listss li:hover { background-color: #ffebcc } .news_listss li:hover h3 a { color: #ff9900 } .news_listss li:hover h3 span { color: #ff9900 }