/* ============================================================
   株式会社MSQUARE トップページ用CSS
   外観 → カスタマイズ → 追加CSS に貼り付けてください
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho:wght@400;600;900&family=Zen+Kaku+Gothic+New:wght@300;400;500&family=Klee+One:wght@400;600&family=Caveat:wght@400;500;600&family=Jost:wght@300;400;500&display=swap');

/* --- テーマの余白・装飾を内側で無効化 --- */
.msq-root.msq-root{
  position:relative !important;
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding:0 !important;
  float:none !important;
  overflow-x:hidden;
}
/* テーマが本文を細い枠に収める指定を打ち消す */
.entry-content > .wp-block-html,
.wp-block-post-content > .wp-block-html,
.entry-content > div:has(> .msq-root),
.wp-block-html:has(> .msq-root){
  max-width:none !important;
  width:auto !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
.msq-root.msq-root, .msq-root.msq-root *{box-sizing:border-box}
.msq-root.msq-root p, .msq-root.msq-root h1, .msq-root.msq-root h2, .msq-root.msq-root h3, .msq-root.msq-root h4,
.msq-root.msq-root h5, .msq-root.msq-root h6, .msq-root.msq-root ul, .msq-root.msq-root ol, .msq-root.msq-root li,
.msq-root.msq-root dl, .msq-root.msq-root dt, .msq-root.msq-root dd, .msq-root.msq-root figure, .msq-root.msq-root figcaption{
  margin:0;padding:0;
}
.msq-root.msq-root ul, .msq-root.msq-root ol{list-style:none !important;padding-left:0 !important}
.msq-root.msq-root li{list-style:none !important}
.msq-root.msq-root li::marker{content:"" !important;color:transparent !important}
.msq-root.msq-root nav li::before,
.msq-root.msq-root .work li::before,
.msq-root.msq-root .knit-list li::before,
.msq-root.msq-root .sns-list li::before,
.msq-root.msq-root footer li::before{content:none !important}
.msq-root.msq-root input, .msq-root.msq-root textarea, .msq-root.msq-root button{
  font-family:var(--gothic);border-radius:0;-webkit-appearance:none;appearance:none;
}
.msq-root.msq-root a{text-decoration:none;box-shadow:none;color:inherit}
.msq-root.msq-root a:hover{text-decoration:none}
.msq-root.msq-root img{max-width:100%;display:block}
.msq-root.msq-root h1, .msq-root.msq-root h2, .msq-root.msq-root h3, .msq-root.msq-root h4{font-weight:inherit}
.msq-root.msq-root summary{cursor:pointer;list-style:none}
.msq-root.msq-root summary::-webkit-details-marker{display:none}
body.admin-bar .msq-root.msq-root.msq-root header{top:32px}
@media screen and (max-width:782px){body.admin-bar .msq-root.msq-root.msq-root header{top:46px}}

.msq-root.msq-root{
  /* 生成りベース */
  --kinari:#F4F1E9;
  --kinari-2:#EEEAE0;
  --kinari-3:#FAF8F3;

  /* 深いチャコールグレー */
  --ink:#33302B;
  --ink-2:#4E4840;
  --mute:#7D766A;
  --line:#DCD6C9;

  /* 控えめな色 */
  --sage:#8E9C86;
  --blue-pale:#A8BCC9;
  --pink:#D9C1BE;

  /* アクセント一点 */
  --accent:#243F5E;
  --accent-h:#33587F;

  --mincho:'Zen Old Mincho', serif;
  --gothic:'Zen Kaku Gothic New', sans-serif;
  --hand:'Klee One', serif;
  --latin:'Caveat', cursive;
  --brand:'Jost', sans-serif;

  --pad:clamp(1.5rem,5vw,6rem);
  --maxw:1200px;
}
.msq-root.msq-root, .msq-root.msq-root *{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden}
.msq-root.msq-root{
  background:var(--kinari);color:var(--ink);
  font-family:var(--gothic);font-weight:300;line-height:2.05;letter-spacing:.045em;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
.msq-root.msq-root img{max-width:100%;display:block}
.msq-root.msq-root a{color:inherit;text-decoration:none}
.msq-root.msq-root :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.msq-root.msq-root .wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad);position:relative;z-index:2}
.msq-root.msq-root section{padding-block:clamp(4rem,9vw,8.5rem);position:relative;overflow:hidden}
.msq-root.msq-root .tint{background:var(--kinari-2)}

/* 非対称グリッド */
.msq-root.msq-root .offset{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(1.5rem,3vw,2.6rem)}
.msq-root.msq-root .c-1-5{grid-column:1 / 6}
.msq-root.msq-root .c-2-7{grid-column:2 / 8}
.msq-root.msq-root .c-3-8{grid-column:3 / 9}
.msq-root.msq-root .c-6-13{grid-column:6 / 13}
.msq-root.msq-root .c-7-13{grid-column:7 / 13}
.msq-root.msq-root .c-1-8{grid-column:1 / 9}
.msq-root.msq-root .c-4-13{grid-column:4 / 13}
.msq-root.msq-root .c-1-13{grid-column:1 / 13}
.msq-root.msq-root .c-1-6{grid-column:1 / 7}
.msq-root.msq-root .c-1-7{grid-column:1 / 8}
.msq-root.msq-root .c-2-9{grid-column:2 / 10}
.msq-root.msq-root .c-5-13{grid-column:5 / 13}
.msq-root.msq-root .c-8-13{grid-column:8 / 13}
.msq-root.msq-root .c-9-13{grid-column:9 / 13}
.msq-root.msq-root .eyebrow{
  font-family:var(--latin);font-size:1.15rem;font-weight:500;letter-spacing:.06em;
  color:var(--mute);display:flex;align-items:center;gap:.9rem;margin-bottom:1.1rem;
}
.msq-root.msq-root .eyebrow::before{content:"";width:2.6rem;height:1px;background:var(--sage);flex:none;opacity:.75}
.msq-root.msq-root .s-title{
  font-family:var(--mincho);font-weight:600;
  font-size:clamp(1.65rem,3.3vw,2.4rem);line-height:1.78;letter-spacing:.09em;margin-bottom:1.3rem;
}
.msq-root.msq-root .lead{max-width:33em;color:var(--ink-2);font-size:.94rem}
.msq-root.msq-root .thin-rule{height:1px;border:0;background:linear-gradient(90deg,transparent,var(--blue-pale),var(--pink),var(--sage),transparent);opacity:.6}

