.customBrandBar { background: #f4f7fb; }
.customBrandBar .customDpwBar { }
.customBrandBar .customCap { font-size: 42px; font-family: Arial, sans-serif; font-weight: normal; color: #1A1A1A; line-height: 51px; letter-spacing: 1px; padding-top: 100px; }
.customBrandBar .customCap em { color: #ffaa17; }
.customBrandBar .customInfo { font-size: 16px; font-family: Arial, sans-serif; font-weight: normal; color: #333333; line-height: 30px; padding: 22px 0 50px 0; }
.customBrandBar .customGroup { }
.customBrandBar .customGroupLi { width: 17.71%; position: relative; overflow: hidden; cursor: pointer; height: calc(600 * 100vw / 1920); }
.customBrandBar .customLayer { position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.3); }
.customBrandBar .customGroupLiImg { width: 100%; height: 100%; }
.customBrandBar .customGroupLiImg img { width: 100%; height: 100%; object-fit: cover; }
.customBrandBar .customGroupLiTxt { font-size: 16px; font-family: Arial, sans-serif; font-weight: normal; color: #ccc; line-height: 30px; padding: 50px 30px 40px 30px; position: absolute; left: 0; right: 0; bottom: 0; }
.customBrandBar .customGroupLiTxt div { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.customBrandBar .customGroupLiTxt img { max-width: 100%; margin-bottom: 24px; }
.customBrandBar .customGroupLi.hover { width: 46.87%; }
.customBrandBar .customGroupLi.hover .customLayer { opacity: 0; }
.customBrandBar .customGroupLi.hover .customGroupLiTxt { max-width: 100%; color: #fff; }
.customBrandBar .customGroupLi.hover .customGroupLiTxt div { -webkit-line-clamp: 15; }
.customBrandBar .customGroupLi:nth-child(1).hover .customGroupLiTxt { background: #ffaa17; }
.customBrandBar .customGroupLi:nth-child(2).hover .customGroupLiTxt { background: #231815; }
.customBrandBar .customGroupLi:nth-child(3).hover .customGroupLiTxt { background: #3f3a3b; }
.customBrandBar .customGroupLi:nth-child(4).hover .customGroupLiTxt { background: #ffaa17; }
.customBrandBar .customGroupLi:nth-child(5).hover .customGroupLiTxt { background: #ffaa17; }
.customBrandBar .customGroupLi.hover .customGroupLiTxt { left: auto; width: 440px; border-top-left-radius: 38px; animation: customGroupLiTxtAni 0.5s 0s ease-in-out both; padding: 50px 40px 40px 40px; }
.customBrandBar .customGroup[count="1"] .customGroupLi { width: 100%; }
.customBrandBar .customGroup[count="1"] .customGroupLi.hover { width: 100%; }
.customBrandBar .customGroup[count="2"] .customGroupLi { width: 40%; }
.customBrandBar .customGroup[count="2"] .customGroupLi.hover { width: 60%; }
.customBrandBar .customGroup[count="3"] .customGroupLi { width: 24%; }
.customBrandBar .customGroup[count="3"] .customGroupLi.hover { width: 52%; }
.customBrandBar .customGroup[count="4"] .customGroupLi { width: 17.71%; }
.customBrandBar .customGroup[count="4"] .customGroupLi.hover { width: 46.87%; }
.customBrandBar .customGroup[count="5"] .customGroupLi { width: 15%; }
.customBrandBar .customGroup[count="5"] .customGroupLi.hover { width: 40%; }
@keyframes customGroupLiTxtAni {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

/* PC兼容 */
@media screen and (min-width:769px) and (max-width:1500px) {
	.customBrandBar .customCap { padding-top: 70px; font-size: 40px; }
	.customBrandBar .customInfo { padding: 22px 0 50px 0; font-size: 15px; }
	.customBrandBar .customGroupLiTxt { font-size: 14px; padding: 40px 20px 30px 20px; line-height: 26px; }
	.customBrandBar .customGroupLi.hover .customGroupLiTxt { padding: 40px 30px 30px 30px; }
}
@media screen and (min-width:769px) and (max-width:1200px) {
	.customBrandBar .customGroupLiTxt { font-size: 12px; padding: 30px 20px 20px 20px; line-height: 20px; }
	.customBrandBar .customGroupLi.hover .customGroupLiTxt { padding: 30px 30px 20px 30px; }
}
@media screen and (min-width:769px) and (max-width:1000px) {
	.customBrandBar .customCap { padding-top: 40px; font-size: 36px; }
	.customBrandBar .customInfo { padding: 10px 0 30px 0; font-size: 13px; }
}

/* H5兼容 */
@media screen and (max-width:768px) {
	.customBrandBar { padding: 0 16px 32px 16px; }
	.customBrandBar .customCap { font-size: 20px; font-family: Arial, sans-serif; font-weight: normal; color: #1A1A1A; line-height: 24px; letter-spacing: 1px; padding-top: 40px; }
	.customBrandBar .customInfo { font-size: 12px; font-family: Arial, sans-serif; font-weight: normal; color: #6c6c6c; line-height: 18px; padding: 12px 0 20px 0; }
	.customBrandBar .customGroup { display: block; display: -webkit-box; display: box; display: -webkit-flex; display: flex; }
	.customBrandBar .customGroupLi { width: 100% !important; height: 70px; margin-bottom: 8px; border-radius: 12px; }
	.customBrandBar .customGroupLiImg { filter: blur(3px); }
	.customBrandBar .customGroupLiTxt { padding: 0 20px; top: 0; background: rgba(0, 0, 0, 0.2); text-align: left; display: -webkit-box; display: box; display: -webkit-flex; display: flex; -webkit-box-align: center; box-align: center; -webkit-align-items: center; align-items: center; font-size: 13px; font-family: Arial, sans-serif; font-weight: normal; color: #FFFFFF; line-height: 20px; }
	.customBrandBar .customGroupLiTxt img { margin-bottom: 0; height: 18px; }
	.customBrandBar .customGroupLi:nth-child(4) .customGroupLiTxt img { height: 32px; }
	.customBrandBar .customGroupLiTxt div { display: none; padding: 12px 0 16px 0; }
	.customBrandBar .customGroupLiTxt em { display: block; }
	.customBrandBar .customGroupLi.hover { width: 100%; height: calc(344 * 343px / 343); }
	.customBrandBar .customGroupLi.hover .customGroupLiImg { filter: none; }
	.customBrandBar .customGroupLi.hover .customGroupLiTxt { width: 100%; background: transparent !important; padding: 0 20px; display: block; top: auto; }
	.customBrandBar .customGroupLi.hover .customGroupLiTxt div { display: block; }
	.customBrandBar .customGroupLi.hover .customGroupLiTxt em { top: 2px; margin-top: 0; }
	.customBrandBar .customGroupLi:nth-child(4).hover .customGroupLiTxt em { top: 9px; margin-top: 0; }
}
img {
	-webkit-touch-callout: none;
	/* iOS Safari */
	-webkit-user-select: none;
	/* Chrome/Safari/Opera */
	-khtml-user-select: none;
	/* Konqueror */
	-moz-user-select: none;
	/* Firefox */
	-ms-user-select: none;
	/* Internet Explorer/Edge */
	user-select: none;
	/* Non-prefixed version, currently
	// not supported by any browser */
}
.customFlex, .customFlex-o { flex: 1; -webkit-flex: 1; box-flex: 1; -webkit-box-flex: 1; }
/* .df.cf>.flex, .df.cf>.flex-o{ flex: 1 0 auto; -webkit-flex: 1 0 auto; box-flex: 1 0 auto; -webkit-box-flex: 1 0 auto; } */
/* .flex>span, .flex-o>span, .flex>em, .flex-o>em, .flex>b, .flex-o>b{ display: block; } */
.customFlex-o { overflow: hidden; }
.customDf { display: -webkit-box; display: box; display: -webkit-flex; display: flex; }

[trans]{ transition: all 0.3s ease-out; }
[trans2]{ transition: all 0.6s ease-out; }

/* PC兼容 */
@media screen and (min-width:1921px) {
	/* .dpwBar { width: 90%; } */
	.customDpwBar[maxScreen] { width: 90%; }
}
@media screen and (min-width:769px) and (max-width:2200px) {
	/* .dpwBar { width: 100%; padding-left: 30px; padding-right: 30px; } */
	.customDpwBar { width: 100%; padding-left: 60px; padding-right: 60px; }
}

/* H5兼容 */
@media screen and (max-width:768px) {
	.customDpwBar { width: 100%; overflow: hidden; }
}

.flex, .flex-o { flex: 1; -webkit-flex: 1; box-flex: 1; -webkit-box-flex: 1; }
/* .df.cf>.flex, .df.cf>.flex-o{ flex: 1 0 auto; -webkit-flex: 1 0 auto; box-flex: 1 0 auto; -webkit-box-flex: 1 0 auto; } */
/* .flex>span, .flex-o>span, .flex>em, .flex-o>em, .flex>b, .flex-o>b{ display: block; } */
.flex-o { overflow: hidden; }
.df { display: -webkit-box; display: box; display: -webkit-flex; display: flex; }
.wao { -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center; }
.wal { -webkit-box-pack: start; box-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; }
.war { -webkit-box-pack: end; box-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; }
.hao { -webkit-box-align: center; box-align: center; -webkit-align-items: center; align-items: center; }
.hal { -webkit-box-align: start; box-align: start; -webkit-align-items: flex-start; align-items: flex-start; }
.har { -webkit-box-align: end; box-align: end; -webkit-align-items: flex-end; align-items: flex-end; }
.bob { box-sizing: border-box; }
.cf { /*-webkit-box-direction:normal; box-direction:normal; */-webkit-box-orient: vertical; box-orient: vertical; -webkit-flex-direction: column; flex-direction: column; }
.jcb { -webkit-box-pack: justify; -webkit-justify-content: space-between; box-pack: justify; justify-content: space-between; }

.ov-d { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ov-2d { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ov-3d { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.ov-4d { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }
.ov-5d { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; }

.clr::after { content: ''; clear: both; height: 0; display: block; }

.introduceBar { position: relative; height: calc((100vh - 94px) + 600px); }
.introduceBar .box { width: 100%; height: calc(100vh - 94px); }
.introduceBar .layer { position: absolute; left: 0; top: 0; bottom: 0; right: 0; z-index: 101; background: url(../img/play.png) center center no-repeat; background-size: 92px auto; cursor: pointer; }
.introduceBar .layer i { background: #f4f7fb; position: absolute; }
.introduceBar .layer i:nth-child(1) { width: 100%; height: calc((100vh - 94px) * 0.4 / 2); left: 0; top: -1px; }
.introduceBar .layer i:nth-child(2) { width: calc(100vw * 0.4 / 2); height: 100%; right: 0; top: 0; }
.introduceBar .layer i:nth-child(3) { width: 100%; height: calc((100vh - 94px) * 0.4 / 2); left: 0; bottom: 0; }
.introduceBar .layer i:nth-child(4) { width: calc(100vw * 0.4 / 2); height: 100%; left: 0; top: 0; }
.introduceBar video { width: 100%; height: 100%; object-fit: cover; }
.introduceBar img { width: 100%; height: 100%; object-fit: cover; display: none; }
.introduceBar.in .box { position: fixed; left: 0; right: 0; top: 94px; z-index: 100; }
.introduceBar.in .layer i:nth-child(even) { width: 0 !important; }
.introduceBar.in .layer i:nth-child(odd) { height: 0 !important; }
.introduceBar.out .box { position: absolute; top: auto; bottom: 0; }
/* .introduceBar { height: calc(500 * 100vw / 375); } */

.indexTitle2{ text-align: center; }
.indexTitle .title1{ font-weight: bold; font-size: 40px; line-height: 40px; text-transform: uppercase; color: #ccc; font-family: Arial Black,Arial}
.indexTitle .title1 span{color: #0075cf;}
.indexTitle .title2{ font-size: 24px; line-height: 24px; color: #1e1e1e; padding-top: 20px; }

.lanbei{
	width: 90%;
    height: 300px;
    background: #0075cf;
    transform: skew(-20deg);
    position: absolute;
    right: -15%;
    top: 230px;
}
/* 桌面设备适配 */
@media (min-width: 992px) {
	.lanbei {
		height: 500px;
		top: 200px;
	}
}
.anli_xiejiao .content {
    position: relative;
    width: 33%;
    float: left;
}
.anli_xiejiao ul {
	list-style-type: none;
}
.anli_xiejiao li{
	position: relative;
    width: 33%;
    float: left;
	top: 30px;
}
/* 桌面设备适配 */
@media (min-width: 992px) {
	.anli_xiejiao li {
		top: 0;
	}
}
.anli_xiejiao li .tu {
    transform: skew(-20deg);
    overflow: hidden;
    height: 260px;
    width: 360px;
}
/* 桌面设备适配 */
@media (min-width: 992px) {
	.anli_xiejiao li .tu {
		height: 560px;
	}
}
.anli_xiejiao li .tu a img {
		transform: skew(20deg);
		transition: all 1s;
		width: 585px !important;
		height: 561px;
		position: absolute;
		left: 50%;
		margin-left: -290px;
		transition: all 0.7s ease-in-out;
	}
.anli_xiejiao .wenzi {
    position: absolute;
    top: 45%;
    text-align: center;
    width: 100%;
    color: #fff;
    font-size: 26px;
}
.anli_xiejiao .wenzi a{
	color: #fff;
}
.anli_xiejiao .wenzi a span {
    display: block;
    font-size: 14px;
    font-weight: normal;
}
.anli_xiejiao .heidi {
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    left: 0px;
    z-index: 999;
    transition: all 0.7s ease-in-out;
}
.anli_xiejiao li:hover .tu a img{
	transform: skew(20deg);
	transition: all 1s;
	width: 585px !important;
	height: 561px;
	position: absolute;
	left: 50%;
	margin-left: -300px;
	transition: all 0.7s ease-in-out;
}
.anli_xiejiao li:hover .heidi {
		background: rgba(0, 102, 153, 0.5);
		position: absolute;
		top: 0px;
		width: 100%;
		height: 100%;
		left: 0px;
		z-index: 999;
		transition: all 0.7s ease-in-out;
	}
.oushili{
	min-height: 220px;
	position: relative;
	padding-left: 20px;
}
/* 桌面设备适配 */
@media (min-width: 992px) {
  .oushili {
    padding-left: 50px;
  }
}
.oushili h3 {
  color: #0075cf;
    font-size: 30px;
    line-height: 48px;
    font-weight: 600;
    letter-spacing: 10px;
    position: relative;
}
.oushili h3:after {
    position: absolute;
    width: 72px;
    height: 3px;
    background: #0075cf;
    content: "";
    left: 200px;
    top: 25px;
}
.oushili b {
    color: #ccc;
    font-family: Arial Black,Arial;
    font-size: 60px;
    line-height: 100px;
    position: absolute;
    right: 0px;
    top: -90px;
}
/* 桌面设备适配 */
@media (min-width: 992px) {
  .oushili b {
    font-size: 80px;
	top: -30px;
  }
}
.oushili b span {
    color: #0075cf;
}
.oushili p {
    /* color: #666; */
    width: 100%;
    padding-top: 13px;
    font-size: 13px;
    line-height: 26px;
}
/* 桌面设备适配 */
@media (min-width: 992px) {
	.oushili p {
		width: 500px;
	}
}
.indexPart2 .wal{ position: relative;}
.wal { max-width: 1440px; margin: 0 auto;}

/* .indexPart2{ padding: 80px 20px 600px 20px; position: relative; z-index: 10;} */
.indexPart2 {
  padding: 100px 20px 380px 20px;
  position: relative;
  z-index: 10;
}
/* 平板设备适配 */
@media (min-width: 768px) {
  .indexPart2 {
    padding: 100px 20px 380px 20px;
  }
}
/* 桌面设备适配 */
@media (min-width: 992px) {
  .indexPart2 {
    padding: 80px 20px 600px 20px;
  }
}
.indexPart2 .indexTitle{ padding-bottom: 80px; }
.indexPart2 .bigBox{ position: relative; padding-bottom: 95px;}
.indexPart2 .mxfDiv{ position: relative; }
.indexPart2 .bigImg img{ width: 100%; }
.indexPart2 .layerDiv{ position: absolute; width: 1200px; left: 50%; margin-left: -600px; top: 150px;}
.indexPart2 .layerDiv .name{ font-size: 30px; color: #fff; text-align: center; height: 60px; position: relative; font-weight: bold;}
.indexPart2 .layerDiv .name:after{ content: ''; width: 40px; height: 40px; background: #fff; position: absolute; left: 50%; bottom: 0px; margin-left: -20px; }
.indexPart2 .layerDiv .content{ font-size: 14px; color: #fff; line-height: 30px; padding: 50px 185px 0; text-align: center; height: 120px; overflow: hidden;}
.indexPart2 .layerDiv .more{ padding-top: 35px; width: 162px; margin: 0 auto; }
.indexPart2 .layerDiv .more a{ font-weight: bold; color: #fff; position: relative; font-size: 12px; display: block; width: 158px; height: 40px; line-height: 40px; border: #fff solid 2px; text-indent: 22px; }
.indexPart2 .layerDiv .more a:after{ content: ''; position: absolute; right: 25px; top: 14px; width: 40px; height: 9px; background: url(../images/nimg40_1.png) no-repeat; background-size: 40px;}
.indexPart2 .tab2{ position: absolute; left: 50%; bottom: 0; width: 17.0rem; margin-left: -85px; height: 210px;}
.indexPart2 .tab2 li{ float: left; width: 20%; height: 210px; background: #fbfbfb; text-align: center;}
.indexPart2 .tab2 .other{ background: #fff; }
.indexPart2 .tab2 li .ico{ padding: 56px 0 18px; }
.indexPart2 .tab2 li .ico img{ width: 40px; }
.indexPart2 .tab2 li .name{ font-weight: bold; font-size: 18px; color: #3f3f3f; }
.indexPart2 .tab2 li .txt{ font-weight: bold; padding-top: 6px; color: #cacaca; text-transform: uppercase; }
.indexPart2 .tab2 .liNow{ background: #0075cf; }
.indexPart2 .tab2 .liNow .name{ color: #fff; }
.indexPart2 .tab2 .liNow .txt{ color: #a3c2e8; }

.fl{float:left;}
.fr{float:right;}
