@charset utf-8;
/* ULELU PORTFOLIO デフォルトスタイル */

#portfolio,
.item {
	-webkit-transition-duration: 0.7s;
    -moz-transition-duration: 0.7s;
    -ms-transition-duration: 0.7s;
    -o-transition-duration: 0.7s;
    transition-duration: 0.7s;
}

#portfolio {
	-webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width;
}

#portfolio {
	display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px;
}

#portfolio .item {
	width: calc((100% - 60px) / 3);
	padding: 10px;
	margin: 10px;
	background: #eee;;
	-webkit-border-radius: 5px;
   	-moz-border-radius: 5px;
    border-radius: 5px;
  	box-sizing: border-box;
	-webkit-transition-property: left, right, top;
    -moz-transition-property: left, right, top;
    -ms-transition-property: left, right, top;
    -o-transition-property: left, right, top;
    transition-property: left, right, top;
}

/* in item */
#portfolio .item img {
	width:100% !important;
	height:auto;
}

	#portfolio .item .img-wrap {
		display:block;
		margin-bottom:8px;
	}

#portfolio .item h4 {
	margin-bottom:4px;
	padding:0;
}

#portfolio .item .meta {
	font-size:12px;
	margin-bottom:4px;
	padding-bottom:/*10px*/ 6px;
	}
	#portfolio .item .meta .post-date{
		font-style:italic;
	}
	#portfolio .item .meta span.category-name {
		color:#F60;
	}

#portfolio .item .button { margin-top:8px; }

a.link-button {
	display: inline-block;
	background: #E2E2E2;
	color: #494B4B;
	text-shadow: 1px 1px 0 white;
	border: 1px solid #9D9D9D;
	padding: 6px 12px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px; 
	border-radius: 15px;
	-webkit-box-shadow: inset 0px 1px 0px #f5f5f5;
	-moz-box-shadow: inset 0px 1px 0px #f5f5f5; 
	box-shadow: inset 0px 1px 0px #f5f5f5;
	background: -moz-linear-gradient(top,  #e8e8e8 0%, #d1d1d1 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(100%,#d1d1d1)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #e8e8e8 0%,#d1d1d1 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #e8e8e8 0%,#d1d1d1 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #e8e8e8 0%,#d1d1d1 100%); /* IE10+ */
	background: linear-gradient(top,  #e8e8e8 0%,#d1d1d1 100%); /* W3C */
}

a.link-button:hover { color: #6AB3B2; text-decoration: none; }

/* category */
.portfolio-cat { }
.portfolio-cat a {
	display:inline-block;
	*display:inline;
	zoom:1;
	background:#656464;
	padding:5px 8px;
	border-radius:3px;
	text-decoration:none;
	color:#fff;
	margin:0 3px 4px 0;
	font-size:11px;
	line-height:1.5em;
	vertical-align:top;
	text-transform:uppercase;
	font-size:10px;
	text-shadow:none;
	}
.portfolio-cat a:hover { background:/*#fbc04e*/#6AB3B2; }

.noresult {
	text-align:center;
	font-size:2em;
	font-weight:700;
	margin-top:30px;
}

/** pagination */
 nav.portfolio-pagination{text-align:center}
 nav.portfolio-pagination ul{display:inline-block;white-space:nowrap;clear:both;border:1px solid #dfdbdf;border-right:0;margin:1px}
 nav.portfolio-pagination ul li{border-right:1px solid #dfdbdf;padding:0;margin:0;float:left;display:inline;overflow:hidden}
 nav.portfolio-pagination ul li a,
 nav.portfolio-pagination ul li span{margin:0;text-decoration:none;padding:0;line-height:1em;font-size:1em;font-weight:normal;padding:.5em;min-width:1em;display:block}
 nav.portfolio-pagination ul li span.current,
 nav.portfolio-pagination ul li a:hover,
 nav.portfolio-pagination ul li a:focus{background:#f7f6f7;color:#978a97}

@media only screen and ( max-width: 767px ) {
	#portfolio {
		margin-left: 0;
		margin-right: 0;
	}

	#portfolio .item {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
}