@charset "UTF-8";
/* banner&下载信息 */
header .banner {
	background: url("../images/banner-sm.png") center bottom;
	color: #ffffff;
	margin: 3px 0;
	height: 302px;
	min-width: 1200px;
}

header .banner .content {
	margin: auto;
	text-align: center;
	width: 1200px;
	height: 302px;
}

header .banner .content .content-left {
	width: 448px;
	float: left;
}

header .banner .content .content-right {
	width: 451px;
	float: left;
	padding-top: 90px;
}

header .banner .content .content-right .banner-title {
	font-size: 48px;
	line-height: 30px;
	letter-spacing: 2px;
}

header .banner .content .content-right .banner-title font {
	color: #f4fc2c;
}

header .banner .content .content-right .banner-subtitle {
	width: 437px;
	margin-top: 26px;
	font-size: 28px;
	line-height: 30px;
	letter-spacing: 1px;
	color: #ffffff;
	text-align: left;
	display: inline-block;
}

header .banner .content .content-right .banner-desc {
	width: 437px;
	margin-top: 11px;
	font-size: 18px;
	line-height: 30px;
	letter-spacing: 1px;
	color: #ddf3e4;
	text-align: left;
	display: inline-block;
}

header .banner .content .down-bg {
	width: 275px;
	height: 70px;
	font-size: 30px;
	line-height: 75px;
	color: #1ec456;
	letter-spacing: 2px;
	background-color: #fcfd1c;
	box-shadow: 0px 1px 5px 0px rgba(0, 68, 23, 0.29);
	border-radius: 35px;
	margin: 100px 0 0 21px;
}

header .banner .content .content-down {
	width: 301px;
	float: left;
}

header .banner .content .content-down a {
	width: 93px;
	text-align: center;
	font-size: 16px;
	line-height: 33px;
	letter-spacing: 1px;
	color: #ffffff;
	margin-top: 6px;
}

header .banner .content .content-down .offset {
	margin-left: 36px
}

header .banner .content .content-down .vertical {
	width: 1px;
	height: 12px;
	display: inline-block;
	background-color: #87dca3;
}

header .top-welcome .down-sm span {
	display: block;
	font-size: 14px;
	line-height: 30px;
	letter-spacing: 1px;
	color: #c6ead2;
}

/* item */
.item {
	padding-top: 44px;
}

.item li {
	display: inline-block;
	margin-left: 11px;
	width: 281px;
	height: 100px;
	background-color: #ebebed;
	border-radius: 10px;
}

.item li.active {
	background-color: #ffffff;
	box-shadow: 0px 3px 9px 0px rgba(0, 0, 0, 0.15);
	border-radius: 10px;
}

.item li img {
	float: left;
	padding: 14px 0 0 16px;
}

.item li .item-title {
	float: left;
	font-size: 28px;
	line-height: 30px;
	letter-spacing: 1px;
	margin: 20px 0 0 10px;
}

.item li .item-subtitle {
	float: left;
	line-height: 30px;
	letter-spacing: 1px;
	margin: 2px 0 0 10px;
}

/* 内容区域 */
.step {
	padding-top: 93px;
}
.step .step-title {
	font-size: 38px;
	line-height: initial;
	text-align:center;
	letter-spacing: 2px;
	color: #1a1a1a;
}
.step .step-title font {
	font-size: 38px;
	letter-spacing: 2px;
	color: #1ec456;
}
.step .description {
	width: 1150px;
    margin-top: 40px;
    font-size: 22px;
    color: #666666;
    line-height: 30px;
   	letter-spacing: 1px;
    padding-left: 20px;
    text-indent: 2em;
    text-align: left;
    display: block;
}

.step .box {
	height: 100%;
	width: 1200px;
	display: inline-block;
	overflow: hidden;
	padding-top: 28px;
}

/* .step .box .images {width:525px;height:363px;border: 1px solid #ddd;} */
.step .ps {
	margin-top: 20px;
	text-align: left;
	font-size: 16px;
	line-height: 24px;
	color: #666666;
}

.step .item1 {
	margin-top: 35px;
}

.step .item1 .method-title {
	font-size: 32px;
	line-height: 30px;
	letter-spacing: 2px;
	color: #1a1a1a;
	margin-bottom: 84px;
}

.step .item1 .left {
	width: 514px;
}

.step .item1 .left .t1 {
	width: 208px;
	padding-bottom: 70px;
}

.step .item1 .left .desc {
	text-align: left;
}

.step .item1 .left .desc .text {
	width: 470px;
	font-size: 16px;
	line-height: 30px;
	letter-spacing: 1px;
	color: #666666;
	display: inline-table;
}

.step .item1 .left .desc .xh {
	width: 18px;
	display: inline-table;
}

.step .item1 .left .desc .xh img {
	margin-right: 10px;
}

.step .item2 {
	margin-top: 48px;
}

.step .item2 .method-title {
	font-size: 32px;
	line-height: 30px;
	letter-spacing: 2px;
	color: #1a1a1a;
	margin-bottom: 84px;
}

.step .item2 .left {
	width: 514px;
}

.step .item2 .left .t1 {
	width: 208px;
	padding-bottom: 70px;
}

.step .item2 .left .desc {
	text-align: left;
}

.step .item2 .left .desc .text {
	width: 470px;
	font-size: 16px;
	line-height: 30px;
	letter-spacing: 1px;
	color: #666666;
	display: inline-table;
}

