@charset "utf-8";
/*startpage*/
body{background: #09031b;overflow-x: hidden;}
body img{pointer-events: none;}
.wrap{
	width: 100%;
	height: 100%;
	overflow: hidden;
}
body img{width: 100%;display: block;}
.a_btn{
	display: block;
	width: 46%;
	height: 3.5em;
	background: url("../images/btnbg.png") no-repeat center top;
	background-size: 100% 100%;
}
.a_btn span{
	display: block;
	width: 100%;
	height: 2em;
	margin: 0 auto;
	border-radius: 1.5em;
	font-size: 1.1em;
	color: #fff;
	text-align: center;
	line-height: 2em;
	background: -webkit-linear-gradient(left,#eb8417, #ff01ed); /* Safari 5.1 - 6.0 */
	background: -o-linear-gradient(right,#eb8417, #ff01ed); /* Opera 11.1 - 12.0 */
	background: -moz-linear-gradient(right,#eb8417, #ff01ed); /* Firefox 3.6 - 15 */
	background: linear-gradient(right,#eb8417, #ff01ed); /* 标准的语法 */
}

.box_hd{text-align: center;}
.box_hd h2{font-size: 1.3em;color: #f246fd;text-align: center;display: inline-block;font-weight: bold; position: relative;padding: 3% 11% 4%;}
.box_hd h2 img{position: absolute;width: 30px;}
.box_hd h2 img.boxhd1{left: 0;top: 48%;}
.box_hd h2 img.boxhd2{right: 0;top: 0;}
.box_hd span{display: block;width: 15%;height: 2px;background: #aa2fbc;margin: 0 auto;}

.banner{
	width: 100%;
	position: relative;
}
.banner .a_btn{position: absolute;left: 27%;top: 36%;}

/* box1 */
.box1{padding-top: 2%;}

/* box2 */
.box2{margin-top: 10%;background: #3d074a;position: relative;padding: 5% 6%;}
.box2 p{font-size: 1em;color: #fff;line-height: 1.6em;}
.box2 p b{color: #ff199b;}
.box2 p span{color: #ff8c24;}
.box2 img{
	position: absolute;
	width: 40%;
	right: 10%;
	top: -22%;
}

/* box3 */
.box3{padding-top: 8%;}
.box3 .box3_con{padding-top: 8%;}
.box3 .box3_con h2{font-size: 1.2em;color: #fff;text-align: center;line-height: 1.6em;}
.box3 .box3_con p{font-size: .9em;color: #fff;line-height: 1.6em;padding: 2% 5% 5%;}
.box3 .box3_con img{width: 90%;margin: 0 auto;}
.box3 .box3_con .swiper-button-prev,.box3 .box3_con .swiper-button-next{height: 60px;top: 58%;}
.box3 .box3_con .swiper-button-prev{background: url("../images/box3left.png") no-repeat center top;background-size: 100%;left: 0;}
.box3 .box3_con .swiper-button-next{background: url("../images/box3right.png") no-repeat center top;background-size: 100%;right: 0;}

/* box4 */
.box4{padding: 8% 0 10%;}
.box4 .a_btn{margin: 5% auto 0;width: 60%;}

/* box5 */
.box5{
	background: -webkit-linear-gradient(left,#47245b, #7c3aa6); /* Safari 5.1 - 6.0 */
	background: -o-linear-gradient(right,#47245b, #7c3aa6); /* Opera 11.1 - 12.0 */
	background: -moz-linear-gradient(right,#47245b, #7c3aa6); /* Firefox 3.6 - 15 */
	background: linear-gradient(right,#47245b, #7c3aa6); /* 标准的语法 */
	padding: 8% 0 4%;
}
.box5 .box_hd{margin-bottom: 5%;}
.box5 .box_hd h2{padding: 3% 6% 4%;color: #fff;}
.box5 .box_hd span{background: #fd0cda;}
.box5 .box5_con p{
	width: 88%;
	margin-left: 9%;
	font-size: .9em;
	color: #fff;
	line-height: 1.8em;
	position: relative;
}
.box5 .box5_con p span{
	position: absolute;
	left: -6%;
	top: 1%;
}
.box5 .a_btn{margin: 5% auto 0;width: 60%;}

/* box6 */
.box6{padding: 12% 0 5%;position: relative;}
.box6 .box_hd{
	position: absolute;
	width: 100%;
	left: 0;
	top: 3%;
}
.box6 .a_btn{
	position: absolute;
	left: 20%;
	width: 60%;
	bottom: -1.5%;
}

/*box7开始*/
.box7{padding: 8% 0 5%;}
.box7 .main{overflow: hidden;}
.box7 .main .top{overflow: hidden;padding-bottom: 5%;width: 100%;margin: 5% 0 0 2%;}
.box7 .main .top div{
	width: 18%;margin-left: 1%;text-align: center;color: #fff;padding:1% 0;float: left;border-radius: .5em;
	background: -webkit-linear-gradient(#c945ae, #8033bd); /* Safari 5.1 - 6.0 */
	background: -o-linear-gradient(#c945ae, #8033bd); /* Opera 11.1 - 12.0 */
	background: -moz-linear-gradient(#c945ae, #8033bd); /* Firefox 3.6 - 15 */
	background: linear-gradient(#c945ae, #8033bd); /* 标准的语法 */
}
.box7 .main .top div h2{font-size: 1em;}
.box7 .main .top div p{font-size:.8em;line-height: 2em;}
.box7 .main .top div.red{
	background: -webkit-linear-gradient(left,#ea6e32, #f65c6b); /* Safari 5.1 - 6.0 */
	background: -o-linear-gradient(right,#ea6e32, #f65c6b); /* Opera 11.1 - 12.0 */
	background: -moz-linear-gradient(right,#ea6e32, #f65c6b); /* Firefox 3.6 - 15 */
	background: linear-gradient(right,#ea6e32, #f65c6b); /* 标准的语法 */
}
.box7 .main .btm{width: 92%;margin: 0 auto;}
.box7 .main .btm .con{width: 100%;height: 0;}
.box7 .main .btm .con.show{height: 100%;}
.box7 .main .btm .swiper-container {width: 100%;height: 100%;padding-bottom: 10%;}
.box7 .main .btm .swiper-pagination{bottom: 16%;}
.box7 .main .btm .swiper-pagination span{background: #9d9aa4;opacity: 1;}
.box7 .main .btm .swiper-pagination span.swiper-pagination-bullet-active{background: #f5575e;}
.box7 .main .btm .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{float: left;margin:0 3px;display: block;background: #CCCCCC;}
.box7 .main .btm .swiper-pagination-bullet-active{background: #999;}
.box7 .main .btm .swiper-pagination-bullet{width: 10px;height: 10px;}
.box7 .main .btm p{margin-bottom: 1px; width: 80%;height: 3.5em;border: 1px #8257ff solid;font-size:.9em;color: #fff;text-align: center;margin: 2% auto 0;line-height: 2em;}
.box7 .swiper-container-horizontal>.swiper-pagination-bullets{bottom: 4px;}
.box7 .main .swiper-button-prev,.box7 .main .swiper-button-next{width: 50px;top: 79%;}
.box7 .main .swiper-button-prev{background: url("../images/box7left.jpg") no-repeat center top;background-size: 100%;left: 0;}
.box7 .main .swiper-button-next{background: url("../images/box7right.jpg") no-repeat center top;background-size: 100%;right: 0;}

/* box8 */
.box8 .box_hd h2{padding: 3% 0 4%;}
.box8 .box_hd h2 img.boxhd1{top: 54%;}
.box8 .box_hd h2 img.boxhd2{top: 54%;}
.box8 h2{font-size: 1.4em;text-align: center;padding: 10% 0 5%;}
.box8 .main{width: 100%;margin: 6% auto 0;overflow: hidden;}
.box8 .main ul{width:100%;height: 50px;line-height: 50px;overflow: hidden;background: #ffbd08;margin-bottom: 3%;}
.box8 .main ul li{font-size:.95em;float: left; color: #000;text-align: center;font-weight: bold;}
.box8 .scrollDiv{width: 100%; float:left;height: 20em;}
.box8 .scrollDiv ol{width: 100%;}
.box8 .scrollDiv ol li{overflow: hidden;}
.box8 .scrollDiv p{font-size:.9em;color: #fff;float: left;text-align: center;padding: 2% 0;}
.box8 .li1{width:17%;}
.box8 .li2{color: #f246fd !important;font-weight: bold;}
.box8 .li3{width: 44%;margin-left: 3%;text-align: left !important;}
.box8 .p1{font-size: .8em;text-align: center;color: #999;margin-top: 3%;}

/* box9 */
.box9{padding-top: 10%;}
.box9 .a_btn{width: 60%;margin: 8% auto 0;}

/* box10 */
.box10 .box_hd h2{padding: 3% 10% 4%;}
.box10 .box_hd h2 img.boxhd1{top: 54%;}
.box10 .box_hd h2 img.boxhd2{top: 54%;}
.box10 .box10_con .box10con{width: 85%;margin: 8% auto 0;padding-bottom: 10%;}
.box10 .box10_con .swiper-pagination span{background: #8516eb;opacity: 1;width: 5%;height: .2em;border-radius: 0;}
.box10 .box10_con .swiper-pagination span.swiper-pagination-bullet-active{background: #7f5c9f;}
.box10 .a_btn{width: 60%;margin: 3% auto 8%;}

/*添加解决方案式教学 让学习更简单*/
.boxadd .main{width:92%;margin: 5% auto 0;}
.boxadd .top_box{overflow: hidden;}
.boxadd .top{width:31.3%;float: left;margin: 0 1%;border-radius: 10px;font-size: .95em;color: #fff;text-align: center;padding: 3% 1.5%;
background: linear-gradient(top left, #8516eb, #eb31e3);
background: -ms-linear-gradient(top left, #8516eb, #eb31e3);
background: -webkit-linear-gradient(top left,#8516eb, #eb31e3);
background: -moz-linear-gradient(top left, #8516eb, #eb31e3);}
.boxadd .top.on{background:#f73697;}
.boxadd .btm_box{width:100%;margin: 0 auto;}
.boxadd .btm{display:none;overflow: hidden;margin-top:8%;}
.boxadd .btm.show{display:block;}
.boxadd .btm .fl{width:100%;margin: 0 auto;}
.boxadd .btm .fr{width: 100%;color: #fff;margin-top: 5%;}
.boxadd .btm .fr p{font-size: .85em;line-height:1.7em;}
.boxadd .a_btn{margin:7% auto  4%;}
.boxadd .a_swiper{padding-bottom: 10%;}
.boxadd .swiper-pagination{bottom: 0;}
.boxadd .swiper-pagination span{background: #9d9aa4;opacity: 1;width: 12px;height: 12px;}
.boxadd .swiper-pagination span.swiper-pagination-bullet-active{background: #f5575e;}

.clears::after{
	content: ".";
	clear: both;
	display: block;
	overflow: hidden;
	font-size: 0;
	height: 0;
}
.clears{
	zoom: 1;
}



/*小屏幕/苹果5s*/
@media screen and (max-width: 320px){
	body{font-size: .9rem}
	
}
/* iphone6 plus */
@media (min-width : 410px) and (max-width : 736px){
	.box2{padding: 5% 10%;}
}
/*大于pad屏幕*/
@media screen and (min-width: 750px){
	body{font-size: 1.5rem}
	.box_hd h2 img{width: 60px;}
	.box2{padding: 5% 14%;}
	.box3 .box3_con .swiper-button-prev, .box3 .box3_con .swiper-button-next{width: 38px;height: 84px;}
}