/*
Theme Name: re-akemikai
Theme URI: https://akemikai.or.jp/
Description: 医療法人明美会
Version: 1.5.1
Author: Webleaf
*/

/* ============================================================
   ベース設定（デザインモックアップ由来）
   ============================================================ */
html,
body {
  margin: 0;
  padding: 0;
  background: #FFFFFF;
}

body {
  font-family: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", sans-serif;
  color: #22343A;
  font-size: 17px;
  line-height: 1.8;
  letter-spacing: 0.02em;
}

* {
  box-sizing: border-box;
}

a {
  color: #0E6E73;
  text-decoration: none;
}

a:hover {
  color: #0B565A;
  text-decoration: underline;
}

img {
  max-width: 100%;
}

/* コンテンツ用ラッパ（固定ページ・投稿・アーカイブ共通） */
.re-shell {
  min-height: 100vh;
  background: #FFFFFF;
}

.re-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 32px;
}

/* 汎用ページ本文 */
.re-page-head {
  background: #F7FAF9;
  border-bottom: 1px solid #E3ECEB;
}

.re-page-head .re-container {
  padding-top: 48px;
  padding-bottom: 48px;
}

.re-page-head h1 {
  margin: 0;
  font-family: 'Zen Old Mincho', serif;
  font-size: 34px;
  font-weight: 700;
  color: #17282C;
}

.re-page-head .crumbs {
  margin: 0 0 10px;
  font-size: 13px;
  color: #5B7377;
  letter-spacing: 0.08em;
}

.re-content {
  max-width: 900px;
  margin: 0 auto;
  padding: 56px 32px 80px;
}

.re-content h2 {
  font-family: 'Zen Old Mincho', serif;
  font-size: 26px;
  font-weight: 700;
  color: #17282C;
  margin: 2.4rem 0 1.2rem;
  padding-bottom: 0.4rem;
  border-bottom: 2px solid #DCEAE8;
}

.re-content h3 {
  font-size: 20px;
  font-weight: 700;
  color: #0E6E73;
  margin: 2rem 0 1rem;
}

.re-content a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.re-content img {
  border-radius: 8px;
}

.re-content table {
  border-collapse: collapse;
  width: 100%;
  margin: 1.5rem 0;
}

.re-content th {
  background: #EAF4F3;
}

.re-content th,
.re-content td {
  border: 1px solid #DCEAE8;
  padding: 10px 12px;
  text-align: center;
}

.re-content tr:nth-child(even) {
  background: #F7FAF9;
}

/* お知らせ一覧（アーカイブ） */
.re-newslist a {
  display: grid;
  grid-template-columns: 110px 140px 1fr;
  gap: 20px;
  align-items: center;
  padding: 20px 8px;
  border-bottom: 1px solid #E3ECEB;
  color: #22343A;
  text-decoration: none;
}

.re-newslist a:hover {
  background: #F7FAF9;
  color: #0E6E73;
  text-decoration: none;
}

.re-newslist .date {
  font-size: 15px;
  color: #5B7377;
  font-variant-numeric: tabular-nums;
}

.re-newslist .tag {
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  padding: 4px 0;
  border-radius: 999px;
  background: #EAF4F3;
  color: #0E6E73;
}

.re-newslist .title {
  font-size: 17px;
  font-weight: 500;
}

/* ============================================================
   添付ファイルのダウンロードボタンをアイコン化
   （WordPressファイルブロック .wp-block-file の「ダウンロード」ボタン）
   ============================================================ */
.re-content .wp-block-file {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  background: #F7FAF9;
  border: 1px solid #DCEAE8;
  border-radius: 12px;
  padding: 14px 18px;
  margin: 1.6rem 0;
}

/* ファイル名リンク（ボタンでない方）*/
.re-content .wp-block-file a:not(.wp-block-file__button) {
  flex: 1;
  min-width: 0;
  font-weight: 700;
  color: #17282C;
  word-break: break-all;
}

.re-content .wp-block-file a:not(.wp-block-file__button):hover {
  color: #0E6E73;
}

/* 「ダウンロード」テキストを隠してアイコン＋DLの丸ボタンに置換 */
.re-content .wp-block-file .wp-block-file__button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 9px 16px 9px 13px;
  background: #0E6E73;
  border-radius: 999px;
  font-size: 0;
  line-height: 1;
  font-weight: 700;
  text-decoration: none;
  transition: background 0.2s;
}

.re-content .wp-block-file .wp-block-file__button:hover {
  background: #0B565A;
}

