.content {
    margin-top: 80px;
    width: 100%;
}

/*轮播图开始*/
.banner-box {
    width: 100%;
    height: 600px;

}

.banner-box img {
    width: 100%;
    height: 100%;

}

/*轮播图结束*/

/*应用领域开始*/

.application-box {
    width: 100%;
    /*height: 820px;*/
    background: #fff;
}

.data-box {
    width: 1200px;
    height: 124px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0px 0px 8px 0px rgba(68, 68, 68, 0.28);
    border-radius: 8px;
    position: relative;
    top: -66px;
    z-index: 100;
}

.item-num {
    color: #1766A1;
    height: 45px;
    line-height: 45px;
    margin-top: 29px;
}

.item-num span:first-child {
    font-size: 32px;
}

.item-num span:last-child {
    font-size: 18px;
    font-weight: 600;

}

.item-desc {
    text-align: center;
    font-size: 14px;
    color: #333;
}

.intr-box {
    width: 1200px;
    height: 292px;
    margin: 0 auto;
    position: relative;
    top: -32px;
}

.intr-left {
    background: #2E5B82;
    color: #fff;
    padding-left: 26px;
    box-sizing: border-box;
    width: 304px;
    border-radius: 4px;
}

.intr-title {
    margin-top: 53px;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
}

.intr-desc {
    width: 218px;
    font-size: 14px;
    line-height: 26px;
    margin-top: 17px;
}

.intr-right {
    width: 897px;
    background: url('../image/intt-bg.png');
    position: relative;
}

.intr-text {
    width: 436px;
    height: 40px;
    background: #2E5B82;
    font-size: 26px;
    line-height: 40px;
    text-align: center;
    color: #FFFFFF;

}

