@charset "utf-8";
/*---------------- global ----------------*/
.lg {
	display: block;
}

img.lg {
	display: block !important;
}

.xs {
	display: none;
}

img.xs {
	display: none !important;
}

.layout-padding {
	padding-left: 4.5313%; /* 87 */
	padding-right: 4.5313%; /* 87 */
}

.container {
	width: 90.9375%; /* 1746 */
}

.main {
	width: 76.5625vw; /* 1470 */
}

#wrapper {
	background: #ffffff;
}


/*---------------- header ----------------*/
.header {
	width: 100%;
	height: 4.6875vw; /* 90 */
	display: flex;
	align-items: center;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 2000;
	overflow: visible;
	background: rgba(255, 255, 255, 0);
	transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-webkit-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-moz-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-ms-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
}

.header a {
	color: #ffffff;
	font-size: 1.25vw; /* 24 */
	font-weight: 400;
}

.header a:hover, .header a.active {
	color: #D13433;
	font-weight: 700;
	font-weight: 600;
}

.header .logo {
	width: auto;
	height: 2.0313vw; /* 39 */
	position: relative;
	z-index: 2100;
}

.header .logo a {
	width: 100%;
	height: 100%;
	display: block;
	position: relative;
}

.header .logo img {
	width: auto;
	height: 100%;
	display: block;
	position: relative;
	transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-webkit-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-moz-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-ms-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
}

.header .logo img.black {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	opacity: 0;
}

.nav {
	width: auto;
	height: auto;
	margin-left: 10.3125vw; /* 198 */
}

.nav li {
	width: auto;
	height: auto;
	float: left;
	margin-right: 5vw; /* 96 */
}


.bar {
	margin-left: auto;
	display: flex;
	align-items: center;
}

.bar .lan {
	width: 1.4583vw; /* 28 */
	height: 1.4583vw; /* 28 */
	display: block;
	background: url(../images/icon_lan.png) no-repeat 0 0 / 100%;
}

.bar .lan:hover {
	background-image: url(../images/icon_lan_red.png);
}

.bar .link {
	margin-left: 1.25vw; /* 24 */
	padding-left: 0.9375vw; /* 18 */
	position: relative;
}

.bar .link::before {
	content: " ";
	width: 2px;
	height: 1.4583vw; /* 28 */
	margin-top: -0.7292vw; /* 14 */
	display: block;
	position: absolute;
	left: 0;
	top: 50%;
	background: #ffffff;
	transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-webkit-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-moz-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-ms-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
}

/* header fixed */
.header.fixed {
	background: #ffffff;
}

.header.fixed .logo img.white {
	opacity: 0;
}

.header.fixed .logo img.black {
	opacity: 1;
}

.header.fixed a {
	color: #3E3A39;
}

.header.fixed a.active, .header.fixed a:hover {
	color: #D13433;
}

.header.fixed .bar .lan {
	background-image: url(../images/icon_lan_black.png);
}

.header.fixed .bar .lan:hover {
	background-image: url(../images/icon_lan_red.png);
}


.header.fixed .bar .link::before {
	background: #3E3A39;
}

/*---------------- footer ----------------*/
.footer {
	padding: 0 3.125vw; /* 0 60 */
	background: #3E3A39;
}

.footer a {
	color: #ffffff;
	font-size: 1.25vw; /* 24 */
}

.footer a:hover {
	color: #D13433;
}

