/* Theme Name: Lilya Theme URI: Description: Version: Author: Gee Author URI: */ @charset "gb2312"; /* 初始化 */ body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td, img{margin:0; padding:0} body, button, input, select, textarea{font:normal 13px Arial, system-ui, -apple-system, Microsoft Yahei, tahoma, sans-serif} button, input, textarea, select{font-size:inherit; font-weight:inherit; border:0; outline:0} ul, ol, li{list-style:none} fieldset, img{border:0} h1, h2, h3, h4, h5, h6, code, dfn, em, var, i, b{font-style:normal; font-weight:normal} a{text-decoration:none; color:#555} input, textarea{outline-style:none} /* wpforms表单插件生成代码初始化 */ .wpforms-container .wpforms-confirmation-scroll, .wpforms-container .wpforms-error-container{line-height:16px} .wpforms-field-container .wpforms-field{padding:0; margin:0} .wpforms-field-container input, .wpforms-field-container textarea{margin:0; padding:0; border:none; background:none} .wpforms-container-full .wpforms-form .wpforms-field{clear:none!important} /* 全局表单文字 */ input::-webkit-input-placeholder{color:#AAA; font-size:16px} input::-moz-placeholder{color:#AAA; font-size:16px} input:-moz-placeholder{color:#AAA; font-size:16px} input:-ms-input-placeholder{color:#AAA; font-size:16px} /*滚动条*/ ::-webkit-scrollbar{width:6px; height:8px} ::-webkit-scrollbar-thumb{-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2); background:#333} ::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2); border-radius:0; background:#F1F1F1} /* 复制选中 */ ::selection{background:#338FFF; color:#FFF} ::-moz-selection{background:#338FFF; color:#FFF} ::-webkit-selection{background:#338FFF; color:#FFF} .fl{float:left} .fr{float:right} .container{overflow:hidden} .pr{position:relative} .clear{clear:both} .wrap{width:78.5%; max-width:1500px; margin:0 auto} .wrap_top{width:94%; margin:0 auto} @media screen and (max-width:1620px){ .wrap{width:86%} } @media screen and (max-width:1500px){ .wrap{width:1280px} } @media screen and (max-width:1366px){ .wrap{width:92%} } @media screen and (max-width:1200px){ .wrap{width:94%} } :root{ --i_color:#006CB8; /* 全局颜色 */ --i_color2:#00ADEF; /* 副颜色 */ --header_height:118px; /* 头部高度 */ --header_height_reduce:60px; /* 头部收缩后高度 */ --border_color:rgba(0,0,0,.1); /* 默认边框颜色 */ } @media screen and (max-width:1440px){ :root{--header_height:96px} } @media screen and (max-width:1366px){ :root{--header_height:90px} } @media screen and (max-width:1200px){ } @media screen and (max-width:959px){ :root{--header_height:60px} } @media screen and (max-width:767px){ :root{--border_color:rgba(0,0,0,.06)} } @media screen and (max-width:560px){ :root{--header_height:50px} } /* header */ header{position:fixed; top:0; left:0; width:100%; background:rgba(0,0,0,.7); box-shadow:0 4px 10px rgba(0,0,0,.1); z-index:2014} @media screen and (min-width:960px){ header .top{display:-webkit-flex; display:flex; justify-content:space-between} } @media screen and (max-width:959px){ header{background:rgba(0,0,0,.7)} } /* logo */ .logo{height:var(--header_height); display:-webkit-flex; display:flex; align-items:center} .logo img{max-height:30px} @media screen and (max-width:1440px){ .logo img{max-height:26px} } @media screen and (max-width:1366px){ .logo img{max-height:22px} } @media screen and (max-width:1200px){ .logo img{max-height:20px} } @media screen and (max-width:959px){ .logo{float:left} .logo img{max-height:18px} } @media screen and (max-width:767px){ .logo img{max-height:16px} } @media screen and (max-width:560px){ .logo img{max-height:14px} } /* 导航 */ @media screen and (min-width:960px){ .i_nav{display:-webkit-flex; display:flex; justify-content:center; flex-wrap:nowrap} .i_nav>li{margin:0 26px} .i_nav>li>a{display:block; font-size:18px; color:#FFF; line-height:var(--header_height); text-transform:uppercase} .i_nav>.current-menu-item>a, .i_nav>li:hover>a{color:var(--i_color2)!important} .i_nav .sub-menu{display:none; position:absolute; left:0; width:100%; background:#FFF; z-index:2} .i_nav .sub-menu>li{max-height:0; transition:max-height 300ms ease; overflow:hidden} .i_nav .sub-menu a{display:block; padding:0 20px; font-size:15px; color:#555; display:block; text-align:center; line-height:36px;} .i_nav>li:hover .sub-menu>li{max-height:36px} .nav_list_show{display:none; position:absolute; top:var(--header_height); left:0; box-sizing:border-box; padding:40px 0; width:100%; background:#2A2A2A; z-index:2013} } /* pc端 产品导航下拉 */ .nav_list_box{width:94%; max-width:1500px; margin:0 auto; display:-webkit-flex; display:flex; justify-content:center} .nav_products_show ul{margin:0 auto; padding-bottom:30px; display:-webkit-flex; display:flex; flex-wrap:nowrap; overflow-x:auto} /*滚动条*/ .nav_products_show ul::-webkit-scrollbar{width:3px; height:5px} .nav_products_show ul::-webkit-scrollbar-thumb{-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2); background:var(--i_color)} .nav_products_show ul::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2); border-radius:0; background:rgba(255,255,255,.2)} .nav_products_show li{min-width:230px} .nav_products_show li:not(:last-child){padding-right:50px; margin-right:50px; border-right:1px solid rgba(255,255,255,.1)} .nav_products_show li>a{display:block; margin-bottom:20px; font-size:19px; color:#FFF; text-transform:uppercase; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .nav_products_show li>a:hover{color:var(--i_color2)} .nav_products_show .img{margin:10px auto; width:100%; position:relative; overflow:hidden} .nav_products_show .img:before{content:""; display:block; padding-bottom:55%} .nav_products_show .img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); max-width:100%; max-height:100%; object-fit:contain} .nav_products_show dl{overflow:hidden} .nav_products_show dt{width:100%; position:relative} .nav_products_show dt a{display:block; font-size:15px; color:#FFF; line-height:34px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .nav_products_show dt:hover a{color:var(--i_color2)} @media screen and (max-width:1440px){ .nav_products_show li:not(:last-child){padding-right:40px; margin-right:40px} .nav_products_show li>a{font-size:18px} } @media screen and (max-width:1366px){ .nav_products_show li>a{font-size:17px} .nav_products_show dt a{font-size:14px; line-height:30px} } @media screen and (max-width:1200px){ .nav_products_show li>a{font-size:16px} } @media screen and (max-width:1080px){ .nav_products_show li>a{font-size:15px} } @media screen and (max-width:959px){ .nav_products_show{display:none!important} } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ } @media screen and (max-width:1440px){ .i_nav>li{margin:0 16px} .i_nav>li>a{font-size:17px} } @media screen and (max-width:1366px){ .i_nav>li{margin:0 12px} .i_nav>li>a{font-size:16px} } @media screen and (max-width:1200px){ .i_nav>li{margin:0 10px} .i_nav>li>a{font-size:14px} } @media screen and (max-width:959px){ .i_nav{display:none; position:absolute; top:var(--header_height); left:0; width:100%; width:100vw; background:#FFF; z-index:2} .i_nav>li{margin:0 0; border-bottom:1px solid var(--border_color); position:relative} .i_nav .menu-item-has-children:after{content:""; position:absolute; top:20px; right:16px; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:6px solid rgba(0,0,0,.3)} .i_nav .menu-item-has-children .menu-item-has-children:after{top:14px} .i_nav>li>a{padding:0 3%; font-size:15px; color:#555; line-height:42px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .nav_list_show{display:none!important} .i_nav>li>.sub-menu, .i_nav>li>.sub-menu .sub-menu{display:none} .i_nav .sub-menu li:not(:last-child){border-bottom:1px solid var(--border_color)} .i_nav>li>.sub-menu>li>a{padding:0 3% 0 6%; font-size:14px; color:#888; line-height:36px} .i_nav .sub-menu .sub-menu a{padding:0 3% 0 9%; font-size:14px; color:#888; line-height:30px} .i_nav a{display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .i_nav_list{display:none} } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ } /* 移动端导航 */ .nav_menu{position:absolute; width:26px; height:20px; right:3%; top:50%; transform:translateY(-50%); display:none; cursor:pointer} .nav_menu i{display:block; width:100%; height:3px; position:absolute; top:50%; margin-top:-2px; background:var(--i_color); border-radius:10px; transition:0.5s} .nav_menu::before{content:""; width:100%; height:3px; background:var(--i_color); position:absolute; top:0; left:0; border-radius:10px; transition:0.5s} .nav_menu::after{content:""; width:100%; height:3px; background:var(--i_color); position:absolute; bottom:0; left:0; border-radius:10px;transition:0.5s} .nav_menu.on i{opacity:0} .nav_menu.on::before{transform:rotate(45deg); top:50%; margin-top:-2px} .nav_menu.on::after{transform:rotate(-45deg); top:50%; margin-top:-2px} @media screen and (max-width:959px){ .nav_menu{display:block!important} } .top_r{height:var(--header_height)} /* 搜索 */ .top_search_ico{float:left; position:relative; top:50%; transform:translate(0,-50%)} .top_search_ico i{display:block; width:22px; height:22px; background:url(static/images/search_bai.svg) no-repeat center; background-size:contain; cursor:pointer} .top_search{--search_height:44px} .top_search{position:absolute; top:var(--header_height); left:0; width:100%; height:0; background:rgba(0,0,0,.4); overflow:hidden; z-index:-1} .top_search.on{display:block!important; height:74px} .top_search form{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:36%; font-size:0; overflow:hidden} .top_search .top_search_ipt, .top_search .top_search_btn{display:inline-block; vertical-align:middle} .top_search .top_search_ipt{width:calc(100% - var(--search_height)); height:var(--search_height); line-height:var(--search_height); box-sizing:border-box; padding-left:16px; font-size:16px; color:#555} .top_search .top_search_btn{width:var(--search_height); height:var(--search_height); background:var(--i_color) url(static/images/search_bai.svg) no-repeat center; background-size:20px; cursor:pointer} .top_search{-webkit-transition:all .5s ease; -moz-transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ } @media screen and (max-width:959px){ .top_r{float:right; margin-right:48px; position:initial} .top_search{top:var(--header_height); transform:none} .top_search.on{height:60px} .top_search form{width:94%} } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ .top_search_ico i{width:18px; height:18px} } /* 语言切换 */ .top_language{float:right; margin-left:40px; position:relative; top:50%; transform:translate(0,-50%); padding-right:22px; cursor:pointer} .top_language>li{} .top_language>li>a{display:none!important} .top_language>li:after{content:""; position:absolute; top:50%; margin-top:-4px; right:0; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:8px solid #FFF} .top_language.on>li:after{-webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg); transform:rotate(180deg)} .top_language i{display:block; width:30px; height:30px; background:url(static/images/language_bai.svg) no-repeat center; background-size:contain; cursor:pointer} .top_language .sub-menu{position:absolute; top:34px; right:0; display:none; min-width:100%; background:#FFF} .top_language.on .sub-menu{display:block!important} .top_language .sub-menu li{border-bottom:1px solid var(--border_color)} .top_language .sub-menu a>span{display:block; padding:0 14px; min-width:100px; overflow:hidden} .top_language .sub-menu img, .top_language .sub-menu .trp-ls-language-name{display:inline-block; vertical-align:middle} .top_language .sub-menu .trp-ls-language-name{margin-left:8px; font-size:14px; color:#666; line-height:32px} .top_language .sub-menu li:hover{background:rgba(0,0,0,.1)} .top_language .sub-menu li:hover .trp-ls-language-name{color:var(--i_color)} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ .top_language{margin-left:20px} } @media screen and (max-width:959px){ } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ .top_r{margin-right:42px} .top_language{margin-left:14px} .top_language i{width:28px; height:28px} .top_language>li{padding-right:16px} .nav_menu{width:22px; height:18px} } header, .logo, .logo img, .i_nav>li>a, .top_r{-webkit-transition:all .7s ease; -moz-transition:all .7s ease; -ms-transition:all .7s ease; -o-transition:all .7s ease; transition:all .7s ease} /* banner */ .banner{width:100%; overflow:hidden; position:relative} .banner .swiper-slide{height:0; overflow:hidden; padding-bottom:100vh; position:relative} .banner .swiper-slide>img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover} .banner .swiper-slide video{position:absolute; left:0; top:0; width:100%; height:100%!important; object-fit:cover; z-index:2} .banner .swiper-button-prev, .banner .swiper-button-next{ position:absolute; top:50%; transform:translate(0,-50%); width:60px; height:60px; z-index:999; outline:none; cursor:pointer; -moz-user-select:none; /*火狐*/ -webkit-user-select:none; /*webkit浏览器*/ -ms-user-select:none; /*IE10*/ -khtml-user-select:none; /*早期浏览器*/ user-select:none; -webkit-border-radius:200px; -moz-border-radius:200px; border-radius:200px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; } .banner .swiper-button-prev{left:-60px; background:rgba(0,0,0,.6) url(static/images/arrow_left_kx_bai.svg) no-repeat center; background-size:26px} .banner .swiper-button-next{right:-60px; background:rgba(0,0,0,.6) url(static/images/arrow_right_kx_bai.svg) no-repeat center; background-size:26px} .banner:hover .swiper-button-prev{left:4%} .banner:hover .swiper-button-next{right:4%} .banner .swiper-button-prev:hover, .banner .swiper-button-next:hover{background-color:var(--i_color)} .banner .pagination-all{ position:absolute; bottom:30px; left:50%; transform:translate(-50%,0); cursor:pointer; z-index:10; } .banner .swiper-pagination { position: relative; display: inline-block; text-align: left; } .banner .swiper-pagination-bullet { width: 2rem; height: 4px; border-radius: 0; background: rgba(255, 255, 255, 0.7); opacity: 1; margin: 0 0.2rem; position: relative; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .banner .swiper-pagination-bullet-active { background:var(--i_color); } @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ } @media screen and (max-width:959px){ #b_has_v{display:none!important} .banner .swiper-button-prev, .banner .swiper-button-next{display:none!important} } @media screen and (max-width:767px){ .banner .swiper-slide{padding-bottom:100%} } @media screen and (max-width:560px){ .banner .pagination-all{bottom:26px} .banner .swiper-pagination-bullet{width:1.6rem} } @media screen and (max-width:425px){ } /* banner上文字 */ .b_text1{position:absolute; top:26%; left:16%; width:50%} .b_text1 .h2{position:absolute; top:0; left:0; font-size:220px; color:rgba(255,255,255,.03); line-height:180px; font-weight:bold; letter-spacing:4px; text-transform:uppercase} .b_text1 .h3{font-size:58px; color:#FFF; font-weight:bold; text-transform:uppercase} .b_text1 dl{margin:10px 0 30px} .b_text1 dt{padding-left:20px; font-size:20px; color:#FFF; line-height:38px; text-transform:uppercase; position:relative} .b_text1 dt:before{content:""; position:absolute; top:50%; transform:translate(0,-50%); left:0; width:8px; height:8px; background:#FFF; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%} .b_text1 .i_more{margin:0 0; border-color:#FFF} .b_text1 .i_more a{color:#FFF} .b_text2{position:absolute; bottom:0; left:50%; transform:translate(-50%,0); width:90%; height:100%; text-align:center} .b_text2 .txt{position:absolute; left:50%; transform:translate(-50%,0); top:20%; width:100%} .b_text2 .h4{display:inline-block; padding:0 20px; border-top:2px solid rgba(255,255,255,.2); border-bottom:2px solid rgba(255,255,255,.2); font-size:26px; color:#FFF; font-weight:bold; line-height:42px; text-transform:uppercase} .b_text2 .h2{ display:table; margin:14px auto; font-size:102px; color:transparent; font-weight:bold; text-transform:uppercase; background:url(static/images/b_text2_m.jpg) no-repeat center; background-size:cover; -webkit-background-clip:text; background-clip:text; } .b_text2 dl{display:-webkit-flex; display:flex; justify-content:center; flex-wrap:nowrap} .b_text2 dt{margin:0 30px; padding-left:34px; background:url(static/images/b_text2_ico.png) no-repeat left center; background-size:contain; font-size:18px; color:#FFF; line-height:24px; text-transform:uppercase} .b_text2 img{position:absolute; left:50%; transform:translate(-50%,0); bottom:0; height:50%; object-fit:contain} .b_text3{position:absolute; top:26%; left:16%} .b_text3 .h2{font-size:62px; color:#FFF; font-weight:bold} .b_text3 .h3{margin:2px 0 6px; font-size:44px; color:var(--i_color); font-weight:bold} .b_text3 .h4{padding-bottom:20px; font-size:30px; color:#FFF; font-weight:bold; position:relative} .b_text3 .h4:before, .b_text3 .h4:after{content:""; position:absolute; left:0; background:#FFF} .b_text3 .h4:before{bottom:2px; width:100%; height:1px} .b_text3 .h4:after{bottom:0; width:30%; height:5px} .b_text3 dl{margin:30px 0 40px} .b_text3 dt{padding-left:30px; font-size:22px; color:#FFF; line-height:40px; position:relative} .b_text3 dt:before{content:""; position:absolute; top:50%; margin-top:-6px; left:2px; width:10px; height:10px; background:#FFF; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg)} .b_text3 .i_more{margin:0 0} .b_text3 .i_more a{background:#FFF} .b_text3 .h2, .b_text3 .h3, .b_text3 .h4, .b_text3 dt{text-transform:uppercase} @media screen and (max-width:1440px){ .b_text1 .h2{font-size:200px; line-height:160px} .b_text1 .h3{font-size:50px} .b_text1 dt{font-size:18px} .b_text2 .h4{font-size:24px} .b_text2 .h2{font-size:92px} .b_text3 .h2{font-size:58px} .b_text3 .h3{font-size:40px} .b_text3 .h4{font-size:26px} .b_text3 dl{margin:24px 0 30px} .b_text3 dt{font-size:20px} } @media screen and (max-width:1366px){ .b_text1{left:14%} .b_text1 .h2{font-size:160px; line-height:140px} .b_text1 .h3{font-size:44px} .b_text1 dt{font-size:17px} .b_text2 .h4{font-size:22px} .b_text2 .h2{font-size:80px} .b_text3{left:14%} .b_text3 .h2{font-size:52px} .b_text3 .h3{font-size:36px} .b_text3 .h4{font-size:22px} .b_text3 dt{font-size:18px; line-height:36px} } @media screen and (max-width:1200px){ .b_text1{top:24%; left:12%} .b_text1 .h2{font-size:150px; line-height:130px} .b_text1 .h3{font-size:40px} .b_text1 dt{font-size:16px; line-height:32px} .b_text2 .h4{font-size:20px} .b_text2 .h2{font-size:60px} .b_text2 dt{margin:0 20px; font-size:16px; line-height:20px} .b_text3{top:24%; left:12%} .b_text3 .h2{font-size:48px} .b_text3 .h3{font-size:32px} .b_text3 .h4{font-size:20px} } @media screen and (max-width:959px){ .b_text1{top:20%; left:10%} .b_text1 .h2{font-size:140px; line-height:116px} .b_text1 .h3{font-size:36px} .b_text1 dt{font-size:15px; line-height:28px} .b_text2 .txt{top:19%} .b_text2 .h4{font-size:18px} .b_text2 .h2{font-size:50px} .b_text2 dt{font-size:15px} .b_text2 img{height:54%} .b_text3 .h2{font-size:44px} .b_text3 .h3{font-size:30px} .b_text3 .h4{font-size:18px} .b_text3 dt{font-size:17px; line-height:34px} } @media screen and (max-width:767px){ .b_text1 .h2{font-size:130px; line-height:100px} .b_text1 .h3{font-size:32px} .b_text1 dt{font-size:14px; line-height:26px} .b_text2 .h4{font-size:16px; line-height:30px} .b_text2 .h2{margin:10px auto; font-size:36px} .b_text2 dt{font-size:14px; margin:0 16px; padding-left:28px; line-height:18px} .b_text3 .h2{font-size:38px} .b_text3 .h3{font-size:28px} .b_text3 .h4{font-size:17px} .b_text3 dl{margin:20px 0 20px} .b_text3 dt{font-size:15px; line-height:30px} } @media screen and (max-width:560px){ .b_text1{top:26%; left:8%} .b_text1 .h2{font-size:110px; line-height:90px} .b_text1 .h3{font-size:24px} .b_text1 dl{margin:8px 0 16px} .b_text1 dt{font-size:12px; line-height:26px; text-shadow:0px 0px 10px rgba(0,0,0,1)} .b_text1 dt:before{width:6px; height:6px; top:9px; transform:none} .b_text1 .i_more a{background:rgba(0,0,0,0.4)} .b_text2 .h4{font-size:14px; font-weight:normal; line-height:28px; border-top-width:1px; border-bottom-width:1px} .b_text2 .h2{margin:10px auto; font-size:28px} .b_text2 dt{font-size:12px; margin:0 10px; padding-left:24px; line-height:16px} .b_text3{top:23%} .b_text3 .h2{font-size:28px} .b_text3 .h3{font-size:22px} .b_text3 .h4{padding-bottom:12px; font-size:16px} .b_text3 .h4:before{bottom:1px} .b_text3 .h4:after{height:3px} .b_text3 dl{margin:14px 0 14px} .b_text3 dt{padding-left:24px; font-size:14px; line-height:30px} .b_text3 dt:before{width:8px; height:8px} } @media screen and (max-width:375px){ } /* main */ /* box间距 margin and padding */ .box_mg{margin:80px auto 70px} .box_pd{padding:100px 0} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ .box_mg{margin:60px auto 50px} .box_pd{padding:80px 0} } @media screen and (max-width:1200px){ .box_mg{margin:50px auto 46px} .box_pd{padding:66px 0} } @media screen and (max-width:959px){ .box_pd{padding:50px 0} } @media screen and (max-width:767px){ .box_mg{margin:40px auto 50px} .box_pd{padding:44px 0} } @media screen and (max-width:560px){ .box_mg{margin:30px auto 40px} .box_pd{padding:34px 0} } @media screen and (max-width:375px){ .box_mg{margin:24px auto 30px} .box_pd{padding:30px 0} } /* 首页大版块标题 */ .i_tit{margin-bottom:80px; text-align:center} .i_tit .h2{padding-bottom:20px; font-size:48px; color:#1E1E1E; font-weight:bold; text-transform:uppercase; position:relative} .i_tit .h2:after{content:""; position:absolute; left:50%; transform:translate(-50%,0); bottom:0; width:118px; height:4px; background:#7f7f7f; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px} @media screen and (max-width:1440px){ .i_tit .h2{font-size:40px} } @media screen and (max-width:1366px){ .i_tit{margin-bottom:50px} .i_tit .h2{font-size:34px} } @media screen and (max-width:1200px){ .i_tit{margin-bottom:40px} .i_tit .h2{font-size:28px} .i_tit .h2:after{width:80px} } @media screen and (max-width:959px){ .i_tit{margin-bottom:30px} .i_tit .h2{padding-bottom:14px; font-size:26px} .i_tit .h2:after{width:70px} } @media screen and (max-width:767px){ .i_tit{margin-bottom:28px} .i_tit .h2{padding-bottom:12px; font-size:24px} .i_tit .h2:after{width:60px} } @media screen and (max-width:560px){ .i_tit{margin-bottom:20px} .i_tit .h2{font-size:20px} } @media screen and (max-width:375px){ .i_tit{margin-bottom:18px} .i_tit .h2{font-size:17px} } /* 首页 更多 */ .i_more{display:table; margin:60px auto 0; border:1px solid #000; -webkit-border-radius:100px; -moz-border-radius:100px; border-radius:100px; overflow:hidden} .i_more a{display:block; padding:0 40px; font-size:18px; color:#333; line-height:46px} .i_more:hover{border-color:var(--i_color)} .i_more:hover a{background:var(--i_color); color:#FFF} @media screen and (max-width:1440px){ .i_more{margin:50px auto 0} .i_more a{padding:0 34px; font-size:17px; line-height:44px} } @media screen and (max-width:1366px){ .i_more{margin:40px auto 0} .i_more a{padding:0 30px; font-size:15px; line-height:38px} } @media screen and (max-width:1200px){ .i_more a{font-size:13px; line-height:34px} } @media screen and (max-width:959px){ .i_more{margin:30px auto 0} .i_more a{padding:0 24px} } @media screen and (max-width:767px){ .i_more{margin:26px auto 0} } @media screen and (max-width:560px){ .i_more a{padding:0 20px; font-size:12px; line-height:30px} } /* 首页 产品 */ .i_products{} /* 产品图片切换开关 */ .pic_switch1{display:block} .pic_switch2{display:none} /* .pic_switch_list .img img:nth-child(1){display:block} .pic_switch_list .img img:nth-child(2){display:none} */ @media screen and (min-width:960px){ .pic_switch_list li:hover .pic_switch1{display:none} .pic_switch_list li:hover .pic_switch2{display:block} /* .pic_switch_list li:hover .img img:nth-child(1){display:none} .pic_switch_list li:hover .img img:nth-child(2){display:block} */ } /* 产品分类（图标） */ .i_pro_icolist{display:-webkit-flex; display:flex; justify-content:center; flex-wrap:nowrap; overflow:hidden} .i_pro_icolist li{margin:0 1%; min-width:20%; text-align:center; position:relative} .i_pro_icolist img{display:block; margin:0 auto; width:80px; height:80px; object-fit:contain; -webkit-filter:grayscale(1); -moz-filter:grayscale(1); -o-filter:grayscale(1); -ms-filter:grayscale(1); filter:grayscale(1)} .i_pro_icolist h6{margin-top:18px; font-size:22px; color:#1E1E1E; text-transform:uppercase} .i_pro_icolist li:hover img{-webkit-filter:grayscale(0); -moz-filter:grayscale(0); -o-filter:grayscale(0); -ms-filter:grayscale(0); filter:grayscale(0)} .i_pro_icolist li:hover h6{color:var(--i_color)} @media screen and (max-width:1440px){ .i_pro_icolist h6{font-size:20px} } @media screen and (max-width:1366px){ .i_pro_icolist img{width:70px; height:70px} .i_pro_icolist h6{font-size:18px} } @media screen and (max-width:1200px){ .i_pro_icolist img{width:60px; height:60px} .i_pro_icolist h6{font-size:16px} } @media screen and (max-width:959px){ .i_pro_icolist h6{font-size:15px} } @media screen and (max-width:767px){ .i_pro_icolist img{width:50px; height:50px} .i_pro_icolist h6{margin-top:12px; font-size:14px} } @media screen and (max-width:560px){ .i_pro_icolist img{width:40px; height:40px} .i_pro_icolist h6{font-size:13px} } /* 产品分类（图片） */ .i_pro_piclist{margin-top:60px; width:100%; position:relative; overflow:hidden} .i_pro_piclist:before{content:""; display:block; padding-bottom:41%} .i_pro_piclist li{position:absolute; top:0; right:0; width:49.5%; height:48.5%; overflow:hidden} .i_pro_piclist li:nth-child(1){left:0; height:100%} .i_pro_piclist li:nth-child(3){top:initial; bottom:0} .i_pro_piclist a{display:block; height:100%; position:relative} .i_pro_piclist .img{position:absolute; left:50%; transform:translate(-50%,0); width:100%; height:100%} .i_pro_piclist .img img{width:100%; height:100%; object-fit:cover} .i_pro_piclist .txt{opacity:0; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; box-sizing:border-box; padding:0 20px; text-align:center; z-index:2} .i_pro_piclist .txt h2{font-size:36px; color:#FFF; font-weight:bold; text-transform:uppercase} .i_pro_piclist .txt h6{margin:10px 0 10px; font-size:20px; color:#FFF} .i_pro_piclist .txt i{font-size:14px; color:#FFF} @media screen and (min-width:960px){ .i_pro_piclist li:hover .img:before{content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.3)} .i_pro_piclist li:hover .txt{opacity:1; -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -ms-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease} .i_pro_piclist .txt{-webkit-transition:all .1s ease; -moz-transition:all .1s ease; -ms-transition:all .1s ease; -o-transition:all .1s ease; transition:all .1s ease} } @media screen and (max-width:1440px){ .i_pro_piclist .txt h2{font-size:34px} } @media screen and (max-width:1366px){ .i_pro_piclist .txt h2{font-size:30px} .i_pro_piclist .txt h6{font-size:18px} .i_pro_piclist .txt i{font-size:13px} } @media screen and (max-width:1200px){ .i_pro_piclist .txt h2{font-size:26px} .i_pro_piclist .txt h6{font-size:16px} .i_pro_piclist .txt i{font-size:12px} } @media screen and (max-width:959px){ .i_pro_piclist{margin-top:40px} .i_pro_piclist a:before, .i_pro_piclist a:after{width:50%} .i_pro_piclist .txt{opacity:1!important} .i_pro_piclist .txt h2{font-size:22px} .i_pro_piclist .txt h6{font-size:15px} } @media screen and (max-width:767px){ .i_pro_piclist .txt h2{font-size:18px} .i_pro_piclist .txt h6{margin:6px 0 6px} } @media screen and (max-width:560px){ .i_pro_piclist{margin-top:30px} .i_pro_piclist:before{display:none} .i_pro_piclist li{width:100%; margin-bottom:14px; position:relative; top:initial; right:initial; bottom:initial; overflow:hidden} .i_pro_piclist li:last-child{margin-bottom:0} .i_pro_piclist .img{position:relative; left:0; transform:none} .i_pro_piclist .img:after{content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.3)} .i_pro_piclist .img:before{content:""; display:block; padding-bottom:30%} .i_pro_piclist .img img{position:absolute; left:0; top:0} .i_pro_piclist a{position:initial} .i_pro_piclist .txt h6{margin-bottom:0} .i_pro_piclist .txt i{display:none} } /* 材质 石树脂 Stone resin */ .i_sr{--dt_height:36%} @media screen and (min-width:960px){ .i_sr_cont{width:100%; position:relative; overflow:hidden} .i_sr_cont:before{content:""; display:block; padding-bottom:38.5%} .i_sr_tit{position:absolute; top:0; right:0; width:100%; text-align:right} .i_sr_tit h4{font-size:26px; color:#1E1E1E} .i_sr_tit .i_more{float:right; margin:16px 0 0} .i_sr_pic1{position:absolute; top:0; left:0; width:50%; height:calc(100% - var(--dt_height)); overflow:hidden} .i_sr_pic1 img{width:100%; height:100%; object-fit:cover} .i_sr_pic2{position:absolute; bottom:0; left:50%; transform:translate(-50%,0); height:46%; overflow:hidden} .i_sr_pic2 img{position:absolute; right:0; width:50%; height:100%; object-fit:cover} .i_sr_list{position:absolute; left:50%; transform:translate(-50%,0); bottom:0; height:var(--dt_height); display:-webkit-flex; display:flex; flex-wrap:nowrap; flex-direction:row-reverse;} .i_sr_list dt{width:25%; height:100%; position:relative} .i_sr_list dt:nth-child(1), .i_sr_list dt:nth-child(2){position:relative; bottom:126%} .i_sr_list dt span{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; box-sizing:border-box; padding:0 40px} .i_sr_list dt .h3{width:100%; text-align:center; font-size:50px; font-weight:bold; line-height:50px} .i_sr_list dt p{margin-top:10px; width:100%; font-size:16px; height:96px; line-height:24px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4} } .i_sr_list dt:nth-child(4){background:#005998} .i_sr_list dt:nth-child(3){background:var(--i_color)} .i_sr_list dt:nth-child(2){background:#e5e5e5} .i_sr_list dt:nth-child(1){background:#EFEFEF} .i_sr_list dt:nth-child(4) .h3{color:#FFF} .i_sr_list dt:nth-child(3) .h3{color:#FFF} .i_sr_list dt:nth-child(2) .h3{color:#1E1E1E} .i_sr_list dt:nth-child(1) .h3{color:#1E1E1E} .i_sr_list dt:nth-child(4) p{color:#FFF} .i_sr_list dt:nth-child(3) p{color:#FFF} .i_sr_list dt:nth-child(2) p{color:#595959} .i_sr_list dt:nth-child(1) p{color:#595959} .i_sr_list dt:hover{background:#FFF} .i_sr_list dt:hover .h3{color:var(--i_color)} .i_sr_list dt:hover p{color:#595959} @media screen and (max-width:1660px){ .i_sr{--dt_height:34%} .i_sr_tit h4{font-size:24px} .i_sr_list dt span{padding:0 30px} .i_sr_list dt .h3{font-size:46px; line-height:46px} .i_sr_list dt p{font-size:15px} } @media screen and (max-width:1440px){ .i_sr_tit h4{font-size:22px} .i_sr_list dt span{padding:0 24px} .i_sr_list dt .h3{font-size:40px; line-height:40px} .i_sr_list dt p{font-size:14px; height:88px; line-height:22px} } @media screen and (max-width:1366px){ .i_sr_tit h4{font-size:20px} .i_sr_list dt span{padding:0 20px} .i_sr_list dt .h3{font-size:34px; line-height:34px} .i_sr_list dt p{font-size:13px; height:80px; line-height:20px} } @media screen and (max-width:1200px){ .i_sr{--dt_height:33%} .i_sr_tit h4{font-size:18px} .i_sr_pic2, .i_sr_list{width:100%} .i_sr_list dt .h3{font-size:30px; line-height:30px} .i_sr_list dt p{font-size:12px; height:60px; -webkit-line-clamp:3} } @media screen and (max-width:959px){ .i_sr_tit{margin-bottom:28px; text-align:center} .i_sr_tit h4{font-size:16px} .i_sr_tit .i_more{margin:14px auto 0} .i_sr_pic1, .i_sr_pic2{float:left; width:50%!important; position:relative; overflow:hidden} .i_sr_pic1:before, .i_sr_pic2:before{content:""; display:block; padding-bottom:50%} .i_sr_pic1 img, .i_sr_pic2 img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:101%; height:101%; object-fit:cover} .i_sr_list{display:-webkit-flex; display:flex; flex-wrap:nowrap; overflow:hidden} .i_sr_list dt{width:25%; margin:0} .i_sr_list dt span{display:block; padding:18px 18px} .i_sr_list dt .h3{margin-bottom:10px; font-size:28px; font-weight:bold} .i_sr_list dt p{height:80px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4} } @media screen and (max-width:767px){ .i_sr_list{flex-wrap:wrap} .i_sr_list dt{width:50%} .i_sr_list dt p{height:60px; -webkit-line-clamp:3} } @media screen and (max-width:560px){ .i_sr_list dt p{height:80px; -webkit-line-clamp:4} } /* 关于我们 about us */ .i_about{background:#F4F4F4; position:relative; overflow:hidden} .i_about:before{content:""; position:absolute; top:0; right:0; width:30%; height:100%; background:url(static/images/i_about_bg.jpg) no-repeat center; background-size:cover} .i_about_l{width:42%} .i_about_l .i_tit{margin-bottom:40px; text-align:left} .i_about_l .i_tit .h2:after{left:0; transform:none} .i_about_t{} .i_about_t h5{font-size:24px; color:#1C1C1C; font-weight:bold} .i_about_text{margin:24px 0 46px ; font-size:16px; color:#1C1C1C; line-height:26px} .i_about_text h1{display:inline-block; font-size:16px} .i_about_num{overflow:hidden; display:flex; display:-webkit-flex; justify-content:space-between; flex-wrap:wrap} .i_about_num dt{width:23%; text-align:center} .i_about_num dt .roll_num{font-size:42px; color:var(--i_color); font-weight:bold} .i_about_num dt p{font-size:17px; color:#1c1c1c} .i_about_l .i_more{margin:60px 0 0 0; border-color:var(--i_color)} .i_about_l .i_more a{background:var(--i_color); color:#FFF} .i_about_r{width:50%; position:relative} .i_name{position:absolute; top:0; right:0; font-size:200px; color:rgba(255,255,255,.05); line-height:160px; letter-spacing:4px; writing-mode:vertical-rl} .i_factory{width:calc(100% - 180px); padding-bottom:54px; position:relative} .i_factory_list{width:100%; padding:0; margin:0 auto; position:relative; overflow:hidden; z-index:1} .i_factory_list .swiper-wrapper{display:flex; position:relative; width:100%; z-index:1} .i_factory_list .swiper-slide{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-shrink:0; position:relative; cursor:pointer; } .i_factory_list .img{width:100%; position:relative; overflow:hidden} .i_factory_list .img:before{content:""; display:block; padding-bottom:95%} .i_factory_list .img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} /* 指示器 */ .factory-pagination{display:none; text-align:center; margin:20px auto 0} .factory-pagination .swiper-pagination-bullet{width:12px; height:12px; display:inline-block; margin:0 5px; background:#BBB; -webkit-border-radius:50%; -moz-border-radius:50%; -o-border-radius:50%; border-radius:50%; outline:none} .factory-pagination .swiper-pagination-bullet-active{position:relative; background:var(--i_color)} /* 左右箭头 */ .i_factory .factory-button-prev, .i_factory .factory-button-next{position:absolute; bottom:0; right:0; width:16px; height:30px; z-index:999; cursor:pointer; outline:none} .i_factory .factory-button-prev:before, .i_factory .factory-button-next:before{ position:absolute; top:50%; left:50%; font-size:30px; line-height:30px; color:#FFF; font-family:-apple-system, simsun, system-ui, sans-serif; letter-spacing:-2px; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); transform:translate(-50%,-50%); } .i_factory .factory-button-prev{right:30px} .i_factory .factory-button-prev:before{content:"<"} .i_factory .factory-button-next{right:0} .i_factory .factory-button-next:before{content:">"} .i_factory .factory-button-prev:hover:before, .i_factory .factory-button-next:hover:before{color:var(--i_color)} @media screen and (max-width:1440px){ .i_about_num dt .roll_num{font-size:38px} .i_about_num dt p{font-size:16px} .i_name{font-size:160px} } @media screen and (max-width:1366px){ .i_about_l .i_tit{margin-bottom:34px} .i_about_t h5{font-size:22px} .i_about_text{margin:16px 0 30px; font-size:15px} .i_about_num dt .roll_num{font-size:34px} .i_about_l .i_more{margin:42px 0 0 0} .i_name{font-size:140px; letter-spacing:8px} .i_factory{width:calc(100% - 160px)} } @media screen and (max-width:1200px){ .i_about_l .i_tit{margin-bottom:28px} .i_about_t h5{font-size:20px} .i_about_text{margin:14px 0 26px; font-size:14px; line-height:24px} .i_about_num dt .roll_num{font-size:30px} .i_about_num dt p{font-size:14px} .i_about_l .i_more{margin:36px 0 0 0} .i_name{font-size:120px; letter-spacing:12px} .i_factory{width:calc(100% - 150px)} } @media screen and (max-width:1080px){ .i_about_t h5{font-size:19px} .i_about_text{overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4} .i_name{font-size:90px; letter-spacing:18px} .i_factory{width:calc(100% - 140px)} } @media screen and (max-width:959px){ .i_about_l{width:50%} .i_about_t h5{font-size:18px} .i_about_l .i_more{margin:26px 0 0 0} .i_about_r{width:42%} .i_name{display:none!important} .i_factory{width:100%} } @media screen and (max-width:767px){ .i_about:before{display:none} .i_about_l, .i_about_r{float:none!important; width:100%} .i_about_l{margin-bottom:30px} .i_about_num dt p{font-size:13px} .i_factory{padding-bottom:0} .factory-pagination{display:block} .i_factory .factory-button-prev, .i_factory .factory-button-next{display:none!important} } @media screen and (max-width:560px){ .i_about_num dt .roll_num{font-size:26px} .i_about_num dt p{font-size:12px} .factory-pagination{margin:14px auto 0} .factory-pagination .swiper-pagination-bullet{width:10px; height:10px} } /* 视频 2023-10-17 */ .v_box{width: 100%;margin-left: auto;margin-right: auto; position:relative; overflow:hidden} .v_box::before{content:""; display:block; padding-bottom:56.25%} .v_box iframe{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover; -webkit-transition: all .5s ease; transition: all .5s ease} /* 新闻 news */ .i_news{--i_size:54px; --li_pic_width:176px; --li_pic_height:116px; --li_mar:44px} .i_news{overflow:hidden} /* 左侧图片展示 */ .i_products_show{width:49%} .i_products_show .sublist{display:none} .i_products_show .sublist:first-child{display:block} .i_news_pic_show{width:100%; position:relative; overflow:hidden} .i_news_pic_show:before{content:""; display:block; padding-bottom:calc(var(--li_pic_height) * 3 + var(--li_mar) * 2)} .i_news_pic_show img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} .i_news_pic_show .txt{position:absolute; left:0; bottom:0; width:100%; background:rgba(0,0,0,.5)} .i_news_pic_show .txt p{width:100%; box-sizing:border-box; padding:0 calc(var(--i_size) + 20px) 0 20px; font-size:18px; color:#FFF; line-height:var(--i_size); overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .i_news_pic_show .txt i{display:block; position:absolute; right:0; bottom:0; width:var(--i_size); height:var(--i_size); background:var(--i_color) url(static/images/arrow_right_kx_bai.svg) no-repeat center; background-size:28px} /* 右侧新闻列表 */ .i_products_nav{width:48%} .i_products_nav ul{position:relative; overflow:hidden} .i_products_nav ul:before{content:""; position:absolute; top:50%; transform:translate(0,-50%); left:7px; width:3px; height:calc(100% - var(--li_pic_height)); background:#D8D8D8} .i_products_nav li{box-sizing:border-box; padding-left:40px; position:relative; overflow:hidden} .i_products_nav li:not(:last-child){margin-bottom:var(--li_mar)} .i_products_nav li:before{content:""; position:absolute; top:50%; transform:translate(0,-50%); left:0; width:18px; height:18px; box-sizing:border-box; border:3px solid var(--i_color); -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; background:#FFF} .i_products_nav .current:before{background:var(--i_color)!important} .i_products_nav .img{float:left; width:var(--li_pic_width); position:relative; overflow:hidden} .i_products_nav .img:before{content:""; display:block; padding-bottom:var(--li_pic_height)} .i_products_nav .img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} .i_products_nav .txt{float:right; width:calc(100% - var(--li_pic_width) - 30px)} .i_products_nav .txt h4{font-size:22px; color:#2D2D2D; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .i_products_nav .txt i{display:block; margin:8px 0; font-size:14px; color:#2D2D2D} .i_products_nav .txt .h6{padding-top:6px; border-top:1px solid var(--border_color); font-size:14px; color:#2D2D2D; line-height:22px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2} .i_products_nav li:hover h2{color:var(--i_color)} @media screen and (max-width:1440px){ .i_products_nav .txt h4{font-size:20px} } @media screen and (max-width:1366px){ .i_products_nav .txt h4{font-size:18px} } @media screen and (max-width:1200px){ .i_news{--li_mar:30px; --li_pic_width:156px; --li_pic_height:108px} .i_news_pic_show .txt p{font-size:17px} .i_products_nav .txt h4{font-size:17px; text-overflow:initial; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2} .i_products_nav .txt i{margin:6px 0; font-size:13px} .i_products_nav .txt .h6{font-size:13px; line-height:18px} .i_products_nav ul:before{left:6px; width:2px} .i_products_nav li:before{width:14px; height:14px} } @media screen and (max-width:959px){ .i_products_show, .i_products_nav{float:none!important; width:100%} .i_products_show{display:none} .i_products_nav li{padding-left:0} .i_products_nav ul:before, .i_products_nav li:before{display:none} } @media screen and (max-width:767px){ .i_products_nav .txt h4{font-size:16px} } @media screen and (max-width:560px){ .i_news{--li_pic_width:136px} .i_products_nav .txt{width:calc(100% - var(--li_pic_width) - 24px)} .i_products_nav .txt h4{font-size:15px} .i_products_nav .txt i{font-size:12px} .i_products_nav .txt .h6{font-size:12px} } /* 合作伙伴 */ .i_partner_box{} .i_partner{position:relative} .i_partner_list{width:100%; padding:0; margin:0 auto; position:relative; overflow:hidden; z-index:1} .i_partner_list .swiper-wrapper{display:flex; position:relative; width:100%; z-index:1} .i_partner_list .swiper-slide{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-shrink:0; position:relative; } .i_partner_list .img{width:100%; box-sizing:border-box; border:1px solid rgba(0,0,0,.2); position:relative; overflow:hidden} .i_partner_list .img:before{content:""; display:block; padding-bottom:50%} .i_partner_list .img img{opacity:.5; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); max-width:70%; max-height:60%; filter:grayscale(1); -webkit-filter:grayscale(1); -moz-filter:grayscale(1); -o-filter:grayscale(1); -ms-filter:grayscale(1); object-fit:contain} .i_partner_list li:hover img{opacity:1; filter:grayscale(0); -webkit-filter:grayscale(0); -moz-filter:grayscale(0); -o-filter:grayscale(0); -ms-filter:grayscale(0)} .i_partner_list .img img{-webkit-transition:all .5s ease; -moz-transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease} /* 指示器 */ .pt-pagination{display:none; text-align:center; margin:20px auto 0} .pt-pagination .swiper-pagination-bullet{width:12px; height:12px; display:inline-block; margin:0 5px; background:#BBB; -webkit-border-radius:50%; -moz-border-radius:50%; -o-border-radius:50%; border-radius:50%; outline:none} .pt-pagination .swiper-pagination-bullet-active{position:relative; background:var(--i_color)} /* 左右箭头 */ .i_partner .pt-button-prev, .i_partner .pt-button-next{position:absolute; top:50%; transform:translate(0,-50%); width:40px; height:50px; background:rgba(0,0,0,.3); z-index:999; cursor:pointer; outline:none} .i_partner .pt-button-prev:before, .i_partner .pt-button-next:before{ position:absolute; top:50%; left:50%; font-size:30px; line-height:30px; color:#FFF; font-family:-apple-system, simsun, system-ui, sans-serif; letter-spacing:-2px; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); transform:translate(-50%,-50%); } .i_partner .pt-button-prev{left:1px} .i_partner .pt-button-prev:before{content:"<"} .i_partner .pt-button-next{right:1px} .i_partner .pt-button-next:before{content:">"} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ .i_partner .pt-button-prev, .i_partner .pt-button-next{display:none} .pt-pagination{display:block} } @media screen and (max-width:959px){ } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ .pt-pagination{margin:14px auto 0} .pt-pagination .swiper-pagination-bullet{width:10px; height:10px} } /* footer 底部 */ footer{background:url(static/images/footer_bg.jpg) no-repeat center; background-size:cover} .f_cont_box{padding:60px 0 40px} .f_form_box{display:-webkit-flex; display:flex; flex-wrap:wrap;} .p_caption_footer{width: 30%;margin:70px 0 0 auto;} .p_caption_footer li{display:-webkit-flex; display:flex; flex-wrap:nowrap;margin:14px 0} .p_caption_footer p{min-width:140px} .p_caption_footer b{font-weight: bold;} .p_caption_footer p,.p_caption_footer b{font-size: 15px;color:#FFF} @media screen and (max-width:768px) { .p_caption_footer p,.p_caption_footer b{font-size: 14px} .p_caption_footer p{min-width:130px} } /* 表单 */ .footer_form{--input_font_size:16px; --input_height:54px} .footer_form{width:66%; overflow:hidden} .footer_form .tit{margin-bottom:30px; font-size:34px; color:#FFF; font-weight:bold} #wpforms-162{width:100%; margin:0 auto; padding:0} #wpforms-form-103{width:100%; overflow:hidden} #wpforms-162 input, #wpforms-162 button{margin:0; padding:0; border:none; background:none} #wpforms-162 .wpforms-field{padding:0; margin:0; position:relative} #wpforms-162 .wpforms-field-container{float:left; width:100%; overflow:hidden} #wpforms-162 .wpforms-submit-container{float:right; padding:0!important; width:170px; height:32px; background:#FFF; -webkit-border-radius:100px; -moz-border-radius:100px; border-radius:100px; position:relative} #wpforms-162 .wpforms-field-container>div{padding-bottom:20px; margin-bottom:4px!important} #wpforms-162 .wpforms-field-label{font-size:0} #wpforms-162 .wpforms-field{width:100%; background:transparent; overflow:hidden} #wpforms-162 .wpforms-field:first-child{float:left; margin-right:2%} #wpforms-162 .wpforms-required-label{position:absolute; font-size:12px; color:#F00; top:22px; left:4px} #wpforms-162-field_1-container, #wpforms-162-field_2-container{float:left!important; width:49%!important; margin-bottom:20px!important} #wpforms-162 input, #wpforms-162 textarea{width:100%; max-width:100%!important; font-size:var(--input_font_size); color:#555; height:var(--input_height); line-height:var(--input_height); box-sizing:border-box; border:1px solid rgba(0,0,0,.6); background:#FFF; padding:0 10px} #wpforms-162 textarea{min-height:120px} #wpforms-162 input::-webkit-input-placeholder{color:rgba(0,0,0,.6); font-size:var(--input_font_size)} #wpforms-162 input::-moz-placeholder{color:rgba(0,0,0,.6); font-size:var(--input_font_size)} #wpforms-162 input::-moz-placeholder{color:rgba(0,0,0,.6); font-size:var(--input_font_size)} #wpforms-162 input::-ms-input-placeholder{color:rgba(0,0,0,.6); font-size:var(--input_font_size)} #wpforms-162 #wpforms-162-field_1-error, #wpforms-162 #wpforms-162-field_2-error, #wpforms-162 #wpforms-162-field_3-error{position:absolute; font-size:14px} #wpforms-162 .wpforms-submit-container button{width:100%; height:32px; font-size:16px; color:#555; line-height:32px; cursor:pointer; text-transform:uppercase; position:relative; z-index:2} #wpforms-162 .wpforms-submit-container img{position:absolute; top:50%; transform:translate(0,-50%); right:4px} #wpforms-162 .wpforms-submit-container:hover{background:var(--i_color2)} #wpforms-162 .wpforms-submit-container:hover button{color:#FFF} .f_cont{margin-top:30px; display:-webkit-flex; display:flex; flex-wrap:nowrap; justify-content:space-between} .f_cont dt{margin-right:6%} .f_cont dd{margin-left:14%} .f_cont dt{max-width:28%} .f_logo{margin:0 auto} .f_logo img{} .f_cont dt .h6{margin:26px 0 14px; font-size:16px; color:#FFF; line-height:24px} .f_icolink{padding-top:10px; overflow:hidden} .f_icolink img{height:34px} .f_icolink a{display:block; float:left} .f_icolink a:not(:last-child){margin-right:24px} .f_icolink a:hover{-webkit-transform:translate(0,-8px); -moz-transform:translate(0,-8px); -o-transform:translate(0,-8px); -ms-transform:translate(0,-8px); transform:translate(0,-8px)} .f_icolink a{-webkit-transition:all .5s ease; -moz-transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease} .f_cont dd{} .f_cont dd .h2{margin:20px 0; font-size:24px; color:#FFF; font-weight:bold; line-height:50px; text-transform:uppercase; position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .f_cont dd .h2:after{content:""; position:absolute; left:0; bottom:0; width:146px; height:1px; background:#FFF} .f_cont dd li a{text-transform:uppercase} .f_cont dd a{display:block; font-size:15px; color:#FFF; line-height:30px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .f_cont dd p{margin-bottom:16px; overflow:hidden; display:-webkit-flex; display:flex; flex-wrap:nowrap} .f_cont dd i{display:block; margin-right:10px; width:22px; height:22px} .f_cont dd i img{height:100%} .f_cont dd span, .f_cont dd span a{display:block; font-size:15px; color:#FFF; line-height:24px; text-transform:initial!important} .f_cont a:hover{color:var(--i_color2)} /* 版权 */ .f_copy{padding:14px 0; background:rgba(0,0,0,.2)} .f_copy .h6{text-align:center} .f_copy .h6, .f_copy a{font-size:16px; color:#FFF; line-height:22px} .f_copy a:hover{color:var(--i_color2)} @media screen and (max-width:1440px){ .footer_form .tit{font-size:32px} .f_cont dt .h6{font-size:15px} .f_cont dd .h2{font-size:22px} .f_copy .h6{font-size:15px} } @media screen and (max-width:1366px){ .footer_form .tit{font-size:30px} .footer_form{--input_font_size:15px; --input_height:50px} .f_logo img{max-width:180px} .f_cont dt .h6{font-size:14px} .f_cont dd .h2{font-size:20px} .f_cont dd a{line-height:28px} .f_copy .h6{font-size:14px} .f_cont dt{max-width:36%; margin-right:0} .f_cont dd{margin-left:12%} } @media screen and (max-width:1200px){ .f_cont_box{padding:50px 0 30px} .footer_form{--input_font_size:14px; --input_height:46px} .footer_form .tit{font-size:28px} .f_copy .h6, .f_copy a{font-size:15px} } @media screen and (max-width:959px){ .footer_form{width:80%} .p_caption_footer{width: 100%;margin: 20px 0 10px 0;} .f_logo img{max-width:140px} .footer_form .tit{font-size:26px} .f_cont dt{max-width:34%; margin-right:0} .f_cont dd{margin-left:8%} .f_cont dd .h2{font-size:19px} .f_cont dd a, .f_cont dd span, .f_cont dd span a{font-size:14px} .f_copy .h6, .f_copy a{font-size:14px} } @media screen and (max-width:767px){ .f_cont_box{padding:40px 0 20px} .footer_form{width:100%} .f_logo, .f_cont dt .h6{display:none} .f_cont{display:block} .f_cont dt{max-width:100%} .f_cont dd{width:100%; margin:10px 0 0; overflow:hidden} .f_cont dd li{float:left; margin-right:20px} .f_cont dd .h2{margin:10px 0 16px; font-size:18px; line-height:40px} .f_cont dd i{width:20px; height:20px} .f_cont dd p{margin-bottom:12px} .f_cont dd a, .f_cont dd span, .f_cont dd span a{line-height:20px} } @media screen and (max-width:560px){ .f_cont_box{padding:40px 0 10px} .footer_form .tit{font-size:22px; margin-bottom:20px} #wpforms-162 .wpforms-submit-container button{font-size:14px} .f_cont dd{display:none} .f_cont dd:last-child{display:block!important} .f_cont dd a, .f_cont dd span, .f_cont dd span a{font-size:13px} .f_copy .h6, .f_copy a{font-size:13px} } /* 隐私政策 */ .privacy_cont{} .privacy_cont .tit{margin-bottom:30px} .privacy_cont .tit h2{font-size:24px; text-align:center; font-weight:bold} .privacy_cont article, .privacy_cont article *{font-size:14px; color:#666; line-height:24px} /* cookie弹窗 */ #cookie{display: none;position:fixed; top:0; left:0; width:100%; height:100%; background:rgb(0 0 0 / 60%); z-index:999999999} .cookie_cont{position:absolute; bottom:60px; left:50%; transform:translate(-50%,0); padding:36px; background:#FFF; box-shadow:0 0 10px rgb(0 0 0 / 10%)} .cookie_cont p{font-size:20px; color:#555} .cookie_cont dl{margin-top:20px; text-align:center; overflow:hidden} .cookie_cont dt{display:inline-block; margin:0 4px; padding:0 60px; vertical-align:middle; background:#EEE; font-size:18px; line-height:36px; cursor:pointer} .cookie_cont dt:first-child{background:var(--i_color); color:#FFF} @media screen and (max-width:1200px){ .cookie_cont p{font-size:16px} .cookie_cont dt{padding:0 50px; line-height:34px; font-size:16px} } @media screen and (max-width:959px){ #cookie{display:none!important} } /* -------------------------------------- 内页 -------------------------------------- */ /* 内页头部 */ .in_header{background:#222!important} /* .in_page_header .i_nav>li>a{color:#555} .in_page_header .top_search_ico i{background:url(static/images/search_hei.svg) no-repeat center; background-size:contain} .in_page_header .top_language i{background:url(static/images/language_hei.svg) no-repeat center; background-size:contain} .in_page_header .top_language>li:after{border-top:8px solid #222} */ .full_header_height{display:block; width:100%; height:var(--header_height)} /* 当前位置 */ .in_position{padding:14px 0; background:#F6F6F6} .in_position a{display:block; float:left; font-size:14px; color:#666; position:relative; line-height:20px; text-transform:uppercase} .in_position h2{font-size:14px; color:var(--i_color); line-height:20px; text-transform:uppercase} .in_position a:first-child{padding-left:24px; background:url(static/images/home_b.svg) no-repeat left center; background-size:16px} .in_position a:not(:last-child):after{content:">"; margin:0 4px; color:#777} .in_position a:last-child{color:var(--i_color)!important} .in_position a:hover{color:var(--i_color)} @media screen and (max-width:959px){ .in_position a{font-size:15px} } @media screen and (max-width:767px){ .in_position a{font-size:14px} } @media screen and (max-width:560px){ .in_position a{font-size:12px} } /* 内页banner */ .in_banner{width:100%; position:relative; overflow:hidden} .in_banner img{width:100%; width:100vw; object-fit:cover} @media screen and (max-width:959px){ .in_banner:before{content:""; display:block; padding-bottom:32%} .in_banner img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} } @media screen and (max-width:767px){ .in_banner:before{padding-bottom:34%} } @media screen and (max-width:560px){ .in_banner:before{padding-bottom:36%} } /* 内页左右框架 */ .in_box{--box_l_width:23.5%} .in_box_l{width:var(--box_l_width); box-sizing:border-box; overflow:hidden} .in_box_r{width:calc(100% - var(--box_l_width) - 70px); overflow:hidden} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ .in_box{--box_l_width:25%} } @media screen and (max-width:1200px){ .in_box{--box_l_width:26%} .in_box_r{width:calc(100% - var(--box_l_width) - 40px)} } @media screen and (max-width:1080px){ .in_box{--box_l_width:28%} } @media screen and (max-width:959px){ .in_box_l, .in_box_r{float:none!important; width:100%} .in_box_l{margin-bottom:30px; padding:0!important} } @media screen and (max-width:767px){ .in_box_l{margin-bottom:24px} } @media screen and (max-width:560px){ .in_box_l{margin-bottom:20px} } /* 左侧二级栏目列表 */ .in_nav_list{overflow:hidden} .in_nav_tit{position:relative} .in_nav_tit .h2{margin-bottom:20px; font-size:24px; color:var(--i_color); font-weight:bold; text-transform:uppercase} .in_nav_list .submenu{overflow:hidden} .in_nav_list li{border-top:1px solid var(--border_color)} .in_nav_list .submenu>li:first-child{border-top:none} .in_nav_list .submenu>li:last-child{border-bottom:1px solid var(--border_color)} .in_nav_list li a{display:block; font-size:16px; line-height:42px; position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .in_nav_list .submenu>li>a{padding:0 20px 0 20px; color:#3A3A3A} .in_nav_list .submenu>li>a:before{content:""; position:absolute; top:50%; transform:translate(0,-50%); left:10px; width:2px; height:42%; background:#3A3A3A} .in_nav_list .sub-menu li a{box-sizing:border-box; padding:0 20px 0 36px; color:#686868} .in_nav_list .current-menu-item>a, .in_nav_list a:hover{background:var(--i_color); color:#FFF!important} .in_nav_list .current-menu-item>a:before, .in_nav_list .submenu>li>a:hover:before{background:#FFF!important} @media screen and (max-width:1440px){ .in_nav_tit .h2{font-size:21px} } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ .in_nav_tit .h2{font-size:20px} .in_nav_list li a{font-size:15px} } @media screen and (max-width:959px){ .in_nav_tit:after{content:""; position:absolute; top:50%; transform:translate(0,-50%); right:0; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:8px solid var(--i_color)} .open .in_nav_tit:after{border-top:none!important; border-bottom:8px solid var(--i_color)!important} .in_nav_list{box-sizing:border-box; padding:0 20px; background:rgba(0,0,0,.03)} .in_nav_tit .h2{margin-bottom:0; font-size:18px; line-height:54px} .in_nav_list>ul{display:none; margin-top:4px} .in_nav_list .submenu>li:last-child{border-bottom:none} } @media screen and (max-width:767px){ .in_nav_tit .h2{font-size:16px; line-height:50px} .in_nav_list>ul{margin-top:0} } @media screen and (max-width:560px){ .in_nav_tit .h2{font-size:15px; line-height:44px} .in_nav_list li a{font-size:14px; line-height:38px} } /* 右侧产品列表 */ .in_products_list_box{} .in_products_list_box .in_products_abstract, .in_products_list_box .in_products_abstract *{font-size:16px; color:#5A5A5A; line-height:28px} .in_products_abstract{display: block;} .open{display: none;} @media screen and (max-width:768px) { .open{ display: block; margin-top: 10px; text-align: center; font-size: 15px;color: var(--i_color);line-height: 38px;border: 1px solid #EEE;background: #F1F1F1;} } .in_products_list{margin:40px auto 0; overflow:hidden} .in_products_list li{float:left; width:31.33%; margin:0 3% 30px 0} .in_products_list li:nth-child(3n){margin-right:0} .in_products_list .img{width:100%; position:relative; overflow:hidden} .in_products_list .img:before{content:""; display:block; padding-bottom:89%} .in_products_list .img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} .in_products_list .txt{text-align:center; margin:10px 0} .in_products_list .txt h5{font-size:16px; color:#4E4E4E; line-height:22px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2} .in_products_list li:hover h5{color:var(--i_color)} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ .in_products_list_box .in_products_abstract, .in_products_list_box .in_products_abstract *{font-size:15px} .in_products_list .txt h5{font-size:14px} } @media screen and (max-width:1200px){ .in_products_list_box .in_products_abstract, .in_products_list_box .in_products_abstract *{font-size:14px; line-height:26px} .in_products_list li{margin:0 3% 24px 0} .in_products_list .txt h5{font-size:13px; line-height:20px} } @media screen and (max-width:959px){ } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ .in_products_list{margin:30px auto 0} .in_products_list li{width:48%; margin:0 4% 24px 0} .in_products_list li:nth-child(3n){margin-right:4%} .in_products_list li:nth-child(2n){margin-right:0} .in_products_list .txt h5{-webkit-line-clamp:3} } /* 内页 分类标题（带图标） */ .in_products_category_tit{margin-bottom:40px; text-align:center; position:relative} .in_products_category_tit img{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); max-height:100%} .in_products_category_tit .h2{position:relative; font-size:46px; color:#1E1E1E; line-height:100px; font-weight:bold; z-index:2} .in_p_tit_h1 h1{position:relative; font-size:46px; color:#1E1E1E; line-height:100px; font-weight:bold; z-index:2} @media screen and (max-width:1440px){ .in_products_category_tit .h2{font-size:42px} .in_p_tit_h1 h1{font-size:42px} } @media screen and (max-width:1366px){ .in_products_category_tit{margin-bottom:24px} .in_products_category_tit .h2{font-size:36px; line-height:60px} .in_p_tit_h1 h1{font-size:36px; line-height:60px} } @media screen and (max-width:1200px){ .in_products_category_tit{margin-bottom:16px} .in_products_category_tit .h2{font-size:32px; line-height:50px} .in_p_tit_h1 h1{font-size:32px; line-height:50px} } @media screen and (max-width:959px){ .in_products_category_tit{margin-bottom:20px} .in_products_category_tit .h2{font-size:28px; line-height:46px} .in_p_tit_h1 h1{font-size:28px; line-height:46px} } @media screen and (max-width:767px){ .in_products_category_tit .h2{font-size:26px; line-height:40px} .in_p_tit_h1 h1{font-size:26px; line-height:40px} } @media screen and (max-width:560px){ .in_products_category_tit{margin-bottom:14px} .in_products_category_tit .h2{font-size:22px; line-height:36px} .in_p_tit_h1 h1{font-size:22px; line-height:36px} } /* 页数 */ .in_page_box{text-align:center; margin-bottom:30px; overflow:hidden} .in_page{display:inline-block} .in_page a{float:left; display:block; margin:0 4px; padding:0 12px; line-height:30px; font-size:14px; color:#666; -webkit-border-radius:100px; -moz-border-radius:100px; border-radius:100px; border:1px solid #CCC} .in_page a:hover, .in_page .current{border-color:var(--i_color)!important; background:var(--i_color); color:#FFF!important} /* ----------------------- 内页 - 产品详情页 ----------------------- */ .pro_details{--img_size:600px; --sm_img_box:500px} .pro_details{position:relative; overflow:hidden} /* 图片查看区 */ #MagnifierWrap2{float:left; position:relative; width:var(--img_size)} .MagnifierMain{position:relative; width:var(--img_size); height:var(--img_size); box-sizing:border-box; border:1px solid #DDD} .MagnifierMain:before{content:""; display:block; padding-bottom:100%} .MagnifierMain img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} .MagnifierDrag{position:absolute; top:0; left:0; background:rgba(255,255,255,.6); cursor:move} .MagnifierPop{position:absolute; top:0; overflow:hidden; background:#FFF; box-sizing:border-box; border:1px solid #DDD; z-index:2013} .MagnifierImg{position:absolute; top:0; left:0} .spec-items{position:relative; width:var(--sm_img_box); height:calc(var(--sm_img_box) / 4 - 5px); overflow:hidden; margin:10px auto 0} .spec-items ul{width:500%; position:absolute; top:0; left:0} .spec-items li{width:calc(var(--sm_img_box) / 4 - 5px); height:calc(var(--sm_img_box) / 4 - 5px); float:left; margin-right:5px; box-sizing:border-box; border:2px solid #EFEFEF; overflow:hidden; position:relative; cursor:pointer} .spec-items li.on{border:2px solid var(--i_color)} .spec-items li img{width:100%; height:100%; object-fit:cover} span.spe_leftBtn, span.spe_rightBtn{opacity:.2; position:absolute; bottom:0px; display:block; width:30px; height:calc(var(--sm_img_box) / 4 - 5px); cursor:not-allowed} span.spe_leftBtn{left:0; background:url(static/images/arrow_left_kx_hei.svg) no-repeat center; background-size:contain} span.spe_rightBtn{right:0; background:url(static/images/arrow_right_kx_hei.svg) no-repeat center; background-size:contain} span.on{opacity:.4; cursor:pointer} /* 右侧标题内容 */ .pro_tit{/* position:absolute; top:0; right:0; */float:right; width:calc(100% - var(--img_size) - 50px)} .pro_tit>h1{font-size:24px; color:#111; line-height:34px; font-weight:bold} .pro_tit article{margin:30px 0} .pro_tit article, .pro_tit article *{font-size:15px; color:#333; line-height:26px} .pro_tit article img{max-width:100%; height:initial!important} .pro_tit>h6{font-size:20px; color:#f80000} /* tag */ .p_tag { display: -webkit-flex; display: flex; flex-wrap: wrap; } .p_tag>p { margin-right: 10px; font-size: 18px; color: #000; font-weight: bold; } .p_tag a { margin: 0 24px 14px 0; font-size: 16px; color: #666; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease } .p_tag a::before { content: ''; position: absolute; right: 0; bottom: 0; width: 0; height: 1px; background: var(--i_color); -webkit-transition: all .5s ease; transition: all .5s ease } .p_tag a:hover { color: var(--i_color); } .p_tag a:hover::before { right: initial; left: 0; width: 100%; } .pro_det_link{margin-top:54px; overflow:hidden} .pro_det_link li{width:100%} .pro_det_link a{display:block; text-align:center; font-size:24px; color:#FFF; line-height:70px; background:var(--i_color); text-transform:uppercase} /* 弹出窗口 */ #mask_bg{display:none; position:fixed; top:0%; left:0%; width:100%; height:100%; background:rgba(0,0,0,.6); z-index:9999999999998} #sc_from{display:none; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); width:800px; padding:30px 30px 40px; background:#FFF; z-index:9999999999999; overflow:auto} #sc_from .tit{margin-bottom:40px} #sc_from .tit .h1{font-size:26px; color:#333; font-weight:bold; line-height:30px} #wpforms-165{--input_font_size:15px; --input_height:38px} #wpforms-165{width:100%; margin:0 auto; padding:0} #wpforms-form-165{width:100%; overflow:hidden} /* 表单初始化 */ #wpforms-165 input, #wpforms-165 button{margin:0; padding:0; border:none; background:none} #wpforms-165 .wpforms-field{padding:0; margin:0; position:relative} #wpforms-165 .wpforms-error-container{line-height:16px} /* 输入框和按钮框架 */ #wpforms-165 .wpforms-field-container{width:100%; display:-webkit-flex; display:flex; flex-wrap:wrap; justify-content: space-between; overflow:hidden} #wpforms-165 .wpforms-submit-container{padding:0!important; width:170px; height:var(--input_height); background:var(--i_color); position:relative} /* 输入框 */ #wpforms-165 .wpforms-field-label{font-size:0} #wpforms-165 .wpforms-field{width:100%; margin-bottom:6px; padding-bottom:18px; background:transparent; overflow:hidden} #wpforms-165 .wpforms-required-label{position:absolute; top:14px; left:4px; font-size:12px; color:#F00} #wpforms-165 input{height:var(--input_height)} #wpforms-165 textarea{min-height:100px} #wpforms-165 input, #wpforms-165 textarea{width:100%; max-width:100%!important; font-size:var(--input_font_size); color:#555; box-sizing:border-box; border:1px solid rgba(0,0,0,.3); line-height:var(--input_height); padding:0 10px} #wpforms-165 input{overflow:hidden; white-space:nowrap; text-overflow:ellipsis} #wpforms-165-field_6{background:#E5E5E5!important} #wpforms-165-field_5-container,#wpforms-165-field_1-container,#wpforms-165-field_2-container,#wpforms-165-field_7-container{width: 48.5% !important;} #wpforms-165 input::-webkit-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-165 input::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-165 input::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-165 input::-ms-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-165 textarea::-webkit-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-165 textarea::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-165 textarea::-moz-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} #wpforms-165 textarea::-ms-input-placeholder{color:rgba(0,0,0,.3); font-size:var(--input_font_size)} /* 提示错误 */ #wpforms-165 #wpforms-165-field_1-error, #wpforms-165 #wpforms-165-field_2-error, #wpforms-165 #wpforms-165-field_3-error, #wpforms-165 #wpforms-165-field_5-error{position:absolute; font-size:14px} /* 按钮 */ #wpforms-165 .wpforms-submit-container button{width:100%; height:var(--input_height); font-size:16px; color:#FFF; line-height:var(--input_height); cursor:pointer; text-transform:uppercase; position:relative; z-index:2} #wpforms-165 .wpforms-submit-container img{position:absolute; top:50%; transform:translate(0,-50%); right:4px} #wpforms-165 .wpforms-submit-container:after{display:none; content:""; position:absolute; top:0; left:0; box-sizing:border-box; width:100%; height:100%; border:3px solid var(--i_color)} #wpforms-165 .wpforms-submit-container:hover:after{display:block} #wpforms-165 .wpforms-submit-container:hover{background:#FFF} #wpforms-165 .wpforms-submit-container:hover button{color:var(--i_color)} .close{position:absolute; top:30px; right:30px; display:block; width:30px; height:30px; background:url(static/images/close.png) no-repeat center; background-size:30px} .close:hover{-webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg); transform:rotate(180deg)} .close{-webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease} @media screen and (max-width:1440px){ .pro_tit>h1{font-size:22px} .pro_tit>h6{font-size:18px} .pro_det_link a{font-size:20px} } @media screen and (max-width:1366px){ .pro_details{--img_size:500px; --sm_img_box:400px} .pro_tit article, .pro_tit article *{font-size:14px} .pro_det_link{margin-top:46px} .pro_det_link a{font-size:18px; line-height:60px} } @media screen and (max-width:1200px){ .pro_details{--img_size:440px; --sm_img_box:340px} .pro_tit>h1{font-size:20px; line-height:28px} .pro_tit>h6{font-size:16px} .pro_det_link{margin-top:30px} .pro_det_link a{font-size:17px; line-height:50px} } @media screen and (max-width:959px){ .pro_details{--img_size:100%; --sm_img_box:500px} #MagnifierWrap2, .pro_tit{float:none!important; width:100%} #MagnifierWrap2{margin-bottom:30px} .MagnifierPop, .MagnifierDrag{display:none!important} .pro_tit>h1{font-size:18px} #sc_from{width:80%} } @media screen and (max-width:767px){ .pro_details{--sm_img_box:440px} .pro_tit article, .pro_tit article *{font-size:13px; line-height:20px} } @media screen and (max-width:580px){ #mask_bg{display:none!important; background:#FFF} #sc_from{width:100%; height:100%; height:100vh; box-sizing:border-box} #sc_from .tit{margin:10px auto} #sc_from .tit .h1{font-size:20px} .p_form_list{margin-bottom:0} .p_form_list li{float:none; width:100%; margin-bottom:10px} .p_form_list li, .p_form_list label, .p_form_list input{height:40px; line-height:40px} } @media screen and (max-width:560px){ .pro_details{--sm_img_box:320px} #MagnifierWrap2{margin-bottom:22px} .pro_tit>h1{font-size:16px; line-height:20px} .pro_det_link{margin-top:18px} .pro_det_link a{font-size:15px; line-height:40px} #wpforms-165 .wpforms-field{width: 100% !important;} } @media screen and (max-width:425px){ .pro_details{--sm_img_box:280px} } @media screen and (max-width:360px){ .pro_details{--sm_img_box:240px} } /* 产品详情内容 */ .pro_det_cont{margin-top:70px} .pro_det_tab_nav{margin-bottom:40px; background:#f6f6f6; position:relative} .pro_det_tab_nav:after{content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#e0e0e0} .pro_det_tab_nav ul{overflow:hidden} .pro_det_tab_nav li{float:left; cursor:pointer; box-sizing:border-box; position:relative; z-index:2} .pro_det_tab_nav li:before{content:""; position:absolute; top:0; left:0; width:0; height:3px; background:var(--i_color)} .pro_det_tab_nav li p{padding:0 40px; font-size:16px; color:#555; line-height:52px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .pro_det_tab_nav .current{background:#FFF; border-left:1px solid #DDD; border-right:1px solid #DDD} .pro_det_tab_nav .current:before{width:100%} .pro_det_tab_nav .current p{font-weight:bold; color:var(--i_color)!important} .pro_det_show{} .pro_det_show .sublist{display:none} .pro_det_show .sublist:first-child{display:block} /* 表格样式 */ .pro_det_show table{width:100%; max-width:100%; border-collapse:collapse!important; border-spacing:0!important} .pro_det_show, .pro_det_show p, .pro_det_show table, .pro_det_show table *{font-size:14px; color:#666} .pro_det_show p{margin:10px 0} .pro_det_show table tr, .pro_det_show table td{max-width:100%!important} .pro_det_show table tr, .pro_det_show table td, .pro_det_show table tr p, .pro_det_show table td p{margin:0; padding:0} .pro_det_show table tr:nth-child(even){background:rgba(0,0,0,.04)} .pro_det_show table td{padding:10px; border:1px solid var(--border_color)} /* 图片样式 */ .pro_det_show img{margin:0 2% 20px 0; width:47%; height:initial!important; box-sizing:border-box; border:1px solid var(--border_color)} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ .pro_det_cont{margin-top:40px} .pro_det_tab_nav li p{font-size:15px} } @media screen and (max-width:1080px){ .pro_det_tab_nav ul{display:-webkit-flex; display:flex; flex-wrap:nowrap} .pro_det_tab_nav li{width:100%; text-align:center} .pro_det_tab_nav li p{padding:0 10px; font-size:14px} } @media screen and (max-width:959px){ .pro_det_tab_nav{margin-bottom:30px} } @media screen and (max-width:767px){ .pro_det_cont{margin-top:30px} } @media screen and (max-width:560px){ /* .pro_det_tab_nav ul{display:block} .pro_det_tab_nav li{width:33.3%} */ .pro_det_tab_nav li p{padding:0 4px; font-size:12px} } /* 产品优势 随机几条显示 */ .pro_adv_cont{padding-left: 30px;} .pro_adv_cont li{margin: 10px 0;list-style: disc;} .pro_adv_cont li,.pro_adv_cont li p{font-size: 16px;color: #333;line-height: 24px;} /* 相关产品 */ .xg_products{margin-top:80px} .xg_products .tit{margin-bottom:60px; text-align:center; font-size:38px; color:#1E1E1E; font-weight:bold} .r_products_list{padding:0; margin:0 auto; position:relative; overflow:hidden; z-index:1} .r_products_list .swiper-wrapper{display:flex; position:relative; width:100%; z-index:1} .r_products_list .swiper-slide{ margin-bottom:0!important; display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-shrink:0; position:relative; } .r_products_list .swiper-slide a{display:block; width:100%} /* 左右箭头 */ .r_products_list .rp-button-prev, .r_products_list .rp-button-next{position:absolute; top:42%; transform:translate(0,-50%); width:50px; height:50px; background:rgba(0,0,0,.5); z-index:999; cursor:pointer; outline:none} .r_products_list .rp-button-prev:before, .r_products_list .rp-button-next:before{ position:absolute; top:50%; left:50%; font-size:30px; color:#FFF; font-family:-apple-system, 宋体, simsun, system-ui, sans-serif; letter-spacing:-2px; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); transform:translate(-50%,-50%); } .r_products_list .rp-button-prev{left:0} .r_products_list .rp-button-prev:before{content:"<"} .r_products_list .rp-button-next{right:0} .r_products_list .rp-button-next:before{content:">"} .r_products_list .rp-button-prev:hover, .r_products_list .rp-button-next:hover{background:var(--i_color)} .r_products_list .rp-button-prev:hover:before, .r_products_list .rp-button-next:hover:before{color:#FFF} .r_products_list .swiper-button-disabled{cursor:not-allowed; background:#E2E2E2!important} .r_products_list .swiper-button-disabled:before{color:#FFF!important} /* 指示器 */ .rp-pagination{display:none; text-align:center; margin:20px auto 0} .rp-pagination .swiper-pagination-bullet{width:12px; height:12px; display:inline-block; margin:0 5px; background:#E5E5E5; -webkit-border-radius:50%; -moz-border-radius:50%; -o-border-radius:50%; border-radius:50%; outline:none} .rp-pagination .swiper-pagination-bullet-active{position:relative; background:var(--i_color)} @media screen and (max-width:1440px){ .xg_products{margin-top:70px} .xg_products .tit{margin-bottom:34px; font-size:36px} } @media screen and (max-width:1366px){ .xg_products{margin-top:60px} .xg_products .tit{font-size:34px} } @media screen and (max-width:1200px){ .xg_products .tit{font-size:30px} } @media screen and (max-width:959px){ .xg_products .tit{font-size:28px} .r_products_list .rp-button-prev, .r_products_list .rp-button-next{display:none} .rp-pagination{display:block} } @media screen and (max-width:767px){ .xg_products .tit{font-size:24px} } @media screen and (max-width:560px){ .xg_products .tit{margin-bottom:24px; font-size:20px} .rp-pagination .swiper-pagination-bullet{width:10px; height:10px} } /* 内页 - 材质 石树脂 Stone resin */ .in_sr1{--bottom_height:80px} .in_sr1{position:relative; overflow:hidden} .in_sr1:after{opacity:.1; content:""; position:absolute; bottom:0; right:54%; width:300px; height:var(--bottom_height); background:url(static/images/logo.png) no-repeat center; background-size:contain} .in_sr1_cont{padding:70px 0 calc(var(--bottom_height) * 2); position:relative; overflow:hidden} .in_sr1_cont:before{content:""; position:absolute; top:0; right:0; width:52%; height:100%; background:url('https://ljcloudglobal.oss-cn-hongkong.aliyuncs.com/wp-content/uploads/liliya/2023/11/in_sr1_bg.webp') no-repeat center right; background-size:cover} .in_sr1_cont:after{content:""; position:absolute; top:0; left:0; width:80%; height:calc(100% - var(--bottom_height)); background:rgba(243,243,243,.9); -webkit-border-radius:0 0 30px 0; -moz-border-radius:0 0 30px 0; border-radius:0 0 30px 0} .in_sr1_cont>.wrap{position:relative; z-index:2} .in_sr1_text{width:76%; overflow:hidden} .in_sr1_t{overflow:hidden} .in_sr1_t h2{padding-bottom:20px; font-size:28px; color:#1E1E1E; line-height:34px; font-weight:bold; position:relative} .in_sr1_t h2:after{content:""; position:absolute; left:0; bottom:0; width:120px; height:3px; background:var(--i_color)} .in_sr1_t p{margin:24px 0 36px; font-size:15px; color:#1E1E1E; line-height:28px} .in_sr1_list{} .in_sr1_list>h4{margin-bottom:20px; font-size:24px; color:#1E1E1E; line-height:34px; font-weight:bold;} .in_sr1_list dl{width:100%; background:url('https://ljcloudglobal.oss-cn-hongkong.aliyuncs.com/wp-content/uploads/liliya/2023/11/in_sr1_list_bg.webp') no-repeat center; background-size:cover; overflow:hidden} .in_sr1_list dt{float:left; text-align:center; width:20%; height:150px; position:relative; overflow:hidden} .in_sr1_list dt p{position:absolute; top:50%; transform:translate(0,-50%); width:100%; text-align:center; box-sizing:border-box; padding:0 10px; font-size:16px; color:#FFF; line-height:24px} .in_sr1_list dt:hover{background:rgba(0,108,184,.8)} @media screen and (max-width:1440px){ .in_sr1_t h2{font-size:25px} .in_sr1_t p{font-size:14px} } @media screen and (max-width:1366px){ .in_sr1{--bottom_height:60px} .in_sr1:after{width:240px} .in_products_category_tit{margin-bottom:36px} .in_sr1_list>h4{font-size:22px} } @media screen and (max-width:1200px){ .in_sr1_cont{padding-top:50px} .in_sr1_t h2{font-size:22px} .in_sr1_t h2:after{width:110px} .in_sr1_t p{font-size:14px} .in_sr1_list>h4{font-size:20px} .in_sr1_list dt p{font-size:14px} } @media screen and (max-width:959px){ .in_sr1{--bottom_height:50px} .in_sr1_cont:after, .in_sr1_text{width:100%} .in_sr1_cont:before{width:50%} .in_sr1:after{right:52%; width:190px} .in_sr1_t h2{padding-bottom:8px; font-size:20px} .in_sr1_t h2:after{width:100px} .in_sr1_t p{margin:20px 0 26px; font-size:13px} .in_sr1_list>h4{margin-bottom:12px; font-size:17px} } @media screen and (max-width:767px){ .in_sr1_cont{padding-top:40px} .in_sr1_t h2{font-size:18px} .in_sr1_t h2:after{width:90px} .in_sr1_t p{font-size:13px; line-height:26px} .in_sr1_list dt{height:120px} .in_sr1_list dt p{font-size:12px;line-height:20px} } @media screen and (max-width:560px){ .in_sr1{--bottom_height:30px} .in_sr1:after{width:120px} .in_products_category_tit{margin-bottom:24px} .in_sr1_cont{padding-top:20px} .in_sr1_t h2{font-size:16px} .in_sr1_t h2:after{width:80px} } .in_sr2{padding:60px 0 40px; background:url('https://ljcloudglobal.oss-cn-hongkong.aliyuncs.com/wp-content/uploads/liliya/2023/11/in_sr2_bg.webp') no-repeat center; background-size:cover} .in_sr2 h4{text-align:center; margin-bottom:50px; font-size:38px; color:#1E1E1E; font-weight:bold} .in_sr2 dl{padding:10px; overflow:hidden} .in_sr2 dt{float:left; width:18.4%; height:190px; margin:0 2% 36px 0; overflow:hidden; position:relative; cursor:default} .in_sr2 dt:before{content:""; position:absolute; top:0; left:0; width:calc(100% - 4px); height:calc(100% - 4px); border:1px solid #addefe; background:#FFF; z-index:2} .in_sr2 dt:after{content:""; position:absolute; bottom:0; right:0; width:calc(100% - 4px); height:calc(100% - 4px); background:#addefe; z-index:1} .in_sr2 dt, .in_sr2 .box, .in_sr2 dt:before, .in_sr2 dt:after{box-sizing:border-box; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px} .in_sr2 dt:nth-child(5n){margin-right:0} .in_sr2 .box{position:absolute; top:50%; transform:translate(0,-50%); width:100%; box-sizing:border-box; padding:0 14px; text-align:center; z-index:3} .in_sr2 .box p{margin-bottom:10px; font-size:44px; color:#454545; font-weight:bold} .in_sr2 .box h6{font-size:18px; color:#666; height:48px; line-height:24px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2} .in_sr2 dt:hover{box-shadow:10px 10px 5px rgba(0,0,0,.05)} .in_sr2 dt:hover p{color:var(--i_color)} @media screen and (max-width:1440px){ .in_sr2 h4{margin-bottom:40px; font-size:34px} .in_sr2 dt{height:180px} .in_sr2 .box p{font-size:40px} .in_sr2 .box h6{font-size:16px} } @media screen and (max-width:1366px){ .in_sr2 h4{margin-bottom:34px; font-size:30px} .in_sr2 dt{height:160px} .in_sr2 .box p{font-size:36px} .in_sr2 .box h6{font-size:15px} } @media screen and (max-width:1200px){ .in_sr2{padding:48px 0 20px} .in_sr2 h4{font-size:26px} .in_sr2 dt{margin-bottom:26px; height:150px} .in_sr2 .box p{font-size:34px} .in_sr2 .box h6{font-size:14px; line-height:20px; height:60px; -webkit-line-clamp:3} } @media screen and (max-width:959px){ .in_sr2 h4{font-size:24px} .in_sr2 dl{padding:0} .in_sr2 .box p{font-size:30px} .in_sr2 .box h6{font-size:13px; line-height:20px; height:80px; -webkit-line-clamp:4} } @media screen and (max-width:767px){ .in_sr2 h4{margin-bottom:28px; font-size:22px} .in_sr2 dt{width:48.5%; height:120px; margin:0 3% 20px 0} .in_sr2 dt:nth-child(5n){margin-right:3%} .in_sr2 dt:nth-child(2n){margin-right:0} .in_sr2 .box p{margin-bottom:6px; font-size:28px} .in_sr2 .box h6{height:40px; -webkit-line-clamp:2} } @media screen and (max-width:560px){ .in_sr2{padding:38px 0 16px} .in_sr2 h4{margin-bottom:24px; font-size:20px} .in_sr2 .box p{margin-bottom:4px; font-size:24px} .in_sr2 .box h6{font-size:12px; height:40px; -webkit-line-clamp:2} } .in_sr3{} .in_sr3_cont{overflow:hidden} .in_sr3_cont dt{margin-bottom:60px} .in_sr3_t1{padding:34px 0; position:relative; overflow:hidden} .in_sr3_t1 .img{position:absolute; top:0; left:0; width:48%; height:100%} .in_sr3_t1 .img img{width:100%; height:100%; object-fit:cover} .in_sr3_t1 .wrap{} .in_sr3_t1 article{float:right; box-sizing:border-box; padding:40px; background:#F4F4F4; position:relative; width:60%} .in_sr3_t1 article:after{content:""; position:absolute; top:0; right:-100%; width:100%; height:100%; background:#F4F4F4} .in_sr3_txt{font-size:17px; color:#1E1E1E; line-height:26px} .in_sr3_t2{padding:70px 0; position:relative; overflow:hidden} .in_sr3_t2:after{content:""; position:absolute; left:0; bottom:0; width:52%; height:100%; background:#F4F4F4; z-index:-1} .in_sr3_t2 article{float:left; box-sizing:border-box; position:relative; width:49%} .in_sr3_t2 .img{position:absolute; top:0; right:0; width:48%; height:100%} .in_sr3_t2 .img img{width:100%; height:100%; object-fit:cover} .in_sr3_t3{margin-bottom:0!important} .in_sr3_t3{padding-top:200px; position:relative; overflow:hidden} .in_sr3_t3 .img{position:absolute; top:0; left:0; width:100%; height:100%} .in_sr3_t3 .img img{width:100%; height:100%; object-fit:cover} .in_sr3_t3 article{float:right; box-sizing:border-box; padding:40px; background:#F4F4F4; position:relative; width:60%} .in_sr3_t3 article:after{content:""; position:absolute; top:0; right:-100%; width:100%; height:100%; background:#F4F4F4} @media screen and (max-width:1440px){ .in_sr3_txt{font-size:15px} } @media screen and (max-width:1366px){ .in_sr3_cont dt{margin-bottom:40px} .in_sr3_txt{font-size:13px} .in_sr3_t2{padding:50px 0} .in_sr3_t1 article{padding:30px} .in_sr3_t3 article{padding:30px} } @media screen and (max-width:1200px){ .in_sr3_cont dt{margin-bottom:30px} .in_sr3_txt{font-size:12px} .in_sr3_t2{padding:40px 0} } @media screen and (max-width:959px){ .in_sr3_cont dt{margin-bottom:14px} .in_sr3_txt{line-height:22px} .in_sr3_t1 .img{opacity:.05; width:100%} .in_sr3_t1 article{padding:0; width:100%; background:none} .in_sr3_t1 article:after{display:none} .in_sr3_t2 .img{opacity:.08; width:100%} .in_sr3_t2 article{width:100%; background:none; z-index:2} .in_sr3_t2:after{display:none} .in_sr3_t3{padding:30px 0} .in_sr3_t3 .img{opacity:.08} .in_sr3_t3 article{padding:0 0; width:100%; background:none} .in_sr3_t3 article:after{display:none} } @media screen and (max-width:767px){ .in_sr3_cont dt{padding:20px 0} } @media screen and (max-width:560px){ } /* 关于我们 */ .in_ab_nav_list{border-bottom:1px solid var(--border_color)} .in_ab_nav_list ul{display:-webkit-flex; display:flex; justify-content:center; flex-wrap:nowrap; overflow:hidden} .in_ab_nav_list li{margin:0 30px; position:relative} .in_ab_nav_list li:before, .in_ab_nav_list li:after{content:""; position:absolute; bottom:0; width:0; height:2px; background:var(--i_color)} .in_ab_nav_list li:before{right:50%} .in_ab_nav_list li:after{left:50%} .in_ab_nav_list li:hover:before, .in_ab_nav_list li:hover:after{width:50%} .in_ab_nav_list li:before, .in_ab_nav_list li:after{-webkit-transition:all .5s ease; -moz-transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease} .in_ab_nav_list .current-menu-item:before, .in_ab_nav_list .current-menu-item:after{width:50%} .in_ab_nav_list li a{display:block; font-size:18px; color:#595959; font-weight:bold; line-height:80px} .in_ab_nav_list li:hover a, .in_ab_nav_list .current-menu-item a{color:var(--i_color)!important} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ .in_ab_nav_list li{margin:0 24px} .in_ab_nav_list li a{font-size:17px; line-height:70px} } @media screen and (max-width:1200px){ .in_ab_nav_list li{margin:0 20px} .in_ab_nav_list li a{font-size:16px; line-height:64px} } @media screen and (max-width:959px){ .in_ab_nav_list li{margin:0 16px} .in_ab_nav_list li a{font-size:15px; line-height:60px} } @media screen and (max-width:767px){ .in_ab_nav_list li{padding:12px 0; width:33.3%; margin:0 0; text-align:center} .in_ab_nav_list li a{font-size:14px; line-height:20px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2} } @media screen and (max-width:560px){ .in_ab_nav_list li a{font-size:13px} } /* 关于我们 文字内容 统一样式 */ .in_about_text{} .in_about_text h4{font-size:32px; color:var(--i_color); font-weight:bold; position:relative} .in_about_cont1 .in_about_text h4{padding-bottom:22px} .in_about_cont1 .in_about_text h4:after{content:""; position:absolute; left:0; bottom:0; width:62px; height:3px; background:#898989} .in_about_text p{margin:36px 0; font-size:16px; color:#6A6A6A; line-height:28px} .in_ab_more{display:inline-block; padding:0 30px; line-height:34px; border:1px solid #333; font-size:18px; color:#333; text-transform:uppercase; -webkit-border-radius:100px; -moz-border-radius:100px; border-radius:100px} .in_ab_more:hover, .in_ab_more.bg{background:#333; color:#FFF!important} @media screen and (max-width:1440px){ .in_about_text h4{font-size:30px} } @media screen and (max-width:1366px){ .in_about_text h4{font-size:26px} .in_about_cont1 .in_about_text h4{padding-bottom:16px} .in_about_text p{font-size:15px; margin:30px 0} } @media screen and (max-width:1200px){ .in_about_text h4{font-size:22px} .in_about_cont1 .in_about_text h4{padding-bottom:12px} .in_about_text p{font-size:14px; margin:24px 0} .in_ab_more{font-size:16px; padding:0 26px; line-height:30px} } @media screen and (max-width:959px){ .in_about_text h4{font-size:20px} .in_about_cont1 .in_about_text h4{padding-bottom:8px} .in_about_text p{margin:20px 0; font-size:13px} .in_ab_more{font-size:15px; padding:0 22px} } @media screen and (max-width:767px){ .in_about_text h4{font-size:18px} .in_about_text p{margin:14px 0} .in_ab_more{font-size:14px; padding:0 20px} } @media screen and (max-width:560px){ .in_about_text p{margin:10px 0; font-size:12px; line-height:24px} .in_ab_more{font-size:13px; line-height:26px} } .in_about_cont1{--pic_width:48%} .in_about_cont1{width:100%; overflow:hidden} .in_about_l{float:left; width:calc(100% - var(--pic_width) - 4%)} .in_about_r{padding-bottom:50px; float:right; width:var(--pic_width); position:relative} .in_about_r:before{content:""; position:absolute; right:-60%; bottom:0; width:120%; height:70%; background:#afcfe6} .in_about_r .img{width:100%; position:relative} .in_about_r .img img{width:100%; height:initial!important} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ } @media screen and (max-width:959px){ .in_about_l, .in_about_r{float:none!important; width:100%} .in_about_l{margin-bottom:30px} .in_about_r{padding-bottom:30px} } @media screen and (max-width:767px){ .in_about_l{margin-bottom:20px} } @media screen and (max-width:560px){ } .in_about_cont2{padding:60px 0 40px; position:relative; overflow:hidden} .in_about_cont2 .img{position:absolute; top:0; left:0; width:52%; height:100%} .in_about_cont2 .img img{width:100%; height:100%; object-fit:cover} .in_about_cont2 .in_about_text{float:right; box-sizing:border-box; padding:40px; background:#F4F4F4; position:relative; width:72%} .in_about_cont2 .in_about_text:after{content:""; position:absolute; top:0; right:-100%; width:100%; height:100%; background:#F4F4F4} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ .in_about_cont2 .img{width:60%} .in_about_cont2{padding:40px 0 30px} .in_about_cont2 .in_about_text{width:76%} } @media screen and (max-width:1200px){ .in_about_cont2 .img{width:64%} .in_about_cont2 .in_about_text{width:82%} } @media screen and (max-width:959px){ /* .in_about_cont2{padding:0 0} */ .in_about_cont2 .img{opacity:.08; width:100%} .in_about_cont2 .in_about_text{padding:0 0; width:100%; background:none} .in_about_cont2 .in_about_text:after{display:none} } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ } .in_about_cont3{padding-top:140px; position:relative} .in_about_cont3 .img{position:absolute; top:0; left:0; width:100%; height:100%} .in_about_cont3 .img img{width:100%; height:100%; object-fit:cover} .in_about_cont3 .in_about_text{box-sizing:border-box; padding:50px 50px 80px 0; background:#F4F4F4; position:relative; width:52%} .in_about_cont3 .in_about_text:after{content:""; position:absolute; top:0; left:-100%; width:100%; height:100%; background:#F4F4F4} @media screen and (max-width:1440px){ .in_about_cont3{padding-top:120px} } @media screen and (max-width:1366px){ .in_about_cont3{padding-top:100px} .in_about_cont3 .in_about_text{width:60%; padding:40px 40px 70px 0} } @media screen and (max-width:1200px){ .in_about_cont3{padding-top:60px} .in_about_cont3 .in_about_text{width:65%} } @media screen and (max-width:959px){ .in_about_cont3{padding:0 0} .in_about_cont3 .img{opacity:.08} .in_about_cont3 .in_about_text{width:100%; padding:40px 0; background:none} .in_about_cont3 .in_about_text:after{display:none} } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ } .in_about_cont4{margin-bottom:100px} .in_about_cont4 dt{position:relative; overflow:hidden} .in_about_cont4 .img{position:absolute; top:0; height:100%} .in_about_cont4 .img img{width:100%; height:100%; object-fit:cover} .in_about_cont4 dt:nth-child(odd) .img{left:0; width:44%} .in_about_cont4 dt:nth-child(even) .img{right:0; width:56%} .in_about_cont4 dt:nth-child(odd) .in_about_text{float:right; padding:10px 0 50px; width:53%} .in_about_cont4 dt:nth-child(even) .in_about_text{padding:40px 0 50px; width:38%} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ } @media screen and (max-width:1200px){ } @media screen and (max-width:959px){ .in_about_cont4{margin-bottom:80px} .in_about_cont4 dt{margin-bottom:40px} .in_about_cont4 .img{opacity:.08; width:100%!important} .in_about_cont4 .in_about_text{width:100%!important; padding:30px 0!important; position:relative; z-index:2} } @media screen and (max-width:767px){ } @media screen and (max-width:560px){ } /* 优势 */ .in_adv{--ico_size:94px} .in_adv{padding:100px 0 50px; background:#FAFAFA} .in_adv_list{overflow:hidden} .in_adv_list dt{float:left; text-align:center; width:27%; margin:0 9.5% 60px 0; box-sizing:border-box; border:1px solid var(--border_color); position:relative; cursor:pointer; overflow:hidden} .in_adv_list dt:nth-child(3n){margin-right:0} .in_adv_list dt:after{content:""; display:block; padding-bottom:86%} .in_adv_list dt:before{display:none; content:""; position:absolute; top:0; left:0; width:100%; height:100%} .in_adv_list dt:nth-child(1):before{background:url(static/images/in_adv_list_bg1.jpg) no-repeat center; background-size:cover} .in_adv_list dt:nth-child(2):before{background:url(static/images/in_adv_list_bg2.jpg) no-repeat center; background-size:cover} .in_adv_list dt:nth-child(3):before{background:url(static/images/in_adv_list_bg3.jpg) no-repeat center; background-size:cover} .in_adv_list dt:nth-child(4):before{background:url(static/images/in_adv_list_bg4.jpg) no-repeat center; background-size:cover} .in_adv_list dt:nth-child(5):before{background:url(static/images/in_adv_list_bg5.jpg) no-repeat center; background-size:cover} .in_adv_list dt:nth-child(6):before{background:url(static/images/in_adv_list_bg6.jpg) no-repeat center; background-size:cover} .in_adv_list dt i{opacity:0; position:absolute; left:50%; transform:translate(-50%,-50%); top:50%; font-size:42px; color:#FFF; font-weight:bold} .in_adv_list dt .ico{position:absolute; left:50%; transform:translate(-50%,-50%); top:30%} .in_adv_list dt img{width:var(--ico_size); height:var(--ico_size); object-fit:contain} .in_adv_list dt h2{position:absolute; left:50%; transform:translate(-50%,0); top:48%; width:100%; box-sizing:border-box; padding:0 14px; font-size:26px; color:#1e1e1e; font-weight:bold} .in_adv_list dt h2:after{content:""; position:absolute; left:50%; transform:translate(-50%,0); bottom:-10px; width:90px; height:2px; background:var(--i_color)} .in_adv_list dt h6{opacity:1; position:absolute; left:50%; transform:translate(-50%,50%); bottom:24%; width:100%; box-sizing:border-box; padding:0 14px; font-size:16px; color:#454545; height:72px; line-height:24px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3} .in_adv_list dt:hover:before{display:block} .in_adv_list dt:hover i{opacity:1; top:26%} .in_adv_list dt:hover .ico{top:50%} .in_adv_list dt:hover img{filter:brightness(100); -webkit-filter:brightness(100); -moz-filter:brightness(100); -o-filter:brightness(100); -ms-filter:brightness(100)} .in_adv_list dt:hover h2{top:68%; color:#FFF} .in_adv_list dt:hover h2:after{background:#FFF} .in_adv_list dt:hover h6{opacity:0} .in_adv_list dt i, .in_adv_list dt .ico, .in_adv_list dt h2, .in_adv_list dt h6{-webkit-transition:all .5s ease; -moz-transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease} @media screen and (max-width:1440px){ .in_adv{--ico_size:86px} .in_adv{padding:80px 0 40px} .in_adv_list dt i{font-size:40px} .in_adv_list dt h2{font-size:22px} .in_adv_list dt h6{font-size:15px} } @media screen and (max-width:1366px){ .in_adv{--ico_size:80px} .in_adv_list dt{width:28.66%; margin:0 7% 50px 0} .in_adv_list dt i{font-size:38px} .in_adv_list dt h2{font-size:20px} .in_adv_list dt h2:after{width:80px} .in_adv_list dt h6{font-size:14px} } @media screen and (max-width:1200px){ .in_adv{--ico_size:70px} .in_adv{padding:70px 0 30px} .in_adv_list dt i{font-size:34px} .in_adv_list dt h2{font-size:19px} .in_adv_list dt h2:after{width:70px} .in_adv_list dt h6{font-size:13px} } @media screen and (max-width:1080px){ .in_adv{--ico_size:62px} .in_adv_list dt i{font-size:32px} .in_adv_list dt h2{font-size:18px} .in_adv_list dt h2:after{width:60px} .in_adv_list dt h6{font-size:12px; height:60px; line-height:20px} } @media screen and (max-width:959px){ .in_adv{--ico_size:50px} .in_adv{padding:52px 0 30px} .in_adv_list dt{width:30.66%; margin:0 4% 30px 0} .in_adv_list dt .ico{top:26%} .in_adv_list dt i{font-size:28px} .in_adv_list dt h2{top:42%; font-size:16px} .in_adv_list dt h2:after{width:50px} } @media screen and (max-width:767px){ .in_adv{--ico_size:40px} .in_adv_list dt .ico{top:20%} .in_adv_list dt i{font-size:26px} .in_adv_list dt h2{top:38%; font-size:14px} .in_adv_list dt h2:after{width:40px} .in_adv_list dt h6{bottom:22%} } @media screen and (max-width:560px){ .in_adv{--ico_size:34px} .in_adv{padding:40px 0 20px} .in_adv_list dt{width:48.5%; margin:0 3% 30px 0} .in_adv_list dt:nth-child(3n){margin-right:3%} .in_adv_list dt:nth-child(2n){margin-right:0} .in_adv_list dt i{font-size:24px} .in_adv_list dt h2{font-size:13px} .in_adv_list dt h2:after{width:30px} .in_adv_list dt h6{height:48px; line-height:16px} } /* 历史 */ .in_history{--ico_size:50px} .in_history{background:url(static/images/in_history_bg.jpg) no-repeat center; background-size:cover} .in_history *{-webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-user-select: none;-moz-user-focus: none;-moz-user-select: none;} .in_history_list{margin-bottom:40px; padding-top:110px; overflow:hidden} .in_history_nav{width:100%; margin-bottom:60px; cursor:pointer; position:relative} .in_history_nav:before{content:""; position:absolute; top:50%; transform:translate(0,-50%); left:0; width:100%; height:6px; background:#343434} .in_history_nav .swiper-wrapper{position:relative; width:100%; height:100%; z-index:1; display:flex} .in_history_nav .swiper-slide{text-align:center; flex-shrink:0; position:relative} .in_history_nav .swiper-slide h2{ display:none; position:absolute; bottom:60px; left:50%; transform:translate(-50%,0); font-size:180px; line-height:180px; background-image:-webkit-linear-gradient(top, rgba(0,0,0,.1), rgba(0,0,0,0)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; color:transparent; } .in_history_nav .swiper-slide-active h2{display:block} .in_history_nav .num_box{height:140px; position:relative} .in_history_nav .num_box:before{opacity:0; content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:36px; height:36px; background:var(--i_color); -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; -webkit-animation:dot 1.6s infinite ease; animation:dot 1.6s infinite ease; z-index:-2} .in_history_nav .num_box:after{content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:20px; height:20px; background:var(--i_color); -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; z-index:-1} .in_history_nav .swiper-slide-active .num_box{background:url(static/images/in_history_on_bg.png) no-repeat center; background-size:contain} .in_history_nav .swiper-slide:hover .num_box:before{opacity:.3} .in_history_nav .num_box:before{-webkit-transition:all .5s ease; -moz-transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease} .in_history_nav .swiper-slide-active:after{content:""; opacity:.3; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; background:url(static/images/in_history_on_bg.png) no-repeat center; background-size:contain; z-index:-1; -webkit-animation:rotate 2.25s linear infinite forwards; animation:rotate 2.25s linear infinite forwards} @keyframes rotate { 0% { transform:translate(-50%,-50%) rotate(0); } 100% { transform:translate(-50%,-50%) rotate(360deg); } } @keyframes dot { 0% { width: 20px; height: 20px; } 50% { width: 36px; height: 36px; } 100% { width: 20px; height: 20px; } } .in_history_nav .swiper-slide h6{position:absolute; left:50%; transform:translate(-50%,0); bottom:110px; font-size:28px; color:#1E1E1E; line-height:30px} .in_history_nav .swiper-slide-active h6{bottom:50%!important; transform:translate(-50%,50%)!important; font-size:40px; color:#FFF; font-weight:bold; line-height:40px} .in_history_nav .swiper-slide-next h6, .in_history_nav .swiper-slide-prev h6{bottom:0!important} /* 左右箭头 */ .in_history_list .history-button-prev, .in_history_list .history-button-next{ position:absolute; top:50%; transform:translate(0,-50%); width:46px; height:46px; z-index:999; outline:none; cursor:pointer; -moz-user-select:none; /*火狐*/ -webkit-user-select:none; /*webkit浏览器*/ -ms-user-select:none; /*IE10*/ -khtml-user-select:none; /*早期浏览器*/ user-select:none; -webkit-border-radius:200px; -moz-border-radius:200px; border-radius:200px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; } .in_history_list .history-button-prev{left:0; background:#bae3ff url(static/images/arrow_left_kx_hei.svg) no-repeat center; background-size:24px} .in_history_list .history-button-next{right:0; background:#bae3ff url(static/images/arrow_right_kx_hei.svg) no-repeat center; background-size:24px} .in_history_list .swiper-button-disabled{cursor:not-allowed} .in_history_show{width:100%; position:relative} .in_history_show .swiper-wrapper{position:relative; width:100%; height:100%; z-index:1; cursor:pointer; display:flex} .in_history_show .swiper-slide{flex-shrink:0; text-align:center; position:relative} .in_history_show .swiper-slide p{text-align:center; font-size:22px; color:#454444; line-height:28px} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ .in_history_nav .swiper-slide h2{font-size:160px; line-height:160px} .in_history_nav .swiper-slide h6{font-size:26px} .in_history_nav .swiper-slide-active h6{font-size:38px} } @media screen and (max-width:1200px){ .in_history_list{padding-top:70px} .in_history_nav .swiper-slide h2{font-size:140px; line-height:140px} .in_history_nav .swiper-slide h6{font-size:24px} .in_history_nav .swiper-slide-active h6{font-size:36px} .in_history_show .swiper-slide p{font-size:20px} } @media screen and (max-width:959px){ .in_history_list{padding-top:60px} .in_history_nav{margin-bottom:50px} .in_history_nav:before{height:4px} .in_history_nav .num_box{height:120px} .in_history_nav .num_box:after{width:18px; height:18px} .in_history_nav .swiper-slide h2{font-size:110px; line-height:110px} .in_history_nav .swiper-slide h6{bottom:90px; font-size:22px} .in_history_nav .swiper-slide-active h6{font-size:28px} .in_history_show .swiper-slide p{font-size:18px} .in_history_list .history-button-prev, .in_history_list .history-button-next{width:36px; height:36px; background-size:18px} } @media screen and (max-width:767px){ .in_history_list{margin-bottom:30px} .in_history_nav{margin-bottom:40px} .in_history_nav .num_box:before{display:none} .in_history_nav .num_box:after{width:16px; height:16px} .in_history_nav .swiper-slide h6{font-size:20px} .in_history_nav .swiper-slide-active h6{font-size:26px} .in_history_show .swiper-slide p{font-size:16px} } @media screen and (max-width:560px){ .in_history_list{margin-bottom:20px} .in_history_nav .num_box{height:90px} .in_history_nav .swiper-slide h2{font-size:70px; line-height:70px} .in_history_nav .swiper-slide h6{bottom:60px; font-size:14px} .in_history_nav .swiper-slide-active h6{font-size:24px} .in_history_show .swiper-slide p{font-size:14px} .in_history_list .history-button-prev, .in_history_list .history-button-next{width:26px; height:26px; background-size:14px} } .in_honor{background:url(static/images/in_honor_bg.webp) no-repeat bottom center; background-size:cover} .in_honor_cont{box-sizing:border-box; box-shadow:0 0 10px rgba(0,0,0,.06); border:1px solid var(--border_color); background:#FFF} .in_honor_nav{} .in_honor_nav ul{display:-webkit-flex; display:flex; flex-wrap:nowrap; background:#ececec} .in_honor_nav li{width:100%; text-align:center; position:relative; cursor:pointer} .in_honor_nav li a{font-size:20px; color:#1E1E1E; line-height:56px} .in_honor_nav .current{background:#FFF} .in_honor_nav .current:before{content:""; position:absolute; left:0; top:0; width:100%; height:2px; background:var(--i_color)} .in_honor_nav .current a{color:var(--i_color)!important} .in_honor_show{padding:70px 50px} .in_honor_show .sublist{display:none} .in_honor_show .sublist:first-child{display:block} .in_honor_list{padding:0; margin:0 auto; position:relative; overflow:hidden; z-index:1} .in_honor_list .swiper-wrapper{display:flex; position:relative; width:100%; z-index:1} .in_honor_list .swiper-slide{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-shrink:0; position:relative; cursor:pointer; } .in_honor_list .img{display:block; width:100%; box-sizing:border-box; position:relative; overflow:hidden} .in_honor_list .img:before{content:""; display:block; padding-bottom:141.6%} .in_honor_list .img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} .in_honor_list .border{display:none; position:absolute; background:var(--i_color); z-index:2} .in_honor_list .border1{top:0; left:0; width:100%; height:4px} .in_honor_list .border2{top:0; right:0; width:4px; height:100%} .in_honor_list .border3{bottom:0; left:0; width:100%; height:4px} .in_honor_list .border4{top:0; left:0; width:4px; height:100%} .in_honor_list .swiper-slide:hover .border{display:block} /* 指示器 */ .h-pagination{display:block; text-align:center; margin:40px auto 0} .h-pagination .swiper-pagination-bullet{width:8px; height:8px; display:inline-block; margin:0 5px; background:#E5E5E5; -webkit-border-radius:50%; -moz-border-radius:50%; -o-border-radius:50%; border-radius:50%; outline:none} .h-pagination .swiper-pagination-bullet-active{position:relative; width:40px; height:8px; -webkit-border-radius:100px; -moz-border-radius:100px; -o-border-radius:100px; border-radius:100px; background:var(--i_color)} @media screen and (max-width:1440px){ } @media screen and (max-width:1366px){ .in_honor_nav li a{font-size:18px} .in_honor_show{padding:60px 50px} } @media screen and (max-width:1200px){ .in_honor_nav li a{font-size:16px} .in_honor_show{padding:50px 50px} } @media screen and (max-width:959px){ .in_honor_nav li a{line-height:48px} .in_honor_show{padding:40px 40px} .h-pagination{margin:30px auto 0} } @media screen and (max-width:767px){ .in_honor_nav li a{font-size:15px} .in_honor_show{padding:30px 30px} } @media screen and (max-width:560px){ .in_honor_nav li a{font-size:13px; line-height:40px} .in_honor_show{padding:20px 20px} .h-pagination{margin:20px auto 0} .h-pagination .swiper-pagination-bullet{width:6px; height:6px; margin:0 3px} .h-pagination .swiper-pagination-bullet-active{width:30px} } .in_factory{--sm_pic_width:20%} .in_factory_cont{background:#FFF; box-shadow:0 0 10px rgba(0,0,0,.2); position:relative; overflow:hidden} .in_factory_cont:before{content:""; display:block; padding-bottom:43.7%} /* 左侧展示大图 */ .in_factory_show_box{position:absolute; top:0; left:0; width:calc(100% - var(--sm_pic_width)); height:100%; box-sizing:border-box; padding:20px 20px; margin:0 auto} .in_factory_show{width:100%; height:100%; position:relative; overflow:hidden} .in_factory_show .swiper-wrapper{display:flex; position:relative; width:100%; height:100%; z-index:1} .in_factory_show .swiper-slide{ height:100%; display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; flex-shrink:0; position:relative; cursor:pointer; } .in_factory_show .img{width:100%; height:100%; position:relative; overflow:hidden} .in_factory_show .img img{width:100%; height:100%; object-fit:cover} .in_factory_show .txt{position:absolute; left:0; bottom:0; width:100%; background:rgba(0,0,0,.5)} .in_factory_show .txt p{padding:0 40px; font-size:16px; color:#FFF; line-height:50px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} /* 指示器 */ .infactory-pagination{display:none; margin:16px auto 0} .infactory-pagination .swiper-pagination-bullet{width:8px; height:8px; display:inline-block; margin:0 4px; background:#E5E5E5; -webkit-border-radius:50%; -moz-border-radius:50%; -o-border-radius:50%; border-radius:50%; outline:none} .infactory-pagination .swiper-pagination-bullet-active{position:relative; background:var(--i_color)} /* 右侧缩略图列表 */ .in_factory_list_box{position:absolute; top:0; right:0; width:var(--sm_pic_width); height:100%; box-sizing:border-box; border-left:1px solid var(--border_color); padding:40px 20px} .in_factory_list{height:100%; overflow:hidden} .in_factory_list .swiper-slide{cursor:pointer} .in_factory_list .img{width:100%; height:100%; background:#000; position:relative; overflow:hidden} .in_factory_list .img img{opacity:.3; width:100%; height:100%; object-fit:cover} .in_factory_list .swiper-slide-thumb-active img{opacity:1} .in_factory_list .txt{display:none!important} /* 左右箭头 */ .infactory-button-prev, .infactory-button-next{ opacity:.3; position:absolute; left:50%; transform:translate(-50%,0); width:60px; height:30px; background:#000; z-index:999; outline:none; cursor:pointer; -moz-user-select:none; -webkit-user-select:none; -ms-user-select:none; -khtml-user-select:none; user-select:none; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; } .infactory-button-prev{top:4px; background:url(static/images/arrow_up_kx_hei.svg) no-repeat center; background-size:contain} .infactory-button-next{bottom:4px; background:url(static/images/arrow_down_kx_hei.svg) no-repeat center; background-size:contain} .infactory-button-prev.swiper-button-disabled, .infactory-button-next.swiper-button-disabled{cursor:not-allowed; opacity:.06} @media screen and (max-width:1366px){ .in_factory_show .txt p{padding:0 30px; font-size:15px; line-height:46px} } @media screen and (max-width:1200px){ .in_factory_show .txt p{padding:0 20px; font-size:14px; line-height:42px} } @media screen and (max-width:959px){ } @media screen and (max-width:767px){ .in_factory_cont:before{padding-bottom:60%!important} .in_factory_show_box{width:100%!important; padding:14px 14px 40px} .infactory-pagination{display:-webkit-flex; display:flex; justify-content:center; flex-wrap:nowrap} .in_factory_list_box{display:none} } @media screen and (max-width:560px){ .in_factory_show .txt p{font-size:13px; line-height:34px} } /* 新闻 */ .in_news{} .in_news_list{padding:10px; overflow:hidden} .in_news_list li{float:left; width:30%; margin:0 5% 66px 0; border-bottom:1px solid var(--border_color)} .in_news_list li:nth-child(3n){margin-right:0} .in_news_list li a{display:block; padding:34px 24px 50px; background:#FFF} .in_news_list .n_time{margin-bottom:16px; font-size:20px; color:#909090} .in_news_list .n_time i{margin-right:6px; font-size:32px; color:#1E1E1E} .in_news_list .img{width:100%; position:relative; overflow:hidden} .in_news_list .img:before{content:""; display:block; padding-bottom:70%} .in_news_list .img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} .in_news_list .txt{margin:30px auto} .in_news_list .txt h4{font-size:20px; color:#1E1E1E; font-weight:bold; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1} .in_news_list .txt .h6{margin-top:8px; font-size:15px; color:#838383; line-height:20px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2} .in_news_list .n_more{display:inline-block; position:relative} .in_news_list .n_more:before, .in_news_list .n_more:after{content:""; position:absolute; bottom:0; width:50%; height:2px} .in_news_list .n_more:before{left:0; background:var(--i_color)} .in_news_list .n_more:after{right:0; background:#333} .in_news_list .n_more p{padding-right:34px; font-size:14px; color:#333; line-height:30px; background:url(static/images/arrow_right_news.svg) no-repeat right center; background-size:24px} @media screen and (min-width:960px){ .in_news_list li:hover{border-bottom-color:transparent} .in_news_list li:hover a{box-shadow:0 0 10px rgba(0,0,0,.2)} .in_news_list li:hover h2{color:var(--i_color)} } @media screen and (max-width:1440px){ .in_news_list li{width:30.66%; margin:0 4% 50px 0} .in_news_list .n_time{font-size:19px} .in_news_list .n_time i{font-size:30px} .in_news_list .txt h4{font-size:19px} .in_news_list .txt .h6{font-size:14px} } @media screen and (max-width:1366px){ .in_news_list .n_time{font-size:18px} .in_news_list .n_time i{font-size:28px} .in_news_list .txt h4{font-size:18px} .in_news_list .txt .h6{font-size:13px} } @media screen and (max-width:1200px){ .in_news_list .n_time{font-size:17px} .in_news_list .n_time i{font-size:26px} .in_news_list .txt{margin:24px auto} .in_news_list .txt h4{font-size:17px} .in_news_list .txt .h6{font-size:12px} .in_news_list .n_more p{font-size:13px} } @media screen and (max-width:959px){ .in_news_list li{border-bottom:none} .in_news_list li a{padding:0} .in_news_list .n_time{font-size:16px} .in_news_list .n_time i{font-size:24px} .in_news_list .txt{margin:18px auto 24px} .in_news_list .txt h4{font-size:16px; -webkit-line-clamp:2} .in_news_list .n_more p{font-size:12px} } @media screen and (max-width:767px){ .in_news_list li{width:47.5%; margin:0 5% 50px 0} .in_news_list li:nth-child(3n){margin-right:5%} .in_news_list li:nth-child(2n){margin-right:0} .in_news_list .n_time{font-size:15px} .in_news_list .n_time i{font-size:22px} .in_news_list .txt{margin:14px auto 10px} .in_news_list .txt h4{font-size:15px} .in_news_list .txt .h6{line-height:18px} } @media screen and (max-width:560px){ .in_news_list li{margin-bottom:40px} .in_news_list .n_time{margin-bottom:10px; font-size:13px} .in_news_list .n_time i{font-size:18px} .in_news_list .txt{margin:14px auto 10px} .in_news_list .txt h4{font-size:14px} } /* 页数 */ .in_page_box{text-align:center; overflow:hidden} .in_page{display:inline-block} .in_page a{float:left; display:block; margin:0 4px; padding:0 12px; line-height:30px; font-size:14px; color:#666; -webkit-border-radius:100px; -moz-border-radius:100px; border-radius:100px; border:1px solid #CCC} .in_page a:hover, .in_page .current{border-color:var(--i_color)!important; background:var(--i_color); color:#FFF!important} /* 新闻详情页 */ .in_news_art{box-sizing:border-box; padding:0 10%; margin:70px auto 100px} .in_news_art_tit{margin-bottom:30px; text-align:center} .in_news_art_tit h1{font-size:30px; color:#222; line-height:36px; font-weight:bold} .in_news_art_tit p{margin-top:20px; font-size:15px; color:#777; background:#EEE; line-height:28px} .in_news_art article, .in_news_art article *{text-align:left; font-family:Arial, system-ui, -apple-system, Microsoft Yahei, tahoma, sans-serif!important; font-size:18px; color:#666; line-height:34px} .in_news_art article img{display:block; margin:20px auto; max-width:100%!important; height:initial!important} /* 最新6条新闻 */ .n_news{margin-top:60px; box-sizing:border-box; padding:24px 20px; border:1px solid var(--border_color); overflow:hidden} .n_news p{margin-bottom:14px; font-size:18px; color:#000; font-weight:bold} .n_news_list{overflow:hidden} .n_news_list li{position:relative; overflow:hidden} .n_news_list a{} .n_news_list h4{float:left; box-sizing:border-box; padding-left:14px; max-width:86%; font-size:15px; color:#555; position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .n_news_list h4:before{content:""; position:absolute; top:50%; transform:translate(0,-50%); left:0; width:4px; height:4px; background:#AAA; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;} .n_news_list i{float:right; font-size:14px; color:#999} .n_news_list h4, .n_news_list i{line-height:30px} .n_news_list li:hover h4{color:var(--i_color)} @media screen and (max-width:1440px){ .in_news_art{margin:50px auto 100px} } @media screen and (max-width:1366px){ .in_news_art{padding:0 5%; margin:40px auto 90px} .in_news_art_tit h1{font-size:26px} .in_news_art article, .in_news_art article *{font-size:16px; line-height:30px} } @media screen and (max-width:1200px){ .in_news_art{margin:30px auto 80px} .in_news_art_tit h1{font-size:24px; line-height:30px} .in_news_art article, .in_news_art article *{font-size:15px; line-height:28px} .n_news_list h4{font-size:14px} .n_news_list i{font-size:13px} } @media screen and (max-width:959px){ .in_news_art{padding:0 0} .in_news_art_tit h1{font-size:20px} .in_news_art article, .in_news_art article *{font-size:15px; line-height:30px} } @media screen and (max-width:767px){ .in_news_art_tit{margin-bottom:20px} .in_news_art_tit h1{font-size:18px; line-height:26px} .in_news_art_tit p{margin-top:16px} .n_news p{font-size:16px} .n_news_list h4{max-width:80%; font-size:13px} .n_news_list i{font-size:12px} .n_news_list h4, .n_news_list i{line-height:28px} } @media screen and (max-width:560px){ .in_news_art{margin:20px auto 70px} .in_news_art_tit h1{font-size:16px; line-height:24px} .n_news{padding:20px 20px 10px} .n_news p{font-size:15px} .n_news_list li{margin-bottom:14px} .n_news_list h4{margin-bottom:2px; padding-left:0; font-size:13px; white-space:normal} .n_news_list h4:before{display:none} .n_news_list i{font-size:12px} .n_news_list h4, .n_news_list i{float:none; max-width:100%; line-height:18px} } /* 联系我们 */ .in_contact{} /* .contact_footer .footer_form{display:none!important} */ .in_contact_cont{padding:10px; overflow:hidden; display:flex; display:-webkit-flex; justify-content:space-between; flex-wrap:wrap} .in_contact_cont dt{width:29%; text-align:center; box-sizing:border-box; padding:30px 14px; border:1px solid var(--border_color)} .in_contact_cont .img{display:inline-block; padding:16px; margin:0 auto; border:1px solid #999; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%} .in_contact_cont img{opacity:.5; width:48px; height:48px; object-fit:contain; filter:brightness(0); -webkit-filter:brightness(0); -moz-filter:brightness(0); -o-filter:brightness(0); -ms-filter:brightness(0)} .in_contact_cont .txt{} .in_contact_cont .txt p{margin:20px auto 14px; font-size:20px; color:#000; font-weight:bold} .in_contact_cont .txt h6{min-height:44px; font-size:15px; color:#666; line-height:22px} .in_contact_cont .txt h6, .in_contact_cont .txt a{text-transform:initial!important} .in_contact_cont dt:hover{box-shadow:0 0 10px rgba(0,0,0,.1)} .in_contact_cont dt:hover .img{border-color:var(--i_color)} .in_contact_cont dt:hover img{opacity:1; filter:brightness(1); -webkit-filter:brightness(1); -moz-filter:brightness(1); -o-filter:brightness(1); -ms-filter:brightness(1)} @media screen and (max-width:1440px){ .in_contact_cont dt{width:30%} } @media screen and (max-width:1366px){ .in_contact_cont dt{width:31%} .in_contact_cont .txt p{font-size:19px} .in_contact_cont .txt h6{font-size:14px} .in_contact_cont img{width:36px; height:36px} } @media screen and (max-width:1200px){ .in_contact_cont .txt p{font-size:18px} .in_contact_cont .txt h6{font-size:13px} .in_contact_cont img{width:32px; height:32px} } @media screen and (max-width:959px){ .in_contact_cont dt{padding:20px 14px} .in_contact_cont .txt p{font-size:17px} .in_contact_cont img{width:28px; height:28px} } @media screen and (max-width:767px){ .in_contact_cont .txt p{font-size:16px} .in_contact_cont .img{padding:14px} .in_contact_cont img{width:26px; height:26px} } @media screen and (max-width:560px){ .in_contact_cont dt{width:100%; margin:0 0 16px} .in_contact_cont dt:last-child{margin-bottom:0} .in_contact_cont .img{padding:10px} .in_contact_cont img{width:22px; height:22px} } /* 地图 */ .in_map_box{--padding_t_b:80px} .in_map_box{padding:var(--padding_t_b) 0; background:#f5f7f8 url(static/images/in_map_bg.jpg) no-repeat center; background-size:contain; position:relative; overflow:hidden} /* 表单 */ .in_c_form{--input_font_size:16px; --input_height:54px} .in_c_form{width:42%} .in_c_form .tit{margin-bottom:40px} .in_c_form .tit .h2{font-size:34px; color:#1E1E1E; font-weight:bold; line-height:34px} .in_c_form .tit .h6{margin-top:10px; font-size:16px; color:#626262; line-height:24px} #wpforms-169{width:75%; min-height:450px; margin:0; padding:0} #wpforms-form-169{width:100%; overflow:hidden} #wpforms-169 input, #wpforms-169 button{margin:0; padding:0; border:none; background:none} #wpforms-169 .wpforms-field{padding:0; margin:0; position:relative} #wpforms-169 .wpforms-field-container{width:100%; overflow:hidden} #wpforms-169 .wpforms-submit-container{padding:0!important; width:100%; height:var(--input_height); background:var(--i_color); -webkit-border-radius:100px; -moz-border-radius:100px; border-radius:100px; position:relative} #wpforms-169 .wpforms-field-label{font-size:0} #wpforms-169 .wpforms-field{width:100%; background:transparent; overflow:hidden} #wpforms-169 .wpforms-field:first-child{float:left; margin-right:2%} #wpforms-169 .wpforms-required-label{position:absolute; top:22px; left:4px; font-size:13px; color:#F00} #wpforms-169 .wpforms-field-container>div{margin-bottom:24px!important} #wpforms-169 input{width:100%; max-width:100%!important; font-size:var(--input_font_size); color:#555; height:var(--input_height); line-height:var(--input_height); box-sizing:border-box; border:1px solid rgba(0,0,0,.2); background:#FFF; padding:0 10px} #wpforms-169 textarea{width:100%; max-width:100%!important; min-height:120px; font-size:var(--input_font_size); color:#555; line-height:24px; box-sizing:border-box; border:1px solid rgba(0,0,0,.2); background:#FFF; padding:10px 10px} #wpforms-169 input::-webkit-input-placeholder{color:rgba(0,0,0,.6); font-size:var(--input_font_size)} #wpforms-169 input::-moz-placeholder{color:rgba(0,0,0,.6); font-size:var(--input_font_size)} #wpforms-169 input::-moz-placeholder{color:rgba(0,0,0,.6); font-size:var(--input_font_size)} #wpforms-169 input::-ms-input-placeholder{color:rgba(0,0,0,.6); font-size:var(--input_font_size)} #wpforms-169 #wpforms-169-field_1-error, #wpforms-169 #wpforms-169-field_2-error, #wpforms-169 #wpforms-169-field_3-error, #wpforms-169 #wpforms-169-field_4-error, #wpforms-169 #wpforms-169-field_5-error, #wpforms-169 .mailcheck-error{position:absolute; font-size:14px} #wpforms-169 .wpforms-submit-container button{width:100%; height:var(--input_height); font-size:18px; color:#FFF; line-height:var(--input_height); cursor:pointer; text-transform:uppercase; position:relative; z-index:2} #wpforms-169 .wpforms-submit-container img{position:absolute; top:50%; transform:translate(0,-50%); right:4px} #wpforms-169 .wpforms-submit-container:hover{background:#035b99} @media screen and (max-width:767px){ #wpforms-169 .wpforms-required-label{top:14px} } /* 地图 */ .in_c_map{position:absolute; top:50%; transform:translate(0,-50%); right:0; width:51%; height:calc(100% - var(--padding_t_b) * 2); min-height:300px; box-shadow:0 0 10px rgba(0,0,0,.1)} .in_c_map #simpleMap, .in_c_map .fluid-width-video-wrapper, .in_c_map iframe{width:100%; height:100%!important} @media screen and (max-width:1440px){ .in_c_form .tit .h2{font-size:32px} } @media screen and (max-width:1366px){ .in_map_box{--padding_t_b:60px} .in_c_form{--input_font_size:15px; --input_height:48px} .in_c_form .tit .h2{font-size:30px} .in_c_form .tit .h6{font-size:15px} #wpforms-169{width:80%} .wpforms-field-container>div{margin-bottom:16px!important} } @media screen and (max-width:1200px){ .in_c_form{--input_font_size:14px; --input_height:44px} .in_c_form .tit{margin-bottom:28px} .in_c_form .tit .h2{font-size:28px} .in_c_form .tit .h6{font-size:14px} #wpforms-169{width:85%} } @media screen and (max-width:959px){ .in_map_box{--padding_t_b:50px} .in_c_form{--input_font_size:14px; --input_height:42px} .in_c_form .tit .h2{font-size:24px} .in_c_form .tit .h6{font-size:13px} #wpforms-169{width:100%} } @media screen and (max-width:767px){ .in_map_box{--padding_t_b:40px} .in_map_box{padding-bottom:0!important; background-size:cover} .in_c_form{float:none!important; width:100%; margin-bottom:40px} .in_c_form .tit .h2{font-size:22px} .in_c_form .tit .h6{margin-top:0} #wpforms-169{min-height:0} .in_c_map{position:relative; top:initial; transform:none; width:100%; height:300px!important} } @media screen and (max-width:560px){ .in_c_form{--input_font_size:13px; --input_height:38px} .in_c_form .tit .h2{font-size:20px} .in_c_form .tit .h6{font-size:12px; line-height:20px} } /* catlog */ .in_catlog{} .in_catlog_list{overflow:hidden} .in_catlog_list li{float:left; width:23.5%; margin:0 2% 30px 0; box-sizing:border-box; padding:20px 40px; background:#f4f4f4} .in_catlog_list .img{width:100%; position:relative; overflow:hidden} .in_catlog_list .img:before{content:""; display:block; padding-bottom:77.5%} .in_catlog_list .img img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; object-fit:cover} .in_catlog_list .txt{text-align:center} .in_catlog_list .txt p{margin:20px auto 14px; font-size:18px; color:#1E1E1E; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .in_catlog_list .txt a{display:inline-block; padding:0 20px; background:var(--i_color); font-size:15px; color:#FFF; line-height:32px; -webkit-border-radius:100px; -moz-border-radius:100px; border-radius:100px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis} .in_catlog_list li:first-child{width:49%} .in_catlog_list li:first-child{padding:56px 40px} @media screen and (min-width:960px){ .in_catlog_list li:nth-child(3), .in_catlog_list li:nth-child(5), .in_catlog_list li:nth-child(9){margin-right:0} } @media screen and (max-width:1440px){ .in_catlog_list li:first-child{padding:56px 40px} .in_catlog_list .txt p{font-size:17px} .in_catlog_list .txt a{font-size:14px} } @media screen and (max-width:1366px){ .in_catlog_list li{padding:20px 30px} .in_catlog_list li:first-child{padding:64px 30px} .in_catlog_list .txt p{font-size:16px} .in_catlog_list .txt a{font-size:13px} } @media screen and (max-width:1200px){ .in_catlog_list li{padding:20px 20px} .in_catlog_list li:first-child{padding:68px 20px} .in_catlog_list .txt p{margin:14px auto 12px; font-size:15px} .in_catlog_list .txt a{font-size:12px} } @media screen and (max-width:959px){ .in_catlog_list li{width:23.5%} .in_catlog_list li:first-child{width:74.5%; padding:20px 20px} .in_catlog_list li:first-child .img:before{padding-bottom:65%} .in_catlog_list li:nth-child(2), .in_catlog_list li:nth-child(3), .in_catlog_list li:nth-child(7){margin-right:0} .in_catlog_list .txt p{margin:14px auto 12px; font-size:13px} .in_catlog_list .txt a{padding:0 10px} } @media screen and (max-width:767px){ .in_catlog_list li{width:48%!important; margin:0 4% 30px 0} .in_catlog_list li:nth-child(2n){margin-right:0!important} .in_catlog_list li:nth-child(3), .in_catlog_list li:nth-child(7){margin-right:4%} .in_catlog_list li:first-child .img:before{padding-bottom:77.5%} } @media screen and (max-width:560px){ .in_catlog_list li{margin-bottom:20px; padding:20px 14px!important} } /* 搜索页 */ .in_search_tit{margin-bottom:70px; text-align:center} .in_search_tit .h2{font-size:34px; color:var(--i_color); font-weight:bold; text-transform:uppercase} .in_search_tit h1{margin-top:12px; font-size:20px; color:#777} .in_search_tit p{margin:16px 0; font-size:24px; color:#757575} .in_search{width:510px; margin:0 auto; border:1px solid var(--border_color); overflow:hidden} .in_search .search_ipt{float:left; box-sizing:border-box; padding-left:10px; width:calc(100% - 110px); font-size:15px; color:#333; line-height:46px} .in_search .search_btn{float:right; width:110px; height:46px; line-height:46px; background:var(--i_color); font-size:18px; color:#FFF} .in_search_list li{width:22.75%; margin-bottom:40px} .in_search_list li:nth-child(3n){margin-right:3%} .in_search_list li:nth-child(4n){margin-right:0!important} @media screen and (max-width:1440px){ .in_search_tit{} .in_search_tit .h2{font-size:32px} .in_search_tit p{font-size:22px} } @media screen and (max-width:1366px){ .in_search_tit .h2{font-size:28px} .in_search_tit p{font-size:20px} .in_search .search_btn{font-size:16px} } @media screen and (max-width:1200px){ .in_search_tit{margin-bottom:60px} .in_search_tit .h2{font-size:26px} .in_search_tit h1{font-size:18px} .in_search_tit p{margin:10px auto 16px; font-size:18px} } @media screen and (max-width:959px){ .in_search_list li{margin-bottom:30px} .in_search_tit .h2{font-size:24px} .in_search_tit p{font-size:17px} } @media screen and (max-width:767px){ .in_search_tit{margin-bottom:40px} .in_search{width:90%} .in_search_tit .h2{font-size:22px} .in_search_tit h1{font-size:16px} .in_search_tit p{font-size:16px} .in_search_list li{width:48%; margin:0 4% 20px 0} .in_search_list li:nth-child(2n){margin-right:0!important} } @media screen and (max-width:560px){ .in_search_tit{margin-bottom:34px} .in_search{width:100%} .in_search_tit .h2{font-size:20px} .in_search_tit h1{font-size:14px} .in_search_tit p{font-size:14px} .in_search .search_ipt{line-height:38px} .in_search .search_btn{height:38px; line-height:38px} } /* 感谢页面 */ .thanks{margin:80px auto 300px; text-align:center; overflow:hidden} .thanks h2{margin-bottom:20px; font-size:30px; color:#222; font-weight:bold} .thanks a{display:inline-block; padding:0 40px; background:var(--i_color); line-height:38px; font-size:15px; color:#FFF} @media screen and (max-width:1200px){ .thanks{margin-top:60px} .thanks h2{font-size:26px} } @media screen and (max-width:767px){ .thanks{margin:40px auto 70px} .thanks h2{font-size:22px} } @media screen and (max-width:560px){ .thanks h2{font-size:18px} } /* 404 */ .in404{position:absolute; top:0; left:0; width:100%; height:100%; background:#FFF} .in404_text{position:absolute; top:44%; left:50%; transform:translate(-50%,-50%); width:80%; text-align:center} .in404_text h1{font-size:220px; color:#BBB} .in404_text h6{margin:10px auto 30px; font-size:18px; color:#999} .in404_text a{display:inline-block; padding:0 40px; line-height:32px; font-size:15px; color:#999; border:2px solid #DDD; -webkit-border-radius:100px; -moz-border-radius:100px; border-radius:100px} @media screen and (max-width:959px){ .in404_text h1{font-size:180px} } @media screen and (max-width:767px){ .in404_text h1{font-size:140px} .in404_text h6{font-size:16px} .in404_text a{font-size:14px} } @media screen and (max-width:560px){ .in404_text h1{font-size:70px} .in404_text h6{margin:10px auto 18px; font-size:14px; line-height:20px} .in404_text a{font-size:13px} } .link_hidden { display: none !important; }