@charset "UTF-8";
/* ============================================================
   しめ縄カテゴリページ 2026年改修版（A案・診断先出し型）
   設置先: wp-content/themes/testfolder/assets/shimenawa-2026.css
   読込  : category-shimenawa.php 内で <link> 直書き（テーマの作法に合わせている）
   ------------------------------------------------------------
   ・A案 index.html の <style> 全文を、すべて .nt-shimenawa 配下へ
     スコープ化したもの。テーマ style.css より後に読み込まれる前提。
   ・ヘッダー / フッター / nav.topNavi のCSSには一切触れていない。
   ・削除したもの: 比較用ページの上部バー2クラス（本番では使わない）と、
     footer 系（get_footer() と重複するため）。
   ============================================================ */


/* ============================================================
   0. 変数とベース（A案の :root / html / body をここへ集約）
   ============================================================ */
.nt-shimenawa {
    /* --- A案の :root 変数 19個 --- */
    --ai: #093753;
    --ai-d: #093753;
    --ai-m: #0b4d9d;
    --ao: #0b4d9d;
    --ao-l: #186ad2;
    --nari: #fff;
    --nari-2: #f7f7f7;
    --wara: #c9a24a;
    --wara-d: #8a6d2e;
    --gray-b: #ddd;
    --moji: #333;
    --moji-l: #666;
    --keisen: #ddd;
    --line-g: #06c755;
    --draft: #fff8e6;
    --draft-line: #c9a24a;
    --ph-bg: #f7f7f7;
    --ph-line: #ccc;
    --ph-txt: #666;
    --shadow: none;

    /* --- A案の body 指定をこのブロックへ --- */
    margin: 0;
    background: var(--nari);
    color: var(--moji);
    font-family: "Sawarabi Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
    font-size: 17px;
    line-height: 1.9;
    -webkit-text-size-adjust: 100%;

    /* A案の html{scroll-behavior:smooth} 相当。
       実際のスクロール主体は html 要素なので、ページ全体を
       スムーススクロールさせたい場合はテーマ側に
       html{scroll-behavior:smooth} を1行足す（README「要確認」参照）。 */
    scroll-behavior: smooth;
}

/* A案の *{box-sizing:border-box} 相当 */
.nt-shimenawa * {
    box-sizing: border-box;
}


/* ============================================================
   1. テーマ style.css の打ち消し
      （Eric Meyer系リセット＋グローバル指定のうち、
        A案の見た目が崩れるものだけを最小限で戻す）
   ============================================================ */

/* style.css:809 h2{text-align:center;background:#093753;width:100%;
   float:left;height:70px;line-height:70px} が全 h2 に当たるため、
   A案が指定していないプロパティだけを戻す */
.nt-shimenawa h2 {
    background: transparent;
    float: none;
    width: auto;
    height: auto;
    text-align: left;
}

/* style.css:95 p{line-height:210%;font-size:1.0625rem} と
   style.css:85 p,a,h1〜h5{color:#464646} が全 p に当たるため、
   A案どおり親からの継承に戻す。
   ※ style.css:842 p:nth-last-child(1){margin:0} も同詳細度だが、
     本ファイルが後に読まれるので下の margin 指定が勝つ */
.nt-shimenawa p {
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

/* リセットの font-weight:inherit で h4 の太字が消えるため戻す
   （h1〜h3 は下の .mincho グループで 700 を指定済み） */
.nt-shimenawa h4 {
    font-weight: 700;
}

/* リセットの a{text-decoration:none} で本文中のリンクが
   ただの色違いになるため、段落内リンクだけ下線を戻す */
.nt-shimenawa p a {
    text-decoration: underline;
}


/* ============================================================
   2. A案本体（共通パーツ）
   ============================================================ */
.nt-shimenawa .mincho,
.nt-shimenawa h1,
.nt-shimenawa h2,
.nt-shimenawa h3,
.nt-shimenawa .tel-num {
    font-family: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
    font-weight: 700;
}

.nt-shimenawa a {
    color: var(--ao-l);
}

.nt-shimenawa .wrap {
    max-width: 980px;
    margin: 0 auto;
    padding: 0 18px;
}

.nt-shimenawa section {
    padding: 42px 0;
}

.nt-shimenawa h2 {
    font-size: 25px;
    line-height: 1.55;
    margin: 0 0 10px;
    font-weight: 700;
    color: var(--ai);
}

.nt-shimenawa h3 {
    font-size: 19px;
    line-height: 1.6;
    margin: 26px 0 8px;
    color: var(--ai);
    font-weight: 700;
}

.nt-shimenawa h4 {
    font-size: 16.5px;
    margin: 18px 0 6px;
    color: var(--ai);
}

.nt-shimenawa p {
    margin: 0 0 14px;
}

.nt-shimenawa .lead {
    color: var(--moji-l);
    font-size: 16px;
    margin-bottom: 20px;
}

.nt-shimenawa .note {
    font-size: 13.5px;
    color: var(--moji-l);
    line-height: 1.75;
}

.nt-shimenawa .hr-nawa {
    height: 3px;
    margin: 0;
    border: 0;
    background: var(--ai);
}

/* 写真枠。テーマ style.css:1167 の .photo{display:flex} と衝突するため
   .photo → .nt-photo に改名している（README のクラス対応表を参照） */
.nt-shimenawa .nt-photo {
    overflow: hidden;
    border: 1px solid var(--keisen);
    background: var(--nari-2);
    margin: 0 0 10px;
}

.nt-shimenawa .nt-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nt-shimenawa .nt-photo-43 {
    aspect-ratio: 4/3;
}

.nt-shimenawa .nt-photo-169 {
    aspect-ratio: 16/9;
}

/* プレースホルダ共通 */
.nt-shimenawa .ph-box {
    background: var(--ph-bg);
    border: 1px dashed var(--ph-line);
    border-radius: 3px;
    color: var(--ph-txt);
    padding: 18px 14px;
    text-align: center;
    margin: 0 0 10px;
}

.nt-shimenawa .ph-box .ph-t {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 4px;
}

.nt-shimenawa .ph-box .ph-s {
    font-size: 13px;
    margin: 0;
    opacity: .9;
}

.nt-shimenawa .ph-16x9 {
    aspect-ratio: 16/9;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.nt-shimenawa .ph-4x3 {
    aspect-ratio: 4/3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

/* ボタン・電話 */
.nt-shimenawa .tel-block {
    background: #fff;
    border: 2px solid var(--ai);
    border-radius: 3px;
    padding: 18px;
    text-align: center;
    box-shadow: var(--shadow);
}

.nt-shimenawa .tel-lead {
    font-size: 15px;
    color: var(--ai);
    font-weight: 700;
    margin: 0 0 6px;
}

.nt-shimenawa a.tel-num {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 34px;
    font-weight: 700;
    color: var(--ai);
    text-decoration: none;
    letter-spacing: .02em;
    line-height: 1.25;
    margin: 2px 0 4px;
}

.nt-shimenawa a.tel-num svg {
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
}

.nt-shimenawa .tel-hours {
    font-size: 14.5px;
    color: var(--moji-l);
    margin: 0;
}

.nt-shimenawa .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 60px;
    padding: 14px 22px;
    border-radius: 3px;
    font-size: 17.5px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    border: 2px solid transparent;
    line-height: 1.5;
    text-align: center;
    font-family: inherit;
}

.nt-shimenawa .btn-tel {
    background: var(--ai);
    color: #fff;
    width: 100%;
}

.nt-shimenawa .btn-tel .num {
    font-family: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
    font-size: 21px;
}

.nt-shimenawa .btn-line {
    background: var(--line-g);
    color: #fff;
    width: 100%;
}

.nt-shimenawa .btn-mail {
    background: #fff;
    color: var(--ai);
    border-color: var(--ai);
    width: 100%;
}

.nt-shimenawa .btn-outline {
    background: #fff;
    color: var(--ai);
    border-color: var(--ai);
    width: 100%;
}

.nt-shimenawa .btn-shindan {
    background: var(--ao);
    color: #fff;
    width: 100%;
}

.nt-shimenawa .btn-ghost {
    background: #fff;
    color: var(--ai);
    border-color: var(--keisen);
    font-size: 15px;
    min-height: 48px;
    padding: 10px 18px;
    font-weight: 600;
}

.nt-shimenawa .btn3 {
    display: grid;
    gap: 10px;
}

.nt-shimenawa .cta-inline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    /* 折り返したときにボタンが左端へ寄らないよう中央に置く（スマホ） */
    justify-content: center;
    gap: 10px 16px;
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 12px 14px;
    margin: 16px 0 0;
}

.nt-shimenawa .cta-inline .msg {
    font-size: 15.5px;
    font-weight: 700;
    color: var(--ai);
    margin: 0;
    text-align: center;
    flex: 1 1 240px;
}

.nt-shimenawa .cta-inline a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 8px 16px;
    background: var(--ai);
    color: #fff;
    text-decoration: none;
    border-radius: 2px;
    font-weight: 700;
    font-size: 16px;
}

