@supports (bottom: env(safe-area-inset-bottom)) { body { padding-bottom: env(safe-area-inset-bottom); } } /* 布局 */ .c-f-d{ display: flex; display: -webkit-flex; } .c-f-dc{ display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; } .c-header{ position: flex; top: 0; left: 0; z-index: 9; display: flex; font-size: 0.25rem; color: #fff; align-items: center; justify-content: flex-start; box-sizing: border-box; padding: 0.25rem; width: 100%; background-color: #000; } .c-input-box{ position: relative; border-radius: 1.2rem; /* border-color: #a0a0a0; */ background-color: #fff; /* border-width: 0.05rem; */ border-style: solid; padding: 0.04rem 0.2rem; } .c-header-search{ position: flex; top: 0; left: 0; z-index: 9; display: flex; font-size: 0.25rem; color: #fff; align-items: center; justify-content: flex-start; box-sizing: border-box; padding: 0.2rem 0.25rem; width: 100%; background-color: #000; } .c-header-title{ margin-left: 0.2rem; color: #FFF; } .c-header-search{ } .c-f-cc { display: flex; align-items: center; justify-content: space-between; } .c-f-cb { display: flex; /* align-items: center; */ justify-content: space-between; } .c-f-ca { display: flex; align-items: center; justify-content: space-around; } .c-f-eb { display: flex; align-items: flex-end; justify-content: space-between; } .c-fColumn-cc { display: flex; flex-direction: column; align-items: center; justify-content: center; } .c-fColumn { display: flex; flex-direction: column; } .c-fColumn-cd { display: flex; flex-direction: column; align-items: center; } .c-fColumn-dc { display: flex; flex-direction: column; justify-content: center; } .c-fColumn-ce { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; } .c-fColumn-e { display: flex; flex-direction: column; justify-content: flex-end; } .c-text-over_clamp{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .c-text-over_clamp2{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .c-text-over_clamp3{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } .c-text-over_clamp4{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; } .c-text-over_clamp5{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; } .c-text-over_clamp6 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; overflow: hidden; } .c-clearfix { zoom: 1; } .c-clearfix::after { content: ''; display: block; clear: both; height: 0; visibility: hidden; } /* button */ .c-btn_90, .c-btn_90_radius { width: 100%; height: 0.9rem; background-color: #053566; font-size: 0.32rem; font-family: Source Han Sans CN; font-weight: 400; line-height: 0.9rem; color: #fff; } .c-btn_90_radius { border-radius: 0.15rem; } .c-btn_75 { width: 100%; height: 0.75rem; background-color: #053566; font-size: 0.28rem; font-family: Source Han Sans CN; font-weight: 400; color: #fff; } .c-module { padding: 0.7rem 0.25rem; } .c-module-title, .c-module-title2 { position: relative; font-size: 0.44rem; font-family: Source Han Sans CN; font-weight: bold; line-height: 1; text-align: center; } .c-module-title { color: #262626; } .c-module-title2 { color: #fff; } .c-module-title2::after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); width: 1rem; height: 0.02rem; } .c-module-title::after { background-color: #262626; } .c-module-title2::after { background-color: #fff; } .c-module-english, .c-module-english2, .c-module-text, .c-module-text2 { margin: auto; margin-top: 0.25rem; max-width: 6rem; font-size: 0.24rem; font-family: Source Han Sans CN; font-weight: 400; text-align: center; text-transform: uppercase; line-height: 1; } .c-module-english, .c-module-text { color: #666; } .c-module-english2, .c-module-text2 { color: #fff; } .c-module-title3, .c-module-title4 { position: relative; z-index: 2; padding-bottom: 0.1rem; font-size: 0.36rem; font-family: Source Han Sans CN; font-weight: bold; text-align: center; } .c-module-title3 { color: #262626; } .c-module-title4 { color: #fff; } .c-module-title3::after, .c-module-title4::after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); width: 0.5rem; height: 0.04rem; } .c-module-title3::after { background-color: #262626; } .c-module-title4::after { background-color: #fff; } .c-module-title3_english, .c-module-title4_english { position: absolute; bottom: -0.1rem; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); z-index: -1; font-size: 0.8rem; font-family: Source Han Sans CN; font-weight: bold; text-transform: uppercase; white-space: nowrap; } .c-module-title3_english { color: #E6E8EB; } .c-module-title4_english { color: #282828; } .c-paging { display: flex; align-items: center; justify-content: center; margin-top: 0.7rem; margin-bottom: 1.2rem; } .c-paging-next, .c-paging-page, .c-paging-prev { width: 2.2rem; height: 0.8rem; font-size: 0.28rem; font-family: Source Han Sans SC; font-weight: 400; text-align: center; line-height: 0.8rem; } .c-paging-page { border: 1px solid #F2F4F7; color: #262626; } .c-case-input{ display: flex; /* margin-top: 0.2rem; */ padding: 0.05rem 0.15rem; box-sizing: border-box; width: 85%; /* height: 0.75rem; */ border-style:none; background-color: #ffffff; font-size: 0.24rem; font-family: Source Han Sans CN; font-weight: 400; color: #999; } .c-input-icon{ position: absolute; width: 0.25rem; top: 50%; transform: translateY(-50%); right: 0.2rem; } .c-case-icon{ right: 1.1rem; width: 0.5rem; position: absolute } .c-case-icon img{ width: 0.5rem; } .c-case-icon1{ right: 0.3rem; width: 0.5rem; position: absolute } .c-case-icon1 img{ width: 0.5rem; } .select-option { padding: 0.29rem; font-size: 0.32rem; font-family: Source Han Sans CN-Regular, Source Han Sans CN; font-weight: 400; color: #262626; text-align: center; } .downloadcenter-banner .downloadcenter-banner-pagination { bottom: 0; } .downloadcenter-banner .downloadcenter-banner-pagination .swiper-pagination-bullet { width: 0.3rem; height: 0.06rem; background-color: rgba(0,0,0,0.2); border-radius: 0; } .downloadcenter-banner .downloadcenter-banner-pagination .swiper-pagination-bullet-active { background-color: #6AA84F; } .product-pagination .swiper-pagination-bullet { opacity: 1; margin-right: 0.25rem; width: 0.24rem; height: 0.24rem; background-color: #ccc; } .product-pagination .swiper-pagination-bullet:last-child { margin-right: 0; } .product-pagination .swiper-pagination-bullet-active { background-color: #6AA84F; } .select-item { padding: 0.1rem 0.2rem; height: 0.5rem; font-size: 0.25rem; font-family: Source Han Sans CN-Regular, Source Han Sans CN; font-weight: 400; color: #262626; } .select-item_active { font-weight: 700; color: #053566; } .select-popup { position: absolute; /* top: 100%; */ left: 0; z-index: 66; width: 100%; background-color: #fff; } .select-popup-mask { position: absolute; /* top: 100%; */ left: 0; z-index: 6; width: 100%; height: 100vh; background-color: rgba(0,0,0,0.5); } .select-item_active .select-item-arrow { transform: rotate(180deg); } .select-item-arrow { transition: all 200ms; margin-left: 0.2rem; width: 0.44rem; height: 0.44rem; } .c-paging-prev { border: 1px solid #F2F4F7; background-color: #F2F4F7; color: #262626; } .c-paging-next { border: 1px solid #6AA84F; background-color: #6AA84F; color: #fff; } .c-formBox { padding: 0.9rem 0.45rem 1.2rem; background-repeat: no-repeat; background-position: center; background-size: cover; } .c-form { padding: 0.85rem 0.5rem 0.5rem; background-color: #fff; border-top: 0.2rem solid #262626; } .c-form-select, .c-form-select2 { display: flex; align-items: center; position: relative; margin-top: 0.2rem; padding: 0 0.2rem; height: 0.75rem; border: 1px solid #E6E6E6; } .c-form-select:first-of-type { margin-top: 0.5rem; } .c-form-selectInput { flex: 1; padding-right: 0.2rem; height: 100%; font-size: 0.24rem; font-family: Source Han Sans CN; font-weight: 400; color: #262626; } .c-banner-icon{ width: 1rem; } .c-banner{ display: flex; justify-content: space-between; margin: 0.5rem 0.7rem; } .c-icon_bottom-arrows { transition: all 200ms linear; -webkit-transition: all 200ms linear; -moz-transition: all 200ms linear; -ms-transition: all 200ms linear; -o-transition: all 200ms linear; margin-left: 0.2rem; width: 0.28rem; height: 0.2rem; } .c-form-select:hover .c-icon_bottom-arrows, .c-form-select2:hover .c-icon_bottom-arrows { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); } .c-form-select_drop-downList { display: none; overflow-y: scroll; -webkit-overflow-scrolling: touch; position: absolute; top: 0.92rem; left: 0; z-index: 9; width: 100%; max-height: 3rem; background-color: #fff; } .c-form-select_drop-downListItem { padding: 0 0.2rem; height: 0.75rem; font-size: 0.24rem; font-family: Source Han Sans CN; font-weight: 400; line-height: 0.9rem; color: rgba(38,38,38, 0.6); } .c-form-select:hover .c-form-select_drop-downList{ display: block; } .c-form-select2:hover .c-form-select_drop-downList{ display: block; } .c-form-cell { margin-top: 0.1rem; } .c-form-select2{ box-sizing: border-box; width: 2.7rem; } .c-form-select2 .c-form-selectInput{ width: 1.06rem; } .c-form-input { margin-top: 0.2rem; padding: 0 0.2rem; box-sizing: border-box; width: 100%; height: 0.75rem; border: 1px solid #E6E6E6; background-color: #fff; font-size: 0.24rem; font-family: Source Han Sans CN; font-weight: 400; color: #262626; } .c-form-input::placeholder, .c-form-textarea::placeholder, .c-form-selectInput::placeholder { color: #999; } .c-form-textareaBox { margin-top: 0.2rem; padding: 0.28rem 0.2rem; background-color: #fff; border: 1px solid #E6E6E6; } .c-form-textarea { width: 100%; height: 1.44rem; font-size: 0.24rem; font-family: Source Han Sans CN; font-weight: 400; color: #262626; } .c-form-submit { margin-top: 0.3rem; } .c-search, .c-search_radius { display: flex; align-items: center; padding: 0 0.3rem; height: 0.8rem; background-color: #F7F7F7; } .c-search_radius { border-radius: 0.4rem; -webkit-border-radius: 0.4rem; -moz-border-radius: 0.4rem; -ms-border-radius: 0.4rem; -o-border-radius: 0.4rem; } .c-search-icon { margin-right: 0.1rem; height: 0.4rem; } .c-search-input { flex: 1; height: 100%; background-color: transparent; font-size: 0.26rem; font-family: Source Han Sans CN; font-weight: 400; color: #262626; } .c-search-input::placeholder { color: #999999; } .c-nav { position: flex; top: 0; left: 0; z-index: 9; display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; padding: 0 0.25rem; width: 100%; background-color: #fff; border-bottom: 1px solid #E6E6E6; } .c-nav, .c-nav-blank { height: 1.1rem; } .c-nav-logo { height: 0.7rem; } .c-nav-logo2 { height: 0.5rem; } .c-nav-menu, .c-nav-close, .c-nav-telephone { width: 0.5rem; } .c-nav-telephone { margin-right: 0.3rem; } .c-nav-slogan { font-size: 0.3rem; font-family: XingShiXin-yinbixingshu; font-weight: 400; color: #666; } .c-nav-close { display: none; } .c-nav-popupBg { display: none; position: fixed; left: 0; top:0; z-index: 30; width: 100%; background-color: rgba(0,0,0,0.5); } .c-nav-popup { transition: all 200ms; position: fixed; top:0; right: -60%; z-index: 31; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 60%; background-color: rgba(255,255,255,0.97); } .c-nav-popupBg, .c-nav-popup { height:100%; } .c-nav-popupList { box-sizing: border-box; overflow-y: scroll; -webkit-overflow-scrolling: touch; padding: 0 0.55rem; width: 100%; height: 100%; } .c-nav-popupListItem { display: block; padding: 0.4rem 0; border-bottom: 1px solid #E6E6E6; font-size: 0.38rem; font-family: Source Han Sans CN; font-weight: 400; line-height: 1; color: #404040; } .c-nav-popupListItem:first-of-type { margin-top: 0.71rem; } .c-nav-popupListItem_active { border-bottom: 0.05rem solid #053566; font-weight: bold; color: #053566; } .c-nav-splitline { margin: 0 0.2rem; width: 1px; height: 0.54rem; background-color: #fff; } .c-footer { background-color: #404040; } .c-footer-header { padding: 0.5rem 0.5rem 0.4rem; font-size: 0; text-align: left; display: flex; } .c-contact-logo{ height: 0.5rem; margin-right: 0.2rem; } .c-footer-header-contact{ background-color: #6AA84F; font-size: 0.3rem; color: #fff; border-radius: 0.1rem; padding: 0.13rem 0; width: 80%; margin-top: 0.6rem; display: flex; align-items: center; justify-content: center; } .c-footer-header-left{ width: 40%; } .c-footer-header-right{ width: 60%; } /* .c-footer-link { position: relative; padding: 0 0.34rem; font-size: 0.26rem; font-family: Source Han Sans CN-Regular, Source Han Sans CN; font-weight: 400; color: #fff; line-height: 1; } */ .c-footer-link { position: relative; /* padding: 0 0.34rem; */ font-size: 0.3rem; font-family: Source Han Sans CN-Regular, Source Han Sans CN; font-weight: 400; color: #fff; line-height: 1; } /* .c-footer-link::after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 0.26rem; background-color: #fff; } */ /* .c-footer-link:last-child::after { background-color: transparent; } */ .c-footer-logo { margin-top: 0.3rem; width: 2.3rem; } .c-footer-headerTitle { margin-top: 0.4rem; font-size: 0.3rem; font-family: Source Han Sans CN; /* font-weight: bold; */ line-height: 1; color: #fff; display: flex; justify-content: space-between; align-content: center; align-items: center; width: 90%; white-space: nowrap; } .c-footer-headerEnglish, .c-footer-companyName { font-family: Source Han Sans CN; font-weight: 300; color: #999; } .c-footer-headerEnglish { margin-top: 0.15rem; font-size: 0.24rem; line-height: 0.31rem; } .c-footer-companyInfo { padding: 0.4rem 0.2rem 1.5rem 0.2rem; border-top: 1px solid #999; text-align: center; background-color: #fff; } .c-footer-companyText { font-size: 0.24rem; font-family: Source Han Sans CN; font-weight: 300; line-height: 0.4rem; color: #999; } .c-footer-nav { position: fixed; bottom: 0; left: 0; z-index: 9; display: flex; align-items: center; justify-content: space-between; width: 100%; background-color: #fff; } .c-footer-nav, .c-footer-navBlank { height: 1.2rem; } .c-footer-navItem { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 25%; } .c-footer-nav a { text-align: center; } .c-footer-navItemIcon { height: 0.4rem; } .c-footer-navItemText { margin-top: 0.14rem; font-size: 0.2rem; font-family: Source Han Sans CN; font-weight: 400; line-height: 1; color: #404040; } .c-footer-navItem_active .c-footer-navItemText { font-weight: 700; color: #053566; } .c-ad { font-size: 0; } .c-ad-img { width: 100%; height: 3rem; object-fit: cover; } .bottomBox { z-index: 3; position: fixed; bottom: 0; left: 0; width: 100%; height: 1.2rem; background-color: rgba(24, 11, 10, 0.2); display: flex; justify-content: space-evenly; align-items: center; } .bottomBox .consultBox { width: 3rem; height: 0.8rem; background-color: #ffffff; text-align: center; line-height: 0.8rem; font-size: 0.32rem; } .bottomBox .callBox { width: 3rem; height: 0.8rem; background-color: #e1eefa; text-align: center; line-height: 0.8rem; font-size: 0.32rem; } .layui-layer-btn0{ font-size: .2rem !important; } .shopRecom-btn { width: 80%; margin: .8rem auto; height: 0.8rem; position: relative; } .shopRecom-btn .shopRecom-back { position: absolute; left: 0; top: 0; height: 0.8rem; width: 2rem; background-color: #eeeeee; color: #666; text-align: center; line-height: 0.7rem; font-size: 0.35rem; } .shopRecom-btn .shopRecom-pages { position: absolute; left: 45%; width: 10%; height: 0.7rem; line-height: 0.7rem; font-size: 0.35rem; } .shopRecom-btn .shopRecom-next { position: absolute; right: 0; top: 0; height: 0.8rem; width: 2rem; background-color: #eeeeee; color: #666; text-align: center; line-height: 0.7rem; font-size: 0.35rem; } .address{ width: 5.4rem; display: flex; justify-content: space-between; } .address select{ display: block !important; width: 1.7rem; height: .8rem; border: 1px solid #E6E6E6; font-size: .26rem; outline: none; padding-left: .25rem; } .input-image-list{ width: 5.4rem; } .input-image-info{ font-size: .2rem !important; line-height: .38rem; } #dl_upload_img{ display: flex; flex-wrap: wrap; justify-content: flex-start; } #c-home-tips { display: none; position: fixed; z-index: 890; bottom: 0; left: 0; width: 100%; background: rgb(245, 245, 245); box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2); } #c-home-tips .c-wrap { display: flex; align-items: center; justify-content: space-between; position: relative; padding: .4rem 0; line-height: 24px; text-align: center; flex-wrap: wrap; width: 90%; margin: 0 auto; } #c-home-tips .c-wrap p { text-align: left; font-size: .24rem; } #c-home-tips .c-wrap .c-common-btn1 { flex-shrink: 0; cursor: pointer; width: 100px; height: 40px; line-height: 40px; border: 1px solid #6aa84f; font-size: 0.3rem; margin-top: .4rem; } #c-home-tips .c-wrap .c-common-btn1:nth-of-type(1){ background: #6aa84f; line-height: 40px; color: #FFF; } #c-home-tips .c-wrap a { color: #6aa84f; } #c-home-tips .c-wrap a:hover { text-decoration: underline; } .online-shop{ padding: 1rem 0; display: flex; justify-items: center; justify-content: center; } .online-shop .item{ width: 6.6rem; height: 4.76rem; padding: .64rem .48rem; border: 1px solid #252626; border-radius: .36rem; display: block; box-sizing: border-box; } .online-shop .item .box{ display: flex; height: 100%; justify-content: space-between; flex-direction: column; align-items: center; } .online-shop .item .box img{ height: auto; width: 3.8rem; } .online-shop .item .box p{ font-size: .44rem; font-weight: bold; align-items: center; color: #252626; line-height: 1; } .online-shop .item .box button{ width: 3.5rem; height: 1rem; background: #6AA84F; color: #fff; font-size: .32rem; text-align: center; line-height: 1rem; border: none; outline: none; }