<template>
    <div>


        <div class="w1400">
            <div class="info-bos">
                <section class="info-logo page-logo">
                    <!-- <img src="../../../../resources/jpg/info-logo.png" alt=""> -->

                    <h1>회원정보</h1>
                </section>
                <div class="info-sec-grid">


                    <!-- 기본 회원정보 -->
                    <section class="info-sec">

                        <div>
                            <p class="info-th">아이디</p>
                            <p>keris</p>
                        </div>
                        <div>
                            <p class="info-th">비밀번호</p>
                            <p>******</p>
                        </div>
                        <div>
                            <p class="info-th">회원구분</p>
                            <p>기업회원</p>
                        </div>
                        <div>
                            <p class="info-th">업체명</p>
                            <p>oo업체</p>
                        </div>
                        <div>
                            <p class="info-th">이메일</p>
                            <p>k*****@naver.com</p>
                        </div>
                        <div>
                            <p class="info-th">담당자명</p>
                            <p>홍*동</p>
                        </div>
                        <div>
                            <p class="info-th">메일 구독서비스</p>
                            <p>구독</p>
                        </div>

                    </section>


                    <!-- 기업 회원정보 -->
                    <section class="info-sec-1">

                        <section>
                            <p><img src="../../../../resources/jpg/zigaksa.jpg" alt=""></p>
                        </section>
                        <div>
                            <p class="info-th">업체명</p>
                            <p>oo업체</p>
                        </div>
                        <div>
                            <p class="info-th">업체 키워드</p>
                            <p>#꼼꼼함#꼼꼼함#꼼꼼함#꼼꼼함</p>
                        </div>
                        <div>
                            <p class="info-th">업체 소개글</p>
                            <p class="info-td">안녕하세요 우리업체는 ....</p>
                        </div>
                        <div>
                            <p class="info-th">첨부파일</p>
                            <a style="font-size: 15px;" class="down-btn-1"
                                href="https://webst.edunet.net/AIDT/AI 디지털교과서 개발 가이드라인.pdf" target='_blank' download>
                                회사소개서.pdf
                            </a>
                        </div>
                        <div>
                            <p class="info-th">명함</p>
                            <a style="font-size: 15px;" class="down-btn-1"
                                href="https://webst.edunet.net/AIDT/AI 디지털교과서 개발 가이드라인.pdf" target='_blank' download>
                                명함.pdf
                            </a>
                        </div>

                    </section>



                    <section class="info-sec-bt">
                        <router-link to="/infosub.page">
                            <button>수정하기</button>
                        </router-link>
                    </section>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
        }
    },
    methods: {

    },
    watch: {

    },
    computed: {

    },
    mounted() {
        console.log('Login mounted');
    }
}
</script>

<style scoped>
div {
    width: 100%;
    background-color: white;
}

.info-box-button {
    width: 60%;
    margin: 0 auto;
    display: grid;
    padding: 0 0 6rem 0;
    grid-template-columns: 1fr 1fr;
}

.info-sec-bt {
    /* border: 1px solid red; */
    width: 60%;
    margin: 0 auto;
    padding: 6rem;
    text-align: right;
}

.info-sec-bt button {
    width: 30%;
    padding: 2rem;
    color: white;
    border-radius: 1.5rem;
    background-color: #3f87f7;
}

.info-box-button button {
    padding: 3rem 2rem 3rem 2rem;
    margin-right: 3rem;
    color: white;
    border-radius: 2rem;
}

.info-sec,
.info-sec-1 {
    padding: 6rem;
    margin: 0 auto;
    border: 1px soli/d #333;
    width: 60%;
}

.info-sec div,
.info-sec-1 div {
    display: grid;

    border-bottom: 1px solid #333;
    grid-template-columns: 30% 2fr;
}

.info-sec div p {
    padding: 3rem;
    font-size: 1.5rem;

}

.info-sec-1 div a {
    padding: 3rem;
}

.info-sec-1 div p {
    padding: 3rem;
    font-size: 1.5rem;

    /* border-bottom: 1px solid #333; */
}

.info-sec-1 section {
    padding: 3rem;
}

.info-sec-1 section img {

    width: 200px;
    height: 200px;
    border-radius: 50%;
    /* border: 1px solid red; */
    margin: 0 auto;
    box-shadow: 2px 2px 5px #33333345;

}

.info-td {
    /* border: 1px solid red; */
    height: 250px;
}
</style>


