/* =========================================================
   Web TERMS — site stylesheet
   白と藍。書類という題材をエディトリアルに、信頼感と清潔感を軸に扱う。
   （--shu はアクセントカラーの変数名。現在はブルー系）
   ========================================================= */
:root {
    --paper: #FFFFFF;
    --paper-2: #EEF4FB;
    --card: #F7FAFD;
    --ink: #0F2136;
    --ink-2: #35485E;
    --muted: #5D7186;
    --shu: #1D6FD1;
    --shu-deep: #14539F;
    --line: rgba(15, 33, 54, .14);
    --line-strong: rgba(15, 33, 54, .5);
    --serif: 'Zen Old Mincho', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
    --sans: 'Zen Kaku Gothic New', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
    --mono: 'JetBrains Mono', 'Menlo', monospace;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    overflow-x: hidden;
    background: var(--paper);
    /* 紙の質感（うっすらドット） */
    background-image: radial-gradient(rgba(29, 111, 209, .07) 1px, transparent 1px);
    background-size: 22px 22px;
    color: var(--ink);
    font-family: var(--sans);
    font-size: 15px;
    line-height: 1.9;
    -webkit-font-smoothing: antialiased;
}

::selection { background: var(--shu); color: #fff; }

a { color: inherit; }

button { font-family: inherit; }

.wt-wrap { position: relative; z-index: 1; }

.wt-wrap [hidden] { display: none !important; }

/* =========================
   Header
========================= */
.wt-header {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 28px;
    border-bottom: 1px solid transparent;
    transition: background .3s, border-color .3s, padding .3s;
}

.wt-header.scrolled {
    background: rgba(255, 255, 255, .96);
    border-bottom-color: var(--line);
    padding: 10px 28px;
}

.wt-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    font-family: var(--serif);
    font-weight: 900;
    font-size: 19px;
    letter-spacing: .06em;
}

.wt-logo .seal {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: var(--shu);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--serif);
    box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.35);
}

.wt-nav { display: flex; align-items: center; gap: 26px; }

.wt-nav a {
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .04em;
    position: relative;
}

.wt-nav a:not(.wt-cta)::after {
    content: "";
    position: absolute;
    left: 0; right: 100%;
    bottom: -3px;
    border-bottom: 1.5px solid var(--shu);
    transition: right .25s;
}

.wt-nav a:not(.wt-cta):hover::after { right: 0; }

.wt-cta {
    background: var(--ink);
    color: var(--paper);
    padding: 9px 20px;
    border-radius: 999px;
    font-weight: 700;
    transition: background .2s, transform .2s;
}

.wt-cta:hover { background: var(--shu); transform: translateY(-1px); }

@media (max-width: 720px) {
    .wt-nav a:not(.wt-cta) { display: none; }
}

/* =========================
   Hero
========================= */
.wt-hero {
    position: relative;
    max-width: 1160px;
    margin: 0 auto;
    padding: 168px 28px 72px;
    overflow: visible;
}

.wt-kicker {
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .22em;
    color: var(--shu);
    margin: 0 0 22px;
}

.wt-hero h1 {
    margin: 0 0 30px;
    font-family: var(--serif);
    font-weight: 900;
    font-size: clamp(40px, 7.2vw, 88px);
    line-height: 1.24;
    letter-spacing: .02em;
    max-width: 15em;
}

.wt-hero h1 .shu { color: var(--shu); }

.wt-hero-lead {
    max-width: 34em;
    font-size: 16px;
    line-height: 2.2;
    color: var(--ink-2);
    margin: 0 0 40px;
}

.wt-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }

.wt-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--ink);
    color: var(--paper);
    text-decoration: none;
    border: none;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .04em;
    padding: 16px 34px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .2s, transform .2s, box-shadow .2s;
}

.wt-btn-primary:hover {
    background: var(--shu);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(29, 111, 209, .28);
}

.wt-btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    padding: 15px 24px;
    border: 1.5px solid var(--line-strong);
    border-radius: 999px;
    transition: border-color .2s, color .2s, background .2s;
}

.wt-btn-ghost:hover { border-color: var(--shu); color: var(--shu); }

