@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:100,300,400,500,700,900');

* {

	padding: 0;

	margin: 0; 

}

body {

    font-family:'Noto Sans TC', serif; 

    letter-spacing: 2px;

    font-size: 16px;

    line-height: 150%;

    

    position: relative;

}



:focus{

    outline: 0 !important   ;

}

.row{

    margin: 0px; 

}

ul, ol {

    list-style: none;

}

a {

    color: #333333;

    text-decoration: none !important;

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

    -ms-transition: all 0.5s;

    -o-transition: all 0.5s;

    transition: all 0.5s;

    letter-spacing: 1px;

    line-height: 150%;

}

p{

    letter-spacing: 2px;

    font-size: 16px;

    margin: 0;

    color: #333;

    line-height: 200%;

}

img{

    max-width: 100%;

    height: auto;

}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {

    line-height: 150%;

    margin: 0px;

    

}

.container{

    width: 1140px;

    padding: 0px;

    max-width: 100%;

}

iframe{
    max-width: 100%;
}

section{

    padding: 100px 15px;

}

#loading  

{  

    position:fixed;  

    width: 100%;

    height: 100%;  

    z-index:9999;

    background:#fff;

    top: 0;

}

#loading  .loading-img{

    position: absolute;

    width: 300px;

    margin: auto;

    top: 45%;

    right: 0;

    left: 0;

}

/*滾動條禁用*/  

.scoll_dis  

{  

    overflow:scroll;  

    overflow-y:hidden;  

}  



#gotop {



    display:none;

    position: fixed;

    border:1px solid #000;

    background:#000 ;

    right: 19px;

    bottom: 44px;    

    padding: 10px 10px 15px 10px;    

    font-size: 16px;

    color: #fff;

    cursor: pointer;

    z-index: 999;

    font-weight: 600;

    transition: 0.5s;

    opacity: 1;

    text-align: center;

}

#gotop:hover{

    color: #000;

    border:1px solid #000;

    background: #Fff;

    transition: 0.5s;

    opacity: .8;

}

.no-padding{

    padding: 0px !important;

}

.contact-fixed{

    position: fixed;

    bottom: 90px;

    right: 10px;

    text-align: center;

    z-index: 99;

    display: none;

}

.contact-fixed a{

    color: #FFF;

    font-size: 14px;

    font-weight: 600;

    background: #000;

    padding: 5px 10px;

    font-weight: 300;

    letter-spacing: 2px;

    border-radius: 25px;

    transition: .3s;

    border: 1px solid #000;

}

.contact-fixed i{

    width: 25px;

    margin-right: 5px;

}

.contact-fixed.contact-line{

    bottom: 40px;

}

.contact-fixed.contact-line a{

    background: #22ba4f;

    border: 1px solid #22ba4f;

    

}

.contact-fixed.contact-line img{

    width: 25px;

    margin-right: 5px;

}

/* logo */

nav .fixed-top{

    z-index: 10;

}

nav .navbar-brand{

    font-size: 26px;

    font-weight: 900;


}

nav .navbar-brand img{

    width: 380px;

    transition: .5s;

}

nav .navbar-brand{



}

nav .scrollNav-logo img{

    width: 380px;

    transition: .5s;

}

/*mobile menu*/

.navbar-light .navbar-nav .nav-link{

    color: #fff;

}

/* menu */

nav{

    /* position: fixed; */

    transition: .5s;

}

.navbar{

    padding: 0.1vw 4vw;

    transition: 1s;

    

    
}

nav .navbar-collapse{

    text-align:right;

}

.navbar-nav{

    display: none;

}

.navbar-light .navbar-toggler{

    border-color: rgba(0,0,0,0);

}

.navbar-light .navbar-toggler-icon{



    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");

}

.navbar-light .navbar-toggler:focus{

    outline: none;

}

nav .nav-link{

    color: #fff;

    padding: 8px 20px;

    text-align: center;

}

nav .nav-link:hover .cn{

    color: #D3EBCD;

    transition: .3s;

}

nav .nav-link.active .cn{

    color: #D3EBCD;

}

nav .nav-item.contact-btn{

    margin-top: 0;

}

nav .nav-item.contact-btn a{

    padding: 0;

    margin: 0 20px;

    background: none;

    border: 0;

    box-shadow: 0 6px 15px rgb(36 37 38 / 15%);

}

nav .nav-item.contact-btn a span{

    background: #22ba4f;

    padding: 5px 20px;

    letter-spacing: 2px;

    border-radius: 25px;

    transition: .3s;

    border: 1px solid #22ba4f;

    display: flex;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

}

nav .nav-item.contact-btn a:hover{

    color: #fff;

}

nav .nav-item.contact-btn a span img{

    margin-right: 5px;

    width: 30px;

}

nav .nav-link span{

    display:block;

}

nav .nav-link .en{

    font-weight: 600;

    font-size: 14px;

    font-family: arial;

}

nav .nav-link .cn{

    font-size: 17px;

    font-weight: 500;

    color: #FFF;

    display: inline-block;

    transition: .3s;

    text-shadow: 1px 1px 2px #555

}

nav .language .dropdown-menu{

    text-align: center;

    border: 0;

    left: -40%;

}

.nav .dropdown-menu{

    border: 0;

}

.nav > li:hover .dropdown-menu{

    display: block;

}

nav .nav > li:hover .dropdown-menu{

    border: 0px solid rgba(0,0,0,.15);

}

nav .dropdown-item:focus, .dropdown-item:hover{

    color: #42855B;

}

nav .navbar-nav .dropdown-menu.show{

    top: 80% !important;

    border: 0px solid rgba(0,0,0,.15);

    text-align: center;

}

nav .navbar-nav .dropdown-menu.show .dropdown-item{

    color: #000;

}

nav .navbar-nav .dropdown-toggle:focus{

    outline: 0px;

}

