/* maholoba-coconaru ― +α（静寂版への追加分）
   ベースの style.css は変更せず、追加はこのファイルだけ。
   追加の内容：
   1. 背景に写真を敷いたセクション（.bgsec）― 下層ページ見出し .phead と同じ見た目の作り
   2. Instagramの投稿一覧グリッド（.iggrid）― 今のWordPressサイトの表示に合わせる
   3. 予約カレンダー（.calwrap）― 今のサイトのカレンダーをページ内に表示 */

/* ── 1. 背景写真のセクション ── */
.bgsec{position:relative;min-height:clamp(430px,74vh,580px);overflow:hidden;background:var(--night2);color:var(--white);display:flex;align-items:center;justify-content:center;text-align:center}
.bgsec>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.62) brightness(.76)}
.bgsec::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,13,.46),rgba(20,16,13,.30) 50%,rgba(20,16,13,.52))}
.bgsec .t{position:relative;z-index:2;padding:96px var(--gut)}
.bgsec .en{display:block;font-family:var(--latin);font-weight:300;font-size:clamp(30px,5vw,52px);letter-spacing:.26em;text-transform:uppercase;line-height:1.2;padding-left:.26em}
.bgsec .ja{display:block;margin-top:16px;font-family:var(--serif);font-size:14.5px;letter-spacing:.3em;opacity:.92}
.bgsec p{margin-top:22px;font-size:14px;line-height:2.1;letter-spacing:.08em;opacity:.94}
.bgsec .btn{margin-top:36px}

/* ── 3. 予約カレンダー（今のサイトのプラグイン表示を、そのままページ内に） ── */
.calwrap{margin-top:56px}
.calwrap .calendar-title{font-family:var(--serif);font-weight:500;font-size:17.5px;letter-spacing:.14em;color:var(--ink);padding-bottom:14px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.calwrap table{width:100%;border-collapse:collapse;background:var(--white)}
.calwrap .calendar-caption{font-family:var(--serif);font-size:16.5px;letter-spacing:.14em;color:var(--ink);padding:14px 0 12px;caption-side:top}
.calwrap th{font-family:var(--sans);font-weight:400;font-size:11.5px;letter-spacing:.14em;color:var(--mute);border:1px solid var(--line);padding:8px 0;background:var(--paper)}
.calwrap th.sat{color:var(--ink2)}
.calwrap th.sun{color:var(--accent-d)}
.calwrap td.day-box{border:1px solid var(--line);width:14.28%;height:66px;vertical-align:top;padding:6px 7px;font-size:12px}
.calwrap td.no-day{background:var(--paper)}
.calwrap .day-number{font-family:var(--serif);font-size:14px;color:var(--ink);line-height:1.4}
.calwrap td.sun .day-number{color:var(--accent-d)}
.calwrap .calendar-mark{line-height:1.5}
.calwrap .calendar-mark a{text-decoration:none;color:var(--accent-d)}
.calwrap .calendar-marking{font-size:14px;color:var(--accent-d)}
.calwrap .monthly-prev-next{display:flex;justify-content:space-between;margin-top:14px;font-size:12.5px;letter-spacing:.1em;color:var(--mute)}
.calwrap .monthly-prev-next a{color:var(--accent-d);text-decoration:none}
@media (max-width:640px){.calwrap td.day-box{height:52px;padding:4px 5px}.calwrap .day-number{font-size:12.5px}.calwrap .calendar-marking{font-size:12px}}

/* ── 2. Instagram投稿一覧 ── */
.iggrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;max-width:900px;margin:40px auto 0}
.iggrid a{display:block;aspect-ratio:1;overflow:hidden;background:var(--night)}
.iggrid img{width:100%;height:100%;object-fit:cover;filter:saturate(.88);transition:transform 1.4s var(--ease)}
.iggrid a:hover img{transform:scale(1.05)}
@media (max-width:640px){.iggrid{gap:3px;margin-top:32px}}

/* ── 本番（WordPress）用の調整 ── */
/* スケジュールページの本文（画像）を枠に収める */
.schimg p{margin:0}
.schimg img{max-width:100%;height:auto;display:block}
/* Instagramフィード（プラグイン）のはめ込み */
.igfeed{max-width:900px;margin:40px auto 0}
/* お問合わせフォームのパネル */
.form-panel .prose p{margin-bottom:14px}
/* Contact Form 7 をデザインに合わせる */
.wpcf7 label{font-size:13px;letter-spacing:.06em;color:var(--ink2)}
.wpcf7 input[type="text"],.wpcf7 input[type="email"],.wpcf7 input[type="tel"],.wpcf7 textarea{width:100%;padding:13px 14px;border:1px solid var(--line);background:#fff;font:inherit;font-size:14.5px;color:var(--ink);margin-top:6px}
.wpcf7 input[type="submit"]{display:inline-block;padding:16px 38px;background:var(--ink);border:1px solid var(--ink);color:#fff;font-size:13.5px;letter-spacing:.14em;cursor:pointer}
/* 生徒さんの声ページ本文内のボタン（.mcv-btn）を、他のページのボタンに合わせる */
.mcv .mcv-btn,.mcv .mcv-btn:visited{background:var(--ink);border:1px solid var(--ink);border-radius:0;color:#fff;font-family:var(--sans);font-size:13.5px;letter-spacing:.14em;padding:16px 38px}
.mcv .mcv-btn:hover{background:var(--white);color:var(--ink)}
/* ブログ記事ページ */
.posttitle{font-family:var(--serif);font-weight:500;font-size:clamp(22px,3.4vw,29px);line-height:1.6;letter-spacing:.05em;color:var(--ink);margin:14px 0 34px}
.postmeta{font-size:12.5px;color:var(--mute);letter-spacing:.1em}
.postnav{display:flex;justify-content:space-between;gap:16px;margin-top:56px;font-size:13px}
.postnav a{color:var(--accent-d);text-decoration:none}
/* ブログ一覧のページネーション */
.pagination{margin-top:48px;text-align:center}
.pagination .page-numbers{display:inline-block;padding:8px 13px;margin:0 3px;border:1px solid var(--line);color:var(--ink2);text-decoration:none;font-size:13px}
.pagination .page-numbers.current{background:var(--ink);color:#fff;border-color:var(--ink)}
/* 汎用ページ本文の画像はみ出し防止 */
.pagebody img{max-width:100%;height:auto}

/* 地図とブログのサムネイルは通常のカラーに（セピア・彩度落としを解除） */
.map iframe{filter:none}
.jlist .ph img{filter:none}
.jgrid .ph img{filter:none}