@charset "UTF-8";


/*----------------------------------------------------------------------

Reset Style

----------------------------------------------------------------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { 
  margin: 0;
  padding: 0;
  background-color:#fff;
}

img { 
  border: 0;
}

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal;
}

ol, ul {
  list-style: none;
}

caption, th {
  text-align: left;
}

/*
h1, h2, h3, h4, h5, h6 {
  font-size: 150%;
  font-weight: bold;
}
*/

a:link {
	color: #333399;
	text-decoration: none;
	font-weight:bold;
}
a:visited {
	text-decoration: none;
	color: #333399;
	font-weight:bold;
}
a:hover {
	text-decoration: underline;
	color: #C00;
	font-weight:bold;
}
a:active {
	text-decoration: none;
	color: #C00;
	font-weight:bold;
}

body {
	max-width: 1250px;
	margin: 0 auto;
	padding: 0;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:16px;
}



/*----------------------------------------------------------------------

Contents Style

----------------------------------------------------------------------*/
.header {
	text-align: center;
	margin: 8px auto 4px auto;
	font-size:300%;
	font-weight:bold;
}

#container{
	width:100%;
}
/* #fullbg_stretch --------------------------- */ 
#fullbg_stretch  img { 
    visibility: hidden; 
} 
/* #contents --------------------------- */ 
#contents { 
    /* margin: 50px auto; */
    width: 100%; 
    /* color: #000;  */
    /* text-align: left; */ 
    position: relative;
	z-index:98;
}
#contents #overlaybg { 
    top: 0; 
    left: 0; 
    width: 100%; 
    background: #fff; 
    position: absolute; 
} 
#contents #wrapper { 
    width: 100%; 
    /* text-align: left; */ 
    position:relative;  
}

#main{
	width:86%;
	height:auto;
	padding:3%;
	background-image:url(img/main_back01.png);
	background-position:top left;
	background-repeat:repeat;
	margin:30px auto 0px auto;
	overflow:auto;
}

#photo{
	z-index:99;
	padding:1%;
	position:fixed;
	background-image:url(img/photo_back01.png);
	background-position:top left;
	background-repeat:repeat;
	display:none;
	text-align:center;
	margin:0px auto 0px auto;
}

.motionContainer.masonry,
.motionContainer.masonry .masonry-brick {
	-webkit-transition-duration: 0.7s;
	-moz-transition-duration: 0.7s;
	-o-transition-duration: 0.7s;
	transition-duration: 0.7s;
}
.motionContainer.masonry {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	-o-transition-property: height, width;
	transition-property: height, width;
}
.motionContainer.masonry  .masonry-brick {
	-webkit-transition-property: left, right, top;
	-moz-transition-property: left, right, top;
	-o-transition-property: left, right, top;
	transition-property: left, right, top;
}
/* disable transitions on container */
.motionContainer.infinite-scroll.masonry {
	-webkit-transition-property: none;
	-moz-transition-property: none;
	-o-transition-property: none;
	transition-property: none;
}

.modules {
	margin: 0 auto 3em;
	padding: 5px;
	/* background: url(images/modulebg.gif) top left #ddd; */
}
.modules:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.modules li {
	width: 220px;
	margin: 5px;
	float: left;
	padding: 0;
	background-image:url(img/main_back01.png);
	background-position:top left;
	background-repeat:repeat;
	font-weight:bold;
	box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
	-moz-box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
	-webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
}
.modules li p {
	padding: 10px;
	font-size: 77%;
}
.modules li p.thumb {
	text-align: center;
	padding: 10px 10px 2px;
}

.modules li p.thumb img {
	max-width: 100% !important;
	/* May I rot in hell for this IE6 hack */
	_width: 95% !important;
	height: auto !important;
}

.modules li p.caption {
	padding: 0 10px 10px;
	text-align:center;
	font-size:16px;
}

.modules li p.user {
}

.footer {
	width:86%;
	text-align: center;
	margin: 50px auto 32px auto;
	padding:3%;
	font-size:16px;
	background-image:url(img/main_back01.png);
	background-position:top left;
	background-repeat:repeat;
	font-weight:bold;
}
img{    
	max-width: 100%;    
	height: auto;    
	width /***/:auto;　
}

.youtube2 {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube2 iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

.status_title{
	font-weight:bold;
	font-size:18px;
	text-decoration:underline;
}

.box_shadow {
		box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
	-moz-box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
	-webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
}

.topvideo {
	position:relative;
	width:100%;
	height:0;
	padding-top:75%;
	margin-bottom:32px;
}

.topvideo iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

@media screen and (min-width: 1000px) {
	.footer {
		width:86%;
		text-align: center;
		margin: 50px auto 16px auto;
		padding:3%;
		font-size:16px;
		background-image:url(img/main_back01.png);
		background-position:top left;
		background-repeat:repeat;
		font-weight:bold;
	}
	
	#mobile_menu {
		display:none;
	}
	
	#pc_menu {
		display:block;
	}
	
	#title {
		width:40%;
		margin:0px auto 0px auto;
	}
	
	#sns {
		 width:20%;
		 height:auto;
		 margin:0px auto 100px auto;
		 text-align:center;"
	}
	
	#footer_icon_erea {
		 width:100%;
		 height:auto;
		 marin-top:8px;
		 padding-top:20px;
		 padding-right:10px;
	}
	
	#footer_icon {
		width:12%;
		margin-right:0.5%;
	}
	
}

@media screen and (max-width: 414px) {
	.modules li {
		width: 280px;
	}
	.footer {
		width:86%;
		text-align: center;
		margin: 50px auto 16px auto;
		padding:3%;
		font-size:16px;
		background-image:url(img/main_back01.png);
		background-position:top left;
		background-repeat:repeat;
		font-weight:bold;
	}
	
	#mobile_menu {
		display:block;
	}
	
	#pc_menu {
		display:none;
	}
	
	#menu_icon {
		width:46%;
		height:auto;
		padding:0.5%;
		text-align:center;
		float:left;
		margin-left:1%;
		margin-bottom:3%;
		font-weight:bold;
	}

	#title {
		width:70%;
		margin:0px auto 0px auto;
	}
	
	#sns {
		 width:45%;
		 height:auto;
		 margin:0px auto 32px auto;
		 text-align:center;
	}

	
	#footer_icon_erea {
		 width:100%;
		 height:auto;
		 padding-top:20px;
	}
	
	#footer_icon {
		width:31.8%;
		margin-right:1.5%;
	}
}