.maincolor{color:#888;color:#494949;color:#333color：#002971 color：#DDD;color:#F4F4F4;}

.content {padding-top:0;}
@media screen and (max-width: 767px){
    .content {padding-top: 64px;}
}


.column_kv{position: relative;}
.column_kv .swiper-slide{width: 100%;}
.column_kv .kv_con {position: relative;height: calc(100vh - 64px);overflow: hidden;}
.column_kv .kv_con:after{position: absolute; left: 0;top:0; width: 100%; content: ''; height: 192px;z-index: 2;background:linear-gradient(to bottom, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 30%, rgba(238,238,238,0) 100%);}
.column_kv .bg_container {position: absolute; left: 0; top:0; right: 0; bottom:0; z-index: 1;}
.column_kv .video_container{position: absolute; left: 0; top:0; right: 0; bottom:0;overflow: hidden; z-index: 1;}
.column_kv .video_container video{height: 100%;width: calc(1600vh / 9);margin: 0 (50% - 800vh / 9) ;-o-object-fit: cover;object-fit: cover; background: #000; z-index: 1;}
.column_kv .video_container canvas{position: absolute; height: 100%; width: calc(1600vh / 9); left: 50%; top:50%; transform: translate(-50%,-50%); z-index: 2;}
.column_kv .isAndroid .video_container video{ display: none;}
.column_kv .kvtxt {position: absolute;left:50%; top:50%; width: 75%; color: #333;padding: 10em 0 8em;min-width: 1400px; transform: translate(-50%,-50%);z-index: 5; text-align: center;}
.column_kv .kvtxt h3{ font-size:48px;line-height:150%;font-weight:lighter; text-shadow:0 10px 20px rgba(255, 255, 255,.2);position: relative; z-index: 6;}
.column_kv .kvtxt h4{  font-size:36px; line-height:167%;font-weight: lighter; text-shadow:0 10px 20px rgba(255, 255, 255,.2);position: relative; z-index: 6;}
.column_kv .kvtxt p{font-size:16px;line-height: 250%; font-weight: lighter; text-shadow:0 4px 8px rgba(255, 255, 255,.2);position: relative; z-index: 6;}
.column_kv .kvtxt strong{ font-weight:bold;}
.column_kv .kvtxt span{display:inline-block;}
.column_kv .more{display: inline-block; background: #002971;  color: #FFF; padding: 8px 32px; margin-top: 30px;position: relative; z-index: 6;}

.column_kv .swiper-container-horizontal>.swiper-pagination-bullets,.column_kv .swiper-pagination{ left: 0; right: 0; position: absolute; bottom:8px; text-align: center; }
.column_kv .swiper-pagination-bullet,.column_kv .swiper-pagination-switch{ display: inline-block; width: 12px; height: 12px; margin: 4px 3px !important; border-radius: 50%; background-color: #FFF; opacity: 1;outline: none;transform: scale(.75); opacity: .7;border:1px solid #333;}
.column_kv .swiper-pagination-bullet-active,.column_kv .swiper-active-switch{background-color: #FFF;transform: scale(1);opacity: 1;}

.column_kv .swiper-button-prev,.column_kv .swiper-button-next{ left:4%; top:50%; width: 30px; height:30px; outline: none; position: absolute; margin-top: -37px; color:#333; font-size: 30px; line-height: 30px; text-align: left; z-index: 5; cursor: pointer;transform: scaleY(2);opacity: .5;}
.column_kv .swiper-button-prev:hover,.column_kv .swiper-button-next:hover{color:#002971;opacity: 1;}
.column_kv .swiper-button-prev:after{content: "<";}
.column_kv .swiper-button-next:after{content: ">";}
.column_kv .swiper-button-next{left: auto; right:4%;text-align: right;}

@media screen and (max-width: 1440px){
    .column_kv .kvtxt{min-width: 0; width: 100%; padding: 10em 20px 8em;}
}


@media screen and (max-width: 767px){
    
    .column_kv .kvtxt{width: 94%; top:40%; padding: 10em 0 8em;}
    .column_kv .kvtxt h3{font-size: 28px;}
    .column_kv .kvtxt h4{font-size: 21px;}
    .column_kv .kvtxt p{font-size: 12px; line-height:216.67%;}
    .column_kv .kvtxt br{display: block;}
    .column_kv .more{padding: 4px 20px;}
    .column_kv .arrow{display: block; position: absolute; left: 45.5%; bottom:0; z-index: 10; width:9%; height: 0; padding: 9% 0 0; overflow: hidden; cursor: pointer; background: url(../image/arrow.png) no-repeat center center; background-size: 100%; animation: btn_sx 2s linear infinite; margin-bottom: 40px;}
}
@media screen and (min-aspect-ratio:16/9){
    .column_kv .video_container video{width:100%; height: 56.25vw; margin: calc(50vh - 28.125vw) 0;}
	.column_kv .video_container canvas{width:100%; height: 56.25vw;}
}

.content {padding-top: 0;}
.column_kv .kv_con{height: 100vh;}
@media screen and (max-width: 1280px){
    .column_kv .kv_con{height: 100vh;}
}
@keyframes btn_sx {
  0% {
    bottom:0;
    opacity: 1;
  }
  50% {
    bottom:16px;
    opacity: .3;
  }
  100% {
    bottom:0;
    opacity: 1;
  }
}


.btn_more{display:inline-block; width: 10em; line-height: 200%; text-align: center; color:#FFF; background: #002971; border-radius: .25em; border:1px solid #002971}
a:hover .btn_more, .btn_more:hover{background: #494949; color:#FFF;}


.lefttxt_rightimg .column_content{position: relative; padding:0 47.5% 0 0;}
.lefttxt_rightimg .column_content .img_container{ position: absolute; width: 42.5%; right: 0; bottom:0;top:0;margin: 0;}
.lefttxt_rightimg .column_content .bg_container{position: absolute; left:0; right: 0; bottom:0;top:0; }
.lefttxt_rightimg .txt_container{padding: 0 0 2em;min-height: 252px;}
.lefttxt_rightimg .txt_container p{text-align: justify;}
.lefttxt_rightimg .txt_container .more{display: inline-block; border:1px solid #DDD; color: #333; padding: 0 2em; margin-top: 1.875em; transition:color .5s linear,border .5s linear;line-height: 250%;}
.lefttxt_rightimg .txt_container .more:hover{ border-color: #002971;color:#002971;}
@media screen and (max-width: 767px){
    .lefttxt_rightimg .column_content{padding: 0;}
    .lefttxt_rightimg .column_content .img_container{display:none;} 
}

.iconsInOneLine{position: relative; padding: 0 0 0;}
.iconsInOneLine .column_content > ul{margin: 0 -10px; overflow: hidden; list-style-type: none; padding: 1px 0 0;} 
.iconsInOneLine .column_content > ul > li{float: left;width: 25%; padding: 0 10px 2em;}
.iconsInOneLine .con{display: block; border:1px solid #DDD; border-radius: 3px;padding: 30% 0 20%; text-align: center;position: relative;}
.iconsInOneLine .con .icon_container img{ width: 25%; filter: grayscale(100%);}
.iconsInOneLine .con h3{line-height: 300%;color:#333;}
.iconsInOneLine .con:after{content:'>';position: absolute; font-size: 1.5em; line-height: 2em; width: 2em; margin: 0 0 -1em -1em; left: 50%; bottom:0; background: #002971; color: #FFF; text-align: center; border-radius: 50%;opacity: 0;}
.iconsInOneLine .con:hover{border:2px solid #002971; margin: -1px;}
.iconsInOneLine .con:hover .icon_container img{filter: grayscale(0);}
.iconsInOneLine .con:hover:after{opacity: 1;}
@media screen and (max-width: 1024px){
    .iconsInOneLine .con:after{font-size: 1.25em;}
}
@media screen and (max-width: 767px){
    .iconsInOneLine .column_content > ul > li{width: 50%;}
    .iconsInOneLine .con:after{font-size: 1em;}
}

 
.threeInLine {position: relative; padding: 0 0 4%;}
.threeInLine .column_content > ul{margin: 0 -10px; overflow: hidden; list-style-type: none;} 
.threeInLine .column_content > ul:after{content: ''; display: block; clear: both;}
.threeInLine .column_content > ul > li{float: left;width: 33.33%; padding: 0 10px;}
@media screen and (max-width: 840px){
    .threeInLine .column_content > ul{margin: 0 -6px;}
    .threeInLine .column_content > ul > li{padding: 0 6px; width: 50%;}
    .threeInLine .column_content > ul > li:first-child{width: 100%;padding: 0 6px 2em; }
}
@media screen and (max-width: 640px){
    .threeInLine .column_content > ul > li{width: 100%;padding: 0 6px 2em; }
}


.column_products .product_con{display: block;background: #F4F4F4;padding: .5em;position: relative; margin: 0 .5em;}
.column_products .product_con .swiper-slide{width: 100%;}
.column_products .product_con .img_container{overflow: hidden; position: relative; background: #FFF; display: block;}
.column_products .product_con .bg_container{height: 0; overflow: hidden; padding:0 0 93.75%;  background-size: contain;transition: transform .5s linear;}
.column_products .product_con:hover .bg_container{transform: scale(1.05);}
.column_products .product_con .txt_container{padding: .5em; text-align: center; display: block;}
.column_products .product_con .txt_container h3{font-size: 20px; line-height: 200%; color:#333;}
.column_products .product_con .txt_container p{line-height: 150%; overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:3; text-align: center; height: 4.5em; color:#888; margin: 0 0 .5em;}
.column_products .product_con:hover .txt_container h3{color:#002971;}
.homeproducts .swiper-pagination{ position: relative;text-align: center;  padding: 1em 0 0; clear: both;}
.homeproducts .swiper-pagination-switch{ display: inline-block; width: 12px; height: 12px; margin: 4px 3px !important; border-radius: 50%; background-color: #FFF; opacity: 1;outline: none;transform: scale(.75); opacity: .7;border:1px solid #333;}
.homeproducts .swiper-visible-switch{background-color: #AAA;opacity: 1;}
.homeproducts .swiper-active-switch{background-color: #002971;transform: scale(1);opacity: 1;}
.column_products .btn_more{margin: 1em auto; display: block; width: 9em;}

 
.column_news {position: relative; padding: 0 0 4%;}
.column_news .bg_container{position: absolute; left: 0;right: 0;top:0;bottom: 0; background-position: right bottom; background-color: #385890;}
.column_news .column_content{position: relative; padding:1em; background: #FFF; box-shadow: 0 4px 8px rgba(0, 0, 0,.3); overflow: hidden;}
.column_news .column_content ul{list-style: none; overflow: hidden;}
.column_news .column_content li {padding: .25em 0; white-space: nowrap;float: left; width: 49%; margin: 0 2% 0 0;}
.column_news .column_content li:nth-child(2n){margin: 0 -2% 0 0;}
.column_news .column_content li a{display: block;padding: 0 80px 0 12px; position: relative; line-height: 250%;}
.column_news .column_content li h4{overflow: hidden; width: 100%; text-overflow: ellipsis; color: #494949;}
.column_news .column_content li a:hover h4{color:#002971;}
.column_news .column_content li .time{ font-size: 12px; color:#AAA; line-height: 18px; position: absolute; right: 12px; top:50%; margin-top:-9px; }
@media screen and (max-width: 767px){
    .column_news .column_content li{width: 100%;margin: 0 -2% 0 0;}
}

 
.subcolumn_news .subtil{position: relative; font-size: 32px; line-height: 250%; padding: 0 0 0 36px;}
.subcolumn_news .subtil a:before{content:'';position: absolute;left: 12px; width: 3px; height: .75em; top:0.9375em; background: #002971;}
.subcolumn_news .subtil h3{color:#494949;}
.subcolumn_news .subtil h3:before{content:'';position: absolute;left: 18px; width: 3px; height: .75em; top:0.9375em; background: #002971;}
.subcolumn_news .subtil:after{content:'';position: absolute;left: 24px; width: 3px; height: .75em; top:0.9375em; background: #002971;}
.subcolumn_news .subtil h3:after{content:'>';position: absolute;right:12px;  top:0em;color:#002971;}
.subcolumn_news .subtil a:hover h3:after{color:#494949;}
.subcolumn_news .subcon ul{list-style-type: none;}
.subcolumn_news .subcon li {padding: .25em 0; white-space: nowrap;}
.subcolumn_news .subcon li a{display: block;background: #F7F7F7; padding: 0 80px 0 12px; position: relative; line-height: 250%;}
.subcolumn_news .subcon li h4{overflow: hidden; width: 100%; text-overflow: ellipsis; color: #494949;}
.subcolumn_news .subcon li h4:before{content:'▶';color:#002971;transform: scale(.5); display: inline-block; transform-origin: left center;}
.subcolumn_news .subcon li a:hover h4{color:#002971;}
.subcolumn_news .subcon li .time{ font-size: 12px; color:#AAA; line-height: 18px; position: absolute; right: 12px; top:50%; margin-top:-9px; }
@media screen and (max-width: 1440px){
    .subcolumn_news .subtil{font-size: 28px;}
}
@media screen and (max-width: 1024px){
    .subcolumn_news .subtil{font-size: 24px;}
}
 
.column_partys {position: relative; padding: 0 0 4%;}

.subnews_class2{border-top:1px solid #DDD;}
.subnews_class2 li{border-bottom:1px solid #DDD;padding: 1em 0;position: relative;}
.subnews_class2 li a{display: block;}
.subnews_class2 .time{ margin: 0 32px; width: 64px; color: #FFF; background: #002971; border-radius: 4px; text-align: center; display:inline-block; vertical-align: top;}
.subnews_class2 .time .d{font-size: 1.5em; line-height: 200%; display: block;}
.subnews_class2 .time .m{font-size: 1em; line-height: 200%; display: block;border-top:1px solid rgba(255, 255, 255,.2);}
.subnews_class2 .time .y{display: none;}
.subnews_class2 .img_container{ overflow: hidden; position: relative; background: #ddd;display: inline-block;border-radius: 4px; vertical-align: middle; margin: 0 32px 0 0; width: 300px;}
.subnews_class2 .bg_container{height: 0; overflow: hidden; padding:0 0 75%;  background-size: contain;transition: transform .5s linear;}
.subnews_class2 a:hover .bg_container{transform: scale(1.05);}
.subnews_class2 .txt_container{ overflow: hidden; position: relative;display: inline-block; vertical-align: middle; width:calc(100% - 492px);}
.subnews_class2 .txt_container .type{font-size: 12px; color: #002971;}
.subnews_class2 .txt_container h3{font-size: 20px; color: #333; line-height: 150%;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:2; text-align: justify;margin: 0 0 .25em;}
.subnews_class2 .txt_container p{margin: 0 0 .5em;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:3; text-align: justify; color:#888}
.subnews_class2 a:hover .txt_container h3{ color:#002971;}
@media screen and (max-width: 1024px){
    .subnews_class2 .time{margin: 0 16px 0 0;}
    .subnews_class2 .img_container{margin: 0 16px 0 0;}
    .subnews_class2 .txt_container{width:calc(100% - 412px);}
}
@media screen and (max-width:767px){
    .subnews_class2 .time{margin: 0; position: absolute; right: 0; top:1em}
    .subnews_class2 .img_container{margin: 0; width: calc(100% - 72px);}
    .subnews_class2 .txt_container{width:100%; padding: 1em 0 0;}
}


.bgtwocol{position: relative; padding: 0 0 4%;}
.bgtwocol .bg_container{position: absolute; left: 0;right: 0;top:0;bottom: 0; background-position: right bottom; background-color: #385890;}
.bgtwocol .column_content{position: relative; padding: 0 27em 0 0; background: #FFF; box-shadow: 0 4px 8px rgba(0, 0, 0,.3); overflow: hidden;}
.bgtwocol .firstcol{ position: relative; padding:1em 4em 6em;}
.bgtwocol .secondcol{position: absolute; right: 0; top:0; width: 27em; bottom:0;padding:1em 4em 6em;}
.bgtwocol .info_content{position: relative; min-height: 12em;}
.bgtwocol .info_content h3{font-size: 32px; line-height: 300%; color:#494949;}
.bgtwocol .info_content p{line-height: 150%; text-align: justify; }
.bgtwocol .btn_content{position: absolute; height: 4em; left: 0;right: 0;bottom:0; padding: 0 4em; border-top:1px solid #FFF;}
.bgtwocol .secondcol .info_content,.bgtwocol .secondcol .info_content h3{color:#FFF;}
.bgtwocol .secondcol .btn_content:before{content: ''; float: left; width: 2em; height: 4em; background: url(../image/indexjoinus_bg3.png) no-repeat left center; background-size: 100%;}
.bgtwocol .secondcol .btn_content{ text-align: right; line-height: 400%;}
.bgtwocol .secondcol .btn_content .more{color:#FFF; }
@media screen and (max-width: 1024px){
    .bgtwocol .column_content{padding: 0 19em 0 0;}
    .bgtwocol .firstcol{ padding:0em 2em 5em;}
    .bgtwocol .secondcol{width: 19em;padding:0em 2em 5em;}
    .bgtwocol .info_content{min-height: 10.5em;}
    .bgtwocol .info_content h3{font-size: 24px;}
    .bgtwocol .btn_content{padding: 0 2em;}
}
@media screen and (max-width: 767px){
    .bgtwocol .column_content{padding: 0;}
    .bgtwocol .firstcol{ padding:0em 1em 5em;}
    .bgtwocol .secondcol{width: 100%;position: relative;padding:0em 1em 5em; }
    .bgtwocol .secondcol .bg_container{background-size: auto 100%;}
    .bgtwocol .btn_content{padding: 0 1em;}
} 


.column_video {padding: 0;}
.column_video .video_container{height: 0; overflow: hidden; padding: 0 0 35.52%; position: relative;}
.column_video .video_container .bg_container{position: absolute; left:0; right: 0; bottom:0;top:0;}
.column_video .video_container .bg_container:after{content: '';position: absolute;left:0; right: 0; bottom:0;top:0; background: rgba(0, 0, 0,.2);}
.column_video .video_container .vodeo_slogan{position: absolute;left: 50%; top:50%; white-space: nowrap;display: inline-block; color: #FFF;transform: translate(-50% , -50%); font-size: 20px; line-height: 300%; cursor: pointer;}
.column_video .video_container .vodeo_slogan:before{content: ''; display: block;margin: 0 auto; background:url(../image/indexvideo_icon.png) no-repeat center center; background-size: 100%; width: 3.2em; height: 0; padding: 0 0 3.2em; overflow: hidden;}
@media screen and (max-width: 767px){
    .column_video .video_container{padding: 0 0 48%;}
    .column_video .video_container .vodeo_slogan:before{width: 2.4em; padding: 0 0 2.4em;}
}
@media screen and (max-width: 408px){
    .column_video .video_container{padding: 0 0 56.25%;}
    .column_video .video_container .vodeo_slogan:before{width: 1.5em; padding: 0 0 1.5em;}
}