@charset "utf-8";
/* CSS Document */

/* header */
#support-body{ background:url(../../images/support_bg.jpg) repeat;}
.support-head{ width:100%; height:80px; background:#FFF; box-shadow:0px 1px 5px #bbcbbe;}
.support-wrap{ width:960px; height:80px; margin:0 auto;}
.logo{ width:141px; height:60px; background:url(../../images/logo-large.png) no-repeat; float:left; margin:10px 0 0 0;}
.support-img{ width:172px; height:22px; background:url(../../images/support_img.png) no-repeat; float:right; margin:47px 0 0 0;}


/* section */
.support-content{ width:960px; height:118px; margin:0 auto; overflow:hidden;}
.tag-box{ width:110px; height:110px; float:left; position:relative;  font-weight:normal;}
.tag-title{ width:110px; height:85px;}
.tag-teacher{ background:url(../../images/support_sprites.png) 8px 0px no-repeat;}
.tag-parents{ background:url(../../images/support_sprites.png) -112px 2px no-repeat;}
.tag-advice{ background:url(../../images/support_sprites.png) -231px 4px no-repeat;}
.tag-name{ box-shadow:0px 3px 5px #7f8b81; font-family: \5fae\8f6f\96c5\9ed1; position:absolute; bottom:0px; left:18px; z-index:-1; width:80px; line-height:30px; border:1px solid #453329; border-radius:5px; background:#FFF; color:#453329; text-align:center; font-size:14px;}


.tag-box2{ float:right; width:110px; height:118px; position:relative; font-weight:normal;}
.tag-title-s{ width:110px; height:85px;}
.tag-teacher-s{ background:url(../../images/support_sprites.png) 28px -277px no-repeat;}
.tag-parents-s{ background:url(../../images/support_sprites.png) -90px -277px no-repeat;}
.tag-advice-s{ background:url(../../images/support_sprites.png) -220px -277px no-repeat;}
.tag-name2{ box-shadow:0px 3px 5px #7f8b81;border-radius:5px; overflow:hidden; font-family: \5fae\8f6f\96c5\9ed1; position:absolute; bottom:12px; left:18px; width:80px; line-height:30px; z-index:1;  text-align:center; font-size:14px;}
.tag-name2 a{  display:block;border-radius:5px; background:#d9d9d9; color:#686868; border:1px solid #999;}
.tag-name2 a:hover{background:#fff; color:#453329; border:1px solid #453329;}


.tag-teacher-s:hover{ background:url(../../images/support_sprites.png) 5px 0px no-repeat;}
.tag-parents-s:hover{background:url(../../images/support_sprites.png) -112px 0px no-repeat;}
.tag-advice-s:hover{ background:url(../../images/support_sprites.png) -233px 0px no-repeat;}

/* nav */
.tag-ul{ float:left; margin:30px 0 0 10px; font-family: \5fae\8f6f\96c5\9ed1;}
.tag-ul ul li{ float:left; width:89px; height:72px; line-height:20px; padding:15px 0 0 0; text-align:center; background:url(../../images/support_sprites.png) -105px -97px no-repeat;}
.tag-ul ul li i{ font-size:28px;}
.tag-ul ul li a{ display:block; text-align:center; color:#9f9fa0;}
.tag-ul ul li:first-child{ width:90px; padding:15px 0 0 15px; background:url(../../images/support_sprites.png) 0px -97px no-repeat;}
.tag-ul ul li:last-child{ width:95px; background:url(../../images/support_sprites.png) -194px -97px no-repeat;}
.tag-ul ul li a:hover{ color:#8dc21f;}
.tag-ul ul li a.select-on{ color:#8dc21f;}


/* video */
.support-video{ width:940px; height:auto; overflow:hidden; padding:10px; margin:0 auto; background:#FFF; border-width:5px 0 2px 0; border-color:#8dc21f; border-style:solid;}
.video-title{ font-size:20px; color:#666; font-family: \5fae\8f6f\96c5\9ed1; padding:5px 0px 15px 0px;}
.support-video video{ float:left; background:#000; width:660px; height:400px;}


.support-aside{ float:left; margin:0 0 0 15px; width:240px; height:370px; padding:15px 10px; background:#f2f2f2; }
.aside-title{ font-size:20px; color:#8dc21f; font-family: \5fae\8f6f\96c5\9ed1;}
.support-aside ul li{ margin:13px 0 0 0;}
.support-aside ul li span{ width:45px; float:left; margin:0 3px 0 0; font-size:12px; font-family: \5fae\8f6f\96c5\9ed1; font-weight:bold; color:#8dc21f;}
.support-aside ul li a{ color:#666;}
.support-aside ul li a:hover{ text-decoration:underline;}


/* footer */
.support-footer{ line-height:50px; width:100%; position:fixed; bottom:0; background:#FFF; color:#333; font-size:12px; text-align:center;}
.support-footer span{ margin:0 30px;}