/*------------------------------
 * @mixin
 ------------------------------*/
/*------------------------------
 * @header
 ------------------------------*/
.header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 20px;
}

@media (max-width: 767px) {
  .header {
    margin: 10px;
  }
}

.header .header-logo {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.header .header-logo-item {
  display: inline-block;
}

.header .header-logo .header-logo-pc {
  display: block;
  width: 180px;
}

@media (max-width: 767px) {
  .header .header-logo .header-logo-pc {
    display: none;
  }
}

.header .header-logo .header-logo-sp {
  display: none;
  width: 76px;
}

@media (max-width: 767px) {
  .header .header-logo .header-logo-sp {
    display: block;
  }
}

.header .header-contact {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.header .header-contact .header-contact-link {
  display: block;
  position: relative;
}

.header .header-contact .header-contact-link .header-contact-link-pc {
  display: block;
  width: 113px;
}

@media (max-width: 767px) {
  .header .header-contact .header-contact-link .header-contact-link-pc {
    display: none;
  }
}

.header .header-contact .header-contact-link .header-contact-link-sp {
  display: none;
}

@media (max-width: 767px) {
  .header .header-contact .header-contact-link .header-contact-link-sp {
    display: block;
    width: 55px;
  }
}