@charset "utf-8";
/* CSS Document */
/* body, html { height:100%; } */
body {
  font-family: 'Noto Sans TC','Lato', '微軟正黑體', sans-serif; /*自行增減使用 */
  font-size: 16px;
  line-height:1.5;
  color: #333;
}
a { color:#000; text-decoration: none!important; }
a:hover { color:#777; -o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
button:focus{outline:none!important;}
/*---------------------- 基礎設定 ----------------------*/
/*反白設定
::selection { background: #666; color: #FFF; }
::-moz-selection { background: #666; color: #FFF; }
*/

/*元件(共用)*/
.input1,textarea, .select {width: 100%;background: #f8f8f8;border: 1px solid #eaeaea;font-size:15px;line-height:1.1;padding: 5px 10px;margin-bottom: 15px;color:#555;}
textarea{height: 100px;}
.input1:focus, .textarea:focus, .select:focus { border:1px solid #000; }
.input1,.input2{width:100%;border:none;border-bottom:1px solid #0a99d9;padding:10px 5px;font-size:15px;color:#737373}
#goTop{border:1px solid #0a99d9;color:#0a99d9;background:#FFF;text-align:center;position:fixed;bottom:15px;right:15px;width:50px;height:50px;line-height:50px;cursor:pointer;display:none;z-index:15;border-radius:100%}
#goTop:hover {background: #0a99d9;color:#FFF;}

/*-------------------------------*/
/*縮放
.action1{-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);-webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.action1:hover{-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}

.action2{-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);-webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.action2:hover{-webkit-transform: scale(0.95);-ms-transform: scale(0.95);transform: scale(0.95);}

.action3{-webkit-transform: scale(.95);-ms-transform: scale(.95);transform: scale(.95);-webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.action3:hover{-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}

.action4{-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);-webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.action4:hover{-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}
*/

/*卷軸樣式*/
.scrollbar-style::-webkit-scrollbar-track,
body::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color:#212121;
}
.scroll02::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px #eee;
    background-color:#eee;}

.scrollbar-style::-webkit-scrollbar,
body::-webkit-scrollbar
{
    width: 8px;
    background-color:#49c89a;
}

.scroll02::-webkit-scrollbar{width: 4px;}

.scrollbar-style::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb, .scroll02::-webkit-scrollbar-thumb
{
    background-color:#49c89a;
}

body::-webkit-scrollbar{width:8px;}

/*麵包屑*/
.breadCrumbs-block{margin: 0 0 50px;width: 100%;}
.breadCrumbs-block .breadCrumbs{list-style:  none;margin:  0;padding: 0;font-size: 14px;display: -webkit-flex;display: flex;display: -ms-flexbox;-webkit-justify-content: flex-end;justify-content: flex-end;}
.breadCrumbs-block .breadCrumbs .item{position:  relative;}
.breadCrumbs-block .breadCrumbs .item+.item{margin-left: 20px;}
.breadCrumbs-block .breadCrumbs .item+.item:after{content: '/';color:#999;position: absolute;left: -12px;top: 1px;font-size: 11px;}
.breadCrumbs-block .breadCrumbs .item a{color:#999;}
.breadCrumbs-block .breadCrumbs .item.active{color: #0a99d9;}

/*---------------------- 頁面開始 ----------------------*/
/*主選單*/
.dropdown:hover>.dropdown-menu{display:block}
.pro-main{position:relative}
.link-pro{position:absolute;left:58%;top:50%;width:100%;transform:translate(-50%,-50%);opacity:0}
header.navchange {box-shadow: 0 0 10px #c7c7c7;}
.lang-top{background-color:#0a99d9}
.lang-top ul{list-style:none;padding-left:0;display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-justify-content:flex-end;justify-content:flex-end;margin-bottom:0;padding-right:15px}
.lang-top ul li a{padding:2px 15px;display:block;color:#eee}
.lang-top ul li.active a{background-color:#49c89a;color:#fff}
header .navbar{padding:0 20px;background-color: #ffffff;}
.navbar-brand{padding: 0;display: -webkit-flex;display: flex;display: -ms-flexbox;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
.logopic{background-color:#0a99d9;width: 110px;padding: 15px 12px 12px;position:relative;margin-bottom: 0;-o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
.logopic::before{position:absolute;content:'';width: 100%;height: 7px;background-color: #0a99d9;left: 0;bottom: -7px;}
.logopic+figure{margin-left: 10px;margin-bottom: 0;width: 255px;-o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
.mr-auto{width:100%;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
.nav-link{padding: 1.5rem 1rem;}
.dropdown-menu{border-radius:0;border:none;top: 65px;left:10px;padding:5px;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);}
.dropdown-menu::before{position:absolute;content:'';width:0;height:0;border-bottom:15px solid #49c89a;border-left:10px solid transparent;border-right:10px solid transparent;top:-10px}
.dropdown-menu-box{background:#fff}
.dropdown-menu-box a{padding:11px 10px;text-align:center}
.dropdown-menu-box a:hover{background-color: #ffffff;color:#0a99d9}
.dropdown-menu-box a+a{border-top:1px solid #eee}
.iso-pic figure{width:75px;margin-bottom:0;-o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
.iso-pic{margin-left:5px}
@media (min-width: 1140px){
  header.navchange .logopic{width: 90px;}
  header.navchange .logopic+figure{width: 200px;}
  header.navchange figure{width: 70px;}
}

/*footer*/
.footer{background-color: #c7c7c7;padding-top: 30px;}
.footer-info-top {text-align: center;margin-bottom: 20px;}
.footer-info-top figure{width:100px;margin:0 auto 15px}
.footer-info-top span{font-size:22px;font-weight:600}
.footer ul,.conInfo ul{padding-left:0;margin-bottom:30px;list-style:none;display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-justify-content:space-between;justify-content:space-between;border-top:1px solid rgba(255,255,255,0.5);padding-top:20px}
.footer-info,footer-info a{color:#fff}
.footer ul li,.conInfo ul li{position:relative}
.footer ul li p,.conInfo ul li p{letter-spacing:1px;margin-bottom:5px}
.footer ul li p+p,.conInfo ul li p+p{font-family:'Barlow',sans-serif;font-size:15px}
.footer ul li p+p,.footer ul li p a,.conInfo ul li p+p,.conInfo ul li p a{color: #6d6d6dee;}
.footer ul li a:hover{color:#fff}
.footer ul li p:nth-of-type(1){font-size:18px;font-weight:600;margin-bottom:10px;padding-bottom:2px;color: #4c4c4c;}
.footer ul li i,.conInfo ul li i{margin-right:10px}
.copyright{background-color:#0a99d9;padding:8px 0;text-align:center;color:#fff;font-size:15px;letter-spacing:1px}
.copyright a{color: #fff;}
@media (min-width: 1024px){
  .footer ul li::before{position:absolute;content:'';width:0;height:4px;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);border-radius:1px;top:-23px;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
  .footer ul li:hover::before{width:100%}
}

/*banner*/
.inner-banner{margin-top: 105px;}
.inner-banner{height: 15vw;background-attachment: fixed!important;background-size: contain!important;}
.banner{height: 31vw;position: relative;overflow: hidden;z-index: -2;margin-top: 100px;}
.banner::before{position:absolute;content:'';width: 50%;height: 100%;bottom: 0;left: 0;background: #ffffff;background: -webkit-linear-gradient(90deg,#ffffff,#ffffff,rgba(255, 255, 255, 0)100%);background: linear-gradient(90deg,#ffffff,#ffffff,rgba(255, 255, 255, 0)100%);z-index: 2;}
.banner .item{width: 100%;height:100%;/* margin-left: 20%; */}
/* .owl-carousel{z-index: -5!important;} */
.fitImg {width: 100%;margin-top: -200px;}
.video-layer{position: absolute;content:'';width: 100%;height: 100%;top: 0;background-image: url(../images/all/bg_dot.png);z-index:0;opacity: .8;}

.video-layer:before{content:"";position:absolute;height:100%;width:100%;left:0;bottom: 0;z-index: -1;opacity: .3;background: -webkit-linear-gradient(150deg,#0a99d9,#49c89a,#0a99d9,#3cdc99,#ff8534,#0a66d9);background: -o-linear-gradient(150deg,#0a99d9,#49c89a,#0a99d9,#3cdc99,#ff8534,#0a66d9);background: -moz-linear-gradient(150deg,#0a99d9,#49c89a,#0a99d9,#3cdc99,#ff8534,#0a66d9);background: linear-gradient(150deg,#0a99d9,#49c89a,#0a99d9,#3cdc99,#ff8534,#0a66d9);background-size: 400% 400%;-webkit-animation: raed 5s infinite ease-in-out;-o-animation: raed 5s infinite ease-in-out;-moz-animation: raed 5s infinite ease-in-out;animation: raed 5s infinite ease-in-out;}
.banner-text {
  position: absolute;
  left: 50px;
  top: 40%;
  color: #646464;
  font-weight: 600;
  letter-spacing: 1px;
  z-index: 6;
}
.banner-text h1{
    font-size: 37px;
    font-weight: 600;
    padding-bottom: 5px;
    margin-bottom: 10px;
    letter-spacing: 2px;
    padding-right: 20px;
    line-height: 47px;
    font-style: italic;
    position: relative;
}
.banner-text h1::before{position: absolute;content: '';width: 100%;height: 2px;bottom: 0;background: #ffffff;background: -webkit-linear-gradient(-90deg,rgba(10, 153, 217, 0),rgb(10, 153, 217)100%);background: linear-gradient(-90deg,rgba(10, 153, 217, 0),rgb(10, 153, 217)100%);}
.banner-text .sm-tt{
    font-size: 32px;
    color: #0a99d9;
}

@-webkit-keyframes raed{
    0%{background-position: 0% 50%}
    50%{background-position: 100% 50%}
    100%{background-position: 0% 50%}
}

@-o-keyframes raed{
    0%{background-position: 0% 50%}
    50%{background-position: 100% 50%}
    100%{background-position: 0% 50%}
}

@-moz-keyframes raed{
    0%{background-position: 0% 50%}
    50%{background-position: 100% 50%}
    100%{background-position: 0% 50%}
    
}@keyframes raed{
    0%{background-position: 0% 50%}
    50%{background-position: 100% 50%}
    100%{background-position: 0% 50%}
}
/*公用*/
.container2{max-width: 1300px;margin: 0 auto;page-break-after: auto;padding: 0 15px;}
.mjtitle{position:relative;margin-bottom: 30px;}
.mjtitle p{font-size:30px;letter-spacing:1px;padding:0 10px;color:#0b76a6;font-weight:600;border-bottom:1px solid;display:table;margin:0 auto}
.mjtitle span{font-family: 'Barlow', sans-serif;font-size: 4.5rem;position: absolute;font-weight: 900;left: 50%;transform: translateX(-50%);top: -40px;opacity: .3;color: #49c89a;z-index: -1;letter-spacing: 1px;}
.text-style {font-size: 17px;letter-spacing: 2px;line-height: 28px;}
.btn-style-box{background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);display: table;margin: 20px auto 0;}
.btn-style{display: table;padding: 10px 40px;color: #0a99d9;letter-spacing: 3px;transform: translate(0, 0);background-color: #fff;position: relative;-o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
.btn-style:hover{transform: translate(-10px, -10px);color:#49c89a}
/*內頁*/
.pageBox { position: relative;}
.pb-header .title { font-size: 27px; font-weight: 600; color: #4e4e4e; letter-spacing: 1px; border-bottom: 2px solid #56c999; padding-bottom: 10px;}
.pb-header .date { font-size: 14px; letter-spacing: 1px; background-color: #49c89a; display: table; color: #fff; padding: 4px 15px 5px; margin-top: -1em;}



/*首頁*/
@-webkit-keyframes bannerAnimation {
  0%{top:-4.8rem}
  100%{top:100%}
}
@keyframes bannerAnimation {
  0%{top:-4.8rem}
  100%{top:100%}
}
.move-bar{position: absolute;overflow: hidden;height: 100px;bottom: -60px;left: 50%;width: 10px;z-index: 1;}
.move-bar::before{position: absolute;content: '';width: 1px;height: 100%;left: 50%;transform: translateX(-50%);background-color: #0a99d9;}
.move-bar::after{position: absolute;content: '';width: 7px;height: 7px;left: 50%;transform: translateX(-50%);border-radius: 60px;background-color: #49c89a;-webkit-animation:bannerAnimation 1.8s cubic-bezier(.25,.46,.45,.94) infinite;animation:bannerAnimation 1.8s cubic-bezier(.25,.46,.45,.94) infinite;}
.index-pro{margin-top: -80px;position: relative;}
.index-pro-box{position:relative;padding: 20px 20px 80px;z-index: 1;}
.index-pro-box::before,.index-pro-box::after{position:absolute;content:'';width: 100%;bottom: 0;left: 0;}
.index-pro-box::before{height: 100%;background: #ffffff;z-index: -5;}
.index-pro-box::after{height: 70%;box-shadow: 0 10px 25px -2px rgba(207, 207, 207, 0.8);z-index: -6;}
.index-pro-item{position:relative;}
/* .index-pro-box a{display:block;margin:0 5px} */
.index-pro-box a figure{overflow:hidden;}
.index-pro-box a:hover span{color:#20624a}
.index-pro-box a:hover span::before{ width: 100%;}
.index-pro-box a span{text-align:center;font-size: 20px;letter-spacing:1px;display:block;color:#464646;padding-bottom: 7px;border-bottom:1px solid #0a99d9;margin-top: 15px;position: relative;}
.index-pro-box a span::before{position:absolute;content:'';width: 50px;height: 4px;background-color: #49c89a;bottom: -2px;border-radius: 3px;z-index: 2;left: 50%;transform: translateX(-50%);-o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
.index-pro-box-tt{margin-top: 50px;margin-bottom: 40px;}
.index-pro-box-tt .mjtitle+p{text-align: center;width: 80%;margin: 0 auto;}
.brandLogo img{width:250px;}
.owl-theme .owl-nav{position:absolute;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);height: 50px;margin-top: 0!important;z-index: 2;}
.owl-prev{left: -15px;}
.owl-next{right: -15px;}
.owl-prev,.owl-next{position:absolute;width: 45px;height: 45px;background-color: rgba(255, 255, 255, .8)!important;border-radius: 60px!important;}
.owl-prev span,.owl-next span{display:none}

.owl-prev:before, .owl-next:before{position:absolute;content:'';background-image: url(../images/all/right-arrow.png)!important;background-size: cover!important;width: 100%;height: 100%;left: 0;top: 0;opacity: .3;-o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
.owl-prev:before{-moz-transform:rotate(-180deg);-webkit-transform:rotate(-180deg);-o-transform:rotate(-180deg);-ms-transform:rotate(-180deg);transform:rotate(-180deg)}
.owl-prev:hover:before,.owl-next:hover:before{opacity:.7}

.index-product{
  position: relative;
  margin-top: 70px;
  overflow: hidden;
}
.index-product:before{
  position: absolute;
  display: block;
  content: '';
  right: 0;
  width: 70%;
  height: 500px;
  background-image: url(../images/product/p-bk.png);
  background-size: cover;
  opacity: .3;
  z-index: -2;
}
.index-product:after{
  position: absolute;
  display: block;
  content: '';
  right: 0;
  bottom: 0;
  width: 100%;
  height: 1250px;
  background-image: url(../images/product/product-bg2.jpg);
  background-size: cover;
  opacity: 1;
  z-index: -2;
}
.index-product .type-box{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.index-product .type-box:nth-child(even){
  flex-direction: row-reverse;
}
.index-product .tb{
  position: relative;
  left: -8%;
  width: 60%;
}
.index-product figure{
  width: 35%;
}
.index-product .type-text{
  width: 100%;
  background-color: #fff;
  box-shadow: 0 0px 30px -2px rgba(207, 207, 207, 0.8);
  padding: 40px 60px;
}
.index-product .type-text:before{
  content: '';
  position: absolute;
  left: 13%;
  top: 10%;
  width: 90%;
  height: 100%;
  background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);
  z-index: -1;
  opacity: .5;
}
.index-product .type-box:nth-child(even) .tb{
  left: initial;
  right: -8%;
}
.index-product .type-box:nth-child(even) .type-text:before{
  left: initial;
  right: 13%;
}
.index-product .type-text:hover .title:before{
  width: 100%;
}
.index-product .type-text .title{
  position: relative;
  font-size: 1.6rem;
  font-weight: bold;
  color: #0a99d9;
  border-bottom: 1px solid #0a99d9;
  padding-bottom: 5px;
  margin-bottom: 10px;
}
.index-product .type-text .title:before{
    position: absolute;
    content: '';
    width: 50px;
    height: 3px;
    background-color: #49c89a;
    bottom: -2px;
    border-radius: 3px;
    z-index: 2;
    left: 0;
    transition: all .3s linear;
}
.index-product .type-text .info{
  font-size: 17px;
}

.index-about{position: relative;margin-top: 200px;}
.bk-img-box{position: absolute;max-width: 1400px;width: 100%;top: 0;height: 200%;left: 50%;transform: translateX(-50%);z-index: -6;}
.bk-img {background-image: url(../images/index/map.png);background-size: contain;background-repeat: no-repeat;height: 100%;width: 100%;}
.index-about .container2{position: relative;display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-align-items:flex-end;-ms-flex-align:flex-end;align-items:flex-end;-webkit-justify-content:center;justify-content:center;}
.about-o{position:absolute;font-size: 13.5rem;letter-spacing: 2px;color: #0a99d9;opacity: .1;line-height: 200px;font-weight: 600;font-family: 'Barlow', sans-serif;top: -150px;right: 110px;}
.index-about article div.text-style{background: #ffffff;background:-webkit-linear-gradient(0,#ffffff,rgba(255, 255, 255, 0)100%);background: linear-gradient(0,#ffffff,rgba(255, 255, 255, 0.9)100%);box-shadow: 0 7px 25px #e4e4e4;padding: 70px 35px 30px;width: 450px;margin-bottom:0;line-height:35px;}
.index-about-title{position:absolute;top: -30px;right: -40px;}
.index-about-title>p{background-color:#0a99d9;color:#fff;padding: 5px 35px 25px 25px;text-align:center;font-size: 24px;letter-spacing:2px;font-weight:600;margin-bottom: 0;}
.index-about-title span{background-color: #49c89a;padding: 3px 20px;color: #ffffff;position: absolute;width: 150px;margin-top: -20px;right: -20px;text-align: center;}
.index-about article{position:relative;display:inline-block}
.index-about ul{width: 500px;padding-left:0;list-style: none;margin-left: 80px;margin-bottom: -100px;display: -webkit-flex;display: flex;display: -ms-flexbox;-webkit-align-items: center;-ms-flex-align: center;align-items: center;-webkit-justify-content: space-between;justify-content: space-between;flex-wrap: wrap;-ms-flex-wrap:wrap;}
.index-about ul li{background-color:#fff;padding: 15px 15px 20px;width: 150px;text-align: center;position:relative; overflow: hidden;}
.index-about ul li figure{margin-bottom: 30px;}
.index-about ul li span{font-size: 17px;font-weight: 600;position: relative;letter-spacing: 1px;z-index: 0;}
.index-about ul li span::before{position:absolute;content:'';width: 30px;height: 2px;background-color: #49c89a;top: -15px;left: 50%;transform: translateX(-50%);}
/* .index-about ul li::after{position:absolute;font-size: 7rem;line-height: 100px;font-weight: 600;font-style: italic;font-family: 'Barlow', sans-serif;opacity: .06;right: -5px;bottom: -20px;}
.index-about ul li:nth-of-type(1)::after{content:'01';}
.index-about ul li:nth-of-type(2)::after{content:'02';}
.index-about ul li:nth-of-type(3)::after{content:'03';} */
.index-about ul li:nth-of-type(1){margin-top: -40px;}
.index-about ul li:nth-of-type(3){margin-top: 40px;}
.index-news{margin-top: 250px;padding: 80px 0 120px;position: relative;}
.index-news::before,.index-news::after{position: absolute;content:'';width: 100%;height: 100%;top: 0;left: 0;z-index: -5;}
.index-news::before{background-attachment: fixed;background-repeat: no-repeat;background-position: bottom;background-image: url(../images/index/02.jpg);}
.index-news::after{background-color:#333;opacity:.5}
.index-news .mjtitle p{color:#fff}
.index-news .mjtitle span{color:#ffff}
.index-news .container2{display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-align-items:center;-ms-flex-align:center;align-items:center}
.index-news-l{width: 450px;}
.index-news ul{margin-bottom:0;padding:40px;width: calc(100% - 450px);list-style:none;background: rgba(255, 255, 255, 0.8);box-shadow: 0 0 20px #565656;}
.index-news ul li{position:relative;padding-bottom:5px;border-bottom: 1px dashed #bbb;}
.index-news ul li+li{margin-top: 35px;}
.index-news ul li a{display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-align-items:center;-ms-flex-align:center;align-items:center;position:relative;}
.index-news ul li a::before{position:absolute;content:'';width: 120px;height: 4px;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);bottom: -7px;-o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
.index-news ul li a:hover::before{width:100%}
.index-news .list_title1{font-size:19px;margin-left: 30px;color: #252525;}
.index-news .date1{padding: 0 15px;color: #737373;font-weight:600;font-size:14px;letter-spacing: 1px;font-family:'Barlow',sans-serif;}
.index-cer{position: relative;padding-bottom: 60px;}
.index-cer::before{position: absolute;content:'';right: 0;width: 70%;height: 100%;background-image: url(../images/index/bk01.jpg);background-size: cover;z-index: -4;background-repeat: no-repeat;background-position: right bottom;opacity: .2;}
.index-cer .mjtitle span{font-size: 3rem}
.index-cer-box{display:-webkit-flex;display:flex;display:-ms-flexbox;}
.index-cer-l{width:60%;display:-webkit-flex;display:flex;display:-ms-flexbox;padding-right:50px;margin-top: -30px;}
.index-cer-l figure{width:50%;margin-bottom:0;box-shadow:0 0 10px rgba(150,150,150,0.5)}
.index-cer-l figure+figure{margin-left:40px}
.index-cer-l figure.cer-img{width: initial;}
.index-cer-l .owl-theme .owl-dots .owl-dot.active span,.index-cer-l .owl-theme .owl-dots .owl-dot:hover span{background: #49c89a;}
.index-cer-r{width:45%;margin-top:150px}
.index-contact{padding:50px 0;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);}
.index-contact-box{display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:flex-end;-ms-flex-align:flex-end;align-items:flex-end;border:3px solid #fff;padding:50px}
.index-contact-box .mjtitle{margin-bottom:0}
.index-contact-box .mjtitle h4{display:inline-block}
.index-contact-box .mjtitle p{display:inline-block;color:#fff}
.index-contact-box b{display:block;margin-top:25px;font-size:23px;letter-spacing:1px;font-weight:initial;color:#fff;font-style:italic}
.index-contact-box ul{list-style:none;padding-left:0;margin-bottom:0}
.index-contact-box ul li{font-size:18px;letter-spacing:1px;font-family:'Barlow',sans-serif;font-weight:600}
.index-contact-box ul li+li{margin-top:5px}
.index-contact-box ul li i{margin-right:10px}
.index-contact-box ul li a{color:#fff}
.index-contact-box ul li a:hover{text-decoration: underline!important;}

@media screen and (max-width: 992px){
  .index-product .parallax,.index-product .parallax-5{ transform: none!important;}
  .index-product figure{width:45%}
  .index-product .tb{width:55%;left:-4%}
  .index-product .type-text{padding:30px 40px}
  .index-product .type-box:nth-child(even) .tb{left:initial;right:-4%}
}
@media screen and (max-width: 768px){
  .index-product .type-box{align-items:stretch;margin-bottom:10px}
  .index-product figure{width:35%;margin-bottom:0;z-index:1}
  .index-product figure img{width:100%;height:100%;object-fit:cover}
  .index-product .tb{left:initial;width:65%}
  .index-product .type-box:nth-child(even) .tb{right:initial}
  .index-pro-box-tt .mjtitle+p{width:100%}
  .brandLogo img{width:50%;}
}
@media screen and (max-width: 576px){
  .index-product .type-box{flex-wrap:wrap;justify-content:center}
  .index-product figure{position:relative;width:100%;max-width:300px;top:20px;z-index:1}
  .index-product .tb{width:100%}
  .index-product .type-text:before{width:100%;left:0;top:5%}
  .index-product .type-box:nth-child(even) .type-text:before{left:0;right:initial}
}

/*側選單*/
.sidebar{width: 220px;position:relative;box-shadow:0 0 20px #e4e4e4;}
.sidenav-box{text-align:center;color:#fff;position:relative}
.sidenav-box p{background-color:#49c89a;padding:40px 10px;font-size:25px;letter-spacing:1px;margin-bottom:0}
.sidenav-box span{background-color:#0a99d9;padding:3px 10px;position:absolute;width:140px;bottom:-12px;left:50%;transform:translateX(-50%);font-size:13px;font-family:'Barlow',sans-serif;font-weight:600}
.sidebar ul{padding:15px 0 0}
.sidebar li{width:100%;font-size:17px;letter-spacing:1px;}
.sidebar li+li{border-top:1px solid #eee}
.sidebar li a{display:block;padding:20px 15px;position:relative;text-align: center;color:#a8a8a8}
.sidebar li a i{font-size:12px;margin-left: 8px;position: absolute;opacity: 0;top: 43%;-o-transition: all .3s linear;-webkit-transition: all .3s linear;-moz-transition: all .3s linear;transition:  all .3s linear;}
.sidebar li a:hover i,.sidebar li.active i{opacity:1;margin-left: 10px;}
.sidebar li a:hover,.sidebar li.active a{color:#464646}

@media (min-width: 991px){
  .sidebar button{display: none;}
  #sidenav{display:block;}
}

/*公司資訊*/
.aboutGrid{position:relative;}
.aboutGrid:before{background-image:url(../images/index/map.png);background-size:contain;background-repeat:no-repeat;content:'';display:block;width:100%;height:500px;position:absolute;left:0;bottom:0;opacity:.2}
.boss{width:250px;float: left;margin-right: 30px;}
.aboutTitle{font-size: 25px;border-left: 5px solid #0a99d9;display: inline-block;padding-left: 10px;line-height: 1;}
.aboutTxt{background:rgba(255,255,255,0.3);position:relative;letter-spacing:1px;font-size:1.05rem;width: calc(50% - 10px);}
.aboutTxt:nth-of-type(3){width:100%}
.aboutGrid ul{width: 500px;padding-left:0;list-style: none;display: -webkit-flex;display: flex;display: -ms-flexbox;-webkit-align-items: center;-ms-flex-align: center;align-items: center;-webkit-justify-content: space-between;justify-content: space-between;}
.aboutGrid ul li{padding: 15px 15px 20px;width: 150px;text-align: center;position:relative;overflow: hidden;}
.aboutGrid ul li figure{margin-bottom: 30px;}
.aboutGrid ul li span{color: #ffffff;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);padding: 5px 10px;border-radius: 1em;position: relative;letter-spacing: 3px;z-index: 0;}
.aboutGrid ul li span::before{position:absolute;content:'';width: 30px;height: 2px;background-color: #49c89a;top: -15px;left: 50%;transform: translateX(-50%);}
.aboutGrid .btn-style-box{margin: 20px 0;}
@media (min-width:576px){
.modal-dialog{max-width: 800px;}
}
.about-video{width:100%}
button.close{margin-bottom:15px}
.modal-body{padding:1rem 2.5rem 2.5rem}
.modal-content{background-color:rgba(255,255,255,.96);box-shadow:0 0 10px #5a5a5a}

/*歷史沿革*/
.year-time-line .timelines {
list-style:none;
padding:0;
margin:0;
display:table;
width:100%;
}

.year-time-line .timelines li {
display:table-row
}

.year-time-line .timelines li.fix {
height:20px
}

.year-time-line .timelines li .xleft {
display:table-cell;
width: 70px;
}

.year-time-line .timelines li .xleft em {
  display: block;
  position: relative;
  width: 60px;
  height: 60px;
  line-height: 60px;
  background: #0a99d9;
  text-align: center;
  border-radius: 50%;
  font-size: 18px;
  color: #fff;
  font-weight: bold;
  font-style: normal;
  box-shadow: 1px 1px 1px #0d61ab;
}

.year-time-line .timelines li .xleft em:after{
  content: '';
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 13.0px 7.5px 0 7.5px;
  border-color: #0a98d9 transparent transparent transparent;
  left: 24px;
}

.year-time-line .timelines li .xright {
display:table-cell;
vertical-align:middle;
background:#F7F7F7;
border-bottom: 1px solid #d9d7d7;
min-height:80px;
padding:10px 20px;
border-radius:5px;
margin-bottom:20px;
position:relative;
transition: all .5s ease-in-out;
}

.year-time-line .timelines li .xright .fa-caret-left {
position:absolute;
left:-9px;
top:25px;
color:#E4E4E4;
font-size:30px;
z-index:1
}

.year-time-line .timelines li:hover .xright {
color:#ec7d06;
}

.year-time-line .timelines li .xright p{
  margin: 0;
}

.year-time-line .piczone{
  display: flex;
}
.year-time-line .picbox{
  margin: 1%;
}
.year-time-line .picbox .pic-sm{
  max-height: 450px;
}
.future_block{
  position: relative;
}
.future_block p{
  position: absolute;
  width: 100%;
  text-align: center;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  z-index: 2;
  font-size: 20px;
  letter-spacing: 1px;
  line-height: 1.8;
  color: #4a4a4a;
  font-weight: bold;
}
.future_block .earth{
  opacity: .35;
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
}

@media (max-width: 667px) {
.year-time-line .timelines {
display:inherit;
background:none
}

.year-time-line .timelines li {
display:inherit
}

.year-time-line .timelines li .xleft {
display:inherit;
width:auto
}

.year-time-line .timelines li .xleft em {
  display: inline-block;
  height: auto;
  line-height: inherit;
  border-radius: 5px 5px 0 0;
  margin-left: 10px;
}

.year-time-line .timelines li .xright {
display:inherit;
min-height:auto;
margin-bottom:0
}

.year-time-line .timelines li .xright .fa-caret-left {
display:none
}

.year-time-line .piczone{
  flex-wrap: wrap;
}
.year-time-line .picbox{
  margin: 10px 0;
}
.year-time-line .picbox .pic-sm{
  max-height: initial;
}
}

@media screen and (max-width: 480px){
  .future_block p br{display: none;}
}

/*營業項目*/
.serviceGrid .aboutTxt span { color: #ec7d06;  font-size: 1.2rem; margin: 0 5px;}
.picBox {  float: right;  width: 40%; margin-left: 2em;  position: relative;}
.picBox:after {content: '';width:100%;height: 300px;display: block;position: absolute;left: -1em;bottom:0;z-index: -1;
    background: #0a99d9;
    background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);
    background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);
}

/*代理品牌*/
.proxyGrid {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    -ms-flex-wrap:wrap;
    display: -ms-flexbox;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    }
.proxyGrid .aboutTxt:nth-of-type(2) {margin-left: 20px;}
.proxyGrid .imgBox { max-width: 200px;}
.proxyGrid .imgBox>figure { margin: 0;}
.proxyGrid .btn-style-box{margin: 20px}
.proxyPic {  margin-top: 2em;  clear: both; text-align: center;}
.proxyPic>* {   width: calc(100% / 4 - 4px);  display: inline-block;}



/*產品*/
.inner-bk{position:relative}
.inner-bk::before{position:absolute;content:'';background-image:url(../images/product/p-bk.png);background-size:contain; width:100%;height:500px;z-index:-1;top:-50px;opacity:.5}
.inner-title{text-align:center;position:relative;margin-bottom:50px}
.inner-title h1{font-size:32px;font-weight:600;color:#0a99d9;border-bottom:1px solid;display:table;margin:0 auto;padding:0 10px}
.inner-title p{font-family:'Barlow',sans-serif;font-weight:900;font-size:7.5rem;font-style:italic;position:absolute;left:50%;transform:translateX(-50%);opacity:.1;top:-50px;color:#49c89a;margin-bottom:0;line-height:100px}
.inner-page{max-width: 1250px;margin: -120px auto 80px;position:relative;padding:30px 30px 0;/* z-index: 0; */background:#fff;background:-webkit-linear-gradient(0,#fff,rgba(255,255,255,0)100%);background:linear-gradient(180deg,#fff,rgba(255,255,255,0.4)100%);}
.inner-page .btn-style-box{border: 1px solid #eee;}
.inner-page .btn-style-box:hover a{box-shadow:0 0 3px -1px #b9b9b9}
.inner-page::before,.inner-page::after{position:absolute;content:'';width:100%;top:0;left:0}
.inner-page::before{height:400px;background:#fff;background:-webkit-linear-gradient(0,#fff,rgba(255,255,255,0.8)100%);background:linear-gradient(0,#fff,rgba(255,255,255,0.8)100%);/* z-index:-1 */}
.inner-page::after{box-shadow:0 0 20px -3px #3333;height:300px;z-index:-2}
.inner-page-box{display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-align-items:flex-start;-ms-flex-align:flex-start;align-items:flex-start;-webkit-justify-content:space-between;justify-content:space-between;position: relative;}
.sidebar+.inner-page-box-r{width:calc(100% - 220px);padding-left:30px}
.product-box-outer{display:-webkit-flex;display:flex;display:-ms-flexbox;flex-wrap:wrap;-ms-flex-wrap:wrap;border-bottom:1px solid #eeee;border-right:1px solid #eee}
.product-box{width: calc(100% / 2);border-top:1px solid #eee;border-left:1px solid #eee;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);z-index: 0;}
/* .product-img{
    padding: 15px;
} */
.product-box a{display:block;background:#fff;transform:translate(0,0);-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear;}
.product-box a:hover{transform:translate(-15px,-15px);box-shadow:0 0 10px -3px rgba(131,131,131,0.5)}
.product-info{text-align:center;padding:15px 0;border-top:1px solid rgba(232,232,232,0.5);position:relative}
.product-info::before{position:absolute;content:'';width:30px;height:2px;background-color:#0a99d9;border-radius:1px;top:-2px;left:50%;transform:translateX(-50%);-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.product-box a:hover .product-info::before{width:100%}
.pro-top{display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-align-items:flex-start;-ms-flex-align:flex-start;align-items:flex-start;margin-bottom: 20px;}
.pro-l{width:55%}
.pro-r{width:45%;padding-left:30px}
.ps-header{position:relative}
.ps-header::before{position:absolute;content:'';width:100%;height:2px;background-color:#49c89a;bottom:20px;z-index:-1;}
.ps-header h1{font-size:16px;letter-spacing:1px;background-color:#49c89a;display:table;color:#fff;padding:4px 15px 5px;margin-bottom:0}
.ps-header h2{font-size:27px;font-weight:600;color:#4e4e4e;letter-spacing:1px}
.p-text-box{margin-top:20px;border-bottom:1px solid #eee}
.inner-page-box-r article{margin-top:30px}
.pro-detail-text-t{position:relative;margin-bottom:20px}
.pro-detail-text-t::before{position:absolute;content:'';width:100%;height: 3px;top:50%;z-index:-1;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);}
.pro-detail-text-t span{font-size:22px;background:#ffff;display:table;padding:2px 20px;margin:0 auto;color:#5a5a5a;font-weight:600}
.pro-top+article p{margin-bottom:0!important}
.img-thumb{padding-left:0;list-style:none;display:-webkit-flex;display:flex;display:-ms-flexbox;flex-wrap:wrap;-ms-flex-wrap:wrap;border-right:1px solid #eee}
.img-thumb li{width:calc(100% / 6);padding: 5px;/* background: #0a99d9; *//* background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%); *//* background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%); */border-top:1px solid #eee;border-bottom:1px solid #eee;border-left:1px solid #eee;}
.img-thumb li a{transform:translate(0,0);display:block;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.img-thumb li a:hover{transform:translate(-8px,-8px);box-shadow:0 0 10px -3px rgba(131,131,131,0.5)}
.btns-box{display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-justify-content:center;justify-content:center;margin-top:20px}
.btn-style-box2{cursor: pointer;display:table;border:1px solid #e2e2e2ee;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);}
.btn-style-box2+.btn-style-box2{margin-left:10px}
.btn-style-box2 a{display:block;padding:10px 30px;letter-spacing:1px;color:#0a99d9!important;position:relative;z-index:2}
.btn-style-box2 a::before{position:absolute;content:'';width:100%;height:100%;left:0;top:0;background-color:#fff;z-index:-1;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.btn-style-box2 a:hover{color:#fff!important;}
.btn-style-box2 a:hover::before{opacity:0}
.train-from>p span{display:block;color: #0a99d9;font-size:14px;margin-top:5px;}
.train-from>p{text-align:center;letter-spacing:1px}
.page_form{margin-bottom:20px}
.pro-video{margin-top:30px}

/*最新消息-列表頁*/
.news-box-all{width:100%}
.post_head{margin:0 auto 20px;padding:0;background:#F7F7F7;overflow:hidden;position:relative; transition: all .3s ease-in-out;}
.post_head .title h2 {font-size: 1.2rem; color: #333;}
.post_head::before{position:absolute;content:"\f138";font-family:Font Awesome\ 5 Free;font-weight:900;display:block;right:10px;top:46%;width:16px;height:16px;border-radius:8px;margin:0 8px 0 0;color:#fda41f; transition: all .3s ease-in-out;}
.post_head .date{width:140px;background:#49c89a;color:#FFF;line-height:130px;text-align:center;letter-spacing:1.2px;font-family:Oswald,sans-serif;position:relative;left:0;top:0;float:left}
.post_head:nth-child(2n) .date{background:#67b9e8}
.post_head .title{width:calc(100% - 140px);padding:20px 70px 0 30px;text-align:left;line-height:1.8;letter-spacing:1px;float:left}
.post_head .title a{display:block;margin-bottom:1em}
.post_head .moreTxt{color:#2b99d9;font-size:14px;border-bottom:#DDD 1px solid; transition: all .3s linear;}
.post_head:hover:before{padding-left:7px;}
.post_head:hover .moreTxt{padding-left:1em}
.post_head:hover{box-shadow:0 3px 8px #d2d2d2}

/*包膜知識區列表*/
.knowledgeList { width: 90%; margin: 0 auto;}
.knowledgeList .listbox {overflow: hidden;position: relative;border-bottom: 1px solid #e3e3e3;padding-bottom: 5px;margin-bottom: 1.5em;letter-spacing: 1px;}
.knowledgeList .listbox .tit {font-size: 1.2rem;color: #333;margin: 0 0 5px 2em;}
.knowledgeList .listbox .tit:before {content: "\f0eb";font-family: Font Awesome\ 5 Free;font-weight: 900;background: #f7a420;color: #fff;border-radius: 100%;width: 30px;height: 30px;line-height: 30px;text-align: center;display: inline-block;margin:0 10px 0 -2em;}
.knowledgeList .infoBox { padding: 12px 2.5em; background: #f7f7f7; border-radius: 2em; color: #696969;}
.knowledgeList .listbox .more-btn { width: 0; height: 0; border-style: solid; border-width: 0 0 40px 40px; position: absolute; 
                    right: 0; bottom: -30px;  border-color: transparent transparent #fda41f transparent; }
.knowledgeList .listbox .more-btn i {  margin-top: 20px;  margin-left: -17px;  color: #fff; }
.knowledgeList .listbox:hover .more-btn {  bottom: 0px; }
.knowledgeList .listbox:hover .tit,.knowledgeList a:hover .listbox .tit {  color: #0d91de;  }
.knowledgeList .list-frame .listbox:after {position: absolute;bottom: 0;
   content:'';width: 0;height: 3px; background: #0a99d9;
   background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);
   background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);
   -o-transition: all .3s linear;
   -webkit-transition: all .3s linear;
   -moz-transition: all .3s linear;
   transition: all .3s linear;}
.knowledgeList .list-frame:hover .listbox:after {content:'';width: 100%;}

/*圖文底層*/
.page-content { margin: 2em 0;}
.page-content table { max-width:100%; }
.imgg {max-width:100%;display:block;}
.imgg2 { max-width:100%; display:block; }
.tx01 { clear: both; margin-bottom:2em;}
.tx02 { clear: both; overflow:hidden; margin-bottom: 2em;}
.tx01 img {padding-bottom: 30px; }
.img-left,.img-left1 { float: left; padding-bottom: 1em; padding-right: 2em;}
.img-right,.img-right1 { float: right; padding-bottom: 1em; padding-left: 2em;}
.img-left img, .img-right img { max-width:300px; }
.img-left1 img img { max-width:430px; }
.img_center img {  float: left;  padding: 1em;  width: 33.3%;   text-align: center;}
/*RWD編輯器表格(X捲軸)*/
.table-container table td {
  min-width: 100px;
  padding: 5px;
  border: 1px solid #ccc;
}
@media screen and (max-width: 768px) {
  .table-container { 
    width: 100%;
    overflow-y: auto;
    _overflow: auto;
    margin: 0 0 1em;
     }
}

/*頁碼*/
.page-zone{padding-top: 50px;}
.page-zone .pagination>li.active a{background-color: #333;border-color: #333;    color: #fff;}
.page-zone .pagination>li a{color:#333;padding: 15px 20px;}

/*品質認證*/
.certGrid{background: url(../images/page/bk01.jpg) -26em -1em no-repeat;}
.certTxt { text-align: center; letter-spacing: 1px; font-size: 1.05rem;}
.certBox{width: 55%;display:-webkit-flex;display:flex;display:-ms-flexbox;/* padding-right:50px; */margin-top: 4em;}
.certBox figure{width:50%;margin-bottom:0;box-shadow:0 0 10px rgba(150,150,150,0.5)}
.certBox figure+figure{margin-left:40px}
.certArea {display: -webkit-flex;display: flex;display: -ms-flexbox;margin-top: 8em;}
.areaTxt {width: 45%;background: rgba(190, 231, 255, 0.6);padding: 2em;margin-left: 2em;margin-top: -2em;letter-spacing: 1px;}
.areaTxt>h2 {margin: -1.8em 0 1em -2em;padding-bottom: 10px;font-size: 1.6rem;color: #379a76;background: rgba(255, 255, 255, 0.8);}
.certBottom{
  display: flex;
  margin-top: 60px;
}
.certBottom figure{
  position: relative;
  margin-right: 10px;
 
  /*border-bottom: 1px solid #0a99d9;*/
}
.certBottom figure img{ box-shadow: 0 0 10px rgba(150,150,150,0.5);}
.certBottom figure:before{
  position: absolute;
  content: '';
  width: 100%;
  height: 1px;
  background-color: #0a99d9;
  bottom: -4px;
  z-index: 1;
  left: 50%;
  transform: translateX(-50%);
}
.certBottom figure:after{
  position: absolute;
  content: '';
  width: 50px;
  height: 4px;
  background-color: #49c89a;
  bottom: -6px;
  border-radius: 3px;
  z-index: 2;
  left: 50%;
  transform: translateX(-50%);
  transition: all .3s linear;
}
.certBottom figure:hover:after{
  width: 100%;
}
.certBottom figure:nth-last-child(1){
  margin-right: 0;
}

/*常見問題*/
.no-click-open .item{position:relative;margin:1em 1em 1.5em 3em;border-radius:5px;background:#F7F7F7;border-bottom:1px solid #d9d7d7;letter-spacing:1px}
.no-click-open .item .question{display:block;color:#444;padding:10px 35px 10px 20px;font-size:1.1rem;transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-webkit-transition:all .5s ease-in-out;position:relative}
.no-click-open .item .answer{background:#fffbef;padding:15px 20px;display:none;border-top:1px solid #d9d7d7}
.no-click-open .item .item-mark{position:absolute;width:44px;height:44px;line-height:44px;font-size:1.2rem;font-weight:700;color:#fff;background:#0a99d9;border-radius:100%;text-align:center;top:0;left:-44px;transition:color .5s linear;-ms-transition:color .5s linear;-moz-transition:color .5s linear;-webkit-transition:color .5s linear;box-shadow:1px 1px 1px #0d61ab}
.no-click-open .item .item-mark:after{content:'';display:block;position:absolute;width:0;height:0;border-top:5px solid transparent;border-left:10px solid #0a99d9;border-bottom:5px solid transparent;top:17px;left:42px;transform-origin:-20px center;-ms-transform-origin:-20px center;-moz-transform-origin:-20px center;-webkit-transform-origin:-20px center;transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-webkit-transition:all .5s ease-in-out}
.no-click-open .item.open .item-mark:after{transform:rotate(60deg);-ms-transform:rotate(60deg);-moz-transform:rotate(60deg);-webkit-transform:rotate(60deg)}
.no-click-open .fa-plus{position: absolute;right: 10px;top: 10px;line-height:26px;color:#0a99d9}
.no-click-open .item:hover .fa-plus{color:#ec7d06}
.no-click-open .item:hover a{color:#ec7d06}

/*聯絡我們*/
.conInfo ul li { padding: 0 10px;}
.conInfo ul li p:nth-of-type(1) { font-size: 18px; font-weight: 600; margin-bottom: 10px; padding-bottom: 2px; border-radius: 10px; padding: 3px 10px;}
.conInfo ul li:nth-of-type(1) p:nth-of-type(1) { color: #007ac1; background: #dff1fb;}
.conInfo ul li:nth-of-type(2) p:nth-of-type(1) { color: #d88225; background: #fffbe4;}
.conInfo ul li:nth-of-type(3) p:nth-of-type(1) { color: #d88225; background: #fffbe4;}
.conInfo ul li:nth-of-type(4) p:nth-of-type(1) { color: #484848; background: #f3f3f3;}
.conInfo ul li:nth-of-type(5) p:nth-of-type(1) { color: #484848; background: #f3f3f3;}
.conInfo ul li p a:hover{color: #0a99d9;}
.form-right-message .page_form {  color: #0a99d9;  font-size: 1.05em;   margin-top: 1em}
.form-right-message .page_form i {  margin: 0 8px 0 0;color: #7fccb5;font-size: 1rem; }
.form-right-message .page_form .name {  float: left;   margin-right: 1em;}
.form-right-message .map_box { clear: both;   padding-top: 2em; }
.form-right-message .main-title{position: relative;display: inline-block;margin: 2em 0 1em;padding: 5px 40px;min-width: 250px;text-transform: uppercase;border-top: double 3.5px;border-bottom: double 3.5px;border-color: #d8d8d8;color: #4e4d4d;}
.form-right-message .main-title:before, .form-right-message .main-title:after{content: '';position: absolute;top:3.5px;width: 4px;height: calc(100% - 7px);color: #dcdcdc;}
.form-right-message .main-title:before{left:-4px;border-left: double 3.5px;}
.form-right-message .main-title:after{right:-4px;border-right: double 3.5px;}
.form-right-message .main-title h3{margin:0;font-size: 1.4rem;letter-spacing: 1px;}
.red { color: #cc3030; margin-left: 5px;}

/*rwd開始*/
@media (max-width: 1440px){
.banner-text {top: 30%;}
.banner-text h1 {font-size: 32px;}
.banner-text .sm-tt {font-size: 28px;}
.inner-page {margin-top: -90px;}

/*聯絡我們*/
.conInfo ul {flex-wrap: wrap;-ms-flex-wrap:wrap;-webkit-justify-content: flex-start;justify-content: flex-start;margin-bottom: 10px;}
.conInfo ul li {width: calc(100% / 3 - 10px);margin-bottom: 20px;}
}
@media (max-width: 1200px){
/*品質認證*/
.certBox,.areaTxt { width: 100%; display:block;}
.certBox figure { display: inline-block; width: calc(50% - 2em);}
.certBox figure+figure {margin-left: 2em;}
}

@media (max-width: 1140px){
header .navbar {padding: 0 10px;}
.inner-banner {height: 18vw;}
.logopic{width:90px}
.logopic+figure{width:190px;margin-left:7px}
.index-pro {margin-top: -50px;}
.iso-pic figure {width: 65px;}
}

@media (max-width: 1024px) { 
.footer ul {flex-wrap: wrap;-ms-flex-wrap:wrap;-webkit-justify-content: flex-start;justify-content: flex-start;margin-bottom: 10px;}
.footer ul li {width: calc(100% / 3);margin-bottom: 20px;}
/*header*/
.logopic{width:85px;padding:10px}
.logopic+figure{width:180px}
.nav-link{padding:1rem}
.dropdown-menu{top:55px}
}
@media (max-width: 991px){
/*banner*/
.video-layer:before{bottom:2px}
.video-layer{top:-2px}
.inner-banner,.banner {margin-top: 90px;}
.fitImg {margin-top: -180px;}
.banner {height: auto;}
.banner-text h1{font-size:25px;line-height:33px;margin-bottom:5px}
.banner-text{top:40%;left:30px}
.banner-text .sm-tt{/* text-shadow:0 0 5px #b2b2b2; */font-size:25px;}
.inner-banner{background-attachment:initial!important;background-size:cover!important;height:23vw}
/*選單*/
.navbar-toggler-icon{background-color:#0a99d9;width:1.8em;height:3px;position:relative}
.navbar-toggler-icon::before,.navbar-toggler-icon::after{position:absolute;content:'';width:100%;height:100%;background:#0a99d9;left:0}
.navbar-toggler-icon::before{top:-7px}
.navbar-toggler-icon::after{top:7px}
.navbar-header{display:-webkit-flex;display:flex;display:-ms-flexbox;-webkit-justify-content:space-between;justify-content:space-between;}
.navbar-nav{text-align:center}
.nav-link{padding:12px 0}
.nav-item+.nav-item{border-top:1px solid #eee}
.dropdown-menu::before{left:50%;transform:translateX(-50%);top:42px;border-bottom:12px solid #28afbb}
/*側選單*/
.sidenav-box{display: none}
.sidebar{width:100%}
.inner-page-box{flex-wrap:wrap;-ms-flex-wrap:wrap}
.sidebar+.inner-page-box-r{width:100%;padding-left:0;margin-top:30px}
.sidebar button { width: 100%;border-radius: 2px;border: 1px solid #eeee;background: #0a99d9;background: -webkit-linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);background: linear-gradient(90deg,#49c89a,rgb(10, 153, 217)100%);padding: 7px 0;color: #fff;}
.sidebar i{margin-left: 5px}
.sidebar ul {padding: 0;}
.sidebar li a {padding: 15px;}
/*首頁*/
.btn-style-box{margin-top:30px}
.index-about .container2{flex-wrap:wrap;-ms-flex-wrap:wrap}
.index-about article{width:80%}
.index-about article div.text-style{width:100%;padding:60px 30px 20px}
.index-about-title{right:auto;left:30px}
.index-about ul{margin-left:0;margin-top:50px;width:60%}
.about-o{font-size:10.5rem}
.index-about{margin-top:150px}
.index-news{padding:50px 0 100px;margin-top:180px}
.index-news-l{width:100%}
.index-news .container2{flex-wrap:wrap;-ms-flex-wrap:wrap}
.index-news ul{width:100%;margin-top:40px}
.index-cer-r {margin-top: 110px;}
.index-contact-box{flex-wrap:wrap;-ms-flex-wrap:wrap;padding:30px}
.index-contact-box .mjtitle{width:100%}
.index-contact-box ul{margin-top:40px}
.index-contact{padding:20px 0}
/*內頁*/
.inner-title p{font-size:6rem}
.inner-title h1{font-size:28px}
.inner-page {margin-top: -40px;}
.inner-bk::before {height: 80%;background-repeat: no-repeat;}
/*產品*/
.ps-header h2 {font-size: 25px;}
.pro-l{width:100%}
.pro-top{flex-wrap:wrap;-ms-flex-wrap:wrap}
.pro-r{width:100%;padding-left:0;margin-top: 10px;}

/*品質認證*/
.certGrid { background: url(../images/page/bk01.jpg) -22em 12em no-repeat;}
.certArea { display: block; margin-top: 3em;}
.certBox figure { max-width: 250px;}
.areaTxt>h2 { margin: 1.5em 0 10px -2em;  background: transparent;}
.areaTxt>h2:after {content: ''; background: rgba(255, 255, 255, .8);  width: 40%; height: 3px; margin-top: 10px; display: block;}
}
@media (max-width: 768px) { 
/*----banner---*/
.banner,.inner-banner{margin-top:90px}
.fitImg{margin-top:-110px}
.banner-text .sm-tt{display:none}
.banner-text h1{font-size:25px;line-height:35px;opacity:.9}
.banner-text{top:auto;bottom:20px;color:#333}
/*header*/
.logopic+figure {width: 200px;}
/*footer*/
.footer ul li,.conInfo ul li {width: 50%;}
.footer-info-top figure {width: 80px;margin-bottom: 10px;}
.footer-info-top span {font-size: 18px;}
/*首頁*/
.index-cer::before{width: 100%;}
.index-cer-box{flex-wrap:wrap;-ms-flex-wrap:wrap;-ms-flex-direction:column-reverse;flex-direction:column-reverse}
.index-cer-l{width:100%;padding-right:0;margin-top:0}
.index-cer-l figure+figure{margin-left: 30px;}
.index-cer-r{width:100%;margin-top:0;margin-bottom:30px}
.index-cer{margin-top:70px}
.index-cer .container2::before{width:calc(100% - 15px)}
.index-pro{margin-top:0}
.index-pro-box{margin-top: 20px;}
.about-o{font-size:8rem}
.index-about ul{margin-top:40px;width:70%}
.index-about ul li:nth-of-type(1){margin-top:0}
.index-about ul li:nth-of-type(3){margin-top:0}
.index-about ul li{width:calc(100% / 3 - 30px);margin:0 15px}
.index-news {padding: 50px 0;}
/*公司資訊*/
.modal-dialog{max-width: 90%;margin: 5rem auto 0;}
.modal-body {padding: 1rem;}
/*代理品牌*/
.proxyPic>* {  width: calc(100% / 2 - 14px);  margin: 0 5px 1rem;}

 /*產品*/
.inner-page{margin-top:-40px}
.inner-title p{font-size:5rem}
.inner-title h1{font-size:28px}
.inner-title{margin-bottom:40px}
.product-box{width:calc(100% / 2)}

/*包膜知識區列表*/
.knowledgeList { width: 100%; }
.knowledgeList .infoBox { padding: 10px 2.5em; font-size: 14px;}

/*圖文底層*/
.img-right,.img-left,.tx01 img{padding-bottom: 10px;}

/*品質認證*/
.certGrid{ background:none;}
.certTxt { text-align: left;}
.certTxt br{display: none}
.certBottom{flex-wrap: wrap;justify-content: space-between;margin-top: 60px;}
.certBottom figure{width: 30%;margin-right: initial;}

}

@media (max-width: 640px) { 
#goTop { display: block;width:100%;height: 50px; left:0; right:0; bottom:0; border-radius:0; border:0; border-top:1px solid #eee; }
/*banner*/
header .navbar {padding: 0 10px;}
.logopic{width:75px;padding:10px 8px 8px}
.logopic+figure{width:150px}
.fitImg {margin-top: -80px;width: 120%;margin-left: -20%;}
.banner {height: auto;/* overflow: initial; */}
.banner::before {display: none;}
.banner .item {width: 100%;/* margin-left: -20%; */}
.banner-text{left: 0;bottom: 0;position: relative;background-color:#0a99d9;padding:10px;margin-top:-20px;z-index: 10;text-align: center;color: #fff;}
.banner-text h1{font-size:20px;line-height:26px;margin-bottom:0;padding: 0;}
.banner-text h1::before{display: none}
/*footer*/
.footer {padding-bottom: 50px;}
.footer ul li,.conInfo ul li{width:100%}
.footer ul li+li{border-top:1px solid #868686;padding-top:15px}
.footer ul li{margin-bottom:10px;text-align:center}

/*首頁*/
.mjtitle {margin-bottom: 20px;}
.mjtitle p{font-size:25px}
.mjtitle span{font-size:4rem;top:-30px}
.text-style {font-size: 16px;}

.index-pro-box{margin-top:0;padding-bottom: 50px;}
.index-pro-box-tt .mjtitle+p br{display:none}
.move-bar {height: 70px;bottom: -40px;}
.index-pro-box a span{font-size:18px}
.btn-style{padding:8px 30px}
.index-about { margin-top: 100px;}
.index-about article{width:100%}
.index-about ul{width:100%;margin-top:20px}
.index-about-title>p{font-size:20px}
.bk-img-box{height:80%;top:auto;bottom:-100px}
.about-o{font-size:6rem;right:20px;top:-130px}
.index-news{margin-top:150px}
.index-news ul li a{flex-wrap:wrap;-ms-flex-wrap:wrap}
.index-news .date1{padding:1px 10px;border-radius:2px;margin-bottom:7px;background-color:#fff}
.index-news .list_title1{width:100%;margin-left:0}
.index-news ul li+li{margin-top:25px}
.index-news ul{padding:30px}
.index-news::before {background-attachment: initial;}

/*公司資訊*/
.boss{margin-bottom: 25px;}
.aboutGrid ul {width: 100%;}
.aboutGrid ul li { padding: 15px 10px 20px;}
.aboutGrid ul li span {letter-spacing: 0;}
.aboutGrid .btn-style-box {margin: 20px auto;}

/*產品介紹*/
.inner-page {margin-top: -20px; padding: 20px 20px 0;margin-bottom: 40px;}
.product-box {width: 100%;}
.inner-title p {font-size: 2.6rem;}
.inner-title h1{font-size: 25px;}
.inner-title {margin-bottom: 30px;}
.ps-header h2 {font-size: 22px;}
.pro-detail-text-t span {font-size: 20px;}
.img-thumb li {width: calc(100% / 3);}

/*最新消息*/
.post_head .date { width: 100%; line-height:normal;text-align: left; padding: 2px 10px; float: none;}
.post_head .title { width: 100%; padding: 10px 50px 0 10px;float:none;}

/*圖文底層*/
.img-right,.img-left{padding: 0 0 10px;}
.img-left img, .img-right img {max-width: 100%;}

/*聯絡我們*/
.conInfo ul li+li{border-top:1px solid #ccc;padding-top:15px}

}
@media (max-width: 550px) {
  .fitImg{margin-top:-50px}
  .index-pro-box-tt{margin-top:30px;margin-bottom: 20px;}

/*營業項目*/
.picBox { float: none; width: 80%; margin: 0 auto 2em;}
.picBox:after { bottom:-1em;}
}
@media (max-width: 480px) { 
/*banner*/
.banner,.inner-banner {margin-top: 78px;}
.banner-text h1 {padding: 0;font-size: 18px;}
/*header*/
.logopic{padding:8px}
.logopic+figure { width: 140px;margin-left: 5px;}
.logopic::before{height:5px;bottom:-5px}
header .navbar{padding:0}
.lang-top ul{padding-right:0}
/*footer*/
.footer-info-top figure {width: 60px;}
.footer {padding-top: 20px;}
/*首頁*/
.index-pro-box-tt .mjtitle+p br {display: none;}
.index-pro-box a {width: 100%;}
.index-about ul li {width: calc(100% / 3 - 10px); margin: 0 5px;padding: 10px 10px 20px;}
.index-about ul {margin-top: 10px;}
.index-news .list_title1 {font-size: 16px;}
.index-cer-l figure+figure{margin-left: 10px;}
.index-cer-l figure{width: 80%;margin:0 auto;}

/*代理品牌*/
.proxyGrid { display: block; }
.proxyGrid .aboutTxt+.aboutTxt { margin-left:0;}
.proxyPic>* { width: 100%;}
.aboutTxt{width:100%}
/*產品介紹*/
.breadCrumbs-block {display: none;}
.inner-page {padding-top: 50px;}
/*常見問題*/
.no-click-open .container {padding: 0;}
.no-click-open .item {margin:1em 0 1.5em 1.8em;letter-spacing: 0;}
.no-click-open .item .item-mark {width: 38px; height: 38px; line-height: 38px; font-size: 1rem; top: 0; left: -36px;}
.no-click-open .item .item-mark:after {top: 14px; left: 36px;}

/*品質認證*/
.certGrid{background: none}
.certArea { margin-top: 2em;}
.certBox {width: 100%; display: block;}
.certBox figure {width: 100%;max-width: inherit;}
.certBox figure+figure {margin: 2em 0;}
.certBox, .areaTxt { margin:0;}
.areaTxt>h2 { margin: 0 0 10px 0;}
.certBottom figure{width: 48%;}
}

@media (max-width: 400px) { 
/*公司資訊*/
.aboutGrid ul li { padding: 15px 4px 20px;  width: calc(100% / 3);}
.aboutGrid ul li span { font-size: .95rem; padding: 5px;}
}