/*-----------------------------------------------------	*/
/*	for all						*/
/*-----------------------------------------------------	*/
/* ----------------------------------------------------*/
/* normal sections */

.body li {
	display: block;
	float: left;
}

.titlethumb {
	margin-bottom: 10px;
}

h3.titletit {
	font-size: 12px;
	line-height: 1.2em;
	padding-bottom: 3px;
}

.titlemeta {
	font-size: 10px;
	color: #cccccc;
	letter-spacing: 0;
	line-height: 1.6em;
}

.box h2 {
	padding: 20px 0 10px;
}

.pagetop{
	display:none;
}

/* ----------------------------------------------------*/
/* list */

#list  {
	width: 98%;
	margin: 0 auto;
}

#list h2 {
	padding: 10px 0 20px;
	font-size: 100%;
	font-weight: bold;
	line-height: 140%;
	color: #fff;
	-webkit-text-shadow: 0px 1px 0px #111;
	text-shadow: 0px 1px 0px #111;
}

#list ul {
	margin-right: -20px;
	padding-bottom: 30px;
}

#list li {
	margin-left:-1px;
	width: 25%;
	*width: 24.9%;
	margin-bottom: 15px;
}

#list li article {
	padding-right: 20px;
}

#list .titlethumb img {
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border:solid 1px #222;
}

/* ------ Contents ------ */

#main {
	padding-top: 20px;
}

#main-title {
	width: 100%;
	padding: 10px 0 20px;
	font-size: 120%;
	font-weight: 900;
	line-height:1.2em;
	color: #fff;
	-webkit-text-shadow: 0px 1px 0px #000;
	text-shadow: 0px 1px 0px #000;
}

#left-column {
	float: left;
	width: 970px;
	padding-bottom: 20px;
	overflow: hidden;
	*zoom: 1;
}

.column2 article {
	float: right;
	width: 660px;
	margin-bottom: 0;
}

article section {
	padding: 0 0 30px;
	border-top: solid 1px #333;
}

article section:first-child {
	border-top: none;
}

article section h2 {
	padding: 10px 0 20px;
	font-size: 100%;
	font-weight: 500;
	line-height: 140%;
	color: #fff;
	-webkit-text-shadow: 0px 1px 0px #77dcfb;
	text-shadow: 0px 1px 0px #77dcfb;
	border-top: solid 1px #a2a2a2;
}

#contents-title {
	padding: 10px 0 20px;
	font-size: 130%;
	font-weight: bold;
	line-height: 140%;
	color: #000;
	-webkit-text-shadow: 0px 1px 0px #000;
	text-shadow: 0px 1px 0px #000;
	border-top: none;
}

article section p {
	font-size: 90%;
	line-height: 160%;
	color:#ccc;
}

article section ul {
	font-size: 90%;
	line-height: 160%;
	color:#ccc;
}

section .third {
	margin-right: 0;
}

.box {
	padding: 5px;
}

.box ul{margin:0;width:100%;}

.titlelogo{
	margin-bottom: 10px;
}

.titlemeta {
	font-size: 75%;
	margin-left:5px;
}

article .box h2 {
	padding: 20px 0 10px;
	border-top: none;
}

article .box p {
	font-size: 83%;
}

#pics{ 
	padding-top:10px;
}
#pics ul li {
	float: left;
	margin: 0 0 4px 4px;
	max-width:640px;
	padding:1px;
	background-color:#333;
}

#pics img {
	max-width:100%;
	*width:auto;
	*max-width:none;
	-webkit-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.7);
	-moz-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.7);
	-ms-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.7);
	box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.7);
}

.titlist {
	margin:30px;
}

.titlist li {
	list-style-type: square;
}

.copy {
	clear:both;
	font-size: 70%;
	line-height:120%;
	text-align:right;
}

.copyleft {
	clear:both;
	font-size: 70%;
	line-height:120%;
	text-align:left;
}

