.details-body{background: #f5f5f5;overflow: hidden;min-height: 100%;}
.details-container{width: 1200px;margin: 0 auto;}
.details-container .bread-nav{margin: 12px 0 12px -5px;padding: 8px 0;font-size: 15px;color: #919191;}
.details-container .bread-nav a{font-size: 15px;color: #919191;text-decoration: none;padding-right: 5px;padding-left: 5px;}
.details-container .bread-nav a:hover{color: #007df9;}
.details-container .bread-nav span{padding-left: 5px;}
.es-section{background: #fff; padding: 15px; margin-bottom: 20px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);height: 270px;}
.es-section .course-img {width: 480px;float: left;margin-right: 20px;position: relative;}
.course-img .course-img-cover {position: absolute; display: block; top: 0; left: 0; height: 100%; width: 100%; background: #000; opacity: 0.4; filter: alpha(opacity=40); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.course-img .course-img-cover:hover {opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.course-img .course-img-cover .es-icon {color: white; font-size: 100px; position: absolute; top: 50%; left: 50%; margin-left: -50px; margin-top: -50px; }
.course-info{float: left; width: 500px; width: 386px\9;background-color: #fff; }
.course-info .title{font-size: 22px;color: #333;margin-top: 17px;margin-bottom: 8px;}
.course-info .subtitle {color: #919191; margin-bottom: 8px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; font-size: 14px;}
.course-info .metas{color: #919191;}
.course-info .metas .score{margin-bottom: 10px;vertical-align: middle;padding-top: 5px;padding-bottom: 5px;}
.course-info .metas .score i{display: block;width: 14px;height: 14px;background: url(../images/star.jpg) no-repeat 0 0;float: left;margin-right: 5px;}
.course-info .metas .score span{color: #919191; font-size: 12px; margin-left: 8px; line-height: 14px;position: relative;*top:-5px;}
.course-info .buy{width:200px;height:40px;line-height:38px;color:#fff;background: #df3033;display: inline-block;font-size: 16px;text-align: center;margin-top: 20px;}
.course-info .watch{width: 198px;height:38px;line-height: 38px;color:#df3033;background:#ffeded;display: inline-block;font-size:16px;text-align: center;border:1px solid #df3033;margin-top: 20px;}
.metas p{font-size: 14px;padding-top:5px;padding-bottom: 5px;}
.metas .discount-price{padding-top:10px;padding-bottom: 5px;}
.metas p label{display: inline-block;max-width: 100%;width:60px;}
.discount-price .price {font-size: 24px; color: #70d445; margin-right: 10px; }
.course-operation{float: right; width: 240px; padding:0 0px 12px 15px; background-color: #fafafa; color: #919191; border-top-right-radius: 4px; border-bottom-right-radius: 4px; box-sizing: border-box; }
.course-operation .student-num{border-bottom: 1px solid #f1f1f1;text-align: center;font-size: 22px; padding: 20px 0;height: 31px;}
.course-operation .student-num i{display: inline-block;width: 24px;height: 24px;background: url(../images/time.jpg) no-repeat 0 0;vertical-align: middle;}
.course-operation .student-num span{vertical-align: middle;padding-left: 10px;}
.course-data{padding: 10px 0;border-bottom: 1px solid #f5f5f5;height: 80px;}
.course-data > li {float: left; width: 33.33%; margin: 10px 0; color: #919191; text-align: center; line-height: 30px; font-size: 14px;}
.course-data > li > a {color: #919191; text-decoration: none;} 
/*.course-data > li > a:hover {color: #1d58a9; }*/
.course-data > li i {font-size: 26px;}
.color-warning p{color: #ff8a0c}
.course-operation .buy {text-align: center;font-size: 14px;padding-top: 26px;}
.es-share {position: relative; display: inline-block; }
.icon-vip{position: relative; display: inline-block; }
.es-share .dropdown-menu{top:auto; bottom: 100%; left: 0; margin-left: -40px; margin-bottom: 10px; min-width: 145px !important; padding: 3px 10px !important; background-color: #404040 !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; line-height: 30px !important; position: absolute; box-sizing:border-box;display: none;border-radius: 3px;}
.icon-vip .popover{top:auto; bottom: 100%; left: 0; margin-left: -65px; margin-bottom: 10px; min-width: 200px !important; padding: 3px 0px !important;-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; line-height: 30px !important; position: absolute; box-sizing:border-box;border-radius: 3px;text-align: left;background: #fff;border:1px solid #e1e1e1;box-shadow: 2px 5px 8px #d1d1d1;;display: none;}
.icon-vip .popover p{color: #666 !important;padding-left: 15px;}
.icon-vip .popover p.top{border-bottom: 1px solid #ebebeb;background: #f7f7f7;}
.icon-vip .popover a{color: #666 !important;text-decoration: none;}

.es-share.open .dropdown-menu{display: block;}
.es-share .dropdown-menu:after {top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(64, 64, 64, 0); border-top-color: #404040; border-width: 8px; margin-left: -8px; }
.icon-vip .popover:after {top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(64, 64, 64, 0); border-top-color: #fff; border-width: 10px; margin-left: -10px; }
.es-share i[class*="es-icon"] {-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; font-size: 20px !important; }
.es-share .dropdown-menu a {margin: 3px 2px 2px 6px !important; color: #fff !important; text-decoration: none; }
.course-detail{width:1170px;padding: 15px;background: #fff;float: left;margin: 0 auto;}
.nav-btn-tab{margin: 0 auto; padding-right: 80px; border-bottom: 1px solid #f5f5f5; margin-bottom: 20px;overflow: hidden;}
.course-detail .nav-btn-tab li{padding: 5px 20px 15px;font-size: 16px;color: #333;cursor: pointer;float: left;}
.course-detail .nav-btn-tab li:hover{color: #1d58a9;}
.course-detail .nav-btn-tab li.active{border-bottom: 2px solid #007df9;color: #007df9;}
.content-container{margin-bottom: 20px;}
.piece-header {position: relative; margin: 5px auto 20px auto; padding: 0 30px 0 15px; color: #313131; font-size: 16px; border-left: 4px solid #007df9;}
/*.piece-header:after {content: ""; position: absolute; left: 0; top: 3px; width: 4px; height: 16px; background-color: #1d58a9; }*/
.p-lg {line-height: 30px; margin-bottom: 30px; color: #666;font-size: 14px;}
.p-lg a{text-decoration: none;}
.p-lg strong{font-weight: bold;}
.p-lg p{margin-bottom: 10px;}
.side-section{float: right;width: 270px;}
.panel{float: right;width: 240px;margin-bottom: 20px;border-radius: 2px;}
.panel-default {padding: 0 15px; -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);background: #fff;-moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1); }
.panel-default > .panel-heading {position: relative; font-size: 16px; padding: 15px 0; border-bottom: 1px solid #f5f5f5; color: #616161;border-color: #e1e1e1;border-top-right-radius: 1px;border-top-left-radius: 1px;}
.panel-title {margin-top: 0; margin-bottom: 0; font-size: 16px; color: #333; }
.panel-default > .panel-body {position: relative; padding: 15px 0; }
.media:first-child {margin-top: 0; }
.media {margin-top: 15px; font-size: 14px; }
.media, .media-body {zoom: 1; overflow: hidden; }
.media-left {padding-right: 15px; float: left;}
.media-left, .media-right, .media-body {display: table-cell; vertical-align: top; }
.avatar-md {-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; width: 60px !important; height: 60px !important; }
.media-default .media-body{font-size: 14px; }
.media-default .media-body > .title {margin-bottom: 10px; color: #616161;}
.media-default .media-body > .content {color: #919191; }
.user-avatar-list {padding-left: 0; margin-bottom: 0; list-style: none; }
.user-avatar-list li {float: left; width: 20%; margin-bottom: 10px; text-align: center; }
.avatar-sm {-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; width: 40px !important; height: 40px !important; }
.link-dark {text-decoration: none; color: #313131 !important; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.color-gray {color: #919191 !important; }
.text-overflow {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; }
.hid{display: none;}

.period-list {margin-top: 20px; margin-bottom: 0; padding-left: 0; list-style-type: none; }
.period-list .section {padding-left: 45px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; background: #f5f5f5;color: #919191; }
.period-list > li {margin-bottom: 10px; padding: 10px 15px; font-size: 14px; }
.period-list .period {position: relative; padding: 10px 100px 10px 45px; }
.period-list .period > a {color: #919191; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; }
.period-list .period .es-icon-undone, .period-list .period .es-icon-doing, .period-list .period .es-icon-done1 {position: absolute; top: 11px; left: 15px; }
.label-success, .label-info {background-color: #d80c18; padding: 0 5px;border-radius: 2px;color: #fff; } .period-list .period .title {
    color: #616161;
}
.period-list .period .date {position: absolute; top: 11px; right: 50px; }
.period-list .period .course-type {position: absolute; top: 11px; right: 15px; line-height: 20px; }
.period-list .period .course-type i {font-size: 20px; }
a{text-decoration: none;}
.mrm {margin-right: 10px !important; }
.period-list .period:hover, .period-list .period.item-active {background-color: #d2deee; }
.empty {text-align: center; color: #c1c1c1; padding: 20px 0; font-size: 14px; }

.es-icon-bookmarkoutline{background: url(../images/det-icon01.jpg) no-repeat 0 0;width: 16px;height: 21px;display: inline-block;margin-bottom: 8px;}
.es-icon-share{background: url(../images/det_icon02.png) no-repeat 0 0;width: 16px;height: 21px;display: inline-block;margin-bottom: 8px;}
.es-icon-crown{background: url(../images/det_icon03.png) no-repeat 0 0;width: 18px;height: 21px;display: inline-block;margin-bottom: 8px;}

/*璇︽儏椤靛鍔犲垪琛ㄩ〉璇剧▼*/
.course{padding:0px 5px;overflow: hidden;background: #fff;margin-top:30px;}
.course .fs14{font-size: 14px;}
.course .w260{width: 260px;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;overflow: hidden;text-align: left;padding-left: 5px;padding-right: 5px;line-height: 30px;height: 30px;}
.course .vip{background: url(../images/vip.png) no-repeat 0px 8px;text-align: right;padding-left: 20px;}
.course  .tar{text-align: right;}
.course .color1{color:#999;}
.course li.video{border:1px solid #e6e6e6;margin-right: 23px;width: 270px;float: left;margin-bottom: 25px;}
.course li.video p a{text-decoration: none;color:#333;}
.course li.video p a:hover{color:#0679e3;}
.course li.last{margin-right: 0;cursor: pointer;}