/* 页头移动端搜索组件 */
.searchForm #searchForm2 {
    display: flex;
    justify-content: space-between;
}

@media only screen and (min-width: 950px) {
    .searchForm {
        display: none !important;
    }
}

.searchForm #searchBtn2 {
    height: 40px;
    width: 40px;
    border: none;
    background-color: var(--commonButton);
    color: var(--commonButtonText);
}

.searchForm input {
    width: calc(100% - 45px);
    height: 40px;
    border: 1px solid var(--commonLine);
    padding: 5px;
    color: var(--commonWord);
}

/* 页尾询盘组件 */
.footerInput #subscribe_email {
    color: var(--commonWord);
}

/* 询盘弹框（公共组件所用） */
@media (max-width: 767px) {
    .contact .contactItem {
        flex: 0 0 100% !important;
    }

    #productModal {
        width: 100vw;
    }

    #productModal .contactDiglog {
        width: calc(100vw - 30px);
    }
}

#productModal {
    width: calc(100vw + 17px);
}

#productModal .contactDiglog {
    width: 600px;
    padding: 24px 20px 0px;
    margin: 7% auto;
    font-size: 14px;
}

#productModal .contactDiglog .contact-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

#productModal .contactDiglog .contact-header .modal-header-title {
    font-size: 20px;
    font-weight: 500;
    color: var(--commonTitle);
    line-height: 30px;
}

#productModal .contactDiglog .contact-header i {
    cursor: pointer;
    color: var(--commonIcon);
    font-size: 18px;
}

#productModal .contactDiglog .contactContent {
    font-size: 14px;
    font-weight: 400;
    color: var(--commonContent);
    line-height: 21px;
    margin-bottom: 30px;
}

/* 目录的箭头指向 */
.iconZDY-ic_rightArrow::before {
    content: "\e75f";
}

@media only screen and (max-width: 950px) {
    .iconZDY-ic_rightArrow::before {
        position: absolute;
        right: 0;
        top: 0;
        color: var(--commonIcon);
        font-size: 12px;
    }
}

@media only screen and (min-width: 950px) {
    .iconZDY-ic_rightArrow::before {
        content: "\e767" !important;
    }
}

/*
 * Late overrides for shared components.
 *
 * Common-page styles are loaded independently by each route and contain
 * legacy fixed colors. Keep these theme-scoped overrides at the end so
 * configured colors remain effective without changing shared styles.
 */

/* Page defaults, links and header controls. */
html {
    /* Keep the body as the single scroll container used by WOW.js. */
    overflow-x: hidden;
}

html body {
    color: var(--commonWord);
    background-color: var(--commonBackground);
}

html body main,
html body .web_main,
html body .page_main,
html body .shop-area,
html body .area-noBg {
    background-color: var(--commonBackground);
}

html body a {
    color: var(--commonWord);
}

html body a:hover,
html body a:focus,
html body a:focus-visible {
    color: var(--commonHover);
}

html body .web_head {
    background-color: var(--headBackground);
}

html body .nav_wrap {
    background-color: var(--headBackground);
    border-top-color: var(--commonButton);
}

html body .nav_wrap .head_nav > li > a {
    color: var(--headBackgroundText);
}

html body .nav_wrap .head_nav li li a {
    color: var(--commonWord);
    background-color: var(--commonBackground);
}

html body .nav_wrap .head_nav li li a:hover,
html body .nav_wrap .head_nav li li a:focus-visible {
    color: var(--commonHover);
    background-color: var(--commonBackground2);
}

html body .web_head .top_bar,
html body .header-pos,
html body .web_head .nav_wrap,
html body .fixed-nav-active .nav_wrap {
    background-color: var(--headBackground);
}

html body .web_head .nav_wrap,
html body .web_head .nav_wrap a,
html body .nav_wrap .head_nav > li > a,
html body .nav_wrap .head_nav > li > a em {
    color: var(--headBackgroundText);
}

html body .nav_wrap .head_nav > li > a,
html body .nav_wrap .head_nav > li > a em {
    background-color: transparent;
}

html body .nav_wrap .head_nav > li:hover > a,
html body .nav_wrap .head_nav > li:hover > a em,
html body .nav_wrap .head_nav > li:hover > a b,
html body .nav_wrap .head_nav li a:hover {
    color: var(--commonHover);
    background-color: transparent;
}

html body .nav_wrap .head_nav > li > a b {
    color: var(--headIcon);
}

html body .nav_wrap .head_nav li li a b {
    color: var(--commonWord);
    background-color: transparent;
}

html body .head_svbar {
    color: var(--commonWord);
    background-color: var(--commonBackground);
}

html body .head_svbar .iconfont,
html body .head_svbar .sv_ico {
    color: var(--commonIcon);
}

html body .head_svbar .sv_txt {
    color: var(--commonWord);
}

html body #header > div.head_svbar > div > ul > li > a {
    display: flex;
    align-items: center;
    justify-content: center;
}

html body .web_head .header-right .iconfont,
html body .web_head .nav-side-icon-parent .iconfont {
    color: var(--headIcon) !important;
}

