<template>
  <div class="w-full bg-blue-400 h-2"></div>
  <div
    class="md:w-[calc(100%)] h-40 overflow-hidden flex items-center justify-center bg-bottom px-48"
  >
    <div class="flex items-center w-full">
      <img :src="logo" class="w-24 h-28 mr-1" alt="" />
      <div class="flex-1">
        <div>
          <span class="font-bold text-xl mr-1"
            >青岛市委人才工作领导小组办公室</span
          >
          <span class="text-lg" style="color: #666666"
            >中国山东省青岛市香港中路11号</span
          >
        </div>
        <div>
          <span class="font-bold text-xl mr-1">青岛市人力资源和社会保障局</span>
          <span class="text-lg" style="color: #666666"
            >中国山东省青岛市香港中路11号</span
          >
        </div>
        <div class="text-lg mt-3">
          承办单位：青岛市公共就业和人才服务中心
          <span class="cursor-pointer" @click="handleToICP"
            >ICP备案号：鲁ICP备13003495号-2</span
          >
        </div>
      </div>
    </div>
    <img src="@/assets/images/ewm1.png" class="w-24 h-28 mr-7" alt="" /><img
      src="@/assets/images/ewm2.png"
      class="w-24 h-28 mr-7"
      alt=""
    /><img src="@/assets/images/ewm3.png" class="w-24 h-28 mr-7" alt="" /><img
      src="@/assets/images/ewm4.png"
      class="w-24 h-28 mr-7"
      alt=""
    />
  </div>
</template>
<script setup lang="ts">
import logo from "@/assets/images/logo2.png";
const handleToICP = () => {
  window.open("http://beian.miit.gov.cn/");
};
</script>

<style scoped>
.bg-bottom {
  background: url(/src/assets/images/nav_bottom.png) no-repeat;
  background-size: 100% 100%;
}
</style>