@charset "UTF-8";

/*-----------------------------------

CSS Information

Site URL:			https://www.sostap.or.jp/
File name:			top.css (https://www.sostap.or.jp/css/top.css)

-----------------------------------*/

/*-------------------------
__top_style
-------------------------*/

.viewer {
	margin: 0 auto;
	width: 960px;
	height: 250px;
	text-align: left;
	overflow: hidden;}

.viewer ul {
	width: 960px;
	height: 250px;
	text-align: left;
	overflow: hidden;
	position: relative;}

.viewer ul li {
	top: 0;
	left: 0;
	width: 960px;
	height: 250px;
	display: none;
	position: absolute;}

#main_contents{
	width:960px;
	margin:0 auto;}

#contents_list{}

.contents{
	float:left;
	width:305px;
	height:220px;
	margin:25px 0 0 0;
	position:relative;
	background-color:#6394FF;}

.contents a{
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}

.contents a:hover{
	background-color:#fff;
    filter:alpha(opacity=30);
    -moz-opacity: 0.3;
    opacity: 0.3;}

.contents ul{
	padding:15px;}

.contents ul li{
	 font-size:12px;
	 line-height:21px;
	 margin:0 0 5px 0;
	 color:#fff;}
.contents ul li.other{
	font-size:11px;
}

.topics_box{
	float:left;
	width:592px;
	height:425px;
	margin:25px 22px 0 0;
	padding:20px;
	background-color:#fff;
	position:relative;}

.topics_box img{
	vertical-align:top;}

.topics_box .topics_title{
	position:absolute;
	top:0;
	right:0;}

.topics_box .topics_btn{
	position:absolute;
	top:10px;
	right:10px;}

.topics_box .topics_btn a{}

.topics_box .topics_btn a:hover img{
	opacity:0.8;
	filter:alpha(opacity=80);
	-ms-filter: “alpha( opacity=80 )”;}

.topics_box ul{
	margin:30px 0 0 0;
	padding:0 10px 0 0;
	height:395px;
	overflow:auto;
	font-size:13px;
	line-height:23px;}

.topics_box ul li{
	margin:0 0 5px 0;
	padding:0 0 10px 0;
	border-bottom:1px dotted #CCC;}

.topics_box ul li span{
	font-weight:bold;}

.topics_box ul li a{
	color:#0055BB;}

.topics_box ul li a:hover{
	color:#6699D6;}

#contents_list{
	 width:1000px;}

#contents_list .contents{
	margin:25px 22px 0 0;}

.announcement{ width: 960px; margin: 15px auto 0; padding: 15px; box-sizing: border-box; background-color: #FFFFFF;}
.announcement .title{ margin: 0 0 10px; font-size: 17px; line-height: 1; font-weight: 700; color: #0055BB;}
.announcement .title span{ font-size: 14px; font-weight: normal; color: #000;}

.announcement p{ font-size: 14px; line-height: 18px;}
.announcement p + p{ margin: 5px 0 0;}
.announcement p .bold{ font-size: 15px; font-weight: 700;}
.announcement a{ font-size: 14px; color: #0055BB; /*font-weight: bold; color: #ED0408;*/}
.announcement a:hover{ opacity:0.8; filter:alpha(opacity=80); -ms-filter: “alpha( opacity=80 )”;}

.announcement strong{ font-weight: 700;}

.announcement .cell_box{ display: table; width: 100%;}
.announcement .cell_box + .cell_box,
.announcement .cell_box + p{ margin: 10px 0 0;}
.announcement .cell_box .cell{ display: table-cell;}
.announcement .cell_box .cell:first-child{ width: 6em;}

.announcement hr{ margin: 10px 0 15px; border: none; border-top: 1px solid #CCC;}