html body .web_head .header-form,
html body .web_head .meneSettingList {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body .web_head .header-form input,
html body .web_head .meneSetting form input {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body .web_head .header-form input::placeholder,
html body .web_head .meneSetting form input::placeholder {
    color: var(--commonContent);
}

html body .web_head .header-form button,
html body .web_head .meneSetting form button {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

html body .web_head .header-form button:hover,
html body .web_head .header-form button:focus-visible,
html body .web_head .meneSetting form button:hover,
html body .web_head .meneSetting form button:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonHover);
    border-color: var(--commonHover);
}

html body .web_head .meneSettingList .settingtitle,
html body .web_head .meneSettingList .dropdown-toggle,
html body .web_head .meneSettingList .dropdown-item,
html body .web_head .meneSettingList .userItem {
    color: var(--commonWord);
}

html body .web_head .meneSettingList .dropdown-item:hover,
html body .web_head .meneSettingList .dropdown-item:focus-visible,
html body .web_head .meneSettingList .userItem:hover {
    color: var(--commonHover);
    background-color: var(--commonBackground2);
}

/* Breadcrumbs, banners and generic controls. */
html body .breadcrumb-area-noBg {
    color: var(--commonContent);
    background-color: var(--commonBackground);
    box-shadow: 0 1px 0 0 var(--commonLine);
}

html body .breadcrumb-list ul li,
html body .breadcrumb-list ul li a,
html body .breadcrumb-list ul li .divider {
    color: var(--commonContent) !important;
}

html body .breadcrumb-list ul li a:hover,
html body .breadcrumb-list ul li a:focus-visible {
    color: var(--commonHover) !important;
}

html body .topBanner .topBannerTitle {
    color: var(--commonTitle);
}

html body .topBanner .topBannerSubtitle {
    color: var(--commonContent);
}

html body .btn,
html body .sys_btn,
html body .fourZeroFourBtn,
html body .productContact,
html body .blogBtn,
html body .footerInputBtn,
html body .inquiryButton {
    color: var(--commonButtonText) !important;
    background-color: var(--commonButton) !important;
    border-color: var(--commonButton) !important;
}

html body .btn:hover,
html body .btn:focus,
html body .btn:focus-visible,
html body .btn:active,
html body .sys_btn:hover,
html body .sys_btn:focus-visible,
html body .fourZeroFourBtn:hover,
html body .fourZeroFourBtn:focus-visible,
html body .productContact:hover,
html body .productContact:focus-visible,
html body .blogBtn:hover,
html body .blogBtn:focus-visible,
html body .footerInputBtn:hover,
html body .footerInputBtn:focus-visible,
html body .inquiryButton:hover,
html body .inquiryButton:focus-visible {
    color: var(--commonButtonText) !important;
    background-color: var(--commonHover) !important;
    border-color: var(--commonHover) !important;
}

html body .btn:disabled,
html body .btn[disabled],
html body .sys_btn:disabled,
html body .sys_btn[disabled] {
    color: var(--commonContent) !important;
    background-color: var(--commonLine) !important;
    border-color: var(--commonLine) !important;
}

html body input,
html body textarea,
html body select {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body input::placeholder,
html body textarea::placeholder,
html body select::placeholder {
    color: var(--commonContent);
}

html body input:focus,
html body textarea:focus,
html body select:focus,
html body input:focus-visible,
html body textarea:focus-visible,
html body select:focus-visible {
    border-color: var(--commonHover);
    outline-color: var(--commonHover);
}

/* Footer and floating actions. */
html body footer#footer.web_footer,
html body footer#footer.web_footer .foot_items,
html body footer#footer.web_footer .foot_bar {
    color: var(--footBackgroundText);
    background-color: var(--footBackground);
}

html body footer#footer.web_footer a,
html body footer#footer.web_footer .foot_item,
html body footer#footer.web_footer .foot_item a,
html body footer#footer.web_footer .copyright {
    color: var(--footBackgroundText);
}

html body footer#footer.web_footer .foot_item .title,
html body footer#footer.web_footer .foot_item .title a {
    color: var(--footBackgroundTitle);
}

html body footer#footer.web_footer .foot_item .iconfont,
html body footer#footer.web_footer .foot_sns a .iconfont,
html body footer#footer.web_footer .foot_sns a i {
    color: var(--footIcon);
}

html body footer#footer.web_footer .foot_sns li a {
    background-color: var(--footLine);
    border-color: var(--footLine);
}

html body footer#footer.web_footer .foot_item a:hover,
html body footer#footer.web_footer .foot_item a:focus-visible,
html body footer#footer.web_footer .foot_sns a:hover,
html body footer#footer.web_footer .foot_sns a:hover .iconfont {
    color: var(--commonHover);
}

html body footer#footer.web_footer .foot_sns li a:hover {
    background-color: var(--commonHover);
}

html body footer#footer.web_footer .foot_sns a:hover .iconfont,
html body footer#footer.web_footer .foot_sns a:hover i {
    color: var(--footIcon) !important;
}

html body footer#footer.web_footer .footerInput input,
html body footer#footer.web_footer #subscribe_email {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body .footerButton > a,
html body .footerButton .inquiryButton,
html body a#scrollUp {
    color: var(--commonButtonText) !important;
    background-color: var(--commonButton) !important;
    border-color: var(--commonButton) !important;
}

html body .footerButton > a:hover,
html body .footerButton .inquiryButton:hover,
html body a#scrollUp:hover {
    color: var(--commonButtonText) !important;
    background-color: var(--commonHover) !important;
    border-color: var(--commonHover) !important;
}

/* Clip the featured-category track without clipping its side navigation buttons. */
html body #banner_featuredGategories {
    overflow: hidden;
}

html body #banner_featuredGategories .product_slider_viewport,
html body #banner_newArrivals .product_slider_viewport {
    position: relative;
    width: 100%;
    overflow: hidden;
}

/* Product/category lists and pagination. */
html body .productListTitle,
html body .productListTitle h2,
html body .productTagTitle,
html body .productList_product_contect .productName,
html body .tagListCommonTitle {
    color: var(--commonTitle);
}

