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

 body > div.banner > img {
  height: 290px !important;
  object-fit: cover !important;
 }

 body > div.nav-content > ul  {
  height: 30px !important;
 }
 body > div.nav-content > ul > li {
  height: 30px !important;
 }
 body > div.nav-content > ul > li  > a {
  font-size: 13px !important;
  line-height: 19px !important;
  white-space: nowrap !important;
 }

 body > div.nav-content {
  display: none !important;
 }
 #b2{
padding: 0 !important;
 }
 #b1,
 #b3,#b4,
 #b5,#b6,
 #b7 {
  padding: 0 20px !important;
  box-sizing: border-box !important;
 }

 #b1 > div {
  padding-top: 30px !important;
 }
 #b1 > div > div:nth-child(2) {
  width: 67px !important;
 }
 #b2 > div:nth-child(1) > img {
  display: none !important;
 }
 #b2 > div:nth-child(1) > div > h2 {
  color: #333 !important;
 }

 #b2 > div:nth-child(1) > div {
  top: -160px !important;
 }

 #timeline {
  margin-top: 80px !important;
  padding-bottom: 20px !important;
 }

 #b2 > div:nth-child(1) > div > div > div > div:nth-child(1) {
color:#333;
 }
 #b2 > div:nth-child(1) > div > div > div > div:nth-child(2) {
width: 22px !important;
 }

 #b2 > div:nth-child(1) > div > div > div.histaddc.active > div  {
  color: #333 !important;
  font-weight: bold !important;
 }
 #b2 > div:nth-child(1) > div > div > div.histaddc.active > div:nth-child(2) {
  background: #000 !important;
  }
  #b2 > div:nth-child(1) > div > div > div:nth-child(1) {
   width: 290px !important;
  }
  #b2 > div:nth-child(1) > div > div {
   margin-left: 30px !important;
  }
  #hisleft ,#hisright{
