/*html { filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: url("data:image/svg+xml;utf8,#grayscale"); filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(1); }*/ .left { float: left; } .right { float: right; } .main { width: 100%; overflow: hidden; height: auto; } .table { width: 100%; height: 100%; display: table; } .table .table-cell { width: 100%; height: 100%; vertical-align: middle; display: table-cell; } .w1200 { width: 90%; max-width: 1200px; height: auto; margin: 0 auto; position: relative; } .bgc { background-size: cover; background-repeat: no-repeat; background-position: center; } .header-box { height: 113px; } @media (max-width: 1024px) { .header-box { height: 60px; } } .header { width: 100%; height: 113px; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 15; box-shadow: 0 1px 1px rgba(82, 85, 94, 0.2); } .header .w1200 { height: 80px; } .header .w1200 .logo { width: 121px; height: auto; float: left; margin-top: 18px; } .header .w1200 .language { float: right; font-size: 14px; line-height: 30px; padding-top: 25px; } .header .w1200 .language a { color: #323333; float: left; } .header .w1200 .language a.on { color: #d51a20; } .header .w1200 .language span { width: 1px; height: 12px; margin: 9px 13px 0 13px; float: left; background-color: #ccc; } .header .w1200 .searchBox { width: 30px; height: 36px; float: right; margin-top: 22px; margin-right: 24px; position: relative; } .header .w1200 .searchBox .searchClick { width: 30px; height: 36px; background-image: url("../img/search.png"); background-position: center; background-repeat: no-repeat; display: block; } .header .w1200 .searchBox .search-new { width: 200px; height: 34px; border: 1px solid #333; border-radius: 5px; position: absolute; right: 0; top: 0; background-color: #fff; z-index: 4; display: none; } .header .w1200 .searchBox .search-new .text { width: 160px; height: 34px; float: left; padding-left: 10px; border: none; background: none; font-size: 14px; line-height: 34px; color: #666; } .header .w1200 .searchBox .search-new .submit { width: 30px; height: 34px; float: left; background: none; border: none; background-image: url("../img/search.png"); background-position: center; background-repeat: no-repeat; } .header .w1200 .searchBox.on .search-new { display: block; } .header .w1200 .navlin { width: 22px; height: 20px; margin-left: 10px; margin-top: 22px; display: block; float: right; cursor: pointer; display: none; margin-right: 3%; } .header .w1200 .navlin span { display: block; width: 100%; height: 2px; background: #c01b20; position: relative; transition: .3s; -webkit-transition: .3s; } .header .w1200 .navlin span:nth-child(2), .header .w1200 .navlin span:nth-child(3) { margin-top: 5px; } .header .w1200 .navlin.cur span:nth-child(1) { transform: rotate(45deg); -webkit-transform: rotate(45deg); top: 7px; } .header .w1200 .navlin.cur span:nth-child(2) { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); top: 0px; } .header .w1200 .navlin.cur span:nth-child(3) { display: none; } .header .nav { width: 100%; height: 33px; background-color: #c01b20; } .header .nav ul { width: 100%; text-align: center; font-size: 0; height: auto; } .header .nav ul li { display: inline-block; margin: 0 44px; position: relative; } .header .nav ul li .tits { font-size: 14px; line-height: 33px; color: #fff; position: relative; display: block; } .header .nav ul li .tits:after { content: ""; width: 0; height: 2px; background-color: #fff; position: absolute; bottom: 0; left: 50%; transition: width .5s,left .5s; z-index: 11; } .header .nav ul li dl { width: 156px; height: auto; position: absolute; left: 50%; margin-left: -78px; top: 32px; border-radius: 0 0 6px 6px; background-color: rgba(255, 255, 255, 0.95); overflow: hidden; border: 1px solid #c01b20; z-index: 10; display: none; } .header .nav ul li dl dd { width: 100%; font-size: 13px; line-height: 40px; border-bottom: 1px solid #eee; transition: all .5s; text-align: center; } .header .nav ul li dl dd a { color: #333; width: 100%; display: block; } @media (min-width: 1024px) { .header .nav ul li dl dd:hover { background-color: #c01b20; border-bottom: 1px solid #c01b20; } .header .nav ul li dl dd:hover a { color: #fff; } } .header .nav ul li.on .tits:after { width: 100%; left: 0; } @media (min-width: 1024px) { .header .nav ul li:hover .tits:after { width: 100%; left: 0; } } .header .nav .language { font-size: 14px; line-height: 30px; padding-top: 10px; display: none; width: 92%; margin: 0 auto; } .header .nav .language a { color: #323333; float: left; } .header .nav .language a.on { color: #d51a20; } .header .nav .language span { width: 1px; height: 12px; margin: 9px 13px 0 13px; float: left; background-color: #ccc; } .header.on { background-color: #fcfcfc; } @media (max-width: 1024px) { .header { height: 60px; } .header .w1200 { width: 100%; height: 60px; } .header .w1200 .logo { width: 87px; margin-top: 13.5px; margin-left: 3%; } .header .w1200 .searchBox { display: none; } .header .w1200 .language { display: none; } .header .w1200 .navlin { display: block; } .header .nav { width: 100%; position: fixed; top: 60px; left: 0; height: calc(100vh - 60px); background-color: rgba(250, 250, 250, 0.9); z-index: 19; display: none; } .header .nav ul { width: 92%; margin: 0 auto; padding-top: 12px; text-align: left; } .header .nav ul li { width: 100%; height: auto; padding-bottom: 0; margin: 0; position: relative; } .header .nav ul li .tits { font-size: 16px; font-weight: bold; line-height: 36px; padding: 0; display: block; color: #999899; } .header .nav ul li .tits:after { display: none; } .header .nav ul li dl { width: 100%; font-size: 18px; line-height: 36px; padding: 0; display: block; color: #c01b20; position: relative; top: auto; left: auto; margin-left: 0; display: block; border: none; border-top: 1px solid #999899; background: none; } .header .nav ul li dl dd { width: auto; margin-right: 15px; display: inline-block; font-size: 14px; line-height: 30px; border-bottom: none; } .header .nav ul li dl dd a { width: 100%; height: auto; display: block; color: #999899; } .header .nav .language { display: block; } } .index-banner { width: 100%; height: auto; position: relative; } .index-banner ul li { width: 100%; height: auto; position: relative; } .index-banner ul li .con { width: 100%; height: auto; position: absolute; top: 0; left: 0; } .index-banner ul li .con .conn { color: #fff; padding-top: 35%; } .index-banner ul li .con .conn .tits { font-size: 16px; line-height: 16px; } .index-banner ul li .con .conn .tit { font-size: 50px; line-height: 50px; font-weight: bold; margin-top: 17px; } .index-banner .btns { width: 100%; height: auto; position: absolute; left: 0; bottom: 30px; font-size: 0; text-align: center; z-index: 5; } .index-banner .btns span { width: 12px; height: 12px; border-radius: 12px; background-color: #fff; display: inline-block; margin: 0 5px; cursor: pointer; opacity: 1; transition: width .5s; } .index-banner .btns span.swiper-pagination-bullet-active { width: 40px; border-radius: 12px; background-color: #c01b20; } @media (max-width: 1024px) { .index-banner ul li { overflow: hidden; } .index-banner ul li img { width: 150%; margin-left: -25%; } .index-banner .btns { bottom: 10px; } .index-banner .btns span { width: 8px; height: 8px; border-radius: 8px; } .index-banner .btns span.swiper-pagination-bullet-active { width: 20px; } } .indexTitle { width: 100%; height: auto; text-align: center; position: relative; } .indexTitle .en { font-size: 114px; line-height: 83px; color: #f7f7f7; font-family: Arial; font-weight: bold; } .indexTitle .tits { position: absolute; top: 22px; left: 0; width: 100%; } .indexTitle .tits .cn { font-size: 18px; line-height: 18px; color: #323333; } .indexTitle .tits .line { width: 50px; height: 2px; margin: 20px auto 0; background-color: #c01b20; } @media (max-width: 1024px) { .indexTitle .en { font-size: 74px; line-height: 55px; } .indexTitle .tits { top: 11px; } .indexTitle .tits .line { margin: 10px auto 0; } } .index { width: 100%; height: auto; } .index .index-about { padding-top: 6.2%; padding-bottom: 7.7%; background-position: bottom center; background-repeat: no-repeat; background-size: 93% auto; } .index .index-about .con { max-width: 92%; width: 940px; margin: 4.4% auto 0; font-size: 14px; line-height: 28px; color: #666; text-align: center; } .index .index-about .conBox { width: 100%; height: auto; text-align: justify; text-align-last: justify; margin-top: 7.7%; } .index .index-about .conBox .item { width: auto; display: inline-block; text-align: center; text-align-last: center; } .index .index-about .conBox .item .num { font-size: 80px; line-height: 60px; font-weight: bold; color: #999899; font-family: Arila; } .index .index-about .conBox .item .num span { font-size: 20px; font-weight: normal; } .index .index-about .conBox .item .t { font-size: 12px; line-height: 12px; color: #666666; margin-top: -5px; } .index .index-about .conBox .item.it .num { color: #c05054; } .index .index-about .conBox .line { width: 1px; height: 90px; background-color: #e5e3e3; display: inline-block; } .index .index-about .more { width: 168px; height: 44px; border-radius: 16px; background-color: #c01b20; display: block; margin: 7.7% auto 0; text-align: center; color: #fff; font-size: 12px; line-height: 44px; } .index .index-about .more span { display: inline-block; padding-right: 70px; background-position: right center; background-repeat: no-repeat; background-image: url("../img/icon1.png"); transition: padding .5s; } @media (min-width: 1024px) { .index .index-about .more:hover span { padding-right: 80px; } } .index .index-product { width: 100%;margin-top: 40px; height: auto; } .index .index-product ul { width: 100%; height: auto; } .index .index-product ul li { width: 25%; float: left; height: auto; position: relative; } .index .index-product ul li a { width: 100%; height: auto; display: block; } .index .index-product ul li a .con { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(157, 47, 23, 0.7); text-align: center; color: #fff; opacity: 0; transform: scale(0.8); transition: opacity .5s,transform .5s; } .index .index-product ul li a .con .tits { font-size: 30px; line-height: 30px; } .index .index-product ul li a .con .tit { font-size: 14px; line-height: 14px; margin-top: 12px; } .index .index-product ul li a .con .icon { width: 48px; height: 30px; margin: 68px auto 0; } @media (min-width: 1024px) { .index .index-product ul li:hover a .con { opacity: 1; transform: scale(1); } } .index .index-news { padding-top: 6.2%; padding-bottom: 5.2%; } .index .index-news .content { width: 100%; height: auto; margin-top: 6.6%; } .index .index-news .content .item { width: 48.3%; height: auto; } .index .index-news .content .item a { width: 100%; height: auto; display: block; } .index .index-news .content .item a .pic { width: 100%; height: auto; overflow: hidden; border-radius: 10px; } .index .index-news .content .item a .con { width: calc(100% - 20px); padding: 0 10px; margin-top: 24px; } .index .index-news .content .item a .con .tits { font-size: 14px; line-height: 24px; color: #323333; } .index .index-news .content .item a .con .time { font-size: 12px; line-height: 12px; color: #666; margin-top: 6px; } .index .index-news .content .item a .con .icon { width: 48px; height: 30px; margin-top: 30px; } @media (max-width: 1024px) { .index .index-about .conBox .item .num { font-size: 46px; line-height: 36px; } .index .index-about .conBox .item .num span { font-size: 16px; } .index .index-about .conBox .item .t { margin-top: 0px; } .index .index-about .conBox .line { height: 60px; } .index .index-product ul li a .con { transform: scale(1); opacity: 1; } .index .index-product ul li a .con .tits { font-size: 22px; line-height: 22px; } } @media (max-width: 640px) { .index .index-about .conBox .item .num { font-size: 24px; line-height: 22px; } .index .index-about .conBox .item .num span { font-size: 12px; } .index .index-about .conBox .item .t { margin-top: 10px; } .index .index-about .conBox .line { height: 46px; } .index .index-about .more { width: 130px; height: 32px; line-height: 32px; } .index .index-about .more span { padding-right: 50px; } .index .index-product ul li { width: 50%; } .index .index-product ul li a .con{ position:relative; height:auto; padding:20px 0 15px; } .index .index-news .content .item { width: 100%; margin-bottom: 25px; } .index .index-news .content .item a .con { margin-top: 10px; } .index .index-news .content .item a .con .icon { margin-top: 20px; } .index .index-product ul li a .con .tits { font-size: 16px; line-height: 16px; } .index .index-product ul li a .con .tit { font-size: 12px; display: none; line-height: 12px; } .index .index-product ul li a .con .icon{margin: 20px auto 0;} .index .index-about .con { max-width: 100%; line-height: 26px; } } .pic.hover { overflow: hidden; } .pic.hover img { transition: transform 1.5s; } @media (min-width: 1024px) { .pic.hover:hover img { transform: scale(1.1); } } .footerBox { width: 100%; height: auto; background-color: #f5f5f5; } .footerBox .footer { padding: 32px 0 46px; } .footerBox .footer .logo { width: 127px; height: auto; float: left; } .footerBox .footer .tel { font-size: 14px; line-height: 18px; color: #666; padding-left: 28px; background-position: left center; background-repeat: no-repeat; background-image: url("../img/tel.png"); float: right; margin-top: 18px; } .footerBox .footer .nav { width: 100%; position: absolute; top: 50px; text-align: center; left: 0; font-size: 0; } .footerBox .footer .nav a { font-size: 14px; line-height: 18px; color: #666; margin: 0 22px; } @media (min-width: 1024px) { .footerBox .footer .nav a:hover { color: #c01b20; } } .footerBox .foot { width: 100%; height: 58px; background-color: #c01b20; } .footerBox .foot p { text-align: center; font-size: 12px; line-height: 58px; color: #e5e5e5; } .footerBox .foot p span { margin-right: 20px; } .footerBox .foot p a { color: #e5e5e5; } .footerBox .foot p a:hover{ color:#fff; } @media (max-width: 1024px) { .footerBox .footer { display: none; } .footerBox .foot { height: auto; padding-top: 15px; padding-bottom: 20px; } .footerBox .foot p { line-height: 22px; } .footerBox .foot p span { width: 100%; display: block; } .footerBox .foot p a { width: 100%; display: block; } } .product { padding-top: 3.2%; padding-bottom: 4%; } .product .title { width: 100%; height: auto; text-align: center; } .product .title .tits { font-size: 18px; line-height: 30px; color: #333; } .product .title .line { width: 126px; height: 2px; background-color: #252525; position: relative; margin: 14px auto 0; } .product .title .line span { width: 40px; height: 2px; position: absolute; top: 0; left: 0; background-color: #c01b20; } .product .list { width: 100%; height: auto; margin-top: 40px; } .product .list .item { width: 23.2%; height: auto; float: left; margin-right: 2.4%; margin-bottom: 40px; } .product .list .item a { width: 100%; height: auto; display: block; } .product .list .item a .picBox { width: 100%; height: auto; overflow: hidden; border-radius: 10px; } .product .list .item a .picBox ul li { float: left; } .product .list .item a .tits { text-align: center; font-size: 14px; line-height: 14px; color: #333; margin-top: 23px; } .product .list .item:nth-child(4n) { margin-right: 0; } @media (max-width: 860px) { .product .list .item { width: 31.7%; } .product .list .item:nth-child(4n) { margin-right: 2.4%; } .product .list .item:nth-child(3n) { margin-right: 0; } } @media (max-width: 560px) { .product .list { margin-top: 25px; } .product .list .item { width: 48.5%; margin-bottom: 25px; } .product .list .item:nth-child(3n) { margin-right: 2.4%; } .product .list .item:nth-child(2n) { margin-right: 0; } .product .list .item a .tits { margin-top: 10px; } .product .title .line { margin-top: 5px; } } .productInfo { width: 100%; height: auto; background-color: #fbfbfb; padding-top: 4.2%; padding-bottom: 8%; } .productInfo .pic { width: 34.5%; height: auto; float: left; border-radius: 15px; overflow: hidden; } .productInfo .content { width: 59%; float: right; height: auto; } .productInfo .content .tits { font-size: 30px; line-height: 30px; color: #333; margin-top: 18px; margin-bottom: 20px; } .productInfo .content .tit { font-size: 14px; line-height: 36px; color: #333; } .productInfo .content .tit span { width: 95px; float: left; display: block; } .productInfo .content .tit span.s { width: 95px; } .productInfo .content .tit .txt { width: calc(100% - 64px); height: auto; float: left; max-width: 490px; } .productInfo .content .tit .txt.t { width: calc(100% - 95px); max-width: 460px; } .productInfo .content .tit1 { width: 100%; height: auto; margin-top: 42px; } .productInfo .content .tit1 span { display: block; font-size: 14px; line-height: 36px; color: #333; } .productInfo .content .tit1 img { display: block; } @media (max-width: 840px) { .productInfo .pic { width: 100%; } .productInfo .content { width: 100%; } .productInfo .content .tits { font-size: 18px; line-height: 18px; margin-bottom: 15px; } .productInfo .content .tit { line-height: 26px; } .productInfo .content .tit1 { margin-top: 20px; } } .news { padding-top: 3.2%; padding-bottom: 4.7%; } .news .title { width: 100%; height: auto; text-align: center; } .news .title .tits { font-size: 18px; line-height: 30px; color: #333; } .news .title .line { width: 126px; height: 2px; background-color: #252525; position: relative; margin: 14px auto 0; } .news .title .line span { width: 40px; height: 2px; position: absolute; top: 0; left: 0; background-color: #c01b20; } .news .list { width: 100%; height: auto; margin-top: 40px; } .news .list ul { width: 100%; height: auto; } .news .list ul li { width: 31.7%; height: auto; float: left; margin-right: 2.45%; margin-bottom: 60px; } .news .list ul li a { width: 100%; height: auto; display: block; } .news .list ul li a .pic { width: 100%; height: auto; overflow: hidden; border-radius: 10px; } .news .list ul li a .con { width: calc(100% - 20px); padding: 0 10px; margin-top: 10px; } .news .list ul li a .con .tits { font-size: 14px; line-height: 24px; height: 24px; color: #323333; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .news .list ul li a .con .time { font-size: 12px; line-height: 12px; color: #666; margin-top: 11px; } .news .list ul li a .con .icon { width: 48px; height: 30px; margin-top: 30px; } .news .list ul li:nth-child(3n) { margin-right: 0%; } .news .list .more { width: 168px; height: 44px; border-radius: 16px; background-color: #c01b20; display: block; margin: 0 auto; text-align: center; color: #fff; font-size: 12px; line-height: 44px; } .news .list .more span { display: inline-block; padding-right: 70px; background-position: right center; background-repeat: no-repeat; background-image: url("../img/icon1.png"); transition: padding .5s; } @media (min-width: 1024px) { .news .list .more:hover span { padding-right: 80px; } } @media (max-width: 860px) { .news .list ul li { width: 48%; margin-right: 4%; margin-bottom: 25px; } .news .list ul li:nth-child(3n) { margin-right: 4%; } .news .list ul li:nth-child(2n) { margin-right: 0; } .news .list ul li a .con .tits { height: 40px; -webkit-line-clamp: 2; line-height: 20px; } } @media (max-width: 560px) { .news .title .line { margin-top: 5px; } .news .list ul li a .con .icon { margin-top: 20px; } .news .list .more { width: 130px; height: 32px; line-height: 32px; } .news .list .more span { padding-right: 50px; } .news .list { margin-top: 25px; } } .newsInfo { padding-top: 3.2%; padding-bottom: 4.7%; } .newsInfo .title { width: 100%; text-align: center; border-bottom: 1px solid #ddd; padding-bottom: 20px; } .newsInfo .title .tits { font-size: 16px; line-height: 24px; max-width: 90%; margin: 0 auto; } .newsInfo .title .time { font-size: 14px; line-height: 14px; color: #666; margin-top: 10px; } .newsInfo .con { width: calc(100% - 60px); margin: 30px auto 0; font-size: 14px; line-height: 26px; color: #333; } .newsInfo .con img { max-width: 100%; display: block; margin: 0 auto; } .newsInfo .paging { width: 100%; padding-top: 20px; margin-top: 40px; border-top: 1px solid #ddd; } .newsInfo .paging .left a { font-size: 14px; line-height: 32px; color: #666; } @media (min-width: 1024px) { .newsInfo .paging .left a:hover { color: #c01b20; } } .newsInfo .paging .returnList { width: 140px; height: 48px; margin-top: 6px; float: right; display: block; border-radius: 24px; border: 1px solid #666; color: #666; text-align: center; line-height: 48px; font-size: 16px; transition: background .5s,color .5s; } @media (min-width: 1024px) { .newsInfo .paging .returnList:hover { background-color: #c01b20; color: #fff; border: 1px solid #c01b20; } } @media (max-width: 1024px) { .newsInfo .con { width: 100%; margin: 15px auto 0; } .newsInfo .paging .left a { line-height: 24px; } .newsInfo .paging .returnList { width: 120px; height: 32px; line-height: 32px; font-size: 14px; } } .banner { width: 100%; height: auto; overflow: hidden; } @media (max-width: 1024px) { .banner img { width: 180%; margin-left: -40%; } } .hr { padding-top: 2.7%; padding-bottom: 5.2%; } .hr .title { width: 100%; height: auto; text-align: center; } .hr .title .tits { font-size: 18px; line-height: 30px; color: #333; } .hr .title .line { width: 126px; height: 2px; background-color: #252525; position: relative; margin: 14px auto 0; } .hr .title .line span { width: 40px; height: 2px; position: absolute; top: 0; left: 0; background-color: #c01b20; } .hr .con { width: 935px; max-width: 92%; height: auto; margin: 30px auto 0; font-size: 14px; line-height: 28px; color: #666; text-align: center; } .hr .more { width: 168px; height: 44px; border-radius: 16px; background-color: #c01b20; display: none; margin: 55px auto 0; text-align: center; color: #fff; font-size: 12px; line-height: 44px; } .hr .more span { display: inline-block; padding-right: 70px; background-position: right center; background-repeat: no-repeat; background-image: url("../img/icon1.png"); transition: padding .5s; } @media (min-width: 1024px) { .hr .more:hover span { padding-right: 80px; } } @media (max-width: 560px) { .hr .con { max-width: 100%;text-align:left; margin: 15px auto 0; } .hr .title .line { margin-top: 5px; } .hr .more { width: 130px; height: 32px; line-height: 32px; margin: 25px auto 0; } .hr .more span { padding-right: 50px; } } .contact { width: 100%; height: auto; } .contact .box { background-color: #fff; overflow: hidden; } .contact .box .map { width: 100%; height: 660px; } .contact .box .box-new { margin: 70px auto 0; padding-bottom: 94px; } .contact .box .box-new .item1 { width: calc(35.7% - 38px); padding-left: 38px; float: left; margin-left: 8%; margin-right: 8%; font-size: 18px; line-height: 26px; background-position: left top; background-image: url("../img/contact_icon1.png"); background-repeat: no-repeat; color: #333; } .contact .box .box-new .item1 span { width: 92px; display: block; float: left; } .contact .box .box-new .item1 i { width: calc(100% - 92px); float: left; display: block; font-size: 14px; } .contact .box .box-new .item2 { width: calc(24.1% - 38px); padding-left: 38px; float: left; font-size: 18px; line-height: 26px; background-position: left 3px; background-image: url("../img/contact_icon2.png"); background-repeat: no-repeat; color: #333; } .contact .box .box-new .item2 i { font-size: 14px; } .contact .box .box-new .item2.it { background-position: left 4px; background-image: url("../img/contact_icon3.png"); } @media (max-width: 1250px) { .contact .box .box-new { margin: 30px auto 0; padding-bottom: 40px; } .contact .box .box-new .item1 { width: calc(90% - 38px); margin-left: 0; margin-bottom: 20px; } } @media (max-width: 980px) { .contact .box .box-new { margin: 25px auto 0; } .contact .box .box-new .item1 { margin-left: 5%; margin-right: 5%; margin-bottom: 10px; padding-left: 30px; width: calc(90% - 30px); background-size: 18px auto; line-height: 20px; } .contact .box .box-new .item2 { width: calc(90% - 30px); margin-left: 5%; margin-bottom: 10px; padding-left: 30px; background-size: 18px auto; line-height: 20px; } .contact .box .box-new .item1 { font-size: 16px; } .contact .box .box-new .item1 span { width: 80px; } .contact .box .box-new .item2 { font-size: 16px; } .contact .box .box-new .item2 span { width: 80px; } .contact .box { height: auto; padding-bottom: 15px; } } .amap-logo, .amap-copyright { display: none !important; } .aboutBnner { width: 100%; height: auto; position: relative; overflow: hidden; } .aboutBnner .videBox { width: 100%; height: 100%; position: absolute; top: 0%; left: 0%; z-index: 2; } .aboutBnner .videBox .video { width: 100%; height: 100%; } .aboutBnner .con { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0, 29, 45, 0.4); z-index: 5; } .aboutBnner .con .tits { font-size: 50px; text-align: center; line-height: 50px; color: #fff; position: absolute; top: 31%; width: 100%; } .aboutBnner .con .icon { width: 69px; height: 69px; position: absolute; bottom: 17%; left: 50%; display: none; margin-left: -35px; cursor: pointer; } .aboutBnner .con .icon img { width: 100%; margin-left: 0; } .aboutBnner:hover .con .icon{ display: block; } .aboutBnner.bM { display: none; } @media (max-width: 1366px) { .aboutBnner .con .tits { font-size: 30px; line-height: 30px; } } @media (max-width: 1024px) { .aboutBnner { display: none; } .aboutBnner.bM { display: block; } .aboutBnner img { width: 160%; margin-left: -30%; } .aboutBnner .con .tits { font-size: 20px; line-height: 20px; top: 14%; } .aboutBnner .con .icon { width: 46px; height: 46px; } } .about .box1 { background-color: #f8f8f8; padding-top: 2.8%; padding-bottom: 5%; } .about .box1 .title { width: 100%; height: auto; text-align: center; } .about .box1 .title .tits { font-size: 18px; line-height: 30px; color: #333; } .about .box1 .title .line { width: 126px; height: 2px; background-color: #252525; position: relative; margin: 14px auto 0; } .about .box1 .title .line span { width: 40px; height: 2px; position: absolute; top: 0; left: 0; background-color: #c01b20; } .about .box1 .con { text-indent: 2em; font-size: 14px; line-height: 28px; height: 168px; overflow: hidden; color: #666; margin-top: 22px; } .about .box1 .con.on{ height: auto; } .about .box1 .moreClick{ width: 140px; height: 40px; border-radius: 16px; background-color: #c01b20; display: block; margin: 35px auto 0; text-align: center; color: #fff; font-size: 12px; line-height: 40px; } .about .box2 { padding-top: 6.4%; padding-bottom: 10.3%; background-position: center 80px; background-repeat: no-repeat; background-size: auto 100%; } .about .box2 .tits { text-align: center; } .about .box2 .tits .t { font-size: 18px; line-height: 24px; color: #333; } .about .box2 .tits .t1 { font-size: 14px; line-height: 24px; color: #666; margin-top: 9px; } .about .box2 .conBox { width: 100%; height: 200px; text-align: justify; text-align-last: justify; background-color: rgba(255, 255, 255, 0.5); margin-top: 20%; } .about .box2 .conBox .item { width: auto; display: inline-block; text-align: center; text-align-last: center; padding-top: 53px; } .about .box2 .conBox .item .num { font-size: 80px; line-height: 60px; font-weight: bold; color: #333; font-family: Arila; } .about .box2 .conBox .item .num span { font-size: 20px; font-weight: normal; } .about .box2 .conBox .item .t { font-size: 12px; line-height: 12px; color: #666; margin-top: -5px; } @media (max-width: 1024px) { .about .box2 .conBox .item .num { font-size: 46px; line-height: 36px; } .about .box2 .conBox .item .num span { font-size: 16px; } .about .box2 .conBox .item .t { margin-top: 0px; } } @media (max-width: 640px) { .about .box2 .conBox { height: 110px; } .about .box2 .conBox .item { padding-top: 30px; } .about .box2 .conBox .item .num { font-size: 24px; line-height: 22px; } .about .box2 .conBox .item .num span { font-size: 12px; } .about .box2 .conBox .item .t { margin-top: 10px; } } @media (max-width: 560px) { .about .box1 .title .line { margin-top: 5px; } .about .box2 { background-size: auto 115%; background-position: center 15px; } } .culture { padding-top: 60px; padding-bottom: 20px; } .culture .item { width: 33.3333333333%; height: auto; text-align: center; float: left; margin-bottom: 70px; } .culture .item .icon { width: 100%; height: 52px; background-position: center; background-repeat: no-repeat; } .culture .item .tits { font-size: 18px; line-height: 18px; color: #333; margin-top: 15px; } .culture .item .tit { font-size: 14px; line-height: 24px; height: 48px; color: #666; max-width: 90%; margin: 13px auto 0; } @media (max-width: 780px) { .culture .item { margin-bottom: 45px; } } @media (max-width: 660px) { .culture .item { width: 50%; } } .honor { width: 100%; height: auto; background-color: #f5f5f5; padding-top: 3.2%; } .honor .title { width: 100%; height: auto; text-align: center; } .honor .title .tits { font-size: 18px; line-height: 30px; color: #333; } .honor .title .line { width: 126px; height: 2px; background-color: #252525; position: relative; margin: 14px auto 0; } .honor .title .line span { width: 40px; height: 2px; position: absolute; top: 0; left: 0; background-color: #c01b20; } .honor .box1 { position: relative; margin-bottom: 60px; margin-top: 40px; } .honor .box1 .list { width: 100%; height: auto; } .honor .box1 .list ul { width: 100%; height: auto; } .honor .box1 .list ul li { width: 31.2%; height: auto; margin-right: 3.2%; float: left; margin-bottom: 3.2%; } .honor .box1 .list ul li .pic { width: 100%; height: 272px; background-color: #fff; position: relative; } .honor .box1 .list ul li .pic img { max-width: 90%; max-height: 90%; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; } .honor .box1 .list ul li p { text-align: center; font-size: 18px; line-height: 18px; color: #333; font-family: Arial; margin-top: 21px; } .honor .box1 .list ul li:nth-child(3n) { margin-right: 0; } .honor .box1 .a { width: 48px; height: 30px; position: absolute; top: 50%; margin-top: -15px; background-image: url("../img/icon3.png"); background-position: center; background-repeat: no-repeat; z-index: 5; } .honor .box1 .a.prev { left: -90px; transform: rotate(-180deg); } .honor .box1 .a.next { right: -90px; } .honor .box2 { width: 100%; height: auto; background-color: #f9f9f9; padding-top: 60px; padding-bottom: 100px; } .honor .box2 .list { width: 100%; height: auto; position: relative; } .honor .box2 .list .list-new { width: 100%; height: auto; } .honor .box2 .list .list-new ul li { width: 31.2%; height: auto; margin-right: 3.2%; margin-bottom: 3.2%; float: left; } .honor .box2 .list .list-new ul li .pic { width: 100%; height: 410px; background-color: #fff; position: relative; } .honor .box2 .list .list-new ul li .pic img { max-width: 92%; max-height: 92%; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; } .honor .box2 .list .list-new ul li p { text-align: center; font-size: 18px; line-height: 18px; color: #333; margin-top: 20px; } .honor .box2 .list .list-new ul li:nth-child(3n) { margin-right: 0; } .honor .box2 .list .a { width: 48px; height: 30px; position: absolute; top: 50%; margin-top: -15px; background-image: url("../img/icon3.png"); background-position: center; background-repeat: no-repeat; z-index: 5; } .honor .box2 .list .a.prev { left: -90px; transform: rotate(-180deg); } .honor .box2 .list .a.next { right: -90px; } @media (max-width: 1400px) { .honor .box1 .a.prev { left: -40px; } .honor .box1 .a.next { right: -40px; } .honor .box2 .list .a.prev { left: -40px; } .honor .box2 .list .a.next { right: -40px; } } @media (max-width: 1300px) { .honor .box2 .list .list-new ul li p { font-size: 15px; line-height: 15px; } .honor .box1 .list ul li p { font-size: 15px; line-height: 15px; } } @media (max-width: 1100px) { .honor .box1 .list ul li .pic { height: 205px; } .honor .box2 .list .list-new ul li .pic { height: 320px; } .honor .title { font-size: 22px; line-height: 22px; } .honor .box2 { padding-top: 40px; padding-bottom: 60px; } } @media (max-width: 1050px) { .honor .box2 .list .list-new ul li { width: 48.5%; margin-right: 3%; margin-bottom: 3%; } .honor .box2 .list .list-new ul li:nth-child(3n) { margin-right: 3%; } .honor .box2 .list .list-new ul li:nth-child(2n) { margin-right: 0; } .honor .box1 .list ul li { width: 48.5%; margin-right: 3%; margin-bottom: 3%; } .honor .box1 .list ul li:nth-child(3n) { margin-right: 3%; } .honor .box1 .list ul li:nth-child(2n) { margin-right: 0; } } @media (max-width: 830px) { .honor .box1 .list ul li .pic { height: 205px; } .honor .box2 .list .list-new ul li .pic { height: 250px; } .honor .box1 .a.prev { left: -15px; } .honor .box1 .a.next { right: -15px; } .honor .box2 .list .a.prev { left: -15px; } .honor .box2 .list .a.next { right: -15px; } } @media (max-width: 500px) { .honor .box1 .list ul li .pic { height: 135px; } .honor .box2 .list .list-new ul li .pic { height: 205px; } .honor .box1 .list ul li p { margin-top: 10px; font-size: 16px; line-height: 16px; } .honor .box1 .list ul li p { font-size: 14px; line-height: 18px; height: 36px; margin: 10px auto 0; max-width: 90%; } .honor .box2 .list .list-new ul li p { margin-top: 10px; font-size: 14px; line-height: 18px; height: 36px; margin: 10px auto 0; max-width: 90%; } .honor .honor .box1 { margin-bottom: 25px; } .honor .box2 { padding-top: 20px; padding-bottom: 30px; } .honor .title .line { margin: 5px auto 0; } .honor .box1 { margin-top: 25px; margin-bottom: 15px; } } .history { padding-top: 3.2%; padding-bottom: 2.5%; } .history .title { width: 100%; height: auto; text-align: center; } .history .title .tits { font-size: 18px; line-height: 30px; color: #333; } .history .title .line { width: 126px; height: 2px; background-color: #252525; position: relative; margin: 14px auto 0; } .history .title .line span { width: 40px; height: 2px; position: absolute; top: 0; left: 0; background-color: #c01b20; } .history .list { width: 100%; height: auto; margin-top: 40px; } .history .list ul { width: 100%; height: auto; } .history .list ul li { width: 31.7%; height: auto; float: left; margin-right: 2.45%; margin-bottom: 24px; } .history .list ul li .pic { width: 100%; height: auto; overflow: hidden; border-radius: 10px; } .history .list ul li .tits { width: calc(100% - 20px); padding: 0 10px; margin-top: 10px; font-size: 14px; line-height: 28px; height: 84px; } .history .list ul li:nth-child(3n) { margin-right: 0%; } @media (max-width: 860px) { .history .list ul li { width: 48%; margin-right: 4%; margin-bottom: 25px; } .history .list ul li:nth-child(3n) { margin-right: 4%; } .history .list ul li:nth-child(2n) { margin-right: 0; } } @media (max-width: 560px) { .history .list { margin-top: 25px; } .history .list ul li { width: 100%; margin-right: 0 !important; } .history .list ul li .tits { height: auto; } .history .title .line { margin-top: 5px; } } .page { width: 100%; text-align: center; font-size: 0; } .page a { width: 40px; height: 40px; background-color: #f5f5f5; text-align: center; font-size: 16px; line-height: 40px; color: #303233; display: inline-block; margin: 0 10px; } .page a.current { background-color: #c01b20; color: #fff; } @media (min-width: 1024px) { .page a:hover { background-color: #c01b20; color: #fff; } } .vvvv { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 10000; background-color: rgba(0, 0, 0, 0.5); display: none; } .vvvv video { width: 100%; height: 100%; } .click-close { width: 40px; height: 40px; background: #fff url("../img/nav_close_b.png") center no-repeat; position: fixed; top: 0; right: 0; z-index: 20000000; display: none; } @media (max-width: 500px) { .click-close { background-size: 16px auto; } } .anchorBL { display: none !important; } .BMapLabel { background: none !important; border: none !important; font-size: 12px !important; line-height: 14px !important; color: #333 !important; width: 40px !important; left: 50% !important; margin-left: -12px !important; top: -20px !important; text-align: center; } .xyNrInd{margin-top: 40px;} .xyNrInd.w1200{max-width: 1800px;} .xyNrIndNr img{display: block;width: 100%;height: auto;} .xyNrIndNr01{-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;overflow: hidden;} .xyNrIndNr02 h3{font-size: 18px;font-weight: normal;color: #333333;margin-top: 18px;} .xyNrIndNr02 p{width: 40px;margin-top: 21px; height: 2px;position: relative; background-color: #c01b20;} .xyNrIndNr02 p::before{content: '';position: absolute;top: 0;left: 40px;width: 0px;background: #252525;height: 100%;transition:all linear .3s; -webkit-transition:all linear .3s;-moz-transition:all linear .3s;-ms-transition:all linear .3s;-o-transition:all linear .3s;} .xyNrIndNr .swiper-slide:hover .xyNrIndNr02 p::before{width: 86px;} .xyNrIndNr .swiper-slide:hover .xyNrIndNr02 h3{color: #ce0f1d;} .zxIndZx{margin-top: 57px;} .zxIndZxL{width: 48%;} .zxIndZxR{width: 48%;} .zxIndZxLTit{border-bottom: 2px solid #c1151c;padding-bottom: 21px;} .zxIndZxLTit span{font-size: 30px;color: #ce0f1d;} .zxIndZxLTit a{font-size: 14px;color: #ce0f1d;float: right;} .zxIndZxLTit a img{margin: -3px 0 0 6px;} .zxIndZxLNr{-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;overflow: hidden;margin-top: 17px;position: relative;} .zxIndZxLNr .zxIndZxLNrImg{display: block;width: 100%;height: auto;} .zxIndZxLNrPos{position: absolute;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,.7);} .zxIndZxLNrCon{padding: 15px 27px 15px;position: relative;} .zxIndZxLNrCon h3{font-size: 14px;color: #FFFFFF;font-weight: normal;} .zxIndZxLNrCon p{font-size: 12px;color: #999999;} .zxIndZxLNrCon div{position: absolute;top: 50%;right: 27px;margin-top: -10px;} .zxIndZxLNrCon div img{display: block;} .zxIndZxRCon{} .zxIndZxLNrCon h3{margin-right: 80px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .zxIndZxRCon{padding-top: 20px;} .zxIndZxRCon li{position: relative;border-bottom: 1px dashed #E5E5E5;padding: 11px 0;font-weight: normal;color: #333333;font-size: 14px;} .zxIndZxRCon h3 a:hover{color: #ce0f1d;} .zxIndZxRCon li span{position: absolute;top: 50%;right: 0;font-size: 12px;color: #999999;line-height: 30px;margin-top: -15px;} .zxIndZxRCon h3{margin: 0 150px 0 0;line-height: 30px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; font-weight: normal;} .zxIndZxRCon h3 a{color:#333;} .gsNrCon.w1200{max-width: 1800px;margin: 53px auto 35px;} .gsNrConSw .swiper-slide{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 50px 100px 32px 98px;height: 160px;background-repeat: no-repeat;background-position: center center;-webkit-background-size:cover;-moz-background-size:cover;-ms-background-size:cover;-o-background-size:cover;background-size:cover;} .gsNrConSwPos{position: relative;padding: 0 0 0 50px;} .gsNrConSwPos img{position: absolute;top: 3px;left: 0;} .gsNrConSwPos h3{line-height: 100%;font-size: 30px;color: #ce0f1d;font-weight: normal;} .gsNrConSwPos p{font-size: 14px;color: #ce0f1d;line-height: 1.7;margin-top: 9px;} @media (max-width: 1800px) { .gsNrConSw .swiper-slide{padding: 50px 60px 32px 50px;} } @media (max-width: 1500px) { .gsNrConSw .swiper-slide{padding: 38px 30px 32px 20px;} } @media (max-width: 1050px) { .gsNrConSw .swiper-slide{padding: 20px 20px 0 15px;} .zxIndZxL{width: 100%;} .zxIndZxR{width: 100%;margin-top: 28px;} .zxIndZx{margin-top: 20px;} .zxIndZxLTit span{font-size: 16px;} .zxIndZxLTit{padding-bottom: 11px;} .zxIndZxLNrCon{padding: 15px 15px 15px;} .zxIndZxLNrCon div{right: 15px;} .zxIndZxLNrCon h3{margin-right: 55px;} .zxIndZxRCon {padding-top: 5px;} .gsNrConSwPos h3{font-size: 20px;} .gsNrConSwPos {padding: 0 0 0 40px;} } @media (max-width: 770px) { .gsNrConSw .swiper-wrapper{display: block;} .gsNrConSw .swiper-slide{height: auto;padding: 20px 20px 20px 15px;} .gsNrConSwPos h3{font-size: 16px;} .gsNrConSwPos img{top: 0px;} .gsNrCon.w1200{margin: 20px auto 20px;} } @media (max-width: 600px) { .xyNrIndNr02 h3{font-size: 16px; margin-top: 10px;} .xyNrInd{margin-top: 20px;} .xyNrIndNr02 p{margin-top: 13px;} .index .index-product{margin-top: 20px;} .contact .box .map{height: 360px;} } /*# sourceMappingURL=style.css.map */