@charset "utf-8"; @font-face { font-family: 'HeldFTVBlack'; src: url('../fonts/HeldFTVBlack.eot'); src: url('../fonts/HeldFTVBlack.ttf') format('truetype'), url('../fonts/HeldFTVBlack.svg') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Helvetica-Roman-SemiB'; src: url('../fonts/Helvetica-Roman-SemiB.eot'); src: url('../fonts/Helvetica-Roman-SemiB.woff') format('woff'), url('../fonts/Helvetica-Roman-SemiB.ttf') format('truetype'), url('../fonts/Helvetica-Roman-SemiB.svg') format('svg'); font-weight: normal; font-style: normal; } html { font-size: 62.5%; } @media only screen and (min-width: 481px){ html { font-size: 94%!important; } } @media only screen and (min-width: 561px){ html { font-size: 109%!important; } } @media only screen and (min-width: 641px){ html { font-size: 125%!important; } } @media only screen and (min-width: 768px){ html { font-size: 150% !important; } } @media only screen and (min-width: 992px){ html { font-size: 170% !important; } } @media only screen and (min-width: 1200px){ html { font-size: 187.5% !important; } } body{ position: relative; height: 100%; min-width: 320px; color: #000; font-family: "Microsoft Yahei"; font-size:14px; line-height: 1.8em; } .clearfix:before, .clearfix:after { content:""; display:table; } .clearfix:after { clear:both;} /* For IE 6/7 (trigger hasLayout) */ .clearfix { zoom:1; } a:hover{ text-decoration: none; color: #0290DD; } img{ max-width: 100%; vertical-align: middle; } p{ margin-bottom: 0px; } .container-fluid{ max-width: 1300px; } /*底部*/ /*suspension*/ .suspension{ position: fixed; right: 0px; top: 55%; z-index: 999; } .suspension li{ position: relative; width: 48px; height: 48px; margin-bottom: 5px; cursor: pointer; } .suspension li span{ display: block; width: 100%; height: 100%; background-color: #B7B7B7; background-position: center center; background-repeat: no-repeat; } .suspension li span:hover{ background-color: #CC181D; } .suspension-qq{ display:none; } .pop-qq{ background-image: url(../images/qq.png); } .pop-email{ background-image: url(../images/email.png); } .pop-tel{ background-image: url(../images/tel.png); } .pop-code{ background-image: url(../images/code-icon.png); } .pop-top{ background-image: url(../images/top.png); } .suspension-qq .pop-detail>div{ margin-bottom: 10px; } .pop-detail{ position: absolute; width: 250px; top: 0px; right: 67px; border: 1px solid #ddd; background: #fff; z-index: 30; padding: 15px 18px; color: #3d3d3d; font-size: 13px; box-shadow: 0px 1px 1px rgba(165,165,165,0.35),-1px 0px 1px rgba(165,165,165,0.35); min-height: 48px; display: none; } .pop-detail a{ display: inline-block; vertical-align: middle; border:1px solid #CC181D; padding: 5px 10px; border-radius: 2px; color: #CC181D; margin-left: 10px; } .tel-corner-back{ border: 11px solid transparent; border-left: 11px solid #ddd; position: absolute; right: -22px; top: 13px; z-index: -1; } .tel-corner { border: 10px solid transparent; border-left: 10px solid #fff; position: absolute; right: -19px; top: 14px; z-index: 10; } .pop-code-pic{ width: 139px; } .pop-code-pic img{ width: 100px; height: 100px; border:1px solid #ddd; } .pop-code-pic p{ font-size: 12px; margin-bottom: 0px; line-height: normal; text-align: center; margin-top: 5px; } #top{ width: 36px; height: 36px; border-radius: 100%; background: #989898; position: fixed; right: 2%; bottom: 30%; text-align: center; color: #fff; line-height: 36px; cursor: pointer; z-index: 99; } .lfooter{ width: 100%; background-color: #000; position: fixed; bottom: 0px; left: 0px; z-index: 99; } .lfooter ul li { width: 33.333%; height: auto; float: left; text-align: center; padding: 8px 0px; } .lfooter ul li a { color: #FFF; line-height: 12px; font-size: 12px; } .swiper-container1 .swiper-button-next{ background-image: url("../images/bright.png"); right: 15px; top: 40%; background-size: cover; width: 36px; height: 55px; } .swiper-container1 .swiper-button-prev{ background-image: url("../images/bleft.png"); left: 15px; top: 40%; background-size: cover; width: 36px; height: 55px; } /*header*/ .header{ text-align: center; position: relative; padding: 12px 0; /*background: #000;*/ background-image: linear-gradient( to top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 40%, rgba(0,0,0,0.9) 100%); position: fixed; left: 0px; top: 0; width: 100%; z-index: 999; } .header .container-fluid{ max-width: 1780px; } .header .company-logo img{ max-width: 132px; } .header .company-logo span{ color: #fff; text-align: left; display: inline-block; /*margin-left: 1rem;*/ padding-top: 0.1rem; } .header .company-logo b{ font-size: 18px; } .nav{ margin-top: 0.4rem; display: inline-block; } .nav li{ display: inline-block; } .nav li a{ color: #fff; font-size: 17px; padding: 10px 0.4rem; background: none; } .nav li:hover a,.nav li.on a{ color: #CC181D; background: none; font-weight: 600; } .menu-btn{ float: right; cursor: pointer; margin-top: 1.3rem; display: none; } .menu-btn span{ display: block; height: 3px; width: 28px; border-radius: 2px; background: #fff; margin:6px 0; } .language_box{ border:1px solid #fff; border-radius: 20px; padding: 6px 15px; display: inline-block; color: #fff; position: relative; } .language_box img{ display: inline-block; margin-right: 10px; vertical-align:middle; } .language_box i{ display: inline-block; margin-left: 5px; vertical-align:middle; } .language_menu{ position: absolute; left: 0px; top:100%; width: 100%; background: #fff; padding: 7px 0; display: none; } .language_menu a{ display: block; padding: 0 10px; line-height:28px; color: #000; text-align: left; } .language_menu a img{ width: 20px; } .language_box:hover .language_menu{ display: block; } .phone{ float: right; color: #fff; text-align: left; background:url(../images/phone.png) left center no-repeat; padding-left: 42px; line-height: 1.6em; margin-top: 0.4rem; font-size:16px; } .phone div:last-child{ font-weight: 600; /*font-size: 25px;*/ color:#CC181D; } .swiper-container1 .swiper-slide img{ width:100%; max-height:920px; } .banner-video{ /*background: rgba(0,0,0,0.3);*/ padding: 20px 0 10px 0; margin-top: -2rem; z-index: 2; position: relative; } @keyframes myfirst{ 0%{background:#de2518;width:0%} to{background:#de2518;width:70%} } .banner-video-list li{ transition: All 0.4s ease-in-out; cursor: pointer; } .banner-video-list li h3{ position: relative; /*color: #fff;*/ margin-top: 0; } .banner-video-list li h3 em{ height: 2px; width: 70%; background: #000; display: block; left: 30%; top: 50%; position: absolute; -webkit-transform:translateY(-75%); -moz-transform:translateY(-75%); -o-transform:translateY(-75%); -ms-transform:translateY(-75%); transform:translateY(-75%); transition: all 0.4s ease 0s; } .banner-video-list li h3:after{ content: ""; height: 2px; width: 0; background:#CC181D; display: block; left: 30%; top: 50%; position: absolute; -webkit-transform:translateY(-75%); -moz-transform:translateY(-75%); -o-transform:translateY(-75%); -ms-transform:translateY(-75%); transform:translateY(-75%); } .banner-video-list li:hover h3:after{ animation:myfirst 1.5s linear; } .banner-video-list li:hover h3 em{ background: rgba(165,16,15,0.9); } .banner-video-list li:hover h3{ color: #CC181D; } .banner-video-list li:hover>div{ border:1px solid #CC181D; } .banner-video-list li>div:before{ content: ""; display: block; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(0,0,0,0.25); } .banner-video-list li>div:after{ content: ""; display: block; background: url(../images/paly.png) center center no-repeat; height: 40px; width: 40px; background-size: cover; position: absolute; left: 50%; top: 50%; -webkit-transform:translateX(-50%)translateY(-75%); -moz-transform:translateX(-50%)translateY(-75%); -o-transform:translateX(-50%)translateY(-75%); -ms-transform:translateX(-50%)translateY(-75%); transform:translateX(-50%)translateY(-75%); } .banner-video-list li>div{ width: 100%; position: relative; background-size: cover !important; } .banner-video-list li h2{ position: absolute; bottom: 0px; left: 0; width: 100%; line-height: 30px; text-align: center; background: rgba(0,0,0,0.5); color: #fff; font-size: 16px; font-family: 'HeldFTVBlack'; font-weight: 600; text-shadow: 0px 0px 5px #ddd; margin: 0; } .video-layer-box{ position:fixed; width: 100%; height: 100%; left: 0px; top: 0px; z-index: 9999; background: rgba(0,0,0,0.7); display: none; } .video-layer{ background: #000; padding: 33px; border-radius: 10px; border:1px solid #fff; position: absolute; width: 90%; max-width: 860px; left: 50%; top: 50%; -webkit-transform:translateX(-50%)translateY(-50%); -moz-transform:translateX(-50%)translateY(-50%); -o-transform:translateX(-50%)translateY(-50%); -ms-transform:translateX(-50%)translateY(-50%); transform:translateX(-50%)translateY(-50%); } #videoQThome{ width: 100%; height: 100%; max-height: 500px; object-fit: contain; } .video-layer .closeQT { width: 30px; height: 30px; cursor: pointer; border-radius: 50%; border: 1px solid #fff; color: #fff; font-size: 26px; line-height: 26px; text-align: center; position: absolute; right: -20px; top: -30px; } .id-title{ text-align: center; margin-bottom: 30px; font-weight: 600; } .id-title h2{ margin-bottom: 10px; margin-top: 0; font-weight: 600; } .id-title em{ width: 65px; height: 3px; background: #CC181D; display: block; margin: 0 auto; } .id-title p{ color: #9fa5aa; margin-top: 8px; text-transform: uppercase; font-size: 18px; } .text-right{ text-align: right; } .id-item{ padding: 2rem 0; } .services-list{ margin-top: 1rem; } .services-list li{ width: 130px; /*height: 550px;*/ float: left; box-shadow: 1px 1px 5px #ddd; height: 348px; } .services-list li>a{ height: 100%; width: 100%; position: relative; display: block; background-size:cover !important; } .services-list li>a:before{ content: ""; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background: rgba(0,0,0,0.5); } .services-list li .text1 em{ writing-mode:tb-rl; -webkit-writing-mode:vertical-rl; display: inline-block; margin-bottom: 3rem; min-height:130px; text-align: left; letter-spacing: 3px; } .services-list li .text1 { text-align: center; font-size: 22px; color: #fff; position: relative; left: 50%; top: 50%; -webkit-transform:translateX(-50%)translateY(-50%); -moz-transform:translateX(-50%)translateY(-50%); -o-transform:translateX(-50%)translateY(-50%); -ms-transform:translateX(-50%)translateY(-50%); transform:translateX(-50%)translateY(-50%); } .services-list li.on{ width: 620px; } .services-list li.on>a:before{ background: rgba(0,0,0,0.1); } .services-list li .text2{ color: #fff; position: relative; width: 100%; height: 100%; display: none; } .services-list li .text2 em{ float: right; font-size: 48px; font-weight: 600; margin-right: 1.5rem; margin-top: 2rem; font-family: 'Helvetica-Roman-SemiB'; color: #CC181D; } .services-list li .text2>div{ position: absolute; bottom: 0px; left: 0px; padding-left: 1.5rem; padding-bottom: 1.5rem; font-size: 16px; text-shadow: 0px 0px 5px #000; } .id-item0 .qlserviceList1{ position: relative; z-index: 1; background: rgba(26,26,26,0.7); } .qlserviceList1,.qlserviceList2{ clear: both; } .qlserviceList1 a,.qlserviceList2 a{ display: block; color: #fff; } .qlserviceList1Mode1{ color: #fff; text-align: center; padding: 23px 0; font-size: 20px; cursor: pointer; } .qlserviceList3 .row{ margin-right: -8px; margin-left: -8px; } .qlserviceList2 { position: absolute; bottom: 100%; left: 0; width: 215px; background: #fff; color: #8a8a8a; display: none; } .serviceList1,.serviceList2{ clear: both; } .serviceList1 a,.serviceList2 a{ display: block; color: #fff; } .serviceList1Mode1{ background: #000; float: left; width: 16.666%; color: #fff; text-align: center; padding: 15px 0; font-size: 20px; border-left: 1px solid #625b5b; cursor: pointer; text-transform: capitalize; } .serviceList1Mode1.on,.serviceList1Mode1:hover{ background: #CC181D; } .serviceList2{ background: #494351; } .serviceList2Mode1{ display: inline-block; width: 24%; color: #fff; text-align: center; padding: 9px 0; cursor: pointer; font-size: 17px; text-transform: capitalize; } .serviceList2Mode1.on,.serviceList2Mode1:hover{ color: #CC181D; text-shadow: 0px 0px 3px #000; } .serviceList2Mode1.on a,.serviceList2Mode1:hover a{ color: #CC181D; } .id-item0 .qlserviceList-wrapper-box:hover .qlserviceList2{ display: block; } .qlserviceList2Mode1{ text-align: center; padding: 9px 0; cursor: pointer; font-size: 17px; } .qlserviceList2Mode1.on,.qlserviceList2Mode1:hover{ color: #CC181D; font-weight: 600; text-shadow: 0px 0px 3px #fff; } .qlserviceList2Mode1.on a,.qlserviceList2Mode1:hover a{ color: #CC181D; } #service1,#service2{ margin-bottom: 16px; background-size: cover !important; border: 1px solid #ddd; } #service3,#service6{ width: 100%; margin-bottom: 16px; background-size: cover !important; border: 1px solid #ddd; } #service5,#service4{ margin-bottom: 16px; background-size: cover !important; border: 1px solid #ddd; } #service1 { height: 262px; } #service2 { height: 244px; } #service3 { height: 180px; } #service4 { height: 326px; } #service5 { height: 314px; } #service6 { height: 192px; } .qlserviceList3 .col-xs-12 { padding-left: 8px; padding-right: 8px; } .id-about-videobox{ height: 450px; width: 100%; } .id-about video{ width: 100%; height: 100%; border:1px solid #ddd; display: block; min-height: 150px; max-height:450px; background:#000; display: none; } .id-about-video{ width: 100%; height: 450px; background: url(../images/id-about-pic.jpg) center center no-repeat; position: relative; } .id-about-video:before{ content: ""; display: block; content: ""; display: block; background: url(../images/paly.png) center center no-repeat; height: 60px; width: 60px; background-size: cover; position: absolute; left: 50%; top: 50%; -webkit-transform:translateX(-50%)translateY(-50%); -moz-transform:translateX(-50%)translateY(-50%); -o-transform:translateX(-50%)translateY(-50%); -ms-transform:translateX(-50%)translateY(-50%); transform:translateX(-50%)translateY(-50%); cursor: pointer; } .id-item2{ background:#252525 url(../images/aboutbj.png) center center no-repeat; position: relative; background-size: cover; } .id-item2 .id-title h2{ color: #fff; } .id-about-r{ /*padding:1rem 0; */ } .id-about-r h3{ margin-bottom: 1rem; } .id-about-r p{ font-size: 16px; margin-top: 10px; } /*.id-item2:before{ content: ""; width: 100%; height: 100%; display: block; background: rgba(0,0,0,0.5); position: absolute; left: 0; top: 0; }*/ .more{ width: 130px; height: 40px; border: 1px solid #CC181D; display: block; border-radius: 20px; line-height: 38px; color: #666;padding: 0 15px; margin-top: 1.2rem; font-size: 15px; transition: 0.3s ease all; } .more:after{ content: '+'; width: 26px; height: 26px; display: inline-block; background-image: linear-gradient(131deg,#f51823,#CC181D); border-radius: 50%; font-size: 16px; line-height: 26px; text-align: center; color: #fff; float: right; margin-top: 6px; } .more:hover{ width:160px; color:#CC181D; } .id-about{ color: #fff; margin-top: -2rem; } .id-item3 .eq-list li a>div{ height: 228px; background-size: cover !important; } .id-item3{ padding: 0rem 0 1rem 0; background: #3b3b3b; } .id-item3 .text-right{ margin-top: -1.5rem; position: relative; z-index: 1; } .id-item3 em{ display: inline-block; padding: 10px 1rem; background: #CC181D; color: #fff; font-size: 16px; margin-bottom: 1.5rem; } .eq-list{ margin-top: 1rem; } .eq-list li .pic{ overflow: hidden; height: 200px; background-size: cover !important; } .eq-list li a{ display: block; margin-bottom: 1rem; color: #000; } .eq-list li p{ background: #252525; transition: 0.3s ease all; padding: 10px; text-align: center; line-height: 1.4em; color: #FFF; } .eq-list li .pic div{ width: 100%; transition: 0.3s ease all; height: 240px; background-size:cover !important; } .eq-list li:hover p{ background:#CC181D; color: #fff; } .eq-list li:hover .pic div{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1) ; -ms-transform: scale(1.1); transform: scale(1.1) ; } .youshi{ background: #F3F6F9; padding: 20px 0 0px 0; } .youshi-list li{ margin-bottom: 10px; } .youshi-list li p{ color: #9fa5aa; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .youshi-list li h4{ font-weight: 600; } .youshi-list li img{ margin-right: 15px; } .id-item5{ position: relative; } div.id-item5:before{ content: ""; width: 508px; height: 509px; display: block; background: url(../images/Mask2.png) center center no-repeat; position: absolute; left: 0px; top: 0px; } div.id-item5:after{ content: ""; width: 508px; height: 509px; display: block; background: url(../images/Mask1.png) center center no-repeat; position: absolute; right: 0px; bottom: 0px; } .id-item5 .container-fluid{ position: relative; z-index: 1; } .id-item4{ background: url(../images/liuchengbj.png) center center no-repeat; padding: 3rem 0; } .lc-list{ margin-top: 2rem; } .lc-list li{ color: #fff; text-align: center; } .lc-list li em{ font-weight: 600; display: block; font-size:20px; margin-bottom: 1.5rem; } .lc-list li p{ color: #999; } .lc-list li>div{ position: relative; background: url(../images/Vector.png) left center no-repeat; } .lc-list li:first-child>div{ background: none; } .nb_tab{ float: right; } .news_btl{ margin-top: 1.5rem; margin-bottom: 1rem; } .news_btl span{ display: block; font-size: 16px; margin-top: 5px; color: #999; } .nb_tab a{ display: inline-block; background: #fff; color:#000; box-shadow:0px 0px 20px #eee; border-radius:30px; padding: 8px 1rem; margin-left: 15px; } .nb_tab a.cur{ background:#CC181D; color: #fff; } .nb_tab a:hover{ background: #f90d19; color: #fff; } .id-new-l a{ display: block; background: #fff; color: #000; padding-bottom: 40px; margin-bottom: 20px; box-shadow: 0px 1px 10px #eee; position: relative; } .id-new-l a h1{ padding:10px 15px; white-space: nowrap; text-overflow:ellipsis; overflow: hidden; } .id-new-l a:before{ position: absolute; right: 15px; bottom:15px; width: 32px; height: 32px; content:""; border:1px solid #ddd; background: url(../images/imgs_R.png) center center no-repeat; background-size:35%; border-radius: 100%; } .id-new-l a p{ padding:0 15px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; min-height: 76px; } .id-new-l a img{ width: 100%; } .id-new-l a:hover h4{ color: #CC181D; } .new-list-r a{ font-size: 18px; display: block; margin-bottom: 6px; } .new-list-r .more{ margin-top: 0.5rem; font-size: 14px; } .id-new-l .pic{ height:220px; background-size: cover !important; overflow: hidden; } .id-new-title{ font-size: 18px; margin: 0; } .id-new-l .pic img{ display:none; } .new-list-r p{ min-height: 50px; } .id-new-list li{ box-shadow: 0px 1px 10px #eee; } .id-new-list li p{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: #999; } .id-new-list li,.new-list-r{ background: #fff; padding:25px 15px 25px 3rem; margin-bottom: 20px; position: relative; } .id-new-list li .date,.new-list-r .date{ display: inline-block; position: absolute; left: 15px; top: 50%; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); } .id-new-list li a,.new-list-r a{ color: #000; display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 16px; font-weight: 600; } .new-list-r a h1{ font-size: 18px; font-weight: 600; } .id-new-list li:hover,.id-new-l a:hover,.new-list li:hover{ box-shadow: 1px 1px 10px #ddd; } .date{ font-size: 36px; font-weight: bold; text-align: center; } .id-new-list li:hover .date,.id-new-list li:hover a,.new-list li:hover a{ color: #CC181D; } .date span{ display: block; font-size: 14px; font-weight: 500; margin-top: 5px; } .id-new-list li:hover span{ color: #000; } .partner-list{ padding: 0.5rem 0; } .partner-list li>div{ overflow: hidden; border:1px solid #ddd; text-align: center; margin-bottom: 20px; border-radius: 3px; background: #fff; } .partner-list li img{ height: 70px; transition: All 0.4s ease-in-out; } .partner-list li:hover img{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1) ; -ms-transform: scale(1.1); transform: scale(1.1) ; } .footer-top{ padding: 2rem 0; background: url(../images/footerbj.jpg) left center no-repeat; color: #fff; } /*.foot-list{*/ /* max-width: 380px;*/ /*}*/ .foot-list h4{ color: #fff; position: relative; padding-bottom: 20px; margin-bottom: 1rem; } .foot-list h4:before{ position: absolute; left: 0px; bottom: 0px; background: #fff; width: 30px; height: 2px; content: ""; display: block; } .foot-list a,.foot-list p{ color: #fff; display: block; margin-bottom: 15px; } .foot-list1 a{ display: inline-block; border: 1px solid #fff; padding: 5px 0; width: auto; margin-right: 5px; width: 168px; text-align: center; margin-bottom: 10px; } .foot-list a:hover{ color: #CC181D; } .foot-list1 a:hover{ color: #fff; background: #CC181D; } .foot-list p i{ display: inline-block; margin-right:10px; font-size: 16px; vertical-align: middle; } .online-btn{ display: inline-block; background:#CC181D; color: #fff; padding: 10px 1rem; border-radius: 3px; font-size: 16px; margin-top: 1.5rem; } .online-btn:hover{ color: #fff; background: #f90d19; } .online-btn i{ display: inline-block; margin-right: 10px; } .footer-bottom{ text-align: center; padding: 15px; } .keywords{ border-top: 1px solid rgba(255,255,255,0.1); color: rgba(255,255,255,0.5); padding-top: 15px; margin-top: 1rem; } .bar{ text-align: center; color: #fff; margin-top: 2rem; } .bar span{ display: inline-block; padding: 12px 2.5rem; font-size: 16px; } .bar span:first-child{ padding-left: 0px; } .bar span:last-child{ padding-right: 0px; } .bar span i{ font-style: normal; width: 25px; height: 25px; border-radius: 100%; color: #fff; background: #CC181D; text-align: center; line-height: 25px; font-size: 14px; display: inline-block; vertical-align: text-top; margin-left: 5px; } .bar span b{ display: block; font-family: 'HeldFTVBlack'; font-size: 30px; margin-bottom: 10px; } .id-item6{ padding:0; background: #3b3b3b; } .id-item6 .text-right{ margin-top: -1.8rem; } .banner{ position: relative; height: 620px; } .banner-info{ padding: 0px 15px; position: absolute; left: 50%; top: 50%; -webkit-transform:translateX(-50%)translateY(-50%); -moz-transform:translateX(-50%)translateY(-50%); -o-transform:translateX(-50%)translateY(-50%); -ms-transform:translateX(-50%)translateY(-50%); transform:translateX(-50%)translateY(-50%); max-width: 1300px; width: 100%; color: #fff; text-align: left; } .banner-info h1{ margin-bottom:5px; margin-top: 0px; font-weight: 600; } .banner-info p{ font-size: 16px; color: #fff; max-width: 580px; } .banner-info .banner-content{ text-align:justify; font-size: 14px; } .banner-text{ margin-top: 2rem; } .banner-info em{ width: 60px; height:3px; background:#CC181D; display: block; margin: 15px 0 10px 0; } .main{ padding: 1rem 0; } .web-nav{ border-radius: 3px; margin: 15px 0; } .web-nav em{ display: inline-block; margin-right: 10px; color: #CC181D; } .web-nav a{ color: #999; } .web-nav a:last-of-type{ color: #000; } .nav-type{ text-align: center; margin: 15px 0; background: #ffffff; padding: 10px; } .nav-type a{ display: inline-block; padding:8px 0.6rem; background: #fff; border-radius: 5px; color: #000; font-size: 16px; margin: 0px 0.3rem; } .nav-type a:hover,.nav-type a.on{ background:#CC181D; color: #fff; border-radius: 25px; } .about video{ width: 100%; border:1px solid #ddd; max-height: 506px; background:#000; } .text-info{ padding-top: 2rem; } .sevice-video-box{ width: 900px; margin:0 auto; position: relative; height:506px; } .sevice-video{ width: 100%; height:506px; border:1px solid #ddd; display: none; z-index: 1; position: relative; } .sevice-pic-box{ background: #fff; padding: 20px 2rem; position: relative; margin: 1rem 0; } .big-sevice-pic{ position: relative; border:1px solid #ddd; overflow: hidden; background: #fff; } .sevice-pic li{ cursor: pointer; border:1px solid #eee; overflow: hidden; text-align: center; } .sevice-pic li img{ height: 145px; } .sevice-pic li.on,.sevice-pic li:hover{ border:1px solid #CC181D; } .big-sevice-pic,.big-sevice-pic img{ text-align:center; height:506px; cursor: pointer; } .sv-btn{ display: block; width: 60px; height: 60px; background: url(../images/bfxx1.png) center center no-repeat; background-size: contain; position: absolute; right: 25px; bottom: 25px; cursor: pointer; z-index: 1; } /*.wrap{*/ /* padding-top: 1rem;*/ /*}*/ .vision{ padding: 2.5rem 0 2.8rem 0; background: url(../images/about4bj.jpg) center center no-repeat; background-size: cover; } .imgmark{ background: rgb(242,206,59,0.1); width: 100%; color: #fff; position: relative; } .imgmark img{ opacity: 0; } .imgmark p{ position: absolute; width: 80%; top: 50%; left: 50%; -webkit-transform:translateX(-50%)translateY(-50%); -moz-transform:translateX(-50%)translateY(-50%); -o-transform:translateX(-50%)translateY(-50%); -ms-transform:translateX(-50%)translateY(-50%); transform:translateX(-50%)translateY(-50%); } .yuanjing-list{ margin: 0; } .yuanjing-list li{ padding: 0; margin-bottom: 15px; } .yuanjing-list li img{ width: 100%; } .company{ padding-bottom: 2rem; } .history{ padding:2rem 0; background:url(../images/mapbj.png) center top no-repeat; background-size: cover; } .history-list{ background:url(../images/xian.jpg) center top repeat-y; padding-top: 1rem; } .history-list li{ text-align: right; position: relative; } .history-list li h4{ font-weight: 600; font-size: 16px; margin-bottom: 5px; margin-top: 0; } .history-list li p{ color: #717171; line-height: 1.5em; min-height: 60px; } .history-list li em{ width: 10px; height: 10px; display: block; position: absolute; background: #ED1C24; border-radius: 100%; top:4px; right: -5px; } .history-list li:nth-child(2n) em{ bottom:auto; left: auto; top: 4px; left: -5px; } .history-list li:nth-child(2n){ margin-top: 3rem; text-align: left; } .honor-list a{ display: block; padding: 15px; border: 1px solid #ddd; } .honor-list a .pic{ overflow: hidden; } .honor-list a img{ width: 100%; transition: All 0.4s ease-in-out; } .honor-list a:hover img{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1) ; -ms-transform: scale(1.1); transform: scale(1.1) ; } .honor-list li{ margin-bottom: 1rem; } .page{ font-size: 0px; text-align: center; margin-bottom: 2rem; } .page li{ display: inline-block; } .page li a,.page li span{ font-size: 14px; color: #000; display: inline-block; height: 32px; padding: 0px 12px; line-height: 32px; border:1px solid #E2E2E2; margin:5px 3px; background: #fff; border-radius: 2px; } .page li .current,.page li:hover a,.page li.active a{ background: #CA1526; color: #fff; border:1px solid #CA1526; } .page span{ font-size: 14px; } .page-info .id-title{ text-align: center; margin-top: 0px; } .team{ background: #f5f5f5; padding: 2rem 0; } .swiper-container5 .swiper-slide{ overflow: hidden; transition: All 0.4s ease-in-out; } .swiper-container5 .swiper-slide img{ transition: all .4s ease-in-out; width: 100%; } .swiper-container5 .swiper-slide:hover img{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1) ; -ms-transform: scale(1.1); transform: scale(1.1) ; } .team-text{ position: absolute; width: 100%; height: 45px; bottom: 0%; left: 0%; background: rgb(0,0,0,0.8); overflow: hidden; } .swiper-container5 .swiper-slide:hover .team-text{ height: 100%; } .swiper-container5 .swiper-slide:hover .team-text>div{ position: absolute; top: 50%; left: 50%; -webkit-transform:translateX(-50%)translateY(-50%); -moz-transform:translateX(-50%)translateY(-50%); -o-transform:translateX(-50%)translateY(-50%); -ms-transform:translateX(-50%)translateY(-50%); transform:translateX(-50%)translateY(-50%); width: 85%; } .swiper-container5 .phone{ background-color:rgba(255,255,255,1); background-repeat: no-repeat; background-position: center center; width: 50px; height: 50px; border-radius: 100%; border:1px solid #ccc; top: 40%; } .team-text>div{ color: #fff; } .team-text h4{ font-size: 22px; text-align: center; color:#CC181D; margin-bottom: 1rem; text-transform: capitalize; } .team-text h4 span{ font-size: 16px; display: inline-block; margin-left: 15px; color: #a6acbc; } .team-text p{ color: #fff; } .swiper-container5 .left-btn{ background-image: url(../images/imgs_L.png) ; } .swiper-container5 .right-btn{ background-image: url(../images/imgs_R.png); } .sevice{ background: #f5f5f5; } .sevice-info{ background: #fff; padding: 1rem; margin: 1rem 0; } .sevice96 p{ color: #fff !important; } .sevice96 .web-nav a{ color: #fff; } .sevice96 .more{ background: #fff; } .sevice96{ background-color: #ea5f5f; color: #fff; } .sevice98{ background-color:#fdfdd3; } .sevice99{ background-color:#d5e8e8; } .sevice100{ background-color:#dcdcf9; } .sevice101{ background-color:#f3cece; } .sevice103{ background-color:#e8f7da; } .sevice105{ background-color:#f1ccba; } .sevice115{ background-color:#efefdf; } .sevice117{ background-color:#a9b2e3; } .sevice-top h3{ border-bottom: 1px solid #ddd; padding-bottom: 15px; margin-bottom: 15px; } .sevice-top,.product{ margin-top: 1rem; } .sevice-title{ padding-left: 20px; border-left: 10px solid #CC181D; font-weight: 600; margin-top: 0; margin-bottom: 1.5rem; } .new{ background: #f5f5f5; padding: 1rem 0; } .sevice-top-pic{ width: 100%; height: 500px; background-size: cover !important; } .new-l{ background: #fff; padding: 1rem; min-height: 400px; } .new-l>h3{ margin-top: 0; } .new-info-share{ padding-bottom: 12px; border-bottom: 1px dashed #eee; margin-bottom: 15px; } .new-info-share span{ display: inline-block; margin-right: 0.6rem; color: #666; } .new-info-share span img{ margin-right: 5px; } .new-info-share b{ font-size: 15px; } .new-info-share a{ display: inline-block; margin-left: 5px; } .new-info-text p,.new-info-text p span,.new-info-text span{ font-size:18px !important; } .new-info-text img{ max-width:640px !important; } .new-r{ padding: 20px; background: #fff; } .new-list2 li img{ width: 100%; } .new-list2 li a{ display: block; color: #000; margin-bottom: 15px; } .new-list2 li p{ margin-top: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .new-list-r{ position: relative; padding-left: 4rem; margin-bottom: 0; } .new-list li{ background: #fff; } .new-list-pic{ display: block; width:100%; height: 220px; background-size:cover !important; border:1px solid #eee; } .contact-list,.new-list li{ margin-bottom: 1rem; } .contact-list span{ display: inline-block; vertical-align: top; max-width: 90%; margin-left: 5px; } .contact-form{ border:1px solid #ccc; padding: 1.5rem 1rem; } .contact-form input{ border:0; border-bottom: 1px solid #E7E7E7; width: 100%; } .contact-form .row>div{ margin-bottom: 1rem; } .contact-form textarea { border: 0; background: #F6F6F6; width: 100%; height: 200px; padding: 10px; resize: none; } .contact-form input[type=submit]{ width: 130px; height: 40px; text-align: center; line-height: 40px; color: #fff; background: #202226; margin: 15px auto; display: block; } .contact-info{ padding-bottom: 1.5rem; } .contact{ padding: 1rem 0 2rem 0; } .contact .office{ text-align: center; padding-top: 3.5rem; padding-bottom: 3.5rem; } .link{ border-top:1px solid #ddd; padding-top: 15px; } .new-l,.new-r{ margin-bottom: 1rem; } .navListBox{ line-height: 50px; font-size: 16px; color: #333; background-color: #e4e4e6; overflow: hidden; margin:0; text-align:left; position: relative; } /*.navListBox span{*/ /* position: absolute;*/ /* left: 0px;*/ /* top: 0px;*/ /* display: block;*/ /* line-height: 50px;*/ /* background: #B7B7B7;*/ /* padding: 0px 10px;*/ /*}*/ .navListBox a{ display: inline-block; padding: 0 0.4rem; background: none; border-radius: 0; color: #000; font-size: 16px; margin:0; text-align:center; } @media(min-width: 1200px) and (max-width: 1500px){ .navListBox a{ margin-right:0px !important; } } @media(min-width: 1200px) and (max-width: 1400px){ .nav li a{ padding: 10px 0.4rem; } .id-about-r h3{ margin-top: 0; } } @media(max-width: 1300px){ } /*@media(min-width: 1200px){*/ /* .navListBox a{*/ /* margin-right:1.5%;*/ /* }*/ /*} */ @media(max-width: 1200px){ .phone{ display: none; } .nav{ float: right; } } @media(min-width: 992px) and (max-width: 1199px){ .sevice-top-pic{ height: 450px; } } @media(min-width: 992px){ /*.container-fluid{ max-width: 1780px; }*/ .sevice-top .col-lg-6>div,.sevice-info p{ font-size: 16px !important; } body{ min-width: 1500px; } } @media(max-width: 991px){ .menu-btn{ display: block; } .nav{ position: absolute; left: 0; top: 100%; width: 100%; z-index: 999; background: #494351; margin-top: 0px; border-top: 1px solid rgba(255,255,255,0.2); text-align: left; padding: 10px; display: none; } .nav li{ display: block; width: 100%; } .sevice-info table{ width: 100% !important; } } @media(min-width: 768px){ .lfooter,.navListBox span{ display: none; } .services-list li.on .text2{ display: block; } .services-list li.on .text1{ display: none; } .qlserviceList-wrapper { display: flex; position: relative; } .id-item0 .qlserviceList1{ width: 215px; } .qlserviceList1Mode1:not(:first-child) { margin-top: 19px; } .qlserviceList1Mode1.on,.qlserviceList1Mode1:hover{ background: url('../images/qlservice-active.png') center center/cover; } .qlserviceList3 { flex: 1; margin-left: 20px; } .nav-type{ border-radius: 35px; } } @media(max-width: 767px){ .language_box{ padding: 3px 15px; float: left; margin-top:10px; } .banner-info .banner-content{ display: none; } .qlserviceList1Mode1.on,.qlserviceList1Mode1:hover{ background: #CC181D; } .serviceList1Mode1{ font-size:18px; } .header .company-logo span{ font-size: 13px; line-height: 1.6em; display: none; } .qlserviceList1Mode1{ font-size: 18px; float: left; width: 16.666%; background: #494351; } .new-list-r p{ overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; } .sevice-pic li img{ height: 90px; } .sevice-video-box{ width: 100%; height: 400px; background: #000; } .big-sevice-pic, .big-sevice-pic img{ width: auto; height: 400px; } .banner{ height: 320px; } .services-list li{ width: 48% !important; height: 250px; margin-right: 4%; margin-bottom: 15px; } .services-list li:nth-child(2n){ margin-right: 0%; } .banner-video{ margin-top: 0px; background: rgba(0,0,0,1); } .banner video{ height:auto !important; } /* .id-new-l .pic{ height:auto; background:none; }*/ .id-new-l .pic img{ width:100%; display:block; } .footer-top{ display: none; } .header .company-logo img{ width: 9rem !important; } .header .company-logo b{ font-size: 14px; } .header{ position: relative; background: rgba(0,0,0,1); } body{ padding-bottom: 70px; } .footer-bottom{ border-top: 1px solid #eee; background: #CC181D; color: #fff; } .footer-bottom a{ color:#fff; } .id-about video{ min-height: auto; } .suspension{ display: none; } .youshi-list li p{ display: none; } .youshi-list li img{ width:55px; } .bar span{ padding: 12px 1rem; } .id-new-list li,.new-list-r{ padding-left:8.5rem; } .id-about-r .more{ margin:1.2rem auto 0 auto; } .nav-type a{ padding:0.4rem; min-width: 149px; font-size: 14px; margin-bottom: 5px; } .sevice-top-pic{ height: 280px; } .link .row>div{ text-align: left !important; } .banner img{ height: 150px; } .swiper-container1 .swiper-slide img{ height: 260px; /*border: 3px solid #d02a2b;*/ max-width:none; } .id-item5{ background: #f5f5f5 url(../images/newbj.jpg) center -5rem no-repeat; } .sevice-info img{ width: 100% !important; height: auto !important; } .navListBox a{ text-overflow: ellipsis; overflow: hidden; text-overflow: hidden; white-space: nowrap; padding: 0 5px; width: 49%; border: 1px solid #ccc; margin: 0px 0px; font-size: 14px; /*float: left;*/ margin-right: -1px; margin-bottom: -1px; /*min-width: 149px;*/ } .navListBox span{ background: #CC181D; color: #fff; display: block; padding: 5px 15px; margin-bottom: 10px; font-size: 16px; position: relative; } .navListBox span:before{ content:""; display:block; width:0; height:0; border-left:9px solid transparent; border-right:9px solid transparent; border-top:10px solid #CC181D; position: absolute; left: 43px; top: 100%; } /*.navListBox a:nth-child(3n){*/ /* margin-right:0*/ /*}*/ .navListBox b{ display: none; } .navListBox em{ display:none; } .navListBox{ padding: 0px 0 10px 0; line-height: 26px; /*text-align: center;*/ } /*.navListBox a.on{*/ /* font-size: 16px;*/ /*}*/ } @media(min-width: 768px) and (max-width: 992px){ } @media(min-width: 320px) and (max-width: 375px){ .header .company-logo img{ width: 30rem; } } /*微信分享*/