﻿/*--- general ---*/
.btn_distanceEduIndex_01 { cursor:pointer; width:94px; height:21px; border:0; background:url(images/bg_distanceEduIndex.png) 0 -630px no-repeat}

/*--- layout ---*/
#wrap_distanceEduIndex { width:980px; margin:0 auto}
#main { width:100%; padding-top:6px}
.area01 { float:left; width:734px}
.area02 { float:left; width:240px; padding-left:6px}

/*--- parent ---*/
.parent01 { margin-bottom:6px}
.parent02 { margin-bottom:0}
.parent03 { margin-bottom:1px}
.parent04 { width:329px}
.parent05 { width:329px; margin-left:6px}
.parent06 { width:208px; padding:15px 0 10px 10px}
.parent07 { width:317px; padding:0 0 10px 10px}
.parent08 { width:317px; padding:15px 0 10px 10px}
.parent09 { width:242px}
.parent10 { width:240px; margin-left:6px}
.parent11 { width:255px; padding:15px 0 10px 10px}
.parent12 { display:inline; width:230px; margin-left:12px}

/*--- block ---*/
.blk01 { background:#FFF}
.blk01 .ttl { height:29px; background:url(images/bg_distanceEduIndex.png) 0 0 no-repeat}
.blk01 .ttl span { float:right; padding:4px 10px 5px 0}
.blk01 .ttl h2 { float:left; padding:4px 0 5px 36px; font:bold 14px/20px Microsoft YaHei, Simsun; color:#fff}
.blk01 .ttl h2 a { color:#fff}
.blk01 .ttl h2 a:hover { color:#fff}
.blk01 .ttl strong { float:right; padding:4px 20px 5px 0}
.blk01 .ttl strong a { padding:0 8px 0 6px; color:#006aaf; background:url(images/bg_distanceEduIndex.png) right -39px no-repeat}
.blk01 .ttl strong a.last { background:none}
.blk01 .ttl a {color:#006aaf}
.blk01 .ttl a:hover { color:#f13a09}

.blk02 { background:#FFF}
.blk02 .ttl { height:26px; background:url(images/bg_distanceEduIndex.png) 0 -180px no-repeat}
.blk02 .ttl span { float:right; padding:3px 10px 3px 0}
.blk02 .ttl h2 { float:left; padding:3px 0 3px 32px; font:bold 14px/20px Microsoft YaHei, Simsun; color:#006aaf}
.blk02 .ttl a { color:#006aaf}
.blk02 .ttl a:hover { color:#f13a09}

.blk03 { background:#FFF}
.blk03 .ttl { height:29px; background:url(images/bg_distanceEduIndex.png) 0 0 no-repeat}
.blk03 .ttl span { float:right; padding:4px 10px 5px 0}
.blk03 .ttl h2 { float:left; padding:4px 0 5px 36px; font:bold 14px/20px Microsoft YaHei, Simsun; color:#fff}
.blk03 .ttl h2 a { color:#fff}
.blk03 .ttl h2 a:hover { color:#fff}
.blk03 .ttl ul { float:right; padding:4px 20px 0 0}
.blk03 .ttl ul li { float:left; cursor:pointer; margin-right:3px; background:url(images/bg_distanceEduIndex.png) 0 -70px no-repeat}
.blk03 .ttl ul li em { display:block; padding:3px 12px 2px; font-weight:bold; background:url(images/bg_distanceEduIndex.png) right -70px no-repeat}
.blk03 .ttl ul li a { color:#006aaf}
.blk03 .ttl ul li.this { cursor:default; background-position:0 -100px}
.blk03 .ttl ul li.this em { background-position:right -100px}
.blk03 .ttl a {color:#006aaf}
.blk03 .ttl a:hover { color:#f13a09}


/*--- special ---*/
.ad01 { width:980px; height:90px}
.ad01 img { width:100%; height:100%; vertical-align:top}

.actPredict { overflow:hidden; height:204px; padding:8px 10px}
.actPredict .latest .image { float:left; width:35px; height:35px; padding:1px; border:1px solid #ccc}
.actPredict .latest .image img { width:100%; height:100%}
.actPredict .latest p { float:left; width:175px; padding-left:6px}
.actPredict .latest p em { font-weight:bold; color:#e62713}
.actPredict h5 { font-size:12px}
.actPredict .ctn { padding:6px 0}
.actPredict .ctn p { color:#666}
.actPredict .old { padding:5px; background:#eee}
.actPredict .old h5 { background:url(images/GlobalLine_01.gif) 0 9px repeat-x}
.actPredict .old h5 span { padding-right:3px; background:#eee}
.actPredict .old ul { padding:0 5px;}
.actPredict .old li { overflow:hidden; width:100%; white-space:nowrap}
.actPredict .old li span { display:block; padding-left:10px; background:url(images/GlobalIcon_01.gif) 0 9px no-repeat}

.courseCatalog { background:#FFF}
.courseCatalog .ttl { position:relative; height:20px; padding:4px 20px 5px 32px; background:url(images/bg_distanceEduIndex.png) 0 -130px no-repeat}
.courseCatalog .ttl h2 { font:bold 14px/20px Microsoft YaHei, Simsun; color:#fff}
.courseCatalog .ttl span { position:absolute; right:24px; top:4px; z-index:1; width:86px; height:22px; background:url(images/bg_distanceEduIndex.png) -500px -630px no-repeat}
.courseCatalog .ttl span a { display:block; width:58px; height:20px; padding-top:2px; padding-left:28px; color:#195886}
.courseCatalog .ttl span a:hover { color:#f13a09}
.courseCatalog .ttl span small { position:absolute; left:80px; top:-8px; z-index:1; border:0; width:19px; height:16px; background:url(images/bg_distanceEduIndex.png) -590px -630px no-repeat}
.courseCatalog ul { padding:1px}
.courseCatalog li { float:left; overflow:hidden; width:100%; padding:6px 0}
.courseCatalog li.s1 { background:#f2f3f5}
.courseCatalog dl { float:left; width:340px; padding:0 12px}
.courseCatalog dt { font-size:14px; font-weight:bold}
.courseCatalog dd span { padding-right:5px; white-space:nowrap}

.courseFree  { overflow:hidden; height:108px}
.courseFree ul { padding:10px 0}
.courseFree li { float:left; overflow:hidden; width:365px; height:20px; padding-bottom:2px; background:url(images/GlobalLine_01.gif) 0 9px repeat-x}
.courseFree li em { padding:0 3px 0 25px; background:url(images/GlobalIcon_01.gif) 12px 6px no-repeat #fff}
.courseFree li span { float:right; margin-left:5px; padding:0 8px 0 3px; background:#fff}
.courseFree li span a { color:#e62713}

.coursePromotion { overflow:hidden; height:187px}
.coursePromotion ul { padding:12px 0 4px 14px}
.coursePromotion li { float:left; overflow:hidden; width:340px; height:45px; padding:0 20px 12px 0; background:url(images/bg_distanceEduIndex_01.png) no-repeat}
.coursePromotion li span { display:block; overflow:hidden; height:19px}
.coursePromotion li em { font:bold 15px Arial; color:#e62713}
.coursePromotion li em dfn { font-size:12px}
.coursePromotion li q, .coursePromotion li small { padding-left:12px; color:#777}
.coursePromotion li del { color:#777}
.coursePromotion li a { display:block; height:42px; padding:0 10px 0 53px}
.coursePromotion li a:hover { text-decoration:none}
.coursePromotion li a:hover span { cursor:pointer; text-decoration:underline; color:#f13a09}

.distanceEduFeature { overflow:hidden; width:100%; height:246px}
.distanceEduFeature .slideshow { float:left; overflow:hidden; width:258px; height:232px; padding:8px 14px 6px 8px; background:url(images/bg_distanceEduIndex.png) 0 -230px no-repeat}
.distanceEduFeature .slideshow img { width:100%; height:100%}
.distanceEduFeature .ctn { float:left; width:434px; height:225px; padding:15px 10px 6px; background:url(images/bg_distanceEduIndex.png) -280px -230px no-repeat}
.distanceEduFeature .ctn h3 { font:18px/20px Simhei; color:#ff3200; text-align:center}
.distanceEduFeature .ctn h3 a { color:#e62713}
.distanceEduFeature .ctn p { overflow:hidden; height:40px; padding:5px 8px; color:#666}
.distanceEduFeature .ctn .list { padding:10px 8px 5px 0}
.distanceEduFeature .ctn .list li { float:left; overflow:hidden; width:50%; padding-bottom:2px; white-space:nowrap}
.distanceEduFeature .ctn .list li span { float:left; height:20px; padding-left:18px; background:url(images/GlobalIcon_01.gif) 8px 8px no-repeat}
.distanceEduFeature .ctn .list li a.s1 { padding-right:6px; color:#0177c9}
.distanceEduFeature .ctn .list li a.s1:hover { color:#f13a09}

.famousTeacher { overflow:hidden; height:237px; padding-top:11px}
.famousTeacher ul li { float:left; width:102px; padding:0 0 10px 12px; text-align:center}
.famousTeacher ul li .image { display:block; width:98px; height:70px; padding:1px; border:1px solid #e7e7e7}
.famousTeacher ul li img { width:100%; height:100%; vertical-align:bottom}
.famousTeacher ul li span { display:block; overflow:hidden; height:32px; padding:1px 0; line-height:16px; background:#e7e7e7}

.search01 { overflow:hidden; height:88px; padding:0 20px; background:url(images/bg_distanceEduIndex.png) 0 -500px no-repeat #fff}
.search01 h2 { padding:8px 0 5px 20px; font:bold 14px/20px Microsoft YaHei, Simsun}
.search01 div { height:22px; padding:4px 0}
.search01 div select { width:88px; margin-right:4px}
.search01 div input.txtinput { width:200px; height:16px; margin-right:4px; line-height:16px}
.search01 dl dt { float:left; width:70px; text-align:right; font-weight:bold; color:#666}
.search01 dl dd { float:left; width:624px}
.search01 dl dd span { padding-right:10px; white-space:nowrap}
.search01 dl dd span a { color:#666}
.search01 dl dd span a:hover { color:#f13a09}
.search01 p span { padding-right:10px; white-space:nowrap}

/*--- mod ---*/
.mod01 { width:100%}
.mod01 ul { overflow:hidden; height:223px; padding:8px 10px}
.mod01 li { float:left; overflow:hidden; width:100%; height:20px; padding-bottom:2px}
.mod01 li span { float:left; padding-left:10px; background:url(images/GlobalIcon_01.gif) 0 9px no-repeat}

.mod02 { overflow:hidden; height:252px}
.mod02 dl { line-height:23px}
.mod02 dl dt, .mod02 dl dd { float:left; width:220px; padding:0 10px}
.mod02 dl strong, .mod02 dl small, .mod02 dl span { float:left; overflow:hidden; white-space:nowrap}
.mod02 dl dt { font-weight:bold; background:#eff8fd}
.mod02 dl dd { background:url(images/GlobalLine_02.gif) left bottom repeat-x}
.mod02 dl strong { width:90px}
.mod02 dl small { width:90px; padding-left:5px}
.mod02 dl span { width:30px; padding-left:5px}
.mod02 dl dd strong { font-weight:normal}
.mod02 dl a { padding-right:6px; color:#0177c9}
.mod02 dl a:hover { color:#f13a09}

.mod03 { overflow:hidden; width:100%; height:275px}
.mod03 dl { padding:4px 10px}
.mod03 dt { overflow:hidden; width:100%; height:20px; padding-top:3px; white-space:nowrap}
.mod03 dt img { width:17px; height:17px; margin-right:5px; vertical-align:middle; background:url(images/bg_distanceEduIndex.png) -700px -630px no-repeat}
.mod03 dd { overflow:hidden; width:100%; padding-bottom:3px; color:#666}

.mod04 p { padding:10px; background:#fff}
.mod04 p a { display:block; width:220px; height:32px; text-align:center; line-height:32px; font-size:14px; font-weight:bold; color:#195886; background:url(images/bg_distanceEduIndex.png) -200px -630px no-repeat}
.mod04 p a:hover { color:#f13a09}
