@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Questrial|Coda:800|Stoke:400|Kameron:400,700|Quattrocento+Sans:400,700);
/*
'Kameron'
*/
/* CSS Document */
/*Reset CSS*/
html{color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;}
q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}legend{color:#000;}
body{font:13px/1.231 arial,helvetica,clean,sans-serif;}
table{font-size:inherit;}pre,code,kbd,samp,tt{font-family:monospace;font-size:108%;line-height:100%;}
:focus,:link,:visited{outline:none;}h1,h2,h3,h4,h5,h6,strong{font-weight:bold;}
/*clearfix*/
.clearfix:after{display:block;height:0;clear:both;visibility:hidden;content:".";line-height:0;font-size: 0;}
.clearfix{display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}.clearfix {display: block;}
/* End hide from IE-mac */
img{vertical-align:bottom; line-height:0;}
fieldset,img{border:0;}q:before,q:after {content:'';}abbr,acronym { border:0;}
/*accessibility
--------------------------------------------------------------------------------------*/
.clear{clear:both;}
.accessibility{display:none;}
/*genelar
--------------------------------------------------------------------------------------*/
.left{float:left;}.right{float:right;}img.mdl{vertical-align:middle}img.btm{vertical-align:baseline;}img.top{vertical-align:top;}img.block{display:block;}
.center{text-align:center;margin-right:auto; margin-left:auto;}.txtleft{text-align:left;}.txtright{text-align:right;}
/*-------------------------------------------------------------------------------------------------*/
/*Basic
--------------------------------------------------------------------------------------*/
html{font-size:62.5%;}
body{color:#333333;line-height:1.8;}
a:link,a:focus,a:visited{
	color:#83765f;font-weight:normal;outline:none;text-decoration:none;

	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;

	font-weight:bold;
}
a:hover{color:#ccc;
text-shadow:0 0 1px #ccc;
}
li{ list-style-position:outside;}
/*fonts--------------------------------------------------*/
body{
font-size:120%;
color:#333;
}
.mincho{
font-family: "ヒラギノ明朝 Pro W3","HGP明朝E","ＭＳ Ｐ明朝", "細明朝体";font-style:normal;
}
.arial{font-family:Arial, Helvetica, sans-serif;}
.small{font-size:0.8em;}

pre,code{
	font-size:1em;
	font-family:Arial, Helvetica, sans-serif;
	line-height:1.4;
	color:#666;
}
/*Layouts--------------------------------------------------*/
.Width{
	width:97%;
	margin:0 auto;
}
html{
	background:#000;
}
body{
	overflow: auto;
	color:#e5d7bd;
}
#page_wrapper{
	padding-top:2.5em;
}
#header{
}
#content_area{
}
#content_wrapper{
}
#content{
/*width 765px left-margin 30px = 735px*/
	z-index:9;
}
.marker{
	background: #D3ECD2;
	padding:0.2em 0.5em;
	margin:0 0.2em;
	color:#000;
}
/*===============================================
footer
===============================================*/

#footer{
}
#GotoTop{
	text-align:center;

	width:100%;
}
#GotoTop a{
	font-family:'Kameron',Tahoma, Geneva, sans-serif;
	font-size:2em;
	display:block;
	background:rgba(255,0,0,0.8);
	width:100%;
	color:#fff;
}

/*===============================================
header
===============================================*/
#header{
	padding:1em 0;

	border-bottom:1px solid #f00;
	width:100%;


	-moz-box-shadow:0 0 5px #f00;
	-webkit-box-shadow:0 0 5px #f00;
	-o-box-shadow:0 0 5px #f00;
	box-shadow:0 0 5px #f00;


	background-color:rgba(0,0,0,0.9);

}
#header #logo{
	text-align:center;
}
#header .desc{

	font-family:'Quattrocento Sans',Arial, Helvetica, sans-serif;
	font-weight:400;
	text-align:center;
}
#sns{
	padding-top:5px;
	position:absolute;
	top:0;
	right:0;
	width:100%;
	background:#e5d7bd;

	border-bottom:1px solid #f00;

}
#sns ul{
	float:right;
}

#sns .item{
	float:left;
}

#sns #icon_facebook{
	margin-left:-30px;
}
#sns #icon_google{
	margin-left:10px;
}
#sns #icon_hatena{
	margin-left:-20px;
}




#sns_links{
	position:fixed;
	padding:5px 5px 0;
	right:0;

	background:rgba(255,255,255,0.6);
	opacity:0.7;

	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;

}

#sns_links:hover{
	opacity:1.0;
}


#sns_links .item{
	margin-bottom:5px;
}
/*===============================================
header
===============================================*/
.works_list{
	margin:1em auto 2em;
}
.works_list .list{
	margin:0 auto;

}
.works_list .item{
	padding:10px;

	border:1px solid #f00;
	-moz-box-shadow:0 0 5px #f00;
	-webkit-box-shadow:0 0 5px #f00;
	-o-box-shadow:0 0 5px #f00;
	box-shadow:0 0 5px #f00;
	margin-bottom: 10px;
}

.works_list .item .image{
	float: left;
	max-width:362px;
	height:204px;
	overflow:hidden;
	background:#f00;


}
.works_list .item .image img{
	border:2px solid #f00;
}
.works_list .item .data{
	position:relative;
	overflow:hidden;
	margin-left:377px;
	_background-color:rgba(255,255,255,0.1);
}
.works_list .item .title{
	font-family:'Kameron', "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:1.4em;
	text-shadow:0 0 1px #e5d7bd;
}

.works_list .item .coredata{
}
.works_list .item .date{
}

.works_list .item .explain{
	margin-bottom:0.2em;
	text-transform:uppercase;

}
.works_list .item .explain span{
	padding:0.2em 0.8em;
	background: #e5d7bd;
	color:#3d2e13;

	border-radius:8px;
	font-weight:bold;

	font-family:"Questrial";

	-moz-box-shadow:0 0 5px #e5d7bd;
	-webkit-box-shadow:0 0 5px #e5d7bd ;
	-o-box-shadow:0 0 5px #e5d7bd ;
	box-shadow:0 0 5px #e5d7bd ;

}
.works_list .credit{
	width:100%;
}
.works_list .credit .co_title{
	color:#a74f5d;
	float:left;
	margin-right:0.4em;

}
.works_list .credit .co_title:after{
	content:":";
	margin-left:0.4em;
}
.works_list .credit .c_list{
	float:left;

	text-transform:uppercase;
}
.works_list .credit .c_list li{
	float:left;
	text-transform:uppercase;
}
.works_list .credit li:after{
	content:"/";
	margin-left:0.4em;
	margin-right:0.4em;
}
.works_list .credit li:last-child:after{
	content:none;
}

.works_list .date{
	float:left;

}

.share{
	margin-top:30px;;
}
.share a{
	font-family:Tahoma, Geneva, sans-serif;
	background:#83765f;
	padding:0.2em 0.8em;
	border-radius:5px;
	color:#eae3d5;
	vertical-align:middle;
}
.share a:hover{
	background:#f00;
	color:#fff;
}
.link{
	text-align:right;
}
a.box{
	white-space:nowrap;
	margin-right:0.8em;
	padding:0.2em 1em;
	border:1px solid #83765f;
}
a.box:hover{
	background:#83765f;
}