/* ==================== 重置默认样式 start ==================== */ * { padding: 0; margin: 0; box-sizing: border-box; font-family: "Microsoft YaHei", "微软雅黑", "Microsoft JhengHei", "华文细黑", "STHeiti", "MingLiu"; } *:before, *:after { vertical-align: middle; box-sizing: border-box; } html { max-width: 1920px; margin: 0 auto; } ul, li, ol { list-style: none; } em { font-style: normal; } img { vertical-align: middle; max-width: 100%; } a { color: inherit; text-decoration: none; outline: none; -webkit-backface-visibility: hidden; } a:hover { text-decoration: none; } a:focus { outline: none; } input:focus, select:focus, textarea:focus { outline: -webkit-focus-ring-color auto 0; } table { border-collapse: collapse; border-spacing: 0; } th, td { vertical-align: middle; } #map label { max-width: initial; } #map img { max-width: initial; } /* ==================== 重置默认样式 end ==================== */ /* ==================== 常用样式 start ==================== */ /* 清除浮动 */ .clearfix { display: block; zoom: 1; } .clearfix:after { content: " "; display: block; font-size: 0; height: 0; clear: both; visibility: hidden; } /* 文本溢出省略号 */ /* 1行 */ .ellipsis-text1 { display: inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 100%; } /* 2行 */ .ellipsis-text2, .ellipsis-text3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } /* 3行 */ .ellipsis-text3 { -webkit-line-clamp: 3; } /* 4行 */ .ellipsis-text4 { -webkit-line-clamp: 4; } /* bootstart ul */ ul { margin-bottom: 0; } /* 容器大小 */ .xz-box { max-width: 1440px; margin: 0 auto; overflow: hidden; font-size: 0; } /* 图片统一动画 */ .xz-image-an { overflow: hidden; border-radius: 15px; } .xz-image-an:hover img { transform: scale(1.1); } .xz-image-an img { transition: all 0.4s; width: 100%; } @media screen and (max-width: 751px) { body { margin-top: 1.2rem; } } /* ==================== 常用样式 end ==================== */ body { padding: 0; } /* ==================== 头部 start ==================== */ header { width: 100%; position: relative; z-index: 10000; background: #fff; } header .xz-box { display: flex; align-items: center; justify-content: space-between; overflow: visible; } header .brand { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; margin-right: 80px; width: 360px; } header .brand img { margin-right: 19.998px; } header .xz-menu { flex-grow: 1; display: flex; align-items: center; justify-content: space-between; margin-right: 20px; } header .xz-menu>li { flex-grow: 1; transition: all 0.4s; position: relative; flex-shrink: 0; } header .xz-menu>li:hover .xz-sub-menu { opacity: 1; top: 110%; visibility: visible; } header .xz-menu>li>a { display: block; color: #505050; font-size: 18px; padding-top: 44px; padding-bottom: 44px; padding-left: 12px; padding-right: 12px; text-align: center; line-height: 1; } header .xz-menu>li .xz-sub-menu { position: absolute; top: 120%; left: 0; background: #fff; display: flex; flex-flow: column; z-index: 9; width: 100%; border-radius: 4.998px; opacity: 0; transition: all 0.2s; visibility: hidden; padding: 10.002px 0; } header .xz-menu>li .xz-sub-menu:after { content: ""; display: block; width: 0; height: 0; font-size: 0; border-left: 10.002px solid transparent; border-right: 10.002px solid transparent; border-bottom: 10.002px solid #fff; position: absolute; top: -10.002px; left: 50%; margin-left: -4.998px; } header .xz-menu>li .xz-sub-menu>li { position: relative; text-align: center; } header .xz-menu>li .xz-sub-menu>li>a { width: 100%; display: block; padding: 12px 0; font-size: 16.002px; } header .xz-menu>li .xz-sub-menu>li>a:hover { background: rgba(0, 0, 0, 0.04); } header .tel { display: flex; align-items: center; } header .tel::before { content: ""; display: block; flex-shrink: 0; width: 40.002px; height: 40.002px; background: url(../images/img01.jpg) no-repeat center; background-size: 100%; } header .tel .server-number { margin-left: 12px; } header .tel .server-number h2 { font-size: 13.998px; color: #666; line-height: 1; margin: 0; margin-bottom: 10.002px; font-weight: 400; } header .tel .server-number h1 { font-size: 18px; color: #333; line-height: 1; margin: 0; font-weight: bold; } header .language { font-size: 16px; flex-shrink: 0; margin-left: 20px; font-weight: bold; text-transform: uppercase; cursor: pointer; } /* ==================== 头部 end ==================== */ /* ==================== 移动端头部 start ==================== */ .mob-nav { position: fixed; left: 0; top: 0; width: 100%; z-index: 99999; display: flex; flex-flow: column; align-items: center; height: 1.2rem; transition: all 0.4s; } .mob-nav.active { height: 100%; } .mob-nav.active .nav-btn { width: 26px; height: 26px; margin-top: -16px !important; } .mob-nav.active .nav-btn i { position: absolute; top: 10px; left: 0; } .mob-nav.active .nav-btn i:first-child~i { margin: 0; } .mob-nav.active .nav-btn i:nth-child(1) { display: none; } .mob-nav.active .nav-btn i:nth-child(2) { transform: rotate(45deg); } .mob-nav.active .nav-btn i:nth-child(3) { transform: rotate(-45deg); } .mob-nav.active .mob-nav-menu { opacity: 1; visibility: visible; } .mob-nav .mob-nav-head { width: 100%; height: 60px; background: #fff; flex-shrink: 0; display: flex; justify-content: space-between; align-items: center; position: relative; } .mob-nav .mob-nav-head .nav-btn { position: absolute; right: 20px; top: 50%; margin-top: -10px; } .mob-nav .mob-nav-head .nav-btn i { display: block; background: #000; width: 26px; height: 3px; transition: all 0.4s; } .mob-nav .mob-nav-head .nav-btn i:first-child~i { margin-top: 5px; } .mob-nav .mob-nav-head .nav-logo { height: 45px; margin-left: 10px; font-size: 0; } .mob-nav .mob-nav-head .nav-logo img { height: 100%; } .mob-nav .mob-nav-head .nav-logo a { display: block; height: 45px; } .mob-nav .mob-nav-menu { width: 100%; background: #151515; flex-grow: 1; padding: 10px 20px; overflow: auto; transition: all 0.4s; opacity: 0; visibility: hidden; } .mob-nav .mob-nav-menu a { color: inherit; text-decoration: none; } .mob-nav .mob-nav-menu>li { position: relative; color: #fff; border-bottom: 1px solid rgba(255, 255, 255, 0.1); font-size: 16px; } .mob-nav .mob-nav-menu>li:last-child { border-bottom: 0; } .mob-nav .mob-nav-menu>li>a { display: block; padding: 14px 5px; } .mob-nav .mob-nav-menu>li.active>.mob-sub-menu>li { display: block; background: rgba(255, 255, 255, 0.1); } .mob-nav .mob-nav-menu .mob-sub-menu:after { content: ""; display: block; width: 10px; height: 10px; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; right: 20px; top: 20px; transform: rotate(45deg); } .mob-nav .mob-nav-menu .mob-sub-menu>li { display: none; padding: 0 10px; } .mob-nav .mob-nav-menu .mob-sub-menu>li>a { display: block; padding: 10px 0; } /* ==================== 移动端头部 end ==================== */ /* ==================== 轮播图 start ==================== */ .xz-banner { position: relative; } /* ==================== 轮播图 end ==================== */ /* ==================== swiper上一个下一个按钮 start ==================== */ .swiper-btn { width: 64px; height: 64px; position: absolute; top: 50%; margin-top: -32px; display: flex; align-items: center; justify-content: center; cursor: pointer; background: rgba(237, 137, 22, 0.6); z-index: 9; border-radius: 100%; } .swiper-btn.swiper-button-disabled { opacity: 0.5; } .swiper-btn:after { content: ""; display: block; width: 20px; height: 20px; border-top: 3px solid #0099e0; border-left: 3px solid #0099e0; transform: rotate(-45deg); margin-left: 10px; } .swiper-btn.swiper-btn-prev { left: -0.45rem; } .swiper-btn.swiper-btn-next { right: -0.45rem; transform: rotateY(180deg); } /* ==================== swiper上一个下一个按钮 end ==================== */ /* ==================== 通用标题 start ==================== */ .xz-title { padding: 1.0833rem 0; text-align: center; font-size: 0; line-height: 0; } .xz-title h1 { margin: 0; font-size: 0.6667rem; color: #060606; line-height: 1; margin-bottom: 0.3333rem; display: block; font-weight: 400; } .xz-title h2 { margin: 0; font-size: 0.3333rem; color: #999; text-transform: uppercase; line-height: 1; font-weight: 400; } /* ==================== 通用标题 end ==================== */ /* ==================== 产品 start ==================== */ .xz-product { padding-bottom: 1.5667rem; } .xz-product .swiper-wrapper { padding-top: 0.3833rem; } .xz-product .xz-item { display: block; transition: all 0.4s; } .xz-product .xz-item:hover { transform: translateY(-0.2rem); box-shadow: 0 0 0.2167rem -0.0833rem #9b9b9b; } .xz-product .xz-item:hover .xz-name { background: #0099e0; } .xz-product .xz-item:hover .xz-name .xz-sub-title { color: #fff; } .xz-product .xz-item .xz-image { border: 0.0167rem solid #dbdbdb; background: #fff; } .xz-product .xz-item .xz-image img { width: 100%; } .xz-product .xz-item .xz-name { background: #f5f5f5; padding: 0.6667rem 0.1667rem; } .xz-product .xz-item .xz-name .xz-sub-title { font-size: 0.3rem; color: #333; text-align: center; width: 100%; margin-bottom: 0.3333rem; } .xz-product .xz-item .xz-name .xz-more { margin: 0 auto; padding: 0.1667rem 0.1667rem; border-radius: 100%; display: block; width: 100%; max-width: 2.25rem; border-radius: 1.6667rem; font-size: 0.2667rem; color: #0099e0; line-height: 1; background: #fff; text-align: center; border: 0.0167rem solid #d7d7d7; } /* ==================== 产品 end ==================== */ /* ==================== 关于我们 start ==================== */ .xz-about { overflow: hidden; background: #008dce; } .xz-about>.xz-box { width: 100%; max-width: 28.3333rem; margin-left: auto; margin-right: 0; overflow: visible; display: flex; align-items: stretch; } .xz-about .left { padding-top: 1rem; min-width: 0; background: url(../images/img25.jpg) no-repeat bottom center #0099e0; } .xz-about .left .xz-big-en { width: 9.65rem; margin-left: -1.9333rem; margin-bottom: 0.5rem; } .xz-about .left .xz-info { min-width: 0; padding: 0.5833rem; padding-top: 0; padding-bottom: 2.5rem; } .xz-about .left .xz-min-en { width: 5.1833rem; } .xz-about .left .xz-min-en::after { content: ""; display: block; width: 1.0667rem; height: 0.05rem; background: #fff; margin: 0.5333rem 0 0.6667rem; } .xz-about .left .xz-sub-title { font-size: 0.4rem; font-weight: bold; line-height: 1; margin-bottom: 0.6667rem; color: #fff; } .xz-about .left .xz-desc { font-size: 0.3rem; line-height: 1.8em; color: #fff; margin-bottom: 1.5rem; } .xz-about .left .xz-more { display: flex; align-items: center; justify-content: flex-start; } .xz-about .left .xz-more:after { content: ""; display: block; width: 0.6667rem; height: 0.6667rem; background: url(../images/img27.png) no-repeat center; background-size: 100%; } .xz-about .left .xz-more a,.xz-m { display: inline-block; flex-shrink: 0; border: 0.0167rem solid #fff; padding: 0.2rem 0.25rem; line-height: 1; font-size: 0.2667rem; border-radius: 0.25rem; margin-right: 0.1333rem; color: #fff; display: flex; align-items: center; } .xz-about .left .xz-more a:before { content: ""; display: inline-block; vertical-align: middle; width: 0.2333rem; height: 0.2333rem; margin-right: 0.1667rem; background: #fff; border-radius: 100%; } .xz-about .right { display: flex; flex-wrap: wrap; flex-shrink: 0; max-width: 15.8333rem; } .xz-about .right .xz-item { width: 50%; flex-shrink: 0; position: relative; } .xz-about .right .xz-item:hover .xz-mask { background: rgba(255, 255, 255, 0.4); } .xz-about .right .xz-item:hover .xz-mask .xz-icon { background: #0099e0; } .xz-about .right .xz-item:hover .xz-mask .xz-name { font-weight: bold; color: #0099e0; font-size: 0.4667rem; } .xz-about .right .xz-item .xz-image { height: 100%; } .xz-about .right .xz-item .xz-image img { height: 100%; } .xz-about .right .xz-item .xz-mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*background: rgba(0, 0, 0, 0.45);*/ display: flex; flex-flow: column; align-items: center; justify-content: center; transition: all 0.4s; } .xz-about .right .xz-item .xz-mask .xz-icon { width: 2rem; height: 2rem; border-radius: 100%; background: none; margin-bottom: 0.45rem; display: flex; justify-content: center; align-items: center; } .xz-about .right .xz-item .xz-mask .xz-icon img { display: block; width: 1.1667rem; } .xz-about .right .xz-item .xz-mask .xz-name { color: #fff; font-size: 0.4667rem; line-height: 1; width: 100%; text-align: center; } /* ==================== 关于我们 end ==================== */ /* ==================== 案例中心 start ==================== */ .xz-cases { padding-bottom: 1.6667rem; } .xz-cases .itembox { display: flex; justify-content: flex-start; flex-wrap: wrap; align-items: stretch; } .xz-cases .itembox .item { position: relative; width: 31%; } .xz-cases .itembox .item:nth-child(3n-1) { margin-left: 3.5%; margin-right: 3.5%; } .xz-cases .itembox .item:nth-child(3)~.item { margin-top: 3.5%; } .xz-cases .itembox .item .xz-title { position: absolute; bottom: 0; left: 0; width: 100%; background: rgba(0, 0, 0, 0.5); color: #fff; padding: 0.3667rem; text-align: center; font-size: 0.3167rem; line-height: 1; } /* ==================== 案例中心 end ==================== */ /* ==================== 新闻中心 start ==================== */ .xz-news { background: url(../images/c_bg.png) no-repeat center bottom; background-size: cover; padding-bottom: 1.1667rem; } .xz-news .xz-title { padding-bottom: 0.8333rem; } .xz-news>.xz-box { padding-bottom: 0.1667rem; padding-top: 0.1667rem; } .xz-news .itembox { display: flex; justify-content: flex-start; align-items: stretch; } .xz-news .itembox .item { width: 31%; display: flex; flex-flow: column; box-shadow: 0rem 0.05rem 0.1667rem 0rem rgba(0, 0, 0, 0.17); background: #fff; border-radius: 15px; overflow: hidden; } .xz-news .itembox .item:nth-child(3n-1) { margin-left: 3.5%; margin-right: 3.5%; } .xz-news .itembox .item .xz-info { padding: 0.6667rem 0.5rem; background: #fff; flex-grow: 1; } .xz-news .itembox .item .xz-info .xz-sub-title { font-size: 0.3667rem; color: #333; line-height: 1; margin-bottom: 0.5rem; } .xz-news .itembox .item .xz-info .xz-time { font-size: 0.3rem; color: #0099e0; line-height: 1; margin-bottom: 0.3333rem; } .xz-news .itembox .item .xz-info .xz-desc { font-size: 0.3rem; color: #999; line-height: 1.8; height: 5.4em; } /* ==================== 新闻中心 end ==================== */ /* ==================== 底部 start ==================== */ footer { background: #000; padding: 73.998px 0; } footer>.xz-box { padding: 0.5rem 0.3333rem; display: flex; align-items: stretch; } footer .xz-card { border-right: 1.002px solid #444444; } footer .xz-card01 .en { font-size: 24px; color: #fff; line-height: 1; margin-bottom: 19.998px; } footer .xz-card01 .qr-group { padding-right: 64.998px; flex-shrink: 0; display: flex; align-items: flex-start; justify-content: center; } footer .xz-card01 .qr-group .qr:first-child { margin-right: 40px; } footer .xz-card01 .qr-group .qr .qr-image { width: 150px; background: url(../images/img26.png) no-repeat center; background-size: contain; padding: 15px; } footer .xz-card01 .qr-group .qr .qr-name { margin-top: 10.002px; text-align: center; color: #999; font-size: 16.998px; } footer .xz-card02 { padding: 0 49.998px; width: 100%; max-width: 270px; } footer .xz-card02 ul { display: flex; flex-wrap: wrap; width: 100%; justify-content: space-between; } footer .xz-card02 ul li { width: 50%; font-size: 13.998px; color: #999; } footer .xz-card02 ul li:nth-child(2n) { text-align: right; } footer .xz-card02 ul li:nth-child(2)~li { margin-top: 49.998px; } footer .xz-card03 { padding-left: 49.998px; border-right: 0; flex-grow: 1; } footer .xz-card03 .xz-number { display: flex; align-items: center; padding-bottom: 25.002px; width: 100%; border-bottom: 1.002px solid #444444; margin-bottom: 25.002px; } footer .xz-card03 .xz-number::before { content: ""; display: block; background: url(../images/img21.png) no-repeat center; width: 49.998px; height: 49.998px; margin-right: 7.002px; flex-shrink: 0; background-size: 100%; } footer .xz-card03 .xz-number .name { color: #999; font-size: 16.998px; line-height: 1; margin-right: 15px; } footer .xz-card03 .xz-number .tel { font-size: 28.998px; line-height: 1; color: #fff; font-weight: 400; flex-grow: 1; } footer .xz-card03 .xz-number .xz-goto { display: inline-block; padding: 15px 49.998px; border: 1.002px solid #0099e0; color: #fff; line-height: 1; font-size: 16.998px; text-align: center; } footer .xz-card03 .copyright { font-size: 13.998px; color: #999; line-height: 3em; } footer .xz-card03 .copyright a { color: inherit; font-size: inherit; } /* ==================== 底部 end ==================== */ @media screen and (min-width: 1600px) { /* pc端固定html标签文字大小(rem适配) */ html { font-size: 60px !important; } } @media screen and (max-width: 1600px) { .xz-box { padding: 0 0.8333rem; } .xz-about>.xz-box { padding-left: 2.1667rem; padding-right: 0; } } @media screen and (max-width: 1460px) { header{padding:0 50px;} header .xz-box{padding:0;} header .brand{margin-right:20px;width:300px;} footer>.xz-box{padding:0 30px;} footer .xz-card01 .qr-group .qr:first-child{margin-right:20px;} } @media screen and (max-width: 1360px) { header .xz-menu>li>a{font-size:14px;} footer .xz-card02{max-width:220px;} footer .xz-card02{padding:0 30px;} footer .xz-card03 .xz-number::before{width:40px;height:40px;} footer .xz-card03 .xz-number .xz-goto{padding:15px 30px;} header .xz-menu>li>a{ padding-left: 8px; padding-right: 8px;} } @media screen and (max-width: 1280px) { header{padding:0 30px;} header .xz-menu>li>a{font-size:14px;} header .brand{width:270px;} header .tel .server-number h1{font-size:16px;} header .language{font-size:14px;} header .brand img{margin-right:10px;} footer .xz-card03 .xz-number .tel{font-size:24px;} } @media screen and (max-width: 751px) { .m-none, .pc-nav { display: none !important; } .xz-box { padding: 0.6rem 0.4rem; } header { padding: 0; } .xz-title { padding: 0.6rem 0; } .xz-title h1 { font-size: 0.36rem; font-weight: bold; margin-bottom: 0.2rem; } .xz-title h2 { font-size: 0.24rem; } .xz-product .swiper-container { margin-top: 0; } .xz-product { padding-bottom: 0.6rem; } .xz-product .xz-box { padding-top: 0; padding-bottom: 0; } .xz-product .swiper-wrapper { padding-top: 0; } .xz-product .xz-item .xz-name { padding: 0.3rem 0.2rem; } .xz-product .xz-item .xz-name .xz-sub-title { margin-bottom: 0.2rem; } .xz-product .xz-item .xz-name .xz-more { font-size: 0.24rem; padding: 0.16rem 0.2rem; max-width: 2rem; } .xz-about>.xz-box { flex-flow: column; } .xz-about>.xz-box { padding: 0; } .xz-about .left { padding: 0.6rem 0.4rem; } .xz-about .left .xz-big-en { width: 2.6rem; margin-left: auto; margin-right: auto; margin-bottom: 0.2rem; display: none; } .xz-about .left .xz-min-en { width: 4rem; margin: 0 auto; display: none; } .xz-about .left .xz-info { padding: 0; } .xz-about .left .xz-sub-title { text-align: center; margin-bottom: 0.3rem; font-size: 0.36rem; } .xz-about .left .xz-desc { margin-bottom: 0.3rem; font-size: 0.28rem; text-align: justify; } .xz-about .left .xz-more { justify-content: center; } .xz-about .left .xz-more:after { width: 0.4rem; height: 0.4rem; display: none; } .xz-about .right .xz-item .xz-mask .xz-icon { width: 1.2rem; height: 1.2rem; margin-bottom: 0.2rem; } .xz-about .right .xz-item .xz-mask .xz-icon img { width: 0.6rem; } .xz-about .right .xz-item .xz-mask .xz-name { font-size: 0.32rem !important; } .xz-cases { padding-bottom: 0.6rem; } .xz-cases .xz-box { padding: 0 0.4rem; } .xz-cases .itembox .item { width: 48%; margin: 0 !important; } .xz-cases .itembox .item:nth-child(2n) { margin-left: 4% !important; } .xz-cases .itembox .item:nth-child(2)~.item { margin-top: 4% !important; } .xz-cases .itembox .item .xz-title { padding: 0.2rem 0.2rem; font-size: 0.24rem; } .xz-news { padding-bottom: 0.6rem; } .xz-news .itembox { flex-wrap: wrap; } .xz-news .itembox .item { width: 48%; } .xz-news .itembox .item:nth-child(3n-1) { margin: auto; } .xz-news .itembox .item:nth-child(2n) { margin-left: 4%; } .xz-news .itembox .item:nth-child(2)~.item { margin-top: 4%; display: none; } .xz-news .itembox .item .xz-info { padding: 0.3rem; } .xz-news .itembox .item .xz-info .xz-sub-title { font-size: 0.28rem; font-weight: bold; margin-bottom: 0.2rem; } .xz-news .itembox .item .xz-info .xz-time { font-size: 0.24rem; margin-bottom: 0.2rem; } .xz-news .itembox .item .xz-info .xz-desc { font-size: 0.24rem; text-align: justify; line-height: 1.4em; height: 4.2em; } .xz-news .xz-title { padding-bottom: 0.4rem; } footer { padding: 0; min-width: inherit; } footer>.xz-box { flex-flow: column; width: 100%; padding-top: 30px; padding-bottom: 10px; } footer .xz-card { padding: 0; border-right: 0; } footer .xz-card01 { display: none; } footer .xz-card01 .qr-group { padding: 0; margin-bottom: 20px; } footer .xz-card01 .en { font-size: 14px; margin-bottom: 20px; text-align: center; } footer .xz-card01 .qr-group { justify-content: center; } footer .xz-card01 .qr-group .qr:first-child { margin-right: 20px; } footer .xz-card02 { display: none; } footer .xz-card03 .xz-number { flex-wrap: wrap; justify-content: center; padding-bottom: 15px; margin-bottom: 15px; } footer .xz-card03 .xz-number::before { width: 20px; height: 20px; background-size: 100%; } footer .xz-card03 .xz-number .name { flex-shrink: 0; font-size: 16px; } footer .xz-card03 .xz-number .tel { width: 100%; text-align: center; padding: 15px 0; font-size: 20px; } footer .xz-card03 .copyright { font-size: 12px; text-align: center; } footer .xz-card03 .copyright>div { margin-bottom: 10px; font-size: 12px; line-height: 1.8em; } footer .xz-card03 .xz-number .xz-goto { padding: 10px 20px; font-size: 12px; line-height: 1.8em; } .mob-language { display: flex; justify-content: center; padding-top: 20px; align-items: center; } .mob-language a { font-size: 16px; color: #fff !important; text-transform: uppercase; text-align: center; padding: 0 20px; flex-grow: 1; } } .cont-toptex{ height: auto; overflow: hidden;} .xz-m{ margin: 35px auto 0; width: -moz-max-content; width: max-content; color: #333; border: 1px solid #333;} @media screen and (min-width: 751px) { .pc-none, .mob-nav, .pc-none { display: none !important; } }