@charset "UTF-8";

/* ------------------------------------------------------------
  CONTENTS CSS
  最終更新日 : 2011-05-19
------------------------------------------------------------ */


/* Learn Style
------------------------------------------------------------ */

.learnMain {
	position: relative;
	width: 620px;
	background: url(/j/syokuiku/kodomo_navi/learn/img/learn_read.jpg) no-repeat right 178px;
	margin-bottom: 30px;
}

.learnMain h1 {
	position: absolute;
	width: 620px;
	height: 194px;
}

.learnMain div {
	position: absolute;
	width: 312px;
	height: 24px;
	margin: 157px 0 0 150px;
}

.learnMain p {
	width: 420px;
	padding: 215px 0 0 10px;
}

.learnNaviLeft { float: left; width: 300px; }
.learnNaviRight { float: right; width: 300px; }

.learnNavi {
	position: relative;
	width: 300px;
	background: url(/j/syokuiku/kodomo_navi/learn/img/learn_back_02.gif) no-repeat left bottom;
}

.learnNavi .icon {
	position: absolute;
	width: 300px;
	background: url(/j/syokuiku/kodomo_navi/learn/img/learn_back_01.gif) no-repeat left top;
	padding: 27px 0 0 19px;
}

.learnNavi .title { padding: 31px 0 0 116px; }
.learnNavi p.text { padding: 5px 10px 0 116px; }

.learnNavi p.link {
	text-align: right;
	padding: 0 15px 17px 0;
}

.learnNavi p.link span {
	background: url(/j/syokuiku/kodomo_navi/learn/img/learn_arrow.gif) no-repeat right;
	font-size: 80%;
	padding: 4px 17px 4px 0;
}


/* Global Style
------------------------------ */

.globalLink { text-align: right; padding: 2px 0 2px 0; margin-bottom: 15px; }
.globalLink span.arrow { background: url(/j/syokuiku/kodomo_navi/learn/img/global_arrow.gif) no-repeat left; padding: 2px 15px 2px 20px; }

.globalFrame { background: url(/j/syokuiku/kodomo_navi/learn/img/global_frame_02.gif) no-repeat left bottom; }

.globalFrame .inline1 {
	position: relative;
	background: url(/j/syokuiku/kodomo_navi/learn/img/global_frame_01.gif) no-repeat left top;
	padding: 40px 21px 15px 21px;
	zoom: 1;
}

.globalFrame .inline1 .title1 { margin-bottom: 10px; }
.globalFrame .inline1 .img { margin: 20px 0 8px 0; }

.globalFrame .inline1 .read {
	position: absolute;
	width: 280px;
	color: #f39800;
	margin: 40px 0 0 300px;
}

.globalFrame .inline1 .global1Map {
	position: relative;
	width: 580px;
	height: 337px;
	background: url(/j/syokuiku/kodomo_navi/learn/img/global1_map.gif) no-repeat left top;
	zoom: 1;
}

.globalFrame .inline1 .global1Map .title2 { position: absolute; margin-left: 108px; }
.globalFrame .inline1 .global1Map .point1 { position: absolute; margin: 41px 0 0 10px; }
.globalFrame .inline1 .global1Map .point2 { position: absolute; margin: 38px 0 0 357px; }
.globalFrame .inline1 .global1Map .point3 { position: absolute; margin: 38px 0 0 463px; }
.globalFrame .inline1 .global1Map .point4 { position: absolute; margin: 213px 0 0 164px; }
.globalFrame .inline1 .global1Map .point5 { position: absolute; margin: 231px 0 0 410px; }

.globalFrame {
	background: url(/j/syokuiku/kodomo_navi/learn/img/global_frame_02.gif) no-repeat left bottom;
	zoom: 1;
}

.globalFrame .inline2 {
	background: url(/j/syokuiku/kodomo_navi/learn/img/global_frame_01.gif) no-repeat left top;
	padding: 40px 21px 0 21px;
	zoom: 1;
}

.globalFrame .inline2 .data1 {
	position: relative;
	width: 578px;
	height: 286px;
	margin-bottom: 25px;
}

.globalFrame .inline2 .data2 {
	position: relative;
	width: 578px;
}

.globalFrame .inline2 .data1 .list,
.globalFrame .inline2 .data2 .list {
	width: 198px;
	height: 45px;
	margin-bottom: 5px;
}

