/* ==========================================================================

   Global

   ========================================================================== */

html { font-size: 62.5%; }

a { color: #333; }

a:hover { color: #d4111f; }

body { color: #333; font: 12px/1.7 Arial, Helvetica, sans-serif; background: #fff; }

.wrapper{max-width:1200px; margin:0 auto;}

a:focus{outline:none;}

/* ==========================================================================

   Header

   ========================================================================== */

header {width: 100%; }

.head{ width:1200px;margin:0 auto;height:100px; position: relative; z-index: 99; overflow: hidden; }

.logo {float: left;margin-top: 10px; }

.head .headrig{float: right; text-align: right;max-width: 500px;}

.weblink{font:14px/18px microsoft yahei;margin-top: 28px;}

.weblink a{margin:0 5px;}

.toptel{font:14px/18px microsoft yahei;height: 40px;margin-top: 10px; }

.toptel .fa{color: #dd0111;margin-left: 30px;}



/* ==========================================================================

   Nav

   ========================================================================== */

.navbar {width:100%;

  background:#8f9091;

  background-image: -webkit-linear-gradient(top,#8f9091 0%,#a6a6a7 100%);

  background-image: -moz-linear-gradient(top,#8f9091 0%,#a6a6a7 100%);

  background-image: linear-gradient(top,#8f9091 0%,#a6a6a7 100%);

  filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, EndColorStr='#8f9091', StartColorStr='#a6a6a7');

}

/* primary */

.navbcon{width:1240px; margin: 0 auto;position: relative; z-index: 99;}

.globalnav { }

.globalnav li { float: left;height:40px;text-align: center; background: url(../images/inco_jg.jpg) left 14px no-repeat; }

.globalnav li a { display: block; color: #fff; font:14px/40px microsoft yahei;padding:0 8px; }

.globalnav li:hover{border-bottom: 2px solid #d51121;height: 38px;}

.globalnav li.active {border-bottom: 2px solid #d51121;height: 38px;}

.globalnav .dropdown { position: absolute; top:40px;z-index: 99; background: #fff; display: none; padding:15px 50px;border-bottom: 2px solid #d51121;}

.globalnav .dropdown a { white-space: nowrap; line-height: 40px; color: #333; padding-bottom: 0; border-bottom: 0 none; padding-left: 0; padding-right: 0; font-weight: 300; }

.globalnav .dropdown a:hover { color: #d51120;}

.globalnav .dropdown .dr_rig{float: left; text-align: left; border-right: 1px solid #9a9b9c;padding-right:50px;}

.globalnav .dropdown .pic{float: right;margin-left: 40px;}



#gn_00 { margin-left: 0; }

#gn_06 .dropdown{width:400px;right: 0;}

#gn_05 .dropdown{right: 0;}





/* ==================================

   banner

   ================================== */

.banner { position: relative; min-width: 1000px; width: 100%; height:575px; overflow: hidden;}

.banner .bd li a { position: absolute; left: 0; top: 0; overflow: hidden; background-position: 50% 50%; background-repeat: no-repeat; width: 100%; height: 575px; }

.banner .hd { position: absolute; width: 100%; left: 0; text-align: center; bottom: 10px; }

.banner .hd ul { display: inline-block; *display:inline;zoom: 1; }

.banner .hd li { float: left; cursor: pointer; width: 50px; height: 5px; margin: 0 4px; background: #fff;

  -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);

  -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);

  -ms-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);

  -o-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);

  box-shadow: 3px 3px 3px rgba(0,0,0,0.12)

}

.banner .hd .on { background: #d01010;}

.prev,.next { position: absolute; top: 50%; cursor: pointer; -webkit-transition: all 300ms; -moz-transition: all 300ms; transition: all 300ms; }

.tempWrap { margin: 0 auto; }

.banner .prev,

.banner .next { margin-top: -30px; }

.banner .prev .fa,

.banner .next .fa { font-size: 50px; color: #fff; line-height: 60px; text-shadow: 1px 1px 3px rgba(0,0,0,.2); }

.banner .prev { left: 2%; }

.banner .next { right: 2%; }

.banner .prev:hover .fa,

.banner .next:hover .fa { color: #e60012; }

/* ==========================================================================

   Content

   ========================================================================== */

.home_about{width: 100%;padding:40px 0;}

.hometit{font: 300 30px/30px microsoft yahei; text-align: center;padding-bottom: 30px;}

.home_about .mode01{width: 870px; height: 350px; overflow: hidden; float: left;}

.home_about .mode01 .imgarea{width: 380px; height: 350px; overflow: hidden; float: left;-webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  -ms-border-radius: 4px;

  -o-border-radius: 4px;

  border-radius: 4px;}

.home_about .mode01 .imgarea img{width: 380px;height: 350px;transition: transform 2s;}

.home_about .mode01 .imgarea:hover img{ transform: scale(1.1);} 

.home_about .mode01 .txtarea{width: 450px; height: 350px; overflow: hidden; float: right;font: 300 14px/26px microsoft yahei;}

.home_about .mode01 .txtarea .desc{height: 208px; overflow: hidden;margin:20px 0 ;}

.home_about .mode01 .txtarea h2{font: 300 18px/24px microsoft yahei;margin-top: 20px;}

.home_about .mode01 .txtarea a.more{border:1px solid #d5d3d3;display: block;font: 300 14px/40px microsoft yahei;width: 200px;text-align: center;}



.focusBox { position: relative; width: 280px; height: 340px; overflow: hidden;  background:#fff; float: right;padding:5px;

  border:1px solid #d9d9d9; -webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);

  -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);

  -ms-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);

  -o-box-shadow: 3px 3px 3px rgba(0,0,0,0.12);

  box-shadow: 3px 3px 3px rgba(0,0,0,0.12)



 }

 .focusBox .pic {width: 280px; height: 340px; line-height: 340px;text-align: center;}

.focusBox .pic img {height: 340px;width:280px; } 

.focusBox .num { position: absolute; z-index: 999; bottom: 8px; width: 100%; height:15px;text-align: center;} 

.focusBox .num li{ width: 10px; height: 10px; display: inline-block;overflow: hidden; text-align: center; margin-right: 1px; cursor: pointer; background: #e0dfdf;

  -webkit-border-radius: 10px;

  -moz-border-radius: 10px;

  -ms-border-radius: 10px;

  -o-border-radius: 10px;

  border-radius: 10px;

} 

.focusBox .num li.on{background: #d51120;}



.home_product{width: 100%;padding:70px 0; background: #f2f3f6;}

.dh ul{position: relative;overflow: hidden;width: 1200px;height: 300px;margin: 0 auto;}

.dh ul li{float: left;width: 158px;overflow: hidden;height: 100%;position: relative;cursor: pointer;border-right: 1px solid #fff;}

.dh ul li a{display: block;width: 100%;height: 100%;}

.dh ul li .layer{position: absolute;bottom: 0;left: 0;width: 100%;background:rgba(0,0,0,0.7);height: 100%;}

.dh ul li .layer .p1{position: absolute;bottom: 119px;left: 50px;}

.dh ul li .layer .p2{position: absolute;bottom: 50px;right: -250%; border:3px solid #c8c8c8;width:320px; height: 150px;padding-top: 50px; overflow: hidden;display: block; text-align: center;}

.dh ul li .layer .p2 b,.dh ul li .layer .p2 span{display: block;font-weight: bold;font-size:16px;}

.dh ul li .layer .p1 b,.dh ul li .layer .p1 span{display: block;font-weight: bold;font-size: 14px;}

.dh ul li.curr{}

.dh ul li .layer .p2 a.col1{color: #fff; background: #d51120;display: block;width: 150px; height: 34px;margin:30px auto 0 auto; text-decoration: none;

  font: 300 14px/34px microsoft yahei;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  -ms-border-radius: 4px;

  -o-border-radius: 4px;

  border-radius: 4px;

}

.col2{color: #fff; font: 300 20px/34px microsoft yahei;}



.home_contact{width: 100%;padding:40px 0; background: #566987;color: #fff;}

.home_contact .mode01{width: 310px; height: 185px; overflow: hidden; float: left;}

.home_contact .mode01 .img{width: 310px;height: 185px;}

.home_contact .mode02{width: 450px; height: 185px; overflow: hidden; float: left;margin-left: 60px;font: 300 12px/24px microsoft yahei;}

.home_contact .mode02 h2{font: 300 24px/24px microsoft yahei;text-transform:Uppercase;margin-bottom: 20px;}

.home_contact .mode02 .tel{float: left; width: 40%;}

.home_contact .mode02 .addr{float: left;width: 60%;}

.home_contact .mode03{width: 310px; height: 185px; overflow: hidden; float: right;}

.home_contact .mode03 .img{width: 310px;height: 185px;}



/* ==========================================================================

   Footer

   ========================================================================== */

footer { color: #424141; font-size: 12px; background: #fff; font-family: microsoft yahei; padding-top:20px;}

footer a { color: #424141; }

footer a:hover { text-decoration: underline; }

.footer-nav { text-align: justify; }

.footer-nav:after { content: ""; width: 100%; display: inline-block; font-size: 0; line-height: 0; }

.fn-col { display: inline-block; *display:inline;zoom: 1; vertical-align: top; *padding-right: 100px; }

.fn-col h3 {  margin-bottom: 10px; font: 300 15px/24px microsoft yahei;}

.fn-col h3 a { color:#424141;}

.fn-col h3 a:hover { color: #d51120; }

.fn-col ul {}

.fn-col li { line-height: 24px; }

.fn-col li a { color: #424141;  }

.fn-col li a:hover { color: #d51120; }

.fn_ewm{width:260px;}

.fn_ewm .mode01{height: 130px;margin-bottom: 10px;}

.fn_ewm .mode01 .img{float: left;margin-right:10px;}

.fn_ewm .mode01 .img{width: 130px;height: 130px;}
.fn_ewm .mode01 .img img{max-width: 100%;}

.fn_ewm .mode01 .txt{float: left; font-size: 14px;padding-top: 45px;}

.fn_ewm .mode02 a:hover img{filter: alpha(opacity=80);opacity: 0.8;}

.footbd{color: #fff;font: 300 13px/24px microsoft yahei; padding:20px 0; text-align: center;border-top: 1px solid #7e7c7d; background: #1d1d1d;}

.footbd a{ color: #fff;}





.mohead{display: none;}

.mohead{position:relative; height:50px;}

.mohead .logo{display:block;width: calc(100% - 160px);margin-top: 0; height:50px;line-height:50px;position:absolute;top:0;left:10px;z-index:9;}

.mohead .logo img{height: 40px;}

.banner .bd li a.moimg{display: none;}





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

.dh ul{width: 100%;height:auto;}

.dh ul li{width: 100% !important;}

.dh ul li img{width: 100%;}

.dh ul li .layer{width: 100%;margin:0 auto; height:100% !important;}

.dh ul li .layer .p2 { position: absolute; bottom: 50px; right: 10%; width: 80%;}

.dh ul li .layer .p1 {display: none;}

.home_about .mode01 { width: 100%; height: auto; overflow: hidden; float: none;}

.banner{min-width:320px;}

.pchead,.navbar{display: none;}

.mohead{display: block;}

.home_about .mode01 .txtarea{width: 100%;float: left;}

.focusBox{float: none;margin:0 auto;}

.home_about .mode01 .imgarea { width: 100%; height: auto; overflow: hidden; float: none;}

.home_about .mode01 .imgarea img{width: 100%; height: auto;}

.home_about{padding:20px 10px;width: calc(100% - 20px);}

.home_contact .mode01 { width: 100%; height: 185px; overflow: hidden; float: none;margin-bottom: 20px;}

.home_contact .mode01 img{max-width: 100%;}

.home_contact .mode02 ,.home_contact .mode03{width: 100%;    height: auto;    float: none;    margin-left: 0;}

.home_contact .mode03 img{max-width: 100%;margin-top: 20px;}

.home_contact{padding:20px 10px;width: calc(100% - 20px);}

.fn-col ul,.fn_ewm .mode01{display: none;}

footer{margin:0 20px;}

.footbd{padding:20px;}

.footbd .fl,.footbd .fr{float: none;}

.banner .bd li a.moimg{display: block;}

.banner .bd li a.pcimg{display: none;}

.banner .bd li a{height: 200px;background-size: cover;}

.banner{height: 200px;}

}