@charset "UTF-8";

ul.content{
	margin: 5px 20px;
}
ul.content li{
	line-height: 12pt;
	font-weight: bold;
}




/*メインコンテンツ内の「What's New」部分
---------------------------------------------------------------------------*/
#main dl {
	/*height: 200px;		/*What's Newボックスの高さ*/
	overflow: auto;		/*この設定でiframe風に見える*/
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;
	padding: 5px 10px;
	
	border-right: 1px solid #ccc;	/*What's Newのフチの右ライン*/
	border-bottom: 1px solid #ccc;	/*What's Newのフチの下ライン*/
	border-left: 1px solid #ccc;	/*What's Newボックスの背景色*/
	line-height: 1.4;
}

#main .new dt {
	padding: 10px;
	font-weight: bold;	/*日付の文字を太字に。通常がよければこの１行を削除する。*/
}
#main .progress dt {
	font-weight: bold;	/*日付の文字を太字に。通常がよければこの１行を削除する。*/
}


#main .new dd {
	border-bottom: 1px solid #ccc;	/*説明文の下に1pxの直線(solid)を#919589の色で入れる。*/
	padding: 40px 5%;
	
}

#main .progress dd{
	border-bottom: 1px solid #ccc;	/*説明文の下に1pxの直線(solid)を#919589の色で入れる。*/
	padding-left: 30px;
}

#main .new dd img{
	float: left;
	max-width: 150px;
	width: 40%;
	max-height: 150px;
	margin-right: 5%;
}

dd .clear{
	clear: both;
}


#main #career-frame{
	width: 100%;
}
#main #career-frame td{
	width: 50%;
	vertical-align: top;
	padding: 0.5% 2%;
}

#main #career-frame td img{
	width: 100%;
}

	dd meter{
		width: 20%;
		margin-right: 20px;
	}



#item-container{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	align-content: stretch	;

}

@media screen and ( min-width:769px ){
	.item{
		flex-basis: 40%;
		margin: 30px;
	}
}
@media screen and ( max-width:769px ){
	.item{
		flex-basis: 100%;
		margin: 30px;
	}
}
.image img{
	width: 100%;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}