/* ------ Title Spec ------ */

#spec {
	float: left;
	width: 290px;
	margin-right: 20px;
	top: 0;
	left: 0;
	color:#ccc;
}

.titlelogo{
	margin:10px;
}
.titlelogo img{
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
#spec p {
	width: 100%;
}

/* ------ Table ------ */

.table {
	display: table;
	border-bottom: solid 1px #666;
	border-right: solid 1px #666;
	*border-left: solid 1px #666;
	margin-left:3px;
	margin-top: 3px;
}

.table .tbody {
	display: table-row-group;
}

.table dl {
	display: table-row;
	font-size: 76%;
	line-height: 160%;
	border-top: solid 1px #666;
	overflow: hidden;
	*zoom: 1;
}

.table dl dt,
.table dl dd {
	display: table-cell;
	*display: inline;
	padding: 5px 8px;
	border-top: solid 1px #666;
	border-left: solid 1px #666;
	*border-top: none;
	*border-left: none;
	vertical-align: middle;
	*zoom: 1;
}

.table .col1 {
	width: 25%;
	min-width:4em;
	background-color: #040438;
}
.table .col2 {
	*width: 59%;
}

.btn {
	display: block;
	width: 90%;
	margin: 15px auto;
}

/*-----------------------------------------------------	*/
/*	for - 979px					*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 979px) {

	#main {
		width: 100%;
	}

	#main-title {
		width: 95%;
		margin: 0 auto;
	}

	#left-column {
		float: none;
		width: 95%;
		margin: 0 auto;
	}

	#spec {
		width: 33%;
		margin: 0;
	}

	.column2 article {
		width: 65%;
	}

}



/*-----------------------------------------------------	*/
/*	for - 767px					*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 767px) {

	#list ul {
		margin-right: 0;
		padding-bottom: 0;
		border-bottom: 1px dotted #cecece;
		margin-bottom: 20px;
	}

	#list li {
		width: 100%;
		border-top: 1px dotted #cecece;
		margin-bottom: 0;
	}

	#list li article {
		position: relative;
		padding: 10px 0;
	}

	#list .titlethumb {
		float: left;
		width: 27.5%;
		padding-right: 2%;
		margin-bottom: 0;
	}

	#list .titletit {
		position: absolute;
		top: 40%;
		left: 27.5%;
		padding-left: 2%;
		margin-top: -17px;
	}

	#list .titlemeta {
		position: absolute;
		top: 60%;
		left: 27.5%;
		padding-left: 2%;
		line-height: 1.2em;
	}

	#list .itembody{
		display: none;
	}

	#main-title {
		padding: 20px 0 20px;
	}

	.column2 article {
		float: none;
		width: 100%;
	}

	#spec {
		float: none;
		width: 100%;
	}

	#spec ul{
		float: left;
		width: 40%;
	}

	#spec .table{
		float: right;
		width: 55%;
		margin:10px 0 10px;
	}

	#spec .btn,.btn a{
		clear: both;
		width: 280px;
	}

	.pagetop{
		display:block;
	}

}


/*-----------------------------------------------------	*/
/*	for - 479px					*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 479px) {
	#left-column{
		width:100%;
		padding:0 5px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		box-sizing: border-box;
	}

	#main-title {
		padding: 10px 0 10px;
		font-size: 130%;
	}

	#contents-title {
		font-size: 110%;
	}

	#spec ul,#spec .table{
		float: none;
		width: 100%;
	}

	.titlelogo{
		text-align:center;
	}

	#pics ul li {
		margin: 2px;
	}

	.copy {
		text-align:left;
	}
}


/*-----------------------------------------------------	*/
/*	for - 399px					*/
/*-----------------------------------------------------	*/

@media screen and (max-width: 399px) {
	#pics ul li {
		width: 100%;
		text-align:center;
		background: none;
		margin-left: -2px;
	}
}