.nt-shimenawa .cta-inline a .n {
    font-family: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
    font-size: 19px;
}

.nt-shimenawa .cta-inline svg {
    width: 18px;
    height: 18px;
}


/* ============================================================
   3. S0 ファーストビュー
      ※ A案では <header class="fv"> だったが、テーマの common.js が
        スクロール時に全 <header> へ .move を付け、
        style.css:732 header.move{margin:0 0 140px 0} が効いてしまうため、
        <div class="fv"> に変更している（README「変更点」参照）。
   ============================================================ */
.nt-shimenawa .fv {
    background: linear-gradient(180deg, #fff, var(--nari-2));
    border-bottom: 1px solid var(--keisen);
    padding: 26px 0 34px;
}

.nt-shimenawa .fv .kamon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    color: var(--ai-m);
    letter-spacing: .08em;
    margin-bottom: 10px;
}

.nt-shimenawa .fv h1 {
    font-size: 27px;
    line-height: 1.55;
    font-weight: 700;
    color: var(--ai);
    margin: 0 0 10px;
}

.nt-shimenawa .fv h1 .small {
    display: block;
    font-size: 18px;
    margin-bottom: 6px;
    color: var(--moji);
}

.nt-shimenawa .fv-sub {
    font-size: 16px;
    color: var(--moji-l);
    margin: 0 0 16px;
}

.nt-shimenawa .fv-grid {
    display: grid;
    gap: 18px;
}

.nt-shimenawa .three {
    display: grid;
    gap: 8px;
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.nt-shimenawa .three li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 15.5px;
    font-weight: 700;
    color: var(--ai);
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 2px;
    padding: 8px 10px;
    line-height: 1.6;
}

.nt-shimenawa .three li svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    margin-top: 4px;
    color: var(--ai);
}

.nt-shimenawa .fv-cta {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.nt-shimenawa .fv-cta .cta-cap {
    font-size: 15px;
    color: var(--moji-l);
    margin: 0;
    text-align: center;
}


/* ============================================================
   4. 画面下の固定バー
   ============================================================ */
.nt-shimenawa .sticky-tel {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    background: var(--ai);
    padding: 8px 12px;
    display: flex;
    gap: 8px;
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, .25);
}

.nt-shimenawa .sticky-tel a {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 52px;
    border-radius: 3px;
    text-decoration: none;
    font-weight: 700;
    font-size: 16px;
}

.nt-shimenawa .sticky-tel .s-tel {
    background: #fff;
    color: var(--ai);
}

.nt-shimenawa .sticky-tel .s-txt {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.3;
}

.nt-shimenawa .sticky-tel .s-main {
    font-size: 16px;
    font-weight: 700;
}

/* 電話で何が分かるかを1行添える（2026-09-10 宮内の指示） */
.nt-shimenawa .sticky-tel .s-sub {
    font-size: 11.5px;
    font-weight: 400;
    opacity: .85;
}

.nt-shimenawa .sticky-tel .s-tel .n {
    font-family: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
    font-size: 18px;
}

.nt-shimenawa .sticky-tel .s-line {
    background: var(--line-g);
    color: #fff;
    flex: 0 0 88px;
}

.nt-shimenawa .sticky-tel svg {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
}


/* ============================================================
   5. S1 かんたん診断
   ============================================================ */
.nt-shimenawa .dx-sec {
    background: #fff;
    border-top: 1px solid var(--keisen);
    border-bottom: 1px solid var(--keisen);
}

.nt-shimenawa .dx {
    background: var(--nari);
    border: 2px solid var(--ai);
    border-radius: 3px;
    overflow: hidden;
    box-shadow: var(--shadow);
}

.nt-shimenawa .dx-head {
    background: var(--ai);
    color: #fff;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.nt-shimenawa .dx-head .t {
    font-size: 16px;
    font-weight: 700;
    margin: 0;
}

.nt-shimenawa .dx-head .s {
    font-size: 13px;
    opacity: .85;
    margin: 0;
}

.nt-shimenawa .dx-bar {
    height: 6px;
    background: var(--nari-2);
}

.nt-shimenawa .dx-bar > i {
    display: block;
    height: 100%;
    background: var(--ai);
    width: 25%;
    transition: width .3s;
}

.nt-shimenawa .dx-body {
    padding: 20px 16px 22px;
}

.nt-shimenawa .dx-q {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.55;
    margin: 0 0 4px;
    color: var(--ai);
    font-family: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.nt-shimenawa .dx-help {
    font-size: 14.5px;
    color: var(--moji-l);
    margin: 0 0 16px;
}

.nt-shimenawa .dx-choices {
    display: grid;
    gap: 10px;
}

.nt-shimenawa .dx-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    text-align: left;
    min-height: 64px;
    padding: 12px 14px;
    font-size: 17px;
    line-height: 1.6;
    background: #fff;
    border: 2px solid var(--keisen);
    border-radius: 3px;
    color: var(--moji);
    cursor: pointer;
    font-family: inherit;
    font-weight: 700;
}

.nt-shimenawa .dx-btn:hover,
.nt-shimenawa .dx-btn:focus {
    border-color: var(--ao);
    background: var(--nari-2);
    outline: none;
}

/* 旧 style="border-color:var(--ao)" をクラス化したもの */
.nt-shimenawa .dx-btn.is-primary {
    border-color: var(--ao);
}

.nt-shimenawa .dx-btn .txt {
    flex: 1 1 auto;
}

.nt-shimenawa .dx-btn .txt small {
    display: block;
    font-size: 13.5px;
    font-weight: 400;
    color: var(--moji-l);
    line-height: 1.6;
}

.nt-shimenawa .dx-btn .arw {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    color: var(--gray-b);
}

/* 診断結果のボタンの下に置く補足（2026-09-10 宮内の指示） */
.nt-shimenawa .dx-cta-note {
    font-size: 13px;
    line-height: 1.7;
    color: var(--moji-l);
    text-align: center;
    margin: 8px 0 0;
}

.nt-shimenawa .dx-foot {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px dashed var(--keisen);
}

.nt-shimenawa .dx-screen[hidden] {
    display: none;
}

.nt-shimenawa .dx-result-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 12px;
    font-size: 20px;
    font-weight: 700;
    color: var(--ai);
    font-family: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.nt-shimenawa .dx-result-head svg {
    width: 26px;
    height: 26px;
    flex: 0 0 auto;
}

