* {font-family: 'Open Sans', sans-serif; font-weight: 200; color : black;}
BODY { margin: 0 auto;}
h1 {font-weight : bold;  }
h2 {font-weight : bold;  }

/*MAIN LAYOUT*/
#container {width:100%;}
#datecontainer {background-color:#354463; width:100%; border-bottom: 1px solid black;}
#dateCN { color : #e9f2fc; width: 49%; display: inline-block; text-align: left;}
#dateEN { color : #e9f2fc; width: 49%; display: inline-block; text-align: right;}
#nav { background-color:#bfc4cb; width: 100%; border-bottom: 1px solid black;}
#bodycontainer { width:100%;display:inline-block;}
#content { margin-left:5px; border-right: 1px solid black; vertical-align:top; width:76%;float:left;} 
.navblock { width: 30%; vertical-align:top; display:inline-block;}
.navblockhead { background-color: #bfc4cb;}
.navblockcontent  { }
#sidebar {font-size: 80%; margin-left: 5px; border-left: 1px solid black; width:23%;float: left; }
#footer { display: inline-block;width: 99%; border-top: 1px solid black; text-align: center;}


/*ADJUSTMENT OF MAIN LAYOUT FOR MOBILE DEVICES*/
@media screen and (max-width: 480px) {
.navblock { width: 100%; vertical-align:top; display:inline-block;}
#content { width: 100%; border-top: 1px solid black; vertical-align:top;  }
#sidebar {width: 100%; border-top: 1px solid black;}
}
@media screen and (min-width: 480px) and (max-width: 900px) {
.navblock { width: 40%; vertical-align:top; display:inline-block;}
#content { width: 100%; border-top: 1px solid black; vertical-align:top;  }
#sidebar {width: 100%; border-top: 1px solid black;}
}


/*TABLE*/
.tab2 { width: 75%; vertical-align:top;}
.tab2head { background-color: #cccccc; width:50%; vertical-align:top; display:inline-block;}
.tab2content  { width:50%;vertical-align:top; display:inline-block;}
.tab3 { width: 75%; vertical-align:top;}
.tab3head { background-color: #cccccc; width:33%; vertical-align:top; display:inline-block;}
.tab3content  { width:33%; vertical-align:top; display:inline-block;}
.tab4 { width: 75%; vertical-align:top;}
.tab4head { background-color: #cccccc; width:25%; vertical-align:top; display:inline-block;}
.tab4content  { width:25%; vertical-align:top; display:inline-block;}
.tab4full { width:100%; vertical-align:top; display:inline-block;}
.tab4fullhead { background-color: #eeeeee; width:100%; vertical-align:top; display:inline-block;}
.tab6 { width: 100%; vertical-align:top;}
.tab6head { background-color: #cccccc; width:16%; vertical-align:top; display:inline-block;}
.tab6content  { width:16%; vertical-align:top; display:inline-block;}


/*ADJUSTMENT OF TABLES FOR MOBILE DEVICES*/
@media screen and (max-width: 900px) {
.tab2 { width: 100%; vertical-align:top;}
.tab3 { width: 100%; vertical-align:top;}
.tab4 { width: 100%; vertical-align:top;}
}

.small {font-family: arial; font-size: 9px; color:#666666}
A.nav:link { color: black; text-decoration : none; }
A.nav:hover { color: black; text-decoration : underline; }
A.nav:visited { color: black; text-decoration : none; }
A.nav:active { color: black; text-decoration : none; }

A.onsite:link { color: #446DC4; text-decoration : none; }
A.onsite:hover { color: #446DC4; text-decoration : underline; }
A.onsite:visited { color: #446DC4; text-decoration : none; }
A.onsite:active { color:#446DC4; text-decoration : none; }

A.outsite:link { color: red; text-decoration : none; }
A.outsite:hover { color: red; text-decoration : underline; }
A.outsite:visited { color: red; text-decoration : none; }
A.outsite:active { color: red; text-decoration : none; }

A.email:link { color: teal; text-decoration : none; }
A.email:hover { color: teal; text-decoration : underline; }
A.email:visited { color: teal; text-decoration : none; }
A.email:active { color: teal; text-decoration : none; }

ul { list-style-type: square; }
li { }
ol { }

.code {color: #006600; display:inline-block;}

/* YASE */
.search { color:#555; border:1px solid #000000; }
.select  { color:#555; background:#fafafa; border:1px solid #000000; font:10px Verdana,Arial,Helvetica,sans-serif; }
.insert { color:#555; background:#fafafa; border:1px solid #000000; font:11px Verdana,Arial,Helvetica,sans-serif; padding-bottom:2px; padding-left:2px; }
.button { color:#555; border:1px solid #000000; background:#fafafa; font-size:10px; }
.header { color:#555; background:#EEEEEE; font-weight:bold; font-size:14px; }
.content_yase { color:#555; font:12px Arial; }
.yase_table {border:1px solid #000000;}
.big { font-size: 72px ; align : left ; }

/* RUBY */
ruby {
  display:inline-table;
  text-align:center;
  white-space:nowrap;
  text-indent:0;
  margin:0 -0.2em;
  vertical-align:-20%;
}

/* ????? */
ruby>rb,ruby>rbc {
  display:table-row-group;
  line-height:90%;
}

/* «e°¼?????? */
ruby>rt,ruby>rbc+rtc {
  display:table-header-group;
  font-size:60%;
  line-height:40%;
  letter-spacing:0;
}

/* «á°¼?????? */
ruby>rbc+rtc+rtc {
  display:table-footer-group;
  font-size:60%;
  line-height:40%;
  letter-spacing:0;
}

/* ½Æ??????? */
rbc>rb,rtc>rt {
  display:table-cell;
  letter-spacing:0;
}

rtc>rt[rbspan] {
  display:table-caption;
}

/* ??¬A©· */
rp {
  display:none;
}
