@charset "utf-8";


/* ============================================================

	style info : ページごとのスタイルを記述

============================================================ */

/* -----------------------------------
	top
----------------------------------- */

#loading {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 455px;
	background: #fff url(../img/top/loading.gif) center center no-repeat;
	z-index: 3000;
}

#topVisual {
	position: relative;
}
#topVisual.hour01 {
	background: url(../img/top/hour01/bg.jpg) center -30px repeat-x;
}
#topVisual.hour02 {
	background: url(../img/top/hour02/bg.jpg) center -30px repeat-x;
}
#topVisual.hour03 {
	background: url(../img/top/hour03/bg.jpg) center -30px repeat-x;
}
#topVisual.hour04 {
	background: url(../img/top/hour04/bg.jpg) center -30px repeat-x;
}
#topVisual.hour05 {
	background: url(../img/top/hour05/bg.jpg) center -30px repeat-x;
}
.static {
	background: url(../img/top/bg_static_ja.jpg) center -30px repeat-x !important;
}

#topVisual {
	overflow: hidden;
}
#topVisual .layoutInner {
	height: 455px;
}
#animCatch {
	position: relative;
}
#animCatch div,
#animCatch span,
#animObj div {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
}
#animObj div.clickable {
	left: 32px;
	z-index: 200;
	width: 170px;
	height: 270px;
}
#animObj div.clickable a {
	display: block;
	width: 100%;
	height: 100%;
	opacity: 0;
	filter:alpha(opacity=0);
	-moz-opacity: 0;
	background: #fff;
}
#animCatch span {
	display: none;
	width: 100px;
	height: 103px;
	top: 5px;
	background-image: url(../img/top/txt_catch_ja.png);
	background-repeat: no-repeat;
	font-size: 1px;
	text-align: left;
	text-indent: -9999em;
	/*¥*/
	overflow: hidden;
	/**/
}

#animCatch .line01 {
	left: 186px;
	top: 30px;
}
#animCatch .line02 {
	left: 218px;
	top: 100px;
}
#animCatch .line03 {
	left: 262px;
	top: 170px;
}
#animCatch .line04 {
	left: 232px;
	top: 240px;
}

#animCatch .line01 span.l01 { background-position: 0 0; left: 0; }
#animCatch .line01 span.l02 { background-position: -100px 0; left: 63px; }
#animCatch .line01 span.l03 { background-position: -200px 0; left: 127px; }
#animCatch .line01 span.l04 { background-position: -300px 0; left: 185px; }
#animCatch .line01 span.l05 { background-position: -400px 0; left: 249px; }
#animCatch .line01 span.l06 { background-position: -500px 0; left: 325px; }
#animCatch .line01 span.l07 { background-position: -600px 0; left: 390px; }
#animCatch .line01 span.l08 { background-position: -700px 0; left: 446px; }
#animCatch .line01 span.l09 { background-position: -800px 0; left: 511px; }

#animCatch .line02 span.l01 { background-position: 0 -100px; left: 0; }
#animCatch .line02 span.l02 { background-position: -100px -100px; left: 63px; /* top: -9px */; }
#animCatch .line02 span.l03 { background-position: -200px -100px; left: 120px; /* top: 7px */;}
#animCatch .line02 span.l04 { background-position: -300px -100px; left: 186px; }
#animCatch .line02 span.l05 { background-position: -400px -100px; left: 260px; }
#animCatch .line02 span.l06 { background-position: -500px -100px; left: 323px; }
#animCatch .line02 span.l07 { background-position: -600px -100px; left: 381px; }
#animCatch .line02 span.l08 { background-position: -700px -100px; left: 445px; }

#animCatch .line03 span.l01 { background-position: 0 -200px; left: 0; }
#animCatch .line03 span.l02 { background-position: -100px -200px; left: 64px; }
#animCatch .line03 span.l03 { background-position: -200px -200px; left: 112px; }
#animCatch .line03 span.l04 { background-position: -300px -200px; left: 182px; }
#animCatch .line03 span.l05 { background-position: -400px -200px; left: 240px; }
#animCatch .line03 span.l06 { background-position: -500px -200px; left: 301px; }
#animCatch .line03 span.l07 { background-position: -600px -200px; left: 356px; }