html body .productListDesc,
html body .productListGroupItemTop,
html body .productList_product_contect .productDesc,
html body .productList_product_contect .productDesc p,
html body .productFont {
    color: var(--commonContent);
}

html body .productListGroupItemTop {
    background-color: var(--commonBackground2);
    border-color: var(--commonLine);
}

html body .productListGroupItemTop a,
html body .productList_product_contect .productListGroupItemRight {
    color: var(--commonWord);
}

html body .productListGroupItemTop a:hover,
html body .productListGroupItemTop a:focus-visible,
html body .productList_product_contect .productName:hover {
    color: var(--commonHover);
}

html body .productList_product_contect .price,
html body .productList_product_contect .productPrice,
html body .recent-product .price {
    color: var(--commonPrice);
}

html body .productList_product_contect,
html body .productList_product_contect .productButton .buyBtn,
html body .productTagList .tagItem,
html body .tagList .tagItem,
html body .productBottomPagination a,
html body .productListGroupItemLeft .dropdown .dropdownInput {
    border-color: var(--commonLine);
}

html body .productList_product_contect .productButton .buyBtn {
    color: var(--commonWord);
    background-color: var(--commonBackground);
}

html body .productList_product_contect .productButton .buyBtn:hover,
html body .productList_product_contect .productButton .buyBtn:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

html body .productTagList .tagItem,
html body .tagList .tagItem {
    color: var(--commonWord);
}

html body .productTagList .tagItem:hover,
html body .productTagList .tagItem:focus-visible,
html body .tagList .tagItem:hover,
html body .tagList .tagItem:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

html body ul.pagination > li > a,
html body ul.pagination > li > span,
html body ul.pagination > .disabled > a,
html body ul.pagination > .disabled > span,
html body .productBottomPagination a,
html body .shop-breadcrumb ul li a {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body ul.pagination > li > a:hover,
html body ul.pagination > li > a:focus-visible,
html body ul.pagination > li > span:hover,
html body ul.pagination > li > span:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonHover);
    border-color: var(--commonHover);
}

html body ul.pagination > .active > a,
html body ul.pagination > .active > span,
html body .productBottomPagination .pagination .active a,
html body .shop-breadcrumb ul li.active a,
html body .shop-breadcrumb ul li a:hover {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

html body .productNav a,
html body .productNav .nav-item .nav-link,
html body .productNav .dropdown-menu .dropdown-item {
    color: var(--commonWord);
}

html body .productNav .nav-item {
    border-bottom-color: var(--commonLine);
}

html body .productNav .nav-item::before {
    background-color: var(--commonIcon);
}

html body .productNav .dropdown-menu {
    color: var(--commonWord);
    background-color: var(--commonBackground);
}

html body .productNav a:hover,
html body .productNav a:focus-visible,
html body .productNav .dropdown-menu .dropdown-item:hover,
html body .productNav .dropdown-menu .dropdown-item:focus-visible {
    color: var(--commonHover);
}

html body .searchEmpty .searchEmptyText {
    color: var(--commonContent);
}

/* Product details, media, SKU and related products. */
html body .product-container .product-name,
html body .product-container .productName,
html body .product-container .productAttTitel,
html body .product-container .ProductAttr-title,
html body .product-container .relatedProductTitle,
html body .product-container .questionAnswer .qaTitle {
    color: var(--commonTitle) !important;
}

html body .product-container .product-des,
html body .product-container .productAttText,
html body .product-container .ProductAttr-text,
html body .product-container .productDetail-share label,
html body .product-container .relatedProduct .relatedProductListItem a {
    color: var(--commonContent) !important;
}

html body .product-container .product-detail-content {
    color: var(--commonContent);
    background-color: var(--commonBackground);
}

html body .product-container .productDetailsContent {
    color: var(--commonWord);
    background-color: var(--commonBackground);
}

html body .product-container .product-detail-content .price,
html body .product-container .fob-price .price,
html body .product-container .skuSpec-wrapper .skuPrice-list .skuPrice-item .price,
html body .product-container .relatedProduct .relatedProductListItem .price,
html body #productContactDetail #productContactPrice {
    color: var(--commonPrice);
}

html body .product-container .product-des,
html body .product-container .productDetailsImgList .imgItem,
html body .product-container .product-tab-desc,
html body .product-container ul.pro-details-tab,
html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .spec-img,
html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .spec-label,
html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .spec-quantity,
html body .product-container .product-tab-desc table,
html body .product-container .product-tab-desc table td,
html body .product-container .questionAnswer textarea,
html body .product-container .questionAnswer .questionAnswerList,
html body .product-container .reviewsTop,
html body .product-container .reviewsDetail .reviewsDetailList {
    border-color: var(--commonLine) !important;
}

html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .spec-label,
html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .spec-quantity,
html body .product-container .productDetailsImgList .imgItem {
    color: var(--commonWord);
    background-color: var(--commonBackground);
}

html body .product-container .productDetail-share .iconfont,
html body .product-container .productDetail-share a i,
html body .product-container .skuSpec-wrapper .spec-qty .input-wrapper .iconfont,
html body .productFileUp .upImg,
html body .productShareLink .upImg {
    color: var(--commonIcon);
}

html body .product-container .productDetailBtn,
html body .product-container .skuSpec-wrapper .shopping-btn-group .butNow-btn {
    color: var(--commonButtonText) !important;
    background-color: var(--commonButton) !important;
    border-color: var(--commonButton) !important;
}