.nt-shimenawa .rec {
    display: grid;
    gap: 12px;
    background: #fff;
    border: 1px solid var(--ai);
    border-radius: 3px;
    padding: 14px;
    margin: 0 0 14px;
}

.nt-shimenawa .rec .ph-box {
    margin: 0;
}

.nt-shimenawa .rec .rec-name {
    font-size: 19px;
    font-weight: 700;
    color: var(--ai);
    margin: 0 0 4px;
    font-family: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
}

.nt-shimenawa .rec .rec-size {
    font-size: 15px;
    margin: 0 0 6px;
}

.nt-shimenawa .rec .rec-size b {
    color: var(--ai);
}

.nt-shimenawa .tag {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    border-radius: 3px;
    padding: 2px 8px;
    margin-right: 6px;
}

.nt-shimenawa .tag-t {
    background: var(--wara-d);
    color: #fff;
}

.nt-shimenawa .tag-h {
    background: var(--ao);
    color: #fff;
}

.nt-shimenawa .summary-card {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 12px 14px;
    margin-bottom: 14px;
}

.nt-shimenawa .summary-card dl {
    margin: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 5px 14px;
    font-size: 15.5px;
}

.nt-shimenawa .summary-card dt {
    color: var(--moji-l);
    font-size: 14px;
    white-space: nowrap;
    padding-top: 2px;
}

.nt-shimenawa .summary-card dd {
    margin: 0;
    font-weight: 700;
    color: var(--ai);
}

.nt-shimenawa .dx-msg {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 12px 14px;
    font-size: 16px;
    line-height: 1.8;
    margin: 0 0 14px;
}

.nt-shimenawa .dx-msg b {
    color: var(--ai);
}

.nt-shimenawa .steps {
    counter-reset: st;
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
}

.nt-shimenawa .steps li {
    counter-increment: st;
    position: relative;
    padding: 0 0 0 44px;
    margin-bottom: 14px;
    font-size: 16px;
    line-height: 1.8;
}

.nt-shimenawa .steps li::before {
    content: counter(st);
    position: absolute;
    left: 0;
    top: 2px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--ai);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 700;
}

.nt-shimenawa .steps li b {
    display: block;
    color: var(--ai);
}

.nt-shimenawa .steps li span {
    font-size: 14.5px;
    color: var(--moji-l);
}


/* ============================================================
   6. S2 お悩み
   ============================================================ */
.nt-shimenawa .nayami {
    display: grid;
    gap: 10px;
    margin: 0 0 6px;
    padding: 0;
    list-style: none;
}

.nt-shimenawa .nayami li {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 12px 14px;
    font-size: 16.5px;
    line-height: 1.75;
    font-weight: 700;
    color: var(--ai);
}

.nt-shimenawa .nayami li span {
    display: block;
    font-size: 14px;
    font-weight: 400;
    color: var(--moji-l);
    line-height: 1.7;
    margin-top: 2px;
}


/* ============================================================
   7. S3 失敗させない理由
   ============================================================ */
.nt-shimenawa .riyu {
    display: grid;
    gap: 14px;
}

.nt-shimenawa .riyu .item {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 16px;
    box-shadow: var(--shadow);
    /* 本文の長さが違っても、下の濃紺の帯を3枚とも同じ高さに揃える */
    display: flex;
    flex-direction: column;
}

.nt-shimenawa .riyu .item h3 {
    margin: 0 0 6px;
    font-size: 18px;
}

.nt-shimenawa .riyu .item p {
    font-size: 15px;
    margin: 0 0 8px;
}

.nt-shimenawa .riyu .item .kekka {
    font-size: 14.5px;
    color: #fff;
    background: var(--ai-m);
    border-radius: 2px;
    padding: 7px 10px;
    /* 上だけ auto にして、本文が短いカードでも帯を下端へ落とす */
    margin: auto 0 0;
    line-height: 1.7;
    font-weight: 700;
}

.nt-shimenawa .jisseki-line {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

.nt-shimenawa .jisseki-line li {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 5px 14px;
    font-size: 14px;
    color: var(--ai);
    font-weight: 700;
}


/* ============================================================
   8. S4 種類カード・表
   ============================================================ */
.nt-shimenawa .cards {
    display: grid;
    /* auto-fill だとカードが2枚のとき3列目の枠が残り、右が空いて見える */
    grid-template-columns: repeat(auto-fit, minmax(268px, 1fr));
    gap: 16px;
}

.nt-shimenawa .card {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow);
}

.nt-shimenawa .card .cph {
    padding: 10px;
    background: #fff;
    border-bottom: 1px solid var(--keisen);
}

.nt-shimenawa .card .cph .ph-box {
    margin: 0;
    background: var(--ph-bg);
}

.nt-shimenawa .card .cbody {
    padding: 14px 15px 16px;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.nt-shimenawa .card h3 {
    margin: 0 0 3px;
    font-size: 18px;
}

.nt-shimenawa .card .alias {
    font-size: 13px;
    color: var(--moji-l);
    margin: 0 0 8px;
}

.nt-shimenawa .card .alias b {
    color: var(--ai);
}

.nt-shimenawa .card p.d {
    font-size: 15px;
    margin: 0 0 10px;
    line-height: 1.8;
}

.nt-shimenawa .card .spec {
    font-size: 13.5px;
    color: var(--ai);
    background: var(--draft);
    border-radius: 2px;
    padding: 6px 9px;
    margin: 0 0 10px;
    line-height: 1.65;
}

.nt-shimenawa .card details {
    margin-top: auto;
    border-top: 1px dashed var(--keisen);
    padding-top: 8px;
}

.nt-shimenawa .card summary {
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
    color: var(--ai);
    list-style: none;
    padding: 4px 0;
}

.nt-shimenawa .card summary::-webkit-details-marker {
    display: none;
}

.nt-shimenawa .card summary::before {
    content: "＋ ";
    color: var(--wara-d);
}

.nt-shimenawa .card details[open] summary::before {
    content: "− ";
}

.nt-shimenawa .card details .dd {
    font-size: 14px;
    color: var(--moji-l);
    line-height: 1.8;
    padding: 4px 0 2px;
}

.nt-shimenawa table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
    background: #fff;
    margin: 6px 0 10px;
}

.nt-shimenawa th,
.nt-shimenawa td {
    border: 1px solid var(--keisen);
    padding: 10px 12px;
    text-align: left;
    vertical-align: top;
    line-height: 1.75;
}

.nt-shimenawa th {
    background: var(--nari-2);
    font-weight: 700;
    color: var(--ai);
    white-space: nowrap;
}

/* 画面が狭いと列が潰れ、語の途中や括弧の内側で改行されてしまう。
   最小幅を与え、足りない分は .table-scroll の横スクロールに逃がす */
.nt-shimenawa .table-scroll table {
    min-width: 540px;
}

/* 「垂（たれ）」の括弧が「垂（た／れ）」と割れないようにする。
   かたまりの前では改行できるので、括弧ごと次の行に送られる */
.nt-shimenawa .nt-nw {
    display: inline-block;
}

.nt-shimenawa td b {
    color: var(--ai);
}

.nt-shimenawa .table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.nt-shimenawa .shime {
    color: #cc0000;
}


/* ============================================================
   9. S5・S6 ブロック / チェックリスト / フロー
   ============================================================ */
.nt-shimenawa .block {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 20px 18px;
    margin-bottom: 20px;
}

.nt-shimenawa .block > h3:first-child {
    margin-top: 0;
}

.nt-shimenawa .checklist {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
}

.nt-shimenawa .checklist li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 12px;
    font-size: 16px;
    line-height: 1.8;
}

.nt-shimenawa .checklist li::before {
    content: "";
    position: absolute;
    left: 4px;
    top: .6em;
    width: 8px;
    height: 8px;
    background: var(--ai);
}

