.n-banner{
	width: 100%; display: block; height: 100vh; background: #000;
}
.n-banner .text{
	top: 50%; left: 50%; margin-left: -6rem; transform: translateY(-50%); position: absolute;
}
.n-banner .text h2{
	font-size: .36rem; line-height: .42rem; color: #fff; display: block; margin-bottom: .4rem; font-family: "SourceHanSansCN-Normal";
}
.n-banner .text p{
	font-size: .24rem; line-height: .36rem; color: rgba(255,255,255,.6); display: block; max-width: 6.8rem; margin: .08rem 0; font-family: "SourceHanSansCN-Normal"; letter-spacing: -.6px;
}
.n-banner .text .certificate{
	margin-top: .64rem; display: flex; justify-content: space-between;
}
.n-banner .text .certificate .img{
	margin-right: 1.12rem;
}
.n-banner .text .certificate .list{
	font-size: 0;
}
.n-banner .text .certificate .list ul{
	display: block;
}
.n-banner .text .certificate .list ul li{
	margin-right: .5rem; display: inline-block; vertical-align: top;
	font-size: .18rem; color: #ccc; font-family: "SourceHanSansCN-Normal";
}
.n-banner .text .certificate .list ul li span{
	display: block; font-size: .18rem; line-height: 1.5; color: #ccc; font-family: "DIN-Regular";
}


.n-banner .pic{
	position: absolute; top: 50%; right: 50%; margin-right: -6.54rem; transform: translateY(-50%);
}

.container {
	display: block; width: 100%; margin: 0;
}



.main{ width: 13.6rem; position: relative;}
.nav-left{ display: inline-block; position: fixed; right: 4.5%; top: 50%; transform: translateY(-50%);z-index: 1;}
.nav-left.fixed{ position: fixed; top: 1.9rem; left: 50%;}
.nav-left.absolute{ position: absolute; top: auto; bottom: 0;}
.nav-left ul{ width: 100%; display: block;}
.nav-left ul li{ }
.nav-left ul li a{margin-bottom: .1rem; width: .11rem; height: .11rem; border-radius: 50%; display: block; position: relative; background-color: #777;}
.nav-left ul li.cur a{ background-color: #fff; }







/*  floordrain 01  */
.floordrain-01{ width: 100%; height: 100vh; overflow: hidden; position: relative; background: #3c3c3c;}
.floordrain-01 .box-con{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/floordrain-01.png) no-repeat ;background-position: center 70%; }


/*  floordrain 02  */
.floordrain-02{ width: 100%; height: 100vh; position: relative; background: url(../images/floordrain-02.png) no-repeat center center / cover; overflow: hidden;  }
.floordrain-02 .box-con{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/floordrain-02.svg) no-repeat 18.5% 29vh / auto 5.53rem; }


/*  floordrain 03  */
.floordrain-03{ width: 100%; height: 100vh; position: relative; background: url(../images/floordrain-03.png) no-repeat center center / cover; }
.floordrain-03 .box-con{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/floordrain-03.svg) no-repeat 18.5% center / auto 1.92rem; }

/*  floordrain 04  */
.floordrain-04{ width: 100%; height: 100vh; position: relative; background: url(../images/floordrain-04.png) no-repeat center center / cover; }
.floordrain-04 .box-con{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/floordrain-04.svg) no-repeat 18.5% center / auto 1.44rem; }