.globalFrame .inline2 .data1 .text,
.globalFrame .inline2 .data2 .text {
	width: 180px;
	padding-bottom: 70px;
}

.globalFrame .inline2 .data1 .graph,
.globalFrame .inline2 .data2 .graph {
	position: absolute;
	width: 380px;
	margin-left: 198px;
}

.globalFrame .bottom { padding: 0 2px 10px 2px; }


/* Seasons Style
------------------------------ */

.seasonsLink {
	text-align: right;
	padding: 2px 0 2px 0;
	margin-bottom: 15px;
}

.seasonsLink span.arrow {
	background: url(/j/syokuiku/kodomo_navi/learn/img/seasons_arrow.gif) no-repeat left;
	padding: 2px 15px 2px 20px;
	zoom: 1;
}

.seasonsFrame {
	width: 620px;
	background: url(/j/syokuiku/kodomo_navi/learn/img/seasons_frame_02.gif) no-repeat left bottom;
	zoom: 1;
}

.seasonsFrame .inline1 {
	background: url(/j/syokuiku/kodomo_navi/learn/img/seasons_frame_01.gif) no-repeat left top;
	padding: 40px 21px 0 21px;
	zoom: 1;
}

.seasonsFrame .seasons1Img {
	background: url(/j/syokuiku/kodomo_navi/learn/img/seasons1_img.gif) no-repeat right 10px;
	margin: 0 51px 0 106px;
	zoom: 1;
}

.seasonsFrame .seasons1Img p {
	width: 400px;
	text-align: center;
}

.seasonsFrame .inline2 {
	background: url(/j/syokuiku/kodomo_navi/learn/img/seasons_frame_01.gif) no-repeat left top;
	padding: 20px 21px 10px 21px;
	zoom: 1;
}

.seasonsFrame .seasonsList { margin-left: 33px; }

.seasonsFrame .seasonsList ul { clear: both; }

.seasonsFrame .seasonsList li {
	float: left;
	padding-left: 0;
	margin: 0 17px 0 0;
	padding-left: 0;
}

.seasonsFrame .seasonsList li img { vertical-align: top; }

.seasons2Line {
	background: url(/j/syokuiku/kodomo_navi/learn/img/seasons2_line.gif) no-repeat left top;
	padding: 15px 0 14px 15px;
	zoom: 1;
}


/* Event Style
------------------------------ */

.eventFrame {
	background: url(/j/syokuiku/kodomo_navi/learn/img/event_frame_02.gif) repeat-y left top;
	zoom: 1;
}

.eventFrame .inline {
	background: url(/j/syokuiku/kodomo_navi/learn/img/event_frame_01.gif) no-repeat left top;
	padding: 66px 16px 20px 1px;
	zoom: 1;
}

.eventQuestion {
	height: 131px;
	position: relative;
	background: url(/j/syokuiku/kodomo_navi/learn/img/event_frame_03.gif) no-repeat left top;
	zoom: 1;
}

.eventQuestion div {
	position: absolute;
	margin: 28px 0 0 28px;
}

.eventQuestion p {
	position: absolute;
	width: 340px;
	margin: 37px 0 0 243px;
}

.eventList {
	height: 705px;
	position: relative;
	margin-left: 31px;
}

.eventList .list1 { position: absolute; width: 258px; height: 345px; }
.eventList .list2 { position: absolute; width: 258px; height: 345px; margin-left: 282px; }
.eventList .list3 { position: absolute; width: 258px; height: 345px; margin: 360px 0 0 0; }
.eventList .list4 { position: absolute; width: 258px; height: 345px; margin: 360px 0 0 282px; }


/* Power Style
------------------------------ */

.powerText { float: left; width: 390px; }
.powerImg { float: right; width: 210px; }

.powerTitle1,
.powerTitle2,
.powerTitle3,
.powerTitle4,
.powerTitle5 { position: relative; width: 620px; }
.powerTitle6 { position: relative; width: 620px; height: 220px; }
.powerTitle7 { position: relative; width: 620px; height: 324px; }

.powerTitle1 .icon,
.powerTitle2 .icon,
.powerTitle3 .icon,
.powerTitle4 .icon,
.powerTitle5 .icon { position: absolute; }

