@charset "UTF-8";
/* CSS Document */


/*=======================================================
	Topics 
=======================================================*/
.Topics {
	width: 100%;
	/*height: 8em;*/
	margin: 0 auto;
	overflow: scroll;
}


/*====================================================
	●style.css 画面の横幅が769px以上  
	Note PC size以上
======================================================*/
@media screen and (min-width: 769px){
	
	/*---------------
		MENU Home
	----------------*/
	ul.drawer-menu li:first-child a.drawer-menu-item {
		background-image: url(../img/icon_menu_circleback_active_200.png);
	}
	
	/*=================================================
		子どもたちの未来に向けた知育教育を
	==================================================*/
	main > section:first-child {
		width: 90%;
		max-width: 1020px;
		margin: 5% auto;
		padding: 0;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		
		position: relative;
		/*border: thin dashed #F69;*/
	}
	/*----------
		画像
	-----------*/
	main > section:first-child > picture:first-child {
		width: 35%;
	}
	/*------------
		本文
	-------------*/
	main > section:first-child dl {
		width: 62%;
	}
	/** title画像 **/
	main > section:first-child dt picture {
		width: 100%;
	}
	/** text **/
	main > section:first-child dd {
		color: #666;
		text-align: left;
		margin-top: 4%;
		padding-left: 3%;
	}
	main > section:first-child dd p {
		letter-spacing: 2px;
		line-height: 1.3rem;
		margin-bottom: 2%;
	}
	/** icon 鳥 **/
	main > section:first-child > picture:last-child {	
		position: absolute;
		right: 0;
		bottom: -3rem;
	}
	
	
	/*=========================================================
		知育教育
	==========================================================*/
	section.IntellectualTraining {
		margin: 5% 0;
	}
	section.IntellectualTraining h2 {
		width: 350px;
		margin: 3% auto;
	}
	section.IntellectualTraining > p {
		width: 65%;
		color: #30A6CA;
		text-align: left;
		margin-left: auto;
	}
	
	/*=============================
		英語教育 ●画像/Text
	==============================*/
	section.IntellectualTraining section:nth-child(3) {
		width: 100%;
		max-width: 1024px;
		margin: 0 auto;
		 
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		/*-webkit-justify-content: space-between;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;*/
		
		/*border: thin dashed #F09;*/
	}
	/*----------------------------
		●画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(3) > picture {
		width: 338px;
	}
	/*----------------------------
		text / 画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(3) > div {
		width: 56%;
		/*flex: 1;*/
		height: 265px;
		background-color: #88D0F3;
		background-image: url(../img/chiiku_background01_500.jpg);
		background-repeat: no-repeat;
		background-position: right top;
		background-size: contain;
		margin: 14px 0 10px 0;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
		
		position: relative;
	}
	section.IntellectualTraining section:nth-child(3) > div::after {
		content: '';
		position: absolute;
		z-index: -1;
		top: 0;/*IE11bug topを指定しないと下にズレる*/
		right: -80%;
		width: 100%;
		height: 100%;
		border-left: solid 1px #88D0F3;
		border-right: solid 1px #88D0F3;
		background-color: #88D0F3;
		display: block;
	}
	/*-------------
		text
	--------------*/
	section.IntellectualTraining section:nth-child(3) div dl {
		width: 43%;
		color: #FFF;
		letter-spacing: 2px;
		/*background: #06C;*/
	}
	/** title **/
	section.IntellectualTraining section:nth-child(3) div dt {
		width: 100%;
		font-size: 1.3rem;
		font-weight: bold;
		margin-bottom: 5%;
		/*background: #0CF;*/
	}
	section.IntellectualTraining section:nth-child(3) div dt strong {
		line-height: 1.5rem;
	}
	section.IntellectualTraining section:nth-child(3) div dt span {
		font-size: 0.9rem;
		line-height: 1.2rem;
		display: block;
	}
	section.IntellectualTraining section:nth-child(3) div dd {
		text-align: left;
		
		line-height: 1.3rem;
	}
	section.IntellectualTraining section:nth-child(3) div dd p {
		margin-bottom: 3%;
	}
	/*-------------
		画像
	--------------*/
	section.IntellectualTraining section:nth-child(3) div picture {
		width: 37%;
	}
	
	
	/*=============================
		体操教室 ●画像/Text
	==============================*/
	section.IntellectualTraining section:nth-child(4) {
		width: 100%;
		max-width: 1024px;
		margin: 5% auto;
		 
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
		
		/*border: thin dashed #F09;*/
	}
	/*----------------------------
		●画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(4) > picture {
		width: 344px;
	}
	/*----------------------------
		text / 画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(4) > div {
		/*width: 67%;*/
		flex: 1;
		height: 265px;
		background-color: #88D0F3;
		background-image: url(../img/chiiku_background02_500.jpg);
		background-repeat: no-repeat;
		background-position: left top;
		background-size: contain;
		/**/margin: 1px 0 0 0;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
		
		position: relative;
	}
	section.IntellectualTraining section:nth-child(4) > div::after {
		content: '';
		position: absolute;
		z-index: -1;
		top: 0;/*IE11bug topを指定しないと下にズレる*/
		left: -80%;
		width: 100%;
		height: 100%;
		border-left: solid 1px #88D0F3;
		border-right: solid 1px #88D0F3;
		background-color: #88D0F3;
	}
	/*-------------
		text
	--------------*/
	section.IntellectualTraining section:nth-child(4) div dl {
		width: 43%;
		color: #FFF;
		letter-spacing: 0;
		/*background: #06C;*/
	}
	/** title **/
	section.IntellectualTraining section:nth-child(4) div dt {
		width: 100%;
		font-size: 1.3rem;
		font-weight: bold;
		margin-bottom: 5%;
		/*background: #0CF;*/
	}
	section.IntellectualTraining section:nth-child(4) div dt strong {
		line-height: 1.5rem;
	}
	section.IntellectualTraining section:nth-child(4) div dt span {
		font-size: 0.9rem;
		line-height: 1.2rem;
		display: block;
	}
	section.IntellectualTraining section:nth-child(4) div dd {
		text-align: left;
		
		line-height: 1.3rem;
	}
	section.IntellectualTraining section:nth-child(4) div dd p {
		letter-spacing: 1px;
		margin-bottom: 3%;
	}
	/*-------------
		画像
	--------------*/
	section.IntellectualTraining section:nth-child(4) div picture:nth-child(2) {
		width: 30%;
		position: relative;
		bottom: -10%;
	}
	section.IntellectualTraining section:nth-child(4) div picture:nth-child(3) {
		width: 20%;
		position: relative;
		top: -10%;
	}
	
	
	/*============================================================================
		NavigationLink
	=============================================================================*/
	section.NavigationLink {
		background: #CCE8F7;
		padding: 3% 0;
	}
	section.NavigationLink ul {
		width: 95%;
		max-width: 1024px;
		list-style-type: none;
		margin: 0 auto;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
	}
	section.NavigationLink ul li {
		width: 30%;
	}
	section.NavigationLink ul li a {
		border-radius: 50%;
		margin: 1px;
		display: block;
		
		/*background: #F63;*/
	}
	section.NavigationLink ul li a:hover {
		opacity: 0.8;
		margin: 0 2px 2px 0;
		filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));
	}
	section.NavigationLink ul li a:active {
		margin: 2px 0 0 2px;
		filter: drop-shadow(0 0 2px rgba(0,0,0,0.4));
	}
	
	
	/*==========================================
		  新着情報 
		  php sistem PKOBO_News01
	===========================================*/
	div.Topics {
		width: 45%;
		height: 300px;
		word-wrap: break-word;
		/*background: #FFF;*/
		padding: 3px;
		padding-top: 3%;
		overflow: visible;
		position: relative;
	}
	/*---------------
		title
	----------------*/
	div.Topics h2 {
		width: 90%;
		color: #FC3;
		font-size: 1.3rem;
		letter-spacing: 2px;
		margin: 0 auto 2% auto;
		padding-bototm: 2%;
	}
	
	/*--------------------
		  PHPsystem
	----------------------*/
	div#newsWrap {
		width: 100%;
		height: 200px;
		box-sizing: border-box;
		padding:  2% 0;
		overflow: scroll;
		
		/*border: thin dashed #6CF;*/
	}
	ul#newsList {
		text-align: left;
		margin:0 0 15px;
		padding:0;
		font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	ul#newsList li {
		color:#666;
		font-size:12px;
		margin:0;
		padding:5px 0;
		margin-bottom:5px;
		border-bottom:1px dotted #ccc;
		line-height:120%;
		list-style-type:none;
	}
	ul#newsList a{color:#36F;text-decoration:underline;}
	ul#newsList a:hover{color:#039;text-decoration:none;}
	
	/** カテゴリ名 **/
	.catName{
		display:inline-block;
		padding:3px 8px;
		border:1px solid #ccc;
		border-radius:6px;
		font-size:11px;
		line-height:100%;
		margin:0 2px;
	}
	/** New!アイコン **/
	span.newMark{
		color:#fff;
		font-size:11px;
		font-style:italic;
		line-height:100%;
		background: #F63;
		border-radius:8px;
		box-shadow:1px 1px 1px #999;
		border: 1px solid #F63;
		display: inline-block;
		margin-right: 1%;
		padding: 1px 4px;
	}
	
	/*-------------------------
		サムネイル/本文抜粋
	--------------------------*/
	ul#newsList li div {
		display: -webkit-box;
		display: -ms-flxbox;
		display: flex;
	}
	/** ThumbNail画像 **/
	span.thumbNailWrap{
		width:110px;
		height:80px;
		display:block;
		overflow:hidden;
		/*border: thin dashed #F36;*/
	}
	/** 本文 **/
	span.comment{
		flex: 1;
		/*width:500px; 本文部分の幅。ここは特に設置ページ合わせて変更下さい */
		display:block;
		padding:3px 0;
		/*float:left;*/
		overflow:hidden;
		/*border: thin dashed #9C3;*/
	}
	
	
}




