/***
 *	Powered By Wencheng 2020-07-15
***/

body{ font-family:Microsoft Yahei,tahoma,arial,simsun; font-size:16px; background:#fff; color:#252525;}
body,p,h1,h2,h3,h4,h5,ul,li{ padding:0; margin:0;}
a,a:visited{ color:#333; text-decoration:none;}
li{ list-style-type:none;}
img{ border:0; vertical-align:middle; max-width:100%;}

header{ background:#C81623; height:45px; color:#fff; position:relative;}
header h2 img{ margin-left:10px; height:45px;}
header span.right{ width:45px; height:45px; position:absolute; right:0; top:0; background:url("btn.png") no-repeat center center; background-size:80%; transform:rotate(0deg); -ms-transform:rotate(0deg); /* IE 9 */ -moz-transform:rotate(0deg); /* Firefox */ -webkit-transform:rotate(0deg); /* Safari บอ Chrome */ -o-transform:rotate(0deg);}
header span.right.on{ background:url("btn-on.png") no-repeat center center; background-size:55%; transform:rotate(135deg); -ms-transform:rotate(135deg); /* IE 9 */ -moz-transform:rotate(135deg); /* Firefox */ -webkit-transform:rotate(135deg); /* Safari บอ Chrome */ -o-transform:rotate(135deg);}
nav{ background:#C81623; width:100%; position:absolute; left:0; top:45px; right:0; z-index:9999; height:0; overflow:hidden;}
nav a,nav a:visited{ width:50%; color:#fff; margin-top:20px; display:block; float:left; text-align:center; white-space:nowrap; overflow:hidden;}
header span.right,header span.right.on,nav{ -webkit-transition:all 0.3s linear; -ms-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; transition:all 0.3s linear;}
.menu{ padding:0 4%;}

section{ margin:20px auto 0;}
section h2{ margin:0 8%; text-align:center; font-size:20px; font-weight:normal; background:url("line-bg.png") repeat-x center center;}
section h2 span{ padding:0 9px; background:#fff;}
section p{ text-align:center; font-size:14px; color:#999; padding:3px 0 15px;}
.advantage,.intro{ padding:0 4%; overflow:hidden;}
.advantage h4{ float:left; position:relative; z-index:88; width:23.5%; margin-right:2%;}
.advantage h4.right,.service li.right{ margin-right:0;}
.advantage h4 span{ font-size:12px; font-weight:normal; display:block; width:100%; text-align:center; line-height:24px; position:absolute; left:0; bottom:0; opacity:0.9; background:#f9f9f9;}
.section-bg{ background:#f6f6f6; padding:12px 0;}
.section-bg h2 span{ background:#f6f6f6;}
.product h4{ width:49%; margin:0 2% 2% 0;}
.product h4 span{ font-size:13px; color:#fff; opacity:1; background:transparent; background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8)); height:21%; padding-top:12%;}

.service li{ padding:8px 4% 12px; overflow:hidden;} 
.service li.bg{ background:#f6f6f6;} 
.service li img{ float:left; width:50px; margin:11px 6px 0 0;} 
.service li h4{ font-size:16px; padding-left:60px;} 
.service li p{ text-align:left; font-size:14px; color:#666; padding:2px 0 0 60px;} 

.case h4 span{ font-size:14px; height:16%; padding-top:16%;}

.intro{ margin-bottom:6px;}
.intro p{ text-align:left; font-size:16px; color:#666; line-height:150%; padding:0 0 16px;}
.about h4.mpc{ width:100%; margin-right:0; overflow:hidden;}

.step{ padding:0 12%;}
.step h4{ width:28%; margin-right:8%;}
.step h4 span{ font-size:17px; color:#555; padding:5px 0 15px; position:static; opacity:1; background:transparent;}

section h3{ font-size:20px; font-weight:normal; text-align:center;}
footer{ padding:16px 0; margin-top:30px; text-align:center; background:#141620; color:#fff;}
footer p{ line-height:170%; font-size:16px;}
footer a,footer a:visited{ color:#fff;}

.pc{ display:none;}

@media (min-width:768px){
.header,nav,section h2,section p,.advantage,.service,.footer{ width:1190px; margin:0 auto; padding:0;}
header{ width:100%; background:#fff; height:80px; line-height:80px; color:#252525; padding:10px 0; overflow:hidden;}
header h2{ float:left;}
header h2 img{ margin:12px 0 0; height:56px;}
header span.right{ display:none;}
nav{ float:right; width:880px; height:100px; background:#fff; position:static; top:auto; right:auto;}
nav a,nav a:visited{ width:auto; color:#252525; font-size:18px; margin:0 0 0 40px;}
nav a:hover{ color:#cc1b1b; text-decoration:none;}
.menu{ float:right; padding:0;}
.banner{ background:url(banner.jpg) no-repeat center top; width:100%; height:500px;}
.banner img{ display:none;}

section{ margin:36px auto 0; overflow:hidden;}
section h2{ font-size:32px; margin:0 auto;}
section h2 span{ padding:0 30px;}
section p{ font-size:20px; color:#999; padding:8px 0 22px;}
.advantage h4 span{ font-size:20px; line-height:60px;}
.section-bg{ padding:30px 0;}
.product h4{ width:32%; margin:0 2% 2% 0;}
.product h4.right{ margin-right:2%;}
.product h4.pcright,.service li.right{ margin-right:0;}
.product h4 span{ font-size:18px; height:16%; line-height:44px; padding-top:9%;}

.service li{ padding:2%; float:left; width:28%; margin:0 2% 3% 0; background:#f6f6f6;} 
.service li img{ width:60px; margin:38px 6px 0 0;} 
.service li h4{ font-size:24px; padding-left:80px;} 
.service li p{ width:auto; font-size:18px; line-height:170%; padding:12px 0 0 80px;}
.service li.pcleft{ margin-left:17%;} 
.service li.pcbottom{ margin-bottom:0.5%;} 

.case h4{ width:23.5%; margin-right:2%;}
.intro{ margin-bottom:16px;}
.intro p{ text-align:center; font-size:18px; color:#666; line-height:170%; padding:0 0 20px;}
.intro p.big{ font-size:32px;}
.about h4.mpc{ width:32%; margin-right:2%;}

.step{ width:1024px;}
.step h4{ width:129px; margin:8px 0 0 0;}
.step h4 span{ font-size:20px; line-height:normal;}
.step h5{ float:left; margin:52.5px 30px 0 0; border-left:20px solid #15968f; border-top:20px solid transparent; border-bottom:20px solid transparent;}

section h3{ font-size:36px;}
footer{ padding:50px 0; margin-top:60px;}
.footer{ background:url("gzh.png") no-repeat right top; background-size:440px; height:120px;}
.footer p{ line-height:210%; font-size:16px; text-align:left;}
.footer p span{ margin-left:16px; display:inline;}
.footer p.pcfooter{ margin-top:20px;}
.footer p.pcright{ float:right; font-size:14px;}
.footer p.pcright span.right1{ margin-left:73px;}
.footer p.pcright span.right2{ margin:0 30px 0 95px;}

.pc{ display:block;}
.mobile{ display:none;}
}