@charset "utf-8";
/* CSS Document */
/*公共样式部分*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,p{ margin:0; padding:0; }
td,th,caption { font-size:14px; }
h1, h2, h3, h4, h5, h6 { font-weight:normal; font-size:100%; }
address, caption, cite, code, dfn, em, i, strong, th, var { font-style:normal; font-weight:normal;}
a {
	color: #fefefe;
	text-decoration: none;
}
a:hover {
	text-decoration:none;
}
img {border:none;display: block;}
ol,ul,li { list-style:none; }
input, button { font:14px sans-serif; }
html {overflow-y: scroll;}
body {
	font-size: 14px;
	font-family: "微软雅黑", Helvetica, sans-serif,Arial;
	color:#fefefe;
	background-color: #f2f2f2;
}
img{ border:none;}
 html, body {width:100%; height:auto;}
.clearfix:after {content: "."; display: block; height:0; clear:both; visibility: hidden;}
.clearfix { *zoom:1; }
.clear{
	clear:both;
}
.pull-left{float:left;}
.pull-right{float:right;}

/*主样式*/
.row{
	margin:0 auto;
	padding:0;
	}
.header{
  width:100%; 
  z-index:1000;   
  top: 0;
  position: fixed;
}
.header img{  
  float:left;
  padding-top:10px;
  padding-left: 25px;
}

.header  .nav{
  text-align:center;
  padding:15px 0;
  background-color: transparent;
  /*width:50%;*/
  width:500px;
}
.header  .nav a{
  display: inline-block;
  
  color:#fefefe;
  font-size: 16px;
  line-height: 1.5em;
  padding:3px;
  transition: all ease 0.2s;
  border: 0px;
  -webkit-border-radius:1.5em;
  -moz-border-radius:1.5em;
  border-radius:1.5em;
  border:solid 1px transparent; 
  min-width: 85px;
  
  }
.header  .nav a:not(:last-child){
  margin: 0 4% 0 0;
}


.bg-s1 {
	background:url(../images/b01.jpg) no-repeat 50% 72px;
	background-size: cover;
	}
.content{
	width:35%;
	float:right;
	padding-top:200px;
	margin-right:8%;
	}
.content  h2{
	margin-bottom:20px;
	font-size: 24px;
	text-align: center;
	width:68%;
	line-height:1.2em;
	letter-spacing:3px;
	padding: 10px;
	float:right;

	}
.box-s1{
	width:100%;
	min-height:380px;
	height: auto;
	padding-bottom:8px;
	border-top: solid 8px hsla(0,100%,100%,0)

	}
.box-s2{
	margin-left: -8px;
	margin-top:-8px;
	width:100%;
	height:100%;
	min-height:380px;
	}
.box-s2 >h3{
	font-size: 35px;
	background: url(../images/bg01.jpg) no-repeat 0 0;
	height:auto;
	text-align: center;
	line-height: 1.2em;
	letter-spacing:3px;
	background-size:cover;
	padding:10px 0;}
.box-s2 .text p{
	line-height:2em;
	color:#fff;
	}

.box-s2 .text {
	padding:40px;
	padding-top:10px;
}
.btn-s1{
		font-size: 24px;
		-webkit-border-radius:1.5em;
	    -moz-border-radius:1.5em;
	    border-radius:1.5em;
	    border:solid 1px #fefefe;
		display:block;
		padding:8px 0;
		width: 160px;
		text-align: center;
		transition: all ease 0.2s;
		margin:30px auto 0 auto;
		}
.container{
	max-width:1200px;
	padding-top: 0px;
	margin:0 auto;}
.container >h3{
	font-size: 28px;
    background: url(../images/bg01.jpg) no-repeat 0 0;
    height: 60px;
    text-align: left;
    line-height: 2em;
    letter-spacing: 3px;
    width: 60%;   
    background-size: cover;
    padding-left: 30px;
}
.bg-s2 {
	background:url(../images/b01.jpg) no-repeat 50% 0;
	width:100%;
	min-height:899px;
	}