.scrollNav{

    background: #42855B;

    transition: 1s;

    padding: .1vw 4vw;

    box-shadow: 0 6px 15px rgb(36 37 38 / 15%);

}



/* nav .form-control{

    padding: .1rem .75rem;

    font-size: 14px;

}

nav .btn{

    padding: .1rem .75rem;

    font-size: 14px;

} */

/*輪播圖*/



/* .zs-enabled .zs-slideshow .zs-slides .zs-slide{

transform: scale(1.1);

transition: transform 10000ms ease-out, opacity 1600ms !important;}

.zoom-slider{

    height: calc(100vh);

    position: relative;

}

.zoom-slider .slide-text{

    position: absolute;

    text-align: left;

    top: 50vh;

    left: 10vw;

    background: rgba(0, 0, 0, .3);

    padding: 15px 15px 0;

}

.zoom-slider .slide-text h1{

    font-size: 2.5rem;

    line-height: 56px;    

    font-weight: 700;

    color: #f0f0f0;

    letter-spacing: 4px;

    margin-bottom: 3vh;  

    font-family: 'Noto Serif TC', serif;

}

.zoom-slider .slide-text h3{

    font-size: 22px;

    font-weight: 700;

    color: #f0f0f0;

    letter-spacing: 4px;

    margin-bottom: 10px; 

    font-family: 'Noto Serif TC', serif;     

} */

.scroll{

    position: absolute;

    left: 50%;

    bottom: 10%;

    -webkit-transform: translateX(-50%);

    -ms-transform: translateX(-50%);

    transform: translateX(-50%);

    text-align: center;

    z-index: 20;

    font-family: 'Noto Sans TC', serif; 

}

.scroll a{

    text-decoration: none;

}

#scroll{

    cursor:pointer;

}

.scroll .p-scroll {

    font-size: 18px;

    font-weight: 600;

    letter-spacing: 1.8px;

    color: #333333;

    cursor:pointer;



}

.scroll .p-scroll.scrolldown {

    font-size: 20px;

    line-height: 1;

    -webkit-animation: scroll 2s infinite;

    animation: scroll 2s infinite;

}

.el_scrollLine {

      position: absolute;

      z-index: 20;

      bottom: 1%;

      left: 50%;

      -webkit-transform-origin: top left;

      transform-origin: top left;

      -webkit-transform: rotate(-90deg) translateY(-50%);

      transform: rotate(-90deg) translateY(-50%); }

     

.el_scrollLine {

  display: inline-block; }

  .el_scrollLine_txt {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

    color: #fff;

    font-size: 1rem;

    font-weight: 600;

    font-family: 'Roboto', sans-serif;

    cursor: pointer; }

    .el_scrollLine_txt::after {

      content: "";

      display: inline-block;

      width: 5rem;

      height: .075rem;

      margin-left: 1.7rem;

      background-color: #fff;

      -webkit-transform: scaleX(0);

      transform: scaleX(0);

      -webkit-animation-name: "lineScaleAnimation";

      animation-name: "lineScaleAnimation";

      -webkit-animation-duration: 1.5s;

      animation-duration: 1.5s;

      -webkit-animation-timing-function: ease;

      animation-timing-function: ease;

      -webkit-animation-delay: 0s;

      animation-delay: 0s;

      -webkit-animation-iteration-count: infinite;

      animation-iteration-count: infinite;

      -webkit-animation-direction: normal;

      animation-direction: normal;

      -webkit-animation-fill-mode: forwards;

      animation-fill-mode: forwards; }

    .el_scrollLine_txt:hover{

        color: #fff;

    }

@-webkit-keyframes lineScaleAnimation {

  0% {

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0); }

  49% {

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(1);

    transform: scaleX(1); }

  50% {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1); }

  100% {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(0);

    transform: scaleX(0); } }



@keyframes lineScaleAnimation {

  0% {

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(0);

    transform: scaleX(0); }

  49% {

    -webkit-transform-origin: right;

    transform-origin: right;

    -webkit-transform: scaleX(1);

    transform: scaleX(1); }

  50% {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(1);

    transform: scaleX(1); }

  100% {

    -webkit-transform-origin: left;

    transform-origin: left;

    -webkit-transform: scaleX(0);

    transform: scaleX(0); } }



@-webkit-keyframes scroll {

  0% {

    -webkit-transform: translateY(0);

    transform: translateY(0);

    opacity: 0; }

  50% {

    -webkit-transform: translateY(5px);

    transform: translateY(5px);

    opacity: 1; }

  100% {

    -webkit-transform: translateY(5px);

    transform: translateY(5px);

    opacity: 0; } }



@keyframes scroll {

  0% {

    -webkit-transform: translateY(0);

    transform: translateY(0);

    opacity: 0; }

  50% {

    -webkit-transform: translateY(5px);

    transform: translateY(5px);

    opacity: 1; }

  100% {

    -webkit-transform: translateY(5px);

    transform: translateY(5px);

    opacity: 0; } }

/* 漢堡選單 */

.navbar-toggler {

  border: none;
  padding: 0.5rem 0.75rem;
  background: #42855B/* transparent !important */;

}



.navbar-toggler:focus {

  outline: none;

  background: #42855B;

}



.navbar-toggler .icon-bar {

  background-color: #fff;

  transform: rotate(0deg) translate(0px, 0px);

  transition: ease all .2s;

}



.navbar-toggler .icon-bar {

  display: block;

  width: 22px;

  height: 2px;

  border-radius: 1px;

}



.navbar-toggler .icon-bar+.icon-bar {

  margin-top: 4px;

}



.icon-bar:nth-child(2) {

  width: 16px;

  transition: ease all .2s;

}



.navbar-toggler:hover>.icon-bar:nth-child(2) {

  width: 22px;

  transition: ease all .2s;

}



.navbar-toggler:active>.icon-bar:nth-child(2) {

  width: 22px;

  transition: ease all .2s;

}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(1) {

  transform: rotate(45deg) translate(5px, 4px);

  transition: ease all .2s;

}



