@charset "utf-8"; /* 注意:以下长度用em换算,1em=10px。特别注意文字大小,父子层级会继承,所以不要在div中定义字体大小,只能用span修改字体。 ------------------------------------------------------------------------------------------------------ */ /* 全局样式 -------------------------------------------------------------- */ html,body,a,p,span,ul,img{ padding:0; margin:0; list-style:none; border:none; font-size:14px; font-family:"microsoft yahei","arial"; color:#666;} p{line-height:25px;} img{ border:none; vertical-align:middle;} td{ vertical-align:center; font-size:14px;} *{margin:0;padding:0;} body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td,img{border:medium none;margin:0;padding:0;} body,button,input,select,textarea{outline:none;} .body{background:#fff;} .nbody{background:#efefef;} ul,ol,li{list-style:none;} img{border:0px;} table,table tr,table td{border:solid 1px #777777; } html,body{height:auto;margin:0 auto;} .hide{display:none;} .clear{clear:both;} input,textarea{ font-family:"microsoft yahei","arial"; } h1,h2,h3,h4,h5,h6 { font-weight: bold; } h1 { font-size: 3em; line-height: 1; margin:0; padding:0;} h2 { font-size: 2em; margin:0; padding:0;} h3 { font-size: 1.5em; line-height: 1; margin:0; padding:0;} h4 { font-size: 1.2em; line-height: 1.25; margin:0; padding:0;} h5 { font-size: 1em; margin:0; padding:0;} h6 { font-size: 1em; } body{background:#fff;} /* 页面基本元素 -------------------------------------------------------------- */ /* 链接样式 */ a {text-decoration:none;} a:visited {text-decoration:none;} a:hover {text-decoration:none;} /* 常用元素 */ .clear { clear:both; font-size:1px; line-height:0px; height:0px; } /* 层浮动 */ .left { float: left; } .right{ float: right; } .center { margin: 0 auto; } /* 文字对齐 */ .tleft { text-align:left; } .tright { text-align:right; } .tcenter {text-align:center; } img{ webkit-transition: -webkit-transform .75s cubic-bezier(.19, 1, .22, 1); transition: -webkit-transform .75s cubic-bezier(.19, 1, .22, 1); transition: transform .75s cubic-bezier(.19, 1, .22, 1); transition: transform .75s cubic-bezier(.19, 1, .22, 1), -webkit-transform .75s cubic-bezier(.19, 1, .22, 1); } /* top -------------------------------------------------------------- */ .header{ width:100%; height:78px; position: fixed; z-index: 9999; top:0; background:rgba(39,89,152,0.4); } .logo{ overflow:hidden; } .tel,.tel a{ font-size:26px; color:#fff; font-weight:bold; } .tel{ overflow:hidden; line-height:78px; background:url(/uploads/image/simages/tel.png) no-repeat left center; padding-left:30px; margin-left:48px; } /* nav -------------------------------------------------------------- */ .menu, .menu ul { list-style: none; padding: 0; } .menu > li { position: relative; display: inline-block; outline: 0; } .submenu { position: absolute; left: 0; top: 100%; z-index: 0; overflow: hidden; /* ie8 needs this */ overflow: hidden\0/ !important; max-height: 0; /* a .submenu should be only revealed when hovering the .menu */ pointer-events: none; } .menu > li:hover .submenu, .menu > li:focus .submenu { pointer-events: auto; z-index: 10; max-height: 2000px; -webkit-transition: none; -moz-transition: none; } /* default ================================================================= */ .submenu li { opacity: 0; -webkit-transition: opacity .4s, -webkit-transform .6s, max-height .6s; -moz-transition: opacity .4s, -moz-transform .6s, max-height .6s; -ms-transition: opacity .4s, -ms-transform .6s, max-height .6s; -o-transition: opacity .4s, -o-transform .6s, max-height .6s; transition: opacity .4s, transform .6s, max-height .6s; } .menu > li:hover .submenu li, .menu > li:focus .submenu li { opacity: 1; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } /* shield ================================================================= */ .shield { overflow: visible; -webkit-perspective: 400px; -moz-perspective: 400px; -ms-perspective: 400px; -o-perspective: 400px; perspective: 400px; } .shield li { -webkit-transform: rotatex(90deg); -moz-transform: rotatex(90deg); -ms-transform: rotatex(90deg); -o-transform: rotatex(90deg); transform: rotatex(90deg); -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin: 0 0; transform-origin: 0 0; -webkit-transition-timing-function: cubic-bezier(0, .35, .5, 1.7); -moz-transition-timing-function: cubic-bezier(0, .35, .5, 1.7); -ms-transition-timing-function: cubic-bezier(0, .35, .5, 1.7); -o-transition-timing-function: cubic-bezier(0, .35, .5, 1.7); transition-timing-function: cubic-bezier(0, .35, .5, 1.7); } .nav{ text-align:right; } .nav > ul{ display:inline-block; margin:0; } .nav span{ display:block !important; width:100%; line-height:20px; font-size:13px; font-family:arial; color:#b8b8b8; text-transform:uppercase; } .nav .menu > li{ float:left; text-align:center; line-height:78px; position:relative; padding:0 19px; } .nav .menu > li:before{ content:""; width:0; height:3px; background:#c5161d; position:absolute; top:0; left:50%; margin-left:-33px; -webkit-transition: all .6s cubic-bezier(.215, .61, .355, 1) 0s; transition: all .6s cubic-bezier(.215, .61, .355, 1) 0s; } .nav .menu > li:hover:before,.nav .menu > li.current:before{ width:66px; } .nav .menu > li a{ color:#fff; font-size:16px; display:block; line-height:78px; } .nav .menu > li:hover a,.nav .menu > li.current a{ color:#c5161d; font-weight:bold; } .nav .menu > li:hover span,.nav .menu > li.current span{ display:block !important; } .nav .menu > li .submenu{ width:160px; } .nav .menu > li .submenu li{ width:100%; line-height:30px; background:#c5161d; text-align:center; border-top:solid 1px #fff; } .nav .menu > li .submenu li a{ display:block; color:#fff; background:none; font-size:14px; padding:0; line-height:30px; } .nav .menu > li .submenu li:hover{ background:rgba(197,22,29,0.8); } .nav .menu > li.current:after{ width:84px; } .cont{ width:1200px; overflow:hidden; margin:auto; } .cont1{ width:1200px; height:auto; margin:auto; } .cont2{ width:1500px; overflow:hidden; margin:auto; } /* banner -------------------------------------------------------------- */ .banner{ width:100%; overflow:hidden; position:relative; text-align:center; } .mouse-index{ position:absolute; bottom:30px; left:50%; width:70px; margin-left:-35px; z-index:999; } .mouse { width: 47px; overflow:hidden; position:relative; left:50%; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); -webkit-animation: scroll 1s infinite alternate; animation: scroll 1s infinite alternate; } .mouse-index p{ width:100%; overflow:hidden; text-align:center; color:#fff; font-size:16px; line-height:25px; margin-top:20px; } @-webkit-keyframes scroll { 100% { -webkit-transform: translate(-50%, 8px); transform: translate(-50%, 8px); } } @keyframes scroll { 100% { -webkit-transform: translate(-50%, 8px); transform: translate(-50%, 8px); } } .rslides { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; } .rslides li { -webkit-backface-visibility: hidden; position: absolute; display: none; width: 100%; left: 0; top: 0; } .rslides li:first-child { position: relative; display: block; float: left; } .rslides img { display: block; height: auto; float: left; width: 100%; border: 0; } .rslides { margin: 0 auto 40px; } #slider2, #slider3 { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; margin: 0 auto; } .rslides_tabs { padding: 0; font-size: 18px; list-style: none; margin: 0 auto; position:absolute; bottom:60px; z-index:99; display:inline-block; width:144px; left:50%; margin-left:-72px; } .rslides_tabs li { float: left; width: 16px; height:16px; margin: 0 10px; } .rslides_tabs a { width:100%; height: 100%; background:#fff; display:block; border-radius:50%; position:relative; } .rslides_tabs li a:hover,.rslides_tabs .rslides_here a{ background:#c5161d; } /* callback example */ .events { list-style: none; } .callbacks_container { margin-bottom: 50px; position: relative; float: left; width: 100%; } .callbacks { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; } .callbacks li { position: absolute; width: 100%; left: 0; top: 0; } .callbacks img { display: block; position: relative; z-index: 1; height: auto; width: 100%; border: 0; } .callbacks .caption { display: block; position: absolute; z-index: 2; font-size: 20px; text-shadow: none; color: #fff; background: #000; background: rgba(0,0,0, .8); left: 0; right: 0; bottom: 0; padding: 10px 20px; margin: 0; max-width: none; } .callbacks_nav { position: absolute; -webkit-tap-highlight-color: rgba(0,0,0,0); top: 52%; left: 0; opacity: 0.7; z-index: 3; text-indent: -9999px; overflow: hidden; text-decoration: none; height: 61px; width: 38px; margin-top: -45px; } .banner .rslides_nav{ width:51px; height:51px; position:absolute; display:block; z-index:998; } .banner .prev{ background: no-repeat center; top:50%; left:10%; margin-top:-25.5px; } .banner .prev:hover{ background: no-repeat center; } .banner .next{ background: no-repeat center; top:50%; right:10%; margin-top:-25.5px; } .banner .next:hover{ background: no-repeat center; } .callbacks_nav:active { opacity: 1.0; } .callbacks_nav.next { left: auto; background-position: right top; right: 0; } #slider3-pager a { display: inline-block; } #slider3-pager img { float: left; } #slider3-pager .rslides_here a { background: transparent; box-shadow: 0 0 0 2px #666; } #slider3-pager a { padding: 0; } @media screen and (max-width: 600px) { .callbacks_nav { top: 47%; } } /*banner*/ /* tit -------------------------------------------------------------- */ .tit{ overflow:hidden; } .tit h4{ width:100%; overflow:hidden; font-size:22px; color:#000; line-height:30px; margin:0; border-left:solid 4px #c5161d; padding-left:20px; } .tit h4 a{ font-size:22px; color:#000; } /* icons -------------------------------------------------------------- */ .icons{ width:100%; overflow:hidden; background:url(/uploads/image/simages/iconbg.jpg) no-repeat top center; background-size:cover; } .icons .iconlist{ width:100%; overflow:hidden; border-bottom:solid 1px #e7e7e7; padding:25px 0 30px 0; } .icons .iconlist:last-child{ border-bottom:none; } .iconlist dl{ height:104px; overflow:hidden; border-right:solid 1px #ccc; margin-bottom:0; } .iconlist dl:last-child{ border-right:none; } .iconlist dl dt{ width:100%; overflow:hidden; text-align:center; } .iconlist dl dt img{ max-width:100%; height:auto; -webkit-transition: -webkit-transform 0.5s ease-out; -moz-transition: -moz-transform 0.5s ease-out; -o-transition: -o-transform 0.5s ease-out; -ms-transition: -ms-transform 0.5s ease-out; } .iconlist dl:hover dt img{ -webkit-transform: rotatey(180deg); -moz-transform: rotatey(180deg); -o-transform: rotatey(180deg); -ms-transform: rotatey(180deg); transform: rotatey(180deg); } .iconlist dl dd{ width:100%; overflow:hidden; text-align:center; font-size:18px; color:#000; font-weight:bold; line-height:30px; margin-top:23px; } /* case -------------------------------------------------------------- */ .case{ padding-top:40px; padding-bottom:60px; } .case .casemore{ overflow:hidden; line-height:30px; } .case .casemore a{ font-size:16px; color:#000; } .case .casenr{ width:100%; overflow:hidden; margin-top:40px; } .case .casenr dl{ width:290px; overflow:hidden; float:left; margin-right:13.3333333px; } .case .casenr dl:last-child{ margin-right:0; } .case .casenr dl dt,.case .casenr dl dd{ width:100%; overflow:hidden; text-align:center; } .case .casenr dl dt{ position:relative; height:224px; } .case .casenr dl dd{ background:#eee; line-height:30px; font-size:16px; color:#000; padding:14px 0; white-space: nowrap; text-overflow: ellipsis; } .case .casenr dl:hover dd{ color:#c5161d; } .case dl dt img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; } .case dl:hover dt img{ transform:translate(-50%, -50%) scale(1.2); } /* jyfw -------------------------------------------------------------- */ .jyfw{ width:100%; overflow:hidden; background: no-repeat top center; background-size:cover; padding-top:55px; padding-bottom:74px; } .jyfw .titen{ color:#fff; } .jyfw .tit h4 a{ background:none; color:#fff; } .jyfwnr{ margin-top:56px; } .jyfwnr dl{ width:200px; height:200px; overflow:hidden; float:left; background:#fff; padding-top:38px; margin-right:50px; margin-bottom:0; } .jyfwnr dl:last-child{ margin-right:0; } .jyfwnr dl dt{ width:100%; overflow:hidden; text-align:center; transition: all 0.5s; } .jyfwnr dl dt .fwimg2{ display:none; } .jyfwnr dl:hover dt .fwimg1{ display:none; } .jyfwnr dl:hover dt .fwimg2{ display:block; margin:auto; } .jyfwnr dl dd{ width:100%; overflow:hidden; text-align:center; font-size:22px; color:#098367; line-height:30px; margin-top:10px; } .jyfwnr dl:hover dt{ transform: rotatey(180deg); } .jyfwnr dl:hover{ background:#098367; } .jyfwnr dl:hover dd{ color:#fff; } .fwtel{ width:340px; height:62px; line-height:62px; overflow:hidden; background:#fff; border-radius:30px; position:relative; left:50%; margin-left:-170px; font-size:26px; color:#098367; padding-left:20px; margin-top:58px; } .fwtel .fwtelnr{ width:248px; height:62px; line-height:62px; overflow:hidden; position:absolute; right:0; top:0; background:#098367; color:#fff; font-size:26px; border-radius:30px; text-align:center; } /* pro -------------------------------------------------------------- */ .pro{ margin-top:68px; } .pro .promenu{ overflow:hidden; text-align:right; } .pro .promenu ul{ overflow:hidden; display:inline-block; } .pro .promenu ul li{ overflow:hidden; float:left; border-radius:20px; margin-left:28px; border:solid 1px #dbdbdb; line-height:36px; margin-bottom:10px; } .pro .promenu ul li a{ font-size:16px; color:#333; padding:0 30px; display:block; } .pro .promenu ul li:hover{ border:solid 1px #c5161d; } .pro .promenu ul li:hover a{ color:#c5161d; } .pro .pronr{ width:100%; overflow:hidden; } .diepic{ position: relative; width: 100%; margin:50px auto 0 auto } .diepic h2{font-size:36px;margin-bottom:17px;text-align:center;font-weight:normal;line-height:42px;height:60px;} .diepic .swiper-container { padding-bottom: 10px; } .diepic .swiper-slide { width: 75%; background: #f5f5f5; box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .19); transition: all .4s cubic-bezier(.4, 0, .2, 1); cursor: pointer; } .diepic .swiper-slide-prev, .diepic .swiper-slide-next{ filter: blur(3px); -webkit-filter: blur(3px); -moz-filter: blur(3px); -ms-filter: blur(3px); -o-filter: blur(3px);} .diepic .swiper-slide dl{ width:100%; overflow:hidden; padding:45px 40px; } .diepic .swiper-slide dl dt{ width:50%; overflow:hidden; float:left; } .diepic .swiper-slide dl dd{ width:50%; overflow:hidden; float:right; padding:0 0 0 40px; } .diepic .swiper-slide dl dd h5{ width:100%; overflow:hidden; font-size:22px; font-weight:bold; color:#000; margin:0; line-height:35px; text-align:left; white-space: nowrap; text-overflow: ellipsis; } .diepic .swiper-slide dl dd hr{ width:30px; border:none; border-bottom:solid 1px #c5161d; margin:16px 0; } .diepic .swiper-slide dl dd p{ width:100%; overflow:hidden; font-size:16px; color:#000; text-align:left; margin-top:12px; line-height:34px; } .diepic .swiper-slide img { width:100%; display: block; } .diepic .swiper-slide .promore{ width:124px; height:32px; overflow:hidden; display:block; color:#c5161d; border:solid 1px #c5161d; border-radius:20px; line-height:32px; margin-top:85px; } .diepic .swiper-pagination { width: 100%; bottom: 0; display:none; } .diepic .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 5px; border: 3px solid #fff; background-color: #030000; width: 10px; height: 10px; opacity: .6; } .diepic .swiper-pagination-bullets .swiper-pagination-bullet-active { width: 34px; display: inline-block; height: 10px; border-radius: 10px; transition: width .4s cubic-bezier(.4, 0, .2, 1); background-image: linear-gradient(80deg, #0989c5, #995cb6); opacity: 1; } .diepic .swiper-button-prev { left: 22px; top: 50%; margin-top:-17px; width: 20px; height: 34px; } .diepic .swiper-button-next { right: 22px; top: 50%; margin-top:-17px; width: 20px; height: 34px; } /* zsjm -------------------------------------------------------------- */ .zsjm .zsjmnr{ width:100%; overflow:hidden; margin-top:48px; } .zsjm .zsjmnr table{ width:100%; overflow:hidden; border:solid 1px #fff; border-collapse:collapse; } .zsjm .zsjmnr table tr td{ text-align:center; font-size:18px; color:#000; line-height:55px; } .zsjm .zsjmnr img{ max-width:100%; height:auto; } /* partner -------------------------------------------------------------- */ .partner .partnernr{ width:100%; overflow:hidden; margin-top:48px; } .partner .partnernr img{ max-width:100%; height:auto; } /* client -------------------------------------------------------------- */ .pro_gp{ width:100%; overflow:hidden; background:#fafafa; padding:80px 0; } .pro_gp .pro_gpnr{ width:80%; overflow:hidden; float:right; position:relative; } .pro_lf{ width:33%; overflow:hidden; margin-top: 34.6%; } .pro_rt{ width:64%; overflow:hidden; position:relative; } .pro_rt img{ width:100%; } .pro_rt .pro_gptit{ width:100%; line-height:30px; padding:33px 0; text-align:center; font-size:26px; color:#333; background:rgba(255,255,255,0.5); position:absolute; bottom:0; } .pro_gp_ms{ width:43%; overflow:hidden; background:#fafafa; position:absolute; top:60px; left:0; z-index:99; padding:66px 0 66px 20px; } .pro_gpcn{ width:100%; overflow:hidden; font-size:16px; line-height:30px; color:#666; margin-top:34px; } .pro_gpen{ width:100%; overflow:hidden; font-family:arial; line-height:30px; text-transform:uppercase; color:#666; margin-bottom:30px; } #my-slide{ width:100%; } #my-slide .slide-list{ max-width: 1300px; width:100%; min-height:230px; overflow: hidden; position: relative; margin:0 auto; } #my-slide .slide-list li{ margin-right:20px; position: absolute; top:0; overflow: hidden; width:calc(100% - 20px - 50%); max-width: 660px; opacity:0.5; } #my-slide .slide-list li.active{ opacity:1; } #my-slide .slide-list li img{ width:100%; height:auto; } /**顶部幻灯片有钮**/ .slick-top-prev{ position:absolute; display: block; height: 94px; width:56px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; top: 50%; left: 0px; margin-top:-47px; } .slick-arrow{ font-family: monospace; font-weight: 100; font-size: 50px; color: #333; outline: none; z-index: 1; opacity: .95; } .slick-top-prev:before{ content: "<"; font-weight: bold; } .slick-top-next{ position:absolute; display: block; height: 40px; width:22px; top: 50%; right: 0px; margin-top:-47px; background:none; } .slick-top-next:before{ content: ">"; font-weight: bold; } /* about -------------------------------------------------------------- */ .about{ width:580px; height:315px; overflow:hidden; background:#f5f5f5; padding:10px 20px 30px 20px; } .about h4{ width:100%; font-size:20px; color:#c5161d; border-bottom:solid 1px #ccc; line-height:30px; padding-bottom:10px; position:relative; margin:0; } .about h4:after{ content:""; position:absolute; width:82px; height:1px; background:#c5161d; bottom:-1px; left:0; } .about .aboutnr{ width:100%; overflow:hidden; margin-top:30px; } .aboutnr .aboutlf{ width:60%; overflow:hidden; padding-right:10px; } .aboutnr .aboutimg{ width:40%; overflow:hidden; } .aboutnr .aboutimg img{ max-width:100%; height:auto; } .aboutnr .aboutlf .aboutjs{ width:100%; overflow:hidden; line-height:28px; } .aboutnr .aboutrt{ width:40%; overflow:hidden; text-align:right; } .aboutnr .aboutmore{ width:100%; overflow:hidden; margin-top:48px; } .aboutnr .aboutmore a{ color:#c5161d; text-decoration:underline; } /* news -------------------------------------------------------------- */ .news{ margin-top:40px; } .news .newsnr{ width:580px; overflow:hidden; background:#f5f5f5; padding:10px 20px 28px 20px; } .news .newsnr .newstit{ width:100%; height:40px; position:relative; padding-bottom:10px; border-bottom: solid 1px #ccc; } .news .newsnr .newstit:after{ content: ""; position: absolute; width: 82px; height: 1px; background: #c5161d; bottom: -1px; left: 0; } .news .newsnr .newstit h4{ overflow:hidden; font-size: 20px; color: #c5161d; line-height:30px; float:left; margin:0; } .news .newsnr .newsmore{ overflow:hidden; line-height:30px; } .news .newsnr .newsmore a{ color:#c5161d; } .news .newslist{ width:100%; overflow:hidden; margin-top:15px; } .news .newslist ul{ width:100%; overflow:hidden; } .news .newslist ul li{ width:100%; overflow:hidden; line-height:32px; margin-top:5px; } .news .newslist ul li a{ width:80%; overflow:hidden; float:left; white-space: nowrap; text-overflow: ellipsis; } .news .newslist ul li span{ width:20%; overflow:hidden; float:right; text-align:right; color:#999; } .news .newslist ul li:hover a{ color:#c5161d; } /* imglist -------------------------------------------------------------- */ .pro_gt{ width:100%; overflow:hidden; background:#f7f7f7; padding:90px 0; } .pro_gt_nr{ position:absolute; left:20px; top:0; } .pro_gt_nr .pro_cn{ width:100%; overflow:hidden; font-size:16px; line-height:30px; color:#666; margin-top:34px; } .pro_gt_nr .pro_en{ width:100%; overflow:hidden; font-family:arial; line-height:30px; text-transform:uppercase; color:#666; margin-bottom:40px; } .pro_btn{ width:68px; height:68px; border-radius:50%; background:#ff9031; position: absolute; left: 50%; margin-left: -8.7%; z-index: 99; top: 50%; margin-top: -34px; } .pro_btn:after{ content:""; position:absolute; width:4px; height:4px; border-radius:50%; background:#dbdbdb; left:32px; top:32px; } .swiper-container { width: 100%; margin-left: auto; margin-right: auto; } @media (min-width: 480px) { .swiper-container { } } .swiper-container-wrapper { display: flex; flex-flow: column nowrap; width: 80%; float:right; position:relative; } @media (min-width: 480px) { .swiper-container-wrapper { flex-flow: row nowrap; } } .swiper-button-next, .swiper-button-prev { color: #fff; } .swiper-slide-duplicate, .swiper-slide { text-align: center; background-size: cover; background-position: center; /* center slide text vertically */ display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; /* slide content */ } .swiper-slide-duplicate .description, .swiper-slide-duplicate .title, .swiper-slide .description, .swiper-slide .title { display: block; opacity: 0; transition: 0.5s ease 0.5s; } .swiper-slide-duplicate-active .description, .swiper-slide-duplicate-active .title, .swiper-slide-active .description, .swiper-slide-active .title { opacity: 1; } .swiper-slide-duplicate-active .title, .swiper-slide-active .title { margin-bottom: 0.5rem; font-size: 24px; color: #fff; transition: opacity 0.5s ease 0.5s; } .swiper-slide-duplicate-active .description, .swiper-slide-active .description { font-size: 16px; color: #fff; transition: opacity 0.5s ease 0.75s; } .gallery-top { width: 100%; } @media (min-width: 480px) { .gallery-top { width: 56%; margin-right: 10px; } } .gallery-top .swiper-slide img{ width: 100%; } .gallery-thumbs { width: 100%; padding-top: 10px; } @media (min-width: 480px) { .gallery-thumbs { width: 40%; padding: 0; margin-top:24%; } } .gallery-thumbs .swiper-wrapper { flex-direction: row; } @media (min-width: 480px) { .gallery-thumbs .swiper-wrapper { flex-direction: row; } } .gallery-thumbs .swiper-slide { width: 25%; flex-flow: row nowrap; height: 100%; opacity: 0.75; cursor: pointer; } @media (min-width: 480px) { .gallery-thumbs .swiper-slide { flex-flow: row nowrap; } .gallery-thumbs .swiper-slide img{ max-width:100%; height:auto; } } .gallery-thumbs .swiper-slide-thumb-active { opacity: 1; } /* ys -------------------------------------------------------------- */ .ystit{ margin-top:88px; } .ystit .tit{ width:100%; overflow:hidden; } .ystit .tit p{ text-align:center; } .ystit .tit h4{ text-align:center; } .ys{ width:90%; overflow:hidden; float:right; margin-top:72px; position:relative; padding-bottom:59px; } .ys .hj{ overflow:hidden; font-size:165px; color:#f1f1f1; font-family:arial; font-weight:bold; position:absolute; top: 50%; margin-top: -100px; left:0; line-height:200px; } .ys hr{ width:490px; height:2px; background:#515151; position:absolute; bottom:0; left:50%; margin-left:-245px; border:none; margin:0; } .ys .owl-carousel{ width:80%; float:right; left:100px; } .ys .item{ width:100%; overflow:hidden; } .ys .item .ysimg{ width:100%; overflow:hidden; position:relative; margin:0 20px; } .ys .item .ysimg img{ width:100%; height:auto; } .ys .owl-item:nth-child(2n) .ysimg img{ margin-top:-126px; } .ys .item .ysimg .ystit{ width:100%; overflow:hidden; position:absolute; bottom:0; left:0; padding:0 54px 34px 54px; } .ys .item .ysimg .ystit h5{ width:100%; overflow:hidden; font-size:26px; color:#fff; text-align:left; line-height:40px; margin:0; } .ys .item .ysimg .ystit p{ width:100%; overflow:hidden; font-size:16px; color:#fff; text-align:left; line-height:30px; margin-top:10px; } /* link -------------------------------------------------------------- */ .link{ width:100%; overflow:hidden; line-height:30px; font-weight:bold; padding:0 0 40px 0; } .link a{ margin:0 5px; color:#666; font-weight:normal; } /* footer -------------------------------------------------------------- */ .footer{ width:100%; overflow:hidden; background:#dbdbdb; padding-top:35px; } .footer .ewm{ width:15%; overflow:hidden; text-align:right; } .footer .ewm img{ max-width:100%; height:auto; } .footer .footernav{ width:100%; overflow:hidden; margin-bottom:30px; } .footer .footernav ul{ width:100%; overflow:hidden; } .footer .footernav ul li{ width:13%; overflow:hidden; float:left; padding:0; } .footer .footernav ul li:nth-child(6){ width:22%; } .footer .footernav ul li:last-child{ text-align:right; } .footer .footernav ul li img{ max-width:100%; height:auto; } .footer .footernav ul li h3{ width:100%; overflow:hidden; color:#000; font-size:16px; font-weight:bold; line-height:30px; margin-bottom:5px; } .footer .footernav ul li h3 a{ color:#000; font-size:16px; font-weight:bold; } .footer .footernav ul li p{ width:100%; overflow:hidden; line-height:32px; } .bot{ width:100%; overflow:hidden; line-height:30px; padding:14px 0; background:#666; } .bot .botnr{ font-size:13px; color:#fff; text-align:center; line-height:30px; } .bot .botnr a{ font-size:13px; color:#fff; } /* banner_n -------------------------------------------------------------- */ .banner_n { width:100%; height:422px; background:url(/uploads/image/simages/aboutban.jpg) no-repeat top center; background-size:cover; position:relative; } @media only screen and (min-width: 1921px) and (max-width: 2560px) { .banner_n { height:563px; } } @media(max-width:1680px) { .banner_n{ height:369px; } } @media(max-width:1440px) { .banner_n{ height:317px; } } @media(max-width:1360px) { .banner_n{ height:299px; } } @media(max-width:1280px) { .banner_n{ height:281px; } } @media(max-width:1152px) { .banner_n{ height:253px; } } @media(max-width:1024px) { .banner_n{ height:225px; } } .banner_n .position{ position:absolute; left:50%; margin-left:-600px; line-height:30px; color:#fff; text-align:right; color:#fff; padding:10px 0; bottom:0; } .banner_n .position a{ color:#fff; } /* ntit -------------------------------------------------------------- */ .ntit{ width:100%; overflow:hidden; border-bottom:solid 1px #c5161d; } .ntit .ntitnr h3{ width:22%; overflow:hidden; float:left; font-size:26px; color:#c5161d; font-weight:bold; line-height:40px; padding:30px 0; } .nmenu{ overflow:hidden; text-align:right; padding:32px 0 22px 0; } .nmenu ul{ overflow:hidden; display:inline-block; } .nmenu ul li{ float:left; padding:0 28px; height:36px; line-height:36px; text-align:center; border:solid 1px #dbdbdb; border-radius:20px; margin-left:28px; margin-bottom:10px; } .nmenu ul li a{ font-size:16px; color:#333; display:block; } .nmenu ul li:hover,.nmenu ul li.cur{ border:solid 1px #c5161d; } .nmenu ul li:hover a,.nmenu ul li.cur a{ color:#c5161d; } /* nabout -------------------------------------------------------------- */ .nabout{ margin-top:60px; margin-bottom:60px; } .nabout,.nabout p{ font-size:16px; line-height:34px; color:#333; } /* nhonor -------------------------------------------------------------- */ .nhonor{ margin-top:60px; margin-bottom:60px; } .nhonor ul{ width:100%; overflow:hidden; } .nhonor ul li{ margin:10px 0; } /* npro -------------------------------------------------------------- */ .npro{ margin-top:60px; margin-bottom:60px; } .npronr{ width:100%; overflow:hidden; margin-top:30px; } .npro dl{ width:349px; overflow:hidden; float:left; margin-right:76.5px; margin-bottom:23px; margin-top:23px; } .npro dl:nth-child(3n){ margin-right:0; } .npro dl dt{ width:100%; overflow:hidden; height:240px; position:relative; -webkit-transform: translatey(0); -moz-transform: translatey(0); -ms-transform: translatey(0); -o-transform: translatey(0); transform: translatey(0); text-align:center; } .npro dl dt img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; } .npro dl:hover dt img{ transform:translate(-50%, -50%) scale(1.2); } .npro dl dd{ width:100%; overflow:hidden; text-align:center; font-size:16px; line-height:30px; margin-top:26px; } .npro dl:hover dd{ color:#c5161d; } .npro h1{ width:100%; overflow:hidden; text-align:center; font-size:20px; color:#333; margin:0; line-height:40px; font-weight:bold; margin-bottom:24px; } .npro hr{ width:66px; border:none; border-bottom:solid 2px #c5161d; margin:auto; } .npro .nprofbimg{ width:100%; overflow:hidden; text-align:center; margin-top:50px; } .npro .nprofbimg img{ max-width:100%; height:auto; } .npro .nprobody{ width:100%; overflow:hidden; margin-top:30px; font-size:16px; color:#333; line-height:30px; } .npro .nprobody p{ overflow:hidden; font-size:16px; color:#333; line-height:30px; } .npro .nprobody img{ max-width:100%; height:auto; } /* ncase -------------------------------------------------------------- */ .ncase{ margin-top:27px; margin-bottom:60px; } .ncasenr{ width: 100%; overflow: hidden; } .ncase dl{ width:344px; overflow:hidden; float:left; margin-right:84px; margin-top:29px; margin-bottom:29px; } .ncase dl:nth-child(3n){ margin-right:0; } .ncase dl dt,.ncase dl dd{ width:100%; overflow:hidden; text-align:center; } .ncase dl dt{ height:266px; position:relative; } .ncase dl dt img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; } .ncase dl:hover dt img{ transform:translate(-50%, -50%) scale(1.2); } .ncase dl dd{ width:100%; overflow:hidden; font-size:16px; color:#000; line-height:30px; padding:14px 0; border:solid 1px #d2d2d2; border-top:none; white-space: nowrap; text-overflow: ellipsis; } .poptrox-popup{ overflow:visible !important; } /* njob -------------------------------------------------------------- */ .njob{ margin-top:50px; margin-bottom:50px; } .container { position: relative; margin: 0 auto; } .accordion { position: relative; background-color: #fff; display: inline-block; width: 100%; font-weight: 700; color: #74777b; vertical-align: middle; } .accordion .fa { position: relative; float: right; } .accordion h4 { position: relative; line-height:80px; margin: 0; font-size: 18px; color: #000; padding:0 2%; } .accordion a { position: relative; display: block; font-size:18px; color: #000; line-height:80px; text-decoration: none; background:#f5f5f5; margin-bottom:10px; } .accordion a:hover { text-decoration: none; color: #2cc185; background-color: #e7ecea; transition: 0.3s; } .accordion-desc { color: #eee; z-index: 2; border-top: 1px solid #ff9031; box-shadow: 0px 3px 8px rgba(0,0,0,0.11); -moz-box-shadow: 0px 3px 8px rgba(0,0,0,0.11); -webkit-box-shadow: 0px 3px 8px rgba(0,0,0,0.11); margin-bottom:10px; } .accordion-desc h5{ color: #000; font-size:18px; z-index: 2; line-height:80px; border-bottom: 1px dashed #dedede; margin:0; padding:0 2%; } @media (min-width:480px) { .container { max-width: 80%; } } @media (min-width:768px) { .container { max-width: 600px; } } .njobnr{ width:100%; overflow:hidden; font-size:16px; line-height:35px; color:#000; padding:25px 2%; } .njobnr p{ overflow:hidden; font-size:16px; line-height:35px; color:#000; } /* nnews -------------------------------------------------------------- */ .nnews{ margin-top:60px; margin-bottom:60px; } .nnews dl{ width:100%; overflow:hidden; margin:32px 0; } .nnews dl dt{ width:23%; height:222px; overflow:hidden; position:relative; float:left; } .nnews dl dt img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; } .nnews dl:hover dt img{ transform:translate(-50%, -50%) scale(1.2); } .nnews dl dd{ width:75%; overflow:hidden; float:right; } .nnews dl dd .nnewsbt{ width:100%; overflow:hidden; font-size:20px; line-height:30px; margin-top:19px; color:#333; font-weight:bold; white-space: nowrap; text-overflow: ellipsis; } .nnews dl dd .nnewsdate{ width:100%; overflow:hidden; font-size:15px; line-height:30px; padding-bottom:25px; border-bottom:dashed 1px #333333; margin-top:7px; } .nnews dl dd .nnewsms{ width:100%; overflow:hidden; font-size:16px; line-height:30px; margin-top:24px; } .nnews dl:hover dd .nnewsbt{ color:#c5161d; } .nnews h1{ width:100%; overflow:hidden; font-size:26px; color:#333; text-align:center; margin-top:0; line-height:30px; } .nnews .fbtime{ width:100%; overflow:hidden; font-size:15px; line-height:30px; color:#666; text-align:center; border-bottom:dashed 1px #666; padding-bottom:23px; } .nnews .fbnr{ width:100%; overflow:hidden; margin-top:30px; font-size:16px; line-height:30px; color:#333; } .nnews .fbnr p{ width:100%; overflow:hidden; font-size:16px; line-height:30px; color:#333; } .nnews .fbnr img{ max-width:100%; height:auto !important; } /* nkhfw -------------------------------------------------------------- */ .nkhfw{ margin-top:60px; margin-bottom:60px; } .nkhfw dl{ width:250px; height:170px; overflow:hidden; float:left; border:solid 1px #d2d2d2; padding:35px 0 29px 0; margin-right:66px; margin-top:30px; margin-bottom:30px; } .nkhfw dl:nth-child(4n){ margin-right:0; } .nkhfw dl dt,.nkhfw dl dd{ width:100%; overflow:hidden; text-align:center; } .nkhfw dl dd{ font-size:18px; color:#000; font-weight:bold; line-height:30px; margin-top:23px; } .nkhfw dl:hover{ border:solid 1px #c5161d; cursor:pointer; box-shadow: 0px 3px 10px rgba(0,0,0,0.26); -moz-box-shadow: 0px 3px 10px rgba(0,0,0,0.26); -webkit-box-shadow: 0px 3px 10px rgba(0,0,0,0.26); } .nkhfw dl dt img{ max-width:100%; height:auto; -webkit-transition: -webkit-transform 0.5s ease-out; -moz-transition: -moz-transform 0.5s ease-out; -o-transition: -o-transform 0.5s ease-out; -ms-transition: -ms-transform 0.5s ease-out; } .nkhfw dl:hover dt img{ -webkit-transform: rotatey(180deg); -moz-transform: rotatey(180deg); -o-transform: rotatey(180deg); -ms-transform: rotatey(180deg); transform: rotatey(180deg); } /* ncontact -------------------------------------------------------------- */ .ncontact{ margin-top:60px; margin-bottom:60px; } .ncontact .ncontactnr{ width:32%; overflow:hidden; padding-top:36px; } .ncontact .ncontactnr h4{ width:100%; overflow:hidden; font-size:20px; color:#c5161d; font-weight:bold; line-height:40px; margin:0; } .ncontact .ncontactnr hr{ width:56px; border:none; border-bottom:solid 2px #c5161d; margin-top:30px; margin-bottom:38px; } .ncontact .ncontactnr p{ width:100%; overflow:hidden; font-size:16px; color:#333; line-height:35px; margin-top:8px; } .ncontact .ncontactnr p a{ font-size:16px; color:#333; } .ncontact .ncontactnr .ncontactlf{ width:80%; overflow:hidden; } .map{ width:68%; height:346px; } /* nmessage -------------------------------------------------------------- */ .message{ margin-top:60px; margin-bottom:60px; } .message ul { width: 100%; overflow: hidden; margin-bottom:0; } .message ul li { float: left; width: 33.3%; margin-bottom: 40px; } .message ul li:last-child{ margin-bottom:35px; } .message ul li input{ width: 87%; height:55px; overflow:hidden; line-height:55px; border:solid 1px #666; font-size:16px; padding:0 4%; } .message ul li:first-child input{ background:url(/uploads/image/simages/icon9.png) no-repeat 95% center; } .message ul li:nth-child(2){ text-align:center; } .message ul li:nth-child(2) input{ background:url(/uploads/image/simages/icon10.png) no-repeat 95% center; } .message ul li:nth-child(3){ text-align:right; } .message ul li:nth-child(3) input{ background:url(/uploads/image/simages/icon11.png) no-repeat 95% center; } .message ul li:last-child{ width: 100%; } .message ul li:last-child textarea{ background:url(/uploads/image/simages/icon12.png) no-repeat 99% 24px; } .message ul li textarea{ width: 100%; height:228px; overflow:hidden; line-height:30px; border:solid 1px #666; font-size:16px; padding:0 1.2%; } .subbtn{ width: 100%; overflow:hidden; text-align:center; } .subbtn button{ width:150px; height:56px; overflow:hidden; text-align:center; line-height:44px; font-size:16px; background:#c5161d; color:#fff; } /* dede_pages -------------------------------------------------------------- */ .dede_pages{ width:100%; overflow:hidden; margin-top: 10px; text-align: center; } .dede_pages ul { padding: 12px 0px 12px 0; display: inline-block; } .dede_pages ul li { float: left; line-height: 17px; margin-right: 6px; padding: 5px 10px; border:solid 1px #c5161d; margin:5px; } .dede_pages ul li.thisclass{ background-color: #c5161d; padding: 5px 10px; font-weight: bold; color:#fff; } .dede_pages ul li.thisclass a{ color:#fff; } .dede_pages ul li:hover{ background-color: #c5161d; } .dede_pages ul li:hover a{ color: #fff; } .dede_pages ul li a { float: left; display: block; color:#454545; } .page1{ width:100%; overflow:hidden; margin-top:10px; } .page1 p{ width:100%; height:30px; line-height:30px; overflow:hidden; font-size: 16px; } .page1 p a{ color:#454545; font-size: 16px; } .page1 p a:hover{ color:#c5161d; } .pages{ width:100%; overflow:hidden; margin-top:30px; } .pages .pageslf,.pages .pagesrt{ width:50%; overflow:hidden; font-size:16px; line-height:58px; padding:0 1%; text-align:center; white-space: nowrap; text-overflow: ellipsis; } .pages .pageslf a,.pages .pagesrt a{ font-size:16px; } .pages .pageslf:hover,.pages .pagesrt:hover{ transition: all .5s ease; -moz-transition: all .5s ease; /* firefox 4 */ -webkit-transition: all .5s ease; /* safari 和 chrome */ -o-transition: all .5s ease; /* opera */ color:#c5161d; } .pages .pageslf:hover a,.pages .pagesrt:hover a{ color:#c5161d; } .dede_pages table, .dede_pages table tr, .dede_pages table td{ border:none; } .dede_pages table td{ line-height:30px; font-size:14px; } .dede_pages table td a{ font-size:14px; } .a_txt,.rg{ display:none; } /*移动端导航*/ @media screen and (max-width: 1023px) and (min-width: 0px){ .nav{display:none} .headernr{ width:96% !important; } .rg{display:block;padding-top:24px;float:right; margin-left:10px;} .rg a img{vertical-align:top} .a_txt{display:block;position:fixed;top:0px;left:0px;width:0px;height:0px;overflow:hidden;z-index:10000} .a_txt .div1{position:absolute;width:100%;height:100%;background:#0b0d19;filter:alpha(opacity=0);opacity:0;left:0px;top:0px;z-index:1} .a_txt .div2{position:absolute;width:20%;left:0px;top:5%;z-index:100;text-align:center;filter:alpha(opacity=0);opacity:0} .a_txt .div3{position:absolute;width:80%;right:0px;top:0px;background:#0b0d19;height:100%;z-index:100;right:-80%} .a_txt .div3 ul{padding-left:5%;padding-right:5%} .a_txt .div3 ul li{border-bottom:1px solid #232530} .a_txt .div3 ul li a{display:block;height:45px;color:#fff;line-height:45px;padding-left:5%;font-size:16px} .a_txt .div3 ul li .a_js2{-webkit-transition:all 0s;-moz-transition:all 0s;transition:all 0s} .a_txt .div3 ul li .a_js2_on{background: 95% center no-repeat;-webkit-transition:all 0s;-moz-transition:all 0s;transition:all 0s} .a_txt .div3 ul li .a_txt2{display:none} .a_txt .div3 ul li .a_txt2 a{height:40px;line-height:40px;font-size:14px} } @media only screen and (min-width: 1152px) and (max-width: 1279px) { .npro dl dt{ height:218px; } .ncase dl dt{ height:246px; } .case .casenr dl dt{ height:184px; } } @media only screen and (min-width: 1024px) and (max-width: 1151px) { .npro dl dt{ height:193px; } .ncase dl dt{ height:219px; } .case .casenr dl dt{ height:164px; } } @media only screen and (min-width: 992px) and (max-width: 1023px) { .npro dl dt{ height:187px; } .ncase dl dt{ height:212px; } .case .casenr dl dt{ height:159px; } } @media only screen and (min-width:860px) and (max-width: 991px) { .npro dl dt{ height:162px; } .ncase dl dt{ height:183px; } .case .casenr dl dt{ height:287px; } } @media only screen and (min-width:768px) and (max-width: 859px) { .npro dl dt{ height:145px; } .ncase dl dt{ height:164px; } .case .casenr dl dt{ height:256px; } } @media only screen and (min-width:640px) and (max-width: 767px) { .npro dl dt{ height:187px; } .ncase dl dt{ height:211px; } .case .casenr dl dt{ height:214px; } } @media only screen and (min-width:540px) and (max-width: 639px) { .npro dl dt{ height:158px; } .ncase dl dt{ height:178px; } .case .casenr dl dt{ height:180px; } } @media only screen and (min-width:425px) and (max-width: 539px) { .npro dl dt{ height:124px; } .ncase dl dt{ height:140px; } .case .casenr dl dt{ height:142px; } } @media only screen and (min-width:375px) and (max-width: 424px) { .npro dl dt{ height:109px; } .ncase dl dt{ height:124px; } .case .casenr dl dt{ height:125px; } } @media only screen and (min-width:320px) and (max-width: 374px) { .npro dl dt{ height:93px; } .ncase dl dt{ height:104px; } .case .casenr dl dt{ height:107px; } } @media only screen and (min-width:0px) and (max-width: 319px) { .npro dl dt{ height:90px; } .ncase dl dt{ height:100px; } .case .casenr dl dt{ height:105px; } } @media(max-width:1440px) { .rslides_tabs{ bottom:30px; } .nnews h1{ font-size:22px; } .pro .promenu ul li{ margin-left: 20px; } } @media(max-width:1360px) { .nav .menu > li{ padding: 0 13px; } } @media(max-width:1280px) { .cont,.cont1{ width:88%; } .nabout img{ max-width:100%; height:auto; } .tel{ margin-left:20px; } .nav .menu > li { padding: 0 8px; } .banner_n .position{ width:88%; margin-left:-44%; } .nkhfw dl { width: 22.75%; margin-right:3%; margin-bottom:20px; margin-top:20px; } .ncase dl{ width:31.3333333%; margin-right:3%; } .npro dl{ width:31.3333333%; margin-right:3%; } .nmenu ul li{ margin-left:14px; } .pro .promenu ul li{ margin-left: 10px; } .about,.news .newsnr{ width:48%; } .case .casenr dl { width: 23.5%; margin-right: 2%; } } @media(max-width:1152px) { .tel, .tel a { font-size: 22px; } .nav .menu > li a{ font-size:14px; } .nkhfw dl dd { font-size: 16px; } .nmenu ul li{ padding: 0 13px; } .pro .promenu ul li a{ padding: 0 20px; } .aboutnr .aboutmore{ margin-top:20px; } } @media(max-width:1023px) { .news .newslist ul li span{ width: 24%; } .news .newslist ul li a{ width:76%; } } @media(max-width:991px) { .header{ height:60px; } .logo img{ height:60px; } .tel{ line-height:60px; } .ntit .ntitnr h3{ font-size:22px; } .rg{ padding-top:14px; } .ncontact .ncontactnr,.map{ width:100%; } .ncontact .ncontactnr{ margin-bottom:20px; padding-top:0; } .map{ height:280px; } .nnews dl dd .nnewsbt{ font-size:18px; } .ntit .ntitnr h3,.nmenu{ width:100%; } .nmenu{ text-align:left; } .npro dl dd{ margin-top:16px; } .pages .pageslf,.pages .pagesrt{ width:100%; text-align:left; } .ncase dl{ margin-top:20px; margin-bottom:20px; } .footer .footernav ul li{ width: 25%; } .footer .footernav ul li:nth-child(5){ clear:both; } .footer .footernav ul li:nth-child(6) { width: 50%; } .iconlist dl{ margin-bottom:20px; } .iconlist dl:nth-child(2){ border-right:none; } .diepic .swiper-slide dl dd h5{ font-size:18px; } .diepic .swiper-slide .promore{ margin-top:20px; } .diepic .swiper-slide dl dd{ padding: 0 0 0 20px; } .diepic .swiper-slide dl dd p{ font-size:15px; line-height:30px; } .pro .promenu ul li a{ padding: 0 15px; } .pro .tit,.pro .promenu{ width:100%; float:none; } .pro .promenu{ margin-top:20px; } .news .newslist ul li a { width: 72%; } .news .newslist ul li span { width: 28%; } .aboutnr .aboutlf .aboutjs{ line-height:25px; } .case .casenr dl { width: 49%; } .case .casenr dl:nth-child(2){ margin-right:0; } .pro { margin-top: 30px; } .iconlist dl dd{ font-size:16px; } .message ul li,.message ul li input{ width:100%; } } @media(max-width:859px) { .nkhfw dl { width: 31.3333%; } .nkhfw dl:nth-child(4n){ margin-right:3%; } .nkhfw dl:nth-child(3n){ margin-right:0; } .nmenu ul li { padding: 0 16px; } } @media(max-width:768px) { .botlf,.botrt{ text-align:center; } } @media(max-width:767px) { .ncase dl,.npro dl{ width:48.5%; } .ncase dl:nth-child(3n),.npro dl:nth-child(3n){ margin-right: 3%; } .ncase dl:nth-child(2n),.npro dl:nth-child(2n) { margin-right:0; } .nmenu ul li { padding: 0 10px; } .diepic .swiper-slide dl dt{ width:100%; } .diepic .swiper-slide dl dd{ width:100%; margin-top:10px; padding:0; } .about, .news .newsnr{ width:100%; } .about{ height:auto; margin-bottom:20px; } .case .casenr dl dd{ font-size:14px; } } @media(max-width:640px) { .nkhfw dl { width: 48.5%; } .nkhfw dl:nth-child(3n){ margin-right:3%; } .nkhfw dl:nth-child(4n){ margin-right:0; } .nkhfw dl:nth-child(2n){ margin-right:0; } .rslides img{ width: 140%; margin-left: -20%; } .banner .prev,.banner .next{ display:none; } .rslides_tabs { bottom: 10px; } .diepic .swiper-slide{ width:88%; } } @media(max-width:540px) { .nnews dl dt,.nnews dl dd{ width:100%; } .nnews dl dd .nnewsbt{ font-size:16px; } .footer .footernav ul li,.footer .footernav ul li:nth-child(6){ width: 33.3333%; } .footer .footernav ul li:nth-child(4){ clear:both; } .footer .footernav ul li:nth-child(5){ float:left; clear: none; } .footer .footernav ul li p{ display:none; } .rslides img{ width: 150%; margin-left: -25%; } } @media(max-width:500px) { .tel{ display:none; } .nkhfw dl{ margin-top:15px; margin-bottom:15px; } .diepic .swiper-slide .promore{ width:100px; } .diepic .swiper-slide dl dd h5 { font-size: 16px; } .diepic .swiper-slide dl dd p{ font-size:14px; } } @media(max-width:425px) { .nkhfw dl dd{ font-size:14px; } .nmenu ul li { margin-left: 10px; } .aboutnr .aboutlf,.aboutnr .aboutimg{ width:100%; } .aboutnr .aboutlf{ margin-bottom:20px; } .aboutnr .aboutimg{ text-align:center; } } @media(max-width:375px) { .news .newslist ul li a { width: 66%; } .news .newslist ul li span{ width:34%; } } .ab_pages{clear:both;padding:20px 0;font-size:14px;text-align:center; overflow:hidden} .ab_pages ul{display:inline-block;margin:0 auto;padding:0} .ab_pages ul a{color:#555;display:block;padding: 5px 11px; border: 1px solid #ddd;float: left;margin: 0 5px;font-size:12px} .ab_pages ul a.page-num-current{ background:#c5161d; color:#fff; } .ab_pages ul a:hover{ background:#ddd; color:#fff;} .ab_pages .page-status{ display:none;} .ab_pages span.page-num{ display:none;}