/**/
.floordrain-05{
	width: 100%; display: block; font-size: 0; padding: 1.1rem 0 .94rem;
}
.floordrain-05 .tit{
	display: block; width: 100%;
}
.floordrain-05 .tit h2{
	color: #000; display: block; font-size: .36rem; line-height: .5rem;
}
.floordrain-05 .list{
	width: 100%; display: flex; justify-content: space-around; margin-top: .7rem;
}
.floordrain-05 .list .info{
	text-align: center;
}
.floordrain-05 .list .info .text{
	width: 100%; text-align: center; margin-top: .34rem; position: relative;
}
.floordrain-05 .list .info .text span{
	width: 100%; display: block; font-size: .32rem; color: #333; line-height: .6rem;
}
.floordrain-05 .list .info .text .number{
	width: 100%; display: block; font-size: .36rem; color: #333; line-height: .8rem;
}
.floordrain-05 .list .info .text::after{
	content: "\e70b"; font-family: "iconfont"; font-size: .8rem; color: #333; right: -.5rem; top: 50%; transform: translateY(-50%); position: absolute;
}
.floordrain-05 .list .info:nth-last-of-type(1) .text::after{
	display: none;
}
@media screen and ( min-width:1280px) {
	.floordrain-01, .floordrain-01 .box-con, .floordrain-02, .floordrain-02 .box-con, .floordrain-03, .floordrain-03 .box-con, .floordrain-04, .floordrain-04 .box-con{ background-attachment: fixed;}
}

@media screen and ( min-width:1360px) {

	.floordrain-05 .main{
		width: 12.8rem;
	}
}

