html,
body {
padding: 0;
margin: 0;
font-family: Poppins;
color: #333333;
/*min-width: 1200px;*/
}
ul {
padding: 0;
margin: 0;
}
ul li {
list-style: none;
}
.fl {
float: left;
}
.fr {
float: right;
}
a,
a:hover,
a:active,
a:visited,
a:link,
a:focus {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: transparent;
outline: none;
background: none;
text-decoration: none;
transition-duration: .5s;
-ms-transition-duration: .5s;
-moz-transition-duration: .5s;
-webkit-transition-duration: .5s;
}
img {
max-width: 100%;
}
input:focus,
button:focus,
textarea:focus {
outline: none;
}
.ovh {
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.ovh2 {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.ovh3 {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
.ovh4 {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
overflow: hidden;
}
.ovh5 {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
overflow: hidden;
}
p {
margin: 0;
}
i,
em {
font-style: initial;
}
.imgH {
overflow: hidden;
}
.imgH img {
transition-duration: .6s;
-ms-transition-duration: .6s;
-moz-transition-duration: .6s;
-webkit-transition-duration: .6s;
}
.imgH:hover img {
transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
-webkit-transform: scale(1.1);
}
.flexcen {
display: flex;
justify-content: center;
align-items: center;
}
.flexsta {
display: flex;
justify-content: flex-start;
align-items: center;
}
.flexend {
display: flex;
justify-content: flex-end;
align-items: center;
}
.flexbet {
display: flex;
justify-content: space-between;
align-items: center;
}
.flexaro {
display: flex;
justify-content: space-around;
align-items: center;
}
.wrap {
/*width: 96%;*/
max-width: 1200px;
margin: 0 auto;
}
/**导航菜单**/
header {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 9999;
text-align: center;
height: 85px;
background: #fff;
border-bottom: 1px solid #CCCCCC;
}
header .wrap {
max-width: 100%;
padding: 0 30px;
}
header .logo a {
height: 85px;
position: relative;
z-index: 9999;
display: flex;
justify-content: center;
align-items: center;
}
header .logo img {
max-height: 100%;
}
header .rightDiv {
float: right;
}
header .rightDiv .menu {}
header .rightDiv .menu>ul {
display: inline-block !important;
}
header .rightDiv .menu>ul>li {
float: left;
margin: 0 20px 0 0;
}
header .rightDiv .menu>ul>li>a {
height: 85px;
text-align: left;
color: #333333;
font-size: 16px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
text-transform: capitalize;
padding: 0 20px;
}
header .rightDiv .menu>ul>li:hover>a,
header .rightDiv .menu>ul>li:focus>a,
header .rightDiv .menu>ul>li.on>a,
header .rightDiv .menu>ul>li.active>a {
background: transparent;
color: #cc372e;
font-weight: bold;
}
header .rightDiv .menu>ul>li.on>a {
font-weight: bold;
}
header .rightDiv .menu>ul>li>a::after {
content: "";
width: 44px;
position: absolute;
left: 50%;
margin-left: -22px;
background: #cc372e;
height: 4px;
top: 0;
opacity: 0;
transform: scaleX(0);
-webkit-transition: all 0.4s;
transition: all 0.4s;
border-radius: 2px;
}
header .rightDiv .menu>ul>li:hover>a::after,
header .rightDiv .menu>ul>li.on>a::after {
opacity: 1;
transform: scaleX(1);
}
header .othersDiv {
height: 85px;
border-left: 1px solid #ccc;
}
header .othersDiv .langDiv {
position: relative;
}
header .othersDiv .langDiv>a {
color: #333;
height: 85px;
color: #ce3d33;
font-size: 24px;
font-family: Myriad Pro;
font-weight: bold;
font-style: italic;
}
header .othersDiv .langDiv>a i {
width: 11px;
height: 100%;
background: url(../img/xia1.png) no-repeat center center;
}
header .othersDiv .langDiv>a span {
margin: 0 9px 0 0;
}
header .othersDiv .langDiv .aDiv {
position: absolute;
left: 50%;
width: 100px;
background: rgba(255, 255, 255, 1);
top: 100%;
transform: translateX(-50%);
font-size: 14px;
display: none;
/*box-shadow: 0px 0px 10px rgba(0,0,0,.1);border-radius: 0 0 10px 10px;*/
border: 1px solid #ccc;
border-top: 0;
}
header .othersDiv .langDiv .aDiv a {
color: #333;
display: block;
line-height: 40px;
}
header .othersDiv .langDiv .aDiv a.on {
color: #cc372e;
}
header .othersDiv .langDiv:hover .aDiv {
display: block;
}
header .searchDiv form {
width: 167px;
position: relative;
margin: 0 46px 0 15px;
}
header .searchDiv form input {
width: 100%;
line-height: 38px;
background: #fff;
border-radius: 20px;
padding: 0 60px 0 16px;
border: 1px solid #cccccc;
font-size: 12px;
}
header .searchDiv form button {
width: 46px;
height: 100%;
border: 0;
position: absolute;
right: 0;
top: 0;
cursor: pointer;
background: transparent;
}
header .mbtn {
display: inline-block;
width: 50px;
height: 50px;
background: url(../img/menu1.png) no-repeat center center;
background-size: 22px auto;
position: absolute;
top: 0;
right: 0;
display: none;
}
header .mbtn:active {
opacity: .8;
}
body.on-menu header .mbtn {
background: url(../img/menu-hide1.png) no-repeat center center;
background-size: 22px auto;
}
.menu,
.menu ul li,
.menu ul li a,
.menu #menu-button {
margin: 0;
padding: 0;
border: 0;
list-style: none;
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.menu:after,
.menu>ul:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0
}
.menu #menu-button {
display: none
}
.menu {
width: auto;
}
#menu-line {
position: absolute;
top: 0;
left: 0;
height: 3px;
background: #009ae1;
-webkit-transition: all .25s ease-out;
-moz-transition: all .25s ease-out;
-ms-transition: all .25s ease-out;
-o-transition: all .25s ease-out;
transition: all .25s ease-out
}
.menu>ul>li {
float: left;
}
.menu>ul>li>a {
padding: 0;
text-decoration: none;
text-transform: uppercase;
color: #555555;
-webkit-transition: color .2s ease;
-moz-transition: color .2s ease;
-ms-transition: color .2s ease;
-o-transition: color .2s ease;
transition: color .2s ease
}
.menu>ul>li:hover>a,
.menu>ul>li.active>a {
color: #fff
}
.menu>ul>li>ul {
position: absolute;
background: #fff;
width: 100%;
top: 100%;
left: -9999px;
z-index: 999;
padding: 0 0 30px;
border-top: 1px solid #eee;
}
.menu>ul>li:hover>ul {
left: 0;
}
.menu>ul>li ul .wrap {
max-width: 80%;
}
.menu>ul>li .ul {
padding-bottom: 50px;
}
.menu>ul>li .ul ul {
position: relative;
width: 100%;
}
.menu>ul>li .ul .tabsLi {
padding: 40px 0;
}
.menu>ul>li .ul li {
position: relative;
/* width: 10%; */
}
.menu>ul>li:nth-child(2) .ul li {
position: relative;
width: 10%;
}
/* .menu>ul>li .ul li:first-child{border-left: 1px solid #eee; } */
.menu>ul>li .ul li>a {
padding: 0 22px;
font-size: 14px;
color: #333333;
line-height: 54px;
display: block;
text-align: center;
}
.menu>ul>li .ul li.on>a,
.menu>ul>li .ul li a:hover {
color: #cc372e;
}
.menu>ul>li .ul .tabsDiv {
position: relative;
}
.menu>ul>li .ul .tabsCon {
position: absolute;
width: 100%;
top: 0;
left: 0;
z-index: 0;
opacity: 0;
}
.menu>ul>li .ul .tabsCon.on {
position: relative;
z-index: 1;
opacity: 1;
}
.menu>ul>li .ul .tabsCon .item {
width: 16.67%;
}
.menu>ul>li .ul .tabsCon .item .imgDiv {
padding-top: 91.2%;
}
.menu>ul>li .ul .tabsCon .item .imgDiv img {
transition: all .5s;
max-height: 100%;
object-fit: contain;
/* width: initial;
height: initial; */
}
.menu>ul>li .ul .tabsCon .item .imgDiv .dImg {
position: relative;
}
.menu>ul>li .ul .tabsCon .item .imgDiv .hImg {
position: absolute;
left: 0;
top: 0;
opacity: 0;
z-index: 0;
}
.menu>ul>li .ul .tabsCon .item .textDiv .tit {
font-size: 16px;
color: #333;
}
.menu>ul>li .ul .tabsCon .item .textDiv p {
font-size: 12px;
color: #999;
margin-top: 10px;
}
.menu>ul>li .ul .tabsCon .item a:hover .imgDiv .dImg {
position: absolute;
left: 0;
top: 0;
opacity: 0;
z-index: 0;
}
.menu>ul>li .ul .tabsCon .item a:hover .imgDiv .hImg {
position: relative;
opacity: 1;
z-index: 1;
}
.menu>ul>li .ul .tabsCon .item a:hover .textDiv .tit {
color: #cc372e;
}
.menu>ul>li .allBtn {
padding-top: 30px;
font-size: 14px;
border-top: 1px solid #eee;
}
.menu>ul>li .allBtn a {
color: #333;
}
.menu>ul>li .allBtn a:hover {
color: #cc372e;
}
/* .menu>ul>li .ul li .aDiv a{color: #555555;text-align: left;font-size: 14px;height: 54px;padding: 0 18px;display: flex;justify-content: flex-start; }
.menu>ul>li .ul li .aDiv a .icon{width: 40px;margin-right: 10px; }
.menu>ul>li .ul li .aDiv a .p{width: calc(100% - 100px); }
.menu>ul>li .ul li .aDiv a .hot{width: 44px;height: 20px;background-color: #00a7d3;border-radius: 7px;color: #fff; }
.menu>ul>li .ul li .aDiv a:hover{background: #f5f5f5; } */
header .rightDiv .menu>ul>li.has-sub>a:before {
content: "";
width: 11px;
height: 6px;
background: url(../img/xia.png) no-repeat center center;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
header .rightDiv .menu>ul>li.has-sub:hover>a:before {
background: url(../img/xia_.png) no-repeat center center;
}
/****底部***/
.footerDiv {
position: relative;
background: #444444;
}
.footerDiv .hdDiv {
padding: 120px 0 40px;
}
.footerDiv .hdDiv .hlDiv {
width: 40.583%;
}
.footerDiv .hdDiv .hlDiv form {
width: 100%;
}
.footerDiv .hdDiv .hlDiv .row {
margin: 0 -4px;
}
.footerDiv .hdDiv .hlDiv .row>div {
padding: 0 4px;
margin-bottom: 8px;
}
.footerDiv .hdDiv .hlDiv .row>div input {
width: 100%;
background: rgba(0, 0, 0, .17);
border: 0;
padding: 0 10px;
line-height: 35px;
font-size: 14px;
color: #bbbbbb;
}
.footerDiv .hdDiv .hlDiv button {
width: 98px;
height: 40px;
background: #ce3d33;
border-radius: 6px;
color: #fff;
padding: 0;
border: 0;
cursor: pointer;
}
.footerDiv .hdDiv .hlDiv button:hover {
opacity: .8;
}
.footerDiv .hdDiv .hlDiv button img {
margin-right: 10px;
}
.footerDiv .hdDiv .hrDiv {
width: 38.33%;
text-align: center;
color: #fff;
}
.footerDiv .hdDiv .hrDiv .telDiv {
margin-bottom: 35px;
}
.footerDiv .hdDiv .hrDiv .ewmDiv .imgDiv:nth-child(1) {
margin-right: 60px;
}
.footerDiv .hdDiv .hrDiv .ewmDiv .imgDiv .pic {
width: 117px;
padding: 5px;
background: #fff;
}
.footerDiv .hdDiv .hrDiv .ewmDiv .imgDiv .pic img {
width: 100%;
}
.footerDiv .hdDiv .hrDiv .ewmDiv .imgDiv p {
font-size: 14px;
margin-top: 5px;
}
.footerDiv .bdDiv {
padding: 70px 0 105px;
color: #fff;
border-top: 1px solid rgba(255, 255, 255, .24);
}
.footerDiv .bdDiv .wrap {
align-items: flex-start;
}
.footerDiv .bdDiv .blDiv {
width: 21%;
font-size: 14px;
}
.footerDiv .bdDiv .blDiv .p {
margin: 15px 0;
line-height: 1.7;
}
.footerDiv .bdDiv .blDiv .p a {
color: #999999;
}
.footerDiv .bdDiv .blDiv a.lanBtn {
width: 189px;
height: 40px;
background: #ce3d33;
color: #fff;
border-radius: 6px;
}
.footerDiv .bdDiv .blDiv a.lanBtn img {
margin-right: 11px;
}
.footerDiv .bdDiv .blDiv a:hover {
opacity: .8;
}
.footerDiv .bdDiv .brDiv {
width: 68.5%;
align-items: flex-start;
}
.footerDiv .bdDiv .brDiv .listDiv {
width: 20%;
}
.footerDiv .bdDiv .brDiv .listDiv:first-child {
margin-left: 0;
width: 60%;
}
.footerDiv .bdDiv .brDiv .listDiv:first-child ul {
/*flex-direction: column;height: 140px;*/
flex-wrap: wrap;
}
.footerDiv .bdDiv .brDiv .listDiv:first-child ul li:nth-of-type(odd) {
width: 40%;
}
.footerDiv .bdDiv .brDiv .listDiv:first-child ul li:nth-of-type(even) {
width: 60%;
}
.footerDiv .bdDiv .brDiv .listDiv:first-child ul li:nth-last-child(-n+2) {
border-bottom: 0;
}
.footerDiv .bdDiv .brDiv .listDiv>.tt {
color: #fff;
}
.footerDiv .bdDiv .brDiv .listDiv ul {
margin-top: 10px;
text-align: left;
}
.footerDiv .bdDiv .brDiv .listDiv ul li {
border-bottom: 1px dashed #fff;
padding: 5px 0;
font-size: 14px;
}
.footerDiv .bdDiv .brDiv .listDiv ul li a {
color: #dddddd;
padding-left: 20px;
background: url(../img/jt.png) no-repeat left center;
}
.footerDiv .bdDiv .brDiv .listDiv ul li a:hover {
color: #ce3d33;
background: url(../img/jt_.png) no-repeat left center;
}
.footerDiv .banqunDiv {
background: #000;
color: #f4f4f4;
font-size: 14px;
padding: 20px 0;
}
.kefuK {
position: fixed;
right: 0;
bottom: 50px;
z-index: 999;
width: 70px;
}
.kefuK .backTop {
box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.07);
width: 70px;
height: 70px;
background: #ce3d33;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
}
.kefuK .selB {
/* display: none; */
color: #fff;
}
/* .kefuK:hover .selB{display: block;} */
.kefuK .selB .aB {
display: flex;
justify-content: center;
align-items: center;
width: 70px;
height: 70px;
cursor: pointer;
margin-bottom: 2px;
flex-direction: column;
background-color: #ff7208;
}
.kefuK .selB .aB p {
margin-top: 4px;
font-size: 14px;
color: #fff;
}
.kefuK .selB .aB:hover {
background: #ce3d33;
}
.kefuK .selB .eachB:last-child .aB {
margin-bottom: 25px;
}
.kefuK .selB .eachB {
position: relative;
}
.kefuK .selB .eachB .bB {
position: absolute;
right: 78px;
top: 0;
width: max-content;
background: #ffffff;
box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.07);
padding: 12px 28px;
border-radius: 8px;
overflow: hidden;
color: #666666;
display: none;
}
.kefuK .selB .eachB .bB span {
font-size: 14px;
}
.kefuK .selB .eachB .bB p {
font-size: 18px;
color: #ce3d33;
}
.kefuK .selB .eachB:hover .aB i {
color: #ce3d33;
}
.kefuK .selB .eachB:hover .bB {
display: block;
}
.kefuK .selB .eachB .bB.ewmB {
/* display: flex;
justify-content: center;
align-items: center; */
padding: 10px;
}
.kefuK .selB .ewmB p {
margin-right: 8px;
}
.kefuK .selB .ewmB p:last-child {
margin-right: 0;
}
.kefuK .selB .ewmB img {
width: 112px;
display: block;
margin: 0 auto;
}
@media (max-width:1024px) {
.kefuK {
right: 0;
bottom: 16px;
}
}
/*::-webkit-scrollbar
{
width: 2px;
height: 2px;
}
::-webkit-scrollbar-track
{
border-radius: 4px;
background-color: #f5f5f5;
}
::-webkit-scrollbar-thumb
{
border-radius: 4px;
background-color: #0E50D1;
}*/
.imgOver {
position: relative;
}
.imgOver .pic {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
}
.imgOver .pic img {
width: 100%;
height: 100%;
object-fit: cover;
}
/********************************* 首页 **********************************/
.main {
margin-top: 85px;
}
.f60 {
font-size: 60px;
}
.f36 {
font-size: 36px;
}
.f32 {
font-size: 32px;
}
.f28 {
font-size: 28px;
}
.f24 {
font-size: 24px;
}
.f22 {
font-size: 22px;
}
.f20 {
font-size: 20px;
}
.f18 {
font-size: 18px;
}
.bold {
font-weight: bold;
}
/*banner轮播*/
.index-banner {
width: 100%;
position: relative;
}
.index-banner .swiper-slide {
overflow: hidden;
}
.index-banner .img {
width: 100%;
display: block;
height: 45.05vw;
background: none no-repeat center;
background-size: cover;
}
.index-banner .img .wrap {
position: relative;
}
.index-banner .gridVideo {
width: 100%;
display: block;
height: 46.875vw;
position: relative;
position: absolute;
left: 0;
top: 0;
}
.index-banner .gridVideo video {
width: 100%;
height: 100%;
object-fit: cover;
position: absolute;
left: 0;
top: 0;
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
transition: z-index 0s ease 0.7s, opacity 0.35s ease 0.7s;
display: block;
}
.index-banner .swiper-container-horizontal>.swiper-pagination-bullets {
bottom: 40px;
}
.index-banner .swiper-pagination-bullet {
width: 6px;
height: 6px;
background: #fff;
border-radius: 50%;
opacity: 1;
position: relative;
}
.index-banner .swiper-pagination-bullet-active {
opacity: 1;
position: relative;
}
.index-banner .swiper-pagination-bullet-active:after {
content: "";
width: 16px;
height: 16px;
border: 1px solid #fff;
border-radius: 50%;
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
top: 50%;
}
.index-banner .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 10px;
}
.index-banner .swiper-button-prev,
.index-banner .swiper-button-next {
width: 24px;
height: 100%;
top: 0;
margin-top: 0;
}
.index-banner .swiper-button-prev {
background: url(../img/left.png) no-repeat center center/100%;
left: 2vw;
}
.index-banner .swiper-button-next {
background: url(../img/right.png) no-repeat center center/100%;
right: 2vw;
}
.indexTitle {
position: relative;
text-align: center;
color: #3e3e3e;
}
.indexTitle .tit {
display: block;
font-weight: bold;
text-transform: uppercase;
}
.indexTitle .tit span {
color: #ca362b;
}
.indexDiv1 {
padding: 107px 50px 60px;
}
.indexDiv1 .bdDiv {
margin-top: 30px;
}
.indexDiv1 .bdDiv>.flexbet {
margin-top: -20px;
align-items: stretch;
}
.indexDiv1 .bdDiv .blDiv {
width: 52.97%;
background: url(../img/i-bg1.jpg) no-repeat center center/cover;
color: #fff;
padding: 6.2vw 4.6vw 6.2vw calc((100% - 1210px) / 2);
}
.indexDiv1 .bdDiv .blDiv .title {
text-transform: uppercase;
}
.indexDiv1 .bdDiv .blDiv ul {
flex-direction: column;
height: 145px;
flex-wrap: wrap;
margin: 30px 0 60px;
align-items: flex-start;
}
.indexDiv1 .bdDiv .blDiv ul li {
width: calc(50% - 30px);
font-size: 14px;
margin: 4px 0;
}
.indexDiv1 .bdDiv .blDiv ul li a {
color: #fff;
}
.indexDiv1 .bdDiv .blDiv a.moreBtn {
width: 134px;
height: 40px;
background: #ff7900;
color: #fff;
border-radius: 2px;
font-size: 14px;
}
.indexDiv1 .bdDiv .blDiv a.moreBtn:hover {
opacity: .8;
}
.indexDiv1 .bdDiv .brDiv {
width: 46.9%;
}
.indexDiv1 .bdDiv .brDiv .row {
margin: -1px;
height: 100%;
}
.indexDiv1 .bdDiv .brDiv .row>div {
padding: 1px;
height: 50%;
}
.indexDiv1 .bdDiv .brDiv .row>div a {
display: block;
position: relative;
height: 100%;
}
.indexDiv1 .bdDiv .brDiv .row>div .imgDiv {
padding-top: 100%;
min-height: 100%;
}
.indexDiv1 .bdDiv .brDiv .row>div .bgDiv {
position: absolute;
left: 0;
top: 0;
background: rgba(255, 121, 0, .75);
color: #fff;
width: 100%;
height: 100%;
flex-direction: column;
align-items: stretch;
padding: 20px;
transform: scale(0);
transition: all .5s;
}
.indexDiv1 .bdDiv .brDiv .row>div .textDiv small {
font-size: 11px;
}
.indexDiv1 .bdDiv .brDiv .row>div .textDiv .line {
width: 45px;
height: 1px;
background: rgba(229, 229, 229, .5);
margin: 30px 0 8px;
}
.indexDiv1 .bdDiv .brDiv .row>div .textDiv .p {
font-size: 14px;
}
.indexDiv1 .bdDiv .brDiv .row>div .moreBtn {
width: 70px;
height: 30px;
border: 1px solid #fff;
border-radius: 3px;
color: #fff;
font-size: 12px;
}
.indexDiv1 .bdDiv .brDiv .row>div a:hover .bgDiv {
transform: scale(1);
}
.nyBanner {
height: 30.9375vw;
}
.breadcrumbDiv {
background: #000;
color: #fff;
}
.breadcrumbDiv .homeImg {
width: 90px;
height: 65px;
background: #ce3d33;
margin-right: 40px;
}
.breadcrumbDiv a {
color: #fff;
}
.breadcrumbDiv a:hover {
color: #ce3d33;
}
.bgf6f6f7 {
background: #f6f6f7;
}
.productDiv {
padding: 5px 2.9vw 140px 3.9vw;
}
.productDiv .bdDiv {
align-items: flex-start;
}
.productDiv .blDiv {
width: 15.83%;
background: #fff;
}
.productDiv .blDiv .lh {
padding: 35px 0 20px;
}
.productDiv .blDiv .lh img {
margin-right: 8px;
}
.productDiv .blDiv .lb ul li {
border-top: 1px solid #e9e9e9;
}
.productDiv .blDiv .lb ul li>a {
line-height: 45px;
padding-left: 21%;
display: block;
color: #333;
}
.productDiv .blDiv .lb ul li>a span {
padding-left: 21px;
background: url(../img/sj.png) no-repeat left center;
}
.productDiv .blDiv .lb ul li.on>a {
background: #ce3d33;
color: #fff;
}
.productDiv .blDiv .lb ul li.on>a span {
background: url(../img/sj_.png) no-repeat left center;
}
.productDiv .blDiv .lb ul li.on .aDiv {
display: block;
}
.productDiv .blDiv .lb ul li .aDiv {
display: none;
}
.productDiv .blDiv .lb ul li .aDiv a {
font-size: 14px;
color: #333333;
padding: 12px 0;
border-top: 1px solid rgba(206, 61, 51, .17);
display: block;
padding-left: 31%;
}
.productDiv .blDiv .lb ul li .aDiv a.on {
color: #CE3D33;
}
.productDiv .brDiv {
width: 80.87%;
padding: 30px;
}
.productDiv .brDiv .rhDiv {
color: #ce3d33;
padding-left: 20px;
border-left: 2px solid #c09b75;
font-size: 18px;
text-transform: uppercase;
align-items: flex-start;
line-height: 1;
height: 40px;
margin-bottom: 15px;
}
.productDiv .brDiv .rhDiv span {
margin-right: 15px;
}
.productDiv .brDiv .rhDiv .line {
flex: 1;
height: 1px;
background: #ce3d33;
}
.productDiv .brDiv .rbDiv {
padding-right: 9.2%;
}
.productDiv .brDiv .row {
margin: 0 -1vw;
}
.productDiv .brDiv .row>div {
padding: 0 1vw;
margin-bottom: 2.3vw;
}
.productDiv .brDiv .row>div a {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: stretch;
background: #fff;
padding: 30px;
height: 100%;
}
.productDiv .brDiv .row>div .imgDiv {
padding-top: 92.5%;
overflow: initial;
}
.productDiv .brDiv .row>div .imgDiv .pic {
overflow: initial;
}
.productDiv .brDiv .row>div .imgDiv img {
object-fit: contain;
}
.productDiv .brDiv .row>div .title {
text-align: center;
color: #333;
margin: 25px 0 40px;
font-size: 1.4583vw;
}
.productDiv .brDiv .row>div .moreBtn {
width: 100%;
max-width: 164px;
height: 40px;
border: 1px solid #CE3D33;
color: #CE3D33;
margin: 0 auto;
border-radius: 20px;
font-size: 14px;
transform: all .3s;
}
.productDiv .brDiv .row>div a:hover {
box-shadow: 0px 0px 16px rgba(3, 28, 62, .24);
}
.productDiv .brDiv .row>div a:hover .moreBtn {
background: #CE3D33;
color: #fff;
}
.proDetailDiv .hdDiv .hlcDiv {
/*background: url(../img/pd-bg1.png) no-repeat right top 120px;*/
color: #fff;
padding: 150px 0 70px;
}
.proDetailDiv .hlDiv {
width: 70%;
}
.proDetailDiv .textDiv {
width: 72%;
}
.proDetailDiv .p {
margin: 40px 0 0;
line-height: 2;
}
.proDetailDiv ul {
align-items: flex-start;
}
.proDetailDiv ul li {
text-align: center;
width: 20%;
margin-top: 45px;
}
.proDetailDiv ul li p {
margin-top: 20px;
}
.nyBanner1 {
height: 18.75vw;
}
.joinDiv {
margin: 25px 0;
}
.joinDiv .jhDiv {
padding-bottom: 12px;
border-bottom: 1px solid #f5f5f5;
position: relative;
}
.joinDiv .jhDiv:after {
content: "";
width: 84px;
height: 2px;
background: #cd392e;
position: absolute;
left: 0;
bottom: 0;
}
.joinDiv .jbDiv ul li a {
padding: 20px 0;
border-bottom: 1px solid #f5f5f5;
display: block;
}
.joinDiv .jbDiv ul li .title {
color: #333333;
font-weight: bold;
}
.joinDiv .jbDiv ul li .p {
color: #666666;
font-size: 14px;
margin-top: 10px;
}
.joinDiv .jbDiv ul li a:hover .title,
.joinDiv .jbDiv ul li a:hover .p {
color: #d0473d;
}
.lxDiv1 {
position: relative;
padding: 30px 0 213px;
overflow: hidden;
max-height: 672px;
}
.lxDiv1 .bdDiv {
margin-top: 150px;
}
.lxDiv1 .blDiv {
width: 35%;
}
.lxDiv1 .blDiv .p1 {
margin-bottom: 50px;
}
.lxDiv1 .blDiv .p1 p {
margin-top: 3px;
color: #666666;
}
.lxDiv1 .blDiv .p2 {
font-size: 14px;
line-height: 2.3;
}
.lxDiv1 .brDiv {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
/* width: 54.6%; */
z-index: 0;
height: 100%;
}
.lxDiv1 .brDiv img {
height: 100%;
}
/*.lxDiv1 .lxMenu {position: absolute;left: 50%;top: 30px;transform: translateX(-50%); }*/
.lxMenu {
border: 1px solid #d0473d;
max-width: 540px;
margin: 0 auto;
border-right: 0;
position: relative;
z-index: 2;
background: #fff;
}
.lxMenu a {
width: 180px;
line-height: 36px;
color: #333333;
text-align: center;
font-size: 14px;
border-right: 1px solid #d0473d;
}
.lxMenu a.on {
background: #d0473d;
color: #fff;
}
.lxDiv2 {
padding: 30px 0 137px;
}
.lxDiv2 .hdDiv {
margin: 105px 0 40px;
text-align: center;
}
.lxDiv2 .hdDiv p {
font-size: 14px;
color: #666666;
margin: 5px 0 10px;
}
.lxDiv2 .hdDiv .line {
width: 69px;
height: 2px;
background: #d0473d;
margin: 0 auto 20px;
}
.lxDiv2 .bdDiv .row {
margin: 0 -6.5px;
}
.lxDiv2 .bdDiv .row>div {
padding: 0 6.5px;
margin-bottom: 13px;
}
.lxDiv2 .bdDiv .row>div .conDiv {
border: 1px solid #d2d2d2;
flex-direction: column;
position: relative;
text-align: center;
padding: 40px 20px 60px;
height: 100%;
}
.lxDiv2 .bdDiv .row>div .conDiv .dImg {
display: block;
}
.lxDiv2 .bdDiv .row>div .conDiv .hImg {
display: none;
}
.lxDiv2 .bdDiv .row>div .conDiv .tit {
font-size: 18px;
margin-top: 25px;
}
.lxDiv2 .bdDiv .row>div .textDiv {
font-size: 14px;
position: absolute;
left: 8px;
bottom: 100%;
width: calc(100% - 16px);
border-radius: 10px;
background: #fff;
padding: 20px;
box-shadow: 0px 0px 16px rgba(131, 133, 144, 0.15);
/* transform: translateY(200px); */
transition: all .5s;
opacity: 0;
text-align: left;
z-index: -1;
}
.lxDiv2 .bdDiv .row>div .textDiv .th {
border-bottom: 1px dashed #dddddd;
padding-bottom: 20px;
margin-bottom: 20px;
}
.lxDiv2 .bdDiv .row>div .textDiv .th p {
color: #868a9d;
margin-top: 5px;
}
.lxDiv2 .bdDiv .row>div .textDiv .tb {
align-items: flex-start;
}
.lxDiv2 .bdDiv .row>div .textDiv .tb p {
width: calc(100% - 50px);
}
.lxDiv2 .bdDiv .row>div .textDiv .tb .ewmDiv {
width: 73px;
}
.lxDiv2 .bdDiv .row>div .conDiv:hover .textDiv {
transform: translateY(-107px);
opacity: 1;
bottom: 0;
z-index: 1;
}
.lxDiv2 .bdDiv .row>div .conDiv:hover {
background: #ff7900;
}
.lxDiv2 .bdDiv .row>div .conDiv:hover .dImg {
/* display: none; */
filter: grayscale(100%) brightness(0%) invert(100%);
-webkit-filter: grayscale(100%) brightness(0%) invert(100%); /* 兼容旧版WebKit浏览器 */
}
/*
.lxDiv2 .bdDiv .row>div .conDiv:hover .hImg {
display: block;
} */
.lxDiv2 .bdDiv .row>div .conDiv:hover .tit {
color: #fff;
}
.lxDiv3 {
position: relative;
padding: 30px 0 213px;
overflow: hidden;
}
.lxDiv3 .bdDiv {
margin-top: 150px;
}
.lxDiv3 .blDiv {
width: 35%;
}
.lxDiv3 .blDiv .p1 {
margin-bottom: 50px;
}
.lxDiv3 .blDiv .p1 p {
margin-top: 3px;
color: #666666;
}
.lxDiv3 .blDiv .p2 {
font-size: 14px;
line-height: 2.3;
}
.lxDiv3 .brDiv {
width: 53%;
}
.lxDiv3 .brDiv .row {
margin: 0 -22.5px;
}
.lxDiv3 .brDiv .row>div {
padding: 0 22.5px;
}
.lxDiv3 .brDiv .row>div .conDiv {
flex-direction: column;
text-align: center;
padding: 30px;
border: 1px solid #7d7d7d;
border-radius: 20px;
height: 100%;
}
.lxDiv3 .brDiv .row>div .conDiv .tt {
flex: 1;
margin-bottom: 45px;
}
.lxDiv3 .brDiv .row>div .conDiv a {
min-width: 66px;
height: 32px;
background: #000000;
border-radius: 20px;
color: #fff;
font-size: 14px;
margin-top: 20px;
padding: 0 8px;
}
.lxDiv3 .brDiv .row>div .conDiv a:hover {
background: #CE3D33;
}
.lxDiv3 .brDiv .row>div .textDiv {
font-size: 14px;
position: absolute;
left: 8px;
bottom: 100%;
width: calc(100% - 16px);
border-radius: 10px;
background: #fff;
padding: 20px;
box-shadow: 0px 0px 16px rgba(131, 133, 144, 0.15);
/* transform: translateY(200px); */
transition: all .5s;
opacity: 0;
text-align: left;
z-index: -1;
color: #333;
}
.lxDiv3 .brDiv .row>div .textDiv .th {
border-bottom: 1px dashed #dddddd;
padding-bottom: 20px;
margin-bottom: 20px;
}
.lxDiv3 .brDiv .row>div .textDiv .th p {
color: #868a9d;
margin-top: 5px;
}
.lxDiv3 .brDiv .row>div .textDiv .tb {
align-items: flex-start;
}
.lxDiv3 .brDiv .row>div .textDiv .tb p {
width: calc(100% - 90px);
}
.lxDiv3 .brDiv .row>div .textDiv .tb .ewmDiv {
width: 73px;
}
.lxDiv3 .brDiv .row>div .conDiv:hover {
background: #ff7900;
color: #fff;
}
.lxDiv3 .brDiv .row>div .conDiv:hover .textDiv {
transform: translateY(-107px);
opacity: 1;
bottom: 0;
z-index: 1;
}
.aboutBanner {
padding: 14.84375vw 0 330px;
color: #fff;
text-align: center;
}
.aboutBanner .p {
margin-top: 70px;
line-height: 1.75;
}
.aboutDiv1 {
margin-top: -202px;
}
.aboutDiv1 .dataDiv {
background: #fff;
padding: 30px 0 40px;
border-radius: 20px;
}
.aboutDiv1 .dataDiv ul li {
width: 33.3%;
text-align: center;
}
.aboutDiv1 .dataDiv ul li .num {
font-weight: bold;
margin: 10px 0 0px;
}
.aboutDiv1 .dataDiv ul li p {
color: #666666;
}
.aboutDiv1 .rowDiv {
margin: 60px 0 110px;
}
.aboutDiv1 .rowDiv .row>div {
margin: 15px 0;
flex: 0 0 20%;
max-width: 20%;
}
.aboutDiv1 .rowDiv .row>div .imgDiv {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.aboutDiv1 .rowDiv .row>div .imgDiv img {
filter: url('data:image/svg+xml;utf8,#grayscale');
/* Firefox 3.5+, IE10 */
filter: gray;
-webkit-filter: grayscale(100%);
/* Chrome 19+ & Safari 6+ */
-webkit-transition: all .6s ease;
/* Fade to color for Chrome and Safari */
-webkit-backface-visibility: hidden;
/* Fix for transition flickering */
}
.aboutDiv1 .rowDiv .row>div .imgDiv img:hover {
filter: none;
-webkit-filter: grayscale(0%);
}
.aboutDiv1 .bdDiv {
position: relative;
align-items: stretch;
}
.aboutDiv1 .bdDiv .blDiv {
width: 34.2%;
display: flex;
justify-content: center;
}
.aboutDiv1 .bdDiv .blDiv img {
/*width: 100%;*/
height: 100%;
object-fit: cover;
max-width: initial;
}
.aboutDiv1 .bdDiv .brDiv {
width: 65.8%;
position: relative;
background: #cd392e;
padding: 50px 30px;
color: #fff;
}
.aboutTitle {
color: #fff;
}
.aboutTitle.tc {
text-align: center;
}
.aboutTitle .line {
width: 40px;
height: 1px;
background: #fff;
margin: 10px 0;
}
.aboutTitle.tc .line {
margin: 10px auto;
}
.aboutDiv1 .bdDiv .brDiv .textDiv .text {
margin: 60px 0 40px;
font-size: 14px;
}
.aboutDiv1 .bdDiv .brDiv .textDiv p {
margin: 5px 0;
padding-left: 26px;
background: url(../img/sjx.png) no-repeat left top 5px;
}
.aboutDiv1 .bdDiv .brDiv .lunboDiv {
position: relative;
padding: 0 54px;
}
.aboutDiv1 .bdDiv .brDiv .lunboDiv .imgDiv {
padding-top: 66.67%;
}
.aboutDiv1 .swiper-button-prev,
.aboutDiv1 .swiper-button-next {
width: 30px;
height: 100%;
top: 0;
margin-top: 0;
}
.aboutDiv1 .swiper-button-prev {
background: url(../img/left.png) no-repeat center center/100%;
left: 0;
}
.aboutDiv1 .swiper-button-next {
background: url(../img/right.png) no-repeat center center/100%;
right: 0;
}
.aboutDiv2 .hlDiv {
width: 30.83%;
background: #cd392e;
padding: 45px 3%;
color: #fff;
}
.aboutDiv2 .hlDiv .p1 {
margin-top: 20px;
}
.aboutDiv2 .bdDiv {
align-items: stretch;
}
.aboutDiv2 .blDiv {
width: 30.83%;
background: rgba(255, 255, 255, .25);
text-align: center;
padding-bottom: 140px;
}
.aboutDiv2 .blDiv ul li {
padding: 30px 0 20px;
border-bottom: 1px solid rgba(170, 170, 170, .16);
cursor: pointer;
}
.aboutDiv2 .blDiv ul li.on {
color: #cd392e;
}
.aboutDiv2 .brDiv {
width: 62.17%;
position: relative;
overflow: hidden;
}
.aboutDiv2 .brDiv .tabsDiv {
position: absolute;
left: 0;
width: 100%;
top: 0;
opacity: 0;
z-index: 0;
transform: translateX(100px);
}
.aboutDiv2 .brDiv .tabsDiv.on {
position: relative;
opacity: 1;
z-index: 1;
transform: translateX(0);
transition: all .8s;
}
.aboutDiv2 .brDiv .tabsDiv .tit {
font-size: 18px;
padding-left: 35px;
background: url(../img/yuan.png) no-repeat left top 5px;
}
.aboutDiv2 .brDiv .tabsDiv .p {
margin-top: 55px;
line-height: 1.8;
font-size: 14px;
}
.solDiv {
padding: 40px 0;
}
.solDiv .row>div {
margin-bottom: 30px;
}
.solDiv .row>div a {
height: 100%;
flex-direction: column;
align-items: stretch;
position: relative;
}
.solDiv .row>div .imgDiv {
padding-top: 71%;
}
.solDiv .row>div .textDiv {
flex-direction: column;
align-items: stretch;
flex: 1;
padding: 15px 10%;
color: #333;
}
.solDiv .row>div .textDiv .th {
flex: 1;
}
.solDiv .row>div .textDiv .th .tit {
font-weight: bold;
}
.solDiv .row>div .textDiv .th .p1 {
margin: 15px 0;
}
.solDiv .row>div .textDiv .tb {
border-top: 1px solid #e5e5e5;
margin-top: 25px;
padding-top: 20px;
flex-wrap: wrap;
}
.solDiv .row>div .textDiv .tb span {
padding: 0 7px;
line-height: 30px;
border-radius: 20px;
font-size: 14px;
margin-right: 6px;
margin-bottom: 10px;
}
/* .solDiv .row>div .textDiv .tb span:nth-child(1) {
background: rgba(207, 169, 114, .13);
color: #bda7ad;
}
.solDiv .row>div .textDiv .tb span:nth-child(2) {
background: rgba(100, 181, 58, .13);
color: #64b53a;
}
.solDiv .row>div .textDiv .tb span:nth-child(3) {
background: rgba(207, 172, 20, .13);
color: #cfac14;
}
.solDiv .row>div .textDiv .tb span:nth-child(4) {
background: rgba(0, 158, 255, .13);
color: #009eff;
} */
.solDiv .row>div .textDiv .tb span:last-child {
margin-right: 0;
}
.solDiv .row>div .bgDiv {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
flex-direction: column;
opacity: 0;
transition: all .5s;
}
.solDiv .row>div .bgDiv .img {
flex: 1;
}
.solDiv .row>div .bgDiv span {
color: #fff;
margin-bottom: 40px;
font-size: 18px;
}
.solDiv .row>div a:hover .bgDiv {
opacity: 1;
}
.popDiv {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, .28);
z-index: 9999;
display: none;
}
.popDiv .popCon {
position: absolute;
left: 50%;
top: 50%;
background: #fff;
align-items: stretch;
transform: translate(-50%, -50%);
width: 96%;
max-width: 1200px;
}
.popDiv .popCon .plDiv {
width: 50%;
}
.popDiv .popCon .plDiv video,.popDiv .popCon .plDiv img {
width: 100%;
height: 100%;
object-fit: cover;
}
.popDiv .popCon .prDiv {
width: 50%;
position: relative;
padding: 60px 50px 40px;
}
.popDiv .popCon .prDiv a.close {
position: absolute;
right: 15px;
top: 15px;
}
.popDiv .popCon .prDiv .pt1 .tt {
color: #000;
}
.popDiv .popCon .prDiv .pt1 .p {
font-size: 14px;
color: #666666;
margin-top: 10px;
}
.popDiv .popCon .prDiv .pt2 {
padding: 20px 0;
border-bottom: 1px solid #e5e5e5;
border-top: 1px solid #e5e5e5;
margin: 20px 0;
}
.popDiv .popCon .prDiv .pt2 .p {
margin-bottom: 20px;
}
.popDiv .popCon .prDiv .pt2 .p .p1 {
font-weight: bold;
}
.popDiv .popCon .prDiv .pt2 .p .p2 {
font-size: 14px;
}
.popDiv .popCon .prDiv .pt2 .p .p2 a {
text-decoration: underline;
color: #00a4ff;
}
.popDiv .popCon .prDiv .pt3 .tit {
color: #666666;
font-weight: bold;
}
.popDiv .popCon .prDiv .pt3 .tagDiv {
flex-wrap: wrap;
margin-top: 10px;
}
.popDiv .popCon .prDiv .pt3 .tagDiv span {
padding: 0 7px;
line-height: 30px;
border-radius: 20px;
font-size: 14px;
margin-right: 6px;
margin-bottom: 10px;
}
/* .popDiv .popCon .prDiv .pt3 .tagDiv span:nth-child(1) {
background: rgba(207, 169, 114, .13);
color: #bda7ad;
}
.popDiv .popCon .prDiv .pt3 .tagDiv span:nth-child(2) {
background: rgba(100, 181, 58, .13);
color: #64b53a;
}
.popDiv .popCon .prDiv .pt3 .tagDiv span:nth-child(3) {
background: rgba(207, 172, 20, .13);
color: #cfac14;
}
.popDiv .popCon .prDiv .pt3 .tagDiv span:nth-child(4) {
background: rgba(0, 158, 255, .13);
color: #009eff;
} */
.popDiv .popCon .prDiv .pt3 .tagDiv span:last-child {
margin-right: 0;
}
.joinDetailDiv {
padding: 30px 0;
}
.joinDetailDiv .p1 {
margin-bottom: 50px;
}
.joinDetailDiv .p1 .tit {
color: #333;
margin-bottom: 10px;
}
.joinDetailDiv .p1 .xinzi {
color: #666;
font-size: 14px;
}
.joinDetailDiv .p1 .xinzi span {
color: #333;
}
.joinDetailDiv .p1 p {
font-size: 14px;
color: #666;
}
.joinDetailDiv .p2 {
margin-bottom: 50px;
}
.joinDetailDiv .p2 .pt {
padding-left: 10px;
border-left: 5px solid #cc372e;
line-height: 1;
margin-bottom: 15px;
}
.joinDetailDiv .p2 .pb {
font-size: 14px;
color: #666;
line-height: 2;
}
.joinDetailDiv a {
width: 120px;
height: 45px;
background: #333;
color: #fff;
border-radius: 5px;
}
.joinDetailDiv a:hover {
background: #cc372e;
}
/*body:after {
content: '';
position: fixed;
z-index: 9998;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .8);
display: none;
}
body.on-menu:after {
display: block;
}*/
/*.menu ul ul li.has-sub>a::after{position:absolute;top:13px;right:10px;width:4px;height:4px;border-bottom:1px solid #ddd;border-right:1px solid #ddd;content:"";-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:border-color .2s ease;-moz-transition:border-color .2s ease;-ms-transition:border-color .2s ease;-o-transition:border-color .2s ease;transition:border-color .2s ease}
.menu.align-right ul ul li.has-sub>a::after{right:auto;left:10px;border-bottom:0;border-right:0;border-top:1px solid #ddd;border-left:1px solid #ddd}
.menu ul ul li.has-sub:hover>a::after{border-color:#fff}*/
@media (max-width:1400px) {
.indexDiv1 .bdDiv .blDiv {
padding: 50px 20px;
}
.f60 {
font-size: 50px;
}
}
@media (max-width:1300px) {
header .searchDiv form {
margin: 0 15px 0 10px;
}
header .rightDiv .menu>ul>li {
margin-right: 0;
}
.indexDiv1 .bdDiv .blDiv ul {
margin: 15px 0 30px;
}
.indexDiv1 .bdDiv .brDiv .row>div .bgDiv {
padding: 10px;
}
.indexDiv1 .bdDiv .brDiv .row>div .textDiv .line {
margin: 10px 0 5px;
}
.indexDiv1 .bdDiv .brDiv .row>div .textDiv .tit {
font-size: 14px;
}
.indexDiv1 .bdDiv .brDiv .row>div .textDiv .p {
font-size: 12px;
}
.productDiv .brDiv .rbDiv {
padding-right: 0;
}
.productDiv .brDiv .row>div .title {
font-size: 18px;
}
.productDiv .blDiv {
width: 180px;
}
.productDiv .brDiv {
width: calc(100% - 210px);
}
.wrap {
padding: 0 30px;
}
.f60 {
font-size: 40px;
}
}
@media (max-width:1100px) {
header .rightDiv .menu>ul>li>a {
padding: 0 15px;
font-size: 14px;
}
header .othersDiv .langDiv>a {
font-size: 20px;
}
header .searchDiv form {
width: 157px;
}
}
@media (min-width:992px) and (max-width:1024px) {}
@media (min-width:768px) and (max-width:991px) {}
@media (max-width:1023px) {
.menu {
width: 100%
}
.menu ul {
width: 100%;
display: block;
}
.menu>ul>li>a {
padding: 0 20px;
}
.menu.align-center>ul,
.menu.align-right ul ul {
text-align: left
}
.menu ul li,
.menu ul ul li,
.menu ul li:hover>ul>li {
width: 100%;
height: auto;
border-bottom: 1px solid rgba(0, 0, 0, .2);
}
/*.indexHeader .menu ul li,.indexHeader .menu ul ul li,.indexHeader .menu ul li:hover>ul>li{border-top:1px solid rgba(255,255,255,.2);}*/
/*.on-fixed .indexHeader .menu ul li,.on-fixed .indexHeader .menu ul ul li,.on-fixed .indexHeader .menu ul li:hover>ul>li{border-top:1px solid rgba(0,0,0,.2);}*/
.menu ul li a,
.menu ul ul li a {
width: 100%
}
.menu>ul>li,
.menu.align-center>ul>li,
.menu.align-right>ul>li {
float: none;
display: block
}
.menu ul ul li a {
padding: 0 20px 0;
font-size: 12px;
color: #333;
background: 0 0
}
.menu ul ul li:hover>a,
.menu ul ul li a:hover {
color: #333
}
/* /*
.indexHeader .menu ul ul li a{color:#fff;}
.indexHeader .menu ul ul li:hover>a,.indexHeader .menu ul ul li a:hover{color:#fff}*/
.on-fixed .indexHeader .menu ul ul li a {
color: #333;
}
.on-fixed .indexHeader .menu ul ul li:hover>a,
.indexHeader .menu ul ul li a:hover {
color: #333
}
.menu ul ul ul li a {
padding-left: 40px
}
.menu ul ul,
.menu ul ul ul {
position: relative;
left: 0;
right: auto;
width: 100%;
margin: 0
}
.menu>ul>li.has-sub>a::after,
.menu ul ul li.has-sub>a::after {
display: none
}
#menu-line {
display: none
}
.menu #menu-button {
display: block;
padding: 20px;
color: #000;
cursor: pointer;
font-size: 12px;
text-transform: uppercase
}
.menu #menu-button::after {
content: '';
position: absolute;
top: 20px;
right: 20px;
display: block;
width: 15px;
height: 2px;
background: #fff
}
.menu #menu-button::before {
content: '';
position: absolute;
top: 25px;
right: 20px;
display: block;
width: 15px;
height: 3px;
border-top: 2px solid #333;
border-bottom: 2px solid #fff
}
.menu .submenu-button {
position: absolute;
z-index: 10;
right: 0;
top: 0;
display: block;
border-left: 1px solid rgba(0, 0, 0, .1);
height: 52px;
width: 52px;
cursor: pointer
}
header .rightDiv .menu>ul>li.has-sub>a:before {
display: none;
}
.menu .submenu-button::after {
content: '';
position: absolute;
top: 21px;
left: 26px;
display: block;
width: 1px;
height: 11px;
background: #333;
z-index: 99
}
.menu .submenu-button::before {
content: '';
position: absolute;
left: 21px;
top: 26px;
display: block;
width: 11px;
height: 1px;
background: #333;
;
z-index: 99
}
/*.indexHeader .menu .submenu-button{position:absolute;z-index:10;right:0;top:0;display:block;border-left:1px solid rgba(255,255,255,.2);height:52px;width:52px;cursor:pointer}
.indexHeader .menu .submenu-button::after{content:'';position:absolute;top:21px;left:26px;display:block;width:1px;height:11px;background:#fff;z-index:99}
.indexHeader .menu .submenu-button::before{content:'';position:absolute;left:21px;top:26px;display:block;width:11px;height:1px;background:#fff;;z-index:99}*/
/*.on-fixed .indexHeader .menu .submenu-button{position:absolute;z-index:10;right:0;top:0;display:block;border-left:1px solid rgba(0,0,0,.2);height:52px;width:52px;cursor:pointer}
.on-fixed .indexHeader .menu .submenu-button::after{content:'';position:absolute;top:21px;left:26px;display:block;width:1px;height:11px;background:#333;z-index:99}
.on-fixed .indexHeader .menu .submenu-button::before{content:'';position:absolute;left:21px;top:26px;display:block;width:11px;height:1px;background:#333;;z-index:99}*/
.menu .submenu-button.submenu-opened:after {
display: none
}
.menu ul ul {
background: transparent;
border-bottom: none;
padding: 0;
}
.menu ul ul ul {
top: 0;
}
.menu li:hover>ul {
left: auto;
margin-left: auto;
}
.menu ul ul .wrap {
padding: 0 15px;
}
.menu ul ul .hd {
display: none;
}
.menu ul ul .bd {
padding: 0;
}
header .rightDiv .menu>ul>li li a {
text-align: left;
line-height: 50px;
}
/*header.indexHeader .rightDiv .menu>ul>li li a{color: #fff;}*/
.on-fixed header.indexHeader .rightDiv .menu>ul>li li a {
color: #333;
}
header:before {
display: none;
}
header {
position: fixed !important;
z-index: 9999;
top: 0;
left: auto;
right: 0;
width: 100%;
height: 50px;
transition: right 300ms !important;
}
header .header-container {
height: 50px;
}
header .logo a {
height: 50px;
width: initial;
}
header .logo a img {
max-height: 60%;
}
header .mbtn {
display: block;
}
body.on-menu header {
background: rgba(255, 255, 255, 1);
}
body.on-menu.on-fixed header {
background: rgba(255, 255, 255, 1);
}
body.on-menu header .mbtn {
z-index: 1;
}
header .rightDiv .menu {
float: right;
position: fixed;
top: 50px;
right: 0;
width: 100%;
height: calc(100% - 50px);
padding-top: 0;
background-color: rgba(255, 255, 255, 1);
/*border-bottom: 1px solid #f8f8f847;*/
transition: right 300ms;
right: -100%;
padding: 0;
overflow-y: auto;
}
.on-fixed header .rightDiv .menu {
background-color: rgba(255, 255, 255, 1);
}
header .rightDiv .menu ul {
float: initial;
height: initial;
}
/*header .rightDiv .menu ul.open{background: #000;}*/
header .rightDiv .menu ul li {
padding: 0;
margin: 0;
/*border-bottom: 1px solid #f8f8f847;*/
float: initial;
position: relative;
}
header .rightDiv .menu ul li a {
display: block;
line-height: 50px;
height: 50px;
text-align: left;
font-size: 16px;
}
header .rightDiv .menu>ul {
display: block;
padding-top: 0;
}
body.on-menu header .rightDiv .menu {
right: 0;
}
body.on-menu .main {
right: 0;
}
header .rightDiv .menu>ul>li>a {
padding: 0 15px;
background: none;
}
header .rightDiv .menu>ul>li>a::after {
display: none;
}
header .rightDiv .menu>ul>li:hover>a,
header .rightDiv .menu>ul>li:focus>a,
header .rightDiv .menu>ul>li.on>a,
header .rightDiv .menu>ul>li.active>a {
font-weight: bold;
}
/* header.indexHeader .rightDiv .menu>ul>li>a{color: #333;} */
.menu ul ul {
box-shadow: none;
opacity: 1;
visibility: visible;
transform: translate(0px);
transition: transform .6s;
padding: 0;
left: 0;
display: block;
}
.menu ul ul .flexbet,
.menu ul ul .flexend {
padding: 0;
}
.menu>ul>li:hover>ul {
transform: initial;
}
.main {
position: relative;
right: 0;
transition: right 300ms !important;
margin-top: 50px;
}
header .othersDiv {
height: 50px;
padding-right: 40px;
}
header .othersDiv .langDiv>a {
height: 50px;
}
.menu>ul>li>ul {
padding-bottom: 0;
position: relative;
left: 0;
border-top: 0;
}
.menu>ul>li:hover>ul {
display: block;
}
.menu ul ul .wrap {
padding: 0;
}
.menu>ul>li ul .wrap {
max-width: 100%;
}
.menu>ul>li .ul {
padding-bottom: 0;
}
.menu>ul>li .ul .tabsDiv {
display: none;
}
.menu>ul>li .ul .tabsLi {
display: block;
padding: 0;
}
.menu>ul>li .ul li {
width: 100%;
}
.menu>ul>li .ul li>a {
color: #666;
font-size: 14px;
}
.menu>ul>li .ul li:last-child {
border-bottom: 0;
}
.menu>ul>li .allBtn {
display: none;
}
/* .menu>ul>li .ul{flex-wrap: wrap;display: block; }
.menu>ul>li .ul li{width: 100%;margin-right: 0;flex: initial;border: 0;border-top: 1px solid rgba(0,0,0,.2); }
.menu>ul>li .ul li:first-child{border-left: 0; }
.menu>ul>li .ul li span{padding: 0 20px; }
.menu>ul>li .ul li>a{padding: 0;border: 0; }
.menu>ul>li .ul li>.line{margin: 0; }
.menu>ul>li .ul li .aDiv{flex-wrap: wrap;flex-direction: row;border-top: 1px solid rgba(0,0,0,.2); }
.menu>ul>li .ul li .aDiv a{margin-top: 0;width: auto;padding: 0 30px;font-size: 14px;height: 50px; } */
header .wrap {
padding: 0 15px;
}
header .othersDiv {
border-left: 0;
}
header .searchDiv {
display: none;
}
/*header .searchDiv form input{line-height: 30px; }*/
.menu>ul>li .ul li .aDiv a .icon {
display: none;
}
.indexDiv1 .bdDiv>.flexbet {
display: block;
z-index: 1;
position: relative;
margin-top: -10px;
}
.indexDiv1 .bdDiv .blDiv {
width: 100%;
}
.indexDiv1 .bdDiv .brDiv {
width: 100%;
}
.lxDiv1 {
padding-bottom: 130px;
}
.lxDiv1 .brDiv {
width: 70%;
}
.lxDiv1 .bdDiv {
margin-top: 80px;
}
.f36 {
font-size: 30px;
}
.f32 {
font-size: 28px;
}
.f28 {
font-size: 25px;
}
.f24 {
font-size: 22px;
}
.f22 {
font-size: 20px;
}
}
.hidden-xs {
display: block;
}
.visible-xs {
display: none;
}
/*手机*/
@media (max-width:767px) {
html,
body {
min-width: initial;
overflow-x: hidden;
font-size: 14px;
}
.f60 {
font-size: 30px;
}
.f32 {
font-size: 24px;
}
.f28 {
font-size: 22px;
}
.f24 {
font-size: 20px;
}
.f22 {
font-size: 19px;
}
.f20 {
font-size: 18px;
}
.f18 {
font-size: 17px;
}
.hidden-xs {
display: none;
}
.visible-xs {
display: block;
}
.floatRightDiv {
display: none;
}
.wrap {
padding: 0 15px;
width: 100%;
}
header .logo {
width: auto;
}
.index-banner .img {
height: 54vw;
}
.index-banner .swiper-container-horizontal>.swiper-pagination-bullets {
bottom: 15px;
}
.indexDiv1 {
padding: 50px 15px 30px;
}
.indexDiv1 .bdDiv>.flexbet {
margin-top: -2px;
}
.indexDiv1 .bdDiv .blDiv ul {
height: initial;
}
.indexDiv1 .bdDiv .blDiv ul li {
width: 100%;
}
.indexDiv1 .bdDiv .blDiv a.moreBtn {
width: 110px;
height: 34px;
}
.footerDiv .hdDiv {
padding: 40px 0 20px;
}
.footerDiv .hdDiv .flexbet {
display: block;
}
.footerDiv .hdDiv .hlDiv {
width: 100%;
}
.footerDiv .hdDiv .hrDiv {
width: 100%;
margin-top: 20px;
}
.footerDiv .hdDiv .hrDiv .telDiv {
margin-bottom: 15px;
}
.footerDiv .bdDiv {
padding: 35px 0;
}
.footerDiv .bdDiv .wrap {
display: block;
}
.footerDiv .bdDiv .blDiv {
width: 100%;
}
.footerDiv .bdDiv .brDiv {
width: 100%;
margin-top: 0;
flex-wrap: wrap;
}
.footerDiv .bdDiv .brDiv .listDiv:first-child {
width: 100%;
}
.footerDiv .bdDiv .brDiv .listDiv {
width: 50%;
margin-top: 20px;
}
.footerDiv .bdDiv .brDiv .listDiv:first-child ul li:nth-of-type(odd) {
width: 50%;
}
.footerDiv .bdDiv .brDiv .listDiv:first-child ul li:nth-of-type(even) {
width: 50%;
}
.footerDiv .banqunDiv {
text-align: center;
}
.breadcrumbDiv .homeImg {
display: none;
}
.breadcrumbDiv .bdDiv {
padding: 10px 0;
font-size: 12px;
}
.productDiv {
padding: 30px 15px;
}
.productDiv .bdDiv {
display: block;
}
.productDiv .blDiv {
width: 100%;
}
.productDiv .brDiv {
width: 100%;
}
.productDiv .blDiv .lh {
padding: 15px 0 10px;
}
.productDiv .blDiv .lb ul li>a {
padding-left: 40px;
}
.productDiv .blDiv .lb ul li .aDiv a {
padding-left: 60px;
}
.productDiv .brDiv .row>div a {
padding: 15px;
}
.productDiv .brDiv .row>div .title {
margin: 15px 0 20px;
font-size: 16px;
}
.productDiv .brDiv .row>div .moreBtn {
height: 26px;
max-width: 90px;
font-size: 12px;
}
.proDetailDiv .hdDiv .hlcDiv {
padding: 60px 0 30px;
display: block;
background: none;
}
.proDetailDiv .hlDiv {
width: 100%;
}
.proDetailDiv .hrDiv {
width: 100%;
margin-top: 30px;
text-align: center;
}
.proDetailDiv .hrDiv img {
width: 60%;
}
.proDetailDiv ul li {
padding: 0 5px;
margin-top: 20px;
}
.proDetailDiv ul li p {
margin-top: 10px;
}
.proDetailDiv .textDiv {
width: 100%;
}
.lxDiv1 .bdDiv {
display: block;
}
.lxDiv1 .brDiv {
display: none;
}
.lxDiv1 .blDiv {
width: 100%;
}
.lxDiv2 {
padding-bottom: 120px;
}
.lxDiv2 .hdDiv {
margin: 60px 0;
}
.lxDiv3 {
padding-bottom: 120px;
}
.lxDiv3 .bdDiv {
margin-top: 80px;
display: block;
}
.lxDiv3 .blDiv {
width: 100%;
}
.lxDiv3 .brDiv {
width: 100%;
margin-top: 30px;
}
.lxDiv3 .brDiv .row>div {
margin-top: 30px;
}
.aboutBanner {
padding-bottom: 140px;
}
.aboutBanner .p {
margin-top: 20px;
font-size: 15px;
}
.aboutDiv1 {
margin-top: -100px;
}
.aboutDiv1 .dataDiv ul {
align-items: flex-start;
}
.aboutDiv1 .dataDiv ul li img {
width: 45px;
}
.aboutDiv1 .dataDiv ul li .num {
font-size: 20px;
}
.aboutDiv1 .dataDiv ul li p {
font-size: 14px;
}
.aboutDiv1 .rowDiv {
margin: 0 0 40px;
}
.aboutDiv1 .bdDiv {
display: block;
}
.aboutDiv1 .bdDiv .blDiv {
display: none;
}
.aboutDiv1 .bdDiv .brDiv {
width: 100%;
padding: 30px;
}
.aboutDiv1 .bdDiv .brDiv .textDiv .text {
margin-top: 30px;
}
.aboutDiv1 .bdDiv .brDiv .lunboDiv {
padding: 0 30px;
}
.aboutDiv1 .swiper-button-prev,
.aboutDiv1 .swiper-button-next {
width: 20px;
}
.aboutDiv2 .hlDiv {
width: 100%;
padding: 30px;
margin-top: 20px;
}
.aboutDiv2 .hlDiv .p1 {
font-size: 16px;
}
.aboutDiv2 .bdDiv {
display: block;
padding-bottom: 130px;
}
.aboutDiv2 .blDiv {
width: 100%;
font-size: 14px;
padding-bottom: 0;
}
.aboutDiv2 .blDiv ul {
display: flex;
justify-content: space-between;
align-items: center;
}
.aboutDiv2 .blDiv ul li {
width: 25%;
padding: 15px 5px;
border-bottom: 0;
}
.aboutDiv2 .brDiv {
width: 100%;
margin-top: 30px;
}
.aboutDiv2 .brDiv .tabsDiv .p {
margin-top: 20px;
}
.popDiv {
overflow-y: auto;
}
.popDiv .popCon {
flex-direction: column;
}
.popDiv .popCon .plDiv {
width: 100%;
display: none;
}
.popDiv .popCon .prDiv {
width: 100%;
padding: 30px;
background: #fff;
}
.pageDiv a,
.pageDiv span {
width: 40px;
line-height: 38px;
margin: 0 5px;
}
@media (max-width:320px) {}
}
.pageDiv {
text-align: center;
}
.pageDiv a,
.pageDiv span {
display: inline-block;
line-height: 54px;
margin: 0 15px;
color: #333333;
width: 56px;
border-radius: 50%;
border: 1px solid #c4cad8;
font-family: MR;
font-weight: bold;
}
.pageDiv span,
.pageDiv a:hover {
background: #CE3D33;
color: #fff;
border-color: #CE3D33;
}
.pageDiv a.btnA {
border: 0;
width: initial;
}
.pageDiv a.btnA:hover {
background: transparent;
color: #333;
}
/* 新增样式 */
.newsbody {
position: relative;
width: 1388px;
max-width: 96%;
margin: 35px auto 35px auto;
background-color: #F9F9F9;
padding-top: 100px;
padding-bottom: 30px;
border-radius: 50px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
overflow: hidden;
}
.newsbody::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
border-top: 250px solid #f2c4c4;
border-right: 250px solid transparent;
}
.newsbody ul {
width: 65%;
margin: auto;
}
.newsbody ul li {
padding-bottom: 80px;
padding-left: 25px;
position: relative;
border-left: 1px;
}
.newsbody ul li::before {
content: "";
position: absolute;
left: -6px;
top: 7px;
width: 12px;
height: 12px;
border: 1px solid #DCD9D9;
border-radius: 50%;
background: transparent;
background-color: white;
z-index: 1;
}
.newsbody ul li::after {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 1px;
background-color: #DCD9D9;
}
.newsbody ul li:first-child:after {
top: 19px;
}
.newsbody ul li a {
display: flex;
}
.newsbody ul li a:hover .nrr .bt,
.newsbody ul li a:hover .data,
.newsbody ul li a:hover .data span {
color: #5999F1;
}
.newsbody ul li:has(a:hover)::before {
background-color: #5999F1;
}
.newsbody ul li a .data {
color: #838383;
width: 11%;
font-size: 12px;
}
.newsbody ul li a .data span {
font-size: 18px;
color: #272626;
display: block;
}
.newsbody ul li a .nrr {
width: 89%;
}
.newsbody ul li a .nrr .bt {
margin-bottom: 10px;
font-size: 18px;
color: #272626;
}
.newsbody ul li a .nrr p {
color: #838383;
font-size: 14px;
}
/* 新闻详情 */
.newsxq {
position: relative;
top: -80px;
width: calc(1388px - 8px);
max-width: calc(96% - 8px);
overflow: hidden;
margin: auto;
min-height: 800px;
padding: 0 4px 20px;
}
.newsxq .xqtop {
padding: 25px 20px 0;
background-color: #fff;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
height: 173px;
margin: auto;
}
.newsxq .xqtop {
text-align: center;
}
.newsxq .xqtop .tit {
font-size: 24px;
color: #000000;
}
.newsxq .xqtop .entit {
color: #B5B5B5;
font-size: 16px;
}
.newsxq .xqtop .mbxa {
text-align: right;
border-bottom: 1px solid #F0F0F0;
padding-bottom: 20px;
color: #000000;
font-size: 16px;
}
.newsxq .xqtop .mbxa span {
background: url('../img/dw.jpg') no-repeat;
padding-left: 25px;
}
.newsxq .xqtop .mbxa a{
color: #000000;
font-size: 16px;
}
.newsxq .jtnrk {
width: calc(100% - 40px);
margin: auto;
border: 2px solid #D5D5D5;
background-color: white;
position: relative;
top: -15px;
padding: 50px;
}
.newsxq .jtnrk .wtit {
text-align: center;
margin-bottom: 40px;
font-size: 30px;
color: #000000;
}
.newsxq .jtnrk .wdata {
text-align: right;
margin-bottom: 50px;
font-size: 16px;
color: #888888;
}
.newsxq .jtnrk .wnr {
font-size: 16px;
color: #000000;
}
@media (max-width:1100px) {
.newsbody {
padding-top: 50px;
}
.newsbody::before {
border-top: 120px solid #f2c4c4;
border-right: 120px solid transparent;
}
.newsbody ul li {
padding-bottom: 40px;
}
.newsbody ul {
width: 80%;
}
.newsxq{top: -40px;}
.newsxq .jtnrk .wtit{margin-bottom: 20px;}
.newsxq .jtnrk .wdata{margin-bottom: 25px;}
.newsxq .jtnrk{padding: 20px;}
}
@media (max-width:767px) {
.newsxq{top: -25px;}
.newsxq .jtnrk{width: calc(100% - 20px);}
.newsxq .xqtop{height: 150px;}
.newsxq .jtnrk .wtit{font-size: 24px;}
.newsxq .xqtop .tit{font-size: 18px;}
.newsxq .xqtop .mbxa{text-align: center;}
.newsxq .jtnrk .wdata{text-align: center;}
.newsxq .jtnrk{padding: 15px;}
.newsbody::before {
border-top: 80px solid #f2c4c4;
border-right: 80px solid transparent;
}
.newsbody ul li a {
display: inline;
}
.newsbody ul li a .data {
width: auto;
}
.newsbody ul li {
padding-bottom: 20px;
}
.newsbody ul li a .nrr {
width: auto;
}
}