.nt-shimenawa .checklist li b {
    display: block;
    color: var(--ai);
}

.nt-shimenawa .checklist li span {
    font-size: 14.5px;
    color: var(--moji-l);
}

.nt-shimenawa .memo-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.nt-shimenawa .memo-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 10px 12px;
    margin-bottom: 8px;
    font-size: 16px;
    line-height: 1.7;
}

.nt-shimenawa .memo-list li .box {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border: 2px solid var(--ai);
    border-radius: 3px;
    margin-top: 4px;
}

.nt-shimenawa .flow {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: fl;
}

.nt-shimenawa .flow li {
    counter-increment: fl;
    position: relative;
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 14px 14px 14px 58px;
    margin-bottom: 10px;
}

.nt-shimenawa .flow li::before {
    content: counter(fl);
    position: absolute;
    left: 14px;
    top: 14px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--ai);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
}

.nt-shimenawa .flow li b {
    display: block;
    font-size: 17px;
    color: var(--ai);
    margin-bottom: 2px;
}

.nt-shimenawa .flow li .days {
    display: inline-block;
    font-size: 13px;
    background: var(--nari-2);
    border-radius: 3px;
    padding: 2px 8px;
    margin-left: 6px;
    color: var(--moji-l);
}

.nt-shimenawa .flow li p {
    font-size: 14.5px;
    margin: 2px 0 0;
    color: var(--moji-l);
    line-height: 1.75;
}


/* ============================================================
   10. S9 納品実績（フィルタ）
   ============================================================ */
.nt-shimenawa .filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 16px;
    padding: 0;
}

.nt-shimenawa .filter button {
    background: #fff;
    border: 2px solid var(--keisen);
    border-radius: 3px;
    padding: 8px 16px;
    font-size: 15px;
    font-weight: 700;
    color: var(--ai);
    cursor: pointer;
    font-family: inherit;
    min-height: 46px;
}

.nt-shimenawa .filter button.on {
    background: var(--ai);
    color: #fff;
    border-color: var(--ai);
}

.nt-shimenawa .jlist {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 14px;
}

.nt-shimenawa .jcard {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    overflow: hidden;
    box-shadow: var(--shadow);
}

.nt-shimenawa .jcard[hidden] {
    display: none;
}

.nt-shimenawa .jcard .jph {
    padding: 8px;
    background: #fff;
    border-bottom: 1px solid var(--keisen);
}

.nt-shimenawa .jcard .jph .ph-box {
    margin: 0;
    background: var(--ph-bg);
    padding: 10px;
}

.nt-shimenawa .jcard .jb {
    padding: 12px 13px 14px;
}

.nt-shimenawa .jcard h4 {
    margin: 0 0 4px;
    font-size: 16px;
    color: var(--ai);
}

.nt-shimenawa .jcard p {
    font-size: 14px;
    margin: 0 0 8px;
    line-height: 1.7;
    color: var(--moji-l);
}

.nt-shimenawa .jcard .jspec {
    font-size: 13px;
    color: var(--ai);
    background: var(--draft);
    border-radius: 2px;
    padding: 5px 8px;
    margin: 0;
    line-height: 1.6;
}


/* ============================================================
   11. S10 よくあるご質問
   ============================================================ */
.nt-shimenawa .faq details {
    background: #fff;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    margin-bottom: 10px;
}

.nt-shimenawa .faq summary {
    cursor: pointer;
    list-style: none;
    padding: 14px 16px;
    font-size: 16.5px;
    font-weight: 700;
    color: var(--ai);
    display: flex;
    gap: 10px;
    align-items: flex-start;
    line-height: 1.7;
}

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

.nt-shimenawa .faq summary .qm {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--ai);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.nt-shimenawa .faq .a {
    padding: 0 16px 16px 52px;
    font-size: 15.5px;
    line-height: 1.85;
}

.nt-shimenawa .faq .a .kari {
    display: inline-block;
    font-size: 12px;
    background: var(--nari-2);
    color: #666;
    border: 1px solid var(--keisen);
    border-radius: 3px;
    padding: 1px 8px;
    margin-bottom: 6px;
}


/* ============================================================
   12. S11 クロージング
   ============================================================ */
.nt-shimenawa .closing {
    background: var(--ai);
    color: #fff;
}

.nt-shimenawa .closing h2 {
    color: #fff;
}

/* 旧 <h3 style="color:#fff"> をクラス化せずセレクタで吸収 */
.nt-shimenawa .closing h3 {
    color: #fff;
}

.nt-shimenawa .closing .lead {
    color: rgba(255, 255, 255, .88);
}

.nt-shimenawa .closing-grid {
    display: grid;
    gap: 14px;
}

/* ============================================================
   13. インラインstyle をクラス化したもの（A案 style="" の置き換え）
   ============================================================ */
.nt-shimenawa .nt-bg-2 {
    background: var(--nari-2);
}

.nt-shimenawa .nt-m0 {
    margin: 0;
}

.nt-shimenawa .nt-mt8 {
    margin-top: 8px;
}

.nt-shimenawa .nt-mt10 {
    margin-top: 10px;
}

.nt-shimenawa .nt-mt12 {
    margin-top: 12px;
}

.nt-shimenawa .nt-mt14 {
    margin-top: 14px;
}

.nt-shimenawa .nt-mt18 {
    margin-top: 18px;
}

.nt-shimenawa .nt-mb10 {
    margin-bottom: 10px;
}

.nt-shimenawa .nt-mb14 {
    margin-bottom: 14px;
}

.nt-shimenawa .nt-ta-l {
    text-align: left;
}

.nt-shimenawa .nt-ta-c {
    text-align: center;
}

/* S9「お客様の声」の枠だけ余白が広い */
.nt-shimenawa .ph-voice {
    padding: 26px 14px;
}


/* ============================================================
   14. PC（760px以上）
   ============================================================ */
@media (min-width:760px) {

    .nt-shimenawa {
        font-size: 17.5px;
    }

    .nt-shimenawa .dx-body {
        padding: 26px 24px;
    }

    .nt-shimenawa .closing-grid {
        grid-template-columns: 1fr 1fr;
    }

    .nt-shimenawa .dx-choices.two {
        grid-template-columns: 1fr 1fr;
    }

    .nt-shimenawa .rec {
        grid-template-columns: 200px 1fr;
        align-items: start;
    }

    .nt-shimenawa .riyu {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .nt-shimenawa .nayami {
        grid-template-columns: 1fr 1fr;
    }

    .nt-shimenawa .fv h1 {
        font-size: 36px;
    }

    .nt-shimenawa .fv h1 .small {
        font-size: 20px;
    }

    .nt-shimenawa h2 {
        font-size: 29px;
    }

    .nt-shimenawa section {
        padding: 54px 0;
    }

    .nt-shimenawa .fv-grid {
        grid-template-columns: 1.1fr .9fr;
        align-items: center;
    }

    .nt-shimenawa a.tel-num {
        font-size: 38px;
    }

    /* 3列固定だと、ボタンが2つの箇所（FVなど）で右に空きが出るため、
       実際の個数に合わせて均等割りする */
    .nt-shimenawa .btn3 {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: minmax(0, 1fr);
    }

    /* 横に並ぶ幅があるときは、文言は左・ボタンは右のままにする */
    .nt-shimenawa .cta-inline {
        justify-content: space-between;
    }

    .nt-shimenawa .cta-inline .msg {
        text-align: left;
    }

    .nt-shimenawa .sticky-tel {
        display: none;
    }
}

/* ============================================================
   13. ページ限定でテーマ側の表示を整える
       （`.nt-shimenawa` の外側。`body.nt-shimenawa-page` が付く
         しめ縄カテゴリページだけに効き、他ページには影響しない）
   ============================================================ */

/* フッターの住所が「…５-１-１／０」と割れて末尾の1文字だけ次の行に
   落ちる。ラベルと本文が横並びで本文の幅が62px分削られているため、
   狭い画面ではラベルを上へ積んで本文に全幅を渡す */
@media screen and (max-width: 771px) {
    body.nt-shimenawa-page .footer-info-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
    }

    body.nt-shimenawa-page .footer-contact-row {
        flex-wrap: wrap;
    }
}

