@charset "utf-8";
/*ZRX行動科技*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap');

/*卷軸==============================================*/
/* 寬度高度 */
::-webkit-scrollbar {
  width: 10px; 
  height: 10px; 
}

/* 滾動條軌道（背景） */
::-webkit-scrollbar-track {
  background: #F3ECE4; 
  border-radius: 10px;
}

/* 滾動條滑塊（拖曳部分） */
::-webkit-scrollbar-thumb {
  background: #C89243; 
  border-radius: 10px;
  border: 2px solid #F3ECE4;  
}

/* 滑鼠懸停在滑塊上時的顏色加深效果 */
::-webkit-scrollbar-thumb:hover {
  background: #ac7c35; 
}

/* 適用於 Firefox 瀏覽器的標準語法 */
* {
  scrollbar-width: thin;
  scrollbar-color: #C89243 #F3ECE4; 
}

/*匯款回報*/
.formbox_form li .form__label{
    color: #ffffff;
}
.border200 {
    width: 100%;
    border: none;
    padding: 5px;
    background: #0c0c0c;
    color: #ffffff;
}
.longer{
    width: 100%;
}
.separate_title{
    color: #ffffff;
    background: #2b2b2b url(../images/separateTitle.png) left center no-repeat;
}
.formbox_form li.last{
    justify-content: flex-end;
}
.send_simple {
    background: #c79145 url(../images/simple_right.png) 88% center no-repeat;
}
.rewrite_simple {
    background: #c7914552 url(../images/simple_left.png) 10% center no-repeat;
}
.tncode{
    border: 1px solid #2f2e2e!important;
    background: #000000!important;
    color: #cb9043!important;
    box-shadow: none!important;
}


/*購物車icon*/
.shopping-cart .cell.product_name p{
    color: #ffffff;
}
.total_amount li{
    color: #ffffff;
}
.form label{
    color: #ffffff;
}
.separate_title{
    background: #2b2b2b url(https://pic03.eapple.com.tw/zrxmobile/separateTitle.png) left center no-repeat;
}
.total_amount li input[name=DiscountCode]{
    border: none;
    background: #0c0c0c;
}
.declaration{
    background: #2b2b2b;
}
.form label.Bigcheck{
    color: #ffffff;
    letter-spacing: 1px;
}

/*預設解除背景輪播*/
.sb_marquee{padding: 0;background: #000000;display: none;}
.bannerindex { position:relative; height:auto;}
.swiper-banner { position:static; margin:0; height:auto;} 
.swiper-slide img { height:auto;} 
.me_tp_features{display: none;}
/*背景*/
#content_main,#content{
    background: #000000;
    margin:0;
   
}

/*版面*/
.contact_page .main_part{
    width: 100%;
    max-width: 78%;
    margin: auto;
    padding: 16% 0 6% 0;
}
.product_page .main_part{
    width: 100%;
    max-width: 74%;
    margin: auto;
    padding: 12% 0 6% 0;
}
.product_info_page .main_part{
    width: 100%;
    max-width: 70%;
    margin: auto;
    padding: 12% 0 6% 0;
}
.blog_page .main_part{
    width: 100%;
    max-width: 76%;
    margin: auto;
    padding: 12% 0 0 0;
}
.blog_in_page .main_part{
    width: 100%;
    max-width: 70%;
    margin: auto;
    padding: 12% 0 0 0;
}
.remit_page .main_part{
    width: 100%;
    max-width: 76%;
    margin: auto;
    padding: 10% 0 0 0;
}
.car_page .main_part{
    width: 100%;
    max-width: 70%;
    margin: auto;
    padding: 10% 0 0 0;
}
.longer{
    color: #ffffff;
}

/*兩個圓圈切換*/
.swiper-pagination-bullet{
    background: #cd8f45;
}


