@charset "utf-8";

body  {
font-family: ;
	font: 100% 'ＭＳ Ｐゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,sans-serif;
	background: #fff;
	margin: 0; 
	padding: 0;
	text-align: center; /* これにより、IE 5* ブラウザではコンテナが中央揃えになります。そして、テキストは、#container セレクタの初期設定である左揃えに設定されます */
	color: #000000;
	font-size:10px;
	_font-size:62.5%;
	line-height:1.6;
}

h1,h2,h3,h4,h5{
margin:0;
}

img{
border:0;
}

ul,li{
margin:0px;
padding:0px;
}

.fnt5{font-size:0.5em;}
.fnt8{font-size:0.8em;}
.fnt12{font-size:1.2em;}
.fnt14{font-size:1.4em;}
.fnt15{font-size:1.5em;}
.fnt16{font-size:1.6em;}
.fnt18{font-size:1.8em;}

h1{font-size:1.2em;line-height:1.2;text-align:left;}
h2{font-size:1.4em;line-height:1.2;text-align:left;}
h3{font-size:1.2em;line-height:1.2;text-align:left;}
h4{font-size:1.2em;line-height:1.2;text-align:left;}
h5{font-size:1.2em;line-height:1.2;text-align:left;}

.pen{
/*background-color:#f2c4c3;*/
background-color:#D6F1D6;
padding:2px;
}

.red{color:#dd0067;}
.blue{color:#0066ff;}


a:link{color:#0066ff;text-decoration:underline;}
a:visited{color:#0066ff;text-decoration:underline;}
a:hover{color:#36f;text-decoration:underline;}
a:active{color:#36f;text-decoration:underline;}


#footer a:link{color:#666;text-decoration:none;}
#footer a:visited{color:#666;text-decoration:none;}
#footer a:hover{color:#0066ff;text-decoration:underline;}
#footer a:active{color:#0066ff;text-decoration:underline;}


a.top:link{font-size:1.2em;color:#000000;text-decoration:none;}
a.top:visited{font-size:1.2em;color:#000000;text-decoration:none;}
a.top:hover{font-size:1.2em;color:#000000;text-decoration:none;}
a.top:active{font-size:1.2em;color:#000000;text-decoration:none;}

br.clr{
clear:both;
}

.fltrt { /* このクラスは、ページ上でフローティングエレメントを右側に配置するのに使用できます。プローティングエレメントは、ページ上でその横に配置されるエレメントの前に配置される必要があります。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* このクラスは、ページ上でフローティングエレメントを左側に配置するのに使用できます */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* このクラスは、div またはブレークエレメントに適用される必要があり、また、フローティングエレメントが完全に含まれているコンテナの末尾の直前にある最後のエレメントである必要があります */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}



/*clearfixハック
------------------------------------------------------------ */

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block; min-height: 1%;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}




.twoColFixLtHdr #line { 
	border-bottom:3px solid #dd0067;
	margin-bottom:10px;
} 

.twoColFixLtHdr #lead { 
	width: 800px; 
	margin:0px auto;
	
} 

.twoColFixLtHdr #lead h1 {
	margin: 0;
	padding: 10px 0;
	font-size:1.2em;
	font-weight:normal;
	text-align:right;
}



.twoColFixLtHdr #header {
clear:both;
width: 800px; 
margin:0px auto 10px;
padding:0;	
}

#header #hd_logo{
width:240px;
float:left;
text-align:left;

}

#hd_logo p{
padding:0px 0px 4px 3px;/*[上][右][下][左]*/
font-size:1.2em;
margin:0;
}

.twoColFixLtHdr #header #hd_contact{
width:560px;
float:right;
text-align:right;
}

#hd_link ul{
/*width:552px;*/
float:right;
margin:0;
padding:5px 0px 0px;
}

#hd_link li{
float:left;
margin-left:2px;
list-style-type:none;
}

.twoColFixLtHdr #hd_tel{
margin-bottom:4px;
}




#container { 
	clear:both;
	width: 800px;  
	background: #FFFFFF;
	margin: 0 auto 20px; 
	text-align: left; /* この設定は body エレメントの text-align: center より優先されます。 */
}

#sidebar {
	float: left; 
	width: 180px;
	clear:both;
	margin:5px 0px 15px;
}




#mainContent{ 
	width:600px;
	float:left;
	margin:5px 0px 0px 20px;/*[上][右][下][左]*/
}

/*メニュー
------------------------------------------------------------ */

#sidebar #navi{
background:url(../img/barbg.gif);
margin:0;
padding:0;
}

/*
#sidebar #navi_bottom{
background:url(../img/barbottom.gif) left top no-repeat;
margin:0;
padding:0;
}
*/

#navi .bar_ttl{
width:165px;
margin:0px auto;
}

.bar_bottom{
width:165px;
margin:0px auto;
padding:0px;
}