.mask {
    width: 50px;
    height: 292px;
    background: linear-gradient(270deg, rgba(46, 91, 130, 0.58) 0%, #2E5B82 100%);
    left: 277px;
    top: 0;
    z-index: 100;
    position: absolute;

}

.intr-yy, .intr-detail {
    width: 896px;
    height: 292px;

    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    display: none;
}

.intr-yy {
    background: #2E5B82;
    opacity: 0.74;
}

.intr-detail {
    z-index: 100;
}

.intr-detail-cont {
    height: 36px;
    font-size: 26px;
    color: #FFFFFF;
    line-height: 36px;
    margin-top: 98px;
    text-align: center;

}

.intr-detail-butn {
    width: 130px;
    height: 36px;
    border-radius: 20px;
    border: 1px solid #FFFFFF;
    line-height: 36px;
    font-size: 15px;
    font-weight: 500;
    color: #FFFFFF;
    text-align: center;
    margin: 0 auto;
    margin-top: 43px;
    display: block;
}

.intr-box:hover .intr-detail, .intr-box:hover .intr-yy {
    display: block;
}

.intr-box:hover .intr-text, .intr-box:hover .mask {
    display: none;
}

.area-box {
    width: 1200px;
    margin: 0 auto;
    margin-top: 67px;
}

.area-title {
    font-size: 32px;
    color: #333;
    font-weight: bold;
}

.area-content {
    margin-top: 24px;

}

.area-item {
    width: 144px;
    height: 144px;
    padding: 24px 32px;
    box-sizing: border-box;
    text-align: center;
    margin-right: 33px;
    position: relative;
}

.area-item img {
    width: 69px;
    height: 69px;
}

.area-item.active {
    background: #F4F4F4;
}

.area-item div {
    color: #333333;
    font-size: 15px;
    font-weight: 500;
    margin-top: 11px;
}

.area-foot {
    width: 100%;
    height: 76px;
    background: #F4F4F4;
    padding-left: 27px;
    box-sizing: border-box;
    overflow: auto;

}

.area-butn {
    height: 36px;
    background: #FFFFFF;
    border-radius: 18px;
    border: 1px solid #DEE2E5;
    text-align: center;
    line-height: 36px;
    font-size: 18px;
    color: #2C2C2C;
    margin-right: 14px;
    padding: 0 22px;
    cursor: pointer;
    display: block;
}

/*应用领域结束*/

/*主营产品开始*/
.pro-box {
    width: 100%;
    height: 531px;
    background: #F2F3F4;
}

.pro-content {
    width: 1200px;
    margin: 0 auto;
    padding-top: 80px;
    box-sizing: border-box;
}

.item-list {
    margin-top: 40px;
}

.pro-item {
    /*width: 260px;*/
    height: 296px;
    box-sizing: border-box;
    background: #fff;
    border-radius: 4px;
    position: relative;
}

/*.pro-item:not(:nth-child(4n)) {*/
    /*margin-right: 29px;*/
/*}*/

.pro-item img {
    width: 186px;
    height: 186px;
    margin-top: 26px;
    margin-left: 46px;
}

.pro-name {
    width: 236px;
    margin: 0 auto;
    border-radius: 22px;
    border: 1px solid #1766A1;
    height: 44px;
    line-height: 44px;
    font-size: 16px;
    color: #1766A1;
    text-align: center;
    margin-top: 13px;
}

.item-active, .pro-yy {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 2px;
    text-align: center;
    display: none;
}

.pro-yy {
    background: #1766A1;
    opacity: 0.6;
    z-index: 10;
}

.item-active {
    z-index: 100;
    color: #fff;
}

.item-active div:first-child {
    margin-top: 105px;
    font-size: 20px;
    font-weight: bold;
    color: rgba(255, 255, 255, 1);

}

.item-active a:last-child {
    width: 72px;
    height: 36px;
    border-radius: 20px;
    border: 1px solid #FFFFFF;
    text-align: center;
    line-height: 36px;
    font-size: 15px;
    margin: 0 auto;
    margin-top: 30px;
    display: block;
    cursor: pointer;
    color: #ffffff;
}

.pro-item:hover .item-active, .pro-item:hover .pro-yy {
    display: block;
}

.pro-item:hover .pro-name {
    display: none;
}

/*主营产品结束*/

/*公司实力*/
.company-box {
    width: 100%;
    height: 565px;
    background: #fff;
}

.company-content {
    width: 1200px;
    margin: 0 auto;
    padding-top: 65px;
    box-sizing: border-box;
}

.comp-item {
    width: 278px;
    height: 360px;
    border-radius: 0px 0px 6px 6px;
}

.img-box {
    width: 100%;
    height: 240px;
}

.img-text {
    width: 120px;
    /*height: 60px;*/
    background: #1766A1;
    border-radius: 4px;
    font-size: 18px;
    color: #FFFFFF;
    line-height: 25px;

    box-sizing: border-box;
    font-weight: 500;
    padding:5px 0;
    padding-left: 5px;
}

.com-text {
    width: 100%;
    height: 120px;
    padding: 24px 21px 0px;
    font-size: 14px;
    box-sizing: border-box;
    background: #EDEDED;
    color: #555555;
    font-weight: 400;

}

.comp-item:hover .com-text {
    background: #1766A1;
    color: #fff;
}

.sell-box {
    height: 526px;
    background: #F2F3F4;
}

.sell-content {
    padding-top: 87px;
    box-sizing: border-box;
    position: relative;
}

.sell-content img {
    width: 600px;
    height: 354px;
}

.sell-right {
    height: 320px;
    width: 100%;
    background: #E7E7E7;
    position: relative;
    padding: 74px 129px 0 53px;
    box-sizing: border-box;

}

.card-title {
    font-size: 20px;
    color: #1766A1;
    line-height: 28px;
}

.card-text {
    font-size: 16px;
    color: #757877;
    line-height: 18px;
    margin-top: 38px;
}

.drop-box {
    position: absolute;
    left: 654px;
    top: 247px;

}

.drop {
    width: 14px;
    height: 14px;
    background: rgba(216, 216, 216, 1);
    border-radius: 50%;
    margin-left: 10px;
}

.drop.active {
    background: rgba(189, 189, 189, 1);
}

/*新闻资讯*/
.news-box {
    height: 507px;
    width: 100%;
    background: #FFFFFF;
}

.news-list {
    margin-top: 40px;
}

.news-item {
    width: 375px;
    height: 241px;
    border-radius: 2px;
    background: #A4A4A4;
    position: relative;
}

.news-item:not(:nth-child(3n)) {
    margin-right: 37px;
}

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

.news-title {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    height: 40px;
    background: #1766A1;
    color: #FFFFFF;
    font-size: 14px;
    line-height: 40px;
    padding-left: 20px;
    box-sizing: border-box;
    display: block;
}

.news-active, .news-yy {
    position: absolute;
    display: none;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;

}

.news-yy {
    background: #1766A1;
    opacity: 0.6;
}

.news-active {
    z-index: 100;
}

.news-active div:first-child {
    text-align: center;
    height: 25px;
    line-height: 25px;
    margin-top: 78px;
    color: #fff;
    font-size: 18px;
}

.news-active div:last-child {
    width: 127px;
    height: 46px;
    margin: 0 auto;
    margin-top: 18px;
    text-align: center;
    line-height: 46px;
    border: 1px solid #FFFFFF;
    border-radius: 23px;

}

.news-active div:last-child a {
    color: #fff;
    font-size: 15px;
}

.news-item:hover .news-title {
    display: none;
}

.news-item:hover .news-active, .news-item:hover .news-yy {
    display: block;
}

.news-item:hover .news-title {
    display: none;
}

/*成功案例*/
.case-box {
    width: 100%;
    height: 620px;
    background: url('../image/case-bg.png');
}

.more {
    width: 100px;
    height: 40px;
    line-height: 40px;
    border-radius: 23px;
    border: 1px solid #666666;
    text-align: center;
    color: #555555;
    font-size: 14px;
    cursor: pointer;

}

.case-content {
    position: relative;
    width: 100%;
    height: 100%;
}

.case-card {
    width: 100%;
    height: 235px;
    background: #fff;
    border-radius: 2px;
    position: relative;
    margin-top: 145px;
    padding: 0 24px;
    box-sizing: border-box;

}

.case-card img {
    position: absolute;
    left: 24px;
    top: -91px;
    width: 494px;
    height: 282px;
    z-index: 1000;

}

.case-right {
    width: 634px;
    margin-left: 518px;
    padding-top: 38px;
    box-sizing: border-box;

}

.case-title {
    color: #1766A1;
    font-size: 16px;
    font-weight: bold;

}

.case-time {
    font-size: 12px;
    color: #999999;
    margin-top: 6px;
}

.case-text {
    font-size: 14px;
    color: #333333;
    font-weight: 400;
    line-height: 20px;
    margin-top: 18px;

}

.card-number-box {
    position: absolute;
    right: 0;
    top: 113px;
    z-index: 10;
    cursor: pointer;
}

.card-number {
    width: 32px;
    height: 32px;
    background: #000000;
    opacity: 0.3;
    color: #fff;
    text-align: center;
    line-height: 32px;
    font-size: 14px;
    font-weight: 400;
    margin-right: 2px;
    position: relative;
}

.card-number-active {
    background: #1766A1;
    opacity: 1;
}

.stri {
    display: none;
    width: 0;
    height: 0;
    border-bottom: 7px solid #fff;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    position: absolute;
    bottom: 0;
    left: calc(50% - 3px);
}

.card-number-active .stri {
    display: block;
}

/*成功案例结束*/