.powerTitle1 .link,
.powerTitle2 .link,
.powerTitle3 .link,
.powerTitle4 .link,
.powerTitle5 .link { position: absolute; width: 480px; text-align: right; padding: 2px 0 2px 0; margin: 32px 0 25px 140px; }
.powerTitle6 .link,
.powerTitle7 .link { position: absolute; width: 620px; text-align: right; }

.powerTitle1 .link span.arrow { background: url(/j/syokuiku/kodomo_navi/learn/img/power_arrow_01.gif) no-repeat 15px top; padding: 0 0 4px 35px; }
.powerTitle2 .link span.arrow { background: url(/j/syokuiku/kodomo_navi/learn/img/power_arrow_02.gif) no-repeat 15px top; padding: 0 0 4px 35px; }
.powerTitle3 .link span.arrow { background: url(/j/syokuiku/kodomo_navi/learn/img/power_arrow_03.gif) no-repeat 15px top; padding: 0 0 4px 35px; }
.powerTitle4 .link span.arrow { background: url(/j/syokuiku/kodomo_navi/learn/img/power_arrow_04.gif) no-repeat 15px top; padding: 0 0 4px 35px; }
.powerTitle5 .link span.arrow { background: url(/j/syokuiku/kodomo_navi/learn/img/power_arrow_05.gif) no-repeat 15px top; padding: 0 0 4px 35px; }
.powerTitle6 .link span.arrow,
.powerTitle7 .link span.arrow { background: url(/j/syokuiku/kodomo_navi/learn/img/power_arrow_06.gif) no-repeat 15px top; padding: 0 8px 4px 35px; }

.powerTitle1 h2 { position: absolute; padding: 80px 0 0 220px; }
.powerTitle2 h2 { position: absolute; padding: 80px 0 0 180px; }
.powerTitle3 h2 { position: absolute; padding: 80px 0 0 140px; }
.powerTitle4 h2 { position: absolute; padding: 80px 0 0 155px; }
.powerTitle5 h2 { position: absolute; padding: 80px 0 0 200px; }

.powerTitle1 .text { padding: 115px 0 20px 220px; }
.powerTitle2 .text { padding: 115px 0 30px 180px; }
.powerTitle3 .text { padding: 115px 0 30px 140px; }
.powerTitle4 .text { padding: 115px 0 30px 155px; }
.powerTitle5 .text { padding: 115px 0 30px 200px; }
.powerTitle5 .text2 { padding: 115px 120px 30px 200px; }
.powerTitle6 .copy,
.powerTitle7 .copy { position: absolute; }

.powerTitle2bg { background: url(/j/syokuiku/kodomo_navi/learn/img/power04_bg.jpg) no-repeat 75px 92px; }
.powerTitle2bg .icon { position: absolute; }
.powerTitle2bg .link { position: absolute; width: 480px; text-align: right; padding: 2px 0 2px 0; margin: 30px 0 25px 140px; }
.powerTitle2bg .link span.arrow { background: url(/j/syokuiku/kodomo_navi/learn/img/power_arrow_02.gif) no-repeat 15px top; padding: 0 0 4px 35px; }
.powerTitle2bg H2 { position: absolute; padding: 82px 0 0 180px; }
.powerTitle2bg .img { position: absolute; padding: 241px 0 0 483px; }
.powerTitle2bg .text { padding: 305px 135px 20px 75px; }

.powerFrameLeft { float: left; position: relative; width: 303px; height: 140px; }
.powerFrameRight { float: right; position: relative; width: 303px; height: 140px; }
.powerFrameTitle { position: absolute; width: 145px; }

