@charset "UTF-8";
a {
  text-decoration: none;
}
a:link {
  color: white;
}
a:visited {
  color: white;
}
a:hover {
  color: #00d3f2;
}
a:active {
  color: #00d3f2;
}

/* Reset Style */
html {
  overflow-y: scroll;
}

body {
  line-height: 1;
  color: #000;
}

/* html5doctor.com Reset Stylesheet v1.6.1
Last Updated: 2010-09-17 Author: Richard Clark - http://richclarkdesign.com Twitter: @rich_clark */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/* YUI 3.4.1 (build 4118) Copyright 2011 Yahoo! Inc. All rights reserved.
Licensed under the BSD License. http://yuilibrary.com/license/ */
body {
  font: 13px/1.231 arial,helvetica,clean,sans-serif;
  *font-size: small;
  *font: x-small;
}

select, input, button, textarea {
  font: 99% arial,helvetica,clean,sans-serif;
}

table {
  font-size: inherit;
  font: 100%;
}

pre, code, kbd, samp, tt {
  font-family: monospace;
  *font-size: 108%;
  line-height: 100%;
}

/* 汎用クラス */

.table_cell {
  display: table-cell;
  *display: inline;
  *zoom: 1;
  vertical-align: middle;
}


.box_size {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

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

/*-------------------------------------------
	global
	-----------------------------------------*/
body {
  margin: 0;
  padding: 0;
  position: relative;
  background-color: #fff;
  color: #fff;
  line-height: 1.6;
  font-family: "メイリオ", "Meiryo", verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}

#container {
  width: 100%;
  min-width: 980px;
  visibility: hidden;
}

/*-------------------------------------------
	#top
	-----------------------------------------*/
section#top {
  width: 100%;
  height: 700px;
  background: url("../images/bg_top.jpg") no-repeat center center;
  background-size: cover;
  position: relative;
}
section#top .logo_top {
  display: block;
  position: absolute;
  width: 348px;
  height: 348px;
  top: 50%;
  left: 50%;
  margin-left: -174px;
  margin-top: -174px;
}
section#top p {
  position: absolute;
  bottom: 50px;
  width: 48px;
  height: 48px;
  left: 50%;
  margin-left: -24px;
}
section#top p a {
  display: block;
  background: url("../images/btn_arrow_bg.png") no-repeat center center;
  width: 48px;
  height: 48px;
}
section#top p img.arrow {
  position: absolute;
  width: 27px;
  height: 12px;
  left: 50%;
  top: 50%;
  margin-left: -14px;
  margin-top: -3px;
}

/*-------------------------------------------
	#main
	-----------------------------------------*/
section#main {
  width: 100%;
  position: relative;
}
section#main div.bg {
  position: relative;
  width: 100%;
  height: 700px;
  overflow: hidden;
}
section#main #bg1 {
  background: url("../images/bg_history1.jpg") no-repeat 0 0 fixed;
}
section#main #bg2 {
  background: url("../images/bg_history2.jpg") no-repeat 0 0 fixed;
}
section#main #bg3 {
  background: url("../images/bg_history3.jpg") no-repeat 0 0 fixed;
}
section#main #bg4 {
  background: url("../images/bg_history4.jpg") no-repeat 0 0 fixed;
}

/*-------------------------------------------
	#history title
	-----------------------------------------*/
section#main #historyTitle {
	width: 100%;
	height: 700px;
	position: absolute;
	top: 0;
	left: 0;
}

section#main #historyTitle .logo_tl {
  width: 188px;
  height: 188px;
  position: absolute;
  top: 30px;
  left: 30px;
}
section#main #historyTitle .copyright{
	position: absolute;
	left: 20px;
	bottom: 15px;
}

/*-------------------------------------------
	#timeline
	-----------------------------------------*/
div#timeline {
  position: absolute;
  width: 720px;
  background: rgba(17, 5, 31, 0.7);
  right: 0;
  top: 0;
}
div#timeline .tl {
  width: 624px;
  position: relative;
  margin: 0 auto;
}
div#timeline .tl_box {
  width: 270px;
  margin-top: 195px;
  position: absolute;
  text-align: center;
}
div#timeline .tl_box p {
  margin-top: 10px;
  text-align: left;
}
div#timeline .boxRgt {
  right: 5px;
}
div#timeline .boxLft {
  left: 10px;
}
div#timeline .timeline1 {
  background: url("../images/bg_tl_1926.png") no-repeat 0 0;
  height: 410px;
  margin-top: 45px;
}
div#timeline .timeline2 {
  background: url("../images/bg_tl_1943.png") no-repeat 0 0;
  height: 363px;
}
div#timeline .timeline3 {
  background: url("../images/bg_tl_1949.png") no-repeat 0 0;
  height: 342px;
}
div#timeline .timeline4 {
  background: url("../images/bg_tl_1951.png") no-repeat 0 0;
  height: 316px;
}
div#timeline .timeline5 {
  background: url("../images/bg_tl_1957.png") no-repeat 0 0;
  height: 362px;
}
div#timeline .timeline6 {
  background: url("../images/bg_tl_1963.png") no-repeat 0 0;
  height: 344px;
}
div#timeline .timeline7 {
  background: url("../images/bg_tl_1993.png") no-repeat 0 0;
  height: 338px;
}
div#timeline .timeline8 {
  background: url("../images/bg_tl_2001.png") no-repeat 0 0;
  height: 366px;
}
div#timeline .timeline9 {
  background: url("../images/bg_tl_2010.png") no-repeat 0 0;
  height: 335px;
}
div#timeline .timeline10 {
  background: url("../images/bg_tl_2015.png") no-repeat 0 0;
  /* height: 558px; */
  height: 378px;
}
div#timeline .timeline11 {
  background: url("../images/bg_tl_2016.png") no-repeat 0 0;
  height: 425px;
}
div#timeline .timeline12 {
  background: url("../images/bg_tl_2017.png") no-repeat 0 0;
  height: 385px;
}
div#timeline .timeline13 {
  background: url("../images/bg_tl_2018.png") no-repeat 0 0;
  height: 363px;
}
div#timeline .timeline14 {
  background: url("../images/bg_tl_2020.png") no-repeat 0 0;
  height: 400px;
}
div#timeline .timeline15 {
  background: url("../images/bg_tl_2024.png") no-repeat 0 0;
  height: 400px;
}
div#timeline .timeline16 {
  background: url("../images/bg_tl_2025.png") no-repeat 0 0;
  height: 350px;
}
div#timeline .timeline17 {
  background: url("../images/bg_tl_2026.png") no-repeat 0 0;
  height: 350px;
}

div#timeline .pagetop{
	display: block;
	width: 280px;
	height: 77px;
	background: url("../images/btn_pagetop.png") no-repeat 0 0;
	text-indent: -9999px;
	margin: 50px auto 60px ;

}