.swiper-container { width: 100%; height: 100%; } @font-face { font-family: 'ziti'; src: url("../img/DINPro-Medium.otf"); } .swiper-slide { text-align: center; font-size: 18px; background: #fff; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .bg-color { background: #fff; } .top_bar { height: 27px; line-height: 27px; border-top: 6px solid #0079c3; } .top_bar .tb-rig { float: right; width: 272px; height: 26px; line-height: 21px; background: url("../img/top.png") no-repeat center center; } .top_bar .tb-rig ul{ width: 210px; margin: 0 auto; } .top_bar .tb-rig ul li { position: relative; float: left; width: 50%; text-indent: 30px; color: #fff; z-index: 100; } .top_bar .tb-rig ul li a{ color: #fff; } .top_bar .tb-rig ul li:nth-child(1){ background: url("../img/t-mes.png") no-repeat center left; } .top_bar .tb-rig ul li:nth-child(2){ background: url("../img/t-ewm.png") no-repeat top left; } .top_bar .tb-rig ul li:nth-child(2) img{ display: none; padding-top: 5px; max-width: 100%; } .top_bar .tb-rig ul li:nth-child(2):hover img{ display: block; } .head { height: 98px; background: #fff; } .logo{ float: left; } .logo img { display: block; float: left; padding-top: 9px; max-width: 100%; } .logo-tit{ float: left } .logo-tit h3{ color: #555555; font-weight: bold; font-size: 27px; } .logo-tit p{ color: #666; font-size: 14.5px; text-transform: uppercase; } .logo1:before{ display: block; float: left; content: ''; width: 1px; height: 37px; background: #ededed; margin: 0 22px; } .logo1{ float: left; width: 435px; margin-top: 11px; } .logo1 b{ color: #555555; font-size: 24px; display: block; margin-top: -10px; } .logo1 p{ color: #555; font-size: 16px; } .head h1.head-title{ display: block; float: left; font-size:26px; color:#333333; line-height: 55px; font-weight: bold; max-width:635px; overflow: hidden; margin-top:40px; } .head .QR_code{ float: right; margin-left:115px; width:100px; height: 100px; margin-top:17px; font-size:0; line-height:100px; text-align: center; } .head .QR_code img{ display: inline-block; vertical-align: middle; width:100%; height: 100%; } .head-group{ overflow: hidden; float: right; margin-top:20px; } .head-group .tel { line-height: 30px; font-size:14px; color:#676767; padding-left: 40px; background: url("../img/h-tel.png") no-repeat center left; } .head-group .tel p{ color: #555555; font-size: 16px; margin-bottom: -5px; } .head-group .tel span{ font-size:26px; color:#0079c3; font-weight: bold; display: block; } .nav-bar { background: #f3f3f3; height: 57px; font-size:0; } .nav-bar ul { overflow: hidden; display: inline-block; } .nav-bar ul li { float: left; line-height: 57px; } .nav-bar ul li a { position: relative; display: block; font-size: 16px; color: #555555; width:150px; text-align: center; } .nav-bar ul li a::after{ display: block; content: ''; width: 1px; height: 15px; background: #d6d4d4; float: right; margin-top: 22px; } .nav-bar ul li a:hover, .nav-bar ul li.active a { background: #0079c3; color: #fff; } .nav-bar ul li a:hover::after, .nav-bar ul li.active a::after{ display: none; } .nav-bar ul li:last-child a::after{ display: none; } .banner { position: relative; height: 626x; } .banner .bannerSwiper { height:626px; } .banner .swiper-slide { position: relative; height: 626px; float: left; } .banner .swiper-slide a{ display:block; width:100%; height: 100%; } .ban-next{ width: 27px!important; height: 52px!important; background: url("../img/b-next.png") no-repeat center center!important; right: 50px!important; } .ban-next:after{ display: none; } .ban-prev{ width: 27px!important; height: 52px!important; background: url("../img/b-prev.png") no-repeat center center!important; left: 50px!important; } .ban-prev:after{ display: none; } #main { overflow: hidden; } /*鏂伴椈婊氬姩*/ .in-news{ width: 100%; height: 70px; position: relative; margin-top: -37px; z-index: 1000; } .in-news .warpper{ width: 1100px; height: 70px; background: #fff; padding: 0 50px; } .in-news strong{ display: block; float: left; color: #555555; font-size: 16px; line-height: 70px; } .nlist{ width: 100%; position: relative; } .xinwen{ width: 500px; float: left; height: 70px; margin-left: 30px; } .xinwen a{ color: #555555; font-size: 14px; display: block; line-height: 70px; float: left; } .xw-dian{ width: 115px!important; position: absolute; right: 0; top: 12px; } .xw-dian span{ color: #d4d4d4; font-size: 20px; background: none!important; margin-right: 17px; display: block; width: 27px; text-align: center; float: left; opacity: 1!important; font-weight: bold; } .xw-dian span:last-child{ margin-right: 0; } .xw-dian .swiper-pagination-bullet-active{ color: #0079c3; } .xw-dian .swiper-pagination-bullet-active:after{ display: block; content: ''; width: 100%; height: 2px; background: #0079c3; } /*浜у搧*/ .in-pro{ width: 100%; position: relative; background: url("../img/pro-bg.jpg") no-repeat center center; padding: 100px 0 56px 0; margin-top: -33px; } .title{ text-align: center; } .title h3{ color: #0079c3; font-size: 32px; font-weight: bold; } .title p{ font-size: 14px; color: #555555; } .title p:after{ display: block; content: ''; width: 40px; height: 4px; background: #0079c3; margin: 0 auto; margin-top: 17px; } .cp-center{ margin-top: 30px; width: 100%; } .cp-type{ width: 248px; float: left; } .cp-type .pro-title{ width: 100%; height: 94px; background: #0079c3 url("../img/protitle.png") no-repeat center left 23px; } .pro-title h3{ color: #fff; font-size: 20px; font-weight: bold; padding-left: 78px; padding-top: 27px; } .pro-title p{ color: #fff; font-size: 12px; padding-left: 78px; } .cp-type ul { padding: 10px 0 27px 0; background: #fff; } .cp-type ul li{ width: 100%; height: 50px; line-height: 50px; border-bottom: 1px solid #e1e1e1; background: url("../img/pjt-h.png") no-repeat center right 26px; } .cp-type ul li.active,.cp-type ul li:hover{ background: #1484c8 url("../img/pjt.png") no-repeat center right 26px; } .cp-type ul li a{ color: #555555; font-size: 16px; display: block; text-indent: 9px; padding-right: 65px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .cp-type ul li.active a,.cp-type ul li:hover a{ color: #fff; } .cp-tel{ width: 100%; background: url("../img/cptel.jpg") no-repeat center top; } .cp-tel>div{ width: 100%; height: 109px; background: url("../img/ctel.png") no-repeat center left 23px; } .cp-tel>div>p{ color: #fff; font-size: 14px; padding-left: 70px; padding-top:30px; } .cp-tel>div>strong{ color: #fff; font-size: 22px; display: block; padding-left: 70px; } .cp-tel .cptel-more{ width: 100%; height: auto; } .cp-tel .cptel-more span{ color: #555; display: block; padding: 13px 0; border-bottom: 1px dashed #e1e1e1; } .cp-list{ width: 925px; float: right; } .cp-list ul li{ width: 272px; height: 239px; float: left; padding: 13px; margin-right: 15px; margin-bottom: 15px; background:#fff url("../img/jia.png") no-repeat right bottom; } .cp-list ul li:nth-child(3n){ margin-right: 0; } .cp-img{ width: 270px; height: 200px; } .cp-img img{ display: block; width: 100%; height: 100%; object-fit: cover; } .cp-list ul li:hover{ background:#0079c3 url("../img/jia-h.png") no-repeat right bottom; } .cp-list ul li h3{ color: #555555; font-size: 14px; line-height: 55px; text-align: center; } .cp-list ul li:hover h3{ color: #fff; } /**/ .in-adv{ width: 100%; position: relative; padding: 54px 0; background: url("../img/adv-bg.jpg") no-repeat center center; } .title1{ text-align: center; } .title1 h3{ color: #fff; font-size: 32px; font-weight: bold; } .title1 p{ font-size: 14px; color: #fff; } .title1 p:after{ display: block; content: ''; width: 40px; height: 4px; background: #fff; margin: 0 auto; margin-top: 17px; } .adv-center{ width: 1112px; height: 355px; background: #fff; padding: 40px 48px 20px 40px; margin-top: 31px; } .adv-left{ width: 560px; float: left; } .adv-left img{ max-width: 100%; } .adv-right{ width: 515px; float: right; } .adv-title ul li{ width: 118px; height: 103px; border-radius: 23px 0 23px 0; margin-right: 13px; text-align: center; float: left; } .adv-title ul li:nth-child(1){ background: #f7f7f7 url("../img/a1.png") no-repeat center top 10px; } .adv-title ul li:nth-child(2){ background: #f7f7f7 url("../img/a2.png") no-repeat center top 10px; } .adv-title ul li:nth-child(3){ background: #f7f7f7 url("../img/a3.png") no-repeat center top 10px; } .adv-title ul li:nth-child(4){ background: #f7f7f7 url("../img/a4.png") no-repeat center top 10px; } .adv-title ul li:last-child{ margin-right: 0; } .adv-title ul li h3{ color: #555555; font-size: 16px; padding-top: 50px; } .adv-title ul li p{ color: #555555; font-size: 12px; display: block; text-transform: uppercase; } .adv-title ul li.on h3{ color: #fff; } .adv-title ul li.on p{ color: #fff; } .adv-title ul li.on:nth-child(1){ background: #0079c3 url("../img/a11.png") no-repeat center top 10px; } .adv-title ul li.on:nth-child(2){ background: #0079c3 url("../img/a22.png") no-repeat center top 10px; } .adv-title ul li.on:nth-child(3){ background: #0079c3 url("../img/a33.png") no-repeat center top 10px; } .adv-title ul li.on:nth-child(4){ background: #0079c3 url("../img/a44.png") no-repeat center top 10px; } .adv-tit .num{ width: 61px; height: 57px; background: #0079c3; text-align: center; line-height: 57px; float: left; font-size: 44px; color: #fff; font-family: ziti; margin-right: 16px; } .adv-tit .adv-bt h3{ color: #555555; font-size: 22px; font-weight: bold; } .adv-tit .adv-bt small{ color: #717171; font-size: 14px; text-transform: uppercase; } .adv-text{ padding-top: 28px; color: #888888; font-size: 14px; line-height: 26px; padding-bottom: 40px; } /*鍏徃绠€浠?/ .in-com{ width: 100%; padding: 74px 0 78px 0; background: #f7f7f7; position: relative; } .com-center{ padding-top: 40px; } .com1{ width: 408px; float: left; } .com1 strong{ color: #0079c3; font-size: 30px; } .com1 h3{ color: #555555; font-weight: bold; font-size: 26px; } .com1 h3:after{ display: block; content: ''; width: 33px; height: 2px; background: #0079c3; margin: 15px 0; } .com1 p{ color: #555555; font-size: 14px; line-height: 24px; padding-bottom: 20px; } .c-pic{ width: 100%; height: 210px; overflow: hidden; } .com1 img{ display: block; width: 100%; height: 100%; object-fit: cover; padding-bottom:20px; } .com1 a{ color: #555555; font-size: 16px; font-weight: bold; background: url("../img/line.jpg") no-repeat left bottom; height:30px; display: block; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .com1:hover a{ color: #0079c3; font-weight: bold; font-style: italic; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .com2{ width: 303px; float: left; margin-left: 45px; } .com2 .com2-1{ width: 230px; height: 128px; background: #fff; padding: 35px 33px; margin-bottom: 20px; } .com2-1 .com2-title{ background: url("../img/c-ho.png") no-repeat center left; } .com2-title { padding-left: 50px } .com2-title h3{ color: #555555; font-weight: bold; font-size: 20px; } .com2-title small{ color: #b6b4b4; font-size: 12px; text-transform: uppercase; font-weight: lighter; display: block; } .com2-1 p{ color: #555555; font-size: 14px; font-weight: lighter; padding-top: 15px; line-height: 24px; } .com2-1 a{ color: #555555; font-size: 14px; font-weight: lighter; padding-top: 15px; display: block; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .com2 .com2-2{ width: 230px; height: 128px; background: #fff; padding: 35px 33px; } .com2-2 .com2-title{ background: url("../img/c-co.png") no-repeat center left; } .com2-2 p{ color: #555555; font-size: 14px; font-weight: lighter; padding-top: 15px; line-height: 24px; } .com2-2 a{ color: #555555; font-size: 14px; font-weight: lighter; padding-top: 15px; display: block; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .com2-1:hover a{ color: #0079c3; font-weight: bold; font-style: italic; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .com2-2:hover a{ color: #0079c3; font-weight: bold; font-style: italic; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .com3{ float: right; width: 425px; } .com3 img{ max-width: 100%; } /*宸ョ▼妗堜緥*/ .in-case{ width: 100%; position: relative; padding: 70px 0 76px 0; } .case-list{ width: 100%; padding-top: 28px; } .case-list .swiper-slide a{ display: block; width: 100%; height: 100%; } .case-img{ width: 100%; height: 257px; position: relative; overflow: hidden; } .case-img img{ display: block; width: 100%; height: 100%; object-fit: cover; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .anli .swiper-slide:hover .case-img img{ transform: scale(1.04); -webkit-transform: scale(1.04); -moz-transform: scale(1.04); -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .case-text{ width: 100%; height: 77px; line-height: 77px; background: #f8f8f8 url("../img/r-jt.png") no-repeat center right 30px; text-indent: 30px; color: #636363; font-size: 16px; text-align: left; } .anli .swiper-slide:hover:hover .case-text{ color: #0079c3; } .case-ho{ width: 100%; height: 257px; position: absolute; background:rgba(0,0,0,0.5); top: -100%; z-index: 100; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .case-ho img{ display: block; margin: 97px auto 0; } .case-ho span{ color: #fff; font-size: 14px; display: block; text-align: center; } .anli .swiper-slide:hover .case-ho{ top: 0; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } /*鍦ㄧ嚎鐣欒█*/ .in-mes{ width: 100%; position: relative; padding: 45px 0 50px 0; background: url("../img/mes.jpg") no-repeat center center; } .mes-right{ width: 555px; float: right; } .mes-right h3{ color: #fff; font-size: 34px; text-transform: uppercase; font-weight: bold; line-height: 38px; } .mesform{ margin-top: 15px; } .mesform input{ width: 272px; height: 52px; display: block; border: none; background: #fff; text-indent: 15px; line-height: 52px; color: #333; float: left; margin-right: 10px; margin-bottom: 10px; } .mesform input:nth-child(3){ margin-right: 0; } .mesform textarea{ width: 100%; height: 120px; display: block; border: none; background: #fff; text-indent: 15px; line-height: 52px; color: #333; float: left; margin-right: 10px; margin-bottom: 10px; } .mesform input::-webkit-input-placeholder{ color: #505050!important; } .mesform textarea::-webkit-input-placeholder{ color: #505050!important; } .mesform .verify{ width: 272px; height: 52px; float: right; } .mesform .verify img{ display: block; width: 100%; height: 100%; } .mesform .submit{ display: block; width: 555px; height: 52px; line-height: 52px; background: #65c8d3; text-align: center; font-weight: bold; font-size: 20px; color: #fff; } .mesform .submit:hover{ background: #0079c3; } /*鏂伴椈*/ .in-info{ width: 100%; position: relative; padding: 75px 0 40px 0; } .news-center{ padding-top: 40px; } .news-left{ width: 590px; float: left; position: relative; height: 367px; } .n-img{ width: 590px; height: 367px; position: relative; } .n-img img{ display: block; width: 100%; height: 100%; object-fit: cover; } .n-one{ width: 450px; height:80px; background: #f7f7f7; position: absolute; bottom: 0; right: 0; } .news-time{ width: 88px; height: 80px; background: #f4f4f4; float: left; text-align: center; } .news-time strong{ color: #5c5c5c; font-size: 30px; display: block; padding-top: 10px; width: 100%; } .news-time span{ display: block; color: #5c5c5c; font-size: 12px; } .n-one .n-tit{ width: 340px; float: right; } .n-one .n-tit h3{ color: #5c5c5c; font-size: 16px; font-weight: bold; padding-top: 15px; } .n-one .n-tit p{ color: #8a8a8a; font-size: 12px; } .news-left:hover .news-time{ background: #0079c3; } .news-left:hover .news-time strong,.news-left:hover .news-time span{ color: #fff; } .news-left:hover .n-tit h3{ color: #0079c3; } .news-right{ width: 557px; float: right; } .news-right ul li{ width: 100%; height: 80px; padding-bottom:25px; margin-bottom: 25px; border-bottom: 1px solid #e9e9e9; } .news-right ul li .n-tit{ width: 450px; float: right; } .news-right ul li .n-tit h3{ color: #5c5c5c; font-size: 18px; font-weight: bold; } .news-right ul li .n-tit p{ color: #8a8a8a; font-size: 14px; } .news-right ul li:hover .n-tit h3{ color: #0079c3; } .news-right ul li:hover .news-time{ background: #0079c3; } .news-right ul li:hover .news-time strong,.news-right ul li:hover .news-time span{ color: #fff; } /*搴曢儴*/ .foot{ width: 100%; position: relative; background: url("../img/foot.jpg") no-repeat center center; padding-top: 85px; border-top: 14px solid #0079c3; padding-bottom: 94px; } .foot1{ width: 100%; padding-bottom: 22px; border-bottom: 1px solid rgba(255,255,255,0.32); } .f-logo{ float: left; } .f-logo img{ float: left; } .flogo-tit{ float: right; margin-left: 15px; padding-top: 10px; } .flogo-tit h3{ color: #fff; font-weight: bold; font-size: 24px; letter-spacing: 2px; line-height: 25px; } .flogo-tit p{ color: #fff; font-size: 13px; line-height: 25px; text-transform: uppercase; letter-spacing: 0; } .f-tel{ float: right; width: 206px; background: url("../img/f-tel.png") no-repeat center left; padding-left: 40px; } .f-tel p{ color: #fff; font-size: 14px; line-height: 25px; } .f-tel strong{ color: #0079c3; font-size: 26px; display: block; line-height: 25px; } .foot2{ margin-top: 45px; } .f1{ width: 290px; float: left; } .foot2 h3{ color: #fff; font-size: 16px; font-weight: bold; padding-bottom: 25px; } .foot2 h3 span{ color: #919191; } .f1 ul li{ width: 33%; float: left; text-align: left; } .f1 ul li a{ color: #9c9c9c; font-size: 14px; line-height: 26px; display: block; } .f1 ul li:hover a{ color: #0079c3; } .f2{ width: 230px; float: left; margin-left: 105px; } .f2 p{ color: #9c9c9c; font-size: 14px; line-height: 26px; } .f3{ width: 250x; float: left; margin-left: 90px; } .f3 strong{ color: #a7a7a7; font-size: 16px; } .f3 p{ color: #9c9c9c; font-size: 14px; line-height: 26px; } .f4{ width: 130px; float: right; } .f4 img{ max-width: 100%; display:block; margin:0 auto; } .f4 p{ text-align: center; color: #ffffff; font-size: 14px; line-height: 26px; } .foot-admin{ line-height: 72px; background: #141414; } .foot-admin{ color: #a4a4a4; font-size: 14px; } .foot-admin a{ color: #a4a4a4; } .foot-l{ float: left; color: #a4a4a4; } .foot-r{ float: right; } /*瀹㈡湇*/ #fu{ position: fixed; right: 86px; z-index: 999; top: 40%; } .fudong{ transform: translateX(150px); } #fu .side{ position: absolute; left: 0px; height: 50px; width: 50px; top: -58px; background: url("../img/ful1.png") center no-repeat; cursor: pointer; border: 1px solid #c4c5c7; border-radius: 50%; } #fu .side2{ position: absolute; left: -96px; height: 50px; width: 50px; top: -58px; background: url("../img/ful2.png") center no-repeat; cursor: pointer; display: none; border: 1px solid #c4c5c7; border-radius: 50%; } #fu ul li{ width: 50px; height: 50px; margin-top:5px; cursor: pointer; position: relative; border: 1px solid #c4c5c7; border-radius: 50%; } #fu ul li a{ display: block; width: 100%; height: 100%; } #fu ul li:nth-child(1){ background: url("../img/qq.png") no-repeat center center; } #fu ul li:nth-child(2){ background: url("../img/wx.png") no-repeat center center; } #fu ul li:nth-child(3){ background: url("../img/f-tel1.png") no-repeat center center; } #fu ul li:nth-child(4){ background: url("../img/f-top.png") no-repeat center center; } #fu ul li:nth-child(2) p{ position: absolute; left: -103px; top: -14px; visibility: hidden; opacity: 0; width: 101px; } #fu ul li:nth-child(2) p img{ max-width: 100%; } #fu ul li:nth-child(3) p{ position: absolute; left: -160px; top: 0; height: 50px; line-height: 50px; color: #fff; font-size:18px; background: #0664be; width: 155px; text-align: center; visibility: hidden; opacity: 0; } #fu ul li:nth-child(2):hover p{ visibility: visible; opacity: 1; } #fu ul li:nth-child(3):hover p{ visibility: visible; opacity: 1; } /*鍐呴〉*/ .nei-banner img{ max-width: 100%; } .rig-title{ height: 65px; line-height: 65px; border-bottom: 1px solid #e1e1e1; } .rig-title .crumbs{ color: #4c4c4c; font-size: 14px; background: url(../images/home-icon.png) no-repeat left center; padding-left: 30px; } .rig-title .crumbs a{ color: #4c4c4c; font-size: 14px; } .nei-title{ text-align: left; } .nei-title h3{ color: #0079c3; font-size: 32px; font-weight: bold; } .nei-title h3:after{ display: block; content: ''; width: 40px; height: 4px; background: #0079c3; margin-top:10px } .about{ margin-top: 30px; } .about-img{ width: 657px; height: 306px; float: left; } .about-img img{ display: block; width: 100%; height: 100%; object-fit: cover; } .about-text{ width: 543px; height: 306px; float: right; background: #0079c3; position: relative; } .about-title{ position: absolute; left: 50%; top: 40%; transform: translate(-50%,-50%); width:80%; } .about-title img{ float: left; padding-top: 10px; padding-right: 10px; } .about-title h4{ color: #fff; font-size: 27px; font-weight: bold; } .about-title p{ color: #fff; font-size: 15px; text-transform: uppercase; } .about-tel{ position: absolute; left: 50%; top: 65%; transform: translate(-50%,-50%); width:220px; background: url("../img/f-tel.png") no-repeat center left; padding-left: 40px; } .about-tel p{ color: #fff; font-size: 14px; line-height: 25px; } .about-tel strong{ color: #fff; font-size: 26px; display: block; line-height: 25px; } .about-neirong{ padding-top: 26px; } .about-neirong p{ color: #4c4c4c; font-size: 14px; line-height: 26px; } .about-case{ width: 100%; position: relative; padding: 70px 0; background: #f7f7f7; } .about-case .case-text{ background: #fff url("../img/r-jt.png") no-repeat center right 30px; } /*浜у搧椤甸潰*/ .npro-list ul li{ background: #eae8e8 url(../img/jia.png) no-repeat right bottom; } .pro-other .xinwen-top ul li .box h4{ border-bottom: 0!important; margin-bottom: 0!important; padding-bottom: 0!important; } .pro-other .xinwen-top ul li .img{ height: 200px!important; } /*鏂伴椈*/ .xinwen-top{ width: 100%; padding-bottom: 50px; } .xinwen-top ul li{ width: 32%; float: left; margin-right: 2%; border-bottom: 1px solid #eee; } .xinwen-top ul li:nth-child(3){ margin-right: 0; } .xinwen-top ul li .img{ width: 100%; height:250px; overflow: hidden; } .xinwen-top ul li .img img{ display: block; width: 100%; height: 100%; object-fit: cover; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .xinwen-top ul li:hover .img img{ transform: scale(1.04); -webkit-transform: scale(1.04); -moz-transform: scale(1.04); -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .xinwen-top ul li .box{ padding: 20px; } .xinwen-top ul li .box h4{ color: #555; font-size: 16px; padding:0 0 20px 0; border-bottom: 1px solid #eee; margin-bottom: 10px; } .xinwen-top ul li:hover{ border-bottom: 1px solid #0079c3; } .xinwen-top ul li .box p{ font-size: 14px; color: #666; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; display: -webkit-box; } .xinwen-top ul li .box .time { color: #999999; line-height: 1.1; border-top: 1px solid #eee; padding-top: 20px; margin-top: 20px; } .xinwen-top ul li .box .time span { display: block; float: right; font-size: 14px; color: #0058b1; } .xinwen-top ul li:hover .box h4{ color: #0079c3; } .xinwen-bottom{ position: relative; width: 100%; } .xinwen-bottom ul li{ width: 100%; padding: 20px 0; border-bottom: 1px solid #eee; margin-bottom: 20px; } .xinwen-bottom ul li .img{ width: 25%; float: left; height: 150px; overflow: hidden; } .xinwen-bottom ul li .img img{ display: block; width: 100%; height: 100%; object-fit: cover; -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .xinwen-bottom ul li:hover .img img{ transform: scale(1.04); -webkit-transform: scale(1.04); -moz-transform: scale(1.04); -webkit-transition: 300ms 0s all ease; -moz-transition: 300ms 0s all ease; -ms-transition: 300ms 0s all ease; -o-transition: 300ms 0s all ease; transition: 300ms 0s all ease; } .xinwen-bottom ul li .box{ width: 73%; float: right; } .xinwen-bottom ul li .box h4{ color: #555; font-size: 16px; padding:0 0 20px 0; margin-bottom: 10px; padding-top: 12px; } .xinwen-bottom ul li .box p{ font-size: 14px; color: #666; } .xinwen-bottom ul li .box .time { color: #999999; line-height: 1.1; margin-top: 20px; } .xinwen-bottom ul li .box .time span { display: block; float: right; font-size: 14px; color: #0058b1; } .xinwen-bottom ul li:hover .box h4{ color: #0079c3; } .news-other{ width: 20%; float: right; background: #fff; padding: 2%; } .news-other .nei-title h3{ font-size: 20px; } .news-other .nei-title{ padding-bottom: 30px; } .news-detail-content{ width: 70%; float: left; background: #fff; padding: 2%; } .news-other .xinwen-top ul li{ width: 100%; margin-right: 0; margin-bottom: 2%; } .news-other .xinwen-top ul li .img{ height: 150px; } .news-other .xinwen-top ul li .box h4{ padding: 0 0 10px 0; font-size: 15px; font-weight: bold; border-bottom: none; } .info-news{ background: #f7f7f7; } /*妗堜緥*/ .anli-list{ width: 285px; float: left; margin-right: 20px; overflow: hidden; margin-bottom: 20px; } .anli-list:nth-child(4n){ margin-right: 0; } .anli-list .case-img{ height: 205px; } .anli-list .case-ho{ height: 205px; } .anli-list .case-ho img{ margin: 60px auto 0; padding-bottom: 10px; } .info-case-img{ width: 100%; margin: 0 auto; } .info-case-img img{ display: block; max-width: 100%; text-align: center; margin: 0 auto; } /*鑱旂郴鎴戜滑*/ .info-contact{ margin-top: 30px; width: 100%; } .contact-list{ width: 296px; height:415px; background: #0079c3; padding: 60px 33px; position: relative; float: left; } .contact-title img{ float: left; padding-top: 3px; padding-right: 5px; } .contact-title h4{ color: #fff; font-size: 23px; font-weight: bold; } .contact-title p{ color: #fff; font-size: 12.5px; text-transform: uppercase; } .contact-list ul { margin-top: 25px; margin-bottom: 25px; } .contact-list ul li{ color: #ffffff; font-size: 14px; line-height: 25px; } .contact-map{ width: 838px; float: right; height: 535px; } #dituContent{ width: 100%; height: 100%; } /*鍦ㄧ嚎鐣欒█*/ .info-mes{ background: none; padding: 0; } .info-mes .mes-right{ float: left; } .info-mes .mes-right h3{ color: #333; font-size: 24px; } .info-mes .mesform input{ border: 1px solid #e0dfdf; width: 270px; } .info-mes .mesform textarea{ border: 1px solid #e0dfdf; width: 552px; } .mes-left{ float: right; width: 600px; height: 397px; } .mes-left img{ display: block; width: 100%; height: 100%; object-fit: cover; } .pro-sider { float: left; width: 260px; } .pro-sider .in-title { height: 80px; background: url(../images/i-pro-title.jpg) no-repeat center; text-align: center; line-height: 1; overflow: hidden; } .pro-sider .in-title h3 { margin-top: 20px; font-size: 22px; color: #fff; margin-bottom: 5px; } .pro-sider .in-title em { font-size: 13px; color: #728dbc; } .pro-sider .pro-sider-ul { border: 1px solid #ededed; background: #fff; border-top: none; overflow: hidden; } .pro-sider .pro-sider-ul .ul-li { padding: 0 15px; height: 59px; } .pro-sider .pro-sider-ul .ul-li a { position: relative; height: 58px; line-height: 58px; font-size: 14px; color: #595959; display: block; padding-left: 10px; padding-right: 30px; border-bottom: 1px dashed #ededed; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pro-sider .pro-sider-ul .ul-li a h2{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pro-sider .pro-sider-ul .ul-li a div.icon { position: absolute; width: 16px; height: 16px; text-align: center; line-height: 16px; background: #ededed url(../images/sider-bg-01.png) no-repeat center; border-radius: 50%; right: 8px; top: 50%; margin-top: -8px; font-size: 12px; } .pro-sider .pro-sider-ul .ul-li:hover, .pro-sider .pro-sider-ul .ul-li.active { background: #268ae7; } .pro-sider .pro-sider-ul .ul-li:hover a, .pro-sider .pro-sider-ul .ul-li.active a { border: none; color: #fff; } .pro-sider .pro-sider-ul .ul-li:hover div.icon, .pro-sider .pro-sider-ul .ul-li.active div.icon { background: #0058b1 url(../images/sider-bg-02.png) no-repeat center; } .pro-sider .pro-sider-ul .ul-li:last-child a { border-bottom: none; } .pro-sider .pro-sider-tel { overflow: hidden; height: 100px; line-height: 1; font-size: 20px; color: #0058b1; border: 1px solid #ededed; border-top: none; padding-left: 80px; background: url(../images/sider-tel.png) no-repeat 25px center; } .pro-sider .pro-sider-tel span { display: block; margin: 30px 0 8px; font-size: 14px; color: #808080; } .pro-sider .pro-sider-tel em { letter-spacing: 2px; font-weight: bold; } .m-column-t { position: relative; text-align: center; font-size: 0; } .m-column-t .center { display: inline-block; font-size: 0; } .m-column-t .center h3 { color: #333; font-size: 30px; } .m-column-t .center p { color: #d2d2d2; font-size: 30px; } .m-column-t span { position: absolute; width: 415px; top: 50%; margin-top: -5px; height: 5px; border-bottom: 1px solid #d2d2d2; z-index: 1; } .m-column-t span.mcl { left: 0; } .m-column-t span.mcl em { float: right; } .m-column-t span.mcr { right: 0; } .m-column-t span em { display: block; height: 11px; border-left: 1px solid #d2d2d2; } .textLine { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .textLine3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .textHidden { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .domHidden { overflow: hidden; } .about-main { padding: 20px 0 70px; min-height: 170px; } .about-main .ab-content { float: right; width: 925px; } .about-main .ab-content .title { line-height: 50px; } .about-main .ab-content .title a { color: #333; padding: 0 5px; } .about-main .ab-content .title span.icon-home { color: #535353; } .about-main .ab-content .title em { color: #999; } .about-main .ab-content .ab-conBox { overflow: hidden; background: #fff; min-height: 55px; padding: 30px 45px 40px; } .about-main .ab-content .ab-conBox .de-title { text-align: center; font-size: 20px; color: #333; line-height: 25px; margin-bottom: 8px; } .about-main .ab-content .ab-conBox .sub-co { font-size: 14px; color: #999; text-align: center; line-height: 18px; } .about-main .ab-content .ab-conBox .ab-detail { overflow: hidden; margin-top: 30px; font-size: 14px; color: #777373; line-height: 25px; } .ab-sild { float: left; width: 260px; } .ab-sild .title { position: relative; height: 50px; text-align: center; background: #f3c04b; font-size: 16px; line-height: 50px; color: #fff; border-bottom: 1px solid #fff; } .ab-sild .title span { position: absolute; height: 3px; width: 30px; top: 50%; margin-top: -3px; border-bottom: 1px solid #fff; } .ab-sild .title span em { display: block; height: 7px; border-left: 1px solid #fff; } .ab-sild .title span.stl { left: 35px; } .ab-sild .title span.stl em { float: right; } .ab-sild .title span.str { right: 35px; } .ab-sild .sild-cate { background: #fff; margin-bottom: 20px; } .ab-sild .sild-cate .list { overflow: hidden; } .ab-sild .sild-cate .list li { position: relative; border-bottom: 1px solid #eee; height: 60px; line-height: 60px; } .ab-sild .sild-cate .list li a { display: block; padding-right: 35px; font-size: 14px; color: #333; padding-left: 20px; } .ab-sild .sild-cate .list li:last-child { border-bottom: none; } .ab-sild .sild-cate .list li:hover { border-color: #f3c04b; background: #f3c04b; } .ab-sild .sild-cate .list li:hover a { color: #fff; } .ab-sild .sild-cate .list li:hover:after { color: #fff; } .ab-sild .sild-cate .list li:after { font-weight: bold; right: 20px; top: 0; color: #999; position: absolute; content: "\e904"; font-family: 'icomoon' !important; } .ab-sild .sild-cont { background: #fff; } .ab-sild .sild-cont .cont-list { padding: 20px; } .ab-sild .sild-cont .cont-list ul li { color: #333; padding: 5px 0; padding-left: 60px; font-size: 14px; } .ab-sild .sild-cont .cont-list ul li span { width: 60px; margin-left: -60px; display: block; height: 20px; line-height: 20px; float: left; color: #666; } .pro-center { background: #fff; padding-bottom: 25px; } .pro-center .pro-list { overflow: hidden; padding: 25px 18px 10px; } .pro-center .pro-list ul li { float: left; width: 200px; margin: 0 10px 20px; border: 1px solid #fff; } .pro-center .pro-list ul li:hover { border-color: #f3c04b; } .pro-center .pro-list ul li .img { overflow: hidden; width: 200px; height: 200px; line-height: 200px; text-align: center; font-size: 0; background: #eee; } .pro-center .pro-list ul li .img img { display: inline-block; vertical-align: middle; max-width: 100%; max-height: 100%; } .pro-center .pro-list ul li .title { background: #f7f8fc; height: 40px; line-height: 40px; padding: 0 5px; text-align: center; font-size: 14px; font-weight: bold; color: #333; } .pro-center .pro-list ul li .title:hover { color: #f3c04b; } .page { font-size: 0; text-align: center; } .page .center { display: inline-block; overflow: hidden; } .page .center .page-span { float: left; font-size: 14px; color: #c3c3c3; line-height: 32px; margin-right: 30px; } .page .center .page-list { float: left; overflow: hidden; } .page .center .page-list ul li { float: left; width: auto; min-width: 30px; height: 32px; text-align: center; line-height: 30px; font-size: 14px; margin: 0 4px; padding: 0; border: none; background: transparent; } .page .center .page-list ul li a { min-width: 20px; padding: 0 5px; border: 1px solid #eee; display: block; color: #333; border-radius: 4px; -webkit-border-radius: 4px; overflow: hidden; background: #fff; } .page .center .page-list ul li:hover a { color: #f3c04b; } .page .center .page-list ul li.active a { background: #f3c04b; color: #fff; } .news-center { background: #fff; padding-bottom: 25px; } .news-center .new-list { padding: 45px 45px 0px; } .news-center .new-list ul li { margin-bottom: 35px; border-bottom: 1px solid #eee; } .news-center .new-list ul li a { overflow: hidden; display: block; height: 90px; padding-bottom: 30px; } .news-center .new-list ul li a .img { float: left; width: 130px; height: 90px; background: #eee; line-height: 90px; font-size: 0; text-align: center; } .news-center .new-list ul li a .img img { display: inline-block; vertical-align: middle; max-width: 100%; max-height: 100%; } .news-center .new-list ul li a .info { float: right; width: 690px; } .news-center .new-list ul li a .info h3 { font-size: 14px; font-weight: bold; line-height: 24px; color: #333; } .news-center .new-list ul li a .info em { display: block; font-size: 12px; color: #999; line-height: 16px; margin-bottom: 10px; } .news-center .new-list ul li a .info p { font-size: 14px; line-height: 22px; color: #999; max-height: 44px; overflow: hidden; } .news-center .new-list ul li a:hover h3 { color: #f3c04b; } .message-c { background: #fff; padding: 40px 50px; overflow: hidden; } .message-c .p { font-size: 16px; line-height: 30px; color: #666; margin-bottom: 35px; } .message-c .from input { display: block; height: 38px; line-height: 38px; padding: 0 5px; border: 1px solid #d2d2d2; margin-bottom: 10px; font-size: 14px; color: #333; } .message-c .from input[name=user], .message-c .from input[name=phone] { width: 348px; } .message-c .from textarea { font-size: 14px; color: #333; line-height: 20px; display: block; width: 728px; height: 130px; border: 1px solid #d2d2d2; padding: 5px; margin-bottom: 10px; } .message-c .from .code { overflow: hidden; } .message-c .from .code input[name=code] { width: 258px; float: left; } .message-c .from .code a { display: block; float: left; width: 80px; height: 38px; padding: 1px 0; margin-left: 10px; } .message-c .from .code a img { width: 80px; height: 38px; } .message-c .from .btn { padding-top: 25px; } .message-c .from .btn a { display: block; width: 362px; height: 40px; text-align: center; line-height: 40px; color: #fff; font-size: 16px; background: #8fa4de; } .message-c .from .btn a:hover { background: #8397d0; } .contact-o { background: #fff; overflow: hidden; padding: 40px 0; text-align: center; } .contact-o iframe { width: 830px; height: 500px; margin: 0 auto; }