
@charset "UTF-8";
/*@import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic);*/
@import url(font-awesome.min.css);
*{
    box-sizing: border-box;
    font-family: Tahoma;
}

body{
background: #fff;
}


.header{
 min-height: 32px !important;
 overflow: hidden;
}



@media only screen and (max-width: 999px)
{
	 .menu{
	 	display: none;
	 }
	 .banner1 {
	    padding: 39px 10px 26px 10px;
	    float: left !important;
	    margin: 0px !important;	    
	    width: 249px;color: #fff;
	}

.content-frame{
	width: 100%;
	margin: 150px auto 50px auto;
	overflow: hidden;
	min-height: 200px;
	background: rgba(202, 206, 207, 0.25);
	padding: 20px;
}


	.content{
		width: 580px;
		min-height: 100px;
		overflow: hidden;
		margin: 20px 0px 20px 0px;
	}

	.content img{
		width: 150px;
		height:135px;
		display: block;float: left;
		border: 1px solid rgb(0,0,0);
	}
	.content-right{
		float: right;
		width: 400px;
		min-height: 150px;
		overflow: hidden;
	}
	.content-title{
		padding: 5px 0px 5px 0px;
		font-size: 20px;
		color: #2a6496;
	}
	.content-text{
		font-size: 13.5px;
		text-align: justify;

	}

	.main_introduction
	{
		
		min-height: 100px;
		overflow: hidden;
		width: 100%;
		margin: 0px auto
	}
	.left_introduction{
		display: none;
	}

	.right_introduction
    {
	    width: 100%; margin: 0px auto; min-height: 100px; overflow: hidden;
	    box-shadow: -15px 0px 15px 0px rgba(57, 64, 72, 0.11);
	    padding:3px 15px 15px 15px;
	    clip-path: inset(8px 0px 0px -35px);
    } 

}	

@media only screen and (max-width: 400px)
{
	 .banner1 {
	    padding: 39px 10px 26px 10px;
	    float: left !important;
	    margin: 0px !important;
	    background: rgba(3, 18, 63, 0.04);
	    width: 100%;color: #fff;
	}

	.content-frame{
		width: 100%;
		margin: 150px auto 50px auto;
		overflow: hidden;
		min-height: 200px;
		background: rgba(202, 206, 207, 0.25);
		padding: 20px;
	}


	.content{
		width: 100%;
		min-height: 100px;
		overflow: hidden;
		margin: 20px 0px 20px 0px;
	}

	.content img{
		width: 150px;
		height:135px;
		display: block;
		border: 1px solid rgb(0,0,0);
	}
	.content-right{
		width: 100%;
		min-height: 150px;
		overflow: hidden;
		margin: 5px;
		padding: 5px;
	}
	.content-title{
		padding: 5px 0px 5px 0px;
		font-size: 20px;
		color: #2a6496;
	}
	.content-text{
		font-size: 13.5px;
		text-align: justify;

	}


}	



@media only screen and (min-width: 1000px)
{
	.menu{
		padding: 0px;
		margin: 3px 0px 0px 0px;
		display: block;
		width: 70%;
		float: right;
		background: rgb(16, 57, 119);
		box-shadow: -3px -3px 0px rgba(179, 179, 179, 0.33);
		clip-path: inset(-3px 0px 0px -3px);
	}

	.menu>ul{
		margin: 0px;
		padding: 0px;
		width: 880px;
	}
	.menu>ul>a>li{
		display: inline-block;
		padding: 0px 35px 0px 15px;
		line-height: 45px;
		color: #fffdfd;
		font-weight: bold;
		text-shadow: 0px 1px rgba(90, 0, 0, 0.23);
		text-transform: uppercase;
	}
	.menu>i{
		display: none;
	}

	 .banner1 {
	    padding: 39px 10px 26px 10px;
	    float: left !important;
	    margin: 0px !important;
	    width: 25%;color: #fff;
	 }	

	.content-frame{
	width: 1200px;
	margin: 50px auto 50px auto;
	overflow: hidden;
	min-height: 200px;
	background: rgba(202, 206, 207, 0.25);
	padding: 20px;
	}


	.content{
		width: 580px;
		min-height: 100px;
		overflow: hidden;
		margin: 20px 0px 20px 0px;
	}

	.content img{
		width: 150px;
		height:135px;
		display: block;float: left;
		border: 1px solid rgb(0,0,0);
	}

	.content:nth-child(even){
	float: right;
	}

	.content:nth-child(odd){
	float: left;
	}
	.content-right{
		float: right;
		width: 400px;
		min-height: 150px;
		overflow: hidden;
	}
	.content-title{
		padding: 5px 0px 5px 0px;
		font-size: 20px;
		color: #2a6496;
	}
	.content-text{
		font-size: 13.5px;
		text-align: justify;

	}

	.main_introduction
	{
		
		min-height: 100px;
		overflow: hidden;
		width: 1200px;
		margin: 0px auto
	}
    .left_introduction{
    	float: left;width: 300px;padding-top: 18px;
    }
    .right_introduction
    {
	    width: 900px; margin: 0px auto; min-height: 100px; overflow: hidden;
	    box-shadow: -15px 0px 15px 0px rgba(57, 64, 72, 0.11);
	    padding:3px 15px 15px 15px;clip-path: inset(8px 0px 0px -35px);
    }          
}

