.industry{ padding-bottom: 150px;}
.industry .description{ padding: 0px 15px; max-width: 600px; width: 100%; margin: 0 auto; text-align: center;}
.industry .description p{ margin-top: 10px; font-size: 18px;}
.ip{ position:relative; max-width: 800px; width: 100%; height: 800px; margin:90px auto 0; overflow: hidden;}
.ip li{ position: absolute;}
.ip .center-img{ top:50%; left:50%; margin-left: -300px; margin-top: -300px; animation: rotateIn 6s linear 0s infinite both;  -webkit-animation: rotateIn 6s linear 0s infinite both; -moz-animation: rotateIn 6s linear 0s infinite both;   z-index: 1; }
.ip .text{ top:50%; left:50%; margin-left: -50px; margin-top: -50px;z-index: 2; }
.ip .cloud{ animation: rotateIn 6s linear 0s infinite both;  -webkit-animation: rotateIn 6s linear 0s infinite both; -moz-animation: rotateIn 6s linear 0s infinite both;  position: relative; z-index: 0;}
.ip .item{ z-index: 4; cursor: pointer;}
.ip .item a{ display: block; cursor: pointer;}
.ip .item div{ position: relative;}
.ip .item .circle1{ width: 116px; font-size: 23px;}
.ip .item .circle2{ width: 106px; font-size: 20px;}
.ip .item .circle3{ width: 90px; font-size: 18px;}
.ip .item .circle4{ width: 80px; font-size: 16px;}
.ip .item span{ position: absolute; top:50%; left:0px; width: 100%; margin-top: -24px;height:60px; line-height: 48px;text-align: center; }
.ip .item .s2{ line-height: 24px;}
.ip .item p{ width: 100%; animation: rotateIn 6s linear 0s infinite both;  -webkit-animation: rotateIn 6s linear 0s infinite both; -moz-animation: rotateIn 6s linear 0s infinite both;  }
.ip .item p i{ display: inline-block; padding-bottom: 100%;}
.ip .item01{ top:1.5%; right:43%;}
.ip .item02{ top:11.5%; right:28%;}
.ip .item03{ top:19.5%; right:13%;}
.ip .item04{ top:36.5%; right:10%;}
.ip .item05{ top:52.5%; right:8%;}
.ip .item06{ top:66.5%; right:17%;}
.ip .item07{ top:72.5%; right:37%;}
.ip .item08{ top:85%; left:41%;}
.ip .item09{ top:71.5%; left:26%;}
.ip .item10{ top:65%; left:10%;}
.ip .item11{ top:52.5%; left:2%;}
.ip .item12{ top:40%; left:12.5%;}
.ip .item13{ top:22.5%; left:7.5%;}
.ip .item14{ top:8.75%; left:21.5%;}
.ip .item15{ top:17.5%; left:37.5%;}
.ip .item16{ top:84%; right:28%;}

/*text*/
.ip .des{ position:absolute; z-index:3; width:100%; height:100%; top:0; left:0;  text-align:center; display: none;}
.ip .des .con{  width:40%;*zoom:1; padding: 20px; display:inline-block; *display:inline; vertical-align:middle; text-align:left; background: rgba(0,0,0,.8); position:relative; font-size: 17px; line-height: 26px;}
.ip .des .con span{ display: none;}
.ip .des .con span.active{ display:inline-block;}
.ip .des .close{ position:absolute; display: inline-block; top:0px; right:-30px; background-image:url(../images/common/lstclose.png); width:30px; height:30px; cursor: pointer;}
.ip .des .con+i{display:inline-block; vertical-align:middle; height:100%;}

