/******************************************
	Theme Name:wddgallery
******************************************/
/******************************************
common parts
******************************************/
.logo img{
	height: 20px;
	width: auto;
}
@media screen and (max-width:768px){
	.logo img{
		height: 18px;
	}
}
/*wp-pagenavi*/
.wp-pagenavi{
	text-align: center;
}
.wp-pagenavi span,
.wp-pagenavi a{
	background: #fff;
	border:2px solid #333;
	display: inline-block;
	font-weight: bold;
	margin: 0 5px;
	padding: 5px 12px;
	transition: .5s;
}
@media screen and (max-width:768px){
	.wp-pagenavi span,
	.wp-pagenavi a{
		margin-top: 1em;
	}
}
.wp-pagenavi span,
.wp-pagenavi a:hover{
	background: #333;
	color: #fff;
}
.wp-pagenavi .extend{
	display: none;
}
@media screen and (max-width:768px){
	.wp-pagenavi .pages{
		display: none;
	}
}
/*breadcrumbs*/
.breadcrumbs{
	color: #999;
	font-size: .75em;
}
/*nav*/
.cat-nav-wrap{
	position: sticky;
	top: 0;
	width: 100%;
	z-index: 99;
}
.cat-nav-wrap.fixed{
	background: #fff;
}
.cat-nav{
	border-bottom: 2px solid #222;
	padding: 0 1em;
	position: relative;
	z-index: 9998;
}
.cat-nav__menu{
	margin-right: 20px;
	padding: 20px 0;
}
.cat-nav__option{
	margin: 0 0 0 auto;
}
.cat-nav__menu__link{
	font-weight: 700;
}
.ga-nav__option__child__item__link:hover,
.cat-nav__option__child__item__link:hover{
	cursor: pointer;
}
.searchform{
	background: #333;
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	transition: .5s;
	visibility: hidden;
	width: 100%;
}
.searchform.active{
	opacity: 1;
	visibility: visible;
}
.searchform__text{
	background: none;
	border:none;
	color: #fff;
	display: block;
	font-size: 18px;
	height: 100%;
	padding: 10px;
	position: absolute;
	width: 100%;
}
.searchform__text:focus{
	outline: none;
}
.searchform__close{
	color: #fff;
	font-size: 24px;
	position: absolute;
	right: 10px;
	top: 14px;
}
.searchform__close:hover{
	cursor: pointer;
}
.cat-nav-menu{
	margin-right: 30px;
	padding: 20px 0;
}
.cat-nav-menu__title{
	cursor: pointer;
	font-weight: 700;
}
.cat-nav-menu:not(:first-child) .cat-nav-menu__title:after{
	content: '\f107';
	font-family: "Font Awesome 5 Free";
	margin-left: 5px;
}
.cat-nav-menu__title--top:after{
	content: none;
}
.cat-nav-menu__child{
	background: #222;
	left: 0;
	opacity: 0;
	padding: 40px;
	pointer-events: none;
	position: absolute;
	top: 100%;
	transition: .3s ease;
	visibility: hidden;
	width: 100%;
}
.cat-nav-menu:hover .cat-nav-menu__child{
	opacity: 1;
	pointer-events: all;
	top: 100%;
	visibility: visible;
}
.cat-nav-menu__child__item{
	margin-bottom: 20px;
	width: 25%;
}
.cat-nav-menu__child__item__link{
	color: #fff;
	font-size: 14px;
	font-weight: 700;
}
.ga-nav__option{
	margin:0 0 0 auto;
}
.ga-nav__option__child__item{
	margin-left: 20px;
}
/*post-list*/
.post-list{
	content-visibility: auto;
	contain-intrinsic-size: 320px;
}
.post-item{
	background: #fff;
	margin-bottom: 40px;
	width: 360px;
}
@media screen and (max-width:1200px){
	.post-item{
		width: 32%;
	}
}
@media screen and (max-width:430px){
	.post-item{
		margin: 0 auto 40px;
		width: 320px;
	}
}
.post-img{
	position: relative;
}
.post-img img{
	display: block;
	height: auto;
	width: 100%;
}
.post-hover{
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	transition: .5s ease;
	visibility: hidden;
	width: 100%;
}
@media screen and (max-width:768px){
	.post-hover{
		bottom: 0;
		height: 25%;
		opacity: 1;
		top: auto;
		visibility: visible;
	}
}
.post-img:hover .post-hover{
	opacity: 1;
	visibility: visible;
}
.post-bg-link{
	background: rgba(0,0,0,0.8);
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
.post-icons{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
}
.post-icon{
	margin: 0 1em;
	transform: translateY(60px);
	transition: .5s ease;
}
@media screen and (max-width:768px){
	.post-icon{
		transform: translateY(0);
	}
}
.post-icon:nth-child(2){
	transition-delay: .1s;
}
.post-img:hover .post-icon{
	transform: translateY(0);
}
.post-icon img{
	height: 60px;
	width: auto;
}
@media screen and (max-width:768px){
	.post-icon img{
		height: 40px;
	}
}
.post-cnt{
	padding: 1em;
}
.post-title{
	font-size: 0.875em;
}
@media screen and (min-width:769px){
	.post-title{
		max-height: 45px;
		overflow: hidden;
	}
}
.post-url{
	color: #999;
	font-size: .625em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#topcontrol{
	background: #222;
	color: #fff;
	padding: .6em 1em;
}
@media screen and (max-width:768px){
	#topcontrol{
		bottom: 20px!important;
		right: 20px!important;
	}
}
/******************************************
header
******************************************/
.header{
	padding: 2em;
}
.header-sns-item{
	margin-left: 1em;
}
.header_site_link{
	font-weight:700;
}
.header-sns-item .active{
	color:#999;
}
.tagline{
	font-size:11px;
	font-weight:400;
}
@media screen and (max-width:768px){
	.tagline{
		font-size:10px;
	}
}
/******************************************
sp-menu
******************************************/
.sp-menu {
	position:fixed;
	top: 20px;
	right: 20px;
	width: 30px;
	height: 25px;
	margin: 0 auto;
	cursor: pointer;
	transition: .5s;
	z-index: 99;
}
.sp-menu .bar {
	display: inline-block;
	width: 30px;
	height: 2px;
	background-color: #333;
	position: absolute;
	left: 0;
	transition: .25s ease-in-out;
}
#bar01 {top: 0;}
#bar02 {top: 10px;}
#bar03 {top: 20px;}
.active #bar01 {
	top: 10px;
	transform: rotate(45deg);
}
.active #bar02 {
	width: 0;
}
.active #bar03 {
	top: 10px;
	transform: rotate(135deg);
}
/******************************************
drawer
******************************************/
.drawer{
	height: 100%;
	left: 100%;
	position: fixed;
	top: 0;
	transition: .5s ease;
	width: 100%;
	z-index: 98;
}
.drawer.active{
	left: 0;
}
.drawer-bg{
	background: rgba(0,0,0,0.8);
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
.drawer-body{
	background: #fff;
	height: 100%;
	left: 10%;
	overflow-y: scroll;
	padding: 4em 1em 1em;
	position: absolute;
	width: 90%;
}
.drawer-sns{
	font-size: 1.5em;
}
.drawer-form{
	position: relative;
}
.drawer-form input[type="text"]{
	border: 2px solid #222;
	padding: 1em;
	width: 100%;
}
.drawer-form-submit{
	height: 100%;
	position: absolute;
	right: 0;
	top: 0;
	width: 15%;
}
.drawer-form input[type="submit"]{
	background: none;
	left: 50%;
	padding: 0!important;
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%)
}
.drawer-tabnav-item{
	border: 2px solid #222;
	margin: 0 5% .5em 0;
	width: 30%;
}
.drawer-tabnav-item a{
	display: block;
	font-weight: bold;
	padding: .5em .2em;
}
.drawer-tabnav-item:nth-child(3n){
	margin-right: 0;
}
.drawer-tabnav-item a.active{
	background: #222;
	color: #fff;
}
.drawer-tabcnt-item{
	display: none;
}
.drawer-tabcnt-item.active{
	display: block;
}
.drawer-tabcnt-item-title{
	border-bottom: 2px solid #222;
	font-size: 1.5em;
	padding-bottom: .5em;
}
.drawer-cat-item a{
	font-size: 1.2em;
	font-weight: bold;
	display: inline-block;
	margin: 0 1em 1em 0;
}
/******************************************
footer
******************************************/
.footer{
	background: #fff;
	padding: 80px 0;
}
@media screen and (max-width:768px){
	.footer{
		background: #fff;
		padding: 40px 0;
	}
}
.footer-sns-item{
	margin:0 20px;
}
@media screen and (max-width:768px){
	.footer-sns-item{
		font-size: 1.5em;
	}
	.footer-sns-item:first-child{
		margin-left: 0;
	}
}
.footer-menu-item{
	margin:0 20px;
}
.footer_tagline,
.copyright{
	color: #999;
	font-size:12px;
}
/******************************************
contents
******************************************/
.contents{
	margin:0 auto;
	position: relative;
	width:1620px;
}
@media screen and (max-width:1600px){
	.contents{
		width:1200px;
	}
}
@media screen and (max-width:1200px){
	.contents{
		padding-top: 0;
		width:90%;
	}
}
@media screen and (max-width:768px){
	.contents{
		xwidth:90%;
	}
}
.contents-main{
	width: 75.2%;
}
@media screen and (max-width:768px){
	.contents-main{
		width: 100%;
	}
}
.post-list-title{
	border-bottom: 2px solid #222;
	padding-bottom: .5em;
	margin-bottom: 2em;
}
/******************************************
sidebar
******************************************/
.contents-side{
	position: relative;
	width: 20.8%;
}
.widget:nth-child(n+2){
	margin-top: 4em;
}
.widget h5{
	border-bottom: 2px solid #222;
	margin-bottom: 1em;
	padding-bottom: .5em;
}
.widget-cat-item a{
	background: #fff;
	border-radius: 4px;
	display: block;
	font-size: .875em;
	font-weight: bold;
	margin: 0 .5em .5em 0;
	padding: 0 .5em;
}
.side_fixed{
	position:sticky;
	top:90px;
}
/****************************************
entry-content
*****************************************/
.entry-content{
}
/*block*/
.entry-content address,
.entry-content ol,
.entry-content dl,
.entry-content ul,
.entry-content p,
.entry-content table,
.entry-content blockquote,
.entry-content pre{
	margin-bottom: 2em;
}/*block end*/

