
/*flex布局 --开始*/
/*子元素水平排列，两端元素贴边，中间元素间距相等，所有子元素垂直居中，高度一致（若未设置固定高度则等高）‌*/
/*常用于导航栏、卡片操作栏等需分散对齐且垂直居中的场景‌*/
.displayAB {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/*
水平排列‌：子元素从左到右排列，首尾贴边，中间等间距（如导航栏、多按钮操作栏）。
‌垂直方向‌：‌默认拉伸‌（未设置 align-items，子元素高度默认占满容器高度）‌
需要子元素水平分散对齐且默认垂直填满容器（如双栏布局、页脚版权和链接分列两侧）
*/
.displayB {
	display: flex;
	justify-content: space-between;
}

/*
‌完全居中布局‌：子元素在水平和垂直方向均居中（若容器有固定宽高，则为典型“绝对居中”效果）。
‌子元素排列‌：默认水平排列，不分散（对比 .displayAB 的 space-between，此处无间距自动分配）。
需要完全居中的内容（如弹窗提示、页面加载动画）
*/
.displayC {
	display: flex;
	align-items: center;
	justify-content: center;
}

/*
‌水平排列‌：子元素从左到右紧密排列，无自动间距（对比 justify-content: space-between）。
‌垂直对齐‌：所有子元素顶部对齐，高度由内容决定（不会填满容器高度）‌2。
*/
.displayA {
	display: flex;
	align-items: flex-start;
}

/*
自适应换行‌：子元素宽度总和超过容器宽度时自动换行（如标签组、卡片布局）。
‌垂直居中‌：每行子元素在垂直方向居中对齐（对比 align-items: flex-start 顶部对齐）。
‌默认左对齐‌：换行后的多行内容整体左对齐（需 justify-content: center 实现整体水平居中）。
适用：响应式卡片布局，图文混排行内元素需垂直居中
*/
.displayW {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

/*‌自适应换行‌：子元素按内容宽度自动换行，每行居中排列（对比 justify-content: flex-start 左对齐）。
‌垂直居中‌：所有子元素在行内垂直居中（行高度自适应）。
‌整体居中趋势‌：若容器有额外空间，多行内容整体在容器内居中（需结合容器高度和 align-content 调整）。
适用：相册缩略图列表，商品卡片
*/
.displayCW {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}

/*
自适应换行‌：子元素根据容器宽度自动换行。
‌行内两端对齐‌：每行内容严格贴左右边缘，元素间距均分（对比 justify-content: space-around 左右留空隙）。
‌潜在问题‌：
最后一行若元素不足，可能单独左对齐（需占位元素填充或调整逻辑）。
行高度由该行最高子元素决定，垂直方向默认拉伸对齐（未设置 align-items）*/
.displayBW {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

/*flex布局 --结束*/

/*flex布局子元素 --开始*/

.flex1 {
	flex: 1;
}

/*宽度参数*/
.maxWidth1200 {
	max-width: 1200px;
}

.width1200 {
	width: 1200px;
}

.width100 {
	width: 100%;
}

.txtCenter {
	text-align: center;
}

.bold {
	font-weight: bold;
}
.weight500 {
	font-weight: 500;
}
.marginr8 {
	margin-right: 8px;
}
.marginr10 {
	margin-right: 10px;
}
.marginl10 {
	margin-left: 10px;
}

.marginl20 {
	margin-left: 20px;
}

.marginl30 {
	margin-left: 30px;
}

.marginb10 {
	margin-bottom: 10px;
}

.marginb20 {
	margin-bottom: 20px !important;
}

.marginb30 {
	margin-bottom: 30px;
}

.marginb40 {
	margin-bottom: 40px;
}

.marginb60 {
	margin-bottom: 60px;
}

.margint20 {
	margin-top: 20px;
}

.margint40 {
	margin-top: 40px;
}

.margint30 {
	margin-top: 30px;
}

.margint60 {
	margin-top: 60px;
}

.margint80 {
	margin-top: 80px;
}

.pointer {
	cursor: pointer;
}

.size50 {
	font-size: 50px;
}

.size30 {
	font-size: 30px;
}

.size32 {
	font-size: 32px;
}

.size16 {
	font-size: 16px;
}

.grayF {
	color: #999999;
}

.grayF2 {
	color: #666;
}

.floatL {
	float: left;
}

.floatR {
	float: right;
}

.overflowH {
	overflow: hidden;
}

a:hover{
	color: #005223;
}
#mainHeader{
	background: linear-gradient(0deg,rgba(255,255,255,0.11)  0%, rgba(255,255,255,0.9) 100%);
}
.gt_menu .gt_nav{
	background-color: transparent !important;
}
.gt_menu .layui-this a, .gt_menu a:hover{
	color: #000000 !important;
}
/* .layui-header-menu .layui-nav .layui-this a, .layui-header-menu .layui-nav-item a:hover,.layui-header-menu .layui-nav-item a{
	color: #fff;
} */
/* .layui-header-menu .layui-nav .layui-this, .layui-header-menu .layui-nav-item:hover{
	background: none;
	color: #fff;
} */
.layui-nav .layui-this:after, .layui-nav-bar{
	background:#00582A;
	/* width: 35%;
	left: 50%;
	transform: translateX(-50%); */
}
.scrolled{
	background: #fff !important;
}
.scrolled .layui-header-menu .layui-nav .layui-this a,.scrolled .layui-header-menu .layui-nav-item a:hover,
.scrolled .layui-header-menu .layui-nav-item a,.scrolled .layui-header-menu .layui-nav .layui-this,
 .scrolled .layui-header-menu .layui-nav-item:hover{
	color: #000;
}
/* .scrolled .layui-nav .layui-this:after, .scrolled .layui-nav-bar{
	background:#000;
} */
.gt_header+div{
	padding-top: 0;
}
#banner{
	height: 960px;
	max-height: 960px;
}
#banner .swiper-button-next,#banner .swiper-button-prev{
	display: none;
}
.gt_breadcrumb{
	display: none;
}

