@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC&display=swap');
@import url('../fa672/css/all.css');
@font-face {font-family: Ethnocentric rg;src: url(https://cdn.prod.website-files.com/6231a9ee43621f83e1552a71/62b13593f8989b6468cdadcd_ethnocentric%20rg.ttf)format("truetype");font-weight: 400;font-style: normal;font-display: swap}
@font-face {font-family: Ethnocentric rg it;src: url(https://cdn.prod.website-files.com/6231a9ee43621f83e1552a71/62b1359360217b7471fd2d3c_ethnocentric%20rg%20it.ttf)format("truetype");font-weight: 400;font-style: normal;}
@font-face {font-family: Sailec;src: url(https://cdn.prod.website-files.com/6231a9ee43621f83e1552a71/62b135932bf556c17575d8e5_Sailec%20Bold.ttf)format("truetype");font-weight: 700;font-style: normal;font-display: swap;}
@font-face {font-family: Sailec;src: url(https://cdn.prod.website-files.com/6231a9ee43621f83e1552a71/62b135938e14562628552c16_Sailec%20Light.ttf)format("truetype");font-weight: 300;font-style: normal;font-display: swap;}
@font-face {font-family: Sailec;src: url(https://cdn.prod.website-files.com/6231a9ee43621f83e1552a71/62b135936a9af47b9c6e0ccd_Sailec%20Medium.ttf)format("truetype");font-weight: 500;font-style: normal;font-display: swap;}
@font-face {font-family: Sailec;src: url(https://cdn.prod.website-files.com/6231a9ee43621f83e1552a71/62b1359360217b3fe2fd2d3d_Sailec%20Thin.ttf)format("truetype");font-weight: 100;font-style: normal;font-display: swap;}

:root {
    --white-smoke: #e9e9e9;
    --white-smoke-2: #eee;
    --black: #000;
    --red: #dc0100;
    --gainsboro: #ddd;
    --white: white;
    --blue: #005dac;
    --accessible-components--dark-grey: #9b9b9b;
    --accessible-components--white-smoke: whitesmoke;
    --body-color: #ebebeb;
    --bs-navbar-bg-rgb: 0,0,0;
    --red-rgb: 220,1,0;
}
/* color:var(--red); */
/* color: rgba(var(--bs-hcolor-a-rgb),0.5); */

body, html{font-family: '微軟正黑體',-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;}
a, a:focus, a:focus-within {outline: none;text-decoration: none;cursor: pointer;}
a {color:var(--black);}
a:hover {color:var(--red);}

input,button,select,optgroup,textarea {margin: 0;font-family: inherit;font-size: inherit;line-height: inherit;outline: 0;}
button,input,optgroup,select,textarea,button:focus,input:focus,optgroup:focus,select:focus,textarea:focus {color: inherit;font: inherit;margin: 0;outline: none;box-shadow:0;}

button {overflow: visible}
button,select {text-transform: none}

button[disabled],html input[disabled] {cursor: default}
button::-moz-focus-inner,input::-moz-focus-inner {border: 0;padding: 0}
input {line-height: normal}
input[type=checkbox],input[type=radio] {box-sizing: border-box;padding: 0}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {height: auto}

input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {-webkit-appearance: none}

.navbar[data-bs-theme="dark"] {--bs-navbar-toggler-border-color: rgb(0, 0, 0);}
/* top navbar */
.bg-body-tertiary {background-color: rgba(var(--bs-navbar-bg-rgb),var(--bs-bg-opacity)) !important;}
.navbar[data-bs-theme="dark"]{padding:1.6rem 0;}
.navbar-brand .img-logo {min-width: 120px;max-width: 130px;}
.navbar > .container,.footer-section > .container  {max-width: 1600px !important;}
.navbar-brand .img-logo {min-width: 250px;max-width: 250px;}
.dropdown-toggle::after {width:1rem;height:1rem;display: inline-block;margin-left:0;vertical-align:-0.15rem;content:"";background-image: url(https://cdn.prod.website-files.com/6231a9ee43621f83e1552a71/63c6b314bad4324e8f3126fa_down.png);background-position: 95%;background-repeat: no-repeat;background-size: 15px;border:0 !important;}
.nav-item.dropdown:hover .dropdown-menu {display:block;}
.dropdown-menu {background-color:#ffffff !important;border-radius:0 !important;}
.dropdown-item {color: #222 !important;}
.dropdown-item:focus,.dropdown-item:hover {color: #222 !important;background-color:transparent !important;}
.navbar .form-search input,.navbar .form-search button {border-radius:0;}
.btn-outline-search{width:38px;height:38px;color:#fff;background-color:#fff;background-image:url(https://cdn.prod.website-files.com/6231a9ee43621f83e1552a71/62a43bea43d2323d38166764_red-icon.svg);background-position:50%;background-repeat:no-repeat;background-size:20px;border:1px solid #000;border-radius:0;padding:9px 15px;}
.btn-outline-search:hover, .btn-outline-search:active, .btn-outline-search:focus {background-color:#fff;line-height:inherit;cursor:pointer;border:1px solid #000;text-decoration:none;display:inline-block}
.w-input,.w-select {color:#333;background-color:#fff;border:1px solid #000;width:100%;height:38px;margin-bottom:10px;padding:8px 12px;font-size:14px;line-height:1.42857;display:block;}
.w-input::placeholder,.w-select::placeholder {color:#999;}
.w-input:focus,.w-select:focus {border-color:#3898ec;outline:0}
.w-input-search {width:8rem !important;}

/* footer */
.footer-section {color:#ffffff;background-color:#0c0c0c;margin-top:5rem;}
.footer-section a,.footer-section a:hover {color:var(--white);}
.footer-section .social-image {width: 32px;}
.footer-div {font-size:0.8rem;}
.footer-logo {width:200px;}
.footer-hr {display:none;}

/* = Cookie Box 外觀 = */
.cookie-box {position: fixed;bottom:3rem;left: 50%;transform: translateX(-50%);width: 90%;max-width: 800px;padding: 1.5rem;background: rgba(0,0,0,0.8);color: #fff;line-height:2;border-radius:0;z-index: 99999;display: none;}
.cookie-box a {color: #00c1ff;text-decoration: underline;}
.cookie-box button {margin-left: 12px;padding: 0px 16px 3px 16px;background:var(--red);border: none;color: #fff;font-weight:900;border-radius: 0.3rem;cursor: pointer;}
.cookie-box button:hover {background:var(--red);}
.zoom-bounce {animation: zoomBounce 0.55s ease-out forwards;}
@keyframes zoomBounce {0% {opacity: 0;transform: translateX(-50%) scale(0.7);}60% {opacity: 1;transform: translateX(-50%) scale(1.05);}100% {transform: translateX(-50%) scale(1);}}
.fade-out {animation: fadeOut 0.4s ease forwards;}
@keyframes fadeOut {from { opacity: 1; }to   { opacity: 0; }}

/* Totop button */
.totop-btn,.totop-btn:visited {display:block;position: fixed;bottom:10.3rem;right:-5rem;width:2.8rem;height:2.8rem;background-color:rgba(var(--red-rgb),1);z-index:9999;border: 3px solid rgba(var(--red-rgb),1);border-radius: 2rem;line-height: 0 !important;transition: right 500ms ,opacity .3s,background-color .25s ease-in-out;}
.totop-btn:hover,.totop-btn:active {color:#ffffff;background-color:rgba(var(--red-rgb),1);}
.totop-view {right:2rem;}
.totop-btn:after {color:rgba(255,255,255,1);position:absolute;left:0.3rem;top:0.4rem;font-size:1.8rem;font-family: 'Font Awesome 6 Free';font-weight: 900;-webkit-font-smoothing: antialiased;content: '\f077';line-height:0.9;}
.totop-btn:hover:after {color:rgba(255,255,255,1);}

/* Home carousel */

.btn-carousel {background-color: var(--white-smoke);color: var(--black);letter-spacing: 2px;text-transform: uppercase;cursor: pointer;padding: 12px 25px;font-size: 1rem;font-weight: 700;line-height: 20px;transition: all .2s;}
.btn-carousel:hover, .btn-carousel:active, .btn-carousel:focus {  background-color: var(--black); color: var(--white);}

.ph2{text-align: center;color:var(--red);margin-bottom: 20px;/* font-family: Ethnocentric rg it,sans-serif; */font-size: 2.5rem;font-weight:900;line-height: 44px;}
.ph3{text-align: center;letter-spacing: 1.44px;margin-bottom: 24px;font-family: Sailec,sans-serif;font-size: 1.5rem;font-weight: 700;}

.home-div-1 {height:550px;}
.home-col-1 {cursor: pointer;left:3rem;right:3rem;top:1rem;bottom:1rem;flex-direction: column;justify-content: flex-end;align-items: center;transition: all .2s ease-in-out;display: flex;padding:2rem 0;}
.home-col-1:hover {color:var(--white-smoke);background-color:var(--red);border-color:var(--red);box-shadow:0 2px 15px var(--red);}
.home-col-1 img {max-width:12.5rem !important;}
.home-col-1 img.height {height:280px;}
.home-col-tit {letter-spacing: 1.44px;margin-top: 20px;margin-bottom: 0px;font-size: 1.2rem;font-weight: 700;}
.home-col-sub {letter-spacing: .5px;font-size: 1rem;font-weight: 300;margin-bottom: 20px;}
.knowmore-product {color: var(--white-smoke-2);letter-spacing: 2px;text-transform: uppercase;cursor: pointer;background-color: #000;padding: 18px 35px;font-size: 1rem;font-weight: 700;line-height: 20px;transition: all .2s;display: block;}
.knowmore-product:hover {color:#000;background-color: var(--white-smoke-2);}
.home-margin-2 {margin-top:3rem;margin-bottom:3rem;}
.product-div {height:400px;}
.product-col-list {cursor: pointer;left:6rem;right:6rem;top:0rem;bottom:0rem;flex-direction: column;justify-content: flex-end;align-items: center;transition: all .2s ease-in-out;display: flex;padding:0 0;transition: transform .5s;}
.product-col-list:hover {transform: scale(1.1);}
.product-col-list img {max-width:279px !important;height:300px;}
.product-col-list h4{text-align: center;text-transform: uppercase;margin-top: 20px;font-size: 1.2rem;font-weight: 700;text-decoration: none;}
.product-col-list .horizontal-line {background-color: #d8d8d8;width: 100%;height: 2px;margin-bottom: 5px;}

.jfs0-8 {font-size:0.8rem !important;}
.breadcrumb-item + .breadcrumb-item::before {content:"|" !important;}
.pdlist-margin {margin-top:0.5rem;margin-bottom:3rem;}

.col-pdlist-btn-group {width:100%;}
.col-pdlist-btn-group.btn-group-vertical > .btn-group:not(:last-child) > .btn, .col-pdlist-btn-group.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle) {border-top-right-radius: 0 !important;border-top-left-radius: 0 !important;border-bottom-right-radius: 0 !important;border-bottom-left-radius: 0 !important;}
.col-pdlist-btn-group.btn-group-vertical > .btn-group:not(:first-child) > .btn, .col-pdlist-btn-group.btn-group-vertical > .btn:nth-child(n+3), .btn-group-vertical > :not(.btn-check) + .btn {border-top-right-radius: 0 !important;border-top-left-radius: 0 !important;border-bottom-right-radius: 0 !important;border-bottom-left-radius: 0 !important;}
.col-pdlist-btn-group .btn {text-align:left !important;--bs-btn-padding-x: 1.5rem;}

.btn-pdmenu {--bs-btn-color: #222;--bs-btn-bg: #ddd;--bs-btn-border-color: #ddd;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #222;--bs-btn-hover-border-color: #222;--bs-btn-focus-shadow-rgb: 49, 132, 253;--bs-btn-active-color: #fff;--bs-btn-active-bg: #222;--bs-btn-active-border-color: #222;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #222;--bs-btn-disabled-bg: #ddd;--bs-btn-disabled-border-color: #ddd;}

.row-pdlist h2 {text-transform: uppercase;font-size:1.2rem;font-weight:700;text-align:center;border-bottom:2px solid #ddd;padding-bottom:0.5rem;padding-top:1rem;}
.row-pdlist img.pdlist-img {width:100%;}

/* col-carousel image vitercal middle */
/* .col-carousel .carousel-item {position:relative;} */
/* .col-carousel .carousel-item img {margin: 0;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);} */

.pdc-h2 {font-family: "Noto Sans TC", sans-serif;font-weight:600;margin-top:1rem;margin-bottom:1rem;}
#fbShare,#lineShare {font-size:1.5rem;margin-right:1rem;}
.pd-pills-nav {border-bottom:2px solid #ddd;/* margin-top:2rem; */}
.pd-pills-nav .nav-item {padding-right:2rem;margin-bottom: -3px;}
.pd-pills-nav .nav-item::last-child {padding-right:0;}

.pd-pills-nav.nav-pills .nav-link {font-size:1.3rem;letter-spacing:0.4rem;text-align:left;padding:0.5rem 0;padding-right:1rem;font-weight:bold;color:#000 !important;background-color:#fff !important;border-bottom-width:4px ;border-radius:0 !important;}
.pd-pills-nav.nav-pills .nav-link.active, .pd-pills-nav.nav-pills .show > .nav-link {font-weight:bold;color:#000 !important;background-color:#fff !important;border-bottom-width:2px ;}
.pd-pills-nav.nav-pills .nav-link:hover.active, .pd-pills-nav.nav-pills .show > .nav-link:hover {color:#000 !important;background-color:#fff !important;border-bottom:4px solid var(--red);}
.pd-pills-nav.nav-pills .nav-link.active {border-bottom:4px solid var(--red);}

.pd-pills-content {font-size:1rem;}

.pd-pills-content .knowmore-product {color: var(--white-smoke-2);letter-spacing: 2px;text-transform: uppercase;cursor: pointer;background-color: #000;padding: 18px 35px;font-size: 1rem;font-weight: 700;line-height: 20px;transition: all .2s;display: block;}

.pd-pills-content h5,.pd-pills-content li {font-size:1rem !important;}
.pills-Spec-li li {margin-bottom:0.3rem;}
.btn-buynow {font-size:1.2rem;font-weight:600;border-radius:0 !important;--bs-btn-color: #fff;--bs-btn-bg: #222;--bs-btn-border-color: #222;--bs-btn-hover-color: #222;--bs-btn-hover-bg: #ddd;--bs-btn-hover-border-color: #ddd;--bs-btn-focus-shadow-rgb: 49, 132, 253;--bs-btn-active-color: #fff;--bs-btn-active-bg: #222;--bs-btn-active-border-color: #222;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #222;--bs-btn-disabled-bg: #ddd;--bs-btn-disabled-border-color: #ddd;}
.btn-black {font-size:1.2rem;font-weight:600;border-radius:0 !important;--bs-btn-color: #fff;--bs-btn-bg: #222;--bs-btn-border-color: #222;--bs-btn-hover-color: #222;--bs-btn-hover-bg: #ddd;--bs-btn-hover-border-color: #ddd;--bs-btn-focus-shadow-rgb: 49, 132, 253;--bs-btn-active-color: #fff;--bs-btn-active-bg: #222;--bs-btn-active-border-color: #222;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #222;--bs-btn-disabled-bg: #ddd;--bs-btn-disabled-border-color: #ddd;}
.btn-black:hover,.btn-black:active {color:#ffffff;background-color:rgba(var(--red-rgb),1);border-color:rgba(var(--red-rgb),1);}
.btn-red {font-size:1.2rem;font-weight:600;border-radius:0 !important;--bs-btn-color: #fff;--bs-btn-bg:#dc0100;--bs-btn-border-color:#dc0100;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #222;--bs-btn-hover-border-color: #222;--bs-btn-focus-shadow-rgb: 49, 132, 253;--bs-btn-active-color: #fff;--bs-btn-active-bg: #222;--bs-btn-active-border-color: #222;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #222;--bs-btn-disabled-bg: #ddd;--bs-btn-disabled-border-color: #ddd;}
.pdc-video {padding:56.25% 0 0 0;position:relative;}
.pdc-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;}
.mgimg {object-fit: contain;max-width: 250px;}
.Eth-fn {font-family: Ethnocentric rg it,sans-serif !important;}

/* 全部產品 */
.allpd-h3 {font-size:1.4rem;font-weight:600;margin-bottom:1rem;border-bottom:1px solid var(--red);}
.allpdlist ,.allpdlist li {padding:0;margin:0;list-style-type:none;}
.allpdlist {margin-bottom:2rem !important;}
.allpd-h4 {display:block;font-size:1.1rem;font-weight:600;border-left:1rem solid #000000;padding:0 0.5rem;line-height:1;margin-bottom:0.5rem;}
.allpdlist-item ,.allpdlist-item li ,.allpdlist-type {padding:0;margin:0;}
.allpdlist-item li:first-child {border-top:1px solid #eeeeee;}
.allpdlist-item li {padding:0.3rem;border-bottom:1px solid #eeeeee;}
.allpd-h5 {display:block;font-size:0.8rem;}
.allpdlist-type h5 {display:block;font-size:1rem;font-weight:600;margin:0;margin-top:1rem;background-color:#eeeeee;padding:0.3rem;}

/* 404 */
.page404-h2 {font-size:5rem;color:#ffffff; }
.page404-h3 {font-size:2rem;color:#ffffff;  }
.page404-p {font-size:2rem;font-weight:900;color:#ffffff;padding-top:1rem;}
.page404-bg {background:url(../images/r-BG.avif);background-repeat:no-repeat;background-size:cover;background-position:50% 50%;}
.page404 section {padding:3.5rem 0;}
.xxx {border:1px solid #ff0000;}

/* 隱私權保護政策 */
.privacy h3 {font-size:1.4rem;font-weight:900;margin:1rem 0;margin-top:2rem;}

/* // `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
.navbar-collapse {margin-top:1rem;}
.navbar-brand .img-logo {min-width: 200px;max-width: 200px;margin:0 auto;}
.navbar .w-input-search {width:100% !important;}
.navbar .form-search {width:100%;margin-top:1rem;}
.carousel-item {height:30rem;}
.carousel-caption {top:40% !important;}
.carousel-heading {font-size: 3rem;letter-spacing: 1px;}
.carousel-txt {font-size: 1rem;line-height:1.8;padding:0 2rem;}
.carousel-1,.carousel-2,.carousel-3,.carousel-4,.carousel-5 {background-position:0 0,18% 100%;background-size:300%;}
.product-col-list {left:1rem;right:1rem;}
.footer-hr {display:block;}
.totop-btn {bottom:3rem;}
.ph2 {font-size: 1.8rem;line-height: 30px;}
.pd-pills-nav {border-bottom: 2px solid #ddd;/* margin-top: 2rem; */margin-right:auto;margin-left:auto;}
.pd-pills-nav .nav-item {padding-right:0;margin-bottom: -3px;}
.pd-pills-nav.nav-pills .nav-link {font-size:1.2rem;letter-spacing:0rem;padding-right:0.5rem;padding-left:.5rem;}
.allpd-h5 {display:block;font-size:1rem;}
/* 隱私權保護政策 */
.privacy h3 {font-size:1rem;font-weight:900;margin:1rem 0;margin-top:2rem;}

/* 產品清單 */
.product-div {height: 330px;}
.product-col-list img {width:100%;max-width:100% !important;height:auto;}
.product-col-list h4 {font-size: 1rem;}
}

.page-contactus .cont-line {width:10rem;}
.page-contactus .cont-mail {font-size:5rem;color:var(--blue);}
.page-contactus h5 {font-weight:900;}
.page-contactus .f-txt {font-size:1.2rem;text-align:center;font-weight:900; padding-top:3rem;padding-bottom:3rem;border-top:0.3rem solid var(--red);border-bottom:0.3rem solid var(--red);}
.page-contactus .txt-or {font-size:1.2rem;font-weight:900;}


/* // `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {}

/* // `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {}

/* // `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {}

/* // `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {}