@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: '华文细黑';
  src: url('../font/STXIHEI.TTF') format("truetype");
  font-display: swap;
}
html{font-size:1px;}
@media screen and (max-width: 1920px) {
  html {
    font-size: 0.05208333333vw;
  }
}

body {
	margin:0;
	padding:0;
	font-family: "华文细黑", "Montserrat", "微软雅黑", Arial;
	font-size:14px;
	line-height:1.5;
	color:#000;
	max-width:1920px;
	width: 100%;
	margin:0px auto;
	background-color:#fff;
	overflow-x: hidden;
}
a {
	color:#000;
	text-decoration:none;
}
a:hover {
	color:#000;
}
img {
	border:0;
	display:inline;
	vertical-align: bottom;
	width:auto;
	height:auto;
	max-width:100%;
}
div, ul, li, dl, dd, span, h1, h2, p, h4, h3 {
	margin:0;
	padding:0;
	list-style:none;
}
.clear {
	clear:both; width:0px; height:0px;
}
.container {
	width: 94%;
	max-width:1600px;
	margin:0px auto;
	height:auto;

}

* {
	box-sizing: border-box;
}

.flex-between {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}
.flex-center-y {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.flex-center{
	display: flex;
	align-items: center;
	justify-content: center;
}
.flex-column {
	display: flex;
	flex-direction: column;
  }
  :root{
	--linkColor:#6861bc;
   
  }
.flex_1{flex:1;}
.grid{ display: grid;}

.ellipsis{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;-webkit-text-overflow:ellipsis;}
.molEllipsis{ display:-webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp:1;-webkit-box-orient:vertical; overflow:hidden;text-overflow:ellipsis;-webkit-text-overflow:ellipsis;}
   
/* 首页 */
.head_1{ background-color: #1f1f1f; color: #fff; font-size: 20rem; line-height: 60rem;}
.head_1 .container{ max-width: 1670px; margin: 0px auto; width: 92%;}
.head_1 .txt{ color: #575757; font-style: italic; letter-spacing: 8px; font-size: 22rem;}
.head_1 .tpleft{  position: relative; padding-right: 154rem;z-index: 10;}
.head_1 .tpleft:before{content: "";background: linear-gradient( 
135deg,rgb( 104,97,188 ) 0%,rgb( 104,97,188 ) 100% );transform: skew(25deg); position: absolute; left: 0px; top: 0px; height: 100%; width: 100%; border-right: 5rem #fff solid;}
.head_1 .tpleft .iconfont{ font-size: 16rem;}
.head_1 .tpleft .tel{gap: 6px; position: relative; z-index: 10;}
.head_1 .tpleft:after{ content: ""; position: absolute;width: 2000px; height: 100%;right:calc(100% - 80px); background-color: var(--linkColor); z-index: 0; top: 0px;}
.head_2{ background-color: #fff; padding: 38rem 0rem; position: sticky; width: 100%; top: 0px; z-index: 100000;box-shadow: 0px 0px 8px rgb(0 0 0 / 18%); }
.head_2 .logo img{ height: 56rem; width: auto;display: block;}
.head_2 .tpright .menu ul li{ margin-left: 34rem;}
.head_2 .tpright .menu ul li a{ font-size: 22rem; font-weight: 600; color: #081528;}
.head_2 .tpright .get{ background-color: var(--linkColor); color: #fff;font-size: 22rem; font-weight: 600; border-radius: 5px; padding: 0rem 44rem; line-height: 68rem; margin-left: 59rem; display: inline-block;}
.head_2 .tpright .get:hover{background-color: #5049a7;}
.head_2 .tpright .menu ul li a:hover{ color: var(--linkColor);}
.banner ul li{ position: relative; text-align: center;}
.banner ul li img{object-fit: cover;
 object-position: top center; min-height: 220px;width: 100%; height: auto;
}
.banner ul li .container{ max-width: 1670px; margin: 0px auto; width: 92%; position: absolute; left: 50%; top: 50%;transform: translate(-50%,-50%);}
.banner ul li .content { max-width: 661rem;}
.banner ul li .content .desc{ color: #fff;  font-size: 23rem; line-height: 2.5;text-align: left; margin-top: 42rem;}
.banner ul li .content .icon{ margin-bottom: 33rem;}
.banner ul li .content .icon img{ height: 89rem; width: auto; min-height: auto;}
.banner ul li .content .more{ width: 219rem; height: 69rem; background-color: var(--linkColor); color: #fff; font-size: 22rem; border-radius: 5px; margin-top: 42rem;gap: 15rem;}
.banner ul li .content .more .iconfont{ font-size: 18rem;transition: all .3s ease;-webkit-transition: all .3s ease;}
.banner ul li .content .more:hover .iconfont{ margin-left: 10px;}
.part_1{ padding-top: 98px; padding-bottom: 118px;}
.part_1 .container{ align-items: flex-start;gap: 62rem;}
.part_1 .container .tpleft{ width: 36%; align-items: flex-start;gap: 30rem;}
.part_1 .container .tpleft .pic{ flex:1; position: relative; padding-left: 20rem; padding-top: 20rem;}
.part_1 .container .tpleft .pic .img{ width: 100%; position: relative; z-index: 5;}
.part_1 .container .tpleft .pic .img img{ width: 100%; border-radius: 10px 0px 0px 0px;}
.part_1 .container .tpleft .txt{color: #e6e7e9;text-transform: uppercase;writing-mode: vertical-rl;
            text-orientation: mixed;width: 56px; font-size: 66rem; font-weight: 600; letter-spacing: 2px;transform: rotate(180deg); margin-top: 58rem;}
.part_1 .container .tpleft .pic:before{ content: ""; position: absolute; left: 0px; top: 0px; width:calc(100% - 35rem); height:calc(100% - 35rem); background-color: #e1dff2;border-radius: 10px 0px 0px 0px;}
.part_1 .container .tpleft .pic .img .watch{position: absolute; right: 0px; display: flex; flex-direction: column; background-color: var(--linkColor); color: #fff; top: 50%;transform:translateY(-50%);-webkit-transform:translateY(-50%); gap: 5px; border-radius: 5px 0px 0px 5px; padding: 24rem 16rem;align-items: center;}
.part_1 .container .tpleft .pic .img .watch .tit{writing-mode: vertical-rl;
            text-orientation: mixed;transform: rotate(180deg); font-size: 20rem; font-weight: 600; letter-spacing: 2px;}
.part_1 .container .tpleft .pic .img .watch .iconfont{color: #fff; font-size: 14px;}
.part_1 .container .box{ flex:1; overflow: hidden; padding-right: 90rem;}
.part_1 .container .box .title{ color: #6401c7; font-size: 48rem; line-height: 1.3; margin-bottom: 45rem;}
.part_1 .container .box .desc{ font-size: 21rem; line-height: 2;}
.part_1 .container .box .infor{ margin-top: 35rem;gap: 27rem;}

.part_1 .container .box .infor .more{ width: 240rem; height: 61rem; background-color: var(--linkColor); color: #fff; font-size: 20rem; border-radius: 5px;gap: 15rem; font-weight: 600;}
.part_1 .container .box .infor .more .iconfont{ font-size: 18rem;transition: all .3s ease;-webkit-transition: all .3s ease;}
.part_1 .container .box .infor .more:hover .iconfont{ margin-left: 10px;}
.part_1 .container .box .infor .lab{ font-size: 25rem;}
.part_2{ background-image: url(../images/webbg.jpg); background-position: top center; background-size: 100%;background-repeat: no-repeat; padding-top: 94px;}
.main_bt{ text-align: center; margin-bottom: 45rem;}
.main_bt .icon img{ height: 121rem; width: auto;}
.main_bt .title{ font-size: 45rem; font-weight: 600;text-transform: uppercase; color: #fff;}
.pro_box{ background-color: #fff; padding: 56rem 76rem 70rem;}
.pro_list ul{display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 122rem;
align-items: stretch;}
.pro_list ul li .photo a{position:relative; display:block; padding-top:59.5%; width:100%; overflow:hidden; border: 2px #e5e5e5 solid;}
.pro_list ul li .photo a img{ width:100%; height:100%; position:absolute; top:0px; left:0px;object-fit: cover;
 object-position: center center;transition:all .5s;-webkit-transition:all .5s;}
.pro_list ul li .photo a:hover img{transform:scale(1.05);-webkit-transform:scale(1.05);}
.pro_list ul li .photo .txt{ position: absolute; left: 0px; text-align: center; width: 100%; font-size: 36rem; font-weight: 600;text-transform: uppercase; color: #ff6a00;bottom: 0px; z-index: 5; font-style: italic;}
.pro_list ul li .desc{ margin: 15px 0px; font-size: 21rem; line-height: 1.7;}
.pro_list ul li .more{ text-align: center;}
.pro_list ul li .more a{ display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 22rem; gap: 10px;}
.pro_list ul li .more a .iconfont{ font-size: 18rem;transition: all .3s ease;-webkit-transition: all .3s ease;}
.pro_list ul li .more a:hover{ color: var(--linkColor);}
.pro_list ul li .more a:hover .iconfont{ margin-left: 5px;}
.ahead_txt{ text-align: center; font-size: 45rem; font-style:italic; letter-spacing: 3px; margin-bottom: 15px; line-height: 1;}
footer .copyright{ background-color: #111111; padding: 10px 0px; color: #fff;text-align: center; font-size: 18rem;}
footer .copyright a{color: #fff;}
footer .copyright .org{color: #fb9146;}
footer .foot_1{background-image: url(../images/webpsd_25.jpg);color: rgba(255,255,255,0.5); padding-top: 95px; padding-bottom: 40px;}
footer .foot_1 .container{align-items: flex-start;gap: 78rem;}
footer .foot_1 .dblogo{ width: 397rem;}
footer .foot_1 .box{ flex:1; overflow: hidden;}
footer .foot_1 .box .title{text-align: center; font-size: 48rem;text-transform: uppercase; line-height: 1; margin-bottom: 33rem;}
footer .foot_1 .box .desc{ font-size: 30rem; margin-bottom: 30rem;}
footer .foot_1 .box .list li{ display: flex; align-items: center;gap: 10px; font-size: 18rem; margin-bottom: 12px;}
footer .foot_1 .box .list li .lab{ flex:1;}
footer .foot_1 .box .list li .iconfont{width: 40rem; height: 40rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: #fe9347; color: #fff; font-size: 22rem;}
footer .foot_1 .box .list li .lab .txt{ color: #fff; margin-right: 5px;}
footer .foot_1 .box .list li:last-child{ margin-bottom: 0px;}
footer .foot_1 .box .list li .icon-youxiang1{ font-size: 16rem;}
footer .foot_1 .box .list li .icon-wangzhi{ font-size: 28rem;}

.gotop{cursor: pointer;
    height: 68rem;
    width: 68rem;
    border-radius: 5px; font-size: 23px;
 background-color: #fe9347; color: #fff;
    transition: all .4s ease; position: fixed; right: 1%; bottom: 10%; z-index: 10000; overflow: hidden;transition: all .3s ease;-webkit-transition: all .3s ease;}
.gotop .iconfont{ font-size: 14px;}
html.active{ height:100%; overflow:hidden;}
/*移动菜单*/
.menubtn {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 26px;
	height: 40px;
	right: 0px;
	z-index: 100;
	display: none;
	position: relative;
	margin-left: 15px;

}

.menubtn .name {
	font-size: 16px;
	left: -60px;
	font-weight: 500;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	position: absolute;
	font-weight: 600;
}

.menubtn .navbar-icons {
	height: 20px;
	width: 100%;
	position: relative;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	transition: .5s ease-in-out;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	cursor: pointer;
}

.menubtn .navbar-icons span {
	display: block;
	height: 2px;
	width: 100%;
	opacity: 1;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	transition: .25s ease-in-out;
	top: 0;
	-webkit-transform-origin: left center;
	transform-origin: left center;
	background-color: #333;
	position: relative;
	border-radius: 5px;
}

.menubtn .navbar-icons span:first-child {
	-webkit-transform-origin: left center;
	transform-origin: left center;
}

.menubtn .navbar-icons span:nth-child(2) {
	-webkit-transform-origin: left center;
	transform-origin: left center;
	width: 70%;
}

.menubtn .navbar-icons span:nth-child(3) {
	-webkit-transform-origin: left center;
	transform-origin: left center;
}

.menubtn.open .navbar-icons span:first-child {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 1px;
}

.menubtn.open .navbar-icons span:nth-child(2) {
	opacity: 0;
}

.menubtn.open .navbar-icons span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	top: 1px;
}

.menu-mc {
	position: fixed;
	overflow: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: var(--linkColor);
	z-index: 500;
	transition: all .5s;
	-webkit-transition: all .5s;
	transform: translateY(-100%);
	-webkit-transform: translateY(-100%);
	padding-top: 85px;
	display: flex;
	flex-direction: column;
	display: none;

}

.menu-mc.active {
	transform: translateY(0);
	-webkit-transform: translateY(0);
}

.menu-mc .list {
	flex: 1;
	overflow: auto;
}

.menu-mc .list ul {
	padding: 0 24px;
}

.menu-mc .list ul li {
	line-height: 60px;
}

.menu-mc .list ul li .submenu {
	display: none;
}

.menu-mc .list ul li .title {
	border-bottom: 1px solid rgba(255, 255, 255, .19);
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: 600;
	color: #fff;
}



.menu-mc .list ul li a {
	display: block;
	font-size: 14px;
	color: #fff;
}
.swiper-pagination-bullet{ background-color: #fff;}
.swiper-pagination-bullet-active{ background-color: var(--linkColor);}

@media (max-width:768px){
	.menubtn,
	.menu-mc {
		display: flex;
	}

.head_1{ font-size: 12px; line-height: 30px;}
.head_1 .txt{ font-size: 12px; letter-spacing: 1px;}
.head_1 .tpleft .iconfont{ font-size: 10px;}
.head_2 .logo img{ height: 15px;}
.head_2{ padding: 8px 0px;}
.head_2 .tpright .menu{ display: none;}
.head_2 .tpright .get{ font-size: 12px; line-height: 30px; padding: 0px 15px;}
.banner ul li .content{ max-width: 100%;}
.banner ul li .content .icon{ text-align: left; margin-bottom: 15px;}
.banner ul li .content .desc{ font-size: 12px; line-height: 1.5;display:-webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp:4;-webkit-box-orient:vertical; overflow:hidden;text-overflow:ellipsis;-webkit-text-overflow:ellipsis;}
.banner ul li .content .icon img{ height: 25px;}
.banner ul li .content .more{ font-size: 14px; width: 110px; height: 35px;gap: 6px; margin-top: 13px;}
.banner ul li .content .more .iconfont{ font-size: 10px;}
.part_1{ padding-top: 40px; padding-bottom: 40px;}
.part_1 .container{flex-wrap: wrap; gap: 25px;}
.part_1 .container .tpleft{ width: 100%;}
.part_1 .container .box{ flex:none;width: 100%; padding-right: 0px;}
.part_1 .container .tpleft .txt{ font-size: 20px;}
.part_1 .container .tpleft .pic{ padding-top: 15px; padding-left: 15px;}
.part_1 .container .tpleft .pic:before{    width: calc(100% - 30px);
    height: calc(100% - 30px);}
.part_1 .container .tpleft .pic .img .watch .tit{ font-size: 14px;}
.part_1 .container .tpleft .pic .img .watch{ padding: 8px 5px;}
.part_1 .container .box .title{ font-size: 20px; margin-bottom: 15px;}
.part_1 .container .box .desc{ font-size: 14px; line-height: 1.7;}
.part_1 .container .box .infor{ gap: 12px; margin-top:20px;}
.part_1 .container .box .infor .lab{ font-size: 15px;}
.part_1 .container .box .infor .more{ font-size: 14px; width: 140px; height: 35px;gap: 6px;}
.part_1 .container .box .infor .more .iconfont{ font-size: 10px;}
.part_2{ padding-top: 40px;}
.main_bt .title{ font-size: 14px;}
.pro_list ul li .photo .txt{ font-size: 14px;}
.pro_list ul{ }
.pro_list ul li .desc{ font-size: 12px;}
.pro_list ul li .more a{font-size: 14px;}
.pro_list ul li .more a .iconfont{ font-size: 12px;}
.gotop{ width: 30px; height: 30px;}
.gotop .iconfont{ font-size: 12px;}
.pro_box{ padding: 20px 15px;}
.main_bt{ margin-bottom: 20px;}
.ahead_txt{ font-size: 18px; margin-bottom: 8px;}
footer .foot_1{ padding: 30px 0px;}
footer .foot_1 .box .title{ font-size: 18px;}
footer .foot_1 .box .desc{ font-size: 12px; margin-bottom: 15px;}
footer .foot_1 .box .list li{ font-size: 12px;}
footer .foot_1 .box .list li .iconfont{ width: 17px; height: 17px; font-size: 10px;}
footer .foot_1 .box .list li .icon-youxiang1{ font-size: 6px;}
footer .copyright{ font-size: 12px;}
.part_1 .container{flex-direction: column-reverse;}
.head_1{display: none;}
}

@media (max-width:450px){
.pro_list ul{grid-template-columns: repeat(1, 1fr);}	
footer .foot_1 .container{ flex-direction: column;}
footer .foot_1 .dblogo{ max-width: 0px auto; width: 100%; text-align: center;}
footer .foot_1 .dblogo img{ height: 57px; width: auto;}
}