@charset "shift_jis";
/* CSS Document */

/*==========QUERY==========
@media screen and (max-width:1250px) {
	QUERY
}
==========QUERY==========*/
#communityBox{ background:url(../images/bg.jpg) top center no-repeat #eeeeee; margin-top:18px; padding:300px 0 30px;}
#boxArea{ width:1190px; margin:0 auto; text-align:left; background:#ffffff;}
#boxContents{ /*padding:20px;*/padding-top:20px; overflow:hidden; text-align:center;}

@media screen and (max-width:1250px) {
	#boxArea{ width:950px;}
}



/*-----boxContents----*/
#boxContents a{ text-decoration:none;}
#boxContents a:hover{ text-decoration:none;}
#boxContents #grid{ margin-left:20px; min-height:360px;}
#boxContents .box{ font-size:80%; float:left; margin-bottom:20px; width:175px; height:160px; overflow:hidden; background-position:center; background-repeat:no-repeat; background-size:cover;}
#boxContents .box.main{ width:500px; height:470px;}
/*#boxContents .box.large{ width:330px; height:310px;}*/
#boxContents .box.large{ width:370px; height:340px;}
#boxContents .box a{ display:block; width:175px; height:160px; text-align:left; overflow:hidden;}
/*#boxContents .box.large a{ width:330px; height:310px;}*/
#boxContents .box.large a{ width:370px; height:340px;}
#boxContents .box a span.bgArea{ display:none;}
#boxContents .box a:hover span.bgArea{ display:block; margin:10px; height:130px; overflow:hidden;}
#boxContents .box.large a span.bgArea{ padding:85px 10px 10px; height:auto;}
#boxContents .box a span.bgArea img{ float:left; margin:0 5px 5px 0; width:30px;}
#boxContents .box.large a span.bgArea img{ width:40px;}
#boxContents .box a span.bgArea .user{ overflow:hidden;}
#boxContents .box a span.bgArea .date{ display:none;}
#boxContents .box a span.bgArea span.text{ display:block; clear:both;}

#boxContents .box.twitter a:hover{ background:url(../images/bg_bk.png) repeat; color:#fff;}
#boxContents .box.noimg.twitter a{ background:#ddd; color:#000;}
#boxContents .box.noimg.twitter a:hover{ background:#bbb;}

#boxContents .box.facebook{border-color:#fff}
#boxContents .box.facebook a:hover{ background:url(../images/bg_bk.png) repeat; color:#fff;}
#boxContents .box.noimg.facebook a{ background:#ddd; color:#000000;}
#boxContents .box.noimg.facebook a:hover{ background:#bbb;}

#boxContents .box.weibo{border-color:#ffdfe1;}
#boxContents .box.weibo a:hover{ background:url(../images/bg_bk.png) repeat; color:#fff;}
#boxContents .box.noimg.weibo a{ background:#ddd; color:#000000;}
#boxContents .box.noimg.weibo a:hover{ background:#bbb;}

#boxContents .box.noimg a span.bgArea{ display:block; margin:10px; height:130px; overflow:hidden;}

#boxContents #page_nav{display: block!important; text-align:center;margin-bottom:20px;	border-top:5px solid #eeeeee;
	border-bottom:5px solid #eeeeee; padding:10px 0 10px;
}

#boxContents #page_nav a{
	font-size:120%;
	color:#626262;
	display:block;
}
#boxContents .notes{
	margin-bottom:20px;
}
/*#boxContents #page_nav a{ display:inline-block; background:url(../images/icon_btn.png) right no-repeat #8ec31f; padding:15px 40px 15px 20px; color:#ffffff; font-weight:bold; text-decoration:none; min-width:170px;}*/

@media screen and (max-width:1250px) {
#boxContents .box{width:166px;}
#boxContents .box a{width:166px;}
#boxContents .box.large{ width:352px;}
#boxContents .box.large a{ width:352px;}

}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

/* End: Recommended Isotope styles */

/**** Infinite Scroll ****/

#infscr-loading {
	position: fixed;
	text-align: center;
	bottom: 40%;
	left: 42%;
	z-index: 100;
	background: white;
	background: hsla( 0, 0%, 63%, 0.9 );
	padding: 20px;
	color: #fff;
	font-size: 15px;
	font-weight: bold;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}