html {position: relative;z-index: 4;}
.bgc-white {background-color: #fff !important;}
.body-box {overflow: hidden;}
.banner {position: relative;overflow: hidden;}
.banner a {display: block;height: 47.8125vw;max-height: 918px;background-position: center;background-repeat: no-repeat;-webkit-background-size: cover;background-size: cover;}
.banner .swiper-pagination-bullet {border-radius: 100px;width: 20px;transition: all .3s;}
.banner .swiper-pagination-bullet.swiper-pagination-bullet-active {border-radius: 100px;width: 22px;}
.theme-title {position: relative;height: 140px;z-index: 0;white-space: nowrap;max-width: 100%;}
.theme-title em {position: absolute;z-index: 2;font-size: 46px;opacity: .2;text-transform: uppercase;line-height: 110px;}
.theme-title h3 {position: absolute;z-index: 3;font-size: 30px;color: #111;line-height: 150px;padding: 0 1em;}
.theme-title.l em, .theme-title.l h3 {left: 0;text-align: left;}
.theme-title.r em, .theme-title.r h3 {right: 0;text-align: right;}
.theme-title.c em, .theme-title.c h3 {left: 50%;-ms-transform: translateX(-50%);-webkit-transform: translateX(-50%);transform: translateX(-50%);text-align: center;}
.mod-about {max-width: 850px;padding: 0 20px;margin: 0 auto 120px;}
.mod-products {max-width: 1200px;padding: 0 20px;margin: 0 auto 120px;}
.mod-case {max-width: 1200px;padding: 0 20px;margin: 0 auto 40px;}

.mod-team {max-width: 1200px;padding: 0 20px;margin: 0 auto 120px;}
.mod-news {max-width: 990px;padding: 0 20px;margin: 0 auto 40px;;}
.mod-about p {font-size: 15px;color: #888;line-height: 36px;}
.mod-about .more {color: #fff;width: 154px;height: 50px;line-height: 50px;text-align: center;border-radius: 6px;display: inline-block;text-transform: uppercase;}
.mod-about .theme-title::before {content: '';position: absolute;opacity: .2;width: 70px;height: 70px;border-radius: 70px;background-color: #ffb42b;left: -100px;top: 20px;z-index: 0;}
.mod-about .theme-title::after {content: '';position: absolute;opacity: .2;width: 0;height: 0;z-index: 0;right: -300px;top: 50px;border: 120px solid transparent;border-top: 120px solid #fd5030;border-left-width: 100px;border-right-width: 100px;-ms-transform: rotate(-45deg);-webit-transform: rotate(-45deg);transform: rotate(-45deg);}
.mod-products .theme-title::before {content: '';position: absolute;opacity: .1;width: 110px;height: 110px;border-radius: 20px;background-color: #ff31be;left: 48%;top: 0;z-index: 0;-ms-transform: rotate(-20deg);-webit-transform: rotate(-20deg);transform: rotate(-20deg);}
.mod-case .theme-title::before {content: '';position: absolute;opacity: .1;width: 110px;height: 110px;border-radius: 20px;background-color: #ff31be;left: 48%;top: 0;z-index: 0;-ms-transform: rotate(-20deg);-webit-transform: rotate(-20deg);transform: rotate(-20deg);}
.mod-team .theme-title::before {content: '';position: absolute;width: 80px;height: 80px;border-radius: 50%;box-shadow: 15px 15px 0 0 rgba(254, 87, 56, .8);opacity: .2;left: -30px;top: -30px;transform: rotate(90deg);}
.mod-news .theme-title::before {content: '';position: absolute;left: 0%;top: 5%;width: 50px;height: 50px;border-radius: 10px;opacity: .2;background-color: #FD5030;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.mod-news .theme-title::after {content: '';position: absolute;right: -10%;bottom: 0;width: 70px;height: 70px;border-radius: 90px;border: 20px solid #FFB42B;opacity: .2;}
.mod-products .hd {height: 60px;border-bottom: 1px solid #f2f2f2;line-height: 60px;}
.mod-products .hd .swiper-slide {padding: 0 17px;font-size: 14px;color: #111;position: relative;width: auto;cursor: pointer;text-align: center;}
.mod-products .hd .swiper-slide::after {content: '';position: absolute;bottom: 0;height: 6px;width: 0;left: 0;right: 0;margin: auto;transition: all .3s;}
.mod-products .hd .swiper-slide.swiper-slide-active::after, .mod-products .hd .swiper-slide.on::after {width: 30px;}
.mod-products .hd .swiper-wrapper {justify-content: end;}
.mod-products .bd {overflow: hidden;position: relative;}
.mod-products .bd ul {display: flex;flex-flow: row wrap;justify-content: flex-start;padding-top: 20px;}
.mod-products .bd li {width: 280px;flex-shrink: 0;background-color: #F2F2F2;margin: 0 20px 20px 0;overflow: hidden;text-align: center;transition: all .3s;position: relative;top: 0;border-radius: 4px;border: 1px solid #f2f2f2;}
.mod-products .bd li .img {display: block;position: relative;height: 0;padding-bottom: 80%;overflow: hidden;}
.mod-products .bd li .img img {position: absolute;top: 0;bottom: 0;left: 0;right: 0;max-width: 100%;max-height: 100%;margin: auto;}
.mod-products .bd li .text {display: block;height: 50px;position: relative;background-color: #fff;}
.mod-products .bd li .text .name {display: block;font-size: 15px;color: #222;white-space: nowrap;line-height: 30px;padding: 10px;height: 50px;overflow: hidden;text-overflow: ellipsis;}
.mod-products .bd li .text .price {height: 20px;line-height: 20px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.mod-products .bd li .text .price b {font-weight: 700;font-size: 20px;margin: 0 5px;}
.mod-products .bd li .text::before {content: '';position: absolute;bottom: 100%;left: 0;right: 0;height: 30px;background-image: url(../images/s.png);background-repeat: repeat-x;background-position:bottom center;transition: all .8s;}

.mod-case .hd {height: 60px;border-bottom: 1px solid #f2f2f2;line-height: 60px;}
.mod-case .hd .swiper-slide {padding: 0 17px;font-size: 14px;color: #111;position: relative;width: auto;cursor: pointer;text-align: center;}
.mod-case .hd .swiper-slide::after {content: '';position: absolute;bottom: 0;height: 6px;width: 0;left: 0;right: 0;margin: auto;transition: all .3s;}
.mod-case .hd .swiper-slide.swiper-slide-active::after, .mod-case .hd .swiper-slide.on::after {width: 30px;}
.mod-case .hd .swiper-wrapper {justify-content: end;}
.mod-case .bd {overflow: hidden;position: relative;}
.mod-case .bd ul {display: flex;flex-flow: row wrap;justify-content: flex-start;padding-top: 20px;}
.mod-case .bd li {width: 280px;flex-shrink: 0;background-color: #F2F2F2;margin: 0 20px 20px 0;overflow: hidden;text-align: center;transition: all .3s;position: relative;top: 0;border-radius: 4px;border: 1px solid #f2f2f2;}
.mod-case .bd li .img {display: block;position: relative;height:200px; overflow: hidden;}
.mod-case .bd li .img img {position: absolute;top: 0;bottom: 0;left: 0;right: 0;max-width: 100%;max-height:100%;margin: auto;}
.mod-case .bd li .text {display: block;height: 50px; line-height:50px;position: relative;background-color: #fff;}
.mod-case .bd li .text .name {display: block;font-size: 15px;color: #222;white-space: nowrap;line-height: 30px;padding: 10px;height: 50px;overflow: hidden;text-overflow: ellipsis;}
.mod-case .bd li .text .price {height: 20px;line-height: 20px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.mod-case .bd li .text .price b {font-weight: 700;font-size: 20px;margin: 0 5px;}
.mod-case .bd li .text::before {content: '';position: absolute;bottom: 100%;left: 0;right: 0;height: 30px;background-position: 0 bottom;transition: all .8s;}

.mod-team .cont {width: 100%;overflow: hidden;}
.mod-team .swiper-slide {display: flex;flex-flow: row nowrap;align-items: stretch;width: auto;max-width: 410px;}
.mod-team .img {width: 120px;height: 120px;border-radius: 120px;overflow: hidden;position: relative;background-color: #f9f9f9;flex-shrink: 0;}
.mod-team .img img {position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;max-width: 60%;max-height: 60%;z-index: 1;}
.mod-team .img::after {content: '';position: absolute;z-index: 0;top: 0;bottom: 0;left: 0;right: 0;width: 99%;height: 99%;border: 2px solid transparent;border-top: 0px solid #009688;border-left: none;margin: auto;border-radius: 200px;transition: all .3s;opacity: 0;-ms-animation: rotate 2s linear infinite;-webkit-animation: rotate 2s linear infinite;animation: rotate 2s linear infinite;}
.mod-team .swiper-slide:hover .img::after {border-top: 2px solid #009688;opacity: 1;}
@keyframes rotate {from {transform: rotate(0);}
	to {transform: rotate(359deg);}
}
.mod-team .text {flex: 1;margin-left: 20px;}
.mod-team .text h4 {display: block;height: 40px;line-height: 40px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;font-size: 17px;color: #222;}
.mod-team .text p {display: block;line-height: 20px;font-size: 14px;color: #777;}
.list-news .item {display: flex;flex-flow: row nowrap;align-items: stretch;justify-content: space-around;-webkit-justify-content: space-around;margin-bottom: 40px;}
.list-news .img {flex-shrink: 0;width: 450px;height: 323px;border-radius: 10px;position: relative;display: block;overflow: hidden;background-position: center;background-repeat: no-repeat;-webkit-background-size: cover;background-size: cover;margin: 0 20px 20px;box-shadow: 15px 10px 0 0 rgba(238, 247, 235, .95);display: flex;align-items: center;}
.list-news .img span {position: absolute;right: 20%;width: 70%;text-align: right;color: #fff;font-weight: 700;font-size: 20px;line-height: 1;z-index: 3;white-space: nowrap;text-shadow: 1px 1px 3px rgba(0, 0, 0, .2);}
.list-news .img span::before {content: '';position: absolute;z-index: -1;width: 0;height: 40px;right: -webkit-calc(-20% + 163px);right: calc(-20% + 163px);box-shadow: 0 60px 0 3px #fff, 0 -60px 0 3px #fff;top: 0;bottom: 0;margin: auto;}
.list-news .img span::after {content: '';position: absolute;z-index: -1;width: 160px;height: 160px;border: 6px solid #fff;right: -20%;top: 0;bottom: 0;margin: auto;border-left: 0;box-shadow: 2px 0 2px 0 rgba(0, 0, 0, .1);}
.list-news .text {flex: 1;padding: 0 20px;}
.list-news .tit {display: block;line-height: 40px;height: 50px;margin-bottom: 20px;overflow: hidden;position: relative;text-overflow: ellipsis;white-space: nowrap;font-size: 17px;font-weight: 700;}
.list-news .tit::after {content: '';position: absolute;bottom: 0;left: 0;width: 40%;height: 2px;background-color: #eaeaea;transition: all .3s;}
.list-news .text p {font-size: 14px;line-height: 30px;color: #777;text-indent: 2em;overflow: hidden;max-height: 22vw;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 7;overflow: hidden;}
.list-news .more {display: block;text-align: right;line-height: 50px;text-transform: uppercase;}
.footer-box {position: relative;}
.footer-box .footer {margin: 0 auto;max-width: 990px;text-align: center;display: flex;align-items: center;justify-content: center;width: 100%;position: relative;z-index: 2;padding: 10px;flex-flow: column;}
.footer-box ul {display: flex;flex-flow: row nowrap;justify-content: center;width: 100%;padding: 0 40px 40px;border-bottom: 4px solid rgba(255, 255, 255, .2);}
.footer-box .copyright {font-size: 15px;color: #fff;line-height: 30px;padding: 20px;opacity: .6;}
.footer-box ul li {flex: 1;text-align: center;}
.footer-box ul .hd i {font-size: 70px;}
.footer-box .top {position: relative;z-index: 0;overflow: hidden;width: 100%;height: 220px;}
.footer-box .top::before {content: '';position: absolute;z-index: 0;width: 0;top: 0;right: 0;left: 0;height: 0;margin: auto;border-top: 110px solid #fff;border-left: 50vw solid #fff;border-bottom: 110px solid transparent;border-right: 50vw solid transparent;}
.inside-sub {height: 60px;line-height: 60px;display: flex;flex-flow: row nowrap;width: 100%;align-items: center;justify-content: center;margin-top: -30px;z-index:20;position: relative; padding: 0 40px;overflow-x: auto;}
.inside-sub a {display: block;padding: 0 20px;color: #fff;background-color: rgba(0, 0, 0, .08);white-space: nowrap;font-size: 14px;max-width: 50%;text-align: center;width: 300px;}
.inside-sub a.on{background-color: rgba(0,0,0,.12)}
.crumbs{padding: 0 10px; max-width: 1200px; margin: 0 auto;height: 50px;line-height: 50px;font-size: 14px;color: #999;text-align: right; border-bottom: 1px solid #e9e9e9;background-color: #fff;position: relative;z-index: 1;}
/* 媒体查询 */
@media (min-width:769px) {a {transition: all .2s;}
	.inside-sub a:hover {background-color: rgba(255, 255, 255, .1);}
	.header-box~.body-box {padding-top: 120px;}
	.header-box {background-color: rgba(255, 255, 255, .94);position: fixed;z-index: 30;top: 0;left: 0;right: 0;display: flex;align-items: center;box-shadow: 0 0 10px 0 rgba(0, 0, 0, .06);}
	.header-box .logo {position: absolute;left: 0;right: 0;top: 0;bottom: 0;margin: auto;width: 220px;height: 60px;display: flex;align-items: center;justify-content: center;text-align: center;z-index: 2;}
	.header-box .logo img {max-width: 100%;max-height: 100%;display: block;}
	.header-box .nav {display: flex;align-items: center;justify-content: center;width: 100%;padding: 0 20px;position: relative;z-index: 1;}
	.header-box .nav .item a {display: block;line-height: 120px;width: 175px;text-align: center;position: relative;z-index: 1;white-space: nowrap;}
	.header-box .fa-bars {display: none;}
	.header-box .nav .item {position: relative;display: block;z-index: 1;}
	.header-box .nav .item::before {content: '';position: absolute;z-index: 0;bottom: 0;left: 0;right: 0;height: 0;transition: all .2s;}
	.header-box .nav>li {position: relative;min-width: 120px;}
	.header-box .nav>li:hover .item::before {height: 100%;}
	.header-box .nav>li:hover .item a {color: #fff;}
	.header-box .nav>li .item a::after {content: '';position: absolute;height: 3px;width: 0;border-radius: 5px;left: 0;right: 0;margin: auto;bottom: 22px;z-index: 0;transition: all .3s;}
	.header-box .nav>li:hover .item a::after {width: 40px;}
	.header-box .nav .sub {position: absolute;top: 100%;left: 0;width: 100%;overflow: hidden;max-height: 0;transition: all .2s;z-index: 4;line-height: 40px;}
	.header-box .nav>li:hover .sub {max-height: 800px;}
	.header-box .nav .sub a {display: block;text-align: center;color: #fff;font-size: 14px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
	.mod-about .btns {text-align: right;margin-top: 60px;}
	.mod-about .more i, .list-news .more i {transition: all .3s;}
	.mod-about .more:hover i, .list-news .more:hover i {margin-left: 15px;}
	.mod-products .bd li:hover .text::before {background-position: 100% bottom;}
	.mod-products .bd li:hover {box-shadow: 0 0 10px 0 rgba(0, 0, 0, .07);border: 1px solid rgba(102, 191, 62, .4);top: -1px;}
	.mod-products .bd li:hover .img img {transform: scale(1.08);}
	.mod-products .bd li .img img {transition: all .7s;}

	.mod-case .bd li:hover .text::before {background-position: 100% bottom;}
	.mod-case .bd li:hover {box-shadow: 0 0 10px 0 rgba(0, 0, 0, .07);border: 1px solid rgba(102, 191, 62, .4);top: -1px;}
	.mod-case .bd li:hover .img img {transform: scale(1.08);}
	.mod-case .bd li .img img {transition: all .7s;}

	.mod-news .img span {line-height: 35px;height: 35px;display: flex;flex-flow: row nowrap;justify-content: end;align-items: center;}
	.mod-news .img span em {font-weight: inherit;position: relative;}
	.mod-news .item:hover .img em {animation: text 1s linear infinite;}
	.list-news .item:hover .img {box-shadow: 15px 10px 0 0 rgba(238, 247, 235, .8), 0 0 10px 0 rgba(0, 0, 0, .2);background-position: right;}
	.list-news .item:nth-child(2n) {flex-flow: row-reverse nowrap;}
	.footer-box li {position: relative;}
	.footer-box li:hover .hd {color: #fff;}
	.footer-box li .hd {transition: all .3s;text-shadow: 0 -1px 0 rgba(0, 0, 0, .07);}
	.footer-box .bd {position: absolute;padding: 20px;background-color: #fff;border-radius: 8px;bottom: 100%;box-shadow: 0 0 10px 0 rgba(0, 0, 0, .08);width: 400px;left: 50%;margin: 0 0 20px -200px;display: flex;text-align: center;align-items: center;justify-content: center;min-height: 300px;line-height: 1.6;color: #777;font-size: 20px;opacity: 0;transition: all .3s;transform: scale(0);transform-origin: center bottom;flex-flow: column;}
	.footer-box .bd::after {content: '';position: absolute;left: 0;right: 0;margin: auto;bottom: -20px;width: 0;height: 0;border: 10px solid transparent;border-top: 10px solid #fff;}
	.footer-box li:hover .bd {opacity: 1;transform: scale(1);}
	@keyframes text {from {transform: rotate(0);}
		25% {transform: rotate(10deg);}
		50% {transform: rotate(0);top: -1px;}
		75% {transform: rotate(-10deg);}
		to {transform: rotate(0);}
	}
}
@media (min-width:1199px) {
	.mod-products .bd li {width: calc(25% - 15px);}
	.mod-products .bd li:nth-child(4n) {margin-right: 0;}
	.mod-case .bd li {width: calc(25% - 15px);}
	.mod-case .bd li:nth-child(4n) {margin-right: 0;}
}
@media (max-width:1200px) and (min-width:769px) {
	.mod-products .bd li {width: calc(33.333% - 14px);}
	.mod-products .bd li:nth-child(3n) {margin-right: 0;}
	.mod-case .bd li {width: calc(33.333% - 14px);}
	.mod-case .bd li:nth-child(3n) {margin-right: 0;}
	.list-news .img {width: 340px;height: 244px;}
	.list-news .img span {font-size: 16px;}
}
@media (max-width:1200px) {html {z-index: 3;}
}
@media (max-width:1024px) {html {z-index: 2;}
	.header-box .nav .item a {width: 130px;}
}
@media (max-width:768px) {html {z-index: 1;}
	.header-box {position: relative;height: 60px;}
	.header-box .logo img {position: absolute;left: 10px;top: 0;bottom: 0;margin: auto;max-width: calc(100% - 100px);max-height: -webkit-calc(100% - 20px);max-height: calc(100% - 20px);}
	.header-box .fa-bars {position: absolute;display: block;right: 10px;height: 40px;width: 40px;line-height: 40px;text-align: center;cursor: pointer;font-size: 30px;margin: auto;top: 0;bottom: 0;color: #aaa;}
	.header-box .nav {position: absolute;display: none;}
	.mod-products .bd li {width: calc(50% - 10px);}
	.mod-products .bd li:nth-child(2n) {margin-right: 0;}
	.mod-products .hd .swiper-wrapper {justify-content: left;}
	.mod-products {padding: 0 10px;}
	.mod-products .hd .swiper-wrapper .swiper-slide {flex: 1;white-space: nowrap;padding: 0;font-size: 13px;}

	.mod-case .bd li {width: calc(50% - 10px);}
	.mod-case .bd li:nth-child(2n) {margin-right: 0;}
	.mod-case .hd .swiper-wrapper {justify-content: left;}
	.mod-case {padding: 0 10px;}
	.mod-case .hd .swiper-wrapper .swiper-slide {flex: 1;white-space: nowrap;padding: 0;font-size: 13px;}

	.theme-title {height: 80px;}
	.theme-title em {line-height: 60px;font-size: 34px;}
	.theme-title h3 {line-height: 90px;font-size: 20px;}
	.mod-about .theme-title::before {left: -10px;}
	.mod-about .theme-title::after {right: -200px;}
	.mod-team .img {width: 90px;height: 90px;}
	.mod-team .swiper-slide {max-width: 100%;}
	.list-news .item {flex-flow: column nowrap;-webkit-justify-content: stretch;justify-content: stretch;}
	.list-news .img {width: 100%;margin: 0;padding: 0;padding-bottom: 71.778%;}
	.list-news .img span {top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);}
	.list-news .tit {margin-top: 20px;}
	#mask {position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 1000;background-color: rgba(0, 0, 0, .6);cursor: pointer;transition: all .3s;}
	.header-box.menu {position: fixed;z-index: 1020;top: 0;right: 0;width: 80%;height: 100%;background-color: #fff;box-shadow: 0 0 10px 0 rgba(0, 0, 0, .5);display: flex;flex-flow: column nowrap;background-color: #f6f6f6;}
	.header-box.menu .fa-bars {display: none;}
	.header-box.menu .logo img {position: absolute;display: block;text-align: center;left: 0;right: 0;max-width: 100%;max-height: 100%;}
	.header-box.menu .logo {flex-shrink: 0;height: 60px;display: block;line-height: 50px;position: relative;margin-bottom: 20px;background-color: #fff;}
	.header-box.menu .nav {display: block;position: relative;width: 100%;flex: 1;overflow-y: auto;overflow-x: hidden;padding: 10px;background-color: #fff;}
	.header-box.menu .nav>li {height: 50px;line-height: 50px;border-bottom: 1px solid #eee;position: relative;}
	.header-box.menu .nav>li a {display: block;padding: 0 20px;text-indent: 20px;width: 100%;}
	.header-box.menu .nav .sub {position: absolute;top: 0;left: 110%;width: 100%;height: 100%;background-color: #fff;z-index: 10;transition: all .1s;cursor: pointer;}
	.header-box.menu .nav .sub li {position: relative;z-index: 3;background-color: #fff;border-top: 1px solid #eee;}
	.header-box.menu .item {display: block;}
	#mainNav .p_sub::after {content: '';top: 0;bottom: 0;left: 0;right: 0;width: 100%;height: 100%;z-index: 4;opacity: 0;position: absolute;cursor: pointer;}
	#mainNav .p_sub::before {content: '';position: absolute;width: 10px;height: 10px;border: 1px solid transparent;border-top: 1px solid #aaa;border-right: 1px solid #aaa;right: 10px;top: 0;bottom: 0;margin: auto;transform: rotate(45deg);z-index: 0;}
	#mainNav .p_sub.on {position: static;}
	#mainNav .p_sub.on .sub {left: 0;}
	#mainNav .back {text-indent: 20px;color: #aaa;}
	#mainNav .back i {margin-right: 10px;}
	.mod-about .btns {text-align: center;margin-top: 20px;}
	.mod-about {max-width: 100%;padding: 0 10px;margin: 0 auto 40px;}
	.mod-products {max-width: 100%;padding: 0 10px;margin: 0 auto 40px;}
	.mod-case {max-width: 100%;padding: 0 10px;margin: 0 auto 40px;}
	.mod-team {max-width: 100%;padding: 0 10px;margin: 0 auto 40px;}
	.mod-news {max-width: 100%;padding:0px 20px 0 10px;margin: 0 auto 40px;}
	.footer-box .top {display: none;}
	.footer-box ul {flex-flow: column nowrap;color: #fff;padding: 20px;line-height: 1.6;}
	.footer-box ul .hd i {font-size: 24px;color: #fff;line-height: 1;}
	.footer-box ul .hd {margin-bottom: 10px;}
	.footer-box ul .bd {padding: 10px;margin-bottom: 20px;}
}