body{ margin:0; background: #fff;}
td,div,li,select,input,textarea{ font:14px/24px "微软雅黑"; color:#555;}
input{ line-height:1.3; color:#333}
a{ color:#555; text-decoration:none}
a:hover{ color:#333; text-decoration:underline}
ul{ list-style-type:none; padding:0; margin:0}
img{ border:0;}
.clear{ clear:both; font-size:0; line-height:0; height:0}

.wrap{ width: 1100px; margin: auto;}

.title{ position: relative; font: bold 60px/70px arial; color: #fdeeef; text-align: center; margin: 0 0 60px}
.title p{ display: block; font-size: 36px; position: absolute; left: 0; text-align: center; color: #000; top: 20px; width: 100%; margin: 0; font-family: 微软雅黑}
.title p span{ border-bottom: 5px solid #e60012; padding: 0 0 5px}

.header{ width: 1100px; margin: auto; height: 100px}
.logo{ float: left; width: 300px; padding: 20px 0 0; line-height: 0}
.logo img{ width: 100%}
.nav{ float: left;}
.nav ul{ overflow: hidden; margin: 36px 0 0 50px}
.nav li{ float: left; margin: 0 40px; font-size: 16px;}
.nav li a{ color: #e60012}

.banner{ position: relative; width: 100%; margin: 0 0 60px}
#bimg{ line-height: 0; display: block}
#bimg img{ width: 100% }
#bimgm{ display: none}
.nav-toggle{ display: none}
#backtop{ cursor: pointer; width: 58px; height: 55px; background: url(../images/backtop.png); position: fixed; bottom: 200px; right: 20px; z-index: 2000; opacity: .6}

.intro{ overflow: hidden; margin: 0 0 60px  }
.intro img{ float: left; margin: 0 80px 0 0}
.intro p{ margin: 0 0 18px; font-size: 16px; line-height: 26px}
a.more{ clear: both; display: block; width: 160px; margin: 40px auto 0; background: #e60012; color: #fff; text-align: center; height: 44px; border-radius: 5px; font-size: 18px; line-height: 44px }
a.more:hover{ text-decoration: none; background: #bc000f}
a.more2{ margin:0 auto}

.product{ margin: 0 0 60px}
.product ul{ overflow: hidden;}
.product ul li{ width: 21%; float: left; margin: 0 2% 44px}
.product ul li img{ width: 100%}
.product ul li p{ margin: 3px 0 0; text-align: center; font-size: 16px}

.coopb{ position: relative}
#coopprev,#coopnext{ width: 38px; height: 40px; text-align: center; cursor: pointer; position: absolute; background: #e60012; top: 90px; padding: 20px 0 0; border-radius: 6px}
#coopprev{ left: -50px}
#coopnext{ right: -50px}
#coopprev:hover,#coopnext:hover{ background: #bc000f}
#coopmain ul li{ width: 231px; margin: 0 22px 28px}
#coopmain ul li img{ width: 100%}


#footer{ background: url(../images/fbg.jpg) 50% bottom #e60012; padding: 50px 0 0}
.flogo{ float: left; margin: 20px 120px 0 0; width: 360px}
.flogo img{ width: 100%}
.finfo{ float: left; font-size: 16px; color: #fff; line-height: 30px; margin: 30px 0 0}
.finfo a{ color: #fff}
.finfo h3{ color: #fff; font-size: 20px; margin: 15px 0 10px; font-weight: normal}
.qrcode{ float: right; overflow: hidden; margin: 0 0 40px}
.qrcode div{ float: left; margin: 0 0 0 40px; width: 110px; line-height: 0;}
.qrcode div img{ width: 100%}
.qrcode div p{ margin: 5px 0 0; line-height: 24px; color: #fff; text-align: center}
.cr{ background: #bc000f; color: #fff; text-align: center; padding: 8px 5%}
.cr a{ color: #fff}
.nav-toggle{ display: none}


.btitle{ font:bold 30px/36px microsoft yahei; margin: 0 0 30px; color: #2571A6}
.bcontent{ font:16px/30px microsoft yahei; word-break:break-all; word-wrap:break-word;  }
.bcontent p{ margin:0 0 30px}
.pcontent{ font:16px/30px microsoft yahei; word-break:break-all; word-wrap:break-word; background:   #dfeaf2}
.pcontent p{ margin:0 0 30px}
.pcontent img{ width: 100%}
.pcontent #iir{ margin: 0 auto 30px; width: 750px}
#bgpager{ text-align:center; margin:0 0 30px}
#bgprev,#bgnext{ display:inline-block; width:60px; height:30px; text-align:center; background:#eee; font-size:30px; line-height:30px; border-radius:5px; cursor:pointer; margin:0 10px; font-family:宋体; color:#999}

.content{ padding: 40px 155px 40px; margin: 0 0 60px; border: 1px solid #eee}
.content p{ font-size: 18px; line-height: 36px; margin: 0 0 30px}
.content h3{ font-size: 42px; line-height: 1.2; font-weight: normal; color: #333; margin: 0 0 30px;}
.content img{ float: left; width: 350px; margin: 0 50px 0 0}
    
.tb{ width:380px; margin:auto; border-collapse:collapse; background:#fff}
.tb td{ padding:10px; border:1px solid #eee; word-break:normal; font-family:arial}
td.tbb{ width:100px}

@media only screen and (max-width: 736px){
  .wrap,.header{ width: 100%;}
  .header{ height: auto}
  .logo{ float: none; width: 250px; padding: 15px 5%}
  .intro{ width: 90%; margin: 0 auto 60px}
  .intro img{ float: none; margin: 0 0 20px; width: 100%; height: auto}
  #bimg{ display: none}
  #bimgm{ display: block; line-height: 0}
  #bimgm img{ width: 100%}
  
  .title{ margin: 0 5% 40px; font-size: 38px}
  .title2{ font-size: 28px}
  .title p{ font-size: 36px}
  #coopprev,#coopnext{ display: none}
  #coopmain ul li{ width: 188px; margin: 0 0 28px }
  #coopmain{ overflow: hidden}
  .product{ margin: 0 3% 6%}
  .product ul li{ width: 46%; float: left; margin: 0 2% 5%}
  #footer{ background-position: 0 0; padding: 40px 0 0}
  .flogo{ float: none; text-align: center; margin: 0 10% 20px; width: auto }
  .finfo{ float: none; margin: 0 10% 20px }
  .qrcode{ float: none; margin: 0 auto 40px}
  .qrcode div{ width: 30%; margin: 0 10%}
  .nav{ width: 100%; float: none; height:auto; padding: 0}
  .nav ul{ margin: auto; border-top: 1px solid #eee}  
  .nav ul li { float: none; width: 100%; padding:0; margin:0; border:0; text-align: left}
  .nav ul li a,.nav ul li a:hover{ color:#e60012; text-decoration: none}
  .nav a { color: #fff; width:100%; background: #fff; border-bottom: 1px solid #eee; padding: 5% 6%; font-size:18px; height:auto; display:block; box-sizing: border-box;}
  .nav ul ul a { display: block;}
  .js .nav { clip: rect(0 0 0 0); max-height: 0; position: absolute; display: block; overflow: hidden; zoom: 1;    z-index: 1000; }
  .nav.opened { max-height: 9999px; }
  .nav-toggle { display:block; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none;  -ms-user-select: none; -o-user-select: none; user-select: none;}
  .nav-toggle {  position: absolute; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-decoration: none; text-indent: -999px; overflow: hidden; width: 50px; height: 40px;  z-index:1000; top: 22px; right: 2%}
  .nav-toggle:before {
    color: #e60012; /* Edit this to change the icon color */
    font-family: Verdana, Geneva, sans-serif;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    font-size: 32px;
    text-transform: none;
    position: absolute;
    content: "≡";
    text-indent: 0;
    text-align: center;
    line-height: 36px;
    speak: none;
    width: 100%;
    top: 0;
    left: 0;
    z-index:1000
	}
  .nav-toggle.active::before{  font-size: 32px; line-height: 32px; content:"x";}
  
  .bcontent video{ width: 100%;}
  .bcontent img{ min-width: 100%}
  .cmain{ padding: 4%; border: 0}
  .pcontent #iir{ width: 92%}
  
  
  
  .content{ padding: 30px 0 20px; margin: 0 5% 5%; border:none}
  .content img{ max-width: 100%; float: none; margin: 0 0 5%}
  .tb{ width:100%}
  td.tbb{ width:80px}
  .tb td{ padding:5px;}
  .content h3{ font-size: 30px}
}
@media only screen and (max-width: 720px){
  .product ul li p{ font-size: 14px}
}