/* 手書き */
.msq-root.msq-root .aside-hand{font-family:var(--hand);font-size:1.03rem;line-height:2.15;color:var(--ink-2);display:inline-block;transform:rotate(-.5deg)}
.msq-root.msq-root .memo{font-family:var(--hand);font-size:.97rem;color:var(--sage);display:inline-block;transform:rotate(-1deg);margin-top:1.4rem;position:relative;padding-left:2.5rem}
.msq-root.msq-root .memo::before{content:"";position:absolute;left:0;top:.92em;width:1.9rem;height:1px;background:var(--sage);transform:rotate(-6deg)}
.msq-root.msq-root .uline{
  display:inline;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='10' viewBox='0 0 120 10'%3E%3Cpath d='M2 7 C 30 2, 60 8, 90 4 C 104 2, 114 5, 118 4' fill='none' stroke='%23A8BCC9' stroke-width='2.2' stroke-linecap='round' opacity='.9'/%3E%3C/svg%3E");
  background-repeat:repeat-x;background-size:120px 10px;background-position:left bottom;
  padding-bottom:.28em;
}
.msq-root.msq-root .wavy{position:relative;display:inline-block;padding-bottom:.45em}
.msq-root.msq-root .wavy::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:.5em;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='12' viewBox='0 0 72 12'%3E%3Cpath d='M1 7 C 10 1, 26 1, 36 7 C 46 13, 62 13, 71 7' fill='none' stroke='%238E9C86' stroke-width='2' stroke-linecap='round' opacity='.75'/%3E%3C/svg%3E");
  background-repeat:repeat-x;background-size:72px 12px;background-position:left bottom;
}