.navbar-toggler:not(.collapsed) .icon-bar:nth-child(2) {

  opacity: 0;

  transition: ease all .2s;

}



.navbar-toggler:not(.collapsed) .icon-bar:nth-child(3) {

  transform: rotate(-45deg) translate(4px, -4px);

  transition: ease all .2s;

}



.sec-accent {

  background-color: #fafcf5;

}



.blue {

  background-color: #9999cc;

}





/* 編輯器 */

.inside-editor{

    padding: 15px 4vw;

}

.inside-editor img{

    max-width: 100%; 

}

.inside-editor videos{

    max-width: 100%;

}

.inside-editor table{

    max-width: 100%;

}

/*首頁標題*/

.index-title{   

    letter-spacing: 2px;

    text-align: center;

    margin-bottom: 40px;

}

.index-title h1{

    font-weight: 700;

    color: #42855B;

    font-size: 55px;

    letter-spacing: 1px;

    font-family: 'Noto Sans TC', serif;


    text-align: center;

}

.index-title h5{

    font-size: 18px;

    color: #42855B;

    font-family: 'Noto Sans TC', serif;

    text-align: center;

}

.index-title hr{
    max-width: 80%;
    margin-right: auto;
    margin-left: auto;


}



/*index-about*/



.index-about{

   background: url('../images/about/about-back.jpg');

    background-position: bottom;

    background-size: cover;

    background-repeat: no-repeat;

    background-attachment: fixed;


}



.index-about .index-title{

    text-align: center;

}



.index-about .content{



}

.index-about .content .text{


    height: 100%;

/*     display: flex; */

    flex-direction: column;

    justify-content: center;

    align-items: start; 


}

.index-about .content .text h5{

    font-size: 22px;

    color: #2C3333;

    text-align: center;

}

.index-about .content .text h1{

    color:#2C3333;

    letter-spacing: 4px;

    font-size: 18px;

    font-weight: 900;

    font-family: 'Noto Serif TC', serif;

}

.index-about .content .text p{

    margin-top: 10px;

    color: #2C3333;

    font-size: 16px;

    text-align: center;

}



/* index-news */

.index-news{

     

    background-size: cover;

    background-repeat: no-repeat;

    position: relative;




}

.index-news .deco{

    position: absolute;

    left: -10%;

    top: 0; 

    bottom: 0; 

    margin: auto;  

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;   



}

.index-news .deco img{

    width: 90%;

    opacity: .8;

}

.index-news .item{

    position: relative;

    overflow: hidden;

    box-shadow: 0 6px 15px rgb(36 37 38 / 15%);

    margin-bottom: 15px;

    transition:.5s;

}

.index-news .content-wrap{

    position: absolute; 

    bottom: 0; 

    top: 0;

    left: 0;    

    right: 0;    

    margin: auto;

    width: 100%;


}

.index-news .item .title{

    /* margin-top: 5px; */

    padding: 30% 10%;

    text-align: center;

    font-size: 18px;

    color: #fff;

    font-weight:500;

    letter-spacing: 2px;

    transition: .5s;

    background: rgb(0 0 0 /40%);

    box-shadow: 0 6px 15px rgb(36 37 38 / 20%);

    width: 100%;

    height: 100%;

    /* bottom: 40%; */








    /* overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box; */

}

.index-news .item:hover{

    /* border: 4px solid #2e93e2; */

    transition:.5s;

}




.index-news .item .img-wrap{

    position: relative;

    height: 0px;

    padding-bottom: 70%;

    overflow: hidden;

    width: 100%;

}

.index-news .item .img-wrap img{

    position: absolute;

    top: 0;

    bottom: 0;

    right: 0;

    left: 0;

    margin: auto;

    transition:1s;

}

.index-news .item:hover .img-wrap img{

    transform: scale(1.2);

    transition:1s;

}

.index-news .text h1{

    font-size: 20px;

    color: #000;

}

.index-news .owl-theme .owl-nav {

    margin-top: 40px;

}

.index-news .owl-theme .owl-nav [class*=owl-]{

    /* border: 1px solid #000; */

    background: #a1a1a1;

    width: 40px;

    height: 40px;

    border-radius: 50%;

    color: #fff;

    transition:.5s;

    font-size: 18px;

}

.index-news .owl-theme .owl-nav [class*=owl-]:hover{

    color: #fff;

    background: #000;

}

/*index-products*/

.index-products{

    padding:0vw 12vw;

}

/* 項目顯示 */



.index-products #product-alone .item{

    margin-bottom: 4vw;

    background: #f7f7f7;

    border-radius: 25px;

    padding: 2vw;

    transition: .5s;

        box-shadow: 0 6px 15px rgb(36 37 38 / 8%);

}

.index-products #product-alone .item:hover{

    box-shadow: 0 9px 2.5rem rgb(0 0 0 / 8%);

    transition: .5s;

}

.index-products #product-alone .item .text h1{

    color: #333;

    font-size: 18px;

    font-weight: 600;

    letter-spacing: 4px;

    padding: 2vw 0 0 0;

    margin: 0;

    text-align: center;

    overflow : hidden;

    text-overflow : ellipsis;

    white-space : nowrap;

}

/* 項目顯示 */

.index-works{

    background: none;

}



.index-works .more{

    margin-bottom: 20px;

}



/* 輪播效果 */

.slider-wrap{

    width: 100%;

    /* max-width: 1440px; */

    top: 0;

    bottom: 0;

    margin: auto;

}

.slider-wrap .img-wrap{

    position: relative;

    display: flex;

    justify-content: center;

    align-items: center; 




}



.slider-wrap .carousel-item h5{

    font-size: 46px;    

    font-weight:900;

    color: #fff;   

    font-family: 'Noto Serif TC', serif;

    letter-spacing: 4px;

    text-shadow: 1px 1px 5px #555;



}

