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


/*====================
 全体
====================*/
html {
	overflow:auto;
}
body {
	background:url(../common/images/main_bg.gif) #C1DFFD no-repeat center top;
	background-attachment:fixed;
	-webkit-text-size-adjust: 100%;
}

a {
	color: #333333;
	text-decoration:none;
}
a:hover {
	color: #333333;
	text-decoration:underline;
}
.wrapper {
	width:980px;
	margin:0 auto;
}


/*====================
 ヘッダー
====================*/
#header {
	width:980px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
	padding-bottom:30px;
}
#header .logo {
	float:left;
	display:block;
	margin:60px 0px 0px 20px;
}
#header .logo h1 {
	margin-bottom:12px;
}
#header .subMenu {
	position:absolute;
	top:0px;
	right:0px;
}
#header .subMenu ul {
}
#header .subMenu ul li {
	float:left;
	background:url(../common/images/header_tab.png) no-repeat;
	width:123px;
	height:25px;
	color:#FFF;
	font-size:13px;
	text-align:center;
	line-height:25px;
	font-weight:bold;
}
#header .subMenu ul li a {
	color:#84B4EB;
	font-size:13px;
	text-align:center;
	line-height:25px;
	font-weight:bold;
	text-decoration:none;
	display:block;
}
#header .subMenu ul li a:hover {
	background:url(../common/images/header_tab_on.png) no-repeat;
	width:123px;
	height:25px;
	color:#FFF;
	font-size:13px;
	text-align:center;
	line-height:25px;
	font-weight:bold;
	text-decoration:none;
	display:block;
}
#header .subMenu ul li .snsIcon {
	display:none;
}
#header .subMenu ul li ul {
	width:225px;
	position:absolute;
	top:25px;
	left:-110px;
	z-index:710;
	padding:5px 0 10px 13px;
	background:url(../common/images/subCon_bg.gif);
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
}
#header .subMenu ul li ul li {
	background:none;
	width:35px;
	height:35px;
	float:left;
	margin:10px 10px 0px 0px;
	padding:0px;
}
#header .subMenu ul li ul li a {
	background:none;
	width:35px;
	height:35px;
	display:block;
}
#header .subMenu ul li ul li a:hover {
	background:none;
	width:35px;
	height:35px;
	display:block;
}


#header .mainVisual {
	float:right;
	width:365px;
	height:376px;
	margin:65px 20px 0 0;
	position:relative;
}
#header .mainVisual img {
	position:absolute;
	top:0;
	left:0;
	z-index:700;
}
#header .mainVisual p.kaishi {
	position:absolute;
	bottom:7px;
	left:30px;
	z-index:710;
	font-size:18px;
	color:#FFFFFF;
	font-weight:bold;
}
span {
	color:#F8628F;
}
#header .mainVisual p.kaishi a {
	color:#FFFFFF;
	font-weight:bold;
}
span {
	color:#F8628F;
}
#header .mainVisual p.kaishi a:hover {
	color:#FFFFFF;
	font-weight:bold;
	text-decoration:none;
}

/*====================
 コンテンツ
====================*/

.content {
	clear:both;
	background:url(../common/images/board_bg.gif) repeat-y;
	width:980px;
	margin:48px auto 0px auto;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	behavior: url(common/css/PIE.htc);
}

/*   ナビ    */
.content .nav {
	margin:0px 0px 0px 0px;
	float:right;
	position:relative;
	width:680px;
	height:104px;
}
.content .nav li {
	position:absolute;
	display:block;
}
.content .nav li.live {
	z-index:510;
	left: -7px;
	top: -33px;
}
.content .nav li.ticket {
	z-index:505;
	left: 109px;
	top: 6px;
}
.content .nav li.school {
	z-index:501;
	left: 185px;
	top: -52px;
}
.content .nav li.message {
	z-index:508;
	left: 328px;
	top: -22px;
}
.content .nav li.supporter {
	z-index:506;
	left: 456px;
	top: -29px;
}
.content .nav li.store {
	z-index:504;
	left: 559px;
	top: -29px;
}

.content .nav li:hover {
	z-index:700;
}

/*   サブコンテンツ    */


