.application{
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
.application .application_head{
	width: 100%;	
	text-align: left;	
	position:fixed;
}
.application .application_head .description{
	display: inline-block;
	position: relative;
	width: 60%;
	margin:0 auto;
	left: 20%;
	line-height: 20px;
	font-size: 16px;
	font-weight: 300;
	vertical-align: middle;
	background-repeat: no-repeat;
}
.application .application_head .description p{
	margin-top: 10px;
}
.application .application_head .high{
	display: inline-block;
	vertical-align: middle;
	width: 0.5px;
	height: 550px;
	margin-left: -5.5px;
}
.application .application_head h1{
	margin-bottom: 25px;
	line-height: 80px;
}
.application .application_head ul{vertical-align: top;}
.application .application_head h2{
	line-height: 70px;
}
.application .application_head li{
	width: 47.5%;
	margin-right: 4%;
	display:inline-block;
	margin-bottom: 25px;
	vertical-align: top;
}
.application .application_head li:nth-child(2n){
	margin-left: -4.5px;
	margin-right: 0;
}
.application section{
	height: 880px;
	position: relative;
	top: 550px;
	width: 100%;
}
footer{
	position: relative;
	top:550px;
}


.application .item{
	transition: all 1s;
	padding-top: 110px;
	float: left;
	height: 100%;
}
.application .item li{
	position: relative;
	width:23%;
	margin: 0 auto;
	display: inline-block;
	overflow: hidden;
	height: 37%;
	text-align: center;
    border: 5px solid #fff;
    vertical-align: middle;
    margin-bottom: 40px;
    margin-right: 1%;
    margin-left: 4.5px;
    box-sizing: border-box;
}
.application .item li:nth-child(4n){margin-right:0;}
.application .item li img{height: 100%;transition: all 1s;}
.application .item li .txt{
	background: rgba(239,255,9,0.3);
    position: absolute;
    text-align: center;
    transition: all 1s;
    transform: rotateY(180deg);
    opacity: 0;
    width: 100%;
    top: 0;
    height: 100%;
    left: 0;
}
.application .item li h1{
    vertical-align: middle;
    margin: auto 0;
    font-weight: 700;
    display: inline-block;
    width: 100%;
    font-size: 36px;
    text-align: center;
  	cursor: pointer;  	
  	position: absolute;
  	top: 150%;
  	transition: all 1s;
  	left: 0;
}
.application .item li h2{
	position: absolute;
	left: 30px;
	top: 25px;
	color: #ffb828;
	font-weight: 600;
}
.application .item li:hover h2{
	display: none;
}
.application .item li:hover h1{
  	top:50%;
  	transform:translateY(-50%);
}
.application .item li a{
	position: relative;
	z-index: 1;
	display: inline-block;
	width: 90px;
	font-size: 14px;
	line-height: 28px;
	position: absolute;
	
	border-radius: 3px;
	color: #333;
	border: 1px solid;
	transition: all 1s;
	bottom: -30px;
}
.application .item li a:before{
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	width: 0;
	background: #ffb828;
    height: 100%;
    z-index: -1;
    border-radius: 3px;
    transition: all 1s;
}
.application .item li a:hover::before{width: 100%;}
.application .item li a:hover{color: #fff;}
.application .item li:hover a{right: 30px;bottom: 30px;}
.application .page_max{width: 90%;}
.application .page_min{width: 3.33%;}

.application .page1{background-color: rgb(178,228,228);}
.application .page2 li,.application .page3 li,.application .page4 li{display: none;}
.application .page2{background-color:rgb(221,232,177);}
.application .page3{background-color: rgb(160,210,245);}
.application .page4{background-color: rgb(212,245,216);}
.application .item .arrow{
	font-size: 25px;
	vertical-align: middle;
	position: relative;
	top: 44%;
}
.application .page_max .arrow p{display: none;}


/*应用领域详情页面*/
.application_details{
	width: 100%;
	padding-top: 100px;
}
.application_details .application_content{
	/*width: 1500px;*/
	width: 98%;
	margin: 0 auto;
	/*padding: 20px;*/
}

.application_details .west{
	width: 100%;
	display: inline-block;
	background-color: #fff;
	text-align: center;
}
.application_details .wave_head{
	/*padding-top:10px;*/
	vertical-align: top;
}
.application_details .wave_head .top_img{
	position: relative;
}
.application_details .wave_head img{
	width: 100%;
}
.application_details .wave_head h1{
	margin-bottom: 10px;
	line-height: 70px;
	font-size: 35px;
	text-indent: 1em;
	color: #fff;
	position: absolute;
	width: 100%;
	text-align: center;
	bottom: 45%;
}

.application_details .wave_head .head_img{
	width:100%;
	display: inline-block;
	overflow: hidden;
	vertical-align: top;
	margin: 0 auto;
}
.application_details .wave_head .describe{	
	width: 60%;
	margin-left: -5px;
	display: inline-block;
	padding-left: 20px;
	vertical-align: middle;
	text-align: center;
}
.application_details .wave_head .describe .text{
	text-align: left;
	font-size: 16px;
	line-height: 32px;
	color: #333;
	vertical-align: top;
}
.application_details .wave_head .describe .text h3{
	font-size: 25px;
	color: #000;
	font-weight: 600;
	line-height: 60px;
}
.application_details .wave_head .describe .text .left{
	display: inline-block;
	width: 47%;	
	margin-right: 5%;
	vertical-align: top;

}
.application_details .wave_head .describe .text .right{
	display: inline-block;
	width: 47%;	
	vertical-align: top;
}
.application_details .wave_head .describe .nav{	
	display: inline-block;
	margin-top: 30px;
	font-size: 16px;
}
.application_details  .nav-pills>li>a{
	position: relative;	
	z-index: 1;
}
.nav-pills>li.active>a, 
.nav-pills>li.active>a:focus, 
.nav-pills>li.active>a:hover{
	background-color: #ffb828;
}
.nav>li>a:focus, .nav>li>a:hover{
	background-color: rgba(0,0,0,0);
	color: #fff;
}
.application_details  .nav-pills>li>a:before{
	content: "";
	position: absolute;
	height: 100%;
	width: 0px;
	left: 0;
	top: 0;
	background-color: #ffb828;
	z-index: -1;
	transition: all 1s;
	border-radius: 3px;
}
.application_details  .nav-pills>li>a:hover::before{
	width: 100%;
}
.application_details .details .tab-pane{
	width: 80%;
	margin: 0 auto;
	position: relative;
	vertical-align: top;
	padding: 40px 0;
}
.application_details .details .tab-pane .app_left_img{
	display: inline-block;
	width: 40%;
	margin-right: 5%;
}
.application_details .details .tab-pane .app_right_text{
	display: inline-block;
	width: 40%;
	vertical-align: top;
	text-align: left;
}
.application_details .details .tab-pane .left_bt{
	position: absolute;
	left: -30px;
	font-size: 50px;
	top: 45%;
	color: #adadad;
}

.application_details .details .tab-pane .right_bt{
	position: absolute;
	right: -30px;
	font-size: 50px;
	top: 45%;
	color: #adadad;
}

.application_details  .nav-tabs>li{
	background: #83c3ff;
    border-right: 1px solid #ffffff;
}

.application_details .wave_head .describe .tab-pane{
	padding: 0 20px;
}

/*波浪样式*/
.wave_head {
 	background-color:rgb(168,211,253);
  	color: #fff;
}
.canvas-wrap {
  max-width: 100%;
  overflow: hidden;
  position: relative;
}

canvas {
  display: block;
}
/*中间文字*/
.application_details .txt_excessive{
	background-color: #efefef;
	padding: 80px 0;

}
.application_details .txt_excessive div{
	width: 1000px;
	margin: 0 auto;
	text-align: left;
	font-size: 17px;
	line-height: 32px;
}
.application_details .txt_excessive h2{
	font-size: 27px;
	line-height: 60px;
}

/*相关产品*/
.application_details .product_list{
	background-color:#fff;
	padding: 50px 0;
}
.application_details .product_list h1.title{
	margin-left: 10%;
	text-align: left;
	line-height: 1em;
	font-size: 36px;
	font-weight: 500;
	color: #333;
	margin-bottom: 30px;
}
.application_details .product_list ul{
	width: 80%;
	margin: 0 auto;
	
}
.application_details .product_list li{
	display: inline-block;	
	width: 24.3%;
	margin-right: 1%;
	margin-bottom: 10px;
	margin-left: -4.5px;
	box-shadow: 5px 5px 8px #acc7e1;
}
.application_details .product_list li:nth-child(4n){margin-right: 0;}
.application_details .product_list li a>div{
	height: 230px;
	overflow: hidden;
}
.application_details .product_list li img{
	transition: all 1.2s;
	height: 100%;
}
.application_details .product_list li h4{
	line-height: 50px;
	color: #fff;
	font-size: 16px;
	background-color: #337ab7;
	transition: all 1s;
}
.application_details .product_list li:hover img{
	transform: scale(1.1);
}
.application_details .product_list li:hover h4{
	color: #ffb828;
}


/*应用领域 响应式*/
@media (max-width:1700px) {
	.application .item{padding-top: 90px;}
	.application section{height: 740px;}
	.application .application_head h1,.application .application_head h2{font-size: 34px;}
	.application .application_head .description{width: 66%}
	.application .item li h1{font-size: 34px;}

  	/*应用领域终极页面*/
  	.application_details .details .tab-pane,.application_details .product_list ul{width: 84%;}
  	.application_details .product_list li h4{font-size: 15px;}
}
@media (max-width:1560px) {
	.application .item li{height: 39%;}
	.application section{height: 650px;top: 520px;}
	.application .item li h2{font-size: 28px;}
	footer {top: 520px;}
	.application .application_head .high{height: 520px;}
	.application .application_head h1,.application .application_head h2{font-size: 32px;}

	

  	/*应用领域终极页面*/
  	.application_details .details .tab-pane,.application_details .product_list ul{width: 90%;}
  	.application_details .product_list li img{height: 220px;}
}
@media (max-width:1460px) {
	.application .application_head .description{width: 70%;left: 15%}
	.application .item li h2{font-size: 26px;}
	.application .item li h1{font-size: 32px;}
	.application .item li:hover a{right: 20px;bottom: 20px;}


	/*应用领域终极页面*/
	.application_details .wave_head h1{font-size: 32px;}
  	.application_details .details .tab-pane,.application_details .product_list ul{width: 95%;}  	
	.application_details .details .tab-pane .left_bt{left: -10px;}
	.application_details .details .tab-pane .right_bt{right: -10px;}
	.application_details .details .tab-pane .app_right_text{width: 45%;}
	.application_details .product_list h1.title{font-size: 34px;}	
	.application_details .txt_excessive{padding: 70px 0;}
}
@media (max-width:1360px) {
	.application .item li h1{font-size: 30px;}
	.application section{height: 570px;}
	.application .item li{width: 24%;margin-right: 0.5%;margin-bottom: 10px;}
	.application .application_head h1,.application .application_head h2{font-size: 30px;margin-bottom: 0;line-height: 60px;}

	/*应用领域终极页面*/
	.application_details .wave_head h1{font-size: 30px;}
  	.application_details .product_list ul{width: 97%;}
  	.application_details .product_list li img{height: 200px;}
  	.application_details .product_list li h4{font-size: 14px;}
  	.application_details .wave_head .describe{width: 85%;padding-left: 0;margin-left: 0;}
  	.application_details .product_list li a>div{height: 220px;}
}
@media (max-width:1250px) {
	.application .item li a{line-height: 25px;width: 81px;}
	.application .item li h2{font-size: 24px;}
	/*应用领域终极页面*/
	.application_details .product_list li h4{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
	.application_details .details .tab-pane .app_left_img{margin-bottom: 3%;}
	.application_details .details .tab-pane .app_right_text{width: 48%;}
	.application_details .product_list h1.title{font-size: 32px;}
	
}
@media (max-width:1160px) {
	.application section{height:480px;}
	.application .item{padding-top: 60px;}
	.application .item li{ height: 41%;}
	.application .application_head h1,.application .application_head h2{font-size: 28px;}
	.application .application_head .description{width: 80%;left: 10%;font-size: 15px;}
	.application .item li h2 {font-size: 24px;left: 20px;top: 20px;}
	.application .item li h1{font-size: 28px;}

	/*应用领域终极页面*/
	.application_details .wave_head h1{font-size: 28px;}
  .application_details .product_list ul{width: 98%;}
  .application_details .product_list li img{height: 190px;}
  .application_details .wave_head .describe{width: 90%;}
  .application_details .details .tab-pane .app_left_img{margin-bottom: 1%;}
	.application_details .details .tab-pane .app_right_text{width: 50%;}
	.application_details .product_list li a>div{height: 190px;}
	.application_details .product_list li img{height: 100%;}
}
@media (max-width:1000px) {
	.application .application_head .description{width: 90%;left: 5%;}
	.application .application_head h1{font-size: 26px;}
	.application section{height: 390px;}
	.application .item li{border: 4px solid #fff;margin-right: 0.4%;}
	.application .application_head h1,
	.application .application_head h2{font-size: 26px;line-height: 50px;}
	.application .item li h1{font-size: 26px;}
	.application .item li:hover a{right: 15px;bottom: 15px;}
	.application .item li h2{font-size: 22px;left: 10px; top: 10px;}

	/*应用领域终极页面*/
	.application_details .product_list li img{height: 160px;}
	.application_details .details .tab-pane{width: 99%;}
	.application_details .details .tab-pane .left_bt{left: -5px;}
	.application_details .details .tab-pane .right_bt{right: -5px;}
	.application_details .details .tab-pane .app_left_img{width: 43%;}
	.application_details .txt_excessive div{width: 90%;font-size: 16px;}
	.application_details .product_list h1.title{font-size: 30px;}
	.application_details .txt_excessive{padding: 60px 0;}
	.application_details .product_list li a>div{height: 170px;}

}
@media (max-width:870px) {
	.application .item li{width: 32%;height: 29%;}
	.application .item li:nth-child(5n){margin-right: 0.5%;}
	.application section{height: 600px;}	
	.application .page_max{width: 88%;}
	.application .page_min{width: 4%;}
	.application .item .arrow{font-size: 23px;}
	.application .application_head h1,
	.application .application_head h2{font-size: 24px;}
	.application .item li h2 {font-size: 22px;left: 18px;top: 18px;}
	.application .item{padding-top: 45px;}
	.application .item li h1{font-size: 24px;}
	.application .item li:hover a{right: 10px;bottom: 10px;}

	/*应用领域终极页面*/
	.application_details .wave_head h1{font-size: 26px;}
	.application_details .product_list li img{height: 145px;}
	.application_details .product_list li h4{font-size: 13px;}
	.application_details .wave_head .describe{width: 95%;}
	.application_details .details .tab-pane{width: 90%;}
	.application_details .details .tab-pane .app_left_img{width: 80%;margin: 0;}
	.application_details .details .tab-pane .app_right_text{width: 80%;margin: 0;margin-top: 20px;}
	.application_details .product_list h1.title{font-size: 28px;}
	.application_details .txt_excessive h2{font-size: 26px;}
	.application_details .product_list li a>div{height: 155px;}
}
@media (max-width:768px) {
	.application .item li h2 {font-size: 20px;left: 10px;top: 10px;}
	.application>div:nth-child(1){height: 0px!important;}
	.application .application_head .description{width: 95%;left: 2.5%;}
	.application section{height: 550px;}
	.application .application_head h1{font-size: 24px;}
	.application .page_max{width: 85%;}
	.application .page_min{width: 5%;}
	.application .item .arrow{font-size: 21px;}
	.application .application_head h1,
	.application .application_head h2{font-size: 22px;line-height: 40px;}
	.application .application_head li{width: 49%; margin-right: 2%;}
	.application .item li h1{font-size: 22px;}

	/*应用领域终极页面*/
	.application_details{padding-top: 0;}
	.application_details .wave_head h1{font-size: 24px;bottom: 34%;}
	.application_details .product_list ul{text-align: left;}
	.application_details .product_list li h4{text-align: center;}
	.application_details .product_list li{width: 32.5%;margin-bottom: 5px;}
	.application_details .product_list li:nth-child(3n){margin-right: 0%;}
	.application_details .product_list li:nth-child(4n){margin-right: 1%;}
	.application_details .product_list li img{height: 160px;}
	.application_details .nav>li>a{padding: 5px 8px;}
	.application_details .details .tab-pane{width: 95%;}
	.application_details .product_list h1.title{font-size: 26px;}
	.application_details .txt_excessive{padding: 50px 0;}
	.application_details .txt_excessive h2{font-size: 24px;}
	.application_details .wave_head .describe .text{font-size: 15px;line-height: 26px;}
	.application_details .wave_head .describe .text .left{width: 48%;margin-right: 3%;}
	.application_details .wave_head .describe .text .right{width: 48%;}
	.application_details .product_list li a>div{height: 140px;}
	.application_details .product_list li h4{line-height: 40px;}
}
@media (max-width:650px) {
	.application section{height: 460px;}

	/*应用领域终极页面*/
	.application_details .wave_head h1{font-size: 22px;bottom: 32%;}
	.application_details .product_list li img{height: 145px;}
	.application_details .wave_head .describe{width: 99%;}
	.application_details .nav>li>a{padding: 3px 6px;}
	.application_details .details .tab-pane .app_left_img{width: 90%;}
	.application_details .details .tab-pane .app_right_text{width: 90%;}
}
@media (max-width:600px) {	
	.application .item li h2 {font-size: 18px;left: 8px;top: 8px;}
	.application .item li h1{font-size: 20px;}
	/*应用领域终极页面*/
	.application_details .wave_head h1{font-size: 21px;bottom: 31%;}
	.application_details .product_list li img{height: 120px;}
	.application_details .product_list li h4{font-size: 12px;line-height: 40px;}

	.application_details .wave_head .describe .nav{width: 400px;font-size: 15px;}
	.application_details .nav-pills>li{width: 130px;display: inline-block;margin-bottom: 10px;}
	.application_details .nav>li>a{padding: 6px 10px;}
	.application_details .details .tab-pane{width: 98%;}
	.application_details .wave_head .describe .text{font-size: 14px;line-height: 23px;}
	.application_details .txt_excessive{padding: 40px 0;}
	.application_details .txt_excessive div{font-size: 15px;line-height: 26px;}
}
@media (max-width:550px) {
	.application section{height: 650px;}
	.application .item li{margin-right: 0.3%;width: 45%;height: 21%;}
	.application .page_max{width: 79%;}
	.application .page_min{width: 7%;}
	.application .item .arrow{font-size: 20px;}
	.application .application_head h1,
	.application .application_head h2{font-size: 20px;line-height: 38px;font-weight: 600;}
	.application .item li:hover a{right: 5px;font-size: 13px;bottom: 5px;line-height: 20px; width: 70px;}

	/*应用领域终极页面*/
	.application_details .wave_head h1{font-size: 20px;bottom: 27%;}
	.application_details .product_list li,
	.application_details .product_list li:nth-child(3n){width: 49%;margin-left: 0;margin-right: -4.5px;}
	.application_details .product_list li:nth-child(2n){margin-right: 0%;margin-left: 2%;}
	.application_details .product_list li img{height: 165px;}
	.application_details .details .tab-pane .app_left_img{width: 95%;}
	.application_details .details .tab-pane .app_right_text{width: 95%;}
	.application_details .product_list h1.title{font-size: 24px;}
	.application_details .txt_excessive h2{font-size: 22px;}
}
@media (max-width:500px) {
	.application .item li h1{font-size: 18px;margin-top: -8px;}
	.application section{height: 600px;}
	.application .item li h2 {font-size: 17px;}
	.application .item li:hover a{right: 4px; font-size: 12px;bottom: 5px;line-height: 19px;width: 69px;}

	/*应用领域终极页面*/
	.application_details .product_list li img{height: 145px;}
	.application_details .wave_head h1{bottom: 22%;}
		.application_details .details .tab-pane .app_left_img{width: 98%;}
	.application_details .details .tab-pane .app_right_text{width: 98%;}	
	.application_details .txt_excessive{padding: 30px 0;}

}
@media (max-width:400px) {
	.application .item li h1{font-size: 17px;}
	.application section{height: 490px;}
	.application .page_max{width: 76%;}
	.application .page_min{width: 8%;}
	.application .item .arrow{font-size: 19px;}
		.application .application_head h1,
	.application .application_head h2{font-size:18px;line-height: 35px;}

	/*应用领域终极页面*/
	.application_details .wave_head h1{bottom: 17%;}
	.application_details .product_list ul{width: 99%;}
	.application_details .product_list li img{height: 135px;}

	.application_details .wave_head .describe .nav{width: 338px;}
	.application_details .nav-pills>li{width: 110px;display: inline-block;margin-bottom: 8px;}
	.application_details .nav>li>a{padding: 5px 5px;}
	.application_details .product_list h1.title{font-size: 22px;}
	.application_details .txt_excessive h2{font-size: 20px;}
	.application_details .txt_excessive div{ font-size: 14px; line-height: 23px;}
	.application_details .product_list li a>div{height: 130px;}
	.application_details .product_list{padding: 40px 0;padding-bottom: 20px;}

}
@media (max-width:360px) {
	.application section{height: 430px;}
	.application .item li{height: 20%;}
	.application .page_max{width: 73%;}
	.application .page_min{width: 9%;}
	.application .application_head h1,
	.application .application_head h2{font-size: 17px;line-height: 32px;}

	/*应用领域终极页面*/
	.application_details .wave_head h1{bottom: 13%;}
	.application_details .product_list li img{height: 125px;}
}