/* 縦書きの飾り */
.wt-hero-tate {
    position: absolute;
    top: 158px;
    right: 28px;
    writing-mode: vertical-rl;
    font-family: var(--serif);
    font-size: 13px;
    letter-spacing: .38em;
    color: var(--muted);
    border-left: 1px solid var(--line);
    padding-left: 16px;
    height: 420px;
    white-space: nowrap;
}

@media (max-width: 900px) { .wt-hero-tate { display: none; } }

/* 朱印 */
.wt-seal-big {
    position: absolute;
    top: 140px;
    right: 110px;
    width: 108px;
    height: 108px;
    transform: rotate(8deg);
    opacity: 0;
    animation: sealIn .5s cubic-bezier(.2, 1.6, .4, 1) .6s forwards;
}

@keyframes sealIn {
    0% { opacity: 0; transform: rotate(8deg) scale(2.1); }
    62% { opacity: 1; transform: rotate(8deg) scale(.94); }
    100% { opacity: .92; transform: rotate(8deg) scale(1); }
}

@media (max-width: 1050px) { .wt-seal-big { right: 80px; width: 88px; height: 88px; } }
@media (max-width: 900px) { .wt-seal-big { display: none; } }

/* 統計 */
.wt-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 56px;
    margin-top: 64px;
    padding-top: 30px;
    border-top: 1px solid var(--line-strong);
}

.wt-stats .n {
    font-family: var(--serif);
    font-weight: 900;
    font-size: 36px;
    line-height: 1.2;
}

.wt-stats .n small { font-size: 17px; font-weight: 700; margin-left: 2px; }

.wt-stats .l {
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: .14em;
    color: var(--muted);
}

/* =========================
   条文マーキー
========================= */
.wt-marquee {
    width: calc(100% - 8px);
    margin: 60px 4px 0;
    background: var(--ink);
    color: var(--paper);
    transform: rotate(-1.1deg);
    overflow: hidden;
    padding: 15px 0;
}

.wt-marquee-in { display: flex; width: max-content; animation: wtMarquee 26s linear infinite; }

.wt-marquee-row {
    display: flex;
    align-items: center;
    white-space: nowrap;
    font-family: var(--serif);
    font-size: 17px;
    letter-spacing: .2em;
}

.wt-marquee-row span { padding: 0 6px; }
.wt-marquee-row i { font-style: normal; color: var(--shu); padding: 0 6px; }

@keyframes wtMarquee { to { transform: translateX(-50%); } }

/* =========================
   セクション共通
========================= */
.wt-sec { max-width: 1160px; margin: 0 auto; padding: 104px 28px 0; }

.wt-sec-head { margin-bottom: 48px; }

.wt-sec-head .no {
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .22em;
    color: var(--shu);
    display: block;
    margin-bottom: 12px;
}

.wt-sec-head h2 {
    margin: 0;
    font-family: var(--serif);
    font-weight: 900;
    font-size: clamp(28px, 4.6vw, 46px);
    line-height: 1.4;
    letter-spacing: .03em;
}

.wt-sec-head .sub { margin: 16px 0 0; color: var(--muted); max-width: 40em; }

/* スクロール表示 */
.rv { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
.rv.in { opacity: 1; transform: none; }
.rv.d1 { transition-delay: .08s; }
.rv.d2 { transition-delay: .16s; }
.rv.d3 { transition-delay: .24s; }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .rv { opacity: 1; transform: none; transition: none; }
    .wt-marquee-in { animation: none; }
    .wt-seal-big { animation: none; opacity: .92; }
}

/* =========================
   特長
========================= */
.wt-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.wt-feature {
    background: var(--card);
    border: 1px solid var(--line);
    padding: 34px 30px 30px;
    position: relative;
    transition: transform .25s, box-shadow .25s;
}

.wt-feature:hover { transform: translateY(-5px); box-shadow: 0 16px 34px rgba(23, 19, 14, .09); }

.wt-feature .num {
    font-family: var(--serif);
    font-size: 15px;
    color: var(--shu);
    letter-spacing: .3em;
    display: block;
    margin-bottom: 16px;
}

.wt-feature h3 {
    margin: 0 0 12px;
    font-family: var(--serif);
    font-weight: 700;
    font-size: 20px;
    letter-spacing: .04em;
}

.wt-feature p { margin: 0; font-size: 14px; color: var(--ink-2); }

