html,body { margin: 0px; padding: 0px; color: #333; }
a { text-decoration: none; }

.page_title { font-size: 32px; line-height: 32px; font-weight: 700; text-align: center; }
.page_subTitle { font-size: 32px; line-height: 32px; text-align: center; margin-top: 6px; }

/* 超大宽屏 */
.banner img { width: 100%; }

.product_box { background-color: #fff; }
.product_box .product { max-width: 1320px; margin: 0 auto; }
.product_con { padding: 86px 0 102px 0; }

.product_list { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 36px; }
.product_item { width: 32%; max-height: 235px; text-align: center; margin-top: 30px; padding: 10px 0; background-color: #f9f9f9; overflow: hidden; }
.product_item img { max-width: 100%; max-height: 100%; transition: all 0.6s; }
.product_item img:hover { transform: scale(1.05); }

.business_box { background-color: #f9f9f9; }
.business_box .business { max-width: 1320px; margin: 0 auto }
.business_con { padding: 50px 0 124px 0; }
.business_list { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 66px; }
.business_item { width: 48%; margin: 0 auto;  }
.business_item.margin_bottom { margin-bottom: 35px; }
.business_icon { width: 90px; height: 90px; margin: 0 auto; }
.business_icon img { width: 100%; }
.business_icon .img { display: block; }
.business_icon .img_cur { display: none; }
.indexGrayscale { -webkit-filter: grayscale(100%); filter: grayscale(100%); }
.business_item_con { padding: 64px 46px 20px 44px; margin-top: -46px; height: 180px; border: 2px solid #fff;
    background: #F6F8FC;box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 19%); transition: all 0.4s ease-in;
        -webkit-transition: all 0.4s ease-in; color: #333; }

.business_title { font-size: 28px; text-align: center; }
.business_desc { font-size: 16px; line-height: 30px; margin-top: 20px; }

.business_item:hover .business_icon .img { display: none; }
.business_item:hover .business_icon .img_cur { display: block; }

.business_item:hover .business_item_con {
    border: 2px solid #fff;
    background: #266ECE;
    color: #fff;
}

.history_box { background-image: url(../../haoke/image/index/history_back.png); }
.history_box .history { max-width: 1320px; margin: 0 auto }
.history_con { padding: 124px 0 74px 0; }
.history_title_color { color: #fff !important; }
.history_list { display: flex; justify-content: space-between; position: relative; z-index: 2; margin-left: 1%; }
.history_item { padding-left: 36px; padding-right: 28px; position: relative; }
.history_item_1::after { content: ''; height: 101px; width: 1px; background-color: #ffff; position: absolute; top: 0; left: 16px; }
.history_item_1 { width: 21%; height: 400px; border-left: 2px #D8D8D8 dashed; margin-top: 258px; }
.history_item_2::after { content: ''; height: 101px; width: 1px; background-color: #ffff; position: absolute; top: 0; left: 16px; }
.history_item_2 { width: 21%; height: 318px; border-left: 2px #D8D8D8 dashed; margin-top: 176px; }
.history_item_3::after { content: ''; height: 92px; width: 1px; background-color: #ffff; position: absolute; top: 0; left: 16px; }
.history_item_3 { width: 21%; height: 292px; border-left: 2px #D8D8D8 dashed; margin-top: 110px; }
.history_item_4::after { content: ''; height: 92px; width: 1px; background-color: #ffff; position: absolute; top: 0; left: 16px; }
.history_item_4 { width: 21%; height: 292px; border-left: 2px #D8D8D8 dashed; margin-top: 44px; }
.history_item_5::after { content: ''; height: 88px; width: 1px; background-color: #ffff; position: absolute; top: 0; left: 16px; }
.history_item_5 { width: 16%; height: 310px; border-left: 2px #D8D8D8 dashed; }
.history_md { font-size: 24px; color: #FFFEFE; }
.history_y { font-size: 40px; color: #FFFEFE; line-height: 56px; }
.history_y span { font-size: 16px; color: #fff; }
.history_t { font-size: 16px; color: #fff; }
.history_img img { width: 100%; margin-top: -480px; position: relative; z-index: 1; }

.case_box { background-color: #fff; }
.case_box .case { max-width: 1320px; margin: 0 auto }
.case_con { padding: 88px 0 78px 0; }
.case_list { display: flex; flex-wrap: wrap; justify-content: space-between; }
.case_item { width: 31%; margin-top: 58px; }
.case_img { overflow: hidden; }
.case_img img { width: 100%; border-radius: 4px; transition: all 0.6s; }
.case_img img:hover { transform: scale(1.05); }
.case_title { font-size: 16px; color: #333333; text-align: center; margin-top: 26px; }
.case_title span { color: #1A65C8; }
.btn_box { margin-top: 84px; }
.btn_box .more_btn { width: 220px; height: 50px; cursor: pointer; line-height: 50px; color: #fff; margin: 0 auto; text-align: center; font-size: 16px; background-color: #2B76D8; }
.btn_box .more_btn:hover { opacity: 0.8; }
.btn_box .more_btn a { color: #fff; }
.partners_box { background-image: url(../../haoke/image/index/partners_back.png); }
.partners_box .partners { max-width: 1320px; margin: 0 auto }
.partners_box { padding: 76px 0 128px 0; }
.partners_list { display: flex; flex-wrap: wrap; margin-top: 54px; }
.partners_item { width: 24%; margin-bottom: 26px; margin-right: 1.33%; }
.partners_item:nth-child(4n) { width: 24%; margin-bottom: 26px; margin-right: 0%; }
.partners_item .imgs { width: 100%; }
.partners_item .imgs img { width: 100%; }


/* 宽屏设备 */
@media screen and (min-width: 1200px) and (max-width: 1420px) {
	
}

/* 中等屏幕 */
@media screen and (min-width: 992px) and (max-width: 1199px) {
	.product_box .product { max-width: 96%; }
    .business_box .business { max-width: 96%; }
    .history_box .history { max-width: 96%; }
    .case_box .case { max-width: 96%; }
    .partners_box .partners { max-width: 96%; }

    .product_item { width: 32%; max-height: 182px; }
} 

/* ipad */
@media screen and (max-width:991px)  {
    .product_box .product { max-width: 96%; }
    .business_box .business { max-width: 96%; }
    .business_item_con { height: 230px; }

    .history_box .history { max-width: 96%; }
    .history_item { padding-left: 20px; padding-right: 10px; position: relative; }
    .history_md { font-size: 18px;  }
    .history_y { font-size: 30px; line-height: 46px; }
    .history_item_1::after { height: 70px; left: 8px; }
    .history_item_1 { height: 270px; margin-top: 250px; }
    
    .history_item_2::after { height: 70px; left: 8px; }
    .history_item_2 { height: 270px; margin-top: 176px; }

    .history_item_3::after { height: 66px; left: 8px; }
    .history_item_3 { height: 270px; margin-top: 110px; }

    .history_item_4::after { height: 66px; left: 8px; }
    .history_item_4 { height: 270px; margin-top: 44px; }

    .history_item_5::after { height: 66px; left: 8px; }
    .history_item_5 { height: 270px; }

    .case_box .case { max-width: 96%; }
    .partners_box .partners { max-width: 96%; }
    .product_item { width: 32%; max-height: 235px; }
}

/* 手机端 */
@media screen and (max-width:767px) {
    .banner { margin-top: 60px; }
    .page_title { font-size: 20px; line-height: 20px; }
    .page_subTitle { font-size: 20px; line-height: 20px; }
    .product_con { padding: 30px 0; }
    .product_list { margin-top: 16px; }
    .product_item { width: 48%; margin-top: 10px; max-height: 130px; }
    .btn_box { margin-top: 20px; }
    .btn_box .more_btn { width: 100px; height: 36px; line-height: 36px; }

    .business_icon { width: 80px; height: 80px; }
    .business_item_con { margin-top: -40px; }
    .business_con { padding: 30px 0 0 0; }
    .business_item_con { padding: 64px 26px 20px 24px; height: 190px; }
    .business_title { font-size: 24px; }
    .business_list { margin-top: 30px; }
    .business_item { width: 100%; margin-bottom: 35px; }
    .history_md { font-size: 18px; padding-left: 20px; }
    .history_y { font-size: 30px; line-height: 46px; padding-left: 20px; }
    .history_t { padding-left: 20px; }
    .history_con { padding: 30px 0; }
    .history_list { flex-wrap: wrap; }
    .history_item { padding: 0; }

    .history_item_1::after { height: 70px; left: 8px; }
    .history_item_1 { height: 130px; margin-top: 30px; width: 48%; }
    
    .history_item_2::after { height: 70px; left: 8px; }
    .history_item_2 { height: 130px; margin-top: 30px; width: 48%; }

    .history_item_3::after { height: 66px; left: 8px; }
    .history_item_3 { height: 130px; margin-top: 30px; width: 48%; }

    .history_item_4::after { height: 66px; left: 8px; }
    .history_item_4 { height: 130px; margin-top: 30px; width: 48%; }

    .history_item_5::after { height: 66px; left: 8px; }
    .history_item_5 { height: 130px; margin-top: 30px; width: 48%; }
    .history_img img { margin-top: -50px; }

    .case_con { padding: 30px 0; }
    .case_list { margin-top: 0px; }
    .case_item { width: 48%; margin-top: 30px; }
    .case_title { margin-top: 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

    .partners_box { padding: 30px 0; }
    .partners_list { display: flex; flex-wrap: wrap; margin-top: 20px; justify-content: space-between; }
    .partners_item { width: 48%; margin-bottom: 10px; margin-right: 0; }
    .partners_item:nth-child(4n) { width: 48%; margin-bottom: 10px; }
}