@charset "utf-8";

body {
  color: #333;
  font: 13px/1.5 Helvetica, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
  *font-size: small;
  *font: x-small;
  }
body.home, body.archive {
	padding-left: 28%;
}
body.search,
body.category {
	padding-left: 0;
}
body.archive, body.single {
	background-image: url(../img/common/bg_underpage01.svg);
	background-repeat: no-repeat;
	background-position: 0 0;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
}

img {
	width: 100%;
	height: auto;
}

a {
  color: #000;
}

.pc {
  display: block!important;
}

.sp {
  display: none!important;
}


/* ----------------------------------------
module
----------------------------------------- */

/* hidetxt */
.hidetxt a {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

a:hover {
	color: #635b20;
	text-decoration: underline;
}

a:hover img{
  filter: alpha(opacity = 75);
  -ms-filter: "alpha( opacity=75 )";
  -moz-opacity: 0.75;
  opacity: 0.75;
}

/* btnlink01 */
.btnlink01 a {
	display: inline-block;
	border-radius: 4px;
	width: 286px;
	padding: 0.8em;
	font-size: 20px;
	font-weight: bold;
	color: #fff;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 -4px rgba(97,97,97,.46);
	-moz-box-shadow: inset 0 -4px rgba(97,97,97,.46);
	box-shadow: inset 0 -4px rgba(97,97,97,.46);
	position: relative;
}
.btnlink01 a:hover {
	text-decoration: none;
}
.btnlink01 a:active {
	top: 1px;
	-webkit-box-shadow: inset 0 0 rgba(25,25,25,.46);
	-moz-box-shadow: inset 0 0 rgba(25,25,25,.46);
	box-shadow: inset 0 0 rgba(25,25,25,.46);
}

.btnlink01.challenge a, .post-type-archive-challenge .btnlink01 a {
	background-color: #d60000;
}
.btnlink01.message a {
	background-color: #ffb700;
}
.btnlink01.peace a {
	background-color: #2480df;
}
.btnlink01.column a {
	background-color: #2eb3ff;
}
.postlist .btnlink01 a {
	width: 328px;
	padding: 1em;
	font-size: 18px;
}
.postlist .btnlink01 a:after {
	display: none;
}

/* logo_under */
.logo_under {
	width: 224px;
	position: absolute;
	left: 28px;
	top: 26px;
}

/* pankuzu */
.pankuzu {
	margin-bottom: 67px;
}

.pankuzu li {
	display: inline-block;
	font-size: 13px;
}
.pankuzu > span a:after,
.pankuzu li:after {
	display: inline-block;
	content: '>';
	margin: 0 .5em;
}
.pankuzu li:last-child:after {
	display: none;
}


/* ----------------------------------------
header
----------------------------------------- */

header {
  width: 100%;
  /*height: 100%;*/
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2000;
}

header .btn_menu {
	width: 70px;
	position: fixed;
	top: 24px;
	right: 20px;
	z-index: 1000;
}

header .btn_menu .openBtn {
	display: none;
	cursor: pointer;
	position: absolute;
	top: 0;
	left: 0;
}
header .btn_menu .openBtn.current {
	display: block;
}

header .menu_open {
	display: none;
	width: 100%;
	height: 100vh;
	background-color: rgba(255, 102, 0, 0.9);
}

header .wrap {
  position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
}

/* gnav */
header .gnav {
	line-height: 2.3;
	margin-bottom: 72px;
	text-align: center;
	vertical-align: middle;
}

header .gnav li a {
  color: #fff;
  font-size: 26px;
  font-weight: bold;
}

/* sublink */
header .sublink {
	margin-bottom: 72px;
}

header .sublink li {
	display: inline-block;
}

header .sublink li a {
	padding: 0 .5em;
	font-size: 18px;
	font-weight: bold;
	color: #fff;
	border-left: 1px solid #fff;
}
header .sublink li:first-child a {
	border: none;
}

/* backhome */
header .backhome a {
	display: block;
}

header .backhome .logo_furefure {
	display: inline-block;
	width: 270px;
	margin: 0 0 24px -34px;
}

header .backhome .txt {
	text-align: center;
	font-size: 15px;
	font-weight: bold;
	color: #fff;
}


/* ----------------------------------------
mv_side
----------------------------------------- */

#mv_side {
	width: 28%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: 50% 0;
	-webkit-background-size: cover;
	background-size: cover;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 1000;
}

