@CHARSET "utf-8"; /*通用*/ .icon-font { position: relative; } .icon-font:after { content: ""; width: 30px; height: 30px; background-image: url(../images/icon_spirit.png); background-repeat: no-repeat; position: absolute; left: calc(50% - 15px); top: calc(50% - 15px); } .xymob-head { position: fixed; top: 0; z-index: 999999; left: 0; right: 0; background: #151515 } .xymob-head-box { position: relative; height: 60px } .xymob-head-box .xymob-logo { position: absolute; left: 0; right: 0; bottom: 0; top: 0; margin: auto; width: 70%; height: 30px; text-align: center } .xymob-head-box .xymob-logo a, .xymob-head-box .xymob-logo h1 { display: inline; font-size: 0 } .xymob-head-box .xymob-logo img { height: 25px } .xymob-navbtn { position: absolute; z-index: 9; top: 0; bottom: 0; right: 0; left: 0; margin: auto 0 auto 27px; width: 30px; height: 20px } .xymob-navbtn:after, .xymob-navbtn:before, .xymob-navbtn span { display: block; height: 2px; width: 100%; background: #fff; -webkit-transition: all .5s; transition: all .5s } .xymob-navbtn span { margin: 7px 0 } .xymob-navbtn:after, .xymob-navbtn:before { content: ""; -webkit-transform-origin: 7.5%; transform-origin: 7.5% } .xymob-navbtn.clicked span { -webkit-transform: translateX(-100%); transform: translateX(-100%); opacity: 0 } .xymob-navbtn.clicked:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg) } .xymob-navbtn.clicked:before { -webkit-transform: rotate(45deg); transform: rotate(45deg) } .xymob-search-btn { position: absolute; z-index: 9; right: 0; top: 0; bottom: 0; width: 14%; text-align: center; line-height: 60px } .xymob-search-btn .icon-font { display: block; width: 100%; height: 100% } .xymob-search-btn .icon-font:after { background-position: -30px -210px } .xymob-menu { display: none; position: absolute; z-index: 9999; left: 0; right: 0; height: 100vh; background: #151515; padding: 0 10% } .xymob-menu .xymob-menu-box { height: 100vh; overflow: auto; padding-bottom: 80px } .xymob-nav>li { border-bottom: 1px solid #2b2b2b; position: relative } .xymob-nav>li>a { display: block; line-height: 50px; font-size: 16px; color: #fff } .xymob-nav .xymob-menu-jt { position: absolute; width: 20%; height: 50px; line-height: 50px; right: 0; top: 0; text-align: center; z-index: 9 } .xymob-nav .xymob-menu-jt .icon-font { display: block; width: 100%; height: 100% } .xymob-nav .xymob-menu-jt .icon-font:after { background-position: -30px -240px } .xymob-nav .xymob-menu-jt.clicked .icon-font:after { background-position: -30px -270px } .xymob-nav .xymob-sub-menu { background: #1e1e1e; display: none } .xymob-nav .xymob-sub-menu>li { border-top: 1px dashed #2b2b2b } .xymob-nav .xymob-sub-menu>li>a { display: block; font-size: 14px; color: hsla(0, 0%, 100%, .8); line-height: 40px; text-indent: 2em } .xymob-dlbtn { margin-top: 40px } .xymob-dlbtn a { text-align: center; display: block; width: 100%; height: 40px; line-height: 40px; background: #292e39; color: #fff; font-size: 16px; border-radius: 5px } .xymob-dlbtn a i { display: inline-block; vertical-align: middle; width: 30px; height: 30px; margin-right: 5px } .xymob-dlbtn a .icon-dl:after { background-position: -30px -540px } .xymob-dlbtn a .icon-pn:after { background-position: -30px -600px } .xymob-dlbtn a .icon-tc:after { background-position: -30px -570px } .xymob-dlbtn .zx-btn { margin-top: 10px; background: none; border: 1px solid #fff } .xymob-search { position: fixed; z-index: 99999; left: 100%; bottom: 0; top: 0; width: 100%; background: #151515; padding: 15px 15% 0; -webkit-transition: all .5s; transition: all .5s } .xymob-search .xymob-search-close-btn { position: absolute; top: 27px; left: 30px; width: 30px; height: 30px; text-align: center; line-height: 30px } @media (max-width: 420px) { .xymob-search .xymob-search-close-btn { left: 15px } } .xymob-search .xymob-search-close-btn i { width: 100%; height: 100%; display: block } .xymob-search .xymob-search-close-btn i:after { background-position: -30px -300px } .xymob-search .xymob-search-box { height: 50px; border-bottom: 2px solid #2d2d2d } .xymob-search .xymob-search-box input[type=text] { width: 80%; float: left; background: none; border: none; outline: none; color: hsla(0, 0%, 100%, .3); font-family: Microsoft YaHei; font-size: 16px; height: 50px } .xymob-search .xymob-search-box #s_btn { width: 20%; height: 50px; outline: none; cursor: pointer; font-size: 0; background: none; border: none } .xymob-search .xymob-search-box #s_btn .icon-font { display: block; width: 100%; height: 100% } .xymob-search .xymob-search-box #s_btn .icon-font:after { background-position: -30px -210px } .xymob-search .xymob-seaerch-wz a, .xymob-search .xymob-seaerch-wz span { display: block; font-size: 14px; color: hsla(0, 0%, 100%, .9); line-height: 45px; border-bottom: 1px solid #2b2b2b } .xymob-search.clicked { left: 0 } .fl { float: left; } .fr { float: right; } /*头部样式*/ #header { background: url(../images/head-img.jpg) repeat-x; height: 100px; } .top { /* width:1100px; */ /* margin:0 auto; */ margin-top: 15px; } /*.logo {*/ /*float:left;*/ /*padding-top: 4px;*/ /*}*/ .topLink { width: 770px; position: relative; z-index: 9999; } .topLink .k1 { text-align: right; background: url(../images/en-map.png) no-repeat; width: 70px; margin: 10px 0; line-height: 26px; font-size: 14px; } .topLink .f_count { color: #ff0000; font-size: 13px; font-weight: bold; } /*主体样式*/ #container { max-width: 1200px; margin: 0 auto; margin-top: 10px; } #containers { max-width: 1200px; margin: 0 auto; margin-top: 40px; margin-bottom: 40px; border-left: 1px solid #d9d9d9; border-right: 1px solid #d9d9d9; height: 280px; } /*首页关于我们*/ .about-box ul li { float: left; width: 192px; padding: 10px 40px; border-right: 1px solid #d9d9d9; height: 260px; text-align: center; } .about-box ul li:last-child { border-right: none; } .about-box ul li h2 { font: 400 18px/50px "microsoft yahei"; color: #000; } .about-box ul li h2:hover { color: #4e4e4e; } .about-box ul li span { font-size: 13px; color: #585858; line-height: 26px; } .about-box ul li a { display: block; line-height: 34px; font-size: 13px; color: #36a3d2; margin-top: 10px; } .about-box ul li a:hover { color: #56c2a2; } .about-box ul li:hover { cursor: pointer; } /*首页联系我们*/ .wrap-contact { background-color: #303033; padding: 28px 0; display: none; } .contact-content { color: #fff; } /*首页区域*/ .region { border: 1px solid #e0e1dc; padding: 10px; margin-top: 10px; color: #333; } .region h3 { line-height: 30px; height: 30px; line-height: 30px; padding-left: 10px; position: relative; font-family: "微软雅黑"; background: #f3f3f3; border-bottom: 2px solid #df2525; font-size: 14px; } .region .item { padding: 10px; padding-bottom: 0; color: #666; } .region .item a { color: #666; padding-left: 12px; padding-right: 12px; line-height: 26px; margin-bottom: 6px; } .region .item a:hover { text-decoration: underline; color: #df2525; } .city h2 { line-height: 30px; border-bottom: 2px solid #e87518; padding-left: 5px; } .city .item { line-height: 28px; padding: 10px; } /*产品列表页描述*/ .prodescription { border: 1px solid #e5e5e5; background: #f9f9f9; line-height: 24px; padding: 10px; margin-bottom: 15px; text-indent: 20px; } /*友情链接*/ .f_link { width: 1000px; margin: 0 auto; margin-top: 15px; line-height: 30px; line-height: 30px; background-color: #ececec; text-indent: 20px; } /*页面底部*/ #footer { position: relative; background-color: #2e2e2f; border-top: 1px solid #444445; padding: 12px 0; } .nav_foot { margin-top: 4px; width: 140px; height: 32px; } .nav_foot a { display: block; width: 32px; height: 32px; float: left; padding: 0 6px; } .nav_foot a:hover { opacity: 0.5; } .nav_foot .icon-1 { background: url(../images/weixin.png) no-repeat; line-height: 32px; } .nav_foot .icon-2 { background: url(../images/qq.png) no-repeat; } .nav_foot .icon-3 { background: url(../images/weibo.png) no-repeat; } .copyright { width: 610px; text-align: left; line-height: 32px; color: #6b6b6c; } .copyright a { color: #6b6b6c; } .more_region { position: absolute; right: 10px; line-height: 30px; top: 0; font-weight: normal; font-size: 12px; } #footer h3 { width: 80px; line-height: 30px; position: absolute; right: 233px; top: 5px; font-weight: normal; } /*------------内页-------------------*/ .n_banner { width: 100%; } .n_banner img { width: 100%; } .sitemp { line-height: 31px; height: 31px; overflow: hidden; padding-right: 10px; background: url(../images/nav.png) no-repeat 0% 100%; } .sitemp h2 { width: 340px; float: left; line-height: 31px; text-align: center; text-align: left; text-indent: 15px; color: #000; font-family: "微软雅黑"; font-size: 14px; } .sitemp .site { width: 380px; float: right; text-align: right; line-height: 30px; font-family: "微软雅黑"; } .right .content { padding-top: 15px; overflow: hidden; padding-bottom: 30px; } .nav-content { width: 1000px; margin: 0 auto; padding: 20px 0 0; } .jump-center { max-width: 600px; margin: 20px auto; text-align: center; line-height: 36px; padding: 90px 10px; font-size: 13px; } .jump-center span { font-size: 15px; color: red; } .jump-center a { color: red; } .relate { display: none; } @media (max-width: 768px) { body { padding-top: 60px; } } @media (max-width: 680px) { .news_list li span { display: none; } } .navv { display: flex; flex-wrap: wrap; justify-content: space-between; } .navv li { text-align: center; width: 32%; background: #1856a4; margin-top: 15px; padding: 10px 0 5px; } .navv li span { color: #fff; font: 400 14px/30px "Microsoft YaHei"; display: block; } .navv li img { width: 30%; height: auto; }