/* ==========================================================================
   components.css
   PHP テンプレートから抽出した埋め込みスタイル
   ========================================================================== */

/* --------------------------------------------------------------------------
   Header: CTA Button (from header.php)
   -------------------------------------------------------------------------- */

#header_slider_wrap {
  position: relative;
}

.cta-button {
  position: absolute;
  right: 4%;
  bottom: 12lvh;
  z-index: 2;
  transition: filter 0.2s;
}

.cta-button:hover {
  filter: drop-shadow(5px 5px 0 black);
}

@media screen and (max-width: 1220px) {
  .cta-button {
    position: absolute;
    right: 4%;
    bottom: calc(240 / 1220 * 100vw);
    z-index: 2;
  }

  .cta-button img {
    width: 150px;
    height: 150px;
  }
}

@media screen and (max-width: 600px) {
  .cta-button {
    position: absolute;
    bottom: calc(240 / 1220 * 100vw);
  }

  .cta-button img {
    height: 100px;
    width: 100px;
  }
}

/* --------------------------------------------------------------------------
   About Member: Buttons (from page-about-member.php)
   -------------------------------------------------------------------------- */

.about-member-buttons {
  width: 772px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 100px;
  padding-top: 100px;
  margin-top: -235px;
}

@media screen and (max-width: 850px) {
  .about-member-buttons {
    width: auto;
    margin-top: -150px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

@media screen and (max-width: 600px) {
  .about-member-buttons {
    margin-top: -60px;
    width: auto;
    padding-bottom: 80px;
  }
}

.about-member-buttons__layout {
  display: flex;
  column-gap: 20px;
  justify-content: space-around;
}

@media screen and (max-width: 850px) {
  .about-member-buttons__layout {
    flex-direction: column;
    align-items: center;
    row-gap: 20px;
  }
}

/* --------------------------------------------------------------------------
   About: Archive Section (from page-about.php, page-about-member.php)
   --------------------------------------------------------------------------
   Base styles: page-about.php (with padding-top).
   Override: page-about-member.php では .about-member-buttons の直後に配置
   されるため、隣接兄弟セレクタで padding-top を除去。
   -------------------------------------------------------------------------- */

.about-member-archive {
  width: 772px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 120px;
  padding-top: 120px;
}

/* page-about-member.php: ボタンセクションの直後では上部余白なし */
.about-member-buttons + .about-member-archive {
  padding-top: 0;
}

@media screen and (max-width: 850px) {
  .about-member-archive {
    padding-left: 20px;
    width: auto;
    padding-right: 20px;
  }

  /* page-about-member.php: 850px でも固定幅を維持 */
  .about-member-buttons + .about-member-archive {
    width: 100%;
  }
}

@media screen and (max-width: 640px) {
  .about-member-archive {
    width: auto;
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .about-member-buttons + .about-member-archive {
    padding-top: 0;
  }
}

.about-member-archive__heading {
  font-family:
    "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro",
    "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif !important;
  position: relative;
  z-index: 2;
  font-size: 36px;
  text-align: center;
  margin-bottom: 60px;
}

@media screen and (max-width: 640px) {
  .about-member-archive__heading {
    font-size: 24px;
    margin-bottom: 30px;
  }
}

/* --------------------------------------------------------------------------
   Member Map (from template-parts/member-map.php)
   -------------------------------------------------------------------------- */

.p-member-map__map {
  aspect-ratio: 16 / 9;
  width: 100%;
  display: block;
  margin-top: 40px;
  margin-bottom: 40px;
}

.c-map-fukidashi {
  font-weight: 500;
  padding-bottom: 5px;
}

.c-map-fukidashi__name {
  font-size: 16px;
  line-height: 1.5;
  padding-right: 30px;
}

@media screen and (max-width: 768px) {
  .c-map-fukidashi__name {
    font-size: 14px;
  }
}

.c-map-fukidashi__address {
  margin-top: 0.5em;
  font-size: 14px;
  line-height: 1.5;
}

@media screen and (max-width: 768px) {
  .c-map-fukidashi__address {
    font-size: 12px;
  }
}

.c-map-fukidashi__link {
  display: flex;
  align-items: center;
  margin-top: 1em;
  font-size: 14px;
  transition: opacity 0.3s;
  column-gap: 5px;
}

.c-map-fukidashi__link:hover {
  opacity: 0.7;
}

.p-member-map__map .gm-style-iw-chr {
  height: 12px;
}

@media screen and (max-width: 768px) {
  .c-map-fukidashi__link {
    font-size: 12px;
  }
}

/* --------------------------------------------------------------------------
   News Archive: Item Visibility (from template-parts/news-archive.php)
   -------------------------------------------------------------------------- */

.ajax_post_list .item {
  opacity: 1;
}

/* --------------------------------------------------------------------------
   Hide: My Page / Logout Buttons
   -------------------------------------------------------------------------- */

#header_logout_button,
#side_button.footer_login_button,
#mobile_login_button {
  display: none !important;
}