@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@600&family=Noto+Sans+TC:wght@400;700;900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");
@import url('https://fonts.googleapis.com/css2?family=Sarpanch:wght@700&display=swap');
/* CSS Document */

body {font-family: 'Noto Sans TC', sans-serif;}
h1 {font-weight: 900!important;}

.text-shadow {text-shadow: 1px 1px 10px black;}

.logo img { width: 200px; height: auto; max-width: none; margin: 5px;}

.ellipsis { overflow:hidden; white-space: nowrap; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; height: 45px; overflow: hidden;}

.ellipsis-line { overflow:hidden; white-space: nowrap; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; white-space: normal; height: 25px; overflow: hidden;}

.Sarp {font-family: 'Sarpanch', sans-serif;}


#silder.owl-carousel .owl-nav button.owl-prev span,
#silder.owl-carousel .owl-nav button.owl-next span,
#silder.owl-carousel .owl-dots {display: none;}

#silder.owl-carousel .owl-nav button.owl-prev,
#silder.owl-carousel .owl-nav button.owl-next { position: absolute; top:0; width:50px; height:100%; opacity: 0; transition:all 0.3s }
#silder.owl-carousel .owl-nav button.owl-prev { left:0; background:url(../img/chevron-compact-left.svg)center center !important;background-repeat: no-repeat!important;}
#silder.owl-carousel .owl-nav button.owl-next { right:0; background:url(../img/chevron-compact-right.svg)center center !important;background-repeat: no-repeat!important;}

#silder.owl-carousel:hover .owl-nav button.owl-prev,
#silder.owl-carousel:hover .owl-nav button.owl-next {opacity:1;}




/*---------------------------
          responsive
----------------------------*/

/*md*/
@media only screen and  (max-width: 768px) {
  .logo img { width: 180px; height: auto; max-width:100%;}
    }
  
    
/*sm*/
@media only screen and  (max-width: 480px) {
.logo img { width: 160px; height: auto; max-width:100%;}
  }