.indexindex > .gt_main{
	width: 100%;
	padding: 0;
}
.swiper-pagination-bullet-active{
	background:#fff !important;
}


.yewuCenterBox{
	width: 100%;
	background: url('../../../images/huigang/ywbg.png') no-repeat;
	background-size: 100% 100%;
	color: #fff;
	text-align: center;
	padding: 50px 0 40px;
}
.yewuCenterBox h1,.yewuCenterBox h2{
	font-weight: 400;
}
.yewuCenterBox a{
	color: #fff;
}
.yewuCenterBox .typeWrapper{
	width: 100%;
	background: url('../../../images/huigang/yw1.png') no-repeat;
	background-size: 100% 100%;
	display: flex;
	padding: 10px 0;
	margin-bottom: 1px;
}
.yewuCenterBox .typeBox{
	flex: 1;
	height: 300px;
}
.yewuCenterBox .stepWrapper{
	width: 100%;
	height: 280px;
	background: url('../../../images/huigang/yw2.png') no-repeat;
	background-size: 100% 100%;
	padding: 50px;
	box-sizing: border-box;
}

#smallbanner{
	height: 360px;
	max-height: 360px;
}
.layui-container{
	z-index: 9;
}

.indexindex .layui-container .layui-container{
	max-width: 1200px;
}
.indexindex .gt_swiper{
	background: url('../../../images/huigang/cpbg.png') no-repeat;
	background-size: 100% 100%;
	box-sizing: border-box;
	padding:30px;
}
.indexindex #ProjectCases .swiper-slide .gt_card_img{
	object-fit: cover;
}
.indexindex #ProjectCases .gt_widget_title .title{
	text-align: center;
	color: #fff;
}
.indexindex #ProjectCases .gt_widget_title .morelink,.indexindex #ProjectCases .swiper-pagination{
	display: none;
}
.indexindex #ProjectCases .gt_img_container{
	padding-top: 600px;
}
.indexindex #ProjectCases .swiper-slide .gt_img_container::after{
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 25%;
	background: linear-gradient(0deg,rgba(103,105,107,0.9) 0%, rgba(103,105,107,0) 100%);
}
.indexindex #ProjectCases .swiper-slide .imgTitle{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 15px;
	color: #fff;
	text-align: center;
}
.swiper,.indexindex #ProjectCases{
    --swiper-navigation-color: #fff;/* 单独设置按钮颜色 */
    --swiper-navigation-size: 39px;/* 设置按钮大小 */
}

