@charset "utf-8";

/* --------------------------------------------------------------- */
/* mainvisual */
/* --------------------------------------------------------------- */

.common-mainvisual .handwriting {
  top: calc(252 * var(--px));
  left: calc(268 * var(--px));
  width: calc(575 * var(--px));
  height: calc(179 * var(--px));
}

@media screen and (max-width: 767px) {
  .common-mainvisual .handwriting {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(100% + 30px);
  }
}

.common-mainvisual .text-area-inner {
  position: relative;
  z-index: 1;
}

/* ------------------------------------------- */
/* links */
/* ------------------------------------------- */

#links {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 50px;
  padding-right: 12px;
  padding-left: 12px;
  padding-bottom: 120px;
  width: 100%;
}

#links a {
  display: block;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 460px;
  max-width: calc((100% - 42px) / 2);
  background-color: var(--theme-color01);
}

@media screen and (max-width: 500px) {
  #links a {
    max-width: calc((100% - 20px) / 2);
  }
}

@media (hover: hover) and (pointer: fine) {
  #links a:hover {
    background-color: var(--theme-color03);
  }
}

#links a:nth-child(2) {
  margin-left: 42px;
}

@media screen and (max-width: 500px) {
  #links a:nth-child(2) {
    margin-left: 20px;
  }
}

#links a span {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  height: 100%;
  color: #fff;
  font-family: YuGothic, "Yu Gothic", 'Noto Sans JP', sans-serif;
  font-weight: bold;
  font-size: 28px;
  letter-spacing: 0.05em;
}

@media screen and (max-width: 767px) {
  #links a span {
    font-size: 16px;
  }
}

#links a span::after {
  content: '';
  display: block;
  margin-top: 10px;
  width: 14px;
  height: 14px;
  border-right: solid 3px #fff;
  border-bottom: solid 3px #fff;
  transform: rotate(45deg);
}

@media screen and (max-width: 767px) {
  #links a span::after {
    width: 12px;
    height: 12px;
  }
}

/* ------------------------------------------- */
/* headquarters */
/* ------------------------------------------- */

#headquarters {
  padding-bottom: 120px;
}

#headquarters .common-title.type02 {
  margin-bottom: 50px;
}

#headquarters .common-title.type04 {
  line-height: 40px;
}

#headquarters .common-title.type04::before {
  height: 40px;
}

#headquarters .common-table {
  margin-bottom: 60px;
}

@media screen and (max-width: 500px) {
  #headquarters .common-table tr {
    display: flex;
    flex-direction: column;
  }
}

#headquarters .common-table th {
  width: 220px;
  vertical-align: middle;
}

@media screen and (max-width: 767px) {
  #headquarters .common-table th {
      width: 140px;
  }
}

@media screen and (max-width: 500px) {
  #headquarters .common-table th {
      width: 100%;
      border-bottom: solid 1px #d5d5d5;
  }
}

@media screen and (max-width: 500px) {
  #headquarters .common-table td {
      width: 100%;
      border-left: solid 1px #d5d5d5;
  }
}

#headquarters .common-table td p:not(:first-child) {
  padding-top: 26px;
}

#headquarters .map {
  width: 100%;
  height: 580px;
}

@media screen and (max-width: 767px) {
  #headquarters .map {
    height: calc((var(--100vw) - 48px) / 1080 * 580);
  }
}

#headquarters .pht-area {
  display: flex;
  margin-top: 100px;
}

@media screen and (max-width: 767px) {
  #headquarters .pht-area {
    margin-top: 50px;
  }
}

#headquarters .pht-area img {
  min-width: 0;
}

#headquarters .pht-area img:not(:first-child) {
  margin-left: 20px;
}

@media screen and (max-width: 767px) {
  #headquarters .pht-area img:not(:first-child) {
    margin-left: 10px;
  }
}

/* ------------------------------------------- */
/* institutions */
/* ------------------------------------------- */

#facility {
  padding-bottom: 120px;
}

#facility .common-title.type02 {
  margin-bottom: 80px;
}