@charset "utf-8";

/* ==============================
PC article layout
products, works, blog
Site Name: SULK;
Date: 2018.03;
================================= */

/* bg
--------------------------------- */
/* products */
/*.products:not(#grunge) {
	background-color: #ebf0f0;
}*/
/* works */
/*.works {
	background-color: #ebf0f0;
}*/

/* archives
--------------------------------- */
#content .btn {
	margin-bottom: 64px;
}
.archive__list {
	margin-top: -24px;
	margin-bottom: 64px;
}
.archive__list article {
	font-size: 12px;
	border-bottom: 1px solid rgba(51,51,51,.15);
	margin-top: 24px;
	width: 100%;
}
@media only screen and (max-width: 479px){
	.archive__list article {
		width: 100%;
	}
}
@media only screen and (min-width: 480px) and (max-width: 959px){
	.archive__list article {
		width: calc(50% - 12px);
	}
	.archive__list article:nth-child(odd) {
		margin-right: 24px;
	}
}
@media only screen and (min-width: 960px){
	.archive__list article {
		width: calc((100% - 48px) / 3);
	}
	.archive__list article:not(:nth-child(3n)) {
		margin-right: 24px;
	}
}
.archive__list .photo {
	margin-bottom: 28px;
}
.archive__list img {
	width: 100%;
}
.archive__list .meta {
	margin-bottom: 16px;
}
.archive__list h3 {
	font-size: 16px;
	font-weight: 900;
	line-height: 1.6;
}
.archive__list h3 strong {
	font-size: 11px;
}
.archive__list .excerpt {
	margin-top: 24px;
}
.archive__list a {
	color: #333;
	display: block;
	padding-bottom: 40px;
}

/* recommend
--------------------------------- */
#recommend {
	margin-top: 48px;
	margin-bottom: 64px;
}
#recommend h3 {
	margin-bottom: 28px;
}
#recommend_list article {
	font-size: 12px;
	line-height: 1.6;
	border-bottom: 1px solid rgba(51,51,51,.15);
	margin-bottom: 24px;
}
#recommend_list .photo {
	margin-bottom: 18px;
}
#recommend_list img {
	width: 100%;
}
#recommend_list h4 {
	font-weight: 700;
	line-height: 1.6;
}
#recommend_list a {
	color: #333;
	display: block;
	padding-bottom: 24px;
}
#recommend_list article:nth-child(n + 5) {
	display: none;
}
@media only screen and (max-width: 639px){
	#recommend_list article {
		width: calc(50% - 12px);
	}
	#recommend_list article:nth-child(odd) {
		margin-right: 24px;
	}
}
@media only screen and (min-width: 640px){
	#recommend_list article {
		width: calc((100% - 72px) / 4);
	}
	#recommend_list article:not(:nth-child(4)) {
		margin-right: 24px;
	}
}

/* pager
--------------------------------- */
.pagination {
	font-size: 0;/* inline-block bugfix */
	text-align: center;
	margin-bottom: 64px;
}
.pagination .screen-reader-text {
	display: none;
}
.pagination li {
	display: inline-block;
	font-size: 14px;
	margin: 0 4px!important;
	width: 30px;
	height: 30px;
}
.page-numbers a,
.page-numbers span {
	background-color: tranceparent;
	color: #333;
	display: block;
	line-height: 28px;
	transition: background-color .5s, color .5s;
	border: 1px solid #d0d4d4;
	width: 28px;
	height: 28px;
}
.page-numbers a:hover,
.page-numbers .current {
	background-color: #333;
	color: #ebf0f0;
	display: block;
	text-decoration: none;
}

/* entry
--------------------------------- */
#entry p:not(:last-child),
#entry div:not(:last-child) {
	margin-bottom: 14px;
}
.wp-caption {}
.wp-caption-text {}
.sticky {}
.gallery-caption {}
.bypostauthor {}
.alignright {}
.alignleft {}
.aligncenter {}

/* footer
--------------------------------- */
/* moreinfo */
#moreinfo {
	border-top: 1px solid #333;
	padding: 20px 0;
}
#moreinfo dt {
	font-size: 11px;
	font-weight: 700;
	margin-bottom: 8px;
}
#moreinfo .tags {
	color: #777;
	font-size: 11px;
	line-height: 2;/*2.4*/
}
#moreinfo .tags li {
	margin-right: 16px;
}
#moreinfo .website {
	border-right: 1px solid rgba(51,51,51,.15);
	margin-right: 4px;
	padding-right: 24px;
}
#moreinfo .website a {
	color: #777;
}
#moreinfo .website {
	font-size: 12px;
}
#moreinfo .tags a,
#moreinfo .website a {
	color: #777;
}
#moreinfo .sns {
	margin-top: 4px;
}
/* footer nav */
#single__nav {
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
}
#single__nav__top {
	margin: 0 auto;
}
#single__nav__top,
#single__nav a {
	width: 60px;
	height: 60px;
}
#single__nav a {
	color: #333;
	display: block;
	line-height: 60px;
	text-align: center;
}
/* profile */
#profile .photo img {
	width: 100%;
}
#profile .txts {
	box-sizing: border-box;
	padding: 24px 0 48px;
}
#profile h3 {
	font-weight: 700;
	margin-bottom: 12px;
}

/* aside
--------------------------------- */
#bnr--products li {
	flex: 1;
	font-size: 12px;
}
#bnr--products h3 {
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 8px;
}
#bnr--products i {
	display: block;
	font-size: 20px;
	padding-bottom: 6px;
}
#bnr--products a {
	color: #333;
	display: block;
	transition: background .5s;
	padding: 40px 24px;
}
#bnr__order a {
	background-color: #d9e2ee
}
#bnr__works a {
	background-color: #edd8e2;
}
#bnr--products a:hover {
	text-decoration: none;
}
@media only screen and (max-width: 480px){
	#bnr--products .txt {
		text-align: left;
	}
	.hdn--spmin {
		display: none;
	}
}

/* grunge
--------------------------------- */
.products_label-grunge-label a {
	position: relative;
}
.products_label-grunge-label a::before {
	background: url(../img/products/ico_grunge.png) 0 0;
	background-size: 40px;
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 34px;
}