@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/


/* === MWP TOP PAGE CSS START (build/top-page.css) === */
/* ============================================================
   MWP トップページ 洗練用CSS
   swell_child の style.css 末尾に追記する。
   クラスは .mwp-top-* で名前空間化（本文ブロック側にも同クラス付与済）。
   方針: 現Wixの構成・配色を踏襲しつつ「より洗練」。
     - 余白を広めにとり呼吸感 / セクション間リズムを統一
     - 2ウェイト(400/700)で階層 / 英ラベルは控えめ大文字
     - カードは均一サイズ + hover時にわずか浮く
     - アクセント #3637F5 / 角丸 rounded30・pill60 / 控えめshadow
   ============================================================ */

:root {
  --mwp-accent: #3637F5;
  --mwp-ink: #242323;
  --mwp-gray-bg: #F5F5F5;
  --mwp-white: #FFFFFF;
  --mwp-radius: 30px;
  --mwp-pill: 60px;
  /* ★トークンのcard shadowは "rgba(0,0,0,0.6) 0 1px 4px 1px"(濃く硬い)。
     当サイトは「より洗練」方針で淡く広いshadowへ意図的に置換(後続レビュー誤検知防止)。 */
  --mwp-shadow: 0 6px 24px rgba(0, 0, 0, 0.10);
  --mwp-shadow-hover: 0 14px 36px rgba(54, 55, 245, 0.22);
  --mwp-section-pad: clamp(56px, 8vw, 112px); /* セクション縦リズム統一 */
}

/* ---- セクション共通の縦リズム ---- */
.mwp-top-mission,
.mwp-top-feature,
.mwp-top-services,
.mwp-top-reviews,
.mwp-top-news {
  padding-top: var(--mwp-section-pad);
  padding-bottom: var(--mwp-section-pad);
  padding-left: 24px;
  padding-right: 24px;
}

/* ---- 見出し階層（2ウェイトシステム）---- */
.mwp-top-services__title,
.mwp-top-reviews__title,
.mwp-top-news__title,
.mwp-top-feature__title {
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--mwp-ink);
  line-height: 1.3;
  margin: 0;
}
.mwp-top-services__title,
.mwp-top-reviews__title,
.mwp-top-news__title {
  font-size: clamp(28px, 4vw, 46px);
}
.mwp-top-feature__title {
  font-size: clamp(24px, 3vw, 34px);
  margin-bottom: 20px;
}

/* 英語ラベル（Service / User Review / NEWS）= 見出しの下に添える。
   トークン engLabelSmall(20px/700) に準拠。tracking で装飾性を出す。 */
.mwp-top-services__eng,
.mwp-top-reviews__eng,
.mwp-top-news__eng {
  font-weight: 700;
  font-size: clamp(16px, 1.8vw, 20px);
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--mwp-accent);
  text-align: center;
  margin: 8px 0 clamp(32px, 5vw, 56px);
}

/* ============================================================
   (2) ヒーロー
   ============================================================ */
/* Wix現物踏襲(wix-top-fullpage.png): ヒーローのテキストは中央寄せ・中央配置 */
.mwp-top-hero {
  align-items: center;
}
.mwp-top-hero .wp-block-cover__inner-container {
  width: 100%;
}
.mwp-top-hero__inner {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
/* 画像の上に暗グラデを重ねて文字を読みやすく（dimの上にさらに） */
.mwp-top-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.55) 100%);
  pointer-events: none;
  z-index: 1;
}
.mwp-top-hero__inner {
  position: relative;
  z-index: 2;
  padding: 24px;
}
.mwp-top-hero__title {
  font-weight: 700;
  font-size: clamp(36px, 7vw, 80px);
  line-height: 1.2;
  letter-spacing: 0.02em;
  margin: 0 0 18px;
  text-shadow: 0 2px 16px rgba(0,0,0,0.35);
}
.mwp-top-hero__lead {
  font-size: clamp(16px, 2.4vw, 24px);
  font-weight: 400;
  margin: 0 0 8px;
  letter-spacing: 0.04em;
}
.mwp-top-hero__brand {
  font-size: clamp(14px, 1.8vw, 18px);
  font-weight: 700;
  letter-spacing: 0.18em;
  /* ★text-transform:uppercase は撤去。原文「Medical Wellness Partners」は
     混在ケースの固有名詞(ブランド名)。全大文字化は可視テキストの改変に当たる
     (YMYL原文無改変ルール)。tracking のみで装飾し原文ケースを保持する。 */
  opacity: 0.92;
  margin: 0 0 36px;
}
/* ヒーローCTA(「私たちのミッション」/#mission)= Wix現物の中央pillボタンを再現。 */
.mwp-top-hero .wp-block-buttons {
  margin-top: 4px;
  justify-content: center;
}
.mwp-top-hero__cta .wp-block-button__link {
  padding: 16px 48px;
  font-weight: 700;
  letter-spacing: 0.08em;
  box-shadow: 0 8px 22px rgba(54,55,245,0.4);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
.mwp-top-hero__cta .wp-block-button__link:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(54,55,245,0.5);
}

