/* For modern browsers */
.cf:before,
.cf:after {content:"";display:table;}
.cf:after {clear:both;}
/* For IE 6/7 (trigger hasLayout) */
.cf {zoom:1;}
#mainvisual{
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","Osaka", Verdana, "ＭＳ Ｐゴシック", "MS P Gothic", Arial, Helvetica, sans-serif;
	font-size: 100%;
	line-height: 1.1;
	height:405px;
	background-color:#eee;
	overflow:hidden;
	position:relative;
}

/* scene */
#scenebox{
	width:951px;
	margin:0 auto;
	position:relative;
}
.scene{
	width:880px;
	height:390px;
	position:absolute;
	top:0;
	left:129px;
	overflow:hidden;
	display:none;
}
#scene4{
	width:930px;
	left:150px;
}

/* plate */
.plates{
	width:1438px;	/* 240x6 - 2 */
	height:390px;
	position:absolute;
}

.mask-naname{
	width:880px;
	height:390px;
	position:absolute;
	background-image:url("../img/nanamemask.png");
}
#scene4 .mask-naname{
	width:930px;
	background-image:url("../img/nanamemask930.png");
}

.plate{
	width:238px;
	height:390px;
	position:absolute;
}

/* mask-stream */
#mask-stream{
	width:100%;
	height:405px;
	position:absolute;
	background-image:url("../img/streammask.png");
	background-position:left top;
}
/* particle */
#particle{
	width:100%;
	height:405px;
	display:none;
	position:absolute;
	background-image:url("../img/particle.png");
	background-position:center bottom;
	background-repeat:no-repeat;
}

/* object */
#objectbox{
	width:951px;
	height:405px;
	margin:0 auto;
	position:relative;
}
.object{
	width:951px;
	height:405px;
	position:absolute;
	text-align:left;
	display:none;
}
#object0-copy{
	margin:155px auto 0 auto;
	display:block;
}
.object .title{
	position:absolute;
	left:0; top:0;
	display:block;
}
.object .lead{
	position:absolute;
	left:50px; top:78px;
	display:block;
}
.object .link{
	width:286px;
	margin:0;
	padding:0;
	display:block;
	position:absolute;
	left:50px; top:110px;
	background-image:url(../img/tensen_title.gif);
	background-repeat:no-repeat;
}
.object .link li{margin:0;padding:0;}
.object .link li.jigyou{
	width:211px;
	height:21px;
	margin:11px 0 21px 0;
	padding:9px 0 0 25px;
	background-image:url(../img/bt_base.png);
	background-repeat:no-repeat;
}
.object .link li.jigyou a:link{color:#c9004c;text-decoration:none}
.object .link li.jigyou a:visited{color:#c9004c;text-decoration:none}
.object .link li.jigyou a:hover{color:#c9004c;text-decoration:underline}
.object .link li.jigyou a:active{color:#c9004c;text-decoration:underline}
.object .link li.group{
	padding-left:25px;
	margin-bottom:14px;
	background-image:url(../img/linkmark_blank.gif);
	background-repeat:no-repeat;
	background-position:6px 1px;
}
.object .link li.group a:link{color:#333;text-decoration:none}
.object .link li.group a:visited{color:#333;text-decoration:none}
.object .link li.group a:hover{color:#333;text-decoration:underline}
.object .link li.group a:active{color:#333;text-decoration:underline}
.object .man{
	position:absolute;
	display:none;
}
.object #man1{left:725px;top:0;}
.object #man2{left:678px;top:0;}
.object #man3{left:638px;top:0;}


/* 60th_logobox */
#logo60thbox{
	width:208px;
	position:absolute;
	left:0; top:33px;
}
#logo60th{
	margin-bottom:15px;
	display:block;
}
#logo60th_bt{
	padding-top:10px;
	background-image: url(../img/tensen_title.gif);
	background-repeat:repeat-x;
	background-position:left top;
}
#logo60th_bt>a{
	width:100%;
	height:30px;
	display:block;
	color:#c9004c;
	font-size:13px;
	line-height:30px;
	text-align:center;
	
	border-radius:15px 15px;
	background-color:#fff;
}
#logo60th_bt>a:before{
	content:"";
	width:6px;
	height:6px;
	margin-right:5px;
	display:inline-block;
	vertical-align:middle;
	background-image: url(../img/arrow_link.png);
	background-repeat:no-repeat;
	background-position:left center;
}

/* tribox */
#tribox{
	width:100%;
	height:100%;
	position:absolute;
	left:0; top:0;
}
.tri{
	display:block;
	position:absolute;
	opacity:0;
	visibility:hidden;
}
#tribox.show .tri{
	visibility:visible;
	-webkit-animation:	roundin 1.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s 1 normal forwards;
	animation:			roundin 1.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s 1 normal forwards;
}
-webkit-@keyframes roundin{
	0%{		-webkit-transform: rotateY(-540deg);opacity:0;	}
	100%{	-webkit-transform: rotateY(0deg);	opacity:1;	}
}
@keyframes roundin{
	0%{		transform: rotateY(-630deg);opacity:0;	}
	100%{	transform: rotateY(0deg);	opacity:1;	}
}
#tri1{
	left:-129px;
	top:228px;
}
#tri2{
	left:-47px;
	top:1px;
}
#tri3{
	left:222px;
	top:49px;
}
#tri4{
	left:306px;
	top:218px;
}
#tri5{
	left:913px;
	top:111px;
}
#tri6{
	left:960px;
	top:285px;
}