#mv_side .logo {
	width: 80%;
	margin-left: -40%;
	position: absolute;
	bottom: 5%;
	left: 50%;
}


/* ----------------------------------------
contents
----------------------------------------- */

#contents {
	width: 100%;
}

#contents:after {
	display: block;
	content: '';
	clear: both;
}

#contents .wrapper {
	max-width: 1080px;
	margin: 0 auto;
}


/* ----------------------------------------
grid
----------------------------------------- */

#contents .grid > div,
#contents .grid > article {
	width: 33.3333%;
	position: relative;
	float: left;
}

.home #contents .grid > article:nth-child(3n+1),
#contents .grid > article.postlist:nth-of-type(3n+1) {
	clear: both;
}

@media screen and (max-width: 767px) {
	.home #contents .grid > article:nth-child(3n+1),
	#contents .grid > article.postlist:nth-of-type(3n+1) {
		clear: none;
	}
	.home #contents .grid > article:nth-child(2n+1),
	#contents .grid > article.postlist:nth-of-type(2n+1) {
		clear: both;
	}
}

#contents .grid .postlist a {
	display: block;
	outline: none;
}

.grid .ico_cat01 {
	display: table;
	width: 50px;
	height: 50px;
	padding: 0	 .5em;
	vertical-align: middle;
	text-align: center;
	font-size: 12px;
	color: #fff;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 10;
}
.grid .ico_cat01 strong {
	display: table-cell;
	vertical-align: middle;
	line-height: 1.2;
}