/* 以下是产品列表 */
.gt_widget .gt_widget_title h2{
	background-image: none;
	color: #fff;
}
.list .gt_widget{
	margin-top: -210px;
	padding: 0px;
}
.list .gt_widget .gt_widget_title h2{
	position: relative;
	margin: 10px auto;
	font-weight: 600;
}
/* .list .gt_widget .gt_widget_title h2::after{
	position: absolute;
	content: 'Sample Book';
	left: 50%;
	transform: translateX(-50%);
	bottom: -10px;
	color: rgba(255, 255, 255, 0.5);
	font-size: 18px;
	font-weight: 500;
} */
.list .gt_widget .gt_flex_container{
	background-color: #fff;
	gap: 0;
	justify-content: flex-start;
}
.list .gt_flex_container .gt_flex_41{
	box-shadow: none;
	flex: 0 1 calc(50% - 2px);
}
.gt_widget .gt_flex_container .gt_flex_41 a{
	padding: 20px 15px;
}
.list .gt_flex_41 h3{
	text-align: left;
	font-size: 16px;
}
.list .gt_flex_41 .newsimg{
	width: 100%;
	margin-bottom: 10px;
}
.list .gt_flex_container .gt_flex_41 p{
	display: none;
}

.list .gt_catalist3{
	padding: 10px;
}
.list .gt_catalist3 .gt_flex_21{
	flex: 0 0 calc(33.33% - 20px);
	border: none;
	margin: 10px;
}
.list .gt_catalist3 .gt_flex h3{
	text-align: left;
}
.list .gt_catalist3 .gt_flex p{
	-webkit-line-clamp: 2;
	-moz-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
	/* word-break: break-all; */
	word-break: normal;
	text-overflow: ellipsis;
	display: -webkit-box; // 弹性伸缩盒
	display: -moz-box;
	display: box;
	-webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
	-moz-box-orient: vertical;
	box-orient: vertical;
	word-wrap: break-word;
}
.list .gt_catalist3 .gt_flex_21 a{
	padding: 0px;
	box-sizing: border-box;
}
.list .gt_catalist3 .gt_flex img{
	object-fit: cover;
	width: 100%;
}


.catalogueview .main, .vinassemble .main,.product .main,.list .main,.aboutus .main{
	margin-top: -200px;
	padding: 0;
	background-color: transparent;
}
._4catalogueViewBox .pdTypeBox{
	margin-left: -8px;
	margin-right: -8px;
}
._4catalogueViewBox .pdTypeBtn{
	padding: 7px 12px;
	background-color: rgba(0,0,0,0.2);
	color: #fff;
	margin: 8px;
}
._4catalogueViewBox .activePdTypeBtn,._4catalogueViewBox .pdTypeBtn:hover{
	background: #FFFFFF;
	color: #005223;
	font-weight: bold;
}
.pdlistWrapper{
	background-color: #FFFFFF;
	padding: 13px 8px;
	min-height: 39vh;
}
.pdlist .pdItem {
	width: calc(33.33% - 20px);
	margin: 13px 8px;
	font-size: 16px;
	box-sizing: border-box;
}
.pdlist .pdItem .pdImg{
	width: 100%;
	height: 260px;
	object-fit: cover;
	cursor: pointer;
	margin-bottom: 10px;
	border: 1px solid #eee;
}
.pdItem{
	color: #333333;
}
.catalogueview a:hover{
	color: #005223;
	font-weight: bold;
}

/* 产品详情 */
.pdViewBox {
	padding:20px;
	background-color: #fff;
	box-sizing: border-box;
}
.pdViewBox .tagBox{
	position: relative;
	display: flex;
	margin-bottom: 30px;
}
.pdViewBox .tagBox .cTag{
	width: 30px;
	height: 30px;
	background: linear-gradient(0deg,rgba(211,211,211,0.11)  0%, rgba(211,211,211,1) 100%);
	border-radius: 15px;
}
.noBox{
	margin-left: -20px;
	margin-top: 10px;
}
.pdViewBox .listBox .param-item{
	width: 46%;
	display: flex;
	justify-content: space-between;
	padding: 5px;
}
.pdViewBox .listBox .param-item label{
	font-weight: bold;
}
.pdViewBox .listBox .param-item span{
	flex: 1;
	text-align: right;
}
.pdViewBox .htmlOut img{
	width: 100%;
	margin: 10px 0;
}

.article .gt_widget .gt_widget_title h2{
	color: #000;
	font-weight: bold;
	width: 100%;
}
.article .gt_widget_content{
	font-size: 15px;
}
.article .gt_widget_content p{
	line-height: 28px;
	text-wrap: wrap !important;
}
.article .gt_widget_content span{
	text-wrap: wrap !important;
}
.article .gt_widget_content img{
	text-align: center;
	width: 80%;
	margin: 20px auto;
	display: block;
}

.aboutus .main{
	margin-top: -120px;
}
.contactUsCon{
	padding: 50px;
	line-height: 26px;
	background-color: #fff;
	box-sizing: border-box;
}