.ft-top {
	margin-top: 1.875vw; /* 36 */
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.ft-top .left img {
	height: 0.625vw; /* 12 */
}

.ft-top .right {
	line-height: 1.7188vw; /* 33 */
}

.ft-top .right a {
	float: left;
	margin-left: 3.125vw; /* 60 */
}

.ft-top .right img {
	width: 1.7188vw; /* 33 */
	height: auto;
}

.copyright {
	margin-top: 1.0938vw; /* 21 */
	padding: 1.5625vw 0; /* 30 */
	border-top: 1px solid #ffffff;
	text-align: right;
}

.copyright, .copyright a {
	color: #ffffff;
	font-size: 0.7813vw; /* 15 */
}

/*---------------- home ----------------*/
/* home product */
.home-product {
	padding: 5.1563vw 0 6.25vw 0; /* 99 120 */
}


.home-product .left {
	width: 47.7083vw; /* 916 */
}

.home-product .left img, .home-product .left video {
	width: 100%;
}

.home-product .right {
	width: 32.1875vw; /* 618 */
	margin: 4.0625vw 7.3438vw 0 0; /* 78 141 */
}

.home-product .right .content {
	margin: 3.125vw 0 2.0313vw 0; /* 60 39 */
}

/* home counter */
.home-counter {
	margin-bottom: 4.6875vw; /* 90 */
}

.home-counter .counter-list {
	padding: 2.1875vw 7.5vw ; /* 42 144 */
}

/* home case */
.home-case {
	margin-top: 5.9375vw; /* 114 */
	padding-top: 4.6875vw; /* 90 */
	padding-bottom: 4.6875vw; /* 90 */
	background: #EBEAE9;
}

.home-case-info {
	margin-bottom: 4.6875vw; /* 90 */
	padding: 0 3.9063vw 0 6.875vw; /* 75 132 */
}

.home-case-info .content {
	float: right;
}

.home-case-info .content .btn {
	margin-top: 2.8125vw; /* 54 */
}

/* home about */
.home-about-intro {
	margin: 5.625vw 0 7.0313vw 0; /* 108 135 */
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: #3E3A39;
}

.home-about-intro .left {
	width: 36.5625vw; /* 702 */
	height: auto;
	margin-left: 4.0625vw; /* 78 */
}

.home-about-intro .left .content {
	margin: 3.125vw 0 2.5vw 0; /* 60 48 */
}

.home-about-intro .right {
	width: 45.9375vw; /* 882 */
}

.home-about-video {
	margin-bottom: 7.8125vw; /* 150 */
}

.home-about-video .title {
	margin-bottom: 4.0625vw; /* 78 */
}

.home-about-video video {
	display: block;
}

/*---------------- list ----------------*/
/* counter list */
.counter-list {
	display: flex;
	justify-content: space-between;
}

.counter-list .item h2 {
	position: relative;
	color: #3E3A39;
	font-size: 1.875vw; /* 36 */
	font-weight: 600;
	line-height: 3.75vw; /* 72 */
}

.counter-list .item h2 span, .counter-list .item h2 i {
	color: #D44140;
	font-size: 3.75vw; /* 72 */
	font-weight: 600;
	line-height: 3.75vw; /* 72 */
}

.counter-list .item h2 span {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	text-align: right;
}

.counter-list .item h2 i {
	opacity: 0;
	font-style: normal;
}

.counter-list .item p {
	color: #3E3A39;
	font-size: 1.0417vw; /* 20 */
	line-height: 1.25vw; /* 24 */
}


/* products list */
.products-list .item {
	width: 100%;
	display: flex;
}

.products-list .item .thumb {
	width: 50%;
	height: auto;
}

.products-list .item .info {
	width: 50%;
	height: auto;
	padding: 0 5.625vw; /* 108 */
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.products-list .item:nth-child(2n) .thumb {
	order: 2;
}

.products-list .item:nth-child(2n) .info {
	order: 1;
}

/* case list */
.case-list .item {
	width: 21.875vw; /* 420 */
	height: 23.1771vw; /* 445 */
	float: left;
	margin: 0 calc((100% - 87.5vw) / 3) calc((100% - 87.5vw) / 3) 0; /* 17 */
	position: relative;
}

.case-list .item:nth-child(4n) {
	margin-right: 0;
}

.case-list .item .mask {
	width: 100%;
	height: 100%;
	padding: 2.1875vw; /* 442 */
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	background: rgba(62, 58, 57, 0.8);
	opacity: 0;
	transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-webkit-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-moz-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-ms-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
}

.case-list .item .mask .title {
	width: 100%;
	transform: translate3d(0, 1.5625vw, 0); /* 30 */
	-webkit-transform: translate3d(0, 1.5625vw, 0);
	-moz-transform: translate3d(0, 1.5625vw, 0);
	-ms-transform: translate3d(0, 1.5625vw, 0);
	transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-webkit-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-moz-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-ms-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
}

.case-list .item .thumb img {
	transition: all .2s linear;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	-ms-transition: all .2s linear;
}

.case-list .item:hover .mask {
	opacity: 1;
} 

.case-list .item:hover .mask .title {
	transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
} 

.case-list .item:hover .thumb img {
	transform: scale(1.1,1.1);
	-webkit-transform: scale(1.1,1.1);
	-moz-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
}


/*---------------- products ----------------*/
.products-intro {
	margin-top: 7.8125vw; /* 150 */
	padding-bottom: 5.1563vw; /* 99 */
	border-bottom: 1px solid #D8D8D8;
}

.products-intro .title {
	margin-bottom: 3.125vw; /* 60 */
}

.products-intro .content img {
	width: 36.5625vw; /* 702 */
	float: right;
	margin: 0 0 1.5625vw 2.3438vw; /* 30 45 */
}

.products-page-content {
	margin-top: 5vw; /* 96 */
}

.products-page-content .left {
	width: 35.1563vw; /* 675 */
	margin-right: 6.25vw; /* 120 */
}

.products-page-content .right {
	width: calc(100% - 41.4063vw);
	margin-top: 4.6875vw; /* 90 */
}

.products-page-content .right .title {
	margin-bottom: 1.5625vw; /* 30 */
}

.products-page-list {
	margin: 7.8125vw 0 9.375vw 0; /* 150 180 */
}

/*---------------- case ----------------*/
.case-intro {
	padding: 6.25vw 0 2.5vw 0; /* 120 48 */
}

.case-intro .title {
	margin-bottom: 2.1875vw; /* 42 */
}

.case-page-list .item {
	width: 100%;
	height: auto;
	padding: 3.125vw 0; /* 60 */
	border-top: 1px solid #D8D8D8;
	display: flex;
	justify-content: space-between;
}

.case-page-list .item:first-child {
	border: 0;
}

.case-page-list .item .thumb {
	width: 38.2813vw; /* 735 */
}

.case-page-list .item .info {
	width: 34.0625vw; /* 654 */
}

.case-page-list .item .info .title {
	margin-bottom: 1.5625vw; /* 30 */
}

.case-page-list .item:nth-child(2n) .thumb {
	order: 2;
}

.case-more {
	padding: 1.5625vw 0 4.6875vw 0; /* 30 90 */
	display: flex;
	justify-content: center;
}

/*---------------- about ----------------*/
.about-intro {
	padding: 5.9375vw 0 3.9063vw 0; /* 114 75 */
}

.about-intro .title {
	margin-bottom: 2.0313vw; /* 39 */
}

.about-intro .content img {
	width: 32.1875vw; /* 618 */
	float: right;
	margin: 0 0 2.5vw 5vw; /* 48 96 */
}

.history {
	padding: 0 0 12.5vw 0; /* 240 */
	background: #EBEAE9;
}

.history .title {
	margin: 3.125vw 0; /* 60 */
}

/* history swiper */
.history-year {
	height: 4.0625vw; /* 78 */
	margin-bottom: 4.6875vw; /* 90 */
	background: #F9F9F9;
}

.history-year .swiper {
	width: calc(100% - 16.5625vw); /* - 318 */
	margin: 0 auto;
}

.history-year .swiper::before, .history-year .swiper::after {
	content: " ";
	width: 2px;
	height: 100%;
	display: block;
	background: #F9F9F9;
	position: absolute;
	top: 0;
	z-index: 200;
}

.history-year .swiper::before {
	left: 0;
}

.history-year .swiper::after {
	right: 0;
}

.history-year .swiper-slide {
	color: #3E3A39;
	font-size: 1.5625vw; /* 30 */
	text-align: center;
	line-height: 4.0625vw; /* 78 */
	cursor: pointer;
}

.history-year .swiper-slide.swiper-slide-thumb-active {
	color: #D13433;
	font-weight: 500;
}

.history-year .swiper-slide::before {
	content: " ";
	width: 1px;
	height: 1.25vw; /* 24 */
	display: block;
	margin-top: -0.625vw; /* 12 */
	background: #837E7E;
	position: absolute;
	left: 0;
	top: 50%;
}

.history-prev, .history-next {
	width: 2.5vw; /* 48 */
	height: 2.5vw;
	margin-top: -1.25vw; /* 24 */
	position: absolute;
	top: 50%;
	background: #837E7E no-repeat center center / 0.3906vw; /* 7.5 */
	border-radius: 50%;
	cursor: pointer;
	transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-webkit-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-moz-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
	-ms-transition: all .2s cubic-bezier(0.54, 0, 0.19, 1.08);
}

.history-prev:hover, .history-next:hover {
	background-color: #D13433;
}

.history-prev {
	left: 2.5vw; /* 48 */
	background-image: url(../images/history_prev.png);
}

.history-next {
	right: 2.5vw; /* 48 */
	background-image: url(../images/history_next.png);
}

.history-info .item .thumb {
	width: 31.25vw; /* 600 */
	float: left;
}

.history-info .item .info {
	width: calc(100% - 34.375vw);
	float: right;
	color: #3E3A39;
}

.history-info .item .info h2 {
	width: 100%;
	float: left;
	margin: 0 0 1.5625vw 0; /* 30 */
}


/*---------------- contact ----------------*/
.contact-form {
	padding: 6.25vw 0 2.5vw 0; /* 120 48 */
}

.contact-form .title {
	margin-bottom: 3.125vw; /* 60 */
}

.contact-form ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.contact-form ul li {
	width: 22.1875vw; /* 426 */
	height: auto;
	margin-bottom: 2.5vw;
}

.contact-form ul li.full {
	width: 100%;
}

.contact-form ul li, .contact-form ul li input, .contact-form ul li textarea {
	color: #3E3A39;
	font-size: 1.25vw; /* 24 */
	line-height: 3.125vw;
}

.contact-form ul li input.error, .contact-form ul li textarea.error {
	border-color: #D13433;
}

.contact-form ul li input {
	width: 100%;
	border: 0;
	border-bottom: 2px solid #3E3A39;
}


.contact-form ul li input::placeholder {	
	color: #3E3A39;
}

.contact-form ul li textarea {
	width: 100%;
	height: calc(12.5vw + 4px);
	padding: 0.625vw; /* 12 */
	border: 2px solid #3E3A39;
	border-radius: 6px;
	line-height: 150%;
}

.contact-form ul li:last-child {
	display: flex;
	justify-content: center;
}

.contact {
	background: #EBEAE9;
}

.contact .title {
	margin-bottom: 4.375vw; /* 84 */
}

.contact .main {
	padding: 3.125vw 0 5vw 0; /* 60 96 */
}

.contact-info {
	display: flex;
	justify-content: space-between;
}

.contact-info ul {
	width: calc(50% - 2.1875vw);
	height: auto;
}

.contact-info ul li {
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 0.3125vw; /* 6 */
}

.contact-info ul li * {
	font-size: 1.25vw; /* 24 */
	line-height: 2.0833vw; /* 40 */
}

.contact-info ul li h2 {
	font-weight: 600;
}

.contact-info ul li h3 {
	width: 6.25vw; /* 120 */
	height: auto;
	float: left;
	margin-right: 2.1875vw; /* 42 */
}

/*---------------- home ----------------*/









/*---------------- home ----------------*/









/*---------------- home ----------------*/