<template>
  <div class="head-mian">
    <div class="color-bar"></div>
    <div class="head-top-content">
      <div class="max-width-content">
        <div class="logo-box">
          <a href="https://www.ezijing.com" target="_blank">
            <img src="https://webapp-pub.ezijing.com/www/pc/marywood/logo_head.png" />
          </a>
          <div class="line"></div>
          <img src="https://webapp-pub.ezijing.com/project/marywood/marywood_logo.svg" />
        </div>
      </div>
    </div>
  </div>
</template>

<style lang="scss" scoped>
ul,
li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.head-mian {
  width: 100%;
  background: #fff;
  .color-bar {
    height: 10px;
    background: #aa1941;
  }
  .head-top-content {
    // width: 1200px;
    // margin: 0 auto;
    border: 1px solid #ebebeb;
    padding: 23px 0 22px;
    .max-width-content {
      display: flex;
      align-items: center;
      img {
        height: 55px;
        cursor: pointer;
        display: block;
      }
      .logo-box {
        display: flex;
        align-items: center;
        justify-content: center;
        img {
          height: 55px;
          cursor: pointer;
          display: block;
        }
        .line {
          border-right: 2px solid #aa1941;
          height: 26px;
          width: 0;
          margin: 0 20px;
        }
        .title {
          font-size: 30px;
          font-weight: 500;
          color: #aa1941;
          box-sizing: border-box;
          white-space: nowrap;
          word-wrap: normal;
          word-break: keep-all;
        }
      }
    }
  }
  .max-width-content {
    width: 1200px;
    margin: 0 auto;
  }
}
</style>
