/* reset */

html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu{margin:0;padding:0;}

header,footer,section,article,aside,nav,hgroup,address,figure,figcaption,menu,details{display:block;}

table{border-collapse:collapse;border-spacing:0;}

caption,th{text-align:left;font-weight:normal;}

html,body,fieldset,img,iframe,abbr{border:0;}

i,cite,em,var,address,dfn{font-style:normal;}

[hidefocus],summary{outline:0;}

li{list-style:none;}

h1,h2,h3,h4,h5,h6,small{font-size:100%;}

sup,sub{font-size:83%;}

pre,code,kbd,samp{font-family:inherit;}

q:before,q:after{content:none;}

textarea{overflow:auto;resize:none;}

label,summary{cursor:default;}

a,button{cursor:pointer;}

h1,h2,h3,h4,h5,h6,em,strong,b{font-weight:bold;}

del,ins,u,s,a,a:hover{text-decoration:none;}

body,textarea,input,button,select,keygen,legend{font:12px/1.14 arial,\5b8b\4f53;color:#333;outline:0;}

body{background:#fff;}

a{ color: #ccc; }

a:hover{ color: #63a71f; }

html,body{ overflow-x: hidden ; width: 100%; }

.f-fl{ float: left; }

.f-fr{ float: right; }

.f-cc{ clear: both; }

.f-mb50{ margin-bottom: 50px; }

.f-tar{ text-align: right; }

/* 布局 */

body{ background: url(content-bg.png) #000; overflow-x: hidden; font-family: "microsoft yahei"; font-size: 13px; color: #989bae; }

.g-wraper{ width: 1200px; margin-left: auto; margin-right: auto; line-height: 26px; }



.m-title{ color: #63a71f; font-weight: normal; font-size: 30px; overflow: hidden; zoom: 1; margin-bottom: 20px; margin-top: 100px; line-height: 30px; text-align: center; position: relative; }

.m-title span{ background: url(content-bg.png); }

.m-title hr{ margin-top: 13px; }

hr{ height: 0; border: none; border-top: 1px dashed #2d2f34; border-bottom: 1px dashed #474954; margin-top: 10px; margin-bottom: 10px; }



/* header */

.m-top{ width: 100%; line-height: 30px; height: 30px; padding: 5px 0; background: #fff; overflow: hidden; zoom: 1; }

.m-top .nav{ width: 1200px; margin-left: auto; margin-right: auto; }

.m-top img{ height: 30px; }

.m-top a{ float: left; margin-right: 20px; color: #666; }

.m-top a:hover{ color: #19A97B; }

/* footer */

.m-footer{ text-align: center; background: #2c2f38; line-height: 24px; padding: 30px 0; color: #adafba; font-size: 12px; }

.m-footer .links{ margin-bottom: 20px; }

.m-footer a{ color: #ccc; margin: 0 5px; }

.m-footer a:hover{ color: #19A97B; }



/* banner */

.m-banner{ height: 568px; background: url(Banner.jpg) center no-repeat; }



.m-daoyu{ padding: 40px; margin-top: 30px; border-radius: 5px; background: #32353f; font-size: 17px; line-height: 30px; }



/*part1*/

.m-part1{ overflow: hidden; zoom: 1; margin-bottom: 30px; }

.m-part1 .item{ width: 386px; overflow: hidden; float: left; margin-right: 20px; margin-top: 30px; }

.m-part1 .item.last{ margin-right: 0; }

.m-part1 .img{ position: relative; height: 250px; background: #222; overflow: hidden; border-radius: 3px; }

.m-part1 .img img{ position: absolute; z-index: 1; display: block; height: 100%; width: 100%; }

.m-part1 p{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; padding: 20px; color: #989bae; font-size: 16px; }

.m-part1 dt{ text-align: center; margin-top: 5px; font-size: 16px; margin-top: 5px; }



/*part2*/

.m-part2{ height: 420px; position: relative; background: url(part2.png); }

.m-part2 dl{ width: 35%; margin-top: 20px; position: absolute; }

.m-part2 dt{ font-size: 20px; color: #19A97B; line-height: 40px; }

.m-part2 .title{ font-size: 16px; color: #fff; margin-bottom: 5px; }

.m-part2 .item1{ left: 30px; top: 0; }

.m-part2 .item2{ right: 0; top: 0; }

.m-part2 .item3{ left: 30px; bottom: 30px; }

.m-part2 .item4{ right: 0; bottom: 30px; }



/*part1*/

.m-part3{ overflow: hidden; zoom: 1; margin-bottom: 30px; margin-bottom: 100px; }

.m-part3 .item{ width: 346px; overflow: hidden; float: left; margin-right: 20px; background: #222;  padding: 20px; border-radius: 3px; }

.m-part3 .item.last{ margin: 0; }

.m-part3 dt{ font-size: 18px; color: #fff; margin-top: 10px; margin-bottom: 5px; }

.m-part3 dt span{ font-size: 150%; margin-right: 5px; color: #ffa224; }

.m-part3 .item .text{ height: 110px; }



@media screen and (max-width:768px){

		.m-banner{ max-height: 300px; background-position: bottom center; background-size: auto 100%;  }

      .g-wraper{ width: auto; padding: 0 10px; }

      .m-part1 img,.m-part4 img{ width: 100%; }

      .m-part1 .item{ width: 100%;  }

      .m-part1 .item img{ height: auto; }

      .m-part2{ height: auto; background: none; }

      .m-part2 dl{ position: static; width: auto; }

      .m-part3 .item{ width: auto; margin-right: 0; margin-bottom: 20px; }

      .m-part3 .item img{ width: 100%; } 

}