@charset "utf-8";

/* -----------------------------------------------------------
	Site Name: sakushin-univ web site
	Author: Yamazen Communications co.,ltd.
	Comment: list style
	Since2014
----------------------------------------------------------- */
	
/*Index
	01.structure
	02.thumbnail-area
	03.list-area
	04.pager
	05.responsive style
----------------------------------------------------------- */


/* 01.structure
----------------------------------------------------------- */
div#container,
div#contents{overflow:visible;}


/* 02.thumbnail-area
----------------------------------------------------------- */
#topics-thum{
	width:733px;
	margin:0 0 30px;
	letter-spacing: -.40em;
}
#topics-thum li{
	display:inline-block;
	*display:inline;
	width:150px;
	margin:0 33px 10px 0;
	vertical-align:top;
	letter-spacing: normal;
	zoom:1;
}
#topics-thum li a{
	display:block;
	overflow:visible;
}
#topics-thum li a:hover{
    opacity:0.50;
    filter: alpha(opacity=50);
}
#topics-thum li a span{
	display:block;
}
#topics-thum li a span.pic{
	width:150px;
	height:150px;
	border-radius: 10px;        /* CSS3²Ý°¸ */  
    -webkit-border-radius: 10px;    /* Safari,Google ChromeÓÃ */  
    -moz-border-radius: 10px;   /* FirefoxÓÃ */  
}
#topics-thum li a span.icon{
	margin:-50px 0 0 -15px;
	width:59px;
	height:59px;
}
#topics-thum li a span.title{
	bottom:0;
	width:100%;
	padding:5px 0;
}


#topics-thum li.info span.icon   {background:url(/common/img/icon_info.png)   no-repeat left center;}
#topics-thum li.event span.icon  {background:url(/common/img/icon_event.png)  no-repeat left center;}
#topics-thum li.senior span.icon {background:url(/common/img/icon_senior.png) no-repeat left center;}
#topics-thum li.repo span.icon   {background:url(/common/img/icon_report.png) no-repeat left center;}







/* 03.list-area
----------------------------------------------------------- */
#topics-list{
	position: relative;
}
#topics-list li{
	min-height:70px;
	padding:25px 0 10px 70px;
	border-top:1px #cccccc dotted;
}
#topics-list li.info     {background:url(/common/img/icon_info.png)   no-repeat left 5px;}
#topics-list li.event    {background:url(/common/img/icon_event.png)  no-repeat left 5px;}
#topics-list li.senior   {background:url(/common/img/icon_senior.png) no-repeat left 5px;}
#topics-list li.repo     {background:url(/common/img/icon_report.png) no-repeat left 5px;}
#topics-list li.important{background:url(/common/img/icon_important.png) no-repeat left 5px;}
#topics-list li.press    {background:url(/common/img/icon_press.png) no-repeat left 5px;}

#topics-list li .date{
	margin: -10px 0 0;
}
  
  

/* 04.pager
----------------------------------------------------------- */
ul.pager {
	clear:both;
	margin:0;
	padding:15px 0 0;
	text-align:center;
	border-top:1px solid #c8c8c8;
}
ul.pager li {
    display: inline-block;
	*display:inline;
    margin: 5px 10px 5px 0;
}
ul#pager-num{
    clear: both;
	margin:0;
    padding: 10px 0;
	border:none;
}
ul#pager-num li {
    display: inline-block;
	*display:inline;
    width: 3.5em;
    font-weight: bold;
    line-height: 1.5;
    margin: 2px;
    padding: 0;
    text-align: center;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	zoom:1;
}
ul#pager-num li a {
    display: block;
    *display: inline;
    width: 3.5em;
    border: 1px solid #1b3c5f;
    line-height: 1.5;
    padding: 12px 2px;
    text-align: center;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	zoom:1;
}
ul#pager-num li a:link {
    background: none repeat scroll 0 0;
}
ul#pager-num li a:visited {
    background: none repeat scroll 0 0;
}
ul#pager-num li a:hover {
    color:#ffffff;
    border: 1px solid #ff6400;
    background:#ff6400;
}
ul#pager-num li.prev,
ul#pager-num li.next,
ul#pager-num li.list,
ul#pager-num li.top{
    border: none;
    width: inherit;
	*width:auto;
    background:#1b3c5f;
	zoom:1;
}
ul#pager-num li.prev a,
ul#pager-num li.next a,
ul#pager-num li.list a,
ul#pager-num li.top a {
    width: inherit;
	*width:auto;
	padding:5px 20px 5px 40px;
	color:#ffffff;
    border: 1px solid #1b3c5f;
	zoom:1;
}
ul#pager-num li.prev a:hover,
ul#pager-num li.next a:hover,
ul#pager-num li.list a:hover,
ul#pager-num li.top a:hover {
    color: #ffffff;
}
ul#pager-num li.pageCurrent {
    display: inline-block;
	*display:inline;
    width: 3.5em;
    margin: 2px;
    padding: 12px 2px;
    color: white;
    line-height: 1.5;
    text-align: center;
    border: 1px solid #1b3c5f;
    background:#1b3c5f;
	zoom:1;
}
ul.pager li.list{float:right;}





/* 05.responsive style
----------------------------------------------------------- */
@media only screen and (max-width: 640px){
#topics-thum{
	width:100%;
	text-align:center;
/*	text-align: center;
	letter-spacing:-0.4em;*/
}
#topics-thum li{
	margin:0 15px 10px;
/*	display: inline-block;
	letter-spacing:normal;*/
}
}
@media only print, only screen and (min-width: 641px){
/*#topics-thum li{float: left;}*/
}*/