<template>
    <div>
        <div class="about-box">
            <div class="title">关于我们</div>
            <p>我们是一群爱搞怪、也爱帮忙的年轻人。日常最爱做的事，就是用微信模拟器帮朋友解决“场面尴尬”</p>

            <p>我们不鼓励撒谎，但我们支持用幽默化解小尴尬。 每一个功能都做到真实不穿帮，只为在你需要的时候，帮你圆一个小小的场、开一个无伤大雅的玩笑、或者逗笑一个不开心的人。</p>

            <p>有点皮，有点暖，你的“面子急救队”随时在线。</p>
        </div>

        <AppFooter />
    </div>
</template>
<script setup>
import AppFooter from '@/components/common/AppFooter.vue'
</script>

<style lang="scss" scoped>
.about-box {
    width: 1200px;
    min-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    background: url('/src/public/about-bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 100px 56px 200px;

    .title {
        position: relative;
        font-weight: 700;
        font-size: 40px;
        color: #1A1A1A;
        line-height: 46px;
        margin-bottom: 88px;

        &::after {
            content: '';
            display: inline-block;
            width: 120px;
            height: 33px;
            background-image: url('@/public/index/decoration1.png');
            background-size: 100%;
            background-repeat: no-repeat;
            position: absolute;
            left: 26px;
            bottom: -34px;
            opacity: 50%;
        }
    }

    p {
        width: 745px;
        margin-top: 50px;
        font-family: 'Source Han Sans', 'Microsoft YaHei', sans-serif;
        font-size: 25px;
        color: #1A1A1A;
        line-height: 37px;
        font-weight: 500;
    }
}
</style>