@charset "utf-8";
/* CSS Document */


/*-----公共------*/
.art-mainText{ background:#ffff;}
.art-content{ background:#f8f9fa; overflow:hidden;}
/*标题及位置导航*/
.art-way{ width:1500px; margin:30px auto 10px auto; padding:10px 0 30px 0; border-bottom:1px solid #eee;}
.art-way::after{ content: "."; display: block; clear: both; height: 0;width:0;font-size:0; }
.art-way span{ float:left; font-size:32px; color:#666; font-weight:900;}
.art-way em{ float:right; color:#999; font-style:inherit;}
.art-way em a{ margin:0 5px; color:#999;}
/*banner*/
.art-banner{ height:435px; background:url(../img/art/plastic_banner.jpg) top center;}
.art-contactBanner{ background:url(../img/art/lianxi1.jpg) center;}

/*-----产品展示------*/
.art-ProWay{ width:1500px; margin:30px auto 10px auto; text-align:right; font-size:14px; color:#999;}/*位置导航*/
.art-ProWay a{ margin:0 5px; color:#999;}
.art-mainProduct{ width:1500px; margin:0 auto 50px auto; padding:50px; box-sizing: border-box; background:#fff;
    box-shadow: 0px 2px 14px 3px rgba(160,160,160,0.1);
    -webkit-box-shadow: 0px 2px 14px 3px rgba(160,160,160,0.1);
    -moz-box-shadow: 0px 2px 14px 3px rgba(160,160,160,0.1);
}
/*切换图片*/
.swiper-img{ display:inline-block; width:700px; height:500px; perspective:800px !important; margin-left:0 !important; margin-right:0 !important;}
.swiper-img .swiper-slide{ display:flex; align-items:center; justify-content:center; border-radius:18px;}
.swiper-img .swiper-slide img{ width:100%; height:auto;}
/*属性*/
.product-text{ float:right; display:inline-block; width:40%;}
.product-text>h3{ line-height:80px; font-size:28px; color:#333; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.product-text .t{ line-height:45px; font-size:16px; color:#333;}
.product-text .t span{ color:#999;}
.product-text .d{ margin-top:30px;}
.product-text .d a{ display:inline-block; padding:10px 30px; font-size:16px; color:#fd8833; border:1px solid #fd8833;}
.product-text .d a:last-child{ border-left:0;}
.product-text .d a:hover{ color:#fff; background:#fb6a19;}
/*推荐产品*/
.product-hot{ margin:20px 0;}
.product-hot ul{ padding:20px 10px; border-radius:4px; box-sizing:border-box; background:#f8f9fa;}
.product-hot ul::after{ content: "."; display: block; clear: both; height: 0;width:0;font-size:0;  }
.product-hot ul li{ float:left; width:20%; padding:0 10px; text-align:center; box-sizing:border-box;}
.product-hot h3{ line-height:30px; font-size:18px; color:#333; font-weight:400;}
.product-hot a{ display:block;}
.product-hot a img{ width:100%; height:182px;}
.product-hot a span{ display:block; padding-top:10px; color:#999;}
/*产品详情*/
.product-content{}
/*切换标题*/
.product-tab{ position:relative; padding-top:40px; border-bottom:1px solid #e7e7e7;}
.product-content .newsMenu{ position:absolute; top:0; left:0; font-size:0;}
.product-content .newsMenu span{ display:inline-block; height:40px; padding:0 20px; margin-right:-1px; line-height:40px; font-size:16px; color:#666; font-weight:normal; border:1px solid #e7e7e7; background:#fff; cursor:pointer; } 
.product-content .newsMenu span.cur{ border-bottom:0; color:#333; font-weight:bold;}
/*切换内容*/
.product-content .product-b{ padding:20px 0; line-height:25px; color:#666;}
.product-content .product-b img{ /*width:100%;*/ max-width:1400px; display:block;}

/*-----师资力量-----*/
.art-shizi{ width:1500px; margin:0 auto; font-size:0;}
.art-shizi ul li{ display:inline-block; width:20%; margin:35px 0; padding:0 10px; box-sizing:border-box; vertical-align:top;}
.art-shizi ul li a{ display:block; height:450px; padding:40px 0; background:#fff; text-align:center; box-sizing:border-box; cursor:inherit;}
.art-shizi ul li span{ position:relative; display:block; width:160px; height:160px; margin:0 auto; border-radius:50%; border:10px solid #f7f7f7;}
.art-shizi ul li span::after{ position:absolute; left:-10px; top:-10px; content:""; width:180px; height:180px; border-radius:50%; background: #fffbf9; animation:cmids 4s infinite;}
.art-shizi ul li span::before{ position:absolute; left:-5px; top:-5px; content:""; width:170px; height:170px; border-radius:50%; background: #f7efeb; animation:cmids2 4s infinite; z-index:1;}
.art-shizi ul li span img{ position:absolute; left:0; top:0; z-index:2; width:100%; border-radius:50%; background:#f7efeb;}
.art-shizi ul li h3{ padding:30px 0 10px 0; font-size:22px; font-weight:bold; color:#333;}
.art-shizi ul li em{ display:block; font-style:normal; font-size:14px; color:#999;}
.art-shizi ul li p{ padding:30px 25px 25px 25px; font-size:14px; color:#666;}
.art-shizi ul li a{/**/
transition: All 0.2s ease-in-out;
-webkit-transition: All 0.2s ease-in-out;
-moz-transition: All 0.2s ease-in-out;
-o-transition: All 0.2s ease-in-out;}
.art-shizi ul li a:hover{
	transform: scale(1.03);
	-webkit-transform: scale(1.03);
	-moz-transform: scale(1.03);
	-o-transform: scale(1.03);
	-ms-transform: scale(1.03);
	background:#fd8833;
	}
.art-shizi ul li a:hover h3, .art-shizi ul li a:hover em, .art-shizi ul li a:hover p{ color:#fff;}
.art-shizi ul li a:hover em{ opacity:0.7;}
.art-shizi .more{ display:block; width:138px; height:40px; margin:0 auto; line-height:40px; font-size:14px; text-align:center; color: #fd8833; border: 1px solid #fd8833; }
.art-shizi .more:hover{ color:#fff; border:1px solid #fd8833; background:#fd8833;}
/*圈圈放大缩小动画*/
@keyframes cmids{
    0% {transform: scale(0.9);opacity: 0;}
    60% {opacity: 0.8;}
    100% {transform: scale(1.2);opacity: 0;}
}
@keyframes cmids2{
    0% {transform: scale(0.8);opacity: 0;}
    60% {opacity: 0.8;}
    100% {transform: scale(1.1);opacity: 0;}
}

/*-----在线订购-----*/
.art-dinggou{ width:1500px; margin:0 auto 50px auto;}
.art-dinggouList{ padding:50px; background:#fff;}
.art-dinggouList li{ padding:10px 0; overflow:hidden;}
.art-dinggouList li>div{}
.art-dinggouList li>div span{ display:block; line-height:30px; font-size:16px; color:#333;}
/*分类*/
.art-dinggouList .fl span{ margin-bottom:20px; padding-bottom:10px; border-bottom:1px dashed #e7e7e7;}
.art-dinggouList .fl p{ padding-bottom:20px; border-bottom:1px dashed #e7e7e7;}
.art-dinggouList .fl p em{ display:inline-block; width:230px; margin:12px 30px 0 0; font-style:normal; color:#666;}
.art-dinggouList .fl p em input{ width:20px; height:20px; margin-right:5px; border:1px solid #ddd; background:none; vertical-align:middle;}
/*input*/
.art-dinggouList li>div.w33{ float:left; width:33.33%; padding-right:20px; box-sizing:border-box;}
.art-dinggouList li>div.w33:last-child{ padding-right:0;}
.art-dinggouList li::after{ content: "."; display: block; clear: both; height: 0;width:0;font-size:0;}
.art-dinggouList li>div>em{ display:block; width:100%; font-size:16px; color:#333; font-style:normal;}
.art-dinggouList li>div>em input{ width:100%; height:50px; line-height:50px; padding:0 10px; font-size:16px; border:1px solid #ddd; box-sizing:border-box;}
/*textarea*/
.art-dinggouList li>div>p textarea{ width:100%; height:200px; padding:0 10px; line-height:30px; font-size:16px; border:1px solid #ddd; box-sizing:border-box;}
/*验证码*/
.yz{ position:relative; width:50% !important;}
.yz img{ position:absolute; right:8px; top:8px; /*width:130px; height:50px;*/ background:#333;}
/*按钮*/
.art-dinggouList li .btn{ text-align:center;}
.art-dinggouList li .btn .btn-button{ display:inline-block; padding:12px 50px; border:0; color:#fff; font-size:16px; text-align:center;  font-size:16px; font:'Microsoft Yahei'; background:#333; cursor:pointer;}
.art-dinggouList li .btn .btn-button:hover{ background:#fb6a19;}

/*-----新闻中心------*/
.art-newsContent{ width:1500px; margin:0 auto 50px auto; padding:50px; /*box-sizing: border-box;*/}
.art-newsContent .art-h{ font-size:26px; text-align:center; color:#333;}
.art-newsContent .art-nav{ margin-bottom:25px; padding:25px 0; font-size:14px; text-align:center; color:#999; border-bottom:1px solid #eee;}
.art-newsContent .art-nav span{ padding:0 10px;}
.art-newsContent .art-newsText{ font-size:16px; color:#333; line-height:30px;}
.art-copyright{ margin:20px 0; line-height:50px; color:#999; border-bottom:1px solid #eee;}
/*翻页*/
.art-page{ color:#333;}
.art-page>div{ font-size:16px; line-height:30px;}

/*-----人才招聘-----*/
.art-job{ width:1500px; margin:30px auto 50px auto;}
.art-job ul{}
.art-job ul::after{ content: "."; display: block; clear: both; height: 0;width:0;font-size:0; }
.art-job ul li{ float:left; width:25%; padding:10px; box-sizing:border-box;}
.art-job ul li .mk{ position:relative; height:550px; padding:20px; background:#fff; overflow:hidden; cursor: pointer;} 
.art-job ul li .mk h4{ font-size:20px; text-align:center; font-weight:normal; color:#333;}
.art-job ul li .mk h4 i{ display:block; margin:15px 0; font-size:50px; color:rgb(201, 201, 201);}
.art-job ul li .mk>p{ padding:20px 0; font-size:12px; text-align:center;}
.art-job ul li .mk>p span{ padding:0 10px; color:#999;}
.art-job ul li .mk .b1{ line-height:30px; color:#666; text-align:left;}
.art-job ul li .mk .b2{ position:absolute; bottom:0; left:0; width:100%; padding:20px; box-sizing:border-box; height:0; z-index:999;  line-height:30px; color:#fff; text-align:left;
	transition: all 0.5s ease 0s;
	-webkit-transform: all 0.5s ease 0s;}
.art-job ul li .mk:hover .b2{ height:100%;
	background:#fb6a19;
	transition: all 0.5s ease 0s;
	-webkit-transform: all 0.5s ease 0s;}
.art-job ul li .mk .b2 h3{ font-size:20px;}
/*向上箭头动画*/
.art-job ul li .mk .m{ position:absolute; left:0; bottom:50px; width:100%; text-align:center; font-size:40px; color:#bbb;}
.art-job ul li .mk .m::before{
	-webkit-animation: hcp-pulse 1s infinite;
    animation: hcp-pulse 1s infinite;
    cursor: pointer;
    left: 0;
    right: 0;
    bottom: 8%;
    position: absolute;}
	@-webkit-keyframes hcp-pulse {
		0% { -webkit-transform: translate(0,0);	transform: translate(0,0);}
		50% {-webkit-transform: translate(0,20px); transform: translate(0,20px);}
		100% {-webkit-transform: translate(0,0); transform: translate(0,0);}
	}
	@keyframes hcp-pulse {
		0% { -webkit-transform: translate(0,0); transform: translate(0,0);}
		50% { -webkit-transform: translate(0,20px); transform: translate(0,20px);}
		100% { -webkit-transform: translate(0,0); transform: translate(0,0);}
	}	
/*形象广告*/
.job-ad{}
.job-ad::after{ content: "."; display: block; clear: both; height: 0;width:0;font-size:0;}
.job-ad .t{ float:left; padding-top:90px; width:52%;}
.job-ad .t p{ padding:10px 0; line-height:26px; color:#333;}
.job-ad .p{ float:right; width:48%;}
.job-ad .p img{ width:100%; height:auto;}

/*-----客户留言------*/
.art-message-h{ width:1500px; margin: 20px auto 20px auto; font-size:18px; font-weight:normal; color:#666;}
.art-message{ width:1500px; margin: 0 auto 50px auto; padding:50px; box-sizing:border-box; background:#fff;}
.art-message h4{}
.art-message>div{ width:80%; margin:0 auto; padding:10px 0; font-size:16px;}
.art-message>div span{ display:inline-block; line-height:50px; color:#666; vertical-align:top;}
.art-message>div input, .art-message>div textarea{ display:inline-block; width:70%; color:#333; border:1px solid #ddd; font-size:16px;}
.art-message>div input{ height:50px; padding:5px 10px; box-sizing:border-box; line-height:50px;}
.art-message>div textarea{ height:200px; padding:5px 20px 5px 10px; line-height:30px; box-sizing:border-box;}
.art-message>div em{ display:inline-block;}
.art-message>div em img{}
.art-message>div.btn{ text-align:center;}
.art-message>div.btn .btn-button{ display:inline-block; padding:12px 50px; border:0; color:#fff; font-size:16px; font:'Microsoft Yahei'; text-align:center; background:#333; cursor:pointer;}
.art-message>div.btn .btn-button:hover{ background:#fb6a19;}
.art-message .yz{ width:70% !important;}
.art-message .yz input{ width:100%;}

/*-----联系我们------*/
.art-contactBanner{}
.art-contactBanner .b{ position:relative; width:1500px; margin: 0 auto;}
.art-contactBanner .b::before{ content:""; position:absolute; top:100px; display:inline-block; width:50px; height:3px; background:#fff;}
.art-contactBanner .b p{ position:absolute; top:190px; left:0; font-size:30px; color:#fff; letter-spacing:8px; margin-bottom:14px;}
.art-contactBanner .b span.t1{ position:absolute; top:240px; left:0; display:block; font-size:60px; color:#fff; font-family:"Impact"; letter-spacing:8px;}
.art-contactBanner .b span.t2{ position:absolute; top:300px; left:0; display:block; font-size:60px; color:#fff; font-family:"Impact"; letter-spacing:7px;}
.art-contactBanner .b img{ position:absolute; top:100px; right:0; }
/*内容*/
.art-contact{ width:1500px; margin:30px auto 50px auto; }
.art-contact ul{ background:#fff;}
.art-contact ul::after{ content: "."; display: block; clear: both; height: 0;width:0;font-size:0;}
.art-contact ul li{ position:relative; float:left; width:20%; height:260px; padding:0 10px; box-sizing:border-box; border-right:1px solid #f3f3f3; cursor:pointer;}
.art-contact ul li:last-child{ border-right:0;}
.art-contact ul li .p{ position:relative; width:100%; height:43px; margin-top:60px;}
.art-contact ul li .t{ color:#333; text-align:center;}
.art-contact ul li .t h4{ padding-top:20px; font-size:20px; font-weight:normal;}
.art-contact ul li .t p{ padding-top:20px;}
/*文本*/
.art-contact .b{ padding:50px 0 20px 0; line-height:40px; font-size:16px; color:#666; border-bottom:1px solid #eee;}
/*小图标动画*/
.po-auto{ position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; width:auto; height:auto; max-width:95%; max-height:95%;}
.dn{ display:none;}
.art-contact ul li::after{ position:absolute; content:''; left:0; bottom:0; width:100%; height:4px; background:#fd8833;
    transform:scale(0, 1);
    -webkit-transform:scale(0, 1);
    transition: all .3s;
    -webkit-transition: all .3s;
}
.art-contact ul li:hover::after{transform: scale(1); -webkit-transform: scale(1)}
.art-contact ul li:hover .p img {
	transition-timing-function: cubic-bezier(.6, 4, .3, .8);
	-webkit-transition-timing-function: cubic-bezier(.6, 4, .3, .8);
	animation: gelatine .5s 1;
	-webkit-animation: gelatine .5s 1
}
.art-contact ul li:hover .p img:first-child { display:none}
.art-contact ul li:hover .p img:last-child { display:inherit}
@keyframes resize {
	from,60%,75%,90%,to { animation-timing-function: cubic-bezier(.215, .61, .355, 1)}
	0% { opacity:0; transform:scale(5, 5)}
	100% { opacity:1; transform:scale(1, 1)}
}
@-webkit-keyframes resize {
	from,60%,75%,90%,to { -webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1)}
	0% { opacity:0; -webkit-transform:scale(5, 5)}
	100% {opacity:1; -webkit-transform:scale(1, 1)}
}
@keyframes gelatine {
	from,to { transform:scale(1, 1)}
	25% { transform:scale(.9, 1.1)}
	50% { transform:scale(1.1, .9)}
	75% { transform:scale(.95, 1.05)}
	from,to { transform:scale(1, 1)}
	25% { transform:scale(.9, 1.1)}
	50% { transform:scale(1.1, .9)}
	75% { transform:scale(.95, 1.05)}
}
@-webkit-keyframes gelatine {
	from,to { -webkit-transform:scale(1, 1)}
	25% { -webkit-transform:scale(.9, 1.1)}
	50% { -webkit-transform:scale(1.1, .9)}
	75% { -webkit-transform:scale(.95, 1.05)}
	from,to { -webkit-transform:scale(1, 1)}
	25% { -webkit-transform:scale(.9, 1.1)}
	50% { -webkit-transform:scale(1.1, .9)}
	75% { -webkit-transform:scale(.95, 1.05)}
}
@media screen and (max-width: 1480px) {
    .art-way{ width:1200px;}
	.art-banner{ background:url(../img/art/plastic_banner1200.jpg) top center;}
	.art-contactBanner{ background:url(../img/art/lianxi1.jpg) center;}
	/*产品展示*/
    .art-mainProduct{ width:1200px;}
    .art-ProWay{ width:1200px;}
    .swiper-img{ width:600px; height:400px; }
    .product-text>h3{ line-height:60px;}
    .product-text{ width:35%;}
    .product-text .t{ line-height:40px;}
    .product-text .d{ margin-top:20px;}
    .product-hot a img{ height:139px;}
	.product-content .product-b img{ max-width:1100px;}
	/*订购*/
	.art-dinggou{ width:1200px;}
	/*师资团队*/
	.art-shizi{ width:1200px;}
    /*新闻*/
    .art-newsContent{ width:1200px;}
    /*联系*/
    .art-contactBanner .b{ width:1200px;}
    .art-contact{ width:1200px;}
	/*招聘*/
	.art-job{ width:1200px;}
	.job-ad{ width:1200px;}
	/*留言*/
	.art-message-h{ width:1200px;}
	.art-message{ width:1200px;}
}