#animCatch .line04 span.l01 { background-position: 0 -300px; left: 0; }
#animCatch .line04 span.l02 { background-position: -100px -300px; left: 57px; }
#animCatch .line04 span.l03 { background-position: -200px -300px; left: 83px; }
#animCatch .line04 span.l04 { background-position: -300px -300px; left: 162px; }
#animCatch .line04 span.l05 { background-position: -400px -300px; left: 220px; }
#animCatch .line04 span.l06 { background-position: -500px -300px; left: 245px; }
#animCatch .line04 span.l07 { background-position: -600px -300px; left: 301px; }
#animCatch .line04 span.l08 { background-position: -700px -300px; left: 344px; }
#animCatch .line04 span.l09 { background-position: -800px -300px; left: 399px; }
#animCatch .line04 span.l10 { background-position: -900px -300px; left: 452px; }


#animObj {
	position: absolute;
	left: 0;
	top: 0;
}

#animObj .parts {
	display: none;
	position: absolute;
	top: 350px;
}
#animObj .parts .parts1 { left: 4px; top: 0; }
#animObj .parts .parts2 { left: 163px; top: 0; }
#animObj .parts .parts3 { left: 335px; top: 0; }
#animObj .parts .parts4 { left: 467px; top: 0; }
#animObj .parts .parts5 { left: 623px; top: 0; }
#animObj .parts .parts6 { left: 745px; top: 0; }
#animObj .parts .parts7 { left: 869px; top: 0; }

#animObj .unitContainers {
	position: absolute;
}
#animObj .unitContainers .container {
	position: absolute;
	top: 0;
	width: 240px;
	height: 455px;
	/*display: none;*/
	z-index: 100;
}
#animObj .unitContainers #container1 { left: -120px; }
#animObj .unitContainers #container2 { left: 120px; }
#animObj .unitContainers #container3 { left: 360px; }
#animObj .unitContainers #container4 { left: 600px; }
#animObj .unitContainers #container5 { left: 840px; }


#animObj .units {
	position: absolute;
}
#animObj .break {
	z-index: 300;
	left: -100px;
	width: 400px;
	height: 455px;
	background: url(../img/top/obj_break.png) left top no-repeat;
}
#animObj .unit {
	display: none;
	z-index: 100;
}
#animObj .selectedUnit {
	display: block;
	z-index: 200;
}

#animObj .unit .dialog {
	display: none;
	position: absolute;
	left: 25px;
	/* top: 70px; */
	background: url(../img/top/bg_dialog.png) left top no-repeat;
	padding-top: 10px;
	width: 180px;
	font-size: 134%;
	font-weight: bold;
	/*color: #333;*/
	text-decoration: none;
	line-height: 1.3;
}
#animObj .unit .dialog span {
	display: block;
	padding: 10px 20px 30px 20px;
	width: 140px;
	background: url(../img/top/bg_dialog.png) right bottom no-repeat;
}
#animObj .unit a.dialog:link,
#animObj .unit a.dialog:visited {
	color: #333;
}
#animObj .unit a.dialog:hover,
#animObj .unit a.dialog:active {
	color: #666;
}

/* -----------------------------------
	TOP #topics
----------------------------------- */

#topics {
	position: relative;
	padding: 6px 0px;
	background: #fff000;
	text-align: center;
	height: 100px;
}

#topics .ttl {
	float: left;
	width: 100px;
}
#topics h2 {
	width: 87px;
	margin-top: 36px;
}
#topics p {
	color: #0066cc;
	font-weight: bold;
	margin-top: 5px;
}
#topics ul {
	float: right;
	/* temp */
	/*width: 860px;*/
	margin: 0 35px;
}
#topics ul li {
	float: left;
}
#topics ul li.topics1,
#topics ul li.topics2,
#topics ul li.topics3,
#topics ul li.topics4,
#topics ul li.topics5 {
	margin-right: 10px;
	background-color: #fff;
}

#topics ul li.rEnd {
	margin-right: 5px;
}
/*
#topics ul li img {
	width: 149px;
}
*/
#topics ul li a:hover img {
	color: #fff;
	filter: alpha(opacity=70);
	opacity: 0.7;
	-moz-opacity: 0.7;
}