/* ============================================================
   15. 各部の名前の写真スライダー（S5）
   ・5秒ごとに次の写真へ。矢印・点・スワイプで手動操作したら自動切り替えは止まる
   ・動きは shimenawa-2026.js の「写真スライダー」
   ============================================================ */
.nt-shimenawa .nt-slider {
    margin: 0 0 14px;
}

.nt-shimenawa .nt-slider-view {
    position: relative;
    overflow: hidden;
    border-radius: 3px;
    background: var(--ph-bg);
    touch-action: pan-y;
}

.nt-shimenawa .nt-slider-track {
    display: flex;
    transition: transform .5s ease;
}

.nt-shimenawa .nt-slide {
    flex: 0 0 100%;
    margin: 0;
}

.nt-shimenawa .nt-slide img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3/2;
    object-fit: cover;
}

.nt-shimenawa .nt-slide figcaption {
    padding: 8px 4px 0;
    font-size: 14px;
    font-weight: 700;
    color: var(--ai);
    text-align: center;
}

.nt-shimenawa .nt-slider-arrow {
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, .45);
    color: #fff;
    font-size: 26px;
    line-height: 40px;
    padding: 0;
    cursor: pointer;
}

.nt-shimenawa .nt-slider-arrow.prev {
    left: 8px;
}

.nt-shimenawa .nt-slider-arrow.next {
    right: 8px;
}

.nt-shimenawa .nt-slider-dots {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 8px;
}

.nt-shimenawa .nt-slider-dots button {
    width: 10px;
    height: 10px;
    border: 0;
    border-radius: 50%;
    background: var(--gray-b);
    padding: 0;
    cursor: pointer;
}

.nt-shimenawa .nt-slider-dots button.on {
    background: var(--ai);
}

@media (prefers-reduced-motion: reduce) {
    .nt-shimenawa .nt-slider-track {
        transition: none;
    }
}

/* ============================================================
   16. お客様の声（S9・Googleマップのクチコミを原文のまま掲載）
   ============================================================ */
.nt-shimenawa .nt-voice-sum {
    margin: 0 0 12px;
    font-size: 15px;
    color: var(--ai);
}

.nt-shimenawa .nt-voice-sum b {
    color: var(--wara-d);
    font-size: 18px;
}

.nt-shimenawa .nt-voices {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.nt-shimenawa .nt-voice {
    margin: 0;
    padding: 16px 16px 14px;
    background: var(--nari-2);
    border-left: 3px solid var(--wara);
    border-radius: 3px;
}

.nt-shimenawa .nt-voice-star {
    margin: 0 0 6px;
    color: var(--wara);
    font-size: 14px;
    letter-spacing: 2px;
}

.nt-shimenawa .nt-voice blockquote {
    margin: 0 0 8px;
    padding: 0;
    border: 0;
    font-size: 15px;
    line-height: 1.8;
    color: var(--moji);
}

.nt-shimenawa .nt-voice figcaption {
    font-size: 13px;
    color: var(--moji-l);
}

.nt-shimenawa .nt-voice-src {
    margin: 10px 0 0;
    font-size: 13px;
    color: var(--moji-l);
}

@media (min-width:760px) {
    .nt-shimenawa .nt-voices {
        grid-template-columns: 1fr 1fr;
    }
}

/* ============================================================
   17. minori のご案内（診断結果：正月飾り）
   ・バナーの見た目は現行 waranawa.com/category/shimenawa/ の .minori-banner と同じ
   ============================================================ */
.nt-shimenawa .nt-minori-lead {
    margin: 0 0 10px;
    font-size: 15px;
}

.nt-shimenawa .nt-minori-lead a {
    color: var(--wara-d);
    font-weight: 700;
}

.nt-shimenawa .minori-banner {
    display: flex;
    flex-direction: column;
    margin: 0 0 18px;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, .05);
    overflow: hidden;
    text-decoration: none;
    color: #333;
    position: relative;
    transition: all .3s ease;
}

.nt-shimenawa .minori-banner:hover,
.nt-shimenawa .minori-banner:focus {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, .1);
    color: #333;
    text-decoration: none;
}

.nt-shimenawa .minori-badge {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    background: #b89851;
    color: #fff;
    padding: 5px 15px;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    border-bottom-right-radius: 8px;
}

.nt-shimenawa .minori-banner-img {
    width: 100%;
    height: 220px;
    overflow: hidden;
}

.nt-shimenawa .minori-banner-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}

.nt-shimenawa .minori-banner:hover .minori-banner-img img {
    transform: scale(1.05);
}

.nt-shimenawa .minori-banner-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 22px 18px;
    text-align: center;
}

.nt-shimenawa .minori-brand {
    display: block;
    margin-bottom: 8px;
    color: #b89851;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: .5px;
}

.nt-shimenawa .minori-title {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.5;
    color: #222;
}

.nt-shimenawa .minori-desc {
    margin: 0 0 18px;
    font-size: 14px;
    line-height: 1.6;
    color: #555;
    text-align: left;
}

.nt-shimenawa .minori-btn {
    display: inline-block;
    width: max-content;
    padding: 12px 24px;
    border-radius: 25px;
    background: #b89851;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0 2px 6px rgba(184, 152, 81, .3);
    transition: background .3s ease;
}

.nt-shimenawa .minori-banner:hover .minori-btn {
    background: #a38541;
}

@media (min-width:760px) {
    .nt-shimenawa .minori-banner {
        flex-direction: row;
    }

    .nt-shimenawa .minori-banner-img {
        width: 45%;
        height: auto;
    }

    .nt-shimenawa .minori-banner-content {
        width: 55%;
        padding: 26px;
        align-items: flex-start;
        text-align: left;
    }

    .nt-shimenawa .minori-title {
        font-size: 20px;
    }
}

/* ============================================================
   18. パソコンでは、ページ全体をブラウザの150%表示と同じ大きさにする
   ・2026-10-20 宮内の指示（年輩の方が見やすいように）
   ・ブラウザの150%表示は、画面幅を1.5分の1として扱う。PC用レイアウトの境目は772px
     なので、実際の画面幅が 772 × 1.5 = 1158px 以上のときだけ拡大する。
     それより狭い画面（タブレット・スマホ）は、拡大すると1列のレイアウトに切り替わらず
     窮屈になるため、今までどおりの大きさにする。
   ・テーマのヘッダー・ナビ・フッターも含めて body ごと拡大する
   ============================================================ */
@media screen and (min-width: 1158px) {
    body.nt-shimenawa-page {
        zoom: 1.5;
    }

    /* ページ内リンクで飛んだときの見出しの余白も1.5倍にする
       （html は拡大の外なので、固定バーの高さぶんを自分で掛ける）
       ・後から読み込む shimenawa-topbar-2026.css の html 指定に負けないよう :root を重ねる */
    html:root {
        scroll-padding-top: calc((var(--shimenawa-fixedbar-top) + 8px) * 1.5);
    }
}

/* ============================================================
   19. 年末用しめ縄 受付状況（ヘッダー直下）
   ・一時的なお知らせと一目で分かるよう、黄色い枠＋「i」の印の注意書きにする
     （2026-10-20 宮内の指示。参考は社内システムのお知らせ枠）
   ・スマホは1行1品目（品名が左、状況が右）で、文字は16px以上（60代でも読める大きさ）
   ・状況の文字ごとの色: 受付中・在庫あり＝緑／残りわずか＝橙／在庫なし・受付停止＝灰
   ・状況の書き換えは category-shimenawa.php 冒頭の $nt_status
   ============================================================ */