.powerFrame1 { position: absolute; width: 160px; height: 140px; background: url(/j/syokuiku/kodomo_navi/learn/img/power_frame_bg1.gif) no-repeat left top; margin-left: 145px; }
.powerFrame2 { position: absolute; width: 160px; height: 140px; background: url(/j/syokuiku/kodomo_navi/learn/img/power_frame_bg2.gif) no-repeat left top; margin-left: 145px; }
.powerFrame3 { position: absolute; width: 160px; height: 140px; background: url(/j/syokuiku/kodomo_navi/learn/img/power_frame_bg3.gif) no-repeat left top; margin-left: 145px; }
.powerFrame4 { position: absolute; width: 160px; height: 140px; background: url(/j/syokuiku/kodomo_navi/learn/img/power_frame_bg4.gif) no-repeat left top; margin-left: 145px; }
.powerFrame5 { position: absolute; width: 160px; height: 140px; background: url(/j/syokuiku/kodomo_navi/learn/img/power_frame_bg5.gif) no-repeat left top; margin-left: 145px; }
.powerFrame6 {
	background: url(/j/syokuiku/kodomo_navi/learn/img/power_frame_bg6.gif) no-repeat left top;
	padding: 30px 20px 21px 28px;
	margin: 12px 0 0 10px;
}

.powerRead {
	width: 155px;
	height: 75px;
	margin: 28px 0 7px 0;
}

.powerBtn {
	width: 86px;
	height: 15px;
	margin-left: 64px;
}


/* Power01 Style
------------------------------ */

.power01_main_contents_01 {
	background: url(/j/syokuiku/kodomo_navi/learn/img/power01_table_01bg.gif) no-repeat left top;
	margin:0px;
	padding:0px;
	zoom: 1;
}

.power01_main_contents_01l {
	float: left;
	margin:0px;
	padding:30px 0 0 40px;
}

.power01_main_contents_01r {
	float: right;
	text-align:left;
	font-size:110%;
	line-height:180%;
	width: 310px;
	margin:0px;
	padding:30px 40px 0 0;
}

.power01_main_contents_02 {
	background: url(/j/syokuiku/kodomo_navi/learn/img/power01_table_02bg.gif) no-repeat left top;
	margin:0px;
	padding:0px;
	zoom: 1;
}

.power01_main_contents_02l {
	float: left;
	margin:0px;
	padding:30px 0 0 40px;
}

.power01_main_contents_02r {
	float: right;
	text-align:left;
	font-size:110%;
	line-height:180%;
	width: 310px;
	margin:0px;
	padding:30px 40px 0 0;
}

.power01_main_contents_03 {
	background: url(/j/syokuiku/kodomo_navi/learn/img/power01_table_03bg.gif) no-repeat left top;
	margin:0px;
	padding:0px;
	zoom: 1;
}

.power01_main_contents_03l {
	float: left;
	margin:0px;
	padding:40px 0 0 40px;
}

.power01_main_contents_03r {
	float: right;
	text-align:left;
	font-size:110%;
	line-height:180%;
	width: 310px;
	margin:0px;
	padding:40px 40px 0 0;
}

.power01_main_contents_mfoot{
	clear: both;
	width: 620px;
	height: 17px;
}

.power01_main_contents_foot{
	clear: both;
	width: 620px;
	height: 38px;
}

.power01_main_contents {
	background: url(/j/syokuiku/kodomo_navi/learn/img/power01_table_bg.gif) repeat-y;
	margin:0px;
	padding:0px;
}


/* Power02 Style
------------------------------ */

