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

#intro { position:relative; height:400px; overflow:hidden; background:url(../image/hp_introbg.jpg); background-size:100% auto; }
#intro .content { position:relative; width:960px; height:100%; margin:auto; padding:80px 0; border:0px solid #f00; }

#intro .smartdevice { position:absolute;  width:360px; border:0px solid #f00; }

#intro .info { position:absolute; right:0; width:500px; border:0px solid #f00; }
#intro .info h3 { font:25px/1em "微软雅黑"; color:#555; margin-bottom:1em; }
#intro .info p  { font:15px/1.4em "微软雅黑"; color:#666; }
#intro .info .btn { font:13px/1em "微软雅黑"; color:#444; display:inline-block; margin:35px 10px 0 0; padding:10px 25px; border:1px solid #2DB245; border-radius:8px; transition:all 0.3s ease; }
#intro .info .btn:hover { background:#2DB245; color:#fff; }

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

#feature { overflow:hidden; border:0px solid #f00; }
#feature .content{ width:1000px; margin:5% auto; border:0px solid #f00;}
#feature .content:after{ display:block; content:""; clear:both;}
#feature .content h2 { font:22px/60px "微软雅黑"; color:#111; text-indent:10px; }
#feature .content > div { float:left; width:49.5%; min-height:110px; position:relative; border:0px solid #f00;}
#feature .content > div img { position:absolute; left:20px; top:30px; }
#feature .content > div h3  { position:relative; font:20px/1.2em "微软雅黑"; color:#0487c4; padding:30px 20px 10px 120px;}
#feature .content > div p   { position:relative; font:14px/1.3em "微软雅黑"; color:#555555; padding:0px 20px 30px 120px;}

/*
#feature .content > div { float:left; width:49.5%; min-height:110px; padding-top:30px; position:relative; border:0px solid #f00;}
#feature .content > div img { position:relative; width:150px; margin:auto; display:block; }
#feature .content > div h3  { position:relative; font:20px/1.2em "微软雅黑"; color:#0487c4; padding:10px 80px; text-align:center; }
#feature .content > div p   { position:relative; font:15px/1.3em "微软雅黑"; color:#555555; padding:0px 80px 30px;}
*/

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

#community { background:#eee; }
#community .content { width:960px; margin:auto; }

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

@media (min-width:1200px){
  #header .wrap { width:1200px; }
  #intro { height:500px; }
  #intro .smartdevice { width:400px; }
  #intro .content { width:1200px; padding:120px 0; }
  #intro .info { top:140px; width:650px; }
  #intro .info .btn { margin-top:45px; }
  
  #feature .content{ width:1250px; }
  #feature .content > div { width:49.5%; }
  #feature .content > div img { left:30px; top:30px;}
  #feature .content > div h3  { font:20px/1.2em "微软雅黑"; color:#0487c4; padding:30px 40px 10px 130px;}
  #feature .content > div p   { font:14px/1.3em "微软雅黑"; color:#555555; padding:0px 40px 30px 130px;}
}

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

.overlay{ display:none; position:fixed; left:0; top:0; z-index:200; width:100%; height:100%; background:url(../image/bg-black70.png); }

.overlay .wx{ position:absolute; left:50%; top:50%; width:600px; height:280px; margin-left:-300px; margin-top:-220px; text-align:center; opacity:0;}
.overlay .wx img { display:block; width:240px; margin:0 auto 15px;}
.overlay .wx span{ font:12px/1em "微软雅黑"; padding:6px 10px; background:#fff; border-radius:20px;}

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