@charset "UTF-8";


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

.clearfix {
  min-height: 1px;
}




html{
	height:100%;
}

body{
	/*background-image:url(../img/chr_masterbg.jpg);*/
	background-color:#000;
	height:100%;
}

#chronicle{
	width: 100%;
	overflow: hidden;
	background-image: url(../img/chr_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;

	background-image: url(../img/chr_bg_min.jpg) !important;
	background-repeat: repeat-x !important;

}

@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:2200px;
	padding-bottom:50px !important;
}

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

#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: 170px;
	padding: 5px;
	background-color: #ddd;
	border-radius: 5px;
	background-image: url(../img/silver.jpg);
}

#chronicle_con #shortcut a{
	display:block;
	border:1px #aaa dotted;
	border-width:0 0 1px 0;
	padding:8px 10px;
	font-size:12px;
	color:#333;
}
#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: 125px;
	top: 280px;
}

#chronicle_con #hotspot img{
	display:block;
	height:30px;
	/*background-color:#F00;
	opacity:0.3;*/
}

#chronicle_con #hotspot img.link{
	cursor:pointer;
}

#chronicle_con #hotspot #s1{
	margin-top: 0;
	width: 270px;
}

#chronicle_con #hotspot #s2{
	margin-top: 110px;
	width: 340px;
}

#chronicle_con #hotspot #s3{
	margin-top: 60px;
	width: 380px;
}

#chronicle_con #hotspot #s4{
	margin-top: 60px;
	width: 380px;
}

#chronicle_con #hotspot #s5{
	margin-top: 78px;
	width: 340px;
}

#chronicle_con #hotspot #s6{
	margin-top: 65px;
	width: 340px;
}

#chronicle_con #hotspot #s7{
	margin-top: 112px;
	width: 340px;
}

#chronicle_con #hotspot #s8{
	margin-top: 93px;
	width: 340px;
}

#chronicle_con #hotspot #s9{
	margin-top: 62px;
	width: 340px;
}

#chronicle_con #hotspot #s10{
	margin-top: 44px;
	width: 340px;
}

#chronicle_con #hotspot #s11{
	margin-top: 48px;
	width: 360px;
}

#chronicle_con #hotspot #s12{
	margin-top: 116px;
	width: 320px;
}

#chronicle_con #hotspot #s13{
	margin-top: 185px;
	width: 320px;
}


#chronicle_con #images{
	/*z-index:102;*/
}
#chronicle_con #images img{
	position:absolute;
	display:none;
}

#chronicle_con #images img#img1{
	left: 500px;
	top: 180px;
}
#chronicle_con #images img#img2{
	left: 450px;
	top: 300px;
}
#chronicle_con #images img#img3{
	left: 460px;
	top: 430px;
}
#chronicle_con #images img#img4{
	left: 450px;
	top: 500px;
}
#chronicle_con #images img#img5{
	left: 430px;
	top: 550px;
}
#chronicle_con #images img#img6{
	left: 400px;
	top: 700px;
}
#chronicle_con #images img#img7{
	left: 500px;
	top: 700px;
}
#chronicle_con #images img#img8{
	left: 400px;
	top: 900px;
}
#chronicle_con #images img#img9{
	left: 525px;
	top: 1000px;
}
#chronicle_con #images img#img10{
	left: 405px;
	top: 1100px;
}
#chronicle_con #images img#img11{
	left: 350px;
	top: 1200px;
}
#chronicle_con #images img#img12{
	left: 355px;
	top: 1300px;
}
#chronicle_con #images img#img13{
	left: 409px;
	top: 1400px;
}


#tw{
	position:fixed;
	left:0;
	bottom:0;
	width:100%;
	min-width:1000px;
	color:#FFF;
	font-size:10px;
	min-height:50px;
	background-color:#000;
	z-index:999;
	background-color:#494949;
	background-image:url(../img/chr_tw_bg.jpg);
	background-repeat:repeat-x;
	border:1px #666 solid;
	border-width:1px 0 0 0;
}

#tw-area{
	width:1000px;
	margin:0 auto;
}

#tw-area img{
	margin:0 10px;
	display:block;
	float:left;
}

#tw-area iframe.twitter-hashtag-button{
	margin-top:11px;
}


#tw-area #tw-opnr{
	float:right;
	cursor:pointer;
	
}

#tw-area #tweets{
	background-color:#999;
	width:980px;
	margin:0px auto;
	height:0;
	overflow:hidden;
	margin-top:5px;
}

#tw-area #tweets iframe{
	width:980px;
}


/*----TITLE----*/
.title-changer{
	position:fixed;
	top:250px;
}

#prev-title{
	left:0px;
}

#next-title{
	right:0px;
}

#frame{
	padding-bottom:100px !important;
	background-image: url(../img/chr_bg_min.jpg) !important;
}


#title-name{
	display:block;
	margin:0 auto;
	margin-bottom:20px;

}

#frame_con{
	width:1000px;
	margin:0 auto;
	padding-top:40px !important;
}

#frame_con #visual{
	float: right;
	width: 393px;
	text-align: right;
}

#frame_con #visual a img{
	margin-top:10px;
}


#frame_con #detail{
	width:490px;
	font-size:14px;
	float:left;
	color:#333;
	line-height:1.5;
}

#frame_con #detail h{
	display:block;
	font-size:150%;
	font-weight:bold;
	padding-bottom:5px;
	margin-bottom:2px;
	margin-left:-2px;
	border:1px #999 dotted;
	border-width:0 0 1px 0;
}

#frame_con #detail h span{
	font-size:75%;
	margin-left:10px;
}


#frame_con #detail span#platform{
	display:block;
	font-size:75%;
	color:#999;
	margin-bottom:10px
}


#frame_con #detail .bt-mov{
	display:block;
	width:320px;
	height:175px;
	position:relative;
	margin-top:20px;
}

#frame_con #detail .bt-mov img{
	position:absolute;
	top:40px;
	left:113px;
}

#frame_con #detail #caps{
	margin-top:22px;
}

#frame_con #detail #caps a{
	display:block;
	width:150px;
	position:relative;
	background-repeat:no-repeat;
	float:left;
	margin:0 10px 10px 0;
}

#frame_con #detail #caps a.cap{
	height:100px;
}

#frame_con #detail #caps a.pr{
	height:100px;
}

#frame_con #detail #caps a img{
	position:absolute;
	right:0;
	bottom:0;
}

p.small{
	font-size:75% !important;
	color:#999 !important;
}

a#chr-top img{
	display:block;
	margin:20px auto;
}
 
#chronicle_con #bnn-enquete {
position: absolute;
top: 75px;
right: 25px;
}