/*抬頭*/
.header_area .main_header_area .container {
    width: 100%;
    max-width: 86%;
    transition: all 0.4s ease;
}
.header_area.sticky .main_header_area .container {
    width: 100%;
    max-width: 88%;
    transition: all 0.4s ease;
}
.main_header_area .container::before{
    content: '';
    position: absolute;
    background-image: url(https://pic03.eapple.com.tw/zrxmobile/top_bk.png);
    background-repeat: no-repeat;
    width: 83px;
    height: 90px;
    left: 0;
    top: 0;
}
.stellarnav li li{
    border: none;
}
.stellarnav li a{
    color: #ffffff;
}
.stellarnav li a:hover{
    color: #C79141;
}
.navigation {
    grid-template-columns: 15% 1fr;
    justify-items: center;
}
.nav-header{
    position: relative;
}

.header_area{
    position: fixed;
    background: transparent;
}
.header_area.sticky{
    position: fixed;
    background: #140a01;
    width: 100%;
    height: auto;
}
.header_area.sticky::before{
    content: '';
    position: absolute;
    background-image: url(https://pic03.eapple.com.tw/zrxmobile/footer_light.png);
    background-repeat: no-repeat;
    width: 177px;
    height: 22px;
    right: 10%;
    bottom: 2%;
    animation: slide-left 6s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite both;
    z-index: 2;
}
.header_area.sticky::after{
    content: '';
    position: absolute;
    background: linear-gradient(to right, #875E24, #D6A96A ,#875E24);
    background-repeat: no-repeat;
    width: 100%;
    height: 2px;
    left: 0;
    bottom: 10%;
    z-index: 1;
}
.header_area.sticky:hover::before{
    animation-play-state: paused;
    -webkit-animation-play-state: paused;
}
@keyframes slide-left {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-1920px);
            transform: translateX(-1920px);
  }
}
.stellarnav{
    display: flex;
    justify-content: flex-end;
}
.stellarnav ul{
    padding: 1.2% 0;
}
.stellarnav ul ul{
    background: #000000;
    border: 1px solid #c89140;
}
.stellarnav > ul > li > a{
    color: #ffffff;
    font-family: "Noto Sans TC", sans-serif;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 0 28px;
}
.stellarnav li.has-sub > a:after{
    display: none;
}
.stellarnav > ul > li.has-sub > a {
    padding-right: 0;
}
.stellarnav > ul > li > a:hover{
    color: #C79141;
}


/*大圖*/
.swiper-banner .swiper-slide{
    position: relative;
}
/* 文字1*/
.swiper-banner .swiper-slide:nth-child(1)::before {
    background-position: center center;
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-image: url(https://pic03.eapple.com.tw/zrxmobile/big1_text.png);
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 1;
    animation: scale-in-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
/* 文字2*/
.swiper-banner .swiper-slide:nth-child(2)::before {
    background-position: center center;
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-image: url(https://pic03.eapple.com.tw/zrxmobile/big2_text.png);
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 1;
    animation: scale-in-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 3s both;
}
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}

/*內頁BANNER 設定*/
.banner {
    display: none;
}
.path{
    display: none;
}
.banner h5 {
    display: none;
}

/* 商品*/
.product_menu_list ul{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 0.5vw;
   
}
.product-layer-two{
    margin-bottom: 1%;
    border-bottom: 1px solid #ffffff;
    padding-bottom: 1%;
}
.product-layer-two li a{
    background: #000000;
    border-bottom: none;
    color: #ffffff;
    background-color: #1a1a1a;
    border: 1px #858484 solid;
}
.product-layer-two > li{
    width: 100%;
}
.product-layer-two li.active a{
    border: none;
    background-color: #C79141;
}
.products-list .name{
    color: #ffffff;
    text-align: center;
}
.products-list .price b{
    color: #cb9043;
}
.products-list .price b.ori_price{
    color: #cb9043;
}
.products-list .price b.ori_price{
    color: #666666;
}
.products-list .price b.sp_price{
    color: #cb9043;
}
.products-list .price{
    margin: 0 0 8% 0;
}
.products-list,.product-wrapper{
    margin-top: 6%;
}
.products-list .more{
    border: 1px solid #ffffff30;
    color: #ffffff;
    font-weight: 400;
    font-size: 14px;
}
.products-list .item a:hover .more {
    background: #ffffff;
    color: #000000;
    letter-spacing: 2px;
}
.products-list .item a+button.pd_btn{
    border: 1px solid #cb904330;
    color: #cb9043;
    font-weight: 400;
    font-size: 14px;
}
.products-list .item a+button.pd_btn:hover{
    background: #cb9043;
    color: #000;
}
.products-list .price{
    justify-content: center;
}
.products-list{
    grid-template-columns: repeat(auto-fill, minmax(20%, 1fr));
}
.product-layer-two li a{
    letter-spacing: 1px;
}
.sidebarBtn{
    border: 1px #ffffff00 solid;
    background: #000000;
}
.sidebarBtn h2{
    color: #ffffff;
}
.sidebarBtn .price span.ori_price{
    color: #666666;
    font-size: 22px;
}
.sidebarBtn .price span.sp_price{
    color: #cb9043;
    font-size: 22px;
}
.prod_related{
    background: transparent;
}
.prod_related h6 span:before{
    color: #ffffff;
    font-weight: 400;
    letter-spacing: 3px;
}
.lastPage{
    background: #ca8f48;
}
.product_pic {
    padding-left: calc(16% + 15px);
    padding-right: 3%;
}
.pd_tabTitle li.activeTab a {
    color: #ffffff;
    font-size: 24px;
}
.pd_tabTitle li.activeTab::after{
    background: transparent;
}
.product_info_page .edit * {
    color: #ffffff;
    font-family: 'Noto Sans TC';
    letter-spacing: 1px;
}
.product_info li span{
    color: #ffffff;
}
.radio-inline__label{
    color: #666666;
    border: 1px solid #666666;
}
.inquiry_a3 {
    background: #ca9044;
}
a.pdinfo_line {
    background-color: #6ea763;
}
a.pdinfo_tel {
    background-color: #a5754c;
}


/*文章1-客戶見證*/
.subbox_item{
    border-bottom: none;
}
.blog_le {
    width: 18%;
}
.blog_ri {
    width: calc(100% - 19%);
    padding: 0 0 0 4%;
}
.blog_page h4.blog_category_title{
    display: none;
}
.articel_mainPic img{
    display: none;
}
.blog_search input[type=search]{
    background-color: #000000;
    border: solid 1px #333333;
    border-radius: 4px;
}
h5.blog_le_t{
    text-align: center;
}
h5.blog_le_t em{
    color: #c79242;
}
.blog_le .accordion{
    border-radius: 0;
    border: none;
}
.accordion li .link a {
    color: #ffffff;
    font-family: "Noto Sans TC", sans-serif;
    font-weight: 400;
    letter-spacing: 1px;
    text-align: center;
    font-size: 16px;
}
.blog_le .accordion>li:hover, .blog_le .accordion>li.on_this_category {
    background: #C79141 !important;
}
.blog_list_ri h5 {
    font-weight: 500;
    font-size: 24px;
    color: #ffffff;
    letter-spacing: 1px;
}
.subbox_item a:after{
    background: transparent;
    opacity: 1;
    border: 1px #cb9043 solid;
}
.blog_list_ri {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.blog_page.article_a .subbox_item a {
    display: grid;
}
.blog_page.article_a .blog_subbox{
    grid-template-columns: 1fr;
}
h4.blog_category_title{
    color: #ffffff;
    letter-spacing: 4px;
    font-size: 28px;
    font-family: "Noto Sans TC", sans-serif;
    font-weight: 500;
}
.news_related{
    background: transparent;
}
.news_related h6 span:before{
    color: #ffffff;
    font-weight: 300;
}
.blog_back a.article_btn_prev,
.blog_back a.article_btn_next {
    background: transparent;
}
.blog_back a.article_btn_back {
    background: #000000;
    border: 1px solid #ffffff47;
}
.blog_box_edit * {
    line-height: 150%;
    color: #ffffff;
    letter-spacing: 1px;
}
.subbox_item a:before{
    opacity: 1;
    color: #C79141;
}
.blog_list_ri em{
    color: #795f44;
}
.blog_list_ri p {
    color: #ffffff;
    font-weight: 400;
    font-family: "Noto Sans TC", sans-serif;
    letter-spacing: 1px;
    line-height: 150%;
}
.blog_page.article_a .subbox_item a{
    grid-template-columns: 20% 1fr;
    grid-gap: 4%;
}
.blog_in_page.article_a  .news_related_list li figure{
    display: none;
}
.blog_in_page.article_a .news_related_list{
    grid-template-columns: 1fr 1fr;
    grid-gap: 10px;
}
.news_related_list li a{
    color: #ffffff;
    border: 1px solid #c79242;
    background: #000;
}
.news_related_list li a p{
    color: #ffffff;
}


/*文章2-維修實例*/
.blog_page.article_b .subbox_item a{
    grid-template-columns: 1fr;
}
.blog_page.article_b .blog_subbox{
    grid-template-columns: 1fr 1fr 1fr;
}
.blog_page.article_b .blog_list_ri{
   padding: 0 2% 12% 2%;
}




@media screen and (max-width: 1400px) {
.stellarnav > ul > li > a {
    font-size: 14px;
    margin: 0 18px;
}

/*產品*/
.product_page .main_part{
    width: 100%;
    max-width: 88%;
}

}
@media screen and (max-width: 1280px) {
.main_header_area .container{
    width: 100%;
    max-width: 96%;
}
.product_page .main_part {
    width: 100%;
    max-width: 88%;
    padding: 8% 0 0 0;
}
.remit_page .main_part{
    width: 100%;
    max-width: 88%;
    margin: auto;
}
.car_page .main_part{
    width: 100%;
    max-width: 88%;
    margin: auto;
}


/*文章1-客戶見證*/
.blog_page.article_a .main_part{
    width: 100%;
    max-width: 88%;
}
.blog_in_page.article_a .main_part{
    width: 100%;
    max-width: 88%;
}


/*文章2-維修實例*/
.blog_page.article_b .main_part{
    width: 100%;
    max-width: 88%;
   
}
.blog_in_page.article_b .main_part{
    width: 100%;
    max-width: 88%;
}


}
@media screen and (max-width: 1024px) {
.header_area {
    position: relative;
    background: #000000;
}
.nav-header{
    width: 18%;
}
.stellarnav ul {
    padding: 1.2% 0 0 0;
}
.stellarnav {
    display: flex;
    justify-content: center;
}
.stellarnav > ul > li > a {
    margin: 0 7px;
    padding-left: 30px;
}
.stellarnav > ul > li > a::before{
    background-size: 70%;
}
.header_area .stellarnav ul{
    text-align: center;
}


}
@media screen and (max-width: 980px) {
.stellarnav > ul > li > a {
    margin: 0;
    padding-left: 24px;
}
.stellarnav > ul > li > a::before{
    background-size: 60%;
}

.main_header_area .container {
    width: 100%;
    max-width: 100%;
}

}
@media screen and (max-width: 768px) {
/* 開啟手機板下方按鈕所需設定 */
.footer.with_shopping_mode { padding:30px 0 70px; }
#to_top { bottom:60px; background: #140a01;color: #ffffff;}
#to_top i:before, #to_top i:after{background: #ffffff;}
.bannerindex { padding:0; margin:0;}
.stellarnav.mobile.left > ul{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background-color:#000000;
}
.stellarnav.mobile > ul > li{
    width: 100%;
    border-bottom: 1px #3d3d3d solid;
}
.stellarnav.mobile ul{
    background: transparent;
}
.stellarnav.mobile li.open {
    background: #272727;
}
.stellarnav.mobile li a{
    border-bottom: none;
}
.stellarnav > ul > li > a::before{
    display: none;
}
.stellarnav.mobile.left .close-menu{
    background: transparent;
}
.me_tp_features {
    text-align: center;
    padding-top: 12px;
    margin: 0 0 8px 0;
}
.stellarnav .menu-toggle {
    padding: 50px 10px;
}
#bottom_menu li a{
    color: #ffffff;
}
#bottom_menu{
    border-top: 1px solid #1e1e1e;
    background: #000000;
    background-repeat: repeat-y;
}
.stellarnav .menu-toggle:after{
    color: #ffffff;
}
.stellarnav .menu-toggle span.bars span{
    background: #ffffff;
}
.stellarnav.mobile.right > ul, .stellarnav.mobile.left > ul{
    border-right: 1px #1a1a1a solid;
}
.stellarnav .menu-toggle {
    padding: 30px 10px;
}
/*抬頭*/
.nav-header {
    width: 100%;
    padding: 2% 0;
}
/*手機板大圖*/
.pageIndex .swiper-wrapper .swiper-slide:nth-child(1)::before,.pageIndex .swiper-wrapper .swiper-slide:nth-child(2)::before{display: none;}
.pageIndex .swiper-banner .swiper-slide:nth-child(2)::after,.pageIndex .swiper-banner .swiper-slide:nth-child(1)::after{display: none;}
.pageIndex .bannerindex .swiper-slide img { display:none; }
.pageIndex .bannerindex .swiper-slide {width: 100%;height: 0;padding-bottom: calc(100% / 3 * 4);}
.pageIndex  .swiper-slide:nth-child(1) { background-image:url(https://pic03.eapple.com.tw/zrxmobile/pnone_big1.jpg) ; background-size:cover;   background-position: center;}
.pageIndex .swiper-slide:nth-child(2) { background-image:url(https://pic03.eapple.com.tw/zrxmobile/pnone_big2.jpg) ; background-size:cover;   background-position: center;}

/*產品*/
.product_menu_list,
.products-list,
.product-wrapper { width: 100%;}
.product-layer-two { margin-right: 0; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); grid-gap: 5px;}
.product_page .product-layer-two,
.product_page .products-list { width: 100%; border-right: none;}
.product_page .product_menu_list>h5{display: block;}
.product_page .show_content > a { order: 1;}
.product_page ul.products-list { order: 2;}
.product_page ul.page { order: 3;}
.product_page .product_menu_list {width: 100%; order: 0; min-height: unset;}
.products-list{grid-template-columns: 1fr 1fr;}
.product_menu_list ul{grid-template-columns: repeat(2, 1fr);}
.product_page .main_part{padding: 2% 0 0 0;}
.product_info_page .main_part{width: 100%;max-width: 84%;}
.product_pic {
    padding-left: 0;
    padding-right: 0;
}

/*文章*/
.blog_le {
    width: 100%;
}
.blog_ri {
    width: 100%;
    padding: 0;
}

/*文章2-維修實例*/
.blog_page.article_b .blog_subbox {
    grid-template-columns: 1fr 1fr;
}


}
@media screen and (max-width: 600px) {
/*產品*/
.products-list{grid-template-columns: 1fr ;}

/*文章1-客戶見證*/
.blog_page.article_a .subbox_item a{
    grid-template-columns: 10% 1fr;
    padding-bottom: 12%;
}

/*文章2-維修實例*/
.blog_page.article_b .blog_subbox {
    grid-template-columns: 1fr;
}

}

