em     { color: red; }
strong { color: red; }
figure.right {
    float: right;
    width: 40%;
}
figure.right img {
    width: 100%;
}
figcaption {
    text-align: center
}

p { text-indent: 1em; }

body {
  background: #CCCCCC;
  line-height: 140%;
}

header {
    margin-top: 1em;
}

body > header > h1 {
    font-size: 150%;
    margin: 4px;
    float: left;
    display: inline;
}

body > nav {
    clear: both;
    display: block;
}

nav > ul {
    border: 1px solid #999999;
    border-style: outset;
    margin: 0px;
    padding: 0px;
    text-align: center;
}

nav > ul > li {  
    list-style-type: none;
    display: inline-block;
    color: #333399;
    font-weight: bold;
    margin-left: 1em;
    padding: 4px;
}

.en {
    font-size: 80%;
    display: block;
}
nav > ul > li:hover {
    background-color: #9999FF;
}

nav > ul label:hover {
    cursor: pointer; 
}

article {
    border: 1px solid black;    
    margin: 0px 30px;
    padding: 0px 3em;
    background-color: white;
}


section {
    text-align: left;
    margin: 0px 30px;
    padding: 0px 3em;
    display: none;
}

#tab0:checked ~ article > section#tab0,
#tab1:checked ~ article > section#tab1,
#tab2:checked ~ article > section#tab2,
#tab3:checked ~ article > section#tab3,
#tab4:checked ~ article > section#tab4,
#tab5:checked ~ article > section#tab5,
#ftab1:checked ~ * section#ftab1{

    display: block;
}

#tab0:checked ~ * #item4tab0, 
#tab1:checked ~ * #item4tab1, 
#tab2:checked ~ * #item4tab2,
#tab3:checked ~ * #item4tab3,
#tab4:checked ~ * #item4tab4,
#tab5:checked ~ * #item4tab5 {
    background: black;
    color: white;

}

h3 {
    clear: both;
    text-indent: 1em;
    border-left-style: double;
    border-bottom: 1px solid;
}

h4 {
    clear: both;
    margin-left: 1em;
    text-indent: 1em;
    border-left-style: double;
    border-bottom: 1px dotted;
}

img {border: 1px solid;}

select, input {
  font-size: 100%;
  font-family: monospace;
}

table {
/*    text-align: center; */
}
.sidebar {
/*  width:20%; */
  float: right;
}

.notification {
  border: 5px double black;
}
.notification:before {
  background-color: yellow;
  content: "！";
}


dl { margin-left: 1em;}
dt { margin-top: 1em; font-weight: bold;}
dd { text-align: left;}
td > dl > dt {text-align: left; }