.content .subContent {
	position:relative;
	float:left;
	width:228px;
	background:url(../common/images/subCon_bg.gif);
	margin:15px;
	padding:18px;
	-webkit-box-shadow: #666 2px 2px 4px;
	-moz-box-shadow: #666 2px 2px 4px;
	box-shadow: #666 2px 2px 4px;
	behavior: url(css/PIE.htc);

	
}
.content .subContent img.clipImg {
	position:absolute;
	left: 100px;
	top: -55px;
}
.content .subContent h2 {
	margin:0 auto 15px;
	text-align:center;
}


.content .subContent p {
	font-size:13px;
	line-height:21px;
	color:#333333;
	font-weight:bold;
	text-align:justify;
	margin-bottom:15px;
}



.content .subContent .cameraBtn {
	position:relative;
	margin:10px 0 0px;
}

.content .subContent .cameraBtn img {
	margin-bottom:9px;
}



.content .subContent .jisseki {
	background:url(../images/jisseki_bg.png) no-repeat;
	padding:10px 15px 20px 15px;
	width:208px;
	height:234px;
}
.content .subContent .jisseki h3 {
	margin:0px auto 10px ;
	font-size:14px;
	color:#333333;
	text-align:center;
	font-weight:bold;
}

.content .subContent .jisseki dt {
	margin:15px 0 0px 60px;
	font-size:14px;
	line-height:21px;
	color:#333333;
	position:relative;
}
.content .subContent .jisseki dt img {
	position:absolute;
	top:0;
	left:-57px;
}

.content .subContent .jisseki dd {
	margin:0px 0 23px 60px;
	padding:0px 0 10px 0;
	font-size:16px;
	line-height:21px;
	color:#F8628F;
	font-weight:bold;
}

/*   「いいね」と「ツイート」    */

.iinetweet {
	margin:17px 0 0px 0;
}

iframe.twitter-share-button{
	width:100px !important;
}



.ticketGuide {
	position:relative;
	height:155px;
}

.ticketGuide li {
	position:absolute;
}

.ticketGuide li.live {
	top:8px;
	left: 8px;
	z-index:566;
}

.ticketGuide li.ticket {
	top:52px;
	left: 114px;
	z-index:561;
}
.ticketGuide li:hover {
	z-index:710;
}

.iroenpitsu {
	position:absolute;
	bottom:-336px;
	left:-75px;
}

/*   メインコンテンツ    */

.content .mainContent {
	float:left;
	width:652px;
	margin:0px 0px 0px 10px;
}

/*   Whats New    */

.content .mainContent .information {
	background:url(../images/kokuban.png) no-repeat;
	width:602px;
	height:261px;
	padding:26px 31px 56px 24px;
	margin-bottom:-15px;
}
.content .mainContent .information .scroller {
	width:602px;
	height:261px;
	overflow:auto;
}

.content .mainContent .information h2 {
	font-size:16px;
	color:#FFFFFF;
	font-weight:bold;
}

.content .mainContent .information li span {
	font-size:13px;
	color:#FFF;
	padding-left:18px;
	font-weight:bold;
	background:url(../images/kokuban_magnet.png) no-repeat 3px 2px;
}
.content .mainContent .information li {
	background:url(../images/kokuban_line.png) top left repeat-x;
	padding-top:10px;
	font-size:14px;
	line-height:21px;
	color:#F8F092;
	font-weight:bold;
	padding-left:116px;
	text-indent:-116px;
	padding-right:0px;
	margin:0px;
}
.content .mainContent .information li a {
	font-size:14px;
	line-height:21px;
	color:#F8F092;
	font-weight:bold;
	text-decoration:none;
}

.content .mainContent .information li a:hover {
	color:#E6A4BD;
	font-weight:bold;
	text-decoration:none;
}

/*   通常コンテンツ   */


.content .mainContent .paperBoard {
	padding:25px;
	background:url(../common/images/paper_bg.gif);
	clear:both;
}


/*   ムービーシアター   */


