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

/*==banner2==*/
.bannerWrap2{margin-top: 98px; width:100%; box-sizing:border-box; position:relative;}
.bannerWrap2 img{ width:100%;}




/*.wrap h2{ display:inline-block; font-size:40px; color:#222; font-weight:normal; letter-spacing:4px;}*/
.wrap h2>b{ font-size:24px; color:#c77855; font-weight:normal; font-family:Georgia, "Times New Roman", Times, serif; padding-left:15px; letter-spacing:2px;}

 
 .caseWrap .caseBox .itemBox .imgBox img ,.caseWrap .caseBox1 .itemBox .imgBox img{
	opacity:0.5;
	filter:alpha(opacity=50);
	opacity:0.5;
	filter:alpha(opacity=50);
	-webkit-transition:all 0.35s;
	-moz-transition:all 0.35s;
	-o-transition:all 0.35s;
	transition:all 0.35s;
	-webkit-transition:all 0.35s;
	-moz-transition:all 0.35s;
	-o-transition:all 0.35s;
	transition:all 0.35s;
}
 .caseWrap .caseBox .itemBox a:hover img,.caseWrap .caseBox1 .itemBox a:hover img {
	opacity:1;
	filter:alpha(opacity=100);
	opacity:1;
	filter:alpha(opacity=100);
	-webkit-transition:all 0.35s;
	-moz-transition:all 0.35s;
	-o-transition:all 0.35s;
	transition:all 0.35s;
	-webkit-transition:all 0.35s;
	-moz-transition:all 0.35s;
	-o-transition:all 0.35s;
	transition:all 0.35s;
}



/*==Case==*/
.caseWrap{ width:100%; box-sizing:border-box; position:relative; background-image:url(../images/bg.jpg); background-repeat:repeat;} 
/*.caseWrap:after{ content:""; position:absolute; left:100px; bottom:0; width:130px; height:130px; background:url(../images/img_bg02.png) no-repeat;}*/
.caseWrap .wrap{ text-align:center;}
.caseWrap .caseBox{ margin-top:25px;}
.caseWrap .caseBox .itemBox{ float:left; width:33.33%; box-sizing:border-box; padding:0 15px;}
.caseWrap .caseBox .itemBox .imgBox a{ display:block; width:100%;}
.caseWrap .caseBox .itemBox .imgBox img{ display:block; width:100%;}
.caseWrap .caseBox .itemBox .txtBox{ width:100%; padding:30px 5px; box-sizing:border-box;}
.caseWrap .caseBox .itemBox .txtBox h3{color:#f03c3B; font-size:24px; font-weight:normal; text-align:left; height:35px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.caseWrap .caseBox .itemBox .txtBox p{ font-size:15px; text-align:left; line-height:1.5; text-align:justify; word-wrap: break-word; padding-top:15px; height:50px; overflow:hidden; text-overflow:ellipsis; /*white-space:nowrap;*/}
.caseWrap .caseBox .itemBox .txtBox a.more{ display: inline-block; font-size:12px; border-radius:30px; padding:12px 35px; background:#ff3e00; color:#fff; text-align:center; margin-top:30px; transition:all 0.4s ease;}
.caseWrap .caseBox .itemBox .txtBox a.more:hover{ background:#faa500;}
/*.caseWrap .caseBox .itemBox .txtBox a.more:after{ content:""; position:absolute; left:0; top:0; width:0%; height:100%;background:#faa500;border-radius:30px; z-index:10;}
.caseWrap .caseBox .itemBox .txtBox a.more:hover:after{ width:100%;}*/


.caseWrap .caseBox1{ margin-top:-125px;z-index:100;}
.caseWrap .caseBox1 .txtBox{ width:100%; background:#fff; box-sizing:border-box; box-shadow:0px 2px 5px rgba(20%,20%,40%,0.2);}
.caseWrap .caseBox1 .itemBox .imgBox {width:100%;background:#fff; box-sizing:border-box; box-shadow:0px 2px 5px rgba(20%,20%,40%,0.2);}
.caseWrap .caseBox1 .itemBox{ float:left; width:33.33%; box-sizing:border-box; padding:0 15px;}
.caseWrap .caseBox1 .itemBox .imgBox a{ display:block; width:100%;}
.caseWrap .caseBox1 .itemBox .imgBox img{ display:block; width:80%;padding:10%;}
/*.caseWrap .caseBox1 .itemBox .txtBox{ width:100%; padding:30px 5px; box-sizing:border-box;}*/
.caseWrap .caseBox1 .itemBox .txtBox h3{color:#f03c3B;font-size:20px; font-weight:bold; text-align:center; height:40px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.caseWrap .caseBox1 .itemBox .txtBox p{ font-size:15px; text-align:left; line-height:1.5; text-align:justify; word-wrap: break-word; padding-top:15px; height:115px; overflow:hidden; text-overflow:ellipsis; /*white-space:nowrap;*/}
.caseWrap .caseBox1 .itemBox .txtBox a.more{ display: inline-block; font-size:12px; border-radius:30px; padding:12px 35px; background:#ff3e00; color:#fff; text-align:center; margin-top:30px; transition:all 0.4s ease;}
.caseWrap .caseBox1 .itemBox .txtBox a.more:hover{ background:#faa500;}


/*case arrow*/
.caseWrap .slick-prev{ width:40px; height:73px; left:-50px; top:40%;}
.caseWrap .slick-next{ width:40px; height:73px; right:-50px; top:40%;}
.caseWrap .slick-prev:before{ display:block; content:"" !important; width:40px; height:73px; background:url(../images/icon_arrow_left.png) no-repeat;}
.caseWrap .slick-next:before{ display:block; content:"" !important; width:40px; height:73px;background:url(../images/icon_arrow_right.png) no-repeat;}


/*==about==*/
.aboutWrap{ width:100%; background:url(../images/bg.jpg) repeat; box-sizing:border-box; position:relative;} 
.aboutWrap:after{ content:""; position:absolute; right:100px; bottom:0; width:200px; height:99px; background:url(../images/img_bg03.png) no-repeat;}
.aboutWrap .wrap{ height:550px;}
.aboutWrap .wrap .photoBox{ float:left; width:50%; box-sizing:border-box; padding:10px;}
.aboutWrap .wrap .photoBox img{ display:block; width:100%;}
.aboutWrap .wrap .aboutBox{ float:left; width:50%; box-sizing:border-box; padding: 20px 0 110px 100px;}
.aboutWrap .wrap .aboutBox .txtBox{  letter-spacing:2px; text-align:left;}
.aboutWrap .wrap .aboutBox .txtBox p{ font-size:19px; line-height:1.6; padding-bottom:10px;}
.aboutWrap a.more{ display: inline-block; font-size:12px; border-radius:30px; padding:12px 50px; background:#ff3e00; color:#fff; text-align:center; margin-top:30px; transition:all 0.4s ease;}
.aboutWrap a.more:hover{ background:#faa500;}
.TitleBox { text-align:center; margin:auto 0; width:100%; margin-top:20px; margin-bottom:10px;}

/*==news==*/
.newslist{ padding:0 30px;}
.newslist ul li{ text-align:left; padding:10px 10px; border-bottom:1px #aaa dotted;}
.newslist ul li a{ display:block; font-size:15px; color:#222; transition:all 0.4s ease; position:relative;}
.newslist ul li a:hover{ color:#01b9af;}
.newslist ul li a i{ padding-right:8px; transition:all 0.4s ease;}
.newslist ul li a:hover i{ color:#999;}
.newslist ul li span.date{ position:absolute; right:0px; top:5px; color:#aaa; font-size:13px;}
.newslist a.more{ display: inline-block; font-size:12px; border-radius:30px; padding:12px 50px; background:#ff3e00; color:#fff; float:right; margin:30px 0; transition:all 0.4s ease;}
.newslist a.more:hover{ background:#faa500;}

/*==contact==*/
.ContactWrap{ width:100%; background:url(../images/bg.jpg) repeat; box-sizing:border-box; position:relative;} 
.ContactWrap:after{ content:""; position:absolute; right:100px; bottom:0; width:200px; height:99px; background:url(../images/img_bg03.png) no-repeat;}
.ContactWrap .wrap{ height:600px;}
.ContactWrap .wrap .photoBox{ float:left; width:50%; box-sizing:border-box; padding:10px;}
.ContactWrap .wrap .photoBox .map{ display:block; width:100%;}
.ContactWrap .wrap .ContactBox{ float:left; width:50%; box-sizing:border-box; padding: 20px 0 0 100px;}
.ContactWrap .wrap .ContactBox .txtBox{ margin-top:50px; letter-spacing:2px; text-align:left;}
.ContactWrap .wrap .ContactBox .txtBox p{ font-size:19px; line-height:1.6; padding-bottom:10px;}
.ContactWrap a.more{ display: inline-block; font-size:12px; border-radius:30px; padding:12px 50px; background:#ff3e00; color:#fff; text-align:center; margin-top:30px; transition:all 0.4s ease;}
.ContactWrap a.more:hover{ background:#faa500;}
.ContactWrap .TitleBox { text-align:center; margin:auto 0; width:100%; margin-top:20px; margin-bottom:10px;}



@media (max-width:1280px){
}


@media (max-width:1034px){
.aboutWrap{ width:95%;}
.ContactWrap .wrap .ContactBox{}
}


@media (max-width:980px){
}


@media (max-width:768px){
.bannerWrap2{margin-top: 65px; width:100%; box-sizing:border-box; position:relative;}
.TitleBox { text-align:center; margin:auto 0; width:100%; margin-top:20px; margin-bottom:10px;}
.caseWrap{ width:98%;} 
.caseWrap .wrap{ width:90%;}
.aboutWrap .wrap{ }
.aboutWrap .wrap .photoBox{ float:none; width:100%; margin:0 auto;}
.aboutWrap .wrap .aboutBox{ width:100%; padding:5px;}
.aboutWrap .wrap .aboutBox .txtBox p{ text-align:left; padding-left:60px;}
.aboutWrap .wrap .photoBox .bannerWrap3 ul#banner3 li{ float:left; width:50%; box-sizing:border-box; padding:10px;}
.ContactWrap .wrap .ContactBox{ display:none;}


.btLin{ padding:2px;}
}


@media (max-width:640px){
.bannerWrap2{width:100%;}

.caseWrap .slick-prev{ left:-40px;}
.caseWrap .slick-next{ right:-40px;}
.aboutWrap .wrap .aboutBox{ width:100%;} 
}

@media (max-width:480px){
.bannerWrap2{margin-top: 60px; width:100%; box-sizing:border-box; position:relative;}
.TitleBox { margin-top:30px; margin-bottom:10px;}
.TitleBox img{ width:100%; margin-top:20px;}
.ContactWrap .wrap .photoBox{ width:100%;}
.ContactWrap .wrap .ContactBox .txtBox p{ display:none;}
.LineBg{height:180px;}
.caseWrap .caseBox .itemBox .txtBox h3{ font-size:20px; height:30px;}
.caseWrap .caseBox1{width:80%;margin-left:10%;margin-top:-80px;}
.aboutWrap .wrap .photoBox{ float:left; width:100%; box-sizing:border-box; padding:10px;}
.caseWrap .wrap h2 img{ width:90%;}
.bannerWrap:after{ height:40px; bottom:-18px;}
.Product .TitleBox img{ width:80%;}
.ContactWrap .TitleBox  img{ width:80%;}
.caseWrap .wrap{ width:80%; margin:0 auto;}

.aboutWrap .wrap{}
.aboutWrap .wrap .photoBox{ width:100%;}
.aboutWrap .wrap .aboutBox h2{ font-size:34px; letter-spacing:1px;}
.aboutWrap .wrap .aboutBox .txtBox p{ padding-left:10px;}

}

@media (max-width:420px){
.caseWrap .caseBox .itemBox .txtBox h3{ font-size:18px; height:25px;}
.wrap h2{ font-size:36px; letter-spacing:3px;}
.specWrap .specBox ul li .itemBox .iconBox{ width:180px; height:180px;}

.aboutWrap:after{ width:100px; height:50px; background-size:cover;}
.aboutWrap .wrap .aboutBox h2>b{ display:block;}

.caseWrap .caseBox{ margin-top:30px;}

.inforWrap{ padding:40px 50px;}
}

@media (max-width:375px){
	
.wrap h2{ font-size:30px; letter-spacing:1px;}
.wrap h2>b{ font-size:18px; padding-left:8px;}
.caseWrap{ width:95%;text-align:center;margin-left:10px;} 
.specWrap .specBox ul li{ padding:0 5px 20px;}
.specWrap .specBox ul li .itemBox .iconBox{ width:150px; height:150px;}
.specWrap .specBox ul li .itemBox .iconBox .icon img{ width:100%;}
.specWrap .specBox ul li .itemBox .txtBox{ margin-top:10px;}
.specWrap .specBox ul li .itemBox .txtBox h3{ font-size:20px;}
.specWrap .specBox ul li .itemBox .txtBox p{ margin-top:5px; font-size:13px; line-height:1.4; height:55px;}

.caseWrap .wrap{ width:95%;}
.aboutWrap .wrap{ padding:0px 10px;}
.aboutWrap .wrap .aboutBox .txtBox p{ font-size:14px;}
.aboutWrap a.more{ margin-top:15px;}
.caseWrap .wrap h2 img{ width:90%;}
}

@media (max-width:320px){
.specWrap .wrap{ padding:30px 10px 50px;}
.specWrap .specBox ul li .itemBox .iconBox{ width:130px; height:130px;}
.specWrap:after{ width:85px; height:55px; background-size:cover;}

.caseWrap:after{ width:65px; height:65px; background-size:cover;}

.inforWrap{ padding:30px 20px;}
.inforWrap .inforBox .txtBox{ margin-top:15px;}

}