@media only screen and (min-width: 1200px) {

   .logo{
   	display: none !important;
   }

}	

@media only screen and (max-width: 1199px) {

   .header_background{
   	display: none;
   }

}	


.hotline-fix{
	display: block !important;
}

.change-panel{
min-height: 90px;
background: rgba(9, 62, 140, 0.78);
margin-top: -90px;
position: relative;
box-shadow: 0px -5px 5px rgba(242, 242, 242, 0.5);
}



.mini-panel
{
	width: 240px;
	float: left;
	text-align: center;
	line-height: 25px;
	color: #fff;
	font-size: 20px;
	padding: 12px 20px 0px 20px;
	cursor: pointer;
}

.info-panel{
	height: 220px;
	width: 960px;
	margin: 0px auto;
	color: #fff;
	padding: 15px;

}
.header-panel{
font-size: 20px;
line-height: 22px;
padding: 15px 0px 15px 15px;
width: 550px;
border-bottom: 3px solid #05b9ff;
position: relative;
background: rgba(254, 250, 250, 0.29);
}
[control-panel]{

border-top:3px solid rgb(255,255,255); 	

}
[control-panel]:hover{

border-top:3px solid rgb(5, 140, 254); 	

}
.detail-panel
{
min-height: 150px;
background: rgba(4, 79, 153, 0.46);
width: 550px;
padding: 10px 10px 10px 20px;
font-size: 17px;
overflow: hidden;
}
[detail-panel]{
	display: none;
}
.detail-panel>h3{
  margin-top:0px !important;
}
/**/
@media only screen and (min-width: 1028px) {

	.request{
		width:480px;
		float: left;
		min-height: 90px;
		overflow: hidden;
		margin-bottom: 35px;
	}

	.request:nth-child(2n){
	 margin-left: 30px; 
	}

	.request-title{
		font-size: 17px;
		padding: 10px 0px 10px 97px;
		font-weight: bold;

	}

	.request-info > img {
		width: 80px;
		height: 80px;
		float: left;
	}

	.request-text{
		width: 360px;
		float: right;
		padding: 8px;
		text-align: justify;
		border-top: 2px solid rgb(0,0,0);
		font-size: 13.5px;
	}

	.sign-in
	{
		float: right;
		width: 420px;
		padding: 20px;
		background: rgb(255,255,255);
		box-shadow: 0px 2px 4px 0px rgba(2, 29, 41, 0.23);
		margin: 0px 5px 5px 0px;
		border-top: 4px solid rgb(2, 174, 254);
	}

}	

@media only screen and (max-width: 1027px) {

	.request{
		width:50%;
		float: left;
		min-height: 90px;
		overflow: hidden;
		margin-bottom: 35px;
	}

	.request-title{
		font-size: 17px;
		padding: 10px 0px 10px 97px;
		font-weight: bold;

	}

	.request-info > img {
		width: 80px;
		height: 80px;
		float: left;
	}
	
	.request-text{
		width: 80%;
		float: right;
		padding: 8px;
		text-align: justify;
		border-top: 2px solid rgb(0,0,0);
		font-size: 13.5px;
	}

	.sign-in-canvas > div{
		width: 100% !important;
	}
	.sign-in-canvas .hear{
		width: 500px !imporant;
		padding: 10px;
	}

    #signIn{
    	float: left !important;
    	width: 420px !important;
		padding: 20px;
		background: rgb(255,255,255);
		box-shadow: 0px 2px 4px 0px rgba(2, 29, 41, 0.23);
		margin: 10px;
		border-top: 4px solid rgb(2, 174, 254);    	
    }

    .copy-right{
    	width: 100% !important;
    }

}

