@charset "utf-8";
/*---------------------------------------------------------------
exhibition.css
-----------------------------------------------------------------
table of contents

	1. Override
	2. Page Module
	3. Page Layout : Top
	4. Page Layout : Entry
	5. Browser Type
	6. Language
	7. Media Query

---------------------------------------------------------------*/

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

	1.	Override

===============================================================*/
.page-title{
	margin-bottom: 47px;
	width: 121px;
}

.caption{
	line-height: 18px;
	padding: 10px 0 0 0;
}

.entry-archive .page-header .select-archive{
	right: 177px;
}


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

	2.	Page Module

===============================================================*/
.clear{
	clear: both;
	width: 100%;
}


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

	3.	Page Layout : Top

===============================================================*/
.article-wrapper article{
	margin: 0 0 60px 0;
	overflow: hidden;
	position: relative;
	zoom: 1;
}

.article-wrapper article .inner{
	filter: alpha(opacity=0);
	opacity: 0;
	-ms-filter: "alpha(opacity=0)";
}

.article-wrapper article .thumb-wrapper{
	background-color: #000;
	float: left;
	overflow: hidden;
	position: relative;
	zoom: 1;
}

.article-wrapper article .thumb-wrapper .thumb{
	background-color: #fff;
	float: left;
	overflow: hidden;
}

.article-wrapper article .thumb-wrapper .view{
	display: block;
	filter: alpha(opacity=30);
	float: right;
	opacity: .3;
	overflow: hidden;
	-ms-filter: "alpha(opacity=30)";
}

.article-wrapper article .thumb-wrapper header{
	color: #fff;
	/*height: 100%;*/
	position: absolute;
	right: 0;
	top: 0;
}

.article-wrapper article .thumb-wrapper header h1,
.article-wrapper article .thumb-wrapper header h2{
	padding-left: 53px;
	padding-right: 50px;
	word-break: normal;
}
.article-wrapper article .thumb-wrapper header p{
	padding-left: 53px;
	padding-right: 30px;
	word-break: normal;
}

.article-wrapper article .thumb-wrapper header h1,
.article-wrapper article .thumb-wrapper header h2{
	letter-spacing: 3px;
}

.article-wrapper article .thumb-wrapper header h2{
	/*font-weight: normal;*/
}
.article-wrapper article .thumb-wrapper header h1{
	margin-top:35px;
}
.article-wrapper article .thumb-wrapper header p{

}
.article-wrapper article .thumb-wrapper header p.date{
	padding-top:25px;
}
.article-wrapper article .thumb-wrapper header .current{
	color: #f99;
}
#side .inner{
	width: 55px;
}
#exhibition #side dd{
	padding:24px 0 45px 7px
}
#side .inner dl{
	margin-left:0px;
}
.article-wrapper article .thumb-wrapper a{
	background-image: url(../images/icon_arrow_bg_fff05.png);
	background-position: 694px 19px;
	background-repeat: no-repeat;
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.article-wrapper article .thumb-wrapper a:hover{
	background-image: url(../images/icon_arrow_bg_fff10.png);
}

.article-wrapper article .thumb-wrapper .overlay{
	background-color: #fff;
	display: block;
	height: 100%;
	filter: alpha(opacity=0);
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 100%;
	-ms-filter: "alpha(opacity=0)";
}

.article-wrapper article .text{
	float: right;
	padding: 0 0 0 20px;
	word-break: normal;
	margin-top:-3px;
	line-height: 21px;
}

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

	4.	Page Layout : Entry

===============================================================*/
/*	#entry
---------------------------------------------------------------*/
#entry .caption{
	display: block;
	font-size: 12px;
	word-break: break-all;
	width: 100%;
}

#entry .caption p{
	font-size: 12px;
	word-break: break-all;
}

/* header */

#entry header{
	height: 100%;
	/*overflow: hidden;*/
	margin: 0 0 95px 0;
	position: relative;
	zoom: 1;
}

#entry header .meta{
	float: left;
}

#entry header .meta hgroup{
	padding: 0 0 20px 0;
}

#entry header .meta h1,
#entry header .meta h2{
	letter-spacing: 3px;
}

/*#entry header .meta h2{
	font-weight: normal;
}*/


#entry header .middle{
	margin-top:-30px;
}
#entry header .middle h1{
	line-height:1em;
}
#entry header .meta .status{
	color: #f00;
}

#entry header .meta .bottom{
	top: 493px;
	height:66px;
	/*overflow: hidden;*/
	position: absolute;
	width: 100%;
	display:block;
}
#entry header .meta .bottom .fb-like{
	position:absolute;
	bottom:0px;
	margin-top:47px;
}

#entry header .meta .btn{
	margin: 15px 0 10px 0;
}

#entry header .meta .btn a{
	width: 161px;
}

#entry header .thumb-wrapper{
	float: right;
}

/* #entry-body */

#entry #entry-body{
	padding: 0 0 85px 0;
	overflow: hidden;
	zoom: 1;
	z-index: 1;
}
#entry #entry-body .right .caption{
	padding-bottom:0px;
}
#entry #entry-body .text{
	float: left;
}

#entry #entry-body .text p{
	padding-bottom: 1em;
}