.nt-shimenawa .nt-status {
    padding: 12px 0;
    background: #fff;
}

.nt-shimenawa .nt-status-box {
    display: flex;
    align-items: stretch;
    background: #fbe7a1;
    border: 1px solid #e3c25c;
    border-radius: 4px;
}

.nt-shimenawa .nt-status-icon {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 40px;
    padding-top: 12px;
    color: #8a6d2e;
}

.nt-shimenawa .nt-status-icon svg {
    width: 26px;
    height: 26px;
}

.nt-shimenawa .nt-status-body {
    flex: 1 1 auto;
    min-width: 0;
    margin: 6px 6px 6px 0;
    padding: 10px 12px;
    background: #fff9e6;
    border: 1px solid #ecd287;
    border-radius: 3px;
}

.nt-shimenawa .nt-status-ttl {
    margin: 0 0 6px;
    font-size: 18px;
    font-weight: 700;
    color: #333;
}

.nt-shimenawa .nt-status-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0 24px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.nt-shimenawa .nt-status-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 7px 0;
    border-bottom: 1px dashed #e3c25c;
    font-size: 16px;
    line-height: 1.4;
    color: #333;
}

.nt-shimenawa .nt-st {
    flex: 0 0 auto;
    min-width: 5.5em;
    padding: 3px 8px;
    border-radius: 3px;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
}

.nt-shimenawa .nt-st-open,
.nt-shimenawa .nt-st-stock {
    background: #2e7d32;
}

.nt-shimenawa .nt-st-few {
    background: #c56a12;
}

.nt-shimenawa .nt-st-out,
.nt-shimenawa .nt-st-stop {
    background: #777;
}

@media (min-width:760px) {
    .nt-shimenawa .nt-status-list {
        grid-template-columns: 1fr 1fr;
    }

    .nt-shimenawa .nt-status-icon {
        width: 52px;
    }
}


/* ============================================================
   20. スマホ（759px以下）は60代が読める文字の大きさにする
   ・2026-10-20 宮内の指示「60代ファースト」
   ・このファイルと shimenawa-topbar-2026.css の font-size(px) を機械的に引き上げた上書き。
     目安: 本文17〜18px、補足16px以上、小さな札14px以上、上部の帯のボタン12px
   ・上部の帯のCSSが後から読み込まれるため、セレクタの頭に html を付けて優先させている
   ・元の大きさを変えたら、ここも作り直す（README「9-2. スマホの文字サイズの上書きの作り直し方」）
   ============================================================ */
@media screen and (max-width: 759px) {
    html .nt-shimenawa h4 {
            font-size: 18px;
    }

    html .nt-shimenawa .lead {
            font-size: 18px;
    }

    html .nt-shimenawa .note {
            font-size: 17px;
    }

    html .nt-shimenawa .ph-box .ph-t {
            font-size: 17px;
    }

    html .nt-shimenawa .ph-box .ph-s {
            font-size: 16px;
    }

    html .nt-shimenawa .tel-lead {
            font-size: 17px;
    }

    html .nt-shimenawa .tel-hours {
            font-size: 17px;
    }

    html .nt-shimenawa .btn {
            font-size: 18.5px;
    }

    html .nt-shimenawa .btn-ghost {
            font-size: 17px;
    }

    html .nt-shimenawa .cta-inline .msg {
            font-size: 17px;
    }

    html .nt-shimenawa .cta-inline a {
            font-size: 18px;
    }

    html .nt-shimenawa .fv .kamon {
            font-size: 17px;
    }

    html .nt-shimenawa .fv-sub {
            font-size: 18px;
    }

    html .nt-shimenawa .three li {
            font-size: 17px;
    }

    html .nt-shimenawa .fv-cta .cta-cap {
            font-size: 17px;
    }

    html .nt-shimenawa .sticky-tel a {
            font-size: 18px;
    }

    html .nt-shimenawa .sticky-tel .s-main {
            font-size: 18px;
    }

    html .nt-shimenawa .sticky-tel .s-sub {
            font-size: 14px;
    }

    html .nt-shimenawa .dx-head .t {
            font-size: 18px;
    }

    html .nt-shimenawa .dx-head .s {
            font-size: 16px;
    }

    html .nt-shimenawa .dx-help {
            font-size: 17px;
    }

    html .nt-shimenawa .dx-btn {
            font-size: 18.5px;
    }

    html .nt-shimenawa .dx-btn .txt small {
            font-size: 17px;
    }

    html .nt-shimenawa .dx-cta-note {
            font-size: 16px;
    }

    html .nt-shimenawa .rec .rec-size {
            font-size: 17px;
    }

    html .nt-shimenawa .tag {
            font-size: 14px;
    }

    html .nt-shimenawa .summary-card dl {
            font-size: 17px;
    }

    html .nt-shimenawa .summary-card dt {
            font-size: 17px;
    }

    html .nt-shimenawa .dx-msg {
            font-size: 18px;
    }

    html .nt-shimenawa .steps li {
            font-size: 18px;
    }

    html .nt-shimenawa .steps li::before {
            font-size: 17px;
    }

    html .nt-shimenawa .steps li span {
            font-size: 17px;
    }

    html .nt-shimenawa .nayami li {
            font-size: 18px;
    }

    html .nt-shimenawa .nayami li span {
            font-size: 17px;
    }

    html .nt-shimenawa .riyu .item p {
            font-size: 17px;
    }

    html .nt-shimenawa .riyu .item .kekka {
            font-size: 17px;
    }

    html .nt-shimenawa .jisseki-line li {
            font-size: 17px;
    }

    html .nt-shimenawa .card .alias {
            font-size: 16px;
    }

    html .nt-shimenawa .card p.d {
            font-size: 17px;
    }

    html .nt-shimenawa .card .spec {
            font-size: 17px;
    }

    html .nt-shimenawa .card summary {
            font-size: 17px;
    }

    html .nt-shimenawa .card details .dd {
            font-size: 17px;
    }

    html .nt-shimenawa table {
            font-size: 17px;
    }

    html .nt-shimenawa .checklist li {
            font-size: 18px;
    }

    html .nt-shimenawa .checklist li span {
            font-size: 17px;
    }

    html .nt-shimenawa .memo-list li {
            font-size: 18px;
    }

    html .nt-shimenawa .flow li::before {
            font-size: 18px;
    }

    html .nt-shimenawa .flow li b {
            font-size: 18.5px;
    }

    html .nt-shimenawa .flow li .days {
            font-size: 16px;
    }

    html .nt-shimenawa .flow li p {
            font-size: 17px;
    }

    html .nt-shimenawa .filter button {
            font-size: 17px;
    }

    html .nt-shimenawa .jcard h4 {
            font-size: 18px;
    }

    html .nt-shimenawa .jcard p {
            font-size: 17px;
    }

    html .nt-shimenawa .jcard .jspec {
            font-size: 16px;
    }

    html .nt-shimenawa .faq summary {
            font-size: 18px;
    }

    html .nt-shimenawa .faq summary .qm {
            font-size: 17px;
    }

    html .nt-shimenawa .faq .a {
            font-size: 17px;
    }

    html .nt-shimenawa .faq .a .kari {
            font-size: 14px;
    }

    html .nt-shimenawa .nt-slide figcaption {
            font-size: 17px;
    }

    html .nt-shimenawa .nt-voice-sum {
            font-size: 17px;
    }

    html .nt-shimenawa .nt-voice-star {
            font-size: 17px;
    }

    html .nt-shimenawa .nt-voice blockquote {
            font-size: 17px;
    }

    html .nt-shimenawa .nt-voice figcaption {
            font-size: 16px;
    }

    html .nt-shimenawa .nt-voice-src {
            font-size: 16px;
    }

    html .nt-shimenawa .nt-minori-lead {
            font-size: 17px;
    }

    html .nt-shimenawa .minori-badge {
            font-size: 16px;
    }

    html .nt-shimenawa .minori-brand {
            font-size: 16px;
    }

    html .nt-shimenawa .minori-desc {
            font-size: 17px;
    }

    html .nt-shimenawa .minori-btn {
            font-size: 17px;
    }

    html .nt-shimenawa .nt-status-list li {
            font-size: 18px;
    }

    html .nt-shimenawa .nt-st {
            font-size: 17px;
    }

    html .shimenawa-fixedbar--top .shimenawa-fixedbar__btn {
            font-size: 12px;
    }

    /* 本文を大きくしたぶん、見出しも一段上げて差を保つ（手で追加）。
       h3 は場所ごとに細かい指定があるため、:not(#nt-x) で優先度を上げてまとめて効かせる */
    html .nt-shimenawa h3:not(#nt-x) {
        font-size: 20px;
    }

    html .nt-shimenawa .dx-q:not(#nt-x) {
        font-size: 22px;
    }

    html .shimenawa-fixedbar__btn {
        font-size: 13px;
    }

    /* 上部の帯: 文字を13pxにしたらボタンからはみ出たため（2026-10-20 宮内の指摘）、
       ボタンは縮めずに文字の幅どおりにし、ロゴ文字（縄屋忠右衛門）の列を残りの幅で縮める */
    html .shimenawa-fixedbar--top .shimenawa-fixedbar__inner {
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 6px;
    }

    html .shimenawa-fixedbar--top .shimenawa-fixedbar__ctas {
        flex: 0 0 auto;
        max-width: none;
    }

    html .shimenawa-fixedbar--top .shimenawa-fixedbar__btn {
        flex: 0 0 auto;
        max-width: none;
        padding: 0 9px;
        font-size: 13px;
    }

    /* ロゴ文字は、ボタンとメニューを除いた残りの幅に収まる大きさにする */
    html .shimenawa-fixedbar--top .shimenawa-fixedbar__brand-text {
        font-size: clamp(13px, calc((100vw - 305px) / 6.3), 22px);
    }
}

