@charset "UTF-8";


.clearfix:after {
  content: "　";  
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}



#chronicle{
	width: 100%;

}

@media screen and (max-device-width:800px){
	#chronicle{
		background-image: url(../img/chr_bg_min.jpg) !important;
		background-repeat: repeat-x !important;
	}
}

.chr-top{
	min-height: 15500px;
	padding-bottom: 50px !important;
}

#chronicle_con{
	width:1000px;
	margin:0 auto;
	position:relative;
}

#chronicle_con h2{ margin-top:40px; margin-left:10px; text-align:center; }

#chronicle_con #base{
	position:absolute;
	/*z-index:101;*/
	margin-left:37px;
}

#chronicle_con #base img{
	display:block;
	margin:0;
}


#chronicle_con #shortcut{
	position: absolute;
	top: 190px;
	right: 10px;
	width: 184px;
	background-color: #ddd;
	background-image: url(../img/list_navi.gif);
	z-index: 499;
}

#chronicle_con #shortcut a{
	display: block;
	border: 1px #ccc dotted;
	border-width: 0 0 1px 0;
	padding: 8px 10px;
	font-size: 12px;
	color: #FFF;
}
#chronicle_con #shortcut a:hover{ color:#F00;}
#chronicle_con #shortcut a.active{
	background-image:url(../img/chr_shortcut_actvIcon.png);
	background-position:center right;
	background-repeat:no-repeat;
}

#chronicle_con #shortcut a:first-child{
	/*border:0;*/
}

#chronicle_con #shortcut a#pagetop{
	width:100px;
	margin:20px auto;
	border:0;
	text-align:center;
	background-color:#bbb;
	border-radius:3px;
	padding:2px;
	font-weight:bold;
	border:1px #aaa solid;
}

#chronicle_con #hotspot{
	/*z-index: 103;*/
	position: absolute;
	left: 0px;
	top: 140px;
}




#chronicle_con #hotspot #s1{ margin-left:100px;}
#chronicle_con #hotspot #s2{ margin-left:100px;}
#chronicle_con #hotspot #s3{ margin-left:100px;}
#chronicle_con #hotspot #s4{ margin-left:100px;}
#chronicle_con #hotspot #s5{ margin-left:100px;}
#chronicle_con #hotspot #s6{ margin-left:100px;}
#chronicle_con #hotspot #s7{ margin-left:100px;}
#chronicle_con #hotspot #s8{ margin-left:100px;}
#chronicle_con #hotspot #s9{ margin-left:100px;}
#chronicle_con #hotspot #s10{ margin-left:100px;}
#chronicle_con #hotspot #s11{ margin-left:100px;}
#chronicle_con #hotspot #s12{ margin-left:100px;}
#chronicle_con #hotspot #s13{ margin-left:100px;}
#chronicle_con #hotspot #s14{ margin-left:100px;}
#chronicle_con #hotspot #s15{ margin-left:100px;}
#chronicle_con #hotspot #s16{ margin-left:100px;}
#chronicle_con #hotspot #s17{ margin-left:100px;}
#chronicle_con #hotspot #s18{ margin-left:100px;}
#chronicle_con #hotspot #s19{ margin-left:100px;}
#chronicle_con #hotspot #s20{ margin-left:100px;}

#hotspot .date{ float:left; clear:both;}

.cellbox{
	width: 600px;
	padding-left: 45px;
	border-left: solid 1px #CCCCCC;
	float: left;
	margin-left: 10px;
	margin-bottom: 90px;
}
.cellbox h3{
	padding-bottom: 20px;
}
.cellbox h4{
	font-size: 16px;
	font-weight: normal;
	color: #999;
	line-height: 150%;
}
.cellbox h5{
	font-size: 20px;
	font-weight: bold;
	padding-top: 20px;
	padding-bottom: 10px;
}
.cellbox p{
	font-size: 14px;
	line-height: 180%;
	padding-top: 15px;
	color: #666;
}
.cellbox .getsite{ margin-top:10px; text-align:right;}