@charset "utf-8";

@import url("../../style/base.css");

@import url("structure.css");

/*====================================================
------------------------------------------------------
	 main.css
------------------------------------------------------
====================================================*/

/*================= contents menu ============

	1: pageImg
	
	2: common
	   - h2
		- h3
		- text
			- .w90Br
			- .w90
			- .w100Br
			- .w100Br
			- .s85Br
			- .s85
			
			
	*3: Top  ID:ktop
	
	4: Introduction  ID:intro
	
	5: CharacteristicOfLearning  ID:chara

	6: SchoolLife  ID:life
	
	7: ApplicationGuidebook  ID:app

	8: Photogallery  ID:photo
	
	9: ChildCare  ID:childCare

	:areaE 
	  - copy

	
============================================== */

/*====================================================
	1: pageImg
====================================================*/

#ktop #areaB { background: url(../img/pageImg.jpg);}

#intro #areaB { background: url(../Introduction/img/pageImg.jpg);}
#chara #areaB { background: url(../CharacteristicOfLearning/img/pageImg.jpg);}
#life #areaB { background: url(../SchoolLife/img/pageImg.jpg);}
#app #areaB { background: url(../ApplicationGuidebook/img/pageImg.jpg);}

#pageImg { width: 175px; height: 295px; background: url(../c_img/pageImg.jpg) no-repeat; text-indent: -9876em; margin: -10px 0 0 0;}


/*====================================================
	2: common
====================================================*/
h2 { width: 545px; text-indent: -9876em; margin: 0 0 10px 0; background: no-repeat;} 
h3 { width: 545px; height: 30px; text-indent: -9876em; margin: 0 0 15px 0; background: no-repeat;} 


/*
  -text
====================================================*/
/*
	- w = width
	- s = font size
	- R = text align Right
*/	

p { padding: 0 0 .8em 0;}
.w90 { width: 90%;}
.s85 { font-size: .765em;}
.s85R { font-size: .765em; text-align: right;}
.w100R { width: 100%; text-align: right;}
.w100s85R { width: 100%; text-align: right; font-size: .765em;  }

/*
  -other
====================================================*/

.left { float: left;}
.right { float: right;}
#areaC ul { padding-bottom: .8em }

.rowSet { width: 545px;}
.rowSet:after { clear: both; content: "."; display: block; height: 0; visibility: hidden;}
/*\*//*/
   .rowSet  {
         display: inline-table;
     }
 /**/




/*====================================================
	3: Top  ID:ktop
====================================================*/
#ktop #areaA { width: 765px; height: 74px;  padding: 0; margin: 0 auto; position: relative; background: url(../c_img/bgAreaA.gif) no-repeat;}
#ktop .goToTop { margin: 0 10px 15px auto;} 

.btTopTopics  { float: left; display: block; width: 225px; height: 167px; background: url(../img/btTopTopics.jpg) 0 0 no-repeat; padding: 0; margin: 0; overflow:hidden;}
/*\*//*/
 overflow:auto;
/**/
.btTopTopics  a { display: block; width: 225px; height: 167px;  text-indent: -9876em;}
.btTopTopics  a:hover { background: url(../img/btTopTopics.jpg) -225px 0;}

.btTopPhoto  { float: right; display: block; width: 300px; height: 167px; background: url(../img/btTopPhoto.jpg) 0 0 no-repeat; padding: 0; margin: 0; overflow:hidden;}
/*\*//*/
 overflow:auto;
/**/
.btTopPhoto  a { display: block; width: 300px; height: 167px;  text-indent: -9876em;}
.btTopPhoto  a:hover { background: url(../img/btTopPhoto.jpg) -300px 0;}


/*====================================================
	4: Introduction  ID:intro
====================================================*/

#intro h2 { height: 35px; background: url(../Introduction/img/k01_h2.gif);}
#intro h3.k01_h3_00 { height: 35px; background: url(../Introduction/img/k01_h3_00.gif);}
#intro h3.k01_h3_01  { width: 420px; height: 55px; background: url(../Introduction/img/k01_h3_01.gif); text-indent: -9876em; margin: 0 0 10px 0;}
#intro h3.k01_h3_02 { height: 25px; background: url(../Introduction/img/k01_h3_02.gif); margin-top: 35px;}
#intro h4 { color: #aa965c; font-weight: bold;}
#intro h4.pink { color: #da4d64;}

