@charset "UTF-8";
/* ==========================================================================
   natuna.jp — ヘッダー＋ファーストビュー（案A：ライト・シアン）
   WordPress テーマ組み込み用。クラス接頭辞 nt- で名前衝突を回避。
   対応幅：360px〜1728px（1280 / 1440 / 1728 で崩れないことを主眼に設計）
   ========================================================================== */

:root{
  --nt-accent:#FF5926;      /* オレンジ：CTA・強調のみ */
  --nt-nav:#3279ad;         /* グローバルナビ帯 */
  --nt-cyan-bg:#eaf6fc;     /* 薄いシアン地 */
  --nt-cyan-line:#bcd9ea;
  --nt-panel:#f7fbfe;
  --nt-ink:#182a3d;         /* 本文 */
  --nt-ink-deep:#0d3f57;    /* 見出し */
  --nt-sub:#6b7684;         /* 補助 */
  --nt-sub-cyan:#3c6f8c;
  --nt-line:#b7c9da;
  --nt-border:#9aabbe;
  --nt-border-soft:#b4c5d6;
  --nt-radius:14px;
  --nt-gutter:30px;         /* 横方向の基準余白（幅で可変） */
  --nt-max:1728px;
}

/* --- リセット（テーマ側と競合する場合は削除可） ------------------------- */
.nt-root *,.nt-root *::before,.nt-root *::after{box-sizing:border-box;}
.nt-root{
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,"Yu Gothic",system-ui,sans-serif;
  color:var(--nt-ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
  text-wrap:pretty;
  /* テーマの #page{text-align:center} を打ち消し、デザイン通り左寄せに戻す */
  text-align:left;
}
.nt-root img{max-width:100%;display:block;border:0;}
.nt-root a{color:#0074a8;text-decoration:none;}
.nt-root a:hover{color:var(--nt-accent);}
.nt-root ul{margin:0;padding:0;list-style:none;}
.nt-root p,.nt-root h1,.nt-root h2,.nt-root h3,.nt-root figure{margin:0;}
.nt-root table{margin:0;}
.nt-inner{max-width:var(--nt-max);margin:0 auto;padding-inline:var(--nt-gutter);}
.nt-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ==========================================================================
   1. ユーティリティバー
   ========================================================================== */
.nt-util{background:var(--nt-cyan-bg);border-bottom:1px solid var(--nt-cyan-line);font-size:11px;color:var(--nt-sub-cyan);}
.nt-util__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:28px;}
.nt-util__tagline{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.nt-util__links{display:flex;gap:16px;flex:0 0 auto;}
.nt-util__links a{color:var(--nt-sub-cyan);white-space:nowrap;}

/* ==========================================================================
   2. ロゴ帯（マスコット＋ワードマーク／319／ADPRINT広告枠）
   ========================================================================== */
.nt-head{background:#fff;}
.nt-head__inner{display:flex;align-items:center;gap:22px;padding-block:12px;}
.nt-root .nt-brand{display:flex;align-items:center;gap:12px;flex:0 1 auto;min-width:0;}
.nt-root .nt-brand__mascot{
  height:46px;width:auto;flex:0 0 auto;
  /* 白いキャラのため白地で沈む → 控えめな輪郭＋影でほどよく浮かせる */
  filter:drop-shadow(0 0 1px rgba(13,63,87,.38)) drop-shadow(0 1px 3px rgba(0,0,0,.15));
}
.nt-brand__text{display:flex;flex-direction:column;gap:4px;min-width:0;}
.nt-brand__mark{font-size:26px;font-weight:900;color:var(--nt-ink-deep);line-height:1;letter-spacing:.03em;white-space:nowrap;margin:0;}
.nt-brand__lead{font-size:11px;color:var(--nt-sub);line-height:1.5;}

.nt-trust{display:flex;flex-direction:column;gap:2px;flex:0 0 auto;padding-inline:20px;border-left:1px solid #c2d7e8;border-right:1px solid #c2d7e8;}
.nt-trust__label{font-size:10px;color:var(--nt-sub-cyan);letter-spacing:.08em;white-space:nowrap;}
.nt-trust__row{display:flex;align-items:baseline;gap:6px;}
.nt-trust__num{font-size:34px;font-weight:900;color:var(--nt-accent);line-height:.95;letter-spacing:-.02em;}
.nt-trust__unit{font-size:13px;font-weight:800;color:var(--nt-ink-deep);}

.nt-ad{display:flex;flex-direction:column;gap:5px;margin-left:auto;width:280px;flex:0 0 auto;}
.nt-root .nt-ad img{width:100%;height:auto;}
.nt-root .nt-ad__text{font-size:11px;font-weight:700;line-height:1.4;}

/* ==========================================================================
   3. グローバルナビ＋検索
   ========================================================================== */
.nt-nav{background:var(--nt-nav);}
.nt-nav__inner{display:flex;align-items:stretch;gap:4px;min-height:46px;}
.nt-nav__list{display:flex;align-items:stretch;gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none;}
.nt-nav__list::-webkit-scrollbar{display:none;}
.nt-root .nt-nav__link,
.nt-root .nt-nav__list > li > a{
  display:inline-flex;align-items:center;height:46px;padding-inline:16px;
  white-space:nowrap;font-size:14px;font-weight:600;color:#fff;
  border-bottom:3px solid transparent;
}
.nt-root .nt-nav__link:hover,
.nt-root .nt-nav__list > li > a:hover{background:rgba(255,255,255,.14);color:#fff;}
.nt-root .nt-nav__link.is-current,
.nt-root .nt-nav__list > li.current-menu-item > a,
.nt-root .nt-nav__list > li.current-page-ancestor > a{font-weight:700;border-bottom-color:var(--nt-accent);}

/* 検索：中央の大型バーにはせず、ナビ内にコンパクトに置く */
.nt-search{display:flex;align-items:center;margin-left:auto;align-self:center;flex:0 0 auto;}
.nt-search__field{
  width:200px;height:30px;border:1px solid var(--nt-cyan-line);border-right:none;
  border-radius:15px 0 0 15px;padding-inline:14px;font-size:12px;color:var(--nt-ink);
  background:#fff;outline:none;font-family:inherit;
}
.nt-search__field::placeholder{color:#9aa7b4;}
.nt-search__submit{
  height:30px;padding-inline:14px;border:none;border-radius:0 15px 15px 0;
  background:var(--nt-accent);color:#fff;font-size:12px;font-weight:700;cursor:pointer;
  font-family:inherit;white-space:nowrap;
}
.nt-nav__toggle{display:none;}

/* ==========================================================================
   4. バナー列（クライアント広告：6枚固定比 160:95）
   ========================================================================== */
.nt-banners{background:var(--nt-panel);border-bottom:1px solid #c2d7e8;}
.nt-banners__inner{
  display:grid;grid-template-columns:repeat(6,minmax(0,160px));
  gap:18px;justify-content:center;padding-block:12px;
}
.nt-root .nt-banners__item{
  display:block;width:100%;aspect-ratio:160/95;overflow:hidden;
  background:#fff;border:1px solid #b8cada;
}
.nt-root .nt-banners__item img{width:100%;height:100%;object-fit:cover;}

/* ==========================================================================
   5. アイテムから探す
   ========================================================================== */
.nt-items{background:#fff;border-bottom:1px solid #c9d7e3;}
.nt-items__inner{display:flex;align-items:flex-start;gap:18px;padding-top:16px;padding-bottom:18px;}
.nt-items__head{display:flex;flex-direction:column;gap:3px;flex:0 0 auto;padding-top:2px;}
.nt-secttl{display:inline-flex;align-items:center;gap:10px;font-size:20px;font-weight:900;letter-spacing:.02em;color:var(--nt-ink-deep);white-space:nowrap;margin:0;}
.nt-secttl::before{content:"";width:8px;height:24px;border-radius:4px;background:var(--nt-accent);flex:0 0 auto;}
.nt-items__note{font-size:11px;color:var(--nt-sub);padding-left:18px;}
.nt-items__grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;flex:1 1 auto;min-width:0;}
.nt-root .nt-item{
  display:flex;align-items:center;justify-content:flex-start;gap:7px;
  min-height:38px;padding:0 10px;border:1px solid var(--nt-border-soft);border-radius:8px;
  background:var(--nt-panel);font-size:12px;font-weight:700;color:var(--nt-ink);
  white-space:nowrap;overflow:hidden;
}
.nt-root .nt-item:hover{border-color:#00a0d2;color:#0074a8;}
.nt-root .nt-item__icon{width:20px;height:20px;flex:0 0 auto;object-fit:contain;}
.nt-item__icon--plain{border-radius:5px;background:linear-gradient(180deg,#9fd0ea 0%,#0f86bd 55%,#4cc0ea 100%);}
.nt-item__label{overflow:hidden;text-overflow:ellipsis;}

/* ==========================================================================
   6. PICK UP（掲載枠：カード化せず縦罫線区切り）
   ========================================================================== */
.nt-fv{background:var(--nt-panel);}
.nt-fv__inner{display:flex;flex-direction:column;gap:14px;padding-top:16px;padding-bottom:26px;}
.nt-pickup{display:grid;grid-template-columns:96px repeat(4,minmax(0,1fr));gap:14px;align-items:start;}
.nt-pickup__head{display:flex;flex-direction:column;gap:2px;}
.nt-pickup__title{font-size:13px;font-weight:900;letter-spacing:.06em;color:var(--nt-ink-deep);}
.nt-root .nt-pickup__all{font-size:11px;}
.nt-pickup__item{display:flex;flex-direction:column;gap:4px;padding-left:14px;border-left:1px solid #c2d7e8;min-width:0;}
.nt-pickup__row{display:flex;gap:6px;align-items:center;}
.nt-tag{display:inline-flex;align-items:center;height:17px;padding-inline:6px;border-radius:3px;color:#fff;font-size:10px;font-weight:700;flex:0 0 auto;}
.nt-tag--new{background:var(--nt-accent);}
.nt-tag--pr{background:#0074a8;}
.nt-root .nt-pickup__lead{font-size:12.5px;font-weight:700;color:var(--nt-ink);line-height:1.4;}
.nt-pickup__desc{font-size:11px;color:var(--nt-sub);line-height:1.6;}

/* ==========================================================================
   7. 比較表（10社を横並び）
   幅が足りない環境では表だけを横スクロールさせ、1列目を固定する。
   ========================================================================== */
.nt-compare{border:1px solid var(--nt-border);border-radius:var(--nt-radius);background:#fff;overflow:hidden;}
.nt-compare__bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 18px;background:var(--nt-cyan-bg);border-bottom:1px solid var(--nt-cyan-line);}
.nt-compare__ttl{font-size:17px;font-weight:800;color:var(--nt-ink-deep);white-space:nowrap;flex:0 0 auto;margin:0;}
.nt-compare__note{font-size:11px;color:var(--nt-sub-cyan);flex:1 1 auto;min-width:0;}
.nt-compare__tabs{display:flex;gap:6px;margin-left:auto;flex:0 0 auto;}
.nt-root .nt-tab{display:inline-flex;align-items:center;height:26px;padding-inline:14px;border-radius:13px;background:#fff;border:1px solid var(--nt-border-soft);color:var(--nt-sub-cyan);font-size:12px;font-weight:700;white-space:nowrap;}
.nt-tab.is-active{background:var(--nt-accent);border-color:var(--nt-accent);color:#fff;}

.nt-compare__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.nt-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:11.5px;color:var(--nt-ink);}
.nt-table col.nt-col--label{width:100px;}
.nt-table th,.nt-table td{border-bottom:1px solid var(--nt-line);border-right:1px solid var(--nt-line);padding:0 6px;vertical-align:middle;text-align:center;line-height:1.4;}
.nt-table th[scope="row"]{
  background:#f5fafd;text-align:left;padding:0 8px;font-size:12px;font-weight:700;
  color:var(--nt-ink-deep);line-height:1.3;
  position:sticky;left:0;z-index:2;
}
.nt-table tr:last-child th,.nt-table tr:last-child td{border-bottom:none;}
.nt-table td:last-child,.nt-table th:last-child{border-right:none;}

/* 会社ロゴ＋社名 */
.nt-table__logo{height:94px;background:#f5fafd;}
.nt-co{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0 6px;}
.nt-root .nt-co__logo{width:100%;height:42px;object-fit:contain;}
.nt-root .nt-co__name{font-size:11px;font-weight:700;color:#0074a8;line-height:1.25;}

/* 行ごとの高さ（ラベル列とデータ列で必ず同値） */
.nt-row--logo td,.nt-row--logo th{height:94px;}
.nt-row--ship td,.nt-row--ship th{height:44px;}
.nt-row--days td,.nt-row--days th{height:44px;}
.nt-row--tel td,.nt-row--tel th{height:56px;}
.nt-row--pay td,.nt-row--pay th{height:34px;}
.nt-row--office td,.nt-row--office th{height:32px;}
.nt-row--proof td,.nt-row--proof th{height:56px;}
.nt-row--tool td,.nt-row--tool th{height:50px;}
.nt-row--sp td,.nt-row--sp th{height:32px;}
.nt-row--feature td,.nt-row--feature th{height:184px;vertical-align:top;padding:9px;text-align:left;}
.nt-row--detail td,.nt-row--detail th{height:44px;}

.nt-ship{font-weight:800;font-size:12.5px;color:#d1441c;}   /* 送料は従来通り目立たせる */
.nt-days{font-size:12.5px;}
.nt-pay{display:flex;align-items:center;justify-content:center;gap:3px;}
.nt-pay__badge{
  display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;
  border-radius:3px;background:#0074a8;color:#fff;font-size:10px;font-weight:700;
}
.nt-feature{font-size:11.5px;line-height:1.65;margin:0;}
.nt-root .nt-cta{
  display:inline-flex;align-items:center;height:28px;padding-inline:12px;border-radius:14px;
  background:var(--nt-accent);color:#fff;font-size:11.5px;font-weight:700;white-space:nowrap;
}
.nt-root .nt-cta:hover{color:#fff;opacity:.88;}

/* ==========================================================================
   8. レスポンシブ
   1728 / 1440 / 1280 は同一レイアウト（余白と列幅のみ可変）。
   1279px 以下から段階的に組み替える。
   ========================================================================== */

/* 〜1728px：最大幅で止め、余白を広めに */
@media (min-width:1600px){
  :root{--nt-gutter:40px;}
  .nt-trust__num{font-size:38px;}
}

/* 1280〜1439px：比較表の1列あたりが詰まるため最小幅を確保して横スクロールへ */
@media (max-width:1439px){
  .nt-table{min-width:1180px;}
}

/* 〜1279px（小型ノート・タブレット横） */
@media (max-width:1279px){
  :root{--nt-gutter:22px;}
  .nt-ad{width:240px;}
  .nt-banners__inner{grid-template-columns:repeat(6,minmax(0,160px));gap:12px;}
  .nt-items__grid{grid-template-columns:repeat(5,minmax(0,1fr));}
}

/* 〜1023px（タブレット縦） */
@media (max-width:1023px){
  .nt-head__inner{flex-wrap:wrap;gap:14px;}
  .nt-trust{padding-left:0;border-left:none;}
  .nt-ad{margin-left:0;width:min(320px,100%);}
  .nt-nav__inner{flex-wrap:wrap;gap:0;padding-bottom:8px;}
  .nt-nav__list{order:2;width:100%;}
  .nt-search{order:1;width:100%;margin:8px 0 0;}
  .nt-search__field{width:100%;}
  .nt-items__inner{flex-direction:column;gap:12px;}
  .nt-items__grid{grid-template-columns:repeat(4,minmax(0,1fr));width:100%;}
  .nt-pickup{grid-template-columns:repeat(2,minmax(0,1fr));}
  .nt-pickup__head{grid-column:1 / -1;flex-direction:row;align-items:baseline;gap:10px;}
  .nt-banners__inner{grid-template-columns:repeat(3,minmax(0,200px));}
}

/* 〜767px（スマートフォン） */
@media (max-width:767px){
  :root{--nt-gutter:16px;}
  .nt-util__tagline{display:none;}
  .nt-util__links{width:100%;justify-content:space-between;gap:8px;font-size:10.5px;}
  .nt-brand__mark{font-size:22px;}
  .nt-root .nt-brand__mascot{height:38px;}
  .nt-trust{padding-inline:0;border:none;}
  .nt-trust__num{font-size:30px;}
  .nt-ad{width:100%;}
  .nt-banners__inner{grid-template-columns:repeat(2,minmax(0,200px));gap:10px;}
  .nt-items__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .nt-secttl{font-size:18px;}
  .nt-pickup{grid-template-columns:1fr;gap:10px;}
  .nt-pickup__item{padding-left:12px;}
  .nt-compare{border-radius:10px;}
  .nt-compare__ttl{font-size:15px;}
  .nt-compare__note{display:none;}
  .nt-compare__tabs{width:100%;margin-left:0;}
  .nt-table{min-width:980px;}
  .nt-table th[scope="row"]{box-shadow:1px 0 0 var(--nt-line);}
  .nt-row--feature td,.nt-row--feature th{height:200px;}
}


/* ==========================================================================
   8-10. 汎用セクション（キャンペーン／おすすめ記事／新着記事）
   ========================================================================== */
.nt-sec{background:#fff;padding-block:22px;}
.nt-sec:first-of-type{padding-top:30px;}
.nt-sec--campaign{padding-top:30px;}
.nt-sechead{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap;}
.nt-sechead__ttl{
  display:inline-flex;align-items:center;gap:10px;font-size:19px;font-weight:900;
  letter-spacing:.02em;color:var(--nt-ink-deep);white-space:nowrap;flex:0 0 auto;
}
.nt-sechead__ttl::before{content:"";width:8px;height:22px;border-radius:4px;background:#0074a8;flex:0 0 auto;}
.nt-sechead__ttl--accent::before{background:var(--nt-accent);}
.nt-sechead__note{font-size:12px;color:var(--nt-sub);white-space:nowrap;}
.nt-root .nt-sechead__more{margin-left:auto;font-size:12px;white-space:nowrap;flex:0 0 auto;}

/* キャンペーン一覧 */
.nt-cplist{border:1px solid var(--nt-border);border-radius:12px;overflow:hidden;}
.nt-cplist li:last-child .nt-cp{border-bottom:none;}
.nt-root .nt-cp{
  display:flex;align-items:center;gap:12px;padding:12px 16px;
  border-bottom:1px solid #d9e2eb;color:var(--nt-ink);
}
.nt-root .nt-cp:hover{background:var(--nt-panel);color:var(--nt-ink);}
.nt-cp__badge{
  display:inline-flex;align-items:center;justify-content:center;height:20px;padding-inline:8px;
  border-radius:3px;background:var(--nt-accent);color:#fff;font-size:10px;font-weight:700;flex:0 0 auto;
}
.nt-cp__co{font-size:13px;font-weight:700;color:#0074a8;white-space:nowrap;flex:0 0 auto;}
.nt-cp__ttl{font-size:13px;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.nt-cp__items{font-size:11px;color:var(--nt-sub);margin-left:auto;white-space:nowrap;max-width:330px;overflow:hidden;text-overflow:ellipsis;flex:0 0 auto;}

/* おすすめ記事カード */
.nt-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
.nt-root .nt-card__link{
  display:flex;flex-direction:column;gap:10px;height:100%;
  border:1px solid var(--nt-border);border-radius:12px;overflow:hidden;background:#fff;color:var(--nt-ink);
}
.nt-root .nt-card__link:hover{border-color:#0074a8;color:var(--nt-ink);}
.nt-root .nt-card__thumb{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;}
.nt-card__body{display:flex;flex-direction:column;gap:7px;padding:0 14px 14px;}
.nt-card__tag{
  display:inline-flex;align-items:center;align-self:flex-start;height:20px;padding-inline:9px;
  border-radius:10px;background:#eaf3fb;color:#1a6fb0;font-size:10px;font-weight:700;
}
.nt-card__ttl{font-size:13px;font-weight:700;line-height:1.65;}

/* 新着記事 */
.nt-posts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 18px;}
.nt-root .nt-post__link{display:flex;flex-direction:column;gap:9px;color:var(--nt-ink);}
.nt-root .nt-post__link:hover{color:var(--nt-accent);}
.nt-root .nt-post__thumb{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border:1px solid #dbe4ed;border-radius:10px;}
.nt-post__meta{display:flex;align-items:center;gap:8px;}
.nt-post__tag{
  display:inline-flex;align-items:center;height:18px;padding-inline:7px;border-radius:3px;
  background:#f2f6fa;border:1px solid #dbe4ed;color:var(--nt-sub);font-size:10px;font-weight:700;
  white-space:nowrap;flex:0 0 auto;
}
.nt-post__date{font-size:11px;color:var(--nt-sub);white-space:nowrap;}
.nt-post__meta{min-width:0;}
.nt-post__ttl{font-size:12.5px;font-weight:700;line-height:1.65;}

/* ==========================================================================
   11. フッターリンク2列
   ========================================================================== */
.nt-flists{background:#f2f6fa;border-top:1px solid #c9d7e3;padding-block:30px 26px;}
.nt-flists__inner{display:grid;grid-template-columns:1fr 1fr;gap:28px;}
.nt-flist__head{display:flex;align-items:center;gap:10px;padding-bottom:8px;border-bottom:2px solid #0074a8;margin-bottom:6px;}
.nt-flist__ttl{font-size:14px;font-weight:800;color:var(--nt-ink-deep);white-space:nowrap;}
.nt-root .nt-flist__more{margin-left:auto;font-size:11px;white-space:nowrap;}
.nt-root .nt-flist__item{
  display:block;padding-block:9px;border-bottom:1px solid #c9d7e3;
  font-size:12px;color:var(--nt-ink);
}
.nt-root .nt-flist__item:hover{color:var(--nt-accent);}

/* ==========================================================================
   12. フッター
   ========================================================================== */
.nt-footer{background:linear-gradient(160deg,#0089c4 0%,#00567c 100%);}
.nt-footer__inner{display:flex;flex-direction:column;align-items:center;gap:14px;padding-block:26px 30px;}
.nt-root .nt-footer__mascot{height:44px;width:auto;opacity:.95;}
.nt-footer__nav{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;font-size:12px;}
.nt-root .nt-footer__nav a{color:#eaf7fd;white-space:nowrap;}
.nt-root .nt-footer__nav a:hover{color:#fff;text-decoration:underline;}
.nt-footer__sns{display:flex;gap:10px;}
.nt-root .nt-sns{
  display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:15px;
  border:1px solid rgba(255,255,255,.45);color:#fff;font-size:11px;font-weight:700;
}
.nt-root .nt-sns:hover{background:rgba(255,255,255,.14);color:#fff;}
.nt-footer__copy{font-size:11px;color:#bfe3f3;}

/* ==========================================================================
   13. 下部セクションのレスポンシブ
   ========================================================================== */
@media (max-width:1279px){
  .nt-cp__items{max-width:220px;}
}
@media (max-width:1023px){
  .nt-cards{grid-template-columns:repeat(2,minmax(0,1fr));}
  .nt-posts{grid-template-columns:repeat(3,minmax(0,1fr));}
  .nt-cp__items{display:none;}
  .nt-flists__inner{grid-template-columns:1fr;gap:22px;}
}
@media (max-width:767px){
  .nt-sec{padding-block:18px;}
  .nt-sechead__ttl{font-size:16px;}
  .nt-sechead__note{display:none;}
  .nt-cards{grid-template-columns:1fr;}
  .nt-posts{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
  .nt-cp{flex-wrap:wrap;gap:8px;}
  .nt-cp__ttl{flex-basis:100%;white-space:normal;overflow:visible;}
}

/* 印刷・アクセシビリティ */
@media (prefers-reduced-motion:reduce){.nt-root *{transition:none !important;animation:none !important;}}

/* ==========================================================================
   WordPress 配線の追補（insatsu_pr.php のバナー <li> 構造／支払非対応バッジ）
   ========================================================================== */
/* nt-banners__inner を <ul> にしたため .nt-root ul{padding:0} に負ける → 上下余白を再指定 */
.nt-root .nt-banners__inner{list-style:none;padding-block:16px;margin:0;}
.nt-root .nt-banners__inner > li{display:block;width:100%;aspect-ratio:160/95;overflow:hidden;background:#fff;border:1px solid #b8cada;}
.nt-root .nt-banners__inner > li > a{display:block;width:100%;height:100%;}
.nt-root .nt-banners__inner > li img{width:100%;height:100%;object-fit:cover;}
.nt-pay__badge.is-off{background:#c3d0da;color:#eef4f8;}

/* ADPRINT広告(dfads)の下テキストを1行に（改行させない） */
.nt-root .nt-ad p{margin:0;white-space:nowrap;font-size:11px;line-height:1.4;overflow:hidden;text-overflow:ellipsis;}
.nt-root .nt-ad p a{white-space:nowrap;font-weight:700;font-size:inherit;}

/* アイテムから探す：全アイテム一覧へのリンク */
.nt-items__head{gap:5px;}
.nt-root .nt-items__all{display:inline-block;margin-top:2px;font-size:12px;font-weight:700;color:#0074a8;white-space:nowrap;}
.nt-root .nt-items__all:hover{color:var(--nt-accent);}

/* ==========================================================================
   スマホ用 会社カード（現サイト風）。デスクトップは非表示、比較表を切替
   ========================================================================== */
.nt-cocards{display:none;}
@media (max-width:767px){
  .nt-compare__scroll{display:none;}
  .nt-cocards{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;background:#fff;}
  .nt-root .nt-cocard{display:flex;flex-direction:column;align-items:center;gap:7px;border:1px solid var(--nt-border);border-radius:10px;padding:14px 10px 12px;background:#fff;text-align:center;color:var(--nt-ink);}
  .nt-cocard__logo{display:flex;align-items:center;justify-content:center;height:50px;width:100%;}
  .nt-root .nt-cocard__logo img{max-width:100%;max-height:50px;width:auto;height:auto;object-fit:contain;}
  .nt-root .nt-cocard__name{font-size:14px;font-weight:800;color:#0074a8;line-height:1.3;}
  .nt-cocard__ship{font-size:13px;font-weight:800;color:#d1441c;line-height:1.4;}
  .nt-cocard__days{font-size:12px;color:var(--nt-ink);line-height:1.4;}
  .nt-cocard__pay{display:flex;flex-direction:column;align-items:center;gap:4px;}
  .nt-cocard__lbl{font-size:11px;font-weight:700;color:#0074a8;}
  .nt-cocard__office{width:100%;box-sizing:border-box;border:1px solid var(--nt-border-soft);border-radius:999px;padding:4px 8px;font-size:11.5px;color:var(--nt-ink);}
  .nt-cocard__feat{font-size:11.5px;line-height:1.65;color:var(--nt-ink);text-align:left;width:100%;margin:2px 0 0;}
  .nt-root .nt-cocard__cta{margin-top:2px;width:100%;justify-content:center;height:32px;}
}

/* ==========================================================================
   スマホ最終調整（右はみ出し／319の右空き／検索の主張を抑える）
   ========================================================================== */
@media (max-width:767px){
  /* 右側の余計な余白（横スクロール）を止める */
  #page.pageNew{overflow-x:hidden;}

  /* ロゴ帯：ロゴ＋319を1行に、広告は次行フル幅。319の右空きを解消 */
  .nt-head__inner{flex-wrap:wrap;gap:10px 12px;padding-block:10px;}
  .nt-brand__lead{display:none;}
  .nt-brand__mark{font-size:20px;}
  .nt-root .nt-brand__mascot{height:40px;}
  .nt-trust{margin-left:auto;flex-direction:row;align-items:baseline;gap:5px;padding:0;border:none;}
  .nt-trust__label{display:none;}
  .nt-trust__num{font-size:30px;}
  .nt-ad{flex-basis:100%;width:100%;margin-left:0;}

  /* 検索：オレンジ→ネイビーで主張を抑え、小型化してナビと調和 */
  .nt-nav__inner{flex-wrap:wrap;gap:6px;padding-block:6px;}
  .nt-search{order:1;width:100%;margin:0;}
  .nt-search__field{height:34px;font-size:12px;}
  .nt-search__submit{height:34px;padding-inline:14px;font-size:11.5px;background:#0a3f63;}
  .nt-nav__list{order:2;width:100%;max-width:100%;gap:2px;}
  .nt-root .nt-nav__list > li > a{height:40px;font-size:13px;padding-inline:12px;}
}

/* スマホ：バナー slick カルーセル（2枚表示） */
@media (max-width:767px){
  .nt-banners__inner.slick-initialized{display:block;padding:12px 6px;}
  .nt-banners__inner .slick-list{overflow:hidden;}
  .nt-banners__inner .slick-track{display:flex;align-items:stretch;}
  .nt-banners__inner .slick-slide{height:auto;margin:0 5px;}
  .nt-banners__inner .slick-slide img,
  .nt-banners__inner .slick-slide > li{height:auto;}
}

/* ==========================================================================
   スマホ：検索は虫眼鏡ボタンのみ。タップでナビ直下にフル幅で開く（位置ずれ防止）
   ========================================================================== */
.nt-navsearch-toggle{display:none;}   /* デスクトップは非表示（従来通りインライン検索） */
@media (max-width:767px){
  .nt-nav__inner{flex-wrap:wrap;align-items:center;gap:6px;padding-block:6px;}
  .nt-nav__list{order:1;width:auto;flex:1 1 0;min-width:0;}
  .nt-root .nt-navsearch-toggle{
    display:inline-flex;order:2;flex:0 0 auto;align-items:center;justify-content:center;
    width:44px;height:38px;margin-left:2px;background:var(--nt-nav);border:none;border-radius:8px;
    color:#fff;font-size:16px;line-height:1;cursor:pointer;position:relative;z-index:2;
    /* 左に影を落とし、スクロールするナビがボタンの下に潜って見えるようにする */
    box-shadow:-14px 0 12px -8px rgba(9,46,73,.6);
  }
  .nt-root .nt-navsearch-toggle:hover{background:#2a6ea0;color:#fff;}
  /* 検索フォームは既定で非表示。開いたときだけナビ直下にフル幅で表示 */
  .nt-search{order:3;flex-basis:100%;width:100%;display:none;margin:0;padding-top:2px;}
  .nt-nav__inner.is-searchopen .nt-search{display:flex;}
  .nt-search__field{width:100%;height:38px;border:1px solid #cdd8e3;border-right:none;border-radius:19px 0 0 19px;background:#fff;}
  .nt-search__submit{height:38px;border-radius:0 19px 19px 0;background:#0a3f63;padding-inline:16px;}
}

/* グローバルナビ：ノベルティ・グッズ印刷(menu-item-1630)を一番後ろに（プレビューのみ・flex order） */
.nt-root .nt-nav__list > li.menu-item-1630{order:9;}

/* スマホ：グローバルナビを現サイト風に（項目間の区切り線・白太字・コンパクト） */
@media (max-width:767px){
  .nt-nav__list{gap:0;}
  .nt-root .nt-nav__list > li + li{border-left:1px solid rgba(255,255,255,.30);}
  .nt-root .nt-nav__list > li > a{height:44px;font-size:14px;font-weight:700;padding-inline:12px;}
}

/* ==========================================================================
   スマホ：グローバルナビを現サイト(base.css #globalNaviNew)と同一に再現
   ========================================================================== */
@media (max-width:767px){
  .nt-nav{background:#3279ad;}
  .nt-nav__list{gap:0;}
  .nt-root .nt-nav__list > li{position:relative;}
  .nt-root .nt-nav__list > li + li{border-left:none;} /* 先に足した白線を無効化 */
  .nt-root .nt-nav__list > li > a{
    height:40px;line-height:40px;padding:0 8px 0 7px;
    font-size:13.5px;font-weight:bold;color:#fff;text-align:center;
    text-shadow:1px 1px 0 rgba(0,0,0,.65);
    border-bottom:3px solid #039;background:#3279ad;
  }
  /* 二重グラデの区切り線（左：明／右：暗）＝現サイトと同一 */
  .nt-root .nt-nav__list > li:not(:first-child)::before{
    content:"";position:absolute;top:50%;left:0;width:1px;height:30px;margin-top:-15px;pointer-events:none;
    background-image:linear-gradient(to bottom,#3279ad 0%,#6685c2 30%,#6685c2 70%,#3279ad 100%);
  }
  .nt-root .nt-nav__list > li::after{
    content:"";position:absolute;top:50%;right:0;width:1px;height:30px;margin-top:-15px;pointer-events:none;
    background-image:linear-gradient(to bottom,#0483b9 0%,#006692 30%,#006692 70%,#0483b9 100%);
  }
  /* オレンジ下線・hover背景は現サイトに合わせ無効化（border-bottomは#039固定） */
  .nt-root .nt-nav__list > li.current-menu-item > a,
  .nt-root .nt-nav__list > li.current-page-ancestor > a,
  .nt-root .nt-nav__list > li > a:hover{border-bottom-color:#039;background:#3279ad;}
}

/* ==========================================================================
   トップFB対応（2026-08）：ナビ並び替え/ロゴ検索くん/広告拡大/アイテム見出し/②導線
   ========================================================================== */
/* ② ナビ並び順：ホーム→価格比較→体験レビュー→アイテムから探す→キャンペーン→ノベルティ */
.nt-root .nt-nav__list > li.menu-item-1625{order:0;}   /* ホーム */
.nt-root .nt-nav__list > li.menu-item-1626{order:1;}   /* 価格比較 */
.nt-root .nt-nav__list > li.menu-item-16945{order:2;}  /* 体験レビュー */
.nt-root .nt-nav__list > li.menu-item-1627{order:3;}   /* アイテムから探す */
.nt-root .nt-nav__list > li.menu-item-1628{order:4;}   /* キャンペーン情報 */
.nt-root .nt-nav__list > li.menu-item-1630{order:5;}   /* ノベルティ・グッズ印刷 */

/* ⑥ ロゴを検索くん（header_logo_new.png）に戻す */
.nt-root .nt-brand__logo{height:52px;width:auto;display:block;}
@media (max-width:767px){ .nt-root .nt-brand__logo{height:40px;} }

/* ⑦ ADPRINT広告を大きく＋下テキストが切れないように */
.nt-ad{width:340px;}
.nt-root .nt-ad p{white-space:nowrap;font-size:11px;overflow:visible;text-overflow:clip;}

/* ③ アイテム見出しバー（見出し左＋全一覧リンク右）／グリッドは全幅 */
.nt-items__bar{display:flex;align-items:center;gap:12px;padding-top:16px;padding-bottom:2px;}
.nt-root .nt-items__all{margin-left:auto;flex:0 0 auto;font-size:13px;font-weight:700;color:#0074a8;white-space:nowrap;}
.nt-root .nt-items__all:hover{color:var(--nt-accent);}
.nt-items .nt-items__grid{padding-bottom:18px;}
@media (min-width:1280px){ .nt-items .nt-items__grid{grid-template-columns:repeat(8,minmax(0,1fr));} }

/* ④ 印刷通販②への導線ボタン */
.nt-compare__foot{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;padding:14px;background:var(--nt-cyan-bg);border-top:1px solid var(--nt-cyan-line);}
.nt-root .nt-compare__next{display:inline-flex;align-items:center;height:40px;padding-inline:24px;border-radius:20px;background:var(--nt-accent);color:#fff;font-size:14px;font-weight:800;white-space:nowrap;box-shadow:0 3px 8px rgba(255,89,38,.28);}
.nt-root .nt-compare__next:hover{color:#fff;opacity:.9;}
.nt-root .nt-compare__all2{font-size:12.5px;color:var(--nt-sub-cyan);white-space:nowrap;}

/* ADPRINT広告：バナー画像の float:right を解除（テキストとの重なり防止・縦積み） */
.nt-root .nt-ad img{float:none !important;margin:0 !important;}
/* ⑦の幅拡大はPCのみ（スマホは全幅維持） */
@media (max-width:767px){ .nt-ad{width:100%;} }

/* ==========================================================================
   FB追加対応：①見出し下余白 ②PICK UP弱化 ③価格比較の大きめ導線
   ========================================================================== */
/* ① アイテム見出しの下に余白 */
.nt-items__bar{margin-bottom:12px;padding-bottom:0;}

/* ② PICK UP を弱める（メインに見えないよう控えめに） */
.nt-fv__inner{gap:10px;}
.nt-pickup{gap:10px 12px;padding:2px 0;}
.nt-pickup__title{font-size:12px;color:var(--nt-sub-cyan);}
.nt-root .nt-pickup__lead{font-size:11.5px;font-weight:600;color:var(--nt-ink);}
.nt-pickup__desc{font-size:10.5px;color:var(--nt-sub);line-height:1.5;}
.nt-pickup__item{padding-left:12px;border-left-color:#e3edf4;}
.nt-tag{height:16px;font-size:9px;padding-inline:5px;}

/* ③ 価格比較への大きめ導線バンド */
.nt-pricecta{background:linear-gradient(90deg,#eaf6fc 0%,#f7fbfe 60%);border-bottom:1px solid #c2d7e8;}
.nt-pricecta__inner{display:flex;align-items:center;gap:20px;padding-block:16px;flex-wrap:wrap;}
.nt-pricecta__txt{display:flex;flex-direction:column;gap:3px;min-width:0;}
.nt-pricecta__ttl{font-size:19px;font-weight:900;color:var(--nt-ink-deep);}
.nt-pricecta__ttl i{color:var(--nt-nav);margin-right:6px;}
.nt-pricecta__sub{font-size:12.5px;color:var(--nt-sub-cyan);}
.nt-root .nt-pricecta__btn{
  margin-left:auto;display:inline-flex;align-items:center;height:48px;padding-inline:32px;
  border-radius:24px;background:var(--nt-accent);color:#fff;font-size:16px;font-weight:800;
  white-space:nowrap;box-shadow:0 4px 12px rgba(255,89,38,.3);flex:0 0 auto;
}
.nt-root .nt-pricecta__btn:hover{color:#fff;opacity:.92;}
@media (max-width:767px){
  .nt-pricecta__inner{gap:12px;padding-block:14px;}
  .nt-pricecta__ttl{font-size:16px;}
  .nt-pricecta__sub{font-size:11.5px;}
  .nt-root .nt-pricecta__btn{margin-left:0;width:100%;justify-content:center;height:46px;font-size:15px;}
}

/* ==========================================================================
   FB追加：バナーを横幅いっぱいに／ナビ「ホーム」を家アイコンに
   ========================================================================== */
/* バナー6枚を横幅いっぱいに広げて左右の余白を解消（PC。広告も大きく見える） */
@media (min-width:768px){
  .nt-banners__inner{grid-template-columns:repeat(6,minmax(0,1fr));justify-content:stretch;}
}

/* ナビ「ホーム」(menu-item-1625) を家アイコンのみに */
.nt-root .nt-nav__list > li.menu-item-1625 > a{font-size:0;}
.nt-root .nt-nav__list > li.menu-item-1625 > a::before{
  content:"\f015";font-family:"Font Awesome 6 Free";font-weight:900;font-size:17px;line-height:1;
}

/* ==========================================================================
   トップ：左メイン＋右PICK UPサイドバーの2カラム（現行サイト踏襲）
   ========================================================================== */
.nt-top2col{padding-top:14px;padding-bottom:6px;}
.nt-top2col__main{min-width:0;display:flex;flex-direction:column;gap:14px;}
.nt-top2col__side{min-width:0;}
@media (min-width:1024px){
  .nt-top2col{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start;}
}
@media (max-width:1023px){
  .nt-top2col__side{margin-top:14px;}
}

/* 左メイン内：バンド背景をやめカラム内に収める */
.nt-top2col__main .nt-banners{background:transparent;border:none;}
.nt-top2col__main .nt-banners__inner{padding-block:0;}
.nt-top2col__main .nt-items{background:transparent;border:none;}
.nt-top2col__main .nt-pricecta{border:1px solid #a9c6dc;border-radius:12px;overflow:hidden;}
.nt-top2col__main .nt-pricecta__inner{padding:16px 18px;}

/* アイテムグリッドはカラム幅に自動フィット（旧repeat(8)を上書き） */
.nt-items .nt-items__grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));}
@media (min-width:1280px){ .nt-items .nt-items__grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));} }

/* PICK UP：縦積みサイドバー（現行サイト風） */
.nt-pickup{display:block;background:#fff;border:1px solid var(--nt-border);border-radius:12px;overflow:hidden;padding:0;}
.nt-pickup__head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:10px 14px;background:var(--nt-cyan-bg);border-bottom:1px solid var(--nt-cyan-line);}
.nt-pickup__title{font-size:13px;font-weight:900;letter-spacing:.06em;color:var(--nt-ink-deep);}
.nt-root .nt-pickup__all{font-size:11px;}
.nt-pickup__item{display:block;padding:11px 14px;border-left:none;border-bottom:1px solid #d9e2eb;}
.nt-pickup__item:last-child{border-bottom:none;}
.nt-pickup__row{display:flex;gap:6px;align-items:flex-start;}
.nt-root .nt-pickup__lead{font-size:12.5px;font-weight:700;color:var(--nt-ink);line-height:1.45;}
.nt-pickup__desc{font-size:11px;color:var(--nt-sub);line-height:1.55;margin-top:3px;}

/* PICK UP：ブロックのゴツさを解消（囲み箱をやめ、細い下線見出し＋薄い区切りの軽いリストへ。文字サイズ・色は維持） */
.nt-pickup{border:none;border-radius:0;background:transparent;overflow:visible;}
.nt-pickup__head{background:transparent;border-bottom:2px solid #0074a8;padding:0 2px 7px;margin-bottom:2px;}
.nt-pickup__item{padding:10px 2px;border-bottom:1px solid #d9e2eb;}
.nt-pickup__item:last-child{border-bottom:none;}

/* ==========================================================================
   価格比較CTA：人気アイテムの最安値チップ（週次cronで事前集計した値を表示）
   ========================================================================== */
.nt-pricecta__prices{
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;
  padding:0 18px 14px;border-top:1px dashed #a9c6dc;margin-top:-2px;padding-top:12px;
}
.nt-pricecta__plabel{font-size:11.5px;font-weight:800;color:var(--nt-sub-cyan);white-space:nowrap;flex:0 0 auto;}
.nt-root .nt-pchip{
  display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px;
  border:1px solid var(--nt-border-soft);border-radius:15px;background:#fff;
  font-size:12px;color:var(--nt-ink);white-space:nowrap;
}
.nt-root .nt-pchip:hover{border-color:var(--nt-accent);color:var(--nt-ink);}
.nt-pchip__n{font-weight:700;}
.nt-pchip__p{color:#d1441c;font-weight:800;font-size:12.5px;}
.nt-pricecta__pnote{font-size:10.5px;color:var(--nt-sub);white-space:nowrap;margin-left:auto;}
@media (max-width:767px){
  .nt-pricecta__prices{padding:12px 14px 14px;gap:6px;}
  .nt-pricecta__pnote{margin-left:0;flex-basis:100%;}
}

/* ==========================================================================
   人気記事ランキング（おすすめ記事ブロックを置換）
   ========================================================================== */
.nt-card--rank .nt-card__link{position:relative;}
.nt-rankbadge{
  position:absolute;top:0;left:0;z-index:2;
  display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-bottom-right-radius:12px;
  background:var(--nt-ink-deep);color:#fff;font-size:16px;font-weight:900;line-height:1;
}
.nt-rankbadge--1{background:#e0a400;}
.nt-rankbadge--2{background:#8fa3b4;}
.nt-rankbadge--3{background:#b5793f;}

/* ==========================================================================
   仕上げ：比較表と価格CTAの「華奢さ」を解消（線＋構造の強化）
   ========================================================================== */
/* 比較表：外枠を少し太く、ヘッダー行の下に区切りを入れて構造を明確に */
.nt-compare{border-width:2px;}
/* thead の行は既存の tr:last-child ルールに負けるため、より高い詳細度で指定 */
.nt-table thead tr.nt-row--logo td,
.nt-table thead tr.nt-row--logo th{border-bottom:2px solid var(--nt-border);}
/* 印刷会社（ロゴ）行は白 */
.nt-table__logo{background:#fff;}
/* 「印刷会社」の見出し列セルは他の見出し列と同じ背景色を維持 */
/* 見出し列：背景と文字を少しはっきり */
.nt-table th[scope="row"]{background:#e9f1f8;color:#0d3f57;}
/* 本文セルの文字を気持ち濃く */
.nt-table td{color:#16283a;}
/* 会社名・送料は据え置き（既に強調済み） */

/* 価格CTA：枠を少し太く、背景の青みを一段乗せる */
.nt-top2col__main .nt-pricecta{border-width:2px;}
/* 価格CTAの背景は元に戻す */
.nt-pricecta{background:linear-gradient(90deg,#eaf6fc 0%,#f7fbfe 60%);}
.nt-pricecta__prices{border-top-color:#a9c6dc;}

/* PICK UP：見出しと「» 一覧」を同じ行に（一覧は右寄せ） */
.nt-pickup__head{flex-direction:row;align-items:baseline;justify-content:space-between;}
.nt-root .nt-pickup__all{margin-left:auto;white-space:nowrap;flex:0 0 auto;}

/* ==========================================================================
   スマホ：ロゴ上の空帯を非表示／PICK UP を比較表の下へ
   ========================================================================== */
@media (max-width:767px){
  /* 中身が無くなった上部帯は出さない */
  .nt-util{display:none;}

  /* .nt-top2col を display:contents で解除し、比較表(.nt-fv)の後に PICK UP を並べる */
  .nt-root--top{display:flex;flex-direction:column;}
  .nt-root--top .nt-top2col{display:contents;}
  .nt-root--top .nt-top2col__main{order:1;}
  .nt-root--top .nt-fv{order:2;}
  .nt-root--top .nt-top2col__side{order:3;}
  /* .nt-inner の左右余白が外れるため、各カラムに付け直す */
  .nt-root--top .nt-top2col__main,
  .nt-root--top .nt-top2col__side{padding-inline:var(--nt-gutter);}
  .nt-root--top .nt-top2col__side{margin-top:18px;}
}

/* ==========================================================================
   新マスコット（3D・紙＋虫眼鏡＋¥）採用時の調整
   ========================================================================== */
.nt-root .nt-brand__mascot{
  height:54px;width:auto;flex:0 0 auto;
  filter:none;                     /* 3Dで立体感があるため光彩は不要 */
}
.nt-brand__text{display:flex;flex-direction:column;gap:3px;min-width:0;}
.nt-brand__mark{font-size:25px;font-weight:900;color:var(--nt-ink-deep);line-height:1;letter-spacing:.03em;white-space:nowrap;}
.nt-brand__lead{font-size:11px;color:var(--nt-sub);line-height:1.4;}
@media (max-width:767px){
  .nt-root .nt-brand__mascot{height:42px;}
  .nt-brand__mark{font-size:20px;}
  .nt-brand__lead{display:none;}
}

/* スマホ：display:contents で失われた上下余白を戻す（ナビとバナーの間） */
@media (max-width:767px){
  .nt-root--top .nt-top2col__main{padding-top:14px;}
  .nt-root--top .nt-top2col__side{padding-bottom:6px;}
}

/* アイテムから探す：カードを一回り大きく（PC・スマホ共通） */
.nt-root .nt-item{
  min-height:48px;padding:0 13px;gap:9px;font-size:13px;border-radius:10px;
}
.nt-root .nt-item__icon{width:26px;height:26px;}
.nt-items .nt-items__grid{grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:10px;}
@media (min-width:1280px){
  .nt-items .nt-items__grid{grid-template-columns:repeat(auto-fill,minmax(172px,1fr));}
}
@media (max-width:767px){
  .nt-root .nt-item{min-height:52px;font-size:13px;padding:0 12px;}
  .nt-root .nt-item__icon{width:28px;height:28px;}
  .nt-items .nt-items__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
}

/* アイテムカード：文字が切れないよう幅と内側の詰めを調整 */
.nt-items .nt-items__grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));}
@media (min-width:1280px){
  .nt-items .nt-items__grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));}
}
@media (max-width:767px){
  .nt-root .nt-item{padding:0 10px;gap:7px;font-size:12.5px;}
  .nt-root .nt-item__icon{width:24px;height:24px;}
}

/* スマホ：比較表の外枠を外してカード幅を最大化 */
@media (max-width:767px){
  .nt-compare{border:none;border-radius:0;background:transparent;overflow:visible;}
  .nt-compare__bar{border-radius:10px;margin-bottom:10px;}
  .nt-cocards{padding:0;gap:10px;background:transparent;}
}

/* フッターリンク2列：見出し右にカテゴリ説明／タイトルは幅に応じて省略 */
.nt-flist__head{gap:8px;}
.nt-flist__note{font-size:11px;color:var(--nt-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.nt-root .nt-flist__item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media (max-width:900px){
  .nt-flist__note{display:none;}
}

/* (3) 比較表：印刷会社行の下線は通常の太さに戻す */
.nt-table thead tr.nt-row--logo td,
.nt-table thead tr.nt-row--logo th{border-bottom:1px solid var(--nt-line);}

/* (4) フッターリスト2列：小さいサムネイル付きに */
.nt-root .nt-flist__item{
  display:flex;align-items:center;gap:10px;white-space:normal;overflow:visible;
}
.nt-root .nt-flist__thumb{
  width:52px;height:36px;flex:0 0 auto;object-fit:cover;border-radius:5px;
  border:1px solid var(--nt-border-soft);background:#fff;
}
.nt-flist__t{
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.5;
}

/* (2) フッターのマスコット */
.nt-root .nt-footer__mascot{height:52px;width:auto;opacity:.97;}

/* フッター：マスコット＋サイト名のロックアップ */
.nt-footer__brand{display:flex;align-items:center;gap:12px;}
.nt-footer__name{font-size:20px;font-weight:900;color:#fff;letter-spacing:.04em;line-height:1;white-space:nowrap;}
@media (max-width:767px){
  .nt-footer__name{font-size:17px;}
  .nt-root .nt-footer__mascot{height:44px;}
}

/* フッターリスト2列：はみ出しを止めて省略記号を正しく効かせる
   （grid/flex の子は既定で min-width:auto のため、長いタイトルで横に広がっていた） */
.nt-flist{min-width:0;}
.nt-flist ul{min-width:0;}
.nt-flist li{min-width:0;max-width:100%;}
.nt-root .nt-flist__item{max-width:100%;}

/* PICK UP：カテゴリ名タグ（PRでも新着でもない記事用） */
.nt-tag--cat{background:#5b7186;}

/* ==========================================================================
   ファーストビュー圧縮：ヘッダーとナビを省スペース化
   （比較表＝最重要の広告枠をファーストビューに戻すため）
   ========================================================================== */
/* ロゴ帯を薄く */
.nt-head__inner{padding-block:8px;gap:16px;}
.nt-root .nt-brand__mascot{height:40px;}
.nt-brand__mark{font-size:21px;}
.nt-brand__lead{display:none;}          /* サブコピーは省略 */

/* 322サイトはコンパクトに（1stビューで場所を取らせない） */
.nt-trust{flex-direction:row;align-items:baseline;gap:6px;padding-inline:14px;}
.nt-trust__label{font-size:10px;}
.nt-trust__num{font-size:22px;}
.nt-trust__unit{font-size:11px;}

/* ナビも薄く */
.nt-nav__inner{min-height:40px;}
.nt-root .nt-nav__list > li > a{height:40px;font-size:13.5px;padding-inline:14px;}

/* サイト内検索はアイコン化してナビ内に格納（PCでも） */
@media (min-width:768px){
  .nt-search{order:3;flex-basis:100%;display:none;margin:0;padding-bottom:6px;}
  .nt-nav__inner.is-searchopen .nt-search{display:flex;}
  .nt-root .nt-navsearch-toggle{
    display:inline-flex;order:2;flex:0 0 auto;align-items:center;justify-content:center;
    width:40px;height:40px;margin-left:auto;background:transparent;border:none;
    color:#fff;font-size:15px;cursor:pointer;
  }
  .nt-root .nt-navsearch-toggle:hover{background:rgba(255,255,255,.14);color:#fff;}
  .nt-nav__inner{flex-wrap:wrap;align-items:center;}
  .nt-search__field{width:100%;height:34px;}
  .nt-search__submit{height:34px;}
}

/* バナー列も少し詰める */
.nt-banners__inner{padding-block:10px;}

/* 価格を比較する CTA：オレンジ→青系（オレンジは他の強調と競合しないよう温存） */
.nt-root .nt-pricecta__btn{
  background:#1477b0;
  box-shadow:0 4px 12px rgba(20,119,176,.28);
}
.nt-root .nt-pricecta__btn:hover{background:#0f6396;}

/* モバイル：ヘッダー広告（ADPRINT）を少し小さく
   ※元画像311×55に対し343pxまで引き伸ばされていたため、原寸以下に収める */
@media (max-width:767px){
  .nt-ad{width:100%;max-width:272px;margin-inline:auto;}
  .nt-root .nt-ad p{font-size:10.5px;text-align:center;}
}

/* 印刷通販②の比較を見る：CTAと揃えて青系に（オレンジは各社への送客用に温存） */
.nt-root .nt-compare__next{
  background:#1477b0;
  box-shadow:0 3px 8px rgba(20,119,176,.26);
}
.nt-root .nt-compare__next:hover{background:#0f6396;color:#fff;}

/* ==========================================================================
   ロゴ：虫眼鏡マーク＋ロゴタイプ（シンプル構成）
   ========================================================================== */
.nt-root .nt-brand__mark-icon{height:34px;width:auto;flex:0 0 auto;}
.nt-brand__mark{font-size:22px;}
@media (max-width:767px){
  .nt-root .nt-brand__mark-icon{height:28px;}
  .nt-brand__mark{font-size:19px;}
}
/* フッター：濃紺地なのでレンズの輪を白に反転 */
.nt-root .nt-footer__mark{height:34px;width:auto;filter:brightness(0) invert(1);opacity:.92;}

/* ロゴ：マークとロゴタイプの間隔を詰める */
.nt-root .nt-brand{gap:7px;}
@media (max-width:767px){ .nt-root .nt-brand{gap:6px;} }

/* ロゴタイプ：専用フォント（暫定。最終ロゴはアウトライン化SVGに差し替え予定） */
.nt-brand__mark{
  font-family:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  font-weight:900;
  letter-spacing:.04em;
}
.nt-footer__name{
  font-family:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  font-weight:900;
}

/* フッター：白版マークをそのまま使う（CSSの色反転は不要＝レンズが潰れるため解除） */
.nt-root .nt-footer__mark{filter:none;opacity:1;}

/* ロゴタイプの色をナビ帯の色に合わせる */
.nt-brand__mark{color:var(--nt-nav);}

/* ロゴ：ロゴタイプに対してマークが大きかったため縮小 */
.nt-root .nt-brand__mark-icon{height:27px;}
.nt-root .nt-footer__mark{height:26px;}
@media (max-width:767px){
  .nt-root .nt-brand__mark-icon{height:23px;}
  .nt-root .nt-footer__mark{height:23px;}
}

/* ロゴタイプ：ナビ色(#3279ad)は明るすぎたため、濃紺寄りの中間色に */
.nt-brand__mark{color:#1f5c82;}

/* ヘッダーナビ：文字を約5%拡大（上下位置はもともとズレていないため補正しない） */
.nt-root .nt-nav__list > li > a{
  font-size:14.2px;      /* 13.5px → 約+5% */
}

/* ヘッダーナビ：下線用の3px枠のぶん文字が上寄りになるため、上に余白を足して中央へ（3pxだと僅かに下がるため2px） */
.nt-root .nt-nav__list > li > a{padding-top:2px;}

/* フッター：マークとロゴタイプの間隔を詰める（12px→6px） */
.nt-footer__brand{gap:6px;}

/* ==========================================================================
   下層ページ対応（本番化で判明）：旧レイアウトのfloatを新フッター前で解除
   旧テンプレートはサイドバーをfloatで組んでおり、解除しないとフッターの
   キャンペーン欄等にサイドバーが重なる
   ========================================================================== */
.nt-root{clear:both;}

/* 旧デザインの装飾背景（bg_page.png / bg_body.png）＝ナビ下の青い帯を無効化 */
body.bodyNew{background-image:none !important;}
#page.pageNew{background-image:none !important;}
