@charset "utf-8";

@media (min-width: 1600px) {
.container {
    width: 100%;
    padding-left: 160px;
    padding-right: 160px;
}
}
@media screen and ( max-width: 1400px) {
   .navList .firstClass{
       padding: 0 10px;
   }
   .aboutDivide .aboutCon,.aboutDivide .img{
       width: 50%;
   }
   .serviceInd .indGuideitem{
       padding: 15px 10px;
   }
   .serviceInd .guideitemTxt h4{
       font-size: 16px;
   }
   .serviceInd .indGuideitem img{
       max-width: 45px;
   }
   .proFlow ul{
       margin-left: -7.5px;
       margin-right: -7.5px;
   }
   .proFlow li{
       padding: 0 7.5px;
   }
   .proFlow li h5{
       font-size: 16px;
       overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
   }
   .advantages .advGuide a h4{
       margin-bottom: 15px;
   }
}

@media screen and ( max-width: 1200px) {
	#header {
		height: 50px;
	}
	.header_flex{
	    height: 50px;
	}
	#header.header_on .header_flex{
	    height: 50px;
	}
	.header_wrap {
		width: 100%;
		padding: 0 15px 0 10px;
		left: 0;
		margin: 0;
		height: 50px;
		position: relative;
		z-index: 99999;
		background: var(--theme-color);
	}
	.header_on .header_wrap{
	    padding: 0;
	}
	.logo a{
	    background: none;
	    width: auto;
	    height: auto;
	}
	.logo img{
	    height: 20px;
	}
	#header.header_on .logo img{
	    height: 16px;
	}
	.phone_menu_btn {
		display: block;
		padding-top:0;
	}
	.phone_top_nav {
		display: block;
	}
	
	.mb_banner{
	    display: block!important;
	    margin-top: 50px;
	}
	.more_style3{
	    margin: 20px auto 0;
	}
	.more_style4{
	    margin-top: 30px;
	}
}

