/*0 #382214 1 #927055  2 #e6cdb9 3 #efe2d9 */

@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=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
/* CSS Document */
.loader {
  height: 2px;
  width: 330px;
  --c:no-repeat linear-gradient(#0075a9 0 0);
  background: var(--c),var(--c),#A2DBFA;
  background-size: 60% 100%;
  animation: l16 3s infinite;
}
@keyframes l16 {
  0%   {background-position:-150% 0,-150% 0}
  66%  {background-position: 250% 0,-150% 0}
  100% {background-position: 250% 0, 250% 0}
}
@keyframes l4 {
  to{background-size: 120% 100%}
}

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

.raleway { font-family: "Raleway", sans-serif;}

.logo img { width: 250px; height: auto; max-width: none; margin: 5px;}
.fixed-nav { position: fixed!important;top:0; left: 0; width: 100%; z-index: 9999;}

.ellipsis{ overflow:hidden; white-space: nowrap; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; white-space: normal; overflow: hidden;}
.ellipsis-evn{ overflow:hidden; white-space: nowrap; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal;overflow: hidden;}
.ellipsis-odd{ overflow:hidden; white-space: nowrap; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal;overflow: hidden;}

/* Revolution Slider  */
.tp-video-play-button { display: none !important; }
.tp-caption { white-space: nowrap; }


/* effect */
.svg {display: block; width: 100%}
.text-stroke { -webkit-text-stroke: 2px white; paint-order: stroke fill;}
.text-shadow { text-shadow: 5px 5px 20px rgba(0,0,0,0.5)}

#silder.owl-theme .owl-nav{display: none;}
#silder.owl-carousel .owl-dots {position: absolute; width: 100%; bottom: 20px; left: 0; margin: 0;}
#silder.owl-carousel .owl-stage-outer { padding: 20px 0;}


#product.owl-carousel .owl-dots {display: none;}
#product.owl-theme .owl-nav {position: absolute; top: -120px; right: 0;}
#product.owl-carousel .owl-nav button.owl-prev,
#product.owl-carousel .owl-nav button.owl-next { background: transparent!important; }
#product.owl-carousel .owl-nav button.owl-prev span,
#product.owl-carousel .owl-nav button.owl-next span { font-size: 5rem; color:#f45c00; line-height: 0; padding: 10px;}

#educate.owl-theme .owl-nav{display: none;}
#educate.owl-carousel .owl-dots { margin: 20px 0;}
#educate.owl-carousel .owl-stage-outer { padding: 20px 0;}

.owl-carousel .slider { display: block!important;}
.owl-carousel .slider-990 { display: none!important;}

#pro-silder .owl-nav {display: none;}
#pro-silder .owl-dots  {position: absolute; bottom: 20px; width: 100%; }


/* FCK Box */
.fck-box {color:#696969; }
.fck-box p,.fck-box span {line-height: 2;}
.fck-box img { max-width: 100%; height: auto !important; display: inline-block; margin-left: auto; margin-right: auto;  margin-top: 1rem; margin-bottom: 1rem}
.fck-box iframe { margin: 1rem auto ; max-width: 100% !important; }
.fck-box ul { list-style-type: disc; list-style-position: outside; padding-left: 20px;}
.fck-box ol { list-style-type:decimal; list-style-position: outside; padding-left: 20px;}
.fck-box li, .fck-box p{ margin-bottom: 1rem; }
.fck-box table  {width: 100%; max-width: 100%; margin: 1rem auto;}
.fck-box table>tbody>tr:nth-of-type(odd) { background-color: #f9f9f9;}
.fck-box table>tbody>tr>td,
.fck-box table>tbody>tr>th,
.fck-box table>tfoot>tr>td,
.fck-box table>tfoot>tr>th,
.fck-box table>thead>tr>td,
.fck-box table>thead>tr>th { padding: 8px; line-height: 1.5; border: 1px solid #ccc;}
/*---------------------------
          responsive
----------------------------*/
/*2xl*/
@media only screen and  (max-width: 1536px) {
    
}

/*xl*/
@media only screen and  (max-width: 1280px) {

}

/*lg*/
@media only screen and (max-width: 1024px) {

}
    
/*md*/
@media only screen and  (max-width: 768px) {

}

/*sm*/
@media only screen and  (max-width: 480px) {

  }