/*
 * ======================================
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * ======================================
 * サイト：アーキコース / ArcH-CouS（ミニマル・上質・直角基調）
 * プレフィックス：.archc-
 *
 * .archc-wrap(-N)        - 中央寄せコンテナ（1280 / 1080 / 920 / 900 / 820 / 760 / 720）
 * .archc-reveal          - スクロール時フェードイン（.is-in で表示）
 * .archc-label           - 小さな英字ラベル（薄グレイ・字間広）
 * .archc-viewlink        - 下線付き英字リンク（VIEW ALL →）
 * .archc-btn-fill/line/outline - 直角ボタン各種
 * .archc-header*         - 追従半透明ヘッダー／ロゴなし・ナビ右寄せ（共通header構造の見た目差分）
 * .archc-nav*            - 英字のみのPCナビ
 * .archc-hero*           - MV（Ken Burnsカーテン演出 + キャッチ）
 * .archc-intro/lead/closing - 導入・リード・締めのテキストブロック
 * .archc-h2 / .archc-shead / .archc-viewlink - セクション見出し帯
 * .archc-feature*        - 画像＋テキスト2カラム（コンセプト導線）
 * .archc-works/work*     - 写真グリッド＋ホバーで暗幕＋キャプション
 * .archc-flowhead/flowlist - TOPの流れプレビュー
 * .archc-eventsec/eventrow - 暗背景のイベント行リスト
 * .archc-cta*            - お問い合わせCTA帯（グラデ砂色）
 * .archc-phead*          - 下層ページヘッド（パンくず＋大英字＋リード）
 * .archc-values/value*   - コンセプト：大切にしていること交互レイアウト
 * .archc-flow*           - 施工フロー縦タイムライン
 * .archc-pager*          - ページネーション（直角）
 * .archc-detail / gallery / crumb / tag / spec - ブログ詳細（WORKS・EVENT）
 * .archc-elist*          - イベント一覧（サムネ横）
 * .archc-contact/form/input/field/submit/cinfo/access - お問い合わせ
 * .archc-footer*         - 暗背景3カラムフッター
 * .archc-pagetop         - ページトップボタン見た目差分
 *
 * ======================================
 * 共通SCSSに不足していたもの（5分類）
 * ======================================
 * - 値の粒度不足：セクション余白が130/150pxの粒度、コンテナ幅1280/1080等（.section=120固定・container=1200のため）
 * - 構造不足：MVのカーテンリビール演出、写真ホバーで暗幕＋キャプションが浮かぶカード、ナビ右寄せの追従ヘッダー
 * - 装飾パターン不足：極細1pxラインでの区切り基調・英字ラベルのトンマナ（共通は太字ゴシック基調のため）
 * - 状態不足：スクロール連動の静かなフェードイン（.archc-reveal）
 */

:root {
  --ac-bg: #fdfcfa;
  --ac-ink: #1a1a1a;
  --ac-gray: #55524c;
  --ac-gray2: #8a857c;
  --ac-gray3: #6a665f;
  --ac-faint: #a7a299;
  --ac-line: #e6e3de;
  --ac-line2: #d8d3ca;
  --ac-sand: #efece6;
  --ac-sand2: #e2ddd4;
  --ac-panel: #f3f0eb;
  --ac-dark: #161616;
  --ac-dark-ink: #efece6;
  --ac-teal: #1f3134;
}

/* ============ 共通ユーティリティ ============ */
.archc-wrap,
.archc-wrap-1080,
.archc-wrap-920,
.archc-wrap-900,
.archc-wrap-820,
.archc-wrap-760,
.archc-wrap-720 { width: 100%; margin: 0 auto; padding-left: 40px; padding-right: 40px; }
.archc-wrap { max-width: 1280px; }
.archc-wrap-1080 { max-width: 1080px; }
.archc-wrap-920 { max-width: 920px; }
.archc-wrap-900 { max-width: 900px; }
.archc-wrap-820 { max-width: 820px; }
.archc-wrap-760 { max-width: 760px; }
.archc-wrap-720 { max-width: 720px; }

.archc-reveal { opacity: 0; transform: translateY(24px); transition: opacity 1s ease, transform 1s cubic-bezier(.2,.6,.2,1); }
.archc-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .archc-reveal { opacity: 1; transform: none; } }

.archc-label { display: block; font-size: 1.1rem; letter-spacing: 0.28em; color: var(--ac-faint); }