html body .product-container .skuSpec-wrapper .shopping-btn-group .addToCart-btn {
    color: var(--commonButton) !important;
    background-color: var(--commonBackground) !important;
    border-color: var(--commonButton) !important;
}

html body .product-container .productDetailBtn:hover,
html body .product-container .productDetailBtn:focus-visible,
html body .product-container .productDetailBtn:active,
html body .product-container .skuSpec-wrapper .shopping-btn-group .butNow-btn:hover,
html body .product-container .skuSpec-wrapper .shopping-btn-group .butNow-btn:focus-visible,
html body .product-container .skuSpec-wrapper .shopping-btn-group .addToCart-btn:hover,
html body .product-container .skuSpec-wrapper .shopping-btn-group .addToCart-btn:focus-visible {
    color: var(--commonButtonText) !important;
    background-color: var(--commonHover) !important;
    border-color: var(--commonHover) !important;
}

html body .product-container .productDetailsImgList .imgItem:hover,
html body .product-container .productDetailsImgList .imgItem.active,
html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .active .spec-img,
html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .active .spec-label {
    border-color: var(--commonButton) !important;
}

html body .product-container ul.pro-details-tab li a {
    color: var(--commonWord);
}

html body .product-container ul.pro-details-tab li.active,
html body .product-container ul.pro-details-tab li.active a {
    color: var(--commonButton);
    border-color: var(--commonButton);
}

html body .product-container .outOfRange,
html body .product-container .error-tips,
html body .customize-inquiry .inquiry-form .empty-tip,
html body .customize-inquiry .inquiry-form .form-item .item-label .is-required {
    color: var(--commonHot);
}

html body .videoShadow i,
html body .product-swiper .videoShadow i,
html body .trademarkShadow .trademarkBox i,
html body #video_page .videoBox i,
html body .aboutVideoShadow i {
    color: var(--commonButtonText);
}

html body #document-download > h2,
html body #document-download > ul > li > .document-info > h3 {
    color: var(--commonTitle);
}

html body #document-download > ul > li:hover {
    background-color: var(--commonBackground2);
}

html body #document-download > ul > li > .document-info > div > span {
    color: var(--commonButton);
}

html body .questionAnswer .questionAnswerList .questionAnswerItem .qaTitle {
    color: var(--commonWord);
    background-color: var(--commonBackground2);
}

html body .questionAnswer .questionAnswerList .questionAnswerItem .qaRight .qaText,
html body .questionAnswer .questionAnswerList .questionAnswerItem .qaRight .qaTime,
html body .reviewsTop,
html body .reviewsDetail .reviewsDetailList,
html body .relatedProduct .relatedProductListItem a {
    color: var(--commonContent);
}

html body .reviewsTop .starScore .starScoreTitle,
html body .reviewsTop .starScore .starScoreRight .starScoreRightStars i,
html body .reviewsDetail .reviewsDetailList .reviewsListTop i {
    color: var(--commonHot);
}

html body .reviewsTop .starList .starListItem .starsLine .starsInLine {
    background-color: var(--commonBackground2);
}

html body .reviewsTop .starList .starListItem .starsLine .starsInLine .redLine {
    background-color: var(--commonHot);
}

/* Blog, About, policy, 404 and contact pages. */
html body .blogTitle,
html body .blogTitle a,
html body .blogItem .blogContect .blogTitle,
html body .blogItem .blogContect .blogTitle a,
html body .blogDetailTitle,
html body .article-full__title,
html body .article-intro__title,
html body .aboutTitle,
html body .contactTitle {
    color: var(--commonTitle);
}

html body .blogTime,
html body .blogDesc,
html body .blogDetailTime,
html body .blogDetailContect,
html body .article-full__info,
html body .article-full__date,
html body .article-full__content,
html body .article-full__content p,
html body .article-full__bottom,
html body .aboutStoryContect,
html body .aboutInfoText,
html body .contactInfoText {
    color: var(--commonContent);
}

html body .blogTime,
html body .blogDetailTime,
html body .article-full__bottom,
html body .article-full__content blockquote {
    border-color: var(--commonLine);
}

html body .blogTitle a:hover,
html body .blogTitle a:focus-visible,
html body .blogDetailButton a:hover,
html body .blogDetailButton a:focus-visible,
html body .article-full__content a:hover,
html body .article-full__content a:focus-visible {
    color: var(--commonHover);
}

html body .blogDetailButton a,
html body .blogPagination a {
    color: var(--commonWord);
}

html body .blogPagination a {
    border-color: var(--commonLine);
}

html body .blogPagination .active a,
html body .blogPagination a:hover,
html body .blogPagination a:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

html body .blogDetail-share .social-share-icon,
html body .article-full__bottom .social__link,
html body .article-intro__bottom .social__link,
html body .article-full__bottom .social-share-icon,
html body .article-intro__bottom .social-share-icon {
    color: var(--commonIcon);
    background-color: var(--commonBackground2);
    border-color: var(--commonLine);
}

html body .blogDetail-share .social-share-icon:hover,
html body .blogDetail-share .social-share-icon:focus-visible,
html body .article-full__bottom .social__link:hover,
html body .article-full__bottom .social__link:focus-visible,
html body .article-intro__bottom .social__link:hover,
html body .article-intro__bottom .social__link:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonHover);
    border-color: var(--commonHover);
}

html body .aboutInfo .aboutInfoList .aboutInfoItem .aboutInfoTitle {
    color: var(--commonWord);
}

html body .aboutInfo .aboutInfoList .aboutInfoItem .aboutInfoText {
    color: var(--commonContent);
    border-color: var(--commonLine);
}

html body .aboutTrademarkName {
    color: var(--commonWord);
}