.area-s1{
	background-color: #fff;
	padding:30px;}
	
.area-s1 .box-s3:not(:last-child){
	padding:30px 0;
	border-bottom: dashed 1px #e1e1e2;
}


.cs-cover-l {
	float:left;
	width:120px;
	display:inline-block;
	}
.cs-cover-l img{
	width: 120px;
	height:120px;
	}
.pro-info{
	float: left;
	display:inline-block;
	padding-left:15px;
	}
.pro-info > h4{
	color:#221814;
	font-size: 20px;
	min-height:50px;
	padding-bottom:15px;
	}
.pro-info > p{
	color: #717071;
	font-size: 12px;
	line-height: 1.5em;}
.btn-area-1 a:not(:last-child){
	margin-bottom: 10px;
	}
.btn-area-2{
	margin-top: 30px;
	}
.btn-s2{
	padding:12px 0;
	text-align:center;
	-webkit-border-radius: 5px;
	-moz-border-radius:5px ;
	border-radius:5px ;
	font-size: 20px;
	display:block;
	width:160px;
	box-sizing:border-box;
	background-color:#fff;
	-webkit-transition: all ease 0.1s;
	-moz-transition: all ease 0.1s;
	-ms-transition: all ease 0.1s;
	-o-transition: all ease 0.1s;
	transition: all ease 0.1s;
}
a:hover.btn-s2{
	color:#fefefe;
	}
.btn-s3{
	padding:12px 0;
	text-align:center;
	-webkit-border-radius: 5px;
	-moz-border-radius:5px ;
	border-radius:5px ;
	color: #fefefe;
	font-size: 20px;
	display:block;
	width:160px;
	box-sizing:border-box;
	-webkit-transition: all ease 0.1s;
	-moz-transition: all ease 0.1s;
	-ms-transition: all ease 0.1s;
	-o-transition: all ease 0.1s;
	transition: all ease 0.1s;
}
.pg-box-1{
	min-height:30px;
	margin-top:-1px;
	padding-top:20px;
	}
.pg-box-2{
	min-height:30px;
	margin:0 -30px;
	padding:15px 20px;
	}
.page {
	text-align: right;
}

.page > a {
	border-radius: 2px;
	display: inline-block;
	font-size: 16px;
	line-height: 1em;
	margin-bottom: 0;
	text-align: center;
	vertical-align: middle;
	margin-right: 5px;
	padding-top: 6px;
	padding-right: 12px;
	padding-bottom: 6px;
	padding-left: 12px;
}

.page .current {
    color:#fff;

}
.page a:hover{
	color:#fff;

}
.page >a >i {
	padding-right: 10px;
	padding-left: 10px;
	font-size: 16px;
}
.list-s1 a{
	color:#717071;
	font-size: 16px;
	line-height: 1em;}
.list-s1 > h3{
	margin:0 -30px;
	font-size: 20px;
	padding:10px 0 10px 30px;}
.list-s1 > h3 > span{
	display:inline-block;
	padding:4px 16px;
	
	}
.list-s1 .bg-s3{
	-webkit-border-radius:6px 0 0 6px;
	-moz-border-radius:6px 0 0 6px;
	border-radius:6px 0 0 6px;}
.list-s1 .bg-s4{
	background-color: #fff;
	}
.list-s1 >ul{
	padding:20px 60px;
	margin:0 auto;
	}
.list-s1 >ul >li{
	display:inline-block;
	min-width:460px;
	padding-bottom:15px;
	padding-left:20px;}
	
.list-s1 >ul >li a:before{	
  content: ' ';
  display:inline-block;
  width: 0;
  height: 0;  
  }
 .sub-nav{
	 color: #221814;
	margin:0 -30px;
	padding:15px;
	padding-left:25px;
	display:block;
	height: 30px;
	}
