@charset "UTF-8";
/*重置样式*/
@font-face { font-family: yy; src: url(../fonts/OpenSans-Light.ttf); }
@font-face { font-family: 'ralewayextralight'; src: url('../fonts/raleway-extralight-webfont.eot'); src: url('../fonts/raleway-extralight-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/raleway-extralight-webfont.woff') format('woff'),  url('../fonts/raleway-extralight-webfont.ttf') format('truetype'),  url('../fonts/raleway-extralight-webfont.svg#ralewayextralight') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'ralewaylight'; src: url('../fonts/raleway-light-webfont.eot'); src: url('../fonts/raleway-light-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/raleway-light-webfont.woff') format('woff'),  url('../fonts/raleway-light-webfont.ttf') format('truetype'),  url('../fonts/raleway-light-webfont.svg#ralewaylight') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'ralewayregular'; src: url('fonts/raleway-regular-webfont.eot'); src: url('../fonts/raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/raleway-regular-webfont.woff') format('woff'),  url('../fonts/raleway-regular-webfont.ttf') format('truetype'),  url('../fonts/raleway-regular-webfont.svg#ralewayregular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'ralewaymedium'; src: url('../fonts/raleway-medium-webfont.eot'); src: url('../fonts/raleway-medium-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/raleway-medium-webfont.woff') format('woff'),  url('../fonts/raleway-medium-webfont.ttf') format('truetype'),  url('../fonts/raleway-medium-webfont.svg#ralewaymedium') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'ralewaysemibold'; src: url('../fonts/raleway-semibold-webfont.eot'); src: url('../fonts/raleway-semibold-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/raleway-semibold-webfont.woff') format('woff'),  url('../fonts/raleway-semibold-webfont.ttf') format('truetype'),  url('../fonts/raleway-semibold-webfont.svg#ralewaysemibold') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'ralewaybold'; src: url('../fonts/raleway-bold-webfont.eot'); src: url('../fonts/raleway-bold-webfont.eot?#iefix') format('embedded-opentype'),  url('../fonts/raleway-bold-webfont.woff') format('woff'),  url('../fonts/raleway-bold-webfont.ttf') format('truetype'),  url('../fonts/raleway-bold-webfont.svg#ralewaybold') format('svg'); font-weight: normal; font-style: normal; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, textarea, p, th, td { padding: 0; margin: 0; border: 0 none; font-weight: normal; }
body { font-family: 'yy'; background: #fff; min-width: 1260px; overflow-x: hidden; }
table { border-collapse: collapse; border-spacing: 0; }
img { border: 0; }
ol, ul, li { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
a { font-size: 11px !important; text-decoration: none; color: #666; }
input { vertical-align: middle; }
input, button, textarea, select { outline: none; font-size: 14px; }
.main { width: 1200px; margin: 0 auto; }
.clearfix:after { clear: both; display: block; content: '' }
.clearfix { zoom: 1 }
.fl { float: left; }
.fr { float: right; }
.f2 { font-size: 24px; font-weight: bold; color: #005ca7; }

/*header part*/
#top{position:fixed;top:0;width:100%;min-width:1200px; max-width:2160px;z-index:9998; background: rgb(255,255,255); background: rgba(255,255,255,0.95);}
.header{position:relative;width:1200px;height:55px;margin:0 auto;z-index:9999;}
.header .logo{float:left;}
.header .logo img{width:200px;}
.header .topnav{}
.header .topnav li{float: left;text-align: center;color: #555;height: 40px;line-height: 40px;position: relative;text-transform: uppercase;letter-spacing: 0.5px;}
.header .topnav li.contactus{line-height:37px;}
.header .topnav li a{color:#A4A4A4;}
.header .topLink{width:100%;}
.header .topLink a{float:right;padding:1px 10px;color:#fff;text-transform:capitalize;border-radius:8px; font-size:12px;}
.header .topLink a:hover{background-color:#19a1dd;color:#fff;}
.header .mainnav{margin-top:10px;width:100%;z-index:9998;}
.header .mainnav li{float:left;}
.header .mainnav li a{display: block;color: #555;font-size: 11px !important;font-family: 'ralewaysemibold';position:relative;margin-left:20px;}
.header .mainnav ul li a::after { content: "•"; position: absolute; top: 0px; color: rgb(85, 85, 85); left: -12px; }
.header .mainnav ul li:first-child a::after { display: none; }
.header .mainnav li a:hover,.header .mainnav li a.current{color: #4b9bdb;}
/* simpageAd*/

/* product nav */
#top .nav_propic{width:100%;margin:0 auto;display:none;z-index:99999; background-color:#f7f7f7;filter:alpha(opacity=90);-moz-opacity:0.9;opacity:0.9;}
#top .nav_propic a{float:left;display:inline;padding:0 5px;text-align:center; margin-bottom:5px; margin-right:30px;text-decoration:none;}
#top .nav_propic a:hover{text-decoration:none;background:none;}
#top .nav_propic a img{width:80px;height:80px;}
#top .nav_propic a span{display:block; font-size:1.1em; color:#000; font-family: 'yy'; font-weight:normal !important;font-size: 11px !important;}
#top .inner{margin:0 auto; padding-top:8px;padding-bottom:5px;width:1200px;z-index:99999;}
#top .inner .topTitle{padding:8px 0 3px 6px; margin-bottom:6px;border-bottom:1px solid #dedede;font-size:0.9em;color:#4b9bdb; font-family: 'yy'; font-weight:normal !important;font-size: 12px !important;}
.picShow{visibility:hidden;width:100%;height:100%;overflow:hidden;position:relative;z-index:6;}


.headers { width: 100%; height: auto; background: rgb(255,255,255); background: rgba(255,255,255,0.95); position: fixed; z-index: 11; }
.headers:after { content: ''; position: absolute; bottom: -8px; width: 100%; height: 8px; background: url(../images/header_box.png) no-repeat bottom; z-index: 11; }
.headbox { margin-top: 0px; padding-bottom: 0px; }
.headbox.idex { padding-bottom: 0 }
.headbox .logo { float: left; display: block; margin-top: 0px; }

.headbox .nav { float: right; }
.headbox .nav ul li { float: left; text-align: center; color: #555; height: 60px; line-height: 60px; position: relative; text-transform: uppercase; padding-left: 20px; letter-spacing: 0.5px; }
.headbox .nav ul li a { color: #555; display: block; font-size: 11px !important; font-family: 'ralewaysemibold'; }
.headbox .nav ul li a:hover { color: #4b9bdb }
.headbox .nav ul li a.hover { color: #4b9bdb }
.headbox .nav ul li a::after { content: "•"; position: absolute; top: 0px; color: rgb(85, 85, 85); left: 8px; }
.headbox .nav ul li:first-child a::after { display: none; }
.headbox .nav li dl { position: absolute; left: 0px; top: 64px; min-width: 100%; text-align: center; line-height: 35px; visibility: hidden; opacity: 0; transition: all 0.3s; }
.headbox .nav li:hover dl { visibility: visible; opacity: 1; font-style: normal; }
.headbox .nav li dd { padding: 0 15px; white-space: nowrap; float: left; }
.headbox .nav li dd a { display: block; font-size: 11px; line-height: 38px; font-style: normal; }
.headbox .nav li dd a:hover { display: block; text-decoration: none; color: #4b9bdb; }

.sub-nav { overflow: hidden; position: absolute; left: 0; top: 62px; z-index: 999; width: 100%; background-color: #fff; }
.sub-nav__wrap { position: absolute; left: 0; top: 0; display: none; }
.sub-nav__wrap[data-link="nav_iphone"] { padding-left: 390px; }
.sub-nav__wrap[data-link="nav_subIphone"] { padding-left: 306px; }
.sub-nav__wrap[data-link="nav_voice"] { padding-left: 578px; }
.sub-nav__wrap[data-link="nav_parts"] { padding-left: 445px; }
.sub-nav a { float: left; width: 140px; padding-top: 14px; text-align: center; color: #666; }
.sub-nav a:hover { color: #111; }
.sub-nav a img { display: inline-block; height: 80px; }
.sub-nav a span { display: block; padding-top: 18px; font-size: 12px; }

.headbox .nav .on { color: #4b9bdb; }
.headbox .cn { background: url(../images/cn01.png) no-repeat; width: 22px; height: 22px; display: block; float: right; margin-top: 13px }
.headbox .en { background: url(../images/en01.png) no-repeat; width: 22px; height: 22px; display: block; float: right; margin-left: 25px; margin-top: 13px }
.headbox .cn:hover { background: url(../images/cn02.png) no-repeat; }
.headbox .en:hover { background: url(../images/en02.png) no-repeat; }
.headbox .navs { position: absolute; left: 50%; margin-left: -400px; top: 0; }
.headbox .navs ul { }
.headbox .navs li { float: left; padding: 0 40px; position: relative; }
.headbox .navs li p { line-height: 78px; font-size: 15px; }
.headbox .navs li:hover p a { text-decoration: none; color: #1798d7 }
.headbox .nav ul li a.hover { color: #4b9bdb }
.headbox .nav ul li a::after { content: "•"; position: absolute; top: 0px; color: rgb(85, 85, 85); left: 8px; }
.headbox .nav ul li:first-child a::after { display: none; }
.headbox .navs li a.current { color: #fff; }
.headbox .navs li dl { position: absolute; left: 0px; top: 80px; min-width: 100%; background: #232323; text-align: center; line-height: 35px; visibility: hidden; opacity: 0; transition: all 0.3s; }
.headbox .navs li:hover dl { visibility: visible; opacity: 1; }
.headbox .navs li dd { border-bottom: 1px solid #282828; padding: 0 15px; white-space: nowrap; }
.headbox .navs li dd a { display: block; font-size: 12px; line-height: 38px; }
.headbox .navs li dd a:hover { display: block; text-decoration: none; color: #1798d7; }
/* #Navigation
================================================== */


/* banner */
.banner_pc { margin-top: 0px; }
.flexslider { position: relative; }
.flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; }
.flexslider .slides img { width: 100%; display: block; border-radius: 0px; }
.flex-pauseplay span { text-transform: capitalize; }
.flex-control-nav { width: 100%; text-align: center; position: absolute; bottom: 10px; font-size: 0; }
.flex-control-nav li { margin: 0 6px; display: inline-block; zoom: 1; *display:inline;
}
.flex-control-paging li a { width: 48px; height: 8px; display: block; background: #666; background: #fff; cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; }
.flex-control-paging li a:hover { background: #e30a19; }
.flex-control-paging li a.flex-active { background: #e30a19; cursor: default; }
.flex-direction-nav li a { width: 50px; height: 50px; position: absolute; top: 50%; margin-top: -25px; }
.flex-direction-nav li a.flex-prev { left: 2%; z-index: 99; }
.flex-direction-nav li a.flex-next { position: absolute; right: 2%; }
.flickerplate { position: relative; width: 100%; height: 800px; background-color: #e6e6e6; overflow: hidden }
.flickerplate ul.flicks { width: 10000%; height: 100%; padding: 0px; margin: 0px; list-style: none }
.flickerplate ul.flicks>li { float: left; width: 1%; height: 100%; background-position: center; background-size: cover; display: table }
.flickerplate ul.flicks>li .flick-inner { height: 100%; padding: 10px; color: #fff; display: table-cell; vertical-align: middle }
.flickerplate ul.flicks>li .flick-inner .flick-content { max-width: 68.75em; margin-left: auto; margin-right: auto }
.flickerplate ul.flicks>li .flick-title { padding: 0px 0px; font-size: 2.778em; line-height: 1.995em; text-align: center }
@media only screen and (max-width: 43.813em) {
.flickerplate ul.flicks>li .flick-title { font-size: 1.667em }
}
.flickerplate ul.flicks>li .flick-sub-text { padding: 5px; font-weight: 300; line-height: 2.5em; color: rgba(255, 255, 255, 0.8); text-align: center }
.flickerplate ul.flicks>li .flick-title span.flick-block-text, .flickerplate ul.flicks>li .flick-sub-text span.flick-block-text { padding: 12px 18px; background-color: rgba(0, 0, 0, 0.6) }
.flickerplate .arrow-navigation { position: absolute; height: 80%; width: 10%; top: 10%; z-index: 100; overflow: hidden }
.flickerplate .arrow-navigation .arrow { display: block; height: 100%; width: 90%; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; transition: all 0.2s ease-out }
.flickerplate .arrow-navigation:hover, .flickerplate .arrow-navigation .arrow:hover { cursor: pointer }
.flickerplate .arrow-navigation.left { left: 0% }
.flickerplate .arrow-navigation.left .arrow { opacity: 0; margin: 0px 0px 0px 50%; background-image: url("../images/arrow-left-light.png"); background-repeat: no-repeat; background-position: left }
.flickerplate .arrow-navigation.right { right: 0% }
.flickerplate .arrow-navigation.right .arrow { opacity: 0; margin: 0px 0px 0px -50%; background-image: url("../images/arrow-right-light.png"); background-repeat: no-repeat; background-position: right }
.flickerplate .arrow-navigation.left.hover .arrow { opacity: 1; margin: 0px 0px 0px 20% }
.flickerplate .arrow-navigation.right.hover .arrow { opacity: 1; margin: 0px 0px 0px -20% }
.flickerplate .dot-navigation { position: absolute; bottom: 15px; width: 100%; text-align: center; z-index: 100; display: none; }
.flickerplate .dot-navigation ul { text-align: center; list-style: none; padding: 0px 15px }
.flickerplate .dot-navigation ul li { display: inline-block; float: none }
.flickerplate .dot-navigation .dot { width: 6px; height: 6px; margin: 0px 6px; background-color: rgba(255, 255, 255, 0.3); border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -webkit-transition: background-color 0.2s ease-out; -moz-transition: background-color 0.2s ease-out; -o-transition: background-color 0.2s ease-out; -ms-transition: background-color 0.2s ease-out; transition: background-color 0.2s ease-out }
.flickerplate .dot-navigation .dot:hover { cursor: pointer; background-color: rgba(237, 0, 0, 0.6) }
.flickerplate .dot-navigation .dot.active { background-color: #ed0000 }
.flickerplate .dot-navigation.left, .flickerplate .dot-navigation.left ul { text-align: left }
.flickerplate .dot-navigation.right, .flickerplate .dot-navigation.right ul { text-align: right }
.flickerplate.flicker-theme-dark .arrow-navigation.left .arrow { background-image: url("../images/arrow-left-dark.png") }
.flickerplate.flicker-theme-dark .arrow-navigation.right .arrow { background-image: url("../images/arrow-right-dark.png") }
.flickerplate.flicker-theme-dark .dot-navigation .dot { background-color: rgba(0, 0, 0, 0.12) }
.flickerplate.flicker-theme-dark .dot-navigation .dot:hover { background-color: rgba(0, 0, 0, 0.6) }
.flickerplate.flicker-theme-dark .dot-navigation .dot.active { background-color: #000 }
.flickerplate.flicker-theme-dark ul.flicks li .flick-inner { color: rgba(0, 0, 0, 0.9) }
.flickerplate.flicker-theme-dark ul.flicks li .flick-inner .flick-content .flick-sub-text { color: rgba(0, 0, 0, 0.9) }
.flickerplate.flicker-theme-dark ul.flicks li .flick-inner .flick-content .flick-title span.flick-block-text, .flickerplate.flicker-theme-dark ul.flicks li .flick-inner .flick-content .flick-sub-text span.flick-block-text { background-color: rgba(255, 255, 255, 0.5) }
.flickerplate ul.flicks li.flick-theme-dark .flick-inner { color: rgba(0, 0, 0, 0.9) }
.flickerplate ul.flicks li.flick-theme-dark .flick-inner .flick-content .flick-sub-text { color: rgba(0, 0, 0, 0.9) }
.flickerplate ul.flicks li.flick-theme-dark .flick-inner .flick-content .flick-title span.flick-block-text, .flickerplate ul.flicks li.flick-theme-dark .flick-inner .flick-content .flick-sub-text span.flick-block-text { background-color: rgba(255, 255, 255, 0.5) }
.flickerplate.animate-transform-slide ul.flicks { -webkit-perspective: 1000; -webkit-backface-visibility: hidden; transform: translate3d(0%, 0px, 0px); -webkit-transform: translate3d(0%, 0px, 0px); -webkit-transition: -webkit-transform 0.6s; -o-transition: -o-transform 0.6s; -moz-transition: -moz-transform 0.6s; transition: transform 0.6s }
.flickerplate.animate-transition-slide ul.flicks { position: relative; left: 0%; -webkit-transition: left 0.4s ease-out; -moz-transition: left 0.4s ease-out; -o-transition: left 0.4s ease-out; -ms-transition: left 0.4s ease-out; transition: left 0.4s ease-out }
.flickerplate.animate-jquery-slide ul.flicks { position: relative; left: 0% }
.flickerplate.animate-scroller-slide { padding-bottom: 0px; overflow: auto }
.flickerplate.animate-scroller-slide ul.flicks { position: auto }
/* ´úÂëÕûÀí£ºÀÁÈËÖ®¼Ò www.lanrenzhijia.com */
/* banner */


 /**图片随机缩放样式**/
.grid img { max-width: 100%; width: auto\9; height: auto; vertical-align: middle; border: 0; -ms-interpolation-mode: bicubic; }
.w25 { width: 25%; }
.grid { overflow: hidden; margin: 0; width: 100%; list-style: none; text-align: center; }
/* Common style */
.grid figure { position: relative; z-index: 1; display: inline-block; overflow: hidden; margin: -0.135em; height: 100%; text-align: center; cursor: pointer; }
.grid figure img { position: relative; display: block; opacity: 0.8; }
.grid figure figcaption { padding: 2em; color: #000000; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.grid figure figcaption::before, .grid figure figcaption::after { pointer-events: none; }
.grid figure figcaption, .grid figure a { position: absolute; top: 43%; left: 0%; width: 80%; height: 100%; }
/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure a { z-index: 1000; white-space: nowrap; font-size: 0; opacity: 0; }
/*---------------*/
/***** Ruby *****/
/*---------------*/
figure.effect-ruby { }
figure.effect-ruby img { opacity: 0.9; -webkit-transition: opacity 0.85s, -webkit-transform 0.85s; transition: opacity 0.85s, transform 0.85s; -webkit-transform: scale(1); transform: scale(1); }
figure.effect-ruby:hover img { opacity: 0.7; -webkit-transform: scale(1.15); transform: scale(1.15); }
figure.effect-ruby p { border: 0px solid #000000; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, 20px, 0) scale(1.1); transform: translate3d(0, 20px, 0) scale(0.1); font-family: 'yy'; }
figure.effect-ruby:hover p { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); font-family: 'yy'; }
.f14 { font-size: 14px; color: #fff; font-family: 'yy'; }
.f24 { font-size: 24px; color: #fff; font-family: 'yy'; }
.pt65 { padding-top: 65px; }
.w90 { width: 85%; margin: 0px auto; }
.tc { text-align: center; }
.pt40 { padding-top: 40px; }
.conend { padding: 40px 0px; background: #f0f0f0; clear: both; overflow: hidden; text-align: center; }
.conend h2 { font-size: 22px; line-height: 30px; margin-bottom: 3px; font-weight: normal; }
.conend h3 { font-size: 16px; line-height: 18px; font-weight: normal; }
.ser_pro { width: 600px; margin: 20px auto 0px auto; clear: both; height: 42px; padding: 0px; }
.ser_pro input { float: left; display: block; }
.ser_pro input[type=text] { height: 40px; width: 380px; border: 1px solid #ddd; background: #fff; }
.ser_pro input[type=submit] { width: 200px; margin-left: 10px; height: 44px; border-radius: 10px; cursor: pointer; font-size: 18px; line-height: 42px; color: #fff; border: none; background: #818181; outline: none; }
/*内容样式结束*/


/*底部样式开始*/
.border_top { border-top: 1px solid #ddd; padding-top: 10px; width: 100%; clear: both; overflow: hidden; }
.footer { clear: both; padding: 20px 0px; overflow: hidden; }
.copyright { font-size: 11px; color: #555; line-height: 45px; }
.foot_left { line-height: 24px; padding-top: 10px; font-family: 'yy' !important; color: #6D6D6D; font-size: 13px; }
.foot_left p { line-height: 24px; padding-top: 10px; font-family: 'yy' !important; color: #6D6D6D; font-size: 13px; }
.foo_nav a { font-size: 11px !important; padding-right: 25px; }
.foot_right { margin-top: 20px; }
.fenxiang { height: 40px; overflow: hidden; }
.fenxiang a { float: left; display: block; height: 28px; margin-right: 11px; }
.fenxiang a.f_facebook { width: 28px; background: url(../images/footer_fenxiang.png) no-repeat 0px 0px; }
.fenxiang a.f_twitter { width: 28px; background: url(../images/footer_fenxiang.png) no-repeat -39px 0px; }
.fenxiang a.f_linkedln { width: 28px; background: url(../images/footer_fenxiang.png) no-repeat -80px 0px; }
.fenxiang a.f_mail { width: 28px; background: url(../images/footer_fenxiang.png) no-repeat -121px 0px; }
/*底部样式结束*/


/* 内页公用 */
.listBanner { width: 100%; overflow: hidden; font-size: 0px; }
.listWrapper { overflow: hidden; padding: 35px 0; }
.p-video { display: none; position: fixed; left: 50px; top: 50px; bottom: 50px; right: 50px; z-index: 99; }
.p-video span { cursor: pointer; display: block; position: absolute; right: -10px; top: -10px; width: 20px; height: 20px; line-height: 20px; border-radius: 50%; background: #333; color: #FFF; text-align: center; }
.v-con { width: 100%; height: 100%; }
.v-con iframe, .v-con video { width: 100%; height: 100%; }
.p-show { display: block; }
.p1bg { width: 100%; height:auto; background: url(../images/p1bg.jpg) #cdcdcd no-repeat; }
.p1bg h5 { font-size: 11px; margin-top: 23px; color: #999; }
.section-title { font-size: 22px; margin-top: 20px; color: #4b9bdb; font-weight: bold; text-transform: initial; }
.lead { font-size: 13px; line-height: 1.5em; margin-bottom: 5px; margin-top: -3px; text-transform: none; }
.p2bg { width: 100%; height: 800px; background: url(../images/p2bg.jpg) fixed no-repeat; }
.p2bg h5 { font-size: 11px; margin-top: 23px; color: #999; }
.line { width: 100%; height: 7px; background: url(../images/line.png) repeat-x; }
.p3bg { width: 100%; height: 800px; background: url(../images/p2bg.jpg) fixed no-repeat; }
.p3bg h5 { font-size: 11px; margin-top: 23px; color: #999; }
/*产品展示*/
.pro { width: 1200px; height: auto; margin-top: 20px; }
.pro ul { }
.pro li { float: left; width: 283px; margin-right: 22px; margin-bottom: 26px; text-align: center; line-height: 18px; background: #FFF; transition: all 0.3s; }
.pro li:nth-child(4n) { margin-right: 0px; }
.pro li a { display: block; }
.pro li .pic { padding: 0%; }
.pro li .pic img { width: 100%; border: 1px solid #e5e5e5; }
.pro li .pic img:hover { border: 1px solid #2f76e5; }
.pro li p { padding: 1.5% 0; }
.zzsc { position: relative; float: left; border: 1px solid #4b9bdb; overflow:hidden;}
.zzsc img { width: 100%; display: block; }
.zzsc:hover .text { top:0px;}
.text { width: 100%; height:100%; position:absolute; left:0px; top:100%; transition:all 0.5s;background: #4b9bdb; background: rgba(75,155,219,1); background: #4b9bdb 9;/*CSS Hack,只能对ie9以下浏览器ie6,ie7,ie8有效，否侧ie10,FF,Cherome会失去透明效果*/ filter: Alpha(opacity=60);/*只对ie7,ie8有效*/ position: absolute; position: absolute; left: 0; bottom: 0; }
.imgtext {  color: #FFF; font-size: 13px; text-align: left; line-height: 1.5em; padding: 25px; font-family: 'yy'; font-style: normal; }
.imgtext b { color: #FFF; font-size: 17px; text-align: left; line-height: 1.5em; font-family: 'yy'; font-style: normal; }
.p1big { font-size: 0px; }
.p1big-2 { width: 100%; height: 800px; background: url(../pic/01-2.jpg) no-repeat center; }
.p1big-3 { width: 100%; height: 800px; background: url(../pic/01-3.jpg) no-repeat center; }
.p1big-4 { width: 100%; height: 800px; background: url(../pic/01-4.jpg) no-repeat center; }
.p1big-5 { width: 100%; height: 800px; background: url(../pic/01-5.jpg) no-repeat center; }
.p1big-6 { width: 100%; height: 800px; background: url(../pic/01-6.jpg) no-repeat center; }
.p1big-7 { width: 100%; height: 800px; background: url(../pic/01-7.jpg) no-repeat center; }
/*产品展示*/

.aboutbg { width: 100%; height: auto; padding-top: 80px; padding-bottom: 80px; background: #f2f2f2; }
.page-title { font-size: 30px; margin-bottom: 20px; text-align: center; }
.page-zi { padding-top: 20px; color: #888888; font-size: 15px; line-height: 1.5em; }
.aboutbg2 { width: 100%; height: auto; padding-top: 60px; padding-bottom: 80px; }
.lianxi { padding-top: 30px; padding-left: 0px; }
ul.l_x { clear: both; margin-left: -10px; padding: 10px 0px; overflow: hidden; }
ul.l_x li { float: left; width: 355px; min-height: 252px; margin-left: 10px; line-height: 24px; transition: all 0.5s; }
ul.l_x li dl dt { font-weight: bold; font-size: 14px; }
.aboutbg3 { width: 100%; height: auto; padding-top: 80px; padding-bottom: 80px; }
/*底部样式开始*/
.border_tops { border-top: 1px solid #ddd; padding-top: 10px; width: 100%; clear: both; overflow: hidden; }
.footers { clear: both; padding: 20px 0px; overflow: hidden; background: #121212; width: 100%; }
.copyrights { font-size: 11px; color: #555; line-height: 45px; width: 1200px; margin: 0 auto; }
.foot_lefts { line-height: 24px; padding-top: 10px; font-family: 'yy' !important; color: #999999; font-size: 13px; }
.foot_lefts p { line-height: 24px; padding-top: 10px; font-family: 'yy' !important; color: #999999; font-size: 13px; }
.foo_navs a { font-size: 11px !important; padding-right: 25px; color: #999999; }
.foot_rights { margin-top: 20px; }
.fenxiangs { height: 40px; overflow: hidden; }
.fenxiangs a { float: left; display: block; height: 28px; margin-right: 11px; }
.fenxiangs a.f_facebook { width: 28px; background: url(../images/footer_fenxiang.png) no-repeat 0px 0px; }
.fenxiangs a.f_twitter { width: 28px; background: url(../images/footer_fenxiang.png) no-repeat -39px 0px; }
.fenxiangs a.f_linkedln { width: 28px; background: url(../images/footer_fenxiang.png) no-repeat -80px 0px; }
.fenxiangs a.f_mail { width: 28px; background: url(../images/footer_fenxiang.png) no-repeat -121px 0px; }
/*底部样式结束*/

.ny_down02 { width: 1200px; margin: 0 auto; overflow: hidden; padding-top: 30px; }
.ny_down03 { overflow: hidden; width: 386px; height: 130px; float: left; padding: 0px; margin-right: 20px; margin-bottom: 20px; background-color: #ededed; }
.ny_down03 dd { width: 274px; float: left; height: 130px; padding: 0 21px; }
.ny_down03 dt { width: 70px; float: right; height: 130px; }
.ny_down03 dd h5 { font-size: 16px; font-weight: normal; margin-top: 25px; margin-bottom: 15px; }
.ny_down03 dd h5 a { font-size: 16px !important; color: #333; }
.ny_down03 dd span { display: block; line-height: 18px; font-size: 13px !important; color: #999; margin-bottom: 3px; }
.ny_down03 dt i { display: block; cursor: pointer; width: 34px; height: 35px; margin: 0 auto; margin-top: 40px; background: url(../images/nydown_d.png) no-repeat center top; }
.ny_down03:hover dd { background-color: #1651b9; }
.ny_down03:hover dd h5 a { color: #fff; }
.ny_down03:hover dd span { color: #fff; }
.ny_down03:hover dt i { background-position: bottom; }
.ny_down03:hover dt { background-color: #d1241c; }
.ny_down03.last { margin-right: 0px; }

/*.wrapper { position: relative; width: 100%; height: 760px; overflow: hidden; }
.bg-white { display: none; position: absolute; z-index: 998; width: 100%; height: 62px; background-color: #fff; }
.header { position: relative; z-index: 999; left: 0; top: 0; height: 62px; }
.header .container { width: 1240px; padding: 0 20px; margin: 0 auto; }
.header .logo { float: left; padding-top: 30px; }
.header .logo a { width: 115px; height: 20px; background: url(../images/logo_blue.png) no-repeat; }
.nav { float: left; margin-left: 256px; }
.nav-item { float: left; position: relative; }
.nav-item a { padding: 20px 20px 0; height: 42px; line-height: 42px; }
.nav-item a:hover { color: rgb(49, 165, 231); }
.sub-nav { overflow: hidden; position: absolute; left: 0; top: 62px; z-index: 999; width: 100%; background-color: #fff; }
.sub-nav__wrap { position: absolute; left: 0; top: 0; display: none; }
.sub-nav__wrap[data-link="nav_iphone"] { padding-left: 390px; }
.sub-nav__wrap[data-link="nav_subIphone"] { padding-left: 306px; }
.sub-nav__wrap[data-link="nav_voice"] { padding-left: 578px; }
.sub-nav__wrap[data-link="nav_parts"] { padding-left: 445px; }
.sub-nav a { float: left; width: 140px; padding-top: 14px; text-align: center; color: #666; }
.sub-nav a:hover { color: #111; }
.sub-nav a img { display: inline-block; height: 80px; }
.sub-nav a span { display: block; padding-top: 18px; font-size: 12px; }

/* ======== 涓婚鏍峰紡 ======== */
.theme-white .header .logo a { background: url(../images/logo_white.png) no-repeat; }
.theme-white .nav-item a { color: #fff; }
.theme-white .nav-item a:hover { color: rgb(49, 165, 231); }
.theme-white .slider-box .btn-item { background-color: #fff; }
.theme-white .slider-box .btn-item__cur { background-color: transparent; border-color: #fff; }
.theme-nav .header .logo a { background: url(../images/logo_blue.png) no-repeat !important; }
.theme-nav .nav-item a { color: #333; }
.theme-nav .nav-item a:hover { color: rgb(49, 165, 231); }*/