﻿@charset "utf-8";
/* CSS Document*/
/* ---------- banner ----------*/
#banner{width: 100%;max-width: 1920px;overflow: hidden;}
#banner .swiper-slide{position: relative;background-position: center!important;background-size: cover!important;}
#banner .swiper-slide img{width: 100%;display:block;}
#banner .swiper-pagination{bottom: 20px;}
#banner .swiper-pagination-bullet{width: 50px;height: 3px;margin: 0 4px;border-radius: 0;background: rgba(255,255,255,0.5);opacity: 1;outline: none;transition: all .5s;}
#banner .swiper-pagination-bullet-active{width: 50px;background: #0067d0;}
#banner .swiper-button-prev,#banner .swiper-button-next{left: 4%;width: 40px;height: 60px;margin-top: -30px;background-size: 20px 20px;background-color: rgba(0,0,0,.55);opacity: 0;transition: all .5s;display: none;}
#banner .swiper-button-next{left: auto;right: 4%;}
#banner .swiper-slide img{position:relative;width:100%;height: 100%;object-fit: cover;transition:all 1s ease 2.5s;transform:perspective(1000px) translate3d(0, 0, 100px);}
#banner .swiper-slide.active img{transition:all 5s ease 0s;transform:perspective(1000px) translate3d(0, 0, 0px);}
#banner:hover .swiper-button-prev,#banner:hover .swiper-button-next{opacity: 1;}
#banner:hover .swiper-button-prev:hover,#banner .swiper-button-next:hover{background-color: #0067d0;border-color: #0067d0;}
@media only screen and (max-width: 1024px){
#banner{height: 500px;}}
@media only screen and (max-width: 768px){
#banner{height: 190px;}
#banner .swiper-pagination{bottom: 10px;}}
/* ---------- Industry ----------*/
.industry{padding-top: 50px;}
.industry-con{overflow: hidden;}
.industry-con ul{width: calc(100% + 30px);}
.industry-con li{float: left;position: relative;margin: 0 30px 0 0;width: calc(100% / 3 - 30px);}
.industry-con li:after{content:" ";position: absolute;right: 25px;bottom: 30px;width: 18px;height: 18px;border: 3px solid #fff;border-style: solid solid none none;transform: rotate(45deg);}
.industry-con li .pic{position: relative;padding-bottom: 112%;overflow: hidden;}
.industry-con li .pic:after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,1));}
.industry-con li .pic img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;transition: all 0.3s ease-in-out;}
.industry-con li .con{position: absolute;left: 0;right: 0;bottom: 0;width: 75%;padding: 0 0 20px 20px;color: #fff;box-sizing: border-box;}
.industry-con li .con h4{font-size: 30px;font-weight: normal;margin-bottom: 20px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.industry-con li .con p{position: relative;font-size: 15px;text-align: justify;line-height: 1.8;opacity: .8;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;}
.industry-con li a:hover .pic img{transform: scale(1.05);}
.industry .swiper-button-prev,
.industry .swiper-button-next{left: -20px;width: 30px;height: 50px;background-size: 30px 30px;opacity: 1;transition: all .5s;}
.industry .swiper-button-next{left: auto;right: -20px;}
.industry .swiper-button-next.swiper-button-disabled,
.industry .swiper-button-prev.swiper-button-disabled{opacity: 0;}
/* responsive*/
@media only screen and (max-width: 1024px){
.industry{padding-top: 40px;}
.industry-con li:after{width: 15px;height: 15px;border-width: 2px;}
.industry-con li .con{width: 80%;}
.industry-con li .con h4{font-size: 24px;margin-bottom: 15px;}
.industry-con li .con p{font-size: 13px;}
.industry .swiper-button-prev,
.industry .swiper-button-next{display: none;}}
@media only screen and (max-width: 768px){
.industry{padding-top: 20px;}
.industry-con{padding-top: 32px;overflow-x: auto;}
.industry-con ul{width: 800px;}
.industry-con li{margin: 0 16px 0 0;width: 144px;}
.industry-con li .con{/* padding: 16px; */}
.industry-con li .con h4{/* font-size: 16px; */}
.industry-con li .con p{/* padding: 4px 0 16px; *//* font-size: 12px; */}}
/* ---------- About ----------*/
.about{padding-top: 100px;}
.about-tit{position: relative;}
.about-tit h2{font-family: "Montserrat-Regular";font-size: 32px;color: #333;}
.about-tit h3{color: #666;font-family: "Montserrat-Regular";font-size: 56px;text-transform: uppercase;opacity: .09;}
.about-con{display: flex;flex-wrap: wrap;justify-content: space-between;}
.about-intro{width: 40%;display: flex;flex-wrap: wrap;align-content: space-between;}
.about-desc{color: #666;font-size: 16px;text-align: justify;line-height: 2;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 8;overflow: hidden;}
.about-more a{display: inline-block;color: #fff;font-size: 16px;line-height: 3;padding: 0 60px;border-radius: 50px;background: #013a79;}
.about-more a:hover{padding: 0 70px;}
.about-pic{width: 55.5%;position: relative;padding: 15px 0 0 15px;box-sizing: border-box;}
.about-pic .video{position: relative;width: 100%;padding-bottom: 66%;z-index: 1;}
.about-pic .video img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.about-pic .video .plyr__poster{background-size: cover;}
.about-pic .video .plyr__control--overlaid{background: #fff;opacity: .8;}
.about-pic .video .plyr__control--overlaid:hover{background: #fff;opacity: 1;}
.about-pic .video .plyr__control--overlaid svg{fill: var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));}
.about-pic:after{content: "";position: absolute;top: 0;left: 0;width: calc(100% - 15px);height: calc(100% - 15px);background: #fafafa;}
/* responsive*/
@media only screen and (max-width: 1024px){
.about{padding-top: 60px;}
.about-tit h2{font-size: 24px;}
.about-tit h3{font-size: 40px;}
.about-desc{font-size: 14px;}
.about-more a{font-size: 14px;}}
@media only screen and (max-width: 768px){
.about{padding-top: 30px;}
.about-con{flex-direction: column-reverse;}
.about-intro{display: block;width: auto;margin-top: 20px;}
.about-desc{display: block;margin-bottom: 20px;}
.about-pic{width: 100%;padding: 0;}
.about-more{text-align: center;}}
/* ---------- News ----------*/
.news{padding-top: 100px;}
.news-tit{position: relative;height: 49px;border-bottom: 1px solid #eaeaea;}
.news-tit h2{float: left;height: 48px;border-bottom: 2px solid #013a79;font-family: "Montserrat-Regular";font-size: 24px;color: #333;}
.news-tit h3{float: left;padding: 10px 0 0 16px;font-family: "Montserrat-Regular";font-size: 18px;font-weight: normal;color: #999;text-transform: uppercase;}
.news-tit a.more-btn{position: absolute;top: 11px;right: 0;padding-right: 16px;background: url("../images/more-arrow.png") no-repeat right center;font-size: 14px;color: #bbb;}
.news-tit a:hover.more-btn{color: #888;}
.news-con{padding-top: 50px;overflow: hidden;}
.news-pic{float: left;position: relative;width: 48.5%;height: 360px;overflow: hidden;}
.news-pic img{width: 100%;height: 100%;object-fit: cover;transition: all 0.3s ease-in-out;}
.news-pic a:hover img{transform: scale(1.05);}
.news-pic .mask{position: absolute;left: 0;right: 0;bottom: 0;background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,1));padding: 32px 40px;color: #fff;}
.news-pic .date{float: left;font-family: "Montserrat-Regular";}
.news-pic .day{display: block;font-size: 22px;}
.news-pic .year{display: block;padding-top: 4px;font-size: 14px;}
.news-pic .con{float: right;position: relative;padding-left: 24px;width: calc(100% - 88px);box-sizing: border-box;}
.news-pic .con:before{position: absolute;top: 4px;left: 0;bottom: 3px;width: 1px;background: rgba(255,255,255,0.4);content: "";}
.news-pic .con h4{font-size: 18px;font-weight: normal;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.news-pic .con p{padding-top: 12px;font-size: 14px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.news-list{float: right;width: 48.5%;}
.news-list li{margin-bottom: 15px;padding: 27px 40px;height: 55px;background: #fff;border-bottom: 1px dashed #eaeaea;overflow: hidden;}
.news-list li:last-child{margin-bottom: 0;}
.news-list li .date{float: left;font-family: "Montserrat-Regular";}
.news-list li .day{display: block;font-size: 22px;color: #333;}
.news-list li .year{display: block;padding-top: 4px;font-size: 14px;color: #999;}
.news-list li .con{float: right;position: relative;padding-left: 24px;width: calc(100% - 88px);box-sizing: border-box;}
.news-list li .con:before{position: absolute;top: 4px;left: 0;bottom: 3px;width: 1px;background: #eaeaea;content: "";}
.news-list li .con h4{font-size: 18px;font-weight: normal;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.news-list li .con p{padding-top: 12px;font-size: 14px;color: #999;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
/* responsive*/
@media only screen and (max-width: 1024px){
.news{padding-top: 60px;}
.news-tit{height: 39px;}
.news-tit h2{height: 38px;font-size: 20px;}
.news-tit h3{padding: 8px 0 0 8px;font-size: 14px;}
.news-tit a.more-btn{top: 7px;right: 0;}}
@media only screen and (max-width: 768px){
.news{padding-top: 30px;}
.news-con{padding-top: 32px;}
.news-pic{float: none;margin-bottom: 20px;width: auto;height: auto;}
.news-pic .mask{padding: 16px 20px;}
.news-pic .date{padding-top: 2px;}
.news-pic .day{font-size: 18px;}
.news-pic .year{padding-top: 2px;}
.news-pic .con{padding-left: 16px;width: calc(100% - 68px);}
.news-pic .con h4{font-size: 16px;}
.news-pic .con p{padding-top: 8px;}
.news-list{float: none;width: auto;}
.news-list li{margin-bottom: 10px;padding: 16px 20px;height: auto;}
.news-list li .date{padding-top: 2px;}
.news-list li .day{font-size: 18px;}
.news-list li .year{padding-top: 2px;}
.news-list li .con{padding-left: 16px;width: calc(100% - 68px);}
.news-list li .con h4{font-size: 16px;}
.news-list li .con p{padding-top: 8px;}}
/* ---------- join ----------*/
.join{margin: 60px auto;}
.join-box{padding: 100px;background: url("../images/join-bg.jpg") no-repeat center top;background-size: cover;box-sizing: border-box;}
.join-con{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-end;color: #fff;}
.join-tit h2{font-size: 28px;font-weight: normal;}
.join-tit h3{font-size: 17px;font-weight: normal;margin-top: 10px;}
.join-txt .mail{font-size: 34px;line-height: 1;margin-top: 30px;padding-left: 45px;background: url(../images/mail.png) no-repeat center left;}
.join-intro{width: 52%;}
.join-desc{font-size: 16px;line-height: 2.3;text-align: justify;}
.join-more{margin-top: 20px;}
.join-more a{color: inherit;font-size: 16px;text-decoration: underline;}
/* responsive*/
@media only screen and (max-width: 1024px){
.join{margin: 30px auto;}
.join-box{padding: 60px;}}
@media only screen and (max-width: 768px){
.join-box{padding: 20px;}
.join-con{display: block;}
.join-txt .mail{font-size: 20px;padding-left: 25px;background-size: 20px;margin: 30px 0;}
.join-intro{width: 100%;}
.join-desc,
.join-more a{font-size: 14px;}}
/* ---------- Social ----------*/
.social{padding: 120px 0;}
.social-tit{position: relative;height: 49px;border-bottom: 1px solid #eaeaea;}
.social-tit h2{float: left;height: 48px;border-bottom: 2px solid #0998e0;font-family: "Montserrat-Regular";font-size: 24px;color: #333;}
.social-tit h3{float: left;padding: 10px 0 0 16px;font-family: "Montserrat-Regular";font-size: 18px;font-weight: normal;color: #999;text-transform: uppercase;}
.social-tit a.more-btn{position: absolute;top: 11px;right: 0;padding-right: 16px;background: url("../images/more-arrow.png") no-repeat right center;font-size: 14px;color: #bbb;}
.social-tit a:hover.more-btn{color: #888;}
.social-con{padding-top: 50px;overflow: hidden;}
.social-con ul{width: calc(100% + 60px);}
.social-con li{float: left;margin: 0 60px 0 0;width: calc(100% / 3 - 60px);}
.social-con li .pic{width: 100%;overflow: hidden;}
.social-con li .pic img{width: 100%;transition: all 0.3s ease-in-out;}
.social-con li .con{padding: 24px 0 20px;border-bottom: 1px solid #efefef;}
.social-con li .date{font-family: "Arial";font-size: 14px;color: #999;}
.social-con li .con h4{padding-top: 16px;font-size: 16px;font-weight: normal;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.social-con li .btm{padding-top: 16px;}
.social-con li .more-btn{padding-right: 32px;background: url("../images/social-more-arrow.png") no-repeat right center;font-size: 12px;color: #ccc;transition: all 0.3s ease-in-out;}
.social-con li a:hover .pic img{transform: scale(1.05);}
.social-con li a:hover .more-btn{padding-right: 48px;}
/* responsive*/
@media only screen and (max-width: 1024px){
.social{padding: 60px 0 40px;}
.social-tit{height: 39px;}
.social-tit h2{height: 38px;font-size: 20px;}
.social-tit h3{padding: 8px 0 0 8px;font-size: 14px;}
.social-tit a.more-btn{top: 7px;right: 0;}}
@media only screen and (max-width: 768px){
.social-con{padding-top: 32px;}
.social-con ul{width: auto;}
.social-con li{float: none;margin: 0 0 20px 0;width: auto;}
.social-con li .con{padding: 20px 0 16px;}
.social-con li .con h4{padding-top: 8px;}
.social-con li .btm{padding-top: 12px;}}
/*播放器相关*/
:root {--plyr-color-main: #013a79;}