.contactUsCon h1{
	margin-bottom: 8px;
}
.contactUsCon .strengthItem{
	width: 100%;
	background: #F9F9F9;
	border-radius: 10px;
	box-sizing: border-box;
	padding: 30px;
} 
.contactUsCon .strengthItem .img88{
	width: 88px;
	height: 88px;
	margin: 10px 8% 10px 4%;
}
#map{
	width: 100%;
	height: 400px;
	max-width: 960px;
	margin-top: 10px;
}
.aboutus .beautiful_form{
	display: none;
}

@media (max-width: 1030px) {
	.gt_logo_area{
		width: 150px;
	}
	.gt_menu .gt_nav_item a{
		/* color: #fff !important; */
		font-size: 15px;
		padding: 0 8px;
	}
	/* .layui-header-menu .layui-nav .layui-nav-item,.layui-header-menu .layui-nav .layui-nav-item a{
		height: 45px;
		line-height: 45px;
	} */
	.yewuCenterBox, .indexindex #ProjectCases{
		zoom: 0.92;
	}
	.yewuCenterBox .stepWrapper{
		padding: 20px 5px;
	}
	.yewuCenterBox .stepWrapper img{
		zoom: 0.65;
	}
}

@media (max-width: 768px) {
	.gt_menu .gt_nav_item a{
		color: #fff !important;
	}
	.navLang .gt_nav_item a{
		color: var(--menu-text) !important;
	}
	#banner{
		height: 210px;
		max-height: 210px;
	}
	.yewuCenterBox, .indexindex #ProjectCases{
		zoom: 0.62;
	}
	.yewuCenterBox .stepWrapper{
		height: 200px;
	}
	.yewuCenterBox .stepWrapper img{
		zoom: 0.52;
	}
	.indexindex #ProjectCases{
		padding: 30px 10px;
	}
	.catalogueview .main, .vinassemble .main, .product .main,.list .main{
		margin-top: -270px;
		margin-left:10px;
		margin-right: 10px;
	}
	.gt_widget .gt_widget_title{
		margin-bottom: 10px;
	}
	.list .gt_widget .gt_widget_title h2{
		height: auto;
		margin: auto;
		font-size: 24px;
	}
	._4catalogueViewBox .pdTypeBox{
		zoom: 0.8;
		margin-left: 2px;
		margin-right: 2px;
	}
	._4catalogueViewBox .pdTypeBtn{
		padding: 5px 8px;
		margin: 5px;
	}
	._4catalogueViewBox .pdlistWrapper{
		padding: 0;
	}
	.pdlist .pdItem{
		width: calc(50% - 20px);
		margin: 10px 6px;
	}
	
	.list .gt_catalist3{
		padding: 0px;
	}
	.list .gt_catalist3 .gt_flex h3{
		font-size: 14px;
		margin: 10px 0;
	}
	.list .gt_catalist3 .gt_flex p{
		font-size: 12px;
	}
	
	.article #smallbanner,.aboutus #smallbanner{
		height: 130px;
		max-height: 130px;
	}
	.article .gt_widget_content{
		font-size: 14px;
	}
	.article .gt_widget_content img{
		width: 100%;
		margin: 10px auto;
	}
	
	.pdViewBox{
		padding: 10px;
		font-size: 13px;
	}
	.pdViewBox .listBox {
		margin-bottom: 10px;
	}
	.pdViewBox .htmlOut img{
		margin: 5px 0;
	}
	
	.aboutus .main{
		margin-top: 0px;
	}
	.contactUsCon{
		padding: 20px 0;
		line-height: 24px;
		margin-left: -10px;
		margin-right: -10px;
	}
	.contactUsCon .marginb10{
		margin-bottom:5px !important;
	}
	.contactUsCon .marginb20{
		margin-bottom:10px !important;
	}
	.contactUsCon .marginb30{
		margin-bottom:20px !important;
	}
	.contactUsCon h1{
		font-size: 20px;
		margin-bottom: 0;
	}
	.contactUsCon .strengthItem{
		padding: 10px;
		font-size: 13px;
	} 
	.contactUsCon .strengthItem .img88{
		width: 40px;
		height: 40px;
		margin: 10px 10px 10px 0;
	}
	.contactUsCon .strengthItem h3{
		font-size: 15px;
	}
	#map{
		height: 240px;
	}
	
	.layui-logo img{
		height: auto;
	}
	.ws-footer .gt_container{
		padding: 0;
	}
	.ws-footer .footerQrcodes{
		text-align: right;
	}
	.gt_footer .gt_companyname{
		padding-bottom: 10px;
	}
	.layui-font-20{
		font-size: 16px !important;
	}
}






