/* 英文默认字体 */ @font-face { font-family: opensans; src: } * { font-family: arial, helvetica, sans-serif; } html, body { font-size: 16px; background-color: #fff; } body, div, a, li, ul, ol, dl, img, span, input { padding: 0px; margin: 0px; list-style: none; border: 0px; } a:link { color: #000; text-decoration: none; } a:visited { text-decoration: none; color: #000; } a:hover { text-decoration: none; color: #000; } a:active { text-decoration: none; color: #000; } /* 外边距和后台一致 */ p { margin: 5px 0; } ul { list-style-type: none; } img { max-width: 100%; } .clear { clear: both; } .f-l { float: left; } .f-r { float: right; } .after:after { content: ''; display: block; clear: both; } .mr-0 { margin-right: 0px !important; } .this-1400 { margin: 0 auto; width: 1400px; } /* 表格初始化 */ table { border-collapse: collapse; border-spacing: 0; } td { border: 1px solid #eee; padding: 7px; font-size: 14px; } .o-v { overflow-y: hidden; } /* 头部 */ #header .logo { padding: 25px 0; float: left; font-size: 0; } #header .right { float: right; line-height: 120px; } #header .right .nav { float: left; } #header .right .nav a { margin-left: 55px; } #header .right .search { float: left; margin: 0 30px; } #header .right .language { float: left; } #header .right .language a { font-size: 12px; } #header .right .language a:nth-of-type(1) { border-right: 1px solid #000; padding-right: 10px; margin-right: 10px; } /* 首页标题 */ #home .home-title { padding-top: 55px; } #home .home-title .title { float: left; font-size: 36px; color: #0f149a; padding-bottom: 20px; } #home .home-title .more { float: right; font-size: 16px; color: #0f149a; margin-top: 15px; } #home .home-title>.this-1400 { position: relative; } #home .home-title>.this-1400>.line { position: absolute; margin: 0; background-color: #0f149a; height: 2px; width: 89px; bottom: -1.5px; } #home .home-title>.line { margin: 0; background-color: #ccc; width: 100%; height: 1px; } /* 首页 */ #home .products { background-image: url(/uploads/image/peimages/bg_products.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; } #home .products .list { margin-top: 40px; padding-bottom: 40px; } #home .products .list a { width: 100%; position: relative; border: 1px solid #bfbfbf; box-sizing: border-box; display: block; } #home .products .list a .img { padding-top: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; } #home .products .list a .title { position: absolute; bottom: 10px; color: #fff; text-align: center; font-size: 16px; background-color: #07108e; display: inline-block; left: 50%; transform: translate(-50%, 0px); border-radius: 20px; padding: 10px 20px; white-space: nowrap; max-width: calc(100% - 20px); box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; } #home .about .body { padding: 40px 0; padding-bottom: 50px; } #home .about .body .left { float: left; width: 900px; } #home .about .body .right { width: 400px; float: right; } #home .about .body .right img { border: 4px solid #0f149a; box-sizing: border-box; } #home .news { padding-bottom: 30px; background-color: #e8f8ff; } #home .news .main { margin-top: 40px; } #home .news .main .left { width: calc(50% - 20px); float: left; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; } #home .news .main .right { width: calc(50% - 20px); float: right; padding-top: 50px; } #home .news .main .right .time { font-size: 18px; color: #666; } #home .news .main .right .time i { margin-right: 10px; } #home .news .main .right .line { height: 2px; width: 60px; background-color: #666; margin-top: 25px; } #home .news .main .right .title { line-height: 36px; font-size: 24px; padding: 30px 0; color: #0f149a; } #home .news .main .right .introduce { font-size: 16px; color: #000; } #home .news .list { margin-top: 30px; } #home .news .list a { float: left; width: calc(33.333% - 13.3333px); margin-right: 20px; padding: 20px; box-sizing: border-box; background-color: #fff; } #home .news .list a:nth-of-type(3n) { margin-right: 0px; } #home .news .list a .time { font-size: 18px; color: #666; } #home .news .list a .time i { margin-right: 10px; } #home .news .list a .line { height: 2px; width: 60px; background-color: #666; margin-top: 20px; } #home .news .list a .title { font-size: 16px; line-height: 24px; height: 48px; overflow: hidden; color: #333; margin-top: 20px; } #home .news .list a:hover { background-color: #0f149a; } #home .news .list a:hover .title { color: #fff; } #home .news .list a:hover .time { color: #fff; } #home .news .list a:hover .line { background-color: #fff; } #home .pic { background-color: #f2f2f2; } #home .pic .body { padding: 50px 0; } #home .pic .body img { padding: 10px; box-sizing: border-box; width: calc(16.666% - 8.333px); margin-right: 10px; float: left; box-sizing: border-box; background-color: #fff; } #home .pic .body img:nth-of-type(6n) { margin-right: 0px; } #home .pic .body img:nth-of-type(n 7) { margin-top: 10px; } /* 其他页公共部分 */ #main>.banner { font-size: 0px; height: 500px; background-size: cover; background-position: center; background-repeat: no-repeat; } #main>.link { line-height: 74px; background-color: rgb(34, 82, 179); } #main>.link .left { float: left; color: #fff; font-size: 30px; } #main>.link .left form input { line-height: 30px; font-size: 14px; padding: 0px 5px; border-radius: 3px; vertical-align: middle; width: 200px; } #main>.link .left form button { line-height: 30px; border-radius: 3px; border: 0px; padding: 0 20px; vertical-align: middle; cursor: pointer; } #main>.link .right { float: right; color: #fff; } #main>.link .right i { font-size: 20px; } #main>.link .right a { border-right: 1px solid #fff; margin-left: 10px; color: #fff; padding-right: 10px; margin-right: 10px; } /* 关于我们 */ #main .about .series { padding-top: 50px; font-size: 0px; text-align: center; } #main .about .series a { font-size: 18px; border: 1px solid #0f149a; padding: 10px 15px; display: inline-block; margin-right: 20px; transition: all 0.3s; } #main .about .series a:hover { color: #fff; background-color: #0f149a; } #main .about .series a.active { color: #fff; background-color: #0f149a; } #main .about>div>.title { text-align: center; padding: 40px 0; } #main .about>div>.title p { font-size: 30px; font-family: '黑体'; font-weight: bold; border-bottom: 2px solid #000; padding-bottom: 10px; display: inline-block; margin: 0; } #main .about>div>.line { height: 1px; width: 100%; background-color: #e5e5e5; } #main .about>.content>.body { padding: 40px 0; } #main .about .pic .list { padding-bottom: 40px; } #main .about .pic img { padding: 10px; border: 1px solid transparent; box-sizing: border-box; width: calc(16.666% - 8.333px); margin-right: 10px; float: left; box-sizing: border-box; } #main .about .pic img:nth-of-type(6n) { margin-right: 0px; } #main .about .pic img:nth-of-type(n 7) { margin-top: 10px; } /* 产品中心 */ #main .products { padding: 30px 0; } #main .products>.left { width: 250px; float: left; background-color: rgb(242, 242, 242); } #main .products>.left .title { padding: 20px 30px; text-align: center; color: rgb(35, 82, 184); font-size: 25px; border-bottom: 1px solid rgb(158, 158, 158); } #main .products>.left .list { padding: 20px 30px; } #main .products>.left .list a { display: block; line-height: 30px; } #main .products>.left .list a:hover { color: rgb(35, 82, 184); } #main .products>.right { width: calc(100% - 350px); margin-left: 100px; float: left; } #main .products>.right .list { margin-top: 40px; padding-bottom: 10px; } #main .products>.right .list a { float: left; width: calc(33% - 20px); position: relative; border: 1px solid #bfbfbf; box-sizing: border-box; margin-right: 30px; transition: all 0.3s; } #main .products>.right .list a:nth-of-type(3n) { margin-right: 0px; } #main .products>.right .list a:nth-of-type(n 4) { margin-top: 30px; } #main .products>.right .list a:hover { box-shadow: 4px 0 10px rgba(0, 0, 0, 0.23); } #main .products>.right a .img { padding-top: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; } #main .products>.right a .title { position: absolute; bottom: 10px; color: #fff; text-align: center; font-size: 16px; background-color: #07108e; display: inline-block; left: 50%; transform: translate(-50%, 0px); border-radius: 20px; padding: 10px 20px; white-space: nowrap; max-width: calc(100% - 20px); box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; } /* 产品内页 */ #main .products-view { padding: 20px 0; background-color: #fff; border-radius: 5px; margin-bottom: 20px; } #main .products-view>.title .img { width: 400px; margin: auto; } #main .products-view>.title .img>a { display: block; width: 100%; padding-top: 100%; border: 1px solid #f1f2f4; text-align: center; box-sizing: border-box; font-size: 0; background-size: contain; background-position: center; background-repeat: no-repeat; } #main .products-view>.title .img .list li { width: calc(25% - 8px); margin-right: 10px; margin-top: 10px; float: left; border: 1px solid #f1f2f4; box-sizing: border-box; } #main .products-view>.title .img .list a { display: block; width: 100%; padding-top: 100%; background-size: contain; background-position: center; background-repeat: no-repeat; } #main .products-view>.title .img .list li:nth-of-type(4n) { margin-right: 0; } #main .products-view>.title .img .list li.active { border: 1px solid #00713d; } #main .products-view>.title>p { text-align: center; font-size: 25px; margin: 20px 0; } #main .products-view .details { padding: 10px; border-top: 1px solid #eee; } #main .products-view .other .title { text-align: center; font-size: 25px; font-weight: bold; margin-bottom: 20px; } /* 新闻内页 */ #main .news-view { padding: 20px 0; } #main .news-view .title { border-bottom: 1px solid #ccc; } #main .news-view .title p:first-child { font-size: 28px; text-align: center; margin: 0; margin-bottom: 20px; } #main .news-view .title p:first-child p { font-size: 14px; text-align: center; margin-top: 10px; color: #999; margin-bottom: 20px; } #main .news-view .content { padding: 10px 0; } /* 新闻中心 */ #main .news { padding: 30px 0; } #main .news>.left { width: 250px; float: left; background-color: rgb(242, 242, 242); } #main .news>.left .title { padding: 20px 30px; text-align: center; color: rgb(35, 82, 184); font-size: 25px; border-bottom: 1px solid rgb(158, 158, 158); } #main .news>.left .list { padding: 20px 30px; } #main .news>.left .list a { display: block; line-height: 30px; } #main .news>.left .list a:hover { color: rgb(35, 82, 184); } #main .news>.right { width: calc(100% - 350px); margin-left: 100px; float: left; } #main .news>.right .list a { width: calc(50% - 15px); float: left; margin-right: 30px; } #main .news>.right .list a:nth-of-type(2n) { margin-right: 0px; } #main .news>.right .list a:nth-of-type(n 3) { margin-top: 30px; } #main .news>.right .list a .img { padding-top: 70%; background-size: cover; background-position: center; background-repeat: no-repeat; } #main .news>.right .list a .time { color: #666; margin: 20px 0; } #main .news>.right .list a .title { line-height: 25px; height: 50px; overflow: hidden; color: #333; } #main .news>.right .list a .more { margin-top: 20px; color: #0f149a; text-decoration: underline; } /* 下载中心 */ #main .download .list a { line-height: 60px; border-bottom: 1px solid #999; display: block; } #main .download .list a::after { content: ""; clear: both; display: block; } #main .download .list a i, #main .download .list a p { display: inline-block; margin: 0; } #main .download .list a .left { float: left; } #main .download .list a .right { float: right; } #main .download .list a .left i { margin-right: 10px; font-size: 20px; } #main .download .list a .right p { margin-right: 10px; font-size: 14px; } #main .download .list a:hover { color: #0f149a; } #main .download .list a:hover i { color: #0f149a; } /* 联系我们 */ #main .contact { padding: 20px 0; } /* 底部 */ #footer { background-color: #333; } #footer .this-1400 { padding: 30px 0; } #footer .qr-code { width: 150px; float: left; } #footer .qr-code p { color: #fff; text-align: center; } #footer .nav { width: 320px; margin-left: 250px; float: left; margin-top: 20px; } #footer .nav a { color: #fff; line-height: 38px; display: block; font-size: 14px; } #footer .contact { width: 500px; margin-top: 20px; float: left; } #footer .contact p, #footer .contact a { color: #fff; } #footer .copyright { text-align: center; color: #fff; line-height: 60px; border-top: 1px solid #1f1a1a; } #footer .copyright a, #footer .copyright p { color: #fff; margin: 0; font-size: 14px; } /* 手机版 */ #nav-m { display: none; } @media screen and (max-width:1200px) { html, body { overflow-x: hidden; min-height: 100vh; } .this-1400 { width: auto; } #header { display: none; } /* 头部 */ .wrap { transition: all 0.3s ease 0s; transform: translate(0, 0px); } .wrap.active { transform: translate(calc(-90% 60px), 0px); } #nav-m { height: 50px; display: block; position: relative; z-index: 999; font-size: 0; width: 100%; } #nav-m .logo { height: 50px; float: left; } #nav-m .logo img { height: 24px; margin-left: 10px; margin-top: 13px; } #nav-m>.title { font-size: 14px; display: inline-block; line-height: 50px; vertical-align: top; margin-left: 10px; width: calc(100% - 140px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } #nav-m .menu { position: absolute; right: 10px; top: 11px; width: 22px; padding: 5px 10px; border: 1px solid #333; border-radius: 3px; } #nav-m .menu span { display: block; width: 100%; margin-bottom: 5px; height: 2px; background-color: #333; } #nav-m .menu span:nth-of-type(3) { margin-bottom: 0px; } #nav-m .list { position: fixed; left: 100%; width: calc(90% - 60px); top: 0; height: 100vh; } #nav-m .list a { padding-left: 10px; position: relative; } #nav-m .list a { height: 45px; width: 100%; float: left; font-size: 14px; color: #666; box-sizing: border-box; line-height: 45px; border-bottom: 1px solid #dededf; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #nav-m .list .title { border-bottom: 1px solid #dededf; } #nav-m .list .title a { width: calc(100% - 60px); border-right: 1px solid #dededf; border-bottom: 0; } #nav-m .list li i { width: 60px; height: 45px; line-height: 45px; float: right; font-size: 22px; text-align: center; color: #666; transition: all 0.3s; box-sizing: border-box; } #nav-m .list li .children { background-color: #fafafa; display: none; } #nav-m .list .language a { float: left; width: 50%; } #nav-m .list .language a:nth-of-type(1) { border-right: 1px solid #dededf; } /* 搜索 */ #nav-m .list .search { font-size: 0; display: block; padding: 20px; } #nav-m .list .search input { width: calc(100% - 50px); line-height: 35px; padding-left: 10px; padding-right: 10px; box-sizing: border-box; outline: none; border: 1px solid #dededf; font-size: 12px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; } #nav-m .list .search button { width: 50px; line-height: 37px; border: 0; height: 37px; vertical-align: bottom; color: #fff; background-color: #ddd; outline: none; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } /* 首页 */ #video { width: 100% !important; height: auto !important; background-color: transparent; } #video video { height: auto !important; width: 100%; } #home .home-title { padding-left: 10px; padding-right: 10px; padding-top: 25px; } #home .home-title .title { font-size: 20px; padding-bottom: 10px; } #home .home-title .more { font-size: 14px; margin-top: 6px; } #home .products .list { margin-top: 25px; padding-bottom: 25px; padding-left: 10px; padding-right: 10px; box-sizing: border-box; } #home .products .list a .title { font-size: 10px; padding: 5px 10px; } #home .about .body { padding-left: 10px; padding-right: 10px; padding-bottom: 25px; } #home .about .body .left { width: 100%; float: none; } #home .about .body .right { width: 200px; margin: 0 auto; float: none; } #home .news .main { margin-top: 25px; padding-left: 10px; padding-right: 10px; } #home .news .main .left { width: 100%; height: 250px; } #home .news .main .right { width: 100%; padding-top: 15px; } #home .news .main .right .line { margin-top: 15px; } #home .news .main .right .title { padding: 10px 0; font-size: 16px; line-height: 25px; } #home .news .main .right .introduce { font-size: 12px; } #home .news .list { margin-top: 25px; padding-left: 10px; padding-right: 10px; } #home .news .list a { width: calc(50% - 5px); margin-right: 10px !important; padding: 10px; } #home .news .list a:nth-of-type(2n) { margin-right: 0px !important; } #home .news .list a:nth-of-type(n 3) { margin-top: 10px; } #home .news .list a:nth-of-type(n 3) { margin-top: 10px; } #home .news .list a .line { margin-top: 10px; } #home .news .list a .time { font-size: 16px; } #home .news .list a .title { margin-top: 10px; font-size: 14px; } #home .pic .body { padding: 25px 10px; } #home .pic .body img { width: calc(33.33% - 6.66px); margin-right: 10px !important; padding: 3px; } #home .pic .body img:nth-of-type(3n) { margin-right: 0 !important; } #home .pic .body img:nth-of-type(n 4) { margin-top: 10px; } /* 其他页公共部分 */ #main>.banner { height: 150px; } #main>.banner img { height: 150px; width: 100%; } #main .about .series { display: none; } #main>.link { padding-left: 10px; padding-right: 10px; line-height: 50px; } #main>.link .left { font-size: 20px; display: none; } #main>.link .right { font-size: 14px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 100%; } #main>.link .right i { font-size: 18px; } /* 关于我们 */ #main .about>div>.title { padding: 20px 0; } #main .about>div>.title p { font-size: 20px; } #main .about>.content>.body { padding: 20px 10px; padding-top: 0px; } /* 合作伙伴 */ #main .about .pic .list { padding-bottom: 20px; padding-left: 10px; padding-right: 10px; } #main .about .pic .list img { width: calc(33.33% - 6.66px); margin-right: 10px !important; padding: 3px; } #main .about .pic .list img:nth-of-type(3n) { margin-right: 0 !important; } #main .about .pic .list img:nth-of-type(n 4) { margin-top: 10px; } /* 产品列表 */ #main .products>.left { display: none; } #main .products>.right { margin-left: 0px; width: 100%; } #main .products>.right .list { margin-top: 20px; padding-left: 10px; padding-right: 10px; } #main .products>.right .list a { width: calc(50% - 5px); margin-right: 10px !important; } #main .products>.right .list a:nth-of-type(2n) { margin-right: 0px !important; } #main .products>.right .list a:nth-of-type(n 3) { margin-top: 15px !important; } #main .products>.right a .title { font-size: 12px; padding: 5px 10px; } /* 产品内页 */ #main .products-view { padding: 20px 10px; } #main .products-view>.title .img { width: 100%; } /* 新闻列表 */ #main .news>.left { display: none; } #main .news>.right { margin-left: 0px; width: 100%; } #main .news>.right>.list { padding-left: 10px; padding-right: 10px; } #main .news>.right .list a .time { margin: 10px 0; } #main .news>.right .list a .title { font-size: 14px; } /* 新闻内页 */ #main .news-view { padding: 20px 10px; } #main .news-view .title p:first-child { font-size: 20px; margin-bottom: 10px; } /* 下载中心 */ #main .download .list { padding-top: 20px; padding-left: 10px; padding-right: 10px; } #main .download .list a { line-height: 40px; } /* 联系我们 */ #main .contact { padding-left: 10px; padding-right: 10px; } /* 搜索页 */ #main>.search .left { float: none; } #main>.search .right { display: none; } /* 底部 */ #footer .qr-code { display: none; } #footer .nav { margin-left: 0px; width: 100%; margin-top: 0px; padding-left: 10px; padding-right: 10px; } #footer .nav a { display: inline-block; margin-right: 10px; } #footer .contact { width: 100%; padding-left: 10px; padding-right: 10px; } #footer .copyright { line-height: 30px; } #footer .copyright a, #footer .copyright p { font-size: 10px; padding-left: 10px; padding-right: 10px; } }