* {font-family:'游ゴシック体','Yu Gothic',YuGothic,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ヒラギノ','メイリオ',Meiryo,sans-serif}
body,dd,dl,dt,form,h1,h2,h3,h4,h5,h6,img,pre,p {border:0; margin:0; padding:0}
body {
	text-align: center;
	background:#FFFFFF;
	font-size: 14px;
	line-height:175%;
	*font-size: small;
	*font: x-small;
	text-align:left;
}


/*------------------------------------------------------------------------
topics/
--------------------------------------------------------------------------*/

#topicsBox{width:100%; height:248px; background:#FFFFFF; overflow:auto;}
#topicsBox ul{width:100% !important; margin:0; padding: 10px 0; overflow: hidden; color:#000; border-bottom:1px solid #e1e1e1;}
#topicsBox ul li{margin:0; padding:0; list-style:none; color:#333333;}
#topicsBox ul li.day{
	display:block;
	width:100%;
	margin:0 !important;
	font-family:'Lato', sans-serif;
	font-style:italic;
	color:#333;
}

#topicsBox ul li.icon{width:50px; margin:0 10px 0 0;}
#topicsBox ul li.txt{
	display:block;
	margin:0;
	white-space:nowrap;
	overflow:hidden;
	-o-text-overflow:ellipsis;
	text-overflow:ellipsis;
}

#topicsBox ul li a{color:#000; text-decoration:none;}
#topicsBox ul li a:hover{color:#000; text-decoration:underline;}



.day {
	width:100%;
	margin:0;
	font-family:'Lato', sans-serif;
	font-style:italic;
	color:#333;
}

.txt {
	display:block;
	margin:0;
	white-space:nowrap;
	overflow:hidden;
	-o-text-overflow:ellipsis;
	text-overflow:ellipsis;
	border-bottom: 1px dotted;
}


.imp {
	content: 'Important';
	font-weight: bold;
	font-size: .8em;
	color: #fff;
	background: #222;
	border-radius: 4px;
	margin-left: 10px;
	padding: 2px 4px;
	vertical-align: middle
}

.new {
	content: 'New';
	font-weight: bold;
	font-size: .8em;
	color: #fff;
	background: #c80000;
	border-radius: 4px;
	margin-left: 10px;
	padding: 2px 4px;
	vertical-align: middle
}


.newred {
	font-weight: bold;
	color: #ff0000;
}





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

#topicsBox{
	height:200px;
}

}

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

#topicsBox{
	height:170px;
}

}


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

#topicsBox{
	height:135px;
}


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

#topicsBox{width:100%;}

#topicsBox ul li.txt{display:block; width:100%; margin:0;}

#topicsBox{
	width:100%;
	height:150px;
	overflow:auto;
	-webkit-overflow-scrolling:touch;
}

.news {
	width:100%;
	height:300px;
	border:none;
	display:block;
}

}

.contentBox{width:720px; margin-top:20px;}

.topicsTitle{width:720px; border-bottom:1px solid #313131; padding:0 0 10px; margin:0 0 10px; font-size:1.5em;}
.topicsTitle p.day{width:130px; float:left; font-family:'Lato', sans-serif; font-style:italic;}
.topicsTitle p.heading{width:590px; float:right;}

.topicsWarp{width:720px;}
.topicsLeft{width:300px; float:left;}
.topicsLeft p{margin:0 0 20px;}
.topicsRight{width:400px; float:right;}

.topicsPt{width:720px; margin:20px auto 40px;}
.topicsPt a{display:block; width:95px; height:13px; text-indent:-9999px; background:url(../../img/btntop.gif) no-repeat top; margin-left:625px;}
.topicsPt a:hover{background-position:bottom;}

.topicsCenter p{margin:0 0 20px; width:720px;}
.topicsCenter img{float:left; margin-right:10px;}


.pdfBox{border:1px solid #999999; padding:8px 8px 8px 33px; background:url(../../topics/img/i_adobe.gif) left top no-repeat; background-position:10px 50%; font-size:12px; display:inline;}

.pdfBox a{color:#333333; text-decoration:none;}
.pdfBox a:hover{text-decoration:underline;}

.clr{clear: both;}

#topicsContent{padding-top:30px; width:720px; text-align:left;}


/* --------------
scroll bar
-------------- */
.jspContainer{overflow:hidden; position:relative;}
.jspPane{position:absolute;}
.jspVerticalBar{background:#000; width:5px; height:100%; position:absolute; top:0; right:0;}
.jspVerticalBar *{margin:0; padding:0;}
.jspCap{display:none;}
.jspTrack{background:#CCC; position: relative;}
.jspDrag{background:#858585; width:5px; position:relative; top:0; left:0; cursor:pointer;}

/* CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner{margin: 0 -3px 0 0;}