﻿/*全局*/
:root{
	--color:#333;
	--redColor:#D1111C;
}
* {box-sizing: border-box;}
html {overflow-x: hidden;}
body {color: #333;line-height: 2;font-size: 16px;overflow-x: hidden;background-color: #fff;}
body:before {content: '';display: block;height: 100px;}
a:hover {text-decoration: none;color: #f00;}
.margin-top10 {margin-top: 10px;}
.margin-top15 {margin-top: 15px;}
.margin-top20 {margin-top: 20px;}
.margin-top30 {margin-top: 30px;}
.margin-top40 {margin-top: 40px;}
.margin-top50 {margin-top: 50px;}
.margin-bottom40 {margin-bottom: 40px;}
.relative {position: relative;}
.text-white,.text-white a {color: #fff;}
.overflow2 {display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.overflow3 {display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
/*图片父级容器正方形显示*/
.auto-box {position: relative;overflow: hidden; padding-bottom: 100%;border: 0px solid #ddd;background: #f8f8f8;}
.auto-box .auto-flex {position: absolute;width:100%; height: 100%;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.auto-box .auto-flex a {display: block;height: 100%;}
.auto-box .auto-flex img {height:100%;max-width: auto!important;}

/* 首页 */
.layui-container {position: relative;}
.banner-box .swiper-slide {height: 810px;}
#header {background: #fff;position: fixed;left: 0;right: 0;top: 0;z-index: 99999;}
#header .layui-container {display: flex;justify-content: space-between;align-items: center;height: 100px;}
.nav-box {flex: 1;margin-left: 150px;}
.nav-box >ul {display: flex;justify-content: space-around;}
.nav-box >ul >li {position: relative;}
.nav-box >ul >li >a {display: flex;line-height: 1.4;font-size: 18px;flex-direction: column;text-align: center;height: 100px;justify-content: center;}
.nav-box >ul >li >a >p {font-size: 12px;color: #888;}
.nav-box >ul >li >a:hover {color: #0275C7;}
.nav-box >ul >li >a:hover >p {color: #0275C7;}
.submenu {position: absolute;left: 50%;z-index: 2;background-color:#0665c1;min-width: 100%;display: none;width: 120px;margin-left: -60px;}
.submenu >ol >li >a {display: block;white-space: nowrap;padding: 0 10px;line-height: 40px;color: #fff;font-size: 14px;text-align: center;}
.submenu >ol >li >a:hover {background-color: #F47502;}

.search-block {background-image: linear-gradient(90deg,#ffffff 50%,#0475CA 50%,#33A5BA);padding-top: 30px;padding-bottom: 30px;}
.search-block .layui-container {display: flex;}
.search-box {width: 50%;display: flex;justify-content: space-between;}
.search-right {padding-right: 20px;}
.wenan-box {width: 50%;align-items: center;justify-content: center;display: flex;flex-direction: column;}
.hot-keywords >p {font-size: 24px;font-weight: bold;}
.hot-keywords .layui-breadcrumb {height: 40px;}
#btn-navbar {display: inline-block;font-size: 24px;color: #0665c1;}

#form-search {background-color: #fff;border-radius: 4px;display: flex;margin-top: 20px;border: 1px solid #eee;}
#form-search input {background-color: #fff;height: 40px;padding: 0 10px;width: 300px;font-size: 14px;border: none;}
#form-search input::input-placeholder {color: #999;}
#btn-search {background: url(../images/icon-search.jpg) center no-repeat #fff;width: 40px;height: 40px;border: none;}

.wenan-title {color: #fff;font-size: 24px;}
.wenan-box p {border: 1px solid rgba(255,255,255,0.6);color: #fff;padding: 0 20px;margin: 10px 0;}
.wenan-tel {font-size: 24px;color: #fff;font-weight: 100;}
.wenan-tel img {margin-right: 10px;}

.index-product {background-color: #F7F7F7;padding-top: 60px;padding-bottom: 100px;}
.title {text-align: center;line-height: 1.5;}
.title b {font-size: 36px;}
.title p {font-size: 16px;text-transform: uppercase;color: #999;}

.product-list .item {border: 1px solid #eee;margin-bottom: 20px;background-color: #fff;padding-top: 30px;padding-bottom: 30px;}
.product-list .item .img {display: flex;height: 210px;justify-content: center;align-items: center;overflow: hidden;}
.product-list .item .img img {height: 100%;}
.product-list .item p {text-align: center;}
.pro-pagination {bottom: -30px!important;left: 50%;transform: translateX(-50%);}
.pro-pagination span {margin:0 1px;}


.index-about {background: url(../images/about-bg.jpg) center no-repeat;padding-top: 150px;padding-bottom: 150px;}
.index-about .layui-container {display: flex;justify-content: space-between;}
.index-about .about-info {width: 50%;padding-right: 20px;color: #fff;}
.about-info >p.about-con {}
.comname {margin-top: 0px;font-size: 36px;}
.about-more {position: relative;margin-top: 20px;padding-top: 15px;}
.about-more a {display: inline-block;background-color: #fff;color: #333;padding: 5px 40px;border-radius: 20px;}
.about-more a:hover {opacity: 0.9;}

.index-case {background: #FDFDFD;padding-top: 60px;padding-bottom: 70px;}

.case-box {margin-top: 40px;}
.case-box .item {background-color: #fff;padding: 40px 20px;box-shadow: 0 5px 25px rgba(0,0,0,0.1);}
.case-img {display: flex;justify-content: center;align-items: center;height: 260px;overflow: hidden;}
.case-img img {height: 100%;}
.case-box .item p {font-size: 14px;color: #999;line-height: 1.7;}
.case-title {font-size: 22px;font-weight: 100;}

.index-news {padding-top: 60px;background-color: #F7F7F7;padding-bottom: 100px;}
.index-news-title {display: flex;justify-content: space-between;align-items: center;}
.index-news-title span:nth-child(2) {margin-left: 10px;color: #999;}
.index-news-title b {font-size: 36px;}
.index-news-title b i {font-style: normal;color: #0275C7;}
.index-news-title a i {font-size: 24px;font-weight: 100;}
.news-box {margin-top: 20px;display: flex;justify-content: space-between;}
.news-toutiao {background-color: #EFEFEF;}
.news-toutiao p {font-size: 14px;line-height: 1.7;color: #777;}
.news-toutiao .news-img {display: flex;justify-content: center;align-items: center;height: 420px;background-color: #fff;overflow: hidden;}
.news-toutiao .news-img img {width: 100%;}
.toutiao-info {padding: 15px 20px;display: flex;justify-content: space-between;align-items: center;}
.toutiao-info .left {flex: 1;}
/* .toutiao-info .right {width: 200px;} */
.news-more a {background-color: #34A3B7;display: inline-block;color: #fff;padding: 5px 20px;border-radius: 20px;}
.news-list .item {border-bottom: 1px solid #ddd;padding-bottom: 18px;margin-bottom: 18px;}
.news-list .item .news-date {color: #999;}
.news-list .item .news-title {font-size: 18px;}
.news-list .item p {color: #888;}

.index-link {margin-top: 40px;padding-top: 20px;padding-bottom: 20px;font-size: 14px;}
.index-link .layui-breadcrumb * {color: #888!important;}

.footer {background-color: #222423;color: #fff;padding-top: 30px;}
.footer a {color: #fff;}
.footer-nav {display: flex;justify-content: space-between;font-size: 14px;line-height: 2.2;margin-right: 30px;}
.footer-nav ul {border-left: 1px solid #444;padding-left: 40px;}
.footer-nav a {color: #999;}
.footer-nav li.active a {font-size: 16px;color: #fff;}

.footer-qrcode {display: flex;justify-content: space-between;margin-top: 10px;color: #888;}
.footer-qrcode .qrcode-left {text-align: center;}
.footer-qrcode .qrcode-right {text-align: center;}
.footer-qrcode img {width: 140px;height: 140px;}

.copyrights {font-size: 14px;padding-top: 15px;padding-bottom: 15px;color: #777;background-color: #161817;}
.copyrights a {color: #777;}

.right-content .proinfo img{display:block;max-width:100% !important;height:auto;margin:auto;}
.nybanner {height: 480px;}

/* 首页中部样式 */
.produstlist li a{display: block;position: relative;}
.produstlist .mask{position: absolute;top:0;left:0;right:0;bottom:0;background: rgba(0,0,0,.6);z-index: 100;display: none;
justify-content: center;align-items: center;}
.produstlist .mask i{color:#fff;font-size: 30px;}
.produstlist li:hover .mask{display: flex;}



@media only screen and (min-width: 1440px) {
	.layui-container {width: 1370px;}
	.main-right{width: 1000px !important;}
}

@media only screen and (min-width: 1200px)  and (max-width: 1440px)  {
	.layui-container{width: 1200px}
	.main-right{width: 880px !important;}
}
@media only screen and (min-width: 1200px)  and (max-width: 1280px)  {
	.layui-container {width: 1200px;}
	.banner-box .swiper-slide{height: 700px}
	.main-right{width: 850px !important;}
}
@media only screen and (min-width: 1280px)  and (max-width: 1600px)  {
	.nybanner,.swiper-slide{height: 380px}
	.banner-box .swiper-slide{height: 680px}
}
@media only screen and (min-width: 320px) and (max-width: 640px)  {
	body {font-size: 14px;}
	body:before {content: '';display: block;height: 60px;}
	.banner-box .swiper-slide {height: 200px;background-size: cover!important;}
.nybanner{height: 200px}
	.nybanner .swiper-slide {height: 200px;background-size: cover!important;}
	#header {position: fixed;padding-top: 10px;padding-bottom: 10px;z-index: 3;left: 0;right: 0;top:0;height: 60px;box-shadow: 0 0 10px rgba(0,0,0,0.2);background: #fff;}
	#header .layui-container {height: 40px;}
	#header .nav-bar {width: 80px;display: flex;justify-content: flex-end;align-items: center;}
	#header .logo {flex: 1;height: 40px;}
	#header .logo img {height: 100%;object-fit: contain;}
	
	.nav-box {position:fixed;top:0px;left:-140px;width: 140px;bottom:0;background-color: #1A5CA8;z-index: 99;flex: 0%;margin-left: 0;}
	.nav-box >ul {display: flex;flex-wrap: wrap;}
	.nav-box >ul >li {display:block;width: 100%;}
	.nav-box >ul >li >a {color:#fff;border-bottom:1px solid #2967AF;font-size:14px;line-height:50px;}
	.nav-box >ul >li >a:hover {border-color: #2967AF;color: #fff;background: #2967AF;}
	.nav-box >ul >li >a >i {display: none;}
	#btn-navbar .layui-icon {font-size: 30px;color: #1A5CA8;}
	.nav-box >ul >li >a >p {display: none;}
	.nav-box >ul >li >a {height: auto!important;}
	
	.product-title-cate {display: block;}
	.product-title-cate .title p {font-size: 16px;}
	.product-title-cate .title b {font-size: 24px;}
	.procate-list {display: flex;margin-top: 15px;justify-content: space-around;}
	.procate-list a {margin-left: 0;font-size: 16px;}
	.product-list .item .img {height: 2.5rem;}
	.product-list .item p {font-size: 12px;padding: 5px;}
	
	.index-youshi .title b {font-size: 24px;}
	.index-youshi .title p {font-size: 14px;}
	.index-youshi .item {height: 4.6rem;}
	.index-youshi .item b {font-size: 20px;}
	.index-youshi .item p {font-size: 13px;}
	.index-youshi {padding-top: 30px;margin-top: 40px;}
	.index-about .layui-container {display: block;}
	.about-img img {width: 100%;}
	.index-about .about-info {padding: 15px;width: 100%;}
	
	.index-about {margin-top: 0;padding-top: 20px;padding-bottom: 30px;}
	.comname {line-height: 1.3;font-size: 24px;}
	.about-info >p.about-con {height: auto;font-size: 13px;line-height: 1.8;margin-top: 20px;}
	
	.case-box .item {padding: 20px;}
	.case-img {height: 4rem;}
	.case-title {font-size: 16px;}
	.case-box .item p {font-size: 12px;}
	
	.index-news-title .title p {font-size: 16px;}
	.index-news-title .title b {font-size: 24px;}
	
	.news-box {display: block;}
	.news-toutiao {padding: 0px;}
	.news-toutiao p {font-size: 12px;}
	.news-toutiao .news-img {height: 3.2rem;margin-top: 10px;}
	.news-list {margin-left: 0;}
	.news-info span {width: 50px;}
	.news-date p {margin-right: 30px;font-size: 13px;}
	.news-info .news-title {font-size: 16px;}
	.news-list .item {padding-top: 10px;padding-bottom: 10px;}
	.news-list .item {margin-bottom: 0;}
	.index-news {padding-top: 30px;padding-bottom: 30px;}
	.index-link {display: none;}
	.qrcode {text-align: center;margin-bottom: 10px;}
	.lianxi {margin-left: 0;font-size: 12px;}
	.copyrights {font-size: 12px;}
	.footer {margin-top: 30px;}
	.index-product {margin-top: 20px;padding-top: 10px;padding-bottom: 50px;}
	.index-case {padding-top: 20px;padding-bottom: 10px;}
	.news-more a {padding: 2px 15px;}
	.toutiao-info {padding: 10px 15px;}
	.news-list .item .news-title {font-size: 16px;}
	.news-list .item p {font-size: 12px;}
	
}