#header {position: fixed;z-index: 10;right: 0;left: 0;top: 0;text-align: center;box-shadow: 0px 7px 7px -4px rgba(0,0,0,0.5);}
#header .collapse .navbar-nav{margin-left: auto;}
.header--fixed {position: fixed;z-index: 10;right: 0;left: 0;top: 0}
.headroom {transition: transform .25s ease-in-out;will-change: transform}
.headroom--pinned {transform: translateY(0)}
.headroom--unpinned {transform: translateY(-100%)}

.carousel-item{margin-top: 5.5rem}
.carousel-inner picture{-webkit-filter:brightness(.9);}
footer {font-size: 0.8rem;letter-spacing: 3px}

.bg-dark2 {--bs-bg-opacity: 1;background-color: #9e9e9e!important;}

/*loading*/
#spinner {
opacity:0;
visibility:hidden;
transition:opacity .5s ease-out,visibility 0 linear .5s;
z-index:999999
}
#spinner.show {
transition:opacity .5s ease-out,visibility 0 linear 0;
visibility:visible;
opacity:1
}

.navbar-brand img{
width: 100%;
max-width: 250px;
height: auto;
}


#Team .slick-slide {margin: 2px;}
#Team .slick-slide img {width: 100%;text-decoration: none;}
#Team .slick-slide a {text-decoration: none;}
#Team .slick-prev:before,
#Team .slick-next:before { color: black;}
#Team .slick-slide {transition: all ease-in-out .3s;}

#About .slick-slide img {width: 100%;text-decoration: none;}
#About .slick-slide a {text-decoration: none;}
#About .slick-prev: before,.slick-next: before {color: black;}
#About .slick-slide {transition: all ease-in-out .3s;}
#About .slick-slide {margin: 0px 0px;} 


