@charset "UTF-8";
/*******************************
	Right Frame
********************************/
#container > p {/*txt.html用*/
	margin-top: 0;
}

/* Header */
header {
	background:#111;
	text-align:center;
	color:#FFF;
}
header ul {
	padding: 0;
	border-bottom: 5px solid #598D9E;
}
header .fa {
	font-size: 18px;
}
header .set-row-l li a,header .toggle-list .fa{
	display: block;
	color:#FFF;
	line-height:44px;
	padding: 0 2em;
	text-decoration:none;
}
header a:hover,.toggle-list:hover {
	background: #598D9E;
	color:#FFA820;
	cursor: pointer;
	transition: 0.5s;
}

/* Top Hide Menu */
#menu {
	display: none;
	background:#333;
	text-align:left;
}
#menu ul {
	border-bottom: 0;		
}
#menu li {
	width:20%;
	border-bottom:1px solid #598D9E;
}
#menu .fa {
	font-size: 90%;
	margin-right: 0.5em;/*上段と別調整*/
}
header #menu li a{
	padding: 0 5px;/*上段と別調整*/
}
#menu .close{/*Menu Close*/
	display:block;
	font-size: 150%;
	text-align:center;
	color:#FFF;
	background:#598D9E;
	margin:0;
}
#menu .close:hover{
	background:#27687E;
}
/*******************************
	contents
********************************/
#container {
	padding:29px 24px;
	font-size:15px;
}
h1 {
	margin-bottom: 29px;
}
img {
	border:1px solid #333;
}
.social {
	margin: 24px auto;
	border-top: 1px solid #C0C6C9;
	padding: 12px 24px 0;
	text-align: right;
}
.social div{
	margin: 0 1em;
}
/*******************************
	List-Box
********************************/
.list {
	margin:43px auto 0;
	padding:0.5em 0;
}
.list h2{
	margin-top:0;
}
.list h2:before{
	content:"No.";
}
.list p {
	margin:0.25em 0;
	clear: none;
}
.list img {
	float:left;
	margin: 0 1em 1em 0;
}
.list img:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);/* ie 6 7 */
	-ms-filter: "alpha(opacity=780)";/* ie 8 */
	-moz-opacity:0.7;/* FF lt 1.5, Netscape */
	-khtml-opacity: 0.7;/* Safari 1.x */
	zoom:1;
	color:#CF4725;
	background:none;
}
.lr12-img a{
	float:left;
	line-height: 1;
	margin-bottom: 24px;
}
.list .creator {/*作者名*/
	font-weight: bold;
}
/* button */
.list .button {
	list-style:none;
	clear:none;
	padding-left: 0;
}
.list .button li {
	float: left;
}
.list .button li a {
	font-size:small;
	font-weight: bold;
	margin:0 0.5em 1em 0;
	padding:0 1em;
	line-height:40px;
}
.list .topi a:before,.list .detail a:before,.list .down a:before{
	font:120% FontAwesome;
	vertical-align: middle;
	margin-right:0.25em;
}
.list .topi a:before{
	content:"\f086";
}
.list .detail a:before{
	content:"\f0f6";
}
.list .down a:before{
	content:"\f019";
}
/* Creator's Comment */
.cm-title {
	font-weight:bold;
	color: #555;
}
.cm-title:before {
	content:"\f10d";
	font:200% FontAwesome ;
	margin-right:13px;
	color:#C0C6C9;
	vertical-align: middle;
}

/*******************************
	Footer
********************************/
footer {
	text-align:center;background:#111;
	color:#AAA;
	font-size: 14px;
	padding:29px 50px 29px 5px;
}/*Pagetop Buttonで隠れないように*/
footer p {
	margin: 0;
}

/*******************************
	Stage Concept(.txt)
********************************/
.edit-txt-top {
	border-top: 13px solid #65B981;
	border-bottom: 13px solid #65B981;
}
p .fa-arrow-left {
	margin-right:0.5em;
}
.level-concept dd{
	margin:0 0 13px 3em;
}
.lr-pg-list{/*LR PG*/
	margin-left:1em;
}
.lr-pg-list li{
	list-style:none;
}
.lr-pg-list .fa-file-text-o{
	margin:0 5px;
}
dd p {
	margin: 0;
}
/*******************************
	レスポンシブ
********************************/
@media screen and (max-width: 800px) {
#container {
	padding: 29px 5px;
}
header .left-menu{/*Frame 表示ボタン*/
	display: none;
}
#menu li {
	width:25%;
}
footer {
	text-align:left;
}
}
@media screen and (max-width: 640px) {
header li {
	width:25%;
}
#menu li {
	width:50%;
}
h1 {
	text-align:center;
}
.list .topimg {
	float:none;
}
.list p {
	clear:left;
}
.social {
	padding: 12px 0;
}
}