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

/*固定設定*/
body {
	margin: 0px;
	font-size:12px;
	background-color: #eaeaea;
	font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",
				"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
	}

/*履歴ページ用の背景色*/
body.body-rireki{
	background-color: #2f3337;
	}
/*--履歴ページ用の背景色--*/


/*目立たないリンクの設定*/
a:link {
	color: #a1a9b3;
	}
a:visited {
	color: #a1a9b3;
	}
a:hover {
	color: #a1a9b3;
	}
a:active {
	color: #a1a9b3;
	}
/*目立たないリンクの設定*/

/*目立つリンク：黒背景用*/
a:link.linkbgb { 
	background-color: #ffffff;
	color: #000000; }
a:visited.linkbgb {
	background-color: #ffffff;
	color: #000000; }
a:hover.linkbgb {
	background-color: #000000;
	color: #ffffff; }
a:active.linkbgb {
	color: #d2442e; }
/*--目立つリンク終了：黒背景用--*/

/*目立つリンク：白背景用*/
a:link.link { 
	background-color: #000000;
	color: #ffffff; }
a:visited.link {
	background-color: #000000;
	color: #ffffff; }
a:hover.link {
	background-color: #eaeaea;
	color: #000000; }
a:active.link {
	color: #d2442e; }
/*目立つリンク終了：白背景用*/


/*区切り*/
.kugiri{
	background-color: #878787;
	border: 0px;
	width: 700px;
	height: 5px;
	margin: 0px 0px 10px; }
/*--区切り--*/


/*角丸*/
.border-radius {
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	}
/*--角丸--*/

/*背景色のある一行*/
p.title {
	color: #FFFFFF;
	background-color: #808080;
	width: 700px;
	}
/*--背景色のある文字--*/

/*右寄せ*/
p.migiyose {
	text-align: right;
	}
/*--右寄せ--*/

/*回り込みを解除*/
.clearLeft { 
	clear: left; 
	}
/*--回り込みを解除--*/


/*--全体の固定設定--*/


/*////////////////////////////////////////////////////////////////////////////////////////////*/


/*インデックスラッパー*/
div.index-wrapper {
	position: relative;
	width: 700px;
	margin: 0px auto 0px;
	text-align: center;
	}
/*--インデックスラッパー--*/

/*インナーラッパー*/
div.index-wrapper {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	}
/*--インナーラッパー--*/

	/*インデックスロゴ*/
		.index-wrapper img {
		margin-bottom: 10px;
		}
	/*--インデックスロゴ--*/

/*////////////////////////////////////////////////////////////////////////////////////////////*/


/*メニューバーラッパー*/
div.menubar-wrapper {
	background-color: #000000;
	width: 100%;
	height: 40px;
	margin: 0px auto 0px;
	}	
/*--メニューバーラッパー--*/
	
	/*メニューバー*/
	div.menubar {
		width: 700px;
		height: 40px;
		margin: 0px auto 0px;
		}	
	/*--メニューバー--*/

/*////////////////////////////////////////////////////////////////////////////////////////////*/

	/*コンテンツラッパー*/
	div.contents-wrapper {
		width: 700px;
		margin: 80px auto 0px;
		}	
	/*--コンテンツラッパー--*/

/*//////////////////////////////////////////*/

		/*上*/
		.top div {
			width: 700px;
			height: 250px;
			margin: 0px auto 2px;
			}
			
			
			/*上のフィルター*/
			.top figure{ /*文字エリアの親要素*/
				position: relative;
				overflow: hidden;
				width: 700px;
				height: 250px;
				text-align: left;
				margin: 0px 0px 2px 0px;
				}
				
				.top * {
					-webkit-box-sizing: border-box;
					box-sizing: border-box;
					-webkit-transition: all 0.35s ease;
					transition: all 0.35s ease;
					}
					
				.top figcaption{ /*文字エリア*/
					position: absolute;
					top: calc(77%); /*上から77%の位置から始まる*/
					width: 700px;
					height: 250px;
					padding: 10px 10px;
					background-color: rgba(46, 50, 54, 0.7);
					}
					
				.top h3{
					font-weight: 700;
					font-size: 18px;
					color: #ffffff;
					margin: 0px;
					}
					
				p.top {
					margin: 0px;
					line-height: 0.5em;
					color: #ffffff;
					}
					
				p.figcap-p{
					margin: 30px 0px 20px 0px;
					line-height: 1.2em;
					color: #ffffff;
					}
					
				.top:hover figcaption,
				.top.hover figcaption {
				  top: 0px;
					}
					
				/*--上のフィルター--*/
		/*--上--*/
		
/*//////////////////////////////////////////*/
		
		/*コンテンツラッパー左右*/
		div.contents-wrapper-lf {
			width: 700px;
			height: 200px;
			margin: 0px auto 2px;
			}
		/*--コンテンツラッパー左右--*/

			/*左*/
			div.left {
				float: left;
				width: 349px;
				height: 200px;
				margin: 0px 2px 0px 0px;
				}
				
			/*右*/
			div.right {
				float: left;
				width: 349px;
				height: 200px;
				margin: 0px;
				}	
			/*--右--*/
				
			/*--左--*/
			
			
			
		/*左右のフィルター*/
			.left  figure{ /*文字エリアの親要素*/
						position: relative;
						overflow: hidden;
						width: 349px;
						height: 200px;
						text-align: left;
						margin: 0px;
						}
			
			.right figure{ /*文字エリアの親要素*/
						position: relative;
						overflow: hidden;
						width: 349px;
						height: 200px;
						text-align: left;
						margin: 0px;
						}
						
				.left * {
							-webkit-box-sizing: border-box;
							box-sizing: border-box;
							-webkit-transition: all 0.35s ease;
							transition: all 0.35s ease;
							}
				
				.right * {
							-webkit-box-sizing: border-box;
							box-sizing: border-box;
							-webkit-transition: all 0.35s ease;
							transition: all 0.35s ease;
							}
						
				.left figcaption{ /*文字エリア*/
						position: absolute;
						top: calc(77%); /*上から77%の位置から始まる*/
						width: 349px;
						height: 200px;
						padding: 10px 10px;
						background-color: rgba(46, 50, 54, 0.7);
						}
						
				.right figcaption{ /*文字エリア*/
						position: absolute;
						top: calc(77%); /*上から77%の位置から始まる*/
						width: 349px;
						height: 200px;
						padding: 10px 10px;
						background-color: rgba(46, 50, 54, 0.7);
						}
						
						.left h3{
							font-weight: 700;
							font-size: 12px;
							color: #ffffff;
							margin: 0px;
							}
							
						 .right h3{
							font-weight: 700;
							font-size: 12px;
							color: #ffffff;
							margin: 0px;
							}
						
						p.left {
							margin: 0px;
							line-height: 0.5em;
							color: #ffffff;
							}
							
						p.right {
							margin: 0px;
							line-height: 0.5em;
							color: #ffffff;
							}
							
						p.figcap-lr{
							margin: 20px 0px 20px 0px;
							line-height: 1.2em;
							color: #ffffff;
							}
						
						.left:hover figcaption,
						.left.hover figcaption {
							top: 0px;
							}
							
						.right:hover figcaption,
						.right.hover figcaption {
							top: 0px;
							}
			/*--左右のフィルター--*/
			
/*//////////////////////////////////////////*/
			
			/*履歴*/
			.koushinrireki {
				border: 0px;
				width: 349px;
				height: 200px;
				margin: 0px 2px 0px 0px;
				}
				
				table.rireki {
					background-color: #2e3236;
					color: #ffffff;
					width: 349px;
					height: 200px;
					padding: 10px;
					border-collapse: separate;
					}
					
					td.rirekisel {
						padding: 0px 10px 0px 0px;
						vertical-align: top;
						}
						
					td.rirekisel-title {
						font-size: 16px;
						padding: 0px 0px 20px 0px;
						vertical-align: top;
						}
			/*--履歴--*/

/*//////////////////////////////////////////*/

		/*フッターラッパー*/
		div.footer-wrapper {
			width: 700px;
			margin: 0px auto 50px;
			}
		/*--フッターラッパー--*/
			
			/*フッター左*/
			div.footer-l {
				float: left;
				height: 30px;
				width: 30px;
				margin: auto 0px auto 25%;
				}	
			/*--フッター左--*/
			
			/*--フッター右--*/
			div.footer-r {
				float: left;
				margin: auto auto auto 10px;
				}	
			/*--フッター右--*/
	
/*//////////////////////////////////////////*/

		/*作品ページトップ中身*/
		div.contents-wrapper-works-top-inner {
			width: 700px;
			height: 100px;
			margin: 10px 0px 10px 0px;
		}
		
		.contents-wrapper-works-top-inner-img1to2 {
			margin:0px 2px 0px 0px;
			}
		/*--作品ページトップ中身--*/
		
		/*作品ページ真ん中中身*/
		div.contents-wrapper-works-middle-outer1 {
			width: 700px;
			height: 232px;
			margin: 10px 0px 0px 0px;
			}
			
		div.contents-wrapper-works-middle-outer2 {
			width: 700px;
			height: 232px;
			margin: 2px 0px 0px 0px;
			}
			
			div.contents-wrapper-works-middle-inner-ltoc {
				float: left;
				width: 232px;
				height: 232px;
				margin: 0px 2px 0px 0px;
				}
				
			div.contents-wrapper-works-middle-inner-r {
				float: left;
				width: 232px;
				height: 232px;
				margin: 0px;
				}
		/*--作品ページ真ん中中身--*/
			
			
			
		/*左右のフィルター*/
			.contents-wrapper-works-middle-inner-ltoc figure{ /*文字エリアの親要素*/
						position: relative;
						overflow: hidden;
						width: 232px;
						height: 232px;
						text-align: left;
						margin: 0px;
						}
			
			.contents-wrapper-works-middle-inner-r figure{ /*文字エリアの親要素*/
						position: relative;
						overflow: hidden;
						width: 232px;
						height: 232px;
						text-align: left;
						margin: 0px;
						}
						
				.contents-wrapper-works-middle-inner-ltoc * {
							-webkit-box-sizing: border-box;
							box-sizing: border-box;
							-webkit-transition: all 0.35s ease;
							transition: all 0.35s ease;
							}
				
				.contents-wrapper-works-middle-inner-r * {
							-webkit-box-sizing: border-box;
							box-sizing: border-box;
							-webkit-transition: all 0.35s ease;
							transition: all 0.35s ease;
							}
						
				.contents-wrapper-works-middle-inner-ltoc figcaption{ /*文字エリア*/
						position: absolute;
						top: calc(80%); /*上から77%の位置から始まる*/
						width: 232px;
						height: 232px;
						padding: 10px 10px;
						background-color: rgba(46, 50, 54, 0.7);
						}
						
				.contents-wrapper-works-middle-inner-r figcaption{ /*文字エリア*/
						position: absolute;
						top: calc(80%); /*上から77%の位置から始まる*/
						width: 232px;
						height: 232px;
						padding: 10px 10px;
						background-color: rgba(46, 50, 54, 0.7);
						}
						
						.contents-wrapper-works-middle-inner-ltoc h3{
							font-weight: 700;
							font-size: 12px;
							color: #ffffff;
							margin: 0px;
							}
							
						 .contents-wrapper-works-middle-inner-r h3{
							font-weight: 700;
							font-size: 12px;
							color: #ffffff;
							margin: 0px;
							}
						
						p.contents-wrapper-works-middle-inner-ltoc {
							margin: 0px;
							line-height: 0.5em;
							color: #ffffff;
							}
							
						p.contents-wrapper-works-middle-inner-r {
							margin: 0px;
							line-height: 0.5em;
							color: #ffffff;
							}
							
						p.figcap-works{
							margin: 20px 0px 20px 0px;
							line-height: 1.2em;
							color: #ffffff;
							}
						
						.contents-wrapper-works-middle-inner-ltoc:hover figcaption,
						.contents-wrapper-works-middle-inner-ltoc.hover figcaption {
							top: 0px;
							}
							
						.contents-wrapper-works-middle-inner-r:hover figcaption,
						.contents-wrapper-works-middle-inner-r.hover figcaption {
							top: 0px;
							}
			/*--左右のフィルター--*/


/*////////////////////*/


			/*展示履歴*/
			table.tenjirireki {
				width: 700px;
				border-collapse: separate;
			}
				
				td.tenjirirekisel-day {
					width: 100px;
					padding: 0px 10px 5px 0px;
					vertical-align: top;
					}
					
				td.tenjirirekisel {
					padding: 0px 0px 5px 0px;
					vertical-align: top;
					}
			/*--展示履歴--*/


/*////////////////////*/


				/*イラスト個別ページラッパー*/
				div.works {
					display: table;
					width: 700px;
					margin: 0px 0px 10px 0px;
					}
				/*イラスト個別ページラッパー*/
			
					/*イラスト左*/
					div.works-img {
						display: table-cell;
						width: 500px;
						}
					/*--イラスト左--*/

					/*--文章右--*/
					div.works-sen {
						display: table-cell;
						padding: 0px 0px 0px 10px;
						vertical-align: top;
						}
						
						h3.works-sen {
							font-weight: 700;
							font-size: 12px;
							margin: 0px;
							}
					/*--文章右--*/


/*//////////////////////////////////////////*/


	/*アバウトラッパー*/
	div.about-wrapper {
		display: table;
		width: 700px;
		margin: 0px;
		}
	/*アバウトラッパー*/

		/*アバウト左*/
		div.about-l {
			display: table-cell;
			vertical-align: middle;
			width: 100px;
			}	
		/*--アバウト左--*/

		/*--アバウト右--*/
		div.about-r {
			display: table-cell;
			margin-left: 10px;
			}	
		/*--アバウト右--*/
	
/*//////////////////////////////////////////*/