.title h2 {font-weight:700;color:#313131;line-height: 30px}
.text-title2{font-weight: bold;font-size: 1.2rem}
.text-gold {color:#c8a063}
.text-gray {color:#646B65}
.text-ps {font-size:12px;color:#c8a063;display: inline-block;}
.text-small {font-size:12px;}
.Must{display: inline-block;}
.WhiteLine{margin-bottom: -0.1rem}
.GoldBg{background-color: #f8f4f0}
.GoldLine{-moz-transform:scaleY(-1);-webkit-transform:scaleY(-1);-o-transform:scaleY(-1);transform:scaleY(-1);margin-bottom: -0.1rem}
.CLOSE{font-size: 22px;color:#c8a063;text-decoration: none;border: 0;background-color: transparent;}
.CLOSE:hover{font-size: px;color:#646B65;text-decoration: none;border: 0;background-color: transparent;}
#Team .logo img{filter: grayscale(80%);}
#Team .logo img:hover{filter: grayscale(0%);transition: .3s}


@media(min-width:851px) {
.pt-5 {padding-top: 1rem !important;}
.pb-5 {padding-bottom: 1rem !important;}
.mt-7{margin-top: 7rem !important;}
.mb-5 {margin-bottom: 3rem !important;}
.mt-5 {margin-top: 3rem !important;}
}
@media screen and (min-width: 320px) and (max-width:850px) {
.pt-5 {padding-top: 2.3rem !important;}
.pb-5 {padding-bottom: 2.3rem !important;}
.mt-7{margin-top: 3rem !important;}
.mb-5 {margin-bottom: 0rem !important;}
.mt-5 {margin-top: 0rem !important;}
.navbar-collapse .nav-item{border-bottom: solid 1px #EBEBEA;margin: 5px 0}
}

/*滾軸樣式 */
::-webkit-scrollbar {width: 8px;height: 3px}
::-webkit-scrollbar-track {background: #f1f1f1;}
::-webkit-scrollbar-thumb {background: #c8a063;}
::-webkit-scrollbar-thumb:hover {background: #646B65;}

/*iframe*/
.videobox {position: relative;width: 100%;height: 0;padding-bottom: 56.25%;}
.videobox iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.map {display: block;position: relative;height: 0;overflow: hidden;padding: 0;padding-bottom: 75%;}
.map iframe {position: absolute;height: 100%;width: 100%;left: 0;top: 0;}

/*Index*/
#Index .pic{overflow:hidden;}
#Index .pic img{transform:scale(1,1);transition: all 1s ease-out;}
#Index .pic :hover{transform:scale(1.2,1.2);}
#Index .Stop table tr{writing-mode: vertical-rl!important;text-orientation: upright!important;vertical-align: middle;text-align: center;}
#IndexIcon img{background-color: #C8A063;border-radius: 100px;}
#IndexIcon img:hover{background-color: #A98467;border-radius: 100px;transition: 0.3s}
#ServiceInside p{line-height: 30px;margin-bottom: 1rem;margin-top: 1rem}
#Index ul {list-style:disc;}
/*IndexEnd*/

/*News*/
@media(min-width:768px) {#News img {margin-bottom:0.8rem}}
#News .card-date {font-size:12px;color:#c8a063;font-weight: 700;margin-bottom:0.3rem}
#News .card-title {font-size: 17px}
#News .card-author {font-size:12px;color: #514F4D}
#ServiceInside ul{list-style-type: square}
/*NewsEnd*/

/*Idea*/
#Idea .card {
position:relative;
display:flex;
flex-direction:column;
min-width:0;
word-wrap:break-word;
background-color:#fff;
background-clip:border-box;
border:0px solid rgba(0,0,0,0.125);
border-radius:0
}
/*IdeaEnd*/

/*Feature*/
#Feature ol li {font-size:1rem;margin-bottom:1.5rem}
#Feature .Firstword{font-size: 2.6rem}

/*FeatureEnd*/

/*Progress*/
#Progress ol, ul {list-style: none;}
/*ProgressEnd*/

@media screen and (min-width: 320px) and (max-width:850px) {
#Slogan h3 {color:#fff;line-height:35px;text-shadow:2px 2px 4px #000;font-size:1.25rem}
#Slogan {padding:5rem 3rem;background:url(../image/feature/f1.jpg) center center no-repeat;background-size:cover;position:relative}
}

@media(min-width:851px) {
#Slogan h3 {color:#fff;line-height:35px;text-shadow:2px 2px 4px #000;font-size:1.75rem}
#Slogan {padding:8rem 3rem;background:url(../image/feature/f1.jpg) center center no-repeat;background-size:cover;position:relative}
}

@media (min-width: 1024px) {
#Slogan {background-attachment:fixed}
}


/*ZoomIn Hover*/
    .hover-mask a {
      display: block;
      position: relative;
      overflow: hidden;
    }
    .hover-mask img {
      width: 100%;
      height: auto;
      -webkit-transition: all 0.5s ease-in-out;
      -moz-transition: all 0.5s ease-in-out;
      -o-transition: all 0.5s ease-in-out;
      -ms-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;
    }
    .hover-mask:hover img {
      -webkit-transform: scale(1.2);
      -moz-transform: scale(1.2);
      -o-transform: scale(1.2);
      -ms-transform: scale(1.2);
      transform: scale(1.2);
    }
    .hover-mask a h2 {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      margin-top: 0px;
      margin-bottom: 0px;
      height: 100%;
      width: 100%;
      padding: 40% 50%;
      text-align: center;
      background-color: rgba(0,0,0,0.1);
      -webkit-transition: all 0.5s linear;
      -moz-transition: all 0.5s linear;
      -o-transition: all 0.5s linear;
      -ms-transition: all 0.5s linear;
      transition: all 0.5s linear;
      background-image: url("../image/youtube.png");
      background-position: center;
      background-repeat: no-repeat;
      opacity: 1;
    }
    .hover-mask:hover a h2 {
      background-image: url("../image/youtube2.png");
      background-position: center;
      background-repeat: no-repeat;
      opacity: 1;
      transition: .3s
    }