*{
	font-family:'Noto Sans',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

}
body{
	background:#fff;
	color:#555;
}

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

header{
	position:fixed;
	left:0px;
	top:0px;
	width:100%;
	height:60px;
	z-index:1000;
	background:#fff;
	border-bottom:solid 1px #ccc;
}
header .logo{
	position:absolute;
	left:15px;
	top:15px;
}
header .logo img{
	width:auto;
	height:30px;
}
header .barger{
	position:absolute;
	right:15px;
	top:10px;
	width:40px;
	height:40px;
	background:#fff;
	border-radius:50%;
	cursor:pointer;
	background: #c00;
}
header .barger .open p,
header .barger .close p{
	background:#fff;
}
header .barger .open p{
	position:absolute;
	background:#fff;
	width:5px;
	height:5px;
	background:#fff;
	border-radius:50%;
	left:10px;
	top:10px;
}
header .barger .open p:nth-child(1){
	transform: translate(-0.5px, 0);
	-webkit-transform: translate(-0.5px, 0);
	-moz-transform: translate(-0.5px, 0);
	-ms-transform: translate(-0.5px, 0);
	-o-transform: translate(-0.5px, 0);
}
header .barger .open p:nth-child(2){
	transform: translate(7.5px, 0);
	-webkit-transform: translate(7.5px, 0);
	-moz-transform: translate(7.5px, 0);
	-ms-transform: translate(7.5px, 0);
	-o-transform: translate(7.5px, 0);
}
header .barger .open p:nth-child(3){
	transform: translate(15.5px, 0);
	-webkit-transform: translate(15.5px, 0);
	-moz-transform: translate(15.5px, 0);
	-ms-transform: translate(15.5px, 0);
	-o-transform: translate(15.5px, 0);
}
header .barger .open p:nth-child(4){
	transform: translate(-0.5px, 7.5px);
	-webkit-transform: translate(-0.5px, 7.5px);
	-moz-transform: translate(-0.5px, 7.5px);
	-ms-transform: translate(-0.5px, 7.5px);
	-o-transform: translate(-0.5px, 7.5px);
}
header .barger .open p:nth-child(5){
	transform: translate(7.5px, 7.5px);
	-webkit-transform: translate(7.5px, 7.5px);
	-moz-transform: translate(7.5px, 7.5px);
	-ms-transform: translate(7.5px, 7.5px);
	-o-transform: translate(7.5px, 7.5px);
}
header .barger .open p:nth-child(6){
	transform: translate(15.5px, 7.5px);
	-webkit-transform: translate(15.5px, 7.5px);
	-moz-transform: translate(15.5px, 7.5px);
	-ms-transform: translate(15.5px, 7.5px);
	-o-transform: translate(15.5px, 7.5px);
}
header .barger .open p:nth-child(7){
	transform: translate(-0.5px, 15.5px);
	-webkit-transform: translate(-0.5px, 15.5px);
	-moz-transform: translate(-0.5px, 15.5px);
	-ms-transform: translate(-0.5px, 15.5px);
	-o-transform: translate(-0.5px, 15.5px);
}
header .barger .open p:nth-child(8){
	transform: translate(7.5px, 15.5px);
	-webkit-transform: translate(7.5px, 15.5px);
	-moz-transform: translate(7.5px, 15.5px);
	-ms-transform: translate(7.5px, 15.5px);
	-o-transform: translate(7.5px, 15.5px);
}
header .barger .open p:nth-child(9){
	transform: translate(15.5px, 15.5px);
	-webkit-transform: translate(15.5px, 15.5px);
	-moz-transform: translate(15.5px, 15.5px);
	-ms-transform: translate(15.5px, 15.5px);
	-o-transform: translate(15.5px, 15.5px);
}

header .barger .close{
	display:none;
	position:absolute;
	width:70%;
	height:70%;
	left:15%;
	top:15%;
}
#header_menu:checked+header .barger .close{
	display:block;
}
#header_menu:checked+header .barger .open{
	display:none;
}
header .barger .close p{
	position:absolute;
	background:#fff;
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}
header .barger .close p:nth-child(1){
	width:100%;
	height:4px;
	left:0%;
	top:50%;
	margin-top:-2px;
}
header .barger .close p:nth-child(2){
	height:100%;
	width:4px;
	left:50%;
	top:0%;
	margin-left:-2px;
}

/* header_menu ---------------- */

.header_menu{
	position:fixed;
	width:100%;
	height:100%;
	z-index:-1;
	background:#232323;

	opacity:0;
	-webkit-opacity:0;
	-moz-opacity:0;
	-ms-opacity:0;
	-o-opacity:0;

	transition-duration:600ms;
	-webkit-transition-duration:600ms;
	-moz-transition-duration:600ms;
	-ms-transition-duration:600ms;
	-o-transition-duration:600ms;
}
.header_menu .list{
	position:fixed;
	left:0px;
	width:100%;
	top:50%;
	margin-top:-170px;
	text-align:center;
}
.header_menu .list.l2{
	margin-top:200px;
}
.header_menu .list ul{
	overflow:hidden;
	display:inline-block;
	zoom:1;
}
.header_menu .list.l2 ul{
	width:1000px;
	text-align:center;
}
.header_menu .list ul:after{
	content:"";
	display:block;
	clear:both;
}
.header_menu .list ul li{
	float:left;
}
.header_menu .list.l2 ul li{
	width:100%;
}
.header_menu .list ul li a{
	display:block;
	margin:15px;
}
.header_menu .list.l2 ul li a{
	color:#fff;
	margin:0px;
	font-size:18px;
	display:inline-block;
	padding:10px;
	border-bottom:solid 1px #fff;
}
#header_menu:checked~.header_menu{
	z-index:999;
	opacity:1;
	-webkit-opacity:1;
	-moz-opacity:1;
	-ms-opacity:1;
	-o-opacity:1;
}
