@charset "UTF-8";
html,body,div,p,h1,h2,textarea,form,input,label,hr,ul,li,noscript{margin:0;padding:0;border:0;background-color:rgb(253,253,253);color:rgb(32,33,36);vertical-align:baseline;overflow-wrap:break-word;word-wrap:break-word;word-break:break-all;font-family:"Helvetica Neue","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;font-size:16.8px;font-weight:400;line-height:1.6;letter-spacing:0.02em;outline:0;-webkit-text-size-adjust:100%;}
body{padding:calc(8px * 10) calc(8px * 2) calc(8px * 10) calc(8px * 2);}
html{display:table;width:100%;height:100%;}
body{display:table-cell;width:100%;height:100%;}
a:link,a:visited{color:rgb(0,0,149);text-decoration:underline;}
a:hover,a:active{color:rgb(153,0,0);text-decoration:underline;}
hr{margin:calc(8px * 2) 0 calc(8px * 2) 0;border-bottom:solid 1px #dddddd;}
/*
==contents
*/
div#title h1{position:fixed;top:0;left:0;width:100%;margin:0;box-shadow:0 0 4px 2px #dddddd;background-color:rgb(255,255,255);}
div#title h1:hover{filter:brightness(97%);}
div#title h1 a{display:block;padding:16px 16px 8px 16px;color:rgb(32,33,36);font-size:calc(16.8px * 1.1);font-weight:800;text-decoration:none;letter-spacing:0.04em;}
div#text{margin:0 16px 0 16px;}
div#text textarea{width:calc(100% - 16px);field-sizing: content;min-height:calc(25vh - 16.8px * 2 * 1.6);padding:8px;border:1px dashed #cccccc;background-color:rgb(247,247,247);line-height:1.6;resize:none;}
div#text div::before{content:"名無し";display:table;margin:0 0 0 10px;padding:0 0 0 17px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAABDSURBVChTY/wPBIyMjAzEAKBSBpDK/xAucYAJShMNhoUGUFARC8DBCooHKJ8BPT6wGYbiJGJsw/ADIU1YPY1bEwMDAJQmHf761a7OAAAAAElFTkSuQmCC");background-repeat:no-repeat;background-size:12px 12px;background-position:0% 50%;}
div#text div::after {content:"このツールは、URLの#(ハッシュ)部分に入力された文字を表示するツールです。";display:table;margin:0 8px 0 8px;}
div#text div textarea#view{field-sizing: content;min-height:calc(50vh - 16.8px * 2 * 1.6);}
span{display:inline-block;padding:2px 8px 0 8px;background-color:rgb(112,112,112);color:rgb(254,254,254);user-select:none;}
b{display:inline-block;font-weight:400;user-select:none;}
b::before{content:"[";margin:0 0 0 8px;vertical-align:text-bottom;font-size:calc(16.2px * 1.2);font-weight:400;}
b::after{content:"]";margin:0 8px 0 0;vertical-align:text-bottom;font-size:calc(16.2px * 1.2);font-weight:400;}
form{margin:24px 0 0 0;}label{font-size:calc(16.2px * 1.2);}
input{display:block;}
input[type="submit"]{width:100%;margin:16px auto 0 auto;padding:8px;box-shadow:0px 0px 4px 2px #dddddd;background-color:rgb(70,135,245);color:#ffffff;text-align:center;font-weight:800;cursor:pointer;-webkit-appearance:none;}
input[type="submit"]:hover{filter:brightness(92%);}
div#copy{position:fixed;bottom:0;left:0;right:0;margin:0;background-color:rgb(49,49,49);color:rgb(249,249,249);text-align:center;}
div#copy ul{display:flex;flex-wrap:wrap;list-style:none;justify-content:center;background-color:inherit;color:inherit;}
div#copy li{background-color:inherit;color:inherit;}
div#copy li:not(:last-of-type)::after{content:"/";margin:0 4px;}
div#copy li a{display:inline-block;padding:8px 0;color:rgb(249,249,249);}
div#copy li a:hover{filter:brightness(92%);}
noscript{position:fixed;top:0;left:0;right:0;}
div#noscript{display:block;margin:16px;padding:16px 16px 15px 16px;border:solid 1px #d4d4d4;box-shadow:0 1px 4px 0 rgb(206,206,206), 0 0 0 1px rgb(216,216,216);background-color:rgb(254,254,254);font-weight:800;}
div#noscript::after{content:"JavaScriptを利用してツールの読込と出力を行うため、\AJavaScriptが無効の状態では作動しません。\Aお手数ですが、JavaScriptを有効にした上で、再度アクセスして下さい。";display:block;margin-top:7px;padding-top:8px;border-top:solid 1px #d4d4d4;font-weight:400;line-height:1.6;white-space:pre-wrap;}
div#noscript + div{display:block;margin:16px;padding:16px 16px 15px 16px;border:solid 1px #d4d4d4;box-shadow:0 1px 4px 0 rgb(206,206,206), 0 0 0 1px rgb(216,216,216);background-color:rgb(254,254,254);font-weight:800;}
div#noscript + div::after{content:"Please enable JavaScript and reload the page.";display:block;margin-top:7px;padding-top:8px;border-top:solid 1px #d4d4d4;font-weight:400;line-height:1.6;white-space:pre-wrap;}