.slider-wrap .carousel-item span{

    border-bottom: 2px solid #fff;

}

.slider-wrap .carousel-item p{

    color: #fff;

    font-size: 24px;    

    font-weight: 600;

    font-family: 'Noto Serif TC', serif;

    letter-spacing: 4px;

    text-shadow: 1px 1px 5px #555;



}

.slider-wrap  .carousel-caption{

    width: 100%; 

    top: 40%;   

    left: 15%;  

    text-align: left;

}

.owl-theme .owl-nav [class*=owl-]:hover{

    background: #fff;

    color: #f00;

}

.owl-carousel{

    

}

.index-products .owl-carousel button span{

    /* font-size: 34px; */

    color: #333;

    font-weight: 900;

    padding: 16px;

    font-size: 24px;

    line-height: 18px;

    

}

.index-products .owl-carousel button{

    width:42px;

    height:42px;

    border-radius: 999em !important;

    background: #f1f1f1 !important;

     display: flex;

  justify-content: center;

  align-items: center; 

}

.index-products .owl-carousel button:focus{

    border: 0px;

    outline: 0px;

}

.index-products .owl-theme .owl-nav{

    margin-top: 10vh;

}

.index-products .owl-carousel .item{

    border-right: 1px solid #ccc;

}

.index-products .owl-carousel .item h1{

    font-size: 16px;

    margin: 0px;

    padding: 15px;

    text-align: center; 

}

.index-products .owl-carousel a{

    text-decoration: none;

}

/* index-contact */

.index-contact{

    padding-bottom: 0;

}

.index-contact .img-box{

    text-align:center;

    height: 100%;

    display: flex;

    justify-content: center;

    align-items: end; 



}

.index-contact .text ul{

    list-style-type: disc;

}

.index-contact .text ul li{

    padding: 5px 0;

}

.index-contact .content{

    padding: 40px 0;

}

/*index-equipment*/

.index-equipment{

    background: url('../images/bg01.jpg');

    background-size: cover;

    background-repeat: no-repeat;

    background-attachment: fixed;

}

.index-equipment .card-back{

    background: rgba(255, 255, 255, 1);

    border-radius: 5px 5px ;

}

.index-equipment .card-body{

    padding:1rem 1rem .5rem 1rem;

}

.index-equipment .card-title{

    font-weight: 900;



}

.index-equipment .card-title a{

    color: #005BAC;

}

.index-equipment a{

    text-decoration: none;

    /* background-color:rgba(255,255,255,1); */

}

.index-equipment a:hover{

    color: #005BAC;

}

/*comapny*/

.index-company {

    width: 100%;

    position: fixed;

    top:0px;

    height: 4px;

    z-index: 999;

    background-color: #f00;

}

.index-company .left ul{

    text-align: left;

    width: 100%;

    margin-top: 3px;

    padding-left: 10px;



}

.index-company .left ul li{

    display: inline-block;

    margin:0 5px;

    list-style: disc inside;

}

.index-company .left ul li a{

    color: #efefef;

    font-size: 14px;

    text-decoration: none;

}

.index-company .left ul li a:hover{

    color: #f90;

}

.index-company .left ul .active{

    color: #f90;

}

.index-company .right ul{

    text-align: right;

    width: 100%;

    margin-top: 3px;



}

.index-company .right ul li{

    display: inline-block;

    color: #efefef;

    font-size: 14px;

    margin:0 5px;

    list-style: disc inside;

}

.index-company .right ul .active{

    color: #f90;

}

/* .contact-btn */

.contact-btn{

    margin-top: 40px;

}