ul.barBlue a:link,
ul.barPink a:link,
ul.barYellow a:link,
ul.barGreen a:link,
ul.barGrey a:link,
ul.barBlue a:visited,
ul.barPink a:visited,
ul.barYellow a:visited,
ul.barGreen a:visited,
ul.barGrey a:visited{
color:#0066ff;
text-decoration:none;
}

ul.barBlue a:active,
ul.barPink a:active,
ul.barYellow a:active,
ul.barGreen a:active,
ul.barGrey a:active,
ul.barBlue a:hover,
ul.barPink a:hover,
ul.barYellow a:hover,
ul.barGreen a:hover,
ul.barGrey a:hover{
color:#36f;
text-decoration:underline;
}

/* Sidemenu BlueBG */

ul.barBlue{
width:165px;
list-style-type:none;
/*margin:0 0 6px 7px;*/
margin:0px auto 7px;
padding:0 0 5px 0;
background:#b5e6ff url(../img/barblue_bottom.gif) no-repeat bottom left;
text-align:center;
}

ul.barBlue li{
margin:0 0 6px 5px; 
background:url(../img/barblue_listbgtop.gif) no-repeat top left;
text-align:left;
}


ul.barBlue a{
line-height:140%;
font-size:1.2em;
background:url(../img/barblue_listbgbottom.gif) no-repeat bottom left;
padding:4px 10px 4px 18px;
display:block;
_display:inline-block;
_width:131px;
}


/* Sidemenu PinkBG */


ul.barPink{
width:165px;
list-style-type:none;
/*margin:0 0 6px 7px;*/
margin:0px auto 7px;
padding:0 0 5px 0;
background:#f2c4c3 url(../img/barPink_bottom.gif) no-repeat bottom left;
text-align:center;
}



ul.barPink li{
margin:0 0 6px 5px; 
background:url(../img/barpink_listbgtop.gif) no-repeat top left;
text-align:left;
}


ul.barPink a{

line-height:140%;
font-size:1.2em;
background: url(../img/barpink_listbgbottom.gif) no-repeat bottom left;
padding:4px 10px 4px 18px;
display:block;
_display:inline-block;
_width:131px;
}



/* Sidemenu YellowBG */

ul.barYellow{
width:165px;
list-style-type:none;
/*margin:0 0 6px 7px;*/
margin:0px auto 7px;
padding:0 0 5px 0;
background:#fedd7b url(../img/baryellow_bottom.gif) no-repeat bottom left;
text-align:center;
}

ul.barYellow li{
margin:0 0 6px 5px; 
background:url(../img/baryellow_listbgtop.gif) no-repeat top left;
text-align:left;
}


ul.barYellow a{
line-height:140%;
font-size:1.2em;
background:url(../img/baryellow_listbgbottom.gif) no-repeat bottom left;
padding:4px 10px 4px 18px;
display:block;
_display:inline-block;
_width:131px;
}

/* Sidemenu GreenBG */

ul.barGreen{
width:165px;
list-style-type:none;
/*margin:0 0 6px 7px;*/
margin:0px auto 0px;
padding:0 0 5px 0;
background:#abe39d url(../img/bargreen_bottom.gif) no-repeat bottom left;
text-align:center;
}

ul.barGreen li{
margin:0 0 6px 5px; 
background:url(../img/bargreen_listbgtop.gif) no-repeat top left;
text-align:left;
}


ul.barGreen a{
line-height:140%;
font-size:1.2em;
background:url(../img/bargreen_listbgbottom.gif) no-repeat bottom left;
padding:4px 10px 4px 18px;
display:block;
_display:inline-block;
_width:131px;
}


/* Sidemenu GreyBG */

ul.barGrey{
width:165px;
list-style-type:none;
margin:10px auto 0px;
padding:0 0 5px 0;/*[上][右][下][左]*/
text-align:center;
}

ul.barGrey li{
/*margin:0 0 6px 5px; */
background:url(../img/bargrey_listbgtop.gif) no-repeat top left;
text-align:left;
margin-bottom:5px;
}


ul.barGrey a{
line-height:140%;
font-size:1.2em;
background:url(../img/bargrey_listbgbottom.gif) no-repeat bottom left;
padding:4px 10px 4px 25px;/*[上][右][下][左]*/
display:block;
_display:inline-block;
_width:131px;
}

#topmelma{
margin:10px 0px 0px;
width:180px;
min-height: 117px;
background:url(../img/melma_bg.gif) no-repeat top left;
}

#topmelma #inner{
width:163px;
margin:0px auto;

}

#topmelma #inner p{
padding-top:35px;
line-height:1.2;
font-size:1.2em;
margin-bottom:3px;
}

input.melma{
width:120px;
border:1px solid #ccc;
float:left;
}

input.btn{
float:right;
}


/*フッター
------------------------------------------------------------ */

.twoColFixLtHdr #footer, .twoColFixLtHdr2 #footer { 
	clear:both;
	width:100%;
	border-top:3px solid #dd0067;
} 

