@charset "utf-8";
/* CSS Document */
div#contents {
	width:100%;
	min-width:940px;
	position: relative;
	overflow: hidden;
}
/*　スマホ用非表示 */
div#contents div.spImgbox{ display: none;}
div#contents div.spmessagebox{ display: none;}
/* 固定背景 */
div#contents div.indexbg {
	position: absolute;
	top:0;
	z-index: 10;
	opacity: 1;
}
	div#contents div.indexbg img {
		min-width: 100%;
		min-height: 100%;
	}
/*背景映像*/
div#contents div.videobox {
	position: absolute;
	top:0;
	z-index: 20;
}
	div#contents div.videobox video#video01 {
		display: block;
		min-width:100%;
		min-height:100%;
	}
	div#contents div.videobox div.imgbox {
		min-width:100%;
		min-height:100%;
	}
		div#contents div.imgbox > div {
			min-width: 100%;
			min-height: 100%;
			position: absolute;
			top:0;
			opacity: 0;
		}
		div#contents div.imgbox > div.img01 { 
			background: url(../images/index/topimg.jpg) no-repeat;
			background-size: cover;
			background-position: center center;
			opacity: 1;
		}
		div#contents div.imgbox > div.img02 { 
			background: url(../images/index/topimg2.jpg) no-repeat;
			background-size: cover;
			background-position: center center;
		}
		div#contents div.imgbox > div.img03 { 
			background: url(../images/index/topimg3.jpg) no-repeat;
			background-size: cover;
			background-position: center center;
		}
		div#contents div.imgbox > div.img04 { 
			background: url(../images/index/topimg4.jpg) no-repeat;
			background-size: cover;
			background-position: center center;
		}
		div#contents div.imgbox > div.img05 { 
			background: url(../images/index/topimg5.jpg) no-repeat;
			background-size: cover;
			background-position: center center;
		}
		div#contents div.imgbox > div.img06 { 
			background: url(../images/index/topimg6.jpg) no-repeat;
			background-size: cover;
			background-position: center center;
		}
/* 背景カバー */
div#contents div.imgcover {
	width:100%;
	min-width:940px;
	position: absolute;
	top:0;
	background: url(../images/index/screenimg.png);
	z-index: 30;
}
/* メッセージ */
div#contents div.pcmessagebox {
	width:100%;
	min-width:940px;
	position: absolute;
	top:0;
	z-index: 50;
	background: url(../images/cmn/bg02.jpg);
	opacity: 1;
}
	div#contents div.pcmessagebox div {
		width:100%;
		height:206px;
		position: absolute;
		top:0;
		opacity: 0;
	}
		div#contents div.pcmessagebox div img {
			display: block;
			width:344px;
			height:206px;
			max-width:100%;
			max-height:100%;
			margin: 0 auto;
		}
/* チェックボックス */
input#topmenuchecked {
	display: none;
}
/*メニューボックス*/
div#contents div.menubox {
	width:100%;
	min-width:940px;
	position: absolute;
	top:0;
	z-index: 40;
}
	div#contents div.menubox div.center {
		min-width: 406px;
		margin: 0 auto;
		position: relative;
	}
		div#contents div.menubox div.center div.menubg {
			min-width:100%;
			min-height: 100%;
			position: absolute;
			top:0;
		}
			div#contents div.menubox div.center div.menubg div.close {
				min-width:100%;
				min-height: 100%;
				position: absolute;
				top:0;
				background: url(../images/index/menubg01.png) no-repeat;
				background-size: 100% 100%;
				-webkit-transition: all .5s;
				transition: all .5s;
			}
			div#contents div.menubox div.center div.menubg div.open {
				min-width:100%;
				min-height: 100%;
				position: absolute;
				top:0;
				background: url(../images/index/menubg02.png) no-repeat;
				background-size: 100% 100%;
				opacity: 0;
				-webkit-transition: all .5s;
				transition: all .5s;
			}
		div#contents div.menubox div.center div.menumain {
			min-width:100%;
			min-height: 100%;
			position: absolute;
			top:0;
		}
			div#contents div.menubox div.center div.menumain div.menulogo {
				display: block;
				width:100%;
				text-align: center;
				position: absolute;
				-webkit-transition: all .5s;
				transition: all .5s;
			}
				div#contents div.menubox div.center div.menumain div.menulogo img { width:130px;}
			div#contents div.menubox div.center div.menumain div.menulogo2 {
				display: block;
				width:100%;
				text-align: center;
				position: absolute;
				-webkit-transition: all .5s;
				transition: all .5s;
				opacity: 0;
			}
				div#contents div.menubox div.center div.menumain div.menulogo2 img { width:130px;}
			div#contents div.menubox div.center div.menumain div.menuName {
				display: block;
				width:100%;
				text-align: center;	
				position: absolute;
				top:470px;
				-webkit-transition: all .5s;
				transition: all .5s;
			}
				div#contents div.menubox div.center div.menumain div.menuName img { width:248px;}
			div#contents div.menubox div.center div.menumain div.menulist {
				display: none;
				width:100%;
				height:0;
				position: absolute;
				top:320px;
				-webkit-transition: all .5s;
				transition: all .5s;
			}
				div#contents div.menubox div.center div.menumain div.menulist a {
					display: block;
					width:100%;
					height:45px;
					line-height: 45px;
					text-align: center;
					color: #fff;
					font-size: 16px;
					letter-spacing: 2px;
					background: none;
					text-decoration: none;
				}
				div#contents div.menubox div.center div.menumain div.menulist a:hover { background: url(../images/index/menubtnbg.png); }
			div#contents div.menubox div.center div.menumain div.closebtn {
				width:100%;
				text-align: center;
				position: absolute;
				top:3000px;
				-webkit-transition: all .5s;
				transition: all .5s;
				opacity: 0;
			}
				div#contents div.menubox div.center div.menumain div.closebtn img {
					cursor: pointer;
				}
			div#contents div.menubox div.center div.menumain div.closebtn img:hover { opacity: 0.7;}
			div#contents div.menubox div.center div.menumain div.openbtn {
				width:100%;
				text-align: center;
				position: absolute;
				top:600px;
				-webkit-transition: all .5s;
				transition: all .5s;
				opacity: 1;
			}
				div#contents div.menubox div.center div.menumain div.openbtn img {
					cursor: pointer;
				}
			div#contents div.menubox div.center div.menumain div.openbtn img:hover { opacity: 0.7;}
	/* チェックをつけたとき（メニューを開いたとき）*/
	input#topmenuchecked:checked ~ div.menubox div.center div.menubg div.close {opacity: 0;}
	input#topmenuchecked:checked ~ div.menubox div.center div.menubg div.open {opacity: 1;}
	input#topmenuchecked:checked ~ div.menubox div.center div.menumain div.menulogo { opacity: 0; }
	input#topmenuchecked:checked ~ div.menubox div.center div.menumain div.menulogo2 { opacity: 1; }
	input#topmenuchecked:checked ~ div.menubox div.center div.menumain div.menuName { display: none;}
	input#topmenuchecked:checked ~ div.menubox div.center div.menumain div.menulist { display: block; height:auto; }
	input#topmenuchecked:checked ~ div.menubox div.center div.menumain div.closebtn { opacity: 1;}
	input#topmenuchecked:checked ~ div.menubox div.center div.menumain div.openbtn { opacity: 0;}