/* ツール共通スタイル（/hp/tools/） */
/* サイトのヘッダーが固定なので、その分の余白を確保する */
.tool-hero{background:linear-gradient(180deg,#fff8f1,#fff);padding:130px 20px 34px;text-align:center}
.tool-hero h1{font-size:30px;font-weight:800;color:#222;margin-bottom:12px;line-height:1.45}
.tool-hero p{font-size:15.5px;color:#666;line-height:1.9;max-width:760px;margin:0 auto}
.tool-wrap{max-width:900px;margin:0 auto;padding:0 20px 64px}
.tool-panel{background:#fff;border:2px solid #ffe2c7;border-radius:14px;padding:26px;margin-bottom:22px}
.tool-row{margin-bottom:20px}
.tool-row>label{display:block;font-size:14px;font-weight:800;color:#a5521a;margin-bottom:9px;letter-spacing:.03em}
.tool-opts{display:flex;flex-wrap:wrap;gap:8px}
.tool-opts button{border:2px solid #ffd9b3;background:#fffaf5;color:#5a4632;border-radius:9px;
  padding:10px 15px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.tool-opts button[aria-pressed="true"]{background:#FF7500;border-color:#FF7500;color:#fff}
.tool-input{width:100%;border:2px solid #ffd9b3;border-radius:9px;padding:12px 14px;font-size:16px;font-family:inherit}
.tool-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tool-out{background:#fffaf5;border:2px solid #ffe2c7;border-radius:12px;padding:22px;
  white-space:pre-wrap;font-size:15px;line-height:2;color:#333;min-height:180px}
.tool-actions{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.tool-btn{background:#FF7500;color:#fff;border:none;border-radius:9px;padding:13px 22px;
  font-size:15px;font-weight:800;cursor:pointer;font-family:inherit}
.tool-btn--sub{background:#fff;color:#FF7500;border:2px solid #FF7500}
.tool-note{font-size:13px;color:#8a7666;line-height:1.85;margin-top:14px}
.tool-link{margin-top:26px;padding:18px 20px;background:#fff4e8;border-radius:11px;font-size:14px;line-height:1.9;color:#5a4632}
.tool-link a{color:#FF7500;font-weight:700}
.tool-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:8px}
.tool-card{display:block;border:2px solid #ffe2c7;border-radius:14px;padding:22px;background:#fffaf5;text-decoration:none}
.tool-card h2{font-size:18px;font-weight:800;color:#FF7500;margin-bottom:9px}
.tool-card p{font-size:14px;line-height:1.85;color:#555}
.tool-card .badge{display:inline-block;font-size:11.5px;font-weight:800;background:#FF7500;color:#fff;
  padding:3px 10px;border-radius:20px;margin-bottom:10px}
@media(max-width:600px){
  .tool-hero{padding-top:100px}
  .tool-hero h1{font-size:23px}.tool-panel{padding:18px}.tool-grid2{grid-template-columns:1fr}
  .tool-opts button{flex:1 1 calc(50% - 4px)}
}

/* サイト健康診断 */
.sc-form{display:flex;gap:10px;flex-wrap:wrap}
.sc-form .tool-input{flex:1;min-width:240px}
.sc-head{background:#fff8f1;border:2px solid #ffd9b3;border-radius:11px;padding:18px 20px;margin-bottom:18px}
.sc-url{font-size:13px;color:#8a7666;word-break:break-all;margin-bottom:6px}
.sc-score{font-size:22px;font-weight:800;color:#FF7500;margin-bottom:4px}
.sc-msg{font-size:14px;color:#5a4632;line-height:1.8}
.sc-list{display:grid;gap:10px}
.sc-item{display:flex;gap:13px;border:2px solid #eee;border-radius:10px;padding:14px 16px;background:#fff}
.sc-item.is-ng{border-color:#ffc9a0;background:#fffaf5}
.sc-mark{flex:none;width:26px;height:26px;border-radius:50%;background:#e6f4ea;color:#1e7a3c;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px}
.sc-item.is-ng .sc-mark{background:#fdeaea;color:#c0392b}
.sc-body{flex:1;min-width:0}
.sc-name{font-size:15px;font-weight:800;color:#333;margin-bottom:3px}
.sc-val{font-size:13px;font-weight:700;color:#8a7666;margin-left:10px}
.sc-desc{font-size:13px;color:#777;line-height:1.75}
.sc-more{display:inline-block;margin-top:7px;font-size:13px;font-weight:700;color:#FF7500}
.sc-err{background:#fdeaea;color:#c0392b;border-radius:10px;padding:16px;font-size:14.5px;line-height:1.8}
.sc-loading{color:#8a7666;font-size:14.5px;padding:14px 0}
.sc-done{background:#e6f4ea;color:#1e7a3c;border-radius:10px;padding:16px;font-size:14.5px;line-height:1.8}

/* 画像を軽くする */
.io-drop{border:2px dashed #ffd9b3;border-radius:14px;background:#fffaf5;padding:34px 20px;text-align:center;transition:.15s}
.io-drop.is-over{background:#fff1e0;border-color:#FF7500}
.io-drop p{font-size:15px;color:#5a4632;line-height:1.85;margin-bottom:14px}
.io-file-btn{display:inline-block;background:#FF7500;color:#fff;border-radius:9px;padding:13px 26px;
  font-size:15px;font-weight:800;cursor:pointer}
.io-file-btn input{display:none}
.io-hint{font-size:13px;color:#8a7666;margin-top:12px;line-height:1.8}
.io-sum{margin:18px 0 10px;font-size:16px;font-weight:800;color:#FF7500;text-align:center}
.io-list{display:grid;gap:10px}
.io-row{display:flex;align-items:center;gap:14px;border:2px solid #ffe2c7;border-radius:11px;padding:14px 16px;background:#fff}
.io-row.is-err{border-color:#f3c9c9;background:#fdf5f5}
.io-body{flex:1;min-width:0}
.io-name{font-size:14.5px;font-weight:800;color:#333;margin-bottom:4px;word-break:break-all}
.io-meta{font-size:13px;color:#7d6a58;line-height:1.7}
.io-err{font-size:13px;color:#c0392b}
.io-warn{font-size:12.5px;color:#a5521a;margin-top:5px}
.io-bar{height:6px;background:#ffe2c7;border-radius:99px;margin-top:8px;overflow:hidden}
.io-bar span{display:block;height:100%;background:#FF7500;border-radius:99px}
.io-dl{flex:none;background:#fff;border:2px solid #FF7500;color:#FF7500;border-radius:8px;
  padding:10px 16px;font-size:13.5px;font-weight:800;text-decoration:none;white-space:nowrap}
@media(max-width:600px){
  .io-row{flex-wrap:wrap}
  .io-dl{width:100%;text-align:center}
}

/* 画像リサイズ: プリセットのグループ分け・切り取り設定・結果のサムネ */
.io-glabel{font-size:13px;font-weight:800;color:#8a7666;margin:14px 0 8px;display:flex;
  align-items:baseline;gap:8px;flex-wrap:wrap}
.io-glabel:first-child{margin-top:0}
.io-glabel span{font-size:12px;font-weight:600;color:#a5937f}
.tool-opts button em{display:block;font-style:normal;font-size:11px;font-weight:700;
  opacity:.72;margin-top:3px;letter-spacing:.02em}
.io-fitrow{margin-top:14px;padding:14px 16px;background:#fff8f1;border:2px solid #ffe2c7;border-radius:11px;
  display:grid;gap:12px}
.io-fitrow[hidden]{display:none}
.io-fitline{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.io-fitline[hidden]{display:none}
.io-fitlabel{font-size:13px;font-weight:800;color:#8a7666;flex:none}
.tool-opts.io-sub button{padding:8px 13px;font-size:13px;border-width:2px}
.io-thumb{flex:none;width:76px;height:auto;max-height:76px;object-fit:contain;border-radius:7px;
  background:#f4f1ee;border:1px solid #eee}
@media(max-width:600px){
  .io-fitline{align-items:flex-start;flex-direction:column;gap:7px}
  .tool-opts.io-sub button{flex:0 0 auto}
  .io-thumb{width:58px;max-height:58px}
}

/* QRコード作成 */
.qr-field{margin-bottom:14px}
.qr-field:last-child{margin-bottom:0}
.qr-field label{display:block;font-size:13.5px;font-weight:800;color:#5a4632;margin-bottom:6px}
.qr-help{font-size:12.5px;color:#8a7666;line-height:1.8;margin-top:7px}
.qr-help a{color:#FF7500;font-weight:700}
.qr-mmrow{display:flex;align-items:center;gap:9px;margin-top:11px;font-size:13.5px;color:#5a4632;font-weight:700}
.qr-mminput{width:96px;flex:none;padding:9px 11px;font-size:15px}
.qr-judge{margin:18px 0 0}
.qr-judge:empty{margin:0}
.qr-judge>*{max-width:640px;margin-left:auto;margin-right:auto}
.qr-judge-head{font-size:15.5px;font-weight:800;margin-bottom:5px;text-align:center}
.qr-judge-body{font-size:13.5px;line-height:1.9;color:#5a4632;text-align:center}
.qr-judge.is-ok .qr-judge-head{color:#1e7a3c}
.qr-judge.is-warn .qr-judge-head{color:#a5521a}
.qr-judge.is-ng .qr-judge-head{color:#c0392b}
.qr-stage{margin-top:16px;display:flex;justify-content:center;align-items:center;min-height:200px}
.qr-canvas{width:260px;height:260px;max-width:78vw;image-rendering:pixelated;
  border:2px solid #ffe2c7;border-radius:12px;background:#fff}
.qr-empty{font-size:14px;color:#8a7666}
.qr-actions{margin-top:16px}
.qr-info{text-align:center;font-size:12.5px;color:#8a7666;margin-bottom:12px}
.qr-more{margin-top:18px;border:2px solid #ffe2c7;border-radius:11px;background:#fffaf5}
.qr-more summary{padding:13px 16px;font-size:13.5px;font-weight:800;color:#5a4632;cursor:pointer}
.qr-morebody{padding:0 16px 16px}
.qr-logorow{display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.qr-filebtn{padding:9px 18px;font-size:13.5px}
.qr-logoname{font-size:12.5px;color:#7d6a58;word-break:break-all}
.qr-linkbtn{background:none;border:none;color:#FF7500;font-weight:700;font-size:12.5px;
  cursor:pointer;font-family:inherit;text-decoration:underline;padding:0}
@media(max-width:600px){
  .qr-canvas{width:230px;height:230px}
  .qr-mmrow{font-size:13px}
}

/* 検索結果プレビュー */
.sr-area{resize:vertical;min-height:78px;line-height:1.8;font-family:inherit}
.sr-devrow{display:flex;justify-content:center;margin-top:20px}
.sr-h{font-size:14px;font-weight:800;color:#8a7666;margin:26px 0 10px;text-align:center}
.sr-serpwrap{display:flex;justify-content:center}
.sr-serp{background:#fff;border:2px solid #ffe2c7;border-radius:12px;padding:18px 20px;width:100%}
.sr-siterow{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.sr-favi{flex:none;width:26px;height:26px;border-radius:50%;background:#f1ece7;border:1px solid #e6ddd4}
.sr-sitecol{display:flex;flex-direction:column;min-width:0}
.sr-site{font-size:13px;color:#202124;line-height:1.4}
.sr-crumb{font-size:12px;color:#5f6368;line-height:1.4;word-break:break-all}
.sr-title{color:#1a0dab;line-height:1.35;font-weight:400;margin-bottom:5px;
  display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.sr-desc{color:#4d5156;line-height:1.62;
  display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.sr-judges{display:grid;gap:9px;margin-top:16px;max-width:640px;margin-left:auto;margin-right:auto}
.sr-judges:empty{margin-top:0}
.sr-judge{border:2px solid #e6f4ea;background:#f6fbf7;border-radius:10px;padding:12px 15px;
  font-size:13px;line-height:1.85;color:#5a4632}
.sr-judge strong{display:block;font-size:13.5px;margin-bottom:2px;color:#1e7a3c}
.sr-judge.is-cut{border-color:#ffc9a0;background:#fffaf5}
.sr-judge.is-cut strong{color:#c0392b}
.sr-judge.is-empty{border-color:#eee;background:#fafafa}
.sr-judge.is-empty strong{color:#8a7666}
.sr-judge a{color:#FF7500;font-weight:700}
.sr-assume{font-size:12px;color:#a5937f;line-height:1.8;text-align:center;margin-top:11px}
.sr-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.sr-card{border:2px solid #ffe2c7;border-radius:12px;overflow:hidden;background:#fff}
.sr-cardname{font-size:11.5px;font-weight:800;color:#8a7666;padding:9px 13px 7px;background:#fffaf5}
.sr-cardimg{aspect-ratio:1200/630;background:#f1ece7 center/cover no-repeat}
.sr-cardimg.is-none{background:repeating-linear-gradient(45deg,#f4f1ee,#f4f1ee 9px,#eae5df 9px,#eae5df 18px)}
.sr-cardbody{padding:11px 13px}
.sr-carddom{font-size:11.5px;color:#5f6368;margin-bottom:3px}
.sr-cardtitle{font-size:14px;font-weight:700;color:#202124;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sr-carddesc{font-size:12.5px;color:#5f6368;line-height:1.55;margin-top:3px;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.sr-cardbody--fb{background:#f2f3f5}
@media(max-width:600px){
  .sr-serp{padding:15px 16px}
  .sr-h{margin-top:22px}
}

/* アイキャッチ作成 */
.ec-swatches{display:flex;gap:9px;flex-wrap:wrap}
.ec-swatch{width:50px;height:38px;border-radius:9px;border:3px solid #ffe2c7;cursor:pointer;padding:0;
  position:relative;overflow:hidden}
.ec-swatch[aria-pressed="true"]{border-color:#FF7500;box-shadow:0 0 0 2px #ffe2c7}
.ec-scalerow{display:flex;align-items:center;gap:11px;margin-top:14px;font-size:13.5px;
  font-weight:700;color:#5a4632}
.ec-scalerow input[type=range]{flex:1;max-width:240px;accent-color:#FF7500}
.ec-scaleval{font-variant-numeric:tabular-nums;min-width:44px}
.ec-stage{margin-top:20px;display:flex;justify-content:center}
.ec-canvas{max-width:100%;max-height:62vh;width:auto;height:auto;
  border:2px solid #ffe2c7;border-radius:12px;background:#fff}
@media(max-width:600px){
  .ec-swatch{width:44px;height:34px}
  .ec-canvas{max-height:52vh}
}

/* ポリシー文書ジェネレーター */
.lg-uses{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:9px}
.lg-check{display:flex;align-items:flex-start;gap:10px;border:2px solid #ffe2c7;border-radius:10px;
  padding:12px 14px;background:#fffaf5;cursor:pointer}
.lg-check--wide{margin-top:13px}
.lg-check input{margin-top:3px;flex:none;width:17px;height:17px;accent-color:#FF7500}
.lg-check span{display:block;min-width:0}
.lg-check strong{display:block;font-size:13.5px;font-weight:800;color:#5a4632;line-height:1.5}
.lg-check em{display:block;font-style:normal;font-size:12px;color:#8a7666;margin-top:3px;line-height:1.6}
.lg-note{margin-top:14px}
.lg-outhead{display:flex;justify-content:space-between;align-items:center;gap:14px;
  flex-wrap:wrap;margin:24px 0 12px}
.lg-out{max-height:520px;overflow:auto;font-size:13.5px;line-height:1.95;
  font-family:inherit;white-space:pre-wrap;word-break:break-word}
.lg-left{background:#fffaf5;border:2px solid #ffc9a0;border-radius:10px;padding:11px 14px;
  font-size:12.5px;line-height:1.8;color:#a5521a;margin-bottom:11px}
.tool-opts button.is-dim{opacity:.45}
.tool-opts button.is-dim[aria-pressed="true"]{opacity:1}
@media(max-width:600px){
  .lg-outhead{flex-direction:column;align-items:stretch}
  .lg-out{max-height:400px;font-size:13px}
}

/* 404ページ */
.nf-code{font-size:56px;font-weight:900;color:#ffd9b3;line-height:1;margin-bottom:10px;letter-spacing:.04em}
.nf-links{list-style:none;margin:12px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px}
.nf-links a{display:block;padding:11px 14px;background:#fff;border:2px solid #ffe2c7;border-radius:9px;
  text-decoration:none;font-size:14px;font-weight:700;color:#5a4632}
.nf-links a:hover{border-color:#FF7500}