{"id":11,"date":"2026-11-01T00:45:03","date_gmt":"2026-10-31T15:45:03","guid":{"rendered":"https:\/\/tools.bl-forest.com\/?page_id=11"},"modified":"2026-11-01T01:42:50","modified_gmt":"2026-10-31T16:42:50","slug":"%e3%82%b5%e3%83%96%e3%83%8d%e3%83%83%e3%83%88%e3%83%9e%e3%82%b9%e3%82%af%e8%a8%88%e7%ae%97%e3%83%84%e3%83%bc%e3%83%ab","status":"publish","type":"page","link":"https:\/\/tools.bl-forest.com\/?page_id=11","title":{"rendered":"\u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af\u8a08\u7b97\u30c4\u30fc\u30eb"},"content":{"rendered":"\n<style>#subnet-lab-tool{max-width:none!important;width:100%;display:block}<\/style>\n<div id=\"subnet-lab-tool\"><\/div>\n<script>\n<!--\n\n(function(){\nconst host=document.getElementById(\"subnet-lab-tool\");if(!host||host.shadowRoot)return;const root=host.attachShadow({mode:\"open\"});\nroot.innerHTML=\"<style>:host{--ink:#202d52;--muted:#637785;--teal:#273e8e;--line:#dce5e8;--paper:#ffffff;--mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace}*{box-sizing:border-box}:host{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans JP',sans-serif}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #4964bc;outline-offset:4px}header{max-width:1240px;margin:auto;padding:28px 40px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:26px}.brand{font-weight:850;letter-spacing:.02em;color:var(--ink);text-decoration:none;font-size:19px}.brand>span:not(.mark){font-weight:400}.mark{display:inline-grid;place-items:center;background:var(--ink);color:#ffffff;border-radius:8px;width:32px;height:32px;margin-right:8px}.header-note{font-size:10px;letter-spacing:.13em;color:var(--muted)}.local{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:11px}.local i{width:6px;height:6px;background:#273e8e;border-radius:50%}main{max-width:1160px;margin:auto;padding:0 24px}.intro{padding:58px 0 36px;position:relative}.eyebrow{font-size:10px;font-weight:750;letter-spacing:.16em;color:var(--teal);margin:0 0 20px}.eyebrow span{float:right;color:#7f919a}h1{font-size:43px;line-height:1.4;letter-spacing:.02em;font-weight:750;margin:0 0 26px}h1 em{font-style:normal;color:var(--teal)}.lede{font-size:13px;line-height:1.9;color:var(--muted);margin:0}.workspace{display:grid;grid-template-columns:390px 1fr;gap:26px;align-items:start}.input-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px}.section-heading{display:flex;align-items:center;gap:10px}.step{font:11px var(--mono);color:var(--teal);background:#edf1fc;border-radius:4px;padding:5px 7px}.section-heading h2{font-size:15px;margin:0;font-weight:700}.tag{margin-left:auto;font:10px var(--mono);border:1px solid var(--line);padding:4px 8px;border-radius:4px;color:var(--muted)}form{margin-top:27px}label{display:block;font-size:12px;font-weight:650;margin:20px 0 9px}label small{font-size:10px;font-weight:400;color:var(--muted);float:right}input{width:100%;background:#f8f9fd;border:1px solid #cbd8dd;border-radius:7px;padding:14px 12px;color:var(--ink);font:17px var(--mono);min-width:0}input::placeholder{font-size:12px}.help{font-size:10px;color:var(--muted);line-height:1.7;margin:8px 0 0}.preset-label{font-size:10px;color:var(--muted);margin:25px 0 10px}.presets{display:flex;gap:7px;flex-wrap:wrap}.presets button{border:1px solid var(--line);background:white;color:var(--muted);font:12px var(--mono);padding:8px 10px;border-radius:5px}.presets button:hover,.presets button.active{border-color:var(--teal);color:var(--teal);background:#edf1fc}.calculate{margin-top:25px;width:100%;border:0;background:var(--teal);color:#fff;font-size:13px;font-weight:650;padding:15px;border-radius:7px;text-align:left}.calculate span{float:right;font-size:18px}.calculate:hover{background:#1c2d68}.privacy{display:flex;gap:9px;border-top:1px solid var(--line);margin-top:25px;padding-top:16px;color:var(--muted);font-size:10px;line-height:1.9}.privacy>span{color:var(--teal);font-size:19px}.privacy p{margin:0}.result-heading{display:flex;align-items:center;justify-content:space-between;margin:3px 0 16px}.copy{font-size:11px;border:0;background:none;color:var(--muted);padding:8px}.copy span{margin-left:6px;font-size:16px}.copy:hover{color:var(--teal)}.copy:disabled{opacity:.45;cursor:not-allowed}.status{font-size:11px;margin:0;color:var(--teal)}.status:not(:empty){margin-bottom:10px}.network-card{padding:24px 27px;background:#273e8e;border-radius:12px;color:white;background-image:linear-gradient(120deg,#273e8e,#273e8e);overflow:hidden}.network-top{display:flex;justify-content:space-between;align-items:center;font:10px var(--mono);letter-spacing:.13em;color:#e4e9ff}.network-top span:last-child{border:1px solid #9fafe6;border-radius:4px;padding:5px 8px;letter-spacing:0}.network-value{font:clamp(23px,3vw,36px) var(--mono);margin:20px 0;color:#ffffff;white-space:nowrap;letter-spacing:-.04em}.network-bottom{display:flex;justify-content:space-between;color:#e4e9ff;font-size:10px}.mini-line{color:#d4ddff}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}.metrics>div{padding:18px 22px;background:#fff;border:1px solid var(--line);border-radius:9px}.metrics span{display:block;font-size:11px;color:var(--muted)}.metrics strong{display:block;font:clamp(19px,2.8vw,29px) var(--mono);letter-spacing:-.05em;margin:9px 0 5px}.metrics small{font:10px var(--mono);color:var(--muted)}.details{margin:0;background:#fff;border:1px solid var(--line);border-radius:9px;padding:0 22px}.details>div{display:flex;justify-content:space-between;gap:10px;padding:15px 0;border-bottom:1px solid #edf1f2}.details>div:last-child{border:0}.details dt{font-size:11px;color:var(--muted)}.details dd{font:14px var(--mono);margin:0}.details .range{display:block}.range dd{display:flex;gap:13px;margin-top:12px;flex-wrap:wrap}.range-arrow{color:#8da1aa}.notice{font-size:10px;color:var(--muted);line-height:1.75;margin:12px 0 0}#error{font-size:12px;line-height:1.7;background:#fff0eb;color:#a94022;padding:12px;border-radius:6px}#result-body.stale{opacity:.38}.binary-section{border:1px solid var(--line);background:white;border-radius:10px;margin:28px 0 42px}summary{cursor:pointer;list-style:none;padding:18px 22px;display:flex;justify-content:space-between;font-size:13px}summary::-webkit-details-marker{display:none}summary .step{margin-right:12px}summary small{margin-left:12px;color:var(--muted);font:10px var(--mono)}.expand{color:var(--teal)}details[open] .expand{transform:rotate(45deg)}.binary-content{border-top:1px solid var(--line);padding:18px 22px;overflow:auto}.legend{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px;margin:0 0 17px}.legend i{width:8px;height:8px;background:var(--teal)}.legend .host{background:#a6b4bd;margin-left:15px}.binary-row{display:flex;align-items:center;gap:25px;margin-bottom:12px;min-width:580px}.binary-row>span{font-size:10px;min-width:105px;color:var(--muted)}.bits{font:15px var(--mono);letter-spacing:1px}.bits span{color:var(--teal)}.bits .host-bit{color:#8a9ba6}.bits b{font-weight:400;margin-right:9px}.reference{display:grid;grid-template-columns:1fr 1.3fr;gap:45px;padding-bottom:40px}.reference .eyebrow{margin-bottom:12px}.reference h2{font-size:20px;margin:0 0 13px}.reference p:not(.eyebrow){font-size:11px;color:var(--muted);line-height:1.8}.table-wrap{border:1px solid var(--line);border-radius:9px;overflow:hidden}table{width:100%;border-collapse:collapse;font-size:11px;text-align:left}th{font-weight:500;background:#edf1fc;padding:10px 15px;color:var(--muted)}td{padding:10px 15px;border-top:1px solid var(--line);font-family:var(--mono)}td:last-child,th:last-child{text-align:right}td button{background:none;border:0;color:var(--teal);font:inherit;padding:3px 0;text-decoration:underline;text-underline-offset:3px}footer{border-top:1px solid var(--line);padding:25px 0 30px;display:flex;align-items:center;gap:25px;color:var(--muted);font-size:10px}footer .brand{font-size:13px}footer>span:last-child{margin-left:auto;font-family:var(--mono)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:760px){header{padding:20px 22px}.header-note{display:none}main{padding:0 20px}.intro{padding:38px 0 28px}h1{font-size:32px}.lede{font-size:12px}.eyebrow{font-size:8px}.workspace{grid-template-columns:1fr;gap:26px}.input-card{padding:22px}.network-value{font-size:32px}.metrics strong{font-size:27px}.reference{grid-template-columns:1fr;gap:14px}.binary-section{margin-bottom:30px}summary small{display:none}footer{flex-wrap:wrap;gap:10px}footer p{margin:0}footer>span:last-child{width:100%;margin-left:0}.local{font-size:9px}.brand{font-size:17px}}@media(max-width:370px){.network-value{font-size:27px}.metrics{gap:8px}.metrics>div{padding:16px 13px}.metrics strong{font-size:22px}.local{display:none}.details dd{font-size:12px}th,td{padding:10px}}\\nheader{background:#273e8e;color:#fff}header .brand,header .header-note,header .local{color:#fff}header .mark{background:#fff;color:#273e8e}header .local i{background:#fff}.network-card{background-image:none}header{flex-wrap:wrap;gap:12px}header .brand{max-width:100%;white-space:normal}<\/style><header><a class=\\\"brand\\\" href=\\\"https:\/\/tools.bl-forest.com\/\\\" aria-label=\\\"Blue Forest LAB \u30db\u30fc\u30e0\\\"><span class=\\\"mark\\\">\u2318<\/span> Blue Forest <span>LAB<\/span><\/a><span class=\\\"header-note\\\">NETWORK ENGINEER\u2019S TOOLKIT<\/span><span class=\\\"local\\\"><i><\/i> \u30d6\u30e9\u30a6\u30b6\u5185\u3067\u8a08\u7b97<\/span><\/header><main>\\n<section class=\\\"intro\\\"><p class=\\\"eyebrow\\\">IPv4 SUBNET CALCULATOR <span>01 \/ TOOLS<\/span><\/p><h1>IPV4\u306e\u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af\u8a08\u7b97\u30da\u30fc\u30b8<\/h1><p class=\\\"lede\\\">IP \u30a2\u30c9\u30ec\u30b9\u3068\u30d7\u30ec\u30d5\u30a3\u30c3\u30af\u30b9\u304b\u3089\u3001\u5fc5\u8981\u306a\u60c5\u5831\u3092\u3059\u3050\u306b\u3002<br class=\\\"desktop\\\">\u8a2d\u8a08\u306b\u3082\u3001\u8a2d\u5b9a\u78ba\u8a8d\u306b\u3082\u4f7f\u3048\u308b\u30b5\u30d6\u30cd\u30c3\u30c8\u8a08\u7b97\u30c4\u30fc\u30eb\u3002<\/p><\/section>\\n<div class=\\\"workspace\\\"><section class=\\\"input-card\\\" aria-labelledby=\\\"input-title\\\"><div class=\\\"section-heading\\\"><span class=\\\"step\\\">01<\/span><h2 id=\\\"input-title\\\">\u30a2\u30c9\u30ec\u30b9\u3092\u5165\u529b<\/h2><span class=\\\"tag\\\">IPv4<\/span><\/div><form id=\\\"form\\\" novalidate><label for=\\\"ip\\\">IP \u30a2\u30c9\u30ec\u30b9 <small>CIDR \u5f62\u5f0f\u3082\u4f7f\u3048\u307e\u3059<\/small><\/label><input id=\\\"ip\\\" name=\\\"ip\\\" type=\\\"text\\\" inputmode=\\\"text\\\" spellcheck=\\\"false\\\" autocomplete=\\\"off\\\" value=\\\"192.168.1.10\\\" placeholder=\\\"192.168.1.10 \u307e\u305f\u306f 192.168.1.10\/24\\\" aria-describedby=\\\"ip-help error\\\"><p class=\\\"help\\\" id=\\\"ip-help\\\">\u4f8b: 192.168.1.10 \/ 192.168.1.10\/24<\/p><label for=\\\"mask\\\">\u30d7\u30ec\u30d5\u30a3\u30c3\u30af\u30b9 \/ \u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af<\/label><input id=\\\"mask\\\" type=\\\"text\\\" inputmode=\\\"text\\\" spellcheck=\\\"false\\\" autocomplete=\\\"off\\\" value=\\\"\/24\\\" placeholder=\\\"\/24 \u307e\u305f\u306f 255.255.255.0\\\" aria-describedby=\\\"mask-help error\\\"><p class=\\\"help\\\" id=\\\"mask-help\\\">IP \u306b \/ \u304c\u542b\u307e\u308c\u308b\u5834\u5408\u306f\u3001IP \u5074\u306e\u6307\u5b9a\u3092\u512a\u5148\u3057\u307e\u3059\u3002<\/p><div class=\\\"preset-label\\\">\u3088\u304f\u4f7f\u3046\u30d7\u30ec\u30d5\u30a3\u30c3\u30af\u30b9<\/div><div class=\\\"presets\\\" aria-label=\\\"\u30d7\u30ec\u30d5\u30a3\u30c3\u30af\u30b9\u3092\u9078\u629e\\\"><button type=\\\"button\\\" data-prefix=\\\"16\\\">\/16<\/button><button type=\\\"button\\\" data-prefix=\\\"24\\\">\/24<\/button><button type=\\\"button\\\" data-prefix=\\\"26\\\">\/26<\/button><button type=\\\"button\\\" data-prefix=\\\"30\\\">\/30<\/button><button type=\\\"button\\\" data-prefix=\\\"31\\\">\/31<\/button><button type=\\\"button\\\" data-prefix=\\\"32\\\">\/32<\/button><\/div><p id=\\\"error\\\" role=\\\"alert\\\" hidden><\/p><button type=\\\"submit\\\" class=\\\"calculate\\\">\u30b5\u30d6\u30cd\u30c3\u30c8\u3092\u8a08\u7b97 <span>\u2197<\/span><\/button><\/form><div class=\\\"privacy\\\"><span>\u25c8<\/span><p>\u5165\u529b\u3057\u305f\u30a2\u30c9\u30ec\u30b9\u306f\u5916\u90e8\u306b\u9001\u4fe1\u30fb\u4fdd\u5b58\u3057\u307e\u305b\u3093\u3002<br>\u8a08\u7b97\u306f\u3053\u306e\u30d6\u30e9\u30a6\u30b6\u5185\u3067\u5b8c\u7d50\u3057\u307e\u3059\u3002<\/p><\/div><\/section>\\n<section class=\\\"results\\\" aria-labelledby=\\\"result-title\\\"><div class=\\\"result-heading\\\"><div class=\\\"section-heading\\\"><span class=\\\"step\\\">02<\/span><h2 id=\\\"result-title\\\">\u8a08\u7b97\u7d50\u679c<\/h2><\/div><button class=\\\"copy\\\" id=\\\"copy\\\" type=\\\"button\\\">\u7d50\u679c\u3092\u30b3\u30d4\u30fc <span>\u29c9<\/span><\/button><\/div><p class=\\\"status\\\" id=\\\"status\\\" role=\\\"status\\\" aria-live=\\\"polite\\\"><\/p><div id=\\\"result-body\\\"><div class=\\\"network-card\\\"><div class=\\\"network-top\\\"><span>NETWORK ADDRESS<\/span><span id=\\\"result-tag\\\">\/24<\/span><\/div><div class=\\\"network-value\\\" id=\\\"network\\\"><\/div><div class=\\\"network-bottom\\\"><span>\u30cd\u30c3\u30c8\u30ef\u30fc\u30af\u30a2\u30c9\u30ec\u30b9 \/ CIDR<\/span><span class=\\\"mini-line\\\" aria-hidden=\\\"true\\\">\u2501 \u2501 \u2501 \u2501<\/span><\/div><\/div><div class=\\\"metrics\\\"><div><span>\u5229\u7528\u53ef\u80fd\u30db\u30b9\u30c8\u6570<\/span><strong id=\\\"usable\\\"><\/strong><small>\u7406\u8ad6\u5024 \/ hosts<\/small><\/div><div><span>\u7dcf\u30a2\u30c9\u30ec\u30b9\u6570<\/span><strong id=\\\"total\\\"><\/strong><small>addresses<\/small><\/div><\/div><dl class=\\\"details\\\"><div><dt>\u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af<\/dt><dd id=\\\"netmask\\\"><\/dd><\/div><div><dt>\u30ef\u30a4\u30eb\u30c9\u30ab\u30fc\u30c9\u30de\u30b9\u30af<\/dt><dd id=\\\"wildcard\\\"><\/dd><\/div><div><dt>\u30d6\u30ed\u30fc\u30c9\u30ad\u30e3\u30b9\u30c8<\/dt><dd id=\\\"broadcast\\\"><\/dd><\/div><div class=\\\"range\\\"><dt>\u5229\u7528\u53ef\u80fd\u30a2\u30c9\u30ec\u30b9\u7bc4\u56f2<\/dt><dd><span id=\\\"first\\\"><\/span><span class=\\\"range-arrow\\\">\u2192<\/span><span id=\\\"last\\\"><\/span><\/dd><\/div><\/dl><p class=\\\"notice\\\" id=\\\"notice\\\"><\/p><\/div><\/section><\/div>\\n<section class=\\\"binary-section\\\"><details id=\\\"binary-details\\\"><summary><span><span class=\\\"step\\\">03<\/span> \u30d3\u30c3\u30c8\u3067\u78ba\u8a8d\u3059\u308b <small>BINARY VIEW<\/small><\/span><span class=\\\"expand\\\">\uff0b<\/span><\/summary><div class=\\\"binary-content\\\"><p class=\\\"legend\\\"><i><\/i> \u30cd\u30c3\u30c8\u30ef\u30fc\u30af\u90e8 <i class=\\\"host\\\"><\/i> \u30db\u30b9\u30c8\u90e8<\/p><div id=\\\"binary\\\"><\/div><p class=\\\"help\\\">IP \u30a2\u30c9\u30ec\u30b9 AND \u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af = \u30cd\u30c3\u30c8\u30ef\u30fc\u30af\u30a2\u30c9\u30ec\u30b9<\/p><\/div><\/details><\/section>\\n<section class=\\\"reference\\\"><div><p class=\\\"eyebrow\\\">QUICK REFERENCE<\/p><h2>\u3088\u304f\u4f7f\u3046\u30de\u30b9\u30af\u3001\u3059\u3050\u78ba\u8a8d\u3002<\/h2><p>\u884c\u3092\u9078\u3076\u3068\u3001\u305d\u306e\u30d7\u30ec\u30d5\u30a3\u30c3\u30af\u30b9\u3067\u518d\u8a08\u7b97\u3067\u304d\u307e\u3059\u3002<\/p><\/div><div class=\\\"table-wrap\\\"><table><caption class=\\\"sr-only\\\">\u30d7\u30ec\u30d5\u30a3\u30c3\u30af\u30b9\u65e9\u898b\u8868<\/caption><thead><tr><th>CIDR<\/th><th>\u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af<\/th><th>\u5229\u7528\u53ef\u80fd\u30db\u30b9\u30c8<\/th><\/tr><\/thead><tbody id=\\\"reference\\\"><\/tbody><\/table><\/div><\/section><footer><span class=\\\"brand\\\">Blue Forest <span>LAB<\/span><\/span><p>IPv4 \u5c02\u7528 \u00b7 IPv6 \/ VLSM \u5206\u5272\u306f\u5bfe\u8c61\u5916<\/p><span>Built for clear networks.<\/span><\/footer><\/main>\";\n(function(root){\n'use strict';\nfunction ipNumber(s){if(!\/^(0|[1-9]\\d{0,2})(\\.(0|[1-9]\\d{0,2})){3}$\/.test(s))throw Error('IPv4 \u306f 192.168.1.10 \u306e\u5f62\u5f0f\u3067\u5165\u529b\u3057\u3066\u304f\u3060\u3055\u3044\uff08\u5148\u982d\u306e 0 \u306f\u4e0d\u8981\u3067\u3059\uff09\u3002');const a=s.split('.').map(Number);if(a.some(n=>n>255))throw Error('IPv4 \u306e\u5404\u6570\u5024\u306f 0\u301c255 \u306b\u3057\u3066\u304f\u3060\u3055\u3044\u3002');return a.reduce((n,v)=>n*256+v,0);}\nfunction ip(n){return [24,16,8,0].map(b=>(n>>>b)&255).join('.');}\nfunction prefix(s){s=s.trim();if(\/^\\\/?(0|[1-9]\\d?)$\/.test(s)){const p=Number(s.replace('\/',''));if(p<=32)return p;throw Error('CIDR \u306f \/0\u301c\/32 \u3067\u6307\u5b9a\u3057\u3066\u304f\u3060\u3055\u3044\u3002');}const m=ipNumber(s);const b=m.toString(2).padStart(32,'0');if(!\/^1*0*$\/.test(b))throw Error('\u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af\u306f 1 \u304c\u9023\u7d9a\u3057\u305f\u5f62\u5f0f\u306b\u3057\u3066\u304f\u3060\u3055\u3044\uff08\u4f8b: 255.255.255.0\uff09\u3002');return b.indexOf('0')<0?32:b.indexOf('0');}\nfunction calculate(input,mask){const parts=input.trim().split('\/');if(parts.length>2)throw Error('CIDR \u306e\u533a\u5207\u308a \/ \u306f 1 \u3064\u3060\u3051\u5165\u529b\u3057\u3066\u304f\u3060\u3055\u3044\u3002');const address=ipNumber(parts[0]);const p=prefix(parts.length===2?'\/'+parts[1]:mask);const total=2**(32-p);const net=Math.floor(address\/total)*total;const last=net+total-1;const m=4294967296-total;return {address:ip(address),prefix:p,mask:ip(m),wildcard:ip(total-1),network:ip(net),broadcast:p<31?ip(last):null,first:ip(net+(p<31?1:0)),last:ip(last-(p<31?1:0)),total,usable:p<31?total-2:total,networkBinary:net.toString(2).padStart(32,'0'),addressBinary:address.toString(2).padStart(32,'0'),maskBinary:m.toString(2).padStart(32,'0')};}\nroot.SubnetLabIPv4={calculate,ipNumber,prefix,ip};if(typeof module!=='undefined')module.exports=root.SubnetLabIPv4;\n})(typeof window!=='undefined'?window:globalThis);\n\n'use strict';\nconst $=id=>root.getElementById(id);let result=null;const fmt=n=>n.toLocaleString('ja-JP');\nfunction setPrefix(p){$('ip').value=$('ip').value.trim().split('\/')[0];$('mask').value='\/'+p;render();}\nfunction render(){$('copy-fallback')?.remove();try{result=window.SubnetLabIPv4.calculate($('ip').value,$('mask').value);const r=result;$('error').hidden=true;$('ip').removeAttribute('aria-invalid');$('mask').removeAttribute('aria-invalid');$('result-body').classList.remove('stale');$('copy').disabled=false;$('status').textContent='';$('network').textContent=r.network+'\/'+r.prefix;$('result-tag').textContent='\/'+r.prefix;$('usable').textContent=fmt(r.usable);$('total').textContent=fmt(r.total);$('netmask').textContent=r.mask;$('wildcard').textContent=r.wildcard;$('broadcast').textContent=r.broadcast||'\u306a\u3057';$('first').textContent=r.first;$('last').textContent=r.last;$('notice').textContent=r.prefix===31?' \/31 \u306f RFC 3021 \u306e\u30dd\u30a4\u30f3\u30c8\u30c4\u30fc\u30dd\u30a4\u30f3\u30c8\u56de\u7dda\u3068\u3057\u3066\u8a08\u7b97\u3002\u4e21\u7aef\u306e 2 \u30a2\u30c9\u30ec\u30b9\u3092\u5229\u7528\u3067\u304d\u3001\u30d6\u30ed\u30fc\u30c9\u30ad\u30e3\u30b9\u30c8\u306f\u3042\u308a\u307e\u305b\u3093\u3002':r.prefix===32?'\/32 \u306f\u5358\u4e00\u30db\u30b9\u30c8\u306e\u30a2\u30c9\u30ec\u30b9\u3067\u3059\u3002\u30cd\u30c3\u30c8\u30ef\u30fc\u30af\u306e\u7bc4\u56f2\u3082 1 \u30a2\u30c9\u30ec\u30b9\u3068\u306a\u308a\u3001\u30d6\u30ed\u30fc\u30c9\u30ad\u30e3\u30b9\u30c8\u306f\u3042\u308a\u307e\u305b\u3093\u3002':'\u30db\u30b9\u30c8\u6570\u306f\u30cd\u30c3\u30c8\u30ef\u30fc\u30af\u30fb\u30d6\u30ed\u30fc\u30c9\u30ad\u30e3\u30b9\u30c8\u306e 2 \u30a2\u30c9\u30ec\u30b9\u3092\u9664\u3044\u305f\u7406\u8ad6\u5024\u3067\u3059\u3002\u7279\u6b8a\u7528\u9014\u30fb\u4e88\u7d04\u6e08\u307f\u30a2\u30c9\u30ec\u30b9\u306e\u5236\u7d04\u3084\u3001\u5b9f\u74b0\u5883\u3067\u306e\u5272\u308a\u5f53\u3066\u53ef\u5426\u306f\u542b\u307f\u307e\u305b\u3093\u3002';$('binary').replaceChildren();for(const [name,bits] of [['IP \u30a2\u30c9\u30ec\u30b9',r.addressBinary],['\u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af',r.maskBinary],['\u30cd\u30c3\u30c8\u30ef\u30fc\u30af',r.networkBinary]]){const row=document.createElement('div');row.className='binary-row';const label=document.createElement('span');label.textContent=name;row.append(label);const block=document.createElement('div');block.className='bits';for(let i=0;i<32;i++){const bit=document.createElement(i%8===7?'b':'span');bit.textContent=bits[i];bit.style.color=i<r.prefix?'var(--teal)':'#8a9ba6';block.append(bit);}row.append(block);$('binary').append(row);}root.querySelectorAll('[data-prefix]').forEach(b=>{b.classList.toggle('active',Number(b.dataset.prefix)===r.prefix);b.setAttribute('aria-pressed',String(Number(b.dataset.prefix)===r.prefix));});}catch(e){result=null;$('error').textContent=e.message;$('error').hidden=false;$('result-body').classList.add('stale');$('copy').disabled=true;$('status').textContent='\u5165\u529b\u3092\u4fee\u6b63\u3057\u3066\u3001\u3082\u3046\u4e00\u5ea6\u8a08\u7b97\u3057\u3066\u304f\u3060\u3055\u3044\u3002';$('binary').replaceChildren();$('ip').setAttribute('aria-invalid','true');$('mask').setAttribute('aria-invalid','true');}}\n$('form').addEventListener('submit',e=>{e.preventDefault();render();if(result)$('status').textContent='\u8a08\u7b97\u3057\u307e\u3057\u305f\u3002';});\nroot.querySelectorAll('[data-prefix]').forEach(b=>b.addEventListener('click',()=>setPrefix(b.dataset.prefix)));\nfor(const p of [16,24,25,26,27,28,29,30,31,32]){const r=window.SubnetLabIPv4.calculate('0.0.0.0','\/'+p);const tr=document.createElement('tr');const td=document.createElement('td');const b=document.createElement('button');b.type='button';b.textContent='\/'+p;b.setAttribute('aria-label','\/'+p+' \u3067\u8a08\u7b97');b.onclick=()=>{setPrefix(p);$('result-title').scrollIntoView({behavior:'smooth',block:'center'});};td.append(b);tr.append(td);for(const value of [r.mask,fmt(r.usable)+(p===31?' *':'')]){const cell=document.createElement('td');cell.textContent=value;tr.append(cell);}$('reference').append(tr);}const note=document.createElement('p');note.className='help';note.textContent='* \/31 \u306f\u30dd\u30a4\u30f3\u30c8\u30c4\u30fc\u30dd\u30a4\u30f3\u30c8\u56de\u7dda\uff08RFC 3021\uff09\u306e\u5834\u5408\u3002';root.querySelector('.table-wrap').after(note);note.style.gridColumn='1 \/ -1';note.style.marginTop='-5px';\nfunction summary(r){return ['IPv4 \u30b5\u30d6\u30cd\u30c3\u30c8\u8a08\u7b97',`\u5165\u529b IP: ${r.address}\/${r.prefix}`,`\u30cd\u30c3\u30c8\u30ef\u30fc\u30af: ${r.network}\/${r.prefix}`,`\u30b5\u30d6\u30cd\u30c3\u30c8\u30de\u30b9\u30af: ${r.mask}`,`\u30ef\u30a4\u30eb\u30c9\u30ab\u30fc\u30c9: ${r.wildcard}`,`\u30d6\u30ed\u30fc\u30c9\u30ad\u30e3\u30b9\u30c8: ${r.broadcast||'\u306a\u3057'}`,`\u5229\u7528\u53ef\u80fd\u7bc4\u56f2: ${r.first} - ${r.last}`,`\u5229\u7528\u53ef\u80fd\u30db\u30b9\u30c8\u6570: ${fmt(r.usable)}`,`\u7dcf\u30a2\u30c9\u30ec\u30b9\u6570: ${fmt(r.total)}`,$('notice').textContent].join('\\n');}\n$('copy').addEventListener('click',async()=>{if(!result)return;try{await navigator.clipboard.writeText(summary(result));$('status').textContent='\u8a08\u7b97\u7d50\u679c\u3092\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f\u3002';}catch{$('status').textContent='\u81ea\u52d5\u30b3\u30d4\u30fc\u304c\u4f7f\u3048\u307e\u305b\u3093\u3002\u4e0b\u306e\u30c6\u30ad\u30b9\u30c8\u3092\u9078\u629e\u3057\u3066\u30b3\u30d4\u30fc\u3057\u3066\u304f\u3060\u3055\u3044\u3002';let area=$('copy-fallback');if(!area){area=document.createElement('textarea');area.id='copy-fallback';area.setAttribute('aria-label','\u30b3\u30d4\u30fc\u7528\u306e\u8a08\u7b97\u7d50\u679c');area.style.cssText='width:100%;min-height:200px;margin:12px 0;font:12px monospace;';$('status').after(area);}area.value=summary(result);area.focus();area.select();}});\nfor(const id of ['ip','mask'])$(id).addEventListener('input',()=>{result=null;$('copy').disabled=true;$('result-body').classList.add('stale');$('status').textContent='\u5165\u529b\u3092\u5909\u66f4\u3057\u307e\u3057\u305f\u3002\u300c\u30b5\u30d6\u30cd\u30c3\u30c8\u3092\u8a08\u7b97\u300d\u3067\u66f4\u65b0\u3057\u3066\u304f\u3060\u3055\u3044\u3002';$('binary').replaceChildren();$('copy-fallback')?.remove();});render();\n\n})();\n\n\/\/ -->\n<\/script>\n\n\n\n<style>\/* Page-scoped title fit and below-tool navigation *\/body.page-id-11 .wp-block-post-title{max-width:1100px!important;width:100%;font-size:clamp(18px,3.1vw,36px);line-height:1.3;white-space:normal;overflow-wrap:anywhere;box-sizing:border-box}body.page-id-11 #bfl-below-tool-nav{max-width:1100px!important;box-sizing:border-box;margin:40px auto 0;padding:24px 0;border-top:1px solid #dce5e8}body.page-id-11 #bfl-below-tool-nav>nav{justify-content:center}<\/style>\n<div id=\"bfl-below-tool-nav\"><\/div>\n<script>\n<!--\n(function(){var nav=document.querySelector(\"body.page-id-11 > .wp-site-blocks > header nav.wp-block-navigation\"),slot=document.getElementById(\"bfl-below-tool-nav\");if(nav&&slot)slot.appendChild(nav);})();\n\/\/ -->\n<\/script>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-11","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tools.bl-forest.com\/index.php?rest_route=\/wp\/v2\/pages\/11","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tools.bl-forest.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tools.bl-forest.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tools.bl-forest.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tools.bl-forest.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=11"}],"version-history":[{"count":5,"href":"https:\/\/tools.bl-forest.com\/index.php?rest_route=\/wp\/v2\/pages\/11\/revisions"}],"predecessor-version":[{"id":104,"href":"https:\/\/tools.bl-forest.com\/index.php?rest_route=\/wp\/v2\/pages\/11\/revisions\/104"}],"wp:attachment":[{"href":"https:\/\/tools.bl-forest.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=11"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}