﻿.clear{clear:both}

.banner3 {
    background: url(../images/quality.png) no-repeat;
    background-size: cover !important;
    width: 100%;
    height: 560px;
    margin-top: 45px;
	margin-bottom:20px;
}
.banner3 p{
	/*font-family: 'Montserrat';*/
    color: #052c4b;
    font-size: 60px;
    line-height: 1.2;
	padding:220px 300px; 
    font-weight: 700;
	opacity:0;	
}
.banner3 p span{
	color:#bf9c48
}

	.projects-list ul {overflow:hidden;}
    .projects-list ul li {position:relative;}
    .projects-list ul li .cover {display:block; width:100%; height:100%; overflow:hidden;}
    .projects-list ul li .cover h2 {font-size:40px; margin-bottom:20px;}
    .projects-list ul li .cover span {display:none;}
    .projects-list ul li h2 {font-size:28px;}
    .projects-list ul li .hoverMask { opacity:0; width:100%; height:100%; position:absolute; left:0; top:0; z-index:20; padding:40px; display:flex; justify-content:left; align-items:flex-end; transition: 0.5s ease-in-out; -webkit-transition: 0.5s ease-in-out;  }
    .projects-list ul li .inne_hoverMask {color:#ffffff;}
    .projects-list ul li .inne_hoverMask em {/*display:inline-block;*/ display:none; color:#000000; font-style:normal; padding:10px 40px; font-size:12px; background:#ffffff;}
    .projects-list ul li .cover .img {
        width:100%;
        height:auto;
        background-size:cover;
        background-repeat:no-repeat;
        background-position:center center;
    
        -moz-transition: all 0.3s ease-out 0s; 
        -webkit-transition: all 0.3s ease-out 0s;  
        -o-transition: all 0.3s ease-out 0s;  
        -ms-transition: all 0.3s ease-out 0s;  
        transition: all 0.3s ease-out 0s;  

        -moz-transform: scale(1,1);  
        -webkit-transform: scale(1,1); 
        -o-transform: scale(1,1);  
        -ms-transform: scale(1,1);  
        transform: scale(1,1); 
    }
    .projects-list ul li .cover .default_skin { width:100%; }

ul li .cover .default_skin { 
	width: 80% !important;
    display: block;
    margin: auto;
}

.company-logos-one__titleb {
    position: relative;
    display: block;
    padding-top: 20px;
    padding-bottom: 20px;
    z-index: 1;
    background: #fff;
}
.zonesdiv{
	width:1069px; 
	margin: 20px auto;
	animation-duration: 2s;
}
.zonesdiv .zonesleft{float:left;width:50%}

.zonesdiv .zonesleft img{width:100%}
.zonesdiv .zonesright{float:right;width:50%;color:#fff;background:url("../images/zoneright.png") no-repeat;height:280px;background-size: cover;}


.zonesdiv .zonesright .zonesfont1{font-size:26px;line-height:26px;padding-left:60px;padding-top:90px;transition: all .3s ease;
    -webkit-transition: all .3s ease;}
.zonesdiv .zonesright .zonesfont2{font-size:20px;line-height:20px;padding-left:60px;padding-right:80px; padding-bottom:15px;transition: all .3s ease;
    -webkit-transition: all .3s ease;}
.zonesdiv .zonesright .zonesfont3{font-size:14px;line-height:14px;padding-left:60px;transition: all .3s ease;
    -webkit-transition: all .3s ease;}
.zonesdiv .zonesright:hover .zonesfont1,.zonesdiv .zonesright:hover .zonesfont2{
	transform: translateY(-10px);  
}
.zonesdiv .zonesright:hover .zonesfont3{
	transform: translateY(10px); 
 
}
.zonesAleft{width:45%;float:left;}
.zonesAleft img{width:100%;}
.zonesBright{
    width:45%;float:right;background:url("../images/rangea2.png") no-repeat; background-size: contain;
}
.zonesfont4{padding-left:28%;padding-top:18%;font-size:18px;color:#cb9d2e;padding-bottom:10%;transition: all .3s ease;
    -webkit-transition: all .3s ease;}
.zonesfont5{color:#5d5b5c;font-size:15px;line-height:20px;padding-left:5%;transition: all .3s ease;
    -webkit-transition: all .3s ease;}

.zonesdiv .zonesBright:hover .zonesfont4{
	transform: translateY(-10px);  
}
.zonesdiv .zonesBright:hover .zonesfont5{
	transform: translateY(10px);  
}
.zonesDright{width:45%;float:right;}
.zonesDright img{width:100%;}
.zonesCleft{
    width:45%;float:left;background:url("../images/rangeb.png") no-repeat; background-size: cover;
}
.zonesdiv .zonesCleft:hover .zonesfont6{
	transform: translateY(-10px);  
}
.zonesdiv .zonesCleft:hover .zonesfont7{
	transform: translateY(10px);  
}
.zonesfont6{padding-left:35%;padding-top:22%;font-size:18px;color:#cb9d2e;padding-bottom:20px;transition: all .3s ease;
    -webkit-transition: all .3s ease;}
.zonesfont7{color:#5d5b5c;font-size:15px;line-height:20px;padding-left:0px;transition: all .3s ease;
    -webkit-transition: all .3s ease;}

.mb30{margin-bottom:80px;}
.packagings{
	animation-duration: 2s;
	width:1061px; 
	margin:30px auto 20px;
	
}
.packagings .packagingsleft{
	height:100%;
	width:50%;
	float:left;
	background: url(../images/packagingsleft.png) no-repeat;
	background-size: cover;
}
.packagings .packagingsleft:hover .packagingsfont{
	transform: translateY(-20px);
}
.packagings .packagingsleft .packagingsfont{
	font-size:24px;
	line-height:24px;
	color:#fff;
	padding-top:55px;
	padding-left:25%;
	transition: all .3s ease;
    -webkit-transition: all .3s ease;
}
.packagings .packagingsright{
	width:50%;
	float:left;
}
.packagingsright img{
	width:100%;
}
.guoqidiv{ 
	position: relative;
    width:1069px; 
    margin:auto; 
    margin-top:10px;
    margin-bottom:20px;
	animation-duration: 3s;    
}
.guoqibg{
	position:absolute;
	width:100%; 
	z-index:1; 
	
}
.guoqibg .guoqibgimg{
	width:100%;
	height:auto;
}
.guoqicontent{
	width:100%;
	height:100%;
	z-index:2;
	position:absolute;
	left:0;
	top:0;
	
}

.guoqi{
    position: relative;
    float:left;
    width:60%;
	z-index:11;

}

.guoqiA{
    position: absolute;
    left:12%;
    top:60px;
    width:100px;
    height:67px;
	opacity: 0;
	transition: all .3s ease;
    -webkit-transition: all .3s ease;
	
}
.guoqidiv.activeb .guoqiA{ 
	opacity: 0.5;   
	transition-delay: 0.5s
}  
.guoqiB{
    position: absolute;
    left:88%;
    top:100px;  
    width:100px;
    height:67px;
	opacity: 0;
	-webkit-transition: all .3s;
    transition: all .3s;
	
}
.guoqiB img,.guoqiA img, .guoqiC img{
	width:100%;
}
.guoqidiv.activeb .guoqiB{ 
	opacity: 0.5; 
	transition-delay: 1s
}
.guoqiC{
    position: absolute;
    left:86%;
    top:240px;
	width:100px;
    height:67px;
	opacity: 0;
	-webkit-transition: all .3s;
    transition: all .3s;
	
}
.guoqidiv.activeb .guoqiC{ 
	opacity: 0.5;
	transition-delay: 1.5s
	
}
.guoqidiv .guoqiA:hover,.guoqidiv .guoqiB:hover,.guoqidiv .guoqiC:hover{opacity: 1; transform: scale(1.07);transition-delay: 0s;transition: all .3s;-webkit-transition: all .3s;}

.guoqidiv:hover .guoqifont{ 
	transform: translateY(-10px);  
	transition: all .3s ease;
    -webkit-transition: all .3s ease;
}
.guoqifont{z-index;11;
    float:right; 
    width:30%;
    padding-top:15%;
    font-size:17px; 
    color:#5a5a5a;
    line-height:22px;
}

.tuzhi{
    width:100%;
    
    border-left:0;
    border-right:0;
    background: #f8f8f8;
    margin-top:40px;
    margin-bottom:30px;  
    position: relative;
	border-top:2px #c79f32 solid;
	border-bottom:2px #c79f32 solid;
}
.tuzhilist{
    height:368px;
    width:80%;
    margin:auto;
}
.tuzhiItem{
    width:100%;
}
.tuzhiItem img{
    height:100%;
}
.tuzhi .swiper-button-next,.tuzhi .swiper-button-prev{background: #e4e3de; border-radius:50%;width:40px;height:40px;}
.tuzhi .swiper-button-next:after,.tuzhi .swiper-button-prev:after{font-size:16px!important;color:#64635f}

.mb60px{ margin-bottom: 60px
}
.tuzhi .swiper-pagination-bullet{
margin:10px !important;
}
.registration-two .row {
    width:1069px;
    margin: auto;
}

.registration-two .row .downtxt_title .downtxt_title_form{
	float:right;
	width: 10%;
	height:30px;
	margin-right:14%;
}

.joinibanner {   
	
    width: 100%;
    min-height: 252px;
    margin-top: 145px;
	margin-bottom:0px;
	
}
.joinibanner p{
	font-family: 'Montserrat';
    color: #fff;
    font-size: 60px;
    line-height: 1.2;
	text-align:center;
    font-weight: 700;
	padding-top:100px;
	opacity:0; 
}
.banner3 p.active,.joinibanner p.active{
	opacity: 1;
	transition-delay: 1.5s;
	transition: all 1s ease;
    -webkit-transition: all 1s ease;
}
.wrap-contact  form
{
    margin-top: 20px;
}
.wrap-contact  form input
{
    line-height: 28px; 
    width: 100%;
    min-height: 50px;
    margin-top: 10px;
    padding: 10px 30px;
    border: 1px solid #818181; 
}
.wrap-contact  form textarea
{
    line-height: 28px; 
    width: 100%;
    min-height: 200px;
    margin-top: 10px;
    padding: 10px 30px;
    border: 1px solid #818181; 
}
.formtd{
	width:100%;
	min-height: 700px;
}
.submittr{
	background:#003567;
	width:100%;
	height:60px;
	position:relative; 
}
.submitdiv{
	width: 20%;
    height: 40px;
    margin: auto;
    background: #003567;
    position: absolute;
    left: 40%;
    top: 15px;
    padding-left: 60px;
}
.submittr .btn_submit{
	width:60%;
	margin:auto;
	text-align:center;
	border-radius:20px;
	background: linear-gradient(to right, #b79524, #f8c562, #b7952a);
	 padding: 0px;
	 min-height:35px
}

.submittr .btn_submit:hover{
	background:#fff
}
.subline{
	
	border-bottom:1px #bf9c48 solid;
	height:2px;
	padding-top:30px;
}

.laboratories{margin:10px auto;background:#fff;color:#fff;}
.laboratories_1{width:100%;height:246px;margin-bottom:20px;}
.laboratories_1_left{float:left;width:63%;background:#083366; font-size:15px; line-height:1.4;min-height:246px;}
.laboratories_1_left .content{padding:13%;}
.laboratories_1_right{float:right;width:35%;}
.laboratories_1_right img{height:100%;}
.laboratories_2{background:#d6b764;padding:40px;font-size:15px;line-height:1.4}
.laboratories_2 P{
	width:80%;
	margin: auto;
}
@media (max-width: 991px)
{
    .wrap-contact  form input,
    .wrap-contact  form textarea
    {
        margin-top: 14px;
        padding: 10px;
    }
}
.wrap-contact {
	background:#edefee;
	padding:20px;
}
.wrap-contact .company-logos-one__titleb {
    position: relative;
    display: block;
    padding-top: 20px;
    padding-bottom: 20px;
    z-index: 1;
    background: #edefee;
}
.formwarp{
	width:1069px ;
	margin:auto;
	min-height:650px;
	background:#fff;
	border-radius:20px;
	padding-bottom:50px;
}
.form1{
	width:100%;margin:auto;
}
.tdleft{
	float:left;
	margin-right: 4%;
    margin-left: 4%;
}
.tdleftb{
	    float: left;
    margin: 0px;
    /* margin-right: 8%; */
    margin-left: 4%;
    padding-right: 10px;
}
.formfont1{
	color:#ca9e31;
	font-size:24px;
	padding-top:20px;
}
.formfont2{
	color:#595758;
	font-size:14px;
	padding-top:20px;
	text-align:right;
}
.formfont3{
	color:#585657;
	font-size:20px;
	text-align:left;
	padding-top:20px;
}
.formfont4{
	color:#585657;
	font-size:20px
	text-align:left;
	padding-top:20px;
}
.input1{
	border-radius:10px;
	border:1px #5b595a solid;
	background:#fff;
}
.wrap-contact  form input::-webkit-input-placeholder,
.wrap-contact  form textarea::-webkit-input-placeholder
{
    color: #999;
}
.wrap-contact  form input:-o-placeholder,
.wrap-contact  form textarea:-o-placeholder
{
    color: #999;
}
.wrap-contact  form input::-moz-placeholder,
.wrap-contact  form textarea::-moz-placeholder
{
    color: #999;
}
.wrap-contact  form input:-ms-input-placeholder,
.wrap-contact  form textarea:-ms-input-placeholder
{
    color: #999;
}
.wrap-contact  form input:focus::-webkit-input-placeholder,
.wrap-contact  form textarea:focus::-webkit-input-placeholder
{
    color: #c5c5c5;
}
.wrap-contact  form input:focus::-o-placeholder,
.wrap-contact  form textarea:focus::-o-placeholder
{
    color: #c5c5c5;
}
.wrap-contact  form input:focus::-moz-placeholder,
.wrap-contact  form textarea:focus::-moz-placeholder
{
    color: #c5c5c5;
}
.wrap-contact  form input:focus::-ms-input-placeholder,
.wrap-contact  form textarea:focus::-ms-input-placeholder
{
    color: #c5c5c5;
}
.wrap-contact  form .submit
{
    line-height: 50px;

    margin-top: 30px;
    padding: 0 44px;

    color: #fff;
    border-radius: 0;
    background-color: #fc8c06;
}
.wrap-contact  form .submit:hover
{
    background-color: #fb9e31;
}

.joinwarp{width:100%;}
.joinleft{width:48%;float:left;margin-left:2%}
.joinright {
    width: 40%;
    float: right;
    background: #bf9c48;
    margin-top: 5.5%;
    margin-right: 5%;
    padding-bottom: 1.5%;
    color: #fff;
    padding-top: 30px;
    padding-left: 100px;
    line-height: 25px;
    border-radius: 5px;
}
.fa-email{background:url(../images/mail.png) no-repeat; background-size:cover;width:30px;height:20px; margin-right:4px;margin-top:3px;}
.fa-location{background:url(../images/map.png) no-repeat; background-size:cover;width:20px;height:30px;margin-right:4px;margin-top:3px;}
.fa-tel{background:url(../images/tel.png) no-repeat; background-size:cover;width:30px;height:30px;margin-right:4px;margin-top:3px;}

@media (max-width: 6000px){
	.banner3 {
		height:1860px
	}
}
@media (max-width: 5000px){
	.banner3 {
		height:1260px
	}
}
@media (max-width: 4000px){
	.banner3 {
		height:1160px
	}
}
@media (max-width: 3000px){
	.banner3 {
		height:860px
	}
}
@media (max-width: 2500px){
	.banner3 {
		height:650px
	}
}
.pc{display:block;}
.tel{display:none}
@media (max-width: 1440px){
	.banner3 {
		height:560px
	}
}

@media (max-width: 768px){
	.joinleft {
    width: 100%;
    float: left;
    margin-left: 2%;
}
.wrap-contact form textarea {
    line-height: 28px;
    width: 100%;
}
.tdleftb {
     float: none; 
    margin: 0px;
    /* margin-right: 8%; */
    margin-left: 4%;
    padding-right: 10px;
}
.tdleft {
     float: none; 
    margin-right: 4%;
    margin-left: 4%;
}
.wrap-contact form input {
    width: 100%;
}
.joinright {
    width: 100%;
    float: right;
    background: #bf9c48;
    margin-top: 5.5%;
    margin-right: 5%;
    padding-bottom: 1.5%;
    color: #fff;
    padding-top: 30px;
    padding-left: 74px;
    line-height: 25px;
    border-radius: 5px;
}
	.pc {
    display: block;
    overflow: hidden;
}
.wrap-contact {padding:0}
	/*.pc{display:none;}*/
	.tel{display:block;min-height: 1050px;}
	.formwarp{
	width:100%;min-height: 1050px;
	}
	.wrap-contact form textarea {
    line-height: 28px;
    width: 90%;
	}
	.submitdiv {
		width: 70%;
		height: 30px;
		margin: auto;
		background: #003567;
		position: absolute;
		left: 15%;
		top: 15px;
		padding-left:50px;
	}.submittr .btn_submit {
    width: 70%;
	}
	.newsbanner,.joinibanner {
		margin-top: 0px;
	}
	.newsbanner p,.joinibanner p {
		font-size:50px;
	}
    .banner3{
        height:150px;
        margin-top:40px;
        margin-bottom:0;
        background-size: contain;
    }
    .col-sm-5{
		width:100% !important;
	}
	.wrap-contact form input{
		width:90%;
	}
	.formfont2 {
		text-align:left;
	}
    .banner3 p{
        font-size:20px;
        padding:30px; 
    }
	.zonesdiv .zonesright .zonesfont1 {
		padding-top:20px;
	}

	.packagings .packagingsleft .packagingsfont {
		padding-left:40%;
		padding-top: 35px;
	}
	.packagings .packagingsright {
		width:100%!important;
		float:none;
	}
    .packagingsleft,.zonesleft{
        width:100%!important;
        float:none;
    }
    .packagingsfont,.zonesright{
        width:100%!important;
        float:none;
    }
    .packagings,.zonesdiv{
        width:100%;
    }
    .guoqidiv{
        width:100%;
        height:150px;
        background-size:contain;
        margin-bottom:0
       
    }
    .guoqidiv img{width:100%;}
    .guoqiA{
        width:40px; 
        left:30px;
        top:10px;
    }
    .guoqiB{
        width:40px;
        height:33px;
        left: 155px;
		top: 20px;
    }
    .guoqiC{
        width:40px; 
       left: 155px;
        top:70px;
    }
    
    .guoqi{ 
        width:50%;
    }
    .guoqifont{ 
        font-size:12px;padding-left:0%;padding-right:1%;width:36%;padding-top:5%;line-height:1.3
    }
    .zonesAleft,.zonesBright,.zonesCleft,.zonesDright{
        width:100%;
    } 
	.zonesBright,.zonesCleft{
		background-size: contain; 
	}
    .zonesfont4,.zonesfont6{
       padding-top: 12%;
	   padding-bottom:0
    }
    .zonesfont5,.zonesfont7{
        padding-left:20px;
        padding-bottom:13px;
    }
    .zonesdiv{
        width:100%;
        height:auto;
        min-height: 386px;
        margin: 0px auto
    }
    .packagings{
      height:auto;
        min-height:500px;
        margin-top:0;
    }
    .packagingsleft{
        height:280px!important
    }
	.registration-two .row {
		width: 85%;
		margin: auto;
	}
	.registration-two .row .downtxt_title .downtxt_title_form {
    float: right;
    width: 18%;
}
}