#entry .left{
	clear: left;
	float: left;
}

#entry .right{
	float: right;
}

/* #installation-view */

#installation-view{
	clear: both;
	padding: 90px 0 0 0;
}

#installation-view h3{
	font-size: 17px;
	letter-spacing: 2px;
	padding: 0 0 35px 0;
}

#installation-view .thumb{
	overflow: hidden;
	padding: 0 0 19px 0;
}

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

	5.	Browser Type

===============================================================*/
/*	for win
---------------------------------------------------------------*/
.win #entry .caption{
	font-size: 11px;
}

.win #entry .caption p{
	font-size: 11px;
}

.win #installation-view h3{
	font-size: 16px;
}

.win .article-wrapper article .thumb-wrapper header h1,
.win .article-wrapper article .thumb-wrapper header h2{
	font-size: 19px!important;
}

.win #entry header .meta h1,
.win #entry header .meta h2{
	font-size: 19px!important;
}

/*	for mac
---------------------------------------------------------------*/

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

	6.	Language

===============================================================*/
/*	.en
---------------------------------------------------------------*/
.en .article-wrapper article .thumb-wrapper header h1,
.en .article-wrapper article .thumb-wrapper header h2{
	font-size: 22px;
}

.en #entry header .meta h1,
.en #entry header .meta h2{
	font-size: 22px;
}

/*	.ja
---------------------------------------------------------------*/
.ja .article-wrapper article .thumb-wrapper header h1,
.ja .article-wrapper article .thumb-wrapper header h2{
	font-size: 19px;
}

.ja .article-wrapper article .thumb-wrapper header h2.bld{
	font-weight: normal;
}

.ja #entry header .meta h1,
.ja #entry header .meta h2{
	font-size: 19px;
}

.ja #entry header .meta h2.bld{
	font-weight: normal;
}



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

	7.	media query

===============================================================*/
/*	for 480
---------------------------------------------------------------*/
@media screen and (max-width: 480px){

}

/*	for 1024
---------------------------------------------------------------*/
@media screen and (max-width: 1600px){


	.page-title{
		margin-bottom: 47px;
		width: 121px;
	}
	.article-wrapper article {
		height: 265px;
	}

	.article-wrapper article .thumb-wrapper{
		height: 265px;
		width: 729px;
	}

	.article-wrapper article .thumb-wrapper .thumb{
		height: 265px;
		width: 314px;
	}

	.article-wrapper article .thumb-wrapper .view,
	.article-wrapper article .thumb-wrapper header{
		width: 415px;
	}

	.article-wrapper article .thumb-wrapper a{
		background-position: 694px 19px;
	}

	.article-wrapper article .text{
		width: 230px;
	}

	/* #entry-archive */

	#entry header .meta{
		width: 314px;
	}

	#entry header .thumb-wrapper .thumb{
		height: 559px;
		width: 647px;
	}

	#entry .box{
		width: 480px;
	}

	#installation-view .thumb{
		height: 320px;
		width: 480px;
	}
	#entry header .meta .bottom{
		top: 493px;
		height:66px;
		/*overflow: hidden;*/
		position: absolute;
		width: 100%;
		display:block;
	}
	#entry header .meta .bottom .fb-like{
		position:absolute;
		bottom:0px;
		margin-top:47px;
	}
	#entry header .meta .btn{
		margin: 15px 0 10px 0;
	}
	#entry #entry-body .right .caption{
		padding-bottom:0px;
	}

	#side .inner{
		width: 55px;
	}
	#side .inner dl{
		margin-left:0px;
	}
	#entry header .middle{
		margin-top:-30px;
	}
	#entry header .middle h1{
		line-height:1em;
	}

}

/*	for 1280
---------------------------------------------------------------*/
@media screen and (min-width: 1601px){

	.page-title{
		margin-bottom: 47px;
		width: 121px;
	}
	.article-wrapper article {
		height: 349px;
	}

	.article-wrapper article .thumb-wrapper{
		height: 349px;
		width: 960px;
	}

	.article-wrapper article .thumb-wrapper .thumb{
		height: 349px;
		width: 414px;
	}

	.article-wrapper article .thumb-wrapper .view,
	.article-wrapper article .thumb-wrapper header{
		width: 546px;
	}

	.article-wrapper article .thumb-wrapper a{
		background-position: 924px 19px;
	}

	.article-wrapper article .text{
		width: 300px;
	}

	/* #entry-archive */

	#entry header .meta{
		width: 448px;
	}
	#entry header .thumb-wrapper .thumb{
		height: 700px;
		width: 810px;
	}

	#entry .box{
		width: 630px;
	}

	#installation-view .thumb{
		height: 420px;
		width: 630px;
	}

	#entry header .meta .bottom{
		top: 634px;
		height:66px;
		overflow: hidden;
		position: absolute;
		width: 100%;
		display:block;
	}
	#entry header .meta .bottom .fb-like{
		position:absolute;
		bottom:0px;
		margin-top:45px;
	}
	#entry #entry-body .right .caption{
		padding-bottom:20px;
	}
	#side .inner{
		width: 65px;
	}
	#side .inner dl{
		margin-left:0px;
	}
}