/*公有部分*/
.course-wrap h2{ position: relative;  
             letter-spacing: 2px;  font-size:24px;
            margin:0 auto; margin-bottom:10px; padding: 5px; min-width:50px; max-width: 80%; width:max-content;
            
            
          
border-bottom:solid 2px rgb(98, 152, 234); 
&::before{content: "";
    position: absolute;    
      width: 100%;
      left:10px;
      border-bottom: solid 2px rgb(102, 224, 102);   
      bottom:-10px;
   }
   &::after{content: "";
    position: absolute;    
      width: 100%;
      right:10px;
      border-bottom: solid 2px rgb(180, 178, 34);   
      bottom:-6px;
   }
    }
    
.course-wrap>p{ text-align:center;}

main{width:1200px; margin:0 auto; }
 
 .special-subject,.special-course>section,.course-wrap,.tutor-FAQ{
  	border-radius:10px;  padding:12px; 
 	box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
    margin-bottom:14px;
    }
 
/*大图展示*/
 
#headerCarousel figure{position:relative; }


#headerCarousel figure figcaption{ position:absolute; 
                                width:100%; height:40px; line-height:40px; text-indent:5px;
	                         z-index:100;  display:block;
	                         text-align:left; left:0; bottom:0; font-size:16px; padding:5px 0; letter-spacing:1px; color:White;    
                                background: -webkit-linear-gradient(bottom,rgba(0,0,0,0),rgba(0,0,0,0.7)); /* Safari 5.1 - 6.0 */
    background: -o-linear-gradient(up, rgba(0,0,0,0),rgba(0,0,0,0.7)); /* Opera 11.1 - 12.0 */
    background: -moz-linear-gradient(up,rgba(0,0,0,0),rgba(0,0,0,0.7)); /* Firefox 3.6 - 15 */
    background: linear-gradient( rgba(0,0,0,0),rgba(0,0,0,0.7)); /* 标准的语法（必须放在最后）   背景色透明且渐变*/ 
  }

    /* 默认分页器样式 */
  #headerCarousel   .carousel-pagination {
     left: calc( 100% - 50px);  
    
    }


 
    #headerCarousel {  height: 280px; width:1200px; }
        #headerCarousel .carousel-item{ height:100%; width:100%; display: flex; justify-content: center; align-items: center;}
    #headerCarousel img {	max-height: 100%;
	/* 确保图像不会超出容器 */
	max-width: 100%;
	width: auto;
	/* 保持图像比例 */
	height: auto;
	/* 保持图像比例 */ }



/*课程优选与新发布课程*/	
.special-course{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.special-course>section{  min-height:450px;}
.course-wrap>p{ margin:20px auto; color:#888888;}

.threeCourse{display: -webkit-flex;display: flex; align-items: center;width:100%;
              flex-grow:1;
                    flex-wrap:wrap; justify-content: flex-start; margin:0;box-sizing: border-box;
                 flex-direction:column;
             
             
             }
.threeCourse figure,.threeCourse div{ width:48%; height:280px; position:relative; box-sizing: border-box;} 
 
.threeCourse li{width:98%; height:140px; border:solid 1px #EDEDED; padding:5px; border-radius:10px 10px 0 0;box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);
      transition: all 0.3s ease; margin:10px auto;}
.threeCourse li:hover, .moreCourse li:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
    }
   .moreCourse{display: -webkit-flex;display: flex;width:100%;gap:10px;}  
 .moreCourse li{
      flex: 1; 
     box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);border:solid 1px #EDEDED;border-radius:10px 10px 0 0;
    }   
     .moreCourse li div, .moreCourse li figcaption{
     box-sizing: border-box; padding:5px;
    }   
    
    
    
.threeCourse li a{width:100%; height:100%;display: -webkit-flex;display: flex;justify-content:space-between; align-items: center;}
 .threeCourse figure img, .moreCourse figure img{	 
	 width: 100%;
 
	height: 280px;
 
	border-radius:10px 10px 0 0;
	}
	 .threeCourse figure,.threeCourse div,.threeCourse figure img,.moreCourse figure img{height: 140px;}
    
.threeCourse figure figcaption{ position:absolute; 
                                width:100%; min-height:20px; line-height:20px; text-indent:5px;
	                         z-index:100;  
	                         text-align:center; left:0; bottom:0; font-size:0.9rem; padding:5px 0; letter-spacing:1px; color:White;    
                                background: -webkit-linear-gradient(bottom,rgba(0,0,0,0),rgba(0,0,0,0.7)); /* Safari 5.1 - 6.0 */
    background: -o-linear-gradient(up, rgba(0,0,0,0),rgba(0,0,0,0.7)); /* Opera 11.1 - 12.0 */
    background: -moz-linear-gradient(up,rgba(0,0,0,0),rgba(0,0,0,0.7)); /* Firefox 3.6 - 15 */
    background: linear-gradient( rgba(0,0,0,0),rgba(0,0,0,0.7)); /* 标准的语法（必须放在最后）   背景色透明且渐变*/ 
  }
   
.threeCourse div p span{ color:Red;}    
     .threeCourse div{ position:relative;}   
      .threeCourse div p{ font-size:14px; line-height:20px; letter-spacing:2px; margin:10px 5px;}   
  .threeCourse .studentNum{ position:absolute; bottom:0; text-align:center;  color:#666666; font-weight:bold; width:100%;}
  .threeCourse .studentNum span{ color:Blue;}
    .tags,.teachers{display: -webkit-flex;display: flex;justify-content:space-around; align-items: center; flex-wrap:wrap;}
    .teachers>p{ width:100%; margin:10px 0; position:relative;
                 
                 &::after{content: "";
    position: absolute;    
      width: 140px;
      height:2px;
      right:10px;
      bottom:-6px;
      top:50%;
      background-color:#ECFCCB;
   }
                 }
      .tags>span{ color:#2ABEEE;}
            .tags>span:nth-child(2){ color:#008890;}
                  .tags>span:nth-child(3){ color:#999936;}
  .MoreCourseTeacher{ margin:20px 0 10px 0; font-size:16px; letter-spacing:2px;}   
    .MoreCourseTeacher>a{ margin-left:10px; color:Blue;font-size:16px;}