#intro #areaC dl { width: 545px; margin: 35px 0 0 0;}
#intro #areaC dl:after { clear: both; content: "."; display: block; height: 0; visibility: hidden;}
/*\*//*/
     #intro #areaC dl　{
         display: inline-table;
     }
 /**/
#intro #areaC dl dt { display: block; width: 75px; float: left; font-size: 120%; font-weight: bold;}
#intro #areaC dl dd { display: block; width: 440px; float: right; margin: 0 0 0 10px; padding: 0 0 0 15px; border-left: 1px solid #333;}



#intro #areaC .left { margin: 0 8px 0 0;}
#intro #areaC span { display: block; font-size: .765em;}


/*====================================================
	5: CharacteristicOfLearning  ID:chara
====================================================*/

#chara h2 { height: 35px; background: url(../CharacteristicOfLearning/img/k02_h2.gif);}
#chara h3.k02_h3_00 { height: 54px; background: url(../CharacteristicOfLearning/img/k02_h3_00.gif) no-repeat;}
#chara h3.k02_h3_01 { height: 54px; background: url(../CharacteristicOfLearning/img/k02_h3_01.gif); margin-top: 50px;}
#chara h3.k02_h3_02 { height: 54px; background: url(../CharacteristicOfLearning/img/k02_h3_02.gif); margin-top: 50px;}

#chara h4.k02_h4_00 { height: 35px; background: url(../CharacteristicOfLearning/img/k02_h4_00.gif); text-indent: -9876em;}
#chara h4.k02_h4_01 { height: 35px; background: url(../CharacteristicOfLearning/img/k02_h4_01.gif); text-indent: -9876em;}
#chara h4.k02_h4_02 { height: 35px; background: url(../CharacteristicOfLearning/img/k02_h4_02.gif); text-indent: -9876em;}

#chara h4.blueL, #chara h4.blueS { background: #89A3D4; color: #fff; font-weight: bold; margin: 0 0 10px 0; padding: 0 0 0 10px}
#chara h4.blueL { width: 535px;}
#chara h4.blueS { width: 240px;}

#chara #areaC dl.line { width: 525px; background: #fffef7 url(../c_img/line1_30.gif) 210px 0 repeat-y; border: 1px solid #ccc; padding: 10px; margin: 0 0 5px 0;}
#chara #areaC dl.line dd:after { clear: both; content: "."; display: block; height: 0; visibility: hidden;}
/*\*//*/
     #chara #areaC dl.line dd {
         display: inline-table;
     }
 /**/
#chara #areaC dl.line dd img { float: left; margin-right: 20px;}
#chara #areaC dl.line dd p { padding-bottom: 0;}
#chara #areaC dl.line dd p strong { display: block;}

#chara #areaC dl.noline { width: 545px; margin: 0;}
#chara #areaC dl.noline:after { clear: both; content: "."; display: block; height: 0; visibility: hidden;}
/*\*//*/
     #chara #areaC dl.noline {
         display: inline-table;
     }
 /**/
#chara #areaC dl.noline dd.left { width: 250px; float: left; padding: 0;}
#chara #areaC dl.noline dd.right { width: 250px; float: right; padding: 0;}

.k02Con1 { width: 545px; position: relative; margin: 0;}
.k02Con1 ul { margin: 0 0 15px 15px; line-height: 140%;}
.k02_00 { width: 190px; height: 130px; position: absolute; top: 40px; left: 215px;}
.k02_01 { width: 130px; height: 170px; position: absolute; top: 0; left: 415px;}
.k02_02 { width: 213px; height: 142px; position: absolute; top: 180px; left: 332px;}


/*====================================================
	6: SchoolLife  ID:life
====================================================*/

#life h2 { height: 35px; background: url(../SchoolLife/img/k03_h2.gif);}
#life h3.k03_h3_00 { height: 55px; background: url(../SchoolLife/img/k03_h3_00.gif);}


