@charset "utf-8";

/* 共通
------------------------------------------------------------*/
body {
	color: #0a0a0a;
	font-size:17px;
	line-height:175%;
	letter-spacing:1px;
	-webkit-text-size-adjust: 100%;
	overflow-y: scroll;
}

a		{ color:#292929; text-decoration:none; }
a:hover { color:#00a7e3; }

p {
	display:block;
	margin:0 0 25px;
}

.aligncenter { text-align:center !important; }
.alignright { text-align:right !important; }

img{ max-width:100%; }
.imgright{display:block;float:right;margin:0 0 15px 60px;}
.imgleft{display:block;float:left;margin:0 40px 20px 0;}
.imgcenter {display:block;margin:5px auto;}
.imgPlay{max-width:400px;}

.MG-B20{margin-bottom:20px;}
.MG-B50{margin-bottom:50px;}
.MG-B70{margin-bottom:70px;}

.NoBorder { border:none !important; }
.Kadomaru {
	border-radius: 15px;
	webkit-border-radius: 15px;
	-moz-border-radius: 15px;
}


/* アニメーションボタン */
a.AnimeBtn {
	display: inline-block;
	text-indent:0 !important;
	padding:10px 15px 7px;
	margin:0 2px 20px; 
	line-height:100%;
	text-align: center;
	text-decoration: none;
	outline: none;
	letter-spacing:0;
	position: relative;
	z-index: 2;
	background-color: #00a2e2;
	border: 2px solid #00a2e2;
	color: #fff;
	border-radius: 5px;
	webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
a.AnimeBtn::before,
a.AnimeBtn::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
	top: 0;
	width: 50%;
	height: 100%;
	background-color: #00a2e2;
}
a.AnimeBtn,
a.AnimeBtn::before,
a.AnimeBtn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
a.AnimeBtn:hover {
	background-color: #fff;
	border-color: #333;
	color: #333 !important;
}
a.AnimeBtn::before {
	right: 0;
}
a.AnimeBtn::after {
	left: 0;
}
a.AnimeBtn:hover::before,
a.AnimeBtn:hover::after {
	width: 0;
	background-color: #333;
}

/* 全体
------------------------------------------------------------*/
#wrapper{
	display:block;
	width:100%;
	margin:0;
	padding:0;
}
.inner{
	display:block;
	clear:both;
	width:900px;
	margin:0 auto;
	padding:100px 0 70px;
}
.BgGray { background:url(images/bg_gray.gif); }

/* フェードインアニメーション */
.FadeInContent { overflow: hidden; }
.FadeInContent .ContentBox { transition: .8s; }
.list-mv07{
	opacity: 0;
	transform: translate(0,60px); 
	-webkit-transform: translate(0,60px); 
}
.mv07{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

/* ヘッダー
------------------------------------------------------------*/
#header{
	display:block;
	padding:0 0 10px;
	background:#00a2e2;
}
#header img.logo {
	display:block;
	margin:0 auto 40px;
}
#header p {
	line-height:135%;
	color:#FFF;
	margin:0 3% 20px;
}
#header img.imgIcon{
	display:block;
	float:left;
	margin:-5px 8px 1px 0;
}

/* フッター
------------------------------------------------------------*/
#footer{
	width:100%;
	display:block;
	clear:both;
	margin:0;
	padding-bottom:50px;
	background:#00a2e2;
    overflow: hidden;
    position: relative;
	color:#FFF;
}
#footer ul {
	display:block;
    margin: 0 0 10px;
    padding: 0;
    position: relative;
    left: 50%;
	float:left;
	font-size:85%;
}
#footer ul li{
    float: left;
    padding: 0 7px 10px;
    position: relative;
    left: -50%;
}
#footer ul li a {
    border-bottom: 1px dotted #FFF;
	padding:0 3px;
	color:#FFF;
}
#footer ul li a:hover {
    border-bottom: 1px dotted #ffd200;
	color:#ffd200;
}
#footer .address{
	display:block;
	clear:both;
	font-size:85%;
	margin:0;
	text-align:center;
}

/* ページトップへ */
#pagetop {
    position: fixed;
    bottom: 0;
    right: 10px;
	z-index:2;
}
#pagetop a {
    width: 120px;
    height: 135px;
    display: block;
    text-align: center;
}
#pagetop a:hover {
    color: #000;
}


