@charset "utf-8";
* {
	margin: 0;
	padding: 0;
}
#header img{
}

#contents {
	width: 980px;
	background: #fff;
	overflow:hidden;
	margin:0 auto;
}

#menu {
	width: 120px;
	padding: 10px 0;
	background: #fff;
	height:100%;
	display:box;
	float: left;
	z-index:200;
	position: sticky;
	top:0px;
	bottom: 0;
 overflow-y: auto;
 overflow-x: no;

}

#menu::-webkit-scrollbar {
  display: none;
}

#menu #gnav {

}
#menu #gnav li {
	padding-left: 0px;
	margin: 0px;
	line-height:1em;
}
#menu #gnav li a{
font-size:14px;
color:#aaa;
}
.button {
	height:0px;
	margin: 0px;
}

.button span {
	display: inline-block;
	position: absolute;
	width: 100px;
	text-align: center;
}
.button span:nth-child(1) {
	background-color: #fff;
	color: #333;
 
}
.button span:nth-child(2) {
	background-color: #fff;
 
}
.button:hover span:nth-child(2) {
	display: none;
}

.button:hover span:nth-child(1) {
font-size:14px;
}
#menu #gnav li a.current span:nth-child(1) {
font-size:16px;
	color: #000000;
	text-decoration: none;
	font-weight:bold;
	background-color: #fff;
}

#menu #gnav li a.current span:nth-child(2) {
	display: none;

}

.main {
	overflow:hidden;
	width: 980px;
	margin-left:0px;

}

.contents {
	overflow:auto;
	width:1080px;
	height:100vh;
	position:relative;
}

#contents div.page  {
	padding-top: 0px;
	padding-left:0px;
	min-height:300px;
    	padding-top: 60px;
    	margin-bottom: -60px;
}

#contents div#contents01  {
    	padding-top: 60px;
    	margin-bottom: -60px;

}

.history h3{
border-top: 1px solid #000;
border-left: 8px solid #0162A7;
padding: 5px 10px;
color: #666;
font-size: 1.4em;
width: 880px;
margin-left: 170px;
margin-top: 10px;
}

.selectmenu{
	background: #fff;
	width:100%;
	display:box;
	height:60px;
position:fixed;
}


#btn {
	color:#666666;
	background: #E4E4E4;
	border: 1px solid #CCCCCC;
	font-size: 1em;
	padding: 5px 30px;
	width: 5em;
	margin-bottom: 1em;
	display: block;
	cursor: pointer;
	text-align: center;
	font-weight: bold;
	text-shadow: 1px 1px 1px #FFF;
	background : -webkit-gradient(linear,left top, left bottom,
	from(#F2F2F2), to(#BEBEBE));
	background : -moz-linear-gradient(top, #F2F2F2, #BEBEBE);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-moz-box-shadow: 2px 4px 2px #EBEBEB;
	-webkit-box-shadow: 2px 4px 2px #EBEBEB;
position:fixed;
left:220px;
}

#btn:hover{
	color:#FFFFFF;
	background : -webkit-gradient(linear, left top, left bottom,
		from(#CCCCCC), to(#808080));
	background : -moz-linear-gradient(top, #CCCCCC, #808080);
	text-shadow: -1px -1px 1px #666;
}

/* アニメーション */
#start {
position:fixed;
left:300px;
}

#box {
	width: 1740px;
    	margin-top: 0px;
    	margin-left: 130px;
	background: #fff;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	z-index:-200;
}
#start:checked ~ #box {
	margin-left: -710px;
}

.histable table{
	border: 1px #ddd solid;
	border-collapse: collapse;
}




.histable td,th{
font-size:.8em;;
border:1px solid #aaa;
line-height:1.3em;
padding:3px;
}

table.head{
position:fixed;
top:40px;
}

.histable td.sdata,th.sdata{
width:110px;
}

.histable td.wdata,th.wdata{
width:110px;

}

.histable td.time,th.time{
width:80px;

}

.histable td.place,th.place{
width:160px;

}

.histable td.visit,th.visit{
width:150px;

}

.histable td.person,th.person{
width:150px;

}

.histable td.other,th.other{
width:490px;
}


.histable td.year,th.year{
width:90px;
	background: rgba(255, 255, 255, .1);
}

.histable td.jhistory,th.jhistory{
width:260px;
	background: rgba(255, 81, 81, 0.2);

}

.histable td.ahistory,th.ahistory{
width:260px;
	background: rgba(81, 5, 255, 0.2);

}

.histable td.ehistory,th.ehistory{
width:260px;
	background: rgba(67, 169, 255, 0.2);

}
.histable tr:nth-child(even) {
	background: rgba(0.645, 0.045, 0.355, .05);
}
.histable tr:hover {
	background: #ff0;
}
.item{
	background: rgba(255, 255, 255,0.8);
padding:3px;
margin:3px;
border:1px solid #ddd;

}

#iframe{
border:0px solid #ccc;
}