html body .aboutMap {
    background-color: var(--commonBackground2);
}

html body .aboutMapAddressTitle,
html body .aboutMapTitle,
html body .aboutDownload .aboutTitle {
    color: var(--commonTitle);
}

html body .aboutMapAddressText,
html body .aboutDownload .aboutDownloadList .aboutDownloadItem .aboutDownloadName,
html body .aboutDownload .aboutDownloadList .aboutDownloadItem .aboutDownloadName a {
    color: var(--commonContent);
}

html body .aboutMapDesc .aboutMapButton {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

html body .aboutMapDesc .aboutMapButton:hover,
html body .aboutMapDesc .aboutMapButton:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonHover);
    border-color: var(--commonHover);
}

html body .aboutDownload .aboutDownloadList .aboutDownloadItem {
    border-color: var(--commonLine);
}

html body .aboutDownload .aboutDownloadList .aboutDownloadItem > a,
html body .aboutDownload .aboutDownloadList .aboutDownloadItem > a .iconfont {
    color: var(--commonIcon);
}

html body .policyPage .policyTitle,
html body .fourZeroFour .fourZeroFourTitle {
    color: var(--commonTitle);
}

html body .policyPage .policyText,
html body .fourZeroFour .fourZeroFourText {
    color: var(--commonContent);
}

html body .policyPage a,
html body .fourZeroFour a {
    color: var(--commonButton);
}

html body .policyPage a:hover,
html body .policyPage a:focus-visible,
html body .fourZeroFour a:hover,
html body .fourZeroFour a:focus-visible {
    color: var(--commonHover);
}

/* Inquiry page, forms and both modal implementations. */
html body .inquiryPage .inquiry-header,
html body #productModal .contactDiglog .contact-header .modal-header-title,
html body #inquiryModal .contactDiglog .contact-header .modal-header-title {
    color: var(--commonTitle);
}

html body .inquiryPage .inquiry-table-header,
html body .inquiryPage .selectDataHeader,
html body .selectDataHeader {
    color: var(--commonWord);
    background-color: var(--commonBackground2);
}

html body .inquiryPage .inquiry-item,
html body .inquiryPage .inquiryListNull,
html body .inquiryPage .inquiry-item .inquiry-item-right input,
html body #inquiryModal .contactDiglog,
html body .customize-inquiry .inquiry-form .form-item .item-con input,
html body .customize-inquiry .inquiry-form .form-item .item-con textarea,
html body .customize-inquiry .inquiry-form .form-item .item-con select {
    border-color: var(--commonLine);
}

html body .inquiryPage .inquiry-item .inquiry-item-left .detail,
html body .inquiryPage .inquiry-item .inquiry-item-right,
html body .inquiryPage .inquiry-item .inquiry-item-right .inquiry-item-unit,
html body .inquiryPage .selectDataHeader span,
html body .customize-inquiry .inquiry-form .form-item .item-label,
html body .customize-inquiry .inquiry-form .form-item .item-label .show-name {
    color: var(--commonWord);
}

html body .inquiryPage .inquiry-item .inquiry-item-left .skuList,
html body .inquiryPage .inquiryListNull,
html body #inquiryModal .contactDiglog,
html body #inquiryModal .productContactTips,
html body #inquiryModal .filesList .filesItem {
    color: var(--commonContent);
}

html body .inquiryPage .inquiry-item .inquiry-item-left .price {
    color: var(--commonPrice);
}

html body .inquiryPage .inquiry-item .inquiry-item-center span {
    color: var(--commonHot);
    border-color: var(--commonHot);
}

html body .inquiryPage .inquiry-item .inquiry-item-right input,
html body #inquiryModal .contact input,
html body #inquiryModal .contact textarea,
html body #inquiryModal .contact select,
html body #inquiryModal .shareInputBox input,
html body .customize-inquiry .item-input,
html body .customize-inquiry .item-textarea,
html body .customize-inquiry .item-select {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body #inquiryModal .contact input::placeholder,
html body #inquiryModal .contact textarea::placeholder,
html body #inquiryModal .shareInputBox input::placeholder,
html body .customize-inquiry .item-input::placeholder,
html body .customize-inquiry .item-textarea::placeholder {
    color: var(--commonContent);
}

html body #inquiryModal .contact input:focus,
html body #inquiryModal .contact textarea:focus,
html body #inquiryModal .shareInputBox input:focus,
html body .customize-inquiry .item-input:focus,
html body .customize-inquiry .item-textarea:focus,
html body .customize-inquiry .item-select:focus {
    border-color: var(--commonHover);
}

html body #productModal .contactDiglog,
html body #inquiryModal .contactDiglog {
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body #productModal .contactDiglog .contact-header i,
html body #inquiryModal .contactDiglog .contact-header i,
html body #inquiryModal .selectDataHeader .iconfont {
    color: var(--commonIcon);
}

html body #productModal .contactDiglog .contact-header i:hover,
html body #inquiryModal .contactDiglog .contact-header i:hover {
    color: var(--commonHover);
}

html body #productModal .contactDiglog .contactContent,
html body #inquiryModal .contactDiglog .contactContent {
    color: var(--commonContent);
}

html body .inquiryPagination .inquiryPaginationBtn {
    color: var(--commonButton);
    background-color: var(--commonBackground);
    border-color: var(--commonButton);
}

html body .inquiryPagination .inquiryPaginationBtnActive,
html body .inquiryPagination .inquiryPaginationBtn:hover,
html body .inquiryPagination .inquiryPaginationBtn:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

