html,
body {
	background-color: #f2f2f2;
}

#banner,
#banner .main,
#banner .content,
#banner img {
	width: 100%;
}

#wrap {
	width: 1200px;
	margin: 0 auto;
	background-color: #fff;
	position: relative;
	top: -50px;
	border-radius: 10px;
	box-sizing: border-box;
	padding: 20px;
	padding-top: 0;
}

.g-btitle {
	font-size: 34px;
	font-weight: bold;
	text-align: center;
	padding-top: 60px;
}

.g-stitle {
	font-size: 18px;
	text-align: center;
	padding-top: 20px;
}

#synopsis .content {
	font-size: 16px;
	letter-spacing: 0.5px;
	text-indent: 36px;
	line-height: 24px;
	padding-top: 30px;
}

#introduce {
	width: 100%;
}

#introduce .main {
	width: 100%;
	padding-top: 60px;
}

#introduce .content {
	width: 100%;
	justify-content: space-between;
}

#introduce .content>.left {
	width: 48%;
}

#introduce .content>.left>p:nth-child(1) {
	font-size: 18px;
	font-weight: bold;
	border-left: 3px solid #1e9fff;
	padding-left: 10px;
}

#introduce .inner {
	width: 100%;
	justify-content: space-between;
	background-color: #f2f2f2;
	box-sizing: border-box;
	padding: 20px;
	margin-top: 10px;
}

#introduce .inner>.left {
	width: 20%;
	padding-top: 20px;
}

#introduce .inner>.left img {
	width: 100%;
}


#introduce .inner>.right {
	width: 70%;
	box-sizing: border-box;
	font-size: 14px;
	line-height: 20px;
	position: relative;
}

#introduce .more-links {
	position: absolute;
	bottom: -10px;
	right: 0;
}

#introduce .content>.right {
	width: 50%;
}

#introduce .content>.right img {
	width: 600px;
	height: 200px;
}


.d-btitle {
	font-size: 24px;
	font-weight: bold;
	padding-left: 10px;
	border-left: 4px solid #1e9fff;
	margin-top: 30px;
}

#why {
	width: 100%;
}

#why .main {
	width: 100%;

}

#why .content {
	width: 100%;
	flex-wrap: wrap;
	padding-top: 30px;
}

#why .inner {
	display: block;
	width: 48%;
	background-color: #f2f2f2;
	box-sizing: border-box;
	padding: 20px;
	border-radius: 5px;
	margin: 10px 11px;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
}

#why .inner>p:nth-child(1) {
	font-size: 18px;
	font-weight: bold;
	background-image: url(/uploads/image/szimg/icon-code.png);
	background-position: 0 center;
	background-size: 20px 20px;
	padding: 3px 0;
	padding-left: 25px;
}

#why .inner>div:nth-child(2) {
	padding-top: 20px;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.5px;
	/*overflow: hidden;*/
	/*white-space: nowrap;*/
	/*text-overflow: ellipsis;*/
}

#word {
	width: 100%;
}

#word .main {
	width: 100%;
}

#word .content {
	width: 100%;
	padding-top: 30px;
	flex-wrap: wrap;
}

#word .inner {
	width: 32%;
	background-color: #f2f2f2;
	box-sizing: border-box;
	padding: 20px;
	margin: 7px;
	transition: all 0.3s linear;
	font-size: 18px;
	font-weight: bold;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	border-radius: 5px;
	background-image: url(/uploads/image/szimg/icon-code.png);
	background-size: 20px 20px;
	background-position: 15px center;
	padding-left: 40px;
}

#word .inner:hover {
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
}


#system {
	width: 100%;
}

#system .main {
	width: 100%;
	padding-bottom: 60px;
}

#system .content {
	width: 90%;
	justify-content: space-around;
	padding-top: 60px;
	margin: 0 auto;
}

#system .inner {
	width: 20%;
	background-color: #1e9fff;
	border-radius: 10px;
	box-sizing: border-box;
	padding: 20px;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.8);
}

#system .inner>div:nth-child(1) {
	width: 50%;
	margin: 0 auto;
}

#system .inner img {
	width: 100%;
}

#system .inner>div:nth-child(2) {
	text-align: center;
	font-size: 20px;
	line-height: 30px;
	font-weight: bold;
	color: #fff;
	padding-top: 30px;
}

#teacher {
	width: 100%;
}

#teacher .main {
	width: 100%;
}

#teacher .content {
	width: 100%;
	justify-content: space-between;
	padding-top: 60px;
}

#teacher .inner {
	width: 15%;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
	box-sizing: border-box;
	padding: 15px;
	border-radius: 10px;
	transition: all 0.3s linear;
	background-color: #fff;
}

#teacher .inner>div:nth-child(1) {
	width: 70%;
	margin: 0 auto;
}

#teacher img {
	width: 100%;
}

#teacher .inner>div:nth-child(2) {
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	color: #1e9fff;
	padding-top: 20px;
}

#teacher .inner:hover {
	transform: translatey(-20px);
}

#show{
	width: 100%;
}


#show .main {
	width: 100%;
	padding-bottom: 60px;
}

