/*
Theme Name: SWELL Child - PlumChan Marketing
Theme URI: https://marketing.plumchan.jp/
Description: 株式会社PlumChan「新規顧客獲得の仕組みづくり」サイト用のSWELL子テーマです。
Author: 株式会社PlumChan
Template: swell
Version: 1.2.0
Text Domain: swell-child-plumchan
*/

/* ============================================================
   共通ヘッダー（コラムなど、SWELLが出力するページ用）
   専用テンプレートのページには影響しません。
   ============================================================ */
body.mk-common-header #header,
body.mk-common-header .l-header,
body.mk-common-header .l-fixHeader,
body.mk-common-header .l-topTitleArea,
body.mk-common-header .c-gnav,
body.mk-common-header #breadcrumb,
body.mk-common-header .p-breadcrumb,
body.mk-common-header .c-breadcrumb,
body.mk-common-header #footer,
body.mk-common-header .l-footer { display: none !important; }
body.mk-common-header { padding-top: 0 !important; }

body.mk-common-header {
  --mk-ink:#16191b; --mk-ink2:#5c6165; --mk-line:#dfe1e2;
  --mk-brand:#04384c; --mk-accent:#C6395E; --mk-accent-d:#a82f4e;
}

.mk-gh{position:sticky;top:0;z-index:999;background:rgba(255,255,255,.97);
  backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid var(--mk-line);
  font-family:"Noto Sans JP","游ゴシック体","Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;}
.mk-gh .mk-in{max-width:1280px;margin:0 auto;padding:18px 56px;display:flex;align-items:center;gap:28px;}
.mk-gh .mk-logo{display:block;text-decoration:none;flex:0 0 auto;}
.mk-gh .mk-logo img{width:124px;height:auto;display:block;}
.mk-gh .mk-logo span{display:block;font-size:10px;color:var(--mk-ink2);letter-spacing:.04em;
  margin-top:3px;white-space:nowrap;}
.mk-gh nav{margin-left:auto;display:flex;gap:19px;font-size:13.5px;white-space:nowrap;}
.mk-gh nav a{text-decoration:none;color:var(--mk-ink);}
.mk-gh nav a:hover{color:var(--mk-brand);}
.mk-gh .mk-cta{background:var(--mk-accent);color:#fff;font-size:14px;font-weight:700;
  padding:12px 22px;border-radius:4px;text-decoration:none;white-space:nowrap;margin-left:22px;}
.mk-gh .mk-cta:hover{background:var(--mk-accent-d);color:#fff;}
@media (max-width:1000px){ .mk-gh .mk-in{padding-left:40px;padding-right:40px;}
  .mk-gh nav{display:none;} .mk-gh .mk-cta{margin-left:auto;} }
@media (max-width:640px){ .mk-gh .mk-in{padding:16px 20px;gap:14px;} }
@media (max-width:520px){ .mk-gh .mk-logo img{width:100px;} .mk-gh .mk-logo span{font-size:8px;}
  .mk-gh .mk-cta{font-size:12.5px;padding:11px 14px;} }

/* パンくず */
.mk-crumb{border-bottom:1px solid var(--mk-line);background:#fff;
  font-family:"Noto Sans JP","游ゴシック体","Yu Gothic",sans-serif;}
.mk-crumb ol{max-width:1280px;margin:0 auto;padding:12px 56px;list-style:none;
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12.5px;color:var(--mk-ink2);}
.mk-crumb li{display:flex;align-items:center;gap:8px;}
.mk-crumb li+li::before{content:"›";color:#b9bec1;font-size:14px;}
.mk-crumb a{color:var(--mk-brand);text-decoration:none;}
.mk-crumb a:hover{text-decoration:underline;}
@media (max-width:1000px){ .mk-crumb ol{padding-left:40px;padding-right:40px;} }
@media (max-width:640px){ .mk-crumb ol{padding-left:20px;padding-right:20px;} }

/* 共通フッター */
.mk-gf{background:var(--mk-ink);color:#9ca1a4;padding:36px 0 60px;font-size:13.5px;line-height:1.9;
  font-family:"Noto Sans JP","游ゴシック体","Yu Gothic",sans-serif;}
.mk-gf .mk-in{max-width:760px;margin:0 auto;padding:0 24px;}
.mk-gf img{width:112px;margin-bottom:16px;opacity:.85;}
.mk-gf a{color:#9ca1a4;text-decoration:none;}
.mk-gf a:hover{color:#fff;}
.mk-gf .mk-links{display:flex;flex-wrap:wrap;gap:20px;margin-top:12px;}


/* ============================================================
   共通CTA（コラムなど、SWELLが出力するページ用）
   ============================================================ */
.mk-final{position:relative;color:#fff;overflow:hidden;text-align:center;
  font-family:"Noto Sans JP","游ゴシック体","Yu Gothic",sans-serif;}
.mk-final .mk-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;margin:0;}
.mk-final .mk-scrim{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.78));}
.mk-final .mk-fin{position:relative;max-width:760px;margin:0 auto;padding:96px 24px;}
.mk-final .mk-lb{font-size:12.5px;letter-spacing:.2em;color:#9dbcc8;font-weight:700;
  margin:0 0 16px;}
.mk-final h2{font-size:clamp(24px,3.8vw,36px);font-weight:700;line-height:1.55;color:#fff;
  margin:0 0 24px;border:none;padding:0;background:none;}
.mk-final h2::before,.mk-final h2::after{content:none;}
.mk-final p{font-size:16.5px;line-height:2;color:#fff;opacity:.9;margin:0 0 34px;}
.mk-final .mk-btn{display:inline-block;background:var(--mk-accent);color:#fff;font-size:19px;
  font-weight:700;padding:22px 52px;border-radius:4px;text-decoration:none;line-height:1.5;}
.mk-final .mk-btn:hover{background:var(--mk-accent-d);color:#fff;}
.mk-final .mk-note{font-size:13px;color:#9dbcc8;margin:18px 0 0;opacity:1;}
@media (max-width:700px){ .mk-final .mk-fin{padding:56px 24px;} }

/* SWELLのフッター装飾に負けないように */
body.mk-common-header .mk-gf,
body.mk-common-header .mk-gf p,
body.mk-common-header .mk-gf div{background:transparent;}
body.mk-common-header .mk-gf{background:var(--mk-ink) !important;color:#9ca1a4 !important;}
body.mk-common-header .mk-gf a{color:#9ca1a4 !important;text-decoration:none !important;}
body.mk-common-header .mk-gf a:hover{color:#fff !important;}
body.mk-common-header .mk-gf img{width:112px !important;height:auto !important;
  margin:0 0 16px !important;opacity:1 !important;max-width:112px !important;}
body.mk-common-header .mk-gf p{color:#9ca1a4 !important;font-size:13.5px !important;
  line-height:1.9 !important;margin:0 0 4px !important;}
body.mk-common-header .mk-gf .mk-links{margin-top:12px !important;}
body.mk-common-header .mk-final{margin:0 !important;}
body.mk-common-header .mk-final h2{font-family:inherit !important;}
/* SWELLのコンテンツ余白が残る場合の調整 */
body.mk-common-header .l-mainContent,
body.mk-common-header #main_content{margin-bottom:0 !important;}
