/* 关于banner */
.n-banner{ width: 100%; display: block; position: relative;}
.n-banner .text{ top: 50%; left: 50%; margin-left: -6rem; transform: translateY(-50%); position: absolute;}
.n-banner .text h2{ font-size: .36rem; line-height: .6rem; color: #fff; display: block; margin-bottom: .22rem; font-family: "SourceHanSansCN-Normal";}
.n-banner .text p{ font-size: .48rem; line-height: .64rem; color: #fff; display: block; font-family: "SourceHanSansCN-Normal";}
.n-banner .pic{ display: block; text-align: center; width: 100%;}
.n-banner .pic img{ max-width: 100%;}

.container { display: block; width: 100%; margin: 0;}


/* 关于 - 类目 */
.nav-list{ display: block;font-size: 0; margin-top: .36rem;}
.nav-list ul{ display: block; text-align: right; font-size: 0;}
.nav-list ul li{ display: inline-block; margin: 0 .26rem; position: relative;}
.nav-list ul li::after{ content: ""; position: absolute; left: -.26rem; top: 50%; transform: translateY(-50%); width: 2px; height: .2rem; background: #e6000f;}
.nav-list ul li a{ font-size: .2rem; color: #e6000f; font-family: "SourceHanSansCN-Normal"; line-height: .36rem; position: relative; display: inline-block; transition: all 0.3s ease-in-out;}
.nav-list ul li a:hover{ opacity: .7;}
.nav-list ul li a::after{ content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #e6000f; opacity: 0;}
.nav-list ul li.cur a::after{ opacity: 1;}
.nav-list ul li:first-of-type::after{ display: none;}

/* 主体 */
.box{ display: block; width: 100%; font-size: 0; margin: 1.4rem 0;}
/* 主体 - 标题 */
.box .box-l{ width: 4rem; display: inline-block; vertical-align: top;}
.box .box-l h2{ font-size: .48rem; color: #e6000f; font-family: "SourceHanSansCN-Normal"; line-height: 1;}
/* 主体 - 内容 */
.box .box-r{ width: 8.1rem; display: inline-block; vertical-align: top;}
/* 主体 - 简介 */
.box .box-r .company{ display: block;}
.box .box-r .company p{ font-size: .24rem; line-height: 1.5; margin-bottom: .16rem; font-family: "SourceHanSansCN-Normal"; color: #3c3c3c;}
.box .box-r .company .img{ display: block; margin-top: .6rem;}
/* 主体 - 故事 */
.box .box-r .story{ display: block;}
.box .box-r .story p{ font-size: .24rem; line-height: 1.5; margin-bottom: .16rem; font-family: "SourceHanSansCN-Normal"; color: #3c3c3c;}
.box .box-r .story .list-tit{ display: block; margin: 1.8rem 0 .3rem;}
.box .box-r .story .list-tit .button{ font-size: .3rem; color: #b4b4b4; margin-right: .97rem; position: relative; display: inline-block; cursor: pointer; transition: all 0.3s ease-in-out; font-family: "SourceHanSansCN-Normal";}
.box .box-r .story .list-tit .button::after{ content: ""; width: 2px; height: .3rem; position: absolute; right: -.49rem; top: 50%; transform: translateY(-50%); background: #e6000f;}
.box .box-r .story .list-tit .button:last-child::after{ display: none;}
.box .box-r .story .list-tit .button.cur,
.box .box-r .story .list-tit .button:hover{ color: #e6000f;}
.box .box-r .story .text{ display: none;}
.box .box-r .story .text.cur{ display: block;}

/* 手机适配 */
@media screen and ( max-width:768px){
	.n-banner .text{ left: .46rem; margin-left: 0; width: 100%;}
	.n-banner .text h2{ font-size: .12rem; line-height: 1.5; margin-bottom: .08rem;}
	.n-banner .text p{ font-size: .16rem; line-height: .2rem}

	.nav-list ul{ text-align: center;}
	.box{ margin: .5rem 0 .3rem;}
	.box .box-l{ width: 100%; text-align: center; margin-bottom: .2rem;}
	.box .box-l h2 {font-size: .3rem;}
	.box .box-r{ width: 100%;}
	.box .box-r .company p{ font-size: .2rem;}
	.box .box-r .company .img{ margin-top: .3rem;}
	.box .box-r .company .img img{ max-width: 100%;}
	.box .box-r .story p{ font-size: .2rem;}
	.box .box-r .story .list-tit{ margin-top: .3rem; display: flex; justify-content: space-between;}
	.box .box-r .story .list-tit .button{ margin-right: 0; font-size: .24rem;}
	.box .box-r .story .list-tit .button::after{ right: -.15rem; height: .24rem;}
}