.main {
    /* border-left: 1px solid red; */
    /* border-right: 1px solid red; */
    width: 73%;
    margin: auto;
    height: auto;
}

.main-1 {
    width: 100%;
    margin: 80px 0 30px 0;
    background-image: url(/public/static/index/images/main-2.jpg);
    height: 50px;
    background-size: 100% 50px;
    font-size: 29px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
}

.main-2 {
    width: 100%;
    height: auto;
    /* border-top: 1px solid red;
    border-bottom: 1px solid red; */
}

.main-about-img {
    width: 50%;
    float: left;
    height: 100%;
}

.main-about-img img {
    width: 100%;
    height: 100%;
}

.main-about-cont {
    width: 48%;
    height: 100%;
    float: right;
}

.main-about-title {
    width: 100%;
    height: 40px;
    font-size: 27px;
    color: black;
    font-weight: bold;
    margin: 30px 0 40px 0;
    text-align: left;
}

.main-about-abs {
    width: 100%;
    height: 280px;
    font-size: 21px;
    color: #7A7A7A;
    /* font-weight: bold; */
    /* margin: 30px 0 40px 0; */
    text-align: left;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 10;
    overflow: hidden;
}

.main-about-more {
    width: 100%;
    height: 40px;
    margin-top: 30px;
}

.main-about-more a {
    width: 90px;
    height: 30px;
    /* border: 1px solid #1A75BC; */
    border-radius: 10%;
    text-align: center;
    line-height: 30px;
    background-color: #1A75BC;
    font-size: 16px;
    color: #F0F6F6;
    float: right;
    margin-right: 60px;
}

.main-about-more a:hover {
    background-color: #fff;
    border: 1px solid #1A75BC;
    color: #1A75BC;
}

.clear {
    clear: both;
}

.main-3 {
    width: 100%;
    margin: 80px 0 30px 0;
    background-image: url(/public/static/index/images/main-3.jpg);
    height: 50px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    font-size: 29px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
}

.nav_active {
    border-bottom: 1px solid #FDFDFF;
}

.main-products-title {
    width: 23%;
    height: 100%;
    margin: auto;
    border: 2px solid #187099;
    cursor: pointer;
}

.main-products-title:hover {
    background-color: #187099;
    color: #fff;
}

.main-4 {
    width: 100%;
    height: auto;
    /* border-top: 1px solid red; */
    /* border-bottom: 1px solid red; */
}

.main-products-left {
    width: 27%;
    height: 100%;
    /* border-right: 1px solid red; */
    float: left;
}

.main-products-left li {
    width: 100%;
    height: 60px;
}

.main-products-left li .wed {
    width: 80%;
    height: 100%;
    border: 1px solid #104660;
    text-align: center;
    line-height: 65px;
    font-size: 17px;
    color: #0A0A0A;
    border-bottom: none;
    cursor: pointer;
}

.main-products-left li .wed:hover {
    background-color: #066899;
    color: #F2F7FD;
    font-size: 18px;
}

.main-products-left li .wed:hover>a {
    color: #F2F7FD;
}

.main-products-left .active {
    background-color: #066899;
    color: #F2F7FD;
}

.main-products-left .active div {
    border: none;
}

.main-products-left .active a {
    color: #F2F7FD;
}

.main-products-left li .wed a {
    color: #0A0A0A;
}

.main-products-left li form {
    height: 60px;
    background-color: #066899;
    border-bottom: 1px solid #066899;
    position: relative;
}

.main-products-left li input {
    height: 30px;
    width: 85%;
    margin-right: 18px;
    border-radius: 4% 0 0 4%;
}

.main-products-left li button {
    height: 30px;
    border-radius: 0 4% 4% 0;
    position: absolute;
    right: 10px;
    bottom: 9px;
    border: none;
    background-color: white;
    cursor: pointer;
}

.main-products-right {
    width: 73%;
    height: 842px;
    float: left;
    background-color: #066899;
}

.main-products-img {
    width: 90%;
    height: 730px;
    margin: 30px 50px 22px 35px;
    /* margin-top: 65px; */
    /* border-top: 1px solid red; */
    /* border-bottom: 1px solid red; */
}

.main-products-img ul {
    display: flex;
    flex-direction: row;
    justify-content: initial;
    flex-wrap: wrap;
}