.entry-content a{
	color: #999;
	text-decoration: underline;
}
.entry-content a:hover{
	text-decoration: none;
}
.entry-content address{
	background: #f1f1f1;
	padding: 20px;
}
.entry-content blockquote{
	background: #f1f1f1;
	font-style: italic;
	padding: 20px;
}
.entry-content blockquote p:last-child{
	margin-bottom: 0;
}
.entry-content code{
	background: #f1f1f1;
	font-style: italic;
}
.entry-content em{
	background: #f1f1f1;
	font-style: italic;
}
.entry-content pre{
	background: #222;
	color: #fff;
	font-size: .875em;
	line-height: 1.4;
	overflow:scroll;
	padding: 2em;
}
.entry-content ul li{
	list-style:disc inside;
}
.entry-content ol li{
	list-style:decimal inside;
}
.entry-content ul ol li{
	list-style:decimal inside;
}
.entry-content ol ul li{
	list-style:disc inside;
}
.entry-content li{
	margin:0 0 1em 1em;
}
.entry-content li ul,
.entry-content li ol{
	margin-top: 1em;
}
.entry-content dt{
	font-weight: bold;
}
.entry-content dd{
	margin-bottom: 2em;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6{
	line-height: 1.2;
	margin:2em 0 1em;
}
.entry-content h1{
	font-size: 2.25em;
}
.entry-content h2{
	font-size: 1.875em;
}
.entry-content h3{
	font-size: 1.5em;
}
.entry-content h4{
	font-size: 1.125em;
}
.entry-content h5{
}
.entry-content h6{
}
/*table*/
.entry-content table{
	border-left: 1px solid #eee;
	border-top: 1px solid #eee;
	font-size: 14px;
	width: 100%;
}
.entry-content th,
.entry-content td{
	border-bottom: 1px solid #eee;	
	border-right: 1px solid #eee;
	padding: 1em;
	vertical-align: top;
}
.entry-content th{
	background: #f9f9f9;
	font-weight: bold;
	text-align: left;
}/*table end*/
/*inline*/
.entry-content strong{
	display: inline-block;
	position: relative;
}

.entry-content small{
	font-size: 80%;
}
.entry-content img{
	border: 1px solid #eee;
	height: auto;
	max-width: 100%;
}
.entry-content iframe{
	max-width: 100%;
}
.aligncenter{
	text-align: center;
}
.alignleft{
	float: left;
	margin-right: 20px;
}
.alignright{
	float: right;
	margin-left: 20px;
}
.wp-caption{
	max-width: 100%;
}
.wp-caption-text{
	color: #666;
	font-size: 12px;
	font-style: italic;
}
/******************************************
page
******************************************/

/******************************************
contact
******************************************/
@media screen and (min-width:769px){
	.post-8621 .entry-content{
		margin: 2em auto 0;
		width: 50%;
	}
}
.page input[type="text"],
.page input[type="email"],
.page input[type="tel"],
.page textarea{
	padding: 1em;
	width: 100%;
}
.page .entry-content input[type="submit"]{
	background: #222;
	color: #fff;
	font-weight: bold;
	padding: .5em 2em;
}
/******************************************
single
******************************************/
.single-cnt{
	xbackground: #fff;
	xpadding: 2em;
}
@media screen and (min-width:769px){
	.single-cnt{
		xpadding:0;
	}
}
.single-header{
	border-bottom: 2px solid #222;
	padding: 1em 0;
}
.single-title{
	font-size: 1.5em;
}
.single-time{
	font-size: .875em;
}
.tabnav-item a{
	border: 2px solid #222;
	xborder-bottom: none;
	display: block;
	font-weight: bold;
	margin-right: .5em;
	padding: .5em 1em;
}
.tabnav-item a.active,
.tabnav-item a:hover{
	background: #222;
	color: #fff;
}
.tabcnt-item{
	display: none;
	text-align: center;
}
.tabcnt-item.active{
	display: block;
}
.tabcnt-item a:hover,
.tabcnt-item a:hover img{
	opacity: 1;
}
.tabcnt-item img{
	border: 1px solid #eee;
}
.single-share{
	border: 2px dashed #222;
	padding: 2em 0;
}
.single-share-item{
	margin: 0 2em;
}
@media screen and (max-width:768px){
	.single-share-item{
		margin: 0 1em;
	}
}
.single-share-item img{
	height: 30px;
	width: auto;
}
@media screen and (max-width:768px){
	.single-share-item img{
		height: 20px;
	}
}
.single-pager-item a{
	border: 2px solid #222;
	display: block;
	font-weight: bold;
	padding: .5em 1em;
}
.single-pager-item a:hover{
	background: #222;
	color: #fff;
	opacity: 1;
}
.single-info{
	border-bottom: 2px solid #222;
	border-top: 2px solid #222;
	font-size: .875em;
	width: 100%;
}
@media screen and (max-width:768px){
	.single-info{
		display: block;
	}
	.single-info tbody,
	.single-info tr{
		display: block;
	}
}
.single-info tr{
	border-bottom: 1px dashed #222;
}
.single-info tr:last-child{
	border: none;
}
.single-info th,
.single-info td{
	padding: 2em;
}
@media screen and (max-width:768px){
	.single-info th,
	.single-info td{
		display: block;
	}
}
.single-info th{
	font-weight: bold;
	text-align: left;
	width: 20%;
}
@media screen and (max-width:768px){
	.single-info th{
		padding-bottom: 0;
		width: 100%;
	}
}
.single-info .url{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%;
}
.single-info-cat a{
	border: 2px solid #222;
	border-radius: 4px;
	display: block;
	font-weight: bold;
	margin: 0 .5em .5em 0;
	padding: 0 .5em;
}
.single-info-color a{
	border: 1px solid #ccc;
	border-radius: 99em;
	display: block;
	height: 20px;
	margin: 0 1em 1em 0;
	text-indent: -9999px;
	width: 20px;
}
.single-info-color a.colorful{
	text-indent: inherit;
}
.single-info-color a.colorful img{
	height: 20px;
	width: auto;
}
.related-title{
	border-bottom: 2px solid #222;
	padding-bottom: 1em;
}
.related .post-item{
	width:32%;
}
@media screen and (max-width:430px){
	.related .post-item{
		width:320px;
	}
}
/******************************************
contact
******************************************/