.grid .ttl {
	width: 100%;
	padding: 29px 10px .8em;
	min-height: 99px;
	color: #fff;
	background: -webkit-linear-gradient(90deg, #030000 0%, rgba(3, 0, 0, 0.5) 50%, rgba(3, 0, 0, 0) 100%);
	background: -moz-linear-gradient(90deg, #030000 0%, rgba(3, 0, 0, 0.5) 50%, rgba(3, 0, 0, 0) 100%);
	background: -o-linear-gradient(90deg, #030000 0%, rgba(3, 0, 0, 0.5) 50%, rgba(3, 0, 0, 0) 100%);
	background: -ms-linear-gradient(90deg, #030000 0%, rgba(3, 0, 0, 0.5) 50%, rgba(3, 0, 0, 0) 100%);
	background: linear-gradient(0deg, #030000 0%, rgba(3, 0, 0, 0.5) 50%, rgba(3, 0, 0, 0) 100%);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 20;
}

.grid .ttl .info {

}

.grid .ttl .date {
	margin-bottom: .5em;
	font-size: 13px;
}

.grid .ttl .info .cate {
	display: inline-block;
	margin-right: 10px;
	padding: 2px 5px;
	background-color: #f5c505;
	color: #333;
	font-size: 11px;
}

.grid .ttl .info .date {
	display: inline-block;
}

.grid .ttl h3{
	width: 82%;
	line-height: 1.4;
	font-size: 15px;
	word-break: break-all;
}

.grid .thumbnail {
	overflow: hidden;
}
.grid .thumbnail img {
	-moz-transition: -moz-transform 0.3s linear;
  -webkit-transition: -webkit-transform 0.3s linear;
  -o-transition: -o-transform 0.3s linear;
  -ms-transition: -ms-transform 0.3s linear;
  transition: transform 0.3s linear;
}
.grid .thumbnail img:hover {
	-webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}


/* ----------------------------------------
footer
----------------------------------------- */

footer {
	padding: 72px 0 56px;
	background-color: #ebebeb;
}
.archive footer {
	margin-top: 96px;
}
.page footer,
.single footer {
	margin-top: 128px;
}
.home footer {
	margin-top: 0;
}
footer .pagetop {
	display: none;
	width: 40px;
	position: fixed;
	bottom: 268px;
	right: 27px;
	z-index: 100;
}
footer .pagetop img {
	width: 100%;
}

footer .wrap {
	width: 80%;
	margin: 0 auto;
	text-align: center;
}

/* sublink */
footer .sublink {
	margin-bottom: 2em;
}

footer .sublink li {
	display: inline-block;
}

footer .sublink li a {
	padding: 0 1em;
	font-size: 14px;
	font-weight: bold;
	color: #333;
	border-left: 1px solid #9a9a9a;
}
footer .sublink li:first-child a {
	border: none;
}

footer .attention {
	line-height: 1.6;
	margin-bottom: 1em;
	font-size: 15px;
}
footer .attention .red {
	color: #fa0014;
}

/* snslink */
footer .snslink {
	margin-bottom: 35px;
}

footer .snslink li {
	display: inline-block;
	margin-right: 18px;
}
footer .snslink li:last-child {
	margin-right: 0;
}

footer .copy {
	font-size: 11px;
	color: #989898;
}

#infscr-loading {
	width: 100%!important;
	text-align:center;
	margin:15px auto;
}

#infscr-loading img {
	width: auto;
	height: auto;
}

.postlist .pageNav {
	display: none!important;
}

.pop_cnt {
	padding: 50px 11.5%;
	background-image: url(../img/common/bg_popup.jpg);
    background-repeat: no-repeat;
    background-position: 0 0;
    -webkit-background-size: cover;
    background-size: cover;
}

.pop_cnt .popup-hader {
	width: 100%;
	display: table;
	padding-bottom: 20px;
}

.pop_cnt .popup-hader > div {
	display: table-cell;
	text-align: left;
	vertical-align: top;
}

.pop_cnt .popup-hader .left {
	width: 15.75%;
}

.pop_cnt .popup-hader .left img {
	width: 100%;
	height: auto;
}

.pop_cnt .popup-hader .right {
	padding-left: 3.75%;
}

.pop_cnt .popup-hader .right .txt {
	font-size: 15px;
	color: #fff;
	padding-bottom: 10px;
}

.pop_cnt .popup-hader .right .sns {
	text-align: left;
}

.pop_cnt .popup-hader .right .sns li {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	padding-right: 10px;
	padding-bottom: 10px;
}

/*
.pop_cnt .popup-hader .right .sns li+li {
	padding-left: 10px;
}
*/

.pop_cnt .popup-body {
}

.pop_cnt .popup-body img {
	width: 100%;
	height: auto;
}



@media screen and (max-width: 767px) {
	.pc {
		display: none!important;
	}

	.sp {
		display: block!important;
	}

	.pop_cnt .popup-hader .left {
		width: 35%;
		display: block;
	}

	.pop_cnt .popup-hader .left img {
		width: 100%;
		height: auto;
	}

	.pop_cnt .popup-hader .right {
		display: block;
		padding-left: 0;
		padding-top: 15px;
	}

	body.home, body.archive {
		padding-left: 0;
	}

	/*
	molude
	*/

	.postlist .btnlink01 a {
		width: 100%;
		font-size: 17px;
	}

	.logo_under {
		width: 146px;
		top: 20px;
		left: 3%;
	}

	.pankuzu {
		display: block;
		width: 100%;
		margin: 0 0 8%;
		overflow-x: scroll;
		white-space: nowrap;
	}

	.main .tag li {
		display: inline-block;
		width: auto;
		margin: 0 0 0 2%;
		float: none;
	}

	/*
	header
	*/

	header .btn_menu {
		width: 50px;
		top: 16px;
		right: 3%;
	}

	header .menu_open {
		width: 100%;
		height: 100vh;
		overflow-y: scroll;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 200;
	}

	header .wrap {
		width: 72%;
	}
	@media screen and (orientation: landscape) {
		header .wrap {
			height: 100%;
		}
	}

	header .gnav, header .sublink {
		margin-bottom: 12%;
	}

	header .gnav li a {
		font-size: 20px;
	}

	header .sublink li a {
		font-size: 14px;
	}

	header .backhome .logo_furefure {
		width: 74%;
		margin: 0 0 5% -5%;
	}

	header .backhome .txt {
		font-size: 13px;
	}

	/*
	mv_side
	*/

	#mv_side {
		width: 100%;
		height: 100vh;
		position: relative;
	}
	@media screen and (orientation: landscape) {
		#mv_side {
			height: 1200px;
		}
	}

	#mv_side .logo {
		width: 60%;
		margin-left: -30%;
		bottom: 10%;
	}

	#mv_side .btn_scroll {
		width: 10%;
		margin-left: -5%;
		position: absolute;
		left: 50%;
		bottom: 2%;
	  -webkit-animation: flickerAnimation 3.5s infinite;
	  -moz-animation: flickerAnimation 3.5s infinite;
	  -o-animation: flickerAnimation 3.5s infinite;
	  animation: flickerAnimation 3.5s infinite;
	}

	@keyframes flickerAnimation {
	  0%   { opacity:1; }
	  50%  { opacity:0; }
	  100% { opacity:1; }
	}
	@-o-keyframes flickerAnimation{
	  0%   { opacity:1; }
	  50%  { opacity:0; }
	  100% { opacity:1; }
	}
	@-moz-keyframes flickerAnimation{
	  0%   { opacity:1; }
	  50%  { opacity:0; }
	  100% { opacity:1; }
	}
	@-webkit-keyframes 	flickerAnimation{
	  0%   { opacity:1; }
	  50%  { opacity:0; }
	  100% { opacity:1; }
	}

	/*
	contents
	*/

	#contents .wrapper {
		width: 92%;
	}

	#contents.postlist {
		width: 100%;
		margin: 0;
	}

	#contents .grid > div,
	#contents .grid > article {
		width: 49.99%;
	}

	.grid .ico_cat01 {
		width: 40px;
		height: 40px;
	}

	.grid .ttl .date {
		font-size: 12px;
	}

	.grid .ttl h3 {
		font-size: 14px;
	}

	/*
	footer
	*/

	footer, .archive footer {
		width: 100%;
		margin: 18% 0 0;
		padding: 10% 0;
	}

	footer .pagetop {
		width: 12%;
		position: fixed;
		top: 90%;
		right: 3%;
		z-index: 100;
		opacity: 1;
		transition: all 0.5s;
	}

	.pop_cnt .popup-hader .right .sns {
		text-align: left;
	}

	.pop_cnt .popup-hader .right .sns li {
		text-align: left;
		vertical-align: top;
	}

	/*
	.pop_cnt .popup-hader .right .sns li+li {
		padding-left: 0;
		padding-top: 10px;
	}
	*/

	@media screen and (orientation: landscape) {
		footer .pagetop {
			width: 10%;
			top: 75%;
		}
	}
	footer .pagetop.popup {
		opacity: 0;
		transition :all 0.5s;
		-webkit-transform: translate(0, 50%);
		transform: translate(0, 50%);
	}

	footer .wrap {
		width: 86%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	footer .attention {
		line-height: 1.6;
		font-size: 14px;
	}

	footer .snslink {
		margin-bottom: 10%;
	}

	footer .snslink li {
		margin-right: 5%;
	}

	footer .copy {
		width: 100%;
		text-align: center;
		font-size: 11px;
		float: none;
	}

}


@media screen and (min-width: 768px) and (max-width: 980px) {

	header .btn_menu {
		width: 70px;
	}

	.logo_under {
		width: 196px;
	}

	header .gnav li a {
		font-size: 24px;
	}
}


@media screen and (max-width: 375px) {
	.grid .ttl .date {
	    font-size: 10px;
	}
	.grid .ttl h3 {
	    font-size: 12px;
	}
	.grid .ttl .info .cate {
		margin-right: 5px;
		font-size: 10px;
	}
}