@media screen and (max-width:720px){
	.industry{ padding-bottom: 50px;}
	.industry .description p{ font-size: 13px;}
	.ip{ height: 600px; margin-top:30px; }
	.ip .center-img{ width:400px; margin-left: -200px; margin-top:-200px;}
	.ip .text{ width: 80px; margin-left: -40px; margin-top: -40px;}
	.ip .cloud{ display: none;}
	.ip .item .circle1{ width: 90px; font-size: 16px;}
	.ip .item .circle2{ width: 80px; font-size: 15px;}
	.ip .item .circle3{ width: 60px; font-size: 14px;}
	.ip .item .circle4{ width: 55px; font-size: 12px;}
	.ip .item span{ line-height: 40px; height: 40px; margin-top:-20px;}
	.ip .item .s2{ line-height: 20px;}
	.ip .des .con{ width: 36%; font-size: 13px; line-height: 24px; padding: 15px;}
}
@media screen and (max-width:480px){
	.ip{ height:500px;}
	.ip .center-img{ width:280px; margin-left: -140px; margin-top:-140px;}
	.ip .text{ width: 60px; margin-left: -30px; margin-top: -30px;}
	.ip .item .circle1{ width: 80px; }
	.ip .item .circle2{ width: 70px;}
	.ip .item .circle3{ width: 60px; }
	.ip .item .circle4{ width: 55px;}
	.ip .item01{ top:0%; right:43%;}
	.ip .item02{ top:12%; right:22%;}
	.ip .item03{ top:26%; right:8%;}
	.ip .item04{ top:40%; right:2%;}
	.ip .item05{ top:58%; right:6%;}
	.ip .item06{ top:72%; right:3%;}
	.ip .item07{ top:66%; right:28%;}
	.ip .item08{ top:84%; left:42%;}
	.ip .item09{ top:70%; left:26%;}
	.ip .item10{ top:66%; left:4%;}
	.ip .item11{ top:52.5%; left:2%;}
	.ip .item12{ top:38%; left:8%;}
	.ip .item13{ top:22.5%; left:6%;}
	.ip .item14{ top:8.75%; left:15%;}
	.ip .item15{ top:22%; left:37.5%;}
	.ip .item16{ top:87%; right:18%;}
	.ip .des .con{ width: 42%; font-size: 12px; line-height: 20px; padding: 8px;}
	.ip .des .close{ right:-20px; width: 20px; height: 20px;}
}

@-webkit-keyframes rotateIn {
	from {
		-webkit-transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(360deg)
	}
}

@-moz-keyframes rotateIn {
	from {
		-moz-transform: rotate(0deg)
	}
	to {
		-moz-transform: rotate(359deg)
	}
}

@-o-keyframes rotateIn {
	from {
		-o-transform: rotate(0deg)
	}
	to {
		-o-transform: rotate(359deg)
	}
}

@keyframes rotateIn {
	from {
		transform: rotate(0deg)
	}
	to {
		transform: rotate(359deg)
	}
}
.rotateIn {
	-webkit-animation-name: rotateIn;
	animation-name: rotateIn
}