.movieTheater ul.permanent {
	margin:0px -20px 20px -10px;
}
.movieTheater ul.permanent li {
	float:left;
	margin-right:8px;
}
.movieTheater ul.permanent li .movieBox {
	width:188px;
	min-height:173px;
	padding:7px;
	background:#F8FAF4;
	-webkit-box-shadow: #333 1px 1px 2px;
	-moz-box-shadow: #333 1px 1px 2px;
	box-shadow: #333 1px 1px 2px;
	behavior: url(css/PIE.htc);
}
.movieTheater ul.permanent li .movieBox p {
	font-size:13px;
	line-height:16px;
	text-align:center;
	color:#333333;
	font-weight:bold;
	margin-top:8px;
}
.series01 {
    -webkit-transform: rotate(-4deg);  
    -moz-transform: rotate(-4deg);  
}
.series02 {
    -webkit-transform: rotate(3deg);  
    -moz-transform: rotate(3deg);  
}
.series03 {
    -webkit-transform: rotate(-3deg);  
    -moz-transform: rotate(-3deg);  
}
.midashi01 {
	padding-top:25px;
	clear:both;
	padding-bottom:12px;
	background:url(../images/school_tit_bg.png) left bottom no-repeat;
	margin-bottom:10px;
}
.midashi01 h2 {
	float:left;
	margin-right:15px;
}

.midashi01 h3 {
	font-size:16px;
	color:#333333;
	font-weight:bold;
}
.movieTheater p {
	font-size:13px;
	color:#333333;
	line-height:20px;
	text-align:justify;
}


/*   なぜ学校が必要か   */

.donateSchool {
}

.donateSchool p {
	font-size:13px;
	color:#333333;
	line-height:20px;
	text-align:justify;
}

.donateSchool h4 {
	font-size:14px;
	color:#F8628F;
	line-height:21px;
}
.mawarikomigi {
	display:block;
	float:right;
	padding:0px 0px 10px 10px;
}
.mawarikomigi img {
	margin-bottom:8px;
}
.mawarikomigi p {
	font-size:11px;
}


/*   バナー   */
.bannerMain {
	clear:both;
	margin:22px 0px 22px 30px;
	position:relative;
}
.bannerMain li {
	float:left;
	margin-left:52px;
}
.bannerMain p.kawari {
	position:absolute;
	top:90px;
	left:42px;
	font-size:12px;
}
.bannerMain p.kawari a {
	color:#FFF;
	font-weight:bold;
	text-shadow:1px 1px 2px #333;
}
.bannerMain p.kawari a:hover {
	color:#F8628F;
	font-weight:bold;
	text-decoration:underline;
	text-shadow:none;
}

/*   SNSアイコン   */
.snsIcon {
	clear:both;
	text-align:center;
}
.snsIcon ul {
	margin:0 0 0 110px;
}
.snsIcon li {
	float:left;
	margin:25px 15px 25px 0px;
}

/*====================
 フッター
====================*/
#footer {
	clear:both;
	padding-top:31px;
}
#footer .logo {
	float:left;
	margin-left:10px;
}
#footer h2 {
}
#footer h3 {
	margin-top:5px;
	margin-bottom:30px;
}

#footer .banner {
	float:left;
}
#footer .banner ul {
	margin-left:100px;
}
#footer .banner li {
	float:left;
	margin-right:28px;
	margin-bottom:30px;
}

#footer .sitemap {
	clear:both;
	background:url(../common/images/footer_bg.gif);
	font-size:12px;
	line-height:18px;
	color:#666666;
	padding:38px 0 33px 0;
}
#footer .sitemap .second {
	display:block;
	float:left;
	margin-right:60px;
}
.copyright {
	clear:both;
	padding-top:10px;
}




/*====================
 シーケンスslider test
====================*/
#header .sequence-preloader {
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 0;
}


#header .slider {
	float:left;
	width:563px;
	margin-top:0px;
	position:relative;
	height:270px;
}


#nav {
	bottom: -30px;
	display: none;
	right: 46%;
	position: absolute;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

#nav li {
	display: inline;
}

#nav li img {
	cursor: pointer;
	opacity:0.5;

	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-o-transition-duration: 1s;
	-ms-transition-duration: 1s;
	transition-duration: 1s;
}

#nav li img.active {
	opacity:1;
}


	/*only display the hover effect on desktops/laptops*/
	#nav li img:hover {
	opacity:1;
	
		-webkit-transition-duration: 1s;
		-moz-transition-duration: 1s;
		-o-transition-duration: 1s;
		-ms-transition-duration: 1s;
		transition-duration: 1s;
	}

#sequence li{
	height: 100%;
	position: absolute;
	top: -50%;
	width: 100%;
}

#sequence li * {
	position: absolute;
}

#sequence li img{
}

