<!--
/*//////////////////////////////////////////////////////////////////
 コンテンツページ用CSS
////////////////////////////////////////////////////////////////////*/


/* link -----------------------------------------------------------------------------------------*/

A:link {
 color: #0000ff;
 text-decoration: underline; 
}

A:visited {
 color: #ED7979;
 text-decoration: underline; 
}

A:active {
 color: #ff0000;
}

A:hover {
  color: #FF0000;
  text-decoration: underline; 
} 


/* center -----------------------------------------------------------------------------------------*/

DIV#center {
  background:url(../contents/images/contents_bg_top.gif) no-repeat top left;
  width: 630px; float: left; margin-top:10px;
}

DIV.center-middle{
  width: 630px; margin-top:6px; margin-bottom:20px; clear:both;
  background:url(../contents/images/contents_bg_middle.gif) repeat-y top left;
}

DIV.center-bottom{
  width: 630px; margin-top:6px; clear:both;
  padding-bottom:10px;
  background:url(../contents/images/contents_bg_bottom.gif) no-repeat bottom left;
}

.line-bottom{
  vertical-align:bottom;
}
.line-top{
  vertical-align:top;
}

/* to-top -----------------------------------------------------------------------------------------*/
DIV#to-top{
  width:610px;
  text-align:right;
  margin:20px 15px 10px 0px;
}

/* title -----------------------------------------------------------------------------------------*/
h1{
  margin:10px;
}