.archc-viewlink { display: inline-block; text-decoration: none; color: var(--ac-ink); font-size: 1.2rem; letter-spacing: 0.2em; border-bottom: 1px solid var(--ac-line2); padding-bottom: 6px; transition: color .3s ease, border-color .3s ease; }
.archc-viewlink:hover { opacity: 1; color: var(--ac-gray); border-color: var(--ac-ink); }
.archc-viewlink--light { color: var(--ac-dark-ink); border-color: #55524c; }
.archc-viewlink--light:hover { color: #fff; border-color: var(--ac-dark-ink); }

.archc-btn-fill { display: inline-block; background: var(--ac-ink); color: var(--ac-bg); text-decoration: none; font-size: 1.3rem; letter-spacing: 0.14em; padding: 18px 40px; transition: opacity .3s ease; }
.archc-btn-fill:hover { opacity: 0.82; color: var(--ac-bg); }
.archc-btn-line { display: inline-block; border: 1px solid var(--ac-ink); color: var(--ac-ink); text-decoration: none; font-size: 1.5rem; letter-spacing: 0.06em; padding: 17px 34px; transition: background .3s ease, color .3s ease; }
.archc-btn-line:hover { opacity: 1; background: var(--ac-ink); color: var(--ac-bg); }
.archc-btn-outline { display: inline-block; border: 1px solid var(--ac-ink); color: var(--ac-ink); text-decoration: none; font-size: 1.2rem; letter-spacing: 0.2em; padding: 16px 40px; transition: background .3s ease, color .3s ease; }
.archc-btn-outline:hover { opacity: 1; background: var(--ac-ink); color: var(--ac-bg); }

/* ============ ヘッダー（追従・半透明・ロゴなし／ナビ右寄せ） ============ */
.archc-header { position: sticky; top: 0; z-index: 100; background: rgba(253,252,250,0.92); -webkit-backdrop-filter: saturate(120%) blur(8px); backdrop-filter: saturate(120%) blur(8px); box-shadow: none; }
.archc-header__inner { max-width: 100%; width: 95%; margin: 0 auto; padding: 0; height: 82px; justify-content: flex-end; gap: 32px; }

.archc-nav { display: flex; align-items: center; gap: 22px; margin: 0; }
.archc-nav__item a { flex-direction: row; padding: 0 0 4px; border-bottom: 1px solid transparent; }
.archc-nav__item a::after { display: none; }
.archc-nav__en { color: var(--ac-ink); font-size: 1.5rem; letter-spacing: 0.18em; font-weight: 400; opacity: 0.78; transition: opacity .3s ease; }
.archc-nav__item a:hover .archc-nav__en { opacity: 1; }
.archc-nav__item.is-current a { border-bottom-color: var(--ac-ink); }
.archc-nav__item.is-current .archc-nav__en { opacity: 1; }

.archc-header__right { display: flex; align-items: center; gap: 18px; height: auto; }
.archc-header__tel { display: inline-flex; align-items: center; gap: 6px; color: var(--ac-ink); text-decoration: none; font-size: 1.4rem; letter-spacing: 0.06em; }
.archc-header__tel:hover { opacity: 0.7; color: var(--ac-ink); }
.archc-header__ig { color: var(--ac-ink); display: flex; }
.archc-header__ig:hover { opacity: 0.7; }
.archc-header__cta { display: inline-block; background: var(--ac-ink); color: var(--ac-bg); text-decoration: none; font-size: 1.2rem; letter-spacing: 0.12em; padding: 12px 20px; transition: opacity .3s ease; }
.archc-header__cta:hover { opacity: 0.82; color: var(--ac-bg); }

/* SPナビ：英語のみ・英字を大きく表示 */
.sp-nav__en { font-size: 1.8rem; letter-spacing: 0.16em; opacity: 1; padding-left: 0; margin-right: auto; font-weight: 400; line-height: 1.2; }

/* SPナビ：共通CSSがFont Awesome(\f054)を使うが本サイトはFA未読込のため、
   文字化け回避としてCSS描画の矢印に差し替える */
.sp-nav__link::after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
  font-size: inherit;
  opacity: 0.5;
  flex-shrink: 0;
}

/* SPナビ内の電話/IG */
.sp-nav__bottom { display: flex; align-items: center; justify-content: center; gap: 24px; }
.archc-spnav__tel { color: #fff; font-size: 1.8rem; letter-spacing: 0.06em; text-decoration: none; }
.archc-spnav__ig { color: #fff; display: flex; }

@media (max-width: 1100px) {
  .archc-nav, .archc-header__right { display: none; }
  .archc-header__inner { height: 64px; }
  /* ロゴ削除後、この幅ではヘッダー内に表示要素が無くなるため帯自体を隠す
     （ナビは position:fixed の .nav-toggle → .sp-nav で担保） */
  .archc-header { display: none; }
}

/* ============ HERO（MV） ============ */
.archc-hero { position: relative; width: 95%; margin: 0 auto; height: min(90vh, 820px); min-height: 560px; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #e9e5df; }
.archc-hero__slideshow { position: absolute; inset: 0; }
.archc-hero__slide { position: absolute; inset: 0; }
.archc-hero__media { position: absolute; inset: 0; animation: acKen 14s cubic-bezier(.2,.6,.2,1) both; }
.archc-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.archc-hero__overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.42); mix-blend-mode: multiply; }
.archc-hero__veil { position: absolute; left: 0; right: 0; height: 51%; background: #e9e5df; }
.archc-hero__veil--top { top: 0; transform-origin: top; animation: acCurtainTop 1.5s cubic-bezier(.76,0,.24,1) 0.35s both; }
.archc-hero__veil--bottom { bottom: 0; transform-origin: bottom; animation: acCurtainBot 1.5s cubic-bezier(.76,0,.24,1) 0.35s both; }
.archc-hero__inner { position: relative; text-align: center; padding: 0 24px; width: 100%; max-width: 900px; color: #fff; }
.archc-hero__kana { font-size: clamp(1.2rem, 1.6vw, 1.5rem); letter-spacing: 0.42em; text-indent: 0.42em; margin: 0 0 18px; font-weight: 400; color: rgba(255,255,255,0.88); animation: acFade 1.5s ease-out 1s both; }
.archc-hero__en { font-size: clamp(3.2rem, 7vw, 6.4rem); letter-spacing: 0.24em; text-indent: 0.24em; white-space: nowrap; line-height: 1; font-weight: 200; margin: 0; color: #fff; animation: acFade 1.5s ease-out 1.2s both; }
.archc-hero__ja { font-size: clamp(1.4rem, 2.2vw, 2rem); letter-spacing: 0.28em; text-indent: 0.28em; margin: 22px 0 0; font-weight: 300; color: rgba(255,255,255,0.92); animation: acFade 1.5s ease-out 1.7s both; }
.archc-hero__line { display: block; height: 1px; width: 64px; margin: 26px auto 0; background: rgba(255,255,255,0.7); transform-origin: center; animation: acLineGrow 1.1s cubic-bezier(.76,0,.24,1) 2s both; }
.archc-hero__scroll { position: absolute; bottom: 34px; left: 0; right: 0; width: fit-content; margin-left: auto; margin-right: auto; display: flex; flex-direction: column; align-items: center; gap: 10px; animation: acFade 1.4s ease-out 2.2s both; }
.archc-hero__scroll span.font-en { font-size: 0.9rem; letter-spacing: 0.3em; text-indent: 0.3em; color: rgba(255,255,255,0.85); }
.archc-hero__scroll-bar { position: relative; width: 1px; height: 46px; background: rgba(255,255,255,0.28); overflow: hidden; }
.archc-hero__scroll-dot { position: absolute; top: 0; left: 0; width: 1px; height: 14px; background: rgba(255,255,255,0.95); animation: acScrollDot 2.2s ease-in-out 2.6s infinite; }

@keyframes acKen { 0% { transform: scale(1.16); } 60% { transform: scale(1.03); } 100% { transform: scale(1.06); } }
@keyframes acFade { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes acCurtainTop { from { transform: translateY(0); } to { transform: translateY(-101%); } }
@keyframes acCurtainBot { from { transform: translateY(0); } to { transform: translateY(101%); } }
@keyframes acLineGrow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes acScrollDot { 0% { transform: translateY(-6px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateY(38px); opacity: 0; } }

/* ============ INTRO ============ */
.archc-intro { max-width: 980px; margin: 0 auto; padding: 150px 40px 130px; text-align: center; }
.archc-intro__title { font-weight: 300; font-size: clamp(2.2rem, 2.9vw, 3.4rem); line-height: 2.05; letter-spacing: 0.08em; margin: 36px 0 0; }
.archc-intro__lead { font-weight: 400; font-size: 1.6rem; line-height: 2.7; letter-spacing: 0.06em; color: var(--ac-gray); max-width: 860px; margin: 44px auto 0; }

/* ============ セクション見出し ============ */
.archc-h2 { font-weight: 400; font-size: clamp(3rem, 3.4vw, 4.6rem); letter-spacing: 0.14em; margin: 0; line-height: 1.2; }
.archc-h2--light { color: var(--ac-dark-ink); }
.archc-shead { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; margin-bottom: 56px; }

/* ============ CONCEPT feature（2カラム） ============ */
.archc-featuresec { padding: 0 0 150px; }
.archc-feature { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; }
.archc-feature__media { position: relative; min-height: 460px; background: var(--ac-gray-bg, #ded8cf); overflow: hidden; }
.archc-feature__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.archc-feature__body { padding: clamp(48px,6vw,88px) clamp(40px,5vw,72px) clamp(48px,6vw,88px) clamp(44px,5vw,72px); display: flex; flex-direction: column; justify-content: center; }
.archc-feature__body .archc-h2 { margin-bottom: 6px; }
.archc-feature__text { font-weight: 400; font-size: 1.6rem; line-height: 2.3; letter-spacing: 0.06em; color: var(--ac-gray); margin: 28px 0 0; }
.archc-feature__body .archc-viewlink { margin-top: 40px; align-self: flex-start; }
.archc-photo-cap { position: absolute; bottom: 16px; left: 18px; font-size: 0.9rem; letter-spacing: 0.24em; color: rgba(255,255,255,0.9); text-shadow: 0 1px 4px rgba(0,0,0,0.4); }

/* ============ WORKS グリッド ============ */
.archc-worksec { background: var(--ac-panel); padding: 130px 0; }
.archc-works { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.archc-work { position: relative; display: block; aspect-ratio: 3 / 2; overflow: hidden; text-decoration: none; background: #e5e0d8; }
.archc-work img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.archc-work:hover img { transform: scale(1.04); }
.archc-work__ov { position: absolute; inset: 0; background: var(--ac-teal); mix-blend-mode: multiply; opacity: 0; transition: opacity .55s ease; }
.archc-work__cap { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #fff; text-align: center; padding: 24px; opacity: 0; transform: translateY(8px); transition: opacity .55s ease, transform .55s ease; }
.archc-work:hover .archc-work__ov { opacity: 1; }
.archc-work:hover .archc-work__cap { opacity: 1; transform: none; }
.archc-work__date { font-size: 1.1rem; letter-spacing: 0.18em; color: rgba(255,255,255,0.85); }
.archc-work__title { font-size: 1.6rem; letter-spacing: 0.09em; line-height: 1.7; }

/* ============ FLOW プレビュー（TOP） ============ */
.archc-flowsec { padding: 130px 0; }
.archc-flowhead { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 56px; align-items: center; }
.archc-flowhead__text { font-weight: 400; font-size: 1.6rem; line-height: 2.3; letter-spacing: 0.06em; color: var(--ac-gray); margin: 28px 0 0; }
.archc-flowhead .archc-viewlink { margin-top: 34px; }
.archc-flowlist { display: flex; flex-direction: column; }
.archc-flowlist__row { display: flex; align-items: baseline; gap: 22px; padding: 20px 0; border-top: 1px solid var(--ac-line); }
.archc-flowlist__no { font-size: 1.3rem; letter-spacing: 0.1em; color: #b0aca4; width: 34px; }
.archc-flowlist__label { font-size: 1.5rem; letter-spacing: 0.08em; font-weight: 300; }
.archc-flowlist__more { border-top: 1px solid var(--ac-line); padding-top: 18px; font-size: 1.2rem; letter-spacing: 0.08em; color: var(--ac-faint); }

/* ============ EVENT（暗背景・行リスト） ============ */
.archc-eventsec { background: var(--ac-dark); color: var(--ac-dark-ink); padding: 130px 0; }
.archc-eventrow { display: flex; align-items: center; gap: 32px; padding: 26px 0; border-top: 1px solid #2b2b2b; text-decoration: none; color: var(--ac-dark-ink); flex-wrap: wrap; transition: opacity .3s ease; }
.archc-eventrow:hover { opacity: 0.7; color: var(--ac-dark-ink); }
.archc-eventrow__date { font-size: 1.3rem; letter-spacing: 0.1em; color: #8f8b83; width: 110px; }
.archc-eventrow__title { font-size: 1.5rem; letter-spacing: 0.06em; font-weight: 300; flex: 1; min-width: 200px; }
.archc-eventsec__end { border-top: 1px solid #2b2b2b; }

/* ============ CONTACT CTA帯 ============ */
.archc-cta { position: relative; padding: 150px 40px; text-align: center; background: linear-gradient(135deg, var(--ac-sand), var(--ac-sand2)); overflow: hidden; }
.archc-cta__title { font-weight: 300; font-size: clamp(2.4rem, 3vw, 3.8rem); letter-spacing: 0.1em; margin: 24px 0 0; line-height: 1.8; }
.archc-cta__text { font-weight: 400; font-size: 1.6rem; letter-spacing: 0.06em; color: var(--ac-gray); margin: 22px auto 0; max-width: 560px; line-height: 2.2; }
.archc-cta__btns { display: flex; gap: 16px; justify-content: center; margin-top: 44px; flex-wrap: wrap; }
/* CTA帯：背景写真（--cta-photo）を薄く・ぼかして敷き、グラデを濃いめオーバーレイで重ね可読性を担保 */
.archc-cta--photo::before { content: ""; position: absolute; inset: -24px; background: var(--cta-photo) center / cover no-repeat; filter: blur(8px); z-index: 0; }
.archc-cta--photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(239,236,230,0.9), rgba(226,221,212,0.9)); z-index: 1; }
.archc-cta--photo > * { position: relative; z-index: 2; }

/* ============ 下層ページヘッド ============ */
.archc-phead { padding: 100px 40px 48px; border-bottom: 1px solid var(--ac-line); }
.archc-phead__crumb { font-size: 1.1rem; letter-spacing: 0.22em; color: var(--ac-faint); }
.archc-phead__crumb a { color: var(--ac-faint); text-decoration: none; }
.archc-phead__title { font-weight: 400; font-size: clamp(3.2rem, 4.4vw, 6rem); letter-spacing: 0.12em; margin: 26px 0 0; line-height: 1.1; }
.archc-phead__lead { font-weight: 400; font-size: 1.6rem; line-height: 2.4; letter-spacing: 0.06em; color: var(--ac-gray); max-width: 720px; margin: 28px 0 0; }

/* ============ CONCEPT：リード / VALUE / 締め ============ */
.archc-lead { max-width: 820px; margin: 0 auto; padding: 130px 40px; text-align: center; }
.archc-lead__big { font-weight: 400; font-size: clamp(2.4rem, 3vw, 3.8rem); line-height: 2; letter-spacing: 0.1em; color: var(--ac-ink); margin: 34px 0 0; }
.archc-lead__text { font-weight: 400; font-size: 1.6rem; line-height: 2.6; letter-spacing: 0.07em; color: #3a3833; margin: 40px 0 0; }

.archc-values { max-width: 1280px; margin: 0 auto; padding: 24px 40px 60px; display: flex; flex-direction: column; gap: 72px; }
.archc-value { display: flex; flex-wrap: wrap; align-items: stretch; }
.archc-value--reverse { flex-direction: row-reverse; }
.archc-value__media { flex: 1 1 400px; position: relative; aspect-ratio: 3 / 2; background: #e6e1da; overflow: hidden; }
.archc-value__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.archc-value__body { flex: 1 1 400px; padding: clamp(32px,5vw,72px); display: flex; flex-direction: column; justify-content: center; }
.archc-value__title { font-weight: 400; font-size: clamp(1.8rem, 1.7vw, 2.3rem); letter-spacing: 0.09em; margin: 0; line-height: 1.6; }
.archc-value__en { display: block; font-size: 1.2rem; letter-spacing: 0.22em; color: var(--ac-faint); margin: 16px 0 0; }
.archc-value__text { font-weight: 400; font-size: 1.6rem; line-height: 2.35; letter-spacing: 0.06em; color: var(--ac-gray); margin: 20px 0 0; }

.archc-closing { background: var(--ac-dark); color: var(--ac-dark-ink); padding: 130px 40px; text-align: center; }
.archc-closing__big { font-weight: 400; font-size: clamp(1.9rem, 2.3vw, 2.8rem); line-height: 2.1; letter-spacing: 0.09em; max-width: 820px; margin: 0 auto; }
.archc-closing__text { font-weight: 400; font-size: 1.6rem; line-height: 2.4; letter-spacing: 0.06em; color: #b8b4ac; max-width: 640px; margin: 34px auto 0; }
.archc-closing .archc-viewlink { margin-top: 48px; }

/* ============ FLOW ページ（縦タイムライン） ============ */
.archc-flowsec-inner { padding-top: 40px; padding-bottom: 130px; }
.archc-flow { position: relative; }
.archc-flow__step { position: relative; display: grid; grid-template-columns: 96px 1fr; gap: 28px; padding-bottom: 44px; }
.archc-flow__line { position: absolute; top: 64px; bottom: 0; left: 48px; width: 1px; background: var(--ac-ink); }
.archc-flow__numwrap { display: flex; flex-direction: column; align-items: center; position: relative; }
.archc-flow__num { width: 64px; height: 64px; border: 1px solid var(--ac-ink); border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--ac-bg); flex-shrink: 0; font-size: 2rem; letter-spacing: 0.04em; }
.archc-flow__body { padding: 8px 0; }
.archc-flow__title { font-weight: 400; font-size: clamp(1.9rem, 2.1vw, 2.5rem); letter-spacing: 0.08em; margin: 0; }
.archc-flow__desc { font-weight: 400; font-size: 1.6rem; line-height: 2.2; letter-spacing: 0.05em; color: var(--ac-gray); margin: 14px 0 0; }
.archc-flow__note { margin-top: 16px; border: 1px solid var(--ac-ink); padding: 14px 18px; display: inline-block; font-size: 1.3rem; letter-spacing: 0.06em; font-weight: 500; }
.archc-flow__pay { display: inline-block; margin-top: 14px; font-size: 1.1rem; letter-spacing: 0.14em; background: var(--ac-dark); color: var(--ac-dark-ink); padding: 7px 14px; }
.archc-flow__foot { margin-top: 20px; border-top: 1px solid var(--ac-line); padding-top: 44px; text-align: center; }
.archc-flow__foot p { font-weight: 400; font-size: 1.6rem; letter-spacing: 0.06em; color: var(--ac-gray); line-height: 2.2; }
.archc-flow__foot .archc-btn-fill { margin-top: 26px; }

/* ============ 一覧セクション余白 ============ */
.archc-listsec { padding-top: 60px; padding-bottom: 130px; }
.archc-listsec--tight { padding-top: 20px; padding-bottom: 130px; }

/* ============ ページネーション ============ */
.archc-pager { display: flex; justify-content: center; gap: 8px; margin-top: 80px; }
.archc-pager__item { font-size: 1.3rem; letter-spacing: 0.06em; min-width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--ac-line2); background: transparent; color: var(--ac-gray); text-decoration: none; transition: background .3s ease, color .3s ease, border-color .3s ease; }
.archc-pager__item:hover { opacity: 1; border-color: var(--ac-ink); color: var(--ac-ink); }
.archc-pager__item.is-current { border-color: var(--ac-ink); background: var(--ac-ink); color: var(--ac-bg); }

/* ============ CMSページネーション（<%page_link%>出力：.pages > .page_prev / .page_next） ============ */
.pages { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 80px; flex-wrap: wrap; }
.pages a { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0 22px; border: 1px solid var(--ac-line2); color: var(--ac-gray); text-decoration: none; font-size: 1.3rem; letter-spacing: 0.08em; white-space: nowrap; transition: background .3s ease, color .3s ease, border-color .3s ease; }
.pages a:hover { opacity: 1; border-color: var(--ac-ink); color: var(--ac-ink); }
/* WORKSグリッド（span.archc-works）内にCMSが吐くページャーは全列ぶち抜きで下段に */
.archc-works > .pages { grid-column: 1 / -1; }
/* TOPのWORKS新着（teaser）はページャー非表示 */
.archc-worksec .pages { display: none; }

/* ============ ブログ詳細（WORKS / EVENT） ============ */
.archc-crumb { font-size: 1.1rem; letter-spacing: 0.14em; color: var(--ac-faint); }
.archc-crumb a { text-decoration: none; color: var(--ac-faint); }
.archc-crumb .is-current { color: var(--ac-gray3); }
.archc-metarow { display: flex; gap: 12px; align-items: center; margin-top: 34px; }
.archc-tag { font-size: 1.1rem; letter-spacing: 0.1em; color: var(--ac-gray3); border: 1px solid var(--ac-line2); padding: 4px 11px; }
.archc-date { font-size: 1.1rem; letter-spacing: 0.16em; color: var(--ac-faint); }
.archc-detail__title { font-weight: 300; font-size: clamp(2.6rem, 3.6vw, 4.2rem); letter-spacing: 0.08em; line-height: 1.7; margin: 18px 0 0; }
.archc-detail__sub { font-weight: 400; font-size: 1.4rem; letter-spacing: 0.06em; color: var(--ac-gray2); margin: 14px 0 0; }
.archc-detail__hero { position: relative; aspect-ratio: 16 / 9; background: #e6e1da; overflow: hidden; }
.archc-detail__hero img { width: 100%; height: 100%; object-fit: cover; }
.archc-detail__body p { font-weight: 400; font-size: 1.6rem; line-height: 2.6; letter-spacing: 0.06em; color: #3a3833; margin: 0; }
.archc-detail__body p + p { margin-top: 32px; }
/* CMS本文（c=entry_body：画像＋テキストのリッチテキスト）の整形 */
.archc-detail__body { font-size: 1.6rem; line-height: 2.6; letter-spacing: 0.06em; color: #3a3833; }
.archc-detail__body img { max-width: 100%; height: auto; display: block; margin: 0 auto 28px; }
.archc-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.archc-gallery__item { position: relative; aspect-ratio: 4 / 3; background: #e6e1da; overflow: hidden; }
.archc-gallery__item img { width: 100%; height: 100%; object-fit: cover; }

/* ============ イベント一覧（サムネ横） ============ */
.archc-elist__row { display: grid; grid-template-columns: 220px 1fr; gap: 34px; align-items: center; padding: 32px 0; border-bottom: 1px solid var(--ac-line); text-decoration: none; color: var(--ac-ink); }
.archc-elist__row:hover { opacity: 1; color: var(--ac-ink); }
.archc-elist__row:hover .archc-elist__title { color: var(--ac-gray); }
.archc-elist__thumb { position: relative; aspect-ratio: 3 / 2; background: #e5e0d8; overflow: hidden; }
.archc-elist__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.archc-elist__row:hover .archc-elist__thumb img { transform: scale(1.04); }
.archc-elist__date { font-size: 1.3rem; letter-spacing: 0.1em; color: var(--ac-gray2); }
.archc-elist__title { font-weight: 400; font-size: clamp(1.6rem, 1.5vw, 1.9rem); letter-spacing: 0.06em; margin: 14px 0 0; line-height: 1.6; transition: color .3s ease; }
.archc-elist__excerpt { font-weight: 400; font-size: 1.6rem; line-height: 2; letter-spacing: 0.04em; color: var(--ac-gray2); margin: 10px 0 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ============ イベント詳細 spec ============ */
.archc-spec { border-top: 1px solid var(--ac-ink); }
.archc-spec__row { display: grid; grid-template-columns: 130px 1fr; gap: 20px; padding: 20px 0; border-bottom: 1px solid var(--ac-line); }
.archc-spec__k { font-size: 1.3rem; letter-spacing: 0.12em; color: var(--ac-gray2); }
.archc-spec__v { font-size: 1.5rem; letter-spacing: 0.05em; font-weight: 300; color: var(--ac-ink); }
.archc-detail__btns { display: flex; gap: 14px; margin-top: 44px; flex-wrap: wrap; }

/* ============ お問い合わせ ============ */
.archc-contact { display: grid; grid-template-columns: 1fr 320px; gap: 64px; align-items: start; }
.archc-form { display: flex; flex-direction: column; gap: 26px; }
.archc-field { display: block; }
.archc-field__label { display: flex; align-items: center; gap: 10px; font-size: 1.3rem; letter-spacing: 0.1em; color: #3a3833; margin-bottom: 10px; }
.archc-req { font-size: 1rem; letter-spacing: 0.1em; background: var(--ac-ink); color: var(--ac-bg); padding: 2px 8px; }
.archc-input { width: 100%; font-family: inherit; font-size: 1.5rem; letter-spacing: 0.04em; color: var(--ac-ink); background: #fff; border: 1px solid var(--ac-line2); border-radius: 0; padding: 15px 16px; outline: none; transition: border-color .2s ease; }
.archc-input:focus { border-color: var(--ac-ink); }
.archc-input::placeholder { color: #b5b0a7; }
textarea.archc-input { resize: vertical; line-height: 1.9; }
.archc-agree { display: flex; align-items: flex-start; gap: 10px; font-size: 1.3rem; letter-spacing: 0.04em; color: var(--ac-gray); line-height: 1.8; margin-top: 4px; }
.archc-agree input { margin-top: 5px; accent-color: var(--ac-ink); }
.archc-submit { background: var(--ac-ink); color: var(--ac-bg); border: none; font-family: inherit; font-size: 1.4rem; letter-spacing: 0.16em; padding: 19px; cursor: pointer; margin-top: 6px; transition: opacity .3s ease; }
.archc-submit:hover { opacity: 0.85; }
.archc-cinfo { display: flex; flex-direction: column; border-top: 1px solid var(--ac-ink); }
.archc-cinfo__block { padding: 26px 0; border-bottom: 1px solid var(--ac-line); }
.archc-cinfo__block:last-child { border-bottom: none; }
.archc-cinfo__tel { font-size: 2.4rem; letter-spacing: 0.04em; text-decoration: none; color: var(--ac-ink); display: block; margin-top: 8px; }
.archc-cinfo__tel:hover { opacity: 0.7; color: var(--ac-ink); }
.archc-cinfo__note { font-size: 1.25rem; letter-spacing: 0.05em; color: var(--ac-gray2); margin-top: 8px; line-height: 1.9; }
.archc-cinfo__addr { font-size: 1.35rem; letter-spacing: 0.05em; color: #3a3833; margin-top: 10px; line-height: 2; }
.archc-cinfo__sns { display: inline-flex; align-items: center; gap: 10px; margin-top: 12px; text-decoration: none; color: var(--ac-ink); }
.archc-cinfo__sns:hover { opacity: 0.7; color: var(--ac-ink); }
.archc-cinfo__sns .font-en { font-size: 1.2rem; letter-spacing: 0.14em; }
/* ============ CMSお問い合わせフォーム（cms_ajax出力）をサイトのミニマル基調に寄せる ============ */
/* CMSは mail-form.css を後から読むため、#id で詳細度を上げて上書きする */
#cms-contact-1-1-area .form-contents { background: none; padding: 0; margin: 0; box-shadow: none; border: none; max-width: none; }
#cms-contact-1-1-area form { max-width: none; }
#cms-contact-1-1-area dl { display: block; margin: 0; padding: 0; border: none; }
#cms-contact-1-1-area dl dt { display: block; float: none; width: auto; margin: 0; padding: 0 0 10px; border: none; background: none; font-size: 1.3rem; font-weight: 400; letter-spacing: 0.1em; color: #3a3833; line-height: 1.6; }
#cms-contact-1-1-area dl dd { display: block; float: none; width: auto; margin: 0 0 26px; padding: 0; border: none; background: none; }
/* ラベルを包む span は素のテキストに戻す（必須/任意バッジは ::before で描画される） */
#cms-contact-1-1-area dl dt span.required,
#cms-contact-1-1-area dl dt span.optional { display: inline; background: none; color: inherit; border: none; padding: 0; margin: 0; font-size: inherit; }
/* 必須バッジ（::before）を赤→黒に、静的デザインのバッジに寄せる */
#cms-contact-1-1-area dl dt span.required::before { background: var(--ac-ink); color: #fff; border-radius: 0; font-size: 1rem; letter-spacing: 0.1em; padding: 2px 8px 3px; margin-right: 8px; top: -1px; }
/* 入力欄・テキストエリア */
#cms-contact-1-1-area input.textarea,
#cms-contact-1-1-area textarea.textarea,
#cms-contact-1-1-area select {
  width: 100%; box-sizing: border-box; background: #fff; border: 1px solid var(--ac-line2); border-radius: 0;
  padding: 15px 16px; font-size: 1.5rem; font-family: inherit; letter-spacing: 0.04em; color: var(--ac-ink); outline: none;
  box-shadow: none; transition: border-color .2s ease;
}
#cms-contact-1-1-area textarea.textarea { line-height: 1.9; resize: vertical; }
#cms-contact-1-1-area input.textarea:focus,
#cms-contact-1-1-area textarea.textarea:focus,
#cms-contact-1-1-area select:focus { border-color: var(--ac-ink); }
#cms-contact-1-1-area input.textarea::placeholder,
#cms-contact-1-1-area textarea.textarea::placeholder { color: #b5b0a7; }
/* 送信ボタン */
#cms-contact-1-1-area .submit-btn {
  display: block; width: 100%; max-width: none; margin: 10px 0 0; background: var(--ac-ink); color: var(--ac-bg);
  border: none; border-radius: 0; font-family: inherit; font-size: 1.4rem; letter-spacing: 0.16em; font-weight: 400;
  padding: 19px; cursor: pointer; transition: opacity .3s ease; text-align: center;
}
#cms-contact-1-1-area .submit-btn:hover { opacity: 0.85; background: var(--ac-ink); }
/* 送信後メッセージ・エラー表示 */
#cms-contact-1-1-area .form-err-msg { color: #b34a3a; font-size: 1.3rem; letter-spacing: 0.04em; margin-bottom: 16px; }
#cms-contact-1-1-area .thanks-msg-area { font-size: 1.6rem; line-height: 2.2; letter-spacing: 0.06em; color: var(--ac-ink); }

.archc-access { margin-top: 90px; }
.archc-access__map { aspect-ratio: 16 / 9; }
.archc-access__map iframe { width: 100%; height: 100%; border: 0; display: block; }
.archc-access__addr { font-size: 1.4rem; letter-spacing: 0.05em; color: #3a3833; margin-top: 20px; line-height: 2; }

/* ============ フッター ============ */
.archc-footer { background: var(--ac-dark); color: #e7e4de; font-weight: 300; }
.archc-footer__inner { max-width: 1280px; margin: 0 auto; padding: 80px 40px 40px; }
.archc-footer__grid { display: grid; grid-template-columns: 1.2fr 1fr 1.3fr; gap: 56px; align-items: start; }
.archc-footer__logo { display: inline-block; }
.archc-footer__logo img { height: 96px; width: auto; }
.archc-footer__desc { font-size: 1.4rem; letter-spacing: 0.06em; line-height: 2; color: #b8b4ac; margin: 26px 0 0; }
.archc-footer__sns { display: inline-flex; align-items: center; gap: 10px; margin-top: 26px; color: #e7e4de; text-decoration: none; font-size: 1.2rem; letter-spacing: 0.14em; }
.archc-footer__sns:hover { opacity: 0.7; color: #e7e4de; }
.archc-footer__nav { display: flex; flex-direction: column; gap: 16px; padding-top: 6px; }
.archc-footer__navlink { text-decoration: none; color: #cfcbc3; font-size: 1.3rem; letter-spacing: 0.1em; display: flex; align-items: baseline; gap: 12px; }
.archc-footer__navlink:hover { opacity: 1; color: #fff; }
.archc-footer__naven { font-size: 0.8rem; letter-spacing: 0.2em; color: #6c6860; width: 56px; }
.archc-footer__map { border: 1px solid #333; aspect-ratio: 16 / 9; position: relative; overflow: hidden; background: #1f1f1f; border-radius: 0; }
.archc-footer__map iframe { width: 100%; height: 100%; border: 0; display: block; filter: grayscale(1) invert(0.92) contrast(0.9); }
.archc-footer__info { font-size: 1.3rem; letter-spacing: 0.05em; line-height: 2; color: #b8b4ac; margin-top: 20px; }
.archc-footer__muted { color: #8f8b83; }
.archc-footer__btns { display: flex; gap: 12px; margin-top: 22px; flex-wrap: wrap; }
.archc-footer__tel { border: 1px solid #4a4a4a; color: #e7e4de; text-decoration: none; font-size: 1.4rem; letter-spacing: 0.06em; padding: 11px 18px; transition: border-color .3s ease; }
.archc-footer__tel:hover { opacity: 1; color: #fff; border-color: #7a7a7a; }
.archc-footer__cta { background: #fdfcfa; color: var(--ac-dark); text-decoration: none; font-size: 1.2rem; letter-spacing: 0.12em; padding: 12px 22px; transition: opacity .3s ease; }
.archc-footer__cta:hover { opacity: 0.85; color: var(--ac-dark); }
.archc-footer__bottom { border-top: 1px solid #2b2b2b; margin-top: 56px; padding-top: 24px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.archc-footer__bottom .font-en { font-size: 1rem; letter-spacing: 0.16em; color: #6c6860; }
.archc-footer__bottom-note { font-size: 1.1rem; letter-spacing: 0.08em; color: #6c6860; }

/* ============ ページトップ ============ */
.archc-pagetop .page-top__link { border-radius: 0; background: var(--ac-ink); box-shadow: 0 4px 14px rgba(0,0,0,0.18); }
.archc-pagetop .page-top__link:hover { background: #000; transform: translateY(-2px); }

/* ============ レスポンシブ ============ */
@media (max-width: 1000px) {
  .archc-feature { grid-template-columns: 1fr; }
  .archc-feature__media { min-height: 300px; }
  .archc-flowhead { grid-template-columns: 1fr; gap: 40px; }
  .archc-contact { grid-template-columns: 1fr; gap: 44px; }
}
@media (max-width: 900px) {
  .archc-works { grid-template-columns: 1fr 1fr; }
  .archc-value, .archc-value--reverse { flex-direction: column; }
  .archc-footer__grid { grid-template-columns: 1fr; gap: 44px; }
}
@media (max-width: 700px) {
  .archc-gallery { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .archc-works { grid-template-columns: 1fr; }
  .archc-elist__row { grid-template-columns: 1fr; gap: 16px; }
  .archc-spec__row { grid-template-columns: 1fr; gap: 6px; }
  .archc-flow__step { grid-template-columns: 64px 1fr; gap: 18px; }
  .archc-flow__line { left: 32px; }
}
@media (max-width: 639px) {
  .archc-wrap, .archc-wrap-1080, .archc-wrap-920, .archc-wrap-900,
  .archc-wrap-820, .archc-wrap-760, .archc-wrap-720 { padding-left: 24px; padding-right: 24px; }
  .archc-intro { padding: 90px 24px 80px; }
  .archc-worksec, .archc-flowsec, .archc-eventsec { padding: 80px 0; }
  .archc-lead, .archc-closing, .archc-cta { padding-left: 24px; padding-right: 24px; }
  .archc-lead { padding-top: 80px; padding-bottom: 80px; }
  .archc-closing, .archc-cta { padding-top: 90px; padding-bottom: 90px; }
  .archc-phead { padding: 70px 24px 40px; }
  .archc-values { padding: 24px 24px 40px; gap: 48px; }

  /* MVキャッチをSP幅に収める */
  .archc-hero__kana { font-size: 1.1rem; letter-spacing: 0.3em; text-indent: 0.3em; margin-bottom: 12px; }
  .archc-hero__en { font-size: 2.6rem; letter-spacing: 0.12em; text-indent: 0.12em; word-break: break-word; }
  .archc-hero__ja { font-size: 1.3rem; letter-spacing: 0.14em; text-indent: 0.14em; }

  /* PC用の強制改行はSPでは解除し、自然に折り返す */
  .archc-phead__lead br,
  .archc-intro__lead br,
  .archc-feature__text br,
  .archc-flowhead__text br,
  .archc-lead__text br,
  .archc-cta__text br { display: none; }

  .archc-intro__title { font-size: 2.1rem; line-height: 1.9; }
  .archc-intro__lead { font-size: 1.6rem; line-height: 2.4; margin-top: 32px; }
  .archc-feature__body { padding: 40px 24px 48px; }
}

/* =========================================================================
 * 公開後修正（指示書2）：背景白で統一 ＋ 追加コンポーネント
 * ========================================================================= */
:root { --ac-bg: #ffffff; --ac-panel: #ffffff; }
body { background: #ffffff; }

/* WORKS：白背景に */
.archc-worksec { background: #ffffff; }

/* EVENT：暗背景 → 白背景・黒文字 */
.archc-eventsec { background: #ffffff; color: var(--ac-ink); }
.archc-eventrow { color: var(--ac-ink); border-top-color: var(--ac-line); }
.archc-eventrow:hover { color: var(--ac-gray); }
.archc-eventrow__date { color: var(--ac-gray2); }
.archc-eventsec__end { border-top-color: var(--ac-line); }
.archc-h2--light { color: var(--ac-ink); }
.archc-viewlink--light { color: var(--ac-ink); border-color: var(--ac-line2); }
.archc-viewlink--light:hover { color: var(--ac-gray); border-color: var(--ac-ink); }

/* フッター：暗背景 → 白背景・黒文字（ロゴは黒文字版を別途CDN差し替え） */
.archc-footer { background: #ffffff; color: var(--ac-ink); border-top: 1px solid var(--ac-line); }
/* ナビ削除に伴い 2カラムに（連絡先側を広めに） */
.archc-footer__grid { grid-template-columns: 1fr 1.9fr; }
/* 地図（左）＋ 住所・リンク（右）の左右構成 */
.archc-footer__contact { display: grid; grid-template-columns: 1.1fr 1fr; gap: 32px; align-items: center; }
.archc-footer__contact-text { display: flex; flex-direction: column; }
.archc-footer__contact .archc-footer__info { margin-top: 0; }
@media (max-width: 900px) {
  .archc-footer__grid { grid-template-columns: 1fr; }
  .archc-footer__contact { grid-template-columns: 1fr; gap: 24px; }
}
/* フッターロゴ（hero.png）を黒く表示：不透明部分を真っ黒に */
.archc-footer__logo img { filter: brightness(0); }
.archc-footer__desc { color: var(--ac-gray); }
.archc-footer__sns { color: var(--ac-ink); }
.archc-footer__navlink { color: var(--ac-gray); }
.archc-footer__navlink:hover { color: var(--ac-ink); }
.archc-footer__naven { color: var(--ac-faint); }
.archc-footer__map { border-color: var(--ac-line); background: #f0ede8; }
.archc-footer__map iframe { filter: grayscale(1) contrast(0.95); }
.archc-footer__info { color: var(--ac-gray); }
.archc-footer__label { color: var(--ac-ink); font-weight: 500; }
.archc-footer__muted { color: var(--ac-faint); }
.archc-footer__cta { background: var(--ac-ink); color: #fff; }
.archc-footer__cta:hover { color: #fff; }
.archc-footer__bottom { border-top-color: var(--ac-line); }
.archc-footer__bottom .font-en, .archc-footer__bottom-note { color: var(--ac-faint); }

/* Instagram 導線（旧FLOWセクションの置換）：写真は他コンテンツ幅に合わせる（.archc-wrapで内包） */
.archc-igsec { padding: 130px 0; }
.archc-feature--boxed .archc-feature__body { padding: clamp(36px,4vw,64px) 0 clamp(36px,4vw,64px) clamp(36px,4vw,64px); }
.archc-ig-tags { font-size: 1.35rem; letter-spacing: 0.04em; color: var(--ac-gray2); word-break: break-word; }
@media (max-width: 1000px) { .archc-feature--boxed .archc-feature__body { padding: 40px 0 0; } }
@media (max-width: 639px) { .archc-igsec { padding: 80px 0; } }

/* CONCEPT：詩的セクション（英字ラベルを見出しの上に） */
.archc-value__body .archc-value__en { margin: 0 0 14px; }
/* 見出しを気持ち小さく＋2行時は左右バランスよく折り返す */
.archc-value__title { font-size: clamp(1.6rem, 1.5vw, 2rem); line-height: 1.75; text-wrap: balance; }

/* CONTACT：中央寄せフォーム ＋ タブ（お問い合わせ / 資料請求） */
.archc-formcenter { max-width: 640px; margin: 0 auto; }
.archc-formlead { text-align: center; font-size: 1.6rem; line-height: 2.2; letter-spacing: 0.06em; color: var(--ac-gray); margin: 0 0 44px; }
.archc-tabs { display: flex; margin-bottom: 40px; border-bottom: 1px solid var(--ac-line); }
.archc-tab { flex: 1; background: none; border: none; border-bottom: 2px solid transparent; font-family: inherit; font-size: 1.5rem; letter-spacing: 0.08em; color: var(--ac-gray2); padding: 16px 8px; cursor: pointer; transition: color .3s ease, border-color .3s ease; margin-bottom: -1px; }
.archc-tab.is-active { color: var(--ac-ink); border-bottom-color: var(--ac-ink); }
.archc-tab:hover { color: var(--ac-ink); }
.archc-tabpanel { display: none; }
.archc-tabpanel.is-active { display: block; }
.archc-formnote { font-size: 1.5rem; line-height: 2.2; letter-spacing: 0.05em; color: var(--ac-gray); background: #f6f4f0; padding: 28px 30px; }

/* CONTACT CTA帯：砂色グラデ＋写真 → 白背景に */
.archc-cta { background: #ffffff; padding: 70px 40px 200px; }
.archc-cta--photo::before,
.archc-cta--photo::after { display: none; }
/* CTAタイトルを少し小さめに */
.archc-cta__title { font-size: clamp(1.9rem, 2.2vw, 2.8rem); }

/* 下層ページ共通：リード文の横幅を右へ広げる */
.archc-phead__lead { max-width: 960px; }

/* ACCESS：2住所併記 */
.archc-access__addrs { display: flex; flex-wrap: wrap; gap: 12px 48px; margin-top: 20px; }
.archc-access__addrs .archc-access__addr { margin-top: 0; }
.archc-access__addr strong { font-weight: 500; color: var(--ac-ink); }