/* ============================================================
   (3) MISSION ブルーバンド
   ============================================================ */
.mwp-top-mission {
  text-align: center;
}
/* 英装飾ラベル「MISSION」(Wix現物はこの大ラベルのみ表示)。
   ★ウェイトはトークンに忠実: engLabelLarge(48px)=400。
     対して Service/User Review/NEWS は engLabelSmall(20px)=700。
     サイズ差による役割分担(大装飾ラベル=400 / 小添えラベル=700)で意図的。 */
.mwp-top-mission__label {
  font-weight: 400;
  font-size: clamp(32px, 5vw, 48px);
  letter-spacing: 0.28em;
  text-transform: uppercase;
  margin: 0 0 28px;
  opacity: 0.95;
}
.mwp-top-mission__body {
  font-size: clamp(15px, 1.9vw, 18px);
  line-height: 2;
  font-weight: 400;
  max-width: 760px;
  margin: 0 auto;
}

/* ============================================================
   (4) 企業の特徴 2カラム
   ============================================================ */
/* Wix現物の淡青スラッシュは(4)企業の特徴セクションに存在(写真バンドではない)。
   1本のみ・淡い水色(#cfe4f7)・左下→右上の斜め。アクセント濃青ではない点に注意。 */
.mwp-top-feature {
  position: relative;
  overflow: hidden;
}
.mwp-top-feature__slash {
  position: absolute;
  top: -8%;
  bottom: -8%;
  /* イラストとテキストの境目あたり(中央やや左)に1本 */
  left: 46%;
  width: clamp(40px, 5vw, 76px);
  background: #cfe4f7;
  transform: skewX(-20deg);
  pointer-events: none;
  z-index: 0;
}
.mwp-top-feature__cols {
  position: relative;
  z-index: 1;
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
@media (max-width: 781px) {
  .mwp-top-feature__slash { left: 38%; }
}
.mwp-top-feature__media img {
  width: 100%;
  height: auto;
  border-radius: var(--mwp-radius);
}
.mwp-top-feature__body {
  font-size: clamp(15px, 1.8vw, 18px);
  line-height: 2;
  color: var(--mwp-ink);
  margin: 0;
}

/* ============================================================
   (5) 写真バンド ディバイダ
   ============================================================ */
/* 写真バンドは全幅写真+暗オーバーレイのみ(Wix現物にスラッシュ装飾なし)。
   spacerだけで潰れないよう高さを確実に確保。 */
.mwp-top-band {
  align-items: center;
  min-height: clamp(280px, 32vw, 420px);
  background-size: cover;
  background-position: center;
  overflow: hidden;
  position: relative;
}

/* ============================================================
   (6) 提供サービス 3x3 画像カバー + 説明文 + Read More
   ============================================================ */
/* ★各カード=画像カバー＋下に説明文＋Read More(正本(6)表どおり復元)。
   カード間は適度なgapで区切り、カードは白下地で説明文の可読性を確保。 */
.mwp-top-services__row {
  gap: clamp(16px, 2vw, 28px);
  margin-bottom: clamp(16px, 2vw, 28px);
}
.mwp-top-services__row:last-of-type {
  margin-bottom: 0;
}
/* 各列を均等3カラム固定（広い画面でカードが過大化しない） */
.mwp-top-services__row > .wp-block-column {
  flex: 1 1 0;
  min-width: 0;
}
/* カードのラッパ(画像+説明文+Read More を内包) */
.mwp-top-svc {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--mwp-white);
  border-radius: var(--mwp-radius);
  overflow: hidden;
  box-shadow: var(--mwp-shadow);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.mwp-top-svc:hover {
  transform: translateY(-6px);
  box-shadow: var(--mwp-shadow-hover);
}
/* 画像カバー部。aspect-ratioで均一サイズ。
   minHeight属性はブロックから除去済→!important不要でSWELLと競合しない。 */
.mwp-top-svc-card {
  overflow: hidden;
  aspect-ratio: 16 / 9;
}
/* ラベルは画像の「上部寄せ」(Wix準拠)。左上に白文字。 */
.mwp-top-svc-card .wp-block-cover__inner-container {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  padding: 16px 18px;
}
.mwp-top-svc-card__label {
  font-weight: 700;
  font-size: clamp(14px, 1.5vw, 17px);
  line-height: 1.5;
  letter-spacing: 0.03em;
  margin: 0;
  text-align: left;
  text-shadow: 0 1px 6px rgba(0,0,0,0.30);
}
/* ★サービス説明文(原文逐語)。画像下に表示(正本どおり復元)。 */
.mwp-top-svc__desc {
  font-size: 14px;
  line-height: 1.8;
  font-weight: 400;
  color: var(--mwp-ink);
  margin: 16px 18px 10px;
  flex: 1 1 auto;
}
/* Read More リンク。アクセント色＋矢印。カード下端に配置。 */
.mwp-top-svc__more {
  margin: 0 18px 18px;
}
.mwp-top-svc__more a {
  display: inline-flex;
  align-items: center;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--mwp-accent);
  text-decoration: none;
  transition: gap 0.2s ease, opacity 0.2s ease;
}
.mwp-top-svc__more a::after {
  content: "→";
  margin-left: 6px;
  transition: transform 0.2s ease;
}
.mwp-top-svc__more a:hover::after {
  transform: translateX(4px);
}
.mwp-top-svc__more a:hover {
  opacity: 0.85;
}
/* 9枚目: 画像欠落の暫定カード。他8枚(画像+dimRatio50)の明度感に寄せ、
   均一性の劣化を最小化（明るめのオーバーレイ質感を重ねる）。
   ブロック側も dimRatio50 に統一済(べた塗り100で他より暗く沈む不均一を解消)。 */
