@charset "utf-8";
/* CSS Document */
@media (max-width: 768px){
	.max{ padding-left:2% !important; padding-right:2% !important; box-sizing:border-box; max-width:100%;}
	
	.header{ padding:8px 2% 14px 2%;}
	.header.header{ background:none;}
	.header .logo{ max-width:80%;}
	.header .logo img{ max-height:70px; height:auto;}
	.headline{ display:none;}
	.iconnav-list:before{ font-size:50px; color:#333; line-height:64px;}
	#dh{ display:block; color:#fff; margin-right:0px; max-width:15%; text-align:right;}
	
	nav{ position:absolute;  top:90px; left:0px; width:100%; max-width:100%; margin-top:0px; z-index:9999;}
	.nav{ position:absolute; float:left; background:rgba(0,0,0,0.55); height:0px; z-index:20; top:0px !important; right:0px;width:100%; margin:0px;max-width:40%; padding:0px !important;overflow:hidden;}
	.nav li{ float:left; max-width:100%; width:100%; text-align:center; padding:10px 0px; border-bottom:3px solid transparent;}
	.nav li a{border-bottom:0px; padding:0px; color:#fff;}
	.nav:hover{ overflow:visible;}
	.nav .nav_column:hover>a{ border-bottom:0px;}
	
	.banner li img,.banner{ height:450px;}
	
	section.advantage{padding-top:70px;}
	.adv_b{ margin-top:0px;}
	.adv_b .picture{max-width:100%;}
	.adv_b .picture img{ height:auto; width:100%;}
	.adv_b .content{ margin-top:0px; max-width:100%; padding:40px 4%;}
	.adv_b .content .title{ text-align:center;}
	.adv_b .content .text{ text-align:center;}	
	
	.pro_b{ margin-top:30px;}
	section.features{ padding-bottom:20px;}
	.feat{ max-width:calc(100% / 3); margin:0px 0px 28px 0px !important; float:left !important;}
	.feat .number{max-width:100%;width:100%; text-align:center;}
	.feat .content{ max-width:100%; margin:0px; text-align:center; width:100%;}
	.feat_b{ background:none;}
	
	section.about{ padding:0px 2%;}
	.about_l{ max-width:100%; padding:0px;}
	.about_l .title{ text-align:center;}
	.about_l .title::after{ margin:12px auto 0px auto;}
	.about_r{ position:static; max-width:100%;width:100%;}
	.about_r img{ height:auto;}
	.news_l{ max-width:100%; margin:20px 0px;}
	.news_r{ max-width:100%}
	section.news{ background:none; margin-bottom:30px;}
	
	.footer_b .max{ display:block;}
	.footer_b .url{ max-width:100%}
	.footer_b .code{ max-width:100%; margin-top:30px;}
	.footer_b .contact{ max-width:100%; padding-left:0px;}
	
	



	
	.page_address .page_column{ max-width:100%; width:100%; margin-top:15px;}
	.page_address .address{ float:left; max-width:100%; width:auto;}
	.page_ban .banner img{ height:250px;}
	.page_address .page_column a{ margin:0px 10px;}
	.page_news{ margin-top:20px;}
	.page_news li{ display:block; padding-bottom:20px;}
	.page_news li .picture{ max-width:100%; width:100%; border:0px;}
	.page_news li .picture img{ height:auto;}
	.page_news li .content{ max-width:100%; padding:0px 3%; box-sizing:border-box}
	.page_news li .time{ max-width:100%; padding:0px 3%; box-sizing:border-box;}
	.page_news li .time time{ float:left;}
	.page_news li .time .more{ float:right; margin-top:0px;}
	.page_news li .content .title{ margin-top:15px;}
	.page_news li .content .text{ margin-top:12px;}
	.page_news li .time{ margin-top:20px;}
	
	.page_about ul li{ max-width:calc(100% / 4 - 10px); margin-bottom:15px;}
	.page_about ul li:nth-of-type(4){ margin-right:0px;}
	.page_art li{ max-width:50%;}
	.page_art ul{ display:flex; flex-wrap:wrap;}
	.page_art li .picture img{ height:100%;}
	.page_art li:nth-of-type(odd) .picture{order:0 !important;}
	.page_art li:nth-of-type(even) .picture{order:1 !important;}
	.page_art li:nth-of-type(even) .picture::before{border-left-color:#fff !important;border-right-color:transparent !important; left:0px; right:auto !important;}
	.page_art li:nth-of-type(odd) .picture::before{border-right-color:#fff !important;border-left-color:transparent !important; right:0px; left:auto !important;}
	.page_show li{ max-width:48%; margin-right:0px; margin-bottom:20px; text-align:center;}
	.page_show li:nth-of-type(even){float:right;}
	.page_show li:nth-of-type(n+5){ display:none;}
	.page_show li img{ width:auto; display:block; float:none; height:auto; max-height:400px;}

	.sj_footer{ display:block; z-index:20;}
	footer.footer{ padding-bottom:80px;}
}

@media (max-width: 425px){
	header.header{padding:18px 2% 22px 2%; box-sizing:border-box;}
	.header .logo img{ height:50px;}
	.iconnav-list:before{ font-size:40px; line-height:normal;}
	.dh{ line-height:normal; height:auto;}
	
	.banner li img,.banner{ height:200px;}

	.often{ margin:25px auto 15px auto;}
	.often .title{ font-size:20px;}
	.often .text{ font-size:16px;}

	.adv_b .content{ padding:20px 4%;}
	.adv_b .content .title{ font-size:20px;}
	.adv_b .content .text{ font-size:14px; margin-top:10px;}
	.adv_b .content .class li{ max-width:49%; margin-right:0px; margin-bottom:10px;}
	.adv_b .content .class li:nth-of-type(even){ float:right;}
	section.advantage{ padding-bottom:0px;}
	.pro_column li{ float:left; margin-bottom:10px; transform:skew(0deg); max-width:48%; margin:0px 0px 10px 0px; box-sizing:border-box;}
	.pro_column li:nth-of-type(even){ float:right;}
	.pro_b{ margin-top:10px;}
	.pro_column li .title{ transform:skew(0deg);}
	
	.pro_b ul li{ margin:0px 60px;}
	.feet{ margin:28px 0px 0px 0px !important}
	.feat .number{ font-style:normal; font-size:30px;}
	.feat .title{ font-size:20px; margin-top:10px;}
	
	.case_b li{ margin:0px 60px;}
	.onck{ margin-top:35px !important;}
	
	.about_l .title{ font-size:18px; margin-top:20px;}
	.about_l .content{ margin-top:20px; font-size:13px; line-height:26px;}
	.about_l .honor .picture{ max-width:100%;}
	.about_l .honor .picture img{ height:auto;}
	.about_l .honor .picture:nth-of-type(n+2){ display:none;}
	.about_r{ display:none;}
	
	.news_l .content{ position:static; float:left; overflow:hidden; padding:15px 2%;}
	.news_r .content .text .intor{ max-height:36px;}
	.news_l .content .text{ margin-top:15px;}

	.footer_b .contact .con_b .picture{ max-width:100%;}
	.footer_b .contact .con_b .content{ max-width:100%; text-align:center; margin-left:0px; margin-top:15px;}
	.footer_b .code{ display:none;}

	.page_pro li{ max-width:48%; margin-right:0px; margin-bottom:15px;}
	.page_pro li:nth-of-type(even){float:right;}
	.page_pro li .title{ padding:14px 0px; font-size:14px;}
	.page_pro li .picture img{ height:180px;}
	.page_about ul li{ max-width:49%; margin-right:0px;}
	.page_about ul li:nth-of-type(even){ float:right;}
	.page_about ul li:nth-of-type(n+7){ display:none;}
	.page_art li{ max-width:100%;}
	.page{ padding-bottom:40px;}
	.copy_r{ float:left;}
	.page_odd{ margin-top:30px;}
	.page_odd .content{ margin-top:25px;}
	
}
@media (max-width: 375px){
	header.header{ padding:14px 2% 16px 2%}
	.banner li img,.banner{ height:180px;}
	
	.about_t .content .intor{ text-align:center; margin-top:20px;}
	.about_t .content .title{text-align:center;}
	.pro_b ul li{ margin:0px 35px}
	
	.case_b li{ margin:0px 35px;}
	.news_l .picture img{ height:auto;}
	.news_r li{ padding:15px 0px;}
	.footer_b .url{ padding-right:0px;}
	.footer_b .contact{ padding-top:25px;}

	.list{ margin-top:10px;}
	.page{ padding-bottom:35px;}
	.copyright *{ font-size:12px;}
	
	.page_often{ margin-bottom:25px}
	.page_often span{ font-size:20px;}
	


}



@media (max-width: 320px){
	.pro_b li{ margin:0px 12px 20px 12px;}


}