.main-products-img ul li {
    width: 31%;
    height: 287px;
    margin-right: 2%;
    margin-top: 35px;
    margin-bottom: 20px;
}

.product-img {
    width: 100%;
    height: 235px;
}

.product-img img {
    width: 100%;
    height: 100%;
}

.product-title {
    width: 100%;
    height: 51px;
    text-align: center;
    line-height: 51px;
    font-size: 20px;
    background-color: #FFFFFF;
    color: #818181;
    border-top: 1px solid #84C0D2;
}

.home_video {
    width: 100%;
    height: 100%;
}


/* .product-title:hover {} */

.main-products-img ul li:hover {
    margin-top: 30px;
    box-shadow: 5px 5px 5px #0D4358;
}

.main-products-img ul li:hover .product-title {
    background-color: #027FAD;
    color: #FFFFFF;
}

.main-products-more {
    width: 100%;
    height: 60px;
    position: relative;
}

.main-products-more a {
    width: 90px;
    height: 30px;
    color: black;
    position: absolute;
    right: 50px;
    top: 10px;
    background-color: #fff;
    text-align: center;
    font-size: 16px;
    border-radius: 10%;
    line-height: 30px;
}

.main-products-more a:hover {
    color: #fff;
    background-color: #066899;
    border: 1px solid #fff;
}

.main-5 {
    width: 100%;
    margin: 80px 0 30px 0;
    background-image: url(/public/static/index/images/main-4.jpg);
    height: 50px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
}

.main-product-video {
    width: 30%;
    height: 100%;
    margin: auto;
    border: 2px solid #FB8308;
    cursor: pointer;
}

.main-product-video:hover {
    background-color: #FB8308;
    color: #fff;
}

.main-6 {
    width: 100%;
    height: 200px;
    /* border: 1px solid red; */
}

.main-6 ul {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}

.main-6 ul li {
    width: 30%;
    height: 100%;
    position: relative;
}


/* .main-6 ul li div {
    width: 100px;
    height: 20px;
    position: absolute;
    bottom: 5px;
    right: 5px;
    border: 1px solid red;
} */

.main-6 ul li video {
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.main-7 {
    width: 100%;
    margin: 80px 0 30px 0;
    background-image: url(/public/static/index/images/main-5.jpg);
    height: 50px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    font-size: 29px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
}

.main-product-news {
    width: 25%;
    height: 100%;
    margin: auto;
    border: 2px solid #187099;
    cursor: pointer;
}

.main-product-news:hover {
    background-color: #187099;
    color: #fff;
}

.main-8 {
    width: 100%;
    height: auto;
    /* border-top: 1px solid red; */
    /* border-bottom: 1px solid red; */
}

.main-8 li {
    width: 100%;
    height: 165px;
    border-bottom: 1px dashed #CBCBCB;
}

.main-news-left {
    width: 11%;
    height: 125px;
    margin-top: 20px;
    float: left;
}

.main-news-left img {
    width: 100%;
    height: 100%;
}

.main-news-right {
    width: 84%;
    height: 80%;
    padding-left: 40px;
    float: left;
    line-height: 40px;
    position: relative;
}

.main-news-right h3 {
    width: 100%;
    height: 40px;
    -webkit-line-clamp: 1;
    overflow: hidden;
    line-height: 40px;
    margin-top: 30px;
    color: #2E2E2E;
}

.main-news-right h3:hover {
    text-decoration: underline;
}

.main-news-right p {
    width: 100%;
    height: 90px;
    -webkit-line-clamp: 1;
    overflow: hidden;
    line-height: 40px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    color: #646464;
}

.main-news-date {
    width: 90px !important;
    height: 40px !important;
    position: absolute;
    right: 0px;
    top: 35px;
    text-align: center;
}

.main-news-bottom {
    width: 100%;
    height: 40px;
    margin-top: 30px;
    margin-bottom: 40px;
}

.main-news-bottom a {
    width: 90px;
    height: 30px;
    /* border: 1px solid #1A75BC; */
    border-radius: 10%;
    text-align: center;
    line-height: 30px;
    background-color: #1A75BC;
    font-size: 16px;
    color: #F0F6F6;
    float: right;
}

.main-news-bottom a:hover {
    border: 1px solid #1A75BC;
    background-color: #fff;
    color: #1A75BC;
}