
/*  Odic スタイルシート   print用にはこれをコピーして修正利用 ########### */


/* ######################### 全ての要素への適応 ############################################################### */

.c1 { line-height: 150% }
.c2 { line-height: 180% }
.c3 { line-height: 200% }
.c4 { line-height: 300% }
.c5 { line-height: 400% }
    /* <div class="c1"></div>  のように使用する  */

/* ######################### プリントページの改行 ############################################################### */

.pageoff { page-break-after: always; }




/* ######################### フォントサイズの適応 ############################################################### */

.c01 { font-size: 1em }
.c02 { font-size: 12pt }
.c03 { font-size: 16px }
.c04 { font-size: smaller }
.c05 { font-size: xx-small }
.c06 { font-size: x-small }
.c08 { font-size: 8pt }
.c10 { font-size: 10pt }
.c11 { font-size: 11pt }

.ftco01 { color: #77aaaa; }

.pund01 { font-size: 12px; margin: 0.5em; border: 0em; padding: 0em; }

/*

.c07 { font-size: 1em }
.c08 { font-size: 1em }
*/



/* ######################### bodyの適応 ############################################################### */

/* 段組み使用例

<div id="header">
  <p> header 文字列</p>
</div>
    <div id="content">
	<div id="menu">
		<p> menu 文字列</p>
	</div>
	<div id="main">
		<p> main 文字列</p>
	</div>
    </div>
<div id="footer">
  <p> footer 文字列</p>
</div>

 */

body {
/* ##### 外から マージン ボーダ パッディング の順でボックスは構成されている  ########################## */
	/*width: 680px; */
	font-size: 10pt;
	background-color: #ffffff; 	/* 下地カラー */
	margin: 0 auto;  		/* 天 0  左右 auto で振り分け */
	border: 0 auto;


	padding-top: 0em;
	padding-left: 0em;
	padding-right: 0em;
	padding-bottom: 0em;

	/*border: none;*/
					/* background-repeat: no-repeat; 背景画像を一回だけ表示して繰り返しません。*/
	/*border: 1px solid #cccccc;  1pxでグリーの罫線囲み 1em でないとWindowsでは見えない*/
}

#wrapper {

/* ##### 外から マージン ボーダ パッディング の順でボックスは構成されている  ########################## */
  width: 680px;
  margin: 0 auto; /* 天 0  左右 auto で振り分け */
  background-color: #ffffff;
  /* background-color: #dcdcdc;  */
  /* background: #fffafa;   snow */
  border: 1px solid #cccccc;  /* 1pxでグリーの罫線囲み 1em でないとWindowsでは見えない*/

  padding 1 auto; /* 天 0  左右 auto で振り分け */
  padding-top: 0em;
  padding-left: 1em;
  padding-right: 1em;
  padding-bottom: 0em;

  max-width: 2400px;

		/*text-align: center;  文字のセンター表示*/
  }

#header {
  width: 680px;
  margin: 0;
  border: 0;
  padding: 0;
  background-color: #ffffff;
  }

#content {
  width: 680px;
  height: 510px;
  margin: 0 auto; /* 天 0  左右 auto で振り分け */
  border: 0px solid #669933;  /* 1pxでグリーの罫線囲み 1em */
  padding: 0em;
  background: #ffffff;


  }

#menu {
  width: 450px;
  padding: 0em;
  float: left;
  background: #ffffff;
  }

#news {
  width: 200px;
  height: 510px;
  padding: 0em;
  float: right;

  background: #cc00ff;

  }


#footer {
    clear: both;  /*左寄せ、または右寄せされた全ての要素に対する回り込みを解除します。*/
    width: 680px;
    margin: 0 auto; /* 二つ指定で天地  左右の順で振り分け */
    border-top: 0px solid #eeeeee;

    padding-left: 0em;
    padding-right: 0em;
    padding-bottom: 1em;

    background: #fffff;    /*  snow */
    /*font-family: Optima, sans-serif; */
}

		div.footer_odic {

		  font-size: 0.8em;
		  color: #808080;			/* 文字カラーの指定となる */
		  margin: 2;
		  border-top: 1px solid #669933;
		  /* border: 0px solid #888888; 	天地の指定となる */
		  border-left-width: 5px;
		  border-right-width: 5px;
		  padding: 10 20px ;
		  padding-top: 1em;
		  background-color: #ffffff;
		  }

/*
.i {
    margin: 0em 1em 0em 1em;
}
*/

/* #########################リンク部分の適応 ############################################################### */