@media (max-width: 860px) { .wt-features { grid-template-columns: 1fr; } }

/* =========================
   エディター
========================= */
.wt-editor-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 40px;
    align-items: start;
}

@media (max-width: 980px) { .wt-editor-grid { grid-template-columns: 1fr; } }

.wt-steps { display: flex; flex-direction: column; gap: 44px; min-width: 0; }

.wt-step { border-top: 1px solid var(--line-strong); padding-top: 22px; }

.wt-step-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 20px; }

.wt-step-head .sno {
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .16em;
    color: var(--shu);
}

.wt-step-head h3 {
    margin: 0;
    font-family: var(--serif);
    font-weight: 700;
    font-size: 21px;
    line-height: 1.4;
    letter-spacing: .05em;
}

.wt-step-head .hint { font-size: 12px; color: var(--muted); margin-left: auto; }

/* 書類選択カード */
.wt-doc-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }

@media (max-width: 640px) { .wt-doc-cards { grid-template-columns: 1fr; } }

.wt-doc-card { position: relative; cursor: pointer; min-width: 0; }

.wt-doc-card input { position: absolute; opacity: 0; pointer-events: none; }

.wt-doc-card .box {
    display: flex;
    flex-direction: column;
    gap: 6px;
    height: 100%;
    background: var(--card);
    border: 1.5px solid var(--line);
    padding: 18px 16px 14px;
    min-height: 118px;
    transition: border-color .2s, background .2s, transform .2s;
}

.wt-doc-card:hover .box { transform: translateY(-2px); }

.wt-doc-card input:checked + .box {
    border-color: var(--ink);
    background: #fff;
    box-shadow: 4px 4px 0 var(--ink);
}

.wt-doc-card input:focus-visible + .box { outline: 2px solid var(--shu); outline-offset: 2px; }

.wt-doc-card .t { font-family: var(--serif); font-weight: 700; font-size: 15.5px; line-height: 1.45; letter-spacing: .02em; }

.wt-doc-card .d { font-size: 11.5px; color: var(--muted); line-height: 1.7; }

.wt-doc-card .mark {
    position: absolute;
    top: 10px; right: 10px;
    width: 22px; height: 22px;
    border-radius: 50%;
    border: 1.5px solid var(--line);
    display: grid;
    place-items: center;
    font-size: 12px;
    color: transparent;
    transition: all .2s;
}

.wt-doc-card input:checked + .box .mark {
    background: var(--shu);
    border-color: var(--shu);
    color: #fff;
}

/* フォーム */
.wt-form { display: flex; flex-direction: column; gap: 16px; }

.wt-fieldset {
    border: 1px solid var(--line);
    background: var(--card);
    padding: 22px 22px 18px;
    margin: 0;
}

.wt-fieldset legend {
    font-family: var(--serif);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: .08em;
    padding: 2px 12px;
    background: var(--ink);
    color: var(--paper);
}

.wt-fieldset[hidden] { display: none; }

.wt-row { display: flex; flex-direction: column; gap: 5px; margin-bottom: 14px; }

.wt-row:last-child { margin-bottom: 4px; }

.wt-row label { font-size: 12.5px; font-weight: 700; letter-spacing: .03em; }

.wt-row label .req { color: var(--shu); font-size: 11px; margin-left: 5px; }

.wt-row label .opt { color: var(--muted); font-weight: 400; font-size: 11px; margin-left: 5px; }

.wt-row input[type="text"],
.wt-row input[type="email"],
.wt-row input[type="url"],
.wt-row input[type="date"],
.wt-row select,
.wt-row textarea {
    width: 100%;
    font-family: inherit;
    font-size: 14px;
    color: var(--ink);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 0;
    padding: 10px 12px;
    transition: border-color .2s, box-shadow .2s;
    -webkit-appearance: none;
    appearance: none;
}

.wt-row select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2317130E' stroke-width='1.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 10px;
    padding-right: 32px;
}

.wt-row input:focus, .wt-row select:focus, .wt-row textarea:focus {
    outline: none;
    border-color: var(--shu);
    box-shadow: 0 0 0 3px rgba(29, 111, 209, .15);
}

.wt-row textarea { resize: vertical; min-height: 74px; line-height: 1.8; }