#life .rowSet { border-top: 1px solid #ccc; padding: 15px 0;}
#life .rowSet dd { width: 160px; float: left; margin: 0 32px 0 0;}
#life .rowSet dd ul { clear: left; width: 145px; height: 180px; padding: 5px 0 0 15px;}
#life .rowSet dd ul li { background: url(../c_img/pmDotK.gif) 0 .3em no-repeat; padding: 0 0 0 15px;}
#life .rowSet dd h4 { clear: left; width: 160px; height: 35px; text-indent: -9876em;}

#life .rowSet dd.m4 h4 { background: url(../SchoolLife/img/k03_h4_00.gif)}
#life .rowSet dd.m4 ul { background: url(../SchoolLife/img/k03_00.jpg)}
#life .rowSet dd.m5 h4 { background: url(../SchoolLife/img/k03_h4_01.gif)}
#life .rowSet dd.m5 ul { background: url(../SchoolLife/img/k03_01.jpg)}
#life .rowSet dd.m6 h4 { background: url(../SchoolLife/img/k03_h4_02.gif)}
#life .rowSet dd.m6 ul { background: url(../SchoolLife/img/k03_02.jpg)}
#life .rowSet dd.m7 h4 { background: url(../SchoolLife/img/k03_h4_03.gif)}
#life .rowSet dd.m7 ul { background: url(../SchoolLife/img/k03_03.jpg)}
#life .rowSet dd.m8 h4 { background: url(../SchoolLife/img/k03_h4_04.gif)}
#life .rowSet dd.m8 ul { background: url(../SchoolLife/img/k03_04.jpg)}
#life .rowSet dd.m9 h4 { background: url(../SchoolLife/img/k03_h4_05.gif)}
#life .rowSet dd.m9 ul { background: url(../SchoolLife/img/k03_05.jpg)}
#life .rowSet dd.m10 h4 { background: url(../SchoolLife/img/k03_h4_06.gif)}
#life .rowSet dd.m10 ul { background: url(../SchoolLife/img/k03_06.jpg)}
#life .rowSet dd.m11 h4 { background: url(../SchoolLife/img/k03_h4_07.gif)}
#life .rowSet dd.m11 ul { background: url(../SchoolLife/img/k03_07.jpg)}
#life .rowSet dd.m12 h4 { background: url(../SchoolLife/img/k03_h4_08.gif)}
#life .rowSet dd.m12 ul { background: url(../SchoolLife/img/k03_08.jpg)}
#life .rowSet dd.m1 h4 { background: url(../SchoolLife/img/k03_h4_09.gif)}
#life .rowSet dd.m1 ul { background: url(../SchoolLife/img/k03_09.jpg)}
#life .rowSet dd.m2 h4 { background: url(../SchoolLife/img/k03_h4_10.gif)}
#life .rowSet dd.m2 ul { background: url(../SchoolLife/img/k03_10.jpg)}
#life .rowSet dd.m3 h4 { background: url(../SchoolLife/img/k03_h4_11.gif)}
#life .rowSet dd.m3 ul { background: url(../SchoolLife/img/k03_11.jpg)}
#life .rowSet dd.m6, #life .rowSet dd.m9, #life .rowSet dd.m12, #life .rowSet dd.m3 { margin: 0;}



/*====================================================
	7: ApplicationGuidebook  ID:app
====================================================*/

#app h2 { height: 35px; background: url(../ApplicationGuidebook/img/k04_h2.gif);}
#app h3 { height: 25px; margin: 30px 0 8px 0;}
#app h3.k04_h3_01 { background: url(../ApplicationGuidebook/img/k04_h3_01.gif); margin-top: 0px;}
#app h3.k04_h3_02 { background: url(../ApplicationGuidebook/img/k04_h3_02.gif);}
#app h3.k04_h3_03 { background: url(../ApplicationGuidebook/img/k04_h3_03.gif);}
#app h3.k04_h3_04 { background: url(../ApplicationGuidebook/img/k04_h3_04.gif);}
#app h3.k04_h3_05 { background: url(../ApplicationGuidebook/img/k04_h3_05.gif);}
#app h3.k04_h3_06 { background: url(../ApplicationGuidebook/img/k04_h3_06.gif);}
#app h3.k04_h3_07 { background: url(../ApplicationGuidebook/img/k04_h3_07.gif);}
#app h3.k04_h3_08 { background: url(../ApplicationGuidebook/img/k04_h3_08.gif);}
#app h3.k04_h3_09 { background: url(../ApplicationGuidebook/img/k04_h3_09.gif);}
#app h3.k04_h3_10 { background: url(../ApplicationGuidebook/img/k04_h3_10.gif);}
#app h3.k04_h3_11 { background: url(../ApplicationGuidebook/img/k04_h3_11.gif);}

