﻿@font-face{
	font-family:'WebSubsetFont';
	src:url('../font/WebSubsetFont.woff') format('woff');
}

@font-face{
	font-family:'menufont';
	src:url('../font/menu.woff') format('woff');
}


*{
	margin:0;
	padding:0;
	background-color: transparent;
	color: #222;
	font-size:13px;
	font-family:"WebSubsetFont","sorttmillgoudy","Times New Roman","メイリオ",sans-serif;
}

ul li{
	list-style-type:none;
}

img{
	border:none;
}

a{
	text-decoration:none;
	color:#9ba473;
}

a:hover,a:active{
	color:#444;
	opacity:0.5;
	transition-property:opacity;
	transition-duration:2s;
}


body{
	width:100%;
	margin:0;
}


#wrap{
	margin:0 auto;
	padding:0px;
	padding-bottom:15px;
	width:360px;
	background:rgba(0, 0, 0, 0.85);
	box-shadow:4px 1px 15px 0px rgba(0, 0, 0, 0.62);
}


header{
	padding-bottom:20px;
	width:360px;
}
h1{
	display:block;
	text-align:center;
	padding-top:10px;
}

h1 a{
	font-weight:normal;
	font-size:14pt;

}

#nav-drawer{
	position:relative;		
}

.nav-unshown{
	display:none;/*チェックボックス削除用*/
}

#nav-open{
	display:inline-block;
	width:0;/*アイコンの横スペース*/
	height:0;/*アイコンの上スペース*/
	vertical-align:middle;
	position:fixed;
	top:10px;
	margin-left:10px;
}

#nav-open span,#nav-open span:before,#nav-open span:after{
	position:absolute;
	height:2px;/*線の太さ*/
	width:25px;/*長さ*/
	border-radius:3px;
	background:#cec248;/*線の色*/
	display:block;
	content:'';
	cursor:pointer;
	opacity:0.9;
}

#nav-open span:before{
	bottom:-3px;/*アイコンの間隔1*/
}

#nav-open span:after{
	bottom:-6px;/*アイコンの間隔2*/
}

#nav-close{
	display:none;/*はじめは隠しておく*/
	position:fixed;
	z-index:99;
	top:0;/*全体に広がるように*/
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
	opacity:0;
	transition:.3s ease-in-out;
}

#nav-content{
	overflow:auto;
	position:fixed;
	top:0;
	left:0;
	z-index:9999;/*最前面に*/
	width:90%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width:220px;/*最大幅*/
	padding-bottom:20px;
	height:100%;
	background:#2c224b;/*メニューの背景色*/
	transition:.3s ease-in-out;/*滑らかに表示*/
	-webkit-transform translateX(-105%);
	transform:translateX(-105%);/*左に隠しておく*/
}

#nav-close::after{
	content:'\02715''\0020''CLOSE';
	font-size:18pt;
	color:#fff;
	font-weight:bold;
	position:absolute;
	top:5px;
	left:230px;
}

#nav-input:checked ~ #nav-close {
	display:block;/*カバーを表示*/
	opacity:0.9;
}

#nav-input:checked ~ #nav-content {
	-webkit-transform:translateX(0%);
	transform:translateX(0%);/*中身を表示（右へスライド）*/
}
nav ul{
	border-bottom:1px dashed #000;
	border-top:1px dashed transparent;
	margin:0 20px;
	padding:15px 0;
}

nav ul li{
	font-size:10pt;
	padding:10px 5px
	text-indent:2em;
	color:#f5f5f5;
	font-family:"WebSubsetFont";
	font-weight:bold;
}

nav ul li a{
	display:block;
	padding:10px 5px;
	font-weight:normal;
	font-size:9pt;
	font-family:"menufont","WebSubsetFont","メイリオ";
}


nav ul li a:hover,nav ul li a:active{
	color:#fff;
	opacity:0.5;
	transition-property:opacity;
	transition-duration:2s;
}

section{
	margin:10px auto;
	padding:10px;
	width:340px;
}

h2{
	margin:40px 10px;
	margin-bottom:15px;
	color:#1c1c1c;
	display:inline-block;
	font-weight:normal;
	font-size:14px;
	padding:5px 6px;
}

h3{
	display:inline-block;
	padding-left:7px;
	font-size:13px;
	font-weight:normal;
	font-family:"menufont","WebSubsetFont","メイリオ";
	margin:20px 10px 6px;
	padding:5px 8px;
}

.clear{
	clear:both;
}


section p{
	margin:3px 0 6px 15px;
	color:#ddd;
	font-size:8pt;
	text-indent:-1em;
	padding-left:1em;
}

section  p a{
	font-size:8pt;
}

details{
	margin:5px 0 10px 13px;
}

details summary{
	font-size:8pt;
}

.fullname{
	opacity:0.7;
	font-size:80%;
	color:#2d200e;
	text-shadow:4px 2px 2px rgba(0,0,0,0.3);
}