/*全局*/
:root{
	--color:#333333;
	--activeColor:#0288D0;
	--whiteColor:#FFFFFF;
	--grayColor:#888888;
	--redColor:#DA0203;
	--greenColor:#28A574;
	--orangeColor:#FF6600;
}
* {box-sizing: border-box;}
html {overflow-x: hidden;}
body {color: var(--color);line-height: 2;font-size: 16px;overflow-x: hidden;background-color: #fff;min-width: 1330px;}
.layui-container {width: 1330px;padding-left: 15px;padding-right: 15px;}
a:hover {text-decoration: none;color: var(--activeColor);}
.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-active,.text-active a {color: var(--activeColor);}
.text-white,.text-white a {color: var(--whiteColor);}
.text-red,.text-red a {color: var(--redColor);}
.text-gray,.text-gray a {color: var(--grayColor);}
.text-green,.text-green a {color: var(--greenColor);}
.overflow {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.overflow2 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.overflow3 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;}
.overflow4 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;}
.overflow5 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 5;}
.overflow6 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6;}
/*图片父级容器正方形显示*/
.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;}
.flex {display: flex;}
.flex-center {justify-content: center;align-items: center;}

/* 首页 */
.nav {background: #EBECEF;padding-top: 15px; padding-bottom: 15px;}
.nav .layui-container {display: flex;justify-content: space-between;align-items: center;}
.nav-box {display: flex;margin:0 50px; flex: 1;}
.nav-box >li {/*width: 14.28571%;*/position: relative; flex-grow: 1;}
.nav-box >li:nth-child(1) {background: none;}
.nav-box >li >a {display: block;text-align: center; text-transform: uppercase;font-size: 18px;font-weight: bold;}
.nav-box >li >a:hover {color: var(--whiteColor); background-color: var(--activeColor);border-radius: 20px;}
.nav-box >li.active >a {color: var(--whiteColor); background-color: var(--activeColor);border-radius: 20px;}
.submenu {position: absolute;left: 0; background-color: var(--activeColor);border-radius: 6px;z-index: 3; display: none;}
.submenu >ol >li >a {color: #fff;display: block;text-align: center;padding:15px 10px;border-top:1px solid rgba(255,255,255,0.6); white-space: nowrap;line-height: 1.5;}
.submenu >ol >li:nth-child(1) >a {border-top:none;}
.submenu >ol >li >a:hover {background-color: rgba(255,255,255,0.1);}

.index-product-block {background: url(../images/index_pro_block_bg.jpg) center bottom no-repeat;padding-bottom: 100px;}
.title {text-align: center;}
.title .t {font-size: 66px;font-weight: bold;text-transform: uppercase;padding-top: 50px;line-height: normal;}
.title p {font-size: 24px;text-transform: uppercase;}
.title span {display: inline-block;width: 160px;height: 10px;background-color: var(--activeColor);}

.index-product .product-list a {display: block;position: relative;border: 1px solid #ccc;background-color: #fff;}
.index-product .product-list a .img {padding-bottom: 100%;position: relative;}
.index-product .product-list a .img img {width: 100%; height: 100%; object-fit: cover;position: absolute;left: 0; right: 0;top: 0;bottom: 0;}
.index-product .product-list a p {position: absolute;left: 0;right: 0; bottom: 0;text-align: center; background-color: #30333A;color: #fff;line-height: 60px;}

.index-video-block {background: url(../images/index_video_block_bg.jpg) center no-repeat;padding-bottom: 50px;background-size: cover;}
.index-video-block .title .t {color: #fff;}
.our-video {margin-top: 40px;color: #fff;}
.our-video .t {font-size: 66px;text-transform: uppercase;}
.our-video .left p {font-size: 26px;line-height: 1.5;opacity: 0.8;}
.our-video .right a {color: #fff;display: flex;background-color: rgba(255, 255, 255, 0.2);height: 240px;position: relative;align-items: center; justify-content: center;}
.our-video .right a img {width: 100%; height: 100%; object-fit: cover;}
.our-video .right a span {position: absolute;font-size: 60px;}
.our-video .right a p {position: absolute;bottom: 10px;font-size: 16px;}
.index-about {background: url(../images/index_about_header_bg.jpg) center no-repeat; height: 611px;}
.index-about-block {background: url(../images/about_block_bg.jpg) center no-repeat; padding-bottom: 80px;}
.index-about-block .layui-tabs-header li {text-transform: uppercase;font-size: 19px;line-height: 80px;display: inline-flex;flex-direction: row;align-items: center;}
.index-about-block .layui-tabs-header li i {margin-right: 10px;}
.index-about-block .layui-tabs-header {height: 80px;}
.index-about-block .layui-tabs-header li.layui-this {color: var(--activeColor);}
.index-about-block .layui-tabs-header li.layui-this:after {border-color: var(--activeColor);}
.icon-about1 {display: inline-block;width: 28px; height: 28px;background: url(../images/icon_about1.jpg) center no-repeat;}
.icon-about2 {display: inline-block;width: 28px; height: 28px;background: url(../images/icon_about2.jpg) center no-repeat;}
.icon-about3 {display: inline-block;width: 28px; height: 28px;background: url(../images/icon_about3.jpg) center no-repeat;}
.icon-about4 {display: inline-block;width: 28px; height: 28px;background: url(../images/icon_about4.jpg) center no-repeat;}

.index-about-block .case-box {margin-top: 60px;}
.index-about-block .case-box img {max-width: 100%;}

footer {background: url(../images/footer_bg.jpg) center no-repeat;padding-top: 60px; padding-bottom: 60px;background-size: cover;}
footer .layui-container {display: flex;justify-content: space-between;}
footer .left {width: 32%;padding: 40px;background-color: #fff;}
footer .left .t {font-size: 40px;text-transform: uppercase;line-height: normal; font-weight: bold;}
footer .left .label {text-transform: uppercase;}
footer .left input {width: 100%;height: 44px;padding: 10px;border: 1px solid #ddd; font-size: 14px;}
footer .left textarea {width: 100%;height: 100px;padding: 10px;border: 1px solid #ddd; font-size: 14px;}
footer .left button {background-color: #DA0203;border: none;color: #fff;height: 44px;padding-left: 20px;padding-right: 20px;}
footer .right {width: 64%;}
footer .left .layui-col-xl12 {padding-top: 0;}
footer .right .yewu-txt {color: #fff;text-transform: uppercase;font-size: 50px;line-height: normal;font-weight: bold;margin-top: 30px;}
footer .right .lianxi {color: #fff;font-size: 24px;margin-top: 30px;}
footer .right .lianxi li {line-height: 1.5;margin-bottom: 30px;}
footer .right .lianxi li span {text-transform: uppercase;}

.nybanner {display: flex;justify-content: center;}
.com-name {font-size: 40px; font-weight: bold;}
.gywm-block .line {background-color: var(--activeColor);width: 500px; height: 10px;}
.gywm-block .img img {max-width: 100%;}

.lang {position: relative;cursor: pointer;display: inline-block;}
.lang img {height: 16px;width: 24px;margin-right: 8px;}
.lang ul {position: absolute;z-index: 3;width: 120px;box-shadow: 0 2px 5px rgba(0,0,0,.2);background: rgba(255, 255, 255, .7);
    display: none;}
.lang ul a {display: block;padding: 0 10px;border-bottom: 1px solid #ddd;}
.lang:hover ul {display:block;}

@media only screen and (min-width: 1440px)  {
	/* .layui-container {width: 1300px;} */
}
@media only screen and (min-width: 1200px) and (max-width:1439px)  {
	/* .layui-container {width: 1170px;} */
}
@media only screen and (min-width: 992px) and (max-width:1199px)  {
	/* .layui-container {width: 970px;} */
}
@media only screen and (min-width: 768px) and (max-width:991px)  {
	/* .layui-container {width: 750px;} */
}
@media only screen and (max-width: 767px)  {
	/* .layui-container {width: auto;} */
}