.step .item2 .left .desc .xh {
	width: 18px;
	display: inline-table;
}

.step .item2 .left .desc .xh img {
	margin-right: 10px;
}







/* 清楚浮动 */
.flo:after {
	content: " ";
	display: block;
	height: 0;
	line-height: 0;
	visibility: hidden;
	clear: both;
}

/*兼容IE浏览器*/
.flo {
	zoom: 1;
}
.tutorial-main{
	position: relative;
}

.tutorial-main article {
	width: 920px;
	box-shadow: 0px 1px 7px 0px rgba(98, 127, 107, 0.2);
	padding-top: 50px;
	padding-bottom: 100px;
	display: inline-block;
	float: left;
}

.tutorial-main article>div {
	width: 95%;
	margin: auto;
}



.tutorial-main .description1 {
	width: 100%;
	padding: 0px;
	font-size: 18px;
	font-weight: normal;
}

.tutorial-main-div1 {
	text-align: left;
}

.tutorial-main-div1 i {
	background: #00C96E;
	display: inline-block;
	width: 17px;
	padding-right: 3px;
	height: 20px;
	border-radius: 100%;
	color: #fff;
	text-align: center;
	line-height: 20px;
	font-size: 14px;
	margin-right: 10px;
	vertical-align: top;
	margin-top: 5px;
}

.tutorial-main-div1 img {
	display: block;
	margin: auto;
	margin-top: 50px;
	margin-bottom: 50px;
	width: 490px;
	box-shadow: 0px 1px 7px 0px rgba(98, 127, 107, 0.5);
}

.tutorial-main-div1 span {
	display: inline-block;
	width: 96%;
}

.tutorial-main-div1 .tutorial-main-p1 {
	padding-top: 100px;
	font-size: 30px;
	padding-bottom: 30px;
}

.tutorial-main-div1 .tutorial-main-p2 {
	text-align: left;
	line-height: 30px;
}

.tutorial-main-div1 .tutorial-main-p3 {
	margin-top: 150px;
	margin-bottom: 50px;
	text-align: center;
	/* line-height: 30px; */
	font-size: 30px;
}

.tutorial-main-div1 .tutorial-main-p4 {
	margin-top: 50px;
	margin-bottom: 20px;
	text-align: left;
	line-height: 30px;
	font-size: 25px;
}




/* 侧边栏 */
.tutorual-aside {
	float: right;
	vertical-align: top;
	display: inline-block;
	width: 240px;
}


.tutorual-aside>div>span{
    display: inline-block;
	text-align: center;
	margin-top: 30px;
	margin-bottom: 30px;
}
.tutorual-aside>div>div p {
	font-size: 22px;
	font-weight: normal;
	line-height: 30px;
	letter-spacing: 1px;
	color: #1ec456;
	padding-top: 52px;
	text-align: center;
}
.tutorual-aside>div>div span {
		font-size: 30px;
		line-height: 26px;
		color: #3CCC6A;
		opacity: 0.87;
		position: absolute;
		top: 11px;
		right: 8px;
}

.tutorual-aside>div>div {
	cursor: pointer;
	width: 240px;
	height: 210px;
	box-shadow: 0px 1px 7px 0px rgba(98, 127, 107, 0.2);
	position: relative;
	background: url(../images/index/default_bg.png)no-repeat center center;
}
.tutorual-action span{
	color: #fff;
}
.tutorual-action p{
	color: #fff;
}
.tutorual-aside-div1 div{
	width: 117px;
	height: 100px;
	margin: auto;
	margin-top: 15px;
	background: url(../images/index/USBdrive.png)no-repeat ;
}
.tutorual-aside-div1:hover div{
	background: url(../images/index/USBdrive.png)no-repeat -117px 0px;
}
.tutorual-aside-div2 div{
	width: 103px;
	height: 100px;
	margin: auto;
	margin-top: 15px;
	background: url(../images/index/pe.png)no-repeat ;
}
.tutorual-aside-div2:hover div{
	background: url(../images/index/pe.png)no-repeat -103px 0px;
}

.tutorual-aside-div3 div{
	width: 106px;
	height: 100px;
	margin: auto;
	margin-top: 15px;
	background: url(../images/index/Reinstallsystem.png)no-repeat ;
}
.tutorual-aside-div3:hover div{
	background: url(../images/index/Reinstallsystem.png)no-repeat -106px 0px;
}



.tutorual-aside>div>div:hover{
	background: url(../images/index/activation_bg.png)no-repeat center center;
}
.tutorual-aside>div>div:hover span{
	color: #fff;
}
.tutorual-aside>div>div:hover p{
	color: #fff;
}

.tutorual-aside .tutorual-action{
	background: url(../images/index/activation_bg.png)no-repeat center center;
}
.tutorual-aside .tutorual-action span{
	color: #fff;
}
.tutorual-aside .tutorual-action p{
	color: #fff;
}

.tutorual-aside .tutorual-action1 div{
	background: url(../images/index/USBdrive.png)no-repeat -117px 0px;
}
.tutorual-aside .tutorual-action2 div{
	background: url(../images/index/pe.png)no-repeat -103px 0px;
}
.tutorual-aside .tutorual-action3 div{
	background: url(../images/index/Reinstallsystem.png)no-repeat -106px 0px;
}