/*===========================================================================
　  ●最大PC size  
===============================================================================*/
@media (min-width: 64em) {
	
}




/*================================================================================
　●tablet.css 画面の横幅が768pxまで
=================================================================================*/
@media screen and (max-width: 768px) {
	
	/*=================================================
		子どもたちの未来に向けた知育教育を
	==================================================*/
	main > section:first-child {
		width: 90%;
		max-width: 1020px;
		margin: 5% auto;
		padding: 0;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		
		position: relative;
		/*border: thin dashed #F69;*/
	}
	/*----------
		画像
	-----------*/
	main > section:first-child > picture:first-child {
		width: 35%;
	}
	/*------------
		本文
	-------------*/
	main > section:first-child dl {
		width: 62%;
	}
	/** title画像 **/
	main > section:first-child dt picture {
		width: 100%;
	}
	/** text **/
	main > section:first-child dd {
		color: #666;
		text-align: left;
		margin-top: 4%;
		padding-left: 3%;
	}
	main > section:first-child dd p {
		letter-spacing: 2px;
		line-height: 1.3rem;
		margin-bottom: 2%;
	}
	/** icon 鳥 **/
	main > section:first-child > picture:last-child {	
		position: absolute;
		right: 0;
		bottom: -3rem;
	}
	
	
	/*=========================================================
		知育教育
	==========================================================*/
	section.IntellectualTraining {
		margin: 10% 0;
	}
	section.IntellectualTraining h2 {
		width: 350px;
		margin: 3% auto;
	}
	section.IntellectualTraining > p {
		color: #30A6CA;
		text-align: center;
		margin-left: auto;
	}
	
	/*=============================
		英語教育 ●画像/Text
	==============================*/
	section.IntellectualTraining section:nth-child(3) {
		width: 100%;
		max-width: 1024px;
		margin: 0 auto;
		 
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		/*-webkit-justify-content: space-between;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;*/
		
		/*border: thin dashed #F09;*/
	}
	/*----------------------------
		●画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(3) > picture {
		width: 338px;
	}
	/*----------------------------
		text / 画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(3) > div {
		/*width: 67%;*/
		flex: 1;
		height: 265px;
		background-color: #88D0F3;
		background-image: url(../img/chiiku_background01_500.jpg);
		background-repeat: no-repeat;
		background-position: right top;
		background-size: cover;
		margin: 14px 0 10px 0;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
		
		position: relative;
	}
	section.IntellectualTraining section:nth-child(3) > div::after {
		content: none;
		/*position: absolute;
		z-index: -1;
		right: -80%;
		width: 100%;
		height: 100%;
		border-left: solid 1px #88D0F3;
		border-right: solid 1px #88D0F3;
		background-color: #88D0F3;*/
	}
	
	/*-------------
		text
	--------------*/
	section.IntellectualTraining section:nth-child(3) div dl {
		width: 90%;
		color: #212170;
		letter-spacing: 2px;
		/* text-shadow: 0 0 4px rgba(255,255,255,1); */
		
		/*background: #06C;*/
	}
	/** title **/
	section.IntellectualTraining section:nth-child(3) div dt {
		width: 100%;
		font-size: 1.3rem;
		font-weight: bold;
		text-align: center;
		margin-bottom: 5%;
		/*background: #0CF;*/
	}
	section.IntellectualTraining section:nth-child(3) div dt strong {
		line-height: 1.5rem;
	}
	section.IntellectualTraining section:nth-child(3) div dt span {
		font-size: 0.9rem;
		line-height: 1.2rem;
		display: block;
	}
	section.IntellectualTraining section:nth-child(3) div dd {
		text-align: left;
		
		line-height: 1.3rem;
		/*background: #F69;*/
	}
	section.IntellectualTraining section:nth-child(3) div dd p {
		font-size: 0.875rem;
		margin-bottom: 3%;
		
		/*width: 100% !important;
		max-width: 100% !important;
		padding: 0 !important;
		background: #FFF;
		border: thin dashed #F3C;*/
	}
	/*-------------
		画像
	--------------*/
	section.IntellectualTraining section:nth-child(3) div picture {
		/* width: 30%;
		position: absolute;
		left: -20%;
		bottom: 0; */
		display: none;
	}
	
	
	/*=============================
		フラダンス教室 ●画像/Text
	==============================*/
	section.IntellectualTraining section:nth-child(4) {
		width: 100%;
		max-width: 1024px;
		margin: 5% auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
		
		/*border: thin dashed #F09;*/
	}
	/*----------------------------
		●画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(4) > picture {
		width: 344px;
	}
	/*----------------------------
		text / 画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(4) > div {
		/*width: 67%;*/
		flex: 1;
		height: 265px;
		background-color: #88D0F3;
		background-image: url(../img/chiiku_background02_500.jpg);
		background-repeat: no-repeat;
		background-position: left top;
		background-size: contain;
		/**/margin: 1px 0 0 0;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		/*-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;*/
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
		
		position: relative;
	}
	section.IntellectualTraining section:nth-child(4) > div::after {
		content: '';
		position: absolute;
		z-index: -1;
		left: -80%;
		width: 100%;
		height: 100%;
		border-left: solid 1px #88D0F3;
		border-right: solid 1px #88D0F3;
		background-color: #88D0F3;
	}
	
	/*-------------
		text
	--------------*/
	section.IntellectualTraining section:nth-child(4) div dl {
		width: 90%;
		color: #212170;
		letter-spacing: 2px;
		/* text-shadow: 0 0 4px rgba(255,255,255,1); */
		/*color: #FFF;
		text-shadow: 0 0 4px rgba(0,0,0,0.5);*/
		
		/*background: #06C;*/
	}
	/** title **/
	section.IntellectualTraining section:nth-child(4) div dt {
		width: 100%;
		font-size: 1.3rem;
		font-weight: bold;
		margin-bottom: 5%;
		/*background: #0CF;*/
	}
	section.IntellectualTraining section:nth-child(4) div dt strong {
		line-height: 1.5;
	}
	section.IntellectualTraining section:nth-child(4) div dt span {
		font-size: 0.9rem;
		line-height: 1.2rem;
		display: block;
	}
	section.IntellectualTraining section:nth-child(4) div dd {
		text-align: left;
		
		line-height: 1.3rem;
	}
	section.IntellectualTraining section:nth-child(4) div dd p {
		font-size: 0.875rem;
		margin-bottom: 3%;
	}
	/*-------------
		画像
	--------------*/
	/** 横写真 **/
	section.IntellectualTraining section:nth-child(4) div picture:nth-child(2) {
		/* width: 33%;
		position: absolute;
		right: -10%;
		bottom: -10%; */
		display: none;
	}
	/** 縦写 **/
	section.IntellectualTraining section:nth-child(4) div picture:nth-child(3) {
		/* width: 25%;
		position: absolute;
		top: -8%;
		right: -10%; */
		display: none;
	}
	
	
	/*============================================================================
		NavigationLink
	=============================================================================*/
	section.NavigationLink {
		background: #CCE8F7;
		padding: 3% 0;
	}
	section.NavigationLink ul {
		width: 95%;
		max-width: 1024px;
		list-style-type: none;
		margin: 0 auto;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
	}
	section.NavigationLink ul li {
		width: 30%;
	}
	section.NavigationLink ul li a {
		border-radius: 50%;
		margin: 1px;
		display: block;
		
		/*background: #F63;*/
	}
	section.NavigationLink ul li a:hover {
		opacity: 0.8;
		margin: 0 2px 2px 0;
		filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));
	}
	section.NavigationLink ul li a:active {
		margin: 2px 0 0 2px;
		filter: drop-shadow(0 0 2px rgba(0,0,0,0.4));
	}
	
	
	/*==========================================
		  新着情報
	===========================================*/
	div.Topics {
		width: 70%;
		margin-top: 10%;
		padding-top: 3%;
		
		/*border: thin dashed #F06;*/
	}
	/*---------------
		title
	----------------*/
	div.Topics h2 {
		width: 90%;
		color: #FC3;
		font-size: 1.5rem;
		letter-spacing: 2px;
		margin: 0 auto 2% auto;
		padding-bototm: 2%;
	}
	
	/*-------------------------------------------
		  News
		  PHPsystem
	--------------------------------------------*/
	div.Topics {
		height: 300px;
		word-wrap: break-word;
		/*background: #FFF;*/
		padding: 3px;
		overflow: visible;
		position: relative;
	}
	div#newsWrap {
		width: 100%;
		height: 200px;
		box-sizing: border-box;
		padding:  2% 0;
		overflow: scroll;
		
		/*border: thin dashed #6CF;*/
	}
	ul#newsList {
		text-align: left;
		margin:0 0 15px;
		padding:0;
		font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	ul#newsList li {
		color:#666;
		font-size:12px;
		margin:0;
		padding:5px 0;
		margin-bottom:8px;
		border-bottom:1px dotted #ccc;
		line-height:120%;
		list-style-type:none;
	}
	ul#newsList a{color:#36F;text-decoration:underline;}
	ul#newsList a:hover{color:#039;text-decoration:none;}
	
	/** カテゴリ名 **/
	.catName{
		display:inline-block;
		padding:3px 8px;
		border:1px solid #ccc;
		border-radius:6px;
		font-size:11px;
		line-height:100%;
		margin:0 2px;
	}
	/** New!アイコン **/
	span.newMark{
		color:#fff;
		font-size:11px;
		font-style:italic;
		line-height:100%;
		background: #F63;
		border: 1px solid #F63;
		box-shadow:1px 1px 1px #999;
		border-radius:8px;
		display:inline-block;
		margin-right: 1%;
		padding:1px 4px;
	}
	
	/*-------------------------
		サムネイル/本文抜粋
	--------------------------*/
	ul#newsList li div {
		display: -webkit-box;
		display: -ms-flxbox;
		display: flex;
	}
	/** ThumbNail画像 **/
	span.thumbNailWrap{
		width:110px;
		height:80px;
		display:block;
		overflow:hidden;
		/*border: thin dashed #F36;*/
	}
	/** 本文 **/
	span.comment{
		flex: 1;
		/*width:500px; 本文部分の幅。ここは特に設置ページ合わせて変更下さい */
		display:block;
		padding:3px 0;
		/*float:left;*/
		overflow:hidden;
		/*border: thin dashed #9C3;*/
	}
	
	
	
}