/* Mobile header controls are outside the desktop header container. */
@media only screen and (max-width: 950px) {
    html body .mobile-head-items {
        color: var(--headBackgroundText);
        background-color: var(--headBackground);
    }

    html body .mobile-head-item .title,
    html body .mobile-head-item .title a {
        color: var(--headBackgroundText);
    }

    html body .mobile-head-item .main-content-wrap {
        color: var(--commonWord);
        background-color: var(--commonBackground);
    }

    html body .mobile-head-item .main-content-wrap .head_nav a,
    html body .mobile-head-item .main-content-wrap .head_nav li {
        color: var(--commonWord);
        border-color: var(--commonLine);
    }

    html body .mobile-head-item .main-content-wrap .head_nav a:hover,
    html body .mobile-head-item .main-content-wrap .head_nav a:focus-visible {
        color: var(--commonHover);
    }

    html body .mobile-head-item .main-content-wrap .searchForm input {
        color: var(--commonWord);
        background-color: var(--commonBackground);
        border-color: var(--commonLine);
    }

    html body .mobile-head-item .main-content-wrap .searchForm input::placeholder {
        color: var(--commonContent);
    }

    html body .mobile-head-item .main-content-wrap .searchForm button {
        color: var(--commonButtonText);
        background-color: var(--commonButton);
        border-color: var(--commonButton);
    }

    html body .mobile-head-item .main-content-wrap .searchForm button .iconfont {
        color: var(--commonButtonText);
    }
}

/*
 * Historical common-page coverage.
 * These selectors were present in the completed neighboring-theme bindings
 * but were missing from theme10072. Keep them scoped here because the shared
 * page styles are loaded independently and cannot be edited for one theme.
 */
html body .sidebarWidgetTitle {
    color: var(--commonTitle);
}

html body .sidebarWidgetLine {
    background-color: var(--commonLine);
}

html body .productNav .dropdown-toggle,
html body .productNav .dropdown-toggle .iconfont {
    color: var(--commonIcon);
}

html body .productNav .dropdown-toggle:hover,
html body .productNav .dropdown-toggle:focus-visible,
html body .productNav .dropdown-toggle:hover .iconfont,
html body .productNav .dropdown-toggle:focus-visible .iconfont {
    color: var(--commonHover);
}

html body .web_head .meneSetting .meneSettingList .dropdown-menu,
html body .web_head #google-translate-container,
html body .web_head .goog-te-combo {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body .web_head .searchForm input {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body .web_head .searchForm input::placeholder {
    color: var(--commonContent);
}

html body .web_head .searchForm button,
html body footer#footer.web_footer .footerInputBtn,
html body footer#footer.web_footer #subscribe_btn {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

html body .web_head .searchForm button:hover,
html body .web_head .searchForm button:focus-visible,
html body footer#footer.web_footer .footerInputBtn:hover,
html body footer#footer.web_footer #subscribe_btn:hover {
    color: var(--commonButtonText);
    background-color: var(--commonHover);
    border-color: var(--commonHover);
}

html body .web_head .searchForm button .iconfont {
    color: var(--commonButtonText);
}

html body .web_head .meneSetting .meneSettingList .settingtitle {
    color: var(--commonContent);
}

html body .web_head .meneSetting .meneSettingList .dropdown-toggle,
html body .web_head .meneSetting .meneSettingList .dropdown-menu > li > a,
html body .web_head .meneSetting .meneSettingList .userList .userItem {
    color: var(--commonWord);
    border-color: var(--commonLine);
}

html body .web_head .meneSetting .meneSettingList .dropdown-menu > li > a:hover,
html body .web_head .meneSetting .meneSettingList .userList .userItem:hover {
    color: var(--commonHover);
    background-color: var(--commonBackground2);
}

html body footer#footer.web_footer .foot_contact_list,
html body footer#footer.web_footer .foot_intro_desc {
    color: var(--footBackgroundText);
}

html body .product-container .inquiryBasket,
html body .product-container .product-detail-content .price-list .price-item .quantity,
html body .product-container .product-detail-content .fob-price .unit,
html body .product-container .product-detail-content .fob-price .min-price,
html body .product-container .skuSpec-wrapper .skuPrice-list .skuPrice-item .interval,
html body .product-container .skuSpec-wrapper .spec-wrapper,
html body .product-container .skuSpec-wrapper .spec-wrapper .selected-label {
    color: var(--commonContent);
}

html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .spec-item .spec-img,
html body .product-container .skuSpec-wrapper .spec-wrapper .spec-list .spec-item .spec-label,
html body .product-container .skuSpec-wrapper .spec-wrapper .spec-quantity,
html body .productDetailsImgList .imgItem {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body .productDetailLeft .productDetail-share .social-share .iconfont,
html body .productDetailLeft .pswp-trigger .iconfont {
    color: var(--commonIcon);
}

html body #productContactDetail #productContactName {
    color: var(--commonTitle);
}

html body .product-container .product-tab-desc table,
html body .product-container .product-tab-desc table td,
html body .product-container .questionAnswer .questionAnswerItem .qaLine,
html body .product-container .reviewsDetail .reviewsDetailList {
    border-color: var(--commonLine);
}

html body .reviewsDetail .reviewsDetailList .reviewsListInformation .buyerName,
html body .reviewsDetail .reviewsDetailList .reviewsListInformation .countryName,
html body .reviewsDetail .reviewsDetailList .reviewsListContcet,
html body .reviewsDetail .reviewsDetailList .reviewsListTop .reviewsDetailList_time {
    color: var(--commonContent);
}