/* 光の粒(ごく控えめ) */
.msq-root.msq-root .hero::before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.5;
  background-image:
    radial-gradient(2px 2px at 12% 22%, #8E9C86 40%, transparent 45%),
    radial-gradient(2px 2px at 78% 16%, #A8BCC9 40%, transparent 45%),
    radial-gradient(1.6px 1.6px at 34% 68%, #D9C1BE 40%, transparent 45%),
    radial-gradient(2px 2px at 88% 62%, #8E9C86 40%, transparent 45%),
    radial-gradient(1.6px 1.6px at 22% 84%, #A8BCC9 40%, transparent 45%),
    radial-gradient(2px 2px at 62% 38%, #D9C1BE 40%, transparent 45%),
    radial-gradient(1.6px 1.6px at 48% 12%, #8E9C86 40%, transparent 45%);
  background-repeat:no-repeat;
}
@keyframes breathe{0%,100%{opacity:0}45%{opacity:.5}70%{opacity:.22}}


/* 写真の質感(フィルム調) */
.msq-root.msq-root .ph{position:relative;overflow:hidden;background:var(--kinari-3)}
.msq-root.msq-root .ph img, .msq-root.msq-root .ph video{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.93) contrast(.97) brightness(1.02)}
.msq-root.msq-root .ph::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
  opacity:.22;mix-blend-mode:multiply;
}
.msq-root.msq-root .ph::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(160deg, rgba(255,253,247,.18) 0%, rgba(255,253,247,0) 42%, rgba(142,156,134,.07) 100%);
}
.msq-root.msq-root figcaption{font-size:.74rem;color:var(--mute);margin-top:.85rem;letter-spacing:.09em;line-height:1.9}

/* ヒーローの写真 */

/* 手仕事の動画 */
.msq-root.msq-root .craft-media .ph{aspect-ratio:16/9}
.msq-root.msq-root .craft-still{margin-top:1.4rem}
.msq-root.msq-root .craft-still .ph{aspect-ratio:4/5}


/* ヘッダー */
.msq-root.msq-root header{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(244,241,233,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.msq-root.msq-root header.stuck{border-bottom-color:var(--line)}
.msq-root.msq-root .bar{max-width:var(--maxw);margin:0 auto;padding:.95rem var(--pad);display:flex;align-items:center;justify-content:space-between;gap:1rem}
.msq-root.msq-root .logo img{height:26px;width:auto;mix-blend-mode:multiply}
.msq-root.msq-root .logo .fallback{font-family:var(--brand);letter-spacing:.32em;font-size:1rem}
.msq-root.msq-root nav ul{display:flex;align-items:center;gap:1.8rem;list-style:none;flex-wrap:wrap;justify-content:flex-end}
.msq-root.msq-root nav a{font-size:.82rem;letter-spacing:.12em;color:var(--ink-2);position:relative;padding-block:.3rem}
.msq-root.msq-root nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .5s}
.msq-root.msq-root nav a:hover::after{transform:scaleX(1);transform-origin:left}
.msq-root.msq-root .btn{display:inline-block;background:var(--accent);color:#F6F4EE;font-size:.8rem;letter-spacing:.14em;padding:.76em 1.75em;border-radius:1.7em;transition:background .45s,transform .45s;border:0;cursor:pointer;font-family:var(--gothic)}
.msq-root.msq-root .btn:hover{background:var(--accent-h);transform:translateY(-1px)}
.msq-root.msq-root .btn::after{display:none}

/* ヒーロー(全画面・動画背景) */
.msq-root.msq-root .hero{
  position:relative;min-height:100svh;display:grid;place-items:center;
  overflow:hidden;padding:6rem var(--pad) 5rem;
}
.msq-root.msq-root .hero-bg{position:absolute;inset:0;z-index:0}
.msq-root.msq-root .hero{
  background-image:
    linear-gradient(180deg, rgba(244,241,233,.93) 0%, rgba(244,241,233,.66) 26%, rgba(244,241,233,.63) 70%, rgba(244,241,233,.94) 100%),
    radial-gradient(70% 55% at 50% 48%, rgba(250,248,243,.55) 0%, rgba(250,248,243,0) 75%),
    url('https://msquares.jp/wp-content/uploads/2026/08/hero-poster.jpg');
  background-size:cover,cover,cover;
  background-position:center,center,center;
  background-repeat:no-repeat;
}
.msq-root.msq-root .hero-veil{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(244,241,233,.92) 0%, rgba(244,241,233,.62) 22%, rgba(244,241,233,.58) 62%, rgba(244,241,233,.88) 100%),
    radial-gradient(70% 55% at 50% 48%, rgba(250,248,243,.62) 0%, rgba(250,248,243,0) 75%);
}
.msq-root.msq-root .hero-grain{
  position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.16;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");
}
.msq-root.msq-root .hero-inner{position:relative;z-index:3;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2.1rem}
.msq-root.msq-root .hero-kicker{
  font-family:var(--latin);font-size:1.18rem;font-weight:500;color:var(--ink-2);
  opacity:.85;
}
.msq-root.msq-root .hero-title{
  writing-mode:vertical-rl;font-family:var(--mincho);font-weight:600;
  font-size:clamp(1.75rem,3.1vw,2.6rem);line-height:2.1;letter-spacing:.22em;
  max-height:52vh;margin-inline:auto;color:var(--ink);
  text-shadow:0 1px 22px rgba(250,248,243,.9), 0 0 2px rgba(250,248,243,.8);
}
.msq-root.msq-root .hero-lead{
  font-size:.93rem;line-height:2.2;color:var(--ink-2);max-width:31em;
  text-shadow:0 1px 16px rgba(250,248,243,.9);
}
.msq-root.msq-root .hero-lead strong{font-weight:500;color:var(--ink)}
.msq-root.msq-root .hero-hand{font-family:var(--hand);font-size:1.02rem;line-height:2.1;color:var(--ink-2);transform:rotate(-.5deg)}
.msq-root.msq-root .hero::after{
  content:"";position:absolute;top:0;bottom:0;right:9%;width:120px;z-index:2;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='400' viewBox='0 0 120 400' preserveAspectRatio='none'%3E%3Cpath d='M60 0 C 130 50, 130 150, 60 200 C -10 250, -10 350, 60 400' fill='none' stroke='%238E9C86' stroke-width='1.3' opacity='.5'/%3E%3C/svg%3E");
  background-repeat:repeat-y;background-size:120px 400px;background-position:right top;
}
@media (max-width:900px){.msq-root.msq-root .hero::after{right:1%;width:72px;background-size:72px 240px}}
.msq-root.msq-root .scroll-hint{position:absolute;bottom:1.7rem;left:50%;transform:translateX(-50%);font-family:var(--latin);font-size:1.05rem;color:var(--mute);z-index:3}

/* 実績 */
.msq-root.msq-root .work-list{margin-top:3.4rem;border-top:1px solid var(--line)}
.msq-root.msq-root .work{display:grid;grid-template-columns:1fr auto;gap:1rem 2rem;align-items:baseline;padding-block:2rem;border-bottom:1px solid var(--line);transition:padding-left .6s cubic-bezier(.2,.7,.2,1),background .6s}
.msq-root.msq-root .work:hover{padding-left:1.3rem;background:rgba(255,255,255,.45)}
.msq-root.msq-root .work h3{font-family:var(--mincho);font-weight:400;font-size:clamp(1.3rem,2.6vw,1.9rem);letter-spacing:.06em;line-height:1.55}
.msq-root.msq-root .work h3 span{display:block;font-family:var(--gothic);font-size:.8rem;font-weight:300;letter-spacing:.14em;color:var(--mute);margin-top:.55rem}
.msq-root.msq-root .work .role{font-family:var(--latin);font-size:1.15rem;color:var(--mute);white-space:nowrap}
.msq-root.msq-root .works-foot{margin-top:1.7rem;font-size:.8rem;color:var(--mute)}

/* パスワード入口 */
.msq-root.msq-root .gate{margin-top:3.2rem;padding:clamp(1.7rem,3.5vw,2.7rem);border:1px solid var(--line);background:var(--kinari-3);display:grid;grid-template-columns:1fr auto;gap:clamp(1.4rem,4vw,3.4rem);align-items:center}
.msq-root.msq-root .gate-head h3{font-family:var(--mincho);font-weight:600;font-size:1.15rem;letter-spacing:.08em;margin-bottom:.7rem}
.msq-root.msq-root .gate-head p{font-size:.83rem;color:var(--ink-2);max-width:30em;line-height:2.05}
.msq-root.msq-root .gate-form{min-width:min(280px,72vw)}
.msq-root.msq-root .gate-form .btn{margin-bottom:.9rem}
.msq-root.msq-root .gate-alt{font-size:.78rem;color:var(--mute);margin-top:.3rem}
.msq-root.msq-root .gate-alt a{border-bottom:1px solid var(--line)}

/* 手仕事 */
.msq-root.msq-root .craft-left{margin-top:clamp(1.5rem,3.5vw,2.8rem)}
.msq-root.msq-root .craft-right{margin-top:clamp(1.5rem,3.5vw,2.8rem)}
.msq-root.msq-root .craft-quote{font-family:var(--mincho);font-weight:400;font-size:clamp(1.2rem,2.3vw,1.6rem);line-height:2.15;letter-spacing:.07em;margin-bottom:2rem}
.msq-root.msq-root .craft-steps{list-style:none;border-top:1px solid var(--line);margin-top:0}
.msq-root.msq-root .craft-steps li{padding-block:1.1rem;border-bottom:1px solid var(--line);font-size:.87rem;color:var(--ink-2);display:grid;grid-template-columns:2.8rem 1fr;gap:1rem;align-items:baseline}
.msq-root.msq-root .craft-steps b{font-family:var(--latin);font-weight:500;font-size:1.18rem;color:var(--sage)}
.msq-root.msq-root .craft-fig img{width:100%;aspect-ratio:3/4;object-fit:cover}
.msq-root.msq-root .craft-fig figcaption{font-size:.75rem;color:var(--mute);margin-top:.85rem;letter-spacing:.08em}
.msq-root.msq-root .craft-fig.lift{margin-top:clamp(2rem,7vw,5.5rem)}

/* 承ること(番号と色面を重ねたカード) */
.msq-root.msq-root .cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(2rem,4.5vw,4rem);margin-top:4.2rem}
.msq-root.msq-root .cap{position:relative;display:flex;flex-direction:column;padding-top:clamp(2rem,3.6vw,3rem)}
.msq-root.msq-root .cap:nth-child(1){--tone:#D9C1BE}
.msq-root.msq-root .cap:nth-child(2){--tone:#A8BCC9}
.msq-root.msq-root .cap:nth-child(3){--tone:#8E9C86}
.msq-root.msq-root .cap:nth-child(2){margin-top:clamp(1.5rem,4vw,3.5rem)}
.msq-root.msq-root .cap:nth-child(3){margin-top:clamp(3rem,8vw,7rem)}
.msq-root.msq-root .cap .bignum{
  position:absolute;top:0;left:-.12em;z-index:0;pointer-events:none;
  font-family:var(--brand);font-weight:300;font-size:clamp(3.6rem,6.4vw,5.6rem);
  line-height:.9;letter-spacing:.01em;color:var(--tone);opacity:.6;
}
.msq-root.msq-root .cap-head{position:relative;z-index:2;padding-left:clamp(2.4rem,4.4vw,3.6rem);margin-bottom:1.7rem}
.msq-root.msq-root .cap-head .rule{display:block;width:2.4rem;height:1px;background:var(--ink);opacity:.3;margin-bottom:.85rem}
.msq-root.msq-root .cap-head h3{
  font-family:var(--mincho);font-weight:600;font-style:italic;
  font-size:clamp(1.05rem,1.9vw,1.24rem);letter-spacing:.09em;line-height:1.75;
}
.msq-root.msq-root .cap-figwrap{position:relative;margin-bottom:1.5rem}
.msq-root.msq-root .cap-figwrap::before{
  content:"";position:absolute;z-index:0;background:var(--tone);opacity:.32;
}
.msq-root.msq-root .cap:nth-child(1) .cap-figwrap::before{top:-1.15rem;left:-1.15rem;right:2.6rem;bottom:2.6rem}
.msq-root.msq-root .cap:nth-child(2) .cap-figwrap::before{top:2.6rem;left:2.6rem;right:-1.15rem;bottom:-1.15rem}
.msq-root.msq-root .cap:nth-child(3) .cap-figwrap::before{top:-1.15rem;left:2.6rem;right:-1.15rem;bottom:2.6rem}
.msq-root.msq-root .cap-figwrap .ph{position:relative;z-index:1;aspect-ratio:1/1}
.msq-root.msq-root .cap .vlabel{
  position:absolute;z-index:3;writing-mode:vertical-rl;
  font-family:var(--brand);font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--mute);
  top:.2rem;right:-.1rem;
}
.msq-root.msq-root .cap p{font-size:.86rem;color:var(--ink-2);margin-bottom:1.3rem}
.msq-root.msq-root .cap ul{list-style:none;margin-top:auto;border-top:1px solid var(--line);padding-top:1.1rem}
.msq-root.msq-root .cap li{font-size:.82rem;line-height:1.95;padding-left:1.1em;position:relative;color:var(--ink-2)}
.msq-root.msq-root .cap li::before{content:"";position:absolute;left:0;top:.88em;width:5px;height:1px;background:var(--tone)}

/* 流れ */
.msq-root.msq-root .steps{margin-top:3.2rem;border-top:1px solid var(--line)}
.msq-root.msq-root .step{display:grid;grid-template-columns:5.5rem 13rem 1fr;gap:2rem;align-items:baseline;padding-block:1.75rem;border-bottom:1px solid var(--line)}
.msq-root.msq-root .step .no{font-family:var(--latin);font-size:1.18rem;font-weight:500;color:var(--sage)}
.msq-root.msq-root .step h4{font-family:var(--mincho);font-weight:600;font-size:1.03rem;letter-spacing:.08em}
.msq-root.msq-root .step p{font-size:.85rem;color:var(--ink-2)}

/* FAQ */
.msq-root.msq-root .faq{margin-top:2.8rem;border-top:1px solid var(--line)}
.msq-root.msq-root details{border-bottom:1px solid var(--line)}
.msq-root.msq-root summary{list-style:none;cursor:pointer;padding:1.5rem 3rem 1.5rem 0;position:relative;font-size:.95rem;letter-spacing:.05em;font-weight:400}
.msq-root.msq-root summary::-webkit-details-marker{display:none}
.msq-root.msq-root summary::after{content:"";position:absolute;right:.4rem;top:50%;width:11px;height:1px;background:var(--ink)}
.msq-root.msq-root summary::before{content:"";position:absolute;right:.4rem;top:50%;width:11px;height:1px;background:var(--ink);transform:rotate(90deg);transition:transform .45s,opacity .45s}
.msq-root.msq-root details[open] summary::before{opacity:0;transform:rotate(0)}
.msq-root.msq-root details p{padding:0 2rem 1.6rem 0;font-size:.86rem;color:var(--ink-2);max-width:44em}

/* 編み手 */
.msq-root.msq-root .knit .letter{font-family:var(--hand);font-size:clamp(1.02rem,2vw,1.18rem);line-height:2.5;letter-spacing:.05em;color:var(--ink-2);margin-top:2.2rem}
.msq-root.msq-root .knit-list{list-style:none;border-top:1px solid var(--line);margin-top:2.6rem}
.msq-root.msq-root .knit-list li{padding-block:1.25rem;border-bottom:1px solid var(--line);display:grid;grid-template-columns:7.5rem 1fr;gap:1.2rem;align-items:baseline}
.msq-root.msq-root .knit-list .k{font-family:var(--mincho);font-weight:600;font-size:.92rem;letter-spacing:.1em}
.msq-root.msq-root .knit-list .v{font-family:var(--hand);font-size:.95rem;line-height:2.2;color:var(--ink-2)}
.msq-root.msq-root .knit-close{margin-top:2.6rem;font-family:var(--hand);font-size:clamp(1.05rem,2vw,1.25rem);line-height:2.35;letter-spacing:.05em;color:var(--ink)}
.msq-root.msq-root .knit-card{background:var(--kinari-3);border:1px solid var(--line);padding:clamp(1.7rem,3.5vw,2.5rem);margin-top:clamp(2.5rem,7vw,5.5rem)}
.msq-root.msq-root .knit-card h3{font-family:var(--mincho);font-weight:600;font-size:1.15rem;letter-spacing:.08em;margin-bottom:1rem}
.msq-root.msq-root .knit-card p{font-family:var(--hand);font-size:.95rem;color:var(--ink-2);margin-bottom:1.4rem;line-height:2.2}

/* わたしたち */
.msq-root.msq-root .about dl{display:grid;grid-template-columns:7rem 1fr;margin-top:2rem}
.msq-root.msq-root .about dt, .msq-root.msq-root .about dd{padding-block:1rem;border-bottom:1px solid var(--line);font-size:.85rem}
.msq-root.msq-root .about dt{color:var(--mute);letter-spacing:.14em}
.msq-root.msq-root .about figure img{width:100%;aspect-ratio:3/4;object-fit:cover}

/* お問い合わせフォーム(Contact Form 7) */
.msq-root.msq-root .cf7-area .wpcf7-form p{margin:0}
.msq-root.msq-root .cf7-area label{display:block;font-size:.76rem;letter-spacing:.14em;color:var(--mute);margin-bottom:.45rem}
.msq-root.msq-root .cf7-area .wpcf7-form-control-wrap{display:block;margin-bottom:1.45rem}
.msq-root.msq-root .cf7-area input[type=text], .msq-root.msq-root .cf7-area input[type=email], .msq-root.msq-root .cf7-area input[type=tel], .msq-root.msq-root .cf7-area textarea{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);
  font-family:var(--gothic);font-size:.95rem;color:var(--ink);padding:.55rem 0;
  transition:border-color .45s;border-radius:0;-webkit-appearance:none;
}
.msq-root.msq-root .cf7-area input:focus, .msq-root.msq-root .cf7-area textarea:focus{outline:none;border-bottom-color:var(--accent)}
.msq-root.msq-root .cf7-area textarea{resize:vertical;min-height:7rem}
.msq-root.msq-root .cf7-area input[type=submit],
.msq-root.msq-root .cf7-area .wpcf7-submit{
  background:var(--accent);color:#F6F4EE;font-family:var(--gothic);font-size:.8rem;
  letter-spacing:.14em;padding:.76em 1.75em;border:0 !important;border-radius:1.7em !important;cursor:pointer;
  transition:background .45s,transform .45s;-webkit-appearance:none;
  background-color:var(--accent) !important;color:#F6F4EE !important;box-shadow:none !important;
}
.msq-root.msq-root .cf7-area input[type=submit]:hover{background:var(--accent-h);transform:translateY(-1px)}
.msq-root.msq-root .cf7-area .wpcf7-not-valid-tip{font-size:.76rem;color:var(--accent);margin-top:.4rem}
.msq-root.msq-root .cf7-area .wpcf7-response-output{
  font-size:.82rem;line-height:2;border:1px solid var(--line);
  background:var(--kinari-3);padding:1rem 1.2rem;margin:1.4rem 0 0;
}
.msq-root.msq-root .cf7-area .wpcf7-spinner{margin-left:.8rem}

/* SNS */
.msq-root.msq-root .sns-block{margin-top:clamp(2rem,7vw,6rem)}
.msq-root.msq-root .sns-lead{font-size:.85rem;color:var(--ink-2);margin-bottom:1.3rem}
.msq-root.msq-root .sns-list{list-style:none;border-top:1px solid var(--line)}
.msq-root.msq-root .sns-list li{border-bottom:1px solid var(--line)}
.msq-root.msq-root .sns-list a{
  display:flex;align-items:center;gap:1.1rem;padding-block:1.15rem;
  transition:padding-left .5s cubic-bezier(.2,.7,.2,1),color .45s;
}
.msq-root.msq-root .sns-list a:hover{padding-left:.7rem;color:var(--accent)}
.msq-root.msq-root .sns-ic{width:1.5rem;height:1.5rem;flex:none;color:var(--ink-2);transition:color .45s}
.msq-root.msq-root .sns-list a:hover .sns-ic{color:var(--accent)}
.msq-root.msq-root .sns-ic{background-repeat:no-repeat;background-position:center;background-size:contain}
.msq-root.msq-root .sns-ig{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A554D' stroke-width='1.3'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4.1'/%3E%3Ccircle cx='17.4' cy='6.6' r='1.05' fill='%235A554D' stroke='none'/%3E%3C/svg%3E")}
.msq-root.msq-root .sns-x{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235A554D'%3E%3Cpath d='M17.2 3h3.3l-7.2 8.3L21.8 21h-6.6l-4.3-5.6L5.9 21H2.6l7.7-8.8L2.4 3H9l3.9 5.2L17.2 3Zm-1.2 16h1.8L8.1 4.9H6.2L16 19Z'/%3E%3C/svg%3E")}
.msq-root.msq-root .sns-txt b{font-family:var(--brand);font-weight:400;font-size:.92rem;letter-spacing:.14em;display:block}
.msq-root.msq-root .sns-txt small{font-family:var(--brand);font-size:.76rem;letter-spacing:.1em;color:var(--mute);display:block;margin-top:.15rem}

/* お問い合わせ */
.msq-root.msq-root .note{background:var(--kinari-3);padding:1.8rem;border:1px solid var(--line);border-left:2px solid var(--sage)}
.msq-root.msq-root .note h5{font-size:.84rem;letter-spacing:.1em;margin-bottom:.7rem;font-weight:500}
.msq-root.msq-root .note li{font-size:.82rem;color:var(--ink-2);list-style:none;padding-left:1.1em;position:relative;line-height:2}
.msq-root.msq-root .note li::before{content:"";position:absolute;left:0;top:.92em;width:5px;height:1px;background:var(--sage)}
.msq-root.msq-root .field{margin-bottom:1.45rem}
.msq-root.msq-root .field label{display:block;font-size:.76rem;letter-spacing:.14em;color:var(--mute);margin-bottom:.45rem}
.msq-root.msq-root .field input, .msq-root.msq-root .field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);font-family:var(--gothic);font-size:.95rem;color:var(--ink);padding:.55rem 0;transition:border-color .45s}
.msq-root.msq-root .field input:focus, .msq-root.msq-root .field textarea:focus{outline:none;border-bottom-color:var(--accent)}
.msq-root.msq-root .field textarea{resize:vertical;min-height:7rem}
.msq-root.msq-root .form-note{font-size:.75rem;color:var(--mute);margin-top:.9rem}
.msq-root.msq-root footer{border-top:1px solid var(--line);padding-block:2.5rem;font-size:.75rem;color:var(--mute)}
.msq-root.msq-root footer .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center}
.msq-root.msq-root footer .f-nav{display:flex;gap:1.6rem;flex-wrap:wrap;align-items:center}
.msq-root.msq-root footer .f-ud{
  display:inline-flex;align-items:baseline;gap:.55rem;
  font-family:var(--brand);letter-spacing:.16em;font-size:.72rem;
  padding-left:1.5rem;border-left:1px solid var(--line);
}
.msq-root.msq-root footer .f-ud small{font-family:var(--gothic);letter-spacing:.1em;font-size:.7rem;color:var(--mute)}
.msq-root.msq-root footer .f-ud:hover{color:var(--accent)}
@media (max-width:600px){.msq-root.msq-root footer .f-ud{padding-left:0;border-left:0;width:100%;margin-top:.4rem}}

/* ゆっくりした出現のみ */

@media (max-width:900px){.msq-root.msq-root .offset{grid-template-columns:1fr;gap:2rem}
.msq-root.msq-root .offset > *{grid-column:1 / -1 !important}
.msq-root.msq-root .hero{padding-top:7rem}
.msq-root.msq-root .hero-title{writing-mode:horizontal-tb;letter-spacing:.11em;line-height:1.95;font-size:clamp(1.6rem,6.4vw,2.1rem);max-height:none}
.msq-root.msq-root .hero-inner{gap:1.7rem}
.msq-root.msq-root .hero-lead{font-size:.9rem}
.msq-root.msq-root .work{grid-template-columns:1fr}
.msq-root.msq-root .work .role{white-space:normal}
.msq-root.msq-root .gate{grid-template-columns:1fr}
.msq-root.msq-root .gate-form{min-width:0}
.msq-root.msq-root .cap-grid{grid-template-columns:1fr}
.msq-root.msq-root .cap:nth-child(2), .msq-root.msq-root .cap:nth-child(3), .msq-root.msq-root .craft-fig.lift, .msq-root.msq-root .knit-card{margin-top:0}
.msq-root.msq-root .cap{padding-top:2.6rem}
.msq-root.msq-root .cap .vlabel{display:none}
.msq-root.msq-root .knit-list li{grid-template-columns:1fr;gap:.2rem}
.msq-root.msq-root .step{grid-template-columns:3.6rem 1fr;gap:.3rem 1.2rem}
.msq-root.msq-root .step p{grid-column:2}
.msq-root.msq-root .scroll-hint{display:none}
}
@media (prefers-reduced-motion:reduce){.msq-root.msq-root, .msq-root.msq-root *{animation:none!important;transition:none!important}
}



/* ============================================================
   お問い合わせフォーム（Contact Form 7）
   囲みの有無にかかわらず効くよう、フォーム側のクラスを直接指定
   ============================================================ */
.msq-root.msq-root .wpcf7 p{margin:0}
.msq-root.msq-root .wpcf7 label{
  display:block;font-family:var(--gothic);font-weight:300;
  font-size:.76rem;letter-spacing:.14em;color:var(--mute);margin-bottom:.45rem;
}
.msq-root.msq-root .wpcf7 .wpcf7-form-control-wrap{display:block;margin-bottom:1.45rem}
.msq-root.msq-root .wpcf7 input[type=text],
.msq-root.msq-root .wpcf7 input[type=email],
.msq-root.msq-root .wpcf7 input[type=tel],
.msq-root.msq-root .wpcf7 input[type=url],
.msq-root.msq-root .wpcf7 textarea{
  width:100% !important;background:transparent !important;
  border:0 !important;border-bottom:1px solid var(--line) !important;
  border-radius:0 !important;box-shadow:none !important;
  font-family:var(--gothic) !important;font-size:.95rem !important;
  color:var(--ink) !important;padding:.55rem 0 !important;
  -webkit-appearance:none;appearance:none;transition:border-color .45s;
}
.msq-root.msq-root .wpcf7 input:focus,
.msq-root.msq-root .wpcf7 textarea:focus{
  outline:none !important;border-bottom-color:var(--accent) !important;
}
.msq-root.msq-root .wpcf7 textarea{resize:vertical;min-height:7rem}

/* 送信ボタン */
.msq-root.msq-root .wpcf7 input[type=submit],
.msq-root.msq-root .wpcf7 button[type=submit],
.msq-root.msq-root .wpcf7-submit,
.msq-root.msq-root input.wpcf7-submit{
  display:inline-block !important;
  width:auto !important;
  background:var(--accent) !important;
  background-color:var(--accent) !important;
  background-image:none !important;
  color:#F6F4EE !important;
  font-family:var(--gothic) !important;
  font-weight:300 !important;
  font-size:.8rem !important;
  line-height:1.6 !important;
  letter-spacing:.14em !important;
  padding:.76em 1.75em !important;
  border:0 !important;
  border-radius:1.7em !important;
  box-shadow:none !important;
  text-shadow:none !important;
  text-transform:none !important;
  cursor:pointer !important;
  -webkit-appearance:none !important;
  appearance:none !important;
  transition:background .45s, transform .45s !important;
}
.msq-root.msq-root .wpcf7 input[type=submit]:hover,
.msq-root.msq-root .wpcf7-submit:hover{
  background:var(--accent-h) !important;
  background-color:var(--accent-h) !important;
  transform:translateY(-1px) !important;
}

/* エラー・完了メッセージ */
.msq-root.msq-root .wpcf7 .wpcf7-not-valid-tip{
  font-size:.76rem !important;color:#9A5B4B !important;margin-top:.4rem !important;
}
.msq-root.msq-root .wpcf7 .wpcf7-response-output{
  font-family:var(--gothic) !important;font-size:.82rem !important;line-height:2 !important;
  border:1px solid var(--line) !important;background:var(--kinari-3) !important;
  color:var(--ink-2) !important;padding:1rem 1.2rem !important;margin:1.4rem 0 0 !important;
  border-radius:0 !important;
}
.msq-root.msq-root .wpcf7 .wpcf7-spinner{margin-left:.8rem}


/* ============================================================
   ヘッダー
   ============================================================ */
.msq-root.msq-root nav{display:flex;align-items:center;gap:1.9rem}
.msq-root.msq-root .nav-main{
  display:flex;align-items:center;gap:1.9rem;
  list-style:none !important;margin:0 !important;padding:0 !important;
}
.msq-root.msq-root .nav-main li{margin:0;padding:0}
.msq-root.msq-root .nav-cta{flex:0 0 auto;white-space:nowrap}

/* --- スマートフォン: ロゴと「お問い合わせ」だけにする --- */
@media (max-width:900px){
  .msq-root.msq-root .nav-main{display:none !important}
  .msq-root.msq-root .bar{
    flex-wrap:nowrap !important;
    align-items:center;
    padding-top:.85rem;
    padding-bottom:.85rem;
    gap:1rem;
  }
  .msq-root.msq-root .logo{flex:0 1 auto;min-width:0}
  .msq-root.msq-root .logo img{height:19px;width:auto}
  .msq-root.msq-root nav{flex:0 0 auto;gap:0}
  .msq-root.msq-root .nav-cta{
    font-size:.74rem !important;
    letter-spacing:.09em !important;
    padding:.62em 1.25em !important;
  }
  .msq-root.msq-root .hero{padding-top:7rem}
}
@media (max-width:380px){
  .msq-root.msq-root .logo img{height:17px}
  .msq-root.msq-root .nav-cta{font-size:.7rem !important;padding:.58em 1.05em !important}
}


/* ============================================================
   トップの背景動画（動画ブロックを使わずHTMLに直接置く場合）
   ※動画が表示されないときは、この指定があっても写真のまま出ます
   ============================================================ */
.msq-root.msq-root .hero-bg{
  position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;
}
.msq-root.msq-root .hero-bg video{
  width:100% !important;height:100% !important;
  object-fit:cover;display:block;
  max-width:none !important;
  filter:saturate(.8) contrast(.95) brightness(1.06);
}
/* 動画の上に生成りのベールを重ねて文字を読みやすく */
.msq-root.msq-root .hero-bg::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(244,241,233,.86) 0%, rgba(244,241,233,.28) 24%, rgba(244,241,233,.24) 70%, rgba(244,241,233,.88) 100%),
    radial-gradient(62% 48% at 50% 46%, rgba(250,248,243,.32) 0%, rgba(250,248,243,0) 78%);
}


/* ============================================================
   トップの追加要素（事業の一文・2つの入口）
   ============================================================ */
.msq-root.msq-root .hero-biz{
  font-family:var(--mincho);font-weight:400;
  font-size:clamp(.92rem,1.6vw,1.05rem);line-height:2.1;letter-spacing:.08em;
  color:var(--ink);text-shadow:0 1px 16px rgba(250,248,243,.9);
}
.msq-root.msq-root .hero-cta{
  display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem;margin-top:.4rem;
}
.msq-root.msq-root .btn-ghost{
  background:transparent !important;
  color:var(--ink) !important;
  border:1px solid var(--accent) !important;
  padding:calc(.76em - 1px) calc(1.75em - 1px) !important;
}
.msq-root.msq-root .btn-ghost:hover{
  background:var(--accent) !important;
  color:#F6F4EE !important;
}
@media (max-width:520px){
  .msq-root.msq-root .hero-cta{flex-direction:column;align-items:stretch;width:min(320px,100%)}
  .msq-root.msq-root .hero-cta .btn{text-align:center}
}


/* --- スマートフォン: トップの本文が2行に収まるよう調整 --- */
@media (max-width:600px){
  .msq-root.msq-root .hero-biz{
    font-size:min(1rem, calc((100vw - 3.4rem) / 25)) !important;
    letter-spacing:.01em !important;
    line-height:2 !important;
  }
  .msq-root.msq-root .hero-lead{
    font-size:min(.93rem, calc((100vw - 3.4rem) / 25)) !important;
    letter-spacing:.005em !important;
    line-height:2.05 !important;
    max-width:none;
  }
}


/* 「承ること」のリード文（2文に増えたため幅と行間を調整） */
.msq-root.msq-root #capability .lead{max-width:38em;line-height:2.15}


/* ============================================================
   実績詳細ページ｜パスワード入力画面
   （WordPress標準のパスワードフォームを、サイトの世界観に合わせる）
   ============================================================ */
.post-password-form{
  max-width:34rem;
  margin:clamp(2rem,6vw,4rem) auto;
  padding:clamp(1.8rem,4vw,2.8rem);
  background:#FAF8F3;
  border:1px solid #DCD6C9;
  font-family:'Zen Kaku Gothic New',sans-serif;
  font-weight:300;
  color:#33302B;
  line-height:2.05;
  letter-spacing:.045em;
  text-align:left;
}
/* 見出しと説明を差し込む */
.post-password-form::before{
  content:"守秘義務により、限定公開しています";
  display:block;
  font-family:'Zen Old Mincho',serif;
  font-weight:600;
  font-size:clamp(1.1rem,2.2vw,1.3rem);
  letter-spacing:.09em;
  line-height:1.8;
  margin-bottom:1.1rem;
}
/* 標準の案内文を差し替える */
.post-password-form > p:first-of-type{
  font-size:.86rem;
  color:#4E4840;
  margin:0 0 1.6rem;
  visibility:hidden;
  position:relative;
  height:calc(2.05em * 3);
}
.post-password-form > p:first-of-type::after{
  content:"ブランド名・作品名を含む実績は、パスワードをお持ちの方にご覧いただけます。ご検討中のお取引先様には、お問い合わせの際にお伝えしています。パスワードをお持ちでない方は、お問い合わせフォームよりご連絡ください。";
  visibility:visible;
  position:absolute;
  inset:0;
}
/* 入力欄 */
.post-password-form label{
  display:block;
  font-size:.76rem;
  letter-spacing:.14em;
  color:#7D766A;
  margin-bottom:.5rem;
}
.post-password-form input[type=password]{
  display:block;
  width:100% !important;
  max-width:100%;
  background:transparent;
  border:0;
  border-bottom:1px solid #DCD6C9;
  border-radius:0;
  font-family:'Zen Kaku Gothic New',sans-serif;
  font-size:1rem;
  letter-spacing:.2em;
  color:#33302B;
  padding:.55rem 0;
  margin-top:.4rem;
  -webkit-appearance:none;
  appearance:none;
  transition:border-color .45s;
}
.post-password-form input[type=password]:focus{
  outline:none;
  border-bottom-color:#243F5E;
}
/* ボタン */
.post-password-form input[type=submit]{
  display:inline-block;
  margin-top:1.5rem;
  background:#243F5E !important;
  color:#F6F4EE !important;
  font-family:'Zen Kaku Gothic New',sans-serif;
  font-weight:300;
  font-size:.8rem;
  letter-spacing:.14em;
  padding:.76em 1.75em;
  border:0 !important;
  border-radius:1.7em !important;
  box-shadow:none !important;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
  transition:background .45s, transform .45s;
}
.post-password-form input[type=submit]:hover{
  background:#33587F !important;
  transform:translateY(-1px);
}
@media (max-width:600px){
  .post-password-form > p:first-of-type{height:calc(2.05em * 5)}
}