@charset "utf-8";

/* CSS Document */
body{font-family:'Lora','Lato',sans-serif;font-size:15px;line-height:1.6;letter-spacing: 1px;color:#222}
a{color:#1a3851;text-decoration:none}
a:hover{color:#ddba8f;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}

/*---------------------- 基礎設定 ----------------------*/
/*反白設定
::selection { background: #666; color: #FFF; }
::-moz-selection { background: #666; color: #FFF; }
*/
.aleart_line{border-color: #d40023;}
.red{color: #d40023;}
figure{margin: 0}
:focus,.btn.focus,.btn:focus,button:focus,.page-link:focus{outline:none;box-shadow:none;border:none;}

/* 回頂端 */
#goTop{background:#ddba8f;text-align:center;position:fixed;bottom:100px;right:20px;width:40px;height:40px;cursor:pointer;display:none;-moz-border-radius:100%;-moz-box-shadow:#eee 0 0 5px;z-index: 9;}
.to-top{padding:1em;position:absolute;font-size:70%}
.to-top i{display:block;margin:8px auto 0;width:20px;height:20px;-webkit-transform:rotate(45deg) translate(-1px,1px);transform:rotate(45deg) translate(-1px,1px)}
.to-top i::before,.to-top i::after{content:'';position:absolute;top:0;left:0;-webkit-animation-duration:.5s;animation-duration:.5s}
.to-top i::before{width:15px;border-top:1px solid #fff;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.to-top i::after{height:15px;width:1px;border-left:1px solid #fff;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.to-top:hover i::before,.to-top:hover i::after{top:-5px;left:-5px;-o-transition:all .25s linear;-webkit-transition:all .25s linear;-moz-transition:all .25s linear;transition:all .25s linear}

/*RWD編輯器表格(X捲軸)*/
.table-container table td{min-width:100px;padding:5px;border:1px solid #ccc;white-space:inherit}
@media screen and (max-width: 768px) {
.table-container{width:100%;overflow-y:auto;_overflow:auto;margin:0 0 1em}
}

/*---------------------- 頁面開始 ----------------------*/
select,button{ -webkit-appearance: none!important;}
.btn-check:focus+.btn,.btn:focus {box-shadow: none;outline:none}
.navbar-toggler:focus { box-shadow: 0 0 0 0.1rem;}

/*全頁佈局*/
.wrapper {padding: 3rem 0 0;}

/*頁碼*/
.pagination{clear: both;margin: 1rem 0 3rem;justify-content: center;}
.pagination .page-link{color: inherit;background-color: transparent;border: 0;}
.page-item:first-child .page-link,.page-item:last-child .page-link{background:transparent}
.pagination .page-item.active, .pagination .page-link:hover{font-weight: bold;}
.page-item.active .page-link{background:#ddba8f;font-weight: normal}

/*麵包屑*/
.breadcrumb{background:inherit;font-size: .95rem;padding: 1rem 0 10px;border-radius: 0;justify-content: flex-end;border-bottom: 1px solid #e4e4e4;font-family: 'Open Sans',sans-serif;}
.breadcrumb li{padding-right: 15px;position:relative;}
.breadcrumb li:after{content:'/';position:absolute;right: 0;color: #b7b7b7;}
.breadcrumb-item+.breadcrumb-item::before {display:none}
.breadcrumb li.active{color: #ca9f6c;padding-right: 0;}
.breadcrumb li.active:before,.breadcrumb li.active:after{display:none;}

/*主選單*/
.navbar{background:rgba(255 255 255 / 0.9);font-family:'Open Sans',sans-serif;font-weight: bold;}
.logo img{max-width:250px;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}
.navbar .navbar-nav .nav-link{padding: 10px 20px 0;letter-spacing:2px;text-transform: uppercase;font-size: .95rem;}
.navbar .navbar-nav .nav-item.active .nav-link{color:#ddba8f}
.navbar .nav-item{position:relative}
.navbar.fixed{box-shadow:0px 0px 15px rgb(0 0 0 / 0.2);}
.fixed .logo img {max-width: 200px;}
.navbar-toggler{border: 1px solid #1a3851;border-radius:0;}

/*banner*/
.ixBanner{width: 90%; margin: 105px auto 30px;}
.banner{margin-top:98px;position:relative;}
.carousel{max-width:100%;}
.carousel:hover .carousel-control{display:block}
.carousel .controls a{opacity:0}
.carousel:hover .controls a{opacity:1}
.carousel-control-next,.carousel-control-prev{width:10%}
.carousel-control-next-icon,.carousel-control-prev-icon{width:30px;height:60px}
.carousel-control-next-icon{background:url(../images/all/control-icon.png) -30px 0 no-repeat}
.carousel-control-prev-icon{background:url(../images/all/control-icon.png) 0 0 no-repeat}
.carousel .carousel-item,.carousel .carousel-item.active,.carousel .carousel-inner{height:100%}
.carousel-indicators li{height:12px;width:12px;border-radius:100%}
.carousel .fill{width:100%;height:100%;position:relative}

/*footer*/
footer{clear: both; background: #1a3851;color:#fff;padding:20px 0 0;text-align:center;}
footer .logo {display: inline-block;}
footer ul{margin: 10px;padding-left:0;list-style:none;}
footer ul li{display:inline-block;padding: 10px 20px;}
footer ul li:first-child { width: 100%;}
footer ul:before {content: '';background: rgba(206 176 139 / 30%);width: 80%;height: 1px;display: block;margin: 0 auto;}
footer li a+a:before {content: '/';color: rgba(255 255 255 / 0.4);margin: 0 5px;}
footer a{color: rgba(255,255,255,.75);}
footer a:hover{color:rgba(255,255,255,1); text-decoration:none;}
.copyright{background:#102c44;color:rgba(255 255 255 / 0.4);padding:10px;font-size:13px}
.copyright a{color:rgba(255 255 255 / 0.4);}

/*標題*/
.mjTit{text-align: center;margin-bottom: 1rem;color: #0c4f88;font-size: 2rem;font-family:'Open Sans',sans-serif;font-weight: bold;}
.pageTit {text-align: center;position: relative;margin-bottom:3rem;}
.pageTit h1{color: #0c4f88;font-size: 2rem;font-family: 'Open Sans',sans-serif;font-weight: bold;}
.move-bar{position:absolute;height: 1px;bottom: -15px;left:calc(50% - 50px);width:100px;}
.move-bar::before{position:absolute;content:'';width:100px;height:100%;left:50%;transform:translateX(-50%);background:#ddba8f}
.move-bar::after{position:absolute;content:'';width:10px;height:10px;left:50%;top:-4px;transform:translateX(-50%);border-radius:60px;background-color:#ddba8f;-webkit-animation:bannerAnimation 3s cubic-bezier(.25,.46,.45,.94) infinite;animation:bannerAnimation 3s cubic-bezier(.25,.46,.45,.94) infinite alternate}
@-webkit-keyframes bannerAnimation {
0%{left:0}
100%{left:100%}
}
@keyframes bannerAnimation {
0%{left:0}
100%{left:100%}
}

/*按鈕*/
.btnWrap{margin-top:2rem;text-align:center;clear:both}
.btn_style{margin:10px;padding:8px 25px;border:1px solid #ccc;position:relative;background:rgba(255 255 255 / 0.6);font-family:'Open Sans',sans-serif;z-index:1;font-size:15px}
.btn_style svg{margin:-3px 6px 0 -10px;color:#828080}
.btn_style:hover{color:#1a3851;background:#fff}
.btn_style:after,.btn_style:before{content:'';display:block;width:15px;height:15px;position:absolute;transition:all .3s ease-in-out}
.btn_style:after{top:-1px;left:-1px;border-top:1px solid transparent;border-left:1px solid transparent}
.btn_style:before{right:-1px;bottom:-1px;border-bottom:1px solid transparent;border-right:1px solid transparent}
.btn_style:hover:after,.btn_style:hover:before{width:100%;height:100%;border-color:#1a3851}
.btn_style1{margin:10px;padding:8px 25px;border:1px solid #ddba8f;position:relative;background:#ddba8f;color:#fff;font-family:'Open Sans',sans-serif;z-index:1;font-size:15px}
.btn_style1:hover{background:#1a3851;color:#fff;border-color:#1a3851}
.formGrid .btn_style1{border-color:#fff;background:#1a3851;color:#fff;display:inline-block}
.formGrid .btn_style1:hover{background:#fff;color:#1a3851;border-color:#ccc}

/*首頁-產品介紹*/
.ix-pd{overflow:hidden; margin-top: -7%; padding: 8% 0 2rem;background: url(../images/all/sprinkles.png);}
.ix-pd .item{text-align:center}
.ix-pd .item .itemPic{position:relative;overflow:hidden;background: #fff;border: 1px solid #f3f3f3;}
.ix-pd .item .itemPic img{-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease}
.ix-pd .item a:hover .itemPic img{transform:scale(1.05,1.05)}
.ix-pd .item .slickInfo .prTit{font-size:1.2rem;letter-spacing:2px;padding-top:1rem;font-family: 'Open Sans',sans-serif;font-weight: bold;color:#0f3c61;}
.ix-pd .item .slickInfo>p {font-size:15px;color: #505050;}
.ix-pd .item a:hover .prTit{color:#1a3851}

/*首頁區塊*/
.index article>p{font-size:1.5rem;letter-spacing:2px;font-family:'Open Sans',sans-serif;margin-bottom:2rem}
.index article{width:68%;margin:0 auto;text-align:left;line-height:1.3}
.index small{font-size:15px;line-height:1.6}
.btn_index{border-radius:30px;border:1px solid #333;color:#333!important;padding:18px 20px;font-size:.8rem;font-weight:bold;font-family:'Open Sans',sans-serif;display:flex;position:relative;z-index:1;overflow:hidden;width:225px;margin:0 auto}
.btn_index:before{content:'';background:rgba(221 186 143 / 70%);width:54px;height:54px;position:absolute;z-index:-1;left:0px;top:0px;border-radius:100%;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}
.btn_index>i{position:absolute;right:10px;top:14px;font-size:1rem}
.btn_index:hover:before{left:calc(100% - 54px)}


/*首頁-關於我們(Who Are We?)*/
.ixAbout{padding: 5em 0 0;text-align: center;max-height: 450px;overflow: hidden;}
.ixAbout .mapBg {position: relative;z-index: -1;}

/*首頁-service(What We Do?)*/
.ixServices{padding-top:6rem;background:url(../images/index/service.jpg) center bottom no-repeat #e2e1e6;min-height:450px;position:relative}
.ixServices:before{content:'';background:rgba(255 255 255 / 80%);position:absolute;width:100%;height:100%;top:0;left:0}
.ixServices .container{position:relative;z-index:1;max-width:100%;padding:0}
.ixServices article>p{text-align:center}
.ixServices .btn_index:before{background:#fff}


/*產品介紹-次選單*/
.subMenu{width:100%;white-space:nowrap;overflow:auto;text-align:center}
.subMenu ul{padding:1rem 0 0;margin:0;list-style:none;justify-content:center}
.subMenu ul>li{display:inline-block}
.subMenu ul>li a span{border:1px solid #bdbdbd;padding:8px 20px;font-family:'Open Sans',sans-serif;display: block;width: 165px;overflow: hidden;margin: 10px 5px;}
.subMenu ul>li .active span{background:#1a3851;color:#fff;border-color:#1a3851}

/*產品介紹-大類*/
.pdCategory,.pdList{display:flex;flex-wrap:wrap;min-height:100px}
.pdCategory .pd_item{width:calc(100% / 4 - 23px);margin-bottom:2em;margin-right:30px;position:relative;text-align:center;overflow:hidden;transition:all .5s}
.pdCategory .pd_item:nth-child(4n){margin-right:0}
.pdCategory .pd_item:nth-child(4n+1){clear:both}
.pdCategory .pd_item a .content h3{font-weight:700;display:-webkit-box;white-space:normal;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-size:1rem;letter-spacing:1px;padding:10px;border:1px solid #d8d8d8;border-top:3px solid #ddba8f;font-family:'Open Sans',sans-serif}
.pdCategory .pd_item a .photo{position:relative;overflow:hidden}
.pdCategory .pd_item a .photo:before{content:'';position:absolute;left:0;bottom:0;width:100%;height:100%;background:rgb(0 0 0 / 60%);z-index:1;opacity:0;transition:all .5s}
.pdCategory .pd_item a .photo p{position:absolute;top:55%;left:50%;transform:translateX(-50%);color:#fff;border:1px solid #fff;padding:5px 10px;transition:all .5s;opacity:0;z-index:2}
.pdCategory .pd_item a .photo picture{display:block}
.pdCategory .pd_item a .photo picture img{max-width:100%;transition:all .5s ease}
.pdCategory .pd_item a:hover .photo:before{opacity:1}
.pdCategory .pd_item a:hover .photo picture>*{transform:scale(1.1)}
.pdCategory .pd_item a:hover .photo p{top:40%;opacity:1}

/*產品介紹-列表*/
.pdList .pd_item{width:calc(100% / 3 - 20px);margin-bottom:2em;margin-right:30px;position:relative;text-align:center;overflow:hidden;z-index:1;transition:all .5s}
.pdList .pd_item:nth-child(3n){margin-right:0}
.pdList .pd_item:nth-child(3n+1){clear:both}
.pdList .pdPic{width:90%;overflow:hidden;margin:1rem auto 0;box-shadow:0 0 6px #f0f0f0;border:5px solid #fff}
.pdList .pdPic img{max-width:100%;transition:all .5s ease}
.pdList .pdTxt{padding:10px 0}
.pdList .pdTxt h3{padding:1rem 0 0;font-size:1rem;letter-spacing:2px;font-weight:bold;color:#0f3c61;font-family:'Open Sans',sans-serif}
.pdList .pdTxt>p{color:#5d5d5d}
.pdList .pd_item:hover .pdPic img{transform:scale(1.05,1.05)}
.pdList .pdTxt:after{content:'';background:#f3f3f3;width:100%;height:0;display:block;position:absolute;bottom:0;z-index:-1;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease}
.pdList .pd_item:hover .pdTxt:after{height:30%}
.pdList .pd_item:hover .pdPic{box-shadow:0 2px 6px #d2d2d2}

/*產品介紹-底層頁*/
.productDtl .product-img{float:left;width:50%;overflow:hidden;position:sticky;top:100px;margin-bottom:3rem}
.productDtl .pdInfo{padding:2rem 0 4rem 3rem;overflow:hidden}
.pdTit{font-size:2rem}
.pdBtn,.productPage .mobBox{display:none}

/*放大鏡*/
.img-focus{position:relative;}
.img-focus figure{position:absolute;top:10px;bottom:10px}
.img-focus img{position:relative;max-width:100%}
.xzoom-gallery{margin-left: 0!important;}

/*我要詢價表單*/
.mesg-pop-wrap{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.4);z-index:9999}
.mesg-pop-wrap.in{display:block}
.mesg-pop{width:90%;max-width:600px;background:#fff;border-radius:6px;padding:40px;border:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;max-height:90vh;overflow-y:auto}
.mesg-pop-close{width:25px;line-height:40px;font-size:3rem;color:#aaa;display:table;margin:-1rem 0 -1rem auto;cursor:pointer}
.mesg-pop-close:hover{color:#444}
.inquiryItem{display:flex;align-items:center;background:#f5f5f5;box-shadow:0 0 8px #eaeaea inset;padding:10px;margin-bottom:1rem}
.inqPic{width:100px;margin-right:1rem}
.inqTit{font-size:1.2rem;letter-spacing:3px;font-weight:700;margin:0}
.modal-title{font-size:1.2rem;font-weight:700;color:#1a3851;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid #dee2e6}
.modal-title>span{display:block;font-weight:400;color:#484848;font-size:1rem;margin-top:10px}
form .input{width:48%;float:left;position:relative;z-index:1;display:inline-block;vertical-align:top}
form .input:nth-child(even){float:right}
.input__field{position:relative;display:block;float:right;padding:.8em;width:60%;border:none;border-radius:0;background:#fff;color:#aaa;font-weight:700;-webkit-appearance:none}
.mesg-pop-wrap form .input:nth-of-type(1) .input__field,.mesg-pop-wrap form .input:nth-of-type(7) .input__field{border-bottom:none;font-weight:normal}
.input__field:focus{outline:none;background:transparent}
.input__label{display:inline-block;float:right;padding:0 1em;width:40%;font-size:70.25%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.input__label-content{position:relative;display:block;padding:1em 0 0;width:100%;font-size:16px;color:#333}
.graphic{position:absolute;top:0;left:0;fill:none}
input:-internal-autofill-selected,input:focus{background-color:transparent!important}
.input--hoshi{overflow:hidden}
.input__field--hoshi{margin-top:0;padding:3em .15em 1em;width:100%;background:transparent;color:#000;line-height:30px;text-align:left}
.input__label--hoshi{position:absolute;bottom:0;left:0;padding:0 .25em;width:100%;height:100%;text-align:left;pointer-events:none}
.input__label-content--hoshi{position:absolute;background:#fff}
.input__label--hoshi::before,.input__label--hoshi::after{content:'';position:absolute;top:0;left:-1px;width:100%;height:100%;border-bottom:1px solid #a5a5a5}
.input__label--hoshi::after{margin-top:2px;border-bottom:4px solid #4e4e4e;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);-webkit-transition:-webkit-transform .3s;transition:transform .3s}
.input__label--hoshi-color-3::after{border-color:#ddba8f}
.input__field--hoshi:focus+.input__label--hoshi::after,.input--filled .input__label--hoshi::after{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
.input__field--hoshi:focus+.input__label--hoshi .input__label-content--hoshi,.input--filled .input__label-content--hoshi{-webkit-animation:anim-1 .3s forwards;animation:anim-1 .3s forwards}
.page_form{clear:both;padding-top:1rem;overflow:hidden}
@-webkit-keyframes anim-1 {
50%{opacity:0;-webkit-transform:translate3d(1em,0,0);transform:translate3d(1em,0,0)}
51%{opacity:0;-webkit-transform:translate3d(-1em,-10%,0);transform:translate3d(-1em,-10%,0)}
100%{opacity:1;-webkit-transform:translate3d(0,-10%,0);transform:translate3d(0,-10%,0)}
}
@keyframes anim-1 {
50%{opacity:0;-webkit-transform:translate3d(1em,0,0);transform:translate3d(1em,0,0)}
51%{opacity:0;-webkit-transform:translate3d(-1em,-10%,0);transform:translate3d(-1em,-10%,0)}
100%{opacity:1;-webkit-transform:translate3d(0,-10%,0);transform:translate3d(0,-10%,0)}
}
.required_txt{color:#757575;font-weight: bold}

/*聯絡我們*/
.formGrid {width: 80%;margin: 0 auto;text-align: center;}
.formGrid .input__field {font-weight: normal;}
.formGrid form {padding:1rem 2rem;margin-top:2rem;box-shadow: 0 0 10px #ccc;}

/*內頁*/
.subTit{font-size: 2rem;margin-bottom:1rem;color:#b88f5c;font-family: 'Open Sans',sans-serif;font-weight: bold;}
.subTit1{font-size: 2rem;margin-bottom:1rem;color:#0c4f88;font-family: 'Open Sans',sans-serif;font-weight: bold;text-align: center}

/*關於我們*/
.aboutGrid{width:68%;margin:0 auto 3rem}
.hotTxt{font-size:1.5rem;letter-spacing:2px;font-family:"Open Sans",sans-serif;line-height:1.3;margin-bottom:1rem}
article>p{font-size:15px;margin-bottom:2rem}
.aboutBg{padding:2rem 0;text-align:center;background:url(../images/about/bg.jpg) center center no-repeat #777878;position:relative;background-attachment:fixed;min-height:350px}
.aboutBg:before{content:'';background:rgba(0 0 0 / 50%);position:absolute;width:100%;height:100%;top:0;left:0}
.aboutBg p{width:68%;padding:0;color:#fff;margin:0 auto;overflow:hidden;height:350px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1;font-size:1.5rem;font-family:"Open Sans",sans-serif}
.apartBox{padding-top:4rem}
.apartBox ul{list-style:none;padding:0;display:flex}
.apartBox ul>li{width:calc(100% / 3);font-size:.95rem;background:#f4f4f4;padding:1rem;border:1px solid #e4e4e4;margin:3rem 2rem 2.5rem 0;border-radius:20px}
.apartBox ul>li:last-child{margin-right:0}
.apartBox ul>li h3{font-size:1.3rem;letter-spacing:3px;line-height:1.5;font-family:'Open Sans',sans-serif;font-weight:700;margin-bottom:2rem;color:#bd8c56}
.apartBox ul>li:nth-child(2) h3{color:#39698b}
.apartBox ul>li:nth-child(3) h3{color:#36754f}
.apartBox ul>li p{font-size:15px;margin-bottom:0}

/*服務項目*/
.serviceGrid{width:68%;margin:0 auto}
.serviceOEM{padding:2rem 0;text-align:center;background:url(../images/service/oemBg.jpg) center center no-repeat #777878;position:relative;background-attachment:fixed;height:482px;display:flex;align-items:center;color:#fff}
.serviceOEM:before{content:'';background:rgba(0 0 0 / 55%);position:absolute;width:100%;height:100%;top:0;left:0}
.serviceOEM h3{font-size:2rem;position:relative;margin-bottom:1rem;font-family:'Open Sans',sans-serif}
.serviceOEM p{display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.chartBox{padding:2rem 0;height:482px;display:flex;align-items:center}
.chartBox ol{display:flex;flex-wrap:wrap;margin:0;padding:0}
.chartBox ol>li{width:calc(100% / 3 - 54px);list-style:none;border:1px solid #959391;border-radius:10px;padding:2rem;text-align:center;margin:15px 80px 15px 0}
.chartBox ol>li:nth-child(3n){margin-right:0}
.chartBox ol>li:first-child{border:none;font-size:1.3rem;font-weight:bold;font-family:'Open Sans',sans-serif}
.chartBox ol>li span{display:block;font-size:1.5rem;font-weight:bold;margin-bottom:10px;font-family:'Open Sans',sans-serif}
.chartBox ol ul{margin:0;padding-left:10px;list-style:disc;text-align:left}
.chartBox ol ul>li+li{margin-top:10px}
.oemBox{background:#416582;color:#ddccba}
.odmBox{background:#DDCCBA;color:#184c78}
.odmBox ol>li{border:1px solid #b8aca0}
.offerBox{padding:3rem 0 2rem}
.offerBox ul{display:flex;flex-wrap:wrap;list-style:none;padding:0}
.offerBox ul>li{width:calc(50% - 15px);font-size:.95rem;padding:1rem 3.5rem 1rem 1rem;border:1px solid #e4e4e4;margin:1rem 30px 1rem 0;position:relative}
.offerBox ul>li:nth-child(2n){margin-right:0}
.offerBox ul>li h3{font-size:1.4rem;letter-spacing:3px;line-height:1.5;font-family:'Open Sans',sans-serif;margin-bottom:1rem}
.offerBox ul>li p{font-size:15px;color:#6e6e6e;margin-bottom:0}
.offerBox ul>li:before{content:'';width:100px;height:100px;display:block;position:absolute;right:0;bottom:5px;opacity:.3}
.offerBox ul>li:nth-child(1):before{background:url(../images/service/offer1.png) right bottom no-repeat}
.offerBox ul>li:nth-child(2):before{background:url(../images/service/offer2.png) right bottom no-repeat}
.offerBox ul>li:nth-child(3):before{background:url(../images/service/offer3.png) right bottom no-repeat;bottom:50px}
.offerBox ul>li:nth-child(4):before{background:url(../images/service/offer4.png) right bottom no-repeat;bottom:40px}
.decorationList{transition:all .5s;padding:3em 0;position:relative}
.decorationList:before{position:absolute;content:'';width:80%;height:75%;background:#efefef;top:0;left:0}
.decorationList:nth-child(2n):before{left:auto;right:0;background:#f7f7f7}
.decorationList figure{position:relative;width:40%;z-index:9;margin:0}
.decorationList figure span{position:absolute;top:calc(50% - 58px);left:50%;transform:translate(-50%,60%);color:#fff;transition:all .5s;opacity:0;font-size:2rem;z-index:10;padding:5px 13px;border-radius:100%;background:#0db7ec;background:-moz-linear-gradient(left,rgba(13,183,236,1) 1%,rgba(103,222,210,1) 100%);background:-webkit-linear-gradient(left,rgba(13,183,236,1) 1%,rgba(103,222,210,1) 100%);background:linear-gradient(to right,#0db7ec 1%,#67ded2 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0db7ec',endColorstr='#67ded2',GradientType=1)}
.decorationList .box-info{position:relative;width:60%;padding:0 1em 1em 1em}
.decorationList .box-info h3{font-size:1.3rem;position:relative;margin:1em 0;letter-spacing:1px;line-height:1.4;font-weight:700;font-family:'Open Sans',sans-serif}
.decorationList .box-info h3:after{content:'';background:#aeaeae;display:block;width:60px;height:1px;margin:10px 0;transition:all .5s}
.decorationList .box-info p{padding-left:1.5rem}
.decorationList:nth-child(2n) .box-info{padding-left:0}
.decorationList:hover .box-info:after{width:100%;left:0}
.decorationList:hover .box-info h3:after{width:30%}

/*--------------------------------------------------*/
@media screen and (min-width: 992px) {
/*主選單*/    
.navbar .nav-item:after{position:absolute;display:block;bottom:-5px;left:33%;right:33%;height:1px;content:"";background:0 0;z-index:-1;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}
.navbar .nav-item:hover:after,.navbar .nav-item.active:after{left:0;right:0;background:#ddba8f;z-index:1}
}
/*--------------------------------------------------*/
@media screen and (max-width: 1600px) {
/*首頁*/
.ixBox {margin-top: -28%}     
}

@media screen and (max-width: 1200px) {
.index article,.aboutGrid,.aboutBg p,.serviceGrid {width: 80%;}
    
/*產品底層*/
.productDtl .product-img{width:60%;float:none;margin: 0 auto 3rem;position:static;text-align:center}
.productDtl .pdInfo{width: 90%;margin: 0 auto;padding:0 0 4rem;}    
    
/*關於我們*/    
.apartBox ul>li h3{font-size:1.2rem;margin-bottom: 1rem;} 
        
}


@media screen and (max-width: 991px) {
.wrapper {padding-top: 2rem}       
    
/*主選單*/
.navbar-collapse{border-top:1px solid #ccc;margin-top:10px;padding-bottom:10px} 
.navbar .navbar-nav .nav-link{padding:0}
.navbar .navbar-nav .nav-item{padding:20px 20px 10px}
    
/*標題*/
.ixContact .mjTit { font-size: 1.4rem;}
    
/*首頁*/
.index article>p,.hotTxt {font-size: 1.2rem;}
   
/*產品列表*/
.productPage .breadcrumb>li:last-child{display:none}
.productPage .breadcrumb li:nth-last-child(2){padding-right:0}
.productPage .breadcrumb li:nth-last-child(2):after{display:none}    
.subMenu .btn_style {margin: 10px 5px;}    
.pdCategory .pd_item,.pdList .pd_item{width:calc(100% / 2 - 15px);}
.pdCategory .pd_item:nth-child(4n),.pdList .pd_item:nth-child(3n){margin-right:30px}
.pdCategory .pd_item:nth-child(2n),.pdList .pd_item:nth-child(2n){margin-right:0}
.pdCategory .pd_item:nth-child(2n+1),.pdList .pd_item:nth-child(2n+1){clear:both}  
.pdCategory .pd_item:nth-child(4n+1),.pdList .pd_item:nth-child(3n+1){clear:inherit}    
   
/*產品底層*/
.productPage .subMenu,.productPage .pcBox{display: none}
.productDtl .product-img{width: 90%;margin-bottom: 1rem;}  
.productPage .mobBox{display: block}
.productPage .mobBox .img-focus img{ max-width:100%; width:100%; display:block;}
.productPage .mobBox .img-focus { text-align: center; position:relative;  border:1px #ddd solid;}
.productPage .mobBox .img-thumb { list-style:none; padding:0; margin:.5em 0; overflow:hidden; margin-right:-1.3%;}
.productPage .mobBox .img-thumb li {float:left;width: calc(20% - 11px);margin: 10px 5px;}
.productPage .mobBox .img-thumb li img {max-width:100%;border:1px #ddd solid;}  
.pdBtn{display: block}
    
/*關於我們*/    
.apartBox ul{display:block;margin-bottom:3rem}
.apartBox ul>li{width:100%;margin-bottom:2rem}
.apartBox ul>li+li{margin-top:0rem}
.apartBox ul>li h3 br{display:none}
.apartBox{padding-top:2rem}
    
/*服務項目*/
.chartBox{height:auto;min-height:482px}
.chartBox ol>li{margin-right:40px;width:calc(100% / 3 - 27px);padding:1.5rem}
.offerBox{padding-bottom:0}
.offerBox ul>li{width:100%;margin-right:0}
.decorationList{padding-bottom:1rem}
.decorationList>*{width:100%!important}
.decorationList .parallax,.decorationList .parallax01{transform:none!important}
.decorationList:before{height:40%}
.decorationList .box-info{padding:0}
.decorationList .box-info h3{margin:1rem 0 0}
.decorationList .box-info p{padding-left:0}
    
/*聯絡我們*/
.formGrid {width: 100%;}    
}

@media screen and (max-width: 767px) {
/*首頁*/
.ixAbout p { letter-spacing: .5px;}    
    
/*產品底層*/    
.btnArea{flex-wrap:wrap}
.btnArea a:first-child,.btnArea .downloadBtn{width:100%}
.btnArea a{width:calc(50% - 20px);text-align:center}    
    
/*我要詢價表單*/
form .input{width:100%;float:none;}
form .input:nth-child(even){float:left}    
.mesg-pop {padding: 15px;}  
    
/*關於我們*/
.aboutBg p br{display: none}
    
/*服務項目*/
.chartBox ol>li {width: calc(50% - 20px);}
.chartBox ol>li:nth-child(3n){margin-right:40px}
.chartBox ol>li:nth-child(2n){margin-right:0}
}

@media screen and (max-width: 640px) {
footer{ padding-bottom:3rem;}
.copyright a{display: block}
#goTop{width:100%;height: 50px; left:0;right:0;bottom:0;border-radius:0;border:0;background: #ddba8f;}
.to-top i { margin-top: 15px}
.to-top i::before,.to-top i::after{border-color: #1a3851;}    
    
/*首頁*/
.ix-pd {margin-top: -4%;padding: 2rem 0;}
.slick-prev, .slick-next { display:none!important}
.ixAbout {padding: 3em 0 0;}
.index article>p {margin-bottom: 1rem;}
.ixServices {padding-top: 4rem;background-attachment: inherit;min-height: 480px;}
 
/*麵包屑*/
.breadcrumb { font-size: 14px;} 
  
.aboutBg{background-attachment: inherit;background-position: 80% bottom;}    
.serviceOEM{background-attachment: inherit}
}

@media screen and (max-width: 576px) {
/*banner*/
.carousel-indicators {bottom: -10px;}        
.index article,.aboutGrid,.aboutBg p,.serviceGrid{ width: 90%;}
    
/*產品介紹*/
.pdCategory .pd_item,.pdList .pd_item,.pdList .pd_item:nth-child(3n){width:100%;margin-right:0}
}

@media screen and (max-width: 480px) {
/*主選單*/
.logo img {max-width: 200px;}
.ixBanner,.banner {margin-top:85px}  

/*服務項目*/
.chartBox ol>li {width:100%;margin-right:0!important}
.chartBox ol>li:first-child { padding: 0;}
.chartBox ol>li:first-child br {display: none;}
.chartBox ol ul {text-align: center;list-style: none;}
.chartBox ol ul>li+li {  border-top:1px solid rgba(24 76 126 / 20%); padding-top: 5px; margin-top: 5px;}
}

@media screen and (max-width: 410px) {
footer ul li a+a {display: block;}
footer li a+a:before { display: none;}
    
/*我要詢價表單*/    
.input__label-content {font-size: 15px;letter-spacing: -0.5px;}        
}