/* CSS Document */
*{margin:0; padding:0;}
a{text-decoration:none;}
ul li{list-style:none;}
img{outline:none; border:none;}
input,select{outline:none;}
area{outline:none;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}
i,em{font-style:normal;}
body{font-family:"微软雅黑"; font-size:12px;}
.clearfix:after{ display:block; content:''; clear:both;}

.top{ width:1060px; margin:0 auto; overflow:hidden;}
.top a{ float:left; }
.top a img{ display:block;}
.top span{ float:right; height:89px; line-height:90px; background:url(../images/phone.png) left center no-repeat; text-indent:39px; color:#FFF; font-size:24px; font-family:Arial, Helvetica, sans-serif;}

.banner{ width:996px; margin:0 auto; overflow:hidden; padding:170px 0 0 64px;}
.banner a{ display:block; width:280px; height:60px; line-height:60px; color:#FFF; text-indent:80px; background:url(../images/a_bg.jpg) left center repeat-x; border-radius:30px; font-size:20px; position:relative;}
.banner a i{ position:absolute; width:22px; height:23px; background:url(../images/i_con.png) no-repeat; left:41px; top:20px;}
.banner a:hover{ font-weight:bold;}

.before{ width:1060px; margin:0 auto; overflow:hidden; padding-top:70px;}
.before h3{ background:url(../images/tfcc_05.jpg) center top no-repeat; height:34px; margin-bottom:40px;}
 
.bf_ct{ width:100%; position:relative; height:458px; background:url(../images/tfcc_09.jpg) center top no-repeat;}
.bf_ct dl{ width:310px; height:151px; overflow:hidden; position:absolute;}
.bf_ct dl dt{ width:100%; line-height:70px; text-indent:73px; height:71px; font-size:18px; color:#222222;}
.bf_ct dl dd{ padding:10px 18px 0; width:274px; line-height:30px; color:#222222; font-size:14px; }
.bf_ct a{ position:absolute; width:280px; height:60px; line-height:60px; text-align:center; color:#FFF; background:url(../images/a_bg.jpg) repeat-x; bottom:0px; left:394px; border-radius:30px; font-size:20px;}
.bf_ct a:hover{ font-weight:bold;}

.box{ width:1060px; margin:0 auto; overflow:hidden; padding-top:60px; padding-bottom:60px;}
.box h3{ width:100%; background:url(../images/tfcc_13.jpg) center top no-repeat; height:35px;}

#course{ width:1050px; overflow:hidden; padding:40px 0 30px 10px;}
#course span{ cursor:pointer; float:left; width:230px; height:60px; line-height:60px; text-align:center; border-radius:8px; background:url(../images/a_bg3.jpg) left center repeat-x; margin-right:40px; color:#FFF; font-size:18px;}
#course span.se{ background:url(../images/a_bg2.jpg) left center repeat-x;
-webkit-animation-name: bounce; 
	-o-animation-name: bounce;   
	-webkit-animation-duration: 1.2s;
	-o-animation-duration: 1.2s;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode: both;
}
@keyframes bounce {
  from, 20%, 53%, 80%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    transform: translate3d(0,-4px,0);
  }
}


#course_content{ width:1040px; height:330px; margin:0 auto; overflow:hidden; position:relative;}
#course_content div{ position:absolute; width:100%; height:330px; background:url(../images/ever_bg.jpg) center top no-repeat; top:0px; left:1040px; }
#course_content div.active{ left:0px; top:0px;   
	 -webkit-animation-name: flipInY; 
	-o-animation-name: flipInY;   
	-webkit-animation-duration: 1.2s;
	-o-animation-duration: 1.2s;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode: both;
 }

@keyframes flipInY {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    animation-timing-function: ease-in;
  }

  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    transform: perspective(400px);
  }
}

#course_content div dl{ float:left; width:520px; height:330px; position:relative;}
#course_content div dl dt{ padding-top:32px; text-align:center; line-height:36px; color:#2e33a9; font-size:18px;}
#course_content div dl dd{ line-height:36px; font-size:16px; color:#222222; text-align:center;}
#course_content div dl dd a{ -webkit-transition:all 0.6s ease-in-out; position:absolute; width:179px; height:60px; line-height:60px; text-align:center; color:#FFF; background:url(../images/a_bg.jpg) left center repeat-x; color:#FFF; border-radius:30px; font-size:20px; bottom:35px; left:170px;}
#course_content div dl dd a:hover{ background:url(../images/a_bg2.jpg) left center repeat-x;}



.cannot{ width:1060px; margin:0 auto; overflow:hidden; position:relative; height:510px;}
.cannot dl{ width:230px; height:331px; position:absolute;}
.cannot dl dt{ width:100%; height:100px; line-height:100px; text-align:center; color:#FFF; font-size:18px;}
.cannot dl dd{ width:215px; padding-left:18px; text-align:left; color:#FFF; line-height:36px; font-size:14px;}
.cannot dl dd a.more{ position:absolute; width:179px; height:60px; line-height:60px; border-radius:30px; text-align:center; color:#FFF; background:url(../images/a_bg.jpg) left center repeat-x; font-size:20px; left:25px; bottom:-90px;}
.cannot dl dd a.more:hover{ background:url(../images/a_bg2.jpg) left center repeat-x;}
.cannot dl dd a{ color:#FFF; font-size:14px; display:block; width:100%; line-height:36px;}
.cannot dl dd a:hover{ color:#f76515; }


.ms{width:1060px; margin:0 auto; overflow:hidden; padding-top:60px; }
.ms h3{ background:url(../images/tfcc_20.jpg) center top no-repeat; height:35px; margin-bottom:40px;}

.ms_ct{width:1060px; background:url(../images/tfcc_24.jpg) center top no-repeat; height:492px; position:relative; padding-bottom:60px;}
.ms_ct dl{ position:absolute; width:240px; height:432px;}
.ms_ct dl dt{ width:100%; text-align:center; line-height:78px; color:#FFF; font-size:18px; margin-bottom:142px;}
.ms_ct dl dd p{ line-height:30px; width:196px; padding-left:22px; padding-right:24px; font-size:14px; color:#FFF;}
.ms_ct dl dd a{ position:absolute; width:179px; height:60px; line-height:60px; border-radius:30px; text-align:center; color:#FFF; background:url(../images/a_bg.jpg) left center repeat-x; font-size:20px; left:29px; bottom:-30px;}
.ms_ct dl dd a:hover{ background:url(../images/a_bg2.jpg) left center repeat-x;}


.footer{ width:100%; text-align:center;  color:#FFF;font-size:14px; padding:40px 0; line-height:28px;  background:#333333;}