bottom:50px !important;
display: none !important;
  }
  #timeline-items {
   width: fit-content !important;
  }
 

  #b3 > div > div:nth-child(2) {
   width: 67px !important;
  }
  #b3 > div > div:nth-child(4) {
   display: block !important;
  }
  #b3 > div > div:nth-child(4) > div {
   text-align: center !important;
  }
  #b3 > div > div:nth-child(4) > div:nth-child(2),#b3 > div > div:nth-child(4) > div:nth-child(3){
   margin-left: 0 !important;
   margin-top: 20px !important;
  }
  #b3 > div > div:nth-child(4) > div> div:nth-child(2) {
   text-align: center !important;
  }
  #b3 > div {
   padding-top: 30px !important;
  }
  #b3 > div > div:nth-child(4){
   margin-top: 30px !important;
  }

  #b4{ 
   padding: 30px 20px !important;
  }
  #b4 > div:nth-child(2),#b5 > div:nth-child(2) ,#b6 > div:nth-child(2),#b7 > div:nth-child(2){
   width: 67px !important;
  }

  #rypc {
   width: fit-content !important;
  }
  #rpyc-cont {
   padding: 0 !important;
  }
  #hisleft1,#hisright2 {
   display: none !important;
  }
  #dg-container > div {
   width: fit-content !important;

  }
  #dg-container > div > div {
   flex-shrink: 0 !important;
  }
  #dg-container > div > div > img {
   width:  100% !important;
  }
  #b5,#b6 {
   padding: 30px 20px !important;
  }

  #b6 > div.video > div.bar-as > a {
   font-size: 15px !important;
   line-height: 21px !important;
  }

  .bar-as-panel{
   display:  block !important;
  }
  .bar-as-panel > div {
   height: 290px !important;
  }
  .bar-as-panel  > div > video {
width: 100% !important;
  }
  #b6 > div.video > div.bar-as {
   padding-bottom:  0 !important;
  }
  #b6 > div.video > div.bar-as {
   margin-bottom: 0 !important;
  }

  #b6 > div.video > div.bar-as {
   display: none !important;
  }

  .bar-as-panel  > div {
   margin-left: 0 !important;
  }

  .bar-as-panel  > div:nth-child(1) {
   height: 200px !important;
  }
  .bar-as-panel  > div:nth-child(1) > video {
   height: 200px !important;
  }
  .bar-as-panel:nth-child(1) > div:nth-child(2) > a {
   display: none !important;
  }

  .bar-as-panel:nth-child(1)::before {
   content: '重人才培養 崇創新多元';
   display: block;
   text-align: center;
font-size: 16px;
line-height: 30px;
color: #333;
  }
  .bar-as-panel:nth-child(2)::before {
   content: '激發活力，開放協同';
   display: block;
   text-align: center;
font-size: 16px;
line-height: 30px;
color: #333;
  }
  .bar-as-panel:nth-child(3)::before {
   content: '逐夢不止，興邦傳芒';
   display: block;
   text-align: center;
font-size: 16px;
line-height: 30px;
color: #333;
  }
  .bar-as-panel:nth-child(1) > div > p ,.bar-as-panel:nth-child(2) > div > p,.bar-as-panel:nth-child(3) > div > p{
font-size: 14px !important;
  }

  #b7 > div:nth-child(3) > img {
   width: 100% !important;
   margin-bottom: 20px !important;
  }

  .video {
   padding-bottom:  0 !important;
  }

  #b1 > div {
   width: 100% !important;
  }

  #b2 > div:nth-child(1) > div,#b2 > div:nth-child(1) > div > div ,#b2 > div:nth-child(1) > div > div div {
   width:  100% !important;
  }

  #b3, #b3 div,#b4,  #b5, #b5 div, #b6, #b6 div , #b7, #b7 div  {
   width:  100% !important;

  }

  .timeline-item {
    width: 100vw !important;
    padding: 39px 20px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  #timebg {
  display: block !important;
  position: absolute;
  left: 0 ;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  }

  #timeline {
    position: relative !important;
    width: 100% !important;
  }

  #timectrllors {
    display: flex !important;
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    width: 100%;
    justify-content: space-between;
  }
  #timectrllors  > a {
    display: block;
    padding: 20px;
    cursor: pointer;
    position: relative;
  }
  #timectrllors  > a  > span {
    position: absolute;
    top: 20px ;
    font-size: 13px ;
    color: #333;
  }
  #timeleft > span  {
    left: 46px;
  }
  #timeright> span {
    left: 43px;
  }
  #b4,#b5 {
    padding: 20px 0 !important;
    background: #f1f3f7 !important;
  }
  #rpyc-cont{
    background: transparent !important;
    padding: 50px 0 !important;
  }

#dg-container  #swiper-button {
    display: block !important;
  }

 #dg-container .dg-wrapper {
  display: none !important;
  }

  #b5 > div.banner > a{
    display: none;
  }

  #swiper-video{
    display: block;
    height: 100px !important;
    bottom: 0 !important;
  }
  #rpyc-cont {
    padding: 0 !important;
  }

  #b5{
    padding-bottom: 0 !important;
  }
 
  #swiper-qywh {
    display: block !important;
  }
  #bar-as-p1, #bar-as-p2, #bar-as-p3 {
    display: none !important;
  }
  #b5 > div.banner {
    background: #fff !important;
  }
  #swiper-video-pagination {
    bottom: 0 !important;
    padding: 10px 0 !important;
  }
.banner {
  position: relative;
}
  body > div.banner > img:nth-child(1) {
    display: none !important;
  }
  body > div.banner > img:nth-child(2) {
    display: block !important;
  }
  body > div.banner > svg {
    display: block !important;
    position: absolute;
    left: 20px !important;
    bottom: 50px;
  }

  #b7 > div:nth-child(3) > img:nth-child(1) {
    display: none !important;
  }
  #b7 > div:nth-child(3) > img:nth-child(2) {
    display: block !important;
  }


  #lookmorehzdw {
    width: fit-content !important;
    display: block !important;
    margin: 20px auto !important;
    margin-bottom: 0 !important;
  }

  #b7 {
    padding-bottom: 20px !important;
    padding-top: 30px !important;
    background: #f1f3f7 !important;
  }
  #rpyc-cont {
    width: 150vw !important;
    margin-left: -25vw !important;
   }
}