*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
a { text-decoration: none; outline: none; user-select: none;}
ul{list-style:none;}
img{ max-width:100%; display:block;}
img[src*=".svg"] { width:100%; }
html { width:100%; height:100%; margin: 0 auto;}
body { width:100%; min-height:100%; background: #ccd16e url("../img/bg_2025.jpg?v=2025") center top no-repeat; background-position: 50% 60px; margin:0 auto; font-size:18px; line-height:1.5; overflow-x:hidden; font-family:'Noto Sans TC', Helvetica; }
body.page-staff { background-position: 50% top; }

body.page-index { background: #c5bb5b url("../img/bg_index_2025.jpg") center top no-repeat; animation: kv-intro-index ease-in-out 1.2s;}

small{ font-size: 16px;}
.none{ display:none !important;}
.container{ width:100%; position:relative; margin:0 auto; padding:0; z-index:2; }

.btn{ display:block;}

#loader{ width:100%; height:100%; top:0; left:0; bottom:0; right:0; background-color:#c5bb5b; position:fixed; z-index:99999; overflow:hidden; pointer-events:none;}
#loader.loaded{ opacity:0; transition:all .5s ease-out; }

#wrap{ width:100%; height:100%; margin: 0 auto;  }
#main{ width:100%; height:100%; }

#header{ width: 100%; height: 60px; background-color: #FFF; }
#header .container { width:95%; height: 100%; max-width: 1920px; display: flex; align-items: center;}
#header .logo{ height: 30px;}

#footer { background-color: #3a3f47; color: #FFF; }
#footer .container{ width:90%; max-width:1000px; text-align:center; padding:20px 0; font-size: 14px; }
#footer .container a{ color: #FFF;}
.desktop #footer .container a:hover{color: #fff200;}
#footer .container ul.hosts{ margin-bottom: 25px; font-size: 18px;}
#footer .container ul.hosts li{}
#footer .container ul.copyright{ display: flex; justify-content:center;}
#footer .container ul.copyright li{ padding:0 10px; border-right: #fff solid 1px; line-height: 1; margin-bottom: 7px;}
#footer .container ul.copyright li:last-child{ border: 0;}

#btn-gotop { display:none; position:fixed; right: 10px; bottom:30px; width:50px; height:50px; z-index:999; opacity: 1; background:#c09d5b url(../img/gotop.png) 50% 50% no-repeat; background-size:100% auto; border-radius:100%; cursor:pointer; transition:opacity ease 0.2s;}
.desktop #btn-gotop:hover{ opacity:0.85; transition:opacity ease 0.2s; }



/*	RESPONSIVE:  */
@media only screen and (max-width:1023px) {
	
body { background-size: 1280px auto;}
	
body.page-index { background: none;}
.sec-block{ padding:40px 0;}
}


/*	RESPONSIVE:  */
@media only screen and (max-width:767px) {

body { background-size: 1080px auto; background-position: 50% 50px;}
body.page-index  { background: #fff url("../img/bg_xs.jpg") center top repeat-x; background-size: 100% auto;}	
	
#header{ height:50px; }
#header .container { justify-content: center;}

#footer .container ul.hosts{ font-size: 16px;}	
#footer .container ul.copyright{ display:block; }
#footer .container ul.copyright li{ padding:0; border-right: 0;}
	
}

@keyframes kv-intro-index {
  0% {
	  background-size: 2020px auto;
  }
  100% {
	  background-size: 1920px auto;
  }
}