@media screen and ( max-width: 992px) {
	.container {
		padding-left: 12px;
		padding-right: 12px;
	}
	.mb_none{
	    display: none!important;
	}
	.pc_none{
	    display: block!important;
	}
	.row {
		margin-right: -6px;
		margin-left: -6px;
	}

	.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
		padding-left: 6px;
		padding-right: 6px;
	}
	.mb_banner {
		display: block!important;
	}
	.banner .item .con{
	    margin-top: 20px;
	}
    .banner .item .con h4{
        font-size:22px;
        margin:5px 0;
    }
    .banner .item .con span{
        font-size:16px;
    }
	.banner .owl-pagination {
		height: auto;
		right: 20px;
		top: 45%;
	}
	.banner .owl-buttons>div{
	    display: none;
	}
	.banner .owl-pagination .owl-page {
		width: 4px;
		height: 4px;
	}
	.banner .owl-pagination .owl-page.active:after {
		width: 14px;
		height: 14px;
		left: -6px;
		top: -6px;
	}
	.phone_fixed_menu {
		display: block;
	}
	.tit_box1 {
		padding:30px 0 20px;
		border-width:5px;
	}
	.tit_box1 .tit h4{
	    font-size:18px;
	    padding-left: 40px;
	}
	.tit_box1 .tit h4:before{
	    width: 30px;
	    top: 10px;
	}
	.tit_box1 .tit p{
	    font-size:14px;
	}
	.tit_box1 .tit p em{
	    width: 30px;
	    margin:20px 0 0 6px;
	}
	.tit_box1 .more>a{
	    margin-top: 0;
	    font-size:14px;
	    height: 35px;
	    line-height: 35px;
	}
	.tit_box1 .more>a i{
	    margin-left: 10px;
	}
	.header{
	    display: none;
	}
	.header_mb{
	    display: block;
	}
	.proGuide{
	    display: block;
	    padding:  15px 0;
	}
	.proGuide a{
	    text-align: center;
	    margin-bottom: 15px;
	    display: block;
	}
	.proGuide a:last-child{
	    margin: 0;
	}
	.proGuide a:after{
	    width: 100%;
	    bottom: 0;
	}
	.aboutDivide>.flexBetween{
	    display: block;
	}
	.aboutDivide{
	    background: none;
	    padding: 0;
	}
	.aboutDivide .aboutCon{
	    width: 100%;
	    padding: 0;
	}
	.aboutDivide .aboutCon p{
	    color: #333;
	    font-size: 14px;
	}
	.aboutDivide .more{
	    padding: 10px 45px;
	    color: #333;
	    border: 1px solid #333;
	}
	.proTit>p{
	    display: none;
	}
	.frontTit{
	    margin: 0 0 30px 0;
	}
	.proFlow li{
	    margin-bottom: 15px;
	}
	.products{
	    margin: 50px 0 35px 0;
	}
	.frontTit h4{
	    font-size: 24px;
	}
	.frontTit h4:after{
	    margin: 15px auto;
	}
	.aboutData .dataCon{
	    flex-direction: column;
	    align-items: center;
	}
	.aboutData{
	    margin: 30px 0;
	}
	.aboutData h1{
	    font-size: 36px;
	}
	.aboutData h4{
	    margin: 0;
	    font-size: 18px;
	}
	.aboutData h1:after{
	    height: 5px;
	}
	.aboutDivide .img {
	    width: 100%;
	    margin-bottom: 30px;
	}
	.mbHonorflow{
	    display: block;
	}
	.honorList{
	    display: none;
	}
	.honor{
	    margin-bottom: 50px;
	}
	.serviceInd,.serviceFlow,.advDivide .advImg{
	    display: none;
	}
	.advantages .advGuide a{
	    height: 150px;
	}
	.advantages .advGuide a .img{
	    overflow: hidden;
	    height: 100%;
	}
	.advantages .advGuide a img{
	    max-width: none;
	    object-fit: cover
	}
	.advantages{
	    margin-bottom: 50px;
	}
	.masgForm h1{
        font-size: 36px;
        margin-bottom: 30px;
    }
    .masgForm{
        padding: 50px 0;
        margin-top: 50px;
        margin-bottom: 50px;
    }
    .masgForm .flex{
        flex-direction: column;
        align-items: center;
    }
    .masgForm form .form-group{
        margin-right: 0;
        width: 80%;
    }
    .masgForm form .mod1 button{
        padding: 15px 50px;
    }
    .masgForm{
        background-size: cover;
    }
    .application_list .swiper-slide.swiper-slide-active{
        width: auto!important;
    }
    .newsH{
        display: none;
    }
    .application_list{
        margin-bottom: 50px;
    }
    .newsCenter .newsF{
        margin-top: 15px;
    }
    .newsCenter .newsF li{
        margin-bottom: 15px;
    }
    .partners{
        margin: 35px 0 50px 0;
    }
    .partnersFlows li{
        width: 25%;
    }
    .footDivide{
        display: block;
    }
    .footCol{
        display: none;
    }
    .footer .footMsg{
        width: 100%;
        display: block;
    }
    .footcontact{
        width: 100%;
        padding: 0;
    }
    .footcontact .comDes{
        margin: 30px 0;
    }
    .friend_links{
        display: none;
    }
    .footer{
        padding-top: 50px;
    }
    .footer .footMsg .qrList .img{
        width: auto;
    }
    .footer .footMsg p{
        margin-bottom: 10px;
    }
    .footer .icp{
        margin-top 15px;
    }
    .footer .icp p{
	    font-size: 10px;
	    padding: 0;
	}
	.footer .icp .img{
	    margin-right: 5px;
	}
	.footer .icp .container{
	    flex-direction: column;
	}
	.inProducts .inpro{
	    width: 100%;
	}
	.inproDivide{
	    padding: 0;
	}
	.inProducts .inproList li img{
	    width: 100%;
	}
	.ibanner .img{
	    width: 100%;
	}
	.listPage{
	    padding: 50px 0;
	}
	.inProducts .inproList li .proTit h5{
	    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: keep-all;
	}
	.inproContent img{
	    min-width: 0;
	}
	.proBimg .img{
        padding: 0;
    }
    .inproDivide{
        padding: 30px;
        display: block;
    }
    .proconDivide{
        width: 100%;
        margin: 0;
    }
    .propicDivide{
        width: 100%;
    }
    .proBimg{
        margin-bottom: 30px;
    }
    .sellCon{
        display: none;
    }
    .quoLiNE{
        margin-top: 15px;
        display: block;
    }
    .proconDivide .sellMore{
        display: inline-block;
    }
    .proDetail .inproContent{
        margin-top: 30px;
    }
    .proPhone {
        margin: 0;
        margin-top: 15px;
    }
    .proconTit{
        margin-top: 30px;
        font-size: 24px;
    }
    .proconDivide p{
        font-size: 14px;
    }
    .inner{
        margin-top: 50px;
    }
    .nyContact .contactTit{
        padding-bottom: 30px;
    }
    .nyContact .contactList{
        margin-top: 30px;
    }
    .nyContact .contactList .contactCon{
        margin-bottom: 15px;
        min-height: auto;
    }
    .nyContact .contactDivide{
        margin-bottom: 50px;
    }
    .nyContact{
        padding: 50px 0;
        margin-top: 0;
        background-size: cover;
    }
    .message h3{
        margin-bottom: 30px;
    }
    .nyinforight{
        display: none;
    }
    .infoPage{
        padding: 50px 0;
    }
    .ibanCon p{
        display: none;
    }
    .aboutinDiv{
        background: none;
        padding: 50px 0 20px 0;
    }
    .aboutinDiv .flexAligncenter{
        display: block;
    }
    .aboutinDivimg{
        padding: 0;
    }
    .aboutinDiv .innerTit{
        margin: 30px 0;
    }
    .aboutAdv{
        background: url(/web/template/heartsys/images/aboutyearbg.jpg) center repeat;
        padding: 50px 0;
    }
    .abAdvlist li .abadvCon h4{
        font-size: 18px;
    }
    .abAdvlist li .abadvCon p{
        font-size: 14px;
    }
    .abAdvlist li .abadvCon{
        height: auto;
    }
    .innerAbout .aboutHonor{
        margin: 50px 0;
    }
    .innerTit{
        font-size: 24px;
        margin-bottom: 30px;
    }
    .innerFt{
        padding: 50px 0;
    }
    .innerFtcon .more{
        font-size: 16px;
        margin-top: 30px;
    }
    .innerFtcon h3{
        font-size: 30px;
    }
    .abAdvlist li .abadvCon{
        margin-bottom: 15px;
    }
    .aboutHonor li{
        width: 25%;
    }
    .aboutCom{
        margin: 0;
    }
}

@media screen and ( max-width: 768px) {

	.page_newsList li .img img {
		max-width: 120px;
		height: 114px;
	}
	.xg_news ul li .con {
		margin-left: 14px;
	}
}

