@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;
}*/

/* archive
--------------------------------- */
.archive__list {
	margin-top: -32px;
	margin-bottom: 80px;
}
.archive__list:last-child {
	margin-bottom: 160px;
}
.archive__list article {
	font-size: 13px;
	border-bottom: 1px solid rgba(51,51,51,.15);
	margin-top: 32px;
}
@media only screen and (max-width: 1279px){
	#content .archive__list article {
		width: calc(50% - 16px);
	}
	#content .archive__list article:nth-child(odd) {
		margin-right: 32px;
	}
	.plants #new .archive__list article {
		width: calc(33.333% - 21.333px);
	}
	.plants #new .archive__list article:not(:nth-child(3n)) {
		margin-right: 32px;
	}
}
@media only screen and (min-width: 1280px){
	#content .archive__list article {
		width: calc(33.333% - 21.333px);
	}
	#content .archive__list article:not(:nth-child(3n)) {
		margin-right: 32px;
	}
	.plants #new .archive__list article {
		width: calc(25% - 24px);
	}
	.plants #new .archive__list article:not(:nth-child(4n)) {
		margin-right: 32px;
	}
}
.archive__list .photo {
	margin-bottom: 32px;
}
.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: 12px;
}
.archive__list .excerpt {
	margin-top: 24px;
}
.archive__list a {
	color: #333;
	display: block;
	transition: opacity .5s;
	padding-bottom: 40px;
}
.archive__list a:hover {
	opacity: .3;
	text-decoration: none;
}

/* recommend
--------------------------------- */
#recommend {
	margin-top: 64px;
	margin-bottom: 160px;
}
#recommend h3 {
	margin-bottom: 32px;
}
#recommend_list article {
	font-size: 13px;
	border-bottom: 1px solid rgba(51,51,51,.15);
	width: calc((100% - 120px) / 6);
}
#recommend_list article:not(:last-child) {
	margin-right: 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;
	transition: opacity .5s;
	padding-bottom: 28px;
}
#recommend_list a:hover {
	opacity: .3;
	text-decoration: none;
}

/* pager
--------------------------------- */
.pagination {
	font-size: 0;/* inline-block bugfix */
	text-align: center;
	margin-bottom: 160px;
}
.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: 24px;
}
.wp-caption {}
.wp-caption-text {}
.sticky {}
.gallery-caption {}
.bypostauthor {}
.alignright {}
.alignleft {}
.aligncenter {}

/* footer
--------------------------------- */
/* moreinfo */
#moreinfo {
	align-items: center;
	display: flex;
	border-top: 1px solid #333;
	padding: 20px 0;
}
#moreinfo dt {
	font-size: 13px;
	font-weight: 700;
	border-right: 1px solid rgba(51,51,51,.15);
	margin-right: 24px;
	padding-right: 24px;
}
#moreinfo dd {
	align-items: center;
	display: flex;
}
#moreinfo .tags {
	color: #777;
	font-size: 13px;
}
#moreinfo .tags li {
	margin-right: 16px;
}
#moreinfo .website {
	border-right: 1px solid rgba(51,51,51,.15);
	margin-right: 24px;
	padding-right: 24px;
}
#moreinfo .tags a,
#moreinfo .website a {
	color: #777;
}
/* footer nav */
#single__nav {
	align-items: center;
	font-size: 10px;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
}
#single__nav a {
	color: #333;
	display: block;
	line-height: 80px;
	text-align: center;
	transition: color .5s;
}
#single__nav a:hover {
	color: #eb67a2;
}
#single__nav__top {
	font-size: 15px;
	margin: 0 auto;
}
#single__nav__top,
#single__nav__top a {
	width: 80px;
	height: 80px;
}
/* profile */
#profile .photo {
	width: 500px;
}
#profile .photo img {
	width: 100%;
}
#profile .txts {
	align-items: center;
	flex: 1;
	box-sizing: border-box;
	display: flex;
	padding: 0 64px;
}
#profile h3 {
	font-weight: 700;
	margin-bottom: 8px;
}

/* aside
--------------------------------- */
#bnr--products li {
	flex: 1;
	font-size: 14px;
}
#bnr--products h3 {
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 16px;
}
#bnr--products i {
	display: block;
	font-size: 32px;
	padding-bottom: 10px;
}
#bnr--products a {
	color: #333;
	display: block;
	transition: background .5s;
	padding: 56px 24px;
}
#bnr__order a {
	background-color: #d9e2ee;
}
#bnr__works a {
	background-color: #edd8e2;
}
#bnr--products a:hover {
	background-color: #eb67a2;
	color: #ebf0f0;
	text-decoration: 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;
}