.mwp-top-svc-card--noimg {
  background:
    radial-gradient(130% 130% at 30% 20%, rgba(255,255,255,0.30) 0%, rgba(255,255,255,0.06) 45%, transparent 70%),
    linear-gradient(150deg, rgba(255,255,255,0.10) 0%, transparent 60%),
    var(--mwp-accent);
}

/* ============================================================
   (7) お客様の声
   ============================================================ */
/* ★3カラム構成を維持。3枠目は空枠カラム(.mwp-top-review-col--empty)を
   display:none で畳み、残り2カードを中央寄せ均等配置して間延びを解消。
   実コメント受領後は3枠目に青カードを入れ --empty を外せば3枚並びへ復帰。 */
.mwp-top-reviews__row {
  gap: clamp(20px, 3vw, 36px);
  justify-content: center;
}
.mwp-top-reviews__row > .wp-block-column {
  flex: 0 1 340px;
  min-width: 0;
}
/* 3枠目=現Wixは編集用ダミー(創作禁止)のため空枠。可視テキスト無し＝畳む。 */
.mwp-top-reviews__row > .mwp-top-review-col--empty {
  display: none;
}
.mwp-top-review-card {
  position: relative;
  border-radius: var(--mwp-radius);
  padding: clamp(28px, 3vw, 40px) clamp(24px, 2.5vw, 32px) clamp(48px, 4vw, 56px);
  height: 100%;
  box-shadow: var(--mwp-shadow);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.mwp-top-review-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--mwp-shadow-hover);
}
.mwp-top-review-card__who {
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.04em;
  margin: 0 0 14px;
  opacity: 0.95;
}
.mwp-top-review-card__body {
  font-size: 15px;
  line-height: 1.9;
  font-weight: 400;
  margin: 0;
}
/* 引用符の装飾。Wix準拠でカード「下中央寄り」に配置。 */
.mwp-top-review-card::after {
  content: "\201D";              /* ” */
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 6px;
  font-size: 64px;
  line-height: 1;
  font-weight: 700;
  color: rgba(255,255,255,0.30);
  font-family: Georgia, "Times New Roman", serif;
  pointer-events: none;
}
/* ★3枠目: 現Wixは編集用ダミー＝創作禁止のため空枠カラムとして出力し
   .mwp-top-review-col--empty で display:none。3カラム構成は維持しつつ
   2カードを中央寄せ均等配置で間延びを解消(上記 .mwp-top-reviews__row 参照)。
   実コメント受領後に空枠へ青カードを入れ --empty を外せば3枚並びへ復帰する。 */