html body .relatedProduct .relatedProductListItem a:hover,
html body .relatedProduct .relatedProductListItem a:focus-visible {
    color: var(--commonHover);
}

html body .freight-modal,
html body .freight-modal .modal-content,
html body .freight-modal .modal-content .modal-body .table-con .table-body .body-item .item {
    color: var(--commonContent);
    background-color: var(--commonBackground);
}

html body .freight-modal .modal-content .modal-header-new,
html body .freight-modal .modal-content .modal-body .table-con .table-body .body-item .item {
    border-color: var(--commonLine);
}

html body .freight-modal .modal-content .modal-header-new .header-title,
html body .freight-modal .modal-content .modal-body .table-con .table-body .body-item .item {
    color: var(--commonWord);
}

html body .freight-modal .modal-content .modal-body .table-con .table-header {
    background-color: var(--commonBackground2);
}

html body .freight-modal .modal-content .modal-body .table-con .table-header .header-item {
    color: var(--commonContent);
}

html body .freight-modal .modal-content .modal-footer .apply-btn {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
    border-color: var(--commonButton);
}

html body .contact-page-sidebar {
    color: var(--footBackgroundText);
    background-color: var(--commonTitle);
}

html body .contact-page-sidebar p,
html body .contact-page-sidebar .contacts-list li,
html body .contact-page-sidebar .contacts-list li a,
html body .contact-page-sidebar .contacts-list li span {
    color: var(--footBackgroundText);
}

html body .contact-page-sidebar .contacts-list .label {
    color: var(--commonButton);
}

html body .contact-page-box .block-form,
html body .customize-inquiry,
html body .customize-inquiry .inquiry-form,
html body .customize-inquiry .inquiry-form .item-con {
    color: var(--commonWord);
}

html body .contact-page-box input,
html body .contact-page-box textarea {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body .contact-page-box input::placeholder,
html body .contact-page-box textarea::placeholder {
    color: var(--commonContent);
}

html body .customize-inquiry .productContactBottom .upImg,
html body .customize-inquiry .productShareLink .upImg,
html body .customize-inquiry .productContactTips,
html body .customize-inquiry .filesList .filesItem {
    color: var(--commonContent);
}

html body .customize-inquiry .filesList .filesItem:hover {
    background-color: var(--commonBackground2);
}

html body .customize-inquiry .inquiry-form .form-item .item-con .item-select:focus,
html body .customize-inquiry .inquiry-form .form-item .item-con .item-textarea:focus,
html body .customize-inquiry .inquiry-form .form-item .item-con .item-input:focus,
html body .customize-inquiry .shareInputBox input:focus {
    border-color: var(--commonHover);
    outline-color: var(--commonHover);
}

html body .modal-content {
    color: var(--commonWord);
    background-color: var(--commonBackground);
}

html body #productModal .contactDiglog,
html body #productModal .contactDiglog input,
html body #productModal .contactDiglog textarea,
html body #productModal .contactDiglog select {
    color: var(--commonWord);
    background-color: var(--commonBackground);
    border-color: var(--commonLine);
}

html body #inquiryModal .contactItem p {
    color: var(--commonHot);
}

html body #inquiryModal .filesList .filesItem:hover {
    background-color: var(--commonBackground2);
}

html body #inquiryModal .productContactBottom .upImg,
html body #inquiryModal .productShareLink .upImg,
html body #inquiryModal .productContactTips {
    color: var(--commonContent);
}

html body #inquiryModal .contactDiglog .contact-header i:focus-visible {
    color: var(--commonHover);
}

html body .blogDetail-share .social-share-icon:hover,
html body .blogDetail-share .social-share-icon:focus-visible,
html body .article-full__bottom .social-share-icon:hover,
html body .article-full__bottom .social-share-icon:focus-visible,
html body .article-intro__bottom .social-share-icon:hover,
html body .article-intro__bottom .social-share-icon:focus-visible {
    color: var(--commonButtonText);
    background-color: var(--commonHover);
    border-color: var(--commonHover);
}

html body .blogDetail-share {
    color: var(--commonContent) !important;
}

html body .blogDetail-share label {
    color: var(--commonContent) !important;
}

html body .blogDetail-share .social-share-icon {
    color: var(--commonIcon) !important;
    border-color: var(--commonLine) !important;
}

html body .blogDetailButton > a > div,
html body .blogDetailButton > .cantClick {
    color: var(--commonWord) !important;
}

html body .blogDetailButton > a > div:hover,
html body .blogDetailButton > a > div:focus-visible {
    color: var(--commonHover) !important;
}

html body .article-full__info > * {
    border-color: var(--commonLine);
}

html body .aboutDownload .aboutDownloadList .aboutDownloadItem .aboutDownloadFile {
    background-color: var(--commonBackground2);
}

html body .fourZeroFourBtn a,
html body .fourZeroFourBtn:hover a,
html body .fourZeroFourBtn:focus-visible a {
    color: var(--commonButtonText) !important;
}

html body .tooltip > .tooltip-inner {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
}

html body .tooltip-arrow,
html body .tooltip.top .tooltip-arrow {
    border-top-color: var(--commonButton);
}

/* Common Section buttons may be declared with !important. */
html body .sys_btn,
html body .sys_btn:visited {
    color: var(--commonButtonText) !important;
    background: var(--commonButton) !important;
    background-color: var(--commonButton) !important;
    border-color: var(--commonButton) !important;
}

html body .sys_btn:hover,
html body .sys_btn:focus,
html body .sys_btn:focus-visible,
html body .sys_btn:active {
    color: var(--commonButtonText) !important;
    background-color: var(--commonHover) !important;
    border-color: var(--commonHover) !important;
}

