@charset "UTF-8";

/* =================================
common
================================= */

#container {
	background-color: #f0f0f0;
}
@media screen and (max-width: 640px) {
	#container {
		width: 100%;
	}
}

/* =================================
head
================================= */

.head .lang-link {
	max-width: 980px;
	margin: 0px auto;
	padding: 20px 0;
	font-size: 12px;
	text-align: right;
}


/* =================================
main-contents
================================= */

#main{
	position:relative;
	max-width:980px;
	margin:0 auto 80px;
}

	#main h1 {
		font-size:30px;
		margin:15px 0;
		padding-left:10px;
	}
	#main .lead {
		font-weight:normal;
		font-size:14px;
		line-height:1.8em;
		color:#404040;
		margin: 0 10px 30px;
	}
	#main h2 {
		font-size:16px;
		background:#e6e6e6;
		color:#404040;
		padding:18px 20px;
		line-height:1.25em;
		font-weight: normal;
	}
	#main .nav-list{
		overflow:hidden;
		margin-bottom: 50px;
	}

	#main .nav-list li{
		font-size:14px;
		float: left;
		margin-right: 40px;
	}
	@media screen and (max-width: 640px){
		#main .nav-list{
			margin-left:10px;
			margin-right:10px;
		}
		#main .nav-list li{

		}
	}
	#main .box{
		padding:50px 70px;
		background:#fff;
	}
		#main .box .open_source_list {
			border-top: none;
			font-size: 12px;
			line-height: 1.4;
		}

		#main .box .open_source_list thead th {
			padding: 15px 0;
			border-right: none;
			border-bottom:#ccc solid 1px;
		}

		#main .box .open_source_list tbody th {
			border-right: none;
			padding:10px 15px;
			vertical-align:top;
		}

		#main .box .open_source_list tbody th {
			padding:10px 15px;
			vertical-align:top;
		}

		#main .box .open_source_list tbody td {
			background:#FFF;
			padding:15px 0;
			border-bottom:#ccc solid 1px;
			vertical-align:top;
			width: 33.3333333%;
		}
	#main .readMeArea {
			margin: 30px 10px;
			line-height: 1.6;
	}

@media screen and (max-width: 640px) {
	#main h1 {
		font-size:18px;
	}
	#main .box{
		padding:40px 30px;
	}
		#main .box .open_source_list thead {
			display:none;
		}
		#main .box .open_source_list tbody tr + tr {
			display: block;
			margin-top: 40px;
		}
		#main .box .open_source_list tbody th {
			display:block;
		}
		#main .box .open_source_list tbody td {
			display:block;
			width: 100%;
		}
		#main .box .open_source_list tbody td::before {
			content: attr(label);
			float: left;
			clear:both;
			font-weight:bold;
			width: 40%;
		}
}