@charset "gb2312";
/*公共样式*/
/* CSS Document */
*,::before,::after{margin:0; padding:0;box-sizing:border-box;}
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,p,blockquot,filedset,input,nav,aside,header,article,section,figure,figcaption,video,audio{margin:0; padding:0;}
h1,h2,h3,h4,h5,h6,em,i,b{ font-size:1em; font-style:normal; font-weight:normal;}
ul,ol,li{ list-style:none;}
fieldset,img{max-width: 100%; border:0 none;/*解决图片上下的缝隙的问题*/  vertical-align:middle;/*垂直居中*/}
input,select,textarea,button{ font:12px/20px  Arial;  outline:none; /*把表单中元素获得焦点的蓝框去掉*/}
/*input[type="button"], input[type="submit"], input[type="reset"] {
    -webkit-appearance: none;outline:0px;
}*/
:focus{outline:none;}
/*超链接*/
a{ color:#00132b; text-decoration:none; outline:none;}
a:link,a:visited{ text-decoration:none;}
a:hover{ color:#272731;}
a:active{ text-decoration:none;}
/*自适应高度的问题解决   解决margin 塌陷   清除浮动*/
.clearfix:after{ clear:both; content:''; display:block; height:0; line-height:0; visibility:hidden;}
.clearfix{zoom:1;}
.clear{clear:both;}
.fl{float:left;}
.fr{float:right;}
body{ font:14px/20px Microsoft Yahei,"微软雅黑"; color:#666666; }
.w{ width: 90%; margin:0 auto;*margin-top:18%; text-align:center;}
.w1{background: rgba(0, 10, 30, 0.3); padding:1% 3% 2%; width:60%; filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr=#44000000,endColorstr=#44000000); margin:0 auto;*margin-top:18%; text-align:center;}
/*公共样式 end*/
/*首页*/
.sctbg{ background:#fff;position: absolute;left: 0;bottom: 0;width: 100%;}
.section { text-align: center; font: 14px "Microsoft Yahei"; color: #fff;}
.section0 { background: url(0.jpg) no-repeat 50%;z-index: 9999;background-size: cover;}
.section1 { background: url(1.jpg) no-repeat 50%;z-index: 9999;background-size: cover;}
.section2 { background: url(2.jpg) no-repeat 50%;z-index: 8888;background-size: cover;}
.section3{background: url(3.jpg) no-repeat 50%;z-index: 7777;background-size: cover;  *zoom:1; *display: inline;}
.section4 { z-index: 6666;background-color: #000000;/*background: url(4.jpg) no-repeat 50%;background-size: cover;*/}
.section5{ background: url(5.jpg) no-repeat 50%;z-index: 5555; background-size: cover;} 
.section5 .txt{margin-bottom: 20px;}
.section5 .txt strong{font-size: 32px;color: #ee0522;line-height: 42px;text-align: center;margin-bottom: 15px;display: block;}
.section5 .txt strong::before{content: "";display: inline-block;width: 120px;height: 1px;background-color: #d2d2d2;margin-right: 20px;vertical-align: middle;}
.section5 .txt strong::after{content: "";display: inline-block;width: 120px;height: 1px;background-color: #d2d2d2;margin-left: 20px;vertical-align: middle;}
.section5 .txt li{display: inline-block;  *zoom:1;*display: inline;width: 6.67%;-wekit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.section5 .txt ul{text-align: center;}
.section5 .txt li img{max-width: 80%;}
.service{width: 82%;overflow: hidden;margin: 20px auto;}
.section2 h3{font-size:120px!important;font-size:100px;padding: 1%;background: url(video_txt2.png) no-repeat center;text-indent: -9999px;-webkit-background-size: auto 110%;-moz-background-size: auto 110%;-o-background-size: auto 110%;background-size: auto 110%;line-height: 1.2;}
.section3 h3{font-size:100px;padding:1.5% 1%;background: url(video_txt4.png) no-repeat center;text-indent: -9999px;-webkit-background-size: auto 100%;-moz-background-size: auto 100%;-o-background-size: auto 100%;background-size: auto 100%;line-height: 1.2;}//filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='video_txt4.png',sizingMethod='scale');behavior:url(backgroundsize.min.htc); -ms-behavior:url(backgroundsize.min.htc);
.section .text{font-size: 20px;color: #fff;margin: 20px 0;padding: 0 1%;line-height: 24px;}
.service ul{width: 39.2%;margin: 0 auto;overflow: hidden;}
.service p{width: 31.33%;font-size: 12px;font-weight: bold;border: 1px solid #fff;float:  left;padding: 10px 0; margin: 0 1%;}
.service span{font-size: 20px;display: block;}
.service5 .fp-tableCell{display: block;}

.ul-tab-y1{overflow: hidden;width: 1440px;margin: 30px auto;}
.ul-tab-y1 li{float: left;width: 20%;text-align: center;}
.ul-tab-y1 .ico{width: 100px;height: 100px;overflow: hidden;background-repeat: no-repeat;margin: 0 auto;-ms-transition:.3s;-moz-transition:.3s;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;background-position: center;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;behavior:url(backgroundsize.min.htc);-ms-behavior:url(backgroundsize.min.htc);}
.ul-tab-y1 li strong{font-size: 22px;line-height: 42px;display: block;margin-bottom: 5px;font-weight: normal;color: #333333;}
.ul-tab-y1 li p{font-size: 12px;line-height: 22px;color: #666666;}
.ul-tab-y1 li .ico1{background-image: url(ser1.png);}
.ul-tab-y1 li .ico2{background-image: url(ser2.png);}
.ul-tab-y1 li .ico3{background-image: url(ser3.png);}
.ul-tab-y1 li .ico4{background-image: url(ser4.png);}
.ul-tab-y1 li .ico5{background-image: url(ser5.png);}
.ul-tab-y1 li:hover .ico1{background-image: url(ser1_hor.png);}
.ul-tab-y1 li:hover .ico2{background-image: url(ser2_hor.png);}
.ul-tab-y1 li:hover .ico3{background-image: url(ser3_hor.png);}
.ul-tab-y1 li:hover .ico4{background-image: url(ser4_hor.png);}
.ul-tab-y1 li:hover .ico5{background-image: url(ser5_hor.png);}
.animate-bounce-down{width: 55px;height: 55px;background: url(mousetip.png) no-repeat;position: absolute; bottom: 10px;left: 50%;margin-left: -25px;cursor: pointer;-webkit-animation: bounce-down 1.5s linear infinite;animation: bounce-down 1.5s linear infinite;background-size: 100%;z-index: 9999;}
@-webkit-keyframes bounce-down { 25% {-webkit-transform: translateY(-10px);} 50%, 100% {-webkit-transform: translateY(0);} 75% {-webkit-transform: translateY(10px);} }
@keyframes bounce-down { 25% {transform: translateY(-10px);} 50%, 100% {transform: translateY(0);} 75% {transform: translateY(10px);} }
@-webkit-keyframes bounce-down2 { 25% {-webkit-transform: translateX(-10px);} 50%, 100% {-webkit-transform: translateX(0);} 75% {-webkit-transform: translateX(10px);} }
@keyframes bounce-down2 { 25% {transform: translateX(-10px);} 50%, 100% {transform: translateX(0);} 75% {transform: translateX(10px);} }
.section5 .foot{height: 50px;line-height: 50px;color: #888888;}
.section5 .foot p a{color: #888888;font-size: 14px;padding: 0;}
/*首页 end*/


/*---------------------------header-----------------------*/
.header{width: 100%;height:auto;background: rgba(0, 0, 0, 0.4);position: fixed;z-index:1991620;}
.header ul{float: right;overflow: hidden;}
.header ul li{float: left;padding:15px 10px;text-align: center;margin-top: 5px;}
.header {position: fixed;_position: absolute;top: 0;left: 0;width: 100%;zoom: 1;z-index: 10000;}
.header .head {position: relative;height: 100%;width: 100%}
.header h1 {text-indent: -9999em;font-size: 0;line-height: 0;float: left;margin: 7px 0 0 30px;width:341px;height:60px}
.header h1 a {display: block;width: 100%;height: 100%}
.header h1 a img {display: block;width: 100%;height: auto}
.header .nav_list {position: absolute;top: 0;right: 0}
.header .nav_list a:hover {text-decoration: none}
.header .nav_li {float: left;width: 156px;position: relative; margin-top:16px;zoom: 1;}

.header .btn_nav {display: block;width: 136px;height: 38px;text-align: center;line-height: 38px;position: absolute;top: 50%;left: 50%;margin: -19px 0 0 -68px;font-size: 16px;color: #fff;z-index: 6}
.header .btn_nav:hover {text-decoration: none}
.header .btn_nav i {display: inline-block;+display: inline;+zoom: 1;cursor: pointer;vertical-align: middle;}
.header .ic_product {background: url(prolist_ico.png) no-repeat;width: 27px;height:20px;margin-right: 11px;}
.header .ic_new,.header .ic_product {width: 29px;margin-right: 13px;top: 3px;+top: 0;_margin-top: 9px}
.header .ic_new {background-position: -54px 0;height: 19px}
.header .ic_more {background-position: 0 -24px;width: 27px;height: 20px;margin-right: 11px; background:url(nav_ico.png) no-repeat left;top: 5px;}
.header .more_nav {position: absolute;top: 0;right: -162px;width: 156px;height: 9999px;padding-top: 100px;background: rgba(0,0,0,.8);transition: right .3s;-webkit-transition: right .3s}
.header .nav_li .show {right: 0}

.ivideo_banner { text-align:center; }
.ivideo_banner,.ivideo_banner li { height:100%; position:relative; overflow:hidden; }
.ivideo_banner video,.ivideo_banner .cover { position:absolute; left:0; top:0;}
.ivideo_banner video { min-height:100%; min-width:100%;z-index:9;}
.ivideo_banner .cover { width:100%; height:100%; z-index:999; background:url(video_cover.png); color:#fff; text-align:center;transform: translateZ(120px)/*控制苹果笔记本上视频上浮动大字*/;}
.sp_zi{width: 100%;text-align: center;position: absolute;left: 0;top: 55%;*top:33%;width: 100%;-ms-transform:translateY(-50%); -moz-transform:translateY(-50%);-webkit-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);}
.ivideo_banner .cover .text1 { font-size:100px;font-weight:550; line-height:1;}
.ivideo_banner .cover .text2 {font-size:35px;font-weight: lighter; max-width:850px; margin-left:auto; margin-right:auto; margin-top:3%;}
.ivideo_banner li { display:block;}
.ivideo_banner .cover .text1,.ivideo_banner .cover .text2 { -webkit-transition:all 0.8s ease; transition:all 0.8s ease; opacity:0; display:none/9;}
.ivideo_banner.act .cover .text1,.ivideo_banner.act .cover .text2 { opacity:1; display:block/9;}
.ivideo_banner.act .cover .text1 { font-size:120px!important;font-size:100px; letter-spacing:15px; padding:0!important;padding:1% 0; font-weight:400;text-align:center;text-indent: -9999px;background: url(video_txt.png) no-repeat center;background-size: auto 100%;}
.ivideo_banner.act .cover .text2 { margin:0 auto; font-size:120px!important;font-size:100px; letter-spacing:15px; padding:0; font-weight:400;text-align:center;text-indent: -9999px;background: url(video_txt3.png) no-repeat center; }
.ivideo_banner.act .cover .text1 img{ width: auto;}

.panel {height: 120px;display: none;}
.flip {font-size: 16px;color: #fff}
.flip img {margin-right: 10px;}
.panel {top: 0;margin-right: -10px;width: 210px;height: 9999px;padding: 110px 0;background: rgba(0,0,0,.6);transition: right .3s;-webkit-transition: right .3s;margin-top:-40px;color: #fff}
.panel li {width: 100%;padding: 5px 0;font-size: 16px;}
.panel li a {color: #c5c8d0;}
/*第四屏产品部分*/
.product_box .tb_box,.product_box .zoom_wp {position: absolute;top: 50%;left: 50%; }
.product_box .tb_box {width: 1920px;height: 1080px;margin: -540px 0 0 -960px}
.product_box .tb_cont {padding-bottom: 20px;color: #fff;font-weight: lighter}
.page_1 .product_box:hover .zoom_wp {left: 50%}
.product_box .txt_video {position: relative;background: url(video_txt.png) no-repeat 0 0;width: 1023px;height: 139px;margin: 0 auto}
.product_box .product_logo {position: relative;height: 105px;margin-bottom: 10px;}
.product_box .ic_logo {position: absolute;top: 50%;left: 50%;background-image: url(product_logo.png);transform: translate3d(0,-2px,0);}
.p_ydz .ic_logo {background-position: -533px 0;width: 234px;height: 95px;margin: -37px 0 0 -140px}
.p_ep .ic_logo {background-position: -785px 3px;width:95px;height:95px;margin: -38px 0 0 -41px}
.p_yzp .ic_logo {background-position: -896px 0;width: 85px;height:93px;margin: -48px 0 0 -61px}
.p_dgyzp .ic_logo {background-position: -996px 0;width: 70px;height:70px;margin: -27px 0 0 -35px;}
.product_box .txt_product {font-size: 0;line-height: 0;text-align: center}
.product_box .txt_product .txt {font-size: 30px;line-height: 30px;height: 30px;margin: 0 7px;display: inline-block;+display: inline;+zoom: 1;vertical-align: top;+line-height: 36px;position: relative;+top: -10px;font-weight: lighter; text-shadow: black 0.1em 0.1em 0.2em}

.product_box .hover_box {color: #fff}
.product_box .txt_link {position: relative;font-size: 0;line-height: 0;text-align: center;font-weight: lighter;transform-origin: center center;-webkit-transform-origin: center center}
.product_box .txt_link a {color: #fff;display: inline-block;+display: inline;+zoom: 1;position: relative;font-size: 40px;line-height: 40px;height: 40px;+line-height: 48px;+top: -3px;}
.product_box .txt_link a:hover {text-decoration: none}
.product_box .txt_link a:hover .ic_arr {animation: txt_link 1s both;-webkit-animation: txt_link 1s both}

@keyframes txt_link {
	0%,20%,50%,80%,to {
		transform: translateX(0)
	}

	40% {
		transform: translateX(6px)
	}

	60% {
		transform: translateX(3px)
	}
}


@-webkit-keyframes txt_link {
	0%,20%,50%,80%,to {
		-webkit-transform: translateX(0)
	}

	40% {
		-webkit-transform: translateX(6px)
	}

	60% {
		-webkit-transform: translateX(3px)
	}
}

.page_wp,.product_wp,.wrap,.wrapper {height: 100%;position: relative;overflow: hidden}
.page_box,.page_box .content {position: absolute;top: 0;left: -9999px;width: 100%;height: 100%}
.page_box.show,.page_box.show .content {left: 0}
.product_box {position: absolute;overflow: hidden}

.product_1 {top: 0;left: 0;width: 34%;height: 100%;background: url(dgyzp.jpg) 50% no-repeat;z-index: 5555;background-size: cover;}
.product_2 {top: 0;left: 34%;width: 66%;height: 50%;background: url(ydz.jpg) 50% no-repeat;z-index: 5555;background-size: cover;}
.product_3 {top: 50%;left: 34%;width: 33%;height: 50%;background: url(epo.jpg) 50% no-repeat;z-index: 5555;background-size: cover;}
.product_4 {top: 50%;left: 67%;width: 33%;height: 50%;background: url(yyyzp.jpg) 50% no-repeat;z-index: 5555;background-size: cover;}
.product_box .cont_box {position: absolute;top: 0;left: 0;width: 100%;height: 100%}
.product_box:hover .cont_box .zoom_wp {left: -9999px}
.product_box .hover_box {position: absolute;top: 0;left: 100%;width: 100%;height: 100%;transition: left .3s;opacity: 0}
.product_box:hover .hover_box {left: 0;opacity: 1}
.product_box .hover_box .opc_bg {background: #000;opacity: .7;filter: alpha(opacity=70)}
.product_box .hover_box .opc_bg,.product_box .hover_cont {position: absolute;top: 0;left: 0;width: 100%;height: 100%}
.product_box .bg_box {position: absolute;top: 50%;left: 50%}
.product_box .bg_box img {display: block;width: 100%;height: auto}
.tb_box {position: relative;width: 100%;height: 100%;z-index: 5;display: table;text-align: center}
.tb_box .tb_cont {display: table-cell;vertical-align: middle}


.product_box .btn_down {
	position: relative;
	overflow: hidden;
	display: block;
	width: 188px;
	font-size: 22px;
	line-height:48px;
	font-weight: lighter;
	color: #fff;
	border: 1px solid #fff;
	border-color: hsla(0,0%,100%,.5);
	margin: 20px auto 0
}

.product_box .btn_down:hover {
	text-decoration: none;
	color: #fff;
	background-color: hsla(0,0%,100%,.3);
	border-color: hsla(0,0%,100%,.3)
}

.product_box .txt_brief {
    font-weight: 300;
    font-size: 22px;
    line-height: 38px;
    text-align: center;
    margin: 18px auto 0;
    padding-bottom: 6px;
    transform-origin: center center;
    -webkit-transform-origin: center center;
}

.product_box .cont_box .tb_cont {
	+position: absolute;
	+width: 100%;
	+left: 0;
	+top: 50%;
	+height: 136px;
	+margin-top: -68px
}

.product_box .hover_box .tb_cont {
	+position: absolute;
	+width: 100%;
	+left: 0;
	+top: 50%;
	+height: 226px;
	+margin-top: -113px
}

.foot{background: #15181E;color: #4d5560; height:50px; line-height:50px; width:100%; overflow:hidden; margin:0 auto}

 .btn_down {
    position: relative;
    overflow: hidden;
    display: block;
    width: 188px;
    height: 54px;
    font-size: 22px;
    line-height: 54px;
    font-weight: lighter;
    color: #fff;
    border: 1px solid #fff;
    border-color: hsla(0,0%,100%,.5);
    margin:40px auto 0;
}    .btn_down:hover{ color:#fff}
#fp-nav{z-index: 100000;}
#fp-nav ul li a span, .fp-slidesNav ul li a span{width: 12px;height: 12px;background: #fff;border: none;}
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span{background: none;border: 1px solid #fff;}

@media only screen and (max-width:1600px){
	.ivideo_banner.act .cover .text1{font-size: 86px;}
	.product_box .txt_link a{font-size: 32px;}
	.product_box .btn_down{font-size: 20px;line-height: 44px;height: 44px;}
	.product_box .txt_product .txt{font-size: 24px;}
	.section5 .txt{margin-bottom: 10px;}
	.section5 .txt strong{margin-bottom: 10px;line-height: 36px;}
	.ul-tab-y1{width: 100%;}
	.section h3{font-size: 100px;}
	.w1{ width:70%;}
}
@media only screen and (max-width:1440px){
	.section5 .txt{margin-bottom: 24px;}
	.section h3{font-size:95px;}
}
@media only screen and (max-width:1280px){
	.section h3 {
    font-size:90px;
}
}
@media only screen and (max-width:1200px){
	.section h3{font-size: 100px;}
	.product_box .txt_link a{font-size: 24px;}
	.product_3 .txt_brief, .product_4 .txt_brief{max-width: 17%;}
	.product_box .txt_brief{font-size: 16px;line-height: 26px;}
}
@media only screen and (max-width:1180px){
	.section h3{font-size: 70px;}
	.ivideo_banner.act .cover .text1{font-size:70px;}}
@media only screen and (min-width:2000px){
	.ul-tab-y1{margin: 80px auto;width: 1920px;}
	.section5 .txt{margin-bottom:80px;}
	.section5 .txt strong{margin-bottom: 30px;}
	.ul-tab-y1 .ico{width: 160px;height: 160px;}
	.ul-tab-y1 li strong{font-size: 30px;margin: 15px 0;}
	.ul-tab-y1 li p{font-size: 20px;}
	.section5 .txt strong{font-size: 36px;}
	
}