@charset "UTF-8";

/* リセットCSS*/
html, body, header,div,figure,figcaption{margin:0; padding:0; border:none;outline:none; }
header,hgroup,nav,article,section,figure,footer{display:block;}

body{font:14px/1.3  -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', '游ゴシック  Medium', meiryo, sans-serif;width:100%;background:none;margin-top:0;}
body {width:900px;}
p  {line-height:130%; vertical-align:top;font-size:1.1em;}
h1 {padding:10px 5px 10px 5px; position:absolute; font-size:32px; color:floralwhite;text-indent:10px; }
h2 {margin-top:30px; padding: 3px 3px 0px 10px; color:green; border-left:solid 5px green;  }
h3 {padding:  8px 3px 3px 0px; color:darkblue; border-bottom: 1px solid black; }
a  {color:steelblue; }
a:hover {color:tomato;}
figcaption {font-size:0.8em;}
.mainheader{position:relative; background-color:springgreen; width:900px; height:140px;}
.header {padding:5px 0px; border-bottom:1px solid silver; }
.mainmenu {padding: 5px 0px 5px 5px;text-indent:10px; }
.footer {border-top:1px solid silver; clear:both; padding:5px 0px 10px 0px; text-align:center}
.submenue {width:200px; line-height:150%; padding-right:10px;} 
.contents {width:690px; padding:0px 3px 0px 0px;float:right;}
.column   {width:690px; margin-bottom:5px; margin-top:10px; clear:both; }
.htmltext   {padding: 5px 0px 5px 30px; color:green;}

.imgLeft {float:left;}
.imgLeft img {padding-right:10px; padding-bottom:15px;}
.imgRight {float:right;}
.imgRight img {padding-left:10px; padding-bottom:15px; }
.imgRight video {padding-left:10px; padding-bottom:15px; }
.waku {padding:7px; border:1px solid #ccc;background:#fff;}

.codeimg2{user-select:none;-ms-user-select:none;position:absolute;background:#00947a;color:white;line-height:1em;margin:0px;padding:3px 5px;}
.codehtml {padding:3% 5%; background-color: #ccffcc; border: 3px solid #00947a ;margin-bottom: 20px;font-size:1.1em;line-height: 110% }
.codeimg{user-select:none;-ms-user-select:none;position:absolute;background:steelblue;color:white;line-height:1em;margin:0px;padding:3px 5px;}
.codecss {padding:3% 5%; background-color: aliceblue; border: 3px solid steelblue ;margin-bottom: 20px;font-size:1.1em;line-height: 110% }
.demoimg{user-select:none;-ms-user-select:none;position:absolute;background:steelblue;color:white;line-height:1em;margin:0px;padding:5px;font-size:0.9em;}
.democss{padding:3% 5%; background-color: white; border: 3px solid whitesmoke ;margin-bottom: 20px;}
.democss p {vertical-align: top;}
.democss video {padding-top: 10px;}

.shirofuchi{
padding:7px;
border:1px solid gray;
background-color:white;
box-shadow: 1px 1px 5px dimgray;}