/* タイトル
------------------------------------------------------------*/
h2 {
	display:block;
	margin:0 0 30px;
	line-height:155%;
	text-align:left;
	color:#6eb92b;
	font-size:205%;
	font-weight:bold;
}
h2 span{
	display:block;
	float:left;
	padding:5px 15px;
	background:#6eb92b;
	color:#FFF;
	font-size:90%;
	margin:-5px 20px 0 0;
	border-radius: 5px;
}
h3 {
	display:block;
	border:1px solid #eee;
	font-size:155%;
	font-weight:bold;
	letter-spacing:2px;
	padding:25px 20px 20px 10px;
	background:url(images/bg_check.gif);
	margin-bottom:20px;
}
h3 span {
	display:block;
	font-size:80%;
	margin:0 0 5px 15px;
	line-height:135%;
}
h4{
	color:#00a2e2;
	border:none;
	text-align:center;
	font-size:155%;
	font-weight:bold;
	margin:0 0 20px;
}
h4 span{
	background: linear-gradient(transparent 60%, #fff100 50%);
	padding:0 20px;
}

/* トップページ
------------------------------------------------------------*/
/* ラインナップ */
dl.LineupArea { display:block; }
dl.LineupArea dt {
	display:block;
	width:30%;
	float:left;
	clear:both;
	margin-bottom:80px;
	text-align:center;
}
dl.LineupArea dd {
	display:block;
	width:67%;
	float:right;
	text-align:left;
}
dl.LineupArea dt img { width:80%; }
dl.LineupArea dd p{
	margin:0 0 15px;
}

/* お知らせ */
dl.InfoList {
	display:block;
	margin:70px 0 40px;
	border-bottom:1px dotted #CCC;
	background:#fffeee;
}
dl.InfoList dt {
	display:block;
	width:18%;
	float:left;
	clear:both;
	padding:15px 0 15px 2%;
	color:#00a7e3;
	border-top:1px dotted #CCC;
}
dl.InfoList dd {
	display:block;
	width:82%;
	float:right;
	padding:15px 2% 15px;
	background:#FFF;
	border-top:1px dotted #CCC;
}
/* STEM体験教室を開催 */
ul.list_check {
	display:block;
	width:92%;
	background:#fffeee;
	border:1px solid #eee;
	line-height:145%;
	padding:50px 40px 30px;
	margin:0 auto 20px;
}
ul.list_check li{
	position:relative;
	padding:0 0 30px 25px;
}
ul.list_check li:after, ul.list_check li:before{
	content:''; 
	display:block; 
	position:absolute; 
	top:4px; 
	left:8px; 
	height:11px; 
	width:4px; 
	background:#00a7e3; 
	border-radius:10px;
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}
ul.list_check li:before{
	top:8px; 
	left:3px;
	height:8px; 
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
}
ul.list_check li.Non:after, ul.list_check li.Non:before{
	content:none; 
	background:none; 
}


/* FAQ */
.AnswerArea {
	display:block;
	clear:both;
	width:90%;
	margin:40px auto;
}
p.Question {
	font-size:135%;
	font-weight:bold;
	color:#00a7e3;
	padding:50px 5% 0;
}
p.Question img.imgleft{
	max-width:70px;
	margin:-10px 20px 20px 0;
}

/* イベントレポート */
.ReportPhoto { display:block; }
.ReportPhoto ul { display:block; }
.ReportPhoto li{
	display:block;
	float:left;
	width:46%;
	height:450px;
	margin:0 2%;
	line-height:135%;
}
.ReportPhoto li img{
	display:block;
	max-height:300px;
	margin:0 auto 10px;
	border:1px solid #CCC;
	border-radius: 3px;
	webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.ReportPhoto li img.Tate{
	max-height:400px;
}
.ReportPhoto li.WPhoto{
	clear:both;
	float:none;
	width:90%;
	height:auto;
	margin:0 5% 70px;
	text-align:center;
}
.ReportPhoto li.WPhoto span{ display:block; }
.ReportPhoto li.WPhoto span img{
	display:inline-block !important;
	margin:0 1% 10px;
}
.ReportPhoto li.WPhoto span img.Yoko{ max-height:250px; }
.ReportPhoto li.height400{ height:400px !important; }

/* 1行1画像 */
.ReportPhoto li.OnePhoto{
	clear:both;
	float:none;
	width:60%;
	height:auto;
	margin:0 auto;
	text-align:left;
}
.ReportPhoto li.OnePhoto img{
	display:block;
	margin:0 auto 5px;
}

.ReportPhoto li.BnrBox50{
	width:50%;
	height:auto;
}
.ReportPhoto li.BnrBox55{
	width:55%;
	height:auto;
}
.ReportPhoto li.BnrBox37{
	width:37%;
	height:auto;
	padding-top:15px;
}

@media only screen and (max-width:899px){
	.inner { width:94%;  }
	.inner img.imgright,
	.inner img.imgleft {
		float:none;
		margin:0 auto 15px;
	}
	.ReportPhoto li.WPhoto {
		height:auto;
		margin-bottom:50px;
	}
	.ReportPhoto li.BnrBox50, .ReportPhoto li.BnrBox55, .ReportPhoto li.BnrBox37{
		width:100%;
		float:none;
		padding:0;
		margin:0;
	}
	.ReportPhoto li.BnrBox37 img { max-width:400px; width:100%; }
}
@media only screen and (max-width:640px){
	#header .inner p { margin:0 5% 20px; }
	dl.LineupArea dt {
		width:100%;
		margin-bottom:0;
		padding-left:0;
	}
	dl.LineupArea dd {
		width:100%;
		padding-top:0;
		margin-bottom:30px;
		border-bottom:1px dotted #333;
	}
	dl.LineupArea dt img { width:40%; }

	dl.InfoList dt, dl.InfoList dd { width:100%; }
	dl.InfoList dt { padding:15px 1% 0; }
	dl.InfoList dd { border:none; padding:0 1% 15px; }
	.ReportPhoto li, .ReportPhoto li.WPhoto, .ReportPhoto li.OnePhoto{ float:none; width:90%; margin:0 5% 50px; height:auto; text-align:left; }
	.ReportPhoto li.WPhoto span img{ display:block !important; margin:0 auto 10px; }
}
@media only screen and (max-width:480px){
	#footer ul li { width:100%; }
	#footer ul li a { display:block; }
	h3 { font-size:115%; letter-spacing:0; padding:20px 15px 20px 5px; }
}
@media only screen and (max-width:375px){
	#header .inner dd { width:98%; }
	#header .inner dd a, #header .inner dd .BtnSupport { height:70px; }
	#header .inner dt img { width:60%; }
	h3 span { margin-left:5px; }
}