* {margin:0;padding:0;list-style:none;}
body {font-family:"微软雅黑", Arial, Tahoma,"微软雅黑";margin:0;padding:0;font-size:12px;color:#000; background:#fff; } 
div,form,img,ul,ol,li,dl,dt,dd,p {margin:0;padding:0;border:0;} 
ul,li{list-style-type:none;} 
img{border:0;} 
input,select,textarea{vertical-align:middle;} 
h1,h2,h3,h4,h5,h6 {margin:0;padding:0;font-size:12px;font-weight:normal;} 
header, section, footer, aside, nav, main, article, figure { display: block; } 
/* Link */ 
a{text-decoration:none;} 
a:hover {text-decoration:none;-webkit-transition: .8s} 
/* Other */ 
.clear{ clear:both;font-size:1px;width:1px;height:0;visibility:hidden; overflow:hidden;} 
.clearfix:after{content:".";display:block; height:0;clear:both;visibility:hidden;} /* only FF */ 
.f_left{float:left;} 
.f_right{float:right;} 
.img{vertical-align:middle;}
i,em{font-style: normal;}

.i-banner{
	width: 100%;
	height: 100vh;
	overflow: hidden;
	background: url(../images/banner.jpg) center no-repeat;
	background-size: cover;
	min-width: 1200px;
}
.i-center{
	width: 1200px;
	height: auto;
	margin: 0 auto;
	text-align: center;
	position: relative;
	min-width: 1200px;
}
.i-logo{
	position: absolute;
	top: 44px;
	left: 70px;
	z-index: 10;
}
.i-va{
	width: 100%;
    height: 100vh;
    display: table;
}
.i-middle{
	width: 100%;
	height: auto;
	display: table-cell;
    vertical-align: middle;
    text-align: center;
}
.b-img{
	position: relative;
	top: -82px;
	cursor: pointer;
	z-index: 11;
}
.prodact {
            animation: myfirst 1s infinite;
        }
        
        @keyframes myfirst {
            0% {
                transform: translate(0px, 0px);
            }
            25% {
                transform: translate(0px, -20px);
            }
            50% {
                transform: translate(0px, 0px);
            }
            75% {
                transform: translate(0px, -5px);
            }
            100% {
                transform: translate(0px, 0px);
            }
        }
.i-title{
	display: block;
	font-size: 46px;
	color: #333;
	font-weight: bold;
	padding-top: 80px;
}
.i-title i{
	font-size: 18px;
	display: block;
	margin-top: 14px;
	font-weight: normal;
	margin-bottom: 44px;
}
.i-two{
	width: 100%;
	height: auto;
	margin: 0 auto;
	display: table;
	margin-bottom: 62px;
}
.i-two li{
	float: left;
	width: 508px;
	height: 280px;
	position: relative;
	background: #f2f2f2;
	margin: 25px 46px;
}
.t-right{
	float: right;
	width: 340px;
	text-align: left;
}
.t-right i{
	font-size: 20px;
	color: #ff5d3f;
	float: left;
	margin-top: 26px;
	font-weight: bold;
}
.t-link{
	float: right;
	background: url(../images/yan.png) center no-repeat;
	width: 100px;
	height: 36px;
	font-size: 20px;
	color: #fff;
	line-height: 36px;
	padding-left: 41px;
	margin-top: 20px;
	-webkit-transition: .8s
}
.t-link:hover{
	color: #e0d6d6;
	-webkit-transition: .8s
}
.t-img{
	position: absolute;
	bottom: 0;
	left: -20px;
	z-index: 11;
}
.t-right b{
	font-size: 16px;
	color: #333;
	display: block;
	margin-top: 18px;
}
.t-right p{
	font-size: 14px;
	color: 24px;
	color: #666;
	width: 314px;
	margin-top: 18px;
	height: 90px;
	margin-bottom: 20px;
}
.t-53{
	color: #fff;
	font-size: 14px;
	background: #2c2c2c;
	width: 144px;
	height: 34px;
	line-height: 34px;
	display: block;
	text-align: center;
	margin-left: 62px;
	border:1px #2c2c2c solid;
	-webkit-transition: .8s
}
.t-53:hover{
	background: none;
	-webkit-transition: .8s;
	border:1px #2c2c2c solid;
	color: #2C2C2C;
}
.i-black{
	width: 100%;
	height: auto;
	margin: 0 auto;
	min-width: 1200px;
	background: #2C2C2C;
	padding-bottom: 60px;
}
.i-white{
	color: #FFFFFF;
}
.i-white i{
	color: #999;
}
.b-tu{
	width: 100%;
	height: auto;
	margin: 0 auto;
	display: table;
	padding-top: 30px;
}
.b-tu li{
	float: left;
	text-align: center;
	    margin: 0px 78px;
}
.b-tu li b{
	color: #FFFFFF;
	font-size: 16px;
	display: block;
	margin: 14px 0;
}
.b-tu li p{
	font-size: 14px;
	color: #ccc9c9;
	text-align: center;
	
}
.i-f2{
	width: 100%;
	height: auto;
	margin: 0 auto;
	min-width: 1200px;
	background: #f2f2f2;
	padding-bottom: 62px;
}
.g-t-list{ width:1200px; height:auto; margin:0 auto;position:relative;  z-index:1; display:table; padding-top: 34px;}
.g-t-tea {
	width: 223px;
	height: 265px;
	background: #fff;
	position: relative;
	margin-right: 21px;
	top: 0px;
	margin-top: 30px;
	-webkit-transition: .8s;
	float: left;
}

.g-t-img01 {
	margin-top: 22px;
}

.g-t-list p {
	font-size: 16px;
	color: #444;
	line-height: 24px;
	margin-top: 18px;
	margin-bottom: 16px;
}

.g-t-img02 {
	margin-left: 18px;
	margin-right: 4px;
	position: relative;
	top: 1px;
}

.g-t-img03 {
	position: absolute;
	left: 1px;
	bottom: -30px;
	z-index: -1;
	display: none;
}

.g-t-text {
	width: 100%;
	height: 0;
	background: rgba(63, 68, 72, 0.7);
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 2;
	overflow: hidden;
}

.g-t-link01 {
	font-size: 14px;
	color: #fff;
	display: block;
	width: 122px;
	height: 38px;
	line-height: 38px;
	background: #4abcfa;
	border-radius: 2px;
	margin: 0 auto;
	margin-top: 20px;
	margin-bottom: 10px;
	-webkit-transition: .4s;
}

.g-t-link02 {
	font-size: 14px;
	color: #999;
	display: block;
	width: 122px;
	height: 38px;
	line-height: 38px;
	background: #fff;
	border-radius: 2px;
	margin: 0 auto;
	-webkit-transition: .4s;
	margin-top: 22px;
}

.g-t-link01:hover {
	background: #74cbfa;
	-webkit-transition: .4s;
}

.g-t-link02:hover {
	background: #e9e8e8;
	-webkit-transition: .4s;
}

.g-t-none {
	margin-right: 0 !important;
}

.g-t-tea:hover {
	top: -18px;
	-webkit-transition: .8s;
}

.g-t-tea:hover .g-t-img03 {
	display: block;
}

.g-t-link03 {
	display: block;
	width: 1200px;
	height: 70px;
	line-height: 70px;
	font-size: 14px;
	color: #666;
	margin-top: 56px;
	background: #fff;
	border-radius: 2px;
	-webkit-transition: .8s;
}

.g-t-link03:hover {
	background: #6233c2;
	color: #fff;
	-webkit-transition: .8s;
}
.fz14 {
    font-size: 14px;
}
.cor03 {
    color: #999;
}
.g-blue{
	height: 265px;
	width: 710px;
	background: #6233c2;
	float: left;
	margin-right: 21px;
	margin-top: 30px;
}
.g-blue span{
	display: block;
	font-size: 34px;
	color: #FFFFFF;
	font-weight: bold;
	background: url(../images/blue.png) center no-repeat;
	width: 478px;
	height: 73px;
	line-height: 78px;
	margin: 0 auto;
	margin-top: 66px;
}
.g-blue p{
	font-size: 26px;
	color: #ecebeb;
	margin-top: 36px;
}
.i-share{
	float: left;
	background: #1c1c1c;
	width: 240px;
	height: 530px;
	position: relative;
}
.i-share span{
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	display: block;
	height: 57px;
	line-height: 57px;
	background: #6233c2;
}
.i-share img{
	margin-top: 30px;
	margin-bottom: 20px;
}
.i-share b{
	font-size: 18px;
	color: #fff;
	display: block;
	margin-bottom: 22px;
}
.i-share p{
	font-size: 14px;
	color: #999;
	width: 201px;
	margin: 0 auto;
	margin-bottom: 6px;
	text-align: left;
}
.i-share a{
	font-size: 14px;
	color: #ff5d3f;
	position: absolute;
	right: 16px;
	bottom: 34px;
	z-index: 10;
	-webkit-transition: .8s;
	
}
.i-share a:hover{
	bottom: 30px;
}
.s-top{
	background: #212121;
	margin-top: 14px;
}
.s-top span{
	background: #3f119d;
	margin-top: 10px;
}
.s-hold{
	width: 100%;
	height: auto;
	padding-top: 70px;
	padding-bottom: 70px;
}
.i-link{
	width: 475px;
	height: 85px;
	line-height: 85px;
	color: #fff;
	font-size: 24px;
	background: #6233c2;
	margin: 0 auto;
	display: block;
	border-radius: 10px;
	-webkit-transition: .8s;
}
.i-link:hover{
	background: #f2f2f2;
	color: #666;
}
.i-f1{
	width: 100%;
	height: auto;
	min-width: 1200px;
	background: #f1f1f1;
	padding-bottom: 90px;
}
.i-ping{
	padding: 40px;
	height: auto;
	margin: 0 auto;
	background: #6233c2;
	border-radius: 10px;
}
.p-jia{
	width: 363px;
	height: 308px;
	background: #FFFFFF;
	border-radius: 6px;
	float: left;
	margin: 6px 5px;
	overflow: hidden;
	text-align: left;
	position: relative;
}
.p-img{
	float: left;
	margin-top: 24px;
	margin-left: 24px;
	margin-right: 24px;
}
.p-jia b{
	font-size: 18px;
	color: #6233C2;
	display: block;
	padding-top: 38px;
	text-align: left;
	padding-bottom: 10px;
}
.p-jia i{
	font-size: 14px;
	color: #999;
}
.p-jia p{
	font-size: 14px;
	color: #333;
	line-height: 24px;
	width: 320px;
	margin: 0 auto;
	margin-top: 18px;
}
.p-jia a{
	font-size: 14px;
	color: #333333;
	display: block;
	line-height: 68px;
	background: #f5f5f5;
	text-align: center;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 10;
	width: 100%;
	-webkit-transition: .8s;
}
.p-jia a:hover{
	background: #5027a1;
	color: #fff;
}
.p-yin{
	width: 363px;
	height: 308px;
	background: #4f269f;
	border-radius: 6px;
	float: left;
	margin: 6px 5px;
	overflow: hidden;
	text-align: left;
	position: relative;
}
.p-yin b{
	font-size: 28px;
	color: #fff;
	display: block;
	padding-bottom: 34px;
	padding-top: 40px;
	text-align: center;
}
.p-yin span{
	font-size: 14px;
	color: #FFFFFF;
	border: 1px #fff solid;
	border-radius: 4px;
	text-align: center;
	margin-right: 10px;
    padding: 4px 6px;
    margin-bottom: 10px;
    float: left;
}
.y-xiang{
	width: 314px;
	height: auto;
	margin: 0 auto;
}
.p-ba{
	background: #FFFFFF;
	color: #5228a7 !important;
}
.i-bage{
	width: 100%;
	background: url(../images/bage.jpg) center no-repeat;
	height: 1209px;
	min-width: 1200px;
}
.b-hold{
	height: auto;
	background: #1c1c1c;
	margin: 0 auto;
    border-radius: 10px;
    padding: 30px 14px;
    display: table;
    margin-top: 80px;
    margin-bottom: 68px;
}
.b-month{
	width: 280px;
    height: 210px;
    background: #FFFFFF;
    border-radius: 6px;
    float: left;
    margin: 5px 6px;
    overflow: hidden;
    text-align: left;
    position: relative;
}
.b-month b{
	font-size: 20px;
	color: #1c1c1c;
	float: left;
	width: 145px;
	line-height: 45px;
	height: 45px;
	background: #ececec;
	border-radius: 0 30px 30px 0;
	text-align: center;
	margin-top: 20px;
	margin-right: 14px;
	margin-bottom: 12px;
}
.b-month i{
	font-size: 20px;
	font-weight: bold;
	color: #ff0c1d;
	float: left;
	margin-top: 30px;
}
.b-month p{
	font-size: 14px;
	color: #666;
	text-align: center;
	margin-bottom: 12px;
}
.b-month a{
	font-size: 14px;
	color: #ababab;
	background: #2c2c2c;
	display: block;
	width: 193px;
	height: 33px;
	line-height: 33px;
	text-align: center;
	margin: 0 auto;
	margin-top: 24px;
	border: 1px #2C2C2C solid;
	-webkit-transition: .8s;
}
.b-month a:hover{
	background: none;
	border: 1px #2C2C2C solid;
	color: #2C2C2C;
}
.i-last{
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.classroom_left {
	float: left;
	width: 750px;
	height: 510px;
}

.classroom_left ul {
	width: 100%;
	padding-top: 20px;
}

.classroom_left ul li {
	float: left;
	width: 242px;
	height: 184px;
	margin: 0px 3px;
	background: #fff;
	border: 1px #f1f1f1 solid;
	border-radius: 2px;
	position: relative;
	overflow: hidden;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.classroom_left ul li img {
	width: 100%;
	height: 122px;
	border-radius: 2px 2px 0px 0px;
}

.classroom_left ul li .clrl {
	font-size: 14px;
	color: #444;
	text-align: left;
	line-height: 35px;
	padding-left: 10px;
}

.classroom_left ul li .clrl_01 {
	float: left;
	font-size: 12px;
	color: #999999;
	text-align: left;
	padding-left: 10px;
}

.classroom_left ul li .clrl_01 img {
	width: 14px;
	height: 9px;
	margin-right: 5px;
}

.classroom_left ul li .clrl_02 {
	float: left;
	font-size: 12px;
	color: #999999;
	text-align: left;
	padding-left: 10px;
}

.classroom_left ul li .clrl_02 img {
	width: 12px;
	height: 12px;
	margin-right: 5px;
}

.clrl_hover {
	width: 100%;
	position: absolute;
	top: 184px;
	height: 62px;
	background: #fff;
	text-align: left;
}

.clrl_hover p {
	font-size: 14px;
	color: #444444;
	margin-top: 15px;
	line-height: 30px;
	padding-left: 20px;
}

.clrl_hover p span {
	float: right;
	display: block;
	width: 80px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	color: #fff;
	background: #4bbbfa;
	border: 1px #19a8f9 solid;
	border-radius: 2px;
	margin-right: 20px;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.clrl_hover p span:hover {
	background: #49B4F1;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.classroom_left ul li:hover {
	box-shadow: 0px 19px 18px -9px rgba(0, 0, 0, 0.1);
	margin-top: -15px;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}

.classroom_left ul li:hover .clrl_hover {
	top: 122px;
	transition: 0.4s;
	-webkit-transition: 0.4s;
}
.l-left{
	float: left;
	background: url(../images/bag02.jpg) center no-repeat;
	width: 386px;
	height: 390px;
	margin-left: 25px;
	margin-right: 16px;
	margin-top: 35px;
}
.l-left span{
	font-size: 50px;
	color: #FFFFFF;
	font-weight: bold;
	display: block;
	padding-top: 100px;
	text-align: center;
}
.l-left span i{
	font-size: 33px;
	display: block;
	margin-bottom: 6px;
}
.l-left em{
	background: #fff;
	width: 226px;
	height: 6px;
	display: block;
	margin: 22px auto;
}
.l-left p{
	color: #fff;
	font-size: 18px;
	
}
.l-link{
	padding-bottom: 100px;
}