a:link { color: #666666; font-size: 100%; text-decoration: none;}  /* ジャンプ前のリンクにアンダーラインを付けない まだ見ていない状態*/
/* a:link { color: #000055;font-size:100%;text-decoration: none;}  */
/* a:link { color: #000055;font-size:100%;text-decoration: none;} */
/* a:link {text-decoration:none} */
/*a:link { color: #000088;} */

a:visited {color: #666666; text-decoration: none; } */ /* ジャンプしたリンクにアンダーラインを付けない 既に見た状態*/
/*a:visited {color: #999999; text-decoration: none background: #efefef;} */
/*a:visited {color: #999999 ;text-decoration: none} */
/* a:visited {color:blue ;text-decoration:none} */
/* a:visited { color: #aa0000; font-size:100%;text-decoration: none;} */
/*a:visited { color: #0000ff;} */

a:active { color: #FF0000; text-decoration: none; font-size: 100%;} /*マウスボタンを押している状態*/
/* a:active {text-decoration:none} */
/* a:active { color: #FF0000; text-decoration: none;font-size: 80%;} */
/*a:active { color: #FF0000; text-decoration: none;font-size: 80%;}*/

a:hover { color: #ffffff; background-color: #909090; text-decoration: none; font-size:100%;} /* カーソルが上にある状態 */
/*a:hover { color: #FFFFFF; background-color: #909090; text-decoration: none; font-size:100%;} カーソルが上にある状態 */
/* a:hover { color: #FFFFFF; background-color: #909090; text-decoration: none; font-size:100%;} */
/* a:hover { text-decoration: underline; color: rgb(255,0,0);}*/
/*a:hover { color: #ff0000;}*/



/* ######################### テーブル部分の適応 ############################################################### */


table {

/*  margin: 0em;
  border: 0em;
  padding: 0em; */
	border: 1px solid #dddddd;  /* 1pxでグリーの罫線囲み 1em */
	width: 680px;
	/* width: 100%; */
	/* width: px; */
	/*background-color: #FFFAFA; */
	/* align: center; */
	/* border: 1; */
	/* margin-bottom: 0.25em;    テーブルとテーブルが続く場合の、その間 */
}



  /* 右寄せテーブルへの文字の回り込み ################ */
  /*  <table class="c"> と利用  */
table.ritght {
  float: right;
  color: #444444;
  background: #ff6600;

  margin-top: 1em;
  margin-left: 0.5em;
  margin-right: 0.5em;
  margin-bottom: 0.5em;

  /*  padding-top: 1em;  */
  }


table.left {
  float: left;
  color: #ffffff;
  background: #ff6600;

  margin-top: 1.5em;
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 1em;
  }

    /* img を流用 ####  */
    /* <p id="clearleft"></p> と利用 */

 table.w01 { width: 400px; }

#clearleft { clear: left;}
#clearright { clear: right;}



.celly {
  border-collapse: separate;  /* カラセルを表現するかどうか */
  empty-cells: show;
  }


.celln {
  border-collapse: separate;  /* カラセルを表現するかどうか */
  empty-cells: hide;
  }




/* #########################見出し部分の適応 ############################################################### */

H1 {
	font-weight: bold;
	font-size: 18pt;
	line-height: 18pt;
	font-variant: normal;
	font-style: normal;
}


H2 {
    /*width: 99%; */
    font-weight: bold;
    color: #ffffff;
    background-color: #111111;
    border: 1px none #8888f8;
    border-top: 2px solid #bbbbbb;
    border-left: 1px solid #8888f8;
    border-right: 2px solid #aaaaaa;
    border-bottom: 2px solid #000000;
    padding: 3px 3px 3px 0.5em;
}

h3 {
    /*width: 99%; */
    color: #ffffff;
    font-weight: bold;
    font-size: 1em;
    background-color: #ffffff;
    /*background-color: #444444;*/
    border: 1px none #eeeeee;
    border-top: 1px solid #eeeeee;
    border-left: 1px solid #eeeeee;
    border-right: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    padding: 1px 1px 1px 0.5em;
}

H4 {
    /*width: 99%; */
    font-weight: bold;
    color: #333333;
    /* color: #ffffff; */
    font-size: 13pt;
    background-color: #ffffff;
    /*background-color: #444444;*/
    border: 1px none #eeeeee;
    border-top: 1px solid #eeeeee;
    border-left: 1px solid #eeeeee;
    border-right: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    padding: 1px 1px 1px 0.5em;
}

h5 {
    /*width: 99%; */
    font-weight: bold;
    font-size: 1em;
    color: #ffffff;
    background-color: #336699;
    border: 1px none #8888f8;
    border-top: 1px solid #ccccff;
    border-left: 1px solid #ccccff;
    border-right: 1px solid #666699;
    border-bottom: 1px solid #666699;
    padding: 5px 3px 3px 5em;
    width: 400px;
    line-height: 10pt;
}


h6 {
    /*width: 99%; */
    font-weight: bold;
    font-size: 1em;
    color: #333333;
    background-color: #ffffff;
    border: 1px none #eeeeee;
    border-top: 1px solid #eeeeee;
    border-left: 1px solid #eeeeee;
    border-right: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    padding: 5px 3px 3px 5em;
    width: 400px;
    line-height: 10pt;
}


h7 {
    /*width: 99%; */
    font-weight: bold;
    font-size: 14pt;
    color: #ffffff;
    background-color: #8484ee;
    border: 1px none #8888f8;
    border-top: 1px solid #ccccff;
    border-left: 1px solid #ccccff;
    border-right: 1px solid #666699;
    border-bottom: 1px solid #666699;
    padding: 5px 3px 3px 0.5em;
}



H4 a:link {
    color: #ffffff;
}

H4 a:visited {
    color: #ffffff;
}

H4 a:hover {
    color: #ff0000;
}

/* ######################### img部分の適応 im を img に変更予定     ######################################### */

#im1 {
  float: left;
  margin-right:1em;
  margin-bottom: 1em;
  }

#imgl {
  float: left;
  margin-right: 1em;
  margin-bottom: 1em;
  }

#im2 {
  float: right;
  margin-left: 0.5em;
  margin-bottom: 0.5em;
  }

#imgr {
  float: right;
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 1em;
  }


   /* <p id="clearleft"></p> と利用 */

