<script setup lang="ts">
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
//const props = defineProps({
//})
//const emit = defineEmits([
//])
let data = reactive({
})
onMounted(()=>{
})
onUnmounted(()=>{
})
defineExpose({})
const {} = toRefs(data);
</script>
<template>
	<div class="joinUs">
		<div class="title">{{ $t('collectionStory.joinUs.title') }}</div>
		<div class="info">
			<div>
				{{ $t('collectionStory.joinUs.info') }}
			</div>
			<div>
				{{ $t('collectionStory.joinUs.info2') }}
			</div>
			<br />
			<div>
				{{ $t('collectionStory.joinUs.info3') }}
			</div>
		</div>
	</div>
</template>
<style lang="less" scoped>
	.joinUs{
		width: 100%;
		height: auto;
		position: relative;
		padding: 6rem 0;
		> .title{
			padding: 0 2.4rem;
			font-family: "KaiseiOpti-Bold";
			font-weight: 700;
			font-size: 3rem;
			line-height: 100%;
			margin-bottom: 6rem;
		}
		> .info{
			width: 70.7rem;
			margin: 0 auto;
			margin-bottom: 4rem;
			> div{
				font-family: "KaiseiOpti-Regular";
				font-weight: 400;
				font-size: 1.6rem;
				line-height: 2.3rem;
			}
		}
	}
</style>