@font-face{ font-family:SourceHanSansCN-Medium;
src:url('../images/SourceHanSansCN-Medium.otf');	
}
@font-face{ font-family:SourceHanSansCN-Normal;
src:url('../images/SourceHanSansCN-Normal.otf');	
}
@font-face{ font-family:SourceHanSansCN-Regular;
src:url('../images/SourceHanSansCN-Regular.otf');	
}

*{margin:0;padding:0;}
a{text-decoration:none; color:#666;}
a:hover{ color:red;}
ul{ list-style:none;}
img{ border:none;}
body{font-size:12px; text-align:center;font-family:SourceHanSansCN-Normal;}
html{overflow-x:hidden;}
.clear{ clear:both;}
input,textarea,select{outline:none;}

.video-box {position: relative;height: 100vh;background-color: #fff;/*进行视频裁剪*/overflow: hidden;}
.video-box .video-background{position: absolute;left: 50%;top: 50%;/*保证视频内容始终居中*/transform: translate(-50%, -50%);width: 100%;height: 100%;object-fit: cover;min-height: 800px;}

.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:40px;margin-left:80px;}
.layer .language{float:right;margin-top:60px;margin-right:50px;}
/*2*/
.hide {display: none;}
.science{position: absolute;top:55%;left:70px;width:338px;height:338px;color:#fff;text-align:left;z-index:999;}

.sciencebox{position: absolute;margin:0px auto;width:338px;height:338px;overflow: hidden;}
.service {position: absolute;float:left;width:338px;height:338px;z-index:5;}
.service ul{width: 338px;height:338px;}
.service li {float:left;}
.service .s_hover{}

.s_content {position: absolute;z-index:2;width: 338px;height:338px;overflow: hidden;}
.s_content dl {width: 338px;height:338px;}
.s_content dl img{width:338px;height:338px;float:left;margin-left:0px;margin-top: 0px;}

#conimg01:link,#conimg01:visited{width:92px; height:86px;background:url(../images/bt01.png) center top no-repeat;}/*链接、点击后*/ 
#conimg01:hover{background:url(../images/bt01.png) center top no-repeat;}/*鼠标经过*/ 
.service .s_hover #conimg01{background:url(../images/bt01.png) center top no-repeat;transition: all 1s;transform: scale(1.03);}

#conimg02:link,#conimg02:visited{ display:block; width:92px; height:86px;background:url(../images/bt02.png) center top no-repeat;}/*链接、点击后*/ 
#conimg02:hover{background:url(../images/bt02.png) center top no-repeat;}/*鼠标经过*/ 
.service .s_hover #conimg02{background:url(../images/bt02.png) center top no-repeat;transition: all 1s;transform: scale(1.03);}

#conimg03:link,#conimg03:visited{ display:block; width:92px; height:86px;background:url(../images/bt03.png) center top no-repeat;}/*链接、点击后*/ 
#conimg03:hover{background:url(../images/bt03.png) center top no-repeat;}/*鼠标经过*/ 
.service .s_hover #conimg03{background:url(../images/bt03.png) center top no-repeat;transition: all 1s;transform: scale(1.03);}

#conimg04:link,#conimg04:visited{ display:block; width:92px; height:86px;background:url(../images/bt04.png) center top no-repeat;}/*链接、点击后*/ 
#conimg04:hover{background:url(../images/bt04.png) center top no-repeat;}/*鼠标经过*/ 
.service .s_hover #conimg04{background:url(../images/bt04.png) center top no-repeat;transition: all 1s;transform: scale(1.03);}

#conimg05:link,#conimg05:visited{ display:block; width:92px; height:86px;background:url(../images/bt05.png) center top no-repeat;}/*链接、点击后*/ 
#conimg05:hover{background:url(../images/bt05.png) center top no-repeat;}/*鼠标经过*/ 
.service .s_hover #conimg05{background:url(../images/bt05.png) center top no-repeat;transition: all 1s;transform: scale(1.03);}

#conimg06:link,#conimg06:visited{ display:block; width:92px; height:86px;background:url(../images/bt06.png) center top no-repeat;}/*链接、点击后*/ 
#conimg06:hover{background:url(../images/bt06.png) center top no-repeat;}/*鼠标经过*/ 
.service .s_hover #conimg06{background:url(../images/bt06.png) center top no-repeat;transition: all 1s;transform: scale(1.03);}

/*360度转 -webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg) */


.slogan {position: absolute;top:55%;left:440px;width: 684px;color:#fff;text-align:left;z-index:999;}
.slogan .subtitle {font-weight:200;font-size:36px;letter-spacing:2px;margin:42px 0 16px;float:left;text-align: left;}
.slogan .title {font-weight:800;font-size:47px;margin: 0 0 16px;float:left;text-align: left;text-transform:uppercase;letter-spacing:1px;}
.slogan .try-btn {position: relative;left: 0%;width: 156px;height:54px;line-height: 54px;margin-top:40px;margin-left: 0px;color: #fff;text-align:left;border-radius: 0px;font-weight:400;font-size:14px;}
.slogan .try-btn a{color:#fff;}


/* flexslider */
.banner{position: absolute;left: 50%;top: 50%;/*保证视频内容始终居中*/transform: translate(-50%, -50%);width: 100%;height: 100%;object-fit: cover;min-height: 800px;}
.flexslider{position:relative;height:auto;overflow:hidden;background:url(../images/loading.gif) 50% no-repeat;}
.slides{position:relative;z-index:0;}
.slides li{height:auto;}
.flex-control-nav{position:absolute;bottom:20px;z-index:2; left:47.5%;text-align:center;}
.flex-control-nav li{display:inline-block;width:14px; float:left;height:14px;margin:0 5px;*display:inline;zoom:1;}
.flex-control-nav a{display:inline-block;width:14px;height:14px;line-height:40px;overflow:hidden;background:url(../images/dot.png) right 0 no-repeat;cursor:pointer;}
.flex-control-nav .flex-active{background-position:0 0;}


.slan{border:none;line-height:28px;font-size: 14px;width: 126px;height: 28px;text-indent: 10px;background-color:#fff;border-radius:4px;border:0px solid #b7b7b7;background-color: transparent;color:#fff;}
.slan option{text-indent: 10px;background-color:#fff;line-height:35px;font-size: 14px;width: 126px;height: 28px;line-height:28px;color:#000;}

/*导航弹出层 start*/
.iphone__item {
  width: 16.06em;
  height: 1em;
  position: absolute;
  bottom: -2em;
  color: #158f76;
  text-align: center;z-index:9999;
}
.iphone__power-btn {
  width: 2.188em;
  height: .188em;
  background: #e0e0e0;
  position: absolute;
  right: 2.5em;
  top: -0.188em;
}
.iphone__left-btn {
  width: .188em;
  height: 1.250em;
  top: 3.250em;
  left: -0.188em;
  position: absolute;
  background: #e0e0e0;
}
.iphone__left-btn:before {
  content: '';
  width: .188em;
  height: .875em;
  position: absolute;
  top: 3em;
  background: #e0e0e0;
}
.iphone__left-btn:after {
  content: '';
  width: .188em;
  height: .875em;
  position: absolute;
  top: 5.5em;
  background: #e0e0e0;
}
.iphone__details {
  width: .438em;
  height: .438em;
  border-radius: 100%;
  position: relative;
  top: 1.313em;
  left: 8em;
  background: #7c7c7c;
}
.iphone__details:before {
  content: '';
  width: 2.5em;
  height: .25em;
  border-radius: .25em;
  position: absolute;
  top: 1em;
  left: -1em;
  background: #7c7c7c;
}
.iphone__home-btn:before {
  content: '';
  width: .813em;
  height: .813em;
  border: .15em solid #a8a8a8;
  border-radius: .2em;
  position: absolute;
  top: .6em;
  left: .57em;
}
.iphone__content {
  position: relative;
  background-color: #D2527F;
  width: 100%;
  height: 100%;
}

.nav {
  position: absolute;
  z-index: 100;
  opacity: 0;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.nav__trigger { top:40px !important;}
.nav--active .nav {
  opacity: 1;
  background-color: #fff;
  margin-left: 0px;
}
.nav--active .nav a{color:#000;}
.nav__trigger {
  display: block;
  position: absolute;
  width: 30px;
  height: 25px;
  right: 8px;
  top: 5px;
  z-index: 200; 
  padding:9px 5px 8px 8px;
}
.nav--active .nav__trigger {
  opacity: 0.5;
}
.nav__icon {
  display: inline-block;
  position: relative;
  width: 26px;
  height: 2px;
  background-color: #e30113;
  -webkit-transition-property: background-color, -webkit-transform;
  transition-property: background-color, -webkit-transform;
  transition-property: background-color, transform;
  transition-property: background-color, transform, -webkit-transform;
  -webkit-transition-duration: 300ms;
  transition-duration: 300ms;
}
.nav__icon:before,
.nav__icon:after {
  content: '';
  display: block;
  width: 26px;
  height: 2px;
  position: absolute;
  background: #e30113;
  -webkit-transition-property: margin, -webkit-transform;
  transition-property: margin, -webkit-transform;
  transition-property: margin, transform;
  transition-property: margin, transform, -webkit-transform;
  -webkit-transition-duration: 300ms;
  transition-duration: 300ms;
}
.nav__icon:before {
  margin-top: -8px;
}
.nav__icon:after {
  margin-top: 8px;
}

.style-1 .nav {
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
  width: 104%;
  min-height: 100%; float:left; padding-bottom:400px;
}
.style-1 .nav__link {
  opacity: 0;
  -webkit-transition-delay: 500ms;
          transition-delay: 500ms;
}
.style-1 .nav--active .nav__link {
  opacity: 1;
}
.style-1 .nav--active .nav {
  -webkit-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}
.style-1 .nav--active .nav__icon {
  background: rgba(0, 0, 0, 0);
}
.style-1 .nav--active .nav__icon:before {
  margin-top: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.style-1 .nav--active .nav__icon:after {
  margin-top: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

/*导航下拉 start*/
.accordion { margin:0px auto;width:80%;padding-top:95px;}
.accordion .link {
	cursor: pointer;
	display: block;
	padding:10px 0;
	color: #fff;
	font-size: 16px; 
	text-align:center;
	border-bottom: 1px solid #d6d6d6;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
	
}
.accordion li i {
	position: absolute;
	top: 16px;
	left: 12px;
	font-size: 18px;
	color: #fff;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.accordion li i.fa-angle-down {
	right: 12px;
	left: auto;
	font-size: 16px;
}

.accordion li.open .link {
	color: #fff;
}

.accordion li.open i {
	color: #fff;
}
.accordion li.open i.fa-angle-down {
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}



/*当屏幕宽度在大于1200 */
@media screen and (min-width:1921px)
{	
.iphone{display:none;}
.science{position: absolute;top:65%;left:70px;}	
.slogan {position: absolute;top:65%;left:440px;}
	
}


/*当屏幕宽度在1024-1199 */
@media screen and (min-width:1680px) and (max-width:1920px)
{
.iphone{display:none;}	
}

/*当屏幕宽度在1024-1199 */
@media screen and (min-width:1440px) and (max-width:1679px)
{
.iphone{display:none;}	
.science{position: absolute;left:60px;}	
.slogan {position: absolute;left:430px;}
}

/*当屏幕宽度在1024-1199 */
@media screen and (min-width:1201px) and (max-width:1439px)
{
.iphone{display:none;}
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:40px;margin-left:40px;}
.layer .language{float:right;margin-top:60px;margin-right:50px;}
	
.science{position: absolute;left:30px;}	
.slogan {position: absolute;left:400px;}
}

/*当屏幕宽度在1024-1199 */
@media screen and (min-width:1024px) and (max-width:1200px)
{
.iphone{display:none;}
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:40px;margin-left:20px;}
.layer .language{float:right;margin-top:60px;margin-right:50px;}
	
.science{position: absolute;left:10px;}	
.slogan {position: absolute;left:380px;}	
	
}

/*当屏幕宽度大于768小于1023时 */
@media screen and (min-width:768px) and (max-width:1023px)
{
.nav__trigger { top:65px !important;}
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:40px;margin-left:20px;}
.layer .language{float:right;margin-top:60px;margin-right:50px;display:none;}
	
.science{position: absolute;top:60%;left:15px;display: none;}	
.slogan {position: absolute;top:60%;left:30px;width:684px;color:#fff;text-align:left;z-index:999;}
.slogan .subtitle {display:block;font-weight:200;font-size:34px;letter-spacing:2px;margin:62px 0 16px;float:left;text-align: left;}
.slogan .title {display:block;font-weight:800;font-size:39px;margin: 0 0 12px;float:left;text-align: left;text-transform:uppercase;letter-spacing:1px;}
.slogan .try-btn {position: relative;left: 0%;width: 156px;height:54px;line-height: 54px;margin-top:40px;margin-left: 0px;color: #fff;text-align:left;border-radius: 0px;font-weight:400;font-size:14px;}
.slogan .try-btn a{color:#fff;}	
}

/*当屏幕宽度大于1280小于1440时 */
@media screen and (min-width:650px) and (max-width:767px)
{
.nav__trigger { top:65px !important;}	
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:40px;margin-left:20px;width:50%;}
.layer .language{float:right;margin-top:60px;margin-right:20px;display:none;}	
	
.science{position: absolute;top:24%;left:24%;width:338px;height:338px;color:#fff;text-align:left;z-index:999;display: none;}
.slogan {position: absolute;top:70%;left:24%;width:100%;color:#fff;text-align:left;z-index:999;}
.slogan .subtitle {display:block;font-weight:200;font-size:16px;letter-spacing:2px;margin:16px 0 10px;float:left;text-align: left;}
.slogan .title {display:block;font-weight:800;font-size:24px;margin:0 400px 0px 0px;float:left;text-align: left;text-transform:uppercase;letter-spacing:1px;}
.slogan .try-btn {position: relative;left: 0%;width:156px;height:34px;line-height:34px;margin-top:50px;margin-left: 0px;color: #fff;text-align:left;border-radius: 0px;font-weight:400;font-size:12px;}
.slogan .try-btn a{color:#fff;}		
	
}	

/*当屏幕宽度大于1280小于1440时 */
@media screen and (min-width:540px) and (max-width:649px)
{
.nav__trigger { top:50px !important;}		
.banner{position: absolute;left: 50%;top: 50%;/*保证视频内容始终居中*/transform: translate(-50%, -50%);width: 100%;height: 100%;object-fit: cover;min-height:720px;}	
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:40px;margin-left:20px;width:50%;}
.layer .language{float:right;margin-top:60px;margin-right:20px;display:none;}	
	
.science{position: absolute;top:20%;left:18%;width:338px;height:338px;color:#fff;text-align:left;z-index:999;display: none;}
.slogan {position: absolute;top:70%;left:30px;width:100%;color:#fff;text-align:left;z-index:999;}
.slogan .subtitle {display:block;font-weight:200;font-size:16px;letter-spacing:2px;margin:16px 0 10px;float:left;text-align: left;}
.slogan .title {display:block;font-weight:800;font-size:24px;margin:0 260px 0px 0px;float:left;text-align: left;text-transform:uppercase;letter-spacing:1px;}
.slogan .try-btn {position: relative;left: 0%;width:156px;height:34px;line-height:34px;margin-top:50px;margin-left: 0px;color: #fff;text-align:left;border-radius: 0px;font-weight:400;font-size:12px;}
.slogan .try-btn a{color:#fff;}		
	
}	

/*当屏幕宽度大于1280小于1440时 */
@media screen and (min-width:401px) and (max-width:539px)
{
	
.nav__trigger { top:28px !important;}		
.banner{position: absolute;left: 50%;top: 50%;/*保证视频内容始终居中*/transform: translate(-50%, -50%);width: 100%;height: 100%;object-fit: cover;min-height:670px;}
	
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:20px;margin-left:20px;width:50%;}
.layer .language{float:right;margin-top:30px;margin-right:20px;display:none;}	
	
.science{position: absolute;top:25%;left:38px;width:338px;height:338px;color:#fff;text-align:left;z-index:999;display: none;}
.slogan {position: absolute;top:70%;left:38px;width:100%;color:#fff;text-align:left;z-index:999;}
.slogan .subtitle {display:block;font-weight:200;font-size:16px;letter-spacing:2px;margin:16px 0 10px;float:left;text-align: left;}
.slogan .title {display:block;font-weight:800;font-size:24px;margin:0 135px 0px 0px;float:left;text-align: left;text-transform:uppercase;letter-spacing:1px;}
.slogan .try-btn {position: relative;left: 0%;width:156px;height:34px;line-height:34px;margin-top:50px;margin-left: 0px;color: #fff;text-align:left;border-radius: 0px;font-weight:400;font-size:12px;}
.slogan .try-btn a{color:#fff;}		
	
.slan{border:none;line-height:20px;font-size:12px;width:80px;height:20px;text-indent:4px;background-color:#fff;border-radius:4px;border:0px solid #b7b7b7;}
.slan option{text-indent:4px;background-color:#fff;font-size:12px;width:80px;height: 20px;line-height:20px;}
	
}	

/*当屏幕宽度大于1280小于1440时 */
@media screen and (min-width:371px) and (max-width:400px)
{
	
.nav__trigger { top:25px !important;}		
.banner{position: absolute;left: 50%;top: 50%;/*保证视频内容始终居中*/transform: translate(-50%, -50%);width: 100%;height: 100%;object-fit: cover;min-height:670px;}
	
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:20px;margin-left:20px;width:50%;}
.layer .language{float:right;margin-top:30px;margin-right:20px;display:none;}	
	
.science{position: absolute;top:19%;left:24px;width:338px;height:338px;color:#fff;text-align:left;z-index:999;display:none;}
.slogan {position: absolute;top:70%;left:24px;width:100%;color:#fff;text-align:left;z-index:999;}
.slogan .subtitle {display:block;font-weight:200;font-size:16px;letter-spacing:2px;margin:16px 0 10px;float:left;text-align: left;}
.slogan .title {display:block;font-weight:800;font-size:24px;margin:0 100px 0px 0px;float:left;text-align: left;text-transform:uppercase;letter-spacing:1px;}
.slogan .try-btn {position: relative;left: 0%;width:156px;height:34px;line-height:34px;margin-top:50px;margin-left: 0px;color: #fff;text-align:left;border-radius: 0px;font-weight:400;font-size:12px;}
.slogan .try-btn a{color:#fff;}		
	
.slan{border:none;line-height:20px;font-size:12px;width:80px;height:20px;text-indent:4px;background-color:#fff;border-radius:4px;border:0px solid #b7b7b7;}
.slan option{text-indent:4px;background-color:#fff;font-size:12px;width:80px;height: 20px;line-height:20px;}
	
}	

/*当屏幕宽度大于1280小于1440时 */
@media screen and (min-width:321px) and (max-width:370px)
{
	
.nav__trigger { top:20px !important;}		
.banner{position: absolute;left: 50%;top: 50%;/*保证视频内容始终居中*/transform: translate(-50%, -50%);width: 100%;height: 100%;object-fit: cover;min-height:670px;}
	
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:20px;margin-left:20px;width:50%;}
.layer .language{float:right;margin-top:30px;margin-right:20px;display:none;}	
	
.science{position: absolute;top:18%;left:12px;width:338px;height:338px;color:#fff;text-align:left;z-index:999;display:none;}
.slogan {position: absolute;top:70%;left:20px;width:100%;color:#fff;text-align:left;z-index:999;}
.slogan .subtitle {display:block;font-weight:200;font-size:16px;letter-spacing:2px;margin:16px 0 10px;float:left;text-align: left;}
.slogan .title {display:block;font-weight:800;font-size:24px;margin:0 50px 0px 0px;float:left;text-align: left;text-transform:uppercase;letter-spacing:1px;}
.slogan .try-btn {position: relative;left: 0%;width:156px;height:34px;line-height:34px;margin-top:50px;margin-left: 0px;color: #fff;text-align:left;border-radius: 0px;font-weight:400;font-size:12px;}
.slogan .try-btn a{color:#fff;}		
	
.slan{border:none;line-height:20px;font-size:12px;width:80px;height:20px;text-indent:4px;background-color:#fff;border-radius:4px;border:0px solid #b7b7b7;}
.slan option{text-indent:4px;background-color:#fff;font-size:12px;width:80px;height: 20px;line-height:20px;}
	
}	


/*当屏幕宽度大于1280小于1440时 */
@media screen and (min-width:280px) and (max-width:320px)
{
	
.nav__trigger { top:22px !important;}		
.banner{position: absolute;left: 50%;top: 50%;/*保证视频内容始终居中*/transform: translate(-50%, -50%);width: 100%;height: 100%;object-fit: cover;min-height:658px;}
	
.layer {position: absolute;left: 0;top: 0;width: 100%;height: 100vh;z-index:999;}
.layer img {float:left;margin-top:20px;margin-left:15px;width:50%;}
.layer .language{float:right;margin-top:22px;margin-right:10px;display:none;}	
	
.science{position: absolute;top:20%;left:-8px;width:100%;height:auto;color:#fff;text-align:left;z-index:999;display: none;}
.slogan {position: absolute;top:70%;left:15px;width:100%;color:#fff;text-align:left;z-index:999;}
.slogan .subtitle {display:block;font-weight:200;font-size:14px;letter-spacing:2px;margin:16px 0 10px;float:left;text-align: left;}
.slogan .title {display:block;font-weight:800;font-size:20px;margin:0 0px 0px 0px;float:left;text-align: left;text-transform:uppercase;letter-spacing:1px;}
.slogan .try-btn {position: relative;left: 0%;width:156px;height:34px;line-height:34px;margin-top:50px;margin-left: 0px;color: #fff;text-align:left;border-radius: 0px;font-weight:400;font-size:12px;}
.slogan .try-btn a{color:#fff;}
	
.slan{border:none;line-height:20px;font-size:12px;width:80px;height:20px;text-indent:4px;background-color:#fff;border-radius:4px;border:0px solid #b7b7b7;}
.slan option{text-indent:4px;background-color:#fff;font-size:12px;width:80px;height: 20px;line-height:20px;}
	
}