.re-content .wp-block-file .wp-block-file__button::before {
  content: "";
  width: 16px;
  height: 16px;
  flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='m7 12 5 5 5-5'/%3E%3Cpath d='M5 21h14'/%3E%3C/svg%3E") no-repeat center / contain;
}

.re-content .wp-block-file .wp-block-file__button::after {
  content: "DL";
  font-size: 14px;
  color: #FFFFFF;
  letter-spacing: 0.06em;
}

/* ============================================================
   パスワード保護ページ ログイン画面
   ============================================================ */
.re-pwlock {
  display: flex;
  justify-content: center;
  padding: 64px 20px 88px;
  background: #FFFFFF;
}

.re-pwlock__card {
  width: 100%;
  max-width: 440px;
  text-align: center;
  background: #FFFFFF;
  border: 1px solid #DCEAE8;
  border-radius: 24px;
  padding: 48px 40px;
  box-shadow: 0 24px 48px -28px rgba(14, 110, 115, 0.35);
}

.re-pwlock__icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 22px;
  border-radius: 50%;
  background: #EAF4F3;
  color: #0E6E73;
  display: grid;
  place-items: center;
}

.re-pwlock__title {
  margin: 0 0 12px;
  font-family: 'Zen Old Mincho', serif;
  font-size: 24px;
  font-weight: 700;
  color: #17282C;
}

.re-pwlock__desc {
  margin: 0 0 28px;
  font-size: 15px;
  line-height: 1.9;
  color: #5B7377;
}

.re-pwlock__form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.re-pwlock__form input[type="password"] {
  width: 100%;
  padding: 14px 18px;
  font-size: 16px;
  border: 1px solid #C9DDDB;
  border-radius: 12px;
  background: #F7FAF9;
  color: #22343A;
  transition: border-color 0.2s, background 0.2s;
}

.re-pwlock__form input[type="password"]:focus {
  outline: none;
  border-color: #0E6E73;
  background: #FFFFFF;
  box-shadow: 0 0 0 3px rgba(14, 110, 115, 0.12);
}

.re-pwlock__form button {
  width: 100%;
  padding: 15px 20px;
  font-size: 16px;
  font-weight: 700;
  color: #FFFFFF;
  background: #0E6E73;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.2s;
}

.re-pwlock__form button:hover {
  background: #0B565A;
}

/* Page Top ボタン */
#re-pagetop {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 90;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #0E6E73;
  color: #FFFFFF;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 8px 20px -8px rgba(14, 110, 115, 0.6);
  text-decoration: none;
}

#re-pagetop:hover {
  background: #0B565A;
  color: #FFFFFF;
  text-decoration: none;
}

#re-pagetop.show {
  display: flex;
}

/* ============================================================
   レスポンシブ（〜900px）
   ============================================================ */
@media (max-width: 960px) {
  body {
    font-size: 15px;
  }

  .re-container {
    padding: 0 18px;
  }

  .re-content {
    padding: 36px 18px 60px;
  }

  /* グリッドを縦積みに */
  .re-grid-2,
  .re-grid-3,
  .re-grid-4 {
    grid-template-columns: 1fr !important;
  }

  .re-hero {
    grid-template-columns: 1fr !important;
  }

  .re-hero-img {
    height: 240px !important;
  }

  .re-nav-pc {
    display: none !important;
  }

  .re-menu-toggle {
    display: inline-flex !important;
  }

  .re-page-head h1 {
    font-size: 26px;
  }

  .re-newslist a {
    grid-template-columns: 90px 1fr;
  }

  .re-newslist .tag {
    display: none;
  }

  /* トップページのお知らせ一覧（インラインstyleの3列グリッドを上書き）
     スマホでは「日付＋カテゴリ」を上段、「タイトル」を下段の2行組みにする */
  .re-newsrow {
    grid-template-columns: 90px auto 1fr !important;
    gap: 6px 12px !important;
    padding: 16px 4px !important;
  }

  .re-newsrow-date {
    font-size: 13px !important;
  }

  .re-newsrow-cat {
    font-size: 11px !important;
    padding: 2px 12px !important;
    justify-self: start;
  }

  .re-newsrow-title {
    grid-column: 1 / -1;
    font-size: 15px !important;
    line-height: 1.6;
  }
}

@media (min-width: 961px) {
  .re-menu-toggle {
    display: none;
  }

  .re-mobile-nav {
    display: none !important;
  }
}