table { width: 545px; margin: 0 auto; padding: 0; border-top: 1px solid #db4e64;}
table th { width: 15%; background: #fff8f9; border-left: 1px solid #db4e64; border-right: 1px solid #db4e64; border-bottom: 1px solid #db4e64; font-weight: normal; padding: 10px 5px 10px 10px;}
table td { width: 85%;background: #fff; border-right: 1px solid #db4e64; border-bottom: 1px solid #db4e64; padding: 10px 5px 10px 15px;}
table tbody.w50 td { width: 50%; border-left: 1px solid #db4e64; border-right: 1px solid #db4e64; border-bottom: 1px solid #db4e64; }
table tbody.w50 td.noline, th.noline { border-left: none; }
thead th { text-align: center;}

thead th.w20, td.w20 { width: 20%; border-left: 1px solid #db4e64;}
thead th.w30, td.w30 { width: 30%; border-left: 1px solid #db4e64;}
thead th.w30nl, td.w30nl { width: 30%; border-left: none;}
thead th.w65, td.w65 { width: 65%;}
thead th.w75 { width: 75%;}
thead th.w15, td.w15 { width: 15%;}
thead th.w65, thead th.w15, thead th.w75 { border-left: none;}



ul.dotPink li { background: url(../c_img/pmDotPink.gif) 0 .3em no-repeat; padding-left: 15px; }
ul.dotK li { background: url(../c_img/pmDotK.gif) 0 .3em no-repeat; padding-left: 15px; }
ul.noDot  li { background: none;}

span.sp1 { padding-left: 1em;}
span.sp2 { padding-left: 2em;}
span.sp3 { padding-left: 3em;}
span.sp4 { padding-left: 4em;}


/*====================================================
	8: Photogallery  ID:photo
====================================================*/

#photo h2 { height: 137px; background: url(../PhotoGallery/img/k05_h2.gif);}

.upperImg { width: 545px; height: 970px; background: url(../PhotoGallery/img/k05_00.jpg);}
.upperImg p { display: none;}

/*====================================================
	9: ChildCare  ID:childCare
====================================================*/

#childCare h2 { height: 35px; background: url(../ChildCare/img/k05_h2.gif);}
#childCare h3 { height: 35px; margin: 10px 0;}
#childCare h3.h3_01 { background: url(../ChildCare/img/k05_h3_01.gif);}
#childCare h3.h3_02 { clear: both; background: url(../ChildCare/img/k05_h3_02.gif); margin-top: 40px}

#childCare h4 { width: 535px; clear: both; background: #89A3D4; color: #fff; font-size: 120%; font-weight: bold; margin: 0 0 10px 0; padding: .3em 0 .3em 10px}
#childCare h4.irregular { clear: both; margin: 10px 0 10px 0;}


#childCare table { float: left; width: 370px; margin: 0 0 30px 0;}
#childCare table td span { display: block; margin: 0 auto 5px auto; border-left: 10px solid #ccc; background: #efefef; padding-left: .3em; font-weight: bolder;}

#childCare .dotPink { background: url(../c_img/pmDotPink.gif) 0 .3em no-repeat; padding-left: 15px; }

#childCare .photoBox { float: right; width: 160px; margin: 0; padding: 0;}
#childCare .photoBox:after { clear: both; content: "."; display: block; height: 0; visibility: hidden;}
/*\*//*/
     #childCare .photoBox {
         display: inline-table;
     }
 /**/

#childCare .photoBox div { clear: both; width: 160px; margin: 0 0 10px 0;}
#childCare .photoBox div img { display: block;}
#childCare .photoBox div span { font-size: .765em;}


/*====================================================
	 -areaE(footer)
====================================================*/
#areaE .copy { width: 95%; padding: 0 ; margin: 0 5px 2px auto; text-align: right; color: #fff; line-height: 1.3em;  position: absolute; bottom: 0; right: 0;}