<template>
	<view class="page">
		<view class="box1 box" @click="$u.throttle($u.route({
            url: '/package_sub/pages/ServiceList/ServiceList',
            params: {
              type: 1
            }
          }))">
			<image src="~@/static/type1.png" alt="" />
			<view>
				<view>长护险居家照护</view>
				<view>为需要照顾的人提供在家庭环境中的全方位生活照料和支持服务。</view>
			</view>
		</view>
		<view class="box2 box" @click="$u.throttle($u.route({
		    url: '/package_sub/pages/ServeHospital/ServeHospital',
		    params: {
		    }
		  }))">
			<image src="~@/static/type2.png" alt="" />
			<view>
				<view>民政居家援助</view>
				<view>政府公益项目</view>
			</view>
		</view>
		<view class="box2 box" @click="$u.throttle($u.route({
		    url: '/package_sub/pages/ServeHospital/ServeHospital',
		    params: {
		    }
		  }))">
			<image src="~@/static/type2.png" alt="" />
			<view>
				<view>残疾人居家托养</view>
				<view>为需要照顾的人提供在家庭环境中的全方位生活照料和支持服务。</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style scoped lang="scss">
	.page {
		position: relative;
		background-color: #f5efee;
		height:100vh;
	}

	.box {
		width: 695rpx;
		height: 230rpx;
		margin: 25rpx auto;
		position: relative;

		&>image {
			width: 695rpx;
			height: 230rpx;
			position: absolute;
			top: 0;
			left: 0;
		}

		&>view {
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			left: 80rpx;
			color: #fff;
			font-size: 24rpx;
			z-index: 1;
			width: 380rpx;

			&>view:first-child {
				font-size: 42rpx;
				margin-bottom: 15rpx;
			}
		}
	}
</style>