/* 横幅が狭いスマホ（386px以下）は、ロゴ文字（縄屋忠右衛門）を出す幅がないため、家紋のロゴだけにする */
@media screen and (max-width: 386px) {
    html .shimenawa-fixedbar--top .shimenawa-fixedbar__brand-text {
        display: none;
    }
}

/* ============================================================
   21. 受付状況の要約と開閉（19節の続き）／スマホの表をカード型にする
   ・2026-10-20 宮内の指示「受付状況の縦幅を1/3」「表内のテキストの改行が見づらい」
   ・受付状況: 受付中以外の品目だけを先に出し、全品目は「すべての品目を見る」で開く
   ・表（759px以下）: 横スクロールの細い列で3〜4行に折り返していたため、
     1行＝1枚のカードにして、列名（data-label。shimenawa-2026.js が付ける）を値の上に出す
   ============================================================ */
.nt-shimenawa .nt-status-sum {
    margin: 0 0 4px;
    font-size: 16px;
    line-height: 1.6;
    color: #333;
}

.nt-shimenawa .nt-status-sum .nt-st {
    display: inline-block;
    min-width: 0;
    margin-right: 8px;
    vertical-align: 1px;
}

.nt-shimenawa .nt-status-more summary {
    display: block;
    list-style: none;
    font-size: 16px;
    line-height: 1.6;
    color: #333;
    cursor: pointer;
}

.nt-shimenawa .nt-status-more summary::-webkit-details-marker {
    display: none;
}

.nt-shimenawa .nt-status-open {
    margin-left: 6px;
    color: var(--ai);
    font-weight: 700;
    text-decoration: underline;
    white-space: nowrap;
}

.nt-shimenawa .nt-status-open::after {
    content: " ▼";
    font-size: .8em;
}

.nt-shimenawa .nt-status-more[open] .nt-status-open::after {
    content: " ▲";
}

.nt-shimenawa .nt-status-more[open] summary {
    margin-bottom: 6px;
}

@media screen and (max-width: 759px) {
    html .nt-shimenawa .nt-status {
        padding: 6px 0;
    }

    html .nt-shimenawa .nt-status-body {
        padding: 6px 8px;
    }

    html .nt-shimenawa .nt-status .wrap {
        padding-left: 10px;
        padding-right: 10px;
    }

    html .nt-shimenawa .nt-status-ttl {
        margin-bottom: 4px;
    }

    /* スマホは「i」の印を見出しの左に重ね、本文の幅を広げて行数を減らす */
    html .nt-shimenawa .nt-status-box {
        position: relative;
        display: block;
        padding: 4px;
        border-radius: 3px;
    }

    html .nt-shimenawa .nt-status-icon {
        position: absolute;
        top: 11px;
        left: 11px;
        width: auto;
        padding: 0;
    }

    html .nt-shimenawa .nt-status-icon svg {
        width: 20px;
        height: 20px;
    }

    html .nt-shimenawa .nt-status-body {
        margin: 0;
    }

    html .nt-shimenawa .nt-status-ttl {
        padding-left: 26px;
    }

    /* --- 表をカード型に --- */
    html .nt-shimenawa .table-scroll {
        overflow: visible;
    }

    html .nt-shimenawa .table-scroll table,
    html .nt-shimenawa table {
        display: block;
        min-width: 0;
        border: 0;
        background: transparent;
    }

    html .nt-shimenawa thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }

    html .nt-shimenawa tbody,
    html .nt-shimenawa tr,
    html .nt-shimenawa th,
    html .nt-shimenawa td {
        display: block;
        width: auto;
    }

    html .nt-shimenawa tr {
        margin: 0 0 10px;
        background: #fff;
        border: 1px solid var(--keisen);
        border-radius: 4px;
        overflow: hidden;
    }

    html .nt-shimenawa th,
    html .nt-shimenawa td {
        border: 0;
        border-top: 1px dotted var(--keisen);
        padding: 8px 12px;
        white-space: normal;
        line-height: 1.7;
    }

    html .nt-shimenawa tr > :first-child {
        border-top: 0;
        background: var(--nari-2);
        color: var(--ai);
        font-weight: 700;
    }

    html .nt-shimenawa td[data-label]::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 2px;
        color: var(--moji-l);
        font-size: 15px;
        font-weight: 700;
    }

    html .nt-shimenawa tr > td:first-child::before {
        display: none;
    }
}

/* ============================================================
   22. ご注文の流れ（S8）を番号・アイコンつきの段にする
   ・2026-10-20 宮内の指示（参考: 印刷通販の「1 ご注文 ▶ 2 データ入稿 ▶ …」）
   ・灰色＝お客さまの番（nf-you）、水色＝縄忠の番（nf-us）
   ・スマホは縦1列で段の間に▼、760px以上は3列×2段で段の間に▶
   ============================================================ */
.nt-shimenawa .flow.nt-flow {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
    counter-reset: none;
}

.nt-shimenawa .flow.nt-flow li {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
    padding: 14px 14px 16px;
    border: 0;
    border-radius: 6px;
    text-align: center;
}

.nt-shimenawa .flow.nt-flow li::before {
    content: none;
}

.nt-shimenawa .flow.nt-flow li.nf-you {
    background: #efefef;
}

.nt-shimenawa .flow.nt-flow li.nf-us {
    background: #e3edf7;
}

