@charset "utf-8";

/* =============================================
 共通
============================================= */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend {
	margin: 0;
	padding: 0;
}
html{
	font-size:62.5%; /* 10px = 1rem */
}
body{
	position: relative;
	color:#333;
	font-size:1.7rem;
	font-family:'メイリオ','Meiryo','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','Osaka',sans-serif;
	margin: 0px;
	min-width: 1000px;
	padding: 0px;
	background-color:#065faa;
}
body:before{
	position: absolute;
	width: 100%;
	height: 100%;
	content: "";
	left: 0;
	top: 0;
	z-index: -1;
}
img {
	border: none;
	vertical-align: bottom;
}
li {
	list-style: none;
}
h1,h2,h3,h4,h5,h6{
	font-weight:normal;
}
/* -------------------------------------------
 p
------------------------------------------- */
p + p,
dl + p{
	margin-top: 10px;
}
/* -------------------------------------------
 a
------------------------------------------- */
a{
	overflow: hidden;
	outline: none;
	color: #006699;
	text-decoration: underline;
}
a:hover{
	color: #2da7e3;
	text-decoration: none;
}

/* -------------------------------------------
 共通クラス
------------------------------------------- */
.smp{
	display:none;
}
.txt_center{
	text-align: center;
}
.txt_important{
	font-size: 2.2rem;
	color: #ffeb12;
	font-weight: bold;
}
.txt_red{
	color: #e02e02;
}
.txt_orange{
	color: #ff8400;
}
.txt_big{
	font-size: 2.2rem;
}

/* =============================================
 MENU
============================================= */
#menu{
	display: none;
	background: url(../../img/common/bg_menu.gif);
	width: 1000px;
	margin: 0 auto;
	border-left: 4px solid #FFF;
	border-right: 4px solid #FFF;
	border-bottom: 4px solid #FFF;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box; 
	-o-box-sizing: border-box; 
	box-sizing: border-box; /* paddingとborderを幅と高さに含める */
	-moz-border-bottom-left-radius: 16px;
	-webkit-border-bottom-left-radius: 16px;
	-ms-border-bottom-left-radius: 16px;
	-o-border-bottom-left-radius: 16px;
	border-bottom-left-radius: 16px;
	-moz-border-bottom-right-radius: 16px;
	-webkit-border-bottom-right-radius: 16px;
	-ms-border-bottom-right-radius: 16px;
	-o-border-bottom-right-radius: 16px;
	border-bottom-right-radius: 16px;
	behavior: url(js/PIE.htc); /* for IE8 */
	position: fixed;
	top:41px;
	left: 0;
	right: 0;
	padding: 10px 0;
	margin:0 auto;	
	z-index: 20;
}
#menu:after{
	content: "";
	display: block;
	clear: both;
	zoom: 1;
}
#menu li{
	float: left;
	border-left:1px solid #a8eeff;
}
#menu li:first-child{
	height: 80px;
	line-height:80px;
	vertical-align: middle; 
	padding: 0 26px;
}
#menu li:first-child img{
  position: relative;
  top: -3px;
}
#menu li a{
	height: 80px;
	line-height:80px;
	vertical-align: middle; 
	padding: 0 26px;
  display: block;
}
#menu li img{
	vertical-align: middle; 
}

