<template>
  <div class="main_container">
    <div class="container_item banner1">
      <a href="https://marywood-plus.ezijing.com" target="_blank">
        <div class="btn_detail">查看详情</div>
      </a>
    </div>
    <div class="container_item banner2">
      <a href="https://marywood.ezijing.com" target="_blank">
        <div class="btn_detail">查看详情</div>
      </a>
    </div>
  </div>
</template>

<script>
export default {}
</script>

<style scoped lang="scss">
.main_container {
  width: 1200px;
  margin: 88px auto;
  display: flex;
  justify-content: space-around;
  .container_item {
    width: 550px;
    height: 551px;
    position: relative;
    // background-color: red;
    .btn_detail {
      width: 150px;
      height: 44px;
      border: 1px solid #ffffff;
      line-height: 44px;
      text-align: center;
      font-size: 22px;
      font-weight: 500;
      color: #ffffff;
      position: absolute;
      top: 443px;
      bottom: 64px;
      left: 50%;
      transform: translateX(-50%);
      cursor: pointer;
    }
    .btn_detail:hover {
      background: #ffffff;
      color: #333333;
    }
  }
  .banner1 {
    background: url(https://webapp-pub.ezijing.com/www/pc/marywood/banner1.png);
    margin-right: 98px;
  }
  .banner2 {
    background: url(https://webapp-pub.ezijing.com/www/pc/marywood/banner2.png);
  }
}
</style>
