﻿@charset "utf-8";

/* 阿拉伯語言 -- 由左到右測試 */
html[data-direction=rtl] *{direction: rtl!important;text-align: inherit!important;}
html[data-direction=rtl] .logo-page {padding: 0 0 0 30px;}
@media  (max-width:991.98px) {
html[data-direction=rtl] .mobile-menu-position-left .layout-navbar-box{justify-content: flex-start;}
html[data-direction=rtl] .mobile-menu-position-right .layout-navbar-box{justify-content: flex-end;}
}
html[data-direction=rtl] .mobile-menu-position-right .language-page .language-group:hover .dropdown-menu { left: 0px;right: auto;}
html[data-direction=rtl] .language-page .language-btn i{margin-right: 0px;margin-left: 6px;}
@media (max-width: 991.98px){
html[data-direction=rtl] .language-page .language-btn i {    margin-right: 0px;margin-left: 0px;height: 26px;}
}
html[data-direction=rtl] .submenu-body.submenu-body-fluid{direction: ltr!important;}

html[data-direction=rtl] .area_title_box {text-align: center!important;}
html[data-direction=rtl] .one-page-btn-page {text-align: center!important;}

html[data-direction=rtl] .image_01_page .tp-loop-wrap{direction: ltr!important;}
html[data-direction=rtl] .image_02_page .tp-loop-wrap{direction: ltr!important;}
html[data-direction=rtl] .image_03_box .c-content-overlay .c-overlay-wrapper{text-align: center!important;}
html[data-direction=rtl] .image_04_body .button-page .layer-3{margin-right: 0px;margin-left: 10px;}
html[data-direction=rtl] .image_04_body .button-page .layer-4{margin-right: 0px;margin-left: 10px;}
html[data-direction=rtl] .image_05_page .tp-loop-wrap{direction: ltr!important;}
html[data-direction=rtl] .image_06_page .nivo-controlNav{text-align: center!important;}
html[data-direction=rtl] .image_07_page .owl-theme .owl-dots {text-align: center!important;}

