@charset "UTF-8";
/* CSS Document */
/* HTML5 Boilerplate  */

*{margin:0; padding:0;}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 14px; line-height: 160%; background:#f4f3f3; font-family: "微软雅黑"; color: #626262;}

::-moz-selection { background: #f94c9b; color: #fff; text-shadow: none; }
::selection { background: #f94c9b; color: #fff; text-shadow: none; }

a { color: #00aad2; }
a:visited { color: #00aad2; }
a:hover { color: #0085a4; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

ul, ol { margin:0; padding:0; }
li {list-style:none;}
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }
.blank0 {height:0;clear:both;font-size:0px;overflow:hidden;}
.blank1 {height:1px;clear:both;font-size:0px;overflow:hidden;}
.blank2 {height:2px;clear:both;font-size:0px;overflow:hidden;}
.blank4 {height:4px;clear:both;font-size:0px;overflow:hidden;}
.blank5 {height:5px;clear:both;font-size:0px;overflow:hidden;}
.blank10 {height:10px;clear:both;font-size:0px;overflow:hidden;}
.blank15 {height:15px;clear:both;font-size:0px;overflow:hidden;}
.blank20 {height:20px;clear:both;font-size:0px;overflow:hidden;}
.blank30 {height:30px;clear:both;font-size:0px;overflow:hidden;}
.blank40 {height:40px;clear:both;font-size:0px;overflow:hidden;}
.f10{font-size:10px}
.f12{font-size:12px}
.f13{font-size:13px}
.f14{font-size:14px}
.f16{font-size:16px}
.f18{font-size:18px}
.f20{font-size:20px}
.f22 {font-size:22px}
.f24{font-size:22px}
.fb{font-weight:bold}
table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
.fl{ float: left;}
.fr{ float: right;}

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }
.login{ width: 150px;}
.login li{ float: left; line-height: 45px; width: 33px;}
.login li a{ text-decoration: none;}
.icon{background: url("../../image/welcome_images/icon.png") no-repeat; overflow: hidden;}
.wrapper{position: relative; width: 100%; max-width: 1600px; margin: 0 auto; overflow: hidden;}
.logo_box{ height: 50px; width: 100%; background: #fff; opacity: 0.9; position: absolute; top: 0px; z-index: 5;}
.logo_box .area{ width: 1090px; height: 42px; padding-left: 10px; margin: 0 auto;}
.logo{ width: 104px; height: 33px; background-position: -1403px -358px; margin-top: 8px;}
.control_box{ width: 1100px; height: 430px; position: absolute; z-index: 5; top: 50px; left: 50%; margin-left: -550px;}
.control_box .on_left, .control_box .on_left:hover, .control_box .on_right, .control_box .on_right:hover{ width: 58px; height: 124px; float: left; margin-left: 15px; background-position: -51px -610px; margin-top: 153px; cursor: pointer;}
.control_box .on_left:hover{ background-position: -113px -610px;}
.control_box .on_right{ background-position: -183px -610px; float: right; margin-left: 0px; margin-right: 15px;}
.control_box .on_right:hover{ background-position: -257px -610px; float: right; margin-left: 0px; margin-right: 15px;}
.top_box{ width: 100%; max-width: 1600px; min-width: 1100px; height: 480px;}
.top_box ul{position: absolute; width: 100%;}
.top_box li{float: left;}
.top_box .banner1, .top_box .banner2{  background: url("../../image/welcome_images/banner1.jpg") no-repeat center center; width: 100%; height: 480px; z-index: 4}
.top_box .banner2{ background: url("../../image/welcome_images/banner2.jpg") no-repeat center center;}
.ani_box{ height: 570px; width: 1100px; margin: 0 auto; position: relative;}
.ani_box .ani1_textbox1{ width: 450px; height: 170px; position: absolute; left: 105px; top: 18px;}
.product{ width: 358px; height: 331px; background-position: -423px 0px; position: absolute; right: 70px; top: -140px;}
.products{ width: 396px; height: 286px; background-position: 0 0; position: absolute; top: 232px; left: 50px;}
.ani1_textbox2{width: 550px; height: 300px; position: absolute; right: 0px; top: 231px;}
.ani1_textbox2 li{float: left; width: 170px; height: 35px; line-height: 35px; overflow: hidden; margin-bottom: 20px;}
.i1{ width: 35px; height: 25px; background-position: -4px -350px; float: left; margin-top: 5px;}
.i2{ width: 35px; height: 26px; background-position: -210px -349px; float: left; margin-top: 4px;}
.i3{ width: 35px; height: 26px; background-position: -404px -349px; float: left; margin-top: 4px;}
.i4{ width: 35px; height: 21px; background-position: -3px -401px; float: left; margin-top: 9px;}
.i5{ width: 35px; height: 24px; background-position: -212px -399px; float: left; margin-top: 6px;}
.i6{ width: 35px; height: 25px; background-position: -402px -399px; float: left; margin-top: 5px;}
.i7{ width: 35px; height: 26px; background-position: -7px -449px; float: left; margin-top: 4px;}
.i8{ width: 35px; height: 12px; background-position: -210px -456px; float: left; margin-top: 14px;}
.i9{ width: 35px; height: 13px; background-position: -402px -456px; float: left; margin-top: 13px;}
.i10{ width: 35px; height: 31px; background-position: -4px -497px; float: left; margin-top: 1px;}
.i11{ width: 35px; height: 25px; background-position: -804px -353px; float: left; margin-top: 5px;}
.i12{ width: 35px; height: 26px; background-position: -1010px -352px; float: left; margin-top: 4px;}
.i13{ width: 35px; height: 26px; background-position: -1204px -352px; float: left; margin-top: 4px;}
.i14{ width: 35px; height: 21px; background-position: -803px -404px; float: left; margin-top: 9px;}
.i15{ width: 35px; height: 24px; background-position: -1012px -402px; float: left; margin-top: 6px;}
.i16{ width: 35px; height: 25px; background-position: -1202px -402px; float: left; margin-top: 5px;}
.i17{ width: 35px; height: 19px; background-position: -804px -455px; float: left; margin-top: 6px;}
.i18{ width: 35px; height: 29px; background-position: -1011px -447px; float: left; margin-top: 5px; margin-left: 40px;}
.i19{ width: 35px; height: 29px; background-position: -210px -497px; float: left; margin-top: 5px; }
.product2{ width: 365px; height: 329px; background-position: -799px 0px; position:  absolute; left: 100px; top: -160px; opacity: 1;}
.products2{ width: 394px; height: 248px; background-position: -1175px -77px; position: absolute; right: 50px; top: 230px; opacity: 1;}
.ani_box .ani2_textbox1{ width: 450px; height: 170px; position: absolute; right: 100px; top: 18px; opacity: 01;}
.ani2_textbox2{ width: 550px; height: 300px; position: absolute; left: 100px; top: 231px; opacity: 1;}
.ani2_textbox2 li{float: left; width: 170px; height: 35px; line-height: 35px; overflow: hidden; margin-bottom: 20px;}
.content_box, .content_box_sleep, .content_box_device, .item_content{ width: 100%; max-width: 1600px; min-width: 1100px; height: 648px; margin: 0 auto; background: url("../../image/welcome_images/content_img.jpg") no-repeat center center;}
.content_area{ width: 1100px; height: 100%; margin: 0 auto; position: relative;}
.content_area .content_area_text{ width: 485px; height: 400px; background:#5d6767; opacity: 0.8; padding-left: 40px; padding-top: 40px;}
.content_area .content_area_text li, .content_box_sleep .content_area_text li{ float: left; width: 205px; height: 33px; margin-bottom: 10px; line-height: 33px;}
.content_area .content_area_text li .content_img1{ width: 35px; height: 25px; background-position: -487px -353px; float: left; margin-top: 5px;}
.content_area .content_area_text li .content_img2{ width: 35px; height: 26px; background-position: -693px -352px; float: left; margin-top: 4px;}
.content_area .content_area_text li .content_img3{ width: 35px; height: 27px; background-position: -490px -401px; float: left; margin-top: 3px;}
.content_area .content_area_text li .content_img4{ width: 35px; height: 24px; background-position: -695px -402px; float: left; margin-top: 6px;}
.content_box_sleep{}
.content_box_sleep .content_area_text{ float: right; margin-top: 10px; width: 485px; height: 395px; background: #7592ab; opacity: 0.8; padding-top: 40px; padding-left: 35px;}
.content_box_sleep{background: url("../../image/welcome_images/content_img2.jpg") no-repeat center center; height: 624px;}
.content_box_sleep .content_area_text li .content_img1{ width: 35px; height: 21px; background-position: -487px -555px; float: left; margin-top: 9px;}
.content_box_sleep .content_area_text li .content_img2{ width: 35px; height: 25px; background-position: -696px -552px; float: left; margin-top: 5px;}
.content_box_sleep .content_area_text .sleep_icon{ width: 390px; height: 75px; background-position: -514px -710px; margin: 0 auto;}
.content_box_device{height: 250px; background:none; padding-top: 45px;}
.device_img{width: 100%; max-width: 1600px; min-width: 1100px; height: 438px; background: url("../../image/welcome_images/device.jpg") center center no-repeat;}
.item_content{width: 100%; max-width: 1600px; min-width: 1100px; height: 712px; background: url("../../image/welcome_images/item_img.jpg") center center no-repeat;}
.item_content .content_area_text{ width: 600px; float: right; background: none;}
.grid{width: 200px;display: inline; float: left; margin-left: 10px; margin-right: 10px;}
.grid .content{margin-top: 40px 0 0;} 
.grid .content li{color: #FFFFFF;font-family: "proxima-nova-condensed",sans-serif;font-size: 15px;font-weight: 400;line-height: 30px;text-align: left;text-decoration: none;text-transform: uppercase;}
.grid .content li.title{ color: #91b34f;  font-size: 16px; font-weight: bold; margin-bottom: 10px;}
.grid .content li a{ color: #878686; text-decoration: none;}

.orange_btn{ width: 155px; height: 45px; line-height: 45px; background-color: #ff8a00; border-radius: 6px; color: #fff; text-align: center; cursor: pointer; font-size: 18px;}
.text1{color: #66afd5;}
.text2{color: #a9d8ff;}
.text3{color: #fff;}
.text4{color: #709e18;}


@media (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:3 / 2),(min-device-pixel-ratio:1.5) {
    .logo {width: 104px; height: 35px; background-position: 0; margin-top: 7px; background: url("../../image/welcome_images/icon@2x.png") no-repeat;background-size:104px 35px; }
}