/* ============================================================
   (8) 最新のお知らせ
   ============================================================ */
.mwp-top-news__row {
  gap: clamp(16px, 2vw, 28px);
}
.mwp-top-news-card {
  border-radius: var(--mwp-radius);
  overflow: hidden;
  background: var(--mwp-white);
  box-shadow: var(--mwp-shadow);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  height: 100%;
}
.mwp-top-news-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--mwp-shadow-hover);
}
.mwp-top-news-card__thumb {
  margin: 0;
}
.mwp-top-news-card__thumb img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  display: block;
}
.mwp-top-news-card__date {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--mwp-accent);
  margin: 18px 18px 6px;
}
.mwp-top-news-card__ttl {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.6;
  color: var(--mwp-ink);
  margin: 0 18px 22px;
}
.mwp-top-news__all .wp-block-button__link {
  margin-top: clamp(24px, 3vw, 40px);
  padding: 14px 44px;
  font-weight: 700;
  letter-spacing: 0.08em;
  border-color: var(--mwp-accent);
  color: var(--mwp-accent);
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.mwp-top-news__all .wp-block-button__link:hover {
  background-color: var(--mwp-accent);
  color: var(--mwp-white);
  transform: translateY(-2px);
}

/* ============================================================
   レスポンシブ : モバイルはカード1列 / 余白詰め
   ============================================================ */
@media (max-width: 781px) {
  .mwp-top-services__row,
  .mwp-top-reviews__row,
  .mwp-top-news__row,
  .mwp-top-feature__cols {
    flex-wrap: wrap;
    gap: 16px;
  }
  /* SWELL/コアのcolumnsは782px未満で縦積みになるが、保険で全幅化 */
  .mwp-top-services__row > .wp-block-column,
  .mwp-top-news__row > .wp-block-column,
  .mwp-top-reviews__row > .wp-block-column {
    flex-basis: 100% !important;
  }
  /* 空枠の3枠目はモバイルでも畳む(全幅化の保険より優先) */
  .mwp-top-reviews__row > .mwp-top-review-col--empty {
    display: none !important;
  }
}
/* === MWP TOP PAGE CSS END === */

/* === MWP HEADER NAV CSS START === */
.c-gnav .mwp-nav-cta { display:flex; align-items:center; }
.c-gnav .mwp-nav-cta > a {
  border:2px solid #3637F5; border-radius:60px; color:#3637F5 !important;
  padding:0.45em 1.5em; line-height:1.2; font-weight:700;
  transition:background-color .2s ease,color .2s ease;
}
.c-gnav .mwp-nav-cta > a:hover { background-color:#3637F5; color:#fff !important; }
.c-gnav .mwp-nav-cta > a::after,
.c-gnav .mwp-nav-cta > a::before { display:none !important; }
/* === MWP HEADER NAV CSS END === */

/* === MWP TOP: タイトル/パンくず非表示 START === */
.page-id-27 .c-pageTitle, .page-id-27 .p-breadcrumb { display:none !important; }
.page-id-27 .l-articleHeader, .page-id-27 .c-pageHeader { display:none !important; }
/* === MWP TOP: タイトル/パンくず非表示 END === */

/* === MWP TOP: タイトル/パンくず非表示 v2 (:has) START === */
body:has(.mwp-top-hero) .c-pageTitle,
body:has(.mwp-top-hero) .p-breadcrumb { display:none !important; }
/* === MWP TOP: タイトル/パンくず非表示 v2 END === */

/* === MWP SUBPAGE START === */
body:has(.mwp-sub-hero) .c-pageTitle { display:none !important; }
.mwp-sub-hero { min-height:300px; }
.mwp-sub-hero .wp-block-cover__inner-container { text-align:center; }
/* === MWP SUBPAGE END === */

/* === MWP: 全ページのパンくず・ページタイトル非表示 START === */
.c-pageTitle, .p-breadcrumb { display:none !important; }
/* === MWP END === */

/* === MWP: 投稿のシェア/著者box 非表示 START === */
.c-shareBtns { display:none !important; }
.l-articleBottom__section.-author { display:none !important; }
/* === MWP END2 === */