html[data-direction=rtl] .type_01_page .description-page {text-align: center!important;}
html[data-direction=rtl] .type_09_page .description-page {text-align: center!important;}
html[data-direction=rtl] .type_09_page .owl-theme .owl-dots {text-align: center!important;}
html[data-direction=rtl] .type_10_one_box .photo_box::before{border-left: 250px solid;    left: 0px;    border-left-color: #31383c;    border-right: 0px solid;}
html[data-direction=rtl] .type_10_one_box:nth-child(even) .photo_box::before {border-right: 200px solid;    border-right-color: #f8f9f9;    right: 0px;border-left: 0px solid;}
html[data-direction=rtl] .type_11_one_box .photo_box::before{border-right: 250px solid;    right: 0px;    border-right-color: #31383c;    border-left: 0px solid;}
html[data-direction=rtl] .type_11_one_box:nth-child(even) .photo_box::before{    border-left: 250px solid;    left: 0px;    border-left-color: #f8f9f9;    border-right: 0px solid;}

html[data-direction=rtl] .photo_03_page .owl-style-b.owl-theme .owl-nav .owl-prev{order: 1!important;}
html[data-direction=rtl] .photo_04_page .owl-theme .owl-dots {text-align: center!important;}
html[data-direction=rtl] .photo_04_page .owl-style-b.owl-theme .owl-nav .owl-prev{order: 1!important;}
html[data-direction=rtl] .photo_05_page .tp-thumbs{direction: ltr!important;}
html[data-direction=rtl] .photo_06_page .tp-loop-wrap{direction: ltr!important;}
html[data-direction=rtl] .photo_09_page .owl-theme .owl-dots {text-align: center!important;}
html[data-direction=rtl] .photo_10_page .owl-theme .owl-dots {text-align: center!important;}
html[data-direction=rtl] .photo_11_page .owl-theme .owl-dots {text-align: center!important;}

html[data-direction=rtl] .news_01_one_box .btn-item:after{margin-left: 0rem; margin-right: 1rem;}
html[data-direction=rtl] .video_06_one_box .description-page{text-align: center!important;}

html[data-direction=rtl] .sub-module-title-page .module-title h1,
html[data-direction=rtl] .sub-module-title-page .module-title h3, 
html[data-direction=rtl] .sub-module-title-page .module-title .h3{padding-right: 0px;padding-left: 20px;font-size: 1.5rem;}
html[data-direction=rtl] .sub-module-title-page .module-sharing{    padding-left: 0px;   padding-right: 20px;  margin-right: auto;margin-left: initial;}
html[data-direction=rtl] .about-layout.about-detail .about-name::before{    margin-right: 0rem;    margin-left: .45rem;}
html[data-direction=rtl] .category-heading{border-right-width: 5px;    border-right-style: solid;    border-right-color: #004986;    padding-right: 0.5rem;    border-left: none;}

html[data-direction=rtl] .wb-inquiry-btn-group .wb-inquiry-btn-add{    margin-right: 0px;    margin-left: 10px;}
html[data-direction=rtl] .toolbar-products .sorter{margin-left: 0!important;    margin-right: auto!important;}
html[data-direction=rtl] .toolbar-products .modes{border-right: 0px solid rgba(222, 222, 222, 1);    margin-right: 0px;    border-left: 1px solid rgba(222, 222, 222, 1);    margin-left: 15px;    padding-left: 15px;}
html[data-direction=rtl] .toolbar-products .pages ul li a{    text-align: center!important;}
html[data-direction=rtl] .toolbar-products .commands{border-right: 0px solid rgba(222, 222, 222, 1);    border-left: 1px solid rgba(222, 222, 222, 1);    padding: 0 0 0 10px;    margin-right: 0px;    margin-left: 20px;}
html[data-direction=rtl] .form-check{    padding-right: 1.25rem;}
html[data-direction=rtl] .form-check-input{    margin-right: -1.25rem;}

/* 阿拉伯語言 --選單 -- 由左到右測試*/
/*html[data-direction=rtl] .menu-b .divMenu-list .divMenu-list-items{float: right;}
html[data-direction=rtl] .menu-b .divMenu-list {float: right;}
html[data-direction=rtl] .menu-b .divMenu-list li {float: right;}*/
html[data-direction=rtl] .divMenu-list{direction: ltr!important;}
html[data-direction=rtl]  .header-M9-1 .submenu-page{left: 0;}
html[data-direction=rtl]  .header-M9-03 .submenu-page{left: 0;}
html[data-direction=rtl]  .header-M9-04 .submenu-page{left: 0;}

/* CSS Document */
html{font-size: 16px!important;}
html, body {padding: 0;margin: 0;height: 100%;width: 100%;}
body { font-size:1rem!important; color: #333;line-height: 1.5!important; font-family: "SF Pro TC","SF Pro Display","PingFang TC","微軟正黑體","Microsoft JhengHei", "Lucida Grande", Arial, Helvetica, sans-serif;letter-spacing: -0.01rem;margin: 0;padding: 0; }
a { color: #333; cursor: pointer; }
a:focus { outline: 0; }
a:active,
a:hover { text-decoration: none; color: #004986; }
*{word-break: break-word;}
.color-default{}
.color-primary{color: #004986;}
.color-primary:hover{color: #333;}
.color-secondary{color: #5c5c5c;}
.color-accent{color: #ff5722;}
.color-white{}
.color-black{}

.background-color-default{ }
.background-color-primary{background-color: #004986;color: #FFF; }
.background-color-primary:hover{background-color: #002F55;color: #FFF;}
.background-color-secondary{}
.background-color-accent{}
.background-color-white{}
.background-color-black{}

.link-color-primary{color: #004986;}
.link-color-primary:hover{color: #333;}
div.mm-page{width: 100%;position: relative;}

input:focus, textarea:focus, select:focus{outline: none!important;}
img{height: auto;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{line-height:/*inherit!important*/ 1.4 ;font-weight: 600;}
.h7{font-size: .875rem;color: rgba(0, 0, 0, 0.5);}
video{display: block;}
.modal-product{padding: 1rem;}
body.one-page{/*overflow-x: auto!important;*/}
/*.has-image[data-image-fit=contain] .fancybox__image{height: min-content !important;}*/
.wb-hidden { display: none; }
.footer-logo img { max-height: 70px;width: auto;}
.cart-page { margin-left: 20px; }
.search-conditions-page .control-label .range-hint { font-weight: normal; margin-left: 4px; font-size: 0.75em; opacity: .85; }

.header-body{position: relative;z-index: 100;width: 100%;}
.item-line {border-bottom: 1px dashed rgba(0, 0, 0, .3);}

.rounded-1{}
.rounded-2{}
.rounded-3{border-radius: .3rem!important;}

/*字體大小*/
.text-size-1{font-size: 12px;}
.text-size-2{font-size: 13px;}
.text-size-3{font-size: 16px;}
.text-size-4{font-size: 18px;}
.text-size-5{font-size: 24px;}
.text-size-6{font-size: 32px;}
.text-size-7{font-size: 36px;}
.text-size-8{font-size: 48px;}
.text-size-9{font-size: 52px;}
.text-size-10{font-size: 64px;}

/*工具提示*/
.tooltip-box-page{}
.tooltip-box{}
.tooltip-box:before{content: "\f445";font-family: 'Ionicons';font-size: 24px!important;font-weight: bold!important;padding: 2px .5rem;}
.tooltip-help-inner{display: inline-block;}
.tooltip-help-body a{color: #fff;}
.tooltip-help-body a:hover{color: rgba(255, 235, 60, 1);}

.tooltip.top .tooltip-arrow { border-top-color: #004986!important; }
.tooltip.top-left .tooltip-arrow { border-top-color: #004986!important; }
.tooltip.top-right .tooltip-arrow { border-top-color: #004986!important; }
.tooltip.right .tooltip-arrow { border-right-color: #004986!important; }
.tooltip.left .tooltip-arrow { border-left-color: #004986!important; }
.tooltip.bottom .tooltip-arrow { border-bottom-color: #004986!important; }
.tooltip.bottom-left .tooltip-arrow { border-bottom-color: #004986!important; }
.tooltip.bottom-right .tooltip-arrow { border-bottom-color: #004986!important; }
.tooltip .tooltip-inner { background: #004986!important; border: 1px solid #004986!important; }
.tooltip .arrow::before { border-bottom-color: #004986; }
.tooltip.bs-tooltip-top .arrow::before{border-top-color: #004986;}

.ui-tooltip { background: #004986!important; border: 1px solid #004986!important; color: #fff!important;    box-shadow: none!important;font-size: .875rem!important;    padding: .25rem .5rem!important;border-radius: .25rem!important;margin: 0px!important;transform: translate3d(0px, 0px, 0px)!important;}

/*圖案字型*/
@font-face { font-family: 'FontAwesome'; font-style: normal; font-weight: 400; src: local('FontAwesome'), local('FontAwesome'), url(https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/fonts/fontawesome-webfont.woff2?v=4.6.3) format('woff2'); font-display: swap; }
@font-face { font-family: 'Ionicons'; font-style: normal; font-weight: 400; src: local('Ionicons'), local('Ionicons'), url(https://code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.ttf?v=2.0.1) format('woff2'); font-display: swap; }

.icon:before{font-family: 'Ionicons';display: inline-block;line-height: 1;font-style: normal; speak: none;font-weight: normal;font-variant: normal;text-transform: none;text-rendering: auto;}
.fa {display: inline-block;font: normal normal normal 14px/1 FontAwesome;font-size: inherit;text-rendering: auto;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

.ion-chevron-down:before {content: "\f123";}
.ion-ios-search-strong:before {content: "\f4a4";}
.ion-heart:before {content: "\f141";}
.ion-android-cart:before {content: "\f370";}
.ion-android-close:before {content: "\f2d7";}
.ion-ios-settings-strong:before {content: "\f4a6";}
.ion-ios-world-outline:before {content: "\f4d2";}

.icon-bag:before {content: "\f110";}
.icon-heart:before {content: "\f387";}
.icon-zoom:before {content: "\f4a5";}
.icon-quickview:before {content: "\f386";}
.icon-compare:before {content: "\f3ef";}
.icon-inquiry:before {content: "\f2c7";}
.icon-required:before{/*content:"\f101";*/content: "\f45c";}
.ion-asterisk:before { content: "\f314";}
.icon-arrow-left:before{content: "\f124";}
.icon-arrow-right:before{content: "\f125";}

.fa-angle-up:before{content: "\f106";}
.fa-chevron-down:before {content: "\f078";}
.fa-plus:before {content: "\f067";}
.fa-minus:before {content: "\f068";}
.fa-navicon:before, .fa-reorder:before, .fa-bars:before {content: "\f0c9";}
.fa-angle-down:before {content: "\f107";}
.fa-refresh:before {content: "\f021";}
.fa-question-circle-o:before {content: "\f29c";}
.fa-arrow-down:before {content: "\f063";}
.fa-times:before {content: "\f00d";}
.fa-link:before {content: "\f0c1";}
.fa-chevron-left:before {content: "\f053";}
.fa-chevron-right:before {content: "\f054";}
.fa-download:before {content: "\f019";}
.fa-heart:before {content: "\f08a";}
.fa-sliders:before {content: "\f1de";}

/*系統調整預設值*/
.form-control:focus,
.custom-select:focus {border-color: #ced4da;box-shadow: 0px 0px 0px 0rem rgba(0,123,255,0.25);}
.btn.focus, .btn:focus { outline: 0;box-shadow: 0 0 0 0rem rgba(0,123,255,.25);}
button:focus { outline: 0;box-shadow: 0 0 0 0rem rgba(0,123,255,.25);} 
.btn,.dropdown-menu{font-size: 0.875rem;}
html[lang=zh-tw] .btn,
html[lang=zh-cn] .btn{letter-spacing: 1px;/*font-size: 0.9375rem;*/}
.form-control {/*font-size: 0.875rem;*/color: inherit;}
::placeholder{color: #333!important;opacity: 1!important; }
:-ms-input-placeholder {color: #333!important;opacity: 1!important; }
::-ms-input-placeholder{color: #333!important;opacity: 1!important; }

/*手機選單模組*/
nav#my-menu:not(.mm-menu){display: none;}
.mobile-header{position: fixed;z-index: 1000;top:0px;display: none;}
.mobile-header a { display: block; width: 46px; padding: 10px; margin: 0px; position: absolute; top: 0; left: 0;background-color: #fff; }
.mobile-header a:before, .mobile-header a:after { content: ''; display: block; background: #5f6368; height: 2px; }
.mobile-header a span { background: #5f6368; display: block; height: 2px; margin: 5px 0; }
.mobile-header.position-left{left: 0;}
.mobile-header.position-right{right: 46px;}

.mm-btn_close:after, 
.mm-btn_close:before{width: 8px;height: 8px;}
.mm-btn_close:before{right: 12px;}
.theme-dark .mm-btn_close:after, 
.theme-dark .mm-btn_close:before{border-color: rgba(255,255,255,1);}
.theme-dark .mm-btn_next:after{border-color: rgba(255,255,255,1);}
.theme-dark .mm-btn_prev:before{border-color: rgba(255,255,255,1);}

/*手機遮罩*/
.mm-menu_opened.mm-menu_pagedim-black~.mm-wrapper__blocker {background: #000;opacity: .3;}

/*內容開始*/
.main-content { padding: 0 0 0rem 0; position: relative;width: 100%;}
/*.main-content .main-content-wrapper:first-child { padding-bottom: 0rem; }*/

.btn-webbuilder { color: #fff; background-color: #004986; border-color: rgba(0,0,0,0.1); }
.btn-webbuilder:hover,
.btn-webbuilder:focus,
.btn-webbuilder:active{ color: #fff; background-color: #333; border-color: rgba(0,0,0,0.1); }

.btn-item-group{}
.btn-item-group .btn-item:last-child{margin-left: 1rem;}
.btn-item-group .btn-item:first-child{margin-left: 0rem;}

.btn-item{ color: #fff; background-color: #004986; border-color: rgba(0,0,0,0.1);zoom: 1;font-size: 0.875rem;letter-spacing: .05rem;    margin: .5rem 0;}
html[lang=zh-tw] .btn-item,
html[lang=zh-cn] .btn-item{letter-spacing: 1px;/*font-size: 0.9375rem;*/}
.btn-item:hover ,
.btn-item:focus,
.btn-item:active{ color: #fff; background-color: #002F55; border-color: rgba(0,0,0,0.1); }
.btn-item i{margin-right: .25rem}

.btn-style{font-size: 0.875rem;}
html[lang=zh-tw] .btn-style,
html[lang=zh-tw] .btn-style span,
html[lang=zh-cn] .btn-style,
html[lang=zh-cn] .btn-style span{letter-spacing: 1px;/*font-size: 0.9375rem;*/}

@media screen and (max-width:575.98px){
}

.related-products .module-title-box { text-align: left; }

/*內頁BANNER圖加路徑模組*/
.breadcrumbs-page .container{max-width: 100%;padding: 0;}

/*內頁大圖與路徑*/
.breadcrumbs { display: block; text-align: center; line-height: 25px; overflow: hidden; margin: 0; padding: 0; position: relative;margin-bottom: 0rem; }
.breadcrumbs .breadcrumbs-img { width: 100%; height: auto; }
.breadcrumbs .breadcrumbs-img > img { width: 100%; }
.breadcrumbs .breadcrumb { margin: 0; background: none; text-transform: capitalize; padding: 0; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.breadcrumbs .breadcrumb li::before { margin: 0 4px 0 2px; }
.breadcrumbs .breadcrumb li a { color: #777777;}
.breadcrumbs .breadcrumb > li + li::before { content: "/"; color: #777; padding: 0; }/*media all*/
.breadcrumbs .breadcrumb li a:hover,
.breadcrumbs .breadcrumb li:last-child a { color: #004986; }
.breadcrumbs .breadcrumbs-txt-body { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.breadcrumbs .breadcrumbs-txt { display: table; width: 100%; height: 100%; }
.breadcrumbs .breadcrumbs-txt-inner { display: table-cell; vertical-align: middle; text-align: center; }
.breadcrumbs .breadcrumbs-txt-inner .breadcrumb-title { color: #f3f3f3; }
@media (max-width: 1199.98px) {}
@media (max-width: 991.98px) {}
@media (max-width: 767.98px) {}
@media (max-width: 575.98px) {}

/*內頁大圖*/
.sub-breadcrumbs-page{margin-bottom: 1.5rem}
.sub-breadcrumbs-box { width: 100%; height: auto; }
.sub-breadcrumbs-box > img { width: 100%; }
@media (max-width: 1199.98px) {}
@media (max-width: 991.98px) {}
@media (max-width: 767.98px) {}
@media (max-width: 575.98px) {}

/*HOME 標題樣式*/
.module-title-page {margin-bottom: 1.5rem; }
.module-title-page .module-title-box::before { content: ""; width: 100%; height: 2px; background: rgba(0, 0, 0, .1); position: absolute; left: 0px; right: 0px; top: 50%; }
.module-title-page .module-title-box h3 { position: relative; display: inline-block; text-transform: capitalize; margin: 0; padding-right: 20px; color: #004986; background: #fff; letter-spacing: -0.01rem; }
.module-title-page .module-title-box { position: relative; display: block; margin-top: 0px;  text-align: left; }
.module-title-page .module-body { }
.module-title-page .module-body p { }

/*內頁標題樣式*/
.sub-module-title-body{align-items: center;}
.sub-module-title-body ._ComponentsSubTitle .sub-module-title-page{margin-bottom: 1rem!important;}
.sub-module-title-body ._SearchBox .input-group {margin-bottom: 1rem!important;}
.sub-module-title-page {/*margin-top: 0rem;margin-bottom: 2rem;*/display: inline-block;width: 100%; }
.sub-module-title-page .module-title::before { content: ""; width: 100%; height: 2px; background: rgba(0, 0, 0, .1); position: absolute; left: 0px; right: 0px; top: 50%; }
.sub-module-title-page .module-title h1,
.sub-module-title-page .module-title h3,
.sub-module-title-page .module-title .h3 { position: relative; display: inline-block; text-transform: capitalize; margin: 0; padding-right: 20px; color: #004986; background: #fff; letter-spacing: -0.01rem;font-weight: bold; font-size: 1.5rem;}
.sub-module-title-page .module-title { position: relative; /*display: block;*/ text-align: left; display: flex;}
.sub-module-title-page .module-body { }
.sub-module-title-page .module-body p { opacity: 0.8; margin-bottom:0rem;}
.sub-module-title-page .module-sharing{margin-left: auto;z-index: 1;background-color: #fff;padding-left: 20px;}
.sub-module-title-page .module-sharing button { padding-left: 0; padding-right: 0; }
@media (max-width: 575.98px){
.sub-module-title-page{margin-bottom: 1.25rem!important;}
}

/*內頁副標題樣式*/
.sub-module-small-title-page{}
.sub-module-small-title-page .module-title::before { content: ""; width: 100%; height: 2px; background: rgba(0, 0, 0, .1); position: absolute; left: 0px; right: 0px; top: 50%; }
.sub-module-small-title-page .module-title h3 { position: relative; display: inline-block; line-height: 30px; text-transform: capitalize;  font-weight: lighter; margin: 0; padding-right: 20px; color: #004986; background: #fff; letter-spacing: -0.01rem; }
.sub-module-small-title-page .module-title { position: relative; display: block; text-align: left; }
.sub-module-small-title-page .module-body { }
.sub-module-small-title-page .module-body p { opacity: 0.5; margin-bottom: 1.5rem;}

/*分類標題*/
.category-heading-page { margin-bottom: .5rem; }
.category-heading { padding-left: 0.5rem; letter-spacing: -0.01rem; font-weight: bold;border-left-width: 5px; border-left-style: solid; border-left-color: #004986;font-size: 1.125rem; }
.category-heading-page .module-body p { opacity: 0.5; margin-bottom: 1.5rem;}

/*內頁內容*/
.main-content-wrapper { padding-bottom: 0rem; }
.sub-main-content-wrapper{ padding-top: 1.5rem; }
@media(max-width: 767.98px) {
.sub-main-content-wrapper{ padding-left: .5rem; padding-right: .5rem;padding-top: 1rem;}
}

/*頁面標準路徑模組*/
.breadcrumb-content{margin-bottom: 1.5rem;}
.breadcrumb-content .breadcrumb{margin-bottom: 0rem;padding: .5rem .5rem;}

@media  (max-width:767.98px) {
/*.breadcrumb .breadcrumb-item{display: none;}
.breadcrumb .breadcrumb-item:first-child{display: inline-block;}
.breadcrumb .breadcrumb-item:nth-child(2){display: inline-block;}
.breadcrumb .breadcrumb-item:nth-child(2) a{display: none;}
.breadcrumb .breadcrumb-item:nth-child(2)::after{content: "...";}
.breadcrumb .breadcrumb-item:last-child{display: inline-block;}
.breadcrumb .breadcrumb-item:last-child a{display: inline-block;}
.breadcrumb .breadcrumb-item:last-child::after{display: none;}*/
}
@media (max-width: 575.98px){
.breadcrumb-content{margin-bottom: 1rem;}
}

.item-product{position: relative;}
.item-photo{position: relative;}
.item-link{    position: absolute;    top: 0;    bottom: 0;    left: 0;    right: 0;    z-index: 11;}

/*照片模組*/
.image-page{position: relative;overflow: hidden;width: 100%;}
.image-box { position: relative; text-align: center; overflow: hidden; border-radius: 3px; margin-bottom: 0rem;}
.image-box .image-link { position:relative; display: block; }
.image-box img { margin: auto;  display: block;width: 100%; height: auto;}
.image-box .img-r { position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; opacity:0; visibility:hidden; z-index:1; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out;}
.image-page:hover .image-box .img-r { opacity:1; visibility: visible; }

.image-page .bquickview { position: absolute; left: 5px; right: 5px; bottom: 5px; z-index: 3; opacity: 0; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
.image-page:hover .bquickview { opacity: 1; }
.image-page button.btn-quickview {line-height: 1.75rem; font-size: 12px; color: rgba(255, 255, 255,1);  text-transform: capitalize; background: rgba(46,46,46,0.7); padding: 0; width: 100%; font-weight: 400; display: block; }
.image-page button.btn-quickview:hover { background: #004986; color: #fff; }
.image-page button.btn-quickview span { }
@media  (max-width:767.98px) {
.image-page .bquickview{display: none;}
}

/*標籤*/
.label-box { position: absolute; top: 5px; left: 5px; z-index: 3; }
.label-box span{ color: #fff; font-weight: 400; text-align: center; font-size: 12px; background: #004986; border-radius: 3px;padding: 4px 6px; }
.label-box span.best{ background-color: #690;}
.label-box span.selection{ background-color: #F60;}
.label-box span.hot{ background-color: #F00;}
.label-box span.other1{ background-color: #069;}
.label-box span.other2{ background-color: #F90; }
.label-box span.other3{ background-color: #666; }
.product-inquiry-cart-list .label-box {     position: relative;    top: 0;    display: inline-block;    margin-top: 5px;    left: 0px;}
@media(max-width: 767.98px) {
/*.label-box{display: none;}*/
}

/*圖按鈕*/    
.image-button-group{display: flex;align-items: center;justify-content: center;display: none;}
.image-button-group{position: absolute; bottom: 0rem; opacity: 0;transition: all .4s ease;transition-delay: 50ms;z-index: 3;width: 100%;transform: translate(-50%, -50%);top: 100%;left: 50%;}
.image-page:hover .image-button-group{opacity: 1;top: 50%;}
.image-button-group .image-button-box{z-index: 5;opacity: 1;transition: all .4s ease;transition-delay: 50ms;padding: .25rem;}
.image-button-group .image-button{ display: flex;align-items: center;justify-content: center; vertical-align: top; position: relative; text-align: center; height: 50px; width: 50px; padding: 0px; background: #151515; color: #fff; cursor: pointer; border: 3px solid #fff; border-radius: 50%; font-size: 18px;}
.image-button-group .image-button:hover{background: #004986;}

/*內頁左邊進階搜尋*/
.layout-sidebar-filter-set-box { background-color: rgba(233, 236, 239, 1); padding: .75rem; }
.layout-sidebar-filter-set-box .layout-sidebar-filter .filter-name { font-weight: bold; }
.layout-sidebar-filter-set-box .layout-sidebar-filter .filter-name .range-hint { font-weight: normal; margin-left: 4px; font-size: 0.95em; opacity: .75; }
.layout-sidebar-filter-set-box .layout-sidebar-filter .btn-group-toggle { display: block; }
.layout-sidebar-filter-set-box .layout-sidebar-filter .btn-group-toggle .btn { margin-bottom: .35rem;margin-right: .35rem;font-size: 0.875rem;border-color: #d3d9df; }
html[lang=zh-tw] .layout-sidebar-filter-set-box .layout-sidebar-filter .btn-group-toggle .btn,
html[lang=zh-cn] .layout-sidebar-filter-set-box .layout-sidebar-filter .btn-group-toggle .btn{letter-spacing: 1px;/*font-size: 0.9375rem;*/}
.layout-sidebar-filter-set-box .layout-sidebar-filter .btn-group-toggle .btn.active{background-color: #004986;color: #fff;    border-color: rgba(0, 0, 0, 0.125);}

.layout-sidebar-cards .card-header { padding: 0rem; }
.layout-sidebar-cards .card-header .btn {padding: .75rem .75rem;border-radius: 0rem;background-color: #004986;color: #fff;}
.layout-sidebar-cards .card-header .btn.collapsed{background-color: transparent;color: inherit;}
.layout-sidebar-cards .card-header .btn .collapse-indicator { display: inline-block; opacity: .8;margin-right: -5px;}
.layout-sidebar-cards .card-header .btn .collapse-indicator:before { content: "\f068"; font-family: 'FontAwesome'; }
.layout-sidebar-cards .card-header .btn.collapsed .collapse-indicator:before { content: "\f067"; font-family: 'FontAwesome'; }
.layout-sidebar-cards .card-body { background-color: rgba(233, 236, 239, 1); padding: 0; }
.layout-sidebar-cards .card-header .btn[aria-expanded="true"]{background-color: #004986;color: #fff;}

.top-filter-sets-box { background-color: rgba(233, 236, 239, 1); margin-bottom: 20px; }
.top-filter-sets-box .nav.nav-tabs .nav-link.active { background-color: rgba(233, 236, 239, 1); border-color: rgba(233, 236, 239, 1); }
.top-filter-sets-box .nav.nav-tabs { background-color: #dae0e5; }
.top-filter-set-box { padding: 1.25rem; }
.top-filter-set-box .top-filter { display: inline-block; margin-right: 10px; }
.top-filter-set-box .top-filter .filter-name .range-hint { font-weight: normal; margin-left: 4px; font-size: 0.95em; opacity: .75; }
.top-filter-set-box .top-filter .range-value-col { width: 20px; }
.top-filter-set-box .top-filter .btn-group-toggle { display: block; }
.top-filter-set-box .top-filter .btn-group-toggle .btn { margin-bottom: 2px; }

.singlefilter{}
.multiplefilter{}
.rangefilter{}

/*檔案類型*/
.type_one_box{border-radius: 3px;}
.products_one_box{border-radius: 3px;}
@media (min-width: 1440px){}

/*內容*/
.description-page {width: 100%;}
.description-box{padding: .5rem;width: 100%;}
.description-box .main_title_box{/*text-transform: uppercase;*/font-weight: bold;margin-bottom: .5rem;/*margin-top: .5rem;*/position: relative;font-size: 1.125rem;}
.description-box .main_title_box::after {display: none;content: ""; width: 50px;height: 4px;background-color: #32c5d2;margin-top: 10px;margin-bottom: 10px;}
.description-box .main_title_box strong{}
.description-box .main_title_link,
.description-box .main_title_link:link{/*color: inherit!important;*/}

.description-box .main_title_link:focus,
.description-box .main_title_link:active,
.description-box .main_title_link:hover {/*color: inherit!important;*/}
.description-box .main_title_link:hover strong{color: inherit!important;}
.description-box .main-title-news{font-size: 1.125rem;}

.description-box .sub_title_box{font-size: 1rem;position: relative;margin-bottom: .5rem;font-weight: bold;}
.description-box .sub_title_box strong{font-weight: normal;}
.description-box .sub_title_link,
.description-box .sub_title_link:link{/*color: inherit!important;*/}
.description-box .sub_title_link:focus,
.description-box .sub_title_link:active,
.description-box .sub_title_link:hover{ text-decoration: none; /*color: inherit!important; */}
.description-box .sub_title_link:hoverstrong{color: inherit!important;}

.description-box .txt_box{position: relative;margin-bottom: .5rem;}
/*.description-box .btn{margin-top: 1.5rem;position: relative;margin-bottom: .5rem;}*/
.description-box .date_time{margin-bottom: .5rem;}
.description-box .date_time:before{content: "\f017"; font-family: FontAwesome;margin-right: .5rem;}

@media(max-width: 767.98px) {
.description-box .main_title_box{font-size: 1rem;}
.description-box .sub_title_box {font-size: 1rem;}
.description-box .txt_box {font-size: 1rem;}
}

/*owl-style-a 輪播左右按鈕*/
.owl-style-a.owl-theme .owl-dots{margin-top: .5rem;}
.owl-style-a.owl-theme .owl-nav{margin-top: 0px;}
.owl-style-a.owl-theme .owl-nav {font-size: 28px;color: #fff;}
.owl-style-a.owl-theme .owl-nav .owl-prev{transform: translateY(-50%);position: absolute;left: 0px;top: 50%;margin-top: -.5rem;}
.owl-style-a.owl-theme .owl-nav .owl-next{transform: translateY(-50%);position: absolute;right: 0px;top: 50%;margin-top: -.5rem;}
.owl-style-a.owl-theme .owl-nav [class*=owl-]:hover {background: transparent;;color: inherit;text-decoration: none;}
.owl-style-a.owl-theme .owl-nav button{text-shadow: 0px 0px 0px 2px rgba(255,255,255,0.2);opacity: 0.5}
.owl-style-a.owl-theme .owl-nav button:hover{opacity: 1}

/*owl-style-b 輪播左右按鈕*/
.owl-style-b.owl-theme{display: flex!important;flex-flow: column;padding: 0;}
.owl-style-b.owl-theme .owl-stage-outer{order: 1;}
.owl-style-b.owl-theme .owl-nav{display: flex;order: 0;justify-content: flex-end;margin-top: -36px;}
.owl-style-b.owl-theme .owl-nav span{font-size: 36px;}
.owl-style-b.owl-theme .owl-nav .owl-prev{margin: 0;padding: 5px 10px!important;}
.owl-style-b.owl-theme .owl-nav .owl-next{margin: 0;padding: 5px 10px!important;}
.owl-style-b.owl-theme .owl-nav [class*=owl-]:hover {background: transparent;;color: inherit;text-decoration: none;}
.owl-style-b.owl-theme .owl-dots{order: 2;margin-top: 1rem;}

/*產品顯示選擇區*/
.toolbar-products {display: flex;align-items: center; padding: .5rem .5rem; margin-bottom: 1.5rem;  vertical-align: top; width: 100%; text-align: left; border: 1px solid rgba(222, 222, 222, 1); border-radius: 3px;flex-wrap: wrap;    justify-content: space-between; }
.toolbar-products  label { vertical-align: top; line-height: 32px; margin: 0; font-size: 14px; margin-right: 8px;display: none;  }
.toolbar-products  select { padding: 0 5px; height: 32px; font-size: 14px; color: #5a5a5a; border-radius: 3px; display: inline-block; vertical-align: top; width: auto; border: 0; box-shadow: none; text-indent: 0.01px; text-overflow: ""; background-color: #f3f3f3; }
@media  (min-width:575.98px) {
.toolbar-products  label {display: inline-block; }
}

/*命令按鈕*/
.toolbar-products .commands { display: inline-block; vertical-align: top; padding: 0 10px 0 0; border-right: 1px solid rgba(222, 222, 222, 1); margin: 4px 0; }
.toolbar-products .commands .btn { margin-right: 10px; display: inline-block; vertical-align: top; }

@media  (min-width:767.98px) {
.toolbar-products .commands { float: left; margin-right: 20px; }
}

/*顯示模式*/
.toolbar-products .modes { display: flex;align-items: center; vertical-align: top; padding: 0px; border-right: 1px solid rgba(222, 222, 222, 1); margin-right: 15px; }
.modes .btn-grid { background: url(../../images/bkg_grid.png?14957784033534459383) center no-repeat; }
.modes button { width: 28px; height: 18px; padding: 0; margin-right: 10px; font-size: 0!important; display: inline-block; vertical-align: top; border: none; border-radius: 0; box-shadow: none !important; }
.modes .btn-grid.active,
.modes .btn-grid:hover { background: url(../../images/bkg_grid_hover.png?14957784033534459383) center no-repeat; }
.modes .btn-grid.btn-grid-2 { background: url(../../images/bkg_grid2.png?14957784033534459383) center no-repeat; }
.modes .btn-grid.btn-grid-2.active,
.modes .btn-grid.btn-grid-2:hover { background: url(../../images/bkg_grid2_hover.png?14957784033534459383) center no-repeat; }
.modes .btn-grid.btn-grid-3 { background: url(../../images/bkg_grid3.png?14957784033534459383) center no-repeat; }
.modes .btn-grid.btn-grid-3.active,
.modes .btn-grid.btn-grid-3:hover { background: url(../../images/bkg_grid3_hover.png?14957784033534459383) center no-repeat; }
.modes .btn-grid.btn-grid-4 { background: url(../../images/bkg_grid4.png?14957784033534459383) center no-repeat; }
.modes .btn-grid.btn-grid-4.active,
.modes .btn-grid.btn-grid-4:hover { background: url(../../images/bkg_grid4_hover.png?14957784033534459383) center no-repeat; }
.modes .btn-grid.btn-grid-5 { background: url(../../images/bkg_grid5.png?14957784033534459383) center no-repeat; }
.modes .btn-grid.btn-grid-5.active,
.modes .btn-grid.btn-grid-5:hover { background: url(../../images/bkg_grid5_hover.png?14957784033534459383) center no-repeat; }
.modes .btn-list { background: url(../../images/bkg_list.png?14957784033534459383) center no-repeat; }
.modes .btn-list.active,
.modes .btn-list:hover { background: url(../../images/bkg_list_hover.png?14957784033534459383) center no-repeat; }
.modes .btn-table { background: url(../../images/bkg_table.png?14957784033534459383) center no-repeat; }
.modes .btn-table.active,
.modes .btn-table:hover { background: url(../../images/bkg_table_hover.png?14957784033534459383) center no-repeat; }

@media  (min-width:767.98px) {
.toolbar-products .modes { float: left; }
}
/*統計數量*/
.toolbar-products .toolbar-amount { line-height: 32px; display: inline-block; vertical-align: top; padding: 5px; font-size: 14px; order: 5;  width: 100%;}
.toolbar-products.toolbar-bottom { margin-bottom: 1.5rem; margin-top: 0px;justify-content: space-between; }

.toolbar-products.toolbar-bottom .page-previous-next{width: 100%;float: none;}
.toolbar-products.toolbar-bottom .page-previous-next .pagination-next{margin-left:auto}
.toolbar-products.toolbar-bottom .page-previous-next .pagination-previous{margin-right: auto;}

@media  (min-width:767.98px) {
.toolbar-products .toolbar-amount { float: left;order: 0;  width: auto; padding: 5px 0;}
}
/*排序方式*/
.toolbar-products .sorter { display: inline-block; vertical-align: top; padding: 5px 0; margin-left: auto!important;}
.toolbar-products .sorter label {  }
.toolbar-products .sorter select { }

@media  (min-width:767.98px) {
.toolbar-products .sorter {   }
}
/*顯示數量*/
.toolbar-products .limiter { display: inline-block; vertical-align: top; padding: 5px 0;margin-left: 15px;float: right; }
.toolbar-products .limiter label { }
.toolbar-products .limiter select { }

@media  (min-width:767.98px) {
.toolbar-products .limiter {}
}
/*分頁*/
.toolbar-products .pages { display: inline-block; vertical-align: top; padding: 5px 0; }
.toolbar-products .pages ul { margin: 0; border-radius: 0; flex-wrap: wrap;justify-content: center;}
.toolbar-products .pages ul li { display: inline-block; vertical-align: top; margin: 0 5px;margin-bottom: .5rem;}
.toolbar-products .pages ul li:last-child { margin-right: 0; }
.toolbar-products .pages ul li a { color: #CCC; font-size: 14px; font-weight: 400; padding: 0 4px; width: 32px; border-radius: 3px; height: 32px; line-height: 32px; text-align: center; border: none; background: #333; }
.toolbar-products .pages ul li span { color: #fff; background: none; font-size: 13px; border: none; padding: 0 4px; width: 32px; height: 32px; border-radius: 3px; line-height: 32px; }
.toolbar-products .pages ul li.active span,
.toolbar-products .pages ul li:hover a { color: #fff; background: #004986; border: none; }
.toolbar-products .pages ul li.pagination-next a { width: auto; padding: 0 10px; }
.toolbar-products .pages ul li.pagination-previous a { width: auto; padding: 0 10px; }
.toolbar-products .page-item.active .page-link{background-color: #004986;border-color: #004986;}
.toolbar-products .page-item .page-link:focus{box-shadow: 0 0 0 0rem rgb(0 123 255 / 0%);}
@media  (min-width:767.98px) {
	.toolbar-products .pages ul{}
.toolbar-products .pages { float: right; }
	.toolbar-products .pages ul li{margin-bottom: 0rem;}
}
/*按鈕*/
.button {color: #fff; background: #2e2e2e;border: 1px solid rgba(0, 0, 0, 0.2); padding: 0rem 2rem; text-transform: capitalize; display: inline-block; vertical-align: top; border-radius: 3px; line-height: 2.25rem; }
.button:hover{ color: #fff; background: #004986; }

.button-submit{color: #fff; background: #2e2e2e;margin-right: 1rem; }
.button-submit:hover { color: #fff; background: #004986; }
.button-reset{background: #888888;margin-right: 1rem;}
.button-reset:hover {color: #fff; background: #2e2e2e;}
.button-search-conditions{}
.button-search-conditions:hover{}

/*回頁面上方*/
.to-top { position: fixed; bottom: 50px; right: 15px; width: 40px; height: 40px; line-height: 40px; font-size: 20px; background: #292929; z-index: 99; cursor: pointer; display: none; text-align: center;  color: #FFFFFF;border-radius: 50%;display: flex;justify-content: center;align-items: center;border-width: 0;}
.to-top:hover{ background: #004986; }
.to-top i{color: #fff; }

/*內頁次選單載入 placeholder 載入動畫*/
.placeholder-loader { display: block; position: relative; width: 100px; height: 50px; margin: 0 auto; }
.placeholder-loader div { position: absolute; top: 20px; width: 10px; height: 10px; border-radius: 50%; background: #fff; animation-timing-function: cubic-bezier(0, 1, 1, 1, 0); }
.placeholder-loader div:nth-child(1) { left: 8px; animation: placeholder-loader1 0.6s infinite; }
.placeholder-loader div:nth-child(2) { left: 8px; animation: placeholder-loader2 0.6s infinite; }
.placeholder-loader div:nth-child(3) { left: 28px; animation: placeholder-loader2 0.6s infinite; }
.placeholder-loader div:nth-child(4) { left: 48px; animation: placeholder-loader2 0.6s infinite; }
.placeholder-loader div:nth-child(5) { left: 68px; animation: placeholder-loader3 0.6s infinite; }
@keyframes placeholder-loader1 {
 0% {
 transform: scale(0);
}
 100% {
 transform: scale(1);
}
}
@keyframes placeholder-loader3 {
 0% {
 transform: scale(1);
}
 100% {
 transform: scale(0);
}
}
@keyframes placeholder-loader2 {
 0% {
 transform: translate(0, 0);
}
 100% {
 transform: translate(20px, 0);
}
}

/*影片效能與功能*/
.embed-responsive{display: flex;}
.embed-responsive img{width: 100%;cursor: pointer;position: absolute;}
.embed-responsive span{cursor: pointer;}
.embed-responsive span:before{position: absolute;left: 50%; top: 50%;transform: translate(-50%, -50%);}
.embed-responsive span:before{content: "";background-size: 100%;width: 68px;height: 48px;background-repeat: no-repeat; background-position: left center;} 
.embed-responsive span:before{opacity: .8; background-image : url("data:image/svg+xml,%3Csvg width='256' height='256' viewBox='0 -38 256 256' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='xMidYMid'%3E%3Cpath class='ytp-large-play-button-bg' d='M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134z' fill='%23212121'/%3E%3Cpath fill='%23FFF' d='M102.42 128.06l66.329-38.418-66.328-38.418z'/%3E%3C/svg%3E");}
.embed-responsive:hover span:before{ background-image : url("data:image/svg+xml,%3Csvg width='256' height='256' viewBox='0 -38 256 256' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='xMidYMid'%3E%3Cpath class='ytp-large-play-button-bg' d='M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134z' fill='red'/%3E%3Cpath fill='%23FFF' d='M102.42 128.06l66.329-38.418-66.328-38.418z'/%3E%3C/svg%3E");}

.html5-video-box{position: relative;height: auto;width: 100%;background-color: #757575;}
.html5-video{width: 100%;display: flex;}
.html5-video img{width: 100%;cursor: pointer;}
.html5-video span{cursor: pointer;position: absolute;width: 100%;height: 100%;}
.html5-video span:before{position: absolute;left: 50%; top: 50%;transform: translate(-50%, -50%);}
.html5-video span:before{content: "";background-size: 100%;width: 68px;height: 48px;background-repeat: no-repeat; background-position: left center;} 
.html5-video span:before{opacity: .8; background-image : url("data:image/svg+xml,%3Csvg width='256' height='256' viewBox='0 -38 256 256' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='xMidYMid'%3E%3Cpath class='ytp-large-play-button-bg' d='M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134z' fill='%23212121'/%3E%3Cpath fill='%23FFF' d='M102.42 128.06l66.329-38.418-66.328-38.418z'/%3E%3C/svg%3E");}
.html5-video:hover span:before{ background-image : url("data:image/svg+xml,%3Csvg width='256' height='256' viewBox='0 -38 256 256' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='xMidYMid'%3E%3Cpath class='ytp-large-play-button-bg' d='M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134z' fill='red'/%3E%3Cpath fill='%23FFF' d='M102.42 128.06l66.329-38.418-66.328-38.418z'/%3E%3C/svg%3E");}

/*RWD調整*/
.container { max-width: 1680px; width: 100%;}
@media (max-width: 1920px) {.container { max-width: 1520px;}}
@media (min-width: 1680px){.row-cols-xxl-2>* {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}}
@media (max-width: 1680px) {.container { max-width: 1320px;}}
@media (max-width: 1440px) {.container { max-width: 1200px;}}
@media (max-width: 1200px){
.container {padding-left: 15px;padding-right: 15px ;}
.row {margin-left: -10px;margin-right: -10px;}
.col,[class*="col-"] {padding-left: 10px;padding-right: 10px;}
.no-gutters{margin-left: 0px;margin-right: 0px;}
.no-gutters>.col, .no-gutters>[class*=col-]{padding-left: 0px;padding-right: 0px;}
}
@media (max-width: 991.98px){
}
@media (max-width: 767.98px){
}
@media (max-width: 575.98px){
.container {padding-left: 15px;padding-right: 15px ;}
}