#sequence {
	position:absolute;
	background:#FFC;
	display: block;
	width: 1363px;
	
	/*backface-visibility prevents graphical glitches when frames are animating*/
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
}

#sequence h2 {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#00A0E6;
	font-weight: bold;
	font-size:24px;
	text-align:center;
	margin-top:-8px;
}
#sequence h3 {
	margin-top:230px;
	text-align:center;
	width: 560px;
}


.title {
	left: 0px;
	width: 563px;
	text-align:center;
	opacity:0;
	z-index: 50;
}

.title.animate-in {
	center: 0px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.title.animate-out {
	left: 0px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.subtitle {
	color: #F36A96;
	font-size: 16px;
	line-height:21px;
	left: 50%;
	opacity:0;
	text-align:center;
}
.subtitle img {
}
/*
#sequence h3.hidarikara {
	text-align:left;
	padding-left:40px;
}
*/
.subtitle.animate-in,
.subtitle.animate-in img{
	text-align:center;
	left:0px;
	width: 560px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.subtitle.animate-out {
	left: -50%;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.model {
	left: -100px;
	top: 50px;
	opacity:0;
}

.model.animate-in {
	left: 0px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.model.animate-out {
	left: 100px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}


.photo1 {
	left: 300px;
	top:49px;
	opacity:0;
}

.photo1.animate-in {
	left: 7px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo1.animate-out {
	left: -200px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}
.photo2 {
	left: 400px;
	top: 60px;
	opacity:0;
}

.photo2.animate-in {
	left: 177px;
	opacity:1;
	z-index:600;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo2.animate-out {
	left: -150px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}
.photo3 {
	left: 500px;
	top: 39px;
	opacity:0;
}

.photo3.animate-in {
	left: 359px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo3.animate-out {
	left: -90px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo4 {
	left: 300px;
	top:49px;
	opacity:0;
}

.photo4.animate-in {
	left: 7px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo4.animate-out {
	left: -200px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}
.photo5 {
	left: 430px;
	top: 50px;
	opacity:0;
}

.photo5.animate-in {
	left: 187px;
	opacity:1;
	z-index:600;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo5.animate-out {
	left: -150px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}
.photo6 {
	left: 500px;
	top: 50px;
	opacity:0;
}

.photo6.animate-in {
	left: 369px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo6.animate-out {
	left: -90px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}


.photo7 {
	left: 290px;
	top:49px;
	opacity:0;
}

.photo7.animate-in {
	left: 0px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo7.animate-out {
	left: -210px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}
.photo8 {
	left: 433px;
	top: 50px;
	opacity:0;
}

.photo8.animate-in {
	left: 187px;
	opacity:1;
	z-index:600;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo8.animate-out {
	left: -150px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}
.photo9 {
	left: 513px;
	top: 50px;
	opacity:0;
}

.photo9.animate-in {
	left: 379px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo9.animate-out {
	left: -80px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}


.photo10 {
	left: 300px;
	top:49px;
	opacity:0;
}

.photo10.animate-in {
	left: 80px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo10.animate-out {
	left: -200px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}
.photo11 {
	left: 500px;
	top: 50px;
	opacity:0;
}

.photo11.animate-in {
	left: 315px;
	opacity:1;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

.photo11.animate-out {
	left: -90px;
	opacity:0;

	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	-ms-transition-duration: .5s;
	transition-duration: .5s;
}

/*====================
 カルーセルスライダー test
====================*/


.videoSlider {
	background:url(../images/theater_bg.png) no-repeat;
	width:604px;
	height:107px;
	margin:10px 0px;
	position:relative;
}
.katameru {
}
.jcarousel-prev {
	position:absolute;
	width:30px;
	height:30px;
	top:38px;
	left:10px;
	z-index:1000;
	cursor:pointer;	
}
.jcarousel-next {
	position:absolute;
	width:30px;
	height:30px;
	top:38px;
	left:565px;
	z-index:1000;
	cursor:pointer;
}

.jcarousel-container {
	width:540px;
}
.jcarousel-clip {
	position:absolute;
	top:18px;
	left:40px;
	width:525px;
	overflow:hidden;
}

ul#mycarousel {
	width:525px;
	overflow:hidden;
}
ul#mycarousel li {
	margin:0 9px 0 0;
	float:left;
}