<template>
    <div class="footer-box">
        <div class="top-box">
            <div class="item left">
                <div class="title">关于我们</div>
                <p class="">
                    我们是一个由“整蛊爱好者”和“戏精本精”组成的团队，致力于打造一个开放、包容、充满创意的平台——让每个人都能轻松释放自己的想象力，用图片编辑的方式创作出独一无二的恶搞作品。
                </p>
            </div>
            <div class="item right">
                <div class="title">联系方式</div>
                <div class="desc" style="margin-top: 0;">在线客服：</div>
                <div class="desc">公司：红红火火恍恍惚惚或或或或</div>
                <div class="desc">地址：红红火火恍恍惚惚或或或或或或</div>
            </div>
        </div>
        <div class="bottom-text">《用户协议》、《隐私政策》、《退款政策》</div>
    </div>
</template>

<script setup>
</script>

<style lang="scss" scoped>
.footer-box {
    background-color: #1A1A1A;
    width: 100%;
    padding: 24px;

    .top-box {
        margin: 0 auto;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 200px;

        .item {
            width: 489px;

            .desc {
                font-size: 12px;
                color: #979797;
                line-height: 12px;
                margin-top: 16px;
            }
        }
    }

    .title {
        font-weight: 700;
        font-size: 14px;
        color: #FFFFFF;
        line-height: 24px;
        margin-bottom: 9px;
    }

    p {
        font-weight: 400;
        font-size: 12px;
        color: #979797;
        line-height: 25px;
        max-width: 489px;
    }

    .bottom-text {
        font-size: 14px;
        color: #979797;
        line-height: 12px;
        margin-top: 28px;
        width: 100%;
        text-align: center;
    }
}
</style>