@media only screen and (max-width: 400px) {

	.request{
		width:100%;
		float: left;
		min-height: 90px;
		overflow: hidden;
		margin-bottom: 35px;
	}


	.request-title{
		font-size: 17px;
		padding: 10px 0px 10px 97px;
		font-weight: bold;

	}

	.request-info > img {
		width: 80px;
		height: 80px;
		float: left;
		margin: 10px;
	}
	
	.request-text{
		width: 80%;
		float: right;
		padding: 8px;
		text-align: justify;
		border-top: 2px solid rgb(0,0,0);
		font-size: 13.5px;
	}

	.sign-in-canvas > div{
		width: 100% !important;
	}

	.sign-in-canvas .hear{
		width: 100% !imporant;
		padding: 10px;
	}

	#signIn
	{
    	float: left !important;
    	width: 100% !important;
		padding: 20px;
		background: rgb(255,255,255);
		box-shadow: 0px 2px 4px 0px rgba(2, 29, 41, 0.23);
		margin: 10px;
		border-top: 4px solid rgb(2, 174, 254);    	
    }

}


.footer{
    min-height: 90px;
    background: rgb(8, 133, 191);
    margin: 0px auto;
    overflow: hidden;
}
.copy-right{
	color: #fff;
	border-top: 1px solid #fff;
	width: 960px;
	margin: 0px auto;
	padding:2px;
	line-height: 40px;
	display: block;

}
.address{
	min-height: 50px;
}

/**/
.product-canvas{
width: 100%;
overflow: hidden;
min-height: 100px;
background: rgba(3, 18, 63, 0.04);
margin: 1px 0px 0px 0px;
}

.product-set{
	width: 960px;
	margin: 0px auto;
	min-height: 100px;
	overflow: hidden;
}

.product{
	width:192px;
	float: left;
	min-height: 90px;
	overflow: hidden;
}
.product-title{
	font-size: 15px;
	padding: 10px 0px 0px 0px;
	font-weight: bold;
	text-align: center;
	width: 150px;
	margin: 5px auto 0px auto;
	border-top: 2px solid rgb(0,0,0);

}
.product-info > img {
	width: 100px;
	height:80px;
	margin: 0px auto;
	display: block;
}

/*
*/
@media only screen and (min-width: 1000px)
{
	.phone
	{
		position: fixed;
		z-index: 20;
		right: 50px;
		top:40px;
		width: 250px;
    }

.show-panel{
	height:439px;
	width: 100%;
	margin-top: -439px;
	position: relative;
	background: rgba(48, 59, 65, 0.39);

}

	.inside-panel{
		min-width: 100px;
		max-width: 960px;
		margin: 0px auto;
		height: 90px;
		overflow: hidden;
	}

    .mobile_header{
    	display: none;
    }	

}

@media only screen and (max-width: 999px)
{
	
	.show-panel,.inside-panel,.header{
      display: none;
    }

	.phone
	{
		position: absolute;
		z-index: 20;
		left: 5px;
		top:80px;
		width: 250px;
    }

    .request-frame{
			min-height: 150px;
			width: 100%;
			margin: 30px auto;
			overflow: hidden;
    }
    .mobile_header{
    	width: 100%;
    	min-height: 30px;
    	overflow: hidden;
    	position: fixed;
    	top: 0px; left: 0px;
    	background: #fff;
    	z-index: 30;
    	padding:5px 10px 0px 10px;
    }

	.mobile_header i {
	    display: block;
	    float: right;
	    font-size: 25px;
	    line-height: 55px;
	    cursor: pointer;
	    color: rgb(68, 60, 58);
	}
    
    .mobile_header > ul{
    	border-top:1px solid rgb(0,0,0) ;
    	margin:3px 0px 0px 0px; 
    }

	.mobile_header > ul  li {
	    width: 100%;
	    padding: 10px;
	    color: #560303;
	    font-weight: bold;
	    text-shadow: 0px 1px rgba(255, 255, 255, 0.38);
	    text-transform: uppercase;
	    list-style-type: none;
	}

	


}