/* 段と段の間の矢印（スマホは下向き） */
.nt-shimenawa .flow.nt-flow li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -18px;
    margin-left: -11px;
    border-top: 12px solid var(--ai);
    border-left: 11px solid transparent;
    border-right: 11px solid transparent;
}

.nt-shimenawa .nt-flow .nf-num {
    font-size: 34px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--ai);
    font-family: "Helvetica Neue", Arial, sans-serif;
}

.nt-shimenawa .nt-flow .nf-ttl {
    margin-top: 2px;
    font-size: 19px;
    font-weight: 700;
    color: var(--ai);
}

.nt-shimenawa .nt-flow .nf-ico {
    display: block;
    width: 72px;
    height: 72px;
    margin: 8px auto 6px;
}

.nt-shimenawa .nt-flow .nf-ico svg {
    display: block;
    width: 100%;
    height: 100%;
}

.nt-shimenawa .nt-flow .nf-days {
    display: inline-block;
    margin-bottom: 6px;
    padding: 2px 10px;
    border-radius: 3px;
    background: #fff;
    color: var(--ai);
    font-size: 15px;
    font-weight: 700;
}

.nt-shimenawa .flow.nt-flow li p {
    margin: 0;
    color: #333;
    font-size: 15px;
    line-height: 1.75;
    text-align: left;
}

@media (min-width:760px) {
    .nt-shimenawa .flow.nt-flow {
        grid-template-columns: repeat(3, 1fr);
        gap: 26px 26px;
    }

    /* 横の矢印（▶）。3段目と6段目の右には出さない */
    .nt-shimenawa .flow.nt-flow li:not(:last-child)::after {
        left: auto;
        right: -20px;
        top: 50%;
        bottom: auto;
        margin: -11px 0 0;
        border-top: 11px solid transparent;
        border-bottom: 11px solid transparent;
        border-left: 12px solid var(--ai);
        border-right: 0;
    }

    .nt-shimenawa .flow.nt-flow li:nth-child(3)::after {
        content: none;
    }
}

@media screen and (max-width: 759px) {
    /* スマホは縦に長くなりすぎないよう、アイコンを左・番号と名前を右に並べる */
    html .nt-shimenawa .flow.nt-flow li {
        display: grid;
        grid-template-columns: 64px 1fr;
        column-gap: 14px;
        align-items: center;
        text-align: left;
        padding: 12px 14px 14px;
    }

    html .nt-shimenawa .nt-flow .nf-ico {
        grid-column: 1;
        grid-row: 1 / 4;
        width: 64px;
        height: 64px;
        margin: 0;
    }

    html .nt-shimenawa .nt-flow .nf-num {
        grid-column: 2;
        grid-row: 1;
        font-size: 26px;
    }

    html .nt-shimenawa .nt-flow .nf-ttl {
        grid-column: 2;
        grid-row: 2;
        margin: 0;
    }

    html .nt-shimenawa .nt-flow .nf-days {
        grid-column: 2;
        grid-row: 3;
        justify-self: start;
        margin: 4px 0 0;
    }

    html .nt-shimenawa .flow.nt-flow li p {
        grid-column: 1 / -1;
        grid-row: 4;
        margin-top: 10px;
        font-size: 17px;
    }

    html .nt-shimenawa .nt-flow .nf-days {
        font-size: 16px;
    }

    html .nt-shimenawa .nt-flow .nf-ttl {
        font-size: 21px;
    }
}

/* ============================================================
   23. ファーストビュー: しめ縄の写真を全面に敷き、白い文字を重ねる
   ・2026-10-20 宮内の指示「ファーストビューでしめ縄を扱っていると100%認識してもらう」
   ・写真の中ほど（しめ縄・紙垂・垂）は暗くしない。文字を置く下側だけを暗くして白文字を読ませる
   ・書体は明朝（テーマと同じ Sawarabi Mincho）。和の品物の店らしさと、太い白文字の読みやすさを両立する
   ・「しめ縄・左縄販売専門店」は金色の線で囲み、最初に目に入る言葉にする
   ============================================================ */
.nt-shimenawa .fv {
    padding-top: 0;
    background: var(--nari-2);
}

.nt-shimenawa .fv-hero {
    position: relative;
    margin-bottom: 22px;
    background-color: #24190a;
    background-repeat: no-repeat;
    /* スマホ: 写真を横幅いっぱいに上へ置く（写真の高さ＝横幅の約2/3）。しめ縄と紙垂は写真の30〜73%の高さにある */
    background-size: 100% auto;
    background-position: 50% 0;
}

/* スマホ: しめ縄の下（金屏風）から暗くし、写真の下端で背景の濃い茶色につなげる */
.nt-shimenawa .fv-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(36, 25, 10, 0) 0, rgba(36, 25, 10, 0) 42vw, rgba(36, 25, 10, .8) 56vw, #24190a 66.6vw);
}

.nt-shimenawa .fv-hero-in {
    position: relative;
    width: 100%;
    /* 文字は、しめ縄から下がる垂・紙垂（写真の高さの約72%＝横幅の約48%）のすぐ下から始める */
    padding-top: 50vw;
    padding-bottom: 26px;
    color: #fff;
}

html .nt-shimenawa .fv-hero .kamon {
    display: inline-block;
    margin: 0 0 12px;
    padding: 4px 12px;
    border: 1px solid #e2c27a;
    border-radius: 2px;
    background: rgba(0, 0, 0, .35);
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .12em;
}

html .nt-shimenawa .fv-hero h1 {
    margin: 0 0 12px;
    color: #fff;
    font-size: 31px;
    line-height: 1.45;
    letter-spacing: .04em;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .7);
}

html .nt-shimenawa .fv-hero h1 .small {
    display: block;
    line-height: 1.5;
    margin-bottom: 8px;
    color: #f3e3b8;
    font-size: 19px;
    letter-spacing: .08em;
}

html .nt-shimenawa .fv-hero h1 .small ruby {
    ruby-align: center;
}

html .nt-shimenawa .fv-hero h1 .nt-hero-name {
    display: block;
    margin-top: 10px;
}

html .nt-shimenawa .fv-hero h1 .nt-hero-gap {
    display: inline-block;
    margin-left: .35em;
    letter-spacing: -0.02em;
}

html .nt-shimenawa .fv-hero h1 .small rt {
    font-size: .55em;
    letter-spacing: .08em;
    opacity: .9;
}

html .nt-shimenawa .fv-hero .fv-sub {
    margin: 0;
    color: #fff;
    font-size: 17px;
    line-height: 1.8;
    text-shadow: 0 1px 6px rgba(0, 0, 0, .8);
}

@media (min-width:760px) {
    /* パソコン: 写真を全面に敷く。文字は左に置き、左側だけ暗くして、右側のしめ縄は明るいまま見せる */
    .nt-shimenawa .fv-hero {
        display: flex;
        align-items: center;
        min-height: 460px;
        background-size: cover;
        background-position: 50% 42%;
    }

    .nt-shimenawa .fv-hero::before {
        background: linear-gradient(90deg, rgba(20, 14, 5, .78) 0%, rgba(20, 14, 5, .6) 38%, rgba(20, 14, 5, .15) 62%, rgba(20, 14, 5, 0) 75%);
    }

    .nt-shimenawa .fv-hero-in {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .nt-shimenawa .fv-hero-in > * {
        max-width: 560px;
    }

    html .nt-shimenawa .fv-hero .kamon {
        font-size: 20px;
    }

    html .nt-shimenawa .fv-hero h1 {
        font-size: 42px;
    }

    html .nt-shimenawa .fv-hero h1 .small {
        font-size: 22px;
    }

    html .nt-shimenawa .fv-hero h1 .nt-hero-name {
        margin-top: 14px;
    }

    html .nt-shimenawa .fv-hero .fv-sub {
        font-size: 18px;
    }
}