@charset "utf-8";
*, :before, :after {
margin : 0;
padding : 0;
box-sizing : border-box;
}
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, pre, form, fieldset, figure, figcaption, table, th, td img {
margin : 0;
padding : 0;
}
body {
font-family : "Heiti SC", "Microsoft YaHei", "微软雅黑";
color : #333;
font-size : 16px;
line-height : 1.7;
margin : 0 auto;
background-color : #FFF;
min-width : 1280px;
}
ol, ul, li {
list-style : none;
}
i, em {
font-style : normal;
}
a {
color : #333;
text-decoration : none;
outline : none;
cursor : pointer;
}
a:hover, a:active, a:link, a:visited {
text-decoration : none;
}
fieldset, img, video {
max-width : 100%;
border : none;
vertical-align : middle;
}
input, select, textarea, button {
color : #333;
font-size : 16px;
font-family : "Microsoft Yahei", sans-serif;
outline : none;
border : none;
box-sizing : border-box;
}
input, button {
border-radius : 0;
}
textarea {
resize : none;
outline : none;
border : none;
}
input:-ms-clear {
display : none;
}
input[type="button"], input[type="submit"], input[type="reset"] {
outline : none;
}
::-webkit-input-placeholder {
color : #EEE;
}
::-moz-placeholder {
color : #EEE;
}
:-ms-input-placeholder {
color : #EEE;
}
:-moz-placeholder {
color : #EEE;
}
table {
border-collapse : separate;
}
.clearfix:after {
content : ".";
display : block;
height : 0;
line-height : 0;
clear : both;
visibility : hidden;
}
.transition {
transition : all 0.5s;
}
.wrap {
width : 98%;
max-width : 1400px;
margin : 0 auto;
}
.header {
position : absolute;
left : 0;
top : 0;
right : 0;
width : 100%;
z-index : 999;
padding : 40px 0;
line-height : 60px;
min-width : 1280px;
}
.logo {
float : left;
width : 201px;
margin-top : -2px;
}
.logo img {
width : 100%;
height : auto;
}
.nav {
float : left;
width : 55%;
margin-left : 50px;
}
.nav li {
float : left;
margin-right : 26px;
}
.nav li a {
display : block;
color : #333;
font-size : 18px;
padding : 0 5px;
position : relative;
transition : all 0.3s ease;
}
.nav li a:after {
content : "";
position : absolute;
left : 0;
bottom : -7px;
width : 100%;
height : 0;
background : url(../images/nav-on.png) no-repeat;
background-size : cover;
transition : 0.2s;
}
.nav li.nav-on a, .nav li:hover a {
margin-top : -10px;
font-weight : bold;
}
.nav li.nav-on a:after, .nav li:hover a:after {
height : 17px;
}
.top-tel {
float : right;
margin-top : 4px;
}
.top-tel p {
background : url(../images/top-tel.png) left center no-repeat;
color : #FFF;
font-size : 16px;
line-height : 1.4;
padding-left : 58px;
}
.top-tel p strong {
display : block;
color : #F0BE4D;
font-size : 28px;
}
.banner {
position : relative;
}
.ban-item {
background-size : cover;
background-repeat : no-repeat;
background-position : right top;
padding-top : 200px;
padding-bottom : 224px;
box-shadow : 0 10px 20px rgb(0, 0, 0, 0.1);
margin-bottom : 30px;
}
.ban-item:before {
content : "";
position : absolute;
left : 0;
top : 200px;
width : 34.375%;
height : 500px;
background : url(../images/ban-line.png) no-repeat;
background-size : 100% 100%;
}
.item01 {
background-image : url(../images/ban-bg01.jpg);
z-index : -1;
}
.ban-base {
float : left;
width : 42%;
margin-top : 66px;
}
.ban-txt {
position : relative;
z-index : 0;
}
.ban-txt i {
position : absolute;
left : 0;
top : -10px;
color : #194036;
opacity : 0.06;
font-size : 120px;
font-weight : bold;
text-transform : uppercase;
line-height : 1.1;
z-index : -1;
}
.ban-txt a {
display : block;
color : #255C4F;
font-size : 100px;
font-weight : bold;
line-height : 1.1;
}
.ban-txt a:hover {
color : #222;
}
.ban-txt a.txt-font {
font-size : 72px;
padding-top : 16px;
}
.ban-font p {
margin-top : 50px;
color : #666;
font-size : 18px;
line-height : 20px;
}
.ban-font p:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 20px;
height : 20px;
background : url(../images/ban-icon.png) no-repeat;
margin-right : 10px;
}
.ban-tab {
margin-top : -224px;
margin-left : 35%;
margin-right : 6%;
overflow : hidden;
}
.ban-tab .slick-list {
margin-left : -12px;
}
.ban-btn {
margin-top : 77px;
margin-left : 104px;
}
.tab-list {
float : left;
position : relative;
padding : 20px 20px 25px 90px;
background : #FFF;
box-shadow : 0 10px 20px rgb(25, 64, 54, 0.1);
border-radius : 10px;
margin : 22px 20px 22px 80px;
}
.tab-list:before {
content : "";
position : absolute;
left : -2px;
top : -2px;
bottom : -2px;
right : -2px;
background : linear-gradient(to right, #265D50 20%, #FFFFFF 80%);
border-radius : 10px;
z-index : -1;
width : 0;
transition : all 0.5s;
}
.tab-pro {
position : absolute;
left : -80px;
top : 10px;
}
.tab-info a {
display : block;
color : #333;
font-size : 18px;
font-weight : bold;
background : url(../images/ban-name01.png) right center no-repeat;
line-height : 32px;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
padding-right : 8px;
position : relative;
}
.tab-info p {
color : #333;
font-size : 16px;
margin-top : 15px;
}
.tab-list:hover:before, .tab-list.slick-current:before {
width : 100%;
}
.tab-list:hover .tab-info a, .tab-list.slick-current .tab-info a {
color : #194036;
background-image : url(../images/ban-name02.png);
}
.banner .slick-slide {
outline : none;
}
.ban-tab .slick-slide {
transform : none;
}
.ban-con .slick-prev:before, .ban-con .slick-next:before {
display : none;
}
.ban-con .slick-prev, .ban-con .slick-next {
font-size : 0;
top : auto;
left : 50%;
bottom : 115px;
z-index : 99;
width : 50px;
height : 50px;
background-repeat : no-repeat;
background-position : center center;
background-size : 100% 100%;
}
.ban-con .slick-prev {
margin-left : -700px;
background-image : url(../images/ban-arrow01.png);
}
.ban-con .slick-prev:hover {
background-image : url(../images/ban-arrow03.png);
}
.ban-con .slick-next {
right : auto;
margin-left : -540px;
background-image : url(../images/ban-arrow02.png);
}
.ban-con .slick-next:hover {
background-image : url(../images/ban-arrow04.png);
}
.paging {
position : absolute;
z-index : 99;
bottom : 56px;
left : 50%;
margin-left : -630px;
color : #8C8C8C;
font-size : 18px;
}
.paging .cur {
color : #194036;
font-size : 28px;
font-weight : bold;
}
.btn-more {
position : relative;
z-index : 1;
display : inline-block;
width : 200px;
line-height : 60px;
text-align : center;
vertical-align : middle;
border-radius : 60px;
transition : 0.8s;
color : #F0BE4D;
background : #255C4F;
font-size : 20px;
overflow : hidden;
}
.btn-more:after {
content : "";
position : absolute;
top : 0;
left : 0;
z-index : -1;
width : 0%;
height : 100%;
transition : 0.4s;
background : #F0BE4D;
}
.btn-more:hover:after {
width : 100%;
}
.btn-more:hover {
color : #255C4F;
background : #F0BE4D;
}
.ban-pic {
float : right;
width : 56%;
position : relative;
margin-top : 30px;
}
.ban-pic:after {
content : "";
position : absolute;
right : 0;
top : -70px;
width : 211px;
height : 623px;
background : url(../images/ban-right.png) no-repeat;
}
.ban-pic span {
position : absolute;
right : -130px;
top : 50%;
margin-top : -26px;
color : #F0BE4D;
font-size : 24px;
line-height : 30px;
width : 120px;
}
.ban-pic img {
transition : all 0.3s ease;
}
.ban-pic img:hover {
transform : scale(1.02);
}
.index-about {
padding : 150px 0 330px;
background : url(../images/about-bg.jpg) bottom right no-repeat #FFF;
}
.about-pic {
float : left;
width : 40%;
}
.about-info {
float : right;
width : 57%;
}
.about-info h1 {
color : #333;
font-size : 46px;
line-height : 1.1;
}
.about-info p {
color : #666;
font-size : 18px;
line-height : 36px;
margin-top : 40px;
}
.about-info ul {
margin-top : 50px;
margin-left : -3.3%;
}
.about-info ul li {
float : left;
width : 30%;
margin-left : 3.3%;
text-align : center;
}
.about-info ul li strong {
display : block;
color : #255C4F;
font-size : 48px;
line-height : 1.1;
}
.about-info ul li p {
margin-top : 4px;
}
.about-info span {
margin-top : 80px;
}
.btn-price {
display : inline-block;
width : 280px;
line-height : 70px;
text-align : center;
background-color : #F0BE4D;
border-radius : 70px;
color : #333;
font-size : 24px;
cursor : pointer;
position : relative;
z-index : 0;
}
.btn-price:before {
content : "";
position : absolute;
left : -10px;
top : -10px;
right : -10px;
bottom : -10px;
background : rgb(240, 190, 77, 0.3);
border-radius : 70px;
transition : all 0.3s ease;
z-index : -1;
}
.btn-price:hover:before {
background : rgb(240, 190, 77, 0.1);
}
.index-txt {
text-align : center;
}
.index-txt h2 {
color : #333;
font-size : 46px;
line-height : 1.1;
}
.index-txt h2:before, .index-txt h2:after {
content : '';
display : inline-block;
vertical-align : middle;
width : 35px;
height : 26px;
background-repeat : no-repeat;
margin-top : -6px;
}
.index-txt h2:before {
background-image : url(../images/tit-icon01.png);
margin-right : 20px;
}
.index-txt h2:after {
background-image : url(../images/tit-icon02.png);
margin-left : 20px;
}
.index-txt p {
color : #666;
font-size : 18px;
line-height : 30px;
margin-top : 30px;
}
.index-type {
margin-top : -180px;
}
.index-type ul {
margin-top : 70px;
}
.index-type li {
float : left;
width : 25%;
position : relative;
overflow : hidden;
}
.index-type li:before {
content : "";
position : absolute;
left : 0;
bottom : -35%;
width : 100%;
height : 35%;
background : url(../images/case-txt.png) bottom center repeat-x;
transition : all 0.5s;
z-index : 1;
}
.index-type li:after {
content : "";
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
background : rgb(0, 0, 0, 0.6);
transition : all 0.3s;
}
.type-pic a img {
width : 100%;
}
.type-txt {
position : absolute;
bottom : 30px;
z-index : 2;
color : #BBB;
line-height : 1.2;
padding-left : 70px;
}
.type-txt a {
display : block;
color : #BBB;
font-size : 46px;
font-weight : bold;
}
.type-txt span {
display : block;
font-size : 18px;
margin-top : 20px;
}
.type-link {
position : absolute;
left : 50%;
top : -50%;
margin-left : -60px;
margin-top : -60px;
transition : all 0.5s;
width : 120px;
height : 120px;
}
.type-link img {
width : 100%;
height : auto;
}
.index-type li:hover:after, .index-type li.type-on:after {
top : -100%;
}
.index-type li:hover:before, .index-type li.type-on:before {
bottom : 0;
}
.index-type li:hover .type-link, .index-type li.type-on .type-link {
top : 50%;
}
.index-type li:hover .type-txt, .index-type li.type-on .type-txt, .index-type li:hover .type-txt a, .index-type li.type-on .type-txt a {
color : #FFF;
}
.index-type li:hover .type-txt a:hover, .index-type li.type-on .type-txt a:hover {
color : #F0BE4D;
}
.index-hot {
padding-top : 120px;
background : url(../images/bg-hot.png) top center no-repeat;
}
.hot-pro {
position : relative;
}
.hot-txt {
position : absolute;
left : 0;
top : 0;
width : 36%;
}
.hot-txt h2, .base-txt h2 {
color : #333;
font-size : 46px;
line-height : 1.1;
}
.hot-txt p, .base-txt p {
color : #666;
font-size : 18px;
line-height : 36px;
margin-top : 26px;
}
.hot-con {
float : left;
}
.hot01 {
width : 25.7%;
margin : 3%;
margin-top : 130px;
}
.hot02 {
width : 25.7%;
margin : 0 5%;
}
.hot03 {
width : 28.6%;
margin-top : 128px;
position : relative;
}
.hot03:before {
content : "";
position : absolute;
right : 0;
top : -108px;
width : 464px;
height : 264px;
background : url(../images/dot-hot.png) no-repeat;
}
.hot-pic {
display : block;
position : relative;
overflow : hidden;
}
.hot-pic img {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
transition : all 0.3s;
}
.hot-pic img:hover {
transform : scale(1.02);
}
.hot01 .hot-pic {
padding-top : 68%;
}
.hot02 .hot-pic {
padding-top : 125%;
}
.hot03 .hot-pic {
padding-top : 100%;
}
.hot-font {
margin : 25px 0;
}
.hot-font a {
display : block;
color : #333;
font-size : 24px;
line-height : 30px;
font-weight : bold;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
}
.hot-font a:hover {
color : #255C4F;
}
.hot-font a:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 30px;
height : 30px;
background : url(../images/icon-pro.png) no-repeat;
background-size : cover;
margin : -1px 10px 0 -4px;
}
.hot-font p {
color : #666;
font-size : 18px;
line-height : 30px;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
margin-top : 12px;
padding-left : 36px;
}
.index-hot ul {
margin-left : -2.6%;
margin-top : 30px;
}
.index-hot ul li {
float : left;
width : 22.4%;
margin-left : 2.6%;
z-index : 0;
}
.hot-list {
padding : 10px;
position : relative;
}
.hot-list:before {
content : '';
position : absolute;
left : 0;
bottom : 0;
width : 100%;
height : 180px;
background-repeat : no-repeat;
background : url(../images/hot-list.png) bottom left no-repeat;
background-size : 100% 100%;
z-index : -1;
}
.hot-yd .hot-list:before {
background-image : url(../images/hot-lists.png);
}
.hot-list .hot-pic {
padding-top : 66.7%;
}
.index-pice {
position : relative;
margin-top : 80px;
}
.index-pice .pice {
position : absolute;
left : 34%;
top : 50px;
width : 56%;
}
.index-pice .pice h2 {
font-size : 46px;
color : #fff;
}
.index-pice .pice p {
font-size : 18px;
color : #dcdcdc;
margin-top : 20px;
}
.pice-bottom {
margin-top : 50px;
}
.pice-bottom .piceLeft {
float : left;
width : 70%;
}
.pice-bottom .piceRight {
float : right;
margin-top : 10px;
width : 30%;
}
.pice-bottom .piceLeft strong {
font-size : 26px;
color : #f0be4d;
display : block;
}
.pice-bottom .piceLeft .btn-price {
width : 350px;
height : 90px;
line-height : 90px;
display : block;
text-align : center;
font-size : 24px;
color : #1d2025;
font-weight : bold;
padding-right : 4%;
margin-top : 60px;
position : relative;
}
.pice-bottom .piceLeft .btn-price:after {
width : 24px;
height : 23px;
background : url(../images/fj.png) no-repeat;
content : "";
display : inline-block;
position : absolute;
left : 50%;
margin-left : 100px;
top : 50%;
margin-top : -12.5px;
}
.index-case {
position : relative;
padding-top : 110px;
z-index : 10;
margin-top : -40px;
}
.index-case:before {
content : "";
position : absolute;
left : 120px;
top : 0;
width : 260px;
height : 243px;
background : url(../images/case-icon.png) no-repeat;
z-index : -1;
}
.txt-name {
float : left;
width : 700px;
}
.txt-name h2 {
color : #333;
font-size : 46px;
line-height : 1.1;
}
.txt-name p {
color : #666;
font-size : 18px;
line-height : 36px;
margin-top : 20px;
}
.txt-btn {
float : right;
margin-top : 50px;
}
.txt-btn span {
display : inline-block;
line-height : 60px;
padding : 0 40px;
color : #F0BE4D;
font-size : 20px;
font-weight : bold;
background-color : #255C4F;
border-radius : 60px;
cursor : pointer;
position : relative;
}
.txt-btn span:after {
content : "";
position : absolute;
left : 5px;
top : 5px;
right : 5px;
bottom : 5px;
border : #F0BE4D dashed 1px;
border-radius : 60px;
transition : all 0.3s ease;
}
.txt-btn span:hover:after {
top : 8px;
left : 8px;
right : 8px;
bottom : 8px;
}
.case-no {
display : none;
}
.case-link {
margin-left : -3%;
margin-top : 66px;
}
.case-link li {
float : left;
width : 30.3%;
margin-left : 3%;
transition : all 0.3s;
}
.case-pic {
margin-right : 7%;
}
.case-pic a {
display : block;
position : relative;
padding-top : 75%;
}
.case-pic a img {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
}
.case-info {
position : relative;
padding : 26px 30px;
margin-left : 6%;
margin-top : -50px;
background : url(../images/case-line.png) left top;
box-shadow : 0 10px 20px rgb(0, 0, 0, 0.1);
}
.case-info:before {
content : "";
position : absolute;
left : 0;
bottom : 0;
width : 80px;
height : 4px;
background-color : #255C4F;
transition : all 0.3s ease;
}
.case-info h3 a {
display : block;
color : #333;
font-size : 24px;
line-height : 30px;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
padding-right : 32px;
}
.case-info h3 a:hover {
color : #255C4F;
}
.case-info p {
color : #666;
font-size : 16px;
line-height : 30px;
margin-top : 12px;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
}
.case-info p:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 10px;
height : 10px;
border : #255C4F solid 1px;
border-radius : 50%;
margin-right : 8px;
margin-top : -3px;
}
.case-more {
position : absolute;
right : 30px;
top : 26px;
}
.case-more img {
width : 32px;
height : auto;
}
.case-link li:hover {
transform : translateY(-5px);
}
.case-link li:hover .case-info:before {
width : 100%;
}
.index-video {
padding-bottom : 130px;
margin-top : 120px;
position : relative;
}
.index-video:before {
content : "";
position : absolute;
left : 0;
bottom : 0;
width : 100%;
height : 600px;
background : url(../images/video-bg.png) bottom center no-repeat #1D2025;
z-index : -1;
}
.video-base {
float : left;
width : 55%;
}
.video-con {
margin-top : 44px;
position : relative;
}
.video-btn {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
z-index : 9;
cursor : pointer;
}
.video-btn img {
position : absolute;
width : 140px;
height : 140px;
left : 50%;
top : 50%;
margin-left : -70px;
margin-top : -70px;
z-index : 99;
}
.video-con video {
width : 100%;
height : auto;
}
.video-link {
margin-top : 84px;
}
.video-link strong {
display : block;
font-weight : normal;
color : #FFF;
font-size : 36px;
line-height : 1.1;
text-align : center;
position : relative;
top : -32px;
}
.video-link span {
display : inline-block;
margin-top : 60px;
line-height : 70px;
width : 260px;
text-align : center;
background : linear-gradient(to right, #FB2740 0%, #FE5F60 100%);
border-radius : 60px;
box-shadow : 0 0 30px rgb(251, 39, 64, 0.2);
color : #FFF;
font-size : 24px;
cursor : pointer;
transition : all 0.3s ease;
}
.video-link span:hover {
margin-left : 8px;
}
.video-info {
float : right;
width : 45%;
position : relative;
padding : 80px 6% 0 5%;
color : #DCDCDC;
font-size : 18px;
line-height : 36px;
}
.video-info:before {
content : "";
position : absolute;
left : -25%;
right : 0;
top : 0;
height : 100%;
background-color : #1d2025;
z-index : -1;
box-shadow : 0 0 50px rgb(29, 32, 37, 0.3);
}
.video-info li {
margin-bottom : 80px;
}
.video-info strong {
display : block;
color : #FFF;
font-size : 24px;
}
.video-info strong i {
display : inline-block;
color : #F0BE4D;
margin-right : 20px;
}
.video-info p {
margin-top : 18px;
}
.index-news {
margin-top : 100px;
}
.index-news .index-txt {
margin-bottom : 40px;
}
.news-box {
float : left;
width : 47%;
}
.box-fr {
margin-left : 6%;
}
.news-txt {
line-height : 40px;
}
.txt-more {
float : right;
width : 50px;
transition : all 0.3s;
}
.txt-more:hover {
margin-right : -5px;
}
.txt-con {
overflow : hidden;
display : block;
color : #333;
font-size : 30px;
font-weight : bold;
}
.txt-con:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 49px;
height : 34px;
background : url(../images/tit-icon03.png) no-repeat;
margin-right : 15px;
margin-top : -2px;
}
.txt-con:hover {
color : #255C4F;
}
.box-hot {
margin-top : 30px;
}
.box-hot li {
padding : 20px;
background-color : #FFF;
border-radius : 10px;
box-shadow : 0 3px 15px rgb(37, 92, 79, 0.15);
overflow : hidden;
position : relative;
margin-bottom : 40px;
}
.box-pic {
float : left;
width : 200px;
}
.box-pic a {
display : block;
position : relative;
padding-top : 66.3%;
overflow : hidden;
}
.box-pic a:before {
content : " ";
position : absolute;
z-index : 1;
top : 20px;
left : -200px;
width : 240px;
height : 40px;
background : rgb(255, 255, 255, 0.3);
transform : rotate(-45deg);
transition : all 0.15s ease-in-out;
}
.box-pic a:hover:before {
margin-left : 400px;
}
.box-pic a img {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
border-radius : 10px;
}
.box-info {
display : block;
overflow : hidden;
padding : 6px 20px;
}
.box-info a {
display : block;
color : #333;
font-size : 18px;
line-height : 28px;
font-weight : bold;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
}
.box-info a:hover {
color : #255C4F;
}
.box-info p.box-font {
line-height : 26px;
height : 52px;
margin-top : 10px;
overflow : hidden;
}
.box-info span {
display : inline-block;
color : #AAA;
font-size : 16px;
margin-top : 12px;
}
.box-more {
position : absolute;
right : 0;
bottom : 0;
width : 42px;
line-height : 42px;
text-align : center;
background-color : #255C4F;
border-top-left-radius : 10px;
transition : all 0.3s;
}
.box-more:hover {
width : 50px;
}
.box-list li {
line-height : 34px;
margin-top : 40px;
}
.box-list li span {
float : right;
width : 90px;
margin-left : 20px;
color : #AAA;
font-size : 16px;
}
.box-list li a {
display : block;
overflow : hidden;
color : #666;
font-size : 18px;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
transition : all 0.3s;
}
.box-list li a:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 26px;
height : 26px;
background : url(../images/news-icon.png) no-repeat;
margin-right : 8px;
margin-top : -6px;
}
.box-list li:hover a {
margin-left : 4px;
color : #255C4F;
}
.index-cont {
margin-top : 100px;
position : relative;
padding : 55px 66px;
z-index : 1;
}
.index-cont:before {
content : "";
position : absolute;
left : 0;
top : 0;
width : 82%;
height : 100%;
background-color : #255C4F;
border-radius : 0 20px 20px 0;
z-index : -1;
}
.index-cont:after {
content : "";
position : absolute;
left : 0;
bottom : -7px;
width : 259px;
height : 400px;
background : url(../images/pic-head01.png) no-repeat;
background-size : 100% 100%;
}
.cont-font {
float : left;
color : #FFF;
font-size : 30px;
line-height : 30px;
font-weight : bold;
margin-left : 12px;
margin-top : -40px;
}
.cont-font p {
margin-top : 60px;
}
.cont-font i {
display : inline-block;
color : #F0BE4D;
}
.cont-edit {
float : left;
margin-left : 20px;
}
.edit-text, .edit-area, .edit-btn {
float : left;
margin-left : 30px;
}
.edit-text {
margin-top : -30px;
}
.edit-text label {
display : block;
margin-top : 30px;
position : relative;
}
.edit-text label i {
position : absolute;
color : #FF3434;
top : 16px;
right : 10px;
font-size : 20px;
}
.edit-text label input, .edit-area textarea {
background-color : rgb(255, 255, 255, 0.1);
border : #FFF solid 1px;
width : 260px;
border-radius : 4px;
color : #EEE;
font-size : 18px;
padding : 17px 16px;
}
.edit-area label {
display : block;
}
.edit-area textarea {
line-height : 36px;
height : 154px;
padding-top : 8px;
padding-bottom : 8px;
}
.edit-btn button {
position : relative;
background : linear-gradient(to right, #F0BE4D 0%, #FBDA8F 50%, #F0BE4D 100%);
width : 150px;
height : 146px;
color : #333;
font-size : 24px;
font-weight : bold;
line-height : 48px;
border-radius : 10px;
cursor : pointer;
transition : all 0.5s;
}
.edit-btn button:before {
content : "";
position : absolute;
left : 0;
top : 8px;
width : 100%;
height : 100%;
background-color : #A47A1A;
border-radius : 10px;
z-index : -1;
transition : all 0.3s;
}
.edit-btn button:hover {
height : 154px;
color : #255C4F;
}
.edit-btn button:hover:before {
top : 0;
}
.index-link {
position : relative;
padding : 50px 0;
background-color : #F5F5F5;
z-index : 0;
}
.index-link:before {
content : "";
position : absolute;
left : 106px;
top : -130px;
right : 0;
bottom : 0;
background-color : #393B45;
border-bottom-left-radius : 20px;
z-index : -1;
}
.link-con {
float : left;
width : 11%;
margin-left : 11.1%;
}
.link-fl {
margin-left : 0;
}
.link-con a {
color : #B3B3B3;
font-size : 16px;
line-height : 46px;
transition : all 0.3s;
}
.link-con a:hover {
color : #FFF;
font-size : 17px;
}
.link-con dt {
margin-bottom : 20px;
}
.link-con dt a {
color : #FFF;
font-size : 20px;
font-weight : bold;
}
.link-con dt a:hover {
color : #F0BE4D;
font-size : 20px;
}
.link-care {
float : right;
width : 480px;
margin-top : 10px;
}
.link-care p {
color : #BEBEBF;
font-size : 18px;
line-height : 1.2;
margin-bottom : 36px;
}
.link-care p strong {
color : #f0be4d;
font-size : 30px;
padding-left : 5px;
position : relative;
top : 2px;
}
.link-care p.care-txt {
color : #81dac5;
font-size : 24px;
}
.index-foot {
background-color : #F5F5F5;
padding : 20px 0 40px;
text-align : center;
font-size : 14px;
color : #666;
line-height : 24px;
}
.foot-link a {
display : inline-block;
color : #666;
margin-right : 12px;
}
.foot-link a:hover {
color : #194036;
}
.index-foot p {
margin-top : 20px;
}
.index-foot p a {
color : #194036;
margin : 0 12px;
}
.index-foot p a:hover {
text-decoration : underline;
}
.index-footer {
background-color : #34363B;
color : #FFF;
font-size : 14px;
text-align : center;
line-height : 24px;
padding : 18px 0;
}
.head-con .nav li a {
color : #FFF;
}
.head-con .nav li.nav-on a, .head-con .nav li:hover a {
color : #F0BE4D;
}
.top-about {
padding-top : 156px;
background-repeat : no-repeat;
background-size : 100%;
background-image : url(../images/about-con.jpg);
background-position : top right;
}
.place-show {
font-size : 14px;
line-height : 30px;
color : #888;
}
.place-show i {
display : inline-block;
color : #ACACAC;
}
.place-show ol {
display : inline-block;
}
.place-show ol li {
display : inline-block;
padding : 0 2px;
}
.place-show ol li a {
color : #ACACAC;
}
.place-show ol li a:hover {
color : #F0BE4D;
}
.about-streng {
margin-top : 70px;
width : 680px;
}
.about-txt h1, .about-txt h2 {
color : #F0BE4D;
font-size : 48px;
line-height : 1.1;
}
.about-txt p {
color : #D3D3D3;
font-size : 18px;
line-height : 36px;
margin-top : 60px;
}
.area-btn {
display : inline-block;
width : 200px;
line-height : 70px;
background : url(../images/area-btn.png) no-repeat;
color : #FFF;
font-size : 22px;
padding-left : 40px;
position : relative;
margin-top : 24px;
cursor : pointer;
}
.area-btn:before {
content : "";
position : absolute;
right : 32px;
top : 20px;
width : 30px;
height : 30px;
transition : all 0.3s;
background : url(../images/area-icon.png) no-repeat;
}
.area-btn:hover {
color : #F0BE4D;
}
.area-btn:hover:before {
right : 28px;
}
.about-video {
margin-top : 70px;
}
.about-video span {
display : inline-block;
width : 250px;
line-height : 90px;
background : url(../images/video-about.png) no-repeat;
text-align : center;
color : #FFF;
font-size : 22px;
text-indent : -40px;
cursor : pointer;
transition : all 0.3s ease;
}
.about-video span:hover {
font-size : 24px;
color : #F0BE4D;
}
.popu-video {
position : fixed;
width : 100%;
height : 100%;
left : 0;
top : -100%;
transition : 0.3s;
opacity : 0;
z-index : 9999;
}
.popu-video.open {
top : 0;
opacity : 1;
}
.popu-bg {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
background-color : rgb(0, 0, 0, 0.6);
}
.popu-video .video-show {
position : absolute;
left : 50%;
top : 50%;
transform : translate(-50%,-50%);
z-index : 1;
width : 92%;
max-width : 1000px;
}
.popu-video .video-show video {
display : block;
width : 100%;
height : auto;
}
.popu-video .video-close {
position : absolute;
right : 0;
top : -50px;
font-size : 40px;
line-height : 1;
color : #FFF;
cursor : pointer;
font-weight : 400;
font-style : normal;
}
.about-honor {
margin-top : 50px;
position : relative;
z-index : 0;
font-size : 0;
}
.about-honor:before {
content : "";
position : absolute;
left : 0;
top : 66px;
bottom : 66px;
width : 50%;
border : #F0BE4D solid 6px;
z-index : -1;
}
.honor-info {
display : inline-block;
vertical-align : middle;
width : 48%;
padding : 0 46px;
}
.honor-info p {
margin-top : 50px;
}
.honor-pic {
display : inline-block;
vertical-align : middle;
width : 52%;
}
.honor-pic img {
width : 100%;
height : auto;
}
.about-vie {
margin-top : 110px;
}
.vie-pic {
float : left;
width : 48%;
}
.vie-pic img {
width : 100%;
height : auto;
border-radius : 4px;
}
.vie-info {
float : left;
width : 52%;
padding-top : 24px;
padding-left : 70px;
}
.vie-info p {
margin-top : 40px;
}
.vie-info li {
margin-top : 72px;
color : #D3D3D3;
font-size : 18px;
}
.vie-info li:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 79px;
height : 34px;
background : url(../images/about-line.png) no-repeat;
margin-top : -20px;
margin-right : 24px;
}
.vie-info li strong {
display : inline-block;
vertical-align : bottom;
font-size : 48px;
line-height : 1;
margin-right : 18px;
color : #FFF;
}
.vie-info li strong i {
font-size : 26px;
position : relative;
bottom : 0;
margin-left : 5px;
}
.about-area {
margin-top : 66px;
background : url(../images/about-pic.jpg) no-repeat;
background-size : cover;
}
.area-info {
float : left;
width : 50%;
padding : 50px 40px;
}
.area-pic {
float : left;
width : 50%;
}
.pic-tab {
position : relative;
padding-top : 64.3%;
}
.pic-tab img {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
}
.area-pic .slick-prev:before, .area-pic .slick-next:before {
display : none;
}
.area-pic .slick-prev, .area-pic .slick-next {
font-size : 0;
top : auto;
left : 0;
bottom : 72px;
z-index : 99;
width : 32px;
height : 24px;
background-repeat : no-repeat;
background-position : center center;
background-size : 100% 100%;
}
.area-pic .slick-prev {
margin-left : -226px;
background-image : url(../images/area-arrow01.png);
}
.area-pic .slick-prev:hover {
background-image : url(../images/area-arrow03.png);
}
.area-pic .slick-next {
margin-left : -80px;
background-image : url(../images/area-arrow02.png);
}
.area-pic .slick-next:hover {
background-image : url(../images/area-arrow04.png);
}
.about-area {
position : relative;
z-index : 1;
}
.about-area .pagings {
position : absolute;
bottom : 63px;
left : 50%;
margin-left : -172px;
color : #8C8C8C;
font-size : 18px;
}
.about-area .pagings .cur {
color : #FFF;
font-size : 28px;
font-weight : bold;
}
.about-union {
position : relative;
padding-top : 110px;
z-index : 0;
}
.about-union:before {
content : "";
position : absolute;
right : 0;
top : -163px;
width : 525px;
height : 958px;
background : url(../images/about-side.png) no-repeat;
}
.about-price {
position : relative;
}
.price-info {
width : 50%;
}
.price01 {
background-color : #2B6C5C;
color : #FFF;
}
.price01:before {
background : rgb(43, 108, 92, 0.3);
}
.price01:hover:before {
background : rgb(43, 108, 92, 0.1);
}
.price-con {
margin-top : 70px;
}
.price-con img {
margin-left : 20px;
}
.price-pic {
position : absolute;
left : 50%;
top : 10px;
width : 41%;
}
.price-pic img {
width : 100%;
height : auto;
}
.about-nation {
margin-top : 100px;
}
.about-nation p {
text-align : left;
}
.about-nation p img {
width : 100%;
height : auto;
margin-top : 25px;
}
.about-ser {
position : relative;
padding-top : 120px;
margin-top : 110px;
background : url(../images/about-ser.jpg) no-repeat;
background-size : cover;
overflow : hidden;
}
.about-ser li {
float : left;
width : 49.6%;
color : #FFF;
font-size : 20px;
line-height : 48px;
margin-bottom : 130px;
position : relative;
padding-left : 36px;
}
.about-ser li:before {
content : "";
position : absolute;
left : 6px;
top : 8px;
width : 4px;
height : 80px;
background-color : #FFC747;
}
.about-ser li.ser-no:before {
display : none;
}
.about-ser li i {
color : #FFC747;
}
.ser-font {
position : absolute;
left : 52%;
top : 40%;
width : 570px;
z-index : 2;
}
.ser-font strong {
color : #FFC747;
font-size : 48px;
line-height : 1.1;
}
.ser-font p {
color : #D3D3D3;
font-size : 18px;
line-height : 36px;
margin-top : 40px;
}
.ser-shield {
position : absolute;
top : 50%;
left : 50%;
margin-top : -100px;
margin-left : -328px;
}
.ser-shield span {
position : relative;
display : inline-block;
width : 160px;
height : 160px;
text-align : center;
line-height : 160px;
background : rgb(255, 199, 71, 0.05);
border-radius : 50%;
z-index : 6;
}
.shield-con {
position : relative;
z-index : 0;
}
.shield-line {
position : absolute;
border-radius : 50%;
background : rgb(255, 199, 71, 0.05);
opacity : 1;
z-index : -1;
}
.shield-con:before {
content : "";
position : absolute;
z-index : 0;
left : 50%;
top : 50%;
transform : translateX(-50%) translateY(-50%);
width : 600px;
height : 600px;
background : rgb(255, 199, 71, 0.05);
border-radius : 50%;
animation : pulse-border 1500ms ease-out infinite;
}
.shield-con:after {
content : "";
position : absolute;
z-index : 1;
left : 50%;
top : 50%;
transform : translateX(-50%) translateY(-50%);
display : block;
width : 400px;
height : 400px;
background : rgb(255, 199, 71, 0.05);
border-radius : 50%;
transition : all 200ms;
}
@keyframes pulse-border {
0% {
transform : translateX(-50%) translateY(-50%) translateZ(0) scale(1);
opacity : 1;
}
100% {
transform : translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
opacity : 0;
}
}
.top-con {
padding-top : 155px;
background-repeat : no-repeat;
background-size : cover;
}
.top-ser {
background-image : url(../images/bantop-ser.jpg);
}
.top-pro {
background-image : url(../images/bantop-pro.jpg);
padding-bottom : 100px;
}
.top-case {
background-image : url(../images/bantop-case.jpg);
padding-bottom : 100px;
}
.top-news {
background-image : url(../images/bantop-news.jpg);
padding-bottom : 100px;
}
.top-base {
padding : 70px 0;
}
.top-base h1 {
display : inline-block;
color : #F0BE4D;
font-size : 48px;
line-height : 1.1;
}
.top-base p {
color : #D3D3D3;
font-size : 18px;
line-height : 30px;
margin-top : 55px;
}
.ser-idea {
padding : 80px 0;
background-color : #F4F4F4;
}
.ser-idea ul {
margin-left : -3%;
margin-top : 50px;
}
.ser-idea ul li {
float : left;
width : 30.3%;
margin-left : 3%;
position : relative;
}
.ser-idea ul li img {
width : 100%;
height : auto;
border-radius : 10px;
}
.ser-idea ul li strong {
position : absolute;
left : 0;
bottom : 0;
width : 112px;
height : 74px;
line-height : 77px;
background : url(../images/ser-idea.png) no-repeat;
color : #FFF;
font-size : 24px;
z-index : 2;
padding-left : 24px;
}
.ser-idea ul li p {
position : absolute;
right : 0;
bottom : 0;
left : 90px;
background-color : #F0BE4D;
line-height : 50px;
text-align : center;
padding-left : 6px;
color : #333;
font-size : 18px;
border-bottom-right-radius : 10px;
}
.ser-flow {
margin-top : 75px;
}
.ser-flow ul {
margin-left : -5%;
margin-top : 55px;
}
.ser-flow ul li {
float : left;
width : 11.6%;
margin-left : 5%;
text-align : center;
position : relative;
}
.ser-flow ul li:after {
content : "";
position : absolute;
right : -28%;
top : 33%;
width : 20px;
height : 32px;
background : url(../images/ser-flow.png) no-repeat;
}
.ser-flow ul li.flow-last:after {
display : none;
}
.ser-flow ul li img {
max-width : 100%;
height : auto;
transition : all 0.8s 0s cubic-bezier(0.5,0,0.2,1);
}
.ser-flow ul li:hover img {
transform : rotateY(0) rotateZ(360deg) rotateX(0);
}
.ser-flow ul li p {
color : #666;
font-size : 18px;
line-height : 24px;
margin : 20px 0;
}
.ser-parts {
margin-top : 80px;
padding : 80px 0 90px;
background-color : #F4F4F4;
}
.part-info {
float : left;
width : 65%;
}
.part-con {
position : relative;
margin-top : 52px;
}
.part-con span {
position : absolute;
left : 0;
top : -6px;
cursor : pointer;
}
.part-con span img {
width : 100%;
height : auto;
}
.part-pic {
float : right;
width : 30%;
}
.part-pic img {
width : 100%;
height : auto;
}
.pro-cons {
position : relative;
margin-top : -95px;
z-index : 0;
padding-top : 50px;
}
.pro-cons:before {
content : "";
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
background-color : #FFF;
border-radius : 40px 40px 0 0;
z-index : -1;
}
.more-btn {
float : right;
width : 200px;
line-height : 50px;
background : url(../images/more-btn.png) no-repeat;
color : #FFF;
font-size : 22px;
padding-left : 40px;
position : relative;
top : 10px;
}
.more-btn:before, .more-btn:after {
content : "";
position : absolute;
transition : all 0.3s;
}
.more-btn:before {
right : 10px;
top : 10px;
width : 30px;
height : 30px;
background : url(../images/more-icon.png) no-repeat;
}
.more-btn:after {
right : 20px;
top : 19px;
width : 27px;
height : 12px;
background : url(../images/more-arrow.png) no-repeat;
}
.more-btn:hover {
color : #F0BE4D;
}
.more-btn:hover:before {
right : 24px;
}
.more-btn:hover:after {
right : 10px;
}
.pro-txt p {
color : #666;
font-size : 18px;
line-height : 36px;
margin-top : 10px;
}
.pro-con {
max-width : 1280px;
margin : 0 auto;
}
.pro-con ul {
margin-top : 34px;
margin-left : -2.1%;
padding-bottom : 100px;
}
.pro-con ul li {
float : left;
width : 31.2%;
margin-left : 2.1%;
background : url(../images/pro-line.png);
box-shadow : 0 3px 2px rgb(247, 171, 0, 0.3);
border-radius : 10px;
transition : all 0.3s;
}
.pro-con ul li:hover {
transform : translateY(-5px);
}
.pro-pic {
position : relative;
padding-top : 73.9%;
display : block;
}
.pro-pic img {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
border-radius : 10px;
}
.pro-info {
padding : 30px 12px;
}
.pro-info a {
display : block;
color : #333;
font-size : 24px;
line-height : 30px;
font-weight : bold;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
margin-bottom : 10px;
}
.pro-info a:hover {
color : #255C4F;
}
.pro-info a:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 30px;
height : 30px;
background : url(../images/icon-pro.png) no-repeat;
background-size : cover;
margin : -1px 10px 0 -4px;
}
.pro-info p {
color : #666;
font-size : 18px;
line-height : 42px;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
}
.color-bg {
background-color : #F5F5F5;
}
.case-con {
position : relative;
margin-top : -95px;
}
.case-tab {
padding : 40px 0;
background : url(../images/case-line.png) left top;
border-radius : 10px;
box-shadow : 0 5px 20px rgb(37, 92, 79, 0.15);
}
.case-tab li {
float : left;
width : 20%;
text-align : center;
color : #666;
font-size : 24px;
line-height : 40px;
position : relative;
cursor : pointer;
}
.case-tab li:after {
content : "";
position : absolute;
right : 0;
top : 0;
width : 1px;
height : 100%;
background-color : #AAA;
}
.case-tab li:last-child:after {
display : none;
}
.case-tab li.case-on, .case-tab li:hover {
color : #2B6C5C;
font-weight : bold;
}
.case-list li {
margin-bottom : 80px;
}
.news-con {
margin-top : -95px;
padding : 70px 60px;
background-color : #FFF;
border-radius : 10px 10px 0 0;
}
.hot-news {
position : relative;
float : left;
width : 62.5%;
}
.news-pic {
position : relative;
padding-top : 66.25%;
display : block;
overflow : hidden;
border-radius : 10px;
}
.news-pic img {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
transition : all 0.3s ease;
}
.hot-news:hover img {
transform : scale(1.02);
}
.hot-name {
position : absolute;
left : 0;
bottom : 0;
width : 100%;
height : 168px;
background : url(../images/news-hotbg01.png) no-repeat;
background-size : 100%;
padding : 16px 50px;
border-radius : 0 0 10px 10px;
}
.hot-name a {
display : block;
color : #FFF;
font-size : 30px;
font-weight : bold;
line-height : 1.1;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
}
.hot-name a:hover {
color : #F0BE4D;
}
.hot-name p {
color : #D3D3D3;
font-size : 18px;
line-height : 36px;
overflow : hidden;
margin-top : 20px;
}
.hot-link {
float : right;
width : 30%;
margin-top : 110px;
padding : 34px 40px 68px;
background : linear-gradient(to right, #368873 0%, #255C4F 100%);
position : relative;
z-index : 0;
border-radius : 20px;
box-shadow : 0 5px 20px rgb(0, 0, 0, 0.15);
}
.hot-link:after {
content : "";
position : absolute;
left : 6px;
top : 6px;
right : 6px;
bottom : 6px;
background : url(../images/link-bg.png);
border-radius : 16px;
z-index : -1;
}
.hot-link li {
color : #255C4F;
font-size : 18px;
font-weight : bold;
line-height : 36px;
margin-bottom : 20px;
}
.hot-link li:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 26px;
height : 26px;
background : url(../images/link-icon.png) no-repeat;
margin-right : 8px;
margin-top : -2px;
}
.hot-link p {
color : #333;
font-size : 18px;
line-height : 36px;
}
.link-btn {
position : absolute;
left : 0;
top : -96px;
width : 207px;
height : 62px;
color : #FFF;
font-size : 24px;
line-height : 56px;
padding-left : 26px;
background : url(../images/link-btn.png) no-repeat;
cursor : pointer;
}
.link-btn:hover {
color : #F0BE4D;
}
.link-head {
position : absolute;
right : 0;
top : -110px;
width : 134px;
}
.link-head img {
width : 100%;
height : auto;
}
.link-sell {
position : absolute;
top : -5px;
right : -12px;
width : 196px;
height : 196px;
background : url(../images/link-sell.png) no-repeat;
color : #FFF;
font-size : 24px;
line-height : 36px;
padding : 16px 33px;
text-align : right;
}
.link-sell strong {
display : block;
color : #F0BE4D;
line-height : 1.1;
}
.link-sell strong i {
font-size : 48px;
margin-right : 3px;
position : relative;
top : 3px;
}
.link-tel {
position : absolute;
left : -17px;
bottom : -55px;
width : 301px;
height : 135px;
background : url(../images/link-tel.png) no-repeat;
color : #F0BE4D;
font-size : 24px;
font-weight : bold;
line-height : 135px;
padding-left : 50px;
}
.news-hots {
margin-top : 40px;
}
.news-hots ul {
margin-left : -4.7%;
}
.news-hots ul li {
float : left;
width : 45.3%;
margin-left : 4.7%;
position : relative;
border-radius : 10px;
overflow : hidden;
}
.hots-pic {
position : relative;
padding-top : 42.6%;
display : block;
}
.hots-pic img {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
transition : all 0.3s ease;
}
.news-hots ul li:hover img {
transform : scale(1.02);
}
.hots-name {
position : absolute;
left : 0;
bottom : 0;
width : 100%;
height : 147px;
background : url(../images/news-hotbg02.png) no-repeat;
background-size : 100%;
padding : 84px 30px 10px;
border-radius : 0 0 10px 10px;
color : #FFF;
font-size : 24px;
font-weight : bold;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
}
.news-hots ul li:hover .hots-name {
color : #F0BE4D;
}
.news-list {
margin-top : 36px;
}
.news-list ul {
margin-left : -4.7%;
}
.news-list li {
float : left;
width : 45.3%;
margin-left : 4.7%;
line-height : 34px;
margin-top : 40px;
}
.news-list li span {
float : right;
width : 90px;
margin-left : 20px;
color : #AAA;
font-size : 16px;
}
.news-list li a {
display : block;
overflow : hidden;
color : #666;
font-size : 18px;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
transition : all 0.3s;
}
.news-list li a:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 26px;
height : 26px;
background : url(../images/news-icon.png) no-repeat;
margin-right : 8px;
margin-top : -6px;
}
.news-list li:hover a {
margin-left : 4px;
color : #255C4F;
}
.main-page {
position : relative;
width : 100%;
color : #333;
font-size : 16px;
line-height : 38px;
text-align : center;
margin : 70px auto 0;
}
.main-page span, .main-page a {
display : inline-block;
color : #666;
margin : 0 5px;
padding : 0 14px;
border : #DEDFE0 solid 1px;
background-color : #FFF;
cursor : pointer;
}
.main-page .current {
color : #FFF;
border : #255C4F solid 1px;
background-color : #255C4F;
}
.pagination {
display : inline-block;
margin : 0 auto;
}
.pagination li {
float : left;
}
.active span, .disabled span {
cursor : default;
}
.page-active span {
border : #255C4F solid 1px;
cursor : default;
display : block;
padding : 2px;
width : 40px;
height : 40px;
line-height : 35px;
text-align : center;
}
.main-page a:hover, .pagination .active span, .ul-tab-page .on a, .page-active span {
color : #FFF;
border : #255C4F solid 1px;
background : #255C4F;
box-shadow : 0 5px 10px -2px rgb(37, 92, 79, 0.35);
}
.pagination ul {
display : inline-block;
}
.dn {
display : none;
}
.t-page {
box-sizing : inherit;
display : none;
position : absolute;
left : 50%;
width : 600px;
bottom : 80px;
margin-left : -300px;
padding : 26px 26px 10px;
border : #DEDFE0 solid 1px;
z-index : 10;
background-color : #FFF;
}
.t-page .close {
position : absolute;
right : 0;
top : 5px;
width : 30px;
height : 30px;
line-height : 30px;
color : #333;
cursor : pointer;
}
.t-page .ico {
content : '';
position : absolute;
bottom : -12px;
left : 50%;
margin-left : -12px;
width : 0;
height : 0;
border-width : 12px 12px 0;
border-style : solid;
border-color : #DEDFE0 transparent transparent;
}
.t-page .ico em {
content : '';
position : absolute;
bottom : 1px;
left : -12px;
width : 0;
height : 0;
border-width : 12px 12px 0;
border-style : solid;
border-color : #FFF transparent transparent;
}
.ul-page {
text-align : center;
overflow : hidden;
}
.ul-page li {
float : left;
margin-bottom : 10px;
}
.ul-page li a {
display : block;
padding : 2px;
width : 40px;
height : 40px;
line-height : 35px;
border : #CACACA solid 1px;
text-align : center;
}
.ul-page li a, .ul-page li span {
margin : 0 7px;
}
.ul-tab-page {
overflow : hidden;
margin-top : 20px;
}
.ul-tab-page li {
float : left;
width : 20%;
text-align : center;
margin-bottom : 15px;
}
.ul-tab-page li a {
display : block;
font-size : 16px;
color : #333;
padding : 0 12px;
line-height : 36px;
border : #F5F5F5 solid 1px;
background-color : #F5F5F5;
}
.pro-page {
background-image : url(../images/page-pro.jpg);
padding-bottom : 80px;
}
.case-page {
background-image : url(../images/page_case.jpg);
padding-bottom : 80px;
}
.page-top {
margin-top : -25px;
}
.page-top .page-left {
float : left;
width : 48%;
max-width : 670px;
position : relative;
z-index : 2;
margin-top : 71px;
}
.page-top .page-left img {
width : 100%;
border-radius : 10px 60px 0 60px;
box-shadow : 0 3px 49px rgb(8, 39, 42, 0.2);
}
.page-top .page-right {
float : right;
width : 70%;
margin-left : -20%;
margin-right : 7px;
background-color : #fff;
position : relative;
z-index : 1;
padding : 70px 50px 0 22%;
border-top-left-radius : 100px;
height : 590px;
}
.page-top .page-right:before {
width : 107px;
height : 89px;
background : url(../images/yq.png) no-repeat;
background-size : 100% 100%;
content : "";
display : block;
position : absolute;
top : 0;
right : 0;
}
.page-top .page-right:after {
background : url(../images/sj_a.png) no-repeat;
width : 256px;
height : 224px;
background-size : 100% 100%;
content : "";
display : block;
position : absolute;
right : -22px;
bottom : -22px;
}
.page-top .page-right h1 {
font-size : 36px;
color : #333;
}
.page-top .page-right li {
font-size : 18px;
color : #4d4f53;
margin-top : 45px;
padding-left : 60px;
position : relative;
line-height : 2em;
}
.page-top .page-right li:before {
width : 54px;
height : 46px;
background : url(../images/fk.png) no-repeat;
background-size : 100% 100%;
position : absolute;
left : -10px;
top : -3px;
content : "";
display : block;
}
.page-top .page-right .box {
margin-top : 55px;
}
.page-top .page-right .box .box-left {
float : left;
}
.page-top .page-right .box .box-left p {
font-size : 18px;
color : #4d4f53;
}
.page-top .page-right .box .box-left strong {
font-size : 28px;
color : #255c4f;
}
.page-top .page-right .box .box-right {
float : right;
width : 256px;
height : 75px;
line-height : 75px;
position : relative;
z-index : 100;
}
.page-top .page-right .box .box-right span {
display : block;
text-align : center;
cursor : pointer;
box-shadow : 0 5px 20px rgb(49, 72, 125, 0.3);
border-radius : 30px 10px 10px 0;
background : #fff;
font-size : 24px;
color : #206268;
font-weight : bold;
}
.page-top .page-right .box .box-right:before {
background : url(../images/d_bg.png) no-repeat;
width : 171px;
height : 66px;
content : "";
display : block;
position : absolute;
left : -51.8%;
top : 5px;
z-index : -1;
transition : all 0.6s ease;
}
.page-top .page-right .box .box-right:hover:before {
left : -30%;
transition : all 0.6s ease;
}
.content-box {
background : #f5f5f5;
}
.list-nav {
background : #2e3038;
padding : 31px 0;
}
.list-nav li {
float : left;
width : 25%;
font-size : 22px;
color : #ccccd4;
text-align : center;
background : url(../images/bt_icon.png) 35% center no-repeat;
background-size : 20px 22px;
position : relative;
padding-left : 3%;
cursor : pointer;
}
.list-nav li a {
color : #ccccd4;
}
.list-nav li:after {
width : 1px;
height : 30px;
background : #5f5f5f;
content : "";
display : block;
position : absolute;
right : 0;
top : 50%;
margin-top : -15px;
}
.list-nav li.last:after {
display : none;
}
.content-base {
background : #fff;
padding : 60px;
}
.content-left {
float : left;
width : 63%;
}
.content-left .content h2 {
font-size : 28px;
color : #255c4f;
position : relative;
padding-left : 45px;
margin : 32px 0 30px;
}
.content-left .content h2:before {
background : url(../images/h_bg.png) no-repeat;
background-size : 100% 100%;
width : 33px;
height : 22px;
content : "";
display : block;
position : absolute;
left : 0;
top : 15px;
}
.content-left .content h3 {
font-size : 26px;
color : #255c4f;
margin : 32px 0 30px;
}
.content-left .content h4 {
font-size : 24px;
color : #255c4f;
margin : 32px 0 30px;
}
.content-left .content.cont-news h2 {
padding-left : 0;
}
.content-left .content.cont-news h2:before {
display : none;
}
.content-left .content.cont-news h3 {
padding-left : 45px;
position : relative;
}
.content-left .content.cont-news h3:before {
background : url(../images/h_bg.png) no-repeat;
background-size : 100% 100%;
width : 33px;
height : 22px;
content : "";
display : block;
position : absolute;
left : 0;
top : 11px;
}
.content-left .content p {
font-size : 18px;
color : #4d4f53;
line-height : 2em;
margin-bottom : 30px;
text-indent : 2em;
}
.content-left .content .pc_cs {
margin-bottom : 30px;
}
.content-left .content p img, .content-left .content p video {
max-width : 800px;
height : auto;
width : 100%;
margin-left : -2em;
}
.content-left .content p.img-ms, .content-left .content p.font-explain {
text-align : center;
font-size : 18px;
color : #b4861d;
margin-left : -2em;
}
.content-left .content p strong {
font-size : 20px;
color : #4d4f53;
}
.content-left .content p a {
padding : 0 4px;
color : #DA251D;
}
.nrswt {
position : relative;
display : inline-block;
height : 54px;
line-height : 54px;
background : url(../images/btn-fc.png) repeat-x;
margin-left : 30px;
margin-right : 55px;
cursor : pointer;
text-indent : 0;
}
.nrswt:before {
content : "";
position : absolute;
left : -25px;
top : 0;
width : 25px;
height : 54px;
background : url(../images/btn-fl.png) no-repeat;
}
.nrswt:after {
content : "";
position : absolute;
right : -50px;
top : 0;
width : 50px;
height : 54px;
background : url(../images/btn-fr.png) no-repeat;
}
.nrswt:hover {
font-weight : bold;
}
.content-left .content table td {
padding : 5px 2px;
word-break : break-all;
}
.case-pro {
margin-top : 70px;
}
.case-pro strong {
font-size : 36px;
text-align : center;
color : #255d50;
}
.case-pro strong span {
color : #255d50;
}
.case-pro ul {
margin-left : -2.5%;
margin-top : 30px;
}
.case-pro ul li {
float : left;
width : 22.5%;
margin-left : 2.5%;
text-align : center;
}
.case-pro ul li a {
display : block;
overflow : hidden;
}
.case-pro li img {
transition : all 0.8s 0s ease;
}
.case-pro li:hover img {
transform : scale(1.08,1.08);
}
.case-pro li p a {
line-height : 16px;
margin : 20px auto;
color : #4d4f53;
}
.content-right {
float : right;
width : 31%;
padding-right : 15px;
}
.content-right .hot-link {
width : auto;
float : none;
}
.content-right .hot-link .link-bj {
font-size : 24px;
color : #fff;
}
.content-right .hot-link .link-bj {
position : absolute;
top : 0;
right : 0;
width : 174px;
height : 188px;
background : url(../images/link_bg.png) no-repeat;
color : #FFF;
font-size : 24px;
line-height : 36px;
padding : 16px 15px 0;
text-align : right;
cursor : pointer;
}
.content-right .hot-link .link-bj:hover {
color : #F0BE4D;
}
.xg-pro {
background : #255C4F;
background : linear-gradient(to right, #368873 0%, #255C4F 100%);
margin-top : 125px;
position : relative;
box-shadow : 0 5px 20px rgb(0, 0, 0, 0.15);
}
.xg-pro:after {
content : "";
display : block;
background : url(../images/xg_bg.png);
content : "";
position : absolute;
left : 6px;
top : 6px;
right : 6px;
bottom : 6px;
}
.xg-pro strong {
font-size : 24px;
color : #fff;
background : url(../images/hot_pro.png) no-repeat;
width : 365px;
height : 79px;
line-height : 70px;
text-align : center;
display : block;
background-size : 100% 100%;
position : absolute;
left : -15px;
top : 45px;
z-index : 20;
}
.xg-pro ul {
position : relative;
z-index : 10;
padding : 125px 31px 30px;
}
.xg-pro ul li {
text-align : center;
margin-top : 30px;
}
.xg-pro ul li .img-pic {
position : relative;
padding-top : 74%;
display : block;
margin-bottom : 11px;
overflow : hidden;
}
.xg-pro ul li .img-pic img {
position : absolute;
left : 0;
top : 0;
width : 100%;
display : block;
transition : all 0.8s 0s ease;
}
.xg-pro ul li .img-pic:hover img {
transform : scale(1.08,1.08);
}
.xg-pro ul li a {
font-size : 18px;
line-height : 2em;
color : #333;
display : block;
}
.xg-pro ul li:hover a {
color : #F0BE4D;
font-weight : bold;
}
.messages {
background : url(../images/mes_bg.png) no-repeat;
width : 826px;
height : 679px;
background-size : 100% 100%;
margin-top : 30px;
}
.mes-left {
float : left;
padding-top : 263px;
width : 40%;
}
.mes-left strong {
font-size : 24px;
color : #f5f8ff;
display : block;
padding-left : 125px;
}
.mes-left li {
font-size : 24px;
color : #f5f8ff;
margin-top : 50px;
}
.mes-left li.one {
padding-left : 95px;
}
.mes-left li.two {
padding-left : 87px;
}
.mes-left li.three {
padding-left : 77px;
}
.mes-right {
float : left;
width : 60%;
padding-right : 90px;
padding-top : 70px;
position : relative;
}
.mes-right strong {
font-size : 36px;
color : #255d50;
position : relative;
}
.mes-right:before {
background : url(../images/mesage_bg.png) no-repeat;
background-size : 100% 100%;
width : 284px;
height : 46px;
content : "";
display : block;
position : absolute;
left : 0;
top : 75px;
}
.mes-right p {
font-size : 18px;
color : #4d4f53;
line-height : 2em;
margin-top : 10px;
}
.mes-right form {
margin-top : 40px;
}
.mes-right form li {
margin-top : 22px;
position : relative;
}
.mes-right form li.one:before {
background : url(../images/icon_1.png) no-repeat;
background-size : 100% 100%;
width : 23px;
height : 24px;
content : "";
display : block;
position : absolute;
top : 50%;
margin-top : -15px;
left : 25px;
}
.mes-right form li.two:before {
background : url(../images/icon_2.png) no-repeat;
background-size : 100% 100%;
width : 23px;
height : 24px;
content : "";
display : block;
position : absolute;
top : 50%;
margin-top : -12px;
left : 25px;
}
.mes-right form li.three:before {
background : url(../images/icon_3.png) no-repeat;
background-size : 100% 100%;
width : 23px;
height : 24px;
content : "";
display : block;
position : absolute;
top : 25px;
left : 25px;
}
.mes-right form li input {
border : #dedef0 solid 1px;
border-radius : 10px;
font-size : 18px;
color : #4d4f53;
width : 100%;
padding : 17px 30px 17px 60px;
}
.mes-right form li textarea {
border : #dedef0 solid 1px;
border-radius : 10px;
height : 140px;
width : 100%;
font-size : 18px;
color : #4d4f53;
padding : 15px 30px 15px 60px;
line-height : 2em;
}
.mes-right form li textarea::-webkit-input-placeholder {
color : #000;
}
.mes-right form li textarea::-moz-placeholder {
color : #000;
}
.mes-right form li textarea:-ms-input-placeholder {
color : #000;
}
.mes-right form li textarea:-moz-placeholder {
color : #000;
}
.mes-right form li textarea::-webkit-input-placeholder {
color : #4d4f53;
}
.msg-btn {
position : relative;
z-index : 10;
}
.msg-btn .box {
position : relative;
background : #ffc11f;
background : linear-gradient(#fed845, #ffc11f);
width : 100%;
text-align : center;
border-radius : 30px;
margin-top : 30px;
cursor : pointer;
transition : all 0.6s ease;
}
.msg-btn .box:hover {
box-shadow : 0 5px 20px rgb(25, 64, 54, 0.5);
transition : all 0.6s ease;
}
.msg-btn:before {
width : 100%;
text-align : center;
border-radius : 30px;
margin-top : 30px;
background : rgb(175, 175, 175, 0.5);
content : "";
display : block;
height : 50px;
line-height : 50px;
position : absolute;
bottom : -5px;
z-index : -1;
transition : all 0.6s ease;
}
.msg-btn:hover:before {
bottom : 0;
transition : all 0.6s ease;
}
.msg-btn input {
font-size : 22px;
color : #111;
background : transparent;
height : 50px;
line-height : 50px;
width : 100%;
cursor : pointer;
}
.page-top .proPage-right li {
margin-top : 15px;
overflow : hidden;
}
.list-nav li.active, .list-nav li:hover, .list-nav li.active a, .list-nav li:hover a {
color : #f0be4d;
}
.list-nav li.active, .list-nav li:hover {
background : url(../images/bt_icon2.png) 35% center no-repeat;
}
.prev-next {
background : #f5f5f5;
border-radius : 30px 0 30px 0;
padding : 16px 0;
margin-bottom : 40px;
margin-top : 50px;
}
.prev-next ul {
overflow : hidden;
}
.prev-next li {
float : left;
width : 50%;
padding : 0 30px;
}
.prev-next li a {
font-size : 16px;
color : #4d4f53;
transition : all 0.6s ease;
}
.prev-next li:hover a {
color : #b4861d;
transition : all 0.6s ease;
}
.case-scene {
margin : 60px 0;
position : relative;
}
.txt-rele {
position : relative;
line-height : 36px;
}
.txt-rele strong {
font-size : 36px;
color : #255d50;
margin-bottom : 50px;
position : relative;
}
.txt-rele:before {
background : url(../images/case_bg.png) no-repeat;
background-size : 100% 100%;
width : 164px;
height : 46px;
content : "";
display : block;
position : absolute;
left : 0;
top : -5px;
}
.txt-rele a {
float : right;
color : #666;
}
.txt-rele a:hover {
color : #255c4f;
text-decoration : underline;
}
.scene li {
overflow : hidden;
margin-top : 50px;
}
.scene .scene-left {
float : left;
width : 50%;
overflow : hidden;
}
.scene .scene-left img {
border-top-right-radius : 60px;
display : block;
width : 100%;
transition : all 0.8s 0s ease;
}
.scene .scene-left:hover img {
transform : scale(1.08,1.08);
}
.scene .scene-right {
float : right;
width : 50%;
padding-left : 30px;
}
.scene .scene-right h3 {
margin-bottom : 40px;
}
.scene .scene-right h3:hover a {
color : #b4861d;
}
.scene .scene-right h3 a {
font-size : 26px;
color : #333;
display : block;
white-space : nowrap;
overflow : hidden;
text-overflow : ellipsis;
}
.scene .scene-right .xq-js p {
font-size : 18px;
color : #4d4f53;
line-height : 2em;
margin-top : 15px;
position : relative;
padding-left : 35px;
}
.scene .scene-right .xq-js p:before {
position : absolute;
left : 0;
top : 10px;
content : '';
display : inline-block;
vertical-align : middle;
width : 20px;
height : 18px;
background : url(../images/jt_icon.png) no-repeat;
}
.scene .scene-right .xq-js p strong {
font-size : 18px;
color : #4d4f53;
}
.caseList li {
width : 33.333%;
}
.proList {
background-color : #fff;
padding : 26px 60px 0;
margin-top : 60px;
border-radius : 40px 40px 0 0;
}
.proList ul {
padding-bottom : 45px;
}
.proList li {
margin-bottom : 35px;
}
.proList h2 {
font-size : 28px;
color : #333;
margin-bottom : 40px;
}
.proList h2:before {
width : 8px;
height : 40px;
background : #2b6c5c;
content : "";
display : inline-block;
vertical-align : middle;
margin-right : 20px;
margin-top : -8px;
}
.top-page {
padding : 70px 0;
}
.top-page h1 {
font-size : 40px;
color : #f0be4d;
margin-bottom : 20px;
}
.author-time span {
font-size : 18px;
color : #d3d3d3;
margin-right : 40px;
}
.new-cut {
float : right;
margin-top : -39px;
margin-right : 60px;
}
.new-cut a {
background-color : #666;
padding : 15px 27px;
border-radius : 6px 6px 0 0;
margin-left : 20px;
transition : all 0.6s ease;
}
.new-cut a:hover {
background-color : #2d7261;
transition : all 0.6s ease;
}
.news-page {
position : relative;
margin-top : -95px;
}
.news-page .content-base {
border-radius : 10px;
padding : 50px 60px 60px;
}
.news-pn {
box-shadow : 0 5px 10px rgb(36, 87, 76, 0.3);
border-radius : 50px 0 50px 0;
padding : 0 30px;
margin : 60px 0;
}
.news-pn p, .news-pn p a {
font-size : 18px;
color : #4d4f53;
padding : 20px 0;
transition : all 0.6s ease;
}
.news-pn p:hover a {
color : #b4861d;
font-weight : bold;
transition : all 0.6s ease;
}
.news-pn p.prev {
border-bottom : 1px dashed #dedfe0;
}
.news-pn p.prev:before {
background-image : url(../images/prev.png);
}
.news-pn p.next:before {
background-image : url(../images/next.png);
}
.news-pn p:before {
width : 20px;
height : 20px;
content : "";
display : inline-block;
vertical-align : middle;
margin-right : 10px;
margin-top : -2px;
border-radius : 50%;
background-color : #255d4f;
background-position : center;
background-repeat : no-repeat;
transition : all 0.6s ease;
}
.news-pn p:hover:before {
background-color : #b4861d;
transition : all 0.6s ease;
}
.top-cact {
background : url(../images/cact-pic.jpg) center;
padding-bottom : 130px;
background-size : cover;
}
.top-cact h1 {
display : inline-block;
color : #F0BE4D;
font-size : 48px;
line-height : 1.1;
}
.top-cact p {
width : 57%;
}
.bottom-base {
overflow : hidden;
margin-top : 80px;
}
.bot-left {
float : left;
background : url(../images/more-btn2.png) no-repeat;
background-size : 100% 100%;
width : 230px;
height : 70px;
line-height : 70px;
color : #fff;
font-size : 22px;
text-align : center;
padding-right : 40px;
position : relative;
cursor : pointer;
}
.bot-left:before {
content : "";
position : absolute;
right : 32px;
top : 20px;
width : 30px;
height : 30px;
transition : all 0.3s;
background : url(../images/area-icon.png) no-repeat;
}
.bot-left:hover {
color : #F0BE4D;
}
.bot-left:hover:before {
right : 28px;
}
.bot-right {
float : left;
width : 30%;
margin-left : 60px;
}
.bot-right p {
font-size : 20px;
color : #d3d3d3;
line-height : 1.4em;
margin-top : 0;
}
.bot-right strong {
font-size : 30px;
color : #f0be4d;
}
.cact-client {
text-align : center;
background : url(../images/yc_bg.jpg) center no-repeat #fafbfc;
padding-bottom : 60px;
background-size : cover;
margin-top : -1px;
}
.cact-client h2 {
font-size : 46px;
color : #333;
}
.cact-client p {
font-size : 18px;
line-height : 2em;
color : #666;
}
.cact-client ul {
overflow : hidden;
margin-left : -2.75%;
margin-top : 63px;
}
.cact-client li {
float : left;
background : url(../images/li_bg.png) no-repeat;
background-size : 100%;
width : 248px;
height : 401px;
padding : 60px 25px;
margin-left : 2.75%;
}
.cact-client li.mt {
margin-top : 140px;
}
.cact-client li span {
display : block;
font-size : 18px;
color : #fff;
width : 44px;
height : 44px;
line-height : 44px;
text-align : center;
font-weight : bold;
background : #255c4f;
border-radius : 50%;
margin : 0 auto;
}
.cact-client li strong {
font-size : 22px;
color : #255c4f;
line-height : 1.6em;
display : block;
margin : 15px auto 10px;
}
.cact-foot {
background : url(../images/cact-foot.jpg) center no-repeat;
background-size : cover;
padding : 90px 0;
}
.cactLeft {
float : left;
width : 50%;
padding-right : 2%;
}
.cactLeft strong {
font-size : 48px;
color : #f0be4d;
}
.cactLeft p {
font-size : 18px;
line-height : 2em;
color : #d3d3d3;
margin-top : 15px;
}
.cactLeft form {
margin-top : 40px;
}
.cactLeft ul {
margin-left : -6%;
overflow : hidden;
}
.cactLeft li {
float : left;
width : 44%;
margin-left : 6%;
position : relative;
}
.cactLeft li input {
background : rgb(50, 54, 62, 0.6);
width : 100%;
padding : 18px 20px;
color : #d3d3d3;
font-size : 18px;
}
.cactLeft li.bt:before {
content : "*";
color : red;
display : block;
width : 15px;
height : 15px;
position : absolute;
left : 7px;
top : 50%;
margin-top : -9px;
}
.cactLeft li.text-box {
width : 94%;
margin-top : 30px;
margin-bottom : 60px;
}
.cactLeft li textarea {
background : rgb(50, 54, 62, 0.6);
outline : none;
width : 100%;
color : #d3d3d3;
height : 170px;
padding : 18px 20px;
font-size : 18px;
}
.cactLeft li textarea::-webkit-input-placeholder {
color : #d3d3d3;
}
.cactLeft form .button input {
background : #fb2840;
overflow : hidden;
background-image : linear-gradient(90deg, #fb2840 30%, #fe5e60 50%, #fb2840);
background-position : left center;
background-size : 200% 100%;
background-repeat : no-repeat;
width : 260px;
height : 70px;
line-height : 70px;
text-align : center;
color : #fff;
border-radius : 50px;
font-size : 24px;
cursor : pointer;
transition : all 0.5s ease;
}
.cactLeft form .button input:hover {
background-position : right center;
transition : all 0.5s ease;
}
.cactRight {
float : left;
width : 50%;
padding-left : 9%;
margin-top : 15px;
}
.cactRight p {
font-size : 18px;
color : #d3d3d3;
position : relative;
}
.cactRight p:before {
background : url(../images/wz.png) no-repeat;
width : 16px;
height : 16px;
background-size : 100% 100%;
content : "";
display : inline-block;
vertical-align : middle;
margin-top : -5px;
margin-right : 24px;
}
.cactRight strong {
font-size : 28px;
color : #fff;
font-weight : bold;
position : relative;
display : block;
margin-top : 50px;
margin-bottom : 5px;
}
.cactRight strong:before {
background : url(../images/dh.png) no-repeat;
width : 16px;
height : 16px;
background-size : 100% 100%;
content : "";
display : inline-block;
vertical-align : middle;
margin-top : -5px;
margin-right : 24px;
}
.cactRight span {
font-size : 18px;
color : #d3d3d3;
display : block;
padding-left : 40px;
}
.map {
margin-top : 90px;
position : relative;
}
.map-wz {
position : absolute;
top : 145px;
right : 42%;
z-index : 10;
}
.point:after {
width : 80px;
height : 80px;
content : '';
display : block;
position : absolute;
top : -20px;
right : 0;
bottom : 0;
left : -20px;
border-radius : 50%;
background : rgb(255, 255, 255, 0.5);
opacity : 0;
animation : ripple 2200ms 50ms ease-out infinite;
z-index : -1;
}
@keyframes ripple {
0% {
opacity : 0;
transform : scale(0.1,0.1);
}
5% {
opacity : 1;
}
100% {
opacity : 0;
transform : scale(1);
}
}
.body {
background : #f5f5f5;
}
.body .header {
position : static;
}
.body .head-con .nav li a {
color : #333;
}
.body .top-tel p {
background : url(../images/tel-phone.png) left center no-repeat;
color : #333;
}
.four-page {
overflow : hidden;
padding : 100px 0 175px;
}
.four-page .four-left, .four-page .four-right {
float : left;
width : 50%;
}
.four-page .four-right strong {
font-size : 52px;
color : #275e51;
display : block;
margin-bottom : 60px;
}
.four-page .four-right p {
font-size : 18px;
color : #4d4f53;
line-height : 2.6em;
}
.four-page .four-right ul {
overflow : hidden;
padding : 30px 50px 30px 0;
margin-top : 80px;
}
.four-page .four-right li {
float : left;
width : 210px;
height : 66px;
line-height : 66px;
text-align : center;
border-radius : 4px;
}
.four-page .four-right li.one {
background : #255d50;
overflow : hidden;
background-image : linear-gradient(90deg, #255d50 30%, #368873 50%, #255d50);
background-position : left center;
background-size : 200% 100%;
background-repeat : no-repeat;
transition : all 0.5s ease;
}
.four-page .four-right li.one:hover {
box-shadow : 0 5px 20px rgb(0, 0, 0, 0.15);
background-position : right center;
transition : all 0.5s ease;
}
.four-page .four-right li.one a {
color : #fff;
font-size : 18px;
display : block;
}
.four-page .four-right li.two {
box-shadow : 0 5px 20px rgb(0, 0, 0, 0.15);
margin-left : 40px;
transition : all 0.5s ease;
cursor : pointer;
font-size : 18px;
}
.four-page .four-right li.two:hover {
color : #fff;
background : linear-gradient(to right, #368873, #255d50);
transition : all 0.5s ease;
}
.four-page .four-right li.two:hover a {
color : #fff;
}
.four-page .four-right li.two a {
font-size : 18px;
color : #333;
display : block;
}
.wp {
max-width : 750px;
width : 100%;
margin : 0 auto;
}
.ewm-box {
padding : 75px 50px;
}
.ewm-box a {
display : block;
background : linear-gradient(to right, #368873, #255d50);
height : 100px;
width : 100%;
line-height : 100px;
font-size : 38px;
font-weight : bold;
color : #fff;
text-align : center;
border-radius : 10px;
margin-top : 125px;
}
.ewm-box p {
font-size : 26px;
color : #4d4f53;
line-height : 1.4em;
text-align : center;
margin-top : 40px;
}
.icon-bg {
border-top : 20px solid #f5f5f5;
padding : 50px;
}
.fixed-right {
position : fixed;
right : 20px;
bottom : 20%;
z-index : 9999;
background : url(../images/fixed_bg.png) no-repeat;
background-size : 100% 100%;
width : 186px;
height : 463px;
padding : 140px 28px 0;
}
.fixed-right .online-service, .phone-bj, .message-consult {
width : 130px;
height : 40px;
line-height : 40px;
text-align : center;
background-image : linear-gradient(90deg, #ecd68d 0, #f5f2c9 10%, #ecd68d 40%);
background-position : left center;
background-size : 200% 100%;
background-repeat : no-repeat;
transition : all 0.5s ease;
display : block;
border-radius : 30px;
font-size : 18px;
cursor : pointer;
}
.fixed-right .online-service:hover, .phone-bj:hover, .message-consult:hover {
background-position : right center;
transition : all 0.5s ease;
}
.message-consult {
margin-top : 40px;
}
.phone-quote {
margin-top : 80px;
position : relative;
}
.phone-quote .box {
display : none;
position : absolute;
top : -35px;
right : 125%;
width : 198px;
height : 117px;
background : url(../images/ewm_bg.png) no-repeat;
background-size : 100% 100%;
padding : 13px;
}
.phone-quote .box-left {
float : left;
}
.phone-quote .box-right {
float : left;
text-align : center;
margin-left : 5px;
}
.phone-quote .box-right p {
font-size : 16px;
color : #255c4f;
font-style : italic;
}
.phone-quote .box-right span {
font-size : 14px;
color : #333;
}
.phone-quote .box strong {
font-size : 20px;
color : #255c4f;
display : block;
}
#back-top {
text-align : center;
color : #fff;
font-size : 16px;
margin-top : 25px;
cursor : pointer;
transition : all 0.5s ease;
}
#back-top:after {
width : 0;
height : 0;
border-left : 5px solid transparent;
border-right : 5px solid transparent;
border-bottom : 10px solid #fff;
content : "";
display : inline-block;
vertical-align : middle;
}
#back-top:hover {
color : #F0BE4D;
transition : all 0.5s ease;
}
#back-top:hover:after {
border-bottom : 10px solid #F0BE4D;
}
.pro-read li {
line-height : 36px;
margin-top : 30px;
}
.pro-read li a {
display : block;
color : #666;
font-size : 18px;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
transition : all 0.3s;
}
.pro-read li a:before {
content : '';
display : inline-block;
vertical-align : middle;
width : 20px;
height : 18px;
background : url(../images/jt_icon.png) no-repeat;
margin-right : 20px;
margin-top : -6px;
}
.pro-read li:hover a {
margin-left : 4px;
color : #255C4F;
}
.data-list {
margin-top : 36px;
}
.data-list ul {
overflow : hidden;
margin-left : -2%;
margin-bottom : 0;
}
.data-list ul li {
float : none;
width : auto;
display : inline-block;
margin-left : 2%;
color : #666;
font-size : 18px;
padding-left : 0;
box-sizing : border-box;
cursor : pointer;
margin-bottom : 30px;
border-radius : 25px 0 25px 0;
background-color : #FFF;
border : #DEDFE0 solid 1px;
}
.data-list ul li span {
display : block;
padding : 10px 30px;
line-height : 1.5;
}
.data-list ul li:hover {
color : #255C4F;
}
.data-list ul li.cur {
position : relative;
z-index : 2;
padding : 2px;
text-align : center;
border : none;
background : linear-gradient(to right, #368873 0%, #255C4F 100%);
box-shadow : 0 3px 8px rgb(0, 0, 0, 0.15);
}
.data-list ul li.cur span {
display : block;
color : #333;
font-weight : bold;
width : 100%;
height : 100%;
background-color : #FFF;
border-radius : 24px 0 24px 0;
}
.data-no {
display : none;
}
.data-link {
margin : 50px 0 40px;
padding-left : 15px;
text-align : center;
}
.data-link strong {
display : inline-block;
color : #FFF;
font-size : 18px;
position : relative;
z-index : 0;
text-align : center;
line-height : 60px;
width : 375px;
font-weight : normal;
}
.data-link strong:before {
content : "";
position : absolute;
left : 0;
top : 0;
width : 375px;
height : 60px;
background : url(../images/data-link01.png) no-repeat;
background-size : 100% 100%;
z-index : -1;
}
.link-cons {
padding : 30px;
margin-top : -28px;
background-color : #FFF;
box-shadow : 0 3px 15px rgb(0, 0, 0, 0.2);
border-radius : 10px;
}
.link-cons a {
display : inline-block;
line-height : 50px;
padding : 0 30px;
background-color : #255C4F;
box-shadow : 0 3px 10px rgb(0, 0, 0, 0.15);
border-radius : 10px;
position : relative;
z-index : 0;
color : #393B45;
font-size : 18px;
margin-right : 26px;
text-align : center;
margin-top : 20px;
}
.link-cons a:before {
content : "";
position : absolute;
left : -4px;
top : -4px;
width : 100%;
height : 100%;
background : url(../images/data-link02.png) left top;
z-index : -1;
border-radius : 10px;
}
.link-cons a:hover {
color : #255C4F;
}
.more-news {
background-color : #FFF;
padding : 70px 60px 80px;
}
.more-tit {
color : #333;
font-size : 36px;
font-weight : bold;
line-height : 1.1;
position : relative;
padding-left : 50px;
}
.more-tit:before {
content : "";
position : absolute;
left : 0;
top : 4px;
width : 36px;
height : 36px;
background : url(../images/more-news.png) no-repeat;
background-size : 100% 100%;
}
.more-tit a {
color : #255C4F;
}
.more-tit a:hover {
color : #F0BE4D;
}
.content-news {
margin-top : -50px;
}
.content-news .xg-new {
margin-top : 0;
}
.news-pave {
margin-top : 50px;
margin-bottom : -30px;
}
.news-pave ul {
margin-left : -4.7%;
}
.news-pave ul li {
float : left;
width : 45.3%;
margin-left : 4.7%;
position : relative;
padding : 25px 30px;
margin-bottom : 30px;
background-color : #FFF;
border-radius : 10px;
box-shadow : 0 3px 15px rgb(37, 92, 79, 0.15);
}
.pave-txt {
display : block;
font-size : 22px;
font-weight : bold;
overflow : hidden;
white-space : nowrap;
text-overflow : ellipsis;
line-height : 36px;
}
.pave-txt:hover {
color : #255C4F;
}
.pave-pic {
clear : both;
overflow : hidden;
margin : 22px 0;
margin-left : -2%;
}
.pave-pic a {
float : left;
width : 31.3%;
margin-left : 2%;
}
.pave-pic a img {
width : 100%;
height : 115px;
object-fit : cover;
border-radius : 4px;
}
.news-pave p {
color : #AAA;
line-height : 20px;
}
@media screen and (max-width: 1919px) {
.item01 {
background : url(../images/ban-bg01.jpg) center;
}
.item01 {
background-size : auto;
}
.nav li {
margin-right : 20px;
}
.btn-more {
width : 145px;
line-height : 48px;
}
.ban-btn {
margin-top : 100px;
margin-left : 36%;
}
.ban-txt a {
font-size : 80px;
}
.ban-txt i {
font-size : 100px;
}
.ban-con .slick-prev {
margin-left : -750px;
}
.paging {
margin-left : -660px;
}
.tab-list {
padding : 20px 10px 25px 90px;
margin : 22px 0 22px 70px;
}
.link-con {
margin-left : 9%;
}
.index-cont:before {
width : 95%;
}
.index-cont {
padding : 55px 5% 55px 15%;
}
.vie-info li {
margin-top : 50px;
}
.page-top .page-right .box {
margin-top : 40px;
}
.index-pice .pice {
top : 20px;
}
.pice-bottom {
margin-top : 20px;
}
.pice-bottom .piceLeft strong {
font-size : 22px;
}
.tab-list {
margin-left : 66px;
}
.tab-pro {
width : 48%;
left : -53px;
top : 16px;
}
}
@media screen and (max-width: 1699px) {
.ban-txt a.txt-font {
padding-top : 1%;
}
}
@media screen and (max-width: 1599px) {
.wrap {
width : 94%;
}
.nav {
margin-left : 35px;
}
.ban-txt a {
font-size : 60px;
}
.ban-txt a.txt-font {
font-size : 55px;
}
.ban-txt i {
font-size : 72px;
}
.ban-item:before {
top : 175px;
width : 32%;
}
.ban-pic {
width : 50%;
margin-right : 8%;
}
.ban-pic:after {
z-index : -1;
background-size : 100% 100%;
top : -30px;
width : 190px;
height : 510px;
}
.ban-con .slick-prev {
margin-left : -45%;
}
.ban-con .slick-next {
margin-left : -30%;
}
.paging {
margin-left : -38%;
bottom : 45px;
}
.tab-info a {
font-size : 16px;
}
.tab-info p {
font-size : 14px;
margin-top : 5px;
}
.tab-list {
padding : 20px 10px 25px 70px;
}
.cont-font {
font-size : 24px;
}
.edit-text label input, .edit-area textarea {
width : 210px;
}
.index-cont {
padding : 55px 3% 55px 18%;
}
.type-txt {
padding-left : 40px;
}
.type-txt a {
font-size : 36px;
}
.top-about {
background-size : 100% 100%;
}
.page-top .page-right .box .box-right {
width : 220px;
height : 58px;
line-height : 58px;
}
.page-top .page-right .box .box-right:before {
height : 58px;
}
.cact-client li {
width : 233px;
}
.hot-name {
height : 157px;
}
.news-hots {
margin-top : 80px;
}
.hots-name {
height : 137px;
}
.page-top .page-right h1 {
font-size : 32px;
}
.page-top .page-right {
padding : 35px 30px 0 22%;
}
.index-pice .pice {
width : 66%;
}
.pice-bottom .piceLeft a {
width : 280px;
height : 70px;
line-height : 70px;
font-size : 20px;
margin-top : 35px;
}
.pice-bottom .piceLeft strong {
font-size : 20px;
}
.index-case {
z-index : -1;
}
}
@media screen and (max-width: 1499px) {
.about-txt p i {
display : none;
}
}
@media screen and (max-width: 1399px) {
.wrap {
width : 96%;
}
.nav li a, .cact-client p {
font-size : 16px;
}
.top-tel p strong {
font-size : 22px;
}
.ban-pic span {
font-size : 20px;
}
.tab-list {
padding : 16px 12px 16px 50px;
}
.tab-pro {
top : 12px;
}
.ban-con .slick-prev, .ban-con .slick-next {
width : 35px;
height : 35px;
bottom : 136px;
}
.paging {
margin-left : -39%;
}
.ban-btn {
margin-top : 106px;
}
.type-txt a {
font-size : 28px;
}
.type-link {
width : 80px;
height : 80px;
margin-left : -40px;
margin-top : -40px;
}
.type-txt {
padding-left : 10px;
}
.ban-txt a {
font-size : 48px;
}
.ban-txt a.txt-font {
font-size : 46px;
}
.txt-name h2, .index-txt h2, .hot-txt h2, .base-txt h2, .about-txt h1, .about-txt h2, .ser-font strong, .top-base strong, .cact-client h2, .cactLeft strong, .index-pice .pice h2 {
font-size : 38px;
}
.index-cont:after {
width : 170px;
height : 260px;
}
.index-cont {
padding : 55px 5% 55px 15%;
}
.cont-font {
font-size : 18px;
}
.edit-text, .edit-area, .edit-btn {
margin-left : 15px;
}
.link-con dt a {
font-size : 24px;
}
.index-link:before {
left : 0;
}
.link-con {
width : 15%;
margin-left : 5%;
}
.price-pic {
left : 57%;
}
.price-info {
width : 60%;
}
.page-top .page-right li {
margin-top : 20px;
}
.top-cact h1 {
font-size : 42px;
}
.cact-client li {
width : 204px;
}
.cact-client li span {
width : 38px;
height : 38px;
line-height : 38px;
font-size : 16px;
}
.cact-client li strong {
font-size : 18px;
margin : 7px auto;
}
.cact-client {
padding-bottom : 0;
}
.cact-foot {
padding : 60px 0 50px;
}
.cactLeft form .button input {
width : 210px;
height : 58px;
line-height : 58px;
font-size : 18px;
}
.news-con, .news-page .content-base {
padding : 40px 30px;
}
.hot-link, .content-right {
width : 34%;
}
.hot-name {
height : 140px;
padding : 0 50px;
}
.hots-name {
height : 120px;
padding : 60px 30px 15px;
}
.pro-cons {
padding : 40px;
}
.content-base {
padding : 30px 30px 60px;
}
.content-right {
padding-right : 0;
}
.scene .scene-right {
padding-left : 15px;
}
.scene .scene-right h3 {
font-size : 22px;
margin-bottom : 15px;
}
.scene .scene-right .xq-js p {
padding-left : 25px;
margin-top : 10px;
font-size : 16px;
}
.scene li {
margin-top : 25px;
}
.case-scene {
margin : 35px 0;
}
.about-info ul {
margin-top : 25px;
}
.about-info span {
margin-top : 30px;
}
.index-pice .pice {
left : 30%;
}
.index-pice .pice p {
margin-top : 5px;
}
.pice-bottom .piceLeft a {
margin-top : 15px;
}
.video-info li {
margin-bottom : 60px;
}
.index-video {
padding-bottom : 100px;
}
.index-video:before {
background : #1D2025;
}
.pice-bottom .piceLeft .btn-price {
height : 72px;
line-height : 72px;
}
.four-page .four-right strong {
font-size : 50px;
}
.ser-idea ul li p {
font-size : 16px;
}
}
@media screen and (max-width: 1313px) {
.about-txt p {
margin-top : 50px;
}
}
@media screen and (max-width: 749px) {
.ewm-box, .icon-bg {
padding : 20px 10px;
}
.ewm-box a {
height : 70px;
line-height : 70px;
font-size : 28px;
margin : 50px auto 0;
}
}
@media screen and (max-width: 479px) {
.ewm-box a {
height : 56px;
line-height : 56px;
font-size : 24px;
}
.ewm-box p {
font-size : 18px;
}
}
@media screen and (max-width: 374px) {
.ewm-box a {
font-size : 18px;
}
}