body {

    line-height: normal;

}



.container {

    position: relative;

    width: 1280px;

    height: 100%;

    padding: 0;

    left: 50%;

    transform: translateX(-50%);

}



a,

a:hover,

a:focus {

    color: inherit;

}



.box-inline {

    display: inline-block;

    vertical-align: top;

}



.font-size-32 {

    font-size: 32px;

}



.font-size-24 {

    font-size: 24px;

}



.font-size-20 {

    font-size: 20px;

}



.font-size-18 {

    font-size: 18px;

}



.font-size-16 {

    font-size: 16px;

}



.font-size-14 {

    font-size: 14px;

}



.grayscale-level75 {

    opacity: .75;

}



.grayscale-level8 {

    opacity: .8;

}



.bgcolor-f7 {

    background-color: #F7F7F7;

}



.bgcolor-f9 {

    background-color: #F9F9F9;

}



.m-t-25 {

    margin-top: 25px;

}



.m-l-10 {

    margin-left: 10px;

}



.m-r-10 {

    margin-right: 10px;

}



.m-r-20 {

    margin-right: 20px;

}



.m-r-30 {

    margin-right: 30px;

}



.m-b-10 {

    margin-bottom: 10px;

}



.m-b-25 {

    margin-bottom: 25px;

}



.m-b-30 {

    margin-bottom: 30px;

}



.m-b-40 {

    margin-bottom: 40px;

}



.float-left {

    float: left;

}



.float-right {

    float: right;

}









.banner {

    width: 100%;

    height: 400px;

    position: relative;

}



.banner-center-con {

    position: absolute;

    top: 57%;

    transform: translateY(-50%);

    color: #061828;

    font-weight: 400;

    text-align: start;

}



.banner-title {

    font-size: 42px;

}



.banner-slogan {

    margin: 10px 0 20px;

    width: 580px;

    font-size: 16px;

    line-height: 32px;

}



.banner-btn {

    width: 110px;

    height: 46px;

    line-height: 46px;

    background-color: #2386EE;

    color: #fff;

    text-align: center;

}



.section {

    width: 100%;

    padding: 70px 0;

    color: #061828;

}



.section-title {

    font-size: 32px;

    font-weight: 500;

}



.section-subtitle {

    font-size: 14px;

    font-weight: 400;

    opacity: .75;

}



.con1-container {

    margin: 40px 0 30px 0;

}



.con1-nav-top {

    margin-top: 40px;

}



.con1-nav-top > .con1-nav-top-item:nth-child(5n+0) {

    margin-right: 0;

}



.con1-nav-bottom > .con1-nav-bottom-item:last-child {

    margin-right: 0;

}



.con1-nav-top-item,

.con1-nav-bottom-item {

    display: inline-block;

    vertical-align: top;

    width: 224px;

    margin-right: 20px;

}



.con1-item-box {

    width: 100%;

    height: 200px;

    padding: 8px;

    background: #F7F7F7;

    border-bottom: 6px solid #F7F7F7;

}



.con1-item-box img {

    height: 67px;

    margin: 30px;

}



.con1-item-box .img2 {

    display: none;

}



.con1-item-box p {

    width: 100%;

    font-size: 20px;

    font-weight: 400;

    white-space: nowrap;

    overflow: hidden;

}



.con1-nav-top-item .con1-item-triangle {

    margin: 0 auto;

    width: 0;

    height: 0;

    border: 10px solid;

    border-color: transparent transparent #FFF;

}



.con1-nav-bottom-item .con1-item-triangle {

    margin: 0 auto;

    width: 0;

    height: 0;

    border: 10px solid;

    border-color: transparent transparent #FFF;

    transform: rotate(180deg);

}



.con1-content {

    width: 100%;

    background: #F7F7F7;

}



.con1-center-content {

    display: none;

    width: 1138px;

    margin: 20px auto;

    text-align: start;

}



.con1-center-content-item {

    display: inline-block;

    vertical-align: top;

    width: 366px;

    height: 120px;

    background: #FFFFFF;

    margin: 0 20px 16px 0;

    padding: 20px 30px;

    display: inline-flex;

    flex-direction: row;

    align-items: center;

    justify-content: space-between;

}



.con1-center-content > a:nth-child(3n+0) > .con1-center-content-item {

    margin-right: 0;

}