.wrap {
  width: 100%;
}

.nav-dot {
position:relative;
top:155px;
left:50px;
}

.nav-dot li {
font-size:1px;
	list-style-type: none;
  width: 8px;
  height: 8px;
margin: 12px 40px 12px;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  color:transparent;
}

.nav-dot li.current {
  width: 13px;
  height: 13px;
margin: -5px 38px -4px;
  background: rgba(255, 255, 255, 1);
  -webkit-transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
}


.nav-dot_d {
position:relative;
top:0px;
left:125px;
margin-top: -406px;
}
.nav-dot_d li {
font-size:8px;
	list-style-type: none;
  width: 8px;
  height: 8px;
  margin: 11px 0px 11px;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  color:transparent;
}
#category_menu .nav-dot_d li a{
  color:transparent;
}

.nav-dot_d li a{
  color:transparent;
}


#category_menu02 .nav-dot {
position:relative;
top:346px;
left:50px;
}

#category_menu02 .nav-dot li {
font-size:8px;
	list-style-type: none;
  width: 8px;
  height: 8px;
  margin: 0px 40px 15px;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  color:transparent;
}
#category_menu02 .nav-dot li a{
  color:transparent;
}
#category_menu02 .nav-dot_d li.current {
  width: 13px;
  height: 13px;
  margin: 0px 0px 14px;
  background: rgba(255, 255, 255, 1);
  -webkit-transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
}

#category_menu02 .nav-dot_d {
position:relative;
top:-38px;
left:125px;
margin-top:0px;
}
#category_menu02 .nav-dot_d li {
font-size:1px;
	list-style-type: none;
  width: 8px;
  height: 8px;
margin:0px 2px 15.9px;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  transition: background 0.7s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
  color:transparent;
}

#category_menu02 .nav-dot_d li a{
  color:transparent;
}


tr {
}
#category_menu{
height:calc( 100% - 60px); 
z-index: 1;
overflow-x: hidden;
width:170px;
float:left;
padding-top: 0.5em;
}
#category_menu02{
height:calc( 100% - 50px); 
z-index: 1;
overflow-x: hidden;
width:170px;
float:left;
}
.category_menu_inner{
height:730px; 
width:150px;
background-image: url(../images/historyber.png);
}

#category_menu02 .category_menu_inner{
height:680px; 
width:150px;
background-image: url(../images/historyber2.png);
}
.histable{
float:right;
}
.fixed {
	border: 0px solid red;
	position: fixed;
	top: 0%;
	z-index: 90;
}

.th_fixed {
	border: 0px solid red;
	position: fixed;
	top: 0%;
	z-index: 90;
	background:#fff;
}

div.tabmenu{
display:table;
width:880px;
margin:10px auto;
}

div.bottan{
width:50%;
display:table-cell;
text-align:center;
}

div.bottan a{
width:90%;
display:block;
background:#eee;
border-radius:10px;
border:3px solid #aaa;
font-weight:bold;
	text-decoration: none;
	color: #000;
padding:0.5em;
}


div.bottan a.active{
	color: white;
	background-color: #000;
}