.sub-nav >li{
	display:inline-block;
	float:left;
	position:relative;}
.sub-nav >li >a{
	padding:8px 12px;
	display:inline-block;
	margin:0 8px;
	line-height: 1em;
	min-width: 180px;
	box-sizing:border-box;
}
.sub-nav i{
	padding-right:6px;}
.sub-nav >li >span{
	font-size: 1.6em;
}
.sub-nav >li >ul{
	position:absolute;
	top:30px;
	left:8px;
	width: 91%;
	box-sizing:border-box;
	background-color: #fefefe;
	}
.sub-nav >li >ul>li{
	display:block;
	
	}
.sub-nav >li >ul>li a{
	display:block;
	padding:6px 0;
	text-align: left;
	margin-bottom:-1px;
	width:100%;
	font-size: 11px;
	text-indent:2em;

	}

.list-s2 a{
	color:#717071;
	font-size: 16px;
	line-height: 1em;}

.list-s2 >ul{
	padding:20px 50px;
	margin:0 auto;
	}
.list-s2 >ul >li{
	display:block;
	padding-bottom:15px;}
.list-s2 >ul >li i{
	padding-right:4px;}
.text{
	padding:0px 50px;
	color: #221814;
	margin-top: 10px;
}
.text >h2{
	font-size: 20px;
	text-align: center;}
.text p{
	line-height: 1.8em;
	padding-top:15px;
	text-indent:16px;}

.footer {
	text-align: center;	
	background-color: #f7f5f5;	
    width: 100%;
}
.footer p {
	line-height: 50px;
    height: 50px;
    color: #494747;
}

.subnav{
	text-align:center;
	padding:5px 0;	
	width: 1200px;
	margin: 0 auto;
	}
.subnav a{
	display: inline-block;	
	color:#fefefe;
	font-size: 16px;
	line-height: 1.5em;
	padding:8px 0;
	transition: all ease 0.2s;
	
	min-width:80px;
	margin-left:20px;
	margin-right:20px;

	
	}
.subnav a:not(:last-child){
	margin: 0 2% 0 0;}
.subnav .current{	
	
	color: #26574c;
	

}
.subnav a:hover{	
	
	color: #26574c;
	
	padding:8px 0;

}		

.box-s2 .text div{
	line-height:2em;
	color:#fff;
	}
.box-s2 .text div p{
	text-indent: 2em;
}


@media (max-width:768px) {
.header{
  height:52px;
  }
.tit{
  font-size: 20px;
  background-color: #183847;
  text-align:center;
  padding:0 0 6px 0;
  height:28px;
  display:block;
  color:hsla(100,100%,100%,0.9);
  text-shadow:2px 2px 1px hsla(0,0%,0%,0.5)}
.header img{
  max-width:152px;
  padding-top:5px;
  float: left;}
.header .nav-ico{  
  color:#fff;
  display:block;
  float:right;
  padding: 8px 8px 0;
  }
.header .nav-ico .current{
  color:hsla(0,0%,100%,0.9)}

.nav-list{
  margin-top:50px;
}
.nav-list a{
  display:block;
  width:100%;
  text-indent:36px;
  background-color: hsla(200,50%,19%,0.8);
  line-height: 2.8em;
  font-size: 16px;}
.nav-list a:hover{
  background-color: hsla(200,50%,19%,0.9);
}
.nav-list a:not(:last-child){
  border-bottom: solid 1px hsla(200,50%,19%,0.9);}
.header .nav{
  display:none;
  }
.row .m-cont .info .font-s1{
  display: none
}

.content {
    width: 95%;
    float: right;
    padding-top: 100px;
    margin-right: 1%;
}

.container {
    max-width: 100%;
    margin: 0 auto;
}
.pull-right{
	float:left;
	margin-top: 10px;
}


}

.list-s1 h3 a { font-size: 20px;line-height: 1.3em;}