.twoColFixLtHdr #foot , .twoColFixLtHdr2 #foot{ 
	width:820px;
	margin:10px auto;
	font-size:1.2em;
	color:#666;
	
}

.twoColFixLtHdr #footer p ,.twoColFixLtHdr2 #footer p{
	margin: 0; /* フッターの最初のエレメントのマージンを 0 に設定することにより、マージンの相殺（div 間のスペース）が回避されます */
	padding: 10px 0; /* このエレメントの余白により、マージンの相殺を発生させることなく、マージンの効果とまったく同じように、スペースが設定されます */
}

#footer ul{
margin:5px auto 0px;
width:820px;
}

#footer li{
float:left;
list-style-type:none;
margin-left:5px;

}


/*second_menu
------------------------------------------------------------ */


.twoColFixLtHdr2 #line { 
	border-bottom:3px solid #dd0067;
	margin-bottom:8px;
} 

.twoColFixLtHdr2 #lead { 
	width: 800px; 
	margin:0px auto;
} 

.twoColFixLtHdr2 #lead h1 {
	margin: 0;
	padding: 10px 0;
	font-size:1.2em;
	font-weight:normal;
	text-align:right;
}

.twoColFixLtHdr2 #headerBasic {
	clear:both;
	width: 100%;
	height:81px;
	margin:0px auto 10px;
	background:url(../img/hd_basicbg.gif) bottom;
}

.twoColFixLtHdr2 #headerSchool{
	clear:both;
	width: 100%;
	height:81px;
	margin:0px auto 10px;
	background:url(../img/hd_schoolbg.gif) bottom;
}

.twoColFixLtHdr2 #headerFlow {
	clear:both;
	width: 100%;
	height:81px;
	margin:0px auto 10px;
	background:url(../img/hd_flowbg.gif) bottom;
}

.twoColFixLtHdr2 #headerSupport {
	clear:both;
	width: 100%;
	height:81px;
	margin:0px auto 10px;
	background:url(../img/hd_supportbg.gif) bottom;
}

.twoColFixLtHdr2 #headerElse {
		clear:both;
	width: 100%;
	height:81px;
	margin:0px auto 10px;
	background:url(../img/hd_elsebg.gif) bottom;
}

.twoColFixLtHdr2 #headerin {
	width: 800px;
	margin:auto;
}

.twoColFixLtHdr2 #hd_logo{
width:220px;
float:left;
text-align:left;
}

#hd_logo p{
padding:0px 0px 4px 3px;/*[上][右][下][左]*/
font-size:1.2em;
margin:0;
}

.twoColFixLtHdr2 #hd_contact{
width:570px;
float:right;
text-align:right;
}

.twoColFixLtHdr2 #hd_tel{
margin-top:2px;
margin-bottom:10px;
}

.twoColFixLtHdr2  #hd_contact ul{
width:552px;
float:right;
}


.twoColFixLtHdr2  #hd_contact li{
float:left;
margin-left:2px;
list-style-type:none;
}





.clm{
font-size:1.4em;
line-height:1.6;
}

div.pan{
clear:both;
font-size:12px;
margin:5px 0px;
color:#333;
padding:5px;
border-bottom:1px dashed #ddd;
}

.basic h3{
clear:both;
padding:5px 10px;
margin:10px 0px 5px;
border-top:2px solid #91ceee;
border-bottom:1px dashed #91ceee;
background:#e9f7fe;
}

.school h3{
clear:both;
padding:5px 10px;
margin:10px 0px 5px;
border-top:2px solid #f2b6b4;
border-bottom:1px dashed #f2b6b4;
background:#f0dcdb;
}

.flow h3{
clear:both;
padding:5px 10px;
margin:10px 0px 5px;
border-top:2px solid #f6d36d;
border-bottom:1px dashed #f6d36d;
background:#fdf3d7;
}

.support h3{
clear:both;
padding:5px 10px;
margin:10px 0px 5px;
border-top:2px solid #9fe38e;
border-bottom:1px dashed #9fe38e;
background:#dffdd7;
}

.r_image{
float:right;
padding:10px;
font-size:10px;
}

#sbtn{
width:600px;

}

#sbtn ul{
clear:both;
margin:5px auto 20px;

}

#sbtn li{
display:block;
float:left; 
padding-bottom:10px;
}

#sbtn li.m{
margin:0 7px; 
}

#ft_contact{
clear:both;
margin:15px auto 20px;
border-bottom:2px solid #ccc;
padding:5px 0px 15px;
}



.hatena{
margin:0px 3px;
background:url(../img/mk_q.gif) top left no-repeat;
padding-left:16px;
vertical-align:middle;
font-size:12px;
}

.int{
margin:0px 3px;
background:url(../img/mk_int.gif) no-repeat;
padding-left:16px;
vertical-align:middle;
}

div.bnr{
margin-bottom:10px;
}

div.bnr2{
margin:0px auto;
width:164px;
}

div.btn{
margin:10px auto;
width:343px;
}