@charset "utf-8"; .cm { color: #1fb5b0; } .cm2 { color: #29c3ab; } .jianbian { background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); } @font-face { font-family: 'Geometr415BlkBT'; src: url('../font/Geometr415BlkBT.ttf'); } @font-face { font-family: 'Century751No2BT'; src: url('../font/Century751No2BT.TTF'); } .inbanner { width: 100%; height: 700px; position: relative; overflow: hidden; } .inbanner > img { position: absolute; left: 50%; margin-left: -960px; top: 0; width: 1920px; height: 100%; z-index: 0; } .ibcatein { position: absolute; width: 100%; left: 0; top: 50%; z-index: 1; text-align: center; color: #fff; padding: 43px 0 46px; margin-top: -126px; /*background: url('../images/k1.png') center 0 no-repeat;*/ } .ibcatein .cn { font-size: 40px; line-height: 56px; } .ibcatein .en { font-size: 44px; line-height: 48px; font-family: 'Geometr415BlkBT'; text-transform: uppercase; } .ibcatein .svg { display: block; position: absolute; left: 50%; top: 0; z-index: 1; margin-left: -320px; width: 640px; height: 192px; } .ibcatein .svg:before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; right: 0; border: 1px solid rgba(255, 255, 255, 0.5); } .ibcatein .svg svg { overflow: visible; } .ibcatein .path { stroke-dasharray: 1664; stroke-dashoffset: 0; -webkit-animation: dash 20s linear infinite; animation: dash 20s linear infinite; } @-webkit-keyframes dash { from { stroke-dashoffset: 3328; } to { stroke-dashoffset: 0; } } @keyframes dash { from { stroke-dashoffset: 3328; } to { stroke-dashoffset: 0; } } @media screen and (max-width: 1400px) { .ibcatein .cn { font-size: 30px; } .ibcatein .en { font-size: 34px; } } @media screen and (max-width: 750px) { .ibcatein .cn { font-size: 40px; } .ibcatein .en { font-size: 44px; } } .greybg { background-color: #f0f3f6; } .js-qiecon2 { display: none; } .js-qiecon2.on { display: block; } .js-qiecon { position: absolute; left: 200%; top: 0; z-index: -20; opacity: 0; } .js-qiecon.on { position: static; left: 0; top: 0; z-index: 1; opacity: 1; } .pianyi { padding-top: 90px; margin-top: -90px; } .js-qiecon-wrap1, .js-qiecon-wrap2, .js-qiecon-wrap3 { position: relative; width: 100%; overflow: hidden; } .lefthalf { float: left; width: 50%; height: 100%; position: relative; overflow: hidden; } .righthalf { float: right; width: 50%; height: 100%; position: relative; overflow: hidden; } /*.baninfo{ height: 70px; position: relative; z-index: 2; background-color: #f3f5f8; border-bottom: 1px solid #e3e3e3;} .baninfo .cer1{ height: 100%;} .erji{ float: left; font-size: 0; white-space: nowrap; text-align: center; max-width:100%; line-height: 70px;} .erji a{ display: inline-block; width: 128px; height: 70px; position: relative; margin-top:0; color: #333; font-size: 16px; line-height: 70px; vertical-align: top;} .erji a:hover{ color: #09834c;} .erji a.on{ padding-top: 10px; margin-top:-10px; color: #fff; font-weight: bold; background: #09834c url('../images/erjibg.png') center no-repeat;} .tree{ float: right; height: 70px; font-size: 16px; line-height: 70px; color: #666; position: relative;} .tree a{ color: #666; padding: 0 7px;} .tree a:hover,.tree a.leaf{ color: #09834c;} @media screen and (max-width:1050px){ .tree{ display: none;} .erji{ float: none;} } @media screen and (max-width:750px){ .erji a{ width: 180px; max-width: 24%; font-size: 24px;} .bserji a{ max-width: 20%;} }*/ .bneck { width: 100%; position: absolute; left: 0; bottom: 66px; z-index: 3; } .berji { font-size: 0; width: 100%; text-align: center; } .berji a { display: inline-block; width: 164px; font-size: 16px; color: #fff; line-height: 54px; text-align: center; height: 100%; position: relative; overflow: hidden; background-color: #66807f; margin: 10px 15px; border-radius: 8px; } .berji a:before { content: ''; position: absolute; right: 0; top: 20px; z-index: 0; width: 1px; height: 30px; display: none; } .berji a:after { content: ''; position: absolute; left: 50%; bottom: 0px; z-index: 0; margin-left: 0; width: 0; height: 4px; background-color: #0076cd; display: none; -webkit-transition: 0.3s; transition: 0.3s; } .berji a.on:after, .berji a:hover:after { width: 80px; margin-left: -40px; } .berji a.on, .berji a:hover { background-color: #1fb5b0; } @media screen and (max-width: 1320px) { .berji { max-width: 800px; margin: 0 auto; } } @media screen and (max-width: 750px) { .bneck { bottom: 30px; } .berji a { font-size: 28px; width: 200px; } .berji.long4 a { width: 260px; } } a.seemore { display: block; width: 172px; height: 42px; margin: 0 auto; overflow: hidden; position: relative; font-size: 16px; color: #fff; line-height: 42px; text-align: center; border: 2px solid #0292fd; border-radius: 23px; } a.seemore span { position: relative; z-index: 2; display: inline-block; padding-right: 40px; background: url('../images/jtr1.png') right no-repeat; } a.seemore:after { content: ''; position: absolute; left: 0; bottom: 0; z-index: 1; width: 100%; height: 100%; background-image: -webkit-gradient(linear, left top, right top, from(#005ffb), to(#0292fd)); background-image: linear-gradient(to right, #005ffb, #0292fd); -webkit-transition: 0.3s; transition: 0.3s; } a.seemore:hover:after { height: 0; } a.seemore:hover { background-color: #fff; color: #005ffb; } a.seemore:hover span { background-image: url('../images/jtr1h.png'); } a.seemore2 { display: block; width: 172px; height: 42px; margin: 0 auto; overflow: hidden; position: relative; font-size: 16px; color: #1e64c6; line-height: 42px; text-align: center; border: 2px solid #fff; border-radius: 23px; background-color: #fff; } a.seemore2 span { position: relative; z-index: 2; display: inline-block; padding-right: 40px; background: url('../images/jtr1h.png') right no-repeat; } .jello-h:hover { -webkit-animation: jello 1s 0s infinite; animation: jello 1s 0s infinite; } .outnavbg { width: 100%; height: 60px; background-color: #fff; } .outnavbg2 { width: 100%; height: 60px; background-color: #f0f3f6; } .outnav3 { height: 60px; padding: 0; position: relative; z-index: 1; overflow: hidden; text-align: center; } .outnav3 .nav-left, .outnav3 .nav-right { width: 50px; height: 100%; cursor: pointer; position: absolute; top: 0; z-index: 2; background-position: center; background-repeat: no-repeat; display: none; transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; -o-transition: 0.3s; } .outnav3 .nav-left { left: 0; background-image: url('../images/lt3.png'); } .outnav3 .nav-right { right: 0; background-image: url('../images/gt3.png'); } .outnav3 .nav-left:hover, .outnav3 .nav-right:hover { background-color: #81cdf1; } .outnav3 #wrapper22 { width: 100%; height: 100%; position: relative; } .outnav3.on { padding: 0 50px; } .outnav3.on .nav-left, .outnav3.on .nav-right { display: block; } .nav7 { width: 100%; height: 100%; font-size: 0; white-space: nowrap; } .nav7 li { width: 200px; display: inline-block; height: 100%; overflow: hidden; } .nav7.fen2 li { width: 50%; } .nav7.fen3 li { width: 33.3%; } .nav7.fen4 li { width: 25%; } .nav7.fen5 li { width: 20%; } .nav7 li a { display: block; position: relative; background-color: #fff; color: #333; line-height: 60px; font-size: 16px; } .outnavbg2 .nav7 li a { background-color: #f0f3f6; } .nav7 li:hover a, .outnavbg2 .nav7 li:hover a { background-color: #44b6ff; color: #fff; } .nav7 li.on a, .outnavbg2 .nav7 li.on a { background-color: #2194ef; color: #fff; } @media screen and (max-width: 750px) { .nav7 li a { font-size: 26px; } } .main { position: relative; margin: 80px 0 90px; padding-right: 440px; } .mainleft { width: 100%; min-height: 1000px; } .mainright { width: 360px; position: absolute; top: 0; right: 0; z-index: 1; } .sdbox { width: 100%; } .sdbox .title { height: 50px; position: relative; margin-bottom: 40px; line-height: 50px; padding-bottom: 13px; border-bottom: 1px solid #e1e1e1; } .sdbox .title h5 { float: left; font-size: 24px; color: #333; font-weight: bold; } .sdbox .title a.more { float: right; font-size: 14px; color: #999; padding-right: 18px; background: url('../images/gt-sd.png') right no-repeat; } .twlist { overflow: hidden; max-height: 890px; } .twlist li { text-align: center; border: 1px solid #e6e6e6; margin-bottom: 20px; } .twlist li a { display: block; position: relative; } .twlist .pic { width: 100%; height: 0; padding-bottom: 62.5%; position: relative; } .twlist li h3 { font-size: 14px; color: #666; line-height: 52px; height: 52px; overflow: hidden; padding: 0 1em; -webkit-transition: 0.3s; transition: 0.3s; } .twlist li:hover h3 { color: #1fb5b0; } .atc-h { margin-bottom: 18px; } .atc-h h1 { font-size: 26px; color: #333; line-height: 50px; font-weight: bold; margin-bottom: 12px; } .atc-date { font-size: 16px; color: #999; line-height: 50px; padding-left: 5px; } .atc-date span { display: inline-block; padding-left: 36px; margin-right: 50px; background-position: 0 center; background-repeat: no-repeat; } .atc-date span.clock { background-image: url('../images/clock.png'); } .atc-date span.clerk { background-image: url('../images/clerk.png'); } .atc-date span.click { background-image: url('../images/click.png'); margin-right: 0; } .atc-con { padding: 30px 0 50px; font-size: 16px; line-height: 38px; color: #333; text-align: justify; border-bottom: 1px solid #e1e1e1; border-top: 1px solid #e1e1e1; } .atc-con img { max-width: 100%; } .atc-con a { color: #29c3ab; } .atc-pn { overflow: hidden; text-align: center; position: relative; height: 36px; line-height: 36px; margin-top: 32px; } .atc-pn a { width: 38%; height: 100%; color: #666; font-size: 16px; position: relative; z-index: 1; overflow: hidden; } a.atc-prev { float: left; text-align: left; padding-left: 18px; background: url('../images/sjl1.png') left no-repeat; } a.atc-prev:hover { background-image: url('../images/sjl1h.png'); } a.atc-next { float: right; text-align: right; padding-right: 18px; background: url('../images/sjr1.png') right no-repeat; } a.atc-next:hover { background-image: url('../images/sjr1h.png'); } a.atc-ret { display: inline-block; vertical-align: top; width: 20%; } a.atc-prev:hover, a.atc-next:hover { color: #1fb5b0; } a.atc-ret:hover { color: #1fb5b0; } @media screen and (max-width: 1600px) { .main { padding-right: 400px; } } @media screen and (max-width: 1300px) { .main { padding-right: 0; } .mainleft { width: 100%; min-height: 0; } .mainright { display: none; } } @media screen and (max-width: 960px) { .videowrap { padding-bottom: 60%; height: 0; } .video { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; } a.atc-prev, a.atc-next { width: 25%; } } @media screen and (max-width: 750px) { .main { margin: 50px 0 60px; } .atc { padding: 0 10px; border: 0 none; } .atc-h h1 { font-size: 34px; line-height: 50px; margin-bottom: 20px; } .atc-date { font-size: 28px; padding: 10px 20px; } .atc-con { font-size: 30px; line-height: 48px; } .atc-con div, .atc-con p, .atc-con span { font-size: 30px !important; line-height: 48px!important; } .atc-pn a { font-size: 30px; } .atc-pn { height: 50px; line-height: 50px; } a.atc-ret { width: 25%; } .atc-con img { width: 100%; } } .helplist { padding: 100px 0; } .zpone { cursor: pointer; position: relative; background-color: #fff; padding-left: 120px; padding-right: 180px; } .helplist li:nth-child(odd) .zpone { background-color: #f7f7f7; } .zpone h3 { font-size: 18px; color: #333; line-height: 60px; overflow: hidden; font-weight: bold; position: relative; padding-left: 52px; padding-top: 20px; padding-bottom: 20px; } .zpone h3:before { content: ''; position: absolute; left: 0; top: 38px; z-index: 0; width: 24px; height: 24px; background: #1fb5b0 url('../images/wen1.png') center no-repeat; } .zpone i { position: absolute; right: 120px; top: 0; z-index: 1; width: 60px; height: 100%; background: url('../images/jtd1-wen.png') center no-repeat; } .helplist li.on .zpone i { background-image: url('../images/jtu1-wen.png'); } .helplist li.on .zpone { background-color: #1fb5b0; } .helplist li.on:nth-child(odd) .zpone { background-color: #1fb5b0; } .helplist li:hover .zpone h3 { color: #1fb5b0; } .helplist li.on .zpone h3 { color: #fff; } .helplist li.on .zpone h3:before { background: #ffffff url('../images/wen1h.png') center no-repeat; } .zpone, .zpone h3, .zpone i, .zpone h3:before { -webkit-transition: 0.6s; transition: 0.6s; } .zpcon { display: none; padding: 40px 120px 42px; border-bottom: 1px solid #ddd; color: #666; line-height: 32px; font-size: 16px; text-align: justify; } .zpconin { color: #666; line-height: 32px; font-size: 16px; padding-left: 52px; position: relative; } .zpconin:before { content: ''; position: absolute; left: 0; top: 4px; z-index: 0; width: 24px; height: 24px; background: #1fb5b0 url('../images/da1.png') center no-repeat; } .zpcon h4 { font-size: 18px; color: #333; } @media screen and (max-width: 1240px) { .helplist { padding: 40px 0 20px; } .zpone { padding-left: 60px; padding-right: 90px; } .zpone i { right: 30px; } .zpcon { padding: 40px 60px; } } @media screen and (max-width: 750px) { .zpone { padding-left: 20px; padding-right: 60px; } .helplist .zpone h3 { font-size: 32px; } .zpone i { right: 0; } .zpcon { font-size: 30px; line-height: 48px; padding: 30px; } .zpconin { padding-left: 30px; } .zpconin { font-size: 30px; line-height: 48px; } .zpconin:before { top: 10px; left: -10px; } .zpconin div, .zpconin p, .zpconin span { font-size: 30px!important; line-height: 48px!important; } .zpcon h4 { font-size: 30px; } } .caselist { max-width: 1710px; padding: 70px 0 20px; margin: 0 auto; overflow: hidden; } .caselist li { float: left; width: 33.33%; margin-bottom: 60px; } .caselist li .lin { padding: 0 20px; } .caselist li a { display: block; border: 1px solid #dbdbdb; border-radius: 12px; overflow: hidden; } .caselist .pic { width: 100%; height: 0; padding-bottom: 69.7%; overflow: hidden; position: relative; } .caselist .pic img { position: absolute; z-index: 1; left: 0; top: 0; } .caselist .pic2 { width: 100%; height: 160px; overflow: hidden; text-align: center; font-size: 0; line-height: 160px; } .caselist li .wz { text-align: center; border-top: 1px dotted #e7e7e7; padding: 35px 20px 35px; } .caselist li h3 { font-size: 16px; color: #333; line-height: 30px; height: 30px; overflow: hidden; } .caselist li .txt { font-size: 16px; color: #333; line-height: 30px; height: 30px; overflow: hidden; display: none; } .caselist li:hover h3, .caselist li:hover .txt { color: #1fb5b0; } .caselist li:hover a { border-color: #1fb5b0; } .caselist h3, .caselist .txt { -webkit-transition: .4s; transition: .4s; } .rcaselist { padding: 60px 40px 40px; } .rcaselist li:last-child { display: none; } @media screen and (max-width: 1400px) { .caselist { padding: 60px 0 10px; } .rcaselist { padding: 60px 40px 40px; } } @media screen and (max-width: 1200px) { .caselist { padding: 50px 20px 10px; } .rcaselist { padding: 50px 40px 20px; } .caselist li { width: 50%; } .rcaselist li:last-child { display: block; } } @media screen and (max-width: 1024px) { .rcaselist { padding: 50px 15px 20px; } .caselist li .lin { padding: 0 15px; } } @media screen and (max-width: 750px) { .caselist { padding: 50px 10px 10px; width: auto; } .rcaselist { padding: 50px 20px 20px; } .caselist li .lin { padding: 0 10px; } .caselist li h3 { font-size: 30px; line-height: 44px; height: 44px; } .caselist li .txt { font-size: 30px; line-height: 44px; height: 88px; } } @media screen and (max-width: 640px) { .caselist li { width: 100%; } } .tuijian { width: 100%; height: 400px; overflow: hidden; position: relative; } .tjpicbg { width: 50%; height: 100%; position: absolute; right: 0; top: 0; z-index: 2; overflow: hidden; } .even .tjpicbg { left: 0; right: auto; } .tjpicbg img { position: absolute; width: 960px; height: 100%; left: 50%; top: 0; z-index: 2; margin-left: -480px; -webkit-transition: 1s; transition: 1s; } .tjpicbg img.al { left: 0; margin-left: 0; } .tjother { width: 50%; height: 100%; float: left; display: table; position: relative; z-index: 1; } .tjother .inner { font-size: 14px; color: #907761; line-height: 24px; padding: 0 12.5%; display: table-cell; vertical-align: middle; } .even .tjother { float: right; } .tjother h3 { font-size: 28px; color: #333; line-height: 40px; -webkit-transition: 0.6s; transition: 0.6s; } .tjother .tjcon { font-size: 16px; color: #666; line-height: 28px; width: 550px; margin: 18px 0 34px; max-height: 84px; overflow: hidden; } .tjother .tjcon img { display: none; } .tjother label.num { display: block; width: 70px; height: 60px; background-color: #1fb5b0; overflow: hidden; font-size: 50px; line-height: 104px; color: #fff; text-align: center; -webkit-transition: 0.6s; transition: 0.6s; } .tuijian:hover .tjother h3 { color: #1fb5b0; } .tuijian:hover .tjother label.num { line-height: 60px; } .tuijian:hover .tjpicbg img { -webkit-transform: scale(1.04); transform: scale(1.04); } @media screen and (max-width: 1580px) { .tjother .tjcon { width: auto; } .tjother .inner { padding: 0 10%; } .tjpicbg img.al { left: 50%; margin-left: -400px; } } @media screen and (max-width: 1100px) { .tuijianwrap { padding: 30px 40px; } .tuijian { height: auto; } .tjpicbg { position: relative; width: auto; height: auto; margin: 30px 0 0; } .tjpicbg img { position: relative; width: 100%; left: 0; margin-left: 0; } .tjpicbg img.al { left: 0; margin-left: 0; } .tjother { float: none; width: 100%; height: auto; } .even .tjother { float: none; } .tjother .inner { padding: 40px 0 30px; } .tjother .tjcon { max-height: none; } } @media screen and (max-width: 960px) { .tuijianwrap { padding: 30px 30px; } .tjpicbg { height: 400px; } .tjpicbg img { position: absolute; width: 960px; left: 50%; margin-left: -480px; } .tjpicbg img.al { margin-left: 0; } } @media screen and (max-width: 860px) { .tjpicbg img.al { left: 50%; margin-left: -400px; } } @media screen and (max-width: 750px) { .tjother .inner { font-size: 34px; line-height: 50px; } .tjother h3 { font-size: 34px; line-height: 50px; } .tjother .tjcon { font-size: 30px; line-height: 46px; } .tjother label.num { line-height: 60px; } } .lxout { margin: 80px 0 100px; } #map { width: 100%; height: 580px; } .lxtwo { padding: 10px 44px 0; border: 1px solid #ddd; } .cate2 { position: relative; padding: 32px 0; height: 50px; line-height: 50px; overflow: hidden; border-bottom: 1px solid #ddd; } .cate2 .cn { float: left; font-size: 26px; color: #333; } .cate2 .right { float: right; max-height: 50px; } .lxcon { overflow: hidden; font-size: 0; padding: 30px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .lxcon div { display: inline-block; padding: 0 32px; height: 54px; font-size: 14px; color: #666; line-height: 54px; background-position: 0 17px; background-repeat: no-repeat; } .lxcon div a { display: inline-block; color: #666; } .lxcon div:hover { color: #1fb5b0; } .lxcon div:hover a { color: #1fb5b0; } .lxcon .lx1 { background-image: url('../images/lx1.png'); } .lxcon .lx2 { background-image: url('../images/lx2.png'); } .lxcon .lx3 { background-image: url('../images/lx3.png'); } @media screen and (max-width: 750px) { .lxout { margin: 50px 0 70px; } .lxtwo { padding: 10px 24px; } .cate2 .cn { font-size: 32px; } .lxcon div { font-size: 30px; height: auto; } #map { height: 300px; } } .zpout { padding: 80px 0 80px; background-color: #f5f5f5; } .cate3 { position: relative; padding-bottom: 26px; text-align: center; color: #1fb5b0; } .cate3 .cn { font-size: 32px; line-height: 46px; font-weight: bold; } .cate3 .en { font-size: 34px; line-height: 40px; text-transform: uppercase; } .cate3:after { content: ''; position: absolute; left: 50%; bottom: 0; z-index: 0; width: 160px; height: 1px; margin-left: -80px; background-color: #1fb5b0; } .recintro { font-size: 14px; color: #666; line-height: 26px; text-align: center; margin: 30px auto 32px; max-width: 760px; } .rec2 { padding: 80px 0 70px; background: #fefefe url('../images/zpbg.jpg') center bottom no-repeat; } .rec2 .mouse { width: 66px; height: 66px; margin: 0 auto; background: url('../images/jtd-zp.png') center no-repeat; } .rec-head { height: 80px; background-color: #333; overflow: hidden; padding-left: 140px; } .rec-head .th { float: left; padding: 10px 0; width: 18%; height: 60px; overflow: hidden; font-size: 18px; color: #fff; line-height: 60px; text-align: center; } .rec-head .th.zhiwei { text-align: left; } .rec-head .th.anu { width: 10%; } .reclist { background-color: #fff; } .reclist li { border-bottom: 1px solid #f5f5f5; } .rec-hand { height: 70px; line-height: 70px; background-color: #fff; padding-left: 140px; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .rec-hand .td { float: left; padding: 10px 0; width: 18%; overflow: hidden; font-size: 16px; color: #666; line-height: 50px; text-align: center; height: 50px; } .rec-hand .td.zhiwei { text-align: left; } .rec-hand .td.anu { width: 10%; } .rec-hand a.more { display: block; cursor: pointer; background: url('../images/zp.png') 30% no-repeat; } .reclist li.on .rec-hand { background-color: #24baae; } .reclist li:hover .rec-hand { background-color: #24baae; } .reclist li.on .rec-hand .td { color: #fff; } .reclist li:hover .rec-hand .td { color: #fff; } .reclist li.on a.more, .reclist li:hover a.more { background-image: url('../images/zph.png'); } .reclist li, .rec-hand, .reclist .td { -webkit-transition: 0.6s; transition: 0.6s; } .reclist .rec-con { display: none; } .reclist .rec-txt { font-size: 14px; color: #777; line-height: 30px; padding: 50px 140px; border: 1px solid #24baae; } .reclist .rec-txt .red { display: inline-block; } @media screen and (max-width: 1600px) { .rec-head, .rec-hand { padding-left: 110px; } .reclist .rec-txt { padding: 50px 110px; } } @media screen and (max-width: 1400px) { .rec-head, .rec-hand { padding-left: 80px; } .reclist .rec-txt { padding: 50px 80px; } } @media screen and (max-width: 1200px) { .rec-head, .rec-hand { padding-left: 60px; } .reclist .rec-txt { padding: 50px 60px; } } @media screen and (max-width: 1080px) { .rec-head, .rec-hand { padding-left: 40px; } .reclist .rec-txt { padding: 50px 40px; } .rec-head .th.anu, .rec-hand .td.anu { display: none; } .rec-head .th, .rec-hand .td { width: 20%; } } @media screen and (max-width: 960px) { .rec-head .th, .rec-hand .td { width: 25%; } .rec-head .th.bumen, .rec-hand .td.bumen { display: none; } } @media screen and (max-width: 750px) { .recintro { font-size: 30px; line-height: 48px; text-align: left; } .recintro div { display: inline; } .rec-head .th { font-size: 28px; width: 23%; } .rec-head .th.zhiwei { width: 31%; } .rec-hand .td { font-size: 28px; width: 23%; } .rec-hand .td.zhiwei { width: 31%; } .rec-head { height: 90px; } .rec-head .th { height: 70px; line-height: 70px; } .rec-hand { height: 80px; line-height: 80px; } .rec-hand .td { height: 60px; line-height: 60px; } .rec-head, .rec-hand { padding-left: 30px; } .reclist .rec-txt { padding: 40px 30px; font-size: 30px; line-height: 48px; } .rec-txt div, .rec-txt p, .rec-txt span { font-size: 30px!important; line-height: 48px!important; } } .prolist { max-width: 1668px; padding: 60px 30px 60px; margin: 0 auto; overflow: hidden; } .prolist li { float: left; width: 25%; } .prolist li a { display: block; border: 1px solid #f8f8f8; overflow: hidden; position: relative; } .prolist .pic { width: 100%; height: 0; padding-bottom: 100%; position: relative; overflow: hidden; } .prolist .pic .wrap { width: 100%; height: 100%; font-size: 0; text-align: center; position: absolute; left: 0; top: 0; z-index: 1; } .prolist .pic .wrap s { display: inline-block; width: 0; height: 100%; vertical-align: middle; } .prolist .pic img { max-width: 100%; max-height: 100%; } .prolist li .wz { text-align: center; padding: 35px 10px 45px; } .prolist li h3 { font-size: 26px; color: #000; line-height: 46px; height: 46px; overflow: hidden; font-weight: bold; } .prolist li .bianhao { font-size: 26px; color: #000; line-height: 46px; height: 46px; overflow: hidden; } .prolist li .more { width: 70px; height: 70px; position: absolute; top: 0; left: 0; z-index: 5; background: url('../images/sjuw.png') center no-repeat; opacity: 0; -webkit-transition: 0.5s; transition: 0.5s; } .prolist li .more i { position: absolute; left: 12px; top: 12px; z-index: 1; width: 20px; height: 20px; background: url('../images/glass.png') center no-repeat; } .prolist li:hover .more { opacity: 1; } .prolist li:hover .more i { -webkit-animation: rotate360 1s linear 1; animation: rotate360 1s linear 1; } .prolist li:hover h3, .prolist li:hover .bianhao { color: #1fb5b0; } .prolist li:hover a { border-color: #1fb5b0; } .prolist h3, .prolist .bianhao { -webkit-transition: .4s; transition: .4s; } @media screen and (max-width: 1320px) { .prolist li { width: 33.33%; } .prolist li h3 { font-size: 20px; } .prolist li .bianhao { font-size: 20px; } } @media screen and (max-width: 1200px) { .prolist { padding: 50px 30px 50px; } .prolist li { width: 50%; } } @media screen and (max-width: 750px) { .prolist { padding: 50px 20px; } .prolist li a { border-color: #1fb5b0; } .prolist li h3 { font-size: 30px; } .prolist li .bianhao { font-size: 30px; } } @media screen and (max-width: 640px) { .prolist li { width: 100%; } } .proin .slideBox { padding: 0 50px; height: 100%; position: relative; } .proin .bd { border: 5px solid #fff; } .proin .bd li { width: 990px; height: 680px; position: relative; } .proin .bd li .pic { height: 100%; font-size: 0; text-align: center; position: relative; line-height: 680px; overflow: hidden; background-color: #eee; } .proin .bd li .pic:after { content: ''; position: absolute; left: 0; bottom: 0; z-index: 2; width: 100%; height: 270px; background: url('../images/jab1.png') center bottom no-repeat; } .proin .bd img { max-width: 96%; max-height: 96%; } .proin .bd .wrap { padding: 0 60px 30px; position: absolute; left: 0; right: 0; bottom: 0; z-index: 4; } .proin .bd h3 { height: 48px; font-weight: bold; font-size: 26px; line-height: 48px; color: #fff; } .proin .bd p { font-size: 16px; line-height: 36px; color: #fff; overflow: hidden; } .proin .proprev { width: 40px; height: 60px; background: url('../images/lt3.png') center no-repeat; position: absolute; left: 0; z-index: 1; bottom: 50%; } .proin .pronext { width: 40px; height: 60px; background: url('../images/gt3.png') center no-repeat; position: absolute; right: 0; z-index: 1; bottom: 50%; } .proin .proprev:hover { background-image: url('../images/lt3h.png'); } .proin .pronext:hover { background-image: url('../images/gt3h.png'); } .pro { width: 100%; height: 100%; position: fixed; z-index: 160; left: 0; top: 0; display: none; overflow: hidden; } .probg { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 1; background-color: rgba(0, 0, 0, 0.8); } .proin { width: 1100px; height: 690px; position: absolute; z-index: 2; -webkit-transition: 0.3s; transition: 0.3s; left: 50%; margin-left: -550px; top: 50%; margin-top: -380px; padding-top: 60px; overflow: hidden; opacity: 0; } .pro.on .proin { opacity: 1; } .proclose { width: 60px; height: 60px; position: absolute; top: 0; right: 50%; z-index: 1; cursor: pointer; background: #ffffff url('../images/cha.png') center no-repeat; margin-right: -500px; } @media screen and (max-width: 1200px) { .proin { width: 850px; margin-left: -425px; height: 590px; margin-top: -295px; } .proin .bd li { width: 740px; height: 580px; } .proin .bd li .pic { line-height: 580px; } .proin .bd .wrap { padding: 0 30px 20px; } .proclose { margin-right: -375px; } } @media screen and (max-width: 880px) { .proin { width: 720px; margin-left: -360px; } .proin .bd li { width: 610px; } .proclose { margin-right: -310px; } } @media screen and (max-width: 750px) { .proin .bd .wrap { padding: 0 30px 10px; } .proin .bd h3 { font-size: 30px; } .proin .bd p { font-size: 28px; line-height: 42px; } } .servone { padding: 112px 0 44px; background: #f4f4f4 url('../images/serbg.jpg') center bottom no-repeat; } .servone .intro { font-size: 16px; color: #666; line-height: 32px; text-align: center; margin: 30px auto 32px; } .servone .intro span { display: inline-block; } .servone .mouse { width: 66px; height: 66px; margin: 0 auto; -webkit-animation: rotateY360 2s infinite linear; animation: rotateY360 2s infinite linear; background: url('../images/jtd-zp.png') center no-repeat; } .servonelist { position: relative; width: 100%; height: 628px; margin-top: 20px; } .servonelist li { position: absolute; z-index: 3; width: 436px; } .servonelist li .inner { position: relative; } .servonelist li .num { width: 68px; height: 68px; font-size: 28px; line-height: 68px; color: #16a8b5; position: absolute; top: 3px; z-index: 0; text-align: center; background-color: #fff; border-radius: 50%; -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25); } .servonelist li h3 { font-size: 24px; line-height: 46px; color: #444; height: 46px; overflow: hidden; } .servonelist li p { font-size: 14px; color: #999; line-height: 22px; text-transform: uppercase; height: 44px; overflow: hidden; word-break: normal; } .servonelist li:hover h3 { color: #16a8b5; } .servonelist li:hover .num { background-color: #16a8b5; color: #fff; } .servonelist li h3, .servonelist li .num { -webkit-transition: 0.3s; transition: 0.3s; } .servonelist li.i1, .servonelist li.i3 { left: 0; } .servonelist li.i2, .servonelist li.i4 { right: 0; } .servonelist li.i1 { top: 120px; } .servonelist li.i2 { top: 120px; } .servonelist li.i3 { bottom: 128px; } .servonelist li.i4 { bottom: 128px; } .servonelist li.i1 .inner, .servonelist li.i3 .inner { padding-right: 104px; text-align: right; } .servonelist li.i2 .inner, .servonelist li.i4 .inner { padding-left: 104px; text-align: left; } .servonelist li.i1 .num, .servonelist li.i3 .num { right: 7px; } .servonelist li.i2 .num, .servonelist li.i4 .num { left: 7px; } @media screen and (max-width: 1000px) { .servonelist li { width: 42%; } .servonelist li .num { top: -72px; } .servonelist li.i1 .inner, .servonelist li.i3 .inner { padding-right: 0; } .servonelist li.i2 .inner, .servonelist li.i4 .inner { padding-left: 0; } .servonelist li.i1 .num, .servonelist li.i3 .num { right: 0; } .servonelist li.i2 .num, .servonelist li.i4 .num { left: 0; } .servonelist li.i3 { bottom: 50px; } .servonelist li.i4 { bottom: 50px; } } @media screen and (max-width: 750px) { .servone .intro { font-size: 30px; line-height: 48px; text-align: left; } .servone .intro span { display: inline; } .servonelist li h3 { font-size: 30px; } .servonelist li p { font-size: 28px; line-height: 34px; height: 102px; } .servonelist li .num { font-size: 34px; } } .servtwo { padding: 92px 0 80px; background: #ffffff url('../images/serbg2.jpg') center bottom no-repeat; } .advlist { max-width: 1260px; padding: 80px 0 0; margin: 0 auto; overflow: hidden; } .advlist li { float: left; width: 33.33%; margin-bottom: 40px; } .advlist li .lin { padding: 0 30px; } .advlist li a { display: block; overflow: hidden; padding-right: 10px; padding-bottom: 10px; position: relative; } .advlist li a:before { content: ''; position: absolute; right: 0; bottom: 0; z-index: 0; width: 275px; height: 350px; background-color: #21b9af; -webkit-transition: 0.5s; transition: 0.5s; } .advlist .pic { width: 100%; height: 100%; overflow: hidden; position: relative; z-index: 1; } .advlist .tit { height: 84px; position: absolute; left: 50px; top: 45px; z-index: 2; } .advlist .tit img { max-width: 100%; height: 100%; -webkit-transition: 0.5s; transition: 0.5s; } .advlist li:hover a { border-color: #1fb5b0; } .advlist li:hover .tit img { -webkit-transform: scale(1.04); transform: scale(1.04); } .advlist li:hover a:before { width: 250px; height: 300px; } @media screen and (max-width: 1200px) { .advlist { padding: 60px 30px 0; } .advlist li { width: 50%; } } @media screen and (max-width: 960px) { .advlist { padding: 60px 20px 0; } .advlist li .lin { padding: 0 20px; } } @media screen and (max-width: 640px) { .advlist li { width: 100%; } } .servthree { padding: 112px 0 130px; } .cerzhun { max-width: 1200px; margin: 0 auto; padding: 0 50px; } .zhunsec { position: relative; } .zhunsec .title { font-size: 24px; color: #1fb5b0; line-height: 48px; } .zhunsec .title2 { font-size: 16px; color: #666; line-height: 28px; } .zhunlist { overflow: hidden; padding-top: 2px; width: 100%; } .zhunlist li { margin-top: 28px; } .zhunlist li .lin { position: relative; padding-left: 60px; } .zhunlist label { width: 42px; height: 38px; position: absolute; left: 0; top: 0; z-index: 1; font-size: 18px; color: #fff; line-height: 36px; text-indent: 8px; background: url('../images/yuan2.png') center no-repeat; } .zhunlist h3 { font-size: 22px; color: #333; line-height: 34px; font-weight: bold; height: 34px; -webkit-transition: 0.5s; transition: 0.5s; } .zhunlist .txt { font-size: 16px; color: #666; line-height: 26px; margin-top: 10px; } .zhunwrap { width: 600px; } .zhunsec1 { margin-top: 100px; } .zhunsec2 { margin-top: 150px; } .zhunsec2 .zhunwrap { float: right; } .zhunbg { position: absolute; z-index: 1; width: 515px; text-align: center; } .zhunbg img { max-width: 100%; -webkit-transition: 0.5s; transition: 0.5s; } .zhunsec1 .zhunbg { top: 14px; right: -50px; } .zhunsec2 .zhunbg { top: 0; left: -66px; } .zhunlist li:hover h3 { color: #1fb5b0; } .zhunbg:hover img { -webkit-transform: scale(1.02); transform: scale(1.02); } @media screen and (max-width: 1100px) { .zhunbg { position: relative; width: 100%; margin-bottom: 20px; } .zhunsec1 .zhunbg { top: 0; right: auto; left: 0; } .zhunsec2 .zhunbg { top: 0; left: 0; } .zhunwrap { width: 100%; } .zhunsec1 { margin-top: 70px; } .zhunsec2 { margin-top: 90px; } .zhunsec2 .zhunwrap { float: none; } } @media screen and (max-width: 750px) { .zhunlist label { width: 50px; height: 50px; font-size: 30px; line-height: 50px; text-indent: 0; text-align: center; background-color: #1fb5b0; border-radius: 50%; } .zhunlist h3 { font-size: 32px; line-height: 50px; height: 50px; } .zhunlist .txt { font-size: 30px; line-height: 44px; } .zhunsec .title { font-size: 34px; line-height: 64px; } .zhunsec .title2 { font-size: 30px; line-height: 46px; } } .newslist { max-width: 1720px; padding: 70px 30px 20px; margin: 0 auto; overflow: hidden; } .newslist li { float: left; width: 25%; margin-bottom: 60px; } .newslist li .lin { padding: 0 25px; } .newslist li a { display: block; width: 100%; height: 0; padding-bottom: 100%; position: relative; } .newslist .pic { width: 100%; height: 100%; overflow: hidden; position: absolute; z-index: 1; top: 0; left: 0; } .newslist .pic img { width: 100%; height: 100%; } .newslist li .wrap { border: 1px solid #666; -webkit-box-sizing: border-box; box-sizing: border-box; overflow: hidden; position: absolute; left: 0; top: 0; z-index: 3; width: 100%; height: 100%; } .newslist li .wrapin { padding: 54px 22px 48px; background-color: #fff; position: absolute; left: 0; top: 0; z-index: 3; } .newslist li .hx { width: 100%; height: 1px; background-color: #666; position: relative; margin: 11px 0 14px; } .newslist li h3 { font-size: 18px; color: #333; line-height: 30px; height: 60px; overflow: hidden; } .newslist li .txt { font-size: 14px; color: #8a8989; line-height: 25px; height: 125px; overflow: hidden; } .newslist li .date { font-size: 14px; color: #8a8989; line-height: 25px; height: 25px; overflow: hidden; margin-top: 40px; } .newslist li:hover h3, .newslist li:hover .txt, .newslist li:hover .date { color: #fff; } .newslist li:hover .hx { margin: 9px 0 7px; } .newslist li:hover .wrapin { background-color: rgba(0, 0, 0, 0.75); padding-top: 24px; top: 144px; } .newslist h3, .newslist .hx, .newslist .wrapin, .newslist .txt, .newslist .date { -webkit-transition: .4s; transition: .4s; } .fnewslist { padding: 50px 30px 60px; } .fnewslist li { margin-bottom: 30px!important; } @media screen and (max-width: 1660px) { .newslist li .wrapin { padding-top: 24px; padding-bottom: 45px; } } @media screen and (max-width: 1540px) { .newslist li .date { margin-top: 20px; } } @media screen and (max-width: 1450px) { .newslist { padding-top: 70px; } .newslist li { width: 33.3%; } .newslist li .wrapin { padding-bottom: 125px; } .fnewslist { padding-top: 50px; } .fnewslist li:last-child { display: none; } } @media screen and (max-width: 1100px) { .newslist { padding: 60px 15px 20px; } .fnewslist { padding: 50px 15px 50px; } .newslist li .lin { padding: 0 15px; } } @media screen and (max-width: 1050px) { .newslist { padding: 60px 15px 30px; } .fnewslist { padding: 50px 15px 50px; } .newslist li { width: 50%; margin-bottom: 50px; } .newslist li .wrapin { padding-bottom: 190px; } .fnewslist li:last-child { display: block; } } @media screen and (max-width: 750px) { .newslist { padding: 60px 15px 40px; } .fnewslist { padding: 50px 15px 50px; } .newslist li { margin-bottom: 40px; } .newslist li h3 { font-size: 30px; line-height: 46px; height: 92px; color: #fff; } .newslist li .txt { font-size: 24px; line-height: 40px; height: 120px; color: #fff; } .newslist li .wrapin { top: 190px; padding-bottom: 0; background-color: rgba(0, 0, 0, 0.75); } .newslist li:hover .wrapin { top: 200px; } } .fser { padding: 70px 0 60px; background-color: #fcfcfc; } .fcate1 { text-align: center; } .fcate1 .cn { font-size: 20px; line-height: 60px; color: #333; font-weight: bold; height: 60px; position: relative; z-index: 1; margin-top: -60px; } .fcate1 .cn span { font-size: 14px; color: #20b5b0; position: relative; top: -10px; } .fcate1 .en { vertical-align: top; font-size: 0; height: 60px; line-height: 60px; } .kouhao { margin-top: 60px; } .khlist { padding: 0 50px; overflow: hidden; text-align: left; font-size: 0; } .khlist li { display: inline-block; width: 20%; } .khlist li a { display: block; overflow: hidden; position: relative; text-align: center; } .khlist li .im { line-height: 160px; width: 160px; height: 160px; margin: 0 auto; overflow: hidden; border: 3px solid #eee; border-radius: 50%; } .khlist li .im img { width: 100%; height: 100%; } .khlist li h3 { font-size: 18px; color: #333; line-height: 30px; height: 30px; overflow: hidden; margin-top: 18px; } .khlist li:hover .im { border-color: #16aab8; } .khlist li:hover h3 { color: #16aab8; } .khlist li h3, .khlist li .im { -webkit-transition: 0.4s; transition: 0.4s; } @media screen and (max-width: 1200px) { .khlist li { width: 33.33%; margin-bottom: 20px; } } @media screen and (max-width: 750px) { .fser { padding-bottom: 30px; } .khlist li { width: 50%; margin-bottom: 40px; } .khlist li h3 { font-size: 30px; } .fcate1 .cn { font-size: 32px; } .fcate1 .cn span { font-size: 28px; } } .fcase { padding: 64px 0 44px; background-color: #fcfcfc; } .fcaselist { max-width: 1640px; padding: 0 20px 2px; margin: 50px auto 0; overflow: hidden; } .fcaselist li { float: left; width: 25%; margin-bottom: 32px; } .fcaselist li .lin { padding: 0 15px; } .fcaselist li a { display: block; } .fcaselist .pic { width: 100%; height: 0; padding-bottom: 69.21%; overflow: hidden; position: relative; } .fcaselist img { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; } .fcaselist .pic i.cov { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 3; background-color: rgba(0, 0, 0, 0.55); opacity: 0; } .fcaselist .pic i.cov:before { content: ''; position: absolute; left: 50%; top: 50%; z-index: 0; width: 75px; height: 75px; background: url('../images/fjia.png') center no-repeat; margin-top: -37px; margin-left: -37px; } .fcaselist li h3 { height: 44px; position: relative; } .fcaselist li h3 span { display: block; font-size: 16px; color: #333; line-height: 44px; text-align: center; width: 100%; height: 44px; overflow: hidden; background-color: #eee; position: absolute; left: 0; bottom: 0; z-index: 4; } .fcaselist li:hover i.cov { opacity: 1; } .fcaselist li:hover span { color: #fff; height: 60px; line-height: 60px; background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); } .fcaselist li:hover i.cov:before { -webkit-animation: rotate360 2s linear infinite; animation: rotate360 2s linear infinite; } .fcaselist li span, .fcaselist li .cov { -webkit-transition: .3s; transition: .3s; } @media screen and (max-width: 1290px) { .fcaselist li { width: 33.3%; } } @media screen and (max-width: 960px) { .fcaselist li { width: 50%; } } @media screen and (max-width: 750px) { .fcaselist li h3 { height: 60px; } .fcaselist li h3 span { font-size: 30px; height: 60px; line-height: 60px; } } .fnews { padding-top: 66px; background: url('../images/fnewsbg.jpg') center 0; } .fsol { padding: 68px 0 86px; background: url('../images/fsolbg.jpg') center 0; } .fcate2 .cn { font-size: 20px; line-height: 40px; color: #fff; font-weight: bold; height: 40px; position: relative; z-index: 1; margin-top: -40px; } .fcate2 .cn span { font-size: 14px; color: #20b5b0; position: relative; top: -10px; } .fcate2 .en { vertical-align: top; font-size: 0; height: 40px; line-height: 40px; } .fcate2 p { font-size: 14px; line-height: 25px; color: rgba(255, 255, 255, 0.4); margin-top: 6px; } .fsollist { max-width: 1584px; margin: 44px auto 0; overflow: hidden; } .fsollist li { float: left; width: 25%; } .fsollist li .lin { padding: 0 33px; } .fsollist li a { display: block; } .fsollist .pic { width: 100%; height: 0; padding-bottom: 133.33%; overflow: hidden; position: relative; } .fsollist img { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; } .fsollist .pic i.cov2 { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 2; border: 5px solid #fff; opacity: 1; } .fsollist .pic i.cov { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 3; background-color: rgba(51, 51, 51, 0.8); opacity: 0; } .fsollist .pic i.cov:before { content: ''; position: absolute; left: 50%; top: 50%; z-index: 0; width: 75px; height: 75px; background: url('../images/fjia.png') center no-repeat; margin-top: -37px; margin-left: -37px; } .fsollist li .wz { padding: 10px 0 38px; position: relative; } .fsollist li.even .wz { padding: 26px 0 22px; } .fsollist li h3 { font-size: 18px; color: #fff; line-height: 40px; text-align: right; max-width: 226px; height: 40px; overflow: hidden; position: relative; } .fsollist li h3:after { content: ''; position: absolute; left: 0; bottom: 0; z-index: 0; width: 100%; height: 2px; background-color: rgba(255, 255, 255, 0.2); } .fsollist li h3.i1 { background: url('../images/sol1.png') 0 center no-repeat; } .fsollist li h3.i2 { background: url('../images/sol2.png') 0 0 no-repeat; } .fsollist li h3.i3 { background: url('../images/sol3.png') 0 4px no-repeat; } .fsollist li h3.i4 { background: url('../images/sol4.png') 0 4px no-repeat; } .fsollist li:hover h3.i1 { background-image: url('../images/sol1h.png'); } .fsollist li:hover h3.i2 { background-image: url('../images/sol2h.png'); } .fsollist li:hover h3.i3 { background-image: url('../images/sol3h.png'); } .fsollist li:hover h3.i4 { background-image: url('../images/sol4h.png'); } .fsollist li:hover i.cov { opacity: 1; } .fsollist li:hover i.cov2 { opacity: 0; } .fsollist li:hover h3:after { background-color: #16a8b5; } .fsollist li:hover h3 { color: #16a8b5; } .fsollist li:hover i.cov:before { -webkit-animation: rotate360 2s linear infinite; animation: rotate360 2s linear infinite; } .fsollist li h3, .fsollist li h3:after, .fsollist li .cov, .fsollist li .cov2 { -webkit-transition: .3s; transition: .3s; } @media screen and (max-width: 1440px) { .fsollist li .lin { padding: 0 20px; } } @media screen and (max-width: 1190px) { .fcate2 { text-align: center; } .fsollist { max-width: 792px; } .fsollist li { width: 50%; } } @media screen and (max-width: 750px) { .fsollist li .wz { height: 60px; } .fsollist li h3 { font-size: 30px; height: 60px; line-height: 60px; max-width: 100%; } .fsollist li h3.i2, .fsollist li h3.i3, .fsollist li h3.i4 { background-position: 0 center; } .fcate2 .cn { font-size: 32px; line-height: 60px; height: 60px; margin-top: -60px; } .fcate2 .cn span { font-size: 28px; } .fcate2 .en { line-height: 60px; height: 60px; } .fcate2 p { font-size: 30px; line-height: 44px; } } .fabout { padding: 74px 0 98px; background: #fcfcfc url('../images/aa.png') 80% bottom no-repeat; } .faboutcon { overflow: hidden; margin-top: 50px; } .faboutl { float: left; width: 50%; } .faboutr { float: right; width: 45.5%; position: relative; } .faboutl .pic { padding-left: 18px; padding-bottom: 20px; max-width: 792px; } .faboutl img { width: 100%; -webkit-box-shadow: -18px 20px 0 0 #ebebeb; box-shadow: -18px 20px 0 0 #ebebeb; } .faboutr .fabtitle { font-size: 30px; color: #333; line-height: 44px; height: 44px; position: relative; overflow: hidden; padding-bottom: 13px; } .faboutr .fabtitle:after { content: ''; position: absolute; left: 0; bottom: 0; z-index: 0; width: 60px; height: 2px; background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); } .faboutr .fabtxt { overflow: hidden; height: 120px; margin: 28px 0 25px; font-size: 14px; line-height: 30px; color: #404040; } .faboutr .more { display: block; width: 146px; height: 44px; background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); font-size: 16px; color: #fff; line-height: 44px; text-align: center; border-radius: 22px; } .faboutr .more:hover { opacity: 0.8; } .fguolist { overflow: hidden; width: 100%; margin-bottom: 36px; position: relative; z-index: 1; font-size: 0; } .fguolist li { display: inline-block; width: 30%; text-align: center; position: relative; } .fguolist li.long { width: 40%; } .fguolist li.i1 { text-align: left; } .fguolist li.i3 { text-align: right; } .fguolist li a { display: block; position: relative; } .fguolist li.i1:before { content: ''; position: absolute; right: 0; top: 20px; z-index: 0; width: 1px; height: 30px; background-color: #b6b6b6; } .fguolist li.i3:before { content: ''; position: absolute; left: 0; top: 20px; z-index: 0; width: 1px; height: 30px; background-color: #b6b6b6; } .fguolist h3 { font-size: 16px; color: #bcbcbc; position: relative; height: 52px; line-height: 52px; } .fguolist h3 span { font-size: 40px; color: #333; font-family: 'Impact'; -webkit-transition: 0.3s; transition: 0.3s; } .fguolist h3 i { font-size: 40px; color: #333; font-family: 'Impact'; font-style: normal; -webkit-transition: 0.3s; transition: 0.3s; } .fguolist li .txt { font-size: 16px; color: #9b9b9b; line-height: 28px; } .fguolist li:hover h3 span, .fguolist li:hover h3 i { color: #1fb5b0; } @media screen and (max-width: 1440px) { .faboutl { width: 54%; } .faboutr { width: 42%; } .faboutl .pic { width: 100%; padding-left: 0; padding-bottom: 0; } .faboutl img { -webkit-box-shadow: none; box-shadow: none; } .faboutr .fabtitle { font-size: 24px; } .faboutr .fabtxt { height: auto; } } @media screen and (max-width: 1200px) { .faboutl { float: none; width: 100%; height: auto; margin-bottom: 40px; } .faboutr { float: none; width: 100%; height: auto; margin: 0 auto; max-width: 800px; } .faboutl .pic { margin: 0 auto; } .fguolist li.i1 { text-align: center; } .fguolist li.i3 { text-align: center; } .faboutr .more { margin: 0 auto; } } @media screen and (max-width: 750px) { .faboutr .fabtitle { font-size: 34px; line-height: 54px; height: 54px; } .faboutr .fabtxt { font-size: 30px; line-height: 44px; margin: 36px 0; } .faboutr .more { width: 270px; height: 70px; font-size: 30px; line-height: 70px; border-radius: 35px; } .fguolist h3 { font-size: 30px; height: 72px; line-height: 72px; } .fguolist h3 span { font-size: 50px; } .fguolist li .txt { font-size: 30px; line-height: 50px; } } .fkehu { padding-bottom: 40px; background-color: #fcfcfc; } .huoberji { height: 44px; margin: 40px 0 42px; text-align: center; font-size: 0; position: relative; } .huoberji:after { content: ''; position: absolute; left: 50%; bottom: 0; z-index: 0; width: 580px; height: 1px; background-color: #dcdcdc; margin-left: -290px; } .huoberji a { display: inline-block; height: 36px; padding-bottom: 6px; margin: 0 20px; font-size: 18px; line-height: 36px; color: #666; border-bottom: 2px solid transparent; position: relative; z-index: 1; } .huoberji a.on, .huoberji a:hover { color: #16aab8; } .huoberji a.on { border-color: #16aab8; } .kehulist { max-width: 1632px; padding: 10px 20px 14px; overflow: hidden; margin: 0 auto; } .kehulist li { float: left; width: 12.5%; margin-bottom: 20px; } .kehulist li .lin { padding: 0 10px; position: relative; } .kehulist li a { display: block; background-color: #fff; border: 1px solid #e5e5e5; overflow: hidden; border-radius: 6px; } .kehulist .pic { width: 100%; height: 88px; overflow: hidden; font-size: 0; line-height: 88px; text-align: center; } .kehulist img { max-width: 90%; max-height: 90%; } .kehulist li:hover a { -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); } @media screen and (max-width: 1500px) { .kehulist li { width: 25%; } } @media screen and (max-width: 1100px) { .kehulist li { width: 33.3%; } } @media screen and (max-width: 900px) { .kehulist li { width: 50%; } } @media screen and (max-width: 750px) { .huoberji { height: auto; margin-bottom: 32px; } .huoberji:after { display: none; } .huoberji a { width: 190px; height: 60px; background-color: #eee; margin: 10px 15px; font-size: 30px; line-height: 60px; padding-bottom: 0; } } .fchain { width: 100%; position: relative; overflow: hidden; } .chain { float: left; height: 272px; } .chain .inner { max-width: 100%; display: block; height: 100%; overflow: hidden; position: relative; } .chain .wz { padding-top: 96px; color: #fff; } .chain .cn { font-size: 36px; font-weight: bold; line-height: 50px; -webkit-transition: 0.3s; transition: 0.3s; } .chain .en { font-size: 18px; line-height: 30px; -webkit-transition: 0.3s; transition: 0.3s; } .chain .more { position: absolute; right: 0; top: 0; z-index: 1; width: 164px; height: 100%; -webkit-transition: 0.3s; transition: 0.3s; } .chain .more p { width: 100%; height: 24px; padding-top: 67px; position: relative; top: 94px; font-size: 14px; color: #fff; line-height: 24px; text-align: center; overflow: hidden; } .chain .more p:before { content: ''; position: absolute; left: 50%; top: 0; z-index: 0; width: 53px; height: 53px; margin-left: -26px; } .chain.i1, .chain.i2 { width: 50%; } .chain.i3, .chain.i4, .chain.i5 { width: 33.33%; } .chain.i1 { background: url('../images/chain1.jpg') center no-repeat; } .chain.i1 .inner { float: right; width: 810px; } .chain.i1 .more { background-color: rgba(22, 168, 181, 0.1); } .chain.i1 .more p:before { background-image: url('../images/jia1.png'); } .chain.i2 { background: url('../images/chain2.jpg') center no-repeat; } .chain.i2 .inner { width: 810px; } .chain.i2 .wz { padding-left: 150px; } .chain.i2 .more { background-color: rgba(22, 168, 181, 0.1); } .chain.i2 .more p:before { background-image: url('../images/jia2.png'); } .chain.i3 { background: url('../images/chain3.jpg') center no-repeat; } .chain.i3 .inner { float: right; width: 490px; } .chain.i3 .more { background-color: rgba(22, 168, 181, 0); } .chain.i3 .more p:before { background-image: url('../images/jia2.png'); } .chain.i4 { background: url('../images/chain4.jpg') center no-repeat; } .chain.i4 .inner { width: 100%; } .chain.i4 .wz { padding-left: 88px; } .chain.i4 .more { background-color: rgba(0, 0, 0, 0.8); } .chain.i4 .more p:before { background-image: url('../images/jia3.png'); } .chain.i5 { background: url('../images/chain5.jpg') center no-repeat; } .chain.i5 .inner { width: 477px; background: url('../images/chain6.png') right no-repeat; } .chain.i5 .wz { padding-left: 38px; color: #fff; } .chain.i5 .more { background-color: rgba(0, 0, 0, 0); } .chain.i5 .more p:before { background-image: url('../images/jia1.png'); color: #333; } .chain:hover .wz, .chain.i5:hover .wz { color: #16a8b5; } .chain:hover .more { background-color: rgba(22, 168, 181, 0.5); } .chain:hover .more p:before { -webkit-animation: rotate360 2s linear infinite; animation: rotate360 2s linear infinite; } @media screen and (max-width: 1440px) { .chain.i1 .wz { padding-left: 38px; } .chain.i2 .wz { padding-left: 38px; } .chain.i3 .wz { padding-left: 38px; } .chain.i4 .wz { padding-left: 38px; } .chain .more { width: 120px; } .chain.i5 .more { background-color: rgba(0, 0, 0, 0.8); } .chain.i5:hover .more { background-color: rgba(22, 168, 181, 0.5); } .chain.i5 .more p { color: #fff; } .chain .cn { font-size: 26px; } } @media screen and (max-width: 1200px) { .chain.i3, .chain.i4 { width: 50%; } .chain.i5 { width: 100%; } .chain.i1 .inner { float: none; } .chain.i3 .inner { float: none; width: 100%; } .chain.i5 .inner { width: 100%; background-size: cover; } } @media screen and (max-width: 940px) { .chain.i1, .chain.i2 { width: 100%; } .chain.i3, .chain.i4 { width: 100%; background-size: cover; } .chain.i1 .inner { width: 100%; } .chain.i2 .inner { width: 100%; } } @media screen and (max-width: 750px) { .chain .wz { padding-top: 86px; } .chain .cn { font-size: 32px; line-height: 60px; } .chain .en { font-size: 30px; line-height: 40px; } .chain .more { width: 200px; } .chain .more p { font-size: 28px; line-height: 40px; height: 40px; top: 86px; } } .xilie { height: 600px; padding: 60px 0; background-position: center; background-repeat: no-repeat; background-size: cover; } .xilie.fat { padding: 145px 0; } .xilie.i1 { background-image: url('../images/xilie1.jpg'); } .xilie.i2 { background-image: url('../images/xilie2.jpg'); } .xilie.i3 { background-image: url('../images/xilie3.jpg'); } .xilie.i4 { background-image: url('../images/xilie4.jpg'); } .xilie.i5 { background-image: url('../images/xilie5.jpg'); } .xilie .cer3 { height: 100%; overflow: hidden; } .xilie .pic { float: left; width: 700px; height: 100%; font-size: 0; line-height: 640px; text-align: left; } .xilie img { max-width: 100%; max-height: 100%; } .xilie .ttxt { float: right; display: table; width: 500px; height: 100%; } .xilie .ttxtwrap { display: table-cell; vertical-align: middle; } .xilie .ttxt h2 { font-size: 42px; color: #23bbae; line-height: 64px; } .xilie .ttxt h3 { font-size: 18px; color: #cccccc; line-height: 34px; text-transform: uppercase; } .xilie .ttxt dt { font-size: 28px; color: #1fb5b0; line-height: 48px; padding-left: 18px; background: url('../images/sx1.jpg') 0 center no-repeat; } .xilie .ttxt dd { font-size: 16px; color: #cccccc; line-height: 36px; margin-bottom: 36px; } .xilie .bascon { font-size: 16px; color: #ccc; line-height: 26px; max-height: 104px; overflow: auto; margin-top: 36px; } .xilie .bascon img { display: none; max-width: 100%; } .xilie a.more { display: block; width: 180px; height: 50px; line-height: 50px; margin-top: 38px; font-size: 18px; color: #fff; text-align: center; border-radius: 25px; background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); } .xilie a.more span { padding-right: 38px; background: url('../images/jtr1.png') right no-repeat; } .xilie a.more:hover { opacity: 0.7; } .xilie a.more2 { margin-top: 80px; } .xilie.even .pic { float: right; text-align: right; } .xilie.even .ttxt { float: left; } .xilie.even .ttxt h3 { color: #999; } .xilie.even .bascon { color: #666; } .xilie.even .ttxt dt { color: #333; } .xilie.even .ttxt dd { color: #666; } @media screen and (max-width: 1356px) { .xilie .pic { width: 600px; } .xilie .ttxt { width: 450px; } } @media screen and (max-width: 1270px) { .xilie .pic { width: 550px; } .xilie .ttxt { width: 450px; } } @media screen and (max-width: 1150px) { .xilie .pic { width: 500px; } .xilie .ttxt { width: 400px; } } @media screen and (max-width: 1040px) { .xilie .pic { float: none; width: 700px; max-width: 100%; height: auto; margin: 0 auto; text-align: center; line-height: normal; } .xilie .ttxt { float: none; width: 600px; max-width: 100%; height: auto; margin: 0 auto; } .xilie.even .pic { float: none; text-align: center; } .xilie.even .ttxt { float: none; } .xilie { height: auto; } } @media screen and (max-width: 750px) { .xilie { padding: 80px 0; } .xilie .ttxt h3 { font-size: 32px; line-height: 46px; } .xilie .ttxt dt { font-size: 42px; line-height: 64px; } .xilie .ttxt dd { font-size: 30px; line-height: 46px; } .xilie .bascon { font-size: 30px; line-height: 46px; max-height: 230px; } .xilie a.more { width: 280px; height: 70px; line-height: 70px; border-radius: 35px; font-size: 30px; } } .profirstout { background: url('../images/probg.jpg') center no-repeat; background-size: cover; } .profirst { overflow: hidden; padding: 30px 0 54px; } .xijie { width: 500px; float: left; z-index: 1; position: relative; margin-left: 94px; } .xijie .bigpic { width: 100%; height: 500px; text-align: center; line-height: 500px; font-size: 0; } .xijie img#bigpic { max-width: 100%; max-height: 100%; } .xijiebar { padding: 0 35px; width: 430px; position: relative; height: 66px; margin: 20px auto 0; } .xijiebar a { position: absolute; top: 0; width: 26px; height: 100%; } .xijiebar .xijie-prev { left: 0; background: #e0e1e4 url('../images/lt2.png') center no-repeat; } .xijiebar .xijie-next { right: 0; background: #e0e1e4 url('../images/gt2.png') center no-repeat; } .xijiebar .xijie-prev:hover { background-image: url('../images/lt2h.png'); } .xijiebar .xijie-next:hover { background-image: url('../images/gt2h.png'); } .twlist2-out { width: 100%; overflow: hidden; height: 100%; position: relative; } .twlist2 { width: auto; height: 100%; font-size: 0; white-space: nowrap; position: absolute; left: 0; top: 0; z-index: 1; -webkit-transition: 0.4s; transition: 0.4s; } .twlist2 li { display: inline-block; width: 66px; height: 66px; position: relative; line-height: 66px; text-align: center; margin: 0 10px; } .twlist2 li:before { content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; border: 1px solid #c0c0c0; } .twlist2 li img { max-width: 95%; max-height: 95%; cursor: pointer; } .twlist2 li:hover:before, .xijie .twlist2 li.on:before { border-color: #1fb5b0; } .proinfo { float: right; width: 770px; padding-top: 78px; } .proinfo .proname { font-size: 36px; line-height: 60px; color: #333; font-weight: bold; margin-bottom: 38px; } .proinfo .xiangxi { font-size: 16px; line-height: 52px; color: #333; padding: 16px 0; border-top: 1px solid #bcbcbc; border-bottom: 1px solid #bcbcbc; } .zixunbtn { display: block; height: 50px; margin-top: 50px; font-size: 0; } .zixunbtn label { display: inline-block; color: #fff; font-size: 16px; line-height: 50px; width: 156px; height: 100%; background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); text-align: center; vertical-align: top; } .zixunbtn span { display: inline-block; width: 222px; border: 1px solid #1db3b1; height: 48px; line-height: 48px; text-align: center; font-size: 0; vertical-align: top; } .bdsharebuttonbox { margin-top: 20px; height: 36px; } .bdshare-button-style0-24 a { font-size: 0!important; } .tree { font-size: 14px; line-height: 32px; color: #666; margin-top: 20px; } .tree a { color: #666; padding: 0 7px; display: inline-block; } .tree a:hover, .tree a.leaf { color: #1fb5b0; } .prosecond { padding-top: 40px; } .tmerji { position: relative; font-size: 0; width: 100%; height: 78px; } .tmerji:after { content: ''; position: absolute; left: 0; bottom: 0; z-index: 0; width: 100%; height: 1px; background-color: #ddd; } .tmerji li { display: inline-block; height: 78px; margin-right: 50px; text-align: center; } .tmerji li a { display: block; width: 132px; font-size: 18px; color: #666; line-height: 78px; height: 78px; position: relative; } .tmerji li a:after { content: ''; position: absolute; left: 0; bottom: 0; z-index: 0; width: 100%; height: 6px; background-color: transparent; -webkit-transition: 0.4s; transition: 0.4s; } .tmerji li.on a, .tmerji li:hover a { color: #1fb5b0; } .tmerji li.on a:after { background-color: #1fb5b0; } .proconout { margin-top: 55px; margin-bottom: 60px; } .procontent { font-size: 14px; color: #666; line-height: 26px; } .procontent .pic { padding: 30px 0; } .procontent img { max-width: 100%; cursor: pointer; } @media screen and (max-width: 1460px) { .xijie { margin-left: 20px; } .proinfo { width: 600px; } .proinfo .proname { font-size: 28px; } } @media screen and (max-width: 1280px) { .profirst { padding-left: 540px; } .xijie { margin-left: -540px; } .proinfo { float: none; width: 500px; max-width: 100%; } } @media screen and (max-width: 960px) { .profirst { padding-left: 0; padding-bottom: 90px; } .xijie { float: none; margin-left: auto; margin-right: auto; width: 700px; } .proinfo { float: none; margin: 0 auto; padding-top: 50px; width: 700px; } } @media screen and (max-width: 750px) { .twlist2 li { width: 100px; } .xijiebar { width: auto; } .proinfo .proname { font-size: 32px; } .proinfo .xiangxi { font-size: 30px; } .tree { font-size: 28px; line-height: 50px; margin-top: 40px; } .tmerji li a { width: 180px; font-size: 32px; } .procontent { font-size: 28px; line-height: 48px; padding: 0 10px; } .procontent p, .procontent span, .procontent div { font-size: 28px!important; line-height: 48px!important; font-family: 'Microsoft Yahei' !important; } .procontent img { width: 100%; } .bdsharebuttonbox { display: none; } .zixunbtn label { font-size: 28px; width: 220px; } .zixunbtn span { width: 360px; } .zixunbtn img { height: 30px; } .fancybox-button { width: 88px!important; height: 88px!important; } .fancybox-infobar { font-size: 32px!important; height: 88px!important; line-height: 88px!important; } .fancybox-button { width: 88px!important; height: 88px!important; } .fancybox-navigation { display: none; } } .ryout { margin: 100px 0; overflow: hidden; height: 800px; background: url('../images/rybg.jpg') center no-repeat; } .ryleft { float: left; width: 50%; height: 100%; position: relative; font-size: 0; text-align: center; line-height: 800px; } .ryleft > img { max-width: 96%; max-height: 96%; } .ryleft h4 { position: absolute; left: 0; bottom: 0; z-index: 0; text-align: center; width: 100%; height: 60px; background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); font-size: 18px; color: #fff; line-height: 60px; } .ryright { float: right; width: 50%; height: 100%; background-color: rgba(255, 255, 255, 0.15); } .rywrap { padding: 100px 0; width: 610px; max-width: 100%; margin: 0 auto; } .cate5 { color: #fff; margin-bottom: 42px; } .cate5 .cn { font-size: 32px; line-height: 56px; } .cate5 .en { font-size: 14px; line-height: 30px; text-transform: uppercase; } .cate5 p { font-size: 16px; color: #ccc; line-height: 32px; margin-top: 10px; } .rylist { overflow: hidden; padding-bottom: 2px; } .rylist li { float: left; width: 33.33%; margin-bottom: 20px; } .rylist li .lin { padding-right: 20px; } .rylist li a { display: block; position: relative; } .rylist li .pic { width: 100%; height: 0; padding-bottom: 68.42%; position: relative; overflow: hidden; } .rylist li .pic .wrap { background-color: #e6e6e6; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; font-size: 0; text-align: center; } .rylist li .pic .wrap i { display: inline-block; width: 0; height: 100%; vertical-align: middle; } .rylist li img { max-width: 95%; max-height: 95%; } .rylist li .cover { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 3; background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); opacity: 0; } .rylist li .cover p { font-size: 0; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background: url('../images/glass2.png') center no-repeat; } .rylist li .cover2 { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 5; } .rylist li h3 { display: none; } .rylist li .cover { -webkit-transition: .6s; transition: .6s; } .rylist li:hover .cover { opacity: 1; } .scrollarea1 .scrollbar { width: 2px; height: 100%; position: absolute; top: 0; right: 1px; z-index: 2; } .scrollarea1 .track { width: 2px; height: 100%; background-color: rgba(226, 226, 226, 0.2); position: relative; } .scrollarea1 .thumb { width: 4px; background-color: #fff; position: absolute; left: -1px; top: 0; z-index: 1; cursor: pointer; border-radius: 2px; } .scrollarea1 { position: relative; width: 100%; padding-right: 34px; height: 430px; } .scrollarea1 .viewport { position: relative; margin-right: -20px; overflow: hidden; height: 100%; } .scrollarea1 .overview { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; font-size: 16px; line-height: 28px; color: #333; } .scrollbar.disable { display: none; } @media screen and (max-width: 1460px) { .ryout { margin: 60px 0; } .ryleft { width: 40%; } .ryright { width: 60%; } } @media screen and (max-width: 1320px) { .rywrap { padding: 100px 50px; width: auto; } } @media screen and (max-width: 1200px) { .ryleft { display: none; } .ryright { float: none; width: 100%; } .rywrap { padding: 100px 0; width: 610px; } .rylist li .cover2 { display: none; } } @media screen and (max-width: 750px) { .scrollarea1 { height: auto; } .scrollarea1 .overview { position: static; } .ryout { height: auto; } .rywrap { padding: 60px 0; } .cate5 .en { font-size: 30px; line-height: 50px; } .cate5 p { font-size: 28px; line-height: 42px; } } .cate4 { position: relative; padding-top: 182px; padding-bottom: 26px; text-align: center; color: #fff; } .cate4 .cn { font-size: 32px; line-height: 46px; font-weight: bold; } .cate4 .en { font-size: 34px; line-height: 40px; text-transform: uppercase; } .cate4:after { content: ''; position: absolute; left: 50%; bottom: 0; z-index: 0; width: 160px; height: 1px; margin-left: -80px; background-color: transparent; } .fazhan .intro { font-size: 16px; color: #fff; line-height: 28px; text-align: center; margin: 44px auto 0; max-width: 900px; } .fazhan { background: url('../images/fazhanbg.jpg') center no-repeat; height: 600px; } @media screen and (max-width: 750px) { .cate4 { padding-top: 120px; } .fazhan .intro { font-size: 28px; line-height: 44px; } } .abt { width: 100%; height: 640px; overflow: hidden; position: relative; } .abtpicbg { width: 50%; height: 100%; position: absolute; right: 0; top: 0; z-index: 2; overflow: hidden; } .even .abtpicbg { left: 0; right: auto; } .abtpicbg img { position: absolute; height: 100%; right: 0; top: 0; z-index: 2; } .even .abtpicbg img { right: auto; left: 0; } .abtother { width: 50%; height: 100%; float: left; display: table; position: relative; z-index: 1; } .abtother .inner { font-size: 14px; color: #907761; line-height: 24px; padding-left: 125px; display: table-cell; vertical-align: middle; padding-right: 70px; } .even .abtother { float: right; } .even .abtother .inner { padding-left: 70px; padding-right: 125px; } .abtother h3 { font-size: 20px; color: #fff; line-height: 50px; height: 50px; padding-left: 30px; background: url('../images/dao.png') 0 center no-repeat; font-weight: bold; } .abtother .abtcon { font-size: 14px; color: #666; line-height: 28px; padding-left: 28px; margin-top: 34px; max-height: 420px; overflow: auto; border-left: 2px solid #ddd; } .abtother .abtcon img { display: none; } .brown { color: #765844; } .cate1 { position: relative; background: url('../images/since.png') 0 0 no-repeat; padding-top: 98px; margin-bottom: 55px; } .cate1 .cn { font-size: 34px; color: #333; line-height: 58px; } .cate1 .cn2 { font-size: 18px; color: #1fb5b0; line-height: 40px; font-weight: bold; } @media screen and (max-width: 1600px) { .abtother .abtcon { width: auto; } .abtother .inner { padding: 0 10%; } .even .abtother .inner { padding: 0 10%; } } @media screen and (max-width: 1100px) { .abtwrap { padding: 30px 40px; } .abt { height: auto; } .abtpicbg { position: relative; width: auto; height: auto; margin: 30px 0 0; } .abtpicbg img { position: relative; width: 100%; } .abtother { float: none; width: 100%; height: auto; } .even .abtother { float: none; } .abtother .inner { padding: 40px 0 30px; } .even .abtother .inner { padding: 40px 0 30px; } .abtother .abtcon { max-height: none; } } @media screen and (max-width: 960px) { .abtwrap { padding: 30px 30px; } .cate1 { margin-bottom: 30px; } } @media screen and (max-width: 750px) { .cate1 .cn2 { font-size: 30px; } .abtother h3 { font-size: 30px; background-size: 70%; } .abtother .inner { font-size: 28px; line-height: 40px; } .abtother .abtcon { font-size: 28px; line-height: 40px; } } .guolist { position: absolute; z-index: 5; bottom: 0; right: 125px; font-size: 0; } .guolist li { display: inline-block; width: 220px; position: relative; margin-left: 10px; border-radius: 20px 0; text-align: center; } .guolist li a { display: block; position: relative; padding: 50px 0; color: #fff; } .guolist li.i1 { background-color: #29c3ab; } .guolist li.i2 { background-color: #1fb5b0; } .guolist li.i3 { background-color: #16a8b5; } .guolist h3 { font-size: 16px; position: relative; height: 52px; line-height: 52px; } .guolist h3 span { font-size: 40px; font-family: 'Impact'; } .guolist h3 i { font-size: 40px; font-family: 'Impact'; font-style: normal; } .guolist li .txt { font-size: 16px; line-height: 28px; height: 28px; } @media screen and (max-width: 1600px) { .guolist { right: 60px; } .guolist li { width: 180px; } .guolist li a { padding: 30px 0; } } @media screen and (max-width: 1200px) { .guolist { right: 30px; } .guolist li { width: 160px; } } @media screen and (max-width: 1100px) { .guolist { bottom: auto; top: 30px; } } @media screen and (max-width: 750px) { .guolist li a { padding: 30px 0; } .guolist h3 { font-size: 28px; height: 72px; line-height: 72px; } .guolist h3 span { font-size: 50px; } .guolist li .txt { font-size: 30px; line-height: 48px; height: 48px; } } .diawrap { position: absolute; width: 100%; height: 100%; z-index: 0; top: 0; left: 0; } .dia1, .dia2, .dia3, .dia4 { width: 380px; height: 380px; position: absolute; left: 50%; margin-left: -190px; background-image: -webkit-gradient(linear, left top, right top, from(#29c3ab), to(#16a8b5)); background-image: linear-gradient(to right, #29c3ab, #16a8b5); top: 50%; margin-top: -190px; border-radius: 50%; } .dia1 { z-index: 1; -webkit-animation: diamond1 2s infinite linear; animation: diamond1 2s infinite linear; } .dia2 { z-index: 2; -webkit-animation: diamond2 2s infinite linear; animation: diamond2 2s infinite linear; } .dia3 { z-index: 3; -webkit-animation: diamond3 2s infinite linear; animation: diamond3 2s infinite linear; } .dia4 { z-index: 4; -webkit-animation: diamond4 2s infinite linear; animation: diamond4 2s infinite linear; } .dia5 { z-index: 5; width: 384px; height: 384px; position: absolute; left: 50%; margin-left: -192px; top: 50%; margin-top: -192px; background: url('../images/logo4.png') center no-repeat; border-radius: 50%; } .xijie2 { float: left; height: 0; overflow: hidden; width: 0; } .propic-scroll { position: relative; width: 100%; height: 520px; padding: 0 50px; margin: 0 auto; -webkit-box-sizing: border-box; box-sizing: border-box; } .propic-scroll .flex-viewport { width: 100%; height: 100%; } .propic-scroll .slides { overflow: hidden; height: 100%; } .propic-scroll .slides li { display: none; height: 100%; -webkit-backface-visibility: hidden; position: relative; } .propic-scroll .slides li a { display: block; width: 100%; height: 100%; position: relative; overflow: hidden; text-align: center; line-height: 520px; } .propic-scroll .slides a > img { max-width: 100%; max-height: 100%; } .propic-scroll .flex-direction-nav a { width: 38px; height: 38px; margin-top: -20px; display: block; font-size: 0; position: absolute; top: 50%; z-index: 4; border-radius: 50%; border: 1px solid #999; } .propic-scroll .flex-direction-nav a.flex-prev { left: 0; background: #ffffff url('../images/dlt2.png') center no-repeat; } .propic-scroll .flex-direction-nav a.flex-next { right: 0; background: #ffffff url('../images/dgt2.png') center no-repeat; } .propic-scroll .flex-direction-nav a:hover { background-color: #1fb5b0; border-color: #1fb5b0; } .propic-scroll .flex-direction-nav a.flex-prev:hover { background-image: url('../images/dlt2h.png'); } .propic-scroll .flex-direction-nav a.flex-next:hover { background-image: url('../images/dgt2h.png'); } .propic-scroll .flex-control-paging { width: 100%; height: 10px; font-size: 0; text-align: center; position: absolute; bottom: 10px; left: 0; z-index: 3; } .propic-scroll .flex-control-paging li { display: inline-block; *display: inline; *zoom: 1; overflow: hidden; width: 10px; height: 10px; margin: 0 5px; } .propic-scroll .flex-control-paging li a { width: 10px; height: 10px; display: block; cursor: pointer; background-color: #000; border-radius: 100%; } .propic-scroll .flex-control-paging li a.flex-active { background-color: #1fb5b0; } .ajaxinfo { float: left; text-align: center; font-size: 16px; color: #aaa; line-height: 1em; width: 100%; margin-top: -50px; } @media screen and (max-width: 960px) { .xijie2 { float: none; } } @media screen and (max-width: 750px) { .xijie { display: none; } .xijie2 { width: 100%; height: 520px; } .ajaxinfo { font-size: 28px; } }