
.WarpBgMain{ padding-bottom: 470px;}
.bannerDetails{ width: 100%;}
.bannerDetails img{ display: block; width: 100%; height: auto;}
.NavGation{ width: 100%; border-bottom: 1px solid #666;}
.NavGation .NavGation_Box{ width: 1200px; margin: 0 auto; height: 68px; overflow: hidden;}
.NavGation .NavGation_Box ul{ float: left; height: 68px; overflow: hidden;}
.NavGation .NavGation_Box ul li{ float: left; margin-right: 25px; line-height: 68px;}
.NavGation .NavGation_Box ul li a{ font-size: 15px; color: #000;}
.NavGation .NavGation_Box ul li a:hover{ color: #06d1e5;}
.NavGation .NavGation_Box .more{ transition: 0.5s; border-radius:29px ; display: block; float: right; width: 105px; height: 39px; border: 2px solid #44dceb; text-align: center; line-height: 39px; margin-top: 14px; color: #44dceb; font-size: 15px;}
.NavGation .NavGation_Box .more:hover{ background: #44dceb; color: #fff;}
.DetailsList_Container{ box-shadow: 0 0 0px rgba(0,0,0,0.1);}
.DetailsList_Container{ width: 100%; position: relative;}
.DetailsList_Container .layer1{ width: 100%; padding: 0px 0 0px 0;}
.DetailsList_Container .layer1Box{ width: 1200px; margin: 0 auto; padding-bottom: 65px}
.DetailsList_Container .title{ width: 100%;}
.DetailsList_Container .title h2{ height: 67px; line-height: 67px; font-size: 36px; color: #333; font-weight: bold;}
.DetailsList_Container .title .yadianqudong{ height: 67px; line-height: 67px; font-size: 36px; color: #fff; font-weight: bold;}
.DetailsList_Container .title span{ display: block; width: 250px; height: 3px; background: #09bcca;}
.DetailsList_Container .layer1 .Nr{ padding-top: 45px;}
.DetailsList_Container .NrBox{ width: 100%; height: 235px; position: relative;}
.DetailsList_Container .NrBox .bt{ transition: 0.5s; height: 150px; width: 260px; line-height: 150px; float: left; font-size: 22px; color: #666; text-indent: 32px; position: relative;}
.DetailsList_Container .NrBox .bt p{ transform: 0.5s; z-index: 1;  width: 26px; height: 26px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); border-radius:50%; padding: 6px; box-sizing: border-box;  transform: translate(-45%,-50%);}
.DetailsList_Container .NrBox:hover .bt p{background: rgba(133,218,231,0.5);}
.DetailsList_Container .NrBox:hover .bt p span{background: linear-gradient(#0eb7cf,#17d0c3);box-sizing: border-box;}
.DetailsList_Container .NrBox .bt p span{box-sizing: border-box; background: #ffffff; border: 2px solid #0db6ce; display: block; width: 100%; height: 100%; border-radius:50% ;}
.DetailsList_Container .NrBox:after{content: '';  width: 3px; height: 85px; position: absolute; left: 0; top: 0; background: #85dae6;}
.DetailsList_Container .NrBox:before{content: '';  width: 3px; height: 150px; position: absolute; left: 0; bottom: 0; background: #85dae6;}
.DetailsList_Container .NrBox:nth-child(1):after{ display: none;}
.DetailsList_Container .NrBox ul{ width: calc(100% - 260px); float: left;}
.DetailsList_Container .NrBox ul li{ width: 200px; float: left; margin: 0 25px 0 0; position: relative;}
.DetailsList_Container .NrBox ul li .icon{ width: 100%; height: 150px; overflow: hidden;}
.DetailsList_Container .NrBox ul li .icon img{ display: block; width: 100%; height: 100%;}
.DetailsList_Container .NrBox ul li p{ text-align: center; font-size: 18px; color: #333333; line-height: 26px; padding: 15px 0;}
.DetailsList_Container .NrBox ul li:last-child{ }
.DetailsList_Container .NrBox ul li:after{ width: 37px; height: 20px; position: absolute; right: -30px; top: 74px;content: ''; opacity: 0; }
 
.DetailsList_Container .NrBox ul li:nth-child(1){ z-index: 4;}
.DetailsList_Container .NrBox ul li:nth-child(2){ z-index: 3;}
.DetailsList_Container .NrBox ul li:nth-child(3){ z-index: 2;}
.DetailsList_Container .NrBox ul li:nth-child(4){ z-index: 1;}
.DetailsList_Container .NrBox ul li:last-child:after{ display: none!important;}
.DetailsList_Container .NrBox ul:hover li:after{ opacity: 1;}
.DetailsList_Container .layer2{ background: #f8f8f8; padding: 50px 0;}
.DetailsList_Container .layer2 .title h2{ text-align: center;}
.DetailsList_Container .layer2 .title span{ display: block; margin: 0 auto;}
.DetailsList_Container .layer2 ul{ text-align: center; padding-top: 95px;}
.DetailsList_Container .layer2 ul li{ overflow: hidden; transition: 0.5s; display: inline-block; margin: 0 13px; border-radius: 15px; margin-bottom: 72px;}
.DetailsList_Container .layer2 ul li .icon{ width: 100%; height: 310px; overflow: hidden;}
.DetailsList_Container .layer2 ul li .icon img{transition: 0.5s;}
.DetailsList_Container .layer2 ul li .text{ position: relative; padding: 40px 0 0 0; box-sizing: border-box; width: 100%; height: 180px; background: #fff;}
.DetailsList_Container .layer2 ul li .text h2{ font-size: 24px; text-align: center; color: #333;}
.DetailsList_Container .layer2 ul li .text a{ font-size: 16px; display: block; position: absolute; left: 50%; transform: translateX(-50%); bottom: 25px; width: 105px; height: 39px; border: 2px solid #0ccfc0; box-sizing: border-box; color: #0ccfc0; text-align: center; line-height: 35px; border-radius:19px;}
.DetailsList_Container .layer2Box{ width: 1200px; margin: 0 auto;}


.DetailsList_Container .layer3{}
.DetailsList_Container .layer3Box{ width: 1200px; margin: 0 auto; padding: 50px 0 180px 0; pointer-events: inherit;}
.DetailsList_Container .layer2 ul li:hover .icon img{ transform: scale(1.1);}
.DetailsList_Container .layer2 ul li:hover{ transform: translateY(-10px); box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.DetailsList_Container .layer2 ul li:hover .text a{ background: #0ccfc0; color: #fff;}


.DetailsList_Container .layer3Box{ width: 1200px; margin: 0 auto; position: relative;}
.DetailsList_Container .layer3Box ul{ position: relative; z-index: 1; overflow: hidden; padding-top: 60px;}
.DetailsList_Container .layer3Box ul li{ float: left; width: 195px; float: left; margin: 0 60px 0 0;}
.DetailsList_Container .layer3Box ul li h2{ text-align: center; font-size: 30px; text-align: center; color: #333;}
.DetailsList_Container .layer3Box ul li .icon{ width: 100%;}
.DetailsList_Container .layer3Box ul li img{ display: block; margin: 0 auto;}
.DetailsList_Container .layer3Box ul li p{ text-align: center; padding: 12px 0; font-size: 14px; line-height: 22px; color: #666;}
.DetailsList_Container .layer3Box ul li:nth-child(1){ padding-top: 145px;}
.DetailsList_Container .layer3Box ul li:nth-child(2){ padding-top: 100px;}
.DetailsList_Container .layer3Box ul li:nth-child(3){ padding-top: 40px;}
.DetailsList_Container .layer3Box img.bg{ position: absolute; left: 0; bottom: 70px;}

.DetailsList_Container .layer4{ width: 100%; height: 640px; background: #f8f8f8;}
.DetailsList_Container .layer4 .text{ width: 50%; float: left; height: 100%; padding:185px 0 0 0;}
.DetailsList_Container .layer4Box{ width: 1200px; margin: 0 auto; overflow: hidden;}
.DetailsList_Container .layer4 .text h2{ font-size: 36px; font-weight: bold; color: #0ab4cf; margin: 0 0 40px 0;}
.DetailsList_Container .layer4 .text span{ display: block; font-size: 20px; margin-bottom: 15px; font-weight: bold; color: #333;}
.DetailsList_Container .layer4 .text p{ width: 460px; font-size: 15px; color: #666;}
.DetailsList_Container .layer4 .icon{ width: 50%; float: left; margin: 0 auto; padding-top: 145px;}
.DetailsList_Container .layer4 .icon img{ display: block; margin: 0 auto;}


.DetailsList_Container .layer5{ width: 100%; height: 790px; background: url(../images/DetailsList3_02.png); background-size:100% 100%; padding: 75px 0 0 0;}
.DetailsList_Container .layer5Box{  position: relative; width: 1140px; margin: 45px auto 0 auto; }
.DetailsList_Container .layer5Box .swiper-container{ overflow: hidden;}
.DetailsList_Container .layer5 .title h2{ text-align: center;}
.DetailsList_Container .layer5 .title span{ margin: 0 auto;}
.DetailsList_Container .layer5 .text{ border-radius:0 0 20px 20px ; width: 100%; padding: 35px 35px 0 35px; box-sizing: border-box; background: #00000066; height: 315px;}
.DetailsList_Container .layer5 .text h2{ font-size: 24px; color: #fff; margin-bottom: 15px;}
.DetailsList_Container .layer5 .text p{ font-size: 14px; color: #fff; line-height: 18px;}
.DetailsList_Container .layer5 .text dl{ padding: 12px 0 0 0;}
.DetailsList_Container .layer5 .text dl dd{ line-height: 30px;}
.DetailsList_Container .layer5 .text dl dd a{ font-size: 15px; color: #fff;}
.DetailsList_Container .layer5 .text dl dd img{ width: 8px; height: 12px; display: inline-block; vertical-align: middle; margin-left: 10px; transform: translateY(-2px);}
.DetailsList_Container .layer5 .text a.enter{ margin-top: 30px; font-size: 16px; display: block;  width: 105px; height: 39px; border: 2px solid #0ccfc0; box-sizing: border-box; color: #0ccfc0; text-align: center; line-height: 35px; border-radius:19px;}

.DetailsList_Container .layer5Box .swiper-button-next{ width: 24px; height: 42px; background:url(../images/index_65.png) ;right: -76px;}
.DetailsList_Container .layer5Box .swiper-button-prev{ width: 24px; height: 42px; background:url(../images/index_62.png) ;left: -76px;}
.DetailsList_Container .layer5Box .swiper-button-prev:after{ display: none; }
.DetailsList_Container .layer5Box .swiper-button-next:after{ display: none; }
.DetailsList_Container .layer6{ width: 100%; padding: 160px 0; background: #f8f8f8;}
.DetailsList_Container .layer6 img{ display: block; margin: 0 auto;}


.DetailsList_Container .layer7{ border-bottom: 1px solid #989898; height: 750px; background: url(../images/bgIcon_03.png) right center no-repeat;}
.DetailsList_Container .layer7Box{ width: 1200px; margin: 0 auto; position: relative; padding: 140px 0 0 0;}
.DetailsList_Container .layer7Box ul{ width: 100%; height: 100%;}
.DetailsList_Container .layer7Box ul li{ position: relative; width:335px; height: 200px; float: left; border: 4px solid #0bbfc9; margin: 0 70px 58px 0; border: 4px solid #0bbfc9;}
.DetailsList_Container .layer7Box ul li:nth-child(3n){ margin: 0 0 0 0;}
.DetailsList_Container .layer7Box ul li:nth-child(4){ height: 225px;}
.DetailsList_Container .layer7Box ul li:nth-child(5){ height: 225px;}
.DetailsList_Container .layer7Box ul li:nth-child(6){ height: 225px;}
.DetailsList_Container .layer7Box ul li:nth-child(1){ opacity: 0;}
.DetailsList_Container .layer7Box ul li .icon{ width: 85px; left: 45px; top: 0; transform: translateY(-50%); background: #fff; position: absolute;}
.DetailsList_Container .layer7Box ul li .icon img{ transition: 0.5s; display: block; margin: 0 auto;}
.DetailsList_Container .layer7Box ul li .text{ padding:45px 25px 0 25px; box-sizing: border-box;}
.DetailsList_Container .layer7Box ul li .text h2{ font-size: 20px; color: #333; padding-bottom: 15px;}
.DetailsList_Container .layer7Box ul li .text p{ font-size: 15px; line-height: 22px; color: #666;}
.DetailsList_Container .layer7 .bt { position: absolute; left: 0; top: 140px;}
.DetailsList_Container .layer7 .bt h2{ font-size: 36px; color: #333;}
.DetailsList_Container .layer7 .bt p{ font-size: 22px; width: 230px; line-height: 32px; color: #747474; font-weight: normal;}
.DetailsList_Container .layer7Box ul li:hover .icon img{ transform: rotateY(360deg);}

.DetailsList_Container .layer8{ padding-bottom: 75px;}
.DetailsList_Container .layer8Box{ position: relative; width: 1140px; margin: 0 auto;}
.DetailsList_Container .bt{ width: 1140px; margin: 0 auto; height: 110px; line-height: 110px; font-size: 28px; color: #333; font-weight: bold;}
.DetailsList_Container .layer8Box .Nr{ border: 1px solid #e7e7e7; border-radius:8px; overflow: hidden;}
.DetailsList_Container .layer8Box .icon{ width: 100%; height: 195px;}
.DetailsList_Container .layer8Box .icon img{ display: block; width: 100%; height: 100%;}
.DetailsList_Container .layer8Box p{ height: 48px; line-height: 48px; text-align: center; background: linear-gradient(#2cbed5,#0bcec1); text-align: center; color: #fff;}
.DetailsList_Container .layer8 .swiper-container{ width: 100%; overflow: hidden;}
.DetailsList_Container .layer8Box .swiper-button-next{ margin: 0; background: url(../images/index_80.png); width: 15px; height: 26px; right: -30px; top: 50%; transform: translateY(-50%);}
.DetailsList_Container .layer8Box .swiper-button-prev{ margin: 0; background: url(../images/index_77.png);  width: 15px; height: 26px; left: -30px; top: 50%; transform: translateY(-50%);}
.DetailsList_Container .layer8Box .swiper-button-next:after{ display: none;}
.DetailsList_Container .layer8Box .swiper-button-prev:after{ display: none;}


@media(max-width:1200px ) {
	.DetailsList_Container .title span{ width: 100%;}
	.DetailsList_Container{ padding-bottom: 50px;}
	.NavGation .NavGation_Box{ width: 100%; padding: 0 10px; box-sizing: border-box;}
	.NavGation .NavGation_Box ul{ width: 100%;}
	.DetailsList_Container .NrBox .bt{ width: 100%; float: inherit;}
	.DetailsList_Container .NrBox{ width: 100%; height: auto; }
	.DetailsList_Container .layer1Box{ width: 100%; padding: 0 15px; box-sizing: border-box;}
	.DetailsList_Container .NrBox ul{ overflow: hidden; float: inherit; width: 100%; padding-left: 15px; box-sizing: border-box;}
	.DetailsList_Container .NrBox ul li{ width: 49%; margin: 0 2% 0 0;}
	.DetailsList_Container .NrBox ul li:nth-child(2n){ margin-right: 0;}
	.DetailsList_Container .NrBox:before{ height: 50%;}
	.DetailsList_Container .NrBox:after{ height: 50%;}
	.DetailsList_Container .NrBox:nth-child(1):after{ display: block;}
	.DetailsList_Container .NrBox:last-child .bt{ display: none;}
	.DetailsList_Container .layer2Box{ width: 100%; height: auto;}
	.DetailsList_Container .title h2{ font-size: 18px;}
	.DetailsList_Container .layer2{ padding: 45px 15px; box-sizing: border-box;}
	.DetailsList_Container .layer2 ul{ padding: 45px 0 0 0;}
	.DetailsList_Container .layer2 ul li{ display: block; width: 100%; margin: 0 0 15px 0;}
	.DetailsList_Container .layer2 ul li .icon{ height: auto;}
	.DetailsList_Container .layer3Box{ padding: 45px 15px; box-sizing: border-box; width: 100%; margin: 0 auto;}
	.DetailsList_Container .layer3Box ul li:nth-child(1){ padding: 0;}
	.DetailsList_Container .layer3Box ul li:nth-child(2){ padding: 0;}
	.DetailsList_Container .layer3Box ul li:nth-child(3){ padding: 0;}
	.DetailsList_Container .layer3Box ul li{ width: 49%; margin: 0 2% 35px 0; float: left;}
	.DetailsList_Container .layer3Box ul li:nth-child(2n){ margin-right: 0;}
	.DetailsList_Container .layer3Box img.bg{ display: none;}
	
	.DetailsList_Container .layer4{ height: auto;}
	.DetailsList_Container .layer4Box{ width: 100%; padding: 45px 15px; box-sizing: border-box; overflow: hidden;}
	.DetailsList_Container .layer4 .text{ width: 100%; height: auto; padding: 0;}
	.DetailsList_Container .layer4 .icon{ width: 100%; padding: 35px 0 0 0;}
	.DetailsList_Container .layer4 .icon img{ width: 50%; height: auto; margin: 0 auto;}
	.DetailsList_Container .layer5{ width: 100%; overflow: hidden; padding: 0 15px; box-sizing: border-box;}
	.DetailsList_Container .layer6{ padding: 50px 0;}
	.DetailsList_Container .layer6 img{ width: 90%; margin: 0 auto;}
	.DetailsList_Container .layer7Box{ width: 100%; padding: 30px 15px; box-sizing: border-box; overflow: hidden;}
	.DetailsList_Container .layer7{ height: auto;}
	.DetailsList_Container .layer7 .bt{ text-align: center; height: auto; position: relative; width: 100%; top: auto; left: auto;}
	.DetailsList_Container .layer7 .bt p{ width: 100%;}
	.DetailsList_Container .layer7Box ul{ padding-top: 50px; overflow: hidden;}
	.DetailsList_Container .layer7Box ul li{ background: #fff; width: 100%; margin: 0 0 25px 0; float: left; box-sizing: border-box; height: auto;}
	.DetailsList_Container .layer7Box ul li:nth-child(1){ display: none;}
	.DetailsList_Container .layer7Box ul li:nth-child(3){ margin-bottom: 25px;}
	.DetailsList_Container .layer7Box ul li:nth-child(4){ height: auto;}
	.DetailsList_Container .layer7Box ul li:nth-child(5){ height: auto;}
	.DetailsList_Container .layer7Box ul li:nth-child(6){ height: auto;}
	.DetailsList_Container .layer7Box ul li .text{ padding:15px; box-sizing: border-box;}

	.DetailsList_Container .layer7Box ul li .icon{ position: relative; margin: 0 auto; transform: none; left: auto; top: auto; padding-top: 25px;}
	.DetailsList_Container .layer7Box ul li .text h2{ text-align: center;}
	.DetailsList_Container .layer8{ width: 100%; padding: 0 25px; box-sizing: border-box; overflow: hidden;}
	.DetailsList_Container .layer8Box .swiper-button-prev{ display: none;}
	.DetailsList_Container .layer8Box .swiper-button-next{ display: none;}
	.DetailsList_Container .layer4 .text p{ width: 100%;}
	
}