@media screen and (max-width: 768px) {
.container >h3 {
    font-size: 18px;
    width: 100%;
    line-height: 2.5em;
    padding:0 4%;
    margin-top: 0px;   
    height:2.5em;

}
.area-s1 {
    padding:0;
}
.lessonContent .description{
	margin: 60px 10px;
}

.list-s1{margin-top:50px;}
.list-s1 >ul {
    padding: 20px 0;
    margin-left: 5%;
}
.list-s1 .bg-s3 {
    display: none;
}
.list-s1 > h3 {
    margin: 0;
    font-size: 18px;
    padding: 10px 5%;
}
.list-s1 h3 a { font-size: 16px;}


.sub-nav {
    margin: 0;
    padding: 15px;   
    min-height: 2em;
    height: 100%;

}


.nav a {
    width: 50%;
}
.sub-nav >li >span {
    display: none;
}
.sub-nav >li >a {

  margin: 0;
  width: 100%;

}
.sub-nav >li >ul {
    left: 0;
    width: 100%;
}
.sub-nav >li >ul>li a {
    padding: 6px;
}
.text {
     padding: 0 5%;
}
.pro-info {
    padding-left: 0;
    float: right;  
    width: calc(95% - 120px);
    width: -webkit-calc(95% - 120px);
    width: -moz-calc(95% - 120px);
    text-align: left


}

.btn-s2,.btn-s3{
     padding: 6px 8%;
    font-size: 16px;
    width: 40%;
    margin-right: 10px;
    float: left;

}

.btn-area-2 {
    width: 100%;
}


.sub-nav > li
{
display:block;
float:none;
}


.bg-s5,.bg-s2{
background:none;
}
.btn-area-1{
	width: 50%;
    float: right;
    text-align: right;

}

.cs-cover-l img {
    width: 120px;
    height: 120px;
}
.page>a {
    border:0px;
     margin-right:0;
    padding: 6px 3px;
    font-size:12px;
}

}

.pro-info > a > h4{
color:#1b1d1b;
font-weight:bold;
line-height: 1.5em;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}


.lessonContent{
  margin-top:0px;
}
.lessonContent .description{
  color:#717071;  
  line-height: 30px;
  font-size: 16px; 
  margin-bottom: 40px;
}

.list-category-line{   
   margin: 10px 0;
}
.list-category h3{
  font-size: 20px;
   color: #fff;  
   padding:3px 0;
   width:120px;
   text-align: center;
   position: relative;
   margin-left: 20px;
  
}
.list-category>h3:before{  
  height: 30px;
  position: absolute;
  left:-20px;
  top:0px;
  content: '';
}


.list-s1>ul>li a:before {   
    height: 10px;
    margin-right: 15px;
}

.list-s1 >ul {
    padding: 20px 0px;   
}

.list-s1 >ul >li {
    display: inline-block;
    min-width: 460px;
    padding-bottom: 15px;
    padding-left: 0px;
}
.list-s1 h3 a {   
    color: #0085ce;
}

.site_header{  
   padding:15px 0; 
   padding-left:3%;
}
.site_header  .nav{
  text-align:center;
  padding:15px 0;
  background-color: transparent; 

}
.site_header  .nav a{
  display: inline-block;  
  color:#fefefe;
  font-size: 16px;
  line-height: 1.5em;
  padding:3px;
  transition: all ease 0.2s;
  border: 0px;
  -webkit-border-radius:1.5em;
  -moz-border-radius:1.5em;
  border-radius:1.5em;
  border:solid 1px transparent; 
  min-width: 95px;
  
  }
.site_header  .nav a:not(:last-child){
  margin: 0 4% 0 0;
}

 .area-s1 .text a{
    color:#221814;
  }

  .area-s1 .text a:hover{
    color:#52b766;
  }

  .subnavTransparentBg{
    background-color: transparent;
    height: 52px;
  }