#clearleft { clear: left;}

#clearright { clear: right;}



/* ######################### リスト部分の適応 ############################################################### */

.list0 { list-style-type: decimal-leading-zero; }
.list1 {
  list-style-type: lower-greek;
  color: #444444;
  }
.list2 { list-style-type: lower-roman; }

  /* <ol class="list1"> と使用 */


/* ######################### text部分の適応 ############################################################### */

div.moji1 { letter-spacing: 2px;line-height:120%; }
/*
div.moji1 { font-size:12pt;line-height:150%; }
div.moji1 {letter-spacing: 2px;}
*/
div.moji2 {letter-spacing: 30px;}
div.moji3 {letter-spacing: -2px;}
div.moji4 {line-height:120%; }


    /* ####### この text01 text02 が現在は中心 統一したい ######################### */

.text01 {
	/* text-justify: distribute-all-lines; */
	/*text-align: justify; */
	text-indent: 1em;
	font-size:10pt;
	line-height:150%;
}
	/*  text-indent: 1em; は文章の一字文字下げ    */
	/*  <div class="text01"> </div> のように使用する  */

.text02 {
	text-indent: 1em;
	font-size:9pt;
	line-height:120%;
}

.text03 {
	text-indent: 1em;
	font-size:8pt;
	line-height:120%;
}


#i1 { text-indent:1em; }
   /*  <div id="i1"> </div> のように使用する  */



/*　インデント　文章はじめの一文字下げ指定 『スタイルシートサンプルブック』から引用*/
#i1 { text-indent: 1em }

/*
#i2 { text-indent: 2em }
.break { line-break: strict}
.break1 { line-break: normal}

*/

/* http://www.asahi-net.or.jp/~rt8s-ymtk/shohyou_essey/yubinteki.html から引用*/
.honbun-essy {

	font-size: 14px;
	line-height: 20px;
}

.honbun-essy1 {

	font-size: 16px;
	line-height: 20px;
}


.honbun-essy02 {

	font-size: 16px;
	line-height: 20px;
	letter-spacing: 4px;
	line-height:130%;
	text-indent:1em;
}



.honbun-essy02 {

	font-size: 16px;  /*//#本文文字の大きさ*/
	line-height: 20px;
	letter-spacing: 4px; /*//#文字間*/
	line-height:130%;    /*//#行間*/
	text-indent:1em;    /*//# 行頭字下げ:*/
}




.honbun-essy03 {

	font-size: 14px;
	line-height: 20px;
	letter-spacing: 4px;
	line-height:160%;
	text-indent:1em;
}

.honbun-essy04 {

	font-size: 16px;
	line-height: 20px;
	letter-spacing: 4px;
	line-height:110%;
	text-indent:1em;
}



.honbun {
	font-size: 12px;
	line-height: 20px;
	margin-right: 15%;
	margin-left: 15%;
}


#example01 {
	color:#ffffff;
	background:#000080;
}

.example02 {
	color:#ffffff;
	background:#000000;
}





/* ######################### 各種要素の適応 ############################################################### */

pre.c001 {
    font-size: 11.5px;
    border: 1px solid #dddddd;
    padding: 5px;
    white-space: pre;
    width: 98%;
    background-color: #ffffff;
}



div.c {
    border: 1px solid gray;
    padding: 5px;
    width: 90%;
    background-color: #fffff0;
}

  /* ########## form の input, select スペースの地色指定######################## */
input, select {
  color: #000033;
  background-color: #dcdcdc;
  }


/* ######################### 著作情報の適応 ############################################################### */

address {
  display: block;
  font-style: italic;
  }



/* ######################### コンテンツの引用の適応 ######################################################## */

/* ##### 外から マージン ボーダ パッディング の順でボックスは構成されている  ########################## */

	/*  p  <p class="normal"> と使用*/

.normal01 { background-color: #dfdfdf; padding: 1px 1px 1px 1px; font-size: 12.5px; border: 1px solid #dddddd; }

.normal02 { background-color: #ffffff; padding: 1px 1px 1px 1px; font-size: 12.5px; }

	/* ###############################  */

form {
  margin: 0;

  font-size: 0.8em;
  border: solid 2px #ffffff;
  border-left-width: 0px;
  border-right-width: 0px;
  padding: 0;
  }

blockquote {
  margin: 5px;

  font-size: 0.8em;
  border: solid 1px #dddddd;
  border-left-width: 5px;
  border-right-width: 5px;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  }


div.file01 {
  background-color: #eeeeee;
  height:1.2em;
  width:100%;
  margin:  10px 0px 0px 0px;
  border: 0;
  padding: 0;
  color: #333333;
  font-weight: bolder;
  font-size: 0.8em;

  }


div.column {
  background-color: #eeeeee;
  height: 1.5em;
  width: 100%;
  margin: 10px 0px 0px 0px;
  border: 0;
  padding: 4px 0px 0px 0px;
  color: #333333;
  font-weight: bolder;
  font-size: 0.8em;
  border: solid 1px #eeeeee;
  }

.column01 { background-color: #eeeeee; padding: 5px 5px 5px 10px; font-size: 13px; border: solid 2px #eeeeee;}



div.odic_top01 {
  margin: 10;

  font-size: 10pt;
  border: solid 1px #555555;   /*  罫線囲み */
  border-left-width: 5px;
  border-right-width: 1px;
  padding: 10 20px ;
  background-color: #eeeeee;
  }

div.span_odic01 {
  margin: 5px;

  font-size: 0.8em;
  border: solid 1px #dcdcdc;
  border-left-width: 5px;
  border-right-width: 1px;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 5px;
  background-color: #eeeeee;
  }


div.span_odic02 {
  font-size: 0.8em;
  margin-top: 5px;
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 5px;

  font-size: 0.8em;
  border: 1px solid #999999;

  padding-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;

  background-color: #dddddd;
  }

div.span_odic02-01 {

 font-size: 0.8em;
  margin-top: 1px;
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 2px;
  font-size: 0.8em;
  background-color: #ffffff;
  }

div.span_odic03 {
  margin: 0px;
  font-size: 0.8em;
  border: 0px solid #333333;
  border-left-width: 0px;
  border-right-width: 0px;
  padding: 0 0px ;
  background-color: #ffffff;
  }


div.center_odic {
  margin: 5 ;
  font-size: 0.8em;
  border: 1px solid #333333;
  /*border: solid 1px #5b94f0; */
  border-left-width: 1px;
  border-right-width: 1px;
  padding: 0 0px ;
  background-color: #eeeeee;
  }



 /*
div.span_odic02 {
  margin: 10;
  font-size: 0.8em;
  border: solid 3px #111111;
  border-left-width: 5px;
  border-right-width: 1px;
  padding: 10 20px ;
  background-color: #ffffff;
  }
*/

div.span_odic03 {
  width: 400px;
  margin: 0;

  }


div.span_odic04 {
  margin: 10;
  font-size: 0.8em;
  border: solid 1px #666666;
  border-left-width: 5px;
  border-right-width: 1px;
  padding: 10 20px ;
  background-color: #ffffff;
  }

cite { font-style: italic; }  /* 引用  */

q:before { content: open-quote;}
q:after { content: close-quote; }