/* =============================================
 intro
============================================= */
.cont-intro{
	background: url(../../img/common/bg_intro.png) no-repeat center top, -ms-linear-gradient(top, #013296 0%, #0056a7 50%, #307fc2 100%);
	background: url(../../img/common/bg_intro.png) no-repeat center top, -moz-linear-gradient(top, #013296 0%, #0056a7 50%, #307fc2 100%) ;
	background: url(../../img/common/bg_intro.png) no-repeat center top, -o-linear-gradient(top, #013296 0%, #0056a7 50%, #307fc2 100%) ;
	background: url(../../img/common/bg_intro.png) no-repeat center top, -webkit-linear-gradient(top, #013296 0%, #0056a7 50%, #307fc2 100%) ;
	background: url(../../img/common/bg_intro.png) no-repeat center top, linear-gradient(top, #013296 0%, #0056a7 50%, #307fc2 100%) ;	
	padding-bottom: 60px;
}
.cont-intro h1{
	width: 1000px;
	min-width: 1000px;
	margin: 0 auto;
	padding-bottom: 37px;
}
.cont-intro-inner{
	width: 1000px;
	margin: 0 auto;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box; 
	-o-box-sizing: border-box; 
	box-sizing: border-box; /* paddingとborderを幅と高さに含める */
	background-color: rgba(255,255,255,0.1);
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	-ms-border-radius: 30px;
	-o-border-radius: 30px;
	border-radius: 30px;
	behavior: url(js/PIE.htc); /* for IE8 */
	position: relative;
	padding:35px 80px 60px;
}
.cont-intro-inner h2{
	margin-bottom: 40px;
}
.cont-intro-inner p{
	text-align: left;
	color:#FFF;
}
.wonder_cosmo{
	position: absolute;
	top:-60px;
	right:-120px;
	animation: ani-fluffy 4s ease-out infinite; 
}
.wonder_fly{
	position: absolute;
	top:20px;
	left:-60px;
	animation: ani-fluffy2 2s ease-out infinite;
}
.movie{
	position: absolute;
	top:210px;
	right:-90px;
	z-index: 10;
}

/* =============================================
 program line-up
============================================= */
.cont-lineup{
	background: -ms-linear-gradient(top, #307fc2 0%, #74c0ec 50%,#83c6e8 100%);
	background: -moz-linear-gradient(top, #307fc2 0%, #74c0ec 50%,#83c6e8 100%) ;
	background: -o-linear-gradient(top, #307fc2 0%, #74c0ec 50%,#83c6e8 100%) ;
	background: -webkit-linear-gradient(top, #307fc2 0%, #74c0ec 50%,#83c6e8 100%) ;
	background: linear-gradient(top, #307fc2 0%, #74c0ec 50%,#83c6e8 100%) ;	
	padding-bottom: 60px;
}
.cont-lineup-inner{
	width: 1000px;
	height: 2640px;
	margin: 0 auto;
	position: relative; 
	color:#0b374f;
	font-size: 1.6rem;
	text-align: center;
}
.cont-lineup-inner h2{
	text-align: left;
}
.lbox-l{
	width: 640px;
	height: 640px;
	padding-top:66px;
}
.lbox-m{
	width: 570px;
	height: 570px;
	padding-top:66px;
}
.lbox-m.lbox-5{
	padding-top:20px;
}
.lbox-s{
	width: 400px;
	height: 400px;
	padding-top:60px;
}
.slider{
	width:320px;
}
.lineup-box{
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	behavior: url(js/PIE.htc); /* for IE8 */
	background-color: rgba(255,255,255,0.2);
	position:absolute; 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box; 
	-o-box-sizing: border-box; 
	box-sizing: border-box; /* paddingとborderを幅と高さに含める */
}
.lineup-box .text{
	text-align: left;
}
.lineup-box .photo{
	padding-bottom: 12px;
	text-align: left;
}
.lbox-inner{
	margin: 12px auto 0;
	padding: 20px;
	background: url(../../img/common/line_white2.png) repeat-x;
}
.lbox-inner:after{
	content: "";
	display: block;
	clear: both;
	zoom: 1;
}
.lbox-l .lbox-inner{
	width: 498px;
	padding: 20px 2px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box; 
	-o-box-sizing: border-box; 
	box-sizing: border-box; /* paddingとborderを幅と高さに含める */
}
.lbox-l .lbox-inner .photo{
	float: left;
	padding-right: 14px;
}
.lbox-m .lbox-inner{
	width: 320px;
}
.lbox-m .lbox-inner.box-l{
	width: 450px;
	padding: 20px 0 20px 14px;
}
.lbox-m .lbox-inner.box-r{
	width: 450px;
	padding: 20px 0 20px 10px;
}
.lbox-m .lbox-inner.box-l .photo{
	float: left;
	padding-right: 8px;
}
.lbox-m .lbox-inner.box-r .photo{
	float: right;
	padding-left: 8px;
}
.lbox-s .lbox-inner{
	width: 227px;
	padding: 20px 2px;
}
.lbox-1{
	top:190px;
	right:0;
}
.lbox-2{
	top:633px;
	left:0;
}
.lbox-3{
	top:1140px;
	right:0;
}
.lbox-4{
	top:1546px;
	left:0;
}
.lbox-5{
	top:1967px;
	right:0;
}
.lbox-6{
	top:2217px;
	left:0;
}
.clound-01{
	position: absolute;
	top:335px;
	left:-18px;
}
.clound-02{
	position: absolute;
	top:442px;
	left:57px;
}
.clound-03{
	position: absolute;
	top:320px;
	left:389px;
}
.clound-04{
	position: absolute;
	top:454px;
	right:-89px;
}
.clound-05{
	position: absolute;
	top:828px;
	right:163px;
}
.clound-06{
	position: absolute;
	top:848px;
	right:-38px;
}
.clound-07{
	position: absolute;
	top:1288px;
	left:210px;
}
.clound-08{
	position: absolute;
	top:1370px;
	left:18px;
}
.clound-09{
	position: absolute;
	top:2051px;
	left:-74px;
}
.clound-10{
	position: absolute;
	top:2173px;
	left:10px;
}
.clound-11{
	position: absolute;
	top:2449px;
	left:361px;
}
.clound-12{
	position: absolute;
	top:2554px;
	left:465px;
}
.rainbow{
	position: absolute;
	top:24px;
	right:-46px;
}
.wonder_penguin{
	position: absolute;
	top:365px;
	left:216px;
}
.airship{
	position: absolute;
	top:710px;
	right:-18px;
}
.wonder_flower{
	position: absolute;
	top:947px;
	right:27px;
}
.balloon1{
	position: absolute;
	top:1194px;
	left:51px;
}
.wonder_squid{
	position: absolute;
	top:1370px;
	left:147px;
}
.ufo{
	position: absolute;
	top:1697px;
	right:-65px;
}
.wonder_advent{
	position: absolute;
	top:1682px;
	right:141px;
}
.wonder_octopus{
	position: absolute;
	top:2065px;
	left:103px;
}
.balloon2{
	position: absolute;
	top:2354px;
	right:-38px;
}

/* =============================================
 present
============================================= */
.cont-present{
	background: -ms-linear-gradient(top, #83c6e8, #bce4f5);
	background: -moz-linear-gradient(top, #83c6e8, #bce4f5) ;
	background: -o-linear-gradient(top, #83c6e8, #bce4f5) ;
	background: -webkit-linear-gradient(top, #83c6e8, #bce4f5) ;
	background: linear-gradient(top, #83c6e8, #bce4f5) ;	
	padding-bottom:60px; 
}
.cont-present h2{
	text-align: center;
	padding-bottom:26px;
}
.cont-present-inner{
	width: 1000px;
	margin: 0 auto;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box; 
	-o-box-sizing: border-box; 
	box-sizing: border-box; /* paddingとborderを幅と高さに含める */
	background-color: rgba(255,255,255,0.3);
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	-ms-border-radius: 30px;
	-o-border-radius: 30px;
	border-radius: 30px;
	behavior: url(js/PIE.htc); /* for IE8 */
	position: relative;
	padding:40px;
}
.present-box{
	margin-top: 30px;
	padding-top: 30px;
	background: url(../../img/common/line_blue.png) repeat-x top left;
	text-align: left;	
}
.present-box h3{
	padding-bottom: 18px;
}
.present-box p{
	padding-left: 2px;
}
.present-box:after{
	content: "";
	display: block;
	clear: both;
	zoom: 1;
}
.present-box .box-l{
	float: left;
	width: 450px;
}
.present-box .box-r{
	float: right;
	width: 450px;
}
.caution-box{
	margin-top:30px; 
	background-color: rgba(255,255,255,0.6);
	text-align: left;
	padding: 20px;
}
.caution-box ul li{
	margin: 0 20px 0 30px;
	list-style: disc;
}
.wonder_game1{
	position: absolute;
	top:-200px;
	left:-75px;
}
.wonder_game2{
	position: absolute;
	top:-180px;
	right:-10px;
}
.clound-13{
	position: absolute;
	top:172px;
	left:-108px;
}
.clound-14{
	position: absolute;
	top:545px;
	right:-79px;
}
.clound-15{
	position: absolute;
	top:859px;
	left:-124px;
}


/* =============================================
 perform
============================================= */
.cont-perform{
	background: -ms-linear-gradient(top, #bce4f5, #dcf7ff);
	background: -moz-linear-gradient(top, #bce4f5, #dcf7ff) ;
	background: -o-linear-gradient(top, #bce4f5, #dcf7ff) ;
	background: -webkit-linear-gradient(top, #bce4f5, #dcf7ff) ;
	background: linear-gradient(top, #bce4f5, #dcf7ff) ;	
}
.cont-perform-inner{
	width: 1000px;
	margin: 0 auto;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box; 
	-o-box-sizing: border-box; 
	box-sizing: border-box; /* paddingとborderを幅と高さに含める */
	background-color: rgba(255,255,255,0.3);
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	-ms-border-radius: 30px;
	-o-border-radius: 30px;
	border-radius: 30px;
	behavior: url(js/PIE.htc); /* for IE8 */
	position: relative;
	padding:40px 238px 60px;
}
.cont-perform-inner h2{
	padding-bottom: 22px;
}
.cont-perform-inner dl{
	background: url(../../img/common/line_blue.png) repeat-x bottom left;
	padding: 20px 8px 20px 0;
}
.cont-perform-inner dl:after{
	content: "";
	display: block;
	clear: both;
	zoom: 1;
}
.cont-perform-inner dt{
	float: left;
	padding-right: 15px;
}
.cont-perform-inner dd{
	float: left;
	font-size: 2.2rem;
	color:#333333;
	text-align: left;
	padding-top: 14px;
}
.cont-perform-inner dl:last-of-type dd{
	padding-top: 0;
}

.wonder_fly2{
	position: absolute;
	top:-60px;
	right:-60px;
	animation: ani-fluffy 3s ease-out infinite;
}
.wonder_jump{
	position: absolute;
	top:20px;
	left:-60px;
}

/* =============================================
 prof
============================================= */
.cont-prof{
	background: url(../../img/common/bg_prof.png) no-repeat center top, -ms-linear-gradient(top, #dcf7ff 0%, #dcf7ff 50%, #94ca75 51%, #94ca75 100%);
	background: url(../../img/common/bg_prof.png) no-repeat center top, -moz-linear-gradient(top, #dcf7ff 0%, #dcf7ff 50%, #94ca75 51%, #94ca75 100%) ;
	background: url(../../img/common/bg_prof.png) no-repeat center top, -o-linear-gradient(top, #dcf7ff 0%, #dcf7ff 50%, #94ca75 51%, #94ca75 100%) ;
	background: url(../../img/common/bg_prof.png) no-repeat center top, -webkit-linear-gradient(top, #dcf7ff 0%, #dcf7ff 50%, #94ca75 51%, #94ca75 100%) ;
	background: url(../../img/common/bg_prof.png) no-repeat center top, linear-gradient(top, #dcf7ff 0%, #dcf7ff 50%, #94ca75 51%, #94ca75 100%) ;	
	padding-bottom: 60px;
}
.cont-prof-inner{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box; 
	-o-box-sizing: border-box; 
	box-sizing: border-box; /* paddingとborderを幅と高さに含める */
	width: 1000px;
	margin: 0 auto;
	text-align: left;
	padding:40px 90x 60px;
	position: relative;
}
.cont-prof-inner h2{
	padding: 224px 0 43px 194px;
}
.profile{
	text-align: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box; 
	-o-box-sizing: border-box; 
	box-sizing: border-box; /* paddingとborderを幅と高さに含める */
	background-color: rgba(86,160,54,0.4);
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	-ms-border-radius: 30px;
	-o-border-radius: 30px;
	border-radius: 30px;
	behavior: url(js/PIE.htc); /* for IE8 */
	position: relative;
	padding:30px 0 30px 30px;
	margin: 0 130px;
}
.profile:after{
	content: "";
	display: block;
	clear: both;
	zoom: 1;
}
.profile .col-L{
	float: left;
	width: 330px;
}
.profile .col-R{
	float: left;
	width: 330px;
	padding-left:30px;
	padding-bottom: 6px;
	background: url(../../img/common/line_white.png) repeat-y top left;
}
.profile dl{
	padding:8px 0;
	
}
.profile dl:after{
	content: "";
	display: block;
	clear: both;
	zoom: 1;
}
.profile dt{
	float: left;
	width: 120px;
}
.profile dd{
	font-size:1.6rem;
	color:#54370a;
	float: left;
	width:180px;
}
.wonder_stand{
	position: absolute;
	top:45px;
	left:530px;
}
.rabbit{
	position: absolute;
	top:320px;
	left:100px;
}
.chicken{
	position: absolute;
	top:500px;
	right:30px;
}
.dog{
	position: absolute;
	top:680px;
	left:100px;
}


/* =============================================
 LINE STAMP
============================================= */
.bnr-linestamp{
	position: fixed;
	top:160px;
	right: 0;
	z-index: 10;
}

/* =============================================
 footer
============================================= */
.footer{
	background-color: #644413;
	font-size: 1.6rem;
	color:#FFF;
}
.footer-inner{
	width: 1000px;
	margin: 0 auto;
}
.footer h2 {
	font-size: 1.6rem;
	padding: 20px 0;
	font-weight: bold;
}

.footer ul {
	margin-bottom: 20px;
}
.footer ul:after{
	content: "";
	display: block;
	clear: both;
	zoom: 1;
}
.footer li {
	padding: 2px 8px 1px 0;
	margin: 0 8px 7px 0;
	border-right: 1px solid #FFF;
  float: left;
	font-size:100%;
	line-height:1.0;
}
.footer li:last-child {
	padding: 0 8px 0 0;
	margin: 2px 0 1px 0;
	border-right:none;
}
.footer li a{
	color: #FFF;
	text-decoration: underline;
}
.footer .link {
	margin-top:20px;
}
.footer .copyright {
	text-align:center;
	padding:0 0 20px;

}
.footer .copyright a {
	color:#fff;
}
.footer .copyright a:hover {
	text-decoration:none;
}
.page-top{
	width: 110px;
	height: 103px;
	position: fixed;
	bottom: -10px;
	right: 40px;
	z-index: 1;
	display: none;
}
.page-top a{
	display: inline-block;
	position: relative;
	-webkit-transition: all 0.2s;
	-o-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-ms-transition: all 0.2s;
	transition: all 0.2s;
}
.page-top a:hover{
	-webkit-transform: translate(0,-10px);
	-ms-transform: translate(0,-10px);
	-moz-transform: translate(0,-10px);
	-o-transform: translate(0,-10px);
	transform: translate(0,-10px);
}

/* =============================================
 Animation
============================================= */
@keyframes ani-fluffy {
	0% {
		-webkit-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
	}
	25% {
		-webkit-transform: translate(0,-10px);
		-ms-transform: translate(0,-10px);
		-moz-transform: translate(0,-10px);
		-o-transform: translate(0,-10px);
		transform: translate(0,-10px);
	}
	70% {
		-webkit-transform: translate(0,10px);
		-ms-transform: translate(0,10px);
		-moz-transform: translate(0,10px);
		-o-transform: translate(0,10px);
		transform: translate(0,10px);
	}
	100% {
		-webkit-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
	}
}

@keyframes ani-fluffy2 {
	0% {
		-webkit-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
	}
	25% {
		-webkit-transform: translate(-10px,0);
		-ms-transform: translate(-10px,0);
		-moz-transform: translate(-10px,0);
		-o-transform: translate(-10px,0);
		transform: translate(-10px,0);
	}
	70% {
		-webkit-transform: translate(10px,0);
		-ms-transform: translate(10px,0);
		-moz-transform: translate(10px,0);
		-o-transform: translate(10px,0);
		transform: translate(10px,0);
	}
	100% {
		-webkit-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
	}
}


