article.index { max-width: 750px; margin: 0 auto; } article.index .banner { position: relative; } article.index .banner .banner_pic { width: 100%; } article.index .banner .link { position: absolute; bottom: 0; width: 16rem; margin-left: -8rem; left: 50%; height: 8.5rem; background: url("../images/link.png") no-repeat center; background-size: 100% 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #850f11; } article.index .banner .link > h4 { font-size: 1rem; font-weight: bold; } article.index .banner .link p { font-size: .75rem; font-weight: bold; margin: .1rem 0 .3rem 0; } article.index .banner .link a { display: inline-block; text-align: center; width: 7rem; height: 1.875rem; color: #fff799; border: none; line-height: 1.875rem; background: linear-gradient(to bottom, #c01e1e, #db3333, #a70909); border-radius: .4rem; font-weight: 600; font-size: .875rem; } article.index .content { background: url("../images/bg.jpg") no-repeat top; padding-bottom: 2rem; background-size: cover; } article.index .content .title { position: relative; text-align: center; letter-spacing: 2px; } article.index .content .title > span { display: inline-block; text-align: center; padding: 0 .3rem; height: 1.8rem; line-height: 1.8rem; color: #fff; background: #a91110; position: relative; z-index: 2; } article.index .content .title .line { position: absolute; height: 1px; background: #ea9594; width: 100%; top: 0.9rem; z-index: 1; } article.index .list { padding: 0 1.125rem; margin-top: .5rem; } article.index .list h4 { padding-left: .625rem; color: #fff; font-weight: bold; margin-bottom: .3rem; font-size: .95rem; position: relative; } article.index .list h4::after { content: ""; width: 1px; height: 1rem; background: #fff; top: 2px; left: 0; position: absolute; } article.index .list ul { margin-left: .625rem; } article.index .list ul li { font-size: .875rem; color: #e4dada; line-height: 1.5; text-align: justify; }