/***************************
 *
 * 投稿・カテゴリーページ
 * ★ページ中身用★
 *
 **************************/

@media all and (max-width: 750px) {
	/*--------------------------------
DIARYカテゴリ
---------------------------------*/
	.page .blog-ac-title {
		text-align: center;
		margin-bottom: 60px;
	}
	.blog-ac-title span {
		border-bottom: 1px solid #1a1a1a;
		color: #1a1a1a;
		font-size: 24px;
		letter-spacing: 0.15em;
		display: inline-block;
	}
	.diarys {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		grid-gap: 15px;
	}
	@keyframes fadeIn {
		0% {opacity: 0}
		100% {opacity: 1}
	}
	.diarys .diary {
		position: relative;
		margin-bottom: 15px;
		opacity: 0;
		animation: fadeIn 2s ease 1s 1 forwards;
	}
	.diarys .diary .diary-link {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 2;
	}
	.diarys .diary .diary-link:hover {
		background: rgba(255, 255, 255, 0.3);
	}
	.diarys .diary .diary-pic {
	}
	.diarys .diary .diary-content {
		padding-top: 5px;
	}
	.diarys .diary .diary-time {
		display: block;
		font-size: 11px;
		letter-spacing: 0.2em;
		line-height: 2em;
	}
	.diarys .diary .diary-title {
		line-height: 10px;
	}
	.diarys .diary .diary-title a {
		font-size: 14px;
		font-weight: 500;
		line-height: 1.43em;
		letter-spacing: 0.1em;
	}
	.nav-filter-wrap {
		overflow-x: auto;
		margin: 0 -20px;
	}
	.nav-filter-wrap::-webkit-scrollbar {
		  display: none;
		  -webkit-appearance: none;
	}
	.nav-filter {
		display: flex;
		justify-content: flex-start;

		width: max-content;
		margin-bottom: 45px;
	}
	.nav-filter > li {
		margin-right: 8px;
	}
	.nav-filter > li:first-child {
		margin-left: 20px;
	}
	.nav-filter > li > a {
		display: block;
		text-align: center;
		padding: 7.5px 15px;
		color: #1a1a1a;
		font-weight: 500;
		font-size: 11px;
		letter-spacing: 0.1em;
		line-height: 1.45em;
		border-radius: 16px;
		border: 1px solid #666666;
	}
	.nav-filter > li > a:hover,
	.nav-filter > li.active > a {
		text-decoration: none;
		background: #333333;
		color: white;
	}
	.nav-filter > li.active > a:hover {
		text-decoration: none;
		background: none;
		color: #1a1a1a;
	}
	.infscr-pager {
		border-top: 1px solid #707070;
		display: block;
		width: 100%;
		text-align: center;
		padding-top: 35px;
		margin-top: 50px;
		margin-bottom: 100px;
	}
	.infscr-pager a {
		color: #000;
		font-size: 16px;
		letter-spacing: 0.12em;
		line-height: 1.444em;
		background: none;
		border-bottom: 1px solid black;
	}
	.infscr-pager a:hover {
		border-bottom: 0px solid black;
		text-decoration: none;
	}

	/*--------------------------------
シングル
---------------------------------*/

	.post-header {
		position: relative;
	}
	.post-time {
		display: block;
		font-size: 11px;
		letter-spacing: 0.2em;
		line-height: 4.16em;
	}
	.post-title {
		font-size: 24px;
		letter-spacing: 0.15em;
		line-height: 1.42em;
	}
	.post-cat {
		display: flex;
		justify-content: flex-start;
		margin-top: 10px;
	}
	.post-cat a {
		display: block;
		margin-right: 8px;
		text-align: center;
		padding: 7.5px 15px;
		color: #1a1a1a;
		font-weight: 500;
		font-size: 11px;
		letter-spacing: 0.1em;
		line-height: 1.45em;
		border-radius: 16px;
		border: 1px solid #666666;
	}
	.post-cat a:hover {
		text-decoration: none;
		background: #333333;
		color: white;
	}
	.post-back {
		position: relative;
		text-align: center;
		border-top: 1px solid #666666;
		border-bottom: 1px solid #666666;
		margin-top: 50px;
		margin-bottom: 50px;
	}
	.post-back li {
		line-height: 2em;
	}
	.post-back li a {
		font-size: 16px;
		font-weight: 500;
		letter-spacing: 0.15em;
		display: block;
		padding: 20px 0;
	}
	.post-back .next {
		position: absolute;
		left: 0;
		top: 0;
	}
	.post-back .prev {
		position: absolute;
		right: 0;
		top: 0;
	}
	.list-entry-single {
		margin-bottom: 100px;
		padding-left: 20px;
		padding-right: 20px;
	}
	.list-entry-single .entry {
		width: 48%;
		margin-right: 4%;
	}
	.list-entry-single .entry:nth-child(2n) {
		margin-right: 0;
	}
	.list-entry-single .entry .entry-content .entry-title {
		font-size: 11px;
	}
	.post-single {
		padding-top: 20px;
	}

	/*--------------------------------
ページ送り
---------------------------------*/
	.pagenavi {
		text-align: center;
	}
	.pagenavi .box-content {
		width: auto;
	}
	ul.page-numbers {
		padding: 40px 0 100px;
		position: relative;
		text-align: center;
		border-top: 1px solid #dddddd;
	}
	ul.page-numbers > li {
		display: inline-block;
		letter-spacing: normal;
		margin: 0 10px;
		vertical-align: top;
	}
	ul.page-numbers > li > a,
	ul.page-numbers > li > span {
		text-align: center;
		display: inline-block;

		box-sizing: border-box;
		font-size: 18px;
		color: #222222;
		padding: 10px 0px 10px;
		border-bottom: 1px solid rgba(34, 34, 34, 0);
	}
	ul.page-numbers > li:first-child > a {
	}
	ul.page-numbers > li:last-child > a {
	}
	ul.page-numbers > li > a:hover {
		z-index: 2;
		text-decoration: none;
		transition: none;
	}
	ul.page-numbers .current {
		cursor: default;
		z-index: 2;
		border-bottom: 1px solid rgba(34, 34, 34, 1);
	}
	.page-numbers.next {
		display: block;
		position: absolute;
		right: 0px;
		top: 40px;
		font-size: 14px;
		color: #222222;
		width: 160px;
		line-height: 38px;
		padding: 0;
		border: 1px solid #222222;
	}
	.page-numbers.next:after {
		content: "";
		display: inline-block;
		background: url(../img/nav-next.png) center center no-repeat;
		background-size: contain;
		width: 31px;
		height: 6px;
		vertical-align: middle;
		margin-left: 25px;
	}
	.page-numbers.next:hover {
	}
	.page-numbers.prev {
		position: absolute;
		left: 0px;
		top: 40px;
		font-size: 14px;
		color: #222;
		width: 160px;
		line-height: 38px;
		padding: 0;
		border: 1px solid #222222;
	}
	.page-numbers.prev:before {
		content: "";
		display: inline-block;
		background: url(../img/nav-prev.png) center center no-repeat;
		background-size: contain;
		width: 31px;
		height: 6px;
		vertical-align: middle;
		margin-right: 25px;
	}
	.page-numbers.prev:hover {
	}

	.cat-title {
/* 		font-size: 1.75rem; */
		font-size: 19.6px;
		border-bottom: 1px solid #666666;
		text-align: center;
/* 		display: block; */
		display: inline-block;
		margin: 30px auto 80px;
		letter-spacing: 0.1em;
		padding-bottom: 5px;

/* 		width: 165px; */
	}
	.single-title {
		display: block;
		width: auto;
		border: none;
	}
	.showcase-post a {
		display: block;
		width: 100%;
		position: relative;
		/* margin-bottom: 50px; */
	}
	
	body.showcase-biz .showcase-post div {
		color: white;
	}

	.showcase-post:nth-of-type(1) a img,
	.showcase-post:nth-of-type(2) a img,
	.showcase-post:nth-of-type(3) a img {
		opacity: 1;
		transform: translate(0, 0);
		-moz-transform: translate(0, 0);
		-webkit-transform: translate(0, 0);
		-o-transform: translate(0, 0);
		-ms-transform: translate(0, 0);
	}

	.showcase-post a:hover {
		opacity: 1;
	}
	.showcase-post ul.overlay {
		width: 100%;
		height: 100%;
		position: absolute;
		background: rgba(0, 0, 0, 0.5);
		top: 0;
		left: 0;
		opacity: 0;
		-webkit-transition: opacity 0.3s linear;
		-moz-transition: opacity 0.3s linear;
		-o-transition: opacity 0.3s linear;
		transition: opacity 0.3s linear;
		filter: alpha(opacity=0);
	}
	.showcase-post ul.overlay li {
		font-size: 1.5rem;
		color: #fff;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		text-align: center;
		width: 100%;
	}
	.showcase-post ul.overlay:hover {
		opacity: 1;
		filter: alpha(opacity=100);
	}

	#arcv_wrapper {
		background: #fafafa;
		margin: 78px 0 6rem;
	}
	#arcv_wrapper ul li {
		border-bottom: 1px solid #666666;
		line-height: 1;
		position: relative;
