﻿@charset "utf-8";
/* CSS Document */
* { margin: 0; padding: 0;     box-sizing: border-box; }
html, body { width: 100%;     font-family:微软雅黑  ; font-size: 14px; }
img { border:none ;max-width:100%;     text-align-last: center;    vertical-align: middle; display: block;}
#map span{ overflow: inherit;  }
#map img{ max-width: none; }
a { color:#333;text-decoration:none; }
a:hover { color:#4d4398 ;text-decoration:none;}
ul { list-style:none;}
li{ list-style-type :none;}
.clear {clear:both;    float: none!important;    background: none;    width: 0 !important;    height: 0 !important;}
.clearfix  {clear:both;}
.w1200 { max-width:1200px; margin: 0 auto; width:90%;}
.span{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block;}
.p{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.fl-left, .fl{ float:left;}
.fl-right, .fr{ float:right;}
input{ outline: none;}
address, caption, cite, code, dfn, em, th, var {
    font-style: normal;
    font-weight: normal;
}
table
{
    border-collapse:collapse;
}
tr{    border: 1px solid #c8c8c8!important;}
td{    border: 1px solid #c8c8c8!important;}
@keyframes style1 {
    0% {
	background: rgba(0, 0, 0, .25);
	transform: translateX(-50%) translateY(-50%) scale(0)
}
to {
	background: transparent;
	transform: translateX(-50%) translateY(-50%) scale(1)
}
}


.head{ padding: 0 30px;     position: absolute;    top: 0px;    left: 50%;    transform: translateX(-50%);  box-shadow: 0 4px 8px rgba(32,32,32,.3); background: #Fff; width: 100%; z-index: 99}
.head .top{  display: flex; justify-content: space-between; align-items: center; }
.head .top .logo{ padding: 20px 0;  }
.head select{ border: none;  height: 32px;     background: #4d4398;    color: #fff; }
.head form{ display: flex; width: 60%;     align-items: center;}
.head form input{ flex: 1; border: none; line-height: 32px; background: #f2f4f6; padding: 0 20px;}
.head form button{ border: none; background: #4d4398 url(../img/ss.png) no-repeat center; width: 32px; height: 32px;  }
.head .yf{ background: url(../img/chinese.png) no-repeat center; width: 24px; height: 24px; display: table; background-size: 100%; margin: 0 30px 0 50px; position: relative;}
.head .yf::after{ content: ""; height: 100%; width: 1px; background: #ccc; position: absolute; left: -25px; top: 0;}
.head .zy{ background: url(../img/zy.png) no-repeat center; width: 24px; height: 24px; display: table; background-size: 100%; margin: 0 10px 0 10px; position: relative;}


.nav{     display: flex;    justify-content: space-between;    align-items: center; }
.nav ul{display: flex; position: relative; }
.nav ul li{ padding: 10px 35px 20px; border-bottom: 3px solid #fff; position: relative;}
.nav ul li.on{border-bottom: 3px solid #4d4398;}
.nav ul li:hover{border-bottom: 3px solid #4d4398;}
.nav ul li > a{    font-size: 16px; font-weight: bold; }
.nav ul li .nav_ul{ position: absolute;  top:54px;     left: 30px;  background: #fff; border-top: 1px #4d4398 solid;  width: 100%; padding: 20px; box-shadow: 0 12px 8px -8px rgba(0,0,0,.5);     width: 380px!important;    transform: translateX(-2em); display: none; }
.nav ul li .nav_ul a{     display: block;    color: #3a3a3a;    font-weight: 400;    padding: 0.25em 0; font-size: 16px; line-height: 32px;}
.nav ul li .nav_ul a:hover{ color: #4d4398; text-decoration: underline; }
.nav ul li:hover .nav_ul{ display: block; }
.nav i{ font-style: normal;}
.m_nav{ display: none; }



@media screen and (max-width: 768px) {
	.head form {      width: 60%;       justify-content: flex-end;}
	.head select{ display: none; }
	.head form input{ display: none;}
	.head form button{ display: none;}
	.head .zy{ display: none;}
	.head .yf{     margin: 0 20px 0 0;}
	.head .yf::after{ display: none;}
	
	.m_n{ display: block;    align-items: center;    display: flex;    justify-content: center;    padding: 0;}
	.m_n p{width: 21px;    height: 16px;    cursor: pointer;}
	.m_n p span:nth-of-type(1) {    width: 100%;    float: left;}
	.m_n p span:nth-of-type(3) {    width: 100%;    float: right;}
	.m_n span{width: 100%;    background: #4d4398;    display: block;    height: 2px;    margin: 2px 0;    float: left;    -webkit-transition: all ease 0.8s,opacity ease 0.3s;    -moz-transition: all ease 0.8s,opacity ease 0.3s;    -ms-transition: all ease 0.8s,opacity ease 0.3s;    -o-transition: all ease 0.8s,opacity ease 0.3s;    transition: all ease 0.8s,opacity ease 0.3s;    opacity: 1;}	
	.m_n  > p {    width: 21px;    height: 16px;    cursor: pointer}
	.m_n  > p span {
		width: 100%;
		background: #4d4398;
		display: block;
		height: 2px;
		margin: 2px 0;
		float: left;
		-webkit-transition: all ease 0.8s,opacity ease 0.3s;
		-moz-transition: all ease 0.8s,opacity ease 0.3s;
		-ms-transition: all ease 0.8s,opacity ease 0.3s;
		-o-transition: all ease 0.8s,opacity ease 0.3s;
		transition: all ease 0.8s,opacity ease 0.3s;
		opacity: 1
	}
	.m_n  > p.showmenu span {    background: #4d4398;    -webkit-animation: animaspan 0.5s 1;    animation: animaspan 0.5s 1;    animation-fill-mode: forwards;    -webkit-animation-fill-mode: forwards}
	.m_n  > p.showmenu span:nth-of-type(1) {     transform:translateY(6px) rotate(720deg);      width:100%; }
	.m_n  > p.showmenu span:nth-of-type(2) {    transform: rotate(720deg)}
	.m_n  > p.showmenu span:nth-of-type(3) {    transform: translateY(-6px) rotate(720deg);    width: 100%}
	.m_n  > p.showmenu span.biahuan:nth-of-type(1) {     transform:translateY(6px) rotate(670deg); }
	.m_n  > p.showmenu span.biahuan:nth-of-type(2) {    transform: translateY(0px) rotate(768deg)}
	.m_n  > p.showmenu span.biahuan:nth-of-type(3) {    width: 0;    opacity: 0}
	
	.nav{ display: none; }
	.m_nav{ display: none;}
	.m_nav ul {    display: flex;    flex-wrap: wrap;     align-content: flex-start;}	
	.m_nav ul li{border-top: 1px solid #eee;    padding: 15px 20px; width: 100%; line-height: 32px; text-align: center;}
	.m_nav ul li p{ font-size: 16px; text-align: left; color: #333;    transition: all ease .15s;    display: flex;    width: 100%;    padding: 0;    line-height: 1.2;    text-decoration: none;}
	.m_nav ul li p a{ line-height: 32px; display: table;  font-size: 16px; position: relative; width: 100%; text-align: left; margin: 0 auto;}
	.m_nav ul li p i{ width: 16px; height: 32px;   margin: 0px 0; opacity: .8; cursor: pointer;    transition: all ease .3s; background: url(../img/l.png) no-repeat  right; background-size: 16px;}
	.m_nav ul li p i.on{     transform: rotate(90deg);}
	.m_nav .nav_ul{ display: none;padding: 10px 0; }
	.m_nav .nav_ul a{    width: 90%;    display: block;    margin: 0 auto;  text-align: left;  line-height: 32px;}
}

/************************************************************************************************************/


.banner h2{ position: absolute; top: 45%; left: 0; right: 0; margin: 0 auto; color: #fff;  text-align: center; transform:  translateY(-50%); font-size: 48px;  display: table; }
.banner h2 span::after{ content: ""; position: absolute; top: -15px; left: 0; right: 0; margin: 0 auto; width: 80%; height: 2px; background: #fff; }
.banner h2 span{display: block;    font-size: 28px;    margin: 30px 0 0; position: relative; letter-spacing: 3px;}


.banner{ margin: 130px 0 0; position: relative;}
.banner .banner1_t{ position: absolute; top: 50%;  transform:  translateY(-50%); background: rgb(255 255 255 / 80%);     left: 10%; width: 33%;    padding: 20px 27px;}
.banner .banner1_t h3{font-size: 43px;     letter-spacing: 4px; margin: 0 0 14px; }
.banner .banner1_t p{    font-size: 22px;    line-height: 42px; letter-spacing: 3px; color: #4b4b4b;}
.banner .banner1_t span{    background: #4d4398; color: #fff;    line-height: 55px;    display: table;  font-size: 20px;  margin: 18px 0 0;    padding: 0 30px;    border-radius: 6px;  box-shadow: 0 8px 16px rgba(32,32,32,.15)!important;}


.banner .mySwiper{ position: relative; overflow: hidden;}
.banner .mySwiper .swiper-pagination{    width: 20%;    background: #fff;    border-radius: 50px;    height: 30px; margin:  0 auto; left: 0; right: 0;  display: flex; align-items: center;    justify-content: center;     bottom: 30px;} 
.banner .mySwiper .swiper-pagination-bullet{ width: 16px; height: 16px; margin: 0 10px; }
.banner .swiper-pagination-bullet-active {    opacity: 1;    background: #4d4398;}

.banner .swiper-button-prev{    background: url(../img/l2.png) no-repeat;    left: calc(41% - 10px);    right: auto;    bottom: 11px;    z-index: 999;    top: auto;    background-size: 20px;}
.banner .swiper-button-next{    background: url(../img/r2.png) no-repeat;    right: calc(41% - 10px);    left: auto;    bottom: 11px;    z-index: 999;    top: auto;    background-size: 20px;}


@media screen and (max-width: 768px) {


	.banner .banner1_t{ position: absolute; top: 50%;  transform:  translateY(-50%); background: rgb(255 255 255 / 80%);     left: 10%; width: 80%;    padding: 20px 27px;}
	.banner .banner1_t h3{font-size: 14px;     letter-spacing: 1px; margin: 0 0 8px; }
	.banner .banner1_t p{    font-size: 12px;    line-height: 14px; letter-spacing: 3px; color: #4b4b4b;}
	.banner .banner1_t span{    background: #4d4398; color: #fff;    line-height: 14px;    display: table;  font-size: 8px;  margin: 8px 0 0;    padding: 0 10px;    border-radius: 6px;  box-shadow: 0 8px 16px rgba(32,32,32,.15)!important;}


	.banner{ margin: 70px 0 0;}
	.banner .swiper-pagination{ display: none!important;}
	.banner .swiper-button-prev{ display: none!important;}
	.banner .swiper-button-next{ display: none!important;}

	.banner h2{ font-size: 16px; }
	.banner h2 span{ font-size: 14px; }
}

/************************************************************************************************************/


.i_pro{ margin: 50px 0 80px;}
.i_pro .w1200{ display: flex; flex-wrap: wrap;    justify-content: flex-start;}
.i_pro  h2{ font-size: 38px; text-align: center; width: 100%;}
.i_pro  p{ font-size: 14px; text-align: center; width: 100%;  color: #999; margin: 20px 0 50px}
.i_pro .w1200 a{ display: block; margin: 0 20px 20px 0 ; border: 1px solid #eee; transition: all .2s; width: calc((100% - 46px) / 3);  box-shadow: 1px 2px 8px 1px rgba(0,0,0,.22); position: relative; }
.i_pro .w1200 a:nth-child(3n){ margin: 0 0px 20px 0 ; }
.i_pro .w1200 a .ico{}
.i_pro .w1200 a .ico img{ width: 100%; }
.i_pro .w1200 a .txt{  position: absolute; bottom:0; width: 100%; }
.i_pro .w1200 a .txt h3{    color: #fff;    font-weight: 600;    font-size: 16px; text-align: center; line-height: 48px; padding: 0 10px;  background: #999; }
.i_pro .w1200 a:hover {    opacity: .94;    text-decoration: none;   }
.i_pro .w1200 a:hover .txt h3{background: #4d4398; color: #fff; } 

@media screen and (max-width: 768px) {
	.i_pro  h2{ font-size: 24px;}
	.i_pro  p{ font-size: 12 px;}
	.i_pro .w1200 a{ width: calc((100% - 20px) / 2); }
	.i_pro .w1200 a:nth-child(2n){ margin: 0 0px 20px 0 ; }
	.i_pro .w1200 a:nth-child(2n+1){ margin: 0 20px 20px 0 ; }
	.i_pro .w1200 a .txt h3{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block; font-size: 12px; line-height: 24px;}
}



.i_about{    background-image: linear-gradient(37deg,#493e97,#4d4398);    margin-bottom: 7rem;    margin-top: 4rem;    position: relative; min-height: 320px;}
.i_about .w1200{ position: relative; display: flex;     flex-direction: row-reverse;}
.i_about .i_about_l{ width: 55%; background: #fff;  padding: 50px 80px 50px 30px;    box-shadow: 0 4px 8px 1px rgba(32,32,32,.3);   position: absolute; bottom: -30px; left: 0;}
.i_about .i_about_l span{    color: #000;    text-transform: uppercase;    font-size: 14px;    font-weight: 400;    letter-spacing: 1.3px;	    opacity: .7; margin: 0 0 10px; display: table;}
.i_about .i_about_l h4{ font-size: 32px; color: #000; margin: 0 0 20px; }
.i_about .i_about_l p{ font-size: 16px; line-height: 24px; color: #3a3a3a; margin: 0 0 50px;}
.i_about .i_about_l a{ display: table; padding: 0 50px;  line-height: 56px;     font-weight: 600;     font-size: 18px;     color: #Fff; background: #4d4398; border-radius: 10px;  }
.i_about .i_about_r{ width: 50%;transform: translatey(50px);  }

@media screen and (max-width: 768px) {


	.i_about{ padding: 20px 0; }
	.i_about .i_about_l{ width: 100%; padding: 30px; transform: translatey(0px); position: relative; bottom: 0;}
	.i_about .i_about_r{ display: none;}
	.i_about .i_about_l h4{ font-size: 24px;}
	.i_about .i_about_l p{ font-size: 14px;}
	.i_about .i_about_l a{ font-size: 14px; padding: 0 20px; line-height: 38px;}
}

.i_lanmu{ margin: 50px 0 80px;}
.i_lanmu .w1200  h2{ font-size: 38px; width: 100%; margin: 20px 0 30px;}
.i_lanmu .w1200{ display: flex; flex-wrap: wrap;    justify-content: flex-start;}
.i_lanmu .w1200 a{ display: block; margin: 0 20px 20px 0 ; border: 1px solid #eee; transition: all .2s; width: calc((100% - 40px) / 3);}
.i_lanmu .w1200 a:nth-child(3n){ margin: 0 0px 20px 0 ; }
.i_lanmu .w1200 a .ico{}
.i_lanmu .w1200 a .txt{ padding: 10px 20px; }
.i_lanmu .w1200 a .txt h3{    color: #333;    font-weight: 600;    font-size: 16px; text-align: left; line-height: 48px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block; }
.i_lanmu .w1200 a .txt p{ color: #333; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.i_lanmu .w1200 a .txt span{ display: table; margin: 20px 0 10px;}
.i_lanmu .w1200 a:hover {    opacity: .94;    text-decoration: none;    box-shadow: 1px 2px 8px 1px rgba(0,0,0,.22); }
.i_lanmu .w1200 a:hover .txt h3{ color: #4d4398; } 


@media screen and (max-width: 768px) {
	.i_lanmu .w1200 h2{ font-size: 24px;}
	.i_lanmu .w1200 a{ width: 100%; margin: 0 0px 20px 0 ;}

}



.footer{background-color: #edf0f3; padding: 60px 0 20px; border-bottom: 1px solid rgba(255,255,255,0.14);}
.footer .foot_logo {  font-size:24px; text-align: center; width: 100%; margin: 0 0 10px; font-weight: bold;}
.footer .foot_txt{ text-align: center; width: 100%; line-height: 32px; color: #333; margin: 30px 0; font-size: 16px;} 
.foot_ul{ display: flex; justify-content: space-evenly; margin: 30px 0 20px;}
.foot_li{  padding: 0 0 0 26px; }
.foot_li span{ display: table; width: 100%; font-size: 16px; color: #4d4398; line-height: 32px;}
.foot_li span a{ color: #4d4398; }
.foot_li1{ background: url(../img/f1.png) no-repeat left center;  } 
.foot_li2{ background: url(../img/f2.png) no-repeat left center;  } 
.foot_li3{ background: url(../img/f3.png) no-repeat left center;  } 


@media screen and (max-width: 768px) {
	.foot_ul{    flex-wrap: wrap;}
	.foot_li{ width: 100%; margin: 0 0 20px;}
	.foot_li span{ font-size: 14px;}
}



.foot{background-color: #666a6e; padding: 20px 0; }
.foot .foot_li_a{ display: flex; margin: 30px 0 45px;     justify-content: center;}
.foot .foot_li_a img{ margin: 0 15px;}
.foot_tt{ display: flex;     justify-content: space-evenly;}
.foot_tt span{ color: #fff; opacity: 0.5;}
.foot_tt a{ color: #fff; opacity: 0.5;}

@media screen and (max-width: 768px) {
	.foot_tt{    flex-wrap: wrap;}
	.foot_tt span{ width: 100%; margin: 0 0 20px; text-align: center;}
	.foot_tt a{ width: 100%; margin: 0 0 20px; text-align: center;}
}


.dq{ margin: 20px 0; color: #ccc;}
.dq1{ margin: 180px 0 0;}
.dq a{ font-size: 16px; color: #333; padding: 0 10px; }

@media screen and (max-width: 768px) {
	.dq{ display: none; }
}

.about1{ margin: 50px 0;}
.about1 .w1200{ display: flex;     justify-content: space-between;}
.about1 .about_1_l{ width: 48%; }
.about1 .about_1_l img{ width: 100%; }
.about1 .about_1_r{ width: 48%; }
.about1 .about_1_r h2{ line-height: 36px; margin:  0 0 20px; }
.about1 .about_1_r p{ line-height: 24px; color: #595959; font-size: 16px;}
.about2 .w1200{  padding:0 0 50px 0;  }
@media screen and (max-width: 768px) {
	.about1 .w1200{ flex-wrap: wrap;   }
	.about1 .about_1_l{ width: 100%; }
	.about1 .about_1_r{ width: 100%; }
}
.about3 { background: #eee;  }
.about3 .w1200{  padding: 50px 0;  }
.about3 .w1200 h2{ font-size: 24px; text-align: center; width: 100%; margin: 30px 0;}


.pro_list{margin: 20px 0 50px;}
.pro_cont{ margin: 50px 0 20px;}
.pro_cont h3{    font-size: 28px; text-align: center; margin:  20px 0 30px;}
.pro_cont .pro_ul{ display: flex;flex-wrap: wrap; }
.pro_cont .pro_li{ width: calc((100% - 3px) / 4); padding: 20px;      border-right: 2px solid #e9e9e9; border-bottom: 2px solid #e9e9e9; }
.pro_cont .pro_li .tit {color: #3a3a3a;    font-weight: 600; line-height: 38px; text-align: center; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block; }
.pro_cont .pro_li:nth-child(4n){  border-right: none; }
.pro_cont .pro_li:nth-child(n+5){  border-bottom: none; }
.pro_cont .pro_li:hover{    box-shadow: 0 8px 16px rgba(32,32,32,.15)!important;}

.pro_name{ display: flex;  margin: 50px 0 ;justify-content: space-between;}
.pro_name_left{ width:60%;   }
.pro_name_left h2{        font-size: 2.488rem;}
.pro_name_left p{    margin: 2.25rem 0;    font-size: 1.35rem;    font-weight: 300;    line-height: 2.4rem;    color: #202020;}


.pro_n{ border-top: 1px solid #a2a7a9; }
.pro_i{ border-bottom: 1px solid #a2a7a9; border-left: 1px solid #a2a7a9; border-right: 1px solid #a2a7a9; padding: 16px; position: relative;}
.pro_i::after{ content: ""; position: absolute; top: 0; width: 100%; height: 72px; background: #f2f4f6;  z-index: -1;  left: 0;}
.pro_i a{display: flex; justify-content: space-between; }
.pro_i:hover{    box-shadow: 0 4px 8px #2020204d;}

.pro_i .ico{ width: 20%;       box-shadow: 0 2px 4px #2020204d;}
.pro_i .tit{ width: 75%;   }
.pro_i h3{display: inline-block;    max-width: 100%;    font-size: 1.45rem;    font-weight: 600;   line-height: 1.2em;    word-break: break-all;    white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis;    color: #202020; text-align: left;     margin: 10px 0 30px;}
.pro_i span{  display: block;   line-height: 1.5;    color: #3a3a3a;    text-align: left; font-size: 16px; font-weight: 400;  margin: 0 0 20px;}
.pro_i p{        display: -webkit-box;        -webkit-line-clamp: 2;        -webkit-box-orient: vertical;        overflow: hidden; line-height: 1.5; font-size: 16px;     color: #3a3a3a;}


@media screen and (max-width: 768px) {
	.pro_cont .pro_li{ width: calc((100% - 20px) / 2); }
	.pro_cont .pro_li{  border-right: 2px solid #e9e9e9; border-top: 2px solid #e9e9e9; border-bottom: none;}

	.pro_cont .pro_li:nth-child(2n){  border-right: none; }
    .pro_cont .pro_li:nth-child(1){  border-top: none; }
    .pro_cont .pro_li:nth-child(2){  border-top: none; }
    	.pro_name{     display: flex;      margin: 50px 0;     justify-content: space-between;    flex-direction: row-reverse;         flex-wrap: wrap;  }
	.pro_name_left{ width:100%;   }
	.pro_name_right{ width:100%;   }
	.pro_i a {    display: flex;    justify-content: space-between;    flex-wrap: wrap;}
	.pro_i .tit {    width: 100%;}
	.pro_i h3{ margin:  10px 0;  }
	.pro_i .ico {    width: 50%;}
}



.page{ text-align:  center;  margin: 80px auto 50px;}
.page a{ padding: 6px 12px; margin: 0 5px; background: #eee; }
.page .pre{ padding: 6px 10px; background: #4d4d4d; border-radius: 0 0px 0 0; color: #fff;}
.page .next{ padding: 6px 10px; background: #4d4d4d; border-radius: 0 0 0 0px; color: #fff;}
.page a.page-num-current{ background: #4d4398; color: #fff; }
@media screen and (max-width: 768px) {
	
}

.pro_nei{ position: relative; }
.pro_nei_left{ width: 74%; float: left;   }
.pro_nei_right{width: 22%; float: right;     position: relative; z-index: 999}
.pro_right_top{  padding: 16px; border: 1px #ccc solid; background: #eee; width: calc(100% );   }
.pro_right_top h6{    font-weight: 600; font-size: 16px; margin: 0 0 8px;     line-height: 1.2;    color: #000;}
.pro_right_top a{  color: #4d4398;  }
.pro_nei_right2.on{ position: fixed; top: 10px; width: 15%; }
.pro_nei_right2.bottom{ position:absolute; bottom: 10px; width: 100%; }

.pro_right_pro{ padding: 16px; border: 1px #ccc solid; width: calc(100% ); margin: 20px 0 0;  background: #fff;}
.pro_right_pro a{  border: 1px #eee solid; padding: 6px; display: block; margin: 0 0 8px;  }
.pro_right_pro a p{ line-height: 24px; text-align: center; }
.pro_right_pro a:hover{  border: 1px #4d4398 solid;   }

.pro_top {padding: 50px 0 0; width: 100%;     display: flex;   justify-content: space-between;}
.pro_top .w1200{     display: flex;    justify-content: space-between; }
.pro_top .pro_l{     height: -webkit-fill-available;    background: #fff;        position: relative;    overflow: hidden;    width:45%;   border: 1px solid #eee;}
.pro_top .pro_l img{ width: 100%; }
.pro_top .pro_l .swiper-slide img {        display: block;        width: 100%;        height: 100%;        object-fit: cover;      }
.pro_top .swiper {        width: 90%;             margin-left: auto;        margin-right: auto;      }
.pro_top .swiper-slide {        background-size: cover;        background-position: center;      }
.pro_top .mySwiper2 {  border: 1px solid rgba(204,204,204,.5);  height: 80%;        width: 100%;      }
.pro_top .mySwiper {        height: 70px;        box-sizing: border-box;        padding: 10px 0;      }
.pro_top .mySwiper .swiper-slide {        width:50px;        height: 100%;        opacity: 0.4;       border: 1px solid #ddd;   }
.pro_top .pro_l .mySwiper .swiper-slide-thumb-active {        opacity: 1;        border-color: red;  }
.pro_top .pro_l .swiper-slide img {        display: block;        width: 100%;        height: 100%;        object-fit: cover;      }
.pro_top .pro_l .swiper-button-next{ background: url(../img/d_09.png) no-repeat; right: 0; background-size: 100%; }
.pro_top .pro_l .swiper-button-prev{ background: url(../img/d_08.png) no-repeat; left: 0; background-size: 100%;  }
.pro_top .pro_l .swiper-button-next,.pro_top  .pro_l .swiper-button-prev{    width: 24px;    height: 13%;    overflow: hidden;    cursor: pointer; bottom: 0px!important; top: auto; background: #eee;     text-align: center; }

.pro_top .pro_l .swiper-button-next::before {    content: ">";    color: #000;    font-weight: bolder;     transform: translatey(90%);    display: table;}
.pro_top .pro_l .swiper-button-prev::before {    content: "<";    color: #000;    font-weight: bolder;       transform: translatey(90%);    display: table;}

.pro_top .pro_r{ width: 50%;}
.pro_top .pro_r h2{     line-height: 1.2;    font-size: 24px;    color: #4d4398;    font-weight: normal;    padding-top: 0px; margin: 0 0 30px;}
.pro_top .pro_r span{ display: block; font-size: 18px; font-weight: 100;  }
.pro_top .pro_r p{-webkit-line-clamp: 10;     display: -webkit-box;    -webkit-box-orient: vertical;    overflow: hidden;     white-space: pre-line;    line-height: 28px;    color: rgba(102,102,102,1);    font-size: 14px;    font-weight: normal; padding: 20px 0 20px; border-bottom: 1px solid #eee; }

.pro_top .pro_r a{   line-height: 24px;   display: table;    position: relative;    overflow: hidden;margin: 70px 0 70PX;  display: table; color: #fff; padding:10px 130px 10px 13px; font-weight: bold; background: #4d4398 url( ../img/jt.png) no-repeat 80% center; font-size: 16px; ;}
.pro_top .pro_r a:before {    content: "";    position: absolute;    display: block;    transition: all .6s;    width: 100%;    height: 0;    border-radius: 50%;    left: 50%;    top: 50%;    padding-top: 100%;    transform: translateX(-50%) translateY(-50%);}
.pro_top .pro_r a:hover:before {    animation: style1 .75s;    z-index: 1;}
.pro_top .pro_r a::after {    content: "";    position: absolute;    width: 0;    height: 100%;    transition: all .3s;    z-index: 0;    opacity: 0;    top: 0;    left: 0px;}
.pro_top .pro_r a:hover {    background-color: rgba(51,51,51,1);    font-size: 16px;  }
.pro_top .pro_r a:hover::after {    opacity: 1;}
.pro_top .pro_r img{ width: 24px; float: left; margin: 0 5px 0 0; }

.pro_info{ padding: 50px 0;}
.pro_info_nav{     overflow-x: auto;    background-color: #eee;    overflow-y: hidden;    white-space: nowrap;}
.pro_info_nav span{    display: inline-block;    width: auto;    min-width: 98px;    padding: 0 25px;    height: 46px;    line-height: 46px;    text-align: center;}
.pro_info_nav span.on{    color: #fff;    background-color: #4d4398;    border-bottom: 1px solid #4d4398;}
.pro_cont_t{ padding: 20PX 0; display: none;}
.pro_cont_t table{ width: 100%; }


@media screen and (max-width: 768px) {

	.pro_nei_left{ width: 100% }
	.pro_nei_right{ width: 100% }
	.pro_right_top{ width: 100% }
	.pro_right_pro{ width: 100% }
.pro_top .mySwiper {        height: 70px!important;        box-sizing: border-box;        padding: 10px 0;      }
.pro_top .swiper.mySwiper{ height: 70px!important; }
	.pro_right_pro a{ width: calc(100% ); margin: 0 20px 20px 0; float: left; }
	.pro_right_pro a:nth-child(1n){ margin: 0 0 00px 0; }
		.pro_top {    padding: 50px 0 0;    width: 100%;    display: block;  }

		.pro_nei_right2.on{ position:relative; width: 100%; }
		.pro_nei_right2.bottom{ position: relative;}
.pro_nei{ margin: 0 auto 50px;  }
	.pro_top .w1200{ flex-wrap: wrap;}
	.pro_top .pro_r{ width: 100%;}
	.pro_top .pro_l{ width: 100%; margin: 0 0 20px; height: auto;         padding: 0;}
	.pro_top .pro_l .swiper-button-next, .pro_top .pro_l .swiper-button-prev{ height: 50px;}
	.pro_top .pro_l .swiper-button-next::before {      line-height: 50px;}
	.pro_top .pro_l .swiper-button-prev::before {      line-height: 50px;}
}

.i_pro2 { margin: 50px 0 90PX; }
.i_pro2 .pro2_w{ width: 100%;  border-top: 1px solid #ccc; padding: 30px 0 0;}
.i_pro2 h2{  color: #Fff; background:#4d4398 ; font-size: 16px;  display: table; line-height: 32px; padding: 0 20px;  }
.i_pro2 .pro2_w a{ display: block; margin: 0 20px 20px 0 ; border: 1px solid #eee; transition: all .2s; width: calc((100% - 80px) / 5);  box-shadow: 1px 2px 8px 1px rgba(0,0,0,.22); position: relative;  float: left;}
.i_pro2 .pro2_w a:nth-child(5n){ margin: 0 0px 20px 0 ; }
.i_pro2 .pro2_w a .ico{}
.i_pro2 .pro2_w a .ico img{ width: 100%; }
.i_pro2 .pro2_w a .txt{  position: absolute; bottom:0; width: 100%; }
.i_pro2 .pro2_w a .txt h3{    color: #fff;    font-weight: 600;    font-size: 14px; text-align: center; line-height: 36px; padding: 0 10px;  background: #999; }
.i_pro2 .pro2_w a:hover {    opacity: .94;    text-decoration: none;   }
.i_pro2 .pro2_w a:hover .txt h3{background: #4d4398; color: #fff; } 
@media screen and (max-width: 1024px) {
	.i_pro2  h2{ font-size: 24px;}
	.i_pro2  p{ font-size: 12 px;}
	.i_pro2 .pro2_w a{ width: calc((100% - 20px) / 2); }
	.i_pro2 .pro2_w a:nth-child(2n){ margin: 0 0px 20px 0 ; }
	.i_pro2 .pro2_w a:nth-child(2n+1){ margin: 0 20px 20px 0 ; }
	.i_pro2 .pro2_w a .txt h3{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block; font-size: 12px; line-height: 24px;}
}

.news_list{ padding: 50px 0; }
.news_li{ padding: 20px; margin: 20px 0 0; border-bottom: 2px solid #eee; }
.news_li a{ display: flex; width: 100%; }
.news_li:hover{ box-shadow: 0 8px 16px rgba(32,32,32,.15)!important;}
.news_li .ico{ width: 30%; }
.news_li .txt{ width: 65%; padding: 0 20px;}
.news_li .txt h3{ font-size: 18px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block;}
.news_li .txt em{ line-height: 36px; margin: 30px 0 10px; display: block;}
.news_li .txt p{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;line-height: 24px; }
@media screen and (max-width: 768px) {

}


.news_cont{ margin: 50px 0; }
.news_cont .w1200{ padding: 50px; border:1px solid #eee;}
.news_cont .w1200 h2{ color: rgba(0,0,0,1); font-weight: bold !important; line-height: 1.5; text-align: center; padding-bottom: 0px; width: 96%; border-bottom: 1px solid rgba(0,0,0,0.2); line-height: 48px; padding: 0 0 30px}
.news_tt{ padding:50px 40px; }


@media screen and (max-width: 768px) {
	.news_cont .w1200{ padding:20px; }
	.news_tt{ padding:20px 0px; }
	.news_cont .w1200 h2{ font-size: 18px;}
}


.case_list {padding: 50px 0 0}
.case_list .w1200{ display: flex;     flex-wrap: wrap;    justify-content: flex-start; }
.case_list .w1200 a{ display: block; margin: 0 20px 20px 0 ; border: 1px solid #eee; transition: all .2s; width: calc((100% - 40px) / 3);}
.case_list .w1200 a:nth-child(3n){ margin: 0 0px 20px 0 ; }
.case_list .w1200 a .ico{}
.case_list .w1200 a .txt{ padding: 10px 20px; }
.case_list .w1200 a .txt h3{    color: #333;    font-weight: 600;    font-size: 16px; text-align: left; line-height: 48px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;    display: block; }
.case_list .w1200 a .txt p{ color: #333; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.case_list .w1200 a .txt span{ display: table; margin: 20px 0 10px;}
.case_list .w1200 a:hover {    opacity: .94;    text-decoration: none;    box-shadow: 1px 2px 8px 1px rgba(0,0,0,.22); }
.case_list .w1200 a:hover .txt h3{ color: #4d4398; } 

@media screen and (max-width: 768px) {
	.case_list .w1200 a{ width: 100%; margin: 0 0 20px; }

}


.contact{ background: #f6f4f4; }
.contact .w1200{ display: flex;     justify-content: space-between;}
.contact_l{ width: 49%; padding: 50px 0 0; }
.contact_l h3{    line-height: 1.5;    font-size: 34px;    color: #4d4398;    font-weight: bold; padding: 0 0 18px; border-bottom: 1px solid #eeeeee; margin: 0 0 30px;}
.cont_tel{  }
.contact_l .cont{ padding: 0px 0 16px 70px; border-bottom: 1px solid #eeeeee; margin: 24px 0 0; width: 50%; }
.contact_l .cont span{    line-height: 2;    color: rgba(153,153,153,1);    font-size: 14px;    font-weight: normal;}

.contact_r{ width: 50%; }

@media screen and (max-width: 768px) {
	.contact .w1200{ flex-wrap: wrap; }
	.contact_l{ width: 100%; margin: 40px 0; }
	.contact_r{ width: 100%; }
	.contact_l .cont2{ width: 100%; }
	.contact_l .cont3{ width: 100%; }
	.contact_l .cont4{ width: 100%; }
	.contact_l .cont5{ width: 100%; }
}


.i_ly{    min-height: 300px;    padding:90px 0 80px; position: relative; background: #fff;}
.i_ly h2{  font-weight: bold; line-height: 48px; font-size: 48px; color: #4d4398; text-align: center;}
.i_ly h2 span{     color: #333; margin: 0 10px 0 0; } 
.i_ly form{}
.i_ly .int{ display: flex; justify-content: space-between; margin: 50px 0 50px; }
.i_ly input{ background:#fff url( ../img/int.jpg);   width: 31%;   line-height: 38px;    padding: 5px !important;    box-shadow: 0 0 15px 0 rgb(0 0 0 / 52%); border: none;}
.i_ly textarea{    line-height: 38px;    background-image: url( ../img/int.jpg);    padding: 5px !important;    background-color: rgba(255,255,255,1) !important;    box-shadow: 0 0 15px 0 rgb(0 0 0 / 52%);    display: block;    width: 100%;    height: auto !important;    line-height: 160%;    color: #666 !important;    background-color: #f5f5f5 !important;    border: 1px solid #eee !important;}
.i_ly button{     display: table;    position: relative;    overflow: hidden; margin: 50px auto 20PX;  display: table; color: #fff; padding: 15px 100px 15px 28px; font-weight: bold; background: #4d4398 url( ../img/jt.png) no-repeat 80% center; font-size: 16px; border: none; }
.i_ly button:before {    content: "";    position: absolute;    display: block;    transition: all .6s;    width: 100%;    height: 0;    border-radius: 50%;    left: 50%;    top: 50%;    padding-top: 100%;    transform: translateX(-50%) translateY(-50%);}
.i_ly button:hover:before {    animation: style1 .75s;    z-index: 1;}
.i_ly button::after {    content: "";    position: absolute;    width: 0;    height: 100%;    transition: all .3s;    z-index: 0;    opacity: 0;    top: 0;    left: 0px;}
.i_ly button:hover {    background-color: rgba(51,51,51,1);    font-size: 16px;  }
.i_ly button:hover::after {    opacity: 1;}


@media screen and (max-width: 768px) {
	.i_ly{ padding: 40px 0 30px;}
	.i_ly h2{ font-size: 28px; margin:  0 0 00px; }
	.i_ly .int{ display: flex;    margin: 10px 0 10px;    flex-wrap: wrap;    justify-content: space-between;}
	.i_ly input { width: 100%; margin: 10px 0 10px; }
}


.ser1 {padding: 50px 0 ; }
.ser_ul{ }
.ser_li{ display: flex;    justify-content: space-between; margin: 0 0 50px; }
.ser_ul .ico{ width: 48%; }
.ser_ul .txt{ width: 48%; }
.ser_ul .txt h3{ font-size:24px; line-height: 48px; margin: 0 0 30px;  }
.ser_ul .txt p{ font-size: 16px; color: #333;   line-height: 32px; }
@media screen and (max-width: 768px) {
	.ser_li{flex-wrap: wrap;}
	.ser_ul .ico{ width: 100%; }
.ser_ul .txt{ width: 100%; }
	.ser_ul .txt h3{margin: 0 0 10px;}
}




#imgbox-loading {position: absolute;top: 0;left: 0;background: url('../img/imgbox-spinner.gif') center center no-repeat;cursor: pointer;display: none;z-index: 99;}
#imgbox-loading div {background: #FFF;width: 100%;height : 100%;}
#imgbox-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #000;display: none;z-index:30;}
.imgbox-wrap {position: absolute;top: 0;left: 0;background: #FFF;display: none;z-index:199;}
.imgbox-img {padding: 0;margin: 0;border: none;width: 100%;height: 100%;vertical-align: top;}
.imgbox-close {position: absolute;top: -15px;right: -15px;height: 30px;width: 30px;background: url('../img/imgbox-close.png') top left no-repeat;cursor: pointer;outline: none;}
.imgbox-title {padding-top: 10px;font-size: 11px;text-align: center;font-family: Arial;color: #333;display: none;}
.imgbox-bg-wrap {position: absolute;padding: 0;margin: 0;display: none;}
.imgbox-bg {position: absolute;width: 20px;height: 20px;}
.imgbox-bg-n {left: 0;top: -20px;width: 100%;background: url(../img/imgbox-bg-n.png) repeat-x;}
.imgbox-bg-ne {right: -20px;top: -20px;background: url(../img/imgbox-bg-ne.png) no-repeat;}
.imgbox-bg-e {right: -20px;top: 0;height: 100%;background: url(../img/imgbox-bg-e.png) repeat-y;}
.imgbox-bg-se {right: -20px;bottom: -20px;background: url(../img/imgbox-bg-se.png) no-repeat;}
.imgbox-bg-s {left: 0;bottom: -20px;width: 100%;background: url(../img/imgbox-bg-s.png) repeat-x;}
.imgbox-bg-sw {left: -20px;bottom: -20px;background: url(../img/imgbox-bg-sw.png) no-repeat;}
.imgbox-bg-w {left: -20px;top: 0;height: 100%;background: url(../img/imgbox-bg-w.png) repeat-y;}
.imgbox-bg-nw {left: -20px;top: -20px;background: url(../img/imgbox-bg-nw.png) no-repeat;}