/*@media screen and (min-width : 320px) and (max-width: 1024px) {スマフォ・タブレット用
	section.SubImage div {
		background-attachment: scroll;
	}
}*/


/*@media only screen and (max-device-width: 768px) {
	body::before {
		content: "";
		width: 100%;
		height: 100vh;
		background-image: url(../img/parallaxback.jpg) no-repeat;
		background-size: cover;
		-webkit-background-size:cover;
		display: block;
		padding-bottom: 108px;
		
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
	}
}*/



/*=========================================================================================
	●smart.css  
	画面の横幅が640pxまで
===========================================================================================*/
@media screen and (max-width: 640px) {
	
	/*=================================================
		子どもたちの未来に向けた知育教育を
	==================================================*/
	main > section:first-child {
		width: 90%;
		max-width: 1020px;
		margin: 5% auto 3rem auto;
		padding: 0;
		
		/*display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;*/
		display: block;
		
		position: relative;
		/*border: thin dashed #F69;*/
	}
	/*----------
		画像
	-----------*/
	main > section:first-child > picture:first-child {
		width: 100%;
		margin-bottom: 2%;
	}
	/*------------
		本文
	-------------*/
	main > section:first-child dl {
		width: 100%;
	}
	/** title画像 **/
	main > section:first-child dt picture {
		width: 100%;
	}
	/** text **/
	main > section:first-child dd {
		color: #666;
		text-align: left;
		margin-top: 4%;
		padding-left: 3%;
	}
	main > section:first-child dd p {
		letter-spacing: 2px;
		line-height: 1.3rem;
		margin-bottom: 2%;
	}
	/** icon 鳥 **/
	main > section:first-child > picture:last-child {	
		position: absolute;
		right: 0;
		bottom: -3rem;
	}
	
	
	/*=========================================================
		知育教育
	==========================================================*/
	section.IntellectualTraining {
		margin: 8rem 0 3rem 0;
	}
	section.IntellectualTraining h2 {
		width: 200px;
		margin: 3% auto;
	}
	section.IntellectualTraining > p {
		width: 95%;
		color: #30A6CA;
		text-align: center;
		line-height: 1.3rem;
		margin: 1rem auto 2rem;
	}
	
	/*=============================
		英語教室 ●画像/Text
	==============================*/
	section.IntellectualTraining section:nth-child(3) {
		width: 100%;
		/*max-width: 1024px;
		margin: 0 auto;*/
		/*display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-between;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;*/
		display: block;
		
		/*border: thin dashed #F09;*/
	}
	/*----------------------------
		●画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(3) > picture {
		width: 80%;
		margin-left: auto;
		position: relative;
		bottom: -2rem;
	}
	/*----------------------------
		text / 画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(3) > div {
		/*width: 67%;*/
		flex: 1;
		height: 265px;
		background-color: #88D0F3;
		background-image: url(../img/chiiku_background01_500.jpg);
		background-repeat: no-repeat;
		background-position: right top;
		background-size: cover;
		margin: 14px 0 10px 0;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
		
		position: relative;
	}
	section.IntellectualTraining section:nth-child(3) > div::after {
		content: none;
		/*position: absolute;
		z-index: -1;
		right: -80%;
		width: 100%;
		height: 100%;
		border-left: solid 1px #88D0F3;
		border-right: solid 1px #88D0F3;
		background-color: #88D0F3;*/
	}
	
	/*-------------
		text
	--------------*/
	section.IntellectualTraining section:nth-child(3) div dl {
		color: #006;
		letter-spacing: 2px;
		padding-top: 1rem;
	}
	/** title **/
	section.IntellectualTraining section:nth-child(3) div dt {
		width: 100%;
		font-size: 1.3rem;
		font-weight: bold;
		margin-bottom: 5%;
		/*background: #0CF;*/
	}
	section.IntellectualTraining section:nth-child(3) div dt span {
		font-size: 0.9rem;
		line-height: 1.2rem;
		display: block;
	}
	section.IntellectualTraining section:nth-child(3) div dd {
		text-align: left;
		
		line-height: 1.3rem;
	}
	section.IntellectualTraining section:nth-child(3) div dd p {
		margin-bottom: 3%;
	}
	/*-------------
		画像
	--------------*/
	section.IntellectualTraining section:nth-child(3) div picture {
		/* width: 30%;
		position: absolute;
		top: -80px;
		left: auto;
		right: 20px; */
		display: none;
	}
	
	
	/*=============================
		体操教室 ●画像/Text
	==============================*/
	section.IntellectualTraining section:nth-child(4) {
		width: 100%;
		max-width: 1024px;
		margin: 3rem auto 2rem auto;
		 
		/*display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;*/
		display: block;
		
		/*border: thin dashed #F09;*/
	}
	/*----------------------------
		●画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(4) > picture {
		width: 80%;
		margin-bottom: -0.15rem;
	}
	/*----------------------------
		text / 画像
	-----------------------------*/
	section.IntellectualTraining section:nth-child(4) > div {
		/*width: 67%;*/
		flex: 1;
		height: 265px;
		background-color: #88D0F3;
		background-image: url(../img/chiiku_background02_500.jpg);
		background-repeat: no-repeat;
		background-position: left top;
		background-size: contain;
		/**/margin: 1px 0 0 0;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		/*-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;*/
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
		
		position: relative;
	}
	section.IntellectualTraining section:nth-child(4) > div::after {
		content: '';
		position: absolute;
		z-index: -1;
		left: -80%;
		width: 100%;
		height: 100%;
		border-left: solid 1px #88D0F3;
		border-right: solid 1px #88D0F3;
		background-color: #88D0F3;
	}
	
	/*-------------
		text
	--------------*/
	section.IntellectualTraining section:nth-child(4) div dl {
		color: #006;
		letter-spacing: 2px;
		
	}
	/** title **/
	section.IntellectualTraining section:nth-child(4) div dt {
		width: 100%;
		font-size: 1.3rem;
		font-weight: bold;
		margin-bottom: 5%;
		/*background: #0CF;*/
	}
	section.IntellectualTraining section:nth-child(4) div dt span {
		font-size: 0.9rem;
		line-height: 1.2rem;
		display: block;
	}
	section.IntellectualTraining section:nth-child(4) div dd {
		text-align: left;
		
		line-height: 1.3rem;
	}
	section.IntellectualTraining section:nth-child(4) div dd p {
		margin-bottom: 3%;
	}
	/*-------------
		画像
	--------------*/
	/** 横写真 **/
	section.IntellectualTraining section:nth-child(4) div picture:nth-child(2) {
		/* width: 30%;
		position: absolute;
		top: -150px;
		right: 10px;
		bottom: auto; */
		display: none;
	}
	/** 縦写 **/
	section.IntellectualTraining section:nth-child(4) div picture:nth-child(3) {
		/* width: 20%;
		position: absolute;
		top: -270px;
		right: 20px; */
		display: none;
	}
	
	
	/*============================================================================
		NavigationLink
	=============================================================================*/
	section.NavigationLink {
		background: #CCE8F7;
		padding: 20px 0;
	}
	/*section.NavigationLink ul {
		width: 95%;
		max-width: 1024px;
		list-style-type: none;
		margin: 0 auto;
		
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-around;
		-webkit-box-pack: distribute;
		-ms-flex-pack: distribute;
		justify-content: space-around;
		-webkit-align-items: center;
		-webkit-box-align: center;
		-mf-flex-align: center;
		align-items: center;
	}
	section.NavigationLink ul li {
		width: 30%;
	}
	section.NavigationLink ul li a {
		border-radius: 50%;
		margin: 1px;
		display: block;
	}
	section.NavigationLink ul li a:hover {
		opacity: 0.8;
		margin: 0 2px 2px 0;
		filter: drop-shadow(0 0 5px rgba(0,0,0,0.4));
	}
	section.NavigationLink ul li a:active {
		margin: 2px 0 0 2px;
		filter: drop-shadow(0 0 2px rgba(0,0,0,0.4));
	}*/
	
	
	/*==========================================
		  新着情報
	===========================================*/
	div.Topics {
		width: 70%;
		margin-top: 10%;
		padding-top: 3%;
		
		/*border: thin dashed #F06;*/
	}
	/*---------------
		title
	----------------*/
	div.Topics h2 {
		width: 90%;
		color: #FC3;
		font-size: 1.5rem;
		letter-spacing: 2px;
		margin: 0 auto 30px auto;
		padding-bototm: 2%;
	}
	
	/*-------------------------------------------
		  News
		  PHPsystem
	--------------------------------------------*/
	div.Topics {
		height: 300px;
		word-wrap: break-word;
		/*background: #FFF;*/
		padding: 3px;
		overflow: visible;
		position: relative;
	}
	div#newsWrap {
		width: 100%;
		height: 200px;
		box-sizing: border-box;
		padding:  2% 0;
		overflow: scroll;
		
		/*border: thin dashed #6CF;*/
	}
	ul#newsList {
		text-align: left;
		margin:0 0 15px;
		padding:0;
		font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	ul#newsList li {
		color:#666;
		font-size:12px;
		margin:0;
		padding:5px 0;
		margin-bottom:8px;
		border-bottom:1px dotted #ccc;
		line-height:120%;
		list-style-type:none;
	}
	ul#newsList a{color:#36F;text-decoration:underline;}
	ul#newsList a:hover{color:#039;text-decoration:none;}
	
	/** カテゴリ名 **/
	.catName{
		display:inline-block;
		padding:3px 8px;
		border:1px solid #ccc;
		border-radius:6px;
		font-size:11px;
		line-height:100%;
		margin:0 2px;
	}
	/** New!アイコン **/
	span.newMark{
		color:#fff;
		font-size:11px;
		font-style:italic;
		line-height:100%;
		background: #F63;
		border: 1px solid #F63;
		box-shadow:1px 1px 1px #999;
		border-radius:8px;
		display:inline-block;
		margin-right: 1%;
		padding:1px 4px;
	}
	
	/*-------------------------
		サムネイル/本文抜粋
	--------------------------*/
	ul#newsList li div {
		display: -webkit-box;
		display: -ms-flxbox;
		display: flex;
	}
	/** ThumbNail画像 **/
	span.thumbNailWrap{
		width:110px;
		height:80px;
		display:block;
		overflow:hidden;
		/*border: thin dashed #F36;*/
	}
	/** 本文 **/
	span.comment{
		flex: 1;
		/*width:500px; 本文部分の幅。ここは特に設置ページ合わせて変更下さい */
		display:block;
		padding:3px 0;
		/*float:left;*/
		overflow:hidden;
		/*border: thin dashed #9C3;*/
	}
	
}




/*========================================================
	iphone SE size
=========================================================*/
@media screen and (max-width: 340px) {
	
}