/*---------------------------------
	layout
---------------------------------*/
main {
	margin:0 auto;
}
/*---------------------------------
	index
---------------------------------*/
.mainimage {
	margin:0 auto;
	background: url(../img/index/mainimage.jpg);
	z-index: -1;
}
.movie {
	position: absolute;
	width: 310px;
	text-align: center;
	line-height:0;
}
.movie label {
	position: relative;
	display: inline-block;
	width: 310px;
	height: 244px;
  /*サムネイルに枠画像を被せる場合に使用*/
	/*background: url(../img/common/icon_play.png) no-repeat center center,url(../img/index/bg_movie.png) no-repeat center center,url(../img/index/thumb.png) no-repeat center center;*/
  /*枠画像にサムネイルを被せる場合に使用*/
	background: url(../img/common/icon_play.png) no-repeat center 110px,url(../img/index/thumb.jpg) no-repeat center 48px,url(../img/index/bg_movie.png) no-repeat center center;
	background-size:65px,auto,auto;
	cursor: pointer;
	transition:background-size 0.3s;
}
.movie label:hover {
	background-size:58px,auto,auto;
}
.movie .btn {
	position: relative;
	transition: opacity 0.5s;
}
.movie .btn:hover {
	opacity: 0.9;
}
#movie-toggle:checked ~ .btn {
	display: none;
}
#movie-toggle:checked ~ label {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, 0.8);
	z-index:100;
}
#movie-toggle:checked ~ .movie-box {
	display:inline-block;
	position: fixed;
	top: 50%;
	right: 50%;
	width:672px;
	height:420px;
	-webkit-transform: translate(50%, -50%);
	transform: translate(50%, -50%);
  z-index:100;
}
.youtube {
	display:none;	
	width:672px;
	height:420px;
}
#movie-toggle:checked ~ p.movie-box .youtube {
	display:block;
}
#movie-toggle:checked ~ p.movie-box .close {
	display: block;
	position: absolute;
	top: -45px;
	right: 0;
	width: 25px;
	height: 25px;
	background: url(../img/common/close.png);
  cursor: pointer;
}
.wall {
  position:absolute;
  width:388px;
  height:96px;
}
.wall a {
  display:block;
  width:388px;
  height:96px;
  background:url(../img/index/bnr_wall.png) no-repeat;
  transition:opacity 0.5s;
}
.wall a:hover {
  opacity:0.8;
}
/*---------------------------------
	Contentse
---------------------------------*/
/*section.content {
  padding:20px 0; 
}*/
section.content h2 {
  width:100%;
  margin:0;
}
section#content1 h2 {
  background:url(../img/index/title1.jpg) no-repeat center top;
}
section#content2 h2 {
  background:url(../img/index/title2.jpg) no-repeat center top;
}
section#content3 h2 {
  background:url(../img/index/title3.jpg) no-repeat center top;
}
section#content4 h2 {
  background:url(../img/index/title4.jpg) no-repeat center top;
}
section#content5 h2 {
  background:url(../img/index/title5.jpg) no-repeat center top;
}
section#content6 h2 {
  background:url(../img/index/title6.jpg) no-repeat center top;
}
section#content1 div {
  background:url(../img/index/content1.jpg) no-repeat center top;
}
section#content2 div {
  background:url(../img/index/content2.jpg) no-repeat center top;
}
section#content3 div {
  background:url(../img/index/content3.jpg) no-repeat center top;
}
section#content4 div {
  background:url(../img/index/content4.jpg) no-repeat center top;
}
section#content5 div {
  background:url(../img/index/content5.jpg) no-repeat center top;
}
section#content6 div {
  background:url(../img/index/content6.jpg) no-repeat center top;
}
