
/* 滑块 start */
#subjects {height: 145px;background-color:#e0e2e4;}
#subjects .g-wrap a {position:absolute; top:0; left:100%; width:100%; height:100%; overflow:hidden; -webkit-opacity:1; opacity:1; display:block\9; -webkit-transition:left 300ms, -webkit-opacity 700ms; transition:left 300ms, opacity 700ms;}
#subjects .g-wrap .item-1 {z-index:1; background-color:#c8c8c8;}
#subjects .g-wrap .item-2 {z-index:2; background-color:#6fcdbd;}
#subjects .g-wrap .item-3 {z-index:3; background-color:#f7f7f7;}
#subjects .g-wrap .item-4 {z-index:4; background-color:#2d2d58;}
#subjects .g-wrap a span {position:absolute; background:no-repeat 0 0;}
#subjects .g-wrap .p2 {-webkit-opacity:0; opacity:0; display:none\9; -webkit-transition:-webkit-opacity 400ms; transition:opacity 400ms;}
#subjects .g-wrap .item-1 .p1 {left:0;top:0;width: 650px;height:165px;}
#subjects .g-wrap .item-1 .p2 {left:276px; top:68px; z-index:2; width:189px; height:29px;}
#subjects .g-wrap .item-2 .p1 {
    width: 650px;
}
#subjects .g-wrap .item-2 .p2 {left:250px; top:26px;}
#subjects .g-wrap .item-3 .p1 {height:76px;}
#subjects .g-wrap .item-3 .p2 {left:150px; width:282px; height:122px;}
#subjects .g-wrap .item-4 .p1 {left:23px; top:54px; width:182px; height:80px;}
#subjects .g-wrap .item-4 .p2 {left:227px; top:21px; width:245px; height:122px;}

/*#subjects*/
#subjects .trans a {-webkit-opacity:0; opacity:0; display:none\9;}

/* 逐个出现 */
#subjects .ready .item-2 {transition-delay:150ms; -webkit-transition-delay:150ms; -ms-transition-delay:150ms; -moz-transition-delay:150ms;}
#subjects .ready .item-3 {transition-delay:150ms; -webkit-transition-delay:300ms; -ms-transition-delay:300ms; -moz-transition-delay:300ms;}
#subjects .ready .item-4 {transition-delay:150ms; -webkit-transition-delay:450ms; -ms-transition-delay:450ms; -moz-transition-delay:450ms;}

/* 没有指向 */
#subjects .state-0 .item-1 {left:0;}
#subjects .state-0 .item-2 {left: 300px;}
#subjects .state-0 .item-3 {left: 600px;}
#subjects .state-0 .item-4 {left:793px;}
/* 指向第一个 */
#subjects .state-1 .item-1 {left:0;}
#subjects .state-1 .item-2 {left:500px;}
#subjects .state-1 .item-3 {left:750px;}
#subjects .state-1 .item-4 {left:917px;}
#subjects .state-1 .item-1 .p2 {-webkit-opacity:1; opacity:1; display:block\9;}
/* 指向第二个 */
#subjects .state-2 .item-1 {left:0;}
#subjects .state-2 .item-2 {left:250px;}
#subjects .state-2 .item-3 {left:750px;}
#subjects .state-2 .item-4 {left:917px;}
#subjects .state-2 .item-2 .p2 {-webkit-opacity:1; opacity:1; display:block\9;}
/* 指向第三个 */
#subjects .state-3 .item-1 {left:0;}
#subjects .state-3 .item-2 {left:250px;}
#subjects .state-3 .item-3 {left:500px;}

#subjects .state-3 .item-3 .p2 {-webkit-opacity:1; opacity:1; display:block\9;}
/* 指向第四个 */
#subjects .state-4 .item-1 {left:0;}
#subjects .state-4 .item-2 {left:212px;}
#subjects .state-4 .item-3 {left:425px;}
#subjects .state-4 .item-4 {left:637px;}
#subjects .state-4 .item-4 .p2 {-webkit-opacity:1; opacity:1; display:block\9;}
/* 滑块 end */



/*gegede 768 */
/*gegede 768 */
@media screen and ( max-width:768px ){
#subjects {height:auto;background-color:#ffffff;padding: 0px 0px;}
#subjects .g-wrap a {position:inherit; top:0; left:100%; width:100%; height:100%; overflow:hidden; -webkit-opacity:1; opacity:1; display:block\9; -webkit-transition:left 300ms, -webkit-opacity 700ms; transition:left 300ms, opacity 700ms;}
#subjects .g-wrap a span {position:inherit; } 


  .g-wrap{display:flex;flex-direction: column;}
  #subjects .g-wrap img{max-width:100%;}
  #subjects .g-wrap .item-1{width:100%;}
  #subjects .g-wrap .item-2{width:100%;margin:5px 0px;;}
  #subjects .g-wrap .item-3{width:100%; margin-bottom:20px}

}