*{margin:0;padding:0;}
img{margin:0;vertical-align:middle;}
ul{list-style-type:none;}
a{text-decoration:none;}
a:hover{text-decoration:none;}
.hide{display:none;}

.container { padding-left: 0 ; padding-right: 0;}
.banner img{ width: 100%; }

.introduce { margin-top:50px; margin-bottom: 20px; position:relative; border:1px dashed #ecb2b5; padding:35px; }
.introduce img{ float:left; }
.introduce .introduce_word{ position:absolute; top:-20px; left:-2px; }
.introduce .introduce_img{ margin:15px; }
.introduce p{color:#333; font-size:16px; line-height:30px; margin-left:180px; margin-top:5px; }

.middle{ margin-bottom: 20px;}
.middle .course h1, .middle .list h1{ background-color: #fff; text-align: center;}
.middle .grade ul { padding-left: 36px; }
.middle .grade ul li, .middle .pdf ul li{ font-size: 16px; color:#333; line-height: 20px; padding-right: 30px; border-bottom: 1px solid #ebebeb; padding-top: 20px; padding-bottom: 20px; position: relative; cursor:pointer; }
.middle .grade ul li:last-child{ border-bottom: none;}
.middle .grade ul li.red{ color:#c80301; }
.middle .grade ul li.red span{ display: inline-block; position: absolute; left: -22px; top:22px; width: 13px; height: 13px; background: url('../images/star.png') no-repeat center center;}
.middle .course{ padding-left: 0; padding-right: 0;}
.middle .grade h2{ height: 31px; line-height: 31px; text-align: left; color: #111111; font-size: 16px ;font-weight: 900 !important; text-indent: 1em; background-size: 100%; }
.middle .grade h2 span{ display: none; float: right; margin-right: 10px; margin-top: 10px; width: 14px; height: 14px; background: url('../images/select_down.png') no-repeat center center; }
.middle .bachelor h2{ background: url('../images/grade_1.jpg') no-repeat center left; }
.middle .specialty h2{ background: url('../images/grade_2.jpg') no-repeat center left;  }
.middle .postgraduate h2{ background: url('../images/grade_3.jpg') no-repeat center left; }



.pdf { z-index:4; width:256px; background:#fff; box-shadow:0 0 5px rgba(200,200,200,.5); }
.pdf h2, .middle .showpdf{ background: green; height: 35px; line-height: 35px; text-align: left; color: #fff; font-size: 16px ; text-indent: 1em; background-size: 100%; margin-top:0; margin-bottom:0; }
.pdf ul { padding-left: 15px; margin-bottom:0;}
.pdf ul li{ padding-right: 15px; padding-top: 10px; padding-bottom: 10px;}
.pdf ul a { color:#333; font-size:13px; }
.showpdf{ right:0; bottom: 10px; z-index: 3; position: fixed; width: 100px; font-size: 17px; text-align: center; padding: 12px; background: green; color: #fff; }

.middle .list{ padding-left: 30px; padding-right: 0;}
.middle .list .special, .middle .list .first{ margin-bottom: 60px;}
.middle .word_box{ background-color: #ebebeb; padding: 5px 15px;}
.middle .word_box h5 { font-size: 16px; color: #333; height: 30px; line-height: 30px; margin: 0;  padding-top: 5px; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space:nowrap;}
.middle .info { font-size: 14px; color:#6b6b6b; overflow: hidden; }
.middle .info p{  }
.middle .info p.name{ font-size: 16px; color: #333; height: 30px; line-height: 30px; margin: 0; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space:nowrap; }
.middle .info p.school{ margin-left:56px; height: 20px; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space:nowrap; }
.middle .img_box { overflow: hidden; position: relative;}
.middle .img_box img{ width: 100%; }
.middle .img_box .cover{ position: absolute; left: 0; top: 0; right: 0; bottom: 0;}
.middle .img_box .playbtn{ opacity: 0; position: relative;  z-index: 3;}
.middle .img_box:hover .playbtn{ opacity: 1;  }
.subject .row{ padding: 0 15px;}
.subject .row .col-md-4 { padding-left: 5px; padding-right: 5px; margin-bottom: 12px;}

@media screen and (min-width: 1200px ) {

}
@media screen and (max-width: 767px ) {
    .left_nav img{ width: 100%;}
    .introduce { padding: 15px; margin: 50px 15px 20px 15px; }
    .introduce p{ margin-left: 0;}
    .container { padding-left: 15px ; padding-right: 15px;}
    .middle .course, .middle .list{ padding-left: 15px; padding-right: 15px;}
    .middle .grade h2{ background-size: 100%; margin: 5px 0; cursor:pointer;}
    .middle .grade h2 span{ display: inline-block;}
    .middle .grade h2.show span{ background: url('../images/select_up.png') no-repeat center center;}
    .middle .grade ul{ padding-left: 20px;}
    .middle .grade ul li{ padding-top: 10px; padding-bottom: 10px;}
    .middle .grade ul li.red span{ left: -18px; top: 12px;}
    .middle .specialty ul, .middle .postgraduate ul{ display: none;}
}
@media screen and (max-width: 414px ) {

}
@media screen and (max-width: 320px ) {

}