@media only screen and (min-width: 1000px)
{

    	.header{
			width: 100%;
			position: relative;
			z-index: 3;
			margin-top: -50px;
	    }
	    .request-frame{
				min-height: 150px;
				width: 1028px;
				margin: 30px auto;
				overflow: hidden;
	    }

}

@keyframes ring {
    from {box-shadow: 0px 0px 0px 0px  rgba(252, 5, 5, 0.5);}
      to {box-shadow: 0px 0px 0px 15px rgba(252, 5, 5, 0.5);}
}

.phone-icon
{
	float: left;
	height: 55px;
	width: 55px;
	margin: -8px -30px 0px 0px;
	background: rgb(255, 6, 6);
	position: relative;
	color: #fff;
	border-radius: 28px;
	font-size: 35px;
	text-align: center;
	padding: 10px;
    animation-name: ring;
    animation-duration: 1.5s;	
    animation-iteration-count: infinite;

}

.phone-number{
	font-weight: bold;
	background: rgb(7, 129, 195);
	float: left;
	border-radius: 30px;
	padding: 5px 15px 5px 40px;
	color: #fff;
	font-size:20px;
    border: 1px solid rgba(255, 255, 255, 0.29);
}

.sign-in-canvas
{
	width: 100%;
	overflow: hidden;
	min-height: 100px;
	background: rgba(3, 18, 63, 0.04);
	margin: 1px 0px 0px 0px;
}

.blue-line
{
	height: 2px;
	width: 200px;
	background: rgb(2, 174, 254);
}

.hear
{
	float: left;
	padding: 20px 0px 0px 0px;
	width: 500px;
}
.hear-text{
	font-size: 15px;
	text-align: justify;
	padding: 10px 0px 20px 0px;
}

.sign-in>input[type='text'] {
	width: 98.5%;
	margin: 5px;
	height: 40px;
	font-size: 17px;
	border: 1px solid rgb(193, 195, 198);
	padding: 0px 15px 0px 15px;
}

.sign-in>textarea{
	width: 98.5%;
	margin: 5px;
	height: 100px;
	font-size: 17px;
	border: 1px solid rgb(193, 195, 198);
	padding: 0px 15px 0px 15px;	
}

.sign-in > button
{
  border-radius:20px;
  line-height: 30px;
  width: 120px;
  background: rgb(15, 152, 206);
  color: #fff;
  font-size: 15px;
  font-weight: bold;
}
/**/

.banners-main {
    margin-top: 0;
    position: relative;
    z-index: 2;    
    background: rgba(3, 18, 63, 0.04);
}

.wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

.banner1 .banner_txt3 {
    color: black !important;
    min-height: 100px;
    text-overflow: ellipsis;
    width: 100%;
    overflow: hidden;
    padding: 10px 0px 10px 0px;
}

.banner1 h4{
	color: rgb(0,0,0);
	padding: 10px 0px 0px 5px;
}

.more_btn3 {
    display: inline-block;
    margin-top: 10px;
    text-decoration: none;
    padding: 19px 30px;
    font: bold 15px/15px "Lato", 'Arial';
    color: #fff;
    background: #ee1c25;
    padding: 10px;
}

.banner1 .fa {
    color: #EE1C25 !important;
}
.banner_txt2 {
    font: 600 25px/25px 'Lato', 'Arial';
    margin-top: 5px;
}
.banner_txt2 {
    height: 35px;
}

.banner1 .fa {
    color: #EE1C25 !important;
}
.box {
    overflow: hidden;
}

.banner1 .banner_txt1 {
color: black !important;
line-height: 37px;
padding-left: 20px;
}

.banner_txt1 {
    font: 600 30px/30px 'Lato', 'Arial';
    margin-top: 3px;
}

.icon1 {
    font: normal normal 90px/90px 'FontAwesome';
    float: left;
    text-align: left;
    width: 102px;
    margin-right: 0;
}

.text-point {
    font-weight: bold;
    color:#2794B2;
}