.con1-center-content-item:hover {

    box-shadow: 0 5px 10px 0 rgba(18, 32, 46, 0.14);

}



.con1-center-content-item:hover > .con1-content-item-text > .con1-content-item-title {

    color: #2386EE;

}



.con1-center-content-item:hover > .con1-content-item-img1 {

    display: none;

}



.con1-center-content-item:hover > .con1-content-item-img2 {

    display: inline;

}



.con1-content-item-img2 {

    display: none;

}



.con1-center-content-item img {

    width: 50px;

}



.con1-content-item-text {

    display: inline-block;

    vertical-align: top;

    width: 235px;

    text-align: start;

}



.con1-content-item-title {

    font-size: 18px;

    font-weight: 500;

    line-height: 32px;

}



.con1-content-item-content {

    font-size: 14px;

    font-weight: 400;

    line-height: 20px;

    opacity: 0.6;

    height: 40px;

    overflow: hidden;

}



.banner-center {

    width: 100%;

    height: 400px;

    padding: 70px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    background: url(../images/banner-center-pc.png) center center no-repeat;

}



.banner-center-container {

    width: 1200px;

    text-align: start;

}



.banner-center-title {

    width: 380px;

    font-size: 38px;

    font-weight: 400;

    line-height: 56px;

    color: #fff;

    margin: 28px 0;

}



.banner-center-btn {

    width: 120px;

    height: 46px;

    background: #2386EE;

    border: none;

}



.banner-center-btn img {

    width: 20px;

    height: 20px;

    margin: 13px 8px 0 0;

}



.banner-center-btn p {

    display: inline-block;

    vertical-align: top;

    font-size: 16px;

    line-height: 46px;

    text-align: center;

    font-weight: 300;

    color: #FFFFFF;

}



.con3-list {

    width: 100%;

    display: flex;

    flex-direction: row;

    flex-wrap: wrap;

    justify-content: space-between;

    margin-bottom: 30px;

}



.con3-list-box {

    width: 595px;

    height: 314px;

    margin-bottom: 10px;

    position: relative;

}



.con3-list-box-img {

    position: absolute;

    width: 100%;

    top: 0;

    left: 0;

}



.con3-list-box-content {

    position: absolute;

    z-index: 1;

    left: 0;

    bottom: 0;

    width: 100%;

    min-height: 138px;

    padding: 25px 30px;

    background-color: #F6F6F6;

    text-align: start;

}



.con3-list-content-title {

    font-size: 20px;

    font-weight: 500;

    margin-bottom: 10px;

}



.con3-list-content-text {

    font-size: 16px;

    font-weight: 400;

    line-height: 24px;   

    opacity: 0.75;

    height: 48px;

    overflow: hidden;

}



.con3-list-content-btn {

    display: none;

    width: 100px;

    height: 40px;

    background: #2386EE;

    color: #fff;

    line-height: 40px;

    font-size: 14px;

    font-weight: 400;

    text-align: center;

    margin-top: 10px;

}



.con3-list-box:hover {

    box-shadow: 0px 20px 70px 0px rgba(19, 32, 46, 0.2);

}



.con3-list-box:hover > .con3-list-box-content {

    background-color: #fff;

}



.con3-more {

    margin-top: 15px;

}



.con3-more p {

    display: inline-block;

    vertical-align: middle;

    font-size: 16px;

    font-family: PingFang;

    font-weight: 400;

    line-height: 24px;

    color: #0186F2;

}



.con3-more img {

    height: 8px;

    margin: 8px 10px;

}



.contact-title {

    text-align: start;

    font-size: 32px;

    font-weight: 500;

}



#videoDiv {

    z-index: 9999;

    position: relative;

    display: none;

}



#videobg {

    background: #000000;

    opacity: 0.3;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}



#videoplayerDiv {

    position: fixed;

    top: 50%;

    left: 50%;

    z-index: 100;

    transform: translate(-50%, -50%);

}



#videoContainer {

    width: 700px;

    height: 500px;

    background-color: black;

}



#closeBtn {

    position: absolute;

    right: 0;

    cursor: pointer;

    z-index: 200;

}



#videoplayer {

    height: 500px;

    width: 700px;

}



#videoplayer video {

    width: 700px;

    height: 500px;

}