.contact-btn a{

    text-decoration: none;

    color: #FFF;

    font-size: 16px;

    font-weight:400;

    letter-spacing: 4px;   

    background-image: linear-gradient(to right, #ceaf4e 0%, #FF8D29 100%);

    padding: 10px 40px;

    border-radius: 15px;

    transition: .5s;

    box-shadow: 0 6px 15px rgb(36 37 38 / 15%);

}

.contact-btn a:hover{

    color: #42855B;

    transition: .5s;

}

/*more*/

 .more{

    width: 100%;

    margin-top: 40px;

    text-align: center;

    

}

.more a{

    display: inline-block;

    text-decoration: none;

    font-weight: 400;

    transition: .5s;

    font-size:  16px;

    font-family: 'Roboto', sans-serif;

    color: #fff;  

    background: linear-gradient(to right, #ceaf4e  0%, #FF8D29 100%);

    letter-spacing: 2px;

    padding: 10px 40px;

    border-radius: 15px;

}

.more a i{

    padding-left: 10px;

    font-size: 14px;

    transition: .5s;

}

.more a:hover{ 

    transition: .5s;   

}

.more a:hover i{

    padding-left: 20px;

    transition: .5s;   

}

/*back*/

.back{

    margin-top: 40px;

    text-align: center;

}

.back a{

    font-weight: 600;

    font-size: 16px;

    color: #004c34;

}

/*footer*/

.footer{

    right: 0;

    background: #CFD2CF;

    color: #2C3333;

    font-size: 14px;

}

.footer .container{
    width: 1440px;
}
.footer a{

    letter-spacing: 2px;

    color: #2C3333;

    text-decoration: none;

}

.footer p{

    font-size: 14px;

    color: #2C3333;

    line-height: 20px;

}

.footer h5{

    padding:15px 0;

    font-weight: 600;

    letter-spacing:2px;  

}

.footer i{

    width: 16px;

    margin-right: 5px;

}

.footer .information{

}

.footer .information p{

    line-height: 200%;

}

.footer .sitemap{

    padding-left: 40px;

}

.footer .sitemap ul{

    display: inline-block;

}

.footer .sitemap ul li{

    padding: 0 10px;

    margin-bottom: 1.2rem;

    text-align: left;

    display: inline-block;

    /* display: inline-block; */

    /* border-left: 1px solid #999; */

}

.footer .sitemap ul li a{

    text-decoration: none;

    color: #2C3333;

}

.footer .sitemap ul li a:hover{

    color: #42855B;

}

.footer .fllow-us .logo{

    margin-bottom: 15px;

}

.footer .fllow-us .logo img{

    width: 380px

}

.footer .fllow-us {

    margin-top: 15px;

}

.footer .fllow-us ul li{

    display: inline-block;

    margin: 0 5px;

}

.footer .fllow-us img{

    /* padding-top: 50px; */

    width: 50px;

}

.footer .fllow-us h1{

    font-size: 14px;

    margin-top: 20px;

}

/*copyright*/

.copyright{    

    background: #D8D8D8;

}

.copyright p{

    width: 100%;

    margin: 0px;

    color: #2C3333;

    font-size: 12px;

    text-align: center;

}

.copyright a{

    color: #2C3333;

    font-size: 12px;

    text-decoration: none;

}





/*inside-banner*/

.inside-banner{

    position: relative;

}

.inside-banner::before{

    content: "";

    top: 0;

    width: 100%;

    height: 100%;

    opacity: .5;

    border-radius: 25px;

    position: absolute;

    z-index: 1;

    /* background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%); */



}

.inside-banner .inside-banner-img{

    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;

}

.inside-banner .inside-banner-img img{

    min-width: 1920px;

}

.inside-banner .inside-banner-text{

    position: absolute;

    left: 0;

    right: 0;

    margin: auto;

    top: 45%;

    text-align: center;

}

.inside-banner-text{

    text-align: center;

    margin-bottom: 40px;

    z-index: 2;

}

.inside-banner-text h1{

    font-weight: 700;

    color: #fff;

    font-size: 40px;

    letter-spacing: 2px;

    font-family: 'Noto Sans TC', serif;



}

.inside-banner-text h5{

    color: #fff;

    letter-spacing: 2px;

    font-size: 24px;

}

/*麵包屑*/

.bre ul{

    margin-bottom: 0px;

    padding: 1rem  ;

    text-align: right;

    /* border-bottom: 1px solid #ebebeb; */

    color: #555;

}

.bre ul li{

    display: inline-block;

    font-size: 12px;

}

.bre ul li a{

    text-decoration: none;

    color:  #000;

}

.bre ul li i{

    margin-right:5px;

}





/*inside-about*/



.inside-about{

    position: relative;

}

.inside-about .about-content{

    margin: auto;

    max-width: 1040px;



}

.inside-about .about-content h5{

    padding: 20px 0;

    color: #42855B;

    letter-spacing: 3px;

}

.inside-about .about-content p{

    margin-bottom: 5px;

    line-height: 200%;

}

.inside-about .about-content ul{

    list-style-type: decimal;

    padding-left: 40px;

}

.inside-about .about-content ul li{

    padding: 5px;

    color: #000;

}

.inside-about .about-content .item{

    margin-bottom: 15px;

}

.inside-about .about-content .text{

    margin: auto;


  justify-content: center;

  align-items: center; 

}

/* inside-news */

.inside-news .news-item{

    margin-bottom: 40px;

}

.inside-news .item .date{

    font-size: 14px;

    color: #FFF;

    padding: 0;

    font-weight: 300;

    transition: .3s;

}

.inside-news .item .date i{

    padding-right: 5px;

}

.inside-news .item .title{

    font-size:20px;

    color: #FFF;

    padding: 0;

    font-weight: 500;

    letter-spacing: 2px;

    border-bottom: 2px solid #FFF;

    transition: .3s;

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

}

.inside-news .item:hover .title{

    font-size: 16px;

    transition: .3s;

    

}

.inside-news .item:hover .date{

    font-size: 12px;

    transition: .3s;

}

.inside-news .item{

    position: relative;

    border-radius: 25px;

    overflow: hidden;

}

.inside-news .item .img-wrap::before{

    content: "";

    bottom: 0;

    width: 100%;

    height: 100%;

    opacity: .8;

    border-radius: 25px;

    position: absolute;

    z-index: 1;

    background-image: linear-gradient(120deg, #f093fb 0%, #000 100%);

    transition: 1s;

}

.inside-news .item:hover .img-wrap::before{

    height: 80px;

    transition: 1s;

}

.inside-news .item:hover .content-wrap{

    padding: 10px 15px;

    transition: .5s;

}

.inside-news .item .content-wrap{

    position: absolute;

    bottom: 0;

    z-index: 2;

    padding: 15px 25px;

    transition: .5s;

}

.inside-news .item .content-wrap h1{

    



}



.inside-news-detail .date{

    color: #000;

}

.inside-news-detail .date i{

    padding-right: 5px;

}

.inside-news-detail .title{

    font-size: 24px;

    padding-bottom: 15px;

    border-bottom: 1px solid #ededed;

    margin-bottom: 30px;

}

/*inside-equipment*/



.inside-quality .content-title h5{

    color: #222;

    font-size: 18px;

    margin-bottom: 2vh;  

    color: #000;

}

.inside-quality .quality-item{

    padding: 15px;

}

.inside-quality .quality-item img{

    

}

.inside-quality .quality-item h5{

    padding: 5px;

    margin-bottom: 0px;

    font-size: 18px;

}

.inside-quality .quality-item p{

    padding: 5px;

}

/*.inside-process*/

.inside-process{

    /* background: url('../images/process-back.jpg'); */

    background-repeat: no-repeat;

    background-attachment: fixed;

    background-position: bottom;

}

.inside-process .process-img{

    width: 100%;

    text-align: center;

}

.inside-process .process-img img{



}

/*inside-products*/

.inside-products {


    



}

.inside-products .inside-about {

    margin:0px ; 

    padding: 0 ; 

}

.inside-products .products-menu{

    padding: 15px;

}

.inside-products .products-menu .menu-title{

    position: relative;

    margin-bottom: 15px;

}

.inside-products .products-menu .menu-title .menu-deco{

    position: absolute;

    top: -100%;

    left: -40%;

    z-index: -1;

}

.inside-products .products-menu .menu-title .menu-deco img{

    width: 200px;



}

.inside-products .products-menu .menu-title h5{

    font-weight: 900;

    color: #42855B;

    font-size: 38px;

    letter-spacing: 2px;

    font-family: 'Roboto', serif;

    font-style: italic;

    text-shadow: 1px 1px 10px #fafafa;

}

.inside-products .products-menu ul{

    border-left: 2px solid #000;

    margin-bottom: 15px;

    

}

.inside-products .products-menu ul li a{

    display: block;

    padding: 10px 15px;

    border-bottom: 1px solid #fff;

    color: #000;

    font-size: 16px;

    letter-spacing: 2px;

    text-align: left;

    border-top-right-radius:25px ;

    border-bottom-right-radius:25px;

}

.inside-products .products-menu ul li a:hover{

    color: #fff;

    background: #000;

}

.inside-products .products-menu ul .active a{

    color: #fff;

    background: #000;

}

.inside-products .products-item{

    position: relative;

    margin-bottom: 40px;

   

}

.inside-products .products-item a img{

    transition: all .5s ease-out;

}

.inside-products .products-item a:hover img{

    transform: scale(1.1,1.1);

    transition: all .5s ease-out;

}

.inside-products .products-item .image{

    position: relative;

    height: 0px;

    padding-bottom: 70%;

    overflow: hidden;

    width: 100%;

}

.inside-products .products-item .image img{

    position: absolute;

    top: 0;

    bottom: 0;

    right: 0;

    left: 0;

    margin: auto;

    max-height: 100%;

}

.inside-products .products-item .item{

    background: #f7f7f7;

    border-radius: 25px;

    padding: 15px;

    transition: .5s;

    box-shadow: 0 6px 15px rgb(36 37 38 / 8%);

}

.inside-products .products-item .item:hover{

    box-shadow: 0 9px 2.5rem rgb(0 0 0 / 8%);

    transition: .5s;

}

.inside-products .products-item .item .text h1{

    color: #000;

    font-size: 18px;

    letter-spacing: 2px;

    padding: 0;

    margin: 0;

    text-align: center;

    /* overflow : hidden;

    text-overflow : ellipsis;

    white-space : nowrap; */

}

.inside-products .mobile-menu{

    text-align: center;

    display: none;

    margin-bottom: 2vw;

    background: #fff;

}

.inside-products .mobile-menu .menu a{

    width: 100%;

     font-size:16px;

    color: #fff;

    border-radius: 25px;

    border: 1px solid #42855B;

    background: #42855B;

}

.inside-products .mobile-menu .menu-item{

    padding-left: 0px;

}

.inside-products .mobile-menu .menu-item li a{

    display: block;

    padding: 15px;

    border-bottom: 1px solid #ccc;

}

.inside-products .mobile-menu .menu-item .active a{

    color: #000;

    border-bottom: 1px solid #000;

}

.inside-products .mobile-menu .btn-primary{

}

.inside-products .mobile-menu .btn-primary:hover{

}

.inside-products .mobile-menu .btn-primary:focus{

    box-shadow: none;

}



.inside-products .detail-img{

    text-align: center;

}

.inside-products .detail-img img{

    width: 100%;

    max-width: 500px;

}

.inside-products .detail-title h1{

    color: #000;

    font-weight: 600;

    padding: 15px 0;

    font-size: 26px;

}

.inside-products .detail-content{

    padding: 2vw 0;

}

.inside-products .detail-content .content-title h3{

    color: #000;

    padding: 2vw 4vw;

    font-size: 36px;

    font-weight: 600;

    text-align: left;

}

.inside-products .detail-content .content-title .mobile-note{

    display: none;

}

.inside-products .detail-content .list{

    padding: 2vw 4vw;

}

.inside-products .detail-content .list table{

    text-align: center;

    width: 100%;

    display: block;

    overflow-x: auto;

    white-space: nowrap;

}

.inside-products .detail-content .list table tbody{

    border-radius: 25px;

    background: #fff;

}

.inside-products .detail-content .list table th{

    padding: 5px 0;

    color: #fff;

    background: #004c34;

    font-weight: 500;

}



.inside-products .detail-content .list table td{

    padding: 40px 2vw;

    border-bottom: 1px solid #f1f1f1;



}

.inside-products .detail-content .list table tr{

    padding: 15px;

}

.inside-products .detail-content .list table .model{

    color: #004c34;

}

.inside-products .detail-content .list table .model a{

    color: #000;

    padding: 0 5px;

}

.inside-products .detail-content .list table .gb{

    color: #004c34;

}

.inside-products .detail-content .list table .stag{

    color: #000;

    font-size: 20px;

    font-weight: 600;

}

.inside-products .detail-content .list table .mobile{

    display: none;

}

.inside-products .detail-content .list table .ap-btn a{

    color: #fff;

    background: #000;

    padding: 8px 25px;

    border-radius: 25px;

    border: 1px solid #000;

    transition:.3s;

}

.inside-products .detail-content .list table .ap-btn a:hover{

    color: #000;

    background: #fff;

    border: 1px solid #000;

    transition:.3s;

}

.inside-products .detail-content .fast{

    text-align: center;

}

.inside-products .detail-content .fast p{

    color: #004c34;

}

.inside-products .handle-list {

    padding: 0 4vw;

}

.inside-products .handle-title h1{

    color: #004c34;

}

.inside-products .handle-list form{

    /* max-width: 800px; */

    background: #f7f7f7;

    border-radius: 25px;

    padding: 25px;

    box-shadow: 0 6px 15px rgb(36 37 38 / 8%);

}

.inside-products .handle-list .handle-btn{

    margin-top: 25px;

    color: #fff;

    background: #000;

    padding: 8px 25px;

    border-radius: 25px;

    border: 1px solid #000;

    transition: .3s;

    cursor: pointer;

}

.inside-products .handle-list .handle-btn:focus{

    outline: 0;

}

.inside-products .handle-list .form-check-label a{

    color: #000;

}

.inside-products .handle-list label{

    font-weight: 600;   

    color: #004c34;

}
.inside-products .container h3{
    font-size: 22px;
    color: #42855B;
    margin-bottom: 15px;
    letter-spacing: 5px;

}

.inside-products .container h5{
    font-size: 17px;
    color: #42855B;
    

}

.inside-products .container p{
    margin-bottom: 20px;
    line-height: 200%;
    letter-spacing: 4px;
    


}

.inside-products .container .table-wrapper table{
    margin-bottom: 20px;
}

.inside-products .container .table-wrapper table thead{
    background-color: #42855B;
    border: solid 1px #000;    


}

.inside-products .container .table-wrapper table thead th{
    border: solid 1px #000; 
    text-align: center;



}
.inside-products .container .table-wrapper table thead th p{
    color: #FFF;
    font-weight: 300;

}



.inside-products .container .table-wrapper table tbody td {
    border: solid 1px #000;



}

.inside-products .container .table-wrapper table tbody td p{
    padding-left: 5px;
    margin-bottom: 0;
    line-height: 180%;

}

.inside-products .container .video h5{
    margin-bottom: 10px;
    
}




/* inside-download */

.inside-download .download-item{

    padding: 2vw;

}

.inside-download .download-item .text-wrap{

    position: relative;

}

.inside-download .download-item .text-wrap h5{

    font-weight: 600;

}

.inside-download .download-item .text-wrap a{

    position: absolute;

    bottom: 0;

    background: #f7f7f7;

    border: 1px solid #fff;

    text-align: center;

    width: 100%;

    padding: 10px;

    border-radius: 25px;

    margin-bottom: 15px;

    font-weight: 900;

    font-size: 16px;

    color: #555;

}

.inside-download .download-item .text-wrap a:hover{

    border: 1px solid #000;

    color: #000;



}

/* disclaimer */

.disclaimer .inside-editor p{

    font-size: 16px;    

}

.disclaimer .inside-editor ul{

    list-style-type: decimal;

    padding-left: 2vw;

}

.disclaimer .inside-editor ul li{

    padding: 5px 0;

    font-weight: 300;   

} 

/*inside-contact*/

.inside-contact .information .wrap{

    background: #f7f7f7;

    border-radius: 25px;

    padding: 25px;

    transition: .5s;

    box-shadow: 0 6px 15px rgb(36 37 38 / 8%);

}

.inside-contact .contact-title h1{

    color: #004c34;

    padding:0 0 2vw 0vw;

    font-size: 26px;

    font-weight: 600;

    text-align: center;

    letter-spacing: 2px;

}

.inside-contact .information h5{

    font-size:24px;

    color: #000;

    font-weight: 500;

}

.inside-contact .information ul li{

    padding: 5px 0;

    letter-spacing: 1px;

    font-size: 16px;

}

.inside-contact .information ul li a{

    text-decoration: none;

    font-size: 16px;

    letter-spacing: 1px;

}

.inside-contact .information ul li i{

    width: 30px;

    text-align: center;

    color: #000;

    font-size: 12px;

}

.inside-contact .information ul .mob span{

    padding-left: 30px;

}

.inside-contact form input{

    width: 100%;

    padding: 12px;

    border: 0px;

    background: #f5f5f5;

    border-radius: 2px 2px;

    font-family: "arial";

    letter-spacing: 4px;

    color: #000;

    font-size: 12px;

}

.inside-contact form textarea{

    width: 100%;

    padding: 8px;

    border: 0px;

    background: #f5f5f5;

    border-radius: 2px 2px;

    letter-spacing: 4px;

}

.inside-contact button{

    padding: 10px 50px;

    border-radius: 2px 2px;

    border: 1px solid #000;

    background: #000;

    color: #Fff;

    cursor: pointer;

    transition: .5s;



}

.inside-contact button:hover{

    opacity: .8;

    transition: .5s;

}

.inside-contact .form{

    font-size: 14px;

    padding: 10px;

}

.inside-contact .form p{

    font-size: 14px;

}

.inside-contact .form span{

    color: #F00;

}

/*inside-service*/

.inside-service .container{

    width: 1160px;



}



@media (max-width:1200px) {

.navbar{

    padding: 1vw 2vw;


}

/*輪播圖文字*/

.carousel-caption h1{

    font-size: 30px;

    font-weight: 900;

}

.slider-wrap .carousel-item h5{

    font-size: 26px;

}

.slider-wrap .carousel-item p{

}

.zoom-slider .slide-text h1{

    font-size:  1.8rem

}

.zoom-slider .slide-text{

    left: 0;

}

.index-products .container-products{

    padding: 0vw 6vw;

}

.inside-products{

    padding: 5vh;

}

.inside-products .products-item{

        padding: 20px;

}

.inside-products .detail-content .content-title h3{

    padding: 2vw 0;

}

.inside-products .detail-content .list{

    padding: 2vw 0;

}

.inside-equipment{

    padding: 1vh; 

}

.footer .information{

    padding-left:0px;

}

.footer .sitemap{

    padding-left:0px;

}

}

@media (max-width: 991px) {

    section{

    padding:80px 15px;

    }

    .contact-fixed{

        display: block;

    }

    .navbar-nav{

        display: block;

        background: rgba(255, 255, 255, 1);

        box-shadow: 0px 10px 30px rgb(83 88 93 / 40%);

    }

    nav .nav-link .cn{

        color: #000;

        text-shadow: 0 0;

    }

    nav .navbar-nav .dropdown-menu{

        padding: 0;

        width: 90%;

        margin: 0px auto 15px;

        box-shadow: 0px 10px 30px rgb(83 88 93 / 15%);

        border-radius: 15px;

    }

    nav .dropdown-toggle::after{

        color: #000;

    }

    .navbar-nav .nav-item{

        border-bottom: 1px solid #efefef;

    }

    nav .nav{

        display: none;

    }

    nav .nav-link{

        padding: 15px;

    }

    nav .navbar-nav .dropdown-menu.show .dropdown-item{

        padding: 15px;

    }

    .carousel-item{

        width: 100%;

        overflow: hidden;



    }

    .slider-wrap .carousel-caption{

        

    }

    .el_scrollLine{

        display: none;

    }
    .inside-banner-text h1{

        font-size: 28px;

        font-weight: 900;



    }




    /*輪播圖文字*/

    .carousel-caption h1{

        font-size: 24px;

        font-weight: 900;

    }

    .carousel-caption h5{

        padding-top: 18px;

        /* padding-left: 60px; */

        font-size: 20px;

    }

    .carousel-caption p{

        font-family: 'arial';

        font-size: 14px;

        /* padding-left: 60px; */

        font-weight: 500;

    }

    .index-works::before{

        width: 100%;

    }

    .index-about::before{

        width: 100%;

    }

    .index-company .right{

        display: none;

    }

    .index-service{

        background-attachment: scroll;

    }

    .inside-products{

    padding: 3vh;

    }

    .inside-products .detail-content .list table td{

        padding: 20px 1vw;

    }

    .footer .information{

        padding-left:0px;

        margin-bottom: 40px;

    }

    .footer .sitemap{

        padding-left:0px;

        padding-right: 0px;

        text-align: center;

    }

    .index-news{

        background-attachment: scroll;

    }

}

@media (max-width: 768px){

    section{

    padding:60px 15px;

    }

    nav .navbar-brand img{

        width: 300px;

    }



    .slider-wrap{

        /* margin-top: 70px; */

    }

    .slider-wrap .carousel-item h5{

        font-size: 24px;
        text-shadow: 1px 1px 1px #333;

    }

    .slider-wrap .carousel-item p{

        font-size: 16px;
        text-shadow: 1px 1px 1px #333;

    }

    .slider-wrap .carousel-item .contact-btn{

        display: none;

    }

    .slider-wrap .carousel-caption{

       top: 40%;

       bottom: 0;

       left: 0;

       right: 0;

       margin: auto;

       text-align: center;

    }

    .slider-wrap .img-wrap::before{

        border-radius: 0;

    }

    .slider-wrap .carousel-item img{

        border-radius: 0;
        min-width: 800px;

    }

    .zoom-slider {

        position: relative;

    }

    .zoom-slider .slide-text{

        top: 50vh;

    }

    .zoom-slider .slide-text h1{

        font-size: 24px;

        line-height: 150%;     

    }

    .zoom-slider .slide-text h1 span{

        font-size:  50px;  

    }

    .zoom-slider .slide-text h3{

        font-size: 18px;     

    }

    .index-news .item .title{
/* 
        padding: 5px 15px; */

    }

    .index-about .index-title{

        margin-top: 20px;

        text-align: center;

    }

    .index-products{

        padding: 0 8vw;

    }

    .index-products #product-alone .item{

        padding: 20px;

    }



    .index-contact{



    }

    .index-contact .content h1{

        font-size: 24px;

    }

    .inside-editor{

        padding: 15px 0vw;

    }

    section .index-title h1{}

    .index-service ul li{

        writing-mode: horizontal-tb;

        display: block;

        vertical-align: top;

        padding: 5px 0;

    }

    .inside-about .about-bottom .content ul li{

        width: 100%;

    }

    .inside-about .about-box .content{

        padding: 8vw 0;

    }

    .inside-about .about-service{

        padding: 0vw;

    }

    .inside-products .mobile-menu{

        display: block;

    }

    .inside-products .products-menu{

        display: none;

    }

    .inside-products{

        padding:1vh;
        margin-bottom: 20px

    }

    .inside-products .detail-content .list{

        padding: 0;

    }

    .inside-products .detail-content .list table tbody{

        letter-spacing: 0px;

    }

    

    .inside-products .detail-content .list table .stag{

        font-size:  16px;

    }

    .inside-products .detail-content .list table .ap-btn a{

        padding: 5px 10px;

    }

    .inside-products .detail-content .content-title .mobile-note{

        display: block;

        color: #000;

    }

    .inside-products .products-item{

        padding: 10px;

    }

    .inside-products .detail-content .content-title h3{

        padding: 2vw 0vw;

    }

    .inside-download .download-item .text-wrap a{

        position: static;

        display: block;

        margin-bottom: 0px;

        margin-top: 15px;



        

    }

    .footer .fllow-us{

    text-align:center;

    }

    .footer .fllow-us img{

    padding-top: 0px;

    }

    .footer .information{

        margin-top: 40px;

        text-align: center;

    }

    section .index-title h1{

        font-size: 36px;

    }

    section .index-title h5{

        font-size: 18px 

    }

    .inside-people .people-item{

    height: auto;

    margin-bottom: 30px;

}

    nav .form-control{

        width: auto;

    }



}

@media (max-width: 480px){

    .zoom-slider .slide-text{

        top: 45vh;

    }

    .zoom-slider .slide-text h1{

        font-size: 18px;

    }

    .slider-wrap .carousel-item p{

        

    }

    .inside-products .handle-list{

        padding: 0;

    }

    .inside-products .detail-content .list table .ap-btn a{

        color: #fff;

        background: #000;

        padding: 5px;

        border-radius: 5px;

        border: 0px solid #000;

    }

    .inside-products .detail-content .list table td{

        font-size: 14px 

    }

    .inside-products .detail-content .list table .stag{

        font-size: 14px;

        padding: 2px;

    }



}