html body .sys_btn_white,
html body .sys_btn_white:visited,
html body .sys_btn.sys_btn_white,
html body .sys_btn.sys_btn_white:visited {
    color: var(--commonWord) !important;
    background: var(--commonBackground) !important;
    background-color: var(--commonBackground) !important;
    border-color: var(--commonLine) !important;
}

html body button:disabled,
html body input:disabled,
html body select:disabled,
html body textarea:disabled,
html body .sys_btn:disabled,
html body .sys_btn_white:disabled {
    color: var(--commonContent) !important;
    background-color: var(--commonBackground2) !important;
    border-color: var(--commonLine) !important;
    cursor: not-allowed;
    opacity: 0.65;
}

@media only screen and (max-width: 950px) {
    html body {
        min-width: inherit;
    }

    html body .mobile-head-item .iconfont,
    html body .mobile-head-item .iconfont.title,
    html body .mobile-head-items .iconfont {
        color: var(--headIcon) !important;
    }

    html body .mobile-head-item .main-content-wrap,
    html body .mobile-head-item .main-content-wrap .content-wrap {
        color: var(--commonWord);
        background-color: var(--commonBackground);
    }

    html body .mobile-head-item .main-content-wrap .head_nav > li {
        border-color: var(--commonLine);
    }

    html body .mobile-head-item .main-content-wrap .head-search .search-ipt {
        color: var(--commonWord);
        background-color: var(--commonBackground);
        border-color: var(--commonLine);
    }

    html body .mobile-head-item .main-content-wrap .head-search .search-ipt::placeholder {
        color: var(--commonContent);
    }
}

/*
 * The blog/common page styles are appended after the theme stylesheet on
 * blog routes. Keep these bindings important so their legacy fixed colors
 * cannot win the cascade.
 */
html body .blogTitle,
html body .blogDetailTitle {
    color: var(--commonTitle) !important;
}

html body .blogTime,
html body .blogDetailTime {
    color: var(--commonContent) !important;
    border-color: var(--commonLine) !important;
}

html body .blogDetailContect,
html body .blogDetail-share {
    color: var(--commonContent) !important;
}

html body .blogDetail-share .social-share-icon {
    color: var(--commonIcon) !important;
    border-color: var(--commonLine) !important;
}

html body .blogDetail-share .social-share-icon:hover,
html body .blogDetail-share .social-share-icon:focus-visible {
    color: var(--commonButtonText) !important;
    background-color: var(--commonHover) !important;
    border-color: var(--commonHover) !important;
}

html body .blogTitle a {
    color: var(--commonTitle) !important;
}

html body .blogTime {
    border-bottom-color: var(--commonLine) !important;
}

html body .blogDetailButton a {
    color: var(--commonWord) !important;
}

html body .blogDetailButton a:hover,
html body .blogDetailButton a:focus-visible {
    color: var(--commonHover) !important;
}

html body {
    background-image: none;
}

html body .head_top {
    background-color: var(--topBackground);
    color: var(--topBackgroundText);
}

html body .top_contacts li,
html body .top_contacts li a,
html body .top_contacts .top_label {
    color: var(--topBackgroundText);
}

html body .web_head .btn--search {
    color: var(--headIcon);
}

html body .web_head .btn--search:hover,
html body .web_head .btn--search:focus-visible {
    background-color: var(--commonHover);
    color: var(--commonButtonText);
}

html body .gotop {
    background-color: var(--commonButton);
    color: var(--commonButtonText);
}

html body .gotop:hover,
html body .gotop.active:hover {
    background-color: var(--commonHover);
    color: var(--commonButtonText);
}

html body footer#footer.web_footer {
    background-image: none;
}

html body footer#footer.web_footer .foot_item .title:before {
    background-color: var(--footLine);
}

html body footer#footer.web_footer .foot_item_follow .sys_btn {
    color: var(--commonButtonText) !important;
}

html body .nav_wrap .head_nav > li > a,
html body .nav_wrap .head_nav > li > a em {
    color: var(--headBackgroundText);
}

html body .product_item .item_des .item_tit,
html body .product_item .item_des .item_tit a,
html body .product-item .item-info .item-name,
html body .product-item .item-info .item-name a {
    color: var(--commonTitle);
}

html body .product_item .item_des .item_tit a:hover,
html body .product-item .item-info .item-name a:hover {
    color: var(--commonHover);
}

html body .product_item .item_des .item_txt,
html body .product-item .item-info .item-des {
    color: var(--commonContent);
}

html body .product_item .price,
html body .product-item .price,
html body .product_item .item_price {
    color: var(--commonPrice);
}

html body #banner_featured .swiper-button-prev::before,
html body #banner_featured .swiper-button-next::before,
html body #banner_featured .swiper-button-prev::after,
html body #banner_featured .swiper-button-next::after {
    content: none !important;
    display: none !important;
}

html body .web_footer {
    background-color: var(--footBackground);
}

html body .foot_items,
html body .foot_items a {
    color: var(--footBackgroundText);
}

html body .foot_item .title,
html body .foot_item .title a {
    color: var(--footBackgroundTitle);
}

html body .foot_bar,
html body .foot_bar a {
    color: var(--footBackgroundText);
    background-color: var(--footBackground);
}

html body .contactFormTop {
    color: var(--commonButtonText);
    background-color: var(--commonButton);
}

html body *:has(> .longxi-background-image) {
    position: relative;
    z-index: 0;
    isolation: isolate;
}

html body .index_main,
html body main.web_main {
    position: relative;
    z-index: 0;
    isolation: isolate;
}