/* 		font-size: 1.125rem; */
		font-size: 12.599px;
		text-align: left;
	}
	#arcv_wrapper ul li:first-of-type {
		border-top: 1px solid #666666;
	}
	#arcv_wrapper ul li a {
		color: #000;
		padding: 19px 0;
		display: block;
		background: url(../images/common/ic-arrow-arcv.png) no-repeat 97.5% 50%;
	}

	#arcv_wrapper ul li a:visited {
		color: #a3a3a3;
	}
	#arcv_wrapper ul li a:hover {
		text-decoration: none;
		opacity: 0.3;
	}
.showcase-post {
	margin-bottom: 20px;
}
	.showcase-post img {
/* 		margin-bottom: 50px; */
	}
/* 	.showcase-post img:first-of-type {
		display: none;
	} */
	.showcase-post img:nth-of-type(2),
	.showcase-post img:nth-of-type(3),
	.showcase-post img:nth-of-type(4) {
		opacity: 1;
		filter: alpha(opacity=100);
		-ms-filter: "alpha(opacity=100)";
		transform: translate(0, 0);
		-moz-transform: translate(0, 0);
		-webkit-transform: translate(0, 0);
		-o-transform: translate(0, 0);
		-ms-transform: translate(0, 0);
	}
	.showcase-post img.aligncenter {
		width: 67.5%;
	}

	.showcase-post img:last-of-type {
/* 		margin-bottom: 42px; */
	}
	.showcase-post p {
		text-align: left;
		color: #a1a1a1;
		padding: 0 3.1%;
		line-height: 2.125;
	}

	body.showcase{
	  background-color: #4d4d4d;
	}
	body.showcase #toggle{
	  background-color: rgba(77,77,77,0.70);
	  transition: 0.3s;
	}
	body.showcase #toggle:hover{
	  opacity: 0.5;
	}

	body.showcase .trigger span,
	body.showcase .trigger span:nth-of-type(2)::after{
	  background-color: #FAFAFA;
	}

	body.showcase #toggle.active{
	  background: rgba(250, 250, 250, 0.70);
	}
	body.showcase #toggle.active .trigger span,
	body.showcase #toggle.active .trigger span:nth-of-type(2)::after{
	  background-color: #666;
	}
	body.showcase main {
		padding: 0px 6.25%;
		text-align: center;
	}
	body.showcase h1 img:nth-of-type(1){
	  display: none;
	}
	body.showcase h1 img:nth-of-type(2){
	  display: block;
	}

	body.showcase main h2{
	  border-bottom: none;
	  color: #FFFFFF;
	  font-size: 20px;
	  margin-bottom: 15px;
	}
	body.showcase main article img{
	  margin-bottom: 50px;
	}
	body.showcase main article img:first-of-type{
	  display: none;
	}
	body.showcase main article img:nth-of-type(2),
	body.showcase main article img:nth-of-type(3),
	body.showcase main article img:nth-of-type(4){
	  opacity: 1;
	  filter: alpha(opacity=100);
	  -ms-filter: "alpha(opacity=100)";
	  transform: translate(0, 0);
	  -moz-transform: translate(0, 0);
	  -webkit-transform: translate(0, 0);
	  -o-transform: translate(0, 0);
	  -ms-transform: translate(0, 0);
	}
	body.showcase main article img.aligncenter{
	  width: 67.5%;
	}

	body.showcase main article img:last-of-type{
	  margin-bottom: 42px;
	}
	body.showcase main article p{
	  text-align: left;
	  color: #FFFFFF;
	  padding: 0 3.1%;
	  line-height: 2.125;
	}

	body.showcase main article ul{
	  border-top: 1px solid #FFF;
	  border-bottom: 1px solid #FFF;
	  padding: 1.2rem 0 ;
	  margin: 7px 0 6rem;
	  position: relative;
	  line-height: 1;
	}
	body.showcase main article ul li,
	body.showcase main article ul li a{
	  display: inline-block;
/* 	  font-size: 1.25rem; */
	  color: #FFF;
	  width: 200px;
	}
	body.showcase main article ul li.btn-previous a,
	body.showcase main article ul li.btn-next a{
	  text-indent: -299px;
	  overflow: hidden;
	  height: 22px;
	  position: absolute;
	}
	body.showcase main article ul li.btn-previous a{
	  background: url(../images/showcase/ic-arrow-previous.png) no-repeat 0 50%;
	  left: 2.5%;
	  top: 50%;
	  transform: translateY(-50%);
	}
	body.showcase main article ul li.btn-next a{
	  background: url(../images/showcase/ic-arrow-next.png) no-repeat 100% 50%;
	  right: 2.5%;
	  top: 50%;
	  transform: translateY(-50%);
	}

	body.showcase #arcv_posts{
	  margin: 65px 0;


	}
	body.showcase #arcv_posts ul li{
	  border-bottom: 1px solid #FFF;
	  line-height: 1;
	  position: relative;
	  font-size: 12.59px;
	  text-align: left;
	}
	body.showcase #arcv_posts ul li:first-of-type{
	  border-top: 1px solid #FFF;
	}
	body.showcase #arcv_posts ul li a{
	  color:#FFF;
	  padding: 19px 0;
	  display: block;
	  background: url(../images/showcase/ic-arrow-arcv.png) no-repeat 97.5% 50%;
	}

	body.showcase #arcv_posts ul li a:visited{
	  color: #b5b5b5;
	}


	body.showcase main article img{
	  margin-bottom: 20px
	}
	body.showcase main article img:last-of-type{
	  margin-bottom: 2.5rem;
	}
	body.showcase main article img.aligncenter{
	  width: 100%;
	}
	body.showcase main article ul,
	body.showcase #arcv_posts ul li:first-of-type,
	body.showcase #arcv_posts ul li{
	  border-color: #999;
	}
	body.showcase main article ul li, body.showcase main article ul li a{
	  width: 90px;
	  font-size: 14px;
	}
	body.showcase main article ul li.btn-previous a, body.showcase main article ul li.btn-next a{
	  background-size:10px;
	}
	body.showcase #arcv_posts ul li a{
	  background-size: 8px;
	  padding: 1.7rem 0;
	}
	
	
	/* SHOWCASE BIZ */
	body.showcase-biz{
		  background-color: #4d4d4d;
		}
		body.showcase-biz #toggle{
		  background-color: rgba(77,77,77,0.70);
		  transition: 0.3s;
		}
		body.showcase-biz #toggle:hover{
		  opacity: 0.5;
		}
	
		body.showcase-biz .trigger span,
		body.showcase-biz .trigger span:nth-of-type(2)::after{
		  background-color: #FAFAFA;
		}
	
		body.showcase-biz #toggle.active{
		  background: rgba(250, 250, 250, 0.70);
		}
		body.showcase-biz #toggle.active .trigger span,
		body.showcase-biz #toggle.active .trigger span:nth-of-type(2)::after{
		  background-color: #666;
		}
		body.showcase-biz main {
			padding: 0px 6.25%;
			text-align: center;
		}
		body.showcase-biz h1 img:nth-of-type(1){
		  display: none;
		}
		body.showcase-biz h1 img:nth-of-type(2){
		  display: block;
		}
	
		body.showcase-biz main h2{
		  border-bottom: none;
		  color: #FFFFFF;
		  font-size: 20px;
		  margin-bottom: 15px;
		}
		body.showcase-biz main article img{
		  margin-bottom: 50px;
		}
		body.showcase-biz main article img:first-of-type{
		  display: none;
		}
		body.showcase-biz main article img:nth-of-type(2),
		body.showcase-biz main article img:nth-of-type(3),
		body.showcase-biz main article img:nth-of-type(4){
		  opacity: 1;
		  filter: alpha(opacity=100);
		  -ms-filter: "alpha(opacity=100)";
		  transform: translate(0, 0);
		  -moz-transform: translate(0, 0);
		  -webkit-transform: translate(0, 0);
		  -o-transform: translate(0, 0);
		  -ms-transform: translate(0, 0);
		}
		body.showcase-biz main article img.aligncenter{
		  width: 67.5%;
		}
	
		body.showcase-biz main article img:last-of-type{
		  margin-bottom: 42px;
		}
		body.showcase-biz main article p{
		  text-align: left;
		  color: #FFFFFF;
		  padding: 0 3.1%;
		  line-height: 2.125;
		}
	
		body.showcase-biz main article ul{
		  border-top: 1px solid #FFF;
		  border-bottom: 1px solid #FFF;
		  padding: 1.2rem 0 ;
		  margin: 7px 0 6rem;
		  position: relative;
		  line-height: 1;
		}
		body.showcase-biz main article ul li,
		body.showcase-biz main article ul li a{
		  display: inline-block;
	/* 	  font-size: 1.25rem; */
		  color: #FFF;
		  width: 200px;
		}
		body.showcase-biz main article ul li.btn-previous a,
		body.showcase-biz main article ul li.btn-next a{
		  text-indent: -299px;
		  overflow: hidden;
		  height: 22px;
		  position: absolute;
		}
		body.showcase-biz main article ul li.btn-previous a{
		  background: url(../images/showcase/ic-arrow-previous.png) no-repeat 0 50%;
		  left: 2.5%;
		  top: 50%;
		  transform: translateY(-50%);
		}
		body.showcase-biz main article ul li.btn-next a{
		  background: url(../images/showcase/ic-arrow-next.png) no-repeat 100% 50%;
		  right: 2.5%;
		  top: 50%;
		  transform: translateY(-50%);
		}
	
		body.showcase-biz #arcv_posts{
		  margin: 65px 0;
	
	
		}
		body.showcase-biz #arcv_posts ul li{
		  border-bottom: 1px solid #FFF;
		  line-height: 1;
		  position: relative;
		  font-size: 12.59px;
		  text-align: left;
		}
		body.showcase-biz #arcv_posts ul li:first-of-type{
		  border-top: 1px solid #FFF;
		}
		body.showcase-biz #arcv_posts ul li a{
		  color:#FFF;
		  padding: 19px 0;
		  display: block;
		  background: url(../images/showcase/ic-arrow-arcv.png) no-repeat 97.5% 50%;
		}
	
		body.showcase-biz #arcv_posts ul li a:visited{
		  color: #b5b5b5;
		}
	
	
		body.showcase-biz main article img{
		  margin-bottom: 20px
		}
		body.showcase-biz main article img:last-of-type{
		  margin-bottom: 2.5rem;
		}
		body.showcase-biz main article img.aligncenter{
		  width: 100%;
		}
		body.showcase-biz main article ul,
		body.showcase-biz #arcv_posts ul li:first-of-type,
		body.showcase-biz #arcv_posts ul li{
		  border-color: #999;
		}
		body.showcase-biz main article ul li, body.showcase-biz main article ul li a{
		  width: 90px;
		  font-size: 14px;
		}
		body.showcase-biz main article ul li.btn-previous a, body.showcase-biz main article ul li.btn-next a{
		  background-size:10px;
		}
		body.showcase-biz #arcv_posts ul li a{
		  background-size: 8px;
		  padding: 1.7rem 0;
		}
	#arcv_cont{
	  display: -webkit-box;
	  display: -webkit-flex;
	  display: -moz-box;
	  display: -ms-flexbox;
	  display: flex;
	  -webkit-flex-wrap: wrap;
	  -ms-flex-wrap: wrap;
	  flex-wrap: wrap;
	}
	#arcv_cont article{
	  width: 33.33333333%;
	  overflow: hidden;
	}
	#arcv_cont article a{
	  display: block;
	  width: 100%;
	  position: relative;
	}
	#arcv_cont article a img{
	  transition-duration: 0.8s;
	  transition: 1s;
	}
	#arcv_cont article a:hover{
	  opacity: 1;
	}
	#arcv_cont article a:hover img{
	  transform: scale(1.1);
	  transition-duration: 0.8s;

	}
	#arcv_cont article ul.overlay{
	  width: 100%;
	  height: 100%;
	  position: absolute;
	  background: rgba(0,0,0,0.5);
	  top:0;
	  left:0;
	  opacity: 0;
	  -webkit-transition: opacity .3s linear;
	  -moz-transition: opacity .3s linear;
	  -o-transition: opacity .3s linear;
	  transition: opacity .3s linear;
	  filter: alpha(opacity=0);
	}
	#arcv_cont article ul.overlay li{
	  color: #FFF;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translateY(-50%) translateX(-50%);
	  text-align: center;
	  width: 100%;
	  line-height: 2;
	}
	#arcv_cont article ul.overlay:hover {
	  opacity: 1;
	  filter: alpha(opacity=100);
	}
	#arcv_cont{
	  display: block;
	  /*padding: 0 6.25%;*/
	}
	#arcv_cont article{
	  width: 100%;
	  /*margin-bottom: 20px;*/
	}
	#arcv_cont article ul.overlay li{
	  font-size: 1.3rem;
	}

	/*
*
*
  POST CONTENT
*
*
*/
	.post {
		word-break: break-all;
		padding: 0 20px;
	}
	.post strong, .post b {
		font-weight: bold;
	}
	.post p {
		margin-bottom: 30px;
	}
	.post p.big {
		font-weight: bold;
		font-size: 1.2em;
	}
	.post h2 {
		font-size: 1.3em;
	}
	.post h2 strong, .post h2 b {
		font-weight: bold;
		font-size: 1.3em;
	}

	.post p strong {
		font-weight: bold;
	}
	.post p a {
		color: #222;
	}

	.post img.alignnone {
		display: block;
		margin: 30px auto;
	}
	.post hr {
		margin: 50px auto;
	}
}