/* img scale */
.factory_tab li{
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}
.about_left_pic .big_pic:hover img{
	transform: scale(1.08);
	-webkit-transform: scale(1.08);
	-moz-transform: scale(1.08);
	-o-transform: scale(1.08);
}

@media only screen and (max-width: 1300px) {
	.web_main{zoom: 0.9;}
}
@media only screen and (max-width: 980px) {
	.web_main{zoom: 1;}
}

/* about_info */
.about_info .info_desc{margin-top: 2.5%;}
.about_info .info_desc .brief{width: 48%; color: #666; line-height: 28px;}

.about_img_txt{margin-top: 4%;}
.about_img_txt .img_item{width: 48%;}
.about_img_txt .img_item lite-youtube{display: block; border-radius: 24px;}
.about_img_txt .img_item .pic{padding-bottom: 74%; border-radius: 24px;}
.about_img_txt .txt_item{width: 48%; text-align: left;}
.about_img_txt .txt_item .brief{margin-top: 20px;}
.about_img_txt .txt_item .brief_style{padding-left: 24px; position: relative;}
.about_img_txt .txt_item .brief_style::before{position: absolute; width: 5px; content: ''; top: 5px; bottom: 5px; background: var(--commonColor); left: 0;}

@media only screen and (max-width: 1450px) {
	.about_info .info_top .title{font-size: 44px;}
}
@media only screen and (max-width: 1300px) {
	.about_info .info_top .title{font-size: 36px;}
}
@media only screen and (max-width: 980px) {
	.about_info{padding-top: 20px;}
	.about_info .info_desc{flex-direction: column;}
	.about_info .info_desc .brief{width: 100%;}
	.about_info .info_desc .brief:nth-child(n+2){margin-top: 20px;}
	.about_img_txt{flex-direction: column; margin-top: 30px;}
	.about_img_txt .img_item{width: 100%;}
	.about_img_txt .txt_item{margin-top: 20px; width: 100%;}
	.about_img_txt .txt_item .brief{margin-top: 10px;}
}

/* home_advantage */
.home_advantage{overflow: hidden; background: #FAF9F5; padding: 5% 0;}
.home_advantage .web_th .brief{margin: 20px 0;}
.advantage_ul{margin-top: 3%;}
.advantage_ul .adv_item{width: 22%; margin-right: 4%; text-align: center;}
.advantage_ul .adv_item:nth-child(4n){margin-right: 0;}
.advantage_ul .adv_item:nth-child(n+5){margin-top: 3%;}
.advantage_ul .adv_item .item_icon{width: 130px; height: 117px; background: url(../img/bg4.png) no-repeat center; overflow: hidden; margin: 0 auto; background-size: 100% 100%;}
.advantage_ul .adv_item .item_icon img{display: block; margin: 26px auto 0; height: 64px; width: auto;}
.advantage_ul .adv_item .title{font-size: 18px; line-height: 1.3; margin: 28px 0 14px; text-transform: uppercase; font-family: 'Fredoka One-Regular';}
.advantage_ul .adv_item .brief{color: #666; line-height: 26px;}
.advantage_ul .adv_item:hover .item_icon{animation: swing 0.5s;}

@media only screen and (max-width: 1300px) {
	.advantage_ul .adv_item .item_icon{width: 110px; height: 99px;}
	.advantage_ul .adv_item .item_icon img{height: 59px; margin-top: 20px;}
}
@media only screen and (max-width: 1200px) {
	.advantage_ul .adv_item{width: 48%;}
	.advantage_ul .adv_item:nth-child(2n){margin-right: 0;}
	.advantage_ul .adv_item:nth-child(n+3){margin-top: 2.6%;}
	.advantage_ul .adv_item .title{margin: 20px 0 10px;}
}
@media only screen and (max-width: 980px) {
	.home_advantage{padding: 30px 0;}
	.home_advantage .web_th .brief{margin: 10px 0;}
	.advantage_ul{margin-top: 22px;}
	.advantage_ul .adv_item{width: 100%; margin-right: 0;}
	.advantage_ul .adv_item:nth-child(n+2){margin-top: 20px;}
	.advantage_ul .adv_item .item_icon{width: 76px; height: 76px;}
	.advantage_ul .adv_item .item_icon img{height: 30px; margin-top: 22px;}
	.advantage_ul .adv_item .title{margin: 16px 0 8px;}
}

/* about_history */
.about_history{overflow: hidden;}
.history_inner{margin: 3% 0 0; position: relative; background-repeat: no-repeat; background-size: 50% auto; background-position: center;}

.history_item{width: 23%;
	display: grid; height: auto; position: relative; justify-items: center;
	grid-template-rows: 1fr 1fr; grid-gap: 42px; overflow: unset;
}
.history_item .steps{
	position: absolute; z-index: 2; width: 100%; left: 0; bottom: 0; top: 0;
	right: 0; height: -moz-fit-content; height: fit-content; margin: auto!important;
}
.steps_line{
	color: transparent; line-height: 10px; position: absolute;
	left: 0; right: 0; top: 0; bottom: 0;
}
.steps_line::before{
	content: ""; width: 100%; height: 3px; display: block; position: absolute;
	top: 0; bottom: 0; margin: auto; background-repeat: no-repeat; left: 0; background-color: var(--commonColor);
}
/* .history_item:last-child .steps_line::before{background-color: var(--commonColor);} */
.steps_dot{
	background-color: #fff; display: block; line-height: normal; font-size: 14px; width: 42px; height: 42px; z-index: 2; position: relative; border: 4px solid var(--commonColor); border-radius: 50%; position: relative; margin: 0 auto;
}
.steps_dot::before{position: absolute; width: 14px; height: 14px; border-radius: 50%; background: var(--commonColor); content: ''; left: 10px; top: 10px; transition: all 0.5s ease;}
.history_item:hover .steps_dot::before{width: 16px; height: 16px; left: 9px; top: 9px;}

.history_year{align-self: self-end; order: 1;}
.history_info .title, .history_info .brief{transition: all 0.4s,opacity 0.4s 0.9s,transform 0.4s 0.9s;}

.history_info{order: 2; padding: 60px 0 0 0; position: relative; width: 100%; margin: 0; z-index: 1;}
.history_info::before{width: 3px; content: ''; position: absolute; left: 50%; transform: translateX(-50%); top: 0; height: 60px; background: var(--commonColor);}

.history_item:last-child .history_info{width: 100%; margin: 0;}

.history_info .icon{height: 16px; width: 16px; border-radius: 50%; background: var(--commonColor); display: block; margin: 0 auto; order: 1;}
.history_info .title{font-weight: bold; font-size: 32px; color: var(--commonColor); margin: 14px 0 10px; line-height: 1.1; order: 2; text-align: center;}
.history_info .brief{color: #666; font-size: 16px; line-height: 28px; order: 3; flex: 1; position: relative;}

.history_item:nth-child(even) .history_info{padding: 0 0 60px;}
.history_item:nth-child(even) .history_info::before{top: unset; bottom: 0;}
.history_item:nth-child(even) .history_year{order: 3; align-self: self-start;}
.history_item:nth-child(even) .history_info .icon{order: 3;}
.history_item:nth-child(even) .history_info .brief{text-align: right; order: 1;}


.about_history .common-next, .about_history .common-prev{display: none !important;}
.about_history .common-pagination{display: none;}

@media only screen and (max-width: 1300px) {
	.history_info{padding: 40px 0 0;}
	.history_item:nth-child(even) .history_info{padding: 0 0 40px;}
	.history_info::before{height: 40px;}
	.history_info .title{font-size: 28px;}
}
@media only screen and (max-width: 980px) {
	.about_history .layout{padding: 0;}
	.about_history .web_th{padding: 0 15px;}
	.history_inner{margin: 20px 0 0; background-size: 65% auto;}
	.history_inner .swiper-slide{width: 100%;}
	.history_year{line-height: 20px; order: 2 !important;}
	.history_item .steps{bottom: unset; top: 0px;}
	.history_btn{position: relative; height: 50px; width: 120px; margin: 0 auto;}
	.history_info{order: 1 !important; width: 100%; margin: 0; padding: 66px 0 0;}
	.history_item .history_info::before{bottom: unset !important; top: 0 !important; height: 66px;}
	.history_item:nth-child(even) .history_info{padding: 66px 0 0;}
	.history_info .icon{order: 1 !important;}
	.history_info .title{font-size: 30px; order: 2 !important;}
	.history_info .brief{max-height: unset; order: 3 !important; text-align: center !important;}
	.history_item{grid-template-rows: 1fr 0; grid-gap: 0; padding: 0 15px;}
	/* .about_history .common-next, .about_history .common-prev{display: block; background-color: var(--commonColor);}
	.about_history .common-next{background-image: url(../images/next_w.png);}
	.about_history .common-prev{background-image: url(../images/prev_w.png);} */
}

/* about_factory */
.about_factory{overflow: hidden; background: #FAF9F5; padding: 5% 0;}
.factory_inner{margin-top: 2.6%; position: relative;}
.factory_inner .swiper-slide{width: calc((100% - 78px) / 4); margin-right: 26px;}
.factory_inner .factory_item .pic{padding-bottom: 100%; border-radius: 16px;}
.factory_inner .common-next,
.factory_inner .common-prev{width: 42px; height: 42px; margin-top: -21px; background-color: var(--commonColor); background-position: center; background-repeat: no-repeat; background-size: 22px auto;}
.factory_inner .common-prev{background-image: url(../img/icon_left_w.png); left: -30px;}
.factory_inner .common-next{background-image: url(../img/icon_right_w.png); right: -30px;}
.factory_inner .common-next::before,
.factory_inner .common-prev::before{display: none;}
.factory_inner .common-next:hover,
.factory_inner .common-prev:hover{background-color: var(--otherColor);}

@media only screen and (max-width: 1300px) {
	.factory_inner .swiper-slide{width: calc((100% - 60px) / 4); margin-right: 20px;}
}

@media only screen and (max-width: 980px) {
	.about_factory{padding: 30px 0;}
	.factory_inner{ margin-top: 18px; padding: 0 12px;}
	.factory_inner .swiper-slide{width: calc((100% - 20px) / 2); margin-right: 20px;}
	.factory_inner .common-next,
	.factory_inner .common-prev{display: block !important; width: 36px; height: 36px; margin-top: -18px; background-size: 20px auto;}
	.factory_inner .common-next{right: -15px;}
	.factory_inner .common-prev{left: -15px;}
}
@media only screen and (max-width: 768px) {
	.factory_inner .swiper-slide{width: 100%; margin-right: 16px;}
}


/* about_honor */
.honor_inner{padding: 3% 5% 11%; position: relative; background: url(../img/bg3.webp) no-repeat center bottom; background-size: 105% auto;}
.honor_inner .swiper-slide{width: calc((100% - 120px)/ 4); margin-right: 40px;}

.about_ser_list li{width: 30%; margin-top: 3%;}
.honor_item .pic{padding-bottom: 133%; overflow: hidden;}

.honor_inner .common-prev{left: -10px;}
.honor_inner .common-next{right: -10px;}

@media only screen and (max-width: 1450px) {
	.honor_inner .swiper-slide{width: calc((100% - 105px)/ 4); margin-right: 35px;}
}
@media only screen and (max-width: 1200px) {
	.honor_inner .swiper-slide{width: calc((100% - 75px)/ 4); margin-right: 25px;}
}
@media only screen and (max-width: 980px) {
	.about_honor{padding-bottom: 10px;}
	.honor_inner .swiper-slide{width: calc(50% - 8px); margin-right: 16px;}
	.honor_item:hover .pic img{transform: none;}
	
	.honor_inner{padding: 15px 8% 46px;}
	.honor_inner .common-pagination{bottom: -15px;}
	
}
@media only screen and (max-width: 640px) {
	.honor_inner .swiper-slide{width: 100%;}
}