#show .content {
	width: 100%;
	padding-top: 60px;
	justify-content: space-around;
}

#show .inner {
	width: 23%;
}

#show img {
	width: 100%;
	height: 200px;
}

#show .inner>div:nth-child(2) {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	padding-top: 20px;
}


#interest {
	width: 100%;
}

#interest .main {
	width: 100%;
}

#interest .content {
	width: 100%;
	padding-top: 30px;
	flex-wrap: wrap;
}

#interest .content a {
	display: block;
	background-color: skyblue;
	color: #fff;
	font-size: 14px;
	margin: 7px;
	padding: 5px 8px;
	border-radius: 3px;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
}


#append-exam {
	width: 100%;
}

#append-exam .main {
	padding-top: 40px;
	padding-bottom: 20px;
}

#append-exam .content {
	background-color: #f9f9f9;
	border-radius: 10px;
	background-image: url(/uploads/image/szimg/advantage-bg.png);
	background-size: cover;
}

#append-exam .title>div:nth-child(1) {
	color: #409eff;
	text-align: center;
	font-size: 22px;
	background-image: url(/uploads/image/szimg/icon-exam.png);
	padding: 10px 0;
	background-size: 50px 50px;
	background-position: 360px 0;
	margin-bottom: 10px;
}

#append-exam .title>div:nth-child(2) {
	font-size: 28px;
	text-align: center;
	font-weight: bold;
	margin-bottom: 40px;
}

#append-exam .inner {
	width: 88%;
	margin: 0 auto;
	justify-content: space-between;
	align-items: flex-start;
	box-sizing: border-box;
	padding: 20px;
}

#append-exam .left {
	width: 50%;
}


#append-exam .right {
	width: 50%;
	box-sizing: border-box;
	padding: 0 5%;
	padding-top: 80px;
}

#append-exam .right>div:nth-child(1) {
	font-size: 22px;
	padding-bottom: 20px;
}

#append-exam .right>div:nth-child(2) {
	font-size: 14px;
	line-height: 20px;
}

.exam-button-prev {
	width: 50px;
	height: 50px;
	background-size: cover;
	background-image: url(/uploads/image/szimg/icon-left.png);
}

.exam-button-next {
	width: 50px;
	height: 50px;
	background-size: cover;
	background-image: url(/uploads/image/szimg/icon-right.png);
}



#append-introduce {
	width: 100%;
	background-image: url(/uploads/image/szimg/advantage-bg.png);
	background-size: cover;
	border-radius: 10px;
	margin-top: 40px;
}

#append-introduce .content {
	width: 100%;
	padding-bottom: 60px;
	padding-top: 40px;
}

#append-introduce .inner {
	width: 80%;
	margin: 0 auto;
	justify-content: space-between;
	align-items: flex-start;
}

#append-introduce .left {
	width: 45%;
}

#append-introduce .desc {
	width: 100%;
	font-size: 15px;
	line-height: 20px;
}

#append-introduce .right {
	width: 494.9px;
	height: 239.4px;
}

#append-introduce .right img {
	width: 100%;
}

#append-introduce .swiper-button-prev {
	width: 50px;
	height: 50px;
	background-image: url(/uploads/image/szimg/icon-left.png);
	background-size: 100% 100%;
}

#append-introduce .swiper-button-next {
	width: 50px;
	height: 50px;
	background-image: url(/uploads/image/szimg/icon-right.png);
	background-size: 100% 100%;
}

#append-introduce .title {
	width: 100%;
	box-sizing: border-box;
	font-size: 18px;
	font-weight: bold;
	background-image: url(/uploads/image/szimg/icon-advantage.png);
	padding: 20px 0;
	padding-left: 60px;
}


#append-advantage {
	width: 100%;
}

#append-advantage .content {
	justify-content: space-around;
	padding-top: 40px;
}

#append-advantage .inner {
	width: 18%;
	padding: 40px 0;
	background-color: #f9f9f9;
	border-radius: 10px;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
	transition: all 0.3s linear;
}

#append-advantage .inner:hover{
	transform: translatey(-20px);
}

#append-advantage .inner>div:nth-child(1) img {
	margin: 0 auto;
}

#append-advantage .info>div:nth-child(1) {
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	padding-bottom: 20px;
	padding-top: 20px;
}

#append-advantage .info>div:nth-child(2) {
	font-size: 14px;
	line-height: 20px;
	text-align: center;
}

#append-advantage .title {
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	padding-top: 40px;
	color: #409eff;
}


#system .g-btitle{
	background-image: url(/uploads/image/szimg/icon-system.png);
	background-size: 50px 50px;
	background-position: 390px bottom;
	padding-bottom: 10px;
}


#teacher .g-btitle{
	background-image: url(/uploads/image/szimg/icon-teacher.png);
	background-size: 50px 50px;
	background-position: 280px bottom;
	padding-bottom: 10px;
}

#show .g-btitle{
	background-image: url(/uploads/image/szimg/icon-work.png);
	background-size: 40px 40px;
	background-position: 380px 60px;
	padding-bottom: 10px;
}