@media screen and ( max-width:768px) {
	.container {

	}
	.main {
		width: 100%;
	}
	.n-banner{
		padding: 1rem .2rem; box-sizing: border-box; height: auto;
	}
	.n-banner .text{
		position: relative; left: 0; top: 0; margin: 0; transform: translateY(0);
	}
	.n-banner .text h2{
		font-size: .24rem;
		line-height: 1.5;
	}
	.n-banner .text p{
		margin: 0;
		font-size: .18rem;
	}
	.n-banner .pic{
		position: relative; top: 0; right: 0; margin: .9rem 0 0; transform: translateY(0); text-align: center;
	}
	.n-banner .pic img{
		max-width: 2rem;
	}
	.n-banner .text .certificate{
		margin-top: 0;
		flex-wrap: wrap;
	}
	.n-banner .text .certificate .list,
	.n-banner .text .certificate .list ul{
		width: 100%;
	}
	.n-banner .text .certificate .list ul{
		margin-top: .6rem; display: flex; justify-content: space-around; box-sizing: border-box; padding: 0 .2rem;
	}
	.n-banner .text .certificate .list ul li{
		margin-right: 0;
	}
	.n-banner .text .certificate .img{
		width: 100%; margin: .5rem 0 0; text-align: center;
	}
	.n-banner .text .certificate .img img{
		max-width: 100%;
	}

	/* 01 */
	.floordrain-01 {
		height: auto;
	}
	.floordrain-01 .box-con{
		padding: 60vw 6% 0;
		box-sizing: border-box;
		background: url(/images/floordrain-01-m.jpg) top center no-repeat;
		background-size: 100% auto;
		display: flex;
		flex-wrap: wrap;
		position: relative;
	}


	.floordrain-01 .box-con .box-list {order: 1;margin-bottom: .6rem;}
	.floordrain-01 .box-con .box-list,
	.floordrain-01 .box-con .box-list ul{
		display: block; font-size: 0; text-align: center; width: 100%; 
	}
	.floordrain-01 .box-con .box-list ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.floordrain-01 .box-con .box-list ul li {
		width: 48%;
		margin-bottom: .3rem;
	}
	.floordrain-01 .box-con .box-list ul li img {
		width: 70%;
	}
	.floordrain-01 .box-con .box{
		display: block; position: relative; padding: 0; width: 100%;
	}
	.floordrain-01 .box-con .box .img{
		display: block; width: 100%; text-align: center; position: relative;
	}
	.floordrain-01 .box-con .box .img img{
		margin-right: .86rem;
		max-width: 100%;
	}

	.floordrain-01 .box-con .box .list ul {
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.floordrain-01 .box-con .box .list ul li {
		margin-bottom: .2rem;
		font-size: .16rem;
		width: 49%; height: 1.5rem;
	}
	.floordrain-01 .box-con .box-list ul li i{
		margin: 0 auto; width: .7rem; height: .7rem; display: flex; justify-content: center; align-items: center; border-radius: 50%; border: 1px solid #fff;
	}
	.floordrain-01 .box-con .box-list ul li span {
		margin-top: .15rem; font-size: .16rem; line-height: 1.5; display: inline-block; vertical-align: top; text-align: center; font-family: "SourceHanSansCN-Normal"; color: #eee;
	}
	.floordrain-01 .box-con .box .list ul li h2{
		font-size: .2rem;line-height: .24rem; display: block; color: #fff; margin-bottom: .12rem; font-family: "SourceHanSansCN-Normal";
	}
	.floordrain-01 .box-con .box .list ul li h2 .index {
		font-size: .22rem; line-height: .24rem; margin-right: .1rem;
	}
	.floordrain-01 .box-con .box .list ul li p{
		font-size: .16rem; display: block; line-height: .24rem; color: #ccc; font-family: "SourceHanSansCN-Normal";
	}

	/*02*/
	.floordrain-02 {
		background: url(../images/floordrain-02-m.jpg) no-repeat top left/ cover; height: 4.3rem;
	}
	.floordrain-02 .box-con {
		background:none
	}
	.floordrain-02 .tit{
		font-size: .2rem; line-height: .24rem; color: #fff; position: absolute; top: 1.2rem; left: .23rem; display: block; font-family: "SourceHanSansCN-Normal";
	}
	.floordrain-02 .text{
		font-size: .12rem; line-height: .20rem; color: #ccc; position: absolute; bottom: .4rem; left: .23rem; display: block; font-family: "SourceHanSansCN-Normal";
	}
	/*03*/
	.floordrain-03 {
		background:#1e1e1e url(../images/floordrain-03-m.jpg) no-repeat top center/ 100% auto; height: 4.3rem;
	}
	.floordrain-03 .box-con {
		background:none; width: 100%; height: auto; position: absolute; bottom: .4rem; top: auto; left: 0;padding: 0 6%;box-sizing: border-box; 
	}
	.floordrain-03 .tit{
		font-size: .2rem; line-height: .24rem; color: #fff; display: block; font-family: "SourceHanSansCN-Normal"; margin-bottom: .2rem;
	}
	.floordrain-03 .text{
		font-size: .12rem; line-height: .20rem; color: #ccc; display: block; font-family: "SourceHanSansCN-Normal";
	}

	/*04*/
	.floordrain-04 {
		background:#000 url(../images/floordrain-04-m.jpg) no-repeat top center/ auto 100% ; height: 4.3rem; overflow: hidden;
	}
	.floordrain-04 .box-con {
		background:none; width: 100%; height: auto; position: absolute; bottom: .4rem; top: auto; left: 0;padding: 0 6%;box-sizing: border-box; 
	}
	.floordrain-04 .tit{
		font-size: .2rem; line-height: .24rem; color: #fff; display: block; font-family: "SourceHanSansCN-Normal"; margin-bottom: .2rem;
	}
	.floordrain-04 .text{
		font-size: .12rem; line-height: .20rem; color: #ccc; display: block; font-family: "SourceHanSansCN-Normal";
	}
	/*05*/
	.floordrain-05 {
		margin-top: .4rem;
		padding: .6rem 0 0 0;
	}
	.floordrain-05 .tit h2 {
		font-size: .24rem;
		line-height: 1.5;
	}
	.floordrain-05 .list {
		flex-wrap: wrap;
	}
	.floordrain-05 .list .info {
		margin-bottom: .9rem;
	}
	.floordrain-05 .list .info img {
		margin: 0 auto;
		width: 80%;
		display: block;
	}
	.floordrain-05 .list .info .text {
		margin-top: .15rem;
		display: flex;
		justify-content: center;
	}
	.floordrain-05 .list .info .text::after {
		font-size: .4rem;
		left: 50%; top: 120%;
		transform: translateX(-50%) rotate(90deg);
		width: .4rem; height: .4rem;
	}
	.floordrain-05 .list .info .text .number {
		order: 0;
		width: auto;
		line-height: .4rem;
		font-size: .24rem;
		color: #333;
	}
	.floordrain-05 .list .info .text span {
		order: 1;
		width: auto;
		line-height: .4rem;
		font-size: .24rem;
		color: #5a5a5a;
	}


}