.wt-row .note { font-size: 11.5px; color: var(--muted); line-height: 1.7; }

.wt-cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }

@media (max-width: 560px) { .wt-cols2 { grid-template-columns: 1fr; } }

/* チェック（トグル風） */
.wt-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 9px 0;
    cursor: pointer;
    border-bottom: 1px dashed var(--line);
}

.wt-check:last-of-type { border-bottom: none; }

.wt-check input { position: absolute; opacity: 0; pointer-events: none; }

.wt-check .sq {
    flex: none;
    width: 19px; height: 19px;
    margin-top: 3px;
    border: 1.5px solid var(--line-strong);
    background: #fff;
    display: grid;
    place-items: center;
    transition: all .15s;
}

.wt-check .sq::after {
    content: "";
    width: 10px; height: 6px;
    border-left: 2.5px solid #fff;
    border-bottom: 2.5px solid #fff;
    transform: rotate(-45deg) translate(1px, -1px);
    opacity: 0;
}

.wt-check input:checked + .sq { background: var(--shu); border-color: var(--shu); }
.wt-check input:checked + .sq::after { opacity: 1; }
.wt-check input:focus-visible + .sq { outline: 2px solid var(--shu); outline-offset: 2px; }

.wt-check .ct { font-size: 13.5px; font-weight: 500; line-height: 1.7; }
.wt-check .cd { display: block; font-size: 11.5px; color: var(--muted); font-weight: 400; }

/* テーマ選択 */
/* minmax(0,1fr)＋min-width:0 が必須。
   1fr の最小は min-content のため、名前に white-space:nowrap があると
   トラックが押し広げられ、左カラムをはみ出して右カラムの下に潜り込む。 */
.wt-themes { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }

@media (max-width: 900px) { .wt-themes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .wt-themes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.wt-theme-card { position: relative; cursor: pointer; min-width: 0; }

.wt-theme-card input { position: absolute; opacity: 0; pointer-events: none; }

.wt-theme-card .box {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    border: 1.5px solid var(--line);
    background: var(--card);
    padding: 8px 8px 10px;
    transition: border-color .2s, transform .2s, box-shadow .2s;
}

.wt-theme-card:hover .box { transform: translateY(-3px); }

.wt-theme-card input:checked + .box {
    border-color: var(--ink);
    box-shadow: 4px 4px 0 var(--ink);
    background: #fff;
}

.wt-theme-card input:focus-visible + .box { outline: 2px solid var(--shu); outline-offset: 2px; }

/* ミニチュア書類 */
.wt-thumb {
    height: 92px;
    padding: 12px 10px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    overflow: hidden;
}

.wt-thumb i { display: block; border-radius: 1px; }

.wt-theme-card .tn {
    display: block;
    margin-top: 9px;
    padding: 0 3px;
    line-height: 1.6;
}

.wt-theme-card .tn b { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; }
.wt-theme-card .tn em { font-family: var(--serif); font-style: normal; font-size: 11.5px; font-weight: 700; margin-left: 5px; }
/* 折り返しを許す。nowrapにするとトラックが押し広げられて右カラムへ潜り込む */
.wt-theme-card .tn span { display: block; margin-top: 2px; font-size: 10.5px; line-height: 1.6; color: var(--muted); }

/* thumb: sumi */
.th-sumi { background: #fff; }
.th-sumi .bar { height: 7px; width: 46%; background: #1c1c1c; }
.th-sumi .rule { height: 1px; background: #1c1c1c; margin: 2px 0 3px; }
.th-sumi .ln { height: 3px; background: #d9d9d9; }
.th-sumi .ln.s { width: 72%; }

/* thumb: koten */
.th-koten { background: #faf7f0; align-items: center; }
.th-koten .bar { height: 7px; width: 42%; background: #221d17; }
.th-koten .rule { height: 3px; width: 100%; border-top: 1px solid #9d2f22; border-bottom: 1px solid #9d2f22; margin: 2px 0; }
.th-koten .ln { height: 3px; background: #ddd3c0; width: 100%; }
.th-koten .ln.s { width: 70%; }

/* thumb: mode */
.th-mode { background: #f4f5f8; }
.th-mode .card { background: #fff; border-radius: 4px; padding: 8px; flex: 1; display: flex; flex-direction: column; gap: 4px; box-shadow: 0 2px 6px rgba(0,0,0,.07); }
.th-mode .bar { height: 6px; width: 50%; background: #171a21; }
.th-mode .ln { height: 3px; background: #e2e5ee; }
.th-mode .ln.a { background: #3450e0; width: 34%; }

/* thumb: yoru */
.th-yoru { background: #101216; }
.th-yoru .bar { height: 7px; width: 46%; background: #f0f0f5; }
.th-yoru .ln { height: 3px; background: #2e3340; }
.th-yoru .ln.a { background: #9aa0ff; width: 30%; }

/* thumb: maru */
.th-maru { background: #FBFAF5; gap: 6px; }
.th-maru .pill { height: 9px; width: 34%; background: #3F8F6B; border-radius: 999px; }
.th-maru .bar { height: 7px; width: 52%; background: #2E332E; border-radius: 999px; }
.th-maru .ln { height: 4px; background: #DDE5DD; border-radius: 999px; }
.th-maru .ln.s { width: 68%; }

/* =========================
   プレビュー
========================= */
.wt-preview { position: sticky; top: 86px; min-width: 0; }

@media (max-width: 980px) { .wt-preview { position: static; } }

.wt-prev-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }

.wt-prev-tab {
    border: 1px solid var(--line-strong);
    background: transparent;
    color: var(--ink);
    font-size: 12.5px;
    font-weight: 600;
    padding: 7px 16px;
    border-radius: 999px;
    cursor: pointer;
    transition: all .18s;
}

.wt-prev-tab:hover { border-color: var(--shu); color: var(--shu); }

.wt-prev-tab.on { background: var(--ink); border-color: var(--ink); color: var(--paper); }

.wt-prev-window {
    background: var(--ink);
    padding: 10px 10px 12px;
    box-shadow: 0 24px 60px rgba(23, 19, 14, .22);
}

.wt-prev-bar { display: flex; gap: 6px; padding: 2px 4px 10px; align-items: center; }

.wt-prev-bar i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255, 255, 255, .3); }
.wt-prev-bar i:first-child { background: var(--shu); }

.wt-prev-bar .url {
    margin-left: 10px;
    font-family: var(--mono);
    font-size: 10px;
    color: rgba(255, 255, 255, .55);
    letter-spacing: .05em;
}

#wt-prev-frame {
    display: block;
    width: 100%;
    height: 560px;
    border: none;
    background: #fff;
}

@media (max-width: 980px) { #wt-prev-frame { height: 440px; } }

/* =========================
   ダウンロード
========================= */
.wt-dl {
    margin-top: 44px;
    border: 1.5px solid var(--ink);
    background: var(--card);
    padding: 34px 32px 30px;
    position: relative;
}

.wt-dl::before {
    content: "第四章　交付";
    position: absolute;
    top: -13px;
    left: 24px;
    background: var(--ink);
    color: var(--paper);
    font-family: var(--serif);
    font-size: 12.5px;
    letter-spacing: .2em;
    padding: 3px 14px;
}

.wt-dl-main { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }

.wt-dl-zip {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: var(--shu);
    color: #fff;
    border: none;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .05em;
    padding: 18px 38px;
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
    transition: background .2s, transform .2s, box-shadow .2s;
    overflow: visible;
}

.wt-dl-zip:hover:not(:disabled) {
    background: var(--shu-deep);
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(20, 83, 159, .35);
}

.wt-dl-zip:disabled { opacity: .4; cursor: not-allowed; }

.wt-dl-zip .zi { flex: none; font-family: var(--mono); font-size: 11px; opacity: .8; letter-spacing: .1em; }

/* 押印アニメーション */
.wt-dl-zip.stamped::after {
    content: "済";
    position: absolute;
    top: -16px; right: -14px;
    width: 44px; height: 44px;
    border: 2.5px solid var(--shu);
    border-radius: 50%;
    color: var(--shu);
    background: var(--paper);
    font-family: var(--serif);
    font-size: 19px;
    font-weight: 600;
    display: grid;
    place-items: center;
    transform: rotate(12deg);
    animation: stampPop .5s cubic-bezier(.2, 1.7, .4, 1) both;
}

@keyframes stampPop {
    0% { opacity: 0; transform: rotate(12deg) scale(2.4); }
    60% { opacity: 1; transform: rotate(12deg) scale(.9); }
    100% { opacity: 1; transform: rotate(12deg) scale(1); }
}

.wt-dl-note { font-size: 12.5px; color: var(--muted); margin: 0; }

.wt-dl-warn {
    margin: 16px 0 0;
    font-size: 12.5px;
    color: var(--shu-deep);
    background: rgba(29, 111, 209, .08);
    border-left: 3px solid var(--shu);
    padding: 10px 14px;
}

.wt-dl-singles {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px dashed var(--line);
    align-items: center;
}

.wt-dl-singles .lbl { font-size: 12px; color: var(--muted); margin-right: 6px; }

.wt-dl-single {
    border: 1px solid var(--line-strong);
    background: transparent;
    font-size: 12.5px;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: 999px;
    cursor: pointer;
    transition: all .18s;
}

.wt-dl-single:hover:not(:disabled) { border-color: var(--shu); color: var(--shu); }

.wt-dl-single:disabled { opacity: .4; cursor: not-allowed; }

.wt-reset {
    margin-left: auto;
    border: none;
    background: none;
    font-size: 12px;
    color: var(--muted);
    text-decoration: underline;
    cursor: pointer;
}

.wt-reset:hover { color: var(--shu); }

@media (max-width: 560px) {
    .wt-dl { padding: 34px 18px 26px; }
    .wt-dl-main { display: block; }
    .wt-dl-zip { width: 100%; justify-content: center; gap: 8px; padding: 16px 18px; font-size: 15px; }
    .wt-dl-note { margin-top: 14px; }
}

/* インラインの注意書き（フォーム内） */
.wt-inline-note {
    margin: 4px 0 0;
    font-size: 11.5px;
    line-height: 1.85;
    color: var(--ink-2);
    background: rgba(29, 111, 209, .07);
    border-left: 3px solid var(--shu);
    padding: 10px 13px;
}

.wt-inline-note strong { font-weight: 700; }

/* =========================
   公開前の確認モーダル
========================= */
.wt-modal {
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    background: var(--card);
    color: var(--ink);
    padding: 0;
    width: calc(100% - 36px);
    max-width: 560px;
    max-height: calc(100vh - 56px);
    overflow: auto;
    box-shadow: 0 30px 70px rgba(15, 33, 54, .28);
    /* ふわっと */
    opacity: 0;
    transform: translateY(14px) scale(.985);
    transition: opacity .26s ease, transform .32s cubic-bezier(.2, .8, .3, 1);
}

.wt-modal.in { opacity: 1; transform: none; }

.wt-modal:focus { outline: none; }

.wt-modal::backdrop {
    background: rgba(15, 33, 54, 0);
    transition: background .28s ease;
}

.wt-modal.in::backdrop { background: rgba(15, 33, 54, .44); }

.wt-modal-body { padding: 32px 34px 26px; }

.wt-modal-eyebrow {
    margin: 0 0 12px;
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .2em;
    color: var(--shu);
}

.wt-modal-title {
    margin: 0 0 14px;
    font-family: var(--serif);
    font-weight: 900;
    font-size: 25px;
    line-height: 1.45;
    letter-spacing: .04em;
}

.wt-modal-lead {
    margin: 0 0 22px;
    font-size: 13.5px;
    line-height: 2;
    color: var(--ink-2);
}

.wt-modal-list {
    list-style: none;
    margin: 0 0 26px;
    padding: 0;
    border-top: 1px solid var(--line);
}

.wt-modal-list li {
    border-bottom: 1px solid var(--line);
    padding: 14px 2px 14px 30px;
    position: relative;
}

.wt-modal-list li::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 20px;
    width: 11px;
    height: 6px;
    border-left: 2px solid var(--shu);
    border-bottom: 2px solid var(--shu);
    transform: rotate(-45deg);
}

.wt-modal-list li.warn::before {
    width: 14px;
    height: 14px;
    top: 17px;
    left: 2px;
    border: none;
    border-radius: 50%;
    background: var(--shu);
    transform: none;
}

.wt-modal-list .it {
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.7;
}

.wt-modal-list li.warn .it { color: var(--shu-deep); }

.wt-modal-list .id {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.9;
    color: var(--muted);
}

.wt-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
    align-items: center;
}

.wt-modal-cancel {
    border: none;
    background: none;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
    padding: 12px 14px;
    cursor: pointer;
    border-radius: 999px;
    transition: color .18s;
}

.wt-modal-cancel:hover { color: var(--ink); }

.wt-modal-ok {
    border: none;
    background: var(--shu);
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .03em;
    padding: 14px 28px;
    border-radius: 999px;
    cursor: pointer;
    transition: background .2s, transform .2s, box-shadow .2s;
}

.wt-modal-ok:hover {
    background: var(--shu-deep);
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(20, 83, 159, .3);
}

@media (max-width: 560px) {
    .wt-modal-body { padding: 26px 20px 20px; }
    .wt-modal-title { font-size: 21px; }
    .wt-modal-actions { justify-content: space-between; flex-wrap: nowrap; }
    .wt-modal-cancel { flex: none; padding-left: 4px; }
    .wt-modal-ok { flex: 1; padding-left: 12px; padding-right: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    .wt-modal { transition: none; opacity: 1; transform: none; }
    .wt-modal::backdrop { transition: none; }
    .wt-modal-ok:hover { transform: none; }
}

/* =========================
   ご利用にあたって・FAQ
========================= */
.wt-terms-box {
    border: 1px solid var(--line);
    background: var(--card);
    padding: 36px 36px 30px;
}

.wt-terms-box h3 {
    margin: 26px 0 10px;
    font-family: var(--serif);
    font-size: 16.5px;
    font-weight: 700;
    letter-spacing: .05em;
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.wt-terms-box h3:first-child { margin-top: 0; }

.wt-terms-box h3 .a { color: var(--shu); font-size: 13px; }

.wt-terms-box p, .wt-terms-box li { font-size: 13.5px; color: var(--ink-2); line-height: 2.1; }

.wt-terms-box ul { padding-left: 1.4em; margin: 0; }

.wt-faq { display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--line-strong); }

.wt-faq details { border-bottom: 1px solid var(--line); }

.wt-faq summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: baseline;
    gap: 16px;
    padding: 22px 8px;
    font-family: var(--serif);
    font-weight: 700;
    font-size: 16px;
    letter-spacing: .03em;
    transition: color .2s;
}

.wt-faq summary::-webkit-details-marker { display: none; }

.wt-faq summary:hover { color: var(--shu); }

.wt-faq summary .q { font-family: var(--mono); font-size: 12px; color: var(--shu); flex: none; }

.wt-faq summary .tg { margin-left: auto; font-size: 18px; font-weight: 400; transition: transform .25s; }

.wt-faq details[open] summary .tg { transform: rotate(45deg); }

.wt-faq .ans { padding: 0 8px 24px 52px; font-size: 13.5px; color: var(--ink-2); }

.wt-faq .ans p { margin: 0; }

@media (max-width: 560px) {
    .wt-terms-box { padding: 26px 20px 22px; }
    .wt-faq .ans { padding-left: 8px; }
}

/* =========================
   Footer
========================= */
.wt-footer {
    margin-top: 120px;
    background: var(--ink);
    color: var(--paper);
    padding: 64px 28px 40px;
}

.wt-footer-in { max-width: 1160px; margin: 0 auto; }

.wt-footer-brand {
    font-family: var(--serif);
    font-weight: 900;
    font-size: 26px;
    letter-spacing: .06em;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.wt-footer-brand .seal {
    width: 30px; height: 30px;
    border-radius: 50%;
    background: var(--shu);
    display: grid;
    place-items: center;
    font-size: 15px;
    font-weight: 600;
    box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.35);
}

.wt-footer-note { font-size: 12.5px; color: rgba(255, 255, 255, .6); margin: 0 0 34px; }

.wt-footer-links {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 28px;
    padding: 0;
    margin: 0 0 40px;
}

.wt-footer-links a {
    color: var(--paper);
    text-decoration: none;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.wt-footer-links a:hover { color: #9CC9F5; }

.wt-footer-links .ext { width: 12px; height: 12px; }

.wt-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, .18);
    padding-top: 22px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    font-size: 11.5px;
    color: rgba(255, 255, 255, .55);
}