@charset "utf-8";

#navMenu { display: none; }
nav { width: 100%; background: rgb(203,175,128); }
nav ul { width: 72%; display: flex; margin: 0 auto; }
nav ul li { width: 12.5%; text-align: center; }
nav ul li a { padding: 1rem 0; transition: .3s; }
nav ul li a:hover { color: #f00; }
/* 投稿 */
.post { width: 70%; margin: 1rem auto; }
.post-sp { display: none; }
.post table { width: 630px; margin: 0 auto; }
.post table th { vertical-align: top; }
.post table td a { display: inline; color: #66f; transition: .3s ease-out; }
.post table td a:hover { color: #aaf; }
@media all and (max-width: 1024px) {
	#navMenu { display: block; font-weight: bold; text-align: center; padding: 1rem 0; }
	nav ul li { text-align: left; }
	/* ハンバーガーメニュー */
	div#btn { text-align:left; position:fixed; top:15px; right:14px; z-index:999;}
	.menu-trigger, .menu-trigger span { display:inline-block; transition:all .4s; box-sizing:border-box; }
	.menu-trigger { position:relative; width:36px; height:30px; cursor:pointer; }
	.menu-trigger span { position:absolute; left:0; width:100%; height:4px; background-color:#aaa; border-radius:4px; }
	.menu-trigger span:nth-of-type(1) { top:0; }
	.menu-trigger span:nth-of-type(2) { top:13px; }
	.menu-trigger span:nth-of-type(3) { bottom:0; }
	.menu-trigger.active span:nth-of-type(1) { -webkit-transform:translateY(13px) rotate(-45deg); transform:translateY(13px) rotate(-45deg); }
	.menu-trigger.active span:nth-of-type(2) { opacity:0; }
	.menu-trigger.active span:nth-of-type(3) { -webkit-transform:translateY(-13px) rotate(45deg); transform:translateY(-13px) rotate(45deg); }
	/* オーバーレイ */
	#overlay { position:fixed; top:0; left:0; background:rgba(0,0,0,0.6); height:100%; width:100%; margin-left:-100%; z-index:9999; }
	/* レスポンシブメニュー */
	nav { overflow: scroll; position: fixed; top: 0; left: 0; width: 260px; margin-top: 0; margin-left: -280px; height: 100%; background: #f0f0f0; z-index: 9999; }
	nav ul { flex-direction: column; width: 100% }
	nav ul li { width: 100%; border-bottom: 1px solid #888; }
	nav ul li a { padding-left: 1rem; }
	/* 投稿 */
	.post { display: none; }
	.post-sp { display: block; }
}