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

*{ margin:0; padding:0; box-sizing:content-box;}
li { list-style:none; }
a { text-decoration:none; color:#000; }
body{ background:#fafafa; }

.hide { display:none !important; }

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

#header{ position:relative; width:100%; height:80px; background:#fff; border:0px solid #f00; }
#header .wrap{ position:relative; width:960px; height:100%; margin:auto; border:0px solid #f00;}

#header h1{ position:absolute; display:inline-block; font:21px/80px "微软雅黑"; color:#666; border:0px solid #f00;}
#header h1 img{ width:30px; margin:20px 15px 20px 0; vertical-align:middle; border:0px solid #f00; }
#header h1 a { color:#666; }

#header .menu { position:absolute; right:110px; top:25px; height:30px; }
#header .menu li { float:left; border:0px solid #f00; }
#header .menu li a { display:block; font:17px/20px "微软雅黑"; color:#777; padding:5px 13px; border-radius:15px; margin-left:8px; transition:all 0.3s ease; }
#header .menu li a:hover { background:url(../image/bg-black05.png); color:#555; }
#header .menu li a.active { background:url(../image/bg-black05.png); color:#555; }

#header ul.tools{ position:absolute; right:0; top:20px; border:0px solid #f00;}
#header ul.tools li{ float:left; display:block; border:0px solid #f00; }
#header ul.tools li a{ display:block; margin-left:10px; padding:8px; border-radius:15px; transition:all 0.2s ease 0s; }
#header ul.tools li a img{ display:block; height:24px; height:24px; opacity:0.9; transition:all 0.2s ease 0s; }
#header ul.tools li a:hover{ background:url(../image/bg-black05.png); }

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

.footer { background:#2A2D33; padding:50px 0 20px; }
.footer .content { width:750px; margin:auto; border:0px solid #f00;}
.footer .content:after{ display:block; content:""; clear:both;}
.footer .content .links { float:left; width:20%; margin:0 2%; box-sizing:border-box; border:0px solid #f00;}
.footer .content .copyright { font:13px/20px "微软雅黑"; color:#818692; text-align:center; padding-top:30px; clear:both;}

.footer .content h3{ font:15px/1.7em "微软雅黑"; color:#818692;}
.footer .content ul li a { display:inline-block; font:13px/1.6em "微软雅黑"; color:#fff; transition:all 0.2s ease 0s;}
.footer .content ul li a:hover { color:#47C1F4;}

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

@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;}

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