#topics ul li.prev a,
#topics ul li.next a {
	display: block;
	font-size: 1px;
	overflow: hidden;
	text-align: left;
	text-indent: -9999em;
	background: url(../img/top/nav_topics.png) no-repeat;
	width: 35px;
	height: 100px;
}
#topics ul li.prev a {
	background-position: 0 0;
}
#topics ul li.prev a: hover {
	background-position: -40px 0;
}
#topics ul li.next a {
	background-position: -80px 0;
}
#topics ul li.next a: hover {
	background-position: -120px 0;
}


/* -----------------------------------
	TOP#contents
----------------------------------- */

#contents #news {
	width: 323px;
	margin: 20px 30px 0 20px;
	float: left;
	display: inline;
}
#contents #news .head_content,
#contents #event .head_content {
	overflow: hidden;
}
#contents #news .head_content h2,
#contents #event .head_content h2 {
	float: left;
}
#contents #news .head_content p,
#contents #event .head_content p {
	float: right;
}
#contents #news dl,
#contents #event dl {
	margin: 20px 0 0 0;
}

#contents #news dd {
	font-size: 100%;
	font-weight: bold;
	color: #666;
}
#contents #news dd .textIcon {
	position: static;
	color: #ff6d02;
	font-size: 100%;
	border: 0;
}
#contents #news dd .newIcon {
	padding-top: 3px;
}
#contents #news dt {
	font-size: 117%;
	margin-bottom: 8px;
	padding-bottom: 6px;
	line-height: 1.4em;
	border-bottom: 1px dotted #ccc;
}
#contents #news dt:last-child {
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 0;
}
#contents #news dt a {
	text-decoration: none;
}
#contents #news p.Alllink,
#contents #event p.Alllink {
	padding: 0 0 0 10px;
	background: url(/img/common/topicpath.png) no-repeat left center;
}
#contents #news p.Alllink a,
#contents #event p.Alllink a {
	text-decoration: none;
}
#contents #event {
	width: 323px;
	margin: 20px 30px 0 0;
	float: left;
	display: inline;
}
#contents #event .attention {
	margin-top: 20px;
}
#contents #event dd {
	clear: both;
	float: left;
	/*width: 3.5em;
	margin-right: 4px;*/
	margin-right: 5px;
	margin-bottom: 4px;
	padding: 4px 2px 2px 7px;
	background-color: #0175C2;
	color: #FFFFFF;
	font-size: 100%;
	font-weight: bold;
	text-align: center;
	line-height: 1.2;
}
#contents #event dt {
	/*overflow: hidden;*/
	margin-bottom: 10px;
	font-size: 117%;
	line-height: 1.8em;
	color: #666;
}
#contents #event .event_footer {
	margin:0.8em 0 0;
}
#contents form {
	float: right;
}

#contents #banner {
	position: relative;
	width: 190px;
	margin: 40px 20px  20px 0;
	float: left;
}
#contents #banner .banner02 .img01 {
	left: -3px;
	position: absolute;
	top: -23px;
}


#banner .subBox{
	margin-top:15px;	
}

/* 2013.09.09 LaQ殿堂新着作品の追加 */
#art_contents #artist {
	display: inline;
	float: left;
	margin: 20px 20px 0 20px;
	width: 920px;
}
#art_contents #artist .head_content {
	overflow: hidden;
}
#art_contents #artist .head_content h2 {
	float: left;
}
#art_contents #artist .head_content .Alllink {
	float: right;
	padding-left: 10px;
	background: url(/img/common/topicpath.png) no-repeat left center;
}
#art_contents #artist .head_content .Alllink a {
	text-decoration: none;
}
#art_contents #artist ul {
	overflow:hidden;
	margin: 20px 0 0;
	width: 920px;
}
#art_contents #artist ul li {
	float: left;
	overflow: hidden;
	margin-bottom: 15px;
	width: 460px;
}
#art_contents #artist ul li a {
	text-decoration: none;
}
#art_contents #artist ul li .artist_photo {
	float: left;
	overflow: hidden;
	width: 45px;
	height: 45px;
	border: 1px solid #D2B600;
}
#art_contents #artist ul li .txt_content {
	float: left;
	padding: 0 20px 0 10px;
	width: 380px;
	font-weight: bold;
}
#art_contents #artist ul li h3 {
	font-size: 115%;
}
#art_contents #artist ul li:last-child {
	margin-bottom: 0;
}


/* -----------------------------------
	#facebook
----------------------------------- */
#facebook {
	position: relative;
	width: 940px;
	margin-top: 15px;
	padding: 10px;
	background: #fff;
	text-align: left;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
}