#tribox.show #tri1{
	animation-delay:0.5s;
}
#tribox.show #tri2{
	animation-delay:0.8s;
}
#tribox.show #tri3{
	animation-delay:1.1s;
}
#tribox.show #tri4{
	animation-delay:1.4s;
}
#tribox.show #tri5{
	animation-delay:1.1s;
}
#tribox.show #tri6{
	animation-delay:1.7s;
}


.tri>img{
	display:block;
}


/* bar */
#bar{
	height:50px;
	margin-bottom:55px;
	background-color:#c9004c;
}
#bts{
	width:951px;
	margin:0 auto;
	position:relative;
}
.bt{
	height:50px;
	display:block;
	position:relative;
	
	cursor: pointer;
	float:left;
}
#bt1{
	width:175px;
}
#bt2{
	width:220px;
}
#bt3{
	width:190px;
}
.bt>p{
	width:100%;
	height:100%;
	position:absolute;
	left:0; top:0;
	
	font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
	color:#fff;
	font-size:12.5px;
	font-weight:normal;
	line-height:50px;
	text-align:center;
	
	z-index:120;
}
.btspecial{
	display:block;
	position:absolute;
	background-color:#c9004c;
}
#bt4{
	width:170px;
	height:151px;
	left:601px;top:-86px;
}
#btspecial{
	width:170px;
	height:151px;
	left:781px;top:-86px;
}

.btspecial>img{
	display:block;
	position:absolute;
	left:-6px;top:0;
	z-index:110;
}
.btspecial>p{
	width:100%;
	position:absolute;
	left:0;top:108px;
	color:#fff;
	
	font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
	font-size:13px;
	font-weight:normal;
	line-height:1;
	letter-spacing:0.03em;
	text-align:center;
	z-index:120;
}
.btspecial>p>small{
	padding-bottom:6px;
	display:block;
	font-size:10px;
	letter-spacing:0em;
}
.bt:hover,
.btspecial:hover{
	text-decoration:none;
}

.bt:before,
.btspecial:before{
	content:"";
	width:100%;
	height:100%;
	display:block;
	position:absolute;
	left:0; top:0;
	background-image:url(../img/bt_focus_bg.png);
	z-index:100;
	opacity:0;
	
	-webkit-transition:	opacity 0.3s ease;
	transition:			opacity 0.3s ease;
}
.btSlide.active:before,
#btspecial:hover:before{
	opacity:1;
}