/******toy******/
.toy{color: #242424; padding-bottom: 50px;}
.toy a{ color: #242424;}
.toy a:hover{ color: #df3343;}
.toy .depict{ max-width: 740px; width: 100%; padding: 50px 15px 40px; text-align: center; margin: 0 auto;}
.toy .depict .tit{ font-size: 28px; font-weight: bold; margin-bottom: 10px; background: url(../images/industry/toy-line.png) center no-repeat;}
.toy .depict .dimg img{max-width:200px; width: 40%;}
.toy .depict .text{ font-size: 15px; margin: 20px 0px; line-height: 22px;}
.toy .depict .link a{ margin: 0px 10px; padding:3px 20px; display: inline-block; border: 1px solid #3277b3;}
.toy .depict .link a img{ margin-right: 15px; display: inline-block; vertical-align: middle;}
.toy .depict .link a span{ display: inline-block; vertical-align: middle;}
.toy .depict .link .a1{ color: #3277b3;}
.toy .depict .link .a2{ background: #3277b3; color: #FFFFFF;}
@media screen and (max-width:640px) {
	.toy .depict{ padding: 30px 15px;}
	.toy .depict .tit{ font-size:16px; margin-bottom:0px; background: url(../images/industry/toy-line2.png) center no-repeat;}
	.toy .depict .text{ font-size: 12px; line-height: 18px; margin:0px 0px 10px;}
	.toy .depict .link a{ margin: 0px 5px; padding: 2px 10px;}
	.toy .depict .link a img{ margin-right:8px;}
}

.toy .list{ width: 100%;}
.toy .list li.empty{ z-index: 0;}
.toy .list li{ float: left; width: 20%; position: relative; z-index:1;}
.toy .list li a{ display: block; cursor: pointer;}
.toy .list li div{ position: absolute; top:0px; left:0px; width: 100%; height: 100%;}
.toy .list li i{ display: inline-block; padding-bottom: 100%;}
.toy .list li p{ position: absolute; bottom:0px; left:0px; width: 100%; font-size: 22px; height: 74px; line-height: 74px; padding:0px 20px; color: #ffffff;}
.toy .list li i{ font-style: normal;}
.toy .list li span{ position: absolute; top:-28px; left:50%; margin-left:-16px; display: inline-block; width: 0px; height: 0px; border-width:14px;}
.toy .list li span.top{border-style:  dashed dashed solid dashed;}
.toy .list li span.left{border-style: dashed dashed dashed solid;}
.toy .list li span.bottom{border-style: solid dashed dashed dashed;}

/*list1*/
.toy .list1 .item01 div{ height: 200%;}
.toy .list1 .item01 p{ bottom:auto; top: 0; height:30%;}
.toy .list1 .item01 span{ top:auto; bottom:-28px}
.toy .list1 .item02 span, .toy .list1 .item07 span{ left:15%; }
.toy .list1 .item04 div,.toy .list1 .item09 div{ right:0px; left:auto;}
.toy .list1 .item04 p,.toy .list1 .item09 p{ width:40%; height: 100%;}
.toy .list1 .item04 span,.toy .list1 .item09 span{ right:-28px; left:auto; margin-left: 0px; top:50%; margin-top: -14px;}
.toy .list1 .item02 div,.toy .list1 .item04 div,.toy .list1 .item07 div,.toy .list1 .item09 div{ width: 150%;}

/*list2*/
.toy .list2 li{ width: 25%; }
.toy .list2 li span{ left:15%;}
/* .toy .list2 .item01 div,.toy .list2 .item08 div{ width: 200%;}
.toy .list2 .item01 p,.toy .list2 .item08 p{ width:20%; height: 100%;}
.toy .list2 .item01 span,.toy .list2 .item08 span{ right:-28px; left:auto; margin-left: 0px; top:50%; margin-top: -14px;}
.toy .list2 .item05 div{ height: 200%;} */

@media screen and (max-width:1300px){
	.toy .list li p{ height: 50px; line-height: 50px; font-size: 16px; padding: 0px 10px;}
	.toy .list1 .item01 p{ height: 25%;}
	.toy .list1 .item04 p,.toy .list1 .item09 p{ width: 30%;}
}
@media screen and (max-width:1200px){
	.toy .list li p{ font-size: 14px; padding: 0px 5px;}
}
@media screen and (max-width:940px){
	.toy .list li{ width: 50%;}
	.toy .list li i{ display: inline-block; width:20px; line-height: 20px;}
	.toy .list1 .item06,.toy .list1 .item08{ display: none;}
	.toy .list1 .item02 div,.toy .list1 .item04 div,.toy .list1 .item07 div,.toy .list1 .item09 div{ width: 100%;}
	.toy .list1 .item04 p,.toy .list1 .item09 p{ text-align: center; padding-top:10px;}
	.toy .list1 .item02 span, .toy .list1 .item07 span{ left:50%; }
	.toy .list2 li span{ left:50%;}
	.toy .list2 .item05 div{ height: 100%; }
	.toy .list2 .item08 div{ width: 100%;}
	.toy .list2 .item08 div p{ text-align: center; padding-top:10px;}
}
@media screen and (max-width:640px){
	.toy{ padding-bottom: 30px;}
}




/******media******/
.media{ color: #242424; font-size: 15px; line-height: 26px;}
.media a{ color: #242424;}
.media a:hover{ color: #df3343;}
.media .w830{ max-width:830px; width: 100%; padding:0px 15px; margin: 0px auto;}
.media .text{ padding-top: 50px; padding-bottom: 70px;}
.media .text .tit{ font-size: 35px; line-height: 40px; text-align: center; margin-bottom:40px;}
.media .text .abuy{display: inline-block; padding:5px 20px; background: #df3343; color: #FFFFFF;}
.media .text .abuy img{ margin-right: 10px; display: inline-block; vertical-align: middle;}
.media .text .abuy span{ display: inline-block; vertical-align: middle;}

.media .w1070{ max-width: 1070px; width: 100%; padding: 0px 10px; margin: 0 auto;}
.media-tit{ text-align: center; color: #FFFFFF;}
.media-tit span{ display: inline-block; font-size: 35px; width: 350px; color: #FFFFFF; position: relative;}
.media-tit span em{ width: 100%; height: 60px; line-height: 60px; font-style: normal; position: relative; z-index: 2;}
.media-tit span i{ position: absolute; display: inline-block; top:0px; left:0px; width:100%;border-top: 60px solid #ecb200; border-left:40px solid transparent; border-right: 40px solid transparent; z-index: 1;}
.media-tab{ margin-top: 60px; text-align: center; color: #FFFFFF;}
.media-tab span{ display: inline-block; vertical-align:bottom; cursor: pointer; padding-right: 10px; overflow: hidden;}
.media-tab span em{  margin-left: -10px; font-style: normal; display: inline-block;font-size: 18px; padding:10px 40px; background: #3ac2b2;  transform:skew(20deg);-ms-transform:skew(20deg);-moz-transform:skew(20deg); -webkit-transform:skew(20deg); -o-transform:skew(20deg);}
.media-tab span i{ font-style: normal; display: inline-block; transform:skew(-20deg);-ms-transform:skew(-20deg);-moz-transform:skew(-20deg); -webkit-transform:skew(-20deg); -o-transform:skew(-20deg);}
.media-tab2 span em{ background: #429dda;}
.media-tab span.active em{  background: #FFFFFF; color: #2a2a2a;}
.media-container{ padding: 60px 0px;}
.media-container .con{ display: none; }
.media-container .con .left{ float: left; width: 55%;}
.media-container .con .left img{ width: 100%;}
.media-container .con .right{ float: right; width: 40%;}
.media-container .con .right .f20{ font-size: 20px; font-weight: bold;}

@media screen and (max-width:1000px) {
	.media .text .tit{ font-size: 24px; margin-bottom: 30px;}
	.media-tit span{font-size: 24px; width: 280px;}
	.media-tit span em{ height: 50px; line-height: 50px;}
	.media-tit span i{ border-top: 50px solid #ecb200;}
	.media-tab{ margin-top: 40px;}
	.media-tab span em{ padding:8px 24px; font-size: 14px;}
}
@media screen and (max-width:780px) {
	.media-container .con .left{ float: none; width: 100%;}
	.media-container .con .right{ float: none; margin-top: 30px; width: 100%;}
}

@media screen and (max-width:640px) {
	.media{ font-size: 12px; line-height: 20px;}
	.media .text{ padding-top: 20px; padding-bottom: 30px;}
	.media .text .tit{ font-size: 20px; line-height: 30px; margin-bottom: 10px;}
	.media-tit span{font-size:18px; width: 200px;}
	.media-tit span em{ height: 40px; line-height: 40px;}
	.media-tit span i{ border-top: 40px solid #ecb200; border-left:25px solid transparent; border-right:25px solid transparent;}
	.media-tab{ margin-top: 10px;}
	.media-tab span{ float: left; width:50%; padding-right:0px;}
	.media-tab span em{ margin:1px; width: 100%; transform:skew(0deg);-ms-transform:skew(0deg);-moz-transform:skew(0deg); -webkit-transform:skew(0deg); -o-transform:skew(0deg);}
	.media-tab span i{transform:skew(-20deg);-ms-transform:skew(0deg);-moz-transform:skew(0deg); -webkit-transform:skew(0deg); -o-transform:skew(0deg);}
	.media-container{ padding: 30px 0px;}
	.media-container .con .right{ margin-top:20px;}
	.media-container .con .right .f20{ font-size: 16px;}
}




/******global******/
.global{ color: #242424; font-size: 15px; line-height: 26px; padding-bottom: 75px;}
.global a{ color: #242424;}
.global a:hover{ color: #df3343;}
.global .w830{ max-width:830px; width: 100%; padding:0px 15px; margin: 70px auto 0;}
.global .ul-img { margin-top: 60px;}
.global .ul-img li{ float: left; padding: 0px 10px; width: 33.3%;}

@media screen and (max-width:640px) {
	.global{ font-size: 12px; line-height: 20px; padding-bottom: 30px;}
	.global .w830{ margin-top: 20px;}
	.global .ul-img{ margin-top: 20px;}
}