h2{
  margin:20px 10px 5px 20px;
}
h3{
	margin:5px 10px;
	font-size:98%;
	color:#333;
}
h3.icon{
	color:#FFF;
	border:1px solid  #093;
	background:#393;
	padding:2px;
	margin-top:0;
	display:inline;
}
h3.icon a{
	color:#FFF;
	text-decoration:none;
}
h3.icon a:visited{
	color:#FFF;
}
.curved{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

/* paragraph -----------------------------------------------------------------------------------------*/
P.para{
  margin:10px 10px 15px 25px;
}

P.para-r{
  margin:10px 25px 15px 25px;
  text-align:right;
}

P.caution{
  margin:10px 10px 10px 25px;
  font-size:90%;
  color:red;
}

P.err{
  width:560px;
  margin:5px 0px 5px 25px;
  font-weight:bold;
  padding:10px;
  color:red;
  border:3px solid red;
}


/* mail -----------------------------------------------------------------------------------------*/

.mail{vertical-align: middle; }

/* list -----------------------------------------------------------------------------------------*/
UL.lst-type1{
  margin:5px 5px 5px 25px;
  list-style:none;
}

UL.lst-type1 LI{
  border-left:5px solid blue;
  margin:3px;
  padding-left:5px;
}

UL.lst-type2{
  margin:15px 5px 5px 25px;
  list-style:none;
}

UL.lst-type2 LI{
  border-left:5px solid #39A54B;
  margin:10px;
  padding-left:5px;
}

UL.lst-type3{
  margin:15px 5px 5px 25px;
  list-style:none;
}

UL.lst-type3 LI{
  margin:20px;
  padding-left:5px;
}
ul.lst-type4{
	margin:15px 15px 5px 25px;
	list-style:none;
}
ul.lst-type4 li{
	padding:3px 0 0 5px;
}

OL.lst-type1{
  margin:15px 5px 5px 55px;
}

OL.lst-type1 LI{
  margin:20px;
  padding-left:5px;
}


/* container -----------------------------------------------------------------------------------------*/
DIV.con-b{
  width:575px;
  margin:5px 10px 10px 25px;
  border:1px solid blue;
}

/* font -----------------------------------------------------------------------------------------*/

.f-white{color:#FFFFFF;}

.f-bigorange{font-weight:bold; font-size: 110%; color:#FF9933;}

.f-bigred{font-weight:bold; color:#E70303;}

.f-red{color:#E70303;}

.f-bigblue{font-weight:bold; color:#060BEE;}

.f-ltblue{color:#619BF2;}

.f-biggren{font-weight:bold; color:#229D05;}

.f-biggren2{font-weight:bold; font-size: 110%; color:#229D05;}

.f-bigmocha{font-weight:bold; font-size: 110%; color:#996633;}

.f-big{font-weight:bold; font-size: 110%;}

.f-default{font-size:80%;}

.f-small{ font-size:75%;}

.f-verysmall{ font-size:70%;}


/* table -----------------------------------------------------------------------------------------*/
TABLE.tbl-type1{
  margin:5px 10px 10px 25px;
  border:1px solid gray;
  border-collapse:collapse;
  clear:both;
}
TABLE.tbl-type1 TH{
  font-size:90%; color:#5fa200;
  padding:3px;
  background:#c5e7c5;
  border:1px solid gray;
  border-collapse:collapse;
}
TABLE.tbl-type1 TD{
  /*font-size:80%;*/
  padding:3px;
  border:1px solid gray;
  border-collapse:collapse;
}

TABLE.tbl-type2{
  margin:5px 10px 10px 25px;
  border:1px solid #007932;
  border-collapse:collapse;
}
TABLE.tbl-type2 TH{
  font-size:90%; color:#ffffff;
  padding:3px;
  background:#5FA200;
  border:1px solid #007932;
  border-collapse:collapse;
}
TABLE.tbl-type2 TD{
  /*font-size:80%;*/
  padding:3px;
  border:1px solid #007932;
  border-collapse:collapse;
}

.td-550{ width:550px;}

.TD-center{text-align:center;}

.TD-green{width:100px;  background:#F1FBD0;}

.TD-grey{width:90px;  background:#EDEDED;}

.TD-dkgrey{background:#D6D6D6;}

.TD-blue{background:#BCD9F7;}

.TD-ltblue{background:#CFE3F7;}

.TD-purple{background:#D8BCF7;}

.TD-red{background:#F7C2BC;}

.TD-dkred{background:#E53407;}

.TD-orange{background:#FDD678;}

.TD-yellow{background:#F7FFCC;}

.TD-ltyellow{background:#FFFDC7; text-align:center;}

.TD-ltgreen{background:#CCFFCC;}


/* flow -----------------------------------------------------------------------------------------*/

DIV.flowbox{
  width:620px;
  clear:both;
  background:url(../contents/flow/images/flow_bg.gif) no-repeat right center;
}

div.ltrp,div.ltrp-w{
	background:none;
	clear:both;
}

DIV.flowbox P{
  width:350px;
  margin:5px;
  float:left;
}

div.ltrp p {
	width:450px;
	margin:5px 5px 5px 20px;
	float:left;
	margin-bottom:20px;
}

div.ltrp-w p {
	width:360px;
	margin:5px 5px 5px 20px;
	float:left;
	margin-bottom:20px;
}

DIV.image-left{
  float:left;
  width:220px;
  margin:5px 5px 5px 10px;
}

div.image-right{
  float:right;
  margin:5px 30px 5px 5px;
}

/* privacy -----------------------------------------------------------------------------------------*/

P.privacy{
  margin:10px 10px 10px 25px;
  font-weight:bold; color:#E40303;
}

P.privacy_bottom{
  margin:20px 10px 10px 25px;
  text-align:right;
}

/* form -----------------------------------------------------------------------------------------*/
.f-short{ width:200px;}
.f-long{ width:400px;}
.f-short4{ width:40px;}

TABLE.tbl-form{
  width:570px;
  margin:5px 10px 10px 25px;
  border:1px solid gray;
  border-collapse:collapse;
  background:#fafafa;
  line-height:1.5em;
}
TABLE.tbl-form TH{
  font-size:90%;
  font-weight:normal;
  text-align:left;
  padding:3px;
  background:#dcdcdc;
  border:1px solid gray;
  border-collapse:collapse;
}
TABLE.tbl-form TD{
  font-size:90%;
  padding:3px;
  border:1px solid gray;
  border-collapse:collapse;
}
table.tbl-form table td,table.tbl-form table th{
	font-size:100%;
	border:#CCC 1px solid;
	line-height:2em;
}
table.tbl-form table tr.line td{
	background:#EBF5F2;
}

.t-area{ width:400px;height:100px;}

.f-shortest{ width:30px; }

.w100{ width:100px;}

.w400{ width:470px;}



/* teacher -----------------------------------------------------------------------------------------*/

DIV.t-list{
  width:575px;
  margin:5px 10px 10px 25px;
  border:1px solid #007932;
}

P.t-name{
  width:555px;
  margin:5px 5px 5px 7px;
  padding:5px;
  background: url(../contents/teacher/images/bg_t-name.gif) #DADADA repeat-x;
  color:#5FA200; font-weight:bold; font-size: 110%;
  border-bottom:1px solid #BABABA;
}

P.t-text{
 width:535px;
 margin:10px;
}

.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

TABLE.tbl-teacher{
  margin:5px 0px 5px 5px;
  border:1px solid gray;
  border-collapse:collapse;
  width:530px;
}
TABLE.tbl-teacher TD{
  /*font-size:80%;*/
  padding:2px;
  border:1px solid gray;
  border-collapse:collapse;
}

DIV.back{
  width:555px;
  text-align:right;
  margin:5px;
}

/* course -----------------------------------------------------------------------------------------*/

p.course{
  margin-left:25px;
  font-size:80%;
}


/* history -----------------------------------------------------------------------------------------*/

.photo-right{
  float: right;
  margin:5px;
}

p.history{
  margin:5px 10px 5px 25px;
  font-weight:bold;
  border-bottom:1px solid #017A33;
  clear:both;
}

TABLE.tbl-history{
  margin:5px 10px 10px 25px;
}

TABLE.tbl-history TD{
  font-size:95%;
  padding:5px;
  vertical-align:top;
}

/* reason -----------------------------------------------------------------------------------------*/

TABLE.tbl-reason{
  margin:5px 10px 10px 25px;
  border:1px solid gray;
  clear: both;
}


TABLE.tbl-reason TD{
  /*font-size:80%;*/
  padding:3px;
  vertical-align:top;
}

.TD-30{
  width:30px;
}

.chart{
	border:gray 1px solid;
	margin:5px 10px 10px 25px;
	padding:10px 10px 0 10px;
	text-align:center;
}
.chart h3{
	text-align:left;
	font-size:90%;
}

/* yokohama (added 2008/06/25) --------------------------------------------------------------------*/

TABLE.tbl-yokohama{
  margin:5px 10px 10px 25px;
  clear: both;
}


TABLE.tbl-yokohama TD{
  font-size:80%;
  padding:3px;
  vertical-align:top;
}

.TD-30{
  width:30px;
}

/* voice -----------------------------------------------------------------------------------------*/

.dod-line{margin:5px;}

p.voice{
  margin:20px 10px 5px 25px;
  font-weight:bold;
  border-bottom:1px solid #017A33;
}


/* openguidance -----------------------------------------------------------------------------------------*/

.img-clear{clear: both;}


/* shools-calendar-----------------------------------------------------------------------------------------*/

TABLE.tbl-calendar{
  margin:5px
  border:1px solid #AAAAAA;
  border-collapse:collapse;
  text-align:center;
  background:#FFFFFF;
}

TABLE.tbl-calendar TH{
  font-size:80%;
  padding:3px;
  border:1px solid #AAAAAA;
  border-collapse:collapse;
}

TABLE.tbl-calendar TD{
  font-size:80%;
  padding:3px;
  border:1px solid #AAAAAA;
  border-collapse:collapse;
}

/* shools- seminar-----------------------------------------------------------------------------------------*/

TABLE.tbl-seminar{
  margin:5px 10px 10px 5px;
  border:1px solid gray;
  border-collapse:collapse;
}

TABLE.tbl-seminar TD{
  padding:3px;
  border:1px solid gray;
  border-collapse:collapse;
}

.TD-blue-90{width:90px; background:#BCD9F7;}

P.p-form{
    border:1px solid #E53407;
    padding:5px;
    margin:5px 0px;
}

/* curriculum　-----------------------------------------------------------------------------------------*/

.TD-pk{background:#F7DFCF; text-align:center; font-weight:bold;}

.TD-10b{width:1em; text-align:center; background:#CFE3F7;}

.TD-10g{width:10px; text-align:center; background:#CCFFCC;}

.TD-10y{width:10px; text-align:center; background:#F7FFCC;}

.text{text-align:center;}

DIV.c-list{
  width:575px;
  margin:5px 10px 10px 25px;
  border:1px solid #7B7B7B;
}

P.c-name-b{
  width:555px;
  margin:5px 5px 5px 7px;
  padding:5px;
  background: url(../contents/curriculum/images/curriculum_bbg.gif) #BAD6EC repeat-x;
  color:#0F6FB2; font-weight:bold; font-size: 110%;
  border-bottom:1px solid #7DB3DE;
}

P.c-name-g{
  width:555px;
  margin:5px 5px 5px 7px;
  padding:5px;
  background: url(../contents/curriculum/images/curriculum_gbg.gif) #A2E69A repeat-x;
  color:#5FA200; font-weight:bold; font-size: 110%;
  border-bottom:1px solid #68CD5C;
}

P.c-name-y{
  width:555px;
  margin:5px 5px 5px 7px;
  padding:5px;
  background: url(../contents/curriculum/images/curriculum_ybg.gif) #E8DF41 repeat-x;
  color:#EA9500; font-weight:bold; font-size: 110%;
  border-bottom:1px solid #E8D241;
}

/* original text　-----------------------------------------------------------------------------------------*/

.TD-original{width:150px; background:#FFFDC7; vertical-align:top;}


/* sutudent -----------------------------------------------------------------------------------------*/

P.info{
    border:1px solid #E53407;
    padding:5px;
    margin:5px 10px 20px 25px;
}

P.info-old{
    border:1px solid gray;
    padding:5px;
    margin:5px 10px 20px 25px;
}


/* opencourse -----------------------------------------------------------------------------------------*/
P.oc-name{
  width:555px;
  margin:5px 5px 5px 7px;
  padding:5px;
  background: url(../contents/opencourse/images/opencourse_bg.gif) #D9D9D9 repeat-x;
  font-weight:bold;
  border-bottom:1px solid #BABABA;
}

UL.op44{
  list-style-image:url(/jp/contents/opencourse/images/op44list.gif);
  width:540px;
  margin:10px 15px 10px 20px;
  padding-left:30px;
}
UL.op44 LI{
  margin-bottom:10px;
  padding-left:5px;
}


/* beautyu -----------------------------------------------------------------------------------------*/

P.b-title{
  width:555px;
  margin:5px 5px 5px 7px;
  padding:5px;
  background: url(../contents/beauty/images/bg_t-name.gif) #DADADA repeat-x;
  font-weight:bold; font-size: 110%;
  border-bottom:1px solid #BABABA;
}

/* pattern -----------------------------------------------------------------------------------------*/
ul.ptn{
	margin-left:20px;
	list-style:none;
}
ul.ptn li{
	padding-left:10px;
	margin-bottom:5px;
}
ul.ptn li.gre{border-left:#063 3px solid;}
ul.ptn li.nav{border-left:#009 3px solid;}
ul.ptn li.pin{border-left:#F39 3px solid;}
ul.ptn li.yel{border-left:#C90 3px solid;}
ul.ptn li.blu{border-left:#06C 3px solid;}
ul.ptn li.pur{border-left:#C03 3px solid;}

-->

/* voice -----------------------------------------------------------------------------------------*/
#voice ul li {
	margin: 5px 5px 5px 10px;
	padding: 0 0 0 20px;
	background: url(/jp/contents/voices/images/list/folder.gif) no-repeat 0 -284px;
	line-height: 160%;
	list-style:none;
}
#voice ul li ul {
	background: url(/jp/contents/voices/images/list/line.gif) no-repeat 10px 0;　// ul の背景に点線の画像を設定
}
#voice ul li ul.cat li {
	background: url(/jp/contents/voices/images/list/folder.gif) no-repeat 0px -284px;　// 長さ 300px あるのでマイナスで位置調整
}
#voice ul li ul.page li {
	background: url(/jp/contents/voices/images/list/page.gif) no-repeat 0px -284px;
}
#voice ul li ul li.last {
	background-color: #FFFFFF; // 点線の表示を消すため、背景と同じ色にします。
}
#voice .lv{
	float:left;
	width:160px;
	margin:10px 0 0 10px;
}