.power02 { width: 620px; background-color: #fffbc4; }
.power02 .contents01 .left { float: left; width: 320px; padding: 0 0 0 30px; }
.power02 .contents01 .right { float: right; width: 250px; }
.power02 .contents02 { background: url(/j/syokuiku/kodomo_navi/learn/img/power02_back_03.gif) no-repeat left bottom; }
.power02 .contents02 .left { float: left; width: 220px; padding: 0 0 0 30px; }
.power02 .contents02 .right { margin-left: 250px; }


/* Power03 Style
------------------------------ */


/* Power04 Style
------------------------------ */

.power04List1 { float: left; width: 200px; padding-right: 10px; }
.power04List2 { float: left; width: 200px; }
.power04List3 { float: right; width: 200px; }


/* Power05 Style
------------------------------ */

.power05_contents_table{
	background: url(/j/syokuiku/kodomo_navi/learn/img/power05_table_bg.gif);
	margin:0px;
	padding:0px;
}

.power05_contents_table_p1 { padding:0px 5px 0 30px; }
.power05_contents_table_p2 { padding:0px 20px 0 20px; }


/* Power06 Style
------------------------------ */

.power06_contents_table{
	background: url(/j/syokuiku/kodomo_navi/learn/img/power06_table_bg.gif);
	margin:0px;
	padding:0px;
}

.power06_contents_table p { padding:10px 30px 0 0; }


/* Power07 Style
------------------------------ */

.power07Img { float: left; width: 337px; }
.power07Text { float: right; width: 270px; margin-top: 55px; }

.power07Frame { background: url(/j/syokuiku/kodomo_navi/learn/img/power07_bg_02.gif) no-repeat left bottom #fffbc4; padding-bottom: 30px; }
.power07Frame .title { background: url(/j/syokuiku/kodomo_navi/learn/img/power07_bg_01.gif) no-repeat left top; }
.power07Frame .icon { float: left; width: 105px; }
.power07Frame p { float: right; width: 475px; padding: 22px 25px 0 15px; }


/* Power08 Style
------------------------------ */

.power08Frame {
	width: 620px;
	background: url(/j/syokuiku/kodomo_navi/learn/img/power08_bg_01.gif) no-repeat left top #fffbc4;
	display: block;
}


/* Power09 Style
------------------------------ */

.power09_column1_block{ width:620px; }

.power09_column1_block_l{
	float: left;
	text-align:left;
	width:175px;
}
.power09_column1_block_r{
	float: right;
	text-align:left;
	padding-top:40px;
	width:430px;
}
.power09_column2_block{
	background: url(/j/syokuiku/kodomo_navi/learn/img/power09_column2_bg.jpg) no-repeat left top;
	width:620px;
	height:131px;
	margin-top:20px;
}
.power09_column2_block_l{
	float: left;
	text-align:left;
	padding:35px 0 0 25px;
	width:200px;
}
.power09_column2_block_r{
	float: right;
	text-align:left;
	padding:35px 20px 0 0;
	width:260px;
}
.power09_clearboth {
	clear: both;
	margin:0px;
	padding:0px;
}


/* Power10 Style
------------------------------ */

.power10_column1_block{
	text-align:center;
	background: url(/j/syokuiku/kodomo_navi/learn/img/power10_column_bg1.gif) no-repeat left top;
	width:620px;
	height:160px;
}
.power10_column1_block_t{
	padding-top:10px;
}
.power10_column1_block_r{
	text-align:left;
	width:250px;
	margin:0px auto;
	padding-top:15px;
}
.power10_column2_block{
	text-align:center;
	width:620px;
	margin-top:20px;
}
.power10_column2_block_line{
	padding:5px 0 0 0;
}
.power10_column2_block_r{
	text-align:left;
	width:580px;
	margin:0px auto;
	margin-top:10px;
}

.power10_column3_block{
	text-align:center;
	background: url(/j/syokuiku/kodomo_navi/learn/img/power10_column_bg3.gif) no-repeat left top;
	width:620px;
	height:160px;
	margin-top:30px;
}
.power10_column3_block_l{
	float: left;
	text-align:left;
	padding-top:30px;
	width:250px;
}
.power10_column3_block_r{
	float: right;
	text-align:left;
	padding-top:40px;
	width:270px;
}


/* Power11 Style
------------------------------ */

.power11List {
	clear: both;
	width: 620px;
	position: relative;
}

.power11List .image { float: left; width: 225px; }
.power11List .name { float: right; padding: 20px 0 0 0; }
.power11List .text { float: left; width: 355px; padding: 20px; }

.power11List2 {
	clear: both;
	width: 620px;
	min-height: 1px;
	background-color: #fffbe9;
}

.power11List2:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.power11List2 .image { float: left; width: 225px; }
.power11List2 .name { float: right; padding: 20px 0 0 0; }
.power11List2 .text { float: left; width: 355px; padding: 20px; }


/* Power12 Style
------------------------------ */

.power12 {
	clear: both;
	width: 620px;
	height: 453px;
	position: relative;
}

.power12 .img01 { position: absolute; top: 65px; left: 0; }
.power12 .img02 { position: absolute; top: 65px; left: 235px; }
.power12 .img03 { position: absolute; top: 5px; right: 0; }
.power12 .img04 { position: absolute; top: 235px; left: 0; }
.power12 .img05 { position: absolute; top: 235px; left: 157px; }
.power12 .img06 { position: absolute; top: 235px; left: 157px; }
.power12 .img06 { position: absolute; top